BenixBenix DSv1.1.0

Slider

Range slider with customizable min/max/step. Single-value, controlled.

Examples

Basic

const [vol, setVol] = useState(50);
<Slider value={vol} onValueChange={setVol} min={0} max={100} step={1} />

API Reference

Props of the Slider component.

PropTypeDefaultDescription
value*number
min*number
max*number
stepnumber1
onChange(e: React.ChangeEvent<HTMLInputElement>) => void
onValueChange(value: number) => void
disabledbooleanfalse
trackColorstringOverride track color.
progressColorstringOverride progress color.