useCountdown

A pausable countdown or count-up that stops at its target.

HooksState@gaudi/design-system/hooks/state/use-countdownView in Storybook Source

Composes useInterval with count state. Changing the interval restarts the timer interval; reset stops it and restores the current countStart. Counts represent ticks, not elapsed wall-clock time.

Usage

import { useCountdown } from '@gaudi/design-system/hooks';
const { count, isRunning, start, stop, reset } = useCountdown({ countStart: 30 });

Examples

Playground

Storybook

API

4 options

2 return values

Accessibility

Keep pause and reset controls available. Avoid announcing every tick; announce completion separately.

Notes

Timers can be throttled in background tabs. Use an application deadline for time-critical expiry.
Starting at or beyond the target does not run.

useIntervalsetInterval that can pause and always runs the latest callback.useBooleanGeneric boolean state with stable toggle, enable and disable actions.useControllableStateState that works controlled or uncontrolled, like native inputs.useCounterA number with increment, decrement, set and reset actions.useDebounceCallbackA debounced function with cancel and flush.useDebounceValueA value that updates only after it stops changing.