useCheckboxStore
Creates a checkbox store to conveniently manage a checkbox value, whether it's a string, number, boolean, or an array of strings or numbers.
Code examples
Optional Props
defaultValue
ToPrimitive<T> | undefined = false
The default
value
state of
the checkbox.
Live examples


Custom CheckboxRendering a visually hidden Checkbox using the VisuallyHidden component to show a custom checkbox presentation in React.


Checkbox groupRendering multiple Checkbox elements in React to form a group of checkboxes. The selected values are stored in an array provided by the CheckboxProvider component.
setValue
((value: ToPrimitive<T>) => void) | undefined
A callback that gets called when the
value
state
changes.
Code examples
function MyCheckbox({ value, onChange }) {
}
store
Store<Partial<S>> | undefined
Another store object that will be kept in sync with the original store.
Live examples
value
ToPrimitive<T>
The checked state of the checkbox.
Live examples
Return Props
setValue
SetState<ToPrimitive<T>>
Sets the value
state.
Code examples
store.setValue(true);
store.setValue((value) => !value);
getState
() => S
Returns the current store state.
setState
<K extends keyof S>(key: K, value: SetStateAction<S[K]>) => void
Sets a state value.
useState
useState
UseState<StoreState<T>>
Deprecated: Use
useStoreState
instead.
Re-renders the component when the state changes and returns the current state.