Brand Range
<brand-range> wraps Shoelace's <sl-range>. Great for volume, quality, and opacity sliders where a text field would be awkward.
Basic
Tooltip placement
States
Usage
import { BrandRange } from '@brandos/ui';
<brand-range label="Volume" min="0" max="100" value="50"></brand-range>
// JS
const el = document.querySelector('brand-range');
el.addEventListener('sl-change', () => console.log(el.value));