Skip to content

Radio

Provides single user input from a selection of options.

Default Radio Example

RadioGroup Props

{componentName} props
Name
Type
Description
labelstringaria-labelledby for the RadioGroup.
namestring (optional)Explicitly set the name of the input.
valuestring | nullCurrently selected value.
onChange(value: string | null) => voidCalled when an option is selected.
requiredbooleanMakes the input required.
disabledbooleanDisables all options.

RadioGroup.Item Props

{componentName} props
Name
Type
Description
valuestringValue of the item.
labelbooleanWhether the children components should be a label or span
disabledbooleanDisables the item.

Default

Default Radio Example
Code Editor

Disabled

Disabled Radio Example
Code Editor

Required

Required Radio Example

Code Editor

Headless

Use the `RadioGroup` component without `RadioGroup.Item`.

Code Editor

Standalone Radio

Standalone unlabelled radio input for use in custom UI.

  • Option 1
    • Code Editor