Range Slider

Accessibility

Import RangeSlider from @prepared911/ui/range-slider.

The root is a role="group" named by aria-labelledby, then aria-label, then the visible label. Each thumb is a role="slider" named by startLabel or endLabel, with aria-valuetext set to its own formatted value.
A thumb's aria-valuemin and aria-valuemax are its neighbor's value (plus the minimum gap), so the announced range narrows as the thumbs approach.
Both thumbs are tab stops. Keys match Slider: arrows, Shift with an arrow, PageUp, PageDown, Home and End; Home and End stop at the other thumb.
The value bubbles, marks and mark labels are aria-hidden. Only the bubble of the thumb in use opens.
A disabled range sets aria-disabled on both thumbs and leaves the tab order.
Forced colors, reduced motion, the quiet pointer focus and pointer target sizes match Slider.

Accessibility

Import RangeSlider from @prepared911/ui/range-slider.

The root is a role="group" named by aria-labelledby, then aria-label, then the visible label. Each thumb is a role="slider" named by startLabel or endLabel, with aria-valuetext set to its own formatted value.
A thumb's aria-valuemin and aria-valuemax are its neighbor's value (plus the minimum gap), so the announced range narrows as the thumbs approach.
Both thumbs are tab stops. Keys match Slider: arrows, Shift with an arrow, PageUp, PageDown, Home and End; Home and End stop at the other thumb.
The value bubbles, marks and mark labels are aria-hidden. Only the bubble of the thumb in use opens.
A disabled range sets aria-disabled on both thumbs and leaves the tab order.
Forced colors, reduced motion, the quiet pointer focus and pointer target sizes match Slider.