{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "menubar",
  "title": "Menubar",
  "description": "A highlight glides along the bar from one menu to the next, and each menu unfolds from its title.",
  "dependencies": [
    "@ui-sdk/core@0.1.0-beta.2",
    "@ui-sdk/react@0.1.0-beta.2"
  ],
  "registryDependencies": [
    "@keyframery/motion"
  ],
  "files": [
    {
      "path": "registry/components/keyframery/primitives/menubar.tsx",
      "content": "\"use client\"\n\n/* Animated drop-in for `@ui-sdk/react/menubar` and the `@ui-sdk/react/menu` parts it holds: same parts,\n   same props. Swap the imports and keep your code.\n   This file adds motion only. Colours, radii, shadows and spacing stay yours.\n\n   - Content and submenus: Unfold from the trigger (scale 0.86, 6px blur, 8px toward it; spring in, quick out).\n     A submenu unfolds sideways, from the row that opened it.\n   - Rows: Cascade in, one after another, as the sheet opens.\n   - Glide: one highlight springs from row to row (CSS anchor positioning), instead of each row lighting up.\n     Its neutral surface follows the text colour; give `before:bg-…` and `before:rounded-…` to restyle it.\n   - Checks: Draw themselves. Triggers: Press.\n   - The bar: a second gliding highlight moves between its triggers, to the hovered or open one. */\n\nimport {\n  MenuCheckboxItem as MenuCheckboxItemPart,\n  MenuContent as MenuContentPart,\n  MenuItem as MenuItemPart,\n  MenuItemIndicator as MenuItemIndicatorPart,\n  MenuRadioItem as MenuRadioItemPart,\n  MenuSubContent as MenuSubContentPart,\n  MenuSubTrigger as MenuSubTriggerPart,\n  MenuTrigger as MenuTriggerPart,\n} from \"@ui-sdk/react/menu\"\nimport { Menubar as MenubarPart } from \"@ui-sdk/react/menubar\"\nimport * as React from \"react\"\n\nimport { cn } from \"@/lib/utils\"\n\nexport * from \"@ui-sdk/react/menu\"\nexport * from \"@ui-sdk/react/menubar\"\n\n/* Unfold + Cascade + Glide, shared by the content and its submenus. The cascade runs on the\n   direct children (rows, groups, separators), never on a nested submenu. */\nconst sheet = cn(\n  \"group/kf-menu origin-(--transform-origin)\",\n  \"[transition:opacity_calc(380ms*var(--kf-speed,1))_var(--ease-spring),scale_calc(380ms*var(--kf-speed,1))_var(--ease-spring),translate_calc(380ms*var(--kf-speed,1))_var(--ease-spring),filter_calc(380ms*var(--kf-speed,1))_var(--ease-spring)]\",\n  \"data-[side=bottom]:[--kf-from:0_-8px] data-[side=top]:[--kf-from:0_8px] data-[side=left]:[--kf-from:8px_0] data-[side=right]:[--kf-from:-8px_0]\",\n  \"data-[side=inline-end]:[--kf-from:-8px_0] data-[side=inline-start]:[--kf-from:8px_0]\",\n  \"data-starting-style:[translate:var(--kf-from,0_0)] data-starting-style:scale-[0.86] data-starting-style:opacity-0 data-starting-style:blur-[6px]\",\n  \"data-ending-style:scale-[0.96] data-ending-style:opacity-0 data-ending-style:blur-[2px]\",\n  \"data-ending-style:[transition:opacity_calc(150ms*var(--kf-speed,1))_var(--ease-house),scale_calc(150ms*var(--kf-speed,1))_var(--ease-house),translate_calc(150ms*var(--kf-speed,1))_var(--ease-house),filter_calc(150ms*var(--kf-speed,1))_var(--ease-house)]\",\n  /* Cascade */\n  \"[&>*:not([data-slot=menu-content])]:transition-[opacity,translate,filter] [&>*:not([data-slot=menu-content])]:duration-[calc(420ms*var(--kf-speed,1))] [&>*:not([data-slot=menu-content])]:ease-spring\",\n  \"[&>*:not([data-slot=menu-content])]:[transition-delay:calc((min(sibling-index(),10)-1)*calc(32ms*var(--kf-speed,1)))]\",\n  \"data-starting-style:[&>*:not([data-slot=menu-content])]:translate-y-2 data-starting-style:[&>*:not([data-slot=menu-content])]:opacity-0 data-starting-style:[&>*:not([data-slot=menu-content])]:blur-[4px]\",\n  \"data-ending-style:[&>*:not([data-slot=menu-content])]:[transition-delay:0ms]\",\n  \"motion-reduce:[&>*:not([data-slot=menu-content])]:[translate:none]! motion-reduce:[&>*:not([data-slot=menu-content])]:[filter:none]! data-starting-style:[&>*:not([data-slot=menu-content])]:[transition:none]\",\n  /* Glide */\n  \"relative isolate [anchor-scope:--kf-hl]\",\n  \"before:pointer-events-none before:absolute before:-z-10 before:hidden before:bg-[color-mix(in_oklch,currentColor_9%,transparent)]\",\n  \"before:[position-anchor:--kf-hl] before:top-[anchor(top)] before:right-[anchor(right)] before:bottom-[anchor(bottom)] before:left-[anchor(left)]\",\n  \"before:[transition:top_calc(260ms*var(--kf-speed,1))_var(--ease-spring),right_calc(260ms*var(--kf-speed,1))_var(--ease-spring),bottom_calc(260ms*var(--kf-speed,1))_var(--ease-spring),left_calc(260ms*var(--kf-speed,1))_var(--ease-spring),opacity_calc(150ms*var(--kf-speed,1))_var(--ease-house)]\",\n  \"has-[[data-highlighted],[data-slot=menu-trigger][data-open]]:before:block starting:before:opacity-0\",\n  \"motion-reduce:[transition:none]! motion-reduce:before:[transition:none]! motion-reduce:[&>*]:[transition:none]\",\n)\n\n/* A row anchors the highlight while it is highlighted. */\nconst row = \"data-highlighted:[anchor-name:--kf-hl]\"\n\n/* The bar carries its own highlight, anchored to the hovered or open trigger. */\nfunction Menubar({ className, ...props }: React.ComponentProps<typeof MenubarPart>) {\n  return (\n    <MenubarPart\n      className={cn(\n        \"relative isolate [anchor-scope:--kf-bar]\",\n        \"before:pointer-events-none before:absolute before:-z-10 before:hidden before:bg-[color-mix(in_oklch,currentColor_9%,transparent)]\",\n        \"before:[position-anchor:--kf-bar] before:top-[anchor(top)] before:right-[anchor(right)] before:bottom-[anchor(bottom)] before:left-[anchor(left)]\",\n        \"before:[transition:top_calc(300ms*var(--kf-speed,1))_var(--ease-spring),right_calc(300ms*var(--kf-speed,1))_var(--ease-spring),bottom_calc(300ms*var(--kf-speed,1))_var(--ease-spring),left_calc(300ms*var(--kf-speed,1))_var(--ease-spring),opacity_calc(150ms*var(--kf-speed,1))_var(--ease-house)]\",\n        \"has-[>[data-slot=menu-trigger]:hover,>[data-slot=menu-trigger][data-open],>[data-slot=menu-trigger]:focus-visible]:before:block starting:before:opacity-0\",\n        \"motion-reduce:before:[transition:none]!\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MenuTrigger({ className, ...props }: React.ComponentProps<typeof MenuTriggerPart>) {\n  return (\n    <MenuTriggerPart\n      className={cn(\n        \"hover:[anchor-name:--kf-bar] focus-visible:[anchor-name:--kf-bar] data-open:[anchor-name:--kf-bar]\",\n        \"transition-[scale] duration-[calc(200ms*var(--kf-speed,1))] ease-pop active:scale-[0.96] motion-reduce:transition-none!\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MenuContent<Payload = unknown>({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuContentPart<Payload>>) {\n  return <MenuContentPart<Payload> className={cn(sheet, className)} {...props} />\n}\n\nfunction MenuSubContent<Payload = unknown>({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuSubContentPart<Payload>>) {\n  return <MenuSubContentPart<Payload> className={cn(sheet, className)} {...props} />\n}\n\nfunction MenuItem({ className, ...props }: React.ComponentProps<typeof MenuItemPart>) {\n  return <MenuItemPart className={cn(row, className)} {...props} />\n}\n\nfunction MenuCheckboxItem({ className, ...props }: React.ComponentProps<typeof MenuCheckboxItemPart>) {\n  return <MenuCheckboxItemPart className={cn(row, className)} {...props} />\n}\n\nfunction MenuRadioItem({ className, ...props }: React.ComponentProps<typeof MenuRadioItemPart>) {\n  return <MenuRadioItemPart className={cn(row, className)} {...props} />\n}\n\n/* Keeps the highlight while its submenu is open; its chevron (the last svg) nudges toward it. */\nfunction MenuSubTrigger({ className, ...props }: React.ComponentProps<typeof MenuSubTriggerPart>) {\n  return (\n    <MenuSubTriggerPart\n      className={cn(\n        row,\n        \"data-open:[anchor-name:--kf-hl]\",\n        \"[&>svg:last-child]:transition-[translate] [&>svg:last-child]:duration-[calc(380ms*var(--kf-speed,1))] [&>svg:last-child]:ease-spring data-open:[&>svg:last-child]:translate-x-0.5 rtl:data-open:[&>svg:last-child]:-translate-x-0.5\",\n        \"motion-reduce:[&>svg:last-child]:transition-none\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\n/* Draw: the check's stroke draws in when its item turns on, and again as the sheet unfolds.\n   Works with any check path up to 24 units long (a 16 or 24 unit icon). */\nfunction MenuItemIndicator({ className, ...props }: React.ComponentProps<typeof MenuItemIndicatorPart>) {\n  return (\n    <MenuItemIndicatorPart\n      className={cn(\n        \"[&_:is(path,polyline)]:[stroke-dasharray:24] [&_:is(path,polyline)]:[stroke-dashoffset:24]\",\n        \"[&_:is(path,polyline)]:transition-[stroke-dashoffset] [&_:is(path,polyline)]:duration-[calc(260ms*var(--kf-speed,1))] [&_:is(path,polyline)]:ease-house\",\n        \"data-checked:[&_:is(path,polyline)]:[stroke-dashoffset:0] data-checked:[&_:is(path,polyline)]:delay-[calc(100ms*var(--kf-speed,1))]\",\n        \"data-checked:[&_:is(path,polyline)]:starting:[stroke-dashoffset:24]\",\n        \"group-data-starting-style/kf-menu:[&_:is(path,polyline)]:[stroke-dashoffset:24]!\",\n        \"motion-reduce:[&_:is(path,polyline)]:transition-none\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Menubar,\n  MenuCheckboxItem,\n  MenuContent,\n  MenuItem,\n  MenuItemIndicator,\n  MenuRadioItem,\n  MenuSubContent,\n  MenuSubTrigger,\n  MenuTrigger,\n}\n",
      "type": "registry:component",
      "target": "components/keyframery/primitives/menubar.tsx"
    },
    {
      "path": "registry/components/keyframery/menubar.tsx",
      "content": "\"use client\"\n\n/* Styled menubar: the animated primitive plus the Keyframery look. */\n\nimport {\n  Menu as MenuRoot,\n  MenuCheckboxItem as MenuCheckboxItemPart,\n  MenuContent as MenuContentPart,\n  MenuContextTrigger as MenuContextTriggerPart,\n  type MenuData,\n  MenuGroup as MenuGroupPart,\n  MenuGroupLabel as MenuGroupLabelPart,\n  MenuItem as MenuItemPart,\n  MenuItemIcon as MenuItemIconPart,\n  MenuItemIndicator as MenuItemIndicatorPart,\n  MenuRadioGroup as MenuRadioGroupPart,\n  MenuRadioItem as MenuRadioItemPart,\n  MenuSeparator as MenuSeparatorPart,\n  MenuShortcut as MenuShortcutPart,\n  MenuSub as MenuSubRoot,\n  MenuSubContent as MenuSubContentPart,\n  MenuSubTrigger as MenuSubTriggerPart,\n  MenuTrigger as MenuTriggerPart,\n  Menubar as MenubarRoot,\n} from \"@/components/keyframery/primitives/menubar\"\nimport * as React from \"react\"\n\nimport { cn } from \"@/lib/utils\"\n\n/* The sheet. Its motion (unfold, cascade, the gliding highlight) comes from the primitive;\n   here the highlight gets its colour and radius, and turns red under a destructive row. */\nconst sheet = cn(\n  \"m-0 max-h-(--available-height) min-w-44 overflow-y-auto overscroll-contain border-0 p-1.5 outline-none\",\n  \"rounded-[14px] bg-popover text-popover-foreground\",\n  \"shadow-[0_0_0_1px_rgb(0_0_0/0.06),0_2px_6px_-2px_rgb(0_0_0/0.08),0_12px_32px_-8px_rgb(0_0_0/0.18)]\",\n  \"dark:shadow-[0_0_0_1px_rgb(255_255_255/0.08),0_12px_32px_-8px_rgb(0_0_0/0.7)]\",\n  \"before:rounded-[8px] before:bg-accent\",\n  \"has-[[data-destructive][data-highlighted]]:before:bg-destructive/10\",\n  \"has-[[data-disabled][data-highlighted]]:before:bg-accent/50\",\n)\n\n/* One row for every kind of item. No background of its own: the sheet's highlight glides under it,\n   and that highlight is the focus indicator. */\nconst row = cn(\n  \"relative flex min-h-8 cursor-default items-center gap-2 rounded-[8px] px-2 py-1.5 text-[13px] leading-4 outline-none select-none\",\n  \"data-highlighted:text-accent-foreground\",\n  \"data-disabled:text-muted-foreground/60 data-disabled:data-highlighted:text-muted-foreground/60\",\n  /* Rows without an icon keep the icon column when another row in the same menu has one. */\n  \"[[data-has-icons]>&:not([data-has-icon])]:ps-8 [[data-has-icons]>[role=group]>&:not([data-has-icon])]:ps-8\",\n)\n\nconst shortcut = \"ms-auto ps-5 text-[12px] leading-4 tracking-[0.04em] text-muted-foreground\"\n\nfunction Chevron({ className }: { className?: string }) {\n  return (\n    <svg\n      viewBox=\"0 0 16 16\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.5\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden\n      className={className}\n    >\n      <path d=\"m6 3.5 4.5 4.5L6 12.5\" />\n    </svg>\n  )\n}\n\n/* The check. The primitive draws its stroke in. */\nfunction Check() {\n  return (\n    <svg\n      viewBox=\"0 0 16 16\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.5\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden\n      className=\"size-4\"\n    >\n      <path d=\"m3.5 8.5 3 3 6-7\" />\n    </svg>\n  )\n}\n\n/* The bar: plain, one tab stop. Its triggers sit flat on it until hovered or open. */\nfunction Menubar({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenubarRoot>) {\n  return (\n    <MenubarRoot\n      className={cn(\n        \"flex items-center gap-0.5 data-[orientation=vertical]:flex-col data-[orientation=vertical]:items-stretch\",\n        \"before:rounded-[8px] before:bg-accent\",\n        \"data-disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction Menu(props: React.ComponentProps<typeof MenuRoot>) {\n  return <MenuRoot {...props} />\n}\n\n/* A flat label on the bar. The bar's highlight glides under it on hover and while it is open. */\nfunction MenuTrigger({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuTriggerPart>) {\n  return (\n    <MenuTriggerPart\n      className={cn(\n        \"inline-flex h-7 shrink-0 cursor-default items-center justify-center gap-1.5 rounded-[8px] px-2.5 text-[13px] leading-none font-medium whitespace-nowrap text-foreground outline-none select-none [&_svg]:size-4 [&_svg]:shrink-0\",\n        \"hover:text-accent-foreground data-open:text-accent-foreground\",\n        \"focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n        \"aria-disabled:pointer-events-none aria-disabled:opacity-40 data-disabled:pointer-events-none data-disabled:opacity-40\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\n/* The area a right-click or a long press opens the menu from. It has no look of its own. */\nfunction MenuContextTrigger({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuContextTriggerPart>) {\n  return (\n    <MenuContextTriggerPart\n      className={cn(\n        \"outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MenuContent<Payload = unknown>({\n  className,\n  sideOffset = 6,\n  align = \"start\",\n  ...props\n}: React.ComponentProps<typeof MenuContentPart<Payload>>) {\n  return (\n    <MenuContentPart<Payload>\n      sideOffset={sideOffset}\n      align={align}\n      className={cn(sheet, className)}\n      {...props}\n    />\n  )\n}\n\nfunction MenuItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuItemPart>) {\n  return (\n    <MenuItemPart\n      className={cn(\n        row,\n        \"*:data-[slot=menu-shortcut]:ms-auto *:data-[slot=menu-shortcut]:ps-5 *:data-[slot=menu-shortcut]:text-[12px] *:data-[slot=menu-shortcut]:tracking-[0.04em] *:data-[slot=menu-shortcut]:text-muted-foreground\",\n        \"data-destructive:text-destructive data-destructive:data-highlighted:text-destructive\",\n        \"data-pending:cursor-progress data-pending:text-muted-foreground\",\n        \"data-pending:after:ms-auto data-pending:after:size-3 data-pending:after:shrink-0 data-pending:after:animate-spin data-pending:after:rounded-full data-pending:after:border-[1.5px] data-pending:after:border-current data-pending:after:border-t-transparent motion-reduce:data-pending:after:animate-none!\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MenuShortcut({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuShortcutPart>) {\n  return <MenuShortcutPart className={cn(shortcut, className)} {...props} />\n}\n\nfunction MenuCheckboxItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuCheckboxItemPart>) {\n  return <MenuCheckboxItemPart className={cn(row, className)} {...props} />\n}\n\nfunction MenuRadioGroup<T extends string = string>({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuRadioGroupPart<T>>) {\n  return <MenuRadioGroupPart<T> className={cn(className)} {...props} />\n}\n\nfunction MenuRadioItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuRadioItemPart>) {\n  return <MenuRadioItemPart className={cn(row, className)} {...props} />\n}\n\n/* The check of a checkbox or radio item, at the end of its row. It stays mounted so it can draw in and out. */\nfunction MenuItemIndicator({\n  className,\n  children,\n  keepMounted = true,\n  ...props\n}: React.ComponentProps<typeof MenuItemIndicatorPart>) {\n  return (\n    <MenuItemIndicatorPart\n      keepMounted={keepMounted}\n      className={cn(\n        \"order-last ms-auto flex size-4 shrink-0 items-center justify-center ps-0 [&>svg]:size-4\",\n        className,\n      )}\n      {...props}\n    >\n      {children ?? <Check />}\n    </MenuItemIndicatorPart>\n  )\n}\n\nfunction MenuItemIcon({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuItemIconPart>) {\n  return (\n    <MenuItemIconPart\n      className={cn(\n        \"flex size-4 shrink-0 items-center justify-center text-muted-foreground [&>svg]:size-4\",\n        \"in-data-destructive:text-current in-data-highlighted:text-current\",\n        \"rtl:data-mirror:-scale-x-100\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MenuGroup({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuGroupPart>) {\n  return <MenuGroupPart className={cn(className)} {...props} />\n}\n\nfunction MenuGroupLabel({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuGroupLabelPart>) {\n  return (\n    <MenuGroupLabelPart\n      className={cn(\n        \"px-2 pt-1.5 pb-1 text-[11px] leading-4 font-medium text-muted-foreground select-none\",\n        /* Lines up with the item text when the rows carry icons. */\n        \"[[data-has-icons]>&]:ps-8 [[data-has-icons]>[role=group]>&]:ps-8\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MenuSeparator({\n  className,\n  ...props\n}: React.ComponentProps<typeof MenuSeparatorPart>) {\n  return (\n    <MenuSeparatorPart\n      className={cn(\"-mx-1.5 my-1.5 h-px bg-border\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction MenuSub(props: React.ComponentProps<typeof MenuSubRoot>) {\n  return <MenuSubRoot {...props} />\n}\n\n/* A row that keeps its highlight while its submenu is open, with a chevron that points to it. */\nfunction MenuSubTrigger({\n  className,\n  children,\n  ...props\n}: Omit<React.ComponentProps<typeof MenuSubTriggerPart>, \"children\"> & {\n  children?: React.ReactNode\n}) {\n  return (\n    <MenuSubTriggerPart\n      className={cn(\n        row,\n        \"data-open:text-accent-foreground\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <Chevron className=\"ms-auto -me-0.5 size-4 shrink-0 text-muted-foreground rtl:-scale-x-100\" />\n    </MenuSubTriggerPart>\n  )\n}\n\nfunction MenuSubContent<Payload = unknown>({\n  className,\n  sideOffset = 8,\n  ...props\n}: React.ComponentProps<typeof MenuSubContentPart<Payload>>) {\n  return (\n    <MenuSubContentPart<Payload>\n      sideOffset={sideOffset}\n      className={cn(sheet, className)}\n      {...props}\n    />\n  )\n}\n\n/* Renders a menu written as data with the styled parts above. */\nfunction MenuItems({ items }: { items: MenuData }) {\n  return items.map((entry, index) => {\n    const item = typeof entry === \"string\" ? { value: entry, label: entry } : entry\n    if (!(\"type\" in item) || item.type === undefined || item.type === \"item\") {\n      return (\n        <MenuItem\n          key={item.value}\n          value={item.value}\n          disabled={item.disabled}\n          shortcut={item.shortcut}\n          closeOnSelect={item.closeOnSelect}\n          destructive={item.destructive}\n        >\n          {item.label}\n        </MenuItem>\n      )\n    }\n    switch (item.type) {\n      case \"separator\":\n        return <MenuSeparator key={`separator-${index}`} />\n      case \"group\":\n        return (\n          <MenuGroup key={`group-${index}`}>\n            {item.label && <MenuGroupLabel>{item.label}</MenuGroupLabel>}\n            <MenuItems items={item.items} />\n          </MenuGroup>\n        )\n      case \"checkbox\":\n        return (\n          <MenuCheckboxItem\n            key={item.value}\n            value={item.value}\n            disabled={item.disabled}\n            checked={item.checked}\n            defaultChecked={item.defaultChecked}\n            closeOnSelect={item.closeOnSelect}\n          >\n            {item.label}\n            <MenuItemIndicator />\n          </MenuCheckboxItem>\n        )\n      case \"radio-group\":\n        return (\n          <MenuRadioGroup\n            key={item.name}\n            name={item.name}\n            value={item.value}\n            defaultValue={item.defaultValue}\n          >\n            {item.label && <MenuGroupLabel>{item.label}</MenuGroupLabel>}\n            {item.items.map((radio) => (\n              <MenuRadioItem key={radio.value} value={radio.value} disabled={radio.disabled}>\n                {radio.label}\n                <MenuItemIndicator />\n              </MenuRadioItem>\n            ))}\n          </MenuRadioGroup>\n        )\n      case \"submenu\":\n        return (\n          <MenuSub key={`submenu-${index}`}>\n            <MenuSubTrigger disabled={item.disabled}>{item.label}</MenuSubTrigger>\n            <MenuSubContent>\n              <MenuItems items={item.items} />\n            </MenuSubContent>\n          </MenuSub>\n        )\n    }\n  })\n}\n\nexport { createMenuController, createMenubarController, type MenuData } from \"@/components/keyframery/primitives/menubar\"\nexport {\n  Menu,\n  Menubar,\n  MenuCheckboxItem,\n  MenuContent,\n  MenuContextTrigger,\n  MenuGroup,\n  MenuGroupLabel,\n  MenuItem,\n  MenuItemIcon,\n  MenuItemIndicator,\n  MenuItems,\n  MenuRadioGroup,\n  MenuRadioItem,\n  MenuSeparator,\n  MenuShortcut,\n  MenuSub,\n  MenuSubContent,\n  MenuSubTrigger,\n  MenuTrigger,\n}\n",
      "type": "registry:component",
      "target": "components/keyframery/menubar.tsx"
    }
  ],
  "type": "registry:component"
}