//
A customizable scrollbar indicator with hover expansion, size variants, and auto-hide support.
bun add xiod-ui1import { ScrollBar } from "xiod-ui/scroll-bar";1<ScrollBar>2</ScrollBar>| Prop | Type | Default | Description |
|---|---|---|---|
orientation | "horizontal"| "vertical"| undefined | vertical | Whether the scrollbar controls vertical or horizontal scroll. |
keepMounted | boolean| undefined | false | Whether to keep the HTML element in the DOM when the viewport isn't scrollable. |
className | string| ((state: ScrollAreaScrollbarState) => string| undefined)| undefined | - | CSS class applied to the element, or a function that returns a class based on the component's state. |
render | ReactElement<unknown, string| JSXElementConstructor<any>>| ComponentRenderFn<HTMLProps, ScrollAreaScrollbarState>| undefined | - | Allows you to replace the component's HTML element with a different tag, or compose it with another component. Accepts a `ReactElement` or a function that returns the element to render. |
style | CSSProperties| ((state: ScrollAreaScrollbarState) => CSSProperties| undefined)| undefined | - | Style applied to the element, or a function that returns a style object based on the component's state. |
size | "sm"| "lg"| "md"| null| undefined | sm | |
variant | "default"| "card"| null| undefined | default | |
visibility | "auto"| "always"| "hover"| null| undefined | auto |