useRadioGroupState

Provides state management for a radio group component. Provides a name for the group, and manages selection and focus state.

install	`yarn add @react-stately/radio`
version	3.0.0
usage	`import {useRadioGroupState} from '@react-stately/radio'`

API#

useRadioGroupState(
  (props: RadioGroupProps
)): RadioGroupState

Name	Type	Description
`name`	`string`	The name for the group, used for native form submission.
`selectedValue`	`string \| null`	The currently selected value.
`lastFocusedValue`	`string \| null`	The value of the last focused radio.

Method	Description
`setSelectedValue( (value: string )): void`	Sets the selected value.
`setLastFocusedValue( (value: string )): void`	Sets the last focused value.

See the docs for useRadioGroup in react-aria for an example of useRadioGroupState.

Name	Type	Default	Description
`orientation`	`Orientation`	`'vertical'`	The axis the Radio Button(s) should align with.
`name`	`string`	—	The name of the RadioGroup, used when submitting an HTML form. See MDN.
`value`	`string`	—	The current value (controlled).
`defaultValue`	`string`	—	The default value (uncontrolled).
`onChange`	`( (value: string )) => void`	—	Handler that is called when the value changes.
`isDisabled`	`boolean`	—	Whether the input is disabled.
`isReadOnly`	`boolean`	—	Whether the input can be selected but not changed by the user.
`validationState`	`ValidationState`	—	Whether the input should display its "valid" or "invalid" visual styling.
`isRequired`	`boolean`	—	Whether user input is required on the input before form submission. Often paired with the `necessityIndicator` prop to add a visual indicator to the input.
`label`	`ReactNode`	—	The content to display as the label.

'horizontal' | 'vertical'

'valid' | 'invalid'

Name	Type	Description
`name`	`string`	The name for the group, used for native form submission.
`selectedValue`	`string \| null`	The currently selected value.
`lastFocusedValue`	`string \| null`	The value of the last focused radio.

Method	Description
`setSelectedValue( (value: string )): void`	Sets the selected value.
`setLastFocusedValue( (value: string )): void`	Sets the last focused value.