useCheckboxGroupState

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

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

API#


useCheckboxGroupState( (props: CheckboxGroupProps )): CheckboxGroupState

Interface#


Properties

NameTypeDescription
valuereadonly string[]Current selected values.
isDisabledbooleanWhether the checkbox group is disabled.
isReadOnlybooleanWhether the checkbox group is read only.
isInvalidbooleanWhether the checkbox group is invalid.
isRequiredboolean

Whether the checkboxes in the group are required. This changes to false once at least one item is selected.

realtimeValidationValidationResultRealtime validation results, updated as the user edits the value.
displayValidationValidationResultCurrently displayed validation results, updated when the user commits their changes.

Methods

MethodDescription
isSelected( (value: string )): booleanReturns whether the given value is selected.
setValue( (value: string[] )): voidSets the selected values.
addValue( (value: string )): voidAdds a value to the set of selected values.
removeValue( (value: string )): voidRemoves a value from the set of selected values.
toggleValue( (value: string )): voidToggles a value in the set of selected values.
setInvalid( (value: string, , validation: ValidationResult )): voidSets whether one of the checkboxes is invalid.
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.