Slider

Slider handles horizontal and vertical range input, inset icons, value indicators, and directional layouts with keyboard-friendly behavior.

2

Value: 2

Props

Name	Description	Default	Control
`vertical`Optional	Whether the slider is vertical. `boolean \| undefined`	`false`
`direction`Optional	The direction of the slider. `ltrrtl`	`"ltr"`	ltrrtl
`min`Required	The minimum value of the slider. `number`	-
`max`Required	The maximum value of the slider. `number`	-
`step`Required	The step value of the slider. `number`	-
`wheelStep`Optional	The amount the value changes when using the mouse wheel. `number \| undefined`	-	-
`lowerLimit`Optional	The lower limit for the slider value. `number \| undefined`	-	-
`upperLimit`Optional	The upper limit for the slider value. `number \| undefined`	-	-
`size`Optional	The size of the slider. `extra-smallsmallmediumlargeextra-large`	`"medium"`	extra-smallsmallmediumlargeextra-large
`startIcon`Optional	Name of the inset icon shown at the start side of the track. `string \| undefined`	-
`endIcon`Optional	Name of the inset icon shown at the end side of the track. `string \| undefined`	-
`disabled`Optional	- `boolean \| undefined`	`false`
`valueIndicator`Optional	- `boolean \| undefined`	`true`
`valueIndicatorPlacement`Optional	- `topbottomstartend`	-	topbottomstartend
`formatter`Optional	- `{ valueToText: (value: number) => string; textToValue: (text?: string \| undefined) => number \| undefined; } \| undefined`	-	-
`stopIndicators`Optional	- `number[] \| undefined`	-	-
`value`Required	- `number`	-

Events

Name	Type	Description
`update:value`	`[value: number]`	-

Slots

No slots documented.

Default

2

Value: 2

Directions

ltr

2

rtl

2

Vertical

ltr

2

rtl

2

Sizes

extra-small

2

small

2

medium

2

large

2

extra-large

2

Value Indicator Placements

top

2

bottom

2

start

2

end

2

Inset Icons

48

Disabled

2