{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "dropdown-menu",
  "title": "Dropdown Menu",
  "description": "Action menus with 32px rows, checkable items and submenus.",
  "dependencies": [
    "@base-ui/react"
  ],
  "registryDependencies": [
    "https://ui.ndekocode.dev/r/theme.json",
    "https://ui.ndekocode.dev/r/utils.json",
    "https://ui.ndekocode.dev/r/icons.json",
    "https://ui.ndekocode.dev/r/recipes.json",
    "https://ui.ndekocode.dev/r/selected-mark.json"
  ],
  "files": [
    {
      "path": "registry/ndeko/ui/dropdown-menu.tsx",
      "content": "'use client';\n\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\n\nimport { ChevronRightIcon } from '@/registry/ndeko/lib/icons';\nimport {\n  MENU_ITEM,\n  MENU_ITEM_DESTRUCTIVE,\n  MENU_LABEL,\n  MENU_POPUP,\n  MENU_SEPARATOR,\n  MENU_SHORTCUT,\n} from '@/registry/ndeko/lib/recipes';\nimport { cn } from '@/registry/ndeko/lib/utils';\nimport { SelectedMark } from '@/registry/ndeko/ui/selected-mark';\n\ntype WithClassName<Props> = Omit<Props, 'className'> & { className?: string };\n\nconst ITEM_INDICATOR =\n  'absolute right-1.5 flex items-center transition-[scale,opacity] duration-150 ease-(--ease-out-strong) data-ending-style:scale-75 data-ending-style:opacity-0 data-starting-style:scale-75 data-starting-style:opacity-0';\n\nfunction DropdownMenu(props: MenuPrimitive.Root.Props) {\n  return <MenuPrimitive.Root data-slot='dropdown-menu' {...props} />;\n}\n\nfunction DropdownMenuTrigger(props: MenuPrimitive.Trigger.Props) {\n  return <MenuPrimitive.Trigger data-slot='dropdown-menu-trigger' {...props} />;\n}\n\ntype DropdownMenuContentProps = WithClassName<MenuPrimitive.Popup.Props> &\n  Pick<\n    MenuPrimitive.Positioner.Props,\n    'side' | 'sideOffset' | 'align' | 'alignOffset'\n  >;\n\nfunction DropdownMenuContent({\n  className,\n  side = 'bottom',\n  sideOffset = 6,\n  align = 'start',\n  alignOffset = 0,\n  ...props\n}: DropdownMenuContentProps) {\n  return (\n    <MenuPrimitive.Portal>\n      <MenuPrimitive.Positioner\n        side={side}\n        sideOffset={sideOffset}\n        align={align}\n        alignOffset={alignOffset}\n        className='z-50 outline-none'\n      >\n        <MenuPrimitive.Popup\n          data-slot='dropdown-menu-content'\n          className={cn(MENU_POPUP, className)}\n          {...props}\n        />\n      </MenuPrimitive.Positioner>\n    </MenuPrimitive.Portal>\n  );\n}\n\nfunction DropdownMenuGroup(props: MenuPrimitive.Group.Props) {\n  return <MenuPrimitive.Group data-slot='dropdown-menu-group' {...props} />;\n}\n\nfunction DropdownMenuLabel({\n  className,\n  inset,\n  ...props\n}: React.ComponentProps<'div'> & { inset?: boolean }) {\n  return (\n    <div\n      data-slot='dropdown-menu-label'\n      data-inset={inset}\n      className={cn(MENU_LABEL, 'data-inset:pl-8', className)}\n      {...props}\n    />\n  );\n}\n\nfunction DropdownMenuGroupLabel({\n  className,\n  ...props\n}: WithClassName<MenuPrimitive.GroupLabel.Props>) {\n  return (\n    <MenuPrimitive.GroupLabel\n      data-slot='dropdown-menu-group-label'\n      className={cn(MENU_LABEL, className)}\n      {...props}\n    />\n  );\n}\n\ntype DropdownMenuItemProps = WithClassName<MenuPrimitive.Item.Props> & {\n  inset?: boolean;\n  variant?: 'default' | 'destructive';\n};\n\nfunction DropdownMenuItem({\n  className,\n  inset,\n  variant = 'default',\n  ...props\n}: DropdownMenuItemProps) {\n  const isDestructive = variant === 'destructive';\n\n  return (\n    <MenuPrimitive.Item\n      data-slot='dropdown-menu-item'\n      data-inset={inset}\n      data-variant={variant}\n      className={cn(\n        MENU_ITEM,\n        isDestructive && MENU_ITEM_DESTRUCTIVE,\n        'data-inset:pl-8',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DropdownMenuCheckboxItem({\n  className,\n  children,\n  ...props\n}: WithClassName<MenuPrimitive.CheckboxItem.Props>) {\n  return (\n    <MenuPrimitive.CheckboxItem\n      data-slot='dropdown-menu-checkbox-item'\n      className={cn(MENU_ITEM, 'pr-8', className)}\n      {...props}\n    >\n      {children}\n      <MenuPrimitive.CheckboxItemIndicator className={ITEM_INDICATOR}>\n        <SelectedMark />\n      </MenuPrimitive.CheckboxItemIndicator>\n    </MenuPrimitive.CheckboxItem>\n  );\n}\n\nfunction DropdownMenuRadioGroup(props: MenuPrimitive.RadioGroup.Props) {\n  return (\n    <MenuPrimitive.RadioGroup\n      data-slot='dropdown-menu-radio-group'\n      {...props}\n    />\n  );\n}\n\nfunction DropdownMenuRadioItem({\n  className,\n  children,\n  ...props\n}: WithClassName<MenuPrimitive.RadioItem.Props>) {\n  return (\n    <MenuPrimitive.RadioItem\n      data-slot='dropdown-menu-radio-item'\n      className={cn(MENU_ITEM, 'pr-8', className)}\n      {...props}\n    >\n      {children}\n      <MenuPrimitive.RadioItemIndicator className={ITEM_INDICATOR}>\n        <SelectedMark />\n      </MenuPrimitive.RadioItemIndicator>\n    </MenuPrimitive.RadioItem>\n  );\n}\n\nfunction DropdownMenuSeparator({\n  className,\n  ...props\n}: WithClassName<MenuPrimitive.Separator.Props>) {\n  return (\n    <MenuPrimitive.Separator\n      data-slot='dropdown-menu-separator'\n      className={cn(MENU_SEPARATOR, className)}\n      {...props}\n    />\n  );\n}\n\nfunction DropdownMenuShortcut({\n  className,\n  ...props\n}: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot='dropdown-menu-shortcut'\n      className={cn(MENU_SHORTCUT, className)}\n      {...props}\n    />\n  );\n}\n\nfunction DropdownMenuSub(props: MenuPrimitive.SubmenuRoot.Props) {\n  return <MenuPrimitive.SubmenuRoot data-slot='dropdown-menu-sub' {...props} />;\n}\n\nfunction DropdownMenuSubTrigger({\n  className,\n  inset,\n  children,\n  ...props\n}: WithClassName<MenuPrimitive.SubmenuTrigger.Props> & { inset?: boolean }) {\n  return (\n    <MenuPrimitive.SubmenuTrigger\n      data-slot='dropdown-menu-sub-trigger'\n      data-inset={inset}\n      className={cn(\n        MENU_ITEM,\n        'data-popup-open:bg-foreground/5 data-inset:pl-8',\n        className\n      )}\n      {...props}\n    >\n      {children}\n      <ChevronRightIcon className='ml-auto size-3.5' />\n    </MenuPrimitive.SubmenuTrigger>\n  );\n}\n\nfunction DropdownMenuSubContent({\n  className,\n  sideOffset = 2,\n  alignOffset = -4,\n  ...props\n}: DropdownMenuContentProps) {\n  return (\n    <DropdownMenuContent\n      data-slot='dropdown-menu-sub-content'\n      side='right'\n      sideOffset={sideOffset}\n      alignOffset={alignOffset}\n      className={cn('min-w-40', className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuGroupLabel,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuShortcut,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n};\n",
      "type": "registry:ui"
    }
  ],
  "categories": [
    "primitives"
  ],
  "type": "registry:ui"
}