Menüleiste (Menubar) — component.menubar
Klassische Desktop-Menüleiste (Datei, Bearbeiten, Ansicht …): Menüs mit Einträgen, Kürzeln, Trennern und Gefahr-Ton; Tastatur-fähig, öffnet bei Hover wenn ein Menü offen ist
Componentv1.0.0Navigationweb.applicationdesktop.shellbuilder.preview
Beispiele
Fenster-Menüleiste (klicken öffnet, Hover wechselt, Escape schließt)
Eigenschaften
| Prop | Typ | Default |
|---|---|---|
menus * | array | — |
Events & Slots
Events: command
Stellschrauben (Komponenten-Tokens)
| Token | Default |
|---|---|
--menubar-border-default | var(--color-border-default) |
--menubar-elevation-overlay | var(--elevation-overlay) |
--menubar-focus-ring-color | var(--focus-ring-color) |
--menubar-focus-ring-offset | var(--focus-ring-offset) |
--menubar-focus-ring-width | var(--focus-ring-width) |
--menubar-radius-control | var(--radius-control) |
--menubar-radius-sm | var(--radius-sm) |
--menubar-status-danger | var(--color-status-danger) |
--menubar-surface-default | var(--color-surface-default) |
--menubar-surface-overlay | var(--color-surface-overlay) |
--menubar-surface-sunken | var(--color-surface-sunken) |
--menubar-text-default | var(--color-text-default) |
--menubar-text-disabled | var(--color-text-disabled) |
--menubar-text-muted | var(--color-text-muted) |
Genutzte Design-Tokens
border.hairline color.border.default color.status.danger color.surface.default color.surface.overlay color.surface.sunken color.text.default color.text.disabled color.text.muted elevation.overlay focus.ring-color focus.ring-offset focus.ring-width font.family.default font.family.mono layer.dropdown radius.control radius.sm size.1 size.2 size.3 size.32 text.sm text.xs