useCheckbox

The useCheckbox hook simplifies the management of checkbox state by providing a boolean value and a toggle function. It can be used for any scenario where a binary toggle is required, such as checkboxes, switches, or other on/off controls.

Usage

First, you need to import the useCheckbox hook from the kitchn package.

import { useCheckbox } from "kitchn";

Example

Here is an example of how to use the useCheckbox hook in a component:

() => {
  const [checked, toggle] = useCheckbox();

  return (
    <Checkbox checked={checked} onChange={toggle}>
      Checkbox is {checked ? "checked" : "unchecked"}
    </Checkbox>
  );
};

() => {
  const [checked, toggle] = useCheckbox();

  return (
    <Checkbox checked={checked} onChange={toggle}>
      Checkbox is {checked ? "checked" : "unchecked"}
    </Checkbox>
  );
};

Parameters

The useCheckbox hook accepts the following parameter:

Return Value

The useCheckbox hook returns a tuple with the following elements: