Statusmeldungen
Status Alert Banner
Status Alert Banner: Ein umrandetes Banner, das ein Symbol mit einem Titel und einer optionalen Beschreibung kombiniert, um einen Erfolgs- oder Fehlerstatus inline anzuzeigen.
Status Alert Banner verwenden
Status Alert Banner verwendet das Vorschauformat „Karte“ mit der Theme-Einstellung „hell/dunkel“.
Vorschau anpassen
Diese Einstellungen werden an die Demo übergeben. Standardwerte und Grenzen gelten für die Vorschau; die vollständige Props-API steht in der Implementierung.
| Einstellung | Typ | Standardwert | Vorschaugrenzen |
|---|---|---|---|
variant | select | default | Optionen: default, destructive |
title | text | Success! Your changes have been saved | Bis zu 80 Zeichen |
description | text | This is an alert with a title and description. | Bis zu 140 Zeichen |
accentColor | color | #FF4D8D | Keine weitere Grenze in den Metadaten. |
Für welche Frameworks ist Status Alert Banner verfügbar?
Status Alert Banner ist für React, Vue, Svelte, Astro, HTML verfügbar. Die Live-Vorschau verwendet React; die folgenden Quellcode-Beobachtungen beziehen sich auf index.tsx. Prüfe die gewählte Portierung auf die benötigten Interaktionen.
Welche Abhängigkeiten hat Status Alert Banner?
Die React-Metadaten nennen diese zusätzlichen npm-Abhängigkeiten: class-variance-authority.
Welche Details zur Barrierefreiheit sind in Status Alert Banner erkennbar?
Der React-Quellcode von Status Alert Banner enthält: Attribute und Ereignisbehandler (aria-hidden); explizite Rollen (alert). Dies sind Beobachtungen am Quellcode. Prüfe zugängliche Namen, Fokusreihenfolge und Tastaturverhalten auf der zusammengesetzten Seite.
Wie berücksichtigt Status Alert Banner reduzierte Bewegung?
Die Quellcode-Analyse fand in der index.tsx von Status Alert Banner keine direkte Abfrage über useReducedMotion() oder matchMedia. Prüfe die vollständige Implementierung, gemeinsame Stile und die gewählte Portierung mit aktivierter Bewegungsreduktion; diese Beobachtungen belegen keinen vollständigen Animationsstopp.