{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "menubar",
  "title": "Menubar",
  "description": "Terminal-style application menubar: border-b strip, open-state inversion on triggers, ✓/● indicators, ▸ submenu glyph, no hover/radius/shadow. Includes checkbox, radio, sub-menu, shortcut, separator.",
  "dependencies": [
    "@radix-ui/react-menubar"
  ],
  "registryDependencies": [
    "utils",
    "theme-catppuccin-mocha",
    "font-jetbrains-mono"
  ],
  "files": [
    {
      "path": "registry/ui/menubar.tsx",
      "content": "import * as React from \"react\";\nimport * as MenubarPrimitive from \"@radix-ui/react-menubar\";\nimport { cn } from \"@/lib/utils\";\n\nfunction Menubar({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.Root>) {\n\treturn (\n\t\t<MenubarPrimitive.Root\n\t\t\tdata-slot=\"menubar\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex items-center border-b border-border bg-background font-mono text-sm text-foreground\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction MenubarMenu({\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.Menu>) {\n\treturn <MenubarPrimitive.Menu data-slot=\"menubar-menu\" {...props} />;\n}\n\nfunction MenubarTrigger({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.Trigger>) {\n\treturn (\n\t\t<MenubarPrimitive.Trigger\n\t\t\tdata-slot=\"menubar-trigger\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex cursor-default select-none items-center px-3 py-1 text-sm text-foreground1 outline-none\",\n\t\t\t\t\"data-[state=open]:bg-foreground data-[state=open]:text-background\",\n\t\t\t\t\"focus-visible:bg-foreground focus-visible:text-background\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction MenubarPortal({\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.Portal>) {\n\treturn <MenubarPrimitive.Portal data-slot=\"menubar-portal\" {...props} />;\n}\n\nfunction MenubarContent({\n\tclassName,\n\talign = \"start\",\n\talignOffset = -4,\n\tsideOffset = 0,\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.Content>) {\n\treturn (\n\t\t<MenubarPortal>\n\t\t\t<MenubarPrimitive.Content\n\t\t\t\tdata-slot=\"menubar-content\"\n\t\t\t\talign={align}\n\t\t\t\talignOffset={alignOffset}\n\t\t\t\tsideOffset={sideOffset}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"z-50 min-w-[8rem] overflow-hidden border border-border bg-card font-mono text-foreground\",\n\t\t\t\t\t\"data-[state=open]:animate-[termcn-fade_150ms_ease-out] data-[state=closed]:animate-[termcn-fade-out_150ms_ease-out]\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</MenubarPortal>\n\t);\n}\n\nfunction MenubarItem({\n\tclassName,\n\tinset,\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.Item> & {\n\tinset?: boolean;\n}) {\n\treturn (\n\t\t<MenubarPrimitive.Item\n\t\t\tdata-slot=\"menubar-item\"\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex cursor-default select-none items-center gap-2 px-3 py-1 text-sm text-foreground outline-none\",\n\t\t\t\t\"data-[highlighted]:bg-foreground data-[highlighted]:text-background\",\n\t\t\t\t\"data-[disabled]:text-foreground2 data-[disabled]:cursor-not-allowed\",\n\t\t\t\t\"[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0\",\n\t\t\t\tinset && \"pl-8\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction MenubarCheckboxItem({\n\tclassName,\n\tchildren,\n\tchecked,\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.CheckboxItem>) {\n\treturn (\n\t\t<MenubarPrimitive.CheckboxItem\n\t\t\tdata-slot=\"menubar-checkbox-item\"\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex cursor-default select-none items-center gap-2 py-1 pr-3 pl-8 text-sm text-foreground outline-none\",\n\t\t\t\t\"data-[highlighted]:bg-foreground data-[highlighted]:text-background\",\n\t\t\t\t\"data-[disabled]:text-foreground2 data-[disabled]:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tchecked={checked}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"absolute left-3 flex size-3.5 items-center justify-center font-mono text-xs text-primary\">\n\t\t\t\t<MenubarPrimitive.ItemIndicator>✓</MenubarPrimitive.ItemIndicator>\n\t\t\t</span>\n\t\t\t{children}\n\t\t</MenubarPrimitive.CheckboxItem>\n\t);\n}\n\nfunction MenubarRadioGroup({\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.RadioGroup>) {\n\treturn (\n\t\t<MenubarPrimitive.RadioGroup\n\t\t\tdata-slot=\"menubar-radio-group\"\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction MenubarRadioItem({\n\tclassName,\n\tchildren,\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.RadioItem>) {\n\treturn (\n\t\t<MenubarPrimitive.RadioItem\n\t\t\tdata-slot=\"menubar-radio-item\"\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex cursor-default select-none items-center gap-2 py-1 pr-3 pl-8 text-sm text-foreground outline-none\",\n\t\t\t\t\"data-[highlighted]:bg-foreground data-[highlighted]:text-background\",\n\t\t\t\t\"data-[disabled]:text-foreground2 data-[disabled]:cursor-not-allowed\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"absolute left-3 flex size-3.5 items-center justify-center font-mono text-xs text-primary\">\n\t\t\t\t<MenubarPrimitive.ItemIndicator>●</MenubarPrimitive.ItemIndicator>\n\t\t\t</span>\n\t\t\t{children}\n\t\t</MenubarPrimitive.RadioItem>\n\t);\n}\n\nfunction MenubarLabel({\n\tclassName,\n\tinset,\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.Label> & {\n\tinset?: boolean;\n}) {\n\treturn (\n\t\t<MenubarPrimitive.Label\n\t\t\tdata-slot=\"menubar-label\"\n\t\t\tclassName={cn(\n\t\t\t\t\"px-3 py-1 text-xs font-medium text-foreground2 uppercase tracking-wider\",\n\t\t\t\tinset && \"pl-8\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction MenubarSeparator({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.Separator>) {\n\treturn (\n\t\t<MenubarPrimitive.Separator\n\t\t\tdata-slot=\"menubar-separator\"\n\t\t\tclassName={cn(\"-mx-0 my-1 border-t border-border\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction MenubarShortcut({\n\tclassName,\n\t...props\n}: React.ComponentProps<\"span\">) {\n\treturn (\n\t\t<span\n\t\t\tdata-slot=\"menubar-shortcut\"\n\t\t\tclassName={cn(\n\t\t\t\t\"ml-auto pl-4 text-xs tracking-widest text-foreground2\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction MenubarGroup({\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.Group>) {\n\treturn <MenubarPrimitive.Group data-slot=\"menubar-group\" {...props} />;\n}\n\nfunction MenubarSub({\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.Sub>) {\n\treturn <MenubarPrimitive.Sub data-slot=\"menubar-sub\" {...props} />;\n}\n\nfunction MenubarSubTrigger({\n\tclassName,\n\tinset,\n\tchildren,\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.SubTrigger> & {\n\tinset?: boolean;\n}) {\n\treturn (\n\t\t<MenubarPrimitive.SubTrigger\n\t\t\tdata-slot=\"menubar-sub-trigger\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex cursor-default select-none items-center gap-2 px-3 py-1 text-sm text-foreground outline-none\",\n\t\t\t\t\"data-[state=open]:bg-foreground data-[state=open]:text-background\",\n\t\t\t\t\"data-[highlighted]:bg-foreground data-[highlighted]:text-background\",\n\t\t\t\tinset && \"pl-8\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t\t<span className=\"ml-auto font-mono text-xs text-foreground2\">▸</span>\n\t\t</MenubarPrimitive.SubTrigger>\n\t);\n}\n\nfunction MenubarSubContent({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof MenubarPrimitive.SubContent>) {\n\treturn (\n\t\t<MenubarPrimitive.SubContent\n\t\t\tdata-slot=\"menubar-sub-content\"\n\t\t\tclassName={cn(\n\t\t\t\t\"z-50 min-w-[8rem] overflow-hidden border border-border bg-card font-mono text-foreground\",\n\t\t\t\t\"data-[state=open]:animate-[termcn-fade_150ms_ease-out] data-[state=closed]:animate-[termcn-fade-out_150ms_ease-out]\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport {\n\tMenubar,\n\tMenubarMenu,\n\tMenubarTrigger,\n\tMenubarPortal,\n\tMenubarContent,\n\tMenubarItem,\n\tMenubarCheckboxItem,\n\tMenubarRadioGroup,\n\tMenubarRadioItem,\n\tMenubarLabel,\n\tMenubarSeparator,\n\tMenubarShortcut,\n\tMenubarGroup,\n\tMenubarSub,\n\tMenubarSubTrigger,\n\tMenubarSubContent,\n};\n",
      "type": "registry:ui"
    }
  ],
  "css": {
    "@keyframes termcn-fade": {
      "from": {
        "opacity": "0"
      },
      "to": {
        "opacity": "1"
      }
    },
    "@keyframes termcn-fade-out": {
      "from": {
        "opacity": "1"
      },
      "to": {
        "opacity": "0"
      }
    }
  },
  "type": "registry:ui"
}