{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "menubar",
  "type": "registry:ui",
  "title": "Menubar",
  "description": "An app's commands under a few words across the top: quiet keys that open the menu's plates; while one is open, a highlight glides between the keys on the settle spring and the next menu opens at once.",
  "dependencies": [
    "@base-ui/react@^1.8.0"
  ],
  "registryDependencies": [
    "https://metalui.dev/r/tokens.json"
  ],
  "files": [
    {
      "path": "packages/metalui/src/components/menubar/menubar.tsx",
      "type": "registry:ui",
      "target": "components/metalui/menubar/menubar.tsx",
      "content": "'use client';\n\nimport * as React from 'react';\nimport { Menubar as BaseMenubar } from '@base-ui/react/menubar';\nimport { Menu } from '../menu/menu';\nimport { SlidingIndicator } from '../../motion/indicator';\n\n/* ─────────────────────────────────────────────────────────\n * MENUBAR, an app's commands under a few words across the top\n *\n *   rest      quiet text keys (File, Edit, View); a hovered key lifts on its own (the list row's\n *             lifted look)\n *   open      a key opens the menu's frosted plate below it\n *   across    while a menu is open, one highlight glides between the keys on the settle spring as\n *             the pointer or ← → move across; the next menu opens at once as the last one fades\n *             on release, as a native bar does\n *   close     Esc or a click outside closes it; focus returns to the key\n * Reduce Motion: the highlight moves at once.\n * The plates and rows are the menu's; the menubar recipe adds the keys.\n * Slots: Menubar.Root, Menubar.Menu.\n * ───────────────────────────────────────────────────────── */\n\nconst BAR = 'mu-menubar relative inline-flex items-center gap-menubar-gap p-menubar-pad';\nconst KEY = 'mu-menubar-key relative z-1 inline-flex items-center h-menubar-key-height px-menubar-key-pad-x rounded-menubar-key-radius border-0 bg-transparent type-ui text-ink cursor-default outline-none select-none hover:not-data-popup-open:recipe-row-list-hover focus-visible:focus-ring disabled:opacity-button-disabled data-disabled:opacity-button-disabled';\nconst GLIDE = 'rounded-menubar-key-radius recipe-row-list-hover';\n\nexport interface MenubarProps extends Omit<BaseMenubar.Props, 'className'> {\n  'aria-label'?: string;\n  className?: string;\n}\n\nfunction Root({ className, children, ...props }: MenubarProps) {\n  return (\n    <BaseMenubar className={className ? `${BAR} ${className}` : BAR} {...props}>\n      <SlidingIndicator activeSelector=\"[data-popup-open]\" watch={['data-popup-open']} spring=\"settle\" className={GLIDE} />\n      {children}\n    </BaseMenubar>\n  );\n}\n\nexport interface MenubarMenuProps {\n  /** The word on the bar: \"File\". */\n  label: string;\n  /** MenuItem and MenuSeparator. */\n  children: React.ReactNode;\n  heading?: string;\n  disabled?: boolean;\n}\n\n/** One word on the bar and the menu it opens. */\nfunction MenubarMenu({ label, children, heading, disabled }: MenubarMenuProps) {\n  return (\n    <Menu heading={heading} trigger={<button type=\"button\" disabled={disabled} className={KEY}>{label}</button>}>\n      {children}\n    </Menu>\n  );\n}\n\nexport const Menubar = Object.assign(Root, { Menu: MenubarMenu, Root });\n"
    }
  ],
  "docs": "Agent guide: https://metalui.dev/r/menubar.md. SwiftUI: MetalMenubar in the MetalUI Swift package."
}