Scroll Area
Klavye odağı ve erişilebilir bölge etiketi sunan kontrollü kaydırma alanı.
ScrollArea.tsx
Kurulum
shadcn CLI ile projenize ekleyebilir veya yukarıdaki "Kaynak Kodu" sekmesinden kodu doğrudan projenize kopyalayabilirsiniz:
$
npx shadcn@latest add https://ui.cagriozay.com.tr/r/scroll-area.jsonKullanım Örneği
import { ScrollArea } from "@/components/ui"
<ScrollArea ariaLabel="Sürüm notları" maxHeight={240}>
{notes.map((note) => <article key={note.id}>{note.title}</article>)}
</ScrollArea>Özellikler & Parametreler (API)
| Prop | Tür | Varsayılan | Açıklama |
|---|---|---|---|
| ariaLabel | string | — | Kaydırılabilir bölgenin zorunlu erişilebilir adı. |
| maxHeight | number | string | 320 | Dikey kaydırmanın başlayacağı azami yükseklik. |
| orientation | "vertical" | "horizontal" | "both" | "vertical" | Etkin kaydırma ekseni. |
| tabIndex | number | 0 | Bölgeyi klavye ile odaklanabilir yapar. |