Toast auto-dismiss

Use a timer group when items are created and removed at runtime. Toasts, snackbars, banners, and temporary notifications are good fits.

Toast auto-dismissLive

Toast expiry

0 visible

idle

Add a toast and pause its dismiss timer.

const timers = useTimerGroup({ updateIntervalMs: 250 });

function addToast(id: string) {
  timers.add({
    id,
    autoStart: true,
    endWhen: snapshot => snapshot.elapsedMilliseconds >= 5000,
    onEnd: () => timers.remove(id),
  });
}