ScrollArea
Components4.3.7
Description
ScrollArea is a component for customizing native scroll functionality. Scroll helps navigate through content inside a window/block vertically and/or horizontally.
Appearance
Component composition
- Container with content (
ScrollArea.Container). - Scroll indicator (
ScrollArea.Bar). - Slider (
ScrollArea.Bar.Slider).
Styles
| Element | Styles |
|---|---|
ScrollArea.Bar |
background: transparent |
ScrollArea.Bar.Slider |
background: var(--scroll-bar-background) |
Interaction
The scroll inside the block can be controlled by:
- mouse wheel;
- arrow keys while focusing on an element;
- touchpad gestures;
- elements of a scrollbar like sliders and buttons.