Skip to main content

Radio Group

The Radio Group component allows the user to select one option from a set. It is used independently or as a form component within a Form Block.

Properties

NameTypeDefaultDescription
namestringSpecifies the name of the component (form component only).
valueanySpecifies the value of the component.
labelnodeSpecifies a label for the component.
radioItemscomponentDefines a list of radio items within the radio group.

Style Attributes

NameTypeDefaultDescription
rowboolfalseIf true, aligns the radio items in a row along the horizontal axis. By default, the radio items align in a column along the vertical axis.

Subcomponents

The Radio Group component has one subcomponent, a Radio component, used to create a list of Radio Items.

Radio

A Radio button is a component that acts as a single input control and is part of a set within a Radio Group. It has two states, On and Off.

For further details, see the Radio component.

Properties

NameTypeDefaultDescription
labelnodeSpecifies a label for the component.
valueanySpecifies the value of the component.
disabledboolfalseIf true, the radio button is disabled.
requiredboolfalseIf true, the radio button must be checked.
readOnlyboolfalseIf true, the radio button is read only.
autofocusboolfalseIf true, autofocus is enabled.
loopDataarrayDefines an array of data in the format id, prop1, prop2, prop3. The id must be is small letters.
itemNamestringDefines a unique identifier that allows access the array element's properties.
colordefault
primary
secondary
error
info
success
warning
string
primaryDefines the color of the component.
sizesmall
medium
string
mediumDefines the size of the component.
labelPlacementtop
bottom
start
end
string
endSpecifies the location of the component label.
disableRippleboolfalseIf true, disables the ripple effect on the radio button.

For more detail on the Radio Group component, see the MUI developer docs.