Carousel
Kontrollü seçim ve erişilebilir slayt navigasyonu sunan içerik galerisi.
Carousel.tsx
Adım 1
Tasarla
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/carousel.jsonKullanım Örneği
import { Carousel } from "@/components/ui"
<Carousel items={slides} ariaLabel="Ürün görselleri" onIndexChange={setIndex} />Özellikler & Parametreler (API)
| Prop | Tür | Varsayılan | Açıklama |
|---|---|---|---|
| items | ReactNode[] | — | Gösterilecek slaytlar. |
| index | number | — | Kontrollü aktif slayt indeksi. |
| defaultIndex | number | 0 | Kontrolsüz başlangıç indeksi. |
| onIndexChange | (index: number) => void | — | Aktif slayt değiştiğinde çağrılır. |
| ariaLabel | string | "İçerik galerisi" | Carousel bölgesinin erişilebilir adı. |