Switch
Yükleme ve pasif durumları destekleyen ikili ayar kontrolü.
Switch.tsx
Anlık Dağıtım Bildirimleri
Yeni bir sürüm yayına alındığında web hook tetikleyicisi çalıştırır.
Karanlık Mod Senkronizasyonu
İki Aşamalı Güvenlik (2FA)
Her girişte tek kullanımlık kod ister.
Beta Özellikler (Kilitli)
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/switch.jsonKullanım Örneği
import { Switch } from "@/components/ui/Switch"
<Switch label="Bildirimler" description="E-posta bildirimlerini al" checked={enabled} onChange={setEnabled} />Özellikler & Parametreler (API)
| Prop | Tür | Varsayılan | Açıklama |
|---|---|---|---|
| checked | boolean | — | Kontrollü açık durum. |
| onChange | (checked: boolean) => void | — | Durum değişikliği callback'i. |
| label | ReactNode | — | Switch düğmesine bağlanan etiket. |
| description | ReactNode | — | Switch düğmesine bağlanan açıklama. |
| size | "sm" | "md" | "lg" | "md" | Kontrol ölçeği. |
| color | "primary" | "secondary" | "sage" | "success" | "primary" | Aktif renk. |
| loading | boolean | false | Yükleme göstergesi ve pasif durum. |
| card | boolean | false | Kart görünümü. |
| ariaLabel | string | — | Görsel etiket yokken erişilebilir ad. |