{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "menubar",
  "type": "registry:ui",
  "title": "Menubar",
  "description": "A desktop style app menubar built on Base UI: a row of triggers that each open a dropdown of items, with keyboard navigation between menus. shadcn compatible.",
  "dependencies": [
    "@base-ui/react"
  ],
  "registryDependencies": [
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/menubar.tsx",
      "type": "registry:ui",
      "target": "components/ui/menubar.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { Menubar as MenubarPrimitive } from \"@base-ui/react/menubar\"\nimport { Menu } from \"@base-ui/react/menu\"\nimport { cn } from \"@/lib/utils\"\n\nfunction Menubar({ className, ...props }: React.ComponentProps<typeof MenubarPrimitive>) {\n  return (\n    <MenubarPrimitive\n      data-slot=\"menubar\"\n      className={cn(\n        \"flex h-10 items-center gap-1 rounded-xl border border-border bg-surface p-1 shadow-highlight\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MenubarMenu({ ...props }: React.ComponentProps<typeof Menu.Root>) {\n  return <Menu.Root {...props} />\n}\n\nfunction MenubarTrigger({ className, ...props }: React.ComponentProps<typeof Menu.Trigger>) {\n  return (\n    <Menu.Trigger\n      data-slot=\"menubar-trigger\"\n      className={cn(\n        \"inline-flex h-8 items-center rounded-lg px-2.5 text-sm text-fg outline-none\",\n        \"hover:bg-sunken focus-visible:ring-2 focus-visible:ring-accent data-[popup-open]:bg-sunken\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MenubarContent({ className, ...props }: React.ComponentProps<typeof Menu.Popup>) {\n  return (\n    <Menu.Portal>\n      <Menu.Positioner sideOffset={6} className=\"z-50\">\n        <Menu.Popup\n          data-slot=\"menubar-content\"\n          className={cn(\n            \"min-w-40 rounded-xl border border-border bg-raised p-1 text-sm text-fg shadow-lg outline-none\",\n            className\n          )}\n          {...props}\n        />\n      </Menu.Positioner>\n    </Menu.Portal>\n  )\n}\n\nfunction MenubarItem({ className, ...props }: React.ComponentProps<typeof Menu.Item>) {\n  return (\n    <Menu.Item\n      data-slot=\"menubar-item\"\n      className={cn(\n        \"flex cursor-default items-center rounded-lg px-2.5 py-1.5 outline-none\",\n        \"data-[highlighted]:bg-sunken\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Menubar, MenubarMenu, MenubarTrigger, MenubarContent, MenubarItem }\n"
    }
  ]
}