index.tsx 585 B

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