Skip to content
On this page
AsyncClient Component

useTimeout

Overview

useTimeout owns a one-shot timer, tracks whether it is pending, and keeps callback changes separate from timer restarts.

Signature

ts
function useTimeout(
  callback: () => void,
  delay: number | null,
  options?: { onError?: (error: unknown) => void },
): { readonly cancel: () => void; readonly pending: boolean };

Parameters

callback is updated from the latest commit. delay is clamped to zero; null disables the timer. onError observes callback failures.

Returns

A stable cancel action and a pending flag.

Behavior

Changing delay restarts the timer. Changing only callback does not. Completion and cancel set pending to false; unmount clears the timer. If the callback throws, pending state and the timer are cleared before onError runs and the original error is rethrown.

SSR / RSC

No timeout starts on the server. The initial pending value is delay !== null; client effects reconcile it.

Example

Composition

Use useBoolean for the visible state and expose cancel when the user can keep a notice open.

Source

Read the implementation on GitHub.