Всплывающее уведомление

useToastQueue управляет очередью уведомлений с автоматическим и настраиваемым скрытием (по умолчанию 5 секунд, 0 отключает авто-скрытие), а ToastViewport закрепляет очередь снизу экрана, у каждого уведомления — собственная вежливая live-область и кнопка ручного закрытия.

Пример

Интерактивный пример

Использование

Импортируйте компонент из публичной точки входа пакета.

"use client";

import { Button, ToastViewport, useToastQueue } from "denjs-ui";

export function Example() {
  const { toasts, notify, dismiss } = useToastQueue();

  return (
    <>
      <Button onClick={() => notify({ tone: "success", title: "Changes saved" })}>
        Save
      </Button>
      <ToastViewport toasts={toasts} onDismiss={dismiss} />
    </>
  );
}