useTimeout

Timing & async

A lightweight, type-safe React hook for declarative setTimeout with automatic cleanup

Install

$ npm install @usefy/use-timeout

Quick start

useTimeout.tsx

import { useTimeout } from "@usefy/use-timeout";

function Toast({ message }: { message: string }) {
  const [show, setShow] = useState(true);

  useTimeout(() => {
    setShow(false);
  }, 3000);

  return show ? <div className="toast">{message}</div> : null;
}

API reference

`useTimeout(callback, delay)`

A hook that executes a callback after a specified delay with automatic cleanup and controls.

Parameters

Parameter	Type	Description
`callback`	`() => void`	Function to execute after the delay
`delay`	`number \| null \| undefined`	Delay in milliseconds, or `null`/`undefined` to disable

Returns `UseTimeoutReturn`

Property	Type	Description
`reset`	`() => void`	Restart the timer from the beginning
`clear`	`() => void`	Cancel the timer (callback won't execute)
`isPending`	`boolean`	Whether the timer is currently pending

Go deeper

This page is the quick reference. For every example, prop, and edge case, read the full README — or open Storybook to change props live.

Full README →Open in Storybook →