useEventCallback

A stable function that always calls the latest callback.

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

Pass handlers to effects, subscriptions and memoised children without re-running them when an inline callback changes. Call it from events and effects, not during render.

Usage

import { useEventCallback } from '@gaudi/design-system/hooks';
const onMessage = useEventCallback((message) => setLog((log) => [...log, message]));useEffect(() => socket.subscribe(onMessage), [onMessage]);

Examples

Fresh state, stable subscription

Storybook

API

1 option

1 return value

Accessibility

No direct accessibility impact; it keeps listeners stable so focus and announcements are not reset by re-subscriptions.

Notes

Do not call the returned function during render.

useBooleanGeneric boolean state with stable toggle, enable and disable actions.useControllableStateState that works controlled or uncontrolled, like native inputs.useCountdownA pausable countdown or count-up that stops at its target.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.