Radio

Radio group displays a set of options and allows user to select only one.

#

#

#

RadioGroup automatically positions radios horizontally, if there are no more than 3 radios and none of them have descriptions.

#

#

#

#

NameDefaultDescription
isDisabledfalseboolean

Determines if all radios are disabled.

children

ReactNode

Radio inputs.

orientation"horizontal""horizontal" | "vertical"

Orientation.

value

T

Selected radio value.

onChange

(value: T) => void

Callback for when user selects a different radio option.

#

NameDefaultDescription
isDisabled

boolean

Determines if radio is disabled.

label

string

Label to show near the radio.

badge

ReactNode

Badge to display near the label.

description

ReactNode

Description to show below the label.

value

T

Radio value.

On this page

  • Example
  • Usage
  • Compact group
  • Large group
  • With badges
  • Props
  • RadioGroup
  • Radio