{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "dropdown",
  "type": "registry:ui",
  "title": "Dropdown",
  "description": "Minimal click-trigger dropdown menu with click outside dismissal and actions.",
  "registryDependencies": [
    "https://ui.arpitbhayani.me/r/aui.json"
  ],
  "files": [
    {
      "path": "ui/dropdown.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nexport interface DropdownProps extends React.HTMLAttributes<HTMLDivElement> {\n  trigger: React.ReactNode;\n  align?: \"left\" | \"right\";\n  children: React.ReactNode;\n  isOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n}\n\nexport function Dropdown({\n  trigger,\n  align = \"right\",\n  children,\n  className,\n  isOpen: controlledOpen,\n  onOpenChange,\n  ...props\n}: DropdownProps) {\n  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(false);\n  const isControlled = controlledOpen !== undefined;\n  const open = isControlled ? controlledOpen : uncontrolledOpen;\n  const containerRef = React.useRef<HTMLDivElement>(null);\n\n  const toggle = () => {\n    const next = !open;\n    if (!isControlled) setUncontrolledOpen(next);\n    onOpenChange?.(next);\n  };\n\n  const close = () => {\n    if (!isControlled) setUncontrolledOpen(false);\n    onOpenChange?.(false);\n  };\n\n  React.useEffect(() => {\n    if (!open) return;\n    const handleClickOutside = (e: MouseEvent) => {\n      if (containerRef.current && !containerRef.current.contains(e.target as Node)) {\n        close();\n      }\n    };\n    const handleKeyDown = (e: KeyboardEvent) => {\n      if (e.key === \"Escape\") {\n        close();\n      }\n    };\n    document.addEventListener(\"click\", handleClickOutside);\n    document.addEventListener(\"keydown\", handleKeyDown);\n    return () => {\n      document.removeEventListener(\"click\", handleClickOutside);\n      document.removeEventListener(\"keydown\", handleKeyDown);\n    };\n  }, [open]);\n\n  return (\n    <div\n      ref={containerRef}\n      className={cn(\"relative inline-flex\", className)}\n      {...props}\n    >\n      <div\n        className=\"inline-flex items-center gap-1 cursor-pointer\"\n        onClick={toggle}\n        aria-haspopup=\"menu\"\n        aria-expanded={open}\n      >\n        {trigger}\n      </div>\n      {open && (\n        <div\n          className={cn(\n            \"absolute top-[calc(100%+0.35rem)] min-w-[180px] bg-card border border-border rounded-md shadow-lg p-1.5 z-50 flex flex-col animate-in fade-in-0 zoom-in-95\",\n            align === \"left\" ? \"left-0\" : \"right-0\"\n          )}\n          role=\"menu\"\n        >\n          {children}\n        </div>\n      )}\n    </div>\n  );\n}\n\nexport interface DropdownItemProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  destructive?: boolean;\n}\n\nexport function DropdownItem({\n  destructive,\n  className,\n  children,\n  ...props\n}: DropdownItemProps) {\n  return (\n    <button\n      type=\"button\"\n      className={cn(\n        \"flex items-center gap-2 w-full px-3 py-1.5 text-sm font-medium text-left rounded cursor-pointer transition-colors text-foreground hover:bg-muted focus:bg-muted outline-none\",\n        destructive && \"text-red-500 hover:text-red-500 hover:bg-red-500/10 focus:bg-red-500/10\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </button>\n  );\n}\n\nexport function DropdownDivider({ className }: { className?: string }) {\n  return <div className={cn(\"h-px bg-border my-1\", className)} />;\n}\n\nexport function DropdownChevron({ className, ...props }: React.SVGProps<SVGSVGElement>) {\n  return (\n    <svg\n      width=\"12\"\n      height=\"12\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      className={cn(\"ml-1.5 h-3 w-3 shrink-0 text-muted-foreground transition-transform duration-150\", className)}\n      aria-hidden=\"true\"\n      {...props}\n    >\n      <path d=\"m6 9 6 6 6-6\" />\n    </svg>\n  );\n}\n",
      "type": "registry:ui"
    }
  ]
}