Toast Kit
Toast-уведомления с Promise-API, автоматическим переключением типов, очередью приоритетов, undo-действиями, группировкой, headless-режимом и полной дизайн-системой.
Гибкая дизайн‑система и полная кастомизация
Более 30 CSS-переменных (--vtk-*) управляют цветами, шрифтами, отступами, тенями и анимациями. Встроены светлая, тёмная и системная темы, а также возможность передать объект с токенами напрямую в проп theme компонента ToastContainer. Это позволяет адаптировать внешний вид тостов под любой бренд без переопределения стилей и без использования !important.
Позиционирование, анимации и стек-режим
Шесть предустановленных позиций (top/bottom + left/center/right) с плавными CSS‑анимациями появления и исчезновения (slide + fade) для каждой позиции. Режим стека (Sonner‑style) визуально складывает несколько тостов в стопку, показывая до двух «призрачных» карточек позади активного, которые раскрываются при наведении. Поддержка prefers‑reduced‑motion.
Группировка, иконки, слоты и touch‑взаимодействие
Тосты с одинаковым groupKey сворачиваются в один счётчиком +N, который раскрывается по клику. Встроенные иконки для каждого типа (можно заменить на свой компонент или эмодзи). Полная переопределяемость через слоты: от целого тоста до отдельных частей — иконки, контента, кнопок и прогресс‑бара. Поддержка свайпа для закрытия на тач‑устройствах и RTL‑разметки.
Promise‑API с автопереключением и Undo с прогрессом
toast.promise() автоматически переключает тост из состояния loading в success или error, возвращая исходный промис для await. toast.undo() создаёт тост с анимированной шкалой прогресса и кнопкой отмены: клик по кнопке выполняет onUndo и закрывает тост, истечение таймера подтверждает действие через onAutoClose. Поддерживаются асинхронные колбэки.
Приоритетная очередь, изолированные контексты и SSR
Четыре уровня приоритета (critical, high, normal, low) управляют очередью: высокоприоритетные тосты вытесняют низкоприоритетные при достижении лимита видимых. createToastContext() создаёт изолированные очереди для микро‑фронтендов или отдельных зон. Ядро SSR‑безопасно: тосты, вызванные на сервере, буферизируются и воспроизводятся после монтирования ToastContainer.