Components
Slider
A range input with a visible fill. It is the native `<input type="range">`, so keyboard, forms and screen readers work as usual.
Client componentUses state or handlers, so it starts with "use client".
import { Slider, sliderVariants } from "@glob-ui/slider"Preview
Currently 40
Examples
Steps
step sets the increments. Arrow keys move one step; PageUp and PageDown move ten.
In steps of 10
Disabled
disabled removes the slider from the tab order and dims it.
API
Props are generated from the TypeScript types in the package source.
SliderProps
Prop
Type
Accessibility
| Key or action | Behaviour |
|---|---|
| Left, Right, Down, Up | Change the value by one step. |
| Home, End | Go to min and max. |
| PageUp, PageDown | Change the value by a larger amount. |
ARIA. Name the slider with a Label or Field (the Field wires the label and description). Two-thumb ranges are not part of this package yet.