Slider
Allow users to select a value from a range with rothko ui's Slider component. Customize styles, ranges, and behaviors to create interactive and visually appealing sliders, perfect for adjusting settings, filters, and other numerical input scenarios.
Usage
Disabled
With Kind
primary
secondary
success
danger
warning
info
Props
| Name | Type | Default | Description |
|---|---|---|---|
Name children | Type ReactElement<SliderHandleProps>; | Default | Description Slider handle |
Name className | Type string | Default | Description CSS class name(s) |
Name disabled | Type boolean | Default | Description Specifies whether the slider is disabled |
Name kind | Type 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | Default | Description The semantic style of the slider |
Name max | Type number | Default | Description Maximum value of the slider |
Name min | Type number | Default 0 | Description Minimum value of the slider |
Name onChange | Type (v: number) => void | Default | Description Callback function triggered when the value of the slider changes |
Name style | Type CSSProperties | Default | Description The inline style for the slider |
Name value | Type number | undefined | null | Default | Description Current value of the slider |