Popover — component.popover
Generischer verankerter Overlay: Klick auf den Auslöser öffnet ein Panel mit freiem Slot-Inhalt — schließt bei Außenklick und Escape. Für reine Hover-Vorschau component.hover-card, für Menüs component.dropdown
Componentv1.0.1Overlayweb.documentweb.applicationdesktop.shellbuilder.preview
Beispiele
Filter-Panel (unten links)
Ansicht filternNur offene AufträgeNur eigeneOben rechts verankert
Zuletzt geändert am 11.08.2026 von David Selig.Eigenschaften
| Prop | Typ | Default |
|---|---|---|
trigger * | string | — |
triggerVariant | string: primary | secondary | ghost | "secondary" |
placement | string: bottom-start | bottom-end | top-start | top-end | "bottom-start" |
title | string | "" |
Events & Slots
Events: open, close
Slot default: akzeptiert ui.*, component.*, layout.*
Stellschrauben (Komponenten-Tokens)
| Token | Default |
|---|---|
--popover-width | calc(var(--container-sm) * 0.6) |
--popover-background | var(--color-surface-overlay) |
--popover-border | var(--color-border-default) |
Genutzte Design-Tokens
border.hairline color.border.default color.surface.overlay color.text.default container.sm elevation.overlay font.family.default layer.dropdown radius.overlay size.2 size.4 text.sm weight.semibold