ComponentClient component

Menubar

A desktop-style accessible menu bar with nested and selectable actions.

Installation

Preview

Usage

tsx

import { Menubar, MenubarContent, MenubarItem, MenubarMenu, MenubarShortcut, MenubarTrigger } from "@/components/ui/menubar"

<Menubar>
  <MenubarMenu>
    <MenubarTrigger>File</MenubarTrigger>
    <MenubarContent>
      <MenubarItem>New tab <MenubarShortcut>⌘T</MenubarShortcut></MenubarItem>
      <MenubarItem>New window <MenubarShortcut>⌘N</MenubarShortcut></MenubarItem>
    </MenubarContent>
  </MenubarMenu>
</Menubar>

API reference

Prop	Type	Default	Description
`value`	`string`	`—`	Controlled value of the open menu.
`loop`	`boolean`	`true`	Loops keyboard focus through menu triggers.
`className`	`string`	`—`	Overrides or extends the generated Tailwind classes.
`disabled`	`boolean`	`false`	Prevents user interaction when supported.