useToggle

A lightweight, unopinionated hook to manage boolean state toggling with memoized handlers.

Tip

A simple, semantic alternative to useState(false). Use it for modals, checkboxes, or "Show More" sections to make your code more readable.

Installation

bash

Description

The useToggle simplifies the management of binary states such as switches, modals, and visibility toggles. By encapsulating a boolean state and providing memoized update function, it ensures that child components do not undergo unnecessary re-renders when the toggle logic is passed down as a prop.

This hook is designed to be highly predictable and minimal, serving as a foundational utility for UI components that require a simple "on/off" mechanism without the boilerplate of manual state management.

Parameters

NameTypeDescription
defaultValuebooleanThe initial state of the toggle. Default: false

Return values

NameTypeDescription
statusbooleanThe current active state of the toggle.
handleToggle() => voidA stable, memoized function that flips the status to its opposite value.

Demo

Toggle

Status: False

Source code

tsx