{
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
"name": "menubar",
"title": "Menu Bar",
"description": "The macOS menu bar: the app menus on the left and status items with the clock on the right.",
"dependencies": [
"lucide-react",
"@base-ui/react"
],
"registryDependencies": [
"@cupertinoui/macos-theme"
],
"files": [
{
"path": "registry/macos/ui/menubar.tsx",
"content": "\"use client\"\n\nimport * as React from \"react\"\nimport { CheckIcon, ChevronRightIcon, CircleIcon } from \"lucide-react\"\nimport { Menu as MenuPrimitive } from \"@base-ui/react/menu\"\nimport { Menubar as MenubarPrimitive } from \"@base-ui/react/menubar\"\n\nimport { cn } from \"@/lib/utils\"\n\n// The macOS menu bar: the Apple menu, the app name in bold, the app's\n// menus, and status items with the clock on the right (MenubarExtras).\nfunction Menubar({ className, ...props }: MenubarPrimitive.Props) {\n return (\n \n )\n}\n\n// One menu in the bar: its title (MenubarTrigger) and its items.\nfunction MenubarMenu({ ...props }: MenuPrimitive.Root.Props) {\n return \n}\n\n// A menu title. `app` renders the bold application name.\nfunction MenubarTrigger({\n className,\n app = false,\n ...props\n}: MenuPrimitive.Trigger.Props & {\n app?: boolean\n}) {\n return (\n \n )\n}\n\nfunction MenubarPortal({ ...props }: MenuPrimitive.Portal.Props) {\n return \n}\n\nfunction MenubarContent({\n className,\n align = \"start\",\n alignOffset = 0,\n side = \"bottom\",\n sideOffset = 6,\n ...props\n}: MenuPrimitive.Popup.Props &\n Pick) {\n return (\n \n \n \n \n \n )\n}\n\nfunction MenubarGroup({ ...props }: MenuPrimitive.Group.Props) {\n return \n}\n\nfunction MenubarItem({\n className,\n inset,\n variant = \"default\",\n ...props\n}: MenuPrimitive.Item.Props & {\n inset?: boolean\n variant?: \"default\" | \"destructive\"\n}) {\n return (\n \n )\n}\n\nfunction MenubarCheckboxItem({\n className,\n children,\n ...props\n}: MenuPrimitive.CheckboxItem.Props) {\n return (\n \n \n \n \n \n \n {children}\n \n )\n}\n\nfunction MenubarRadioGroup({ ...props }: MenuPrimitive.RadioGroup.Props) {\n return \n}\n\nfunction MenubarRadioItem({\n className,\n children,\n ...props\n}: MenuPrimitive.RadioItem.Props) {\n return (\n \n \n \n \n \n \n {children}\n \n )\n}\n\n// A section heading. Unlike Base UI's GroupLabel it works outside a\n// group too.\nfunction MenubarLabel({\n className,\n inset,\n ...props\n}: React.ComponentProps<\"div\"> & {\n inset?: boolean\n}) {\n return (\n \n )\n}\n\nfunction MenubarSeparator({ className, ...props }: MenuPrimitive.Separator.Props) {\n return (\n \n )\n}\n\nfunction MenubarShortcut({ className, ...props }: React.ComponentProps<\"span\">) {\n return (\n \n )\n}\n\n// A capsule on the right of an item, e.g. \"2 updates\".\nfunction MenubarBadge({ className, ...props }: React.ComponentProps<\"span\">) {\n return (\n \n )\n}\n\nfunction MenubarSub({ ...props }: MenuPrimitive.SubmenuRoot.Props) {\n return \n}\n\nfunction MenubarSubTrigger({\n className,\n inset,\n children,\n ...props\n}: MenuPrimitive.SubmenuTrigger.Props & {\n inset?: boolean\n}) {\n return (\n \n {children}\n \n \n )\n}\n\nfunction MenubarSubContent({\n className,\n align = \"start\",\n alignOffset = -5,\n side = \"right\",\n sideOffset = 0,\n ...props\n}: MenuPrimitive.Popup.Props &\n Pick) {\n return (\n \n \n \n \n \n )\n}\n\n// Status items on the right of the menu bar: icons, then the clock.\nfunction MenubarExtras({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n \n )\n}\n\nfunction MenubarExtra({ className, ...props }: React.ComponentProps<\"button\">) {\n return (\n \n )\n}\n\nexport {\n Menubar,\n MenubarBadge,\n MenubarCheckboxItem,\n MenubarContent,\n MenubarExtra,\n MenubarExtras,\n MenubarGroup,\n MenubarItem,\n MenubarLabel,\n MenubarMenu,\n MenubarPortal,\n MenubarRadioGroup,\n MenubarRadioItem,\n MenubarSeparator,\n MenubarShortcut,\n MenubarSub,\n MenubarSubContent,\n MenubarSubTrigger,\n MenubarTrigger,\n}\n",
"type": "registry:ui"
}
],
"type": "registry:ui"
}