Element: #045 Range (inputs/slider)
What it shows: Two-thumb range slider from 0 to 100 with the selected price range printed beside it.
When to use: Filtering by a numeric range such as price.
Spec:
- ``
- `range` is `$state<[number, number]>([20, 75])`
- Row shows a Price label and the value `${range[0]} – ${range[1]}`
- Wrapper `.row` uses `max-width: 480px`
Tags: slider, range, two-thumb, price, filter
Needs: @codeatlasdev/ui@4.4.0
Components: Slider
Live demo: https://ui.codeatlas.com.br/docs/inputs/slider#range
Price
${range[0]} – ${range[1]}