006
Radio
FormSelected: dark
Customize
Layout
Disabled
Code
<RadioGroup aria-label="Mood" defaultValue="dark" > <Radio value="dark">Dark</Radio> <Radio value="light">Light</Radio> <Radio value="auto">Auto</Radio> </RadioGroup>
Install
npx shadcn@latest add https://components.haedong.dev/r/radio.json
Props
RadioGroup props below; Radio takes value, children (label text), disabled and the remaining native input props. Label the group with aria-label or aria-labelledby.
| Prop | Type | Description |
|---|---|---|
| value / defaultValue | string | Selected value (controlled / uncontrolled). |
| onValueChange | (value: string) => void | Called when a different option is picked. |
| orientation | "horizontal" | "vertical" | Items flow inline or stack. Defaults to "horizontal". |
| name | string | Shared name of the native radios (form submission). Generated when omitted. |
| disabled | boolean | Disables every option; a single Radio can also be disabled on its own. |