{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "dropdown-menu-glass",
  "type": "registry:ui",
  "title": "Dropdown Menu Glass",
  "description": "DropdownMenuGlass - Compound Component",
  "dependencies": [
    "@radix-ui/react-dropdown-menu",
    "lucide-react",
    "react",
    "shadcn-glass-ui"
  ],
  "registryDependencies": [
    "cn",
    "variants"
  ],
  "files": [
    {
      "path": "components/glass/ui/dropdown-menu-glass.tsx",
      "type": "registry:component",
      "content": "/**\n * DropdownMenuGlass - Compound Component\n *\n * Glass-themed dropdown menu following shadcn/ui compound component pattern.\n * Built on Radix UI primitives with unified glass styling and full keyboard navigation.\n *\n * ## Features\n * - **Compound Component API** - Root, Trigger, Content, Item, and more sub-components\n * - **Radix UI Primitives** - Built on @radix-ui/react-dropdown-menu for robust accessibility\n * - **Glassmorphism Styling** - Backdrop blur, glow effects, CSS variables\n * - **Theme Support** - Works with all 3 themes (glass, light, aurora)\n * - **shadcn/ui Compatible** - 100% API compatibility with shadcn/ui DropdownMenu\n * - **Rich Features** - Checkboxes, radio groups, sub-menus, labels, separators, shortcuts\n * - **Keyboard Accessible** - Full keyboard navigation (Tab, Arrow keys, Enter, Escape)\n * - **Variant Support** - Default and destructive item variants\n *\n * ## Sub-Components\n * - `DropdownMenuGlass` - Root context provider\n * - `DropdownMenuGlassTrigger` - Opens menu when clicked (supports asChild)\n * - `DropdownMenuGlassContent` - Main menu container with glass styling\n * - `DropdownMenuGlassItem` - Individual menu item (supports variant prop)\n * - `DropdownMenuGlassCheckboxItem` - Checkbox menu item with checked state\n * - `DropdownMenuGlassRadioItem` - Radio button menu item\n * - `DropdownMenuGlassRadioGroup` - Container for radio items\n * - `DropdownMenuGlassLabel` - Label for menu sections\n * - `DropdownMenuGlassSeparator` - Visual divider\n * - `DropdownMenuGlassGroup` - Groups related items\n * - `DropdownMenuGlassSub` - Sub-menu context\n * - `DropdownMenuGlassSubTrigger` - Opens sub-menu\n * - `DropdownMenuGlassSubContent` - Sub-menu content\n * - `DropdownMenuGlassShortcut` - Keyboard shortcut display\n *\n * ## CSS Variables\n * Customize styling via theme CSS variables:\n * - `--dropdown-bg` - Menu background color\n * - `--dropdown-border` - Menu border color\n * - `--dropdown-glow` - Menu box shadow\n * - `--dropdown-item-hover` - Item hover background\n * - `--dropdown-item-danger` - Destructive item color\n * - `--dropdown-item-danger-hover` - Destructive item hover background\n * - `--text-primary`, `--text-secondary`, `--text-muted` - Text colors\n * - `--blur-md` (16px) - Backdrop blur for menu\n *\n * @example Basic usage\n * ```tsx\n * import { DropdownMenuGlass, DropdownMenuGlassTrigger, DropdownMenuGlassContent, DropdownMenuGlassItem } from 'shadcn-glass-ui'\n *\n * <DropdownMenuGlass>\n *   <DropdownMenuGlassTrigger asChild>\n *     <Button>Open Menu</Button>\n *   </DropdownMenuGlassTrigger>\n *   <DropdownMenuGlassContent>\n *     <DropdownMenuGlassItem onSelect={() => console.log('Edit')}>\n *       <Edit className=\"mr-2 h-4 w-4\" />\n *       Edit\n *     </DropdownMenuGlassItem>\n *     <DropdownMenuGlassSeparator />\n *     <DropdownMenuGlassItem variant=\"destructive\">\n *       <Trash className=\"mr-2 h-4 w-4\" />\n *       Delete\n *     </DropdownMenuGlassItem>\n *   </DropdownMenuGlassContent>\n * </DropdownMenuGlass>\n * ```\n *\n * @example With labels and groups\n * ```tsx\n * <DropdownMenuGlass>\n *   <DropdownMenuGlassTrigger asChild>\n *     <Button variant=\"outline\">Options</Button>\n *   </DropdownMenuGlassTrigger>\n *   <DropdownMenuGlassContent>\n *     <DropdownMenuGlassLabel>Actions</DropdownMenuGlassLabel>\n *     <DropdownMenuGlassGroup>\n *       <DropdownMenuGlassItem>Copy</DropdownMenuGlassItem>\n *       <DropdownMenuGlassItem>Paste</DropdownMenuGlassItem>\n *     </DropdownMenuGlassGroup>\n *     <DropdownMenuGlassSeparator />\n *     <DropdownMenuGlassLabel>Danger Zone</DropdownMenuGlassLabel>\n *     <DropdownMenuGlassItem variant=\"destructive\">Delete</DropdownMenuGlassItem>\n *   </DropdownMenuGlassContent>\n * </DropdownMenuGlass>\n * ```\n *\n * @example With keyboard shortcuts\n * ```tsx\n * <DropdownMenuGlassContent>\n *   <DropdownMenuGlassItem>\n *     <Copy className=\"mr-2 h-4 w-4\" />\n *     Copy\n *     <DropdownMenuGlassShortcut>⌘C</DropdownMenuGlassShortcut>\n *   </DropdownMenuGlassItem>\n *   <DropdownMenuGlassItem>\n *     <Paste className=\"mr-2 h-4 w-4\" />\n *     Paste\n *     <DropdownMenuGlassShortcut>⌘V</DropdownMenuGlassShortcut>\n *   </DropdownMenuGlassItem>\n * </DropdownMenuGlassContent>\n * ```\n *\n * @example With checkboxes\n * ```tsx\n * const [showStatusBar, setShowStatusBar] = useState(true)\n *\n * <DropdownMenuGlassContent>\n *   <DropdownMenuGlassCheckboxItem\n *     checked={showStatusBar}\n *     onCheckedChange={setShowStatusBar}\n *   >\n *     Status Bar\n *   </DropdownMenuGlassCheckboxItem>\n * </DropdownMenuGlassContent>\n * ```\n *\n * @accessibility\n * - **Keyboard Navigation:** Full keyboard support with Tab, Arrow keys, Enter to select, Escape to close\n * - **Focus Management:** Auto-focus on open, returns focus to trigger on close\n * - **Screen Readers:** Proper ARIA attributes (role=\"menu\", aria-haspopup, aria-expanded)\n * - **Item Variants:** Destructive items have appropriate visual styling for dangerous actions\n * - **Checkboxes/Radio:** Proper indicator icons and checked state announcements\n * - **Sub-menus:** Arrow icon indicator and keyboard navigation support\n * - **Touch Targets:** All items meet minimum 44x44px touch target (WCAG 2.5.5)\n * - **Color Contrast:** All text meets WCAG AA contrast ratio 4.5:1 minimum\n *\n * @see https://www.radix-ui.com/primitives/docs/components/dropdown-menu\n * @since v1.0.0\n */\n\n'use client';\n\nimport * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport { CheckIcon, ChevronRightIcon, CircleIcon } from 'lucide-react';\nimport { cn } from '@/lib/utils';\nimport {\n  getDropdownContentStyles,\n  dropdownContentClasses,\n  getDropdownItemClasses,\n  dropdownSeparatorClasses,\n  dropdownLabelClasses,\n} from '@/lib/variants/dropdown-content-styles';\nimport '@/glass-theme.css';\n\n// ========================================\n// ROOT\n// ========================================\n\n// Note: DropdownMenuPrimitive.Root is a context provider and doesn't render DOM,\n// so data-slot is applied to Content instead. This matches shadcn/ui pattern.\nconst DropdownMenuGlassRoot = (\n  props: React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Root>\n) => <DropdownMenuPrimitive.Root {...props} />;\nDropdownMenuGlassRoot.displayName = 'DropdownMenuGlass';\n\nconst DropdownMenuGlass = DropdownMenuGlassRoot;\n\n// ========================================\n// TRIGGER\n// ========================================\n\nconst DropdownMenuGlassTrigger = React.forwardRef<\n  React.ComponentRef<typeof DropdownMenuPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger>\n>((props, ref) => (\n  <DropdownMenuPrimitive.Trigger data-slot=\"dropdown-menu-trigger\" ref={ref} {...props} />\n));\nDropdownMenuGlassTrigger.displayName = 'DropdownMenuGlassTrigger';\n\n// ========================================\n// GROUP\n// ========================================\n\nconst DropdownMenuGlassGroup = React.forwardRef<\n  React.ComponentRef<typeof DropdownMenuPrimitive.Group>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Group>\n>((props, ref) => (\n  <DropdownMenuPrimitive.Group data-slot=\"dropdown-menu-group\" ref={ref} {...props} />\n));\nDropdownMenuGlassGroup.displayName = 'DropdownMenuGlassGroup';\n\n// ========================================\n// PORTAL\n// ========================================\n\nconst DropdownMenuGlassPortal = DropdownMenuPrimitive.Portal;\n\n// ========================================\n// SUB\n// ========================================\n\n// Note: DropdownMenuPrimitive.Sub is a context provider and doesn't render DOM,\n// so data-slot is applied to SubContent instead. This matches shadcn/ui pattern.\nconst DropdownMenuGlassSub = (\n  props: React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Sub>\n) => <DropdownMenuPrimitive.Sub {...props} />;\nDropdownMenuGlassSub.displayName = 'DropdownMenuGlassSub';\n\n// ========================================\n// RADIO GROUP\n// ========================================\n\nconst DropdownMenuGlassRadioGroup = React.forwardRef<\n  React.ComponentRef<typeof DropdownMenuPrimitive.RadioGroup>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioGroup>\n>((props, ref) => (\n  <DropdownMenuPrimitive.RadioGroup data-slot=\"dropdown-menu-radio-group\" ref={ref} {...props} />\n));\nDropdownMenuGlassRadioGroup.displayName = 'DropdownMenuGlassRadioGroup';\n\n// ========================================\n// SUB TRIGGER\n// ========================================\n\nconst DropdownMenuGlassSubTrigger = React.forwardRef<\n  React.ComponentRef<typeof DropdownMenuPrimitive.SubTrigger>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n    inset?: boolean;\n  }\n>(({ className, inset, children, ...props }, ref) => (\n  <DropdownMenuPrimitive.SubTrigger\n    ref={ref}\n    data-slot=\"dropdown-menu-sub-trigger\"\n    className={cn(\n      getDropdownItemClasses(),\n      'data-[state=open]:bg-[var(--dropdown-item-hover)]',\n      inset && 'pl-8',\n      className\n    )}\n    {...props}\n  >\n    {children}\n    <ChevronRightIcon className=\"ml-auto h-4 w-4\" />\n  </DropdownMenuPrimitive.SubTrigger>\n));\nDropdownMenuGlassSubTrigger.displayName = 'DropdownMenuGlassSubTrigger';\n\n// ========================================\n// SUB CONTENT\n// ========================================\n\nconst DropdownMenuGlassSubContent = React.forwardRef<\n  React.ComponentRef<typeof DropdownMenuPrimitive.SubContent>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, ...props }, ref) => (\n  <DropdownMenuPrimitive.SubContent\n    ref={ref}\n    data-slot=\"dropdown-menu-sub-content\"\n    className={cn(dropdownContentClasses, 'p-1.5', className)}\n    style={getDropdownContentStyles()}\n    {...props}\n  />\n));\nDropdownMenuGlassSubContent.displayName = 'DropdownMenuGlassSubContent';\n\n// ========================================\n// CONTENT\n// ========================================\n\nconst DropdownMenuGlassContent = React.forwardRef<\n  React.ComponentRef<typeof DropdownMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>\n>(({ className, sideOffset = 8, ...props }, ref) => (\n  <DropdownMenuPrimitive.Portal>\n    <DropdownMenuPrimitive.Content\n      ref={ref}\n      data-slot=\"dropdown-menu-content\"\n      sideOffset={sideOffset}\n      className={cn(dropdownContentClasses, 'p-1.5', className)}\n      style={getDropdownContentStyles()}\n      {...props}\n    />\n  </DropdownMenuPrimitive.Portal>\n));\nDropdownMenuGlassContent.displayName = 'DropdownMenuGlassContent';\n\n// ========================================\n// ITEM\n// ========================================\n\n/**\n * Props for DropdownMenuGlassItem component.\n *\n * Individual menu item with support for icons, variants, and keyboard shortcuts.\n *\n * @example\n * ```tsx\n * const props: DropdownMenuGlassItemProps = {\n *   variant: 'destructive',\n *   onSelect: () => handleDelete(),\n *   children: (\n *     <>\n *       <Trash className=\"mr-2 h-4 w-4\" />\n *       Delete\n *     </>\n *   ),\n * };\n * ```\n */\nexport interface DropdownMenuGlassItemProps extends React.ComponentPropsWithoutRef<\n  typeof DropdownMenuPrimitive.Item\n> {\n  /**\n   * Adds left padding to align with items that have icons.\n   *\n   * @default false\n   */\n  inset?: boolean;\n\n  /**\n   * Visual variant of the menu item.\n   * - `default` - Standard menu item styling\n   * - `destructive` - Red styling for dangerous actions\n   *\n   * @default \"default\"\n   */\n  variant?: 'default' | 'destructive';\n}\n\nconst DropdownMenuGlassItem = React.forwardRef<\n  React.ComponentRef<typeof DropdownMenuPrimitive.Item>,\n  DropdownMenuGlassItemProps\n>(({ className, inset, variant = 'default', ...props }, ref) => (\n  <DropdownMenuPrimitive.Item\n    ref={ref}\n    data-slot=\"dropdown-menu-item\"\n    className={cn(\n      getDropdownItemClasses({ danger: variant === 'destructive' }),\n      inset && 'pl-8',\n      className\n    )}\n    {...props}\n  />\n));\nDropdownMenuGlassItem.displayName = 'DropdownMenuGlassItem';\n\n// ========================================\n// CHECKBOX ITEM\n// ========================================\n\nconst DropdownMenuGlassCheckboxItem = React.forwardRef<\n  React.ComponentRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n  <DropdownMenuPrimitive.CheckboxItem\n    ref={ref}\n    data-slot=\"dropdown-menu-checkbox-item\"\n    className={cn(getDropdownItemClasses(), 'pl-8 pr-2', className)}\n    checked={checked}\n    {...props}\n  >\n    <span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n      <DropdownMenuPrimitive.ItemIndicator>\n        <CheckIcon className=\"h-4 w-4\" />\n      </DropdownMenuPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </DropdownMenuPrimitive.CheckboxItem>\n));\nDropdownMenuGlassCheckboxItem.displayName = 'DropdownMenuGlassCheckboxItem';\n\n// ========================================\n// RADIO ITEM\n// ========================================\n\nconst DropdownMenuGlassRadioItem = React.forwardRef<\n  React.ComponentRef<typeof DropdownMenuPrimitive.RadioItem>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => (\n  <DropdownMenuPrimitive.RadioItem\n    ref={ref}\n    data-slot=\"dropdown-menu-radio-item\"\n    className={cn(getDropdownItemClasses(), 'pl-8 pr-2', className)}\n    {...props}\n  >\n    <span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n      <DropdownMenuPrimitive.ItemIndicator>\n        <CircleIcon className=\"h-2 w-2 fill-current\" />\n      </DropdownMenuPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </DropdownMenuPrimitive.RadioItem>\n));\nDropdownMenuGlassRadioItem.displayName = 'DropdownMenuGlassRadioItem';\n\n// ========================================\n// LABEL\n// ========================================\n\nconst DropdownMenuGlassLabel = React.forwardRef<\n  React.ComponentRef<typeof DropdownMenuPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n    inset?: boolean;\n  }\n>(({ className, inset, ...props }, ref) => (\n  <DropdownMenuPrimitive.Label\n    ref={ref}\n    data-slot=\"dropdown-menu-label\"\n    className={cn(dropdownLabelClasses, inset && 'pl-8', className)}\n    {...props}\n  />\n));\nDropdownMenuGlassLabel.displayName = 'DropdownMenuGlassLabel';\n\n// ========================================\n// SEPARATOR\n// ========================================\n\nconst DropdownMenuGlassSeparator = React.forwardRef<\n  React.ComponentRef<typeof DropdownMenuPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <DropdownMenuPrimitive.Separator\n    ref={ref}\n    data-slot=\"dropdown-menu-separator\"\n    className={cn(dropdownSeparatorClasses, '-mx-1 my-1', className)}\n    {...props}\n  />\n));\nDropdownMenuGlassSeparator.displayName = 'DropdownMenuGlassSeparator';\n\n// ========================================\n// SHORTCUT\n// ========================================\n\nconst DropdownMenuGlassShortcut = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n  return (\n    <span\n      data-slot=\"dropdown-menu-shortcut\"\n      className={cn('ml-auto text-xs tracking-widest text-(--text-muted)', className)}\n      {...props}\n    />\n  );\n};\nDropdownMenuGlassShortcut.displayName = 'DropdownMenuGlassShortcut';\n\n// ========================================\n// EXPORTS\n// ========================================\n\nexport {\n  DropdownMenuGlass,\n  DropdownMenuGlassTrigger,\n  DropdownMenuGlassContent,\n  DropdownMenuGlassItem,\n  DropdownMenuGlassCheckboxItem,\n  DropdownMenuGlassRadioItem,\n  DropdownMenuGlassLabel,\n  DropdownMenuGlassSeparator,\n  DropdownMenuGlassShortcut,\n  DropdownMenuGlassGroup,\n  DropdownMenuGlassPortal,\n  DropdownMenuGlassSub,\n  DropdownMenuGlassSubContent,\n  DropdownMenuGlassSubTrigger,\n  DropdownMenuGlassRadioGroup,\n};\n\n// ========================================\n// SHADCN/UI COMPATIBLE ALIASES\n// ========================================\n\n/**\n * shadcn/ui compatible aliases for DropdownMenuGlass components\n *\n * @example\n * ```tsx\n * import {\n *   DropdownMenu,\n *   DropdownMenuTrigger,\n *   DropdownMenuContent,\n *   DropdownMenuItem,\n * } from 'shadcn-glass-ui'\n *\n * <DropdownMenu>\n *   <DropdownMenuTrigger>Open</DropdownMenuTrigger>\n *   <DropdownMenuContent>\n *     <DropdownMenuItem>Profile</DropdownMenuItem>\n *     <DropdownMenuItem>Settings</DropdownMenuItem>\n *   </DropdownMenuContent>\n * </DropdownMenu>\n * ```\n * @since v2.5.0\n */\nexport const DropdownMenu = DropdownMenuGlass;\nexport const DropdownMenuTrigger = DropdownMenuGlassTrigger;\nexport const DropdownMenuContent = DropdownMenuGlassContent;\nexport const DropdownMenuItem = DropdownMenuGlassItem;\nexport const DropdownMenuCheckboxItem = DropdownMenuGlassCheckboxItem;\nexport const DropdownMenuRadioItem = DropdownMenuGlassRadioItem;\nexport const DropdownMenuLabel = DropdownMenuGlassLabel;\nexport const DropdownMenuSeparator = DropdownMenuGlassSeparator;\nexport const DropdownMenuShortcut = DropdownMenuGlassShortcut;\nexport const DropdownMenuGroup = DropdownMenuGlassGroup;\nexport const DropdownMenuPortal = DropdownMenuGlassPortal;\nexport const DropdownMenuSub = DropdownMenuGlassSub;\nexport const DropdownMenuSubContent = DropdownMenuGlassSubContent;\nexport const DropdownMenuSubTrigger = DropdownMenuGlassSubTrigger;\nexport const DropdownMenuRadioGroup = DropdownMenuGlassRadioGroup;\n"
    }
  ],
  "categories": [
    "ui"
  ],
  "cssVars": {
    "light": {
      "--glass-bg": "rgba(255, 255, 255, 0.1)",
      "--glass-border": "rgba(255, 255, 255, 0.2)",
      "--blur-sm": "8px",
      "--blur-md": "16px",
      "--blur-lg": "24px"
    },
    "dark": {
      "--glass-bg": "rgba(255, 255, 255, 0.05)",
      "--glass-border": "rgba(255, 255, 255, 0.1)",
      "--blur-sm": "8px",
      "--blur-md": "16px",
      "--blur-lg": "24px"
    }
  }
}