Slider API

API reference for the Slider components.

Slider.Root

Props

name

string

Form field name — triggers hidden inputs

namespace

string

Namespace for context provision

Default: "v0:slider:root"

id

string

Unique identifier (auto-generated if not provided)

Default: useId()

min

number

Minimum value (default: 0)

Default: 0

max

number

Maximum value (default: 100)

Default: 100

step

number

Step increment (default: 1)

Default: 1

disabled

MaybeRefOrGetter<boolean>

Disables the slider

Default: false

readonly

MaybeRefOrGetter<boolean>

Readonly — focusable but not editable

orientation

"horizontal" | "vertical"

Slider orientation

Default: "horizontal"

inverted

boolean

Flip the percent axis

Default: false

minStepsBetweenThumbs

number

Minimum steps between adjacent thumbs (default: 0)

Default: 0

crossover

boolean

Allow thumbs to pass through each other (default: false)

Default: false

form

string

Associate with form by ID

modelValue

number | number[]

Default: []

Events

update:model-value

[value: number | number[]]

start

[value: number | number[]]

end

[value: number | number[]]

Slots

default

SliderRootSlotProps

Slider.HiddenInput

Props

namespace

string

Namespace for context injection from parent Slider.Root

Default: "v0:slider:root"

index

number

Thumb index to read value from

Default: 0

Slider.Range

Props

namespace

string

Namespace for connecting to parent Slider.Root

Default: "v0:slider:root"

Slots

default

SliderRangeSlotProps

Slider.Thumb

Props

namespace

string

Namespace for connecting to parent Slider.Root

Default: "v0:slider:root"

ariaLabel

string

Accessible label for this thumb

ariaLabelledby

string

ID of element labelling this thumb

ariaValuetext

string

Custom aria-valuetext (for formatted display)

Slots

default

SliderThumbSlotProps

Slider.Track

Props

namespace

string

Namespace for connecting to parent Slider.Root

Default: "v0:slider:root"

Slots

default

SliderTrackSlotProps