YuhuanStudioYunUIDocs
Forms & Inputs

Radio Group

Radix RadioGroup — a single-choice set of radio items.

A Radix-backed single-choice set. Controlled via value/onValueChange (or uncontrolled via defaultValue). Arrow keys move and select within the group, and the whole group is a single tab stop. Each item renders a ring that fills with the primary accent and a center dot when selected — matching YunUI's Checkbox/Switch visual language.

Import

import { RadioGroup, RadioGroupItem } from "@yuhuanowo/yunui";

Basic

Single choice

Disabled

Disabled option

Props

RadioGroup and RadioGroupItem wrap Radix's RadioGroup primitives and accept all of their props. The most common ones:

PropTypeDefaultDescription
value / defaultValuestringControlled / uncontrolled selected value.
onValueChange(value: string) => voidFires when the selection changes.
disabledbooleanDisable the whole group (or a single item).
namestringForm field name submitted with the value.
RadioGroupItem.value*stringThe value this item selects.
RadioGroupItem.idstringPair with a <label htmlFor> for an accessible label.

On this page