{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "dropdown-menu",
  "type": "registry:ui",
  "title": "DropdownMenu",
  "description": "Dropdown menu for actions, resources, labels, separators, and submenus.",
  "dependencies": [
    "@base-ui/react@^1.6.0"
  ],
  "registryDependencies": [
    "http://127.0.0.1:3000/r/core.json"
  ],
  "files": [
    {
      "path": "src/registry/sources/control-ui/ui/dropdown-menu.tsx",
      "target": "@components/control-ui/ui/dropdown-menu.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { Menu as MenuPrimitive } from \"@base-ui/react/menu\";\nimport type { ComponentProps } from \"react\";\nimport type {\n  DropdownMenuContentProps,\n  DropdownMenuItemProps,\n  DropdownMenuLabelProps,\n  DropdownMenuProps,\n  DropdownMenuSeparatorProps,\n  DropdownMenuTriggerProps,\n  DropdownMenuTriggerVariant,\n} from \"@/components/control-ui/contracts\";\nimport { controlSize, controlSurfaceClasses } from \"@/components/control-ui/control-variants\";\nimport { cn } from \"@/components/control-ui/lib/cn\";\nimport { skinEffects, skinFamily, skinId, skinSlot } from \"@/components/control-ui/skin\";\nimport { floatingListContentClasses, floatingListItemClasses } from \"@/components/control-ui/surface-variants\";\n\ntype RefinedDropdownMenuTriggerProps = DropdownMenuTriggerProps &\n  Pick<ComponentProps<typeof MenuPrimitive.Trigger>, \"nativeButton\" | \"render\">;\n\nexport function DropdownMenu({ children, ...props }: DropdownMenuProps) {\n  return <MenuPrimitive.Root {...props}>{children}</MenuPrimitive.Root>;\n}\n\nexport function DropdownMenuTrigger({\n  size = \"sm\",\n  iconOnly = false,\n  variant = \"surface\",\n  className,\n  children,\n  disabled,\n  ...props\n}: RefinedDropdownMenuTriggerProps) {\n  const skinClasses = skinSlot(\"dropdown-menu\", \"trigger\", { size, variant });\n  const variantClasses: Record<DropdownMenuTriggerVariant, string> = {\n    surface: controlSurfaceClasses,\n    ghost: \"text-foreground hover:bg-foreground/6\",\n  };\n  return (\n    <MenuPrimitive.Trigger\n      data-control-ui=\"dropdown-menu\"\n      data-slot=\"trigger\"\n      data-control=\"true\"\n      data-size={size}\n      data-icon-only={iconOnly ? \"true\" : undefined}\n      data-variant={variant}\n      className={cn(\n        \"relative isolate inline-flex shrink-0 cursor-pointer items-center justify-center overflow-visible rounded-[var(--radius-control)] font-medium outline-none transition focus-visible:ring-2 focus-visible:ring-foreground/20 disabled:cursor-not-allowed disabled:opacity-45\",\n        variantClasses[variant],\n        controlSize({ size }),\n        iconOnly && \"aspect-square px-0\",\n        skinClasses,\n        className,\n      )}\n      disabled={disabled}\n      {...props}\n    >\n      <span data-control-ui=\"button\" data-slot=\"content\" className=\"relative z-[1] inline-flex items-center justify-center gap-[inherit]\">\n        {children}\n      </span>\n    </MenuPrimitive.Trigger>\n  );\n}\n\nexport function DropdownMenuContent({ className, children, ...props }: DropdownMenuContentProps) {\n  const skinClasses = skinSlot(\"dropdown-menu\", \"content\", {});\n  return (\n    <MenuPrimitive.Portal>\n      {/* portal escapes every token-scoped ancestor, so scope is re-asserted here */}\n      <MenuPrimitive.Positioner\n        data-skin={skinId()}\n        data-effects={skinEffects()}\n        side=\"bottom\"\n        align=\"start\"\n        sideOffset={6}\n        className=\"z-[80] outline-none\"\n      >\n        <MenuPrimitive.Popup\n          data-control-ui=\"dropdown-menu\"\n          data-slot=\"content\"\n          data-surface=\"floating\"\n          data-popup-part=\"list-surface\"\n          className={cn(\n            \"min-w-[max(11rem,var(--anchor-width))]\",\n            floatingListContentClasses,\n            skinFamily(\"popup\", \"list-surface\"),\n            skinClasses,\n            className,\n          )}\n          {...props}\n        >\n          {children}\n        </MenuPrimitive.Popup>\n      </MenuPrimitive.Positioner>\n    </MenuPrimitive.Portal>\n  );\n}\n\nexport function DropdownMenuItem({ className, ...props }: DropdownMenuItemProps) {\n  const skinClasses = skinSlot(\"dropdown-menu\", \"item\", { disabled: Boolean(props.disabled) });\n  return (\n    <MenuPrimitive.Item\n      data-control-ui=\"dropdown-menu\"\n      data-slot=\"item\"\n      data-popup-part=\"item\"\n      className={cn(floatingListItemClasses, skinFamily(\"popup\", \"item\"), skinClasses, className)}\n      {...props}\n    />\n  );\n}\n\nexport function DropdownMenuSeparator({ className, ...props }: DropdownMenuSeparatorProps) {\n  const skinClasses = skinSlot(\"dropdown-menu\", \"separator\", {});\n  return (\n    // bleeds rule through popup padding so it spans edge to edge while rows keep their inset\n    <MenuPrimitive.Separator\n      data-control-ui=\"dropdown-menu\"\n      data-slot=\"separator\"\n      data-popup-part=\"separator\"\n      className={cn(\"-mx-[var(--popover-padding)] my-1 h-px bg-border\", skinFamily(\"popup\", \"separator\"), skinClasses, className)}\n      {...props}\n    />\n  );\n}\n\nexport function DropdownMenuLabel({ className, ...props }: DropdownMenuLabelProps) {\n  const skinClasses = skinSlot(\"dropdown-menu\", \"label\", {});\n  return (\n    <div\n      data-control-ui=\"dropdown-menu\"\n      data-slot=\"label\"\n      data-popup-part=\"label\"\n      className={cn(\n        \"px-2 py-1 text-micro font-medium uppercase tracking-[0.08em] text-muted-foreground\",\n        skinFamily(\"popup\", \"label\"),\n        skinClasses,\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n"
    }
  ],
  "meta": {}
}