Menubar
A menubar component that renders a horizontal list of labeled menu triggers. Clicking a trigger opens its associated menu inline as a floating panel. Hovering over other triggers while any menu is open switches the active menu immediately — matching the native menubar UX.
The menu slot content is unstyled by default. Wrapping it in
<div class="vui-dropdown">makes it visually consistent with the Dropdown component.
Menubar Props
Menubar passes all props down to the underlying Flex component, so any flex layout props are supported. By default, it uses gap=s to space the top-level buttons.
MenuItem Slots
| Name | Accepts | Description |
|---|---|---|
default | any | The trigger element (typically a Button with size s) |
menu | any | Content rendered inside Popout when item is active |