Slider
The props declared for Slider, generated from the types @proyecto-viviana/ui ships.
Import
import { Slider } from "@proyecto-viviana/ui";Props
| Prop | Type | Default | Description |
|---|---|---|---|
size | 'S' | 'M' | 'L' | 'XL' | 'sm' | 'md' | 'lg' | — | Not yet documented |
variant | 'default' | 'accent' | — | Legacy alias. Prefer S2 `isEmphasized`. |
isEmphasized | false | true | — | Not yet documented |
trackStyle | 'thin' | 'thick' | — | Not yet documented |
thumbStyle | 'default' | 'precise' | — | Not yet documented |
fillOffset | number | — | Not yet documented |
class | string | — | Not yet documented |
label | number | boolean | RenderedElement | ArrayElement | (string & {}) | Node | JSX.ArrayElement | — | Not yet documented |
contextualHelp | number | boolean | RenderedElement | ArrayElement | (string & {}) | Node | JSX.ArrayElement | — | Not yet documented |
showOutput | false | true | — | Not yet documented |
showMinMax | false | true | — | Not yet documented |
labelPosition | 'top' | 'side' | — | Not yet documented |
labelAlign | 'start' | 'end' | — | Not yet documented |
styles | StyleString | — | Not yet documented |
UNSAFE_className | string | — | Not yet documented |
UNSAFE_style | JSX.CSSProperties | — | Not yet documented |
slot | string | — | Not yet documented |
ref | HTMLDivElement | ((el: HTMLDivElement) => void) | { current?: HTMLDivElement | null | undefined; } | — | Not yet documented |
id | string | — | An ID for the slider. solidaria |
onChange | (value: number) => void | — | Handler called when the value changes. solidaria-components |
aria-describedby | string | — | The ID of an element that describes the slider. solidaria |
aria-details | string | — | The ID of an element that provides details for the slider. solidaria |
aria-label | string | — | An accessible label for the slider when no visible label is provided. solidaria |
aria-labelledby | string | — | The ID of an element that labels the slider. solidaria |
isDisabled | false | true | — | Whether the slider is disabled. solidaria |
form | string | — | The form element this input belongs to. solidaria |
name | string | — | The name for the form input. solidaria |
value | number | — | The current value (controlled). solidaria-components |
step | number | — | The step value. solidaria-components |
orientation | 'horizontal' | 'vertical' | — | The orientation of the slider. solidaria-components |
locale | string | — | The locale for number formatting. solidaria-components |
defaultValue | number | — | The default value (uncontrolled). solidaria-components |
minValue | number | — | The minimum value. solidaria-components |
maxValue | number | — | The maximum value. solidaria-components |
onChangeEnd | (value: number) => void | — | Handler called when dragging ends. solidaria-components |
formatOptions | Intl.NumberFormatOptions | — | Number format options. solidaria-components |
Declared in packages/viviana-ui/src/slider/index.tsx.
Props marked solidaria or solidaria-components come from the headless layer underneath and behave the same in both registers. Components that wrap a DOM element also accept that element's standard attributes, which are left out here on purpose — listing them would bury the props that are actually ours.