Command Menu

Search documentation, components, and switch theme.

Atoms

Scroll Area

Custom scrollbar component built on Radix UI.

shadcn/ui
Docs

Installation#

npx shadcn@latest add @formance/scroll-area

Install the following dependencies:

npm install radix-ui

Copy and paste the following code into your project.

Update the import paths to match your project setup.

Usage#

import { ScrollArea } from '@/components/ui/scroll-area'
<ScrollArea className="h-48 w-full rounded-md border">
  <div className="p-4">
    {items.map((item) => (
      <div key={item} className="py-2 text-sm">{item}</div>
    ))}
  </div>
</ScrollArea>

Examples#

Horizontal#