Components
ScrollArea
A custom scrollable container for overflowing content.
Installation
npm install @mijn-ui/react-scroll-areaUsage
import { ScrollArea } from "@mijn-ui/react-scroll-area"<ScrollArea className="h-[200px] w-[350px] rounded-md border p-4">
Jokester began sneaking into the castle in the middle of the night and leaving
jokes all over the place: under the king's pillow, in his soup, even in the
royal toilet. The king was furious, but he couldn't seem to stop Jokester. And
then, one day, the people of the kingdom discovered that the jokes left by
Jokester were so funny that they couldn't help but laugh. And once they
started laughing, they couldn't stop.
</ScrollArea>Examples
Horizontal Scrolling
API Reference
Built on Radix UI — all underlying primitive props are forwarded in addition to the props below.
| Prop | Type | Default | Description |
|---|---|---|---|
unstyled | boolean | false | Opt out of the default styles to fully customize the component. |
classNames | object | — | Override classes per slot (see Style Slots below). |
className | string | — | Additional classes for the root element. |
ScrollArea Style Slots
| Slot Name | Targeted Component | Purpose |
|---|---|---|
base | ScrollArea | Styles the root scroll area component. |
viewport | ScrollArea | Styles the viewport of the scroll area. |
scrollbar | ScrollBar | Styles the scrollbar. |
scrollThumb | ScrollBar | Styles the thumb of the scrollbar. |