Ankündigungs-Pille
Pill-Banner über einer Überschrift (Beispiel: Neu · Version 2 ist da): Markierung links, Text, optionaler Pfeil — als Link oder statisch
Nutzt: ui.icon
Beispiele
Als Link mit Pfeil
Akzent-Ton, statisch
BetaAgenten-Chat jetzt testen
Eigenschaften
| Prop | Typ | Default | Builder-Label |
|---|---|---|---|
| tag | string | "Neu" | Markierung links |
| text * | string | — | Text |
| href | string | "" | Ziel (leer = statisch) |
| tone | string: primary | accent | neutral | "primary" | Ton |
| arrow | boolean | true | Pfeil rechts |
* Pflicht-Prop
Stellschrauben (Komponenten-Tokens)
Ebene 3 — aus dem CSS generiert (Registry). Umverdrahtbar per Hüllen-Komposition, ohne Markup-Eingriff; künftige Regler-Quelle des Component Builders.
| Token | Default |
|---|---|
--announcement-tone | var(--color-action-primary) |
Genutzte Design-Tokens
border.hairlinecolor.accentcolor.action.on-primarycolor.action.primarycolor.text.defaultcolor.text.mutedfont.family.defaultradius.fullsize.1size.2size.3text.smtext.xsweight.semibold