Scroll Area
Augments native scroll functionality for custom, cross-browser styling.
<Scroll.Area type="hover" class="scroll__area" slot="component">
<Scroll.Viewport class="scroll__viewport">
<div>
<div class="scroll__viewport-heading">Tags</div>
{#each Array(100) as _, i}
<div class="scroll__viewport-item">Item {i}</div>
{/each}
</div>
</Scroll.Viewport>
<Scroll.Bar class="scroll__bar">
<Scroll.Thumb class="scroll__thumb" />
</Scroll.Bar>
</Scroll.Area>
API Reference
Area
Prop | Type | Default |
---|---|---|
type |
ScrollType |
auto |
direction |
Direction |
ltr |
delay |
number |
500 |
Bar
Prop | Type | Default |
---|---|---|
orientation |
Orientation |
vertical |