Toast

İsteğe bağlı aksiyon içeren geçici geri bildirim mesajı.

Toast.tsx

Değişiklikler Canlıya Alındı

Tasarım tokenları ve bileşen kütüphanesi başarıyla derlendi.

Otomatik Yedekleme Tamamlandı

Tüm mimari şemalar yerel diske kaydedildi.

Kurulum

shadcn CLI ile projenize ekleyebilir veya yukarıdaki "Kaynak Kodu" sekmesinden kodu doğrudan projenize kopyalayabilirsiniz:

$npx shadcn@latest add https://ui.cagriozay.com.tr/r/toast.json

Kullanım Örneği

import { Toast } from "@/components/feedback/Toast"

<Toast
  variant="success"
  title="Değişiklikler kaydedildi"
  message="Yeni ayarlar yayına hazır."
  duration={5000}
  onClose={removeToast}
/>

Özellikler & Parametreler (API)

Prop	Tür	Varsayılan	Açıklama
variant	"info" \| "success" \| "warning" \| "error" \| "sage"	"info"	Renkleri ve varsayılan canlı bölge rolünü belirler.
title	ReactNode	—	Toast başlığı.
message	ReactNode	—	İsteğe bağlı açıklama.
action	{ label: string; onClick?: () => void; href?: string }	—	Callback veya bağlantı aksiyonu.
duration	number	—	Milisaniye cinsinden otomatik kapanma süresi.
visible	boolean	—	Kontrollü görünürlük durumu.
defaultVisible	boolean	true	Kontrolsüz ilk görünürlük durumu.
onClose	() => void	—	Kapatma isteğinde çağrılır.
closeLabel	string	"Bildirimi kapat"	Kapatma düğmesinin erişilebilir etiketi.
headingLevel	2 \| 3 \| 4 \| 5 \| 6	3	Başlık seviyesi.
icon	ReactNode	—	Varyant ikonunu değiştiren özel ikon; null ile gizlenebilir.