index.tsx 662 B

12345678910111213141516171819202122232425262728
  1. import ReactSlider from 'react-slider'
  2. import cn from 'classnames'
  3. import './style.css'
  4. type ISliderProps = {
  5. className?: string
  6. value: number
  7. max?: number
  8. min?: number
  9. step?: number
  10. disabled?: boolean
  11. onChange: (value: number) => void
  12. }
  13. const Slider: React.FC<ISliderProps> = ({ className, max, min, step, value, disabled, onChange }) => {
  14. return <ReactSlider
  15. disabled={disabled}
  16. value={isNaN(value) ? 0 : value}
  17. min={min || 0}
  18. max={max || 100}
  19. step={step || 1}
  20. className={cn(className, 'slider')}
  21. thumbClassName="slider-thumb"
  22. trackClassName="slider-track"
  23. onChange={onChange}
  24. />
  25. }
  26. export default Slider