useBoolean is a custom hook used to manage a boolean value with on, off and toggle functions.

Import

import { useBoolean } from '@passfort/castle'
content_copy
Copy

Return value

The useBoolean hook returns a stateful boolean value and an object with the following function to update it:

Usage

Usage of toggle method

function Example() {
  const [flag, setFlag] = useBoolean()

  return (
    <>
      <p>Boolean state: {flag.toString()}</p>
      <button onClick={setFlag.toggle}>Click me to toggle the boolean value</button>
    </>
  )
}
function Example() {
  const [flag, setFlag] = useBoolean()

  return (
    <>
      <p>Boolean state: {flag.toString()}</p>
      <button onClick={setFlag.toggle}>Click me to toggle the boolean value</button>
    </>
  )
}
content_copy
Copy
live example

Usage of on and off methods

function Example() {
  const [flag, setFlag] = useBoolean()

  return (
    <div onMouseEnter={setFlag.on} onMouseLeave={setFlag.off}>
      {flag ? 'The flag is ON!' : 'Hover me to turn ON'}
    </div>
  )
}
function Example() {
  const [flag, setFlag] = useBoolean()

  return (
    <div onMouseEnter={setFlag.on} onMouseLeave={setFlag.off}>
      {flag ? 'The flag is ON!' : 'Hover me to turn ON'}
    </div>
  )
}
content_copy
Copy
live example