RadioGroup

Rol ve anlam

RadioGroup, Base UI RadioGroup ile role="radiogroup" taşıyan bir <fieldset> çizer; grup <legend> ile adlandırılır. Her Radio role="radio" ve aria-checked taşır. Yardım metni ve hata gruba aria-describedby ile bağlanır.

Klavye

Tuş	Davranış
Tab	Gruba girer; seçili öğeye, seçim yoksa ilk öğeye odaklanır. Sonraki Tab gruptan çıkar.
Ok tuşları	Odağı sonraki ya da önceki öğeye taşır ve onu seçer.
Space	Odaktaki öğeyi seçer.

Odak

Odaktaki daire 2 px color-focus-ring halkasını 2 px dışında gösterir (focus-visible). Grubun kendisi odak almaz.

Ekran okuyucu

Örnek	Okunan
Gruba girerken	“Grup etiketi, radyo grubu”, yardım metni, ardından “Birinci seçenek, radyo düğmesi, seçili, 1/3”
Zorunlu ve hatalı	Ad “zorunlu” ile biter; hata metni yardım metninden sonra okunur

Kontrast

Seçili olmayan dairenin color-border-strong kenarlığı zeminde en az 3:1 kontrast taşır. Hata yalnızca renkle değil, metinle de bildirilir.

WCAG 2.2

Ölçüt	RadioGroup nasıl karşılar	Ürün ekibi ne yapmalı
1.3.1 Bilgi ve ilişkiler	<fieldset>, <legend> ve role="radiogroup".	Her gruba başlık verin.
1.4.11 Metin dışı kontrast	Kenarlık ve nokta 3:1.	Kenarlığı className ile inceltmeyin.
2.1.1 Klavye	Ok tuşları ve Space.	Öğeleri tek bir grupta tutun.
3.3.1 Hata belirleme	Metinli hata ve grupta aria-invalid.	Hata metninde ne yapılacağını söyleyin.
4.1.2 Ad, rol, değer	role="radio" ve aria-checked.	Her öğeye görünür etiket verin.