Legacy (shadcn-uikit)Components
Slider
A range input that lets users select a value by dragging a thumb along a track.
Usage
import { Slider } from '@acronis-platform/shadcn-uikit';<Slider defaultValue={50} max={100} step={1} />Overview
Built on Base UI's Slider primitive, this component supports single and range (multi-thumb) selection. Values can be provided as a single number or an array. The component normalizes inputs to arrays internally for consistent thumb rendering.
Range slider
Pass an array for multi-thumb range selection:
<Slider defaultValue={[25, 75]} max={100} step={1} />API Reference
The Slider extends all props from Base UI's Slider.Root, including:
| Prop | Type | Default | Description |
|---|---|---|---|
value | number | number[] | — | Controlled value. |
defaultValue | number | number[] | [0] | Initial value when uncontrolled. |
min | number | 0 | Minimum allowed value. |
max | number | 100 | Maximum allowed value. |
step | number | 1 | Step increment between values. |
disabled | boolean | false | Disables the slider. |
onValueChange | (value: number[]) => void | — | Callback when value changes. |
className | string | — | Additional CSS class names. |