Menubar
A row of desktop-style menus, for editors and tools with many commands.
Usage
import {
Menubar,
MenubarContent,
MenubarItem,
MenubarMenu,
MenubarShortcut,
MenubarTrigger,
} from "@zynactra/ui/menubar"<Menubar>
<MenubarMenu>
<MenubarTrigger>File</MenubarTrigger>
<MenubarContent>
<MenubarItem>
New project <MenubarShortcut>⌘N</MenubarShortcut>
</MenubarItem>
</MenubarContent>
</MenubarMenu>
</Menubar>Menus take the same items as Dropdown Menu, including MenubarCheckboxItem and MenubarRadioGroup.
Guidelines
- Only in app-like tools (editors, consoles). Marketing and dashboard pages use Navigation Menu or a toolbar.
- Order menus the way desktop apps do: File, Edit, View, then your own.
- Show the shortcut next to every command that has one.
API reference
Behaviour and props come from Base UI. See the Base UI Menubar docs.