1Sponsor

Menu

Dropdown menu with nested submenus

Terminal

Installation

pnpm dlx shadcn@latest add https://termcn.dev/r/menu.json

Usage

import { Menu } from "@/components/ui/menu";
<Menu
  title="File"
  items={[
    { key: "new", label: "New File", shortcut: "⌘N" },
    { key: "save", label: "Save", shortcut: "⌘S" },
  ]}
  onSelect={(item) => console.log(item.key)}
/>

API Reference

PropTypeDefault
itemsMenuItem[]required
onSelect(item: MenuItem) => voidundefined
titlestringundefined
PropTypeDefault
keystringrequired
labelstringrequired
iconstringundefined
shortcutstringundefined
disabledbooleanundefined
separatorbooleanundefined
childrenMenuItem[]undefined