forked fromalexsyo/react-circular-slider-bar
- Notifications
You must be signed in to change notification settings - Fork0
Circular slider component for React
License
NotificationsYou must be signed in to change notification settings
Evercoder/react-circular-slider-bar
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Enjoy a circular slider bar component for React with no unnecessary dependencies
Key Features:
- Simple to use
- Highly customizable
- No extra dependencies
- Style based: no images / SVGs
Check thedemo!
install
npm install --save-dev react-circular-slider-barusage example
import React from 'react';import CircularSlider from 'react-circular-slider-bar';const myApp = () => ( <div> ...my awesome stuff... <CircularSlider r={50} trackWidth={10} thumbWidth={10} onChange={value => console.log(value)} /> </div>);export default myApp;controlled component
<CircularSlider value={this.state.value} onChange={value => this.setState({ value })}/>| prop | type | deafult |
|---|---|---|
| r | number | 80 |
| initialAngle | number | 90 |
| value | number | undefined |
| trackWidth | number | 2 |
| trackColor | string | #f5f5dc |
| arcColor | string | #7985f1 |
| thumbWidth | number | 10 |
| thumbColor | string | white |
| thumbBorderWidth | number | 2 |
| thumbBorderColor | string | #cccccc |
| onChange | func | value => {} |
About
Circular slider component for React
Resources
License
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Packages0
No packages published
Languages
- JavaScript100.0%