Toast

Organism

Notification system with success/warning/error/info/loading variants. Hover-to-freeze, progress bar, title, actions, and promise support.

Variants

Preview
Code
toast.success('Kaydedildi.');
toast.info('Güncelleme mevcut.');
toast.warning('Oturum sona eriyor.');
toast.error('Sunucu hatası.'); // persistent

Title + Message

Preview
Code
toast.success('Dosya yüklendi.', { title: 'Yükleme tamamlandı' });
toast.error('Sunucuya bağlanılamadı.', { title: 'Bağlantı hatası' });

Actions

Preview
Code
toast.info('Öğe silindi.', {
  title: 'Silindi',
  actions: [
    { label: 'Geri Al', onClick: (dismiss) => { undo(); dismiss(); } },
    { label: 'Kalıcı sil', onClick: (d) => { purge(); d(); }, variant: 'danger' },
  ],
});

Loading & Promise

Preview
Code
// Loading state (persistent until updated)
toast.loading('İşleniyor...');

// Promise: auto-transitions loading → success/error
toast.promise(fetchData(), {
  loading: 'Yükleniyor...',
  success: (data) => `${data.name} hazır.`,
  error: 'Yüklenemedi.',
});

toast.promise() API

Preview
Code
// Single call drives one toast through loading → success | error.
// Strings or value-aware functions are accepted for success/error.
toast.promise(fetchUser(), {
  loading: 'Kullanıcı yükleniyor...',
  success: (u) => `${u.name} (#${u.id}) yüklendi.`,
  error:   (e) => `Hata: ${(e as Error).message}`,
});

// Error path resolves to an assertive role="alert" toast.
toast.promise(fetchBroken(), {
  loading: 'İstek gönderiliyor...',
  success: 'Tamamlandı!',
  error:   (e) => `Başarısız: ${(e as Error).message}`,
});
Sourcemodules/ui/Toast/index.tsx