Forms

RadioGroup

No consumers

Choose exactly one option from a set that is worth showing in full.

Importimport { RadioGroup } from "@/components/ui/RadioGroup";
Sourcesrc/components/ui/RadioGroup

One choice from a set small enough to show in full — three or four options. Beyond that, a Select costs less vertical space and reads more easily.

Default

The group owns the value; each item declares the value it selects. Items take disabled individually.

Props

RadioGroup

PropTypeDefaultDescription
valuestring | nullRequired. The selected value, or null for none.
onValueChange(value: string) => voidCalled with the chosen item's value.

RadioGroupItem

PropTypeDefaultDescription
valuestringRequired. The value this item selects.
disabledbooleanRenders the item unselectable.