{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "context-menu",
  "title": "Context Menu",
  "description": "Right-click menus that spring out from the pointer.",
  "dependencies": [
    "lucide-react",
    "radix-ui"
  ],
  "registryDependencies": [
    "utils",
    "https://ui.cuelark.com/r/theme.json",
    "https://ui.cuelark.com/r/motion.json"
  ],
  "files": [
    {
      "path": "src/registry/cuelark/ui/context-menu.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { ContextMenu as ContextMenuPrimitive } from \"radix-ui\";\nimport { CheckIcon, ChevronRightIcon } from \"lucide-react\";\n\nimport { popIn, useMergedRef } from \"@/lib/motion\";\nimport { cn } from \"@/lib/utils\";\n\nconst surface =\n  \"z-50 min-w-[10rem] origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-xl bg-popover p-1 text-popover-foreground shadow-overlay ring-1 ring-foreground/10 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95\";\nconst item =\n  \"relative flex cursor-default items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-none select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground\";\n\nfunction ContextMenu(props: React.ComponentProps<typeof ContextMenuPrimitive.Root>) {\n  return <ContextMenuPrimitive.Root data-slot=\"context-menu\" {...props} />;\n}\n\nfunction ContextMenuTrigger(props: React.ComponentProps<typeof ContextMenuPrimitive.Trigger>) {\n  return <ContextMenuPrimitive.Trigger data-slot=\"context-menu-trigger\" {...props} />;\n}\n\n/** Opens at the pointer and springs out from that point (popIn reads Radix's side and origin). */\nfunction ContextMenuContent({ className, ref, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Content>) {\n  const mergedRef = useMergedRef(popIn, ref);\n  return (\n    <ContextMenuPrimitive.Portal>\n      <ContextMenuPrimitive.Content ref={mergedRef} data-slot=\"context-menu-content\" className={cn(surface, className)} {...props} />\n    </ContextMenuPrimitive.Portal>\n  );\n}\n\nfunction ContextMenuItem({ className, variant = \"default\", ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Item> & { variant?: \"default\" | \"destructive\" }) {\n  return <ContextMenuPrimitive.Item data-slot=\"context-menu-item\" data-variant={variant} className={cn(item, \"data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10\", className)} {...props} />;\n}\n\nfunction ContextMenuCheckboxItem({ className, children, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.CheckboxItem>) {\n  return (\n    <ContextMenuPrimitive.CheckboxItem data-slot=\"context-menu-checkbox-item\" className={cn(item, \"ps-8\", className)} {...props}>\n      <span className=\"absolute start-2 flex size-4 items-center justify-center\">\n        <ContextMenuPrimitive.ItemIndicator>\n          <CheckIcon className=\"!text-foreground\" />\n        </ContextMenuPrimitive.ItemIndicator>\n      </span>\n      {children}\n    </ContextMenuPrimitive.CheckboxItem>\n  );\n}\n\nfunction ContextMenuLabel({ className, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Label>) {\n  return <ContextMenuPrimitive.Label data-slot=\"context-menu-label\" className={cn(\"cue-label px-2 pt-2 pb-1\", className)} {...props} />;\n}\n\nfunction ContextMenuSeparator({ className, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Separator>) {\n  return <ContextMenuPrimitive.Separator data-slot=\"context-menu-separator\" className={cn(\"-mx-1 my-1 h-px bg-border\", className)} {...props} />;\n}\n\nfunction ContextMenuShortcut({ className, ...props }: React.ComponentProps<\"kbd\">) {\n  return <kbd data-slot=\"context-menu-shortcut\" className={cn(\"cue-kbd ms-auto\", className)} {...props} />;\n}\n\nfunction ContextMenuSub(props: React.ComponentProps<typeof ContextMenuPrimitive.Sub>) {\n  return <ContextMenuPrimitive.Sub data-slot=\"context-menu-sub\" {...props} />;\n}\n\nfunction ContextMenuSubTrigger({ className, children, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.SubTrigger>) {\n  return (\n    <ContextMenuPrimitive.SubTrigger data-slot=\"context-menu-sub-trigger\" className={cn(item, \"data-[state=open]:bg-accent\", className)} {...props}>\n      {children}\n      <ChevronRightIcon className=\"ms-auto\" />\n    </ContextMenuPrimitive.SubTrigger>\n  );\n}\n\nfunction ContextMenuSubContent({ className, ref, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.SubContent>) {\n  const mergedRef = useMergedRef(popIn, ref);\n  return <ContextMenuPrimitive.SubContent ref={mergedRef} data-slot=\"context-menu-sub-content\" className={cn(surface, className)} {...props} />;\n}\n\nexport {\n  ContextMenu,\n  ContextMenuTrigger,\n  ContextMenuContent,\n  ContextMenuItem,\n  ContextMenuCheckboxItem,\n  ContextMenuLabel,\n  ContextMenuSeparator,\n  ContextMenuShortcut,\n  ContextMenuSub,\n  ContextMenuSubTrigger,\n  ContextMenuSubContent,\n};\n",
      "type": "registry:ui"
    }
  ],
  "docs": "Docs and examples: https://ui.cuelark.com/components/context-menu",
  "categories": [
    "navigation"
  ],
  "type": "registry:ui"
}