{
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
"name": "dropdown-menu",
"title": "Dropdown menu",
"description": "A Base UI menu on the raised surface with the overlay shadow. Arrow keys move between items, skip disabled items and return focus on Escape. Items highlight with the accent wash; variant=\"destructive\" uses danger text at rest and a readable label on a danger fill while highlighted. Link items keep native navigation and close on activation. Supports groups, submenus, checkbox and radio items.",
"dependencies": [
"@base-ui/react@1.9.0",
"lucide-react@1.33.0"
],
"registryDependencies": [
"@waimakers/utils",
"@waimakers/theme"
],
"files": [
{
"path": "src/components/ui/dropdown-menu.tsx",
"content": "import { Menu as MenuPrimitive } from \"@base-ui/react/menu\";\nimport { CheckIcon, ChevronRightIcon } from \"lucide-react\";\nimport type * as React from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nconst DropdownMenu = MenuPrimitive.Root;\n\nfunction DropdownMenuTrigger({ ...props }: MenuPrimitive.Trigger.Props) {\n return ;\n}\n\nfunction DropdownMenuContent({\n align = \"start\",\n alignOffset = 0,\n side = \"bottom\",\n sideOffset = 4,\n className,\n ...props\n}: MenuPrimitive.Popup.Props &\n Pick) {\n return (\n \n \n \n \n \n );\n}\n\nfunction DropdownMenuGroup({ ...props }: MenuPrimitive.Group.Props) {\n return ;\n}\n\nfunction DropdownMenuLabel({\n className,\n inset,\n ...props\n}: MenuPrimitive.GroupLabel.Props & { inset?: boolean }) {\n return (\n \n );\n}\n\nconst dropdownMenuItemClassName = cn(\n \"group/dropdown-menu-item relative flex cursor-default items-center gap-2 rounded-sm px-2 py-2 text-sm text-foreground outline-none transition-colors select-none\",\n \"data-highlighted:bg-accent data-highlighted:text-accent-foreground\",\n \"data-disabled:pointer-events-none data-disabled:opacity-50\",\n \"data-inset:pl-7 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n);\n\nfunction DropdownMenuItem({\n className,\n inset,\n variant = \"default\",\n ...props\n}: MenuPrimitive.Item.Props & { inset?: boolean; variant?: \"default\" | \"destructive\" }) {\n return (\n \n );\n}\n\nfunction DropdownMenuLinkItem({\n className,\n inset,\n closeOnClick = true,\n ...props\n}: MenuPrimitive.LinkItem.Props & { inset?: boolean }) {\n return (\n \n );\n}\n\nconst DropdownMenuSub = MenuPrimitive.SubmenuRoot;\n\nfunction DropdownMenuSubTrigger({\n className,\n inset,\n children,\n ...props\n}: MenuPrimitive.SubmenuTrigger.Props & { inset?: boolean }) {\n return (\n \n {children}\n \n \n );\n}\n\nfunction DropdownMenuSubContent({\n align = \"start\",\n alignOffset = -3,\n side = \"right\",\n sideOffset = 0,\n className,\n ...props\n}: React.ComponentProps) {\n return (\n \n );\n}\n\nfunction DropdownMenuCheckboxItem({\n className,\n children,\n checked,\n inset,\n ...props\n}: MenuPrimitive.CheckboxItem.Props & { inset?: boolean }) {\n return (\n \n \n \n \n \n \n {children}\n \n );\n}\n\nfunction DropdownMenuRadioGroup({ ...props }: MenuPrimitive.RadioGroup.Props) {\n return ;\n}\n\nfunction DropdownMenuRadioItem({\n className,\n children,\n inset,\n ...props\n}: MenuPrimitive.RadioItem.Props & { inset?: boolean }) {\n return (\n \n \n \n \n \n \n {children}\n \n );\n}\n\nfunction DropdownMenuSeparator({ className, ...props }: MenuPrimitive.Separator.Props) {\n return (\n \n );\n}\n\nfunction DropdownMenuShortcut({ className, ...props }: React.ComponentProps<\"span\">) {\n return (\n \n );\n}\n\nexport {\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuLabel,\n DropdownMenuLinkItem,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubContent,\n DropdownMenuSubTrigger,\n DropdownMenuTrigger,\n};\n",
"type": "registry:ui",
"target": "components/ui/dropdown-menu.tsx"
}
],
"type": "registry:ui"
}