useBoolean

Boolean state with setTrue, setFalse, set, and toggle helpers.

Import

import { useBoolean } from '@kamod-ch/hooks'

Live demo

Basic demo

Boolean state with setTrue, setFalse, set, and toggle helpers.

Current value: false

import { useBoolean } from '@kamod-ch/hooks'

export default function UseBooleanDemo() {
  const [value, actions] = useBoolean(false)

  return (
    <div>
      <p><strong>Current value:</strong> {String(value)}</p>
      <div class="demo-actions">
        <button type="button" onClick={actions.setTrue}>Set true</button>
        <button type="button" onClick={actions.setFalse}>Set false</button>
        <button type="button" onClick={actions.toggle}>Toggle</button>
      </div>
    </div>
  )
}

API

TypeScript signature

export interface Actions {
    setTrue: () => void;
    setFalse: () => void;
    set: (value: boolean) => void;
    toggle: () => void;
}
export default function useBoolean(defaultValue?: boolean): [boolean, Actions];
/

SSR considerations

This hook is safe to import during SSR. If your effect body touches the DOM, keep that work inside the effect callback.

Browser compatibility

Works in any modern browser supported by Preact.

Related hooks

useToggle