SSE Hooks

useToggle

Custom hook that manages a boolean toggle state in React components.

Installation

npx sse-hooks add use-toggle

yarn dlx sse-hooks add use-toggle

pnpm dlx sse-hooks add use-toggle

deno run -A npm:sse-hooks add use-toggle

bunx sse-hooks add use-toggle

Usage

example.ts

import { useToggle } from "./{hooks file}";

const [isToggled, toggle, setToggle] = useToggle(); // Initial value is false
// OR
const [isToggled, toggle, setToggle] = useToggle(true); // Initial value is true
// Use isToggled in your component, toggle to switch the state, setToggle to set the state explicitly.

API

Parameters

Prop	Default	Type
`defaultValue`	-	`boolean` The initial value for the toggle state.

Returns

Return Value	Default	Type
`[0]`	-	`boolean`
`[1]`	-	`() => void`
`[2]`	-	`Dispatch<SetStateAction<boolean>>`

Types Aliases

No specific type aliases defined for this component.

Changelog

c165d — feat: enhance useRoleGuard and useSSR hooks with additional options and documentation

30da4 — feat: add new hooks and their metadata

cf13e — feat: add custom hooks for step navigation, ternary dark mode, timeout, toggle, unmount, and window size

useStep

Custom hook that manages and navigates between steps in a multi-step process.

useCountdown

Custom hook that manages countdown.