Dokümanlar/Forms

Radio Group

Satır ve kart görünümlü tek seçim seçenekleri.

Radio.tsx

Kart Seçim Izgarası (Card Mode)

Izgara Düzeni

Popüler

Görsel kartlar ve esnek önizleme düzeni

Liste Düzeni

Kompakt satır satır veri yoğun görünüm

Satır İçi Liste (Default Mode & Sage Rengi)

Standart Dağıtım (3-5 gün)

Hızlı Yayınlama (Aynı gün)

Özel Zamanlanmış Dağıtım

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/radio-group.json

Kullanım Örneği

import { RadioGroup } from "@/components/ui/Radio"

<RadioGroup label="Plan" options={plans} selectedValue={plan} onChange={setPlan} variant="card" />

Özellikler & Parametreler (API)

Prop	Tür	Varsayılan	Açıklama
name	string	—	Native radio grup adı.
options	RadioOption[]	—	Değer, etiket ve açıklama içeren seçenekler.
selectedValue	string	—	Kontrollü seçili değer.
onChange	(value: string) => void	—	Seçim callback'i.
variant	"default" \| "card"	"default"	Satır içi veya kart düzeni.
columns	1 \| 2 \| 3 \| 4	1	Responsive sütun sayısı.
error	string	—	Grup hata mesajı.