Slider
Numeric range input with thumb control.
Generado a partir del código fuente público del paquete.
API
Rangecomponente
@solidiom/slider — Headless slider primitive. Parts: Root, Track, Range, Thumb. Supports multiple thumbs, keyboard/pointer interaction, horizontal/vertical orientation.
Range(props: SliderRangeProps): Element
Propiedades
index?number— Index of thumb this range represents (for multi-thumb). Defaults to 0.
Rootcomponente
@solidiom/slider — Headless slider primitive. Parts: Root, Track, Range, Thumb. Supports multiple thumbs, keyboard/pointer interaction, horizontal/vertical orientation.
Root(props: SliderRootProps): Element
Propiedades
class?string— CSS class.defaultValue?number[]— Default value(s) for uncontrolled mode.disabled?boolean— Whether the slider is disabled.max?number— Maximum value. Defaults to 100.min?number— Minimum value. Defaults to 0.onValueChange?(values: number[]) => void— Callback when any thumb value changes.orientation?SliderOrientation— Orientation. Defaults to "horizontal".step?number— Step increment. Defaults to 1.value?Accessor<number[] | undefined>— Controlled value(s). Single number or array for multiple thumbs.
hijos: Element
SliderContextValueinterfaz
Context shape shared among all slider parts.
Propiedades
disabledAccessor<boolean>— Whether the slider is disabled.getPercentage(value: number) => number— Get the percentage position for a given value.maxnumber— Maximum allowed value.minnumber— Minimum allowed value.orientationSliderOrientation— Slider orientation.requestValueChange(index: number, next: number, reason: "drag" | "keyboard") => void— Request value change for a thumb at the given index.setTrackRef(el: HTMLElement | undefined) => void— Set the track element reference.stepnumber— Step increment.trackRefAccessor<HTMLElement | undefined>— Reference to the track element for pointer calculations.valuesAccessor<number[]>— Array of current thumb values.
SliderOrientationtipo
Orientation of the slider.
SliderRangePropsinterfaz
Props for the Slider Range (fill) component.
Propiedades
index?number— Index of thumb this range represents (for multi-thumb). Defaults to 0.
SliderRootPropsinterfaz
Props for the Slider Root component.
Propiedades
class?string— CSS class.defaultValue?number[]— Default value(s) for uncontrolled mode.disabled?boolean— Whether the slider is disabled.max?number— Maximum value. Defaults to 100.min?number— Minimum value. Defaults to 0.onValueChange?(values: number[]) => void— Callback when any thumb value changes.orientation?SliderOrientation— Orientation. Defaults to "horizontal".step?number— Step increment. Defaults to 1.value?Accessor<number[] | undefined>— Controlled value(s). Single number or array for multiple thumbs.
hijos: Element
SliderThumbPropsinterfaz
Props for the Slider Thumb component.
Propiedades
aria-label?string— Optional aria-label for the thumb.index?number— Index of this thumb (for multiple thumbs). Defaults to 0.
hijos: Element
SliderTrackPropsinterfaz
Props for the Slider Track component.
Propiedades
onPointerDown?(event: PointerEvent) => void— Optional pointer-down handler from consumer.
hijos: Element
Thumbcomponente
@solidiom/slider — Headless slider primitive. Parts: Root, Track, Range, Thumb. Supports multiple thumbs, keyboard/pointer interaction, horizontal/vertical orientation.
Thumb(props: SliderThumbProps): Element
Propiedades
aria-label?string— Optional aria-label for the thumb.index?number— Index of this thumb (for multiple thumbs). Defaults to 0.
hijos: Element
Trackcomponente
@solidiom/slider — Headless slider primitive. Parts: Root, Track, Range, Thumb. Supports multiple thumbs, keyboard/pointer interaction, horizontal/vertical orientation.
Track(props: SliderTrackProps): Element
Propiedades
onPointerDown?(event: PointerEvent) => void— Optional pointer-down handler from consumer.
hijos: Element
useSliderContextcontexto
useSliderContext(): SliderContextValue