Hooks

Custom hook that manages the state of an async function.

Custom hook that handles boolean state with useful utility functions.

Custom hook that handles click events anywhere on the document.

Custom hook that copies text to the clipboard using the [`Clipboard API`](https://developer.mozilla.org/en-US/docs/Web/API/Clipboard_API).

Custom hook that manages countdown.

Custom hook that manages a counter with increment, decrement, reset, and setCount functionalities.

Custom hook that returns the current state of the dark mode.

Custom hook that creates a debounced version of a callback function.

Custom hook that returns a debounced version of the provided value, along with a function to update it.

Custom hook for managing boolean disclosure state (modals, popovers, drawers, etc.).

Custom hook that sets the document title.

Custom hook that creates a memoized event callback.

useEventListener hook for React apps.

Custom hook that provides access to the browser's geolocation API.

Custom hook that tracks whether a DOM element is being hovered over.

Custom hook that tracks whether the user is idle (no activity for a specified time).

Custom hook that tracks the intersection of a DOM element with its containing element or the viewport using the [`Intersection Observer API`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API).

Custom hook that creates an interval that invokes a callback function at a specified delay using the [`setInterval API`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval).

Custom hook that determines if the code is running on the client side (in the browser).

Custom hook that determines if the component is currently mounted.

Custom hook that uses either `useLayoutEffect` or `useEffect` based on the environment (client-side or server-side).

Custom hook that manages a list state with setter actions.

Custom hook that uses the [`localStorage API`](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) to persist state across page reloads.

Custom hook that manages a key-value [`Map`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) state with setter actions.

Custom hook that tracks the state of a media query using the [`Match Media API`](https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia).

Custom hook that returns a memoized version of a function that never changes reference. The returned function will always call the latest version of the callback, but its identity (reference) will remain stable across renders. This is useful when you need to pass a callback to a dependency array or child component without causing unnecessary re-renders.

Custom hook that tracks the browser's network connection status.

Custom hook that handles clicks outside a specified element.

Custom hook that invokes a callback when the user's mouse leaves the page.

Custom hook for managing pagination logic. Returns page navigation functions and a range array suitable for pagination UI.

Custom hook that tracks the state of a browser permission.

Returns the previous value of a variable from the last render. On the first render, returns `undefined` or the provided initial value.

Custom hook that manages a FIFO (First In, First Out) queue state with setter actions.

useReadLocalStorage hook for React apps.

Custom hook that observes the size of an element using the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).

useScreen hook for React apps.

Custom hook that dynamically loads scripts and tracking their loading status.

A custom hook that locks and unlocks scroll.

Custom hook that uses the [`sessionStorage API`](https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage) to persist state across page reloads.

Custom hook that manages a [`Set`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set) state with setter actions.

Custom hook for navigating through a list of states. Useful for step-by-step flows, carousels, or multi-step forms.

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

Custom hook that manages ternary (system, dark, light) dark mode with local storage support.

Custom hook that throttles a value, ensuring updates occur at most once per wait period.

Custom hook that handles timeouts in React components using the [`setTimeout API`](https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout).

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

Custom hook that runs a cleanup function when the component is unmounted.

Custom hook that returns true on the first render, false thereafter.

Custom hook that manages state with method-based updates.

Custom hook that manages state with a mediator function that transforms values.

Custom hook that validates multiple states at once.

Custom hook that returns the number of times a component has rendered.

Custom hook that stores previous state values and provides navigation.

Custom hook that returns a function to force a component re-render.

A hook that runs an effect only when dependencies change, skipping the initial mount. This is useful for responding to prop or state changes without running on first render.

useWindowSize hook for React apps.