Toast
Imperative Benachrichtigungen mit Status-Icon, Aktion und Warteschlange. Die API ist ohne React-Kontext aufrufbar; der Toaster im Layout bindet sie an das Portal und übernimmt Akzent, Dichte und Theme.
Varianten
Status-Icon im farbigen Kreis, Navy-Fläche und weiße Schrift. Der Ladezustand bleibt ohne Auto-Dismiss sichtbar, bis er aktualisiert oder geschlossen wird.
Aktion
Eine Aktion wie „Rückgängig“ liegt als inverse Button rechts im Toast. Nach dem Klick schließt der Toast; die Dauer lässt sich pro Benachrichtigung verlängern.
Promise
toast.promise zeigt zuerst den Ladezustand und wechselt danach automatisch zu Erfolg oder Fehler. Die ID bleibt stabil, die Benachrichtigung springt nicht.
Warteschlange
Standardmäßig sind drei Toasts sichtbar. Weitere Aufrufe warten in der Schlange und rücken nach, sobald ein sichtbarer Toast schließt; der Fokus bleibt dabei unberührt.
Barrierefreiheit
Der Viewport ist eine benannte Region mit aria-live=polite; Fehler meldet Base UI zusätzlich als Alert mit hoher Priorität. Toasts erhalten keinen Startfokus, pausieren bei Hover, Fokus und in einem versteckten Tab und lassen sich per Swipe schließen.
Auf schmalen Viewports sitzt der Toaster immer unten zentriert über der Safe-Area. Schließen-Button und Aktion tragen die Texte aus dem Provider (toast.close, toast.undo).