Radio
A form control that allows users to select a single option from a group of mutually exclusive choices.
Installation
npx chilli@latest add radioDefault
Option 1
Option 2
Option 3
Sizes
States
With Text
Email notificationsReceive updates via email.
SMS notificationsReceive updates via text message.
No notificationsYou won't receive any notifications.
Horizontal
Daily
Weekly
Monthly
API Reference
Radio
| Prop | Type | Default | Description |
|---|---|---|---|
checked | boolean | false | Controlled checked state. |
value | string | — | The value of the radio when used inside a RadioGroup. |
label | string | — | The label text displayed next to the radio. |
description | string | — | Description text displayed below the label. |
size | "sm" | "md" | "md" | The size of the radio. |
disabled | boolean | false | Whether the radio is disabled. |
onCheckedChange | (checked: boolean) => void | — | Callback when the checked state changes. |
RadioGroup
| Prop | Type | Default | Description |
|---|---|---|---|
value | string | — | The currently selected value. |
onValueChange | (value: string) => void | — | Callback when the selected value changes. |
orientation | "vertical" | "horizontal" | "vertical" | Layout direction of the radio group. |