Radio

Provides single user input from a selection of options.

General

The basic Radio usage.

Group

A group of radio components.

Type

Differentiate states by color.

Description

Description can be combined with other components.

Disabled

Disable all radios.

Row

Horizontal arrangement.

Pick a plan

Describe each option under its name, and let the button repeat the choice.

APIs

Radio.Props

AttributeDescriptionTypeAccepted valuesDefault
checkedselected or not (in single)boolean-false
valueunique ident value (in group)string--
idnative attrstring--
disableddisable current radioboolean-false
typecurrent typeRadioTypesRadioTypesdefault
onChangechange event(e: RadioEvent) => void--
refforwardRefRef<HTMLInputElement | null>--
...native propsInputHTMLAttributes'id', 'className', ...-

Radio.Group.Props

AttributeDescriptionTypeAccepted valuesDefault
initialValueinitial valuestring--
valueselected child radiostring--
useRowhorizontal layoutboolean-false
disableddisable all radiosboolean-false
onChangechange event(value: string) => void--
...native propsHTMLAttributes'id', 'className', ...-

Radio.Description.Props[alias: Radio.Desc]

AttributeDescriptionTypeAccepted valuesDefault
...native propsHTMLAttributes'id', 'className', ...-

RadioTypes

type RadioTypes =
  | 'default'
  | 'primary'
  | 'secondary'
  | 'success'
  | 'warning'
  | 'error'
  | 'info'
Edit this page on GitHub