useRadioGroupState

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

installyarn add react-stately
version3.30.1
usageimport {useRadioGroupState} from 'react-stately'

API#


useRadioGroupState( (props: RadioGroupProps )): RadioGroupState

Interface#


Properties

NameTypeDescription
isDisabledbooleanWhether the radio group is disabled.
isReadOnlybooleanWhether the radio group is read only.
isRequiredbooleanWhether the radio group is required.
isInvalidbooleanWhether the radio group is invalid.
selectedValuestringnullThe currently selected value.
lastFocusedValuestringnullThe value of the last focused radio.
realtimeValidationValidationResultRealtime validation results, updated as the user edits the value.
displayValidationValidationResultCurrently displayed validation results, updated when the user commits their changes.

Methods

MethodDescription
setSelectedValue( (value: stringnull )): voidSets the selected value.
setLastFocusedValue( (value: stringnull )): voidSets the last focused value.
updateValidation( (result: ValidationResult )): voidUpdates the current validation result. Not displayed to the user until commitValidation is called.
resetValidation(): voidResets the displayed validation state to valid when the user resets the form.
commitValidation(): voidCommits the realtime validation so it is displayed to the user.

Example#


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