useToggleState

Provides state management for toggle components like checkboxes and switches.

install	`yarn add @react-stately/toggle`
version	3.0.0-rc.2
usage	`import {useToggleState} from '@react-stately/toggle'`

API#

useToggleState(props: CheckboxBase): ToggleState

Name	Type	Description
`isSelected`	`boolean`	Whether the toggle is selected.
`setSelected`	`(isSelected: boolean) => void`	Updates selection state.

See the docs for useCheckbox in react-aria for an example of useToggleState.

Name	Type	Description
`children`	`ReactNode`	The content to render as the Checkbox's label.
`defaultSelected`	`boolean`	Whether the Checkbox should be selected (uncontrolled).
`isSelected`	`boolean`	Whether the Checkbox should be selected (controlled).
`onChange`	`(isSelected: boolean) => void`	Handler that is called when the Checkbox's selection state changes.
`value`	`string`	The value of the Checkbox input element.
`name`	`string`	The name of the Checkbox input element.
`isDisabled`	`boolean`	Whether the input is disabled.
`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.
`validationState`	`ValidationState`	Whether the input should display its "valid" or "invalid" visual styling.
`isReadOnly`	`boolean`	Whether the input can be selected but not changed by the user.
`autoFocus`	`boolean`	Whether the element should receive focus on render
`onFocus`	`(e: FocusEvent) => void`	Handler that is called when the element receives focus.
`onBlur`	`(e: FocusEvent) => void`	Handler that is called when the element loses focus.
`onFocusChange`	`(isFocused: boolean) => void`	Handler that is called when the element's focus status changes.
`onKeyDown`	`(e: KeyboardEvent) => void`	Handler that is called when a key is pressed.
`onKeyUp`	`(e: KeyboardEvent) => void`	Handler that is called when a key is released.

'valid' | 'invalid'

T & {stopPropagation: () => void,
continuePropagation: () => void
}