Scroll Area
Data DisplayAugments native scroll functionality for custom, cross-browser styling.
Import
import { ScrollArea, ScrollBar } from "@/components/ui/scroll-area";Usage
Default
A vertical scroll area with items.
Horizontal
A horizontal scroll area.
API Reference
type"hover""auto" | "always" | "scroll" | "hover"Describes the nature of scrollbar visibility
scrollHideDelay600numberIf type is 'hover', this is the delay in ms before scrollbar is hidden
orientation"vertical""vertical" | "horizontal"The orientation of the scrollbar (on ScrollBar component)
| Prop | Type | Default | Description |
|---|---|---|---|
type | "auto" | "always" | "scroll" | "hover" | "hover" | Describes the nature of scrollbar visibility |
scrollHideDelay | number | 600 | If type is 'hover', this is the delay in ms before scrollbar is hidden |
orientation | "vertical" | "horizontal" | "vertical" | The orientation of the scrollbar (on ScrollBar component) |