RadioGroup

Displays a radio group.

Examples

Cirurgia Geral

Pediatria

Ginecologia e Obstetrícia

Cirurgia Geral

Pediatria

Ginecologia e Obstetrícia

Contains all the parts of a radio group.

Property	Type	Default	Description
asChild	boolean	false	Change the default rendered element for the one passed as a child, merging their props and behavior.
defaultValue	string	-	The value of the radio item that should be checked when initially rendered. Use when you do not need to control the state of the radio items.
value	string	-	The controlled value of the radio item to check. Should be used in conjunction with onValueChange.
onValueChange	(open: string) => void	-	Event handler called when the value changes.
disabled	boolean	-	When true, prevents the user from interacting with radio items.
name	string	-	The name of the group. Submitted with its owning form as part of a name/value pair.
required	boolean	-	When true, indicates that the user must check a radio item before the owning form can be submitted.
orientation	”horizontal” \| “vertical” \| undefined	undefined	The orientation of the component.
dir	”ltr” \| “rtl”	-	The reading direction of the radio group. If omitted, inherits globally from DirectionProvider or assumes LTR (left-to-right) reading mode.
loop	boolean	true	When true, keyboard navigation will loop from last item to first, and vice versa.

Data attribute	Values
[data-disabled]	Present when disabled

An item in the group that can be checked. An input will also render when used within a form to ensure events propagate correctly.

Property	Type	Default	Description
asChild	boolean	false	Change the default rendered element for the one passed as a child, merging their props and behavior.
value	string	-	The value given as data when submitted with a name.
disabled	boolean	-	When true, prevents the user from interacting with radio items.
required	boolean	-	When true, indicates that the user must check a radio item before the owning form can be submitted.
variant	”regular"	"regular”	The visual style of the radio item.
size	”sm” \| “md” \| “lg"	"md”	The size of the radio item.

Data attribute	Values
[data-state]	“checked” \| “unchecked”
[data-disabled]	Present when disabled