@humain/ui 2.1.62 → 2.1.65

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (160) hide show
  1. package/dist/components/organisms/ai/AIToolCall/AIToolCall.d.ts +9 -3
  2. package/dist/components/organisms/ai/AIToolRun/index.d.ts +1 -1
  3. package/dist/components/organisms/ai/AIToolRun/validation.d.ts +24 -3
  4. package/dist/components/organisms/ai/_shared/format-ai-duration.d.ts +1 -0
  5. package/dist/components/organisms/ai/_shared/workflow-step-renderer.d.ts +1 -0
  6. package/dist/index.js +52 -52
  7. package/dist/index151.js +1 -1
  8. package/dist/index174.js +10 -333
  9. package/dist/index174.js.map +1 -1
  10. package/dist/index175.js +310 -137
  11. package/dist/index175.js.map +1 -1
  12. package/dist/index176.js +148 -174
  13. package/dist/index176.js.map +1 -1
  14. package/dist/index177.js +186 -78
  15. package/dist/index177.js.map +1 -1
  16. package/dist/index178.js +74 -124
  17. package/dist/index178.js.map +1 -1
  18. package/dist/index179.js +133 -1
  19. package/dist/index179.js.map +1 -0
  20. package/dist/index180.js +2 -201
  21. package/dist/index181.js +201 -0
  22. package/dist/{index180.js.map → index181.js.map} +1 -1
  23. package/dist/index183.js +130 -166
  24. package/dist/index183.js.map +1 -1
  25. package/dist/index184.js +195 -983
  26. package/dist/index184.js.map +1 -1
  27. package/dist/index185.js +1069 -369
  28. package/dist/index185.js.map +1 -1
  29. package/dist/index186.js +395 -197
  30. package/dist/index186.js.map +1 -1
  31. package/dist/index187.js +198 -243
  32. package/dist/index187.js.map +1 -1
  33. package/dist/index188.js +263 -3
  34. package/dist/index188.js.map +1 -1
  35. package/dist/index189.js +3 -209
  36. package/dist/index189.js.map +1 -1
  37. package/dist/index190.js +190 -777
  38. package/dist/index190.js.map +1 -1
  39. package/dist/index191.js +771 -252
  40. package/dist/index191.js.map +1 -1
  41. package/dist/index192.js +250 -65
  42. package/dist/index192.js.map +1 -1
  43. package/dist/index193.js +72 -523
  44. package/dist/index193.js.map +1 -1
  45. package/dist/index194.js +537 -144
  46. package/dist/index194.js.map +1 -1
  47. package/dist/index195.js +139 -720
  48. package/dist/index195.js.map +1 -1
  49. package/dist/index196.js +707 -167
  50. package/dist/index196.js.map +1 -1
  51. package/dist/index197.js +175 -151
  52. package/dist/index197.js.map +1 -1
  53. package/dist/index198.js +152 -487
  54. package/dist/index198.js.map +1 -1
  55. package/dist/index199.js +472 -225
  56. package/dist/index199.js.map +1 -1
  57. package/dist/index200.js +236 -260
  58. package/dist/index200.js.map +1 -1
  59. package/dist/index201.js +265 -215
  60. package/dist/index201.js.map +1 -1
  61. package/dist/index202.js +207 -307
  62. package/dist/index202.js.map +1 -1
  63. package/dist/index203.js +302 -135
  64. package/dist/index203.js.map +1 -1
  65. package/dist/index204.js +140 -271
  66. package/dist/index204.js.map +1 -1
  67. package/dist/index205.js +263 -253
  68. package/dist/index205.js.map +1 -1
  69. package/dist/index206.js +244 -137
  70. package/dist/index206.js.map +1 -1
  71. package/dist/index207.js +100 -238
  72. package/dist/index207.js.map +1 -1
  73. package/dist/index208.js +278 -74
  74. package/dist/index208.js.map +1 -1
  75. package/dist/index209.js +56 -97
  76. package/dist/index209.js.map +1 -1
  77. package/dist/index210.js +142 -47
  78. package/dist/index210.js.map +1 -1
  79. package/dist/index211.js +38 -84
  80. package/dist/index211.js.map +1 -1
  81. package/dist/index212.js +72 -252
  82. package/dist/index212.js.map +1 -1
  83. package/dist/index213.js +274 -26
  84. package/dist/index213.js.map +1 -1
  85. package/dist/index214.js +29 -94
  86. package/dist/index214.js.map +1 -1
  87. package/dist/index215.js +98 -25
  88. package/dist/index215.js.map +1 -1
  89. package/dist/index216.js +20 -565
  90. package/dist/index216.js.map +1 -1
  91. package/dist/index217.js +564 -17
  92. package/dist/index217.js.map +1 -1
  93. package/dist/index218.js +20 -23
  94. package/dist/index218.js.map +1 -1
  95. package/dist/index219.js +20 -95
  96. package/dist/index219.js.map +1 -1
  97. package/dist/index220.js +92 -88
  98. package/dist/index220.js.map +1 -1
  99. package/dist/index221.js +97 -29
  100. package/dist/index221.js.map +1 -1
  101. package/dist/index222.js +24 -470
  102. package/dist/index222.js.map +1 -1
  103. package/dist/index223.js +446 -196
  104. package/dist/index223.js.map +1 -1
  105. package/dist/index224.js +199 -729
  106. package/dist/index224.js.map +1 -1
  107. package/dist/index225.js +750 -61
  108. package/dist/index225.js.map +1 -1
  109. package/dist/index226.js +58 -181
  110. package/dist/index226.js.map +1 -1
  111. package/dist/index227.js +175 -259
  112. package/dist/index227.js.map +1 -1
  113. package/dist/index228.js +246 -172
  114. package/dist/index228.js.map +1 -1
  115. package/dist/index229.js +195 -32
  116. package/dist/index229.js.map +1 -1
  117. package/dist/index230.js +12 -40
  118. package/dist/index230.js.map +1 -1
  119. package/dist/index231.js +23 -26
  120. package/dist/index231.js.map +1 -1
  121. package/dist/index232.js +45 -22
  122. package/dist/index232.js.map +1 -1
  123. package/dist/index233.js +27 -48
  124. package/dist/index233.js.map +1 -1
  125. package/dist/index234.js +52 -26
  126. package/dist/index234.js.map +1 -1
  127. package/dist/index235.js +40 -225
  128. package/dist/index235.js.map +1 -1
  129. package/dist/index236.js +217 -39
  130. package/dist/index236.js.map +1 -1
  131. package/dist/index237.js +50 -0
  132. package/dist/index237.js.map +1 -0
  133. package/dist/styles.css +1 -1
  134. package/dist/wc/AIToolCall.js +218 -0
  135. package/dist/wc/AIToolCall.js.map +1 -0
  136. package/dist/wc/hf-ai-tool-call.js +34 -219
  137. package/dist/wc/hf-ai-tool-call.js.map +1 -1
  138. package/dist/wc/hf-ai-tool-run.js +673 -576
  139. package/dist/wc/hf-ai-tool-run.js.map +1 -1
  140. package/dist/wc/workflow-step-renderer.js +94 -86
  141. package/dist/wc/workflow-step-renderer.js.map +1 -1
  142. package/dist/wc-react/AIToolCall.js +218 -0
  143. package/dist/wc-react/AIToolCall.js.map +1 -0
  144. package/dist/wc-react/hf-ai-tool-call.js +32 -217
  145. package/dist/wc-react/hf-ai-tool-call.js.map +1 -1
  146. package/dist/wc-react/hf-ai-tool-run.js +698 -601
  147. package/dist/wc-react/hf-ai-tool-run.js.map +1 -1
  148. package/dist/wc-react/workflow-step-renderer.js +76 -68
  149. package/dist/wc-react/workflow-step-renderer.js.map +1 -1
  150. package/package.json +1 -1
  151. package/skills/humain-ui/SKILL.md +1 -1
  152. package/skills/humain-ui-wc/SKILL.md +1 -1
  153. package/skills/humain-ui-wc.skill +0 -0
  154. package/skills/humain-ui.skill +0 -0
  155. package/dist/index182.js +0 -143
  156. package/dist/index182.js.map +0 -1
  157. package/dist/wc/wrench.js +0 -10
  158. package/dist/wc/wrench.js.map +0 -1
  159. package/dist/wc-react/wrench.js +0 -10
  160. package/dist/wc-react/wrench.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"index205.js","names":[],"sources":["../src/components/organisms/menus/ContextMenu/ContextMenu.tsx"],"sourcesContent":["'use client';\n\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { Check, ChevronRight } from 'lucide-react';\nimport * as React from 'react';\nimport { useControllableState } from '@/hooks/use-controllable-state';\nimport { createSafeContext } from '@/lib/create-safe-context';\nimport { cn } from '@/lib/utils';\n\ninterface ContextMenuContextValue {\n open: boolean;\n setOpen: (open: boolean) => void;\n position: { x: number; y: number };\n setPosition: (position: { x: number; y: number }) => void;\n}\n\nexport interface ContextMenuAnchorPoint {\n x: number;\n y: number;\n}\n\nconst [ContextMenuContext, useContextMenuContext] =\n createSafeContext<ContextMenuContextValue>('ContextMenu');\n\n// ============================================\n// Root\n// ============================================\n\ninterface RootProps {\n children: React.ReactNode;\n anchorPoint?: ContextMenuAnchorPoint;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n}\n\nfunction Root({\n children,\n anchorPoint,\n open: controlledOpen,\n defaultOpen = false,\n onOpenChange,\n}: RootProps) {\n const [position, setPosition] = React.useState({ x: 0, y: 0 });\n\n const [open, setOpen] = useControllableState({\n value: controlledOpen,\n defaultValue: defaultOpen,\n onChange: onOpenChange,\n });\n\n return (\n <ContextMenuContext.Provider\n value={{\n open,\n setOpen,\n position: anchorPoint ?? position,\n setPosition,\n }}\n >\n <MenuPrimitive.Root\n data-slot=\"context-menu\"\n open={open}\n onOpenChange={setOpen}\n >\n {children}\n </MenuPrimitive.Root>\n </ContextMenuContext.Provider>\n );\n}\nRoot.displayName = 'ContextMenu.Root';\n\n// ============================================\n// Trigger\n// ============================================\n\ninterface TriggerProps\n extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onContextMenu'> {\n children: React.ReactNode;\n className?: string;\n disabled?: boolean;\n}\n\nfunction Trigger({\n children,\n className,\n disabled = false,\n onKeyDown: onKeyDownProp,\n ...props\n}: TriggerProps) {\n const { setOpen, setPosition } = useContextMenuContext();\n\n const handleContextMenu = React.useCallback(\n (event: React.MouseEvent) => {\n if (disabled) return;\n event.preventDefault();\n setPosition({ x: event.clientX, y: event.clientY });\n setOpen(true);\n },\n [disabled, setOpen, setPosition],\n );\n\n const handleKeyDown = React.useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n onKeyDownProp?.(event);\n if (event.defaultPrevented) return;\n if (disabled) return;\n if (event.key === 'F10' && event.shiftKey) {\n event.preventDefault();\n const rect = event.currentTarget.getBoundingClientRect();\n setPosition({\n x: rect.left + rect.width / 2,\n y: rect.top + rect.height / 2,\n });\n setOpen(true);\n }\n },\n [disabled, onKeyDownProp, setOpen, setPosition],\n );\n\n return (\n <button\n type=\"button\"\n data-slot=\"context-menu-trigger\"\n onContextMenu={handleContextMenu}\n onKeyDown={handleKeyDown}\n className={className}\n disabled={disabled}\n {...props}\n >\n {children}\n </button>\n );\n}\nTrigger.displayName = 'ContextMenu.Trigger';\n\n// ============================================\n// Portal\n// ============================================\n\nfunction Portal({ ...props }: MenuPrimitive.Portal.Props) {\n return <MenuPrimitive.Portal data-slot=\"context-menu-portal\" {...props} />;\n}\nPortal.displayName = 'ContextMenu.Portal';\n\nconst popupMotionClassName =\n 'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 motion-reduce:animate-none';\n\nconst popupSurfaceClassName =\n 'border border-border bg-popover text-popover-foreground rounded-lg p-1 shadow-sm duration-100 origin-(--transform-origin) outline-none';\n\nfunction isPortalContainerRef(\n container: MenuPrimitive.Portal.Props['container'],\n): container is React.RefObject<HTMLElement | ShadowRoot | null> {\n return (\n container !== null &&\n typeof container === 'object' &&\n 'current' in container\n );\n}\n\nfunction usePortalContainer(\n container: MenuPrimitive.Portal.Props['container'],\n): MenuPrimitive.Portal.Props['container'] {\n return React.useMemo(() => {\n if (container == null || isPortalContainerRef(container)) return container;\n return { current: container };\n }, [container]);\n}\n\nfunction resolvePortalContextElement(\n container: MenuPrimitive.Portal.Props['container'],\n): Element | undefined {\n const resolvedContainer = isPortalContainerRef(container)\n ? container.current\n : container;\n if (!resolvedContainer) return undefined;\n return 'host' in resolvedContainer\n ? resolvedContainer.host\n : resolvedContainer;\n}\n\n// ============================================\n// Popup (formerly Content)\n// ============================================\n\ninterface PopupProps extends Omit<MenuPrimitive.Popup.Props, 'anchor'> {\n alignOffset?: number;\n container?: MenuPrimitive.Portal.Props['container'];\n sideOffset?: number;\n}\n\nfunction Popup({\n alignOffset = 0,\n container,\n sideOffset = 0,\n className,\n ...props\n}: PopupProps) {\n const { position } = useContextMenuContext();\n const portalContainer = usePortalContainer(container);\n const portalContextElement = resolvePortalContextElement(container);\n\n // Create a virtual anchor at the cursor position\n const virtualAnchor = React.useMemo(\n () => ({\n contextElement: portalContextElement,\n getBoundingClientRect: () => ({\n x: position.x,\n y: position.y,\n width: 0,\n height: 0,\n top: position.y,\n right: position.x,\n bottom: position.y,\n left: position.x,\n toJSON: () => ({}),\n }),\n }),\n [portalContextElement, position.x, position.y],\n );\n\n return (\n <MenuPrimitive.Portal container={portalContainer}>\n <MenuPrimitive.Positioner\n data-anchor-x={position.x}\n data-anchor-y={position.y}\n data-slot=\"context-menu-positioner\"\n className=\"isolate z-50 outline-none\"\n anchor={virtualAnchor}\n side=\"bottom\"\n align=\"start\"\n sideOffset={sideOffset}\n alignOffset={alignOffset}\n collisionPadding={8}\n >\n <MenuPrimitive.Popup\n data-slot=\"context-menu-popup\"\n className={cn(\n popupMotionClassName,\n popupSurfaceClassName,\n 'min-w-32 z-50 max-h-(--available-height) overflow-x-hidden overflow-y-auto data-closed:overflow-hidden',\n className,\n )}\n {...props}\n />\n </MenuPrimitive.Positioner>\n </MenuPrimitive.Portal>\n );\n}\nPopup.displayName = 'ContextMenu.Popup';\n\n// ============================================\n// Group\n// ============================================\n\nfunction Group({ ...props }: MenuPrimitive.Group.Props) {\n return <MenuPrimitive.Group data-slot=\"context-menu-group\" {...props} />;\n}\nGroup.displayName = 'ContextMenu.Group';\n\n// ============================================\n// Label\n// ============================================\n\nfunction Label({\n className,\n inset,\n ...props\n}: MenuPrimitive.GroupLabel.Props & {\n inset?: boolean;\n}) {\n return (\n <MenuPrimitive.GroupLabel\n data-slot=\"context-menu-label\"\n data-inset={inset}\n className={cn(\n 'text-foreground px-2 py-1.5 text-sm leading-5 font-medium data-[inset]:ps-8',\n className,\n )}\n {...props}\n />\n );\n}\nLabel.displayName = 'ContextMenu.Label';\n\n// ============================================\n// Item\n// ============================================\n\nfunction Item({\n className,\n inset,\n variant = 'default',\n ...props\n}: MenuPrimitive.Item.Props & {\n inset?: boolean;\n variant?: 'default' | 'destructive';\n}) {\n return (\n <MenuPrimitive.Item\n data-slot=\"context-menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n \"focus:bg-accent focus:text-popover-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive not-data-[variant=destructive]:focus:**:text-popover-foreground gap-2 rounded-md px-2 py-1.5 text-base leading-6 [&_svg:not([class*='size-'])]:size-4 group/context-menu-item relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-[inset]:ps-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 transition-[color,background-color,transform] duration-150 ease-smooth active:scale-[0.99] motion-reduce:transition-none motion-reduce:active:scale-100\",\n className,\n )}\n {...props}\n />\n );\n}\nItem.displayName = 'ContextMenu.Item';\n\n// ============================================\n// Sub\n// ============================================\n\nfunction Sub({ ...props }: MenuPrimitive.SubmenuRoot.Props) {\n return <MenuPrimitive.SubmenuRoot data-slot=\"context-menu-sub\" {...props} />;\n}\nSub.displayName = 'ContextMenu.Sub';\n\n// ============================================\n// SubTrigger\n// ============================================\n\nfunction SubTrigger({\n className,\n inset,\n children,\n ...props\n}: MenuPrimitive.SubmenuTrigger.Props & {\n inset?: boolean;\n}) {\n return (\n <MenuPrimitive.SubmenuTrigger\n data-slot=\"context-menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n \"focus:bg-accent focus:text-popover-foreground data-open:bg-accent data-open:text-popover-foreground not-data-[variant=destructive]:focus:**:text-popover-foreground gap-2 rounded-md px-2 py-1.5 text-base leading-6 [&_svg:not([class*='size-'])]:size-4 group/ctx-sub flex cursor-default items-center outline-hidden select-none data-[inset]:ps-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 transition-[color,background-color,transform] duration-150 ease-smooth active:scale-[0.99] motion-reduce:transition-none motion-reduce:active:scale-100\",\n className,\n )}\n {...props}\n >\n {children}\n <ChevronRight className=\"ms-auto rtl:rotate-180 transition-transform duration-150 group-data-open/ctx-sub:translate-x-0.5\" />\n </MenuPrimitive.SubmenuTrigger>\n );\n}\nSubTrigger.displayName = 'ContextMenu.SubTrigger';\n\n// ============================================\n// SubPopup (formerly SubContent)\n// ============================================\n\nfunction SubPopup({\n className,\n container,\n ...props\n}: Omit<PopupProps, 'alignOffset' | 'sideOffset'> &\n Omit<MenuPrimitive.Popup.Props, 'anchor'>) {\n const portalContainer = usePortalContainer(container);\n\n return (\n <MenuPrimitive.Portal container={portalContainer}>\n <MenuPrimitive.Positioner\n className=\"isolate z-50 outline-none\"\n side=\"right\"\n align=\"start\"\n sideOffset={0}\n alignOffset={-3}\n >\n <MenuPrimitive.Popup\n data-slot=\"context-menu-sub-popup\"\n className={cn(\n popupMotionClassName,\n 'data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',\n popupSurfaceClassName,\n 'min-w-[96px] w-auto',\n className,\n )}\n {...props}\n />\n </MenuPrimitive.Positioner>\n </MenuPrimitive.Portal>\n );\n}\nSubPopup.displayName = 'ContextMenu.SubPopup';\n\n// ============================================\n// CheckboxItem\n// ============================================\n\nfunction CheckboxItem({\n className,\n children,\n checked,\n ...props\n}: MenuPrimitive.CheckboxItem.Props) {\n return (\n <MenuPrimitive.CheckboxItem\n data-slot=\"context-menu-checkbox-item\"\n className={cn(\n \"focus:bg-accent focus:text-popover-foreground focus:**:text-popover-foreground gap-2 rounded-md py-1.5 pe-2 ps-8 text-base leading-6 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 transition-colors duration-150 ease-smooth motion-reduce:transition-none\",\n className,\n )}\n checked={checked}\n {...props}\n >\n <span\n className=\"pointer-events-none absolute start-2 flex size-4 items-center justify-center\"\n data-slot=\"context-menu-checkbox-item-indicator\"\n >\n <MenuPrimitive.CheckboxItemIndicator className=\"animate-in zoom-in-75 duration-150 motion-reduce:animate-none\">\n <Check />\n </MenuPrimitive.CheckboxItemIndicator>\n </span>\n {children}\n </MenuPrimitive.CheckboxItem>\n );\n}\nCheckboxItem.displayName = 'ContextMenu.CheckboxItem';\n\n// ============================================\n// RadioGroup\n// ============================================\n\nfunction RadioGroup({ ...props }: MenuPrimitive.RadioGroup.Props) {\n return (\n <MenuPrimitive.RadioGroup data-slot=\"context-menu-radio-group\" {...props} />\n );\n}\nRadioGroup.displayName = 'ContextMenu.RadioGroup';\n\n// ============================================\n// RadioItem\n// ============================================\n\nfunction RadioItem({\n className,\n children,\n ...props\n}: MenuPrimitive.RadioItem.Props) {\n return (\n <MenuPrimitive.RadioItem\n data-slot=\"context-menu-radio-item\"\n className={cn(\n \"focus:bg-accent focus:text-popover-foreground focus:**:text-popover-foreground gap-2 rounded-md py-1.5 pe-2 ps-8 text-base leading-6 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 transition-colors duration-150 ease-smooth motion-reduce:transition-none\",\n className,\n )}\n {...props}\n >\n <span\n className=\"pointer-events-none absolute start-2 flex size-4 items-center justify-center\"\n data-slot=\"context-menu-radio-item-indicator\"\n >\n <MenuPrimitive.RadioItemIndicator className=\"animate-in zoom-in-75 duration-150 motion-reduce:animate-none\">\n <Check />\n </MenuPrimitive.RadioItemIndicator>\n </span>\n {children}\n </MenuPrimitive.RadioItem>\n );\n}\nRadioItem.displayName = 'ContextMenu.RadioItem';\n\n// ============================================\n// Separator\n// ============================================\n\nfunction Separator({ className, ...props }: MenuPrimitive.Separator.Props) {\n return (\n <MenuPrimitive.Separator\n data-slot=\"context-menu-separator\"\n className={cn('bg-border my-1 h-px', className)}\n {...props}\n />\n );\n}\nSeparator.displayName = 'ContextMenu.Separator';\n\n// ============================================\n// Shortcut\n// ============================================\n\nfunction Shortcut({ className, ...props }: React.ComponentProps<'span'>) {\n return (\n <span\n data-slot=\"context-menu-shortcut\"\n className={cn(\n 'text-muted-foreground group-focus/context-menu-item:text-popover-foreground ms-auto text-xs tracking-widest transition-colors duration-150 ease-smooth motion-reduce:transition-none',\n className,\n )}\n {...props}\n />\n );\n}\nShortcut.displayName = 'ContextMenu.Shortcut';\n\n// ============================================\n// Type exports\n// ============================================\n\nexport type ContextMenuRootProps = RootProps;\nexport type ContextMenuTriggerProps = TriggerProps;\nexport type ContextMenuPopupProps = PopupProps;\n\n// ============================================\n// Compound component via dot notation (ADR-011)\n// ============================================\n\nconst ContextMenu = Object.assign(Root, {\n Root,\n Trigger,\n Portal,\n Popup,\n Group,\n Label,\n Item,\n Sub,\n SubTrigger,\n SubPopup,\n CheckboxItem,\n RadioGroup,\n RadioItem,\n Separator,\n Shortcut,\n});\n\nexport {\n CheckboxItem as ContextMenuCheckboxItem,\n ContextMenu,\n Group as ContextMenuGroup,\n Item as ContextMenuItem,\n Label as ContextMenuLabel,\n Popup as ContextMenuPopup,\n Portal as ContextMenuPortal,\n RadioGroup as ContextMenuRadioGroup,\n RadioItem as ContextMenuRadioItem,\n // Sub-components with ContextMenu prefix for direct imports\n Root as ContextMenuRoot,\n Separator as ContextMenuSeparator,\n Shortcut as ContextMenuShortcut,\n Sub as ContextMenuSub,\n SubPopup as ContextMenuSubPopup,\n SubTrigger as ContextMenuSubTrigger,\n Trigger as ContextMenuTrigger,\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"index205.js","names":[],"sources":["../src/components/organisms/menus/CommandMenu/CommandMenu.tsx"],"sourcesContent":["'use client';\n\nimport {\n ArrowDown,\n ArrowUp,\n CornerDownLeft,\n Search,\n Settings,\n} from 'lucide-react';\nimport * as React from 'react';\nimport { Button, ClearButton } from '@/components/atoms/buttons/Button';\nimport { Avatar } from '@/components/molecules/data/Avatar';\nimport { Kbd } from '@/components/molecules/data/Kbd';\nimport {\n Command,\n CommandDialog,\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n CommandSeparator,\n} from '@/components/ui/command';\nimport { cn } from '@/lib/utils';\n\nconst DEFAULT_COMMAND_MENU_MAX_HEIGHT = 336;\nconst DEFAULT_COMMAND_MENU_PLACEHOLDER = 'Type a command or search...';\nconst COMMAND_MENU_SHELL_CLASS_NAME =\n 'w-full max-w-[508px] overflow-hidden rounded-xl border border-input bg-background shadow-lg';\n\nfunction getCommandMenuMaxHeight(maxHeight: number): number {\n return Number.isFinite(maxHeight) && maxHeight >= 0\n ? maxHeight\n : DEFAULT_COMMAND_MENU_MAX_HEIGHT;\n}\n\n// ============================================\n// Types\n// ============================================\n\nexport interface CommandMenuOption {\n /** Unique identifier for the option */\n id: string;\n /** Display label for the option */\n label: string;\n /** Optional subtitle (e.g., @username, email) */\n subtitle?: string;\n /** Optional icon to display (mutually exclusive with avatar) */\n icon?: React.ReactNode;\n /** Optional avatar configuration */\n avatar?: {\n src?: string;\n fallback?: string;\n };\n /** Whether the option is disabled */\n disabled?: boolean;\n /** Keyboard shortcut to display */\n shortcut?: string;\n}\n\nexport interface CommandMenuGroup {\n /** Unique identifier for the group */\n id: string;\n /** Group label/heading */\n label: string;\n /** Options in this group */\n options: CommandMenuOption[];\n}\n\nexport interface CommandMenuFooterHint {\n /** Icon or keyboard key indicator */\n keys: React.ReactNode;\n /** Text describing the action */\n label: string;\n}\n\nexport interface CommandMenuProps {\n /** Whether the command menu is open */\n open?: boolean;\n /** Callback when open state changes */\n onOpenChange?: (open: boolean) => void;\n /** Placeholder text for the search input */\n placeholder?: string;\n /** Text to show when no results found */\n emptyText?: string;\n /** Empty state content (replaces emptyText when provided) */\n emptyState?: React.ReactNode;\n /** Flat list of options */\n options?: CommandMenuOption[];\n /** Grouped options */\n groups?: CommandMenuGroup[];\n /** Callback when an option is selected */\n onSelect?: (id: string, option: CommandMenuOption) => void;\n /** Whether to show keyboard shortcut badge in input */\n showShortcut?: boolean;\n /** Keyboard shortcut text to display (auto-detects platform when omitted) */\n shortcutText?: string;\n /** Whether to show the footer with navigation hints */\n showFooter?: boolean;\n /** Custom footer hints */\n footerHints?: CommandMenuFooterHint[];\n /** Whether to show settings button in footer */\n showSettingsButton?: boolean;\n /** Callback when settings button is clicked */\n onSettingsClick?: () => void;\n /** Additional class name for the dialog */\n className?: string;\n /** Maximum height of the list */\n maxHeight?: number;\n /** Custom filter function */\n filter?: (value: string, search: string) => number;\n /** Children for custom content */\n children?: React.ReactNode;\n}\n\n// ============================================\n// Platform detection\n// ============================================\n\nfunction usePlatformShortcut() {\n const [shortcut, setShortcut] = React.useState('\\u2318/');\n React.useEffect(() => {\n if (!/Mac|iPhone|iPad/i.test(navigator.userAgent)) {\n setShortcut('Ctrl /');\n }\n }, []);\n return shortcut;\n}\n\n// ============================================\n// Keyboard Shortcut Badge (uses Kbd wrapper)\n// ============================================\n\nfunction CommandShortcutBadge({\n children,\n className,\n}: {\n children: React.ReactNode;\n className?: string;\n}) {\n return (\n <Kbd variant=\"solid\" size=\"sm\" className={cn('shadow-xs', className)}>\n {children}\n </Kbd>\n );\n}\nCommandShortcutBadge.displayName = 'CommandMenu.ShortcutBadge';\n\n// ============================================\n// Footer Navigation Icon (uses Kbd wrapper)\n// ============================================\n\nfunction FooterNavIcon({\n children,\n className,\n}: {\n children: React.ReactNode;\n className?: string;\n}) {\n return (\n <Kbd variant=\"footer\" size=\"sm\" className={cn('p-1.5', className)}>\n {children}\n </Kbd>\n );\n}\nFooterNavIcon.displayName = 'CommandMenu.FooterNavIcon';\n\nfunction FooterNavText({\n children,\n className,\n}: {\n children: React.ReactNode;\n className?: string;\n}) {\n return (\n <span\n className={cn('text-sm font-semibold text-text-quaternary', className)}\n >\n {children}\n </span>\n );\n}\nFooterNavText.displayName = 'CommandMenu.FooterNavText';\n\n// ============================================\n// Default Footer Hints\n// ============================================\n\nconst defaultFooterHints: CommandMenuFooterHint[] = [\n {\n keys: (\n <div className=\"flex items-center gap-1\">\n <FooterNavIcon>\n <ArrowUp className=\"size-2.5 text-text-quaternary\" />\n </FooterNavIcon>\n <FooterNavIcon>\n <ArrowDown className=\"size-2.5 text-text-quaternary\" />\n </FooterNavIcon>\n </div>\n ),\n label: 'to navigate',\n },\n {\n keys: (\n <FooterNavIcon>\n <CornerDownLeft className=\"size-2.5 text-text-quaternary\" />\n </FooterNavIcon>\n ),\n label: 'to select',\n },\n {\n keys: (\n <FooterNavIcon className=\"px-1.5 py-1\">\n <span className=\"text-xs font-semibold text-text-quaternary\">esc</span>\n </FooterNavIcon>\n ),\n label: 'to close',\n },\n];\n\n// ============================================\n// Command Menu Footer\n// ============================================\n\nexport interface CommandMenuFooterProps {\n hints?: CommandMenuFooterHint[];\n showSettingsButton?: boolean;\n onSettingsClick?: () => void;\n className?: string;\n}\n\nfunction CommandMenuFooter({\n hints = defaultFooterHints,\n showSettingsButton = false,\n onSettingsClick,\n className,\n}: CommandMenuFooterProps) {\n return (\n <div\n data-slot=\"command-menu-footer\"\n className={cn(\n 'flex items-center gap-3 border-t border-border bg-card/80 py-2 pe-2 ps-[18px] supports-backdrop-filter:backdrop-blur',\n className,\n )}\n >\n <div className=\"hidden flex-1 items-start gap-4 [@media(hover:hover)]:flex\">\n {hints.map((hint) => (\n <div key={hint.label} className=\"flex items-center gap-2\">\n {hint.keys}\n <FooterNavText>{hint.label}</FooterNavText>\n </div>\n ))}\n </div>\n {showSettingsButton && (\n <Button\n appearance=\"ghost\"\n variant=\"secondary\"\n size=\"icon\"\n className=\"group ms-auto rounded-full bg-muted\"\n onClick={onSettingsClick}\n aria-label=\"Settings\"\n >\n <Settings className=\"size-5 text-muted-foreground transition-transform duration-300 ease-out group-hover:rotate-90 motion-reduce:transition-none\" />\n </Button>\n )}\n </div>\n );\n}\nCommandMenuFooter.displayName = 'CommandMenu.Footer';\n\n// ============================================\n// Command Menu Item\n// ============================================\n\nexport interface CommandMenuItemProps\n extends Omit<\n React.ComponentProps<typeof CommandItem>,\n 'onSelect' | 'showCheckIndicator' | 'value'\n > {\n option: CommandMenuOption;\n onSelect?: (id: string, option: CommandMenuOption) => void;\n}\n\nfunction CommandMenuItem({\n option,\n onSelect,\n className,\n ...props\n}: CommandMenuItemProps) {\n return (\n <CommandItem\n value={option.id}\n disabled={option.disabled}\n showCheckIndicator={false}\n onSelect={() => onSelect?.(option.id, option)}\n className={cn(\n 'flex cursor-pointer items-center gap-2 transition-colors duration-150 motion-reduce:transition-none',\n className,\n )}\n {...props}\n >\n {option.avatar && (\n <Avatar\n src={option.avatar.src}\n fallback={option.avatar.fallback || option.label.charAt(0)}\n size=\"sm\"\n className=\"size-6 shrink-0\"\n />\n )}\n {option.icon && !option.avatar && (\n <span className=\"flex size-4 shrink-0 items-center justify-center text-muted-foreground [&_svg]:size-4\">\n {option.icon}\n </span>\n )}\n <div className=\"flex min-w-0 flex-1 items-center gap-2 text-sm leading-5\">\n <span className=\"min-w-0 truncate font-normal text-foreground\">\n {option.label}\n </span>\n {option.subtitle && (\n <span className=\"min-w-0 truncate font-normal text-muted-foreground\">\n {option.subtitle}\n </span>\n )}\n </div>\n {option.shortcut && (\n <CommandShortcutBadge className=\"transition-colors duration-150 group-data-[selected=true]/command-item:bg-primary/10 group-data-[selected=true]/command-item:text-primary\">\n {option.shortcut}\n </CommandShortcutBadge>\n )}\n </CommandItem>\n );\n}\nCommandMenuItem.displayName = 'CommandMenu.Item';\n\n// ============================================\n// Command Menu Group Header\n// ============================================\n\nfunction CommandMenuGroupHeader({\n children,\n className,\n ...props\n}: React.ComponentProps<'h3'>) {\n return (\n <h3\n data-slot=\"command-menu-group-header\"\n className={cn(\n 'px-2 py-1.5 text-xs font-medium text-muted-foreground',\n className,\n )}\n {...props}\n >\n {children}\n </h3>\n );\n}\nCommandMenuGroupHeader.displayName = 'CommandMenu.GroupHeader';\n\n// ============================================\n// Shared Command Menu Body (internal)\n// ============================================\n\ninterface CommandMenuBodyProps {\n children?: React.ReactNode;\n groups: CommandMenuGroup[];\n options: CommandMenuOption[];\n onSelect?: (id: string, option: CommandMenuOption) => void;\n onClose?: () => void;\n placeholder: string;\n emptyText: string;\n emptyState?: React.ReactNode;\n showShortcut: boolean;\n shortcutText: string;\n showFooter: boolean;\n footerHints?: CommandMenuFooterHint[];\n showSettingsButton: boolean;\n onSettingsClick?: () => void;\n maxHeight: number;\n filter?: (value: string, search: string) => number;\n}\n\ninterface CommandMenuBodyContentProps {\n children?: React.ReactNode;\n groups: CommandMenuGroup[];\n options: CommandMenuOption[];\n optionRenderer: (option: CommandMenuOption) => React.ReactNode;\n}\n\ninterface CommandMenuGroupSectionProps {\n group: CommandMenuGroup;\n optionRenderer: (option: CommandMenuOption) => React.ReactNode;\n}\n\nfunction CommandMenuGroupSection({\n group,\n optionRenderer,\n}: CommandMenuGroupSectionProps) {\n const headingId = React.useId();\n\n return (\n <CommandGroup aria-labelledby={headingId} className=\"px-2 py-1\">\n <CommandMenuGroupHeader id={headingId}>\n {group.label}\n </CommandMenuGroupHeader>\n <div className=\"flex flex-col\">{group.options.map(optionRenderer)}</div>\n </CommandGroup>\n );\n}\nCommandMenuGroupSection.displayName = 'CommandMenu.GroupSection';\n\nfunction CommandMenuBodyContent({\n children,\n groups,\n options,\n optionRenderer,\n}: CommandMenuBodyContentProps) {\n if (children) return children;\n\n if (groups.length > 0) {\n return groups.map((group, index) => (\n <React.Fragment key={group.id}>\n {index > 0 && <CommandSeparator className=\"mx-0\" />}\n <CommandMenuGroupSection\n group={group}\n optionRenderer={optionRenderer}\n />\n </React.Fragment>\n ));\n }\n\n return <div className=\"flex flex-col p-2\">{options.map(optionRenderer)}</div>;\n}\n\nfunction CommandMenuBody({\n children,\n groups,\n options,\n onSelect,\n onClose,\n placeholder,\n emptyText,\n emptyState,\n showShortcut,\n shortcutText,\n showFooter,\n footerHints,\n showSettingsButton,\n onSettingsClick,\n maxHeight,\n filter,\n}: CommandMenuBodyProps) {\n const safeMaxHeight = getCommandMenuMaxHeight(maxHeight);\n const renderOption = (option: CommandMenuOption) => (\n <CommandMenuItem key={option.id} option={option} onSelect={onSelect} />\n );\n\n return (\n <Command\n filter={filter}\n className=\"rounded-none border-0 shadow-none\"\n data-slot=\"command-menu\"\n >\n <search\n aria-label=\"Command menu search\"\n className=\"block border-b border-input bg-background\"\n >\n <CommandInput\n render={({ clearSearch, value, ...inputProps }) => {\n const canClose = typeof onClose === 'function';\n const clearOrClose = () => {\n if (value) {\n clearSearch();\n return;\n }\n onClose?.();\n };\n\n return (\n <div\n data-slot=\"command-menu-input\"\n cmdk-input-wrapper=\"\"\n className=\"flex h-11 items-center gap-2 px-3\"\n >\n <Search\n className=\"size-4 shrink-0 text-muted-foreground opacity-50\"\n aria-hidden=\"true\"\n />\n <input\n {...inputProps}\n value={value}\n placeholder={placeholder}\n aria-label={placeholder}\n className=\"min-w-0 flex-1 bg-transparent text-sm leading-5 text-foreground outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50\"\n />\n {showShortcut && (\n <CommandShortcutBadge>{shortcutText}</CommandShortcutBadge>\n )}\n <ClearButton\n size=\"icon-xs\"\n className=\"-me-1 rounded-sm p-0 opacity-50 hover:opacity-80 focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-4\"\n disabled={!value && !canClose}\n aria-label={\n value\n ? 'Clear search'\n : canClose\n ? 'Close command menu'\n : 'Clear search'\n }\n onClick={clearOrClose}\n />\n </div>\n );\n }}\n />\n </search>\n\n <CommandList\n style={{ maxHeight: safeMaxHeight }}\n className=\"overflow-y-auto p-0\"\n >\n <CommandEmpty className=\"py-6 text-center text-sm text-muted-foreground animate-in fade-in-0 duration-200 motion-reduce:animate-none\">\n {emptyState || emptyText}\n </CommandEmpty>\n <CommandMenuBodyContent\n groups={groups}\n options={options}\n optionRenderer={renderOption}\n >\n {children}\n </CommandMenuBodyContent>\n </CommandList>\n\n {showFooter && (\n <CommandMenuFooter\n hints={footerHints}\n showSettingsButton={showSettingsButton}\n onSettingsClick={onSettingsClick}\n />\n )}\n </Command>\n );\n}\nCommandMenuBody.displayName = 'CommandMenu.Body';\n\n// ============================================\n// Main Command Menu Component\n// ============================================\n\nfunction CommandMenu({\n open,\n onOpenChange,\n placeholder = DEFAULT_COMMAND_MENU_PLACEHOLDER,\n emptyText = 'No results found.',\n emptyState,\n options = [],\n groups = [],\n onSelect,\n showShortcut = false,\n shortcutText,\n showFooter = false,\n footerHints,\n showSettingsButton = false,\n onSettingsClick,\n className,\n maxHeight = DEFAULT_COMMAND_MENU_MAX_HEIGHT,\n filter,\n children,\n}: CommandMenuProps) {\n const platformShortcut = usePlatformShortcut();\n const resolvedShortcut = shortcutText ?? platformShortcut;\n\n return (\n <CommandDialog\n open={open}\n onOpenChange={onOpenChange}\n className={cn('max-w-[508px] sm:max-w-[508px]', className)}\n >\n <CommandMenuBody\n placeholder={placeholder}\n emptyText={emptyText}\n emptyState={emptyState}\n options={options}\n groups={groups}\n onSelect={onSelect}\n onClose={() => onOpenChange?.(false)}\n showShortcut={showShortcut}\n shortcutText={resolvedShortcut}\n showFooter={showFooter}\n footerHints={footerHints}\n showSettingsButton={showSettingsButton}\n onSettingsClick={onSettingsClick}\n maxHeight={maxHeight}\n filter={filter}\n >\n {children}\n </CommandMenuBody>\n </CommandDialog>\n );\n}\nCommandMenu.displayName = 'CommandMenu';\n\n// ============================================\n// Standalone Command Menu (non-dialog version)\n// ============================================\n\nexport interface CommandMenuPanelProps\n extends Omit<CommandMenuProps, 'open' | 'onOpenChange'> {\n /** Additional class name */\n className?: string;\n}\n\nfunction CommandMenuPanel({\n placeholder = DEFAULT_COMMAND_MENU_PLACEHOLDER,\n emptyText = 'No results found.',\n emptyState,\n options = [],\n groups = [],\n onSelect,\n showShortcut = false,\n shortcutText,\n showFooter = false,\n footerHints,\n showSettingsButton = false,\n onSettingsClick,\n className,\n maxHeight = DEFAULT_COMMAND_MENU_MAX_HEIGHT,\n filter,\n children,\n}: CommandMenuPanelProps) {\n const platformShortcut = usePlatformShortcut();\n const resolvedShortcut = shortcutText ?? platformShortcut;\n\n return (\n <div\n data-slot=\"command-menu-panel\"\n className={cn(COMMAND_MENU_SHELL_CLASS_NAME, className)}\n >\n <CommandMenuBody\n placeholder={placeholder}\n emptyText={emptyText}\n emptyState={emptyState}\n options={options}\n groups={groups}\n onSelect={onSelect}\n showShortcut={showShortcut}\n shortcutText={resolvedShortcut}\n showFooter={showFooter}\n footerHints={footerHints}\n showSettingsButton={showSettingsButton}\n onSettingsClick={onSettingsClick}\n maxHeight={maxHeight}\n filter={filter}\n >\n {children}\n </CommandMenuBody>\n </div>\n );\n}\nCommandMenuPanel.displayName = 'CommandMenu.Panel';\n\n// ============================================\n// Exports\n// ============================================\n\nexport {\n CommandMenu,\n CommandMenuFooter,\n CommandMenuGroupHeader,\n CommandMenuItem,\n CommandMenuPanel,\n CommandShortcutBadge,\n defaultFooterHints,\n FooterNavIcon,\n FooterNavText,\n};\n"],"mappings":"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"}
package/dist/index206.js CHANGED
@@ -1,31 +1,92 @@
1
+ "use client";
1
2
  import { cn } from "./index2.js";
2
- import { Button } from "./index5.js";
3
+ import { useControllableState } from "./index12.js";
4
+ import { createSafeContext } from "./index21.js";
5
+ import { Check, ChevronRight } from "lucide-react";
3
6
  import * as React from "react";
4
7
  import { jsx, jsxs } from "react/jsx-runtime";
5
- import { AlertDialog } from "@base-ui/react/alert-dialog";
6
- //#region src/components/organisms/overlays/AlertDialog/AlertDialog.tsx
7
- var Root = React.forwardRef(function Root({ ...props }, _ref) {
8
- return /* @__PURE__ */ jsx(AlertDialog.Root, {
9
- "data-slot": "alert-dialog",
10
- ...props
8
+ import { Menu as Menu$1 } from "@base-ui/react/menu";
9
+ //#region src/components/organisms/menus/ContextMenu/ContextMenu.tsx
10
+ var [ContextMenuContext, useContextMenuContext] = createSafeContext("ContextMenu");
11
+ function Root({ children, anchorPoint, open: controlledOpen, defaultOpen = false, onOpenChange }) {
12
+ const [position, setPosition] = React.useState({
13
+ x: 0,
14
+ y: 0
11
15
  });
12
- });
13
- Root.displayName = "AlertDialog.Root";
14
- var Trigger = React.forwardRef(function Trigger({ ...props }, ref) {
15
- return /* @__PURE__ */ jsx(AlertDialog.Trigger, {
16
- ref,
17
- "data-slot": "alert-dialog-trigger",
18
- ...props
16
+ const [open, setOpen] = useControllableState({
17
+ value: controlledOpen,
18
+ defaultValue: defaultOpen,
19
+ onChange: onOpenChange
19
20
  });
20
- });
21
- Trigger.displayName = "AlertDialog.Trigger";
21
+ return /* @__PURE__ */ jsx(ContextMenuContext.Provider, {
22
+ value: {
23
+ open,
24
+ setOpen,
25
+ position: anchorPoint ?? position,
26
+ setPosition
27
+ },
28
+ children: /* @__PURE__ */ jsx(Menu$1.Root, {
29
+ "data-slot": "context-menu",
30
+ open,
31
+ onOpenChange: setOpen,
32
+ children
33
+ })
34
+ });
35
+ }
36
+ Root.displayName = "ContextMenu.Root";
37
+ function Trigger({ children, className, disabled = false, onKeyDown: onKeyDownProp, ...props }) {
38
+ const { setOpen, setPosition } = useContextMenuContext();
39
+ return /* @__PURE__ */ jsx("button", {
40
+ type: "button",
41
+ "data-slot": "context-menu-trigger",
42
+ onContextMenu: React.useCallback((event) => {
43
+ if (disabled) return;
44
+ event.preventDefault();
45
+ setPosition({
46
+ x: event.clientX,
47
+ y: event.clientY
48
+ });
49
+ setOpen(true);
50
+ }, [
51
+ disabled,
52
+ setOpen,
53
+ setPosition
54
+ ]),
55
+ onKeyDown: React.useCallback((event) => {
56
+ onKeyDownProp?.(event);
57
+ if (event.defaultPrevented) return;
58
+ if (disabled) return;
59
+ if (event.key === "F10" && event.shiftKey) {
60
+ event.preventDefault();
61
+ const rect = event.currentTarget.getBoundingClientRect();
62
+ setPosition({
63
+ x: rect.left + rect.width / 2,
64
+ y: rect.top + rect.height / 2
65
+ });
66
+ setOpen(true);
67
+ }
68
+ }, [
69
+ disabled,
70
+ onKeyDownProp,
71
+ setOpen,
72
+ setPosition
73
+ ]),
74
+ className,
75
+ disabled,
76
+ ...props,
77
+ children
78
+ });
79
+ }
80
+ Trigger.displayName = "ContextMenu.Trigger";
22
81
  function Portal({ ...props }) {
23
- return /* @__PURE__ */ jsx(AlertDialog.Portal, {
24
- "data-slot": "alert-dialog-portal",
82
+ return /* @__PURE__ */ jsx(Menu$1.Portal, {
83
+ "data-slot": "context-menu-portal",
25
84
  ...props
26
85
  });
27
86
  }
28
- Portal.displayName = "AlertDialog.Portal";
87
+ Portal.displayName = "ContextMenu.Portal";
88
+ var popupMotionClassName = "data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 motion-reduce:animate-none";
89
+ var popupSurfaceClassName = "border border-border bg-popover text-popover-foreground rounded-lg p-1 shadow-sm duration-100 origin-(--transform-origin) outline-none";
29
90
  function isPortalContainerRef(container) {
30
91
  return container !== null && typeof container === "object" && "current" in container;
31
92
  }
@@ -35,145 +96,191 @@ function usePortalContainer(container) {
35
96
  return { current: container };
36
97
  }, [container]);
37
98
  }
38
- var Backdrop = React.forwardRef(function Backdrop({ className, disableAnimation, disableBackdropBlur, ...props }, ref) {
39
- return /* @__PURE__ */ jsx(AlertDialog.Backdrop, {
40
- ref,
41
- "data-slot": "alert-dialog-backdrop",
42
- className: cn("bg-background/80/10 fixed inset-0 isolate z-50", !disableAnimation && "data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 duration-100 motion-reduce:animate-none", !disableBackdropBlur && "supports-backdrop-filter:backdrop-blur-xs", className),
43
- ...props
44
- });
45
- });
46
- Backdrop.displayName = "AlertDialog.Backdrop";
47
- var Viewport = React.forwardRef(function Viewport({ className, children, ...props }, ref) {
48
- return /* @__PURE__ */ jsx(AlertDialog.Viewport, {
49
- ref,
50
- "data-slot": "alert-dialog-viewport",
51
- className: cn("fixed inset-0 z-50 flex items-center justify-center p-4", className),
52
- ...props,
53
- children
54
- });
55
- });
56
- Viewport.displayName = "AlertDialog.Viewport";
57
- var Popup = React.forwardRef(function Popup({ className, container, size = "default", disableAnimation, disableBackdropBlur, ...props }, ref) {
58
- return /* @__PURE__ */ jsxs(Portal, {
59
- container: usePortalContainer(container),
60
- children: [/* @__PURE__ */ jsx(Backdrop, {
61
- disableAnimation,
62
- disableBackdropBlur
63
- }), /* @__PURE__ */ jsx(AlertDialog.Popup, {
64
- ref,
65
- "data-slot": "alert-dialog-popup",
66
- "data-size": size,
67
- className: cn("bg-background ring-foreground/10 flex w-[calc(100%-2rem)] max-w-[483px] flex-col items-start gap-4 rounded-xl p-6 ring-1 shadow-lg sm:w-[483px] data-[size=sm]:sm:max-w-sm group/alert-dialog-content fixed top-1/2 left-1/2 z-50 -translate-x-1/2 -translate-y-1/2 outline-none", !disableAnimation && "data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 duration-150 motion-reduce:animate-none", className),
68
- ...props
69
- })]
99
+ function resolvePortalContextElement(container) {
100
+ const resolvedContainer = isPortalContainerRef(container) ? container.current : container;
101
+ if (!resolvedContainer) return void 0;
102
+ return "host" in resolvedContainer ? resolvedContainer.host : resolvedContainer;
103
+ }
104
+ function Popup({ alignOffset = 0, container, sideOffset = 0, className, ...props }) {
105
+ const { position } = useContextMenuContext();
106
+ const portalContainer = usePortalContainer(container);
107
+ const portalContextElement = resolvePortalContextElement(container);
108
+ const virtualAnchor = React.useMemo(() => ({
109
+ contextElement: portalContextElement,
110
+ getBoundingClientRect: () => ({
111
+ x: position.x,
112
+ y: position.y,
113
+ width: 0,
114
+ height: 0,
115
+ top: position.y,
116
+ right: position.x,
117
+ bottom: position.y,
118
+ left: position.x,
119
+ toJSON: () => ({})
120
+ })
121
+ }), [
122
+ portalContextElement,
123
+ position.x,
124
+ position.y
125
+ ]);
126
+ return /* @__PURE__ */ jsx(Menu$1.Portal, {
127
+ container: portalContainer,
128
+ children: /* @__PURE__ */ jsx(Menu$1.Positioner, {
129
+ "data-anchor-x": position.x,
130
+ "data-anchor-y": position.y,
131
+ "data-slot": "context-menu-positioner",
132
+ className: "isolate z-50 outline-none",
133
+ anchor: virtualAnchor,
134
+ side: "bottom",
135
+ align: "start",
136
+ sideOffset,
137
+ alignOffset,
138
+ collisionPadding: 8,
139
+ children: /* @__PURE__ */ jsx(Menu$1.Popup, {
140
+ "data-slot": "context-menu-popup",
141
+ className: cn(popupMotionClassName, popupSurfaceClassName, "min-w-32 z-50 max-h-(--available-height) overflow-x-hidden overflow-y-auto data-closed:overflow-hidden", className),
142
+ ...props
143
+ })
144
+ })
70
145
  });
71
- });
72
- Popup.displayName = "AlertDialog.Popup";
73
- var alertDialogFooterActionClassName = "gap-2 rounded-xl px-4";
74
- var Header = React.forwardRef(function Header({ className, align = "start", ...props }, ref) {
75
- return /* @__PURE__ */ jsx("div", {
76
- ref,
77
- "data-slot": "alert-dialog-header",
78
- "data-align": align,
79
- className: cn("flex w-full flex-col gap-2", align === "center" ? "items-center text-center" : "items-start text-left", className),
146
+ }
147
+ Popup.displayName = "ContextMenu.Popup";
148
+ function Group({ ...props }) {
149
+ return /* @__PURE__ */ jsx(Menu$1.Group, {
150
+ "data-slot": "context-menu-group",
80
151
  ...props
81
152
  });
82
- });
83
- Header.displayName = "AlertDialog.Header";
84
- var Footer = React.forwardRef(function Footer({ className, align = "start", ...props }, ref) {
85
- return /* @__PURE__ */ jsx("div", {
86
- ref,
87
- "data-slot": "alert-dialog-footer",
88
- "data-align": align,
89
- className: cn("flex w-full flex-row items-center gap-3", align === "center" ? "justify-center" : "justify-end", className),
153
+ }
154
+ Group.displayName = "ContextMenu.Group";
155
+ function Label({ className, inset, ...props }) {
156
+ return /* @__PURE__ */ jsx(Menu$1.GroupLabel, {
157
+ "data-slot": "context-menu-label",
158
+ "data-inset": inset,
159
+ className: cn("text-foreground px-2 py-1.5 text-sm leading-5 font-medium data-[inset]:ps-8", className),
90
160
  ...props
91
161
  });
92
- });
93
- Footer.displayName = "AlertDialog.Footer";
94
- var Media = React.forwardRef(function Media({ className, ...props }, ref) {
95
- return /* @__PURE__ */ jsx("div", {
96
- ref,
97
- "data-slot": "alert-dialog-media",
98
- className: cn("bg-muted mb-2 inline-flex size-16 items-center justify-center rounded-md *:[svg:not([class*='size-'])]:size-8", className),
162
+ }
163
+ Label.displayName = "ContextMenu.Label";
164
+ function Item({ className, inset, variant = "default", ...props }) {
165
+ return /* @__PURE__ */ jsx(Menu$1.Item, {
166
+ "data-slot": "context-menu-item",
167
+ "data-inset": inset,
168
+ "data-variant": variant,
169
+ className: cn("focus:bg-accent focus:text-popover-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive not-data-[variant=destructive]:focus:**:text-popover-foreground gap-2 rounded-md px-2 py-1.5 text-base leading-6 [&_svg:not([class*='size-'])]:size-4 group/context-menu-item relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-[inset]:ps-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 transition-[color,background-color,transform] duration-150 ease-smooth active:scale-[0.99] motion-reduce:transition-none motion-reduce:active:scale-100", className),
99
170
  ...props
100
171
  });
101
- });
102
- Media.displayName = "AlertDialog.Media";
103
- var Title = React.forwardRef(function Title({ className, ...props }, ref) {
104
- return /* @__PURE__ */ jsx(AlertDialog.Title, {
105
- ref,
106
- "data-slot": "alert-dialog-title",
107
- className: cn("text-lg leading-7 font-semibold", className),
172
+ }
173
+ Item.displayName = "ContextMenu.Item";
174
+ function Sub({ ...props }) {
175
+ return /* @__PURE__ */ jsx(Menu$1.SubmenuRoot, {
176
+ "data-slot": "context-menu-sub",
108
177
  ...props
109
178
  });
110
- });
111
- Title.displayName = "AlertDialog.Title";
112
- var Description = React.forwardRef(function Description({ className, ...props }, ref) {
113
- return /* @__PURE__ */ jsx(AlertDialog.Description, {
114
- ref,
115
- "data-slot": "alert-dialog-description",
116
- className: cn("text-muted-foreground *:[a]:hover:text-foreground text-sm leading-5 *:[a]:underline *:[a]:underline-offset-3", className),
117
- ...props
179
+ }
180
+ Sub.displayName = "ContextMenu.Sub";
181
+ function SubTrigger({ className, inset, children, ...props }) {
182
+ return /* @__PURE__ */ jsxs(Menu$1.SubmenuTrigger, {
183
+ "data-slot": "context-menu-sub-trigger",
184
+ "data-inset": inset,
185
+ className: cn("focus:bg-accent focus:text-popover-foreground data-open:bg-accent data-open:text-popover-foreground not-data-[variant=destructive]:focus:**:text-popover-foreground gap-2 rounded-md px-2 py-1.5 text-base leading-6 [&_svg:not([class*='size-'])]:size-4 group/ctx-sub flex cursor-default items-center outline-hidden select-none data-[inset]:ps-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 transition-[color,background-color,transform] duration-150 ease-smooth active:scale-[0.99] motion-reduce:transition-none motion-reduce:active:scale-100", className),
186
+ ...props,
187
+ children: [children, /* @__PURE__ */ jsx(ChevronRight, { className: "ms-auto rtl:rotate-180 transition-transform duration-150 group-data-open/ctx-sub:translate-x-0.5" })]
118
188
  });
119
- });
120
- Description.displayName = "AlertDialog.Description";
121
- var FooterActionButton = React.forwardRef(function FooterActionButton({ className, dataSlot, shape = "rounded", size = "default", ...props }, ref) {
122
- return /* @__PURE__ */ jsx(Button, {
123
- ref,
124
- "data-slot": dataSlot,
125
- size,
126
- shape,
127
- className: cn(alertDialogFooterActionClassName, className),
189
+ }
190
+ SubTrigger.displayName = "ContextMenu.SubTrigger";
191
+ function SubPopup({ className, container, ...props }) {
192
+ const portalContainer = usePortalContainer(container);
193
+ return /* @__PURE__ */ jsx(Menu$1.Portal, {
194
+ container: portalContainer,
195
+ children: /* @__PURE__ */ jsx(Menu$1.Positioner, {
196
+ className: "isolate z-50 outline-none",
197
+ side: "right",
198
+ align: "start",
199
+ sideOffset: 0,
200
+ alignOffset: -3,
201
+ children: /* @__PURE__ */ jsx(Menu$1.Popup, {
202
+ "data-slot": "context-menu-sub-popup",
203
+ className: cn(popupMotionClassName, "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", popupSurfaceClassName, "min-w-[96px] w-auto", className),
204
+ ...props
205
+ })
206
+ })
207
+ });
208
+ }
209
+ SubPopup.displayName = "ContextMenu.SubPopup";
210
+ function CheckboxItem({ className, children, checked, ...props }) {
211
+ return /* @__PURE__ */ jsxs(Menu$1.CheckboxItem, {
212
+ "data-slot": "context-menu-checkbox-item",
213
+ className: cn("focus:bg-accent focus:text-popover-foreground focus:**:text-popover-foreground gap-2 rounded-md py-1.5 pe-2 ps-8 text-base leading-6 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 transition-colors duration-150 ease-smooth motion-reduce:transition-none", className),
214
+ checked,
215
+ ...props,
216
+ children: [/* @__PURE__ */ jsx("span", {
217
+ className: "pointer-events-none absolute start-2 flex size-4 items-center justify-center",
218
+ "data-slot": "context-menu-checkbox-item-indicator",
219
+ children: /* @__PURE__ */ jsx(Menu$1.CheckboxItemIndicator, {
220
+ className: "animate-in zoom-in-75 duration-150 motion-reduce:animate-none",
221
+ children: /* @__PURE__ */ jsx(Check, {})
222
+ })
223
+ }), children]
224
+ });
225
+ }
226
+ CheckboxItem.displayName = "ContextMenu.CheckboxItem";
227
+ function RadioGroup({ ...props }) {
228
+ return /* @__PURE__ */ jsx(Menu$1.RadioGroup, {
229
+ "data-slot": "context-menu-radio-group",
128
230
  ...props
129
231
  });
130
- });
131
- FooterActionButton.displayName = "AlertDialog.FooterActionButton";
132
- var Action = React.forwardRef(function Action({ className, appearance = "solid", variant = "primary", size = "default", shape = "rounded", ...props }, ref) {
133
- return /* @__PURE__ */ jsx(FooterActionButton, {
134
- ref,
135
- dataSlot: "alert-dialog-action",
136
- appearance,
137
- variant,
138
- size,
139
- shape,
140
- className,
232
+ }
233
+ RadioGroup.displayName = "ContextMenu.RadioGroup";
234
+ function RadioItem({ className, children, ...props }) {
235
+ return /* @__PURE__ */ jsxs(Menu$1.RadioItem, {
236
+ "data-slot": "context-menu-radio-item",
237
+ className: cn("focus:bg-accent focus:text-popover-foreground focus:**:text-popover-foreground gap-2 rounded-md py-1.5 pe-2 ps-8 text-base leading-6 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 transition-colors duration-150 ease-smooth motion-reduce:transition-none", className),
238
+ ...props,
239
+ children: [/* @__PURE__ */ jsx("span", {
240
+ className: "pointer-events-none absolute start-2 flex size-4 items-center justify-center",
241
+ "data-slot": "context-menu-radio-item-indicator",
242
+ children: /* @__PURE__ */ jsx(Menu$1.RadioItemIndicator, {
243
+ className: "animate-in zoom-in-75 duration-150 motion-reduce:animate-none",
244
+ children: /* @__PURE__ */ jsx(Check, {})
245
+ })
246
+ }), children]
247
+ });
248
+ }
249
+ RadioItem.displayName = "ContextMenu.RadioItem";
250
+ function Separator({ className, ...props }) {
251
+ return /* @__PURE__ */ jsx(Menu$1.Separator, {
252
+ "data-slot": "context-menu-separator",
253
+ className: cn("bg-border my-1 h-px", className),
141
254
  ...props
142
255
  });
143
- });
144
- Action.displayName = "AlertDialog.Action";
145
- var Cancel = React.forwardRef(function Cancel({ className, appearance = "outline", variant = "secondary", size = "default", shape = "rounded", ...props }, ref) {
146
- return /* @__PURE__ */ jsx(AlertDialog.Close, {
147
- ref,
148
- "data-slot": "alert-dialog-cancel",
149
- className,
150
- render: /* @__PURE__ */ jsx(FooterActionButton, {
151
- dataSlot: "alert-dialog-cancel",
152
- appearance,
153
- variant,
154
- size,
155
- shape
156
- }),
256
+ }
257
+ Separator.displayName = "ContextMenu.Separator";
258
+ function Shortcut({ className, ...props }) {
259
+ return /* @__PURE__ */ jsx("span", {
260
+ "data-slot": "context-menu-shortcut",
261
+ className: cn("text-muted-foreground group-focus/context-menu-item:text-popover-foreground ms-auto text-xs tracking-widest transition-colors duration-150 ease-smooth motion-reduce:transition-none", className),
157
262
  ...props
158
263
  });
159
- });
160
- Cancel.displayName = "AlertDialog.Cancel";
161
- var AlertDialog$1 = Object.assign(Root, {
264
+ }
265
+ Shortcut.displayName = "ContextMenu.Shortcut";
266
+ var ContextMenu = Object.assign(Root, {
162
267
  Root,
163
268
  Trigger,
164
269
  Portal,
165
- Backdrop,
166
- Viewport,
167
270
  Popup,
168
- Header,
169
- Footer,
170
- Title,
171
- Description,
172
- Action,
173
- Cancel,
174
- Media
271
+ Group,
272
+ Label,
273
+ Item,
274
+ Sub,
275
+ SubTrigger,
276
+ SubPopup,
277
+ CheckboxItem,
278
+ RadioGroup,
279
+ RadioItem,
280
+ Separator,
281
+ Shortcut
175
282
  });
176
283
  //#endregion
177
- export { AlertDialog$1 as AlertDialog, Action as AlertDialogAction, Backdrop as AlertDialogBackdrop, Cancel as AlertDialogCancel, Description as AlertDialogDescription, Footer as AlertDialogFooter, Header as AlertDialogHeader, Media as AlertDialogMedia, Popup as AlertDialogPopup, Portal as AlertDialogPortal, Root as AlertDialogRoot, Title as AlertDialogTitle, Trigger as AlertDialogTrigger, Viewport as AlertDialogViewport };
284
+ export { ContextMenu, CheckboxItem as ContextMenuCheckboxItem, Group as ContextMenuGroup, Item as ContextMenuItem, Label as ContextMenuLabel, Popup as ContextMenuPopup, Portal as ContextMenuPortal, RadioGroup as ContextMenuRadioGroup, RadioItem as ContextMenuRadioItem, Root as ContextMenuRoot, Separator as ContextMenuSeparator, Shortcut as ContextMenuShortcut, Sub as ContextMenuSub, SubPopup as ContextMenuSubPopup, SubTrigger as ContextMenuSubTrigger, Trigger as ContextMenuTrigger };
178
285
 
179
286
  //# sourceMappingURL=index206.js.map