@cube-dev/ui-kit 0.155.0 → 0.157.0

package/dist/components/actions/CommandMenu/CommandMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommandMenu.js","names":["mergeProps","MenuTrigger"],"sources":["../../../../src/components/actions/CommandMenu/CommandMenu.tsx"],"sourcesContent":["import { useObjectRef, useSyncRef } from '@react-aria/utils';\nimport { FocusStrategy } from '@react-types/shared';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  Styles,\n} from '@tenphi/tasty';\nimport React, {\n  Key,\n  ReactElement,\n  ReactNode,\n  Ref,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { useFilter, useMenu } from 'react-aria';\n// Import Item and Section from Menu for CommandMenu compound component\nimport { Item, Section, useTreeState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { LoadingIcon } from '../../../icons';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\nimport { TooltipProvider } from '../../overlays/Tooltip/TooltipProvider';\nimport { useMenuContext } from '../Menu';\nimport { CubeMenuProps } from '../Menu/Menu';\nimport { MenuItem } from '../Menu/MenuItem';\nimport { MenuSection } from '../Menu/MenuSection';\nimport { MenuTrigger } from '../Menu/MenuTrigger';\nimport {\n  StyledDivider,\n  StyledFooter,\n  StyledHeader,\n  StyledMenu,\n} from '../Menu/styled';\n\nimport {\n  StyledCommandMenu,\n  StyledEmptyState,\n  StyledLoadingWrapper,\n  StyledSearchInput,\n} from './styled';\n\nexport interface CommandMenuItem {\n  // Standard item props\n  id: string;\n  textValue: string;\n\n  // Enhanced search features\n  keywords?: string[];\n  forceMount?: boolean;\n\n  // Standard Menu item props inherited\n  [key: string]: any;\n}\n\nexport interface CubeCommandMenuProps<T>\n  extends BaseProps,\n    ContainerStyleProps,\n    Omit<\n      CubeMenuProps<T>,\n      'selectedKeys' | 'defaultSelectedKeys' | 'onSelectionChange'\n    > {\n  // Search-specific props\n  searchPlaceholder?: string;\n  searchValue?: string;\n  onSearchChange?: (value: string) => void;\n  filter?: (textValue: string, inputValue: string) => boolean;\n  emptyLabel?: ReactNode;\n  searchInputStyles?: Styles;\n  headerStyles?: Styles;\n  footerStyles?: Styles;\n\n  // Advanced search features\n  isLoading?: boolean;\n  shouldFilter?: boolean;\n\n  // Focus management - override the autoFocus from CubeMenuProps to allow boolean | FocusStrategy\n  autoFocus?: boolean | FocusStrategy;\n\n  // Size prop\n  size?: 'medium' | 'large' | (string & {});\n\n  /** Currently selected keys (controlled) */\n  selectedKeys?: string[];\n  /** Initially selected keys (uncontrolled) */\n  defaultSelectedKeys?: string[];\n  /** Handler for selection changes */\n  onSelectionChange?: (keys: string[]) => void;\n}\n\nfunction CommandMenu<T extends object>(\n  props: CubeCommandMenuProps<T>,\n  ref: Ref<HTMLDivElement>,\n) {\n  const { t } = useI18n();\n\n  const {\n    searchPlaceholder = t(\n      'commandMenu.searchPlaceholder',\n      'Search commands...',\n    ),\n    searchValue: controlledSearchValue,\n    onSearchChange,\n    filter: customFilter,\n    emptyLabel = t('commandMenu.empty', 'No commands found'),\n    searchInputStyles,\n    headerStyles,\n    footerStyles,\n    isLoading = false,\n    shouldFilter = true,\n    autoFocus = true,\n    size = 'medium',\n    qa,\n    styles,\n    selectedKeys,\n    defaultSelectedKeys,\n    onSelectionChange,\n    header,\n    footer,\n    ...restMenuProps\n  } = props;\n\n  const domRef = useObjectRef(ref);\n  const searchInputRef = useRef<HTMLInputElement>(null);\n  const contextProps = useMenuContext();\n\n  // Convert string[] to Set<Key> for React Aria compatibility\n  const ariaSelectedKeys = selectedKeys ? new Set(selectedKeys) : undefined;\n  const ariaDefaultSelectedKeys = defaultSelectedKeys\n    ? new Set(defaultSelectedKeys)\n    : undefined;\n\n  const handleSelectionChange = onSelectionChange\n    ? (keys: 'all' | Set<Key>) => {\n        if (keys === 'all') {\n          // Handle 'all' selection case - collect all available keys\n          const allKeys = Array.from(treeState.collection.getKeys()).map(\n            (key: any) => String(key),\n          );\n          onSelectionChange(allKeys);\n        } else if (keys instanceof Set) {\n          onSelectionChange(Array.from(keys).map((key) => String(key)));\n        } else {\n          onSelectionChange([]);\n        }\n      }\n    : undefined;\n\n  const completeProps = mergeProps(contextProps, restMenuProps, {\n    selectedKeys: ariaSelectedKeys,\n    defaultSelectedKeys: ariaDefaultSelectedKeys,\n    onSelectionChange: handleSelectionChange,\n  });\n\n  // Search state management\n  const [internalSearchValue, setInternalSearchValue] = useState('');\n  const searchValue = controlledSearchValue ?? internalSearchValue;\n\n  const handleSearchChange = useCallback(\n    (value: string) => {\n      if (controlledSearchValue === undefined) {\n        setInternalSearchValue(value);\n      }\n      onSearchChange?.(value);\n    },\n    [controlledSearchValue, onSearchChange],\n  );\n\n  // Filter setup\n  const { contains } = useFilter({ sensitivity: 'base' });\n  const textFilterFn = useMemo(\n    () => customFilter || contains,\n    [customFilter, contains],\n  );\n\n  // Enhanced filter function that supports keywords and forceMount\n  const enhancedFilter = useCallback(\n    (textValue: string, inputValue: string, item?: any) => {\n      // Always show force-mounted items\n      if (item?.forceMount) {\n        return true;\n      }\n\n      // If shouldFilter is false, show all items\n      if (!shouldFilter) {\n        return true;\n      }\n\n      // Split input value into individual words and filter out empty strings\n      const searchWords = inputValue\n        .trim()\n        .toLowerCase()\n        .split(/\\s+/)\n        .filter((word) => word.length > 0);\n\n      // If no search words, show all items\n      if (searchWords.length === 0) {\n        return true;\n      }\n\n      // Collect all searchable text for this item\n      const searchableTexts: string[] = [];\n\n      // Add main text value\n      searchableTexts.push(textValue.toLowerCase());\n\n      // Add keywords if available\n      if (item?.keywords && Array.isArray(item.keywords)) {\n        searchableTexts.push(\n          ...item.keywords.map((keyword: string) => keyword.toLowerCase()),\n        );\n      }\n\n      // Check if ALL search words match at least one of the searchable texts\n      return searchWords.every((searchWord) =>\n        searchableTexts.some((text) => text.includes(searchWord)),\n      );\n    },\n    [shouldFilter],\n  );\n\n  // Collection filter for React Stately\n  const collectionFilter = useCallback(\n    (nodes: Iterable<any>): Iterable<any> => {\n      const term = searchValue.trim();\n\n      // If no search term, return all nodes\n      if (!term) {\n        return nodes;\n      }\n\n      // Split search term into words for multi-word filtering\n      const searchWords = term\n        .toLowerCase()\n        .split(/\\s+/)\n        .filter((word) => word.length > 0);\n\n      // If no valid search words, return all nodes\n      if (searchWords.length === 0) {\n        return nodes;\n      }\n\n      // Recursive helper to filter sections and items\n      const filterNodes = (iter: Iterable<any>): any[] => {\n        const result: any[] = [];\n\n        for (const node of iter) {\n          if (node.type === 'section') {\n            const filteredChildren = filterNodes(node.childNodes);\n\n            if (filteredChildren.length) {\n              result.push({\n                ...node,\n                childNodes: filteredChildren,\n              });\n            }\n          } else {\n            const text = node.textValue ?? String(node.rendered ?? '');\n\n            if (enhancedFilter(text, term, node.props)) {\n              result.push(node);\n            }\n          }\n        }\n\n        return result;\n      };\n\n      return filterNodes(nodes);\n    },\n    [searchValue, enhancedFilter],\n  );\n\n  // Create tree state with filter for both keyboard navigation and rendering\n  const treeStateProps = {\n    ...completeProps,\n    filter: collectionFilter,\n    shouldUseVirtualFocus: true, // Always use virtual focus for CommandMenu\n  };\n\n  const treeState = useTreeState(treeStateProps);\n\n  const collectionItems = [...treeState.collection];\n  const hasSections = collectionItems.some((item) => item.type === 'section');\n\n  // Track focused key for aria-activedescendant\n  const [focusedKey, setFocusedKey] = React.useState<React.Key | null>(null);\n  const focusedKeyRef = useRef<React.Key | null>(null);\n\n  // Apply filtering to collection items for rendering and empty state checks\n  const filteredCollectionItems = useMemo(() => {\n    const term = searchValue.trim();\n    if (!term) {\n      return collectionItems;\n    }\n\n    // Split search term into words for multi-word filtering\n    const searchWords = term\n      .toLowerCase()\n      .split(/\\s+/)\n      .filter((word) => word.length > 0);\n\n    // If no valid search words, return all items\n    if (searchWords.length === 0) {\n      return collectionItems;\n    }\n\n    const filterNodes = (items: any[]): any[] => {\n      const result: any[] = [];\n\n      [...items].forEach((item) => {\n        if (item.type === 'section') {\n          const filteredChildren = filterNodes(item.childNodes);\n          if (filteredChildren.length) {\n            result.push({\n              ...item,\n              childNodes: filteredChildren,\n            });\n          }\n        } else {\n          const text = item.textValue ?? String(item.rendered ?? '');\n          if (enhancedFilter(text, term, item.props)) {\n            result.push(item);\n          }\n        }\n      });\n\n      return result;\n    };\n\n    return filterNodes(collectionItems);\n  }, [collectionItems, searchValue, enhancedFilter]);\n\n  const hasFilteredItems = filteredCollectionItems.length > 0;\n  const viewHasSections = filteredCollectionItems.some(\n    (item) => item.type === 'section',\n  );\n\n  // Helper function to find the first selectable item from filtered results\n  const findFirstSelectableItem = useCallback(() => {\n    const { selectionManager } = treeState;\n\n    const visit = (items: any[]): Key | null => {\n      for (const node of items) {\n        if (node?.type === 'section') {\n          const childResult = visit(Array.from(node.childNodes ?? []));\n          if (childResult != null) return childResult;\n        } else if (\n          node?.type === 'item' &&\n          !selectionManager.isDisabled(node.key)\n        ) {\n          return node.key;\n        }\n      }\n      return null;\n    };\n\n    return visit(filteredCollectionItems);\n  }, [filteredCollectionItems, treeState.selectionManager]);\n\n  // Create a ref for the menu container\n  const menuRef = useRef<HTMLUListElement>(null);\n\n  // Use menu hook for accessibility\n  const { menuProps } = useMenu(\n    {\n      ...completeProps,\n      'aria-label': 'Command palette menu',\n      filter: collectionFilter,\n      shouldUseVirtualFocus: true,\n    },\n    treeState,\n    menuRef,\n  );\n\n  // Manual rendering of menu items (similar to Menu component)\n  const renderedItems = useMemo(() => {\n    const items: React.ReactNode[] = [];\n    let isFirstSection = true;\n\n    filteredCollectionItems.forEach((item) => {\n      if (item.type === 'section') {\n        if (!isFirstSection) {\n          items.push(\n            <StyledDivider\n              key={`divider-${String(item.key)}`}\n              role=\"separator\"\n              aria-orientation=\"horizontal\"\n            />,\n          );\n        }\n\n        items.push(\n          <MenuSection\n            key={item.key}\n            item={item}\n            state={treeState}\n            styles={completeProps.sectionStyles}\n            itemStyles={completeProps.itemStyles}\n            headingStyles={completeProps.sectionHeadingStyles}\n            size={size}\n          />,\n        );\n\n        isFirstSection = false;\n        return;\n      }\n\n      let menuItem = (\n        <MenuItem\n          key={item.key}\n          item={item}\n          state={treeState}\n          styles={completeProps.itemStyles}\n          size={size}\n          onAction={item.onAction}\n        />\n      );\n\n      // Apply tooltip wrapper if tooltip property is provided\n      if (item.props.tooltip) {\n        const tooltipProps =\n          typeof item.props.tooltip === 'string'\n            ? { title: item.props.tooltip }\n            : item.props.tooltip;\n\n        menuItem = (\n          <TooltipProvider\n            key={item.key}\n            activeWrap\n            placement=\"right\"\n            {...tooltipProps}\n          >\n            {menuItem}\n          </TooltipProvider>\n        );\n      }\n\n      // Apply custom wrapper if provided\n      if (item.props.wrapper) {\n        menuItem = item.props.wrapper(menuItem);\n      }\n\n      // Ensure every child has a stable key, even if the wrapper component didn't set one.\n      items.push(React.cloneElement(menuItem, { key: item.key }));\n    });\n\n    return items;\n  }, [\n    filteredCollectionItems,\n    treeState,\n    completeProps.sectionStyles,\n    completeProps.itemStyles,\n\n    completeProps.sectionHeadingStyles,\n  ]);\n\n  // Auto-focus search input\n  React.useEffect(() => {\n    if (autoFocus && searchInputRef.current) {\n      // Use a small timeout to ensure the element is visible and focusable\n      // This is especially important when the CommandMenu is opened in a popover\n      const timeoutId = setTimeout(() => {\n        if (searchInputRef.current) {\n          searchInputRef.current.focus();\n        }\n      }, 0);\n\n      return () => clearTimeout(timeoutId);\n    }\n  }, [autoFocus]);\n\n  // Also focus when the component becomes visible (for trigger/popover usage)\n  React.useEffect(() => {\n    // Check if autoFocus is enabled and we're in a trigger context\n    if (autoFocus && contextProps.autoFocus && searchInputRef.current) {\n      // Use a small timeout to ensure the popover is fully rendered\n      const timeoutId = setTimeout(() => {\n        if (searchInputRef.current) {\n          searchInputRef.current.focus();\n        }\n      }, 50); // Slightly longer timeout for popover context\n\n      return () => clearTimeout(timeoutId);\n    }\n  }, [autoFocus, contextProps.autoFocus]);\n\n  // Track the previous search value to only run auto-focus when search actually changes\n  const prevSearchValueRef = useRef<string>('');\n\n  // Auto-focus first item when search value changes (but not on initial render)\n  React.useEffect(() => {\n    const currentSearchValue = searchValue.trim();\n    const prevSearchValue = prevSearchValueRef.current;\n\n    // Only auto-focus when search value actually changes\n    if (currentSearchValue !== prevSearchValue && currentSearchValue !== '') {\n      const firstSelectableKey = findFirstSelectableItem();\n\n      if (firstSelectableKey && hasFilteredItems) {\n        // Focus the first item in the selection manager\n        treeState.selectionManager.setFocusedKey(firstSelectableKey);\n        setFocusedKey(firstSelectableKey);\n        focusedKeyRef.current = firstSelectableKey;\n      } else {\n        // Clear focus if no items are available\n        treeState.selectionManager.setFocusedKey(null);\n        setFocusedKey(null);\n        focusedKeyRef.current = null;\n      }\n    }\n\n    // Update the previous search value\n    prevSearchValueRef.current = currentSearchValue;\n  }, [searchValue, findFirstSelectableItem, hasFilteredItems]);\n\n  // Extract styles\n  const extractedStyles = useMemo(\n    () => extractStyles(props, CONTAINER_STYLES),\n    [props],\n  );\n\n  // Determine if we should show empty state based on actual filtered collection\n  const hasSearchTerm = searchValue.trim().length > 0;\n  const showEmptyState = hasSearchTerm && !hasFilteredItems && !isLoading;\n\n  // Sync refs\n  useSyncRef(contextProps, menuRef);\n\n  const mods = useMemo(() => {\n    // Determine mods based on menu context\n    let popoverMod = completeProps.mods?.popover;\n    let trayMod = completeProps.mods?.tray;\n\n    return {\n      sections: viewHasSections,\n      footer: !!footer,\n      header: !!header,\n      popover: popoverMod,\n      tray: trayMod,\n    };\n  }, [viewHasSections, footer, header, completeProps.mods]);\n\n  return (\n    <StyledCommandMenu\n      {...(filterBaseProps(props) as Record<string, unknown>)}\n      ref={domRef}\n      qa={qa || 'CommandMenu'}\n      data-size={size}\n      mods={mods}\n      styles={mergeProps(extractedStyles, styles)}\n    >\n      {/* Header */}\n      {header && (\n        <StyledHeader\n          role=\"presentation\"\n          data-size={size}\n          styles={{ border: 'none', ...headerStyles }}\n        >\n          {header}\n        </StyledHeader>\n      )}\n\n      {/* Search Input */}\n      <StyledSearchInput\n        ref={searchInputRef}\n        type=\"search\"\n        placeholder={searchPlaceholder}\n        value={searchValue}\n        styles={searchInputStyles}\n        data-size={size}\n        aria-controls={`${qa || 'CommandMenu'}-menu`}\n        role=\"combobox\"\n        aria-expanded=\"true\"\n        aria-haspopup=\"listbox\"\n        aria-activedescendant={\n          focusedKey != null\n            ? `${qa || 'CommandMenu'}-menu-option-${focusedKey}`\n            : undefined\n        }\n        onChange={(e) => handleSearchChange(e.target.value)}\n        onKeyDown={(e) => {\n          if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {\n            e.preventDefault();\n\n            const isArrowDown = e.key === 'ArrowDown';\n            const { selectionManager } = treeState;\n            // Use the ref to get the current focused key synchronously\n            const currentKey =\n              focusedKeyRef.current || selectionManager.focusedKey;\n\n            // Helper function to get all visible item keys accounting for sections\n            const getVisibleItemKeys = (): Key[] => {\n              const keys: Key[] = [];\n\n              const visit = (items: any[]) => {\n                for (const node of items) {\n                  if (node?.type === 'section') {\n                    visit(Array.from(node.childNodes ?? []));\n                  } else if (node?.type === 'item') {\n                    keys.push(node.key);\n                  }\n                }\n              };\n\n              visit(filteredCollectionItems);\n              return keys;\n            };\n\n            // Helper function to find next selectable key in a direction\n            const findNextSelectableKey = (\n              currentIndex: number,\n              direction: 'forward' | 'backward',\n              visibleKeys: Key[],\n            ) => {\n              const increment = direction === 'forward' ? 1 : -1;\n\n              for (\n                let i = currentIndex + increment;\n                i >= 0 && i < visibleKeys.length;\n                i += increment\n              ) {\n                const key = visibleKeys[i];\n                if (!selectionManager.isDisabled(key)) {\n                  return key;\n                }\n              }\n\n              return null;\n            };\n\n            // Helper function to find first or last selectable key\n            const findFirstLastSelectableKey = (\n              direction: 'forward' | 'backward',\n              visibleKeys: Key[],\n            ) => {\n              const keysToCheck =\n                direction === 'forward'\n                  ? visibleKeys\n                  : [...visibleKeys].reverse();\n\n              for (const key of keysToCheck) {\n                if (!selectionManager.isDisabled(key)) {\n                  return key;\n                }\n              }\n\n              return null;\n            };\n\n            const visibleKeys = getVisibleItemKeys();\n\n            if (visibleKeys.length === 0) {\n              return; // No visible items to navigate\n            }\n\n            let nextKey;\n            const direction = isArrowDown ? 'forward' : 'backward';\n\n            if (currentKey == null) {\n              // No current focus, start from the first/last item\n              nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n            } else {\n              // Find current position in visible keys\n              const currentIndex = visibleKeys.indexOf(currentKey);\n\n              if (currentIndex === -1) {\n                // Current key not in visible items, start from beginning/end\n                nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n              } else {\n                // Find next selectable item from current position\n                nextKey = findNextSelectableKey(\n                  currentIndex,\n                  direction,\n                  visibleKeys,\n                );\n\n                // If no next key found, wrap to first/last selectable item\n                if (nextKey == null) {\n                  nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n                }\n              }\n            }\n\n            if (nextKey != null) {\n              selectionManager.setFocusedKey(nextKey);\n              setFocusedKey(nextKey);\n              focusedKeyRef.current = nextKey; // Update ref immediately\n            }\n          } else if (\n            e.key === 'Enter' ||\n            (e.key === ' ' && !searchValue.trim())\n          ) {\n            const currentFocusedKey =\n              focusedKey || treeState.selectionManager.focusedKey;\n            if (currentFocusedKey != null) {\n              e.preventDefault();\n\n              // Trigger action for the focused item (like Menu does)\n              // First check if there's a selection mode, if so, handle selection\n              if (treeState.selectionManager.selectionMode !== 'none') {\n                treeState.selectionManager.select(currentFocusedKey, e);\n              } else {\n                // Default behavior: trigger action\n                const node = treeState.collection.getItem(currentFocusedKey);\n                if (node) {\n                  // Call the tree state's action handler\n                  const onAction = (completeProps as any).onAction;\n                  if (onAction) {\n                    onAction(currentFocusedKey);\n                  }\n                  // Also call the item's individual onAction if it exists\n                  if (node.props?.onAction) {\n                    node.props.onAction(currentFocusedKey);\n                  }\n                }\n              }\n\n              // Close the menu if we're in a trigger context and closeOnSelect is enabled (default behavior)\n              const { onClose, closeOnSelect } = contextProps;\n              if (onClose && closeOnSelect !== false) {\n                onClose();\n              }\n            }\n          } else if (e.key === 'Escape') {\n            if (searchValue) {\n              e.preventDefault();\n              handleSearchChange('');\n            }\n          }\n        }}\n      />\n\n      {/* Loading State */}\n      {isLoading && (\n        <StyledLoadingWrapper>\n          <LoadingIcon\n            role=\"progressbar\"\n            aria-label=\"Loading commands\"\n            aria-hidden={false}\n          />\n        </StyledLoadingWrapper>\n      )}\n\n      {/* Menu Content - always render unless loading */}\n      {!isLoading && !showEmptyState && (\n        <StyledMenu\n          {...menuProps}\n          ref={menuRef}\n          id={`${qa || 'CommandMenu'}-menu`}\n          aria-label=\"Command menu\"\n          qa=\"Menu\"\n          data-size={size}\n          mods={mods}\n          styles={{\n            border: 'none',\n            boxShadow: 'none',\n            radius: 0,\n            padding: '0.5x',\n          }}\n        >\n          {renderedItems}\n        </StyledMenu>\n      )}\n\n      {/* Empty State - show when search term exists but no results */}\n      {!isLoading && showEmptyState && (\n        <StyledEmptyState>{emptyLabel}</StyledEmptyState>\n      )}\n\n      {/* Footer */}\n      {footer && (\n        <StyledFooter\n          role=\"presentation\"\n          data-size={size}\n          styles={footerStyles}\n        >\n          {footer}\n        </StyledFooter>\n      )}\n    </StyledCommandMenu>\n  );\n}\n\n// forwardRef doesn't support generic parameters, so cast the result to the correct type\nconst _CommandMenu = React.forwardRef(CommandMenu) as <T>(\n  props: CubeCommandMenuProps<T> & React.RefAttributes<HTMLDivElement>,\n) => ReactElement;\n\n// Attach Trigger alias from MenuTrigger for consistent API\n// Also attach Item and Section for compound component pattern\nconst __CommandMenu = Object.assign(_CommandMenu, {\n  Trigger: MenuTrigger,\n  Item,\n  Section,\n  displayName: 'CommandMenu',\n});\n\nexport { __CommandMenu as CommandMenu };\n"],"mappings":"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"}
+{"version":3,"file":"CommandMenu.js","names":["mergeProps","MenuTrigger"],"sources":["../../../../src/components/actions/CommandMenu/CommandMenu.tsx"],"sourcesContent":["import { useObjectRef, useSyncRef } from '@react-aria/utils';\nimport { FocusStrategy } from '@react-types/shared';\nimport {\n  BaseProps,\n  CONTAINER_STYLES,\n  ContainerStyleProps,\n  filterBaseProps,\n  Styles,\n} from '@tenphi/tasty';\nimport React, {\n  Key,\n  ReactElement,\n  ReactNode,\n  Ref,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { useFilter, useMenu } from 'react-aria';\nimport { Section, useTreeState } from 'react-stately';\n\nimport { useI18n } from '../../../i18n';\nimport { LoadingIcon } from '../../../icons';\nimport { mergeProps } from '../../../utils/react';\nimport { extractStyles } from '../../../utils/styles';\n// `CollectionItem` (not react-stately's bare `Item`) is what CommandMenu\n// actually renders through `MenuItem`, so it carries the `Item` props.\nimport { CollectionItem as Item } from '../../CollectionItem';\nimport { TooltipProvider } from '../../overlays/Tooltip/TooltipProvider';\nimport { useMenuContext } from '../Menu';\nimport { CubeMenuProps } from '../Menu/Menu';\nimport { MenuItem } from '../Menu/MenuItem';\nimport { MenuSection } from '../Menu/MenuSection';\nimport { MenuTrigger } from '../Menu/MenuTrigger';\nimport {\n  StyledDivider,\n  StyledFooter,\n  StyledHeader,\n  StyledMenu,\n} from '../Menu/styled';\n\nimport {\n  StyledCommandMenu,\n  StyledEmptyState,\n  StyledLoadingWrapper,\n  StyledSearchInput,\n} from './styled';\n\nexport interface CommandMenuItem {\n  // Standard item props\n  id: string;\n  textValue: string;\n\n  // Enhanced search features\n  keywords?: string[];\n  forceMount?: boolean;\n\n  // Standard Menu item props inherited\n  [key: string]: any;\n}\n\nexport interface CubeCommandMenuProps<T>\n  extends BaseProps,\n    ContainerStyleProps,\n    Omit<\n      CubeMenuProps<T>,\n      'selectedKeys' | 'defaultSelectedKeys' | 'onSelectionChange'\n    > {\n  // Search-specific props\n  searchPlaceholder?: string;\n  searchValue?: string;\n  onSearchChange?: (value: string) => void;\n  filter?: (textValue: string, inputValue: string) => boolean;\n  emptyLabel?: ReactNode;\n  searchInputStyles?: Styles;\n  headerStyles?: Styles;\n  footerStyles?: Styles;\n\n  // Advanced search features\n  isLoading?: boolean;\n  shouldFilter?: boolean;\n\n  // Focus management - override the autoFocus from CubeMenuProps to allow boolean | FocusStrategy\n  autoFocus?: boolean | FocusStrategy;\n\n  // Size prop\n  size?: 'medium' | 'large' | (string & {});\n\n  /** Currently selected keys (controlled) */\n  selectedKeys?: string[];\n  /** Initially selected keys (uncontrolled) */\n  defaultSelectedKeys?: string[];\n  /** Handler for selection changes */\n  onSelectionChange?: (keys: string[]) => void;\n}\n\nfunction CommandMenu<T extends object>(\n  props: CubeCommandMenuProps<T>,\n  ref: Ref<HTMLDivElement>,\n) {\n  const { t } = useI18n();\n\n  const {\n    searchPlaceholder = t(\n      'commandMenu.searchPlaceholder',\n      'Search commands...',\n    ),\n    searchValue: controlledSearchValue,\n    onSearchChange,\n    filter: customFilter,\n    emptyLabel = t('commandMenu.empty', 'No commands found'),\n    searchInputStyles,\n    headerStyles,\n    footerStyles,\n    isLoading = false,\n    shouldFilter = true,\n    autoFocus = true,\n    size = 'medium',\n    qa,\n    styles,\n    selectedKeys,\n    defaultSelectedKeys,\n    onSelectionChange,\n    header,\n    footer,\n    ...restMenuProps\n  } = props;\n\n  const domRef = useObjectRef(ref);\n  const searchInputRef = useRef<HTMLInputElement>(null);\n  const contextProps = useMenuContext();\n\n  // Convert string[] to Set<Key> for React Aria compatibility\n  const ariaSelectedKeys = selectedKeys ? new Set(selectedKeys) : undefined;\n  const ariaDefaultSelectedKeys = defaultSelectedKeys\n    ? new Set(defaultSelectedKeys)\n    : undefined;\n\n  const handleSelectionChange = onSelectionChange\n    ? (keys: 'all' | Set<Key>) => {\n        if (keys === 'all') {\n          // Handle 'all' selection case - collect all available keys\n          const allKeys = Array.from(treeState.collection.getKeys()).map(\n            (key: any) => String(key),\n          );\n          onSelectionChange(allKeys);\n        } else if (keys instanceof Set) {\n          onSelectionChange(Array.from(keys).map((key) => String(key)));\n        } else {\n          onSelectionChange([]);\n        }\n      }\n    : undefined;\n\n  const completeProps = mergeProps(contextProps, restMenuProps, {\n    selectedKeys: ariaSelectedKeys,\n    defaultSelectedKeys: ariaDefaultSelectedKeys,\n    onSelectionChange: handleSelectionChange,\n  });\n\n  // Search state management\n  const [internalSearchValue, setInternalSearchValue] = useState('');\n  const searchValue = controlledSearchValue ?? internalSearchValue;\n\n  const handleSearchChange = useCallback(\n    (value: string) => {\n      if (controlledSearchValue === undefined) {\n        setInternalSearchValue(value);\n      }\n      onSearchChange?.(value);\n    },\n    [controlledSearchValue, onSearchChange],\n  );\n\n  // Filter setup\n  const { contains } = useFilter({ sensitivity: 'base' });\n  const textFilterFn = useMemo(\n    () => customFilter || contains,\n    [customFilter, contains],\n  );\n\n  // Enhanced filter function that supports keywords and forceMount\n  const enhancedFilter = useCallback(\n    (textValue: string, inputValue: string, item?: any) => {\n      // Always show force-mounted items\n      if (item?.forceMount) {\n        return true;\n      }\n\n      // If shouldFilter is false, show all items\n      if (!shouldFilter) {\n        return true;\n      }\n\n      // Split input value into individual words and filter out empty strings\n      const searchWords = inputValue\n        .trim()\n        .toLowerCase()\n        .split(/\\s+/)\n        .filter((word) => word.length > 0);\n\n      // If no search words, show all items\n      if (searchWords.length === 0) {\n        return true;\n      }\n\n      // Collect all searchable text for this item\n      const searchableTexts: string[] = [];\n\n      // Add main text value\n      searchableTexts.push(textValue.toLowerCase());\n\n      // Add keywords if available\n      if (item?.keywords && Array.isArray(item.keywords)) {\n        searchableTexts.push(\n          ...item.keywords.map((keyword: string) => keyword.toLowerCase()),\n        );\n      }\n\n      // Check if ALL search words match at least one of the searchable texts\n      return searchWords.every((searchWord) =>\n        searchableTexts.some((text) => text.includes(searchWord)),\n      );\n    },\n    [shouldFilter],\n  );\n\n  // Collection filter for React Stately\n  const collectionFilter = useCallback(\n    (nodes: Iterable<any>): Iterable<any> => {\n      const term = searchValue.trim();\n\n      // If no search term, return all nodes\n      if (!term) {\n        return nodes;\n      }\n\n      // Split search term into words for multi-word filtering\n      const searchWords = term\n        .toLowerCase()\n        .split(/\\s+/)\n        .filter((word) => word.length > 0);\n\n      // If no valid search words, return all nodes\n      if (searchWords.length === 0) {\n        return nodes;\n      }\n\n      // Recursive helper to filter sections and items\n      const filterNodes = (iter: Iterable<any>): any[] => {\n        const result: any[] = [];\n\n        for (const node of iter) {\n          if (node.type === 'section') {\n            const filteredChildren = filterNodes(node.childNodes);\n\n            if (filteredChildren.length) {\n              result.push({\n                ...node,\n                childNodes: filteredChildren,\n              });\n            }\n          } else {\n            const text = node.textValue ?? String(node.rendered ?? '');\n\n            if (enhancedFilter(text, term, node.props)) {\n              result.push(node);\n            }\n          }\n        }\n\n        return result;\n      };\n\n      return filterNodes(nodes);\n    },\n    [searchValue, enhancedFilter],\n  );\n\n  // Create tree state with filter for both keyboard navigation and rendering\n  const treeStateProps = {\n    ...completeProps,\n    filter: collectionFilter,\n    shouldUseVirtualFocus: true, // Always use virtual focus for CommandMenu\n  };\n\n  const treeState = useTreeState(treeStateProps);\n\n  const collectionItems = [...treeState.collection];\n  const hasSections = collectionItems.some((item) => item.type === 'section');\n\n  // Track focused key for aria-activedescendant\n  const [focusedKey, setFocusedKey] = React.useState<React.Key | null>(null);\n  const focusedKeyRef = useRef<React.Key | null>(null);\n\n  // Apply filtering to collection items for rendering and empty state checks\n  const filteredCollectionItems = useMemo(() => {\n    const term = searchValue.trim();\n    if (!term) {\n      return collectionItems;\n    }\n\n    // Split search term into words for multi-word filtering\n    const searchWords = term\n      .toLowerCase()\n      .split(/\\s+/)\n      .filter((word) => word.length > 0);\n\n    // If no valid search words, return all items\n    if (searchWords.length === 0) {\n      return collectionItems;\n    }\n\n    const filterNodes = (items: any[]): any[] => {\n      const result: any[] = [];\n\n      [...items].forEach((item) => {\n        if (item.type === 'section') {\n          const filteredChildren = filterNodes(item.childNodes);\n          if (filteredChildren.length) {\n            result.push({\n              ...item,\n              childNodes: filteredChildren,\n            });\n          }\n        } else {\n          const text = item.textValue ?? String(item.rendered ?? '');\n          if (enhancedFilter(text, term, item.props)) {\n            result.push(item);\n          }\n        }\n      });\n\n      return result;\n    };\n\n    return filterNodes(collectionItems);\n  }, [collectionItems, searchValue, enhancedFilter]);\n\n  const hasFilteredItems = filteredCollectionItems.length > 0;\n  const viewHasSections = filteredCollectionItems.some(\n    (item) => item.type === 'section',\n  );\n\n  // Helper function to find the first selectable item from filtered results\n  const findFirstSelectableItem = useCallback(() => {\n    const { selectionManager } = treeState;\n\n    const visit = (items: any[]): Key | null => {\n      for (const node of items) {\n        if (node?.type === 'section') {\n          const childResult = visit(Array.from(node.childNodes ?? []));\n          if (childResult != null) return childResult;\n        } else if (\n          node?.type === 'item' &&\n          !selectionManager.isDisabled(node.key)\n        ) {\n          return node.key;\n        }\n      }\n      return null;\n    };\n\n    return visit(filteredCollectionItems);\n  }, [filteredCollectionItems, treeState.selectionManager]);\n\n  // Create a ref for the menu container\n  const menuRef = useRef<HTMLUListElement>(null);\n\n  // Use menu hook for accessibility\n  const { menuProps } = useMenu(\n    {\n      ...completeProps,\n      'aria-label': 'Command palette menu',\n      filter: collectionFilter,\n      shouldUseVirtualFocus: true,\n    },\n    treeState,\n    menuRef,\n  );\n\n  // Manual rendering of menu items (similar to Menu component)\n  const renderedItems = useMemo(() => {\n    const items: React.ReactNode[] = [];\n    let isFirstSection = true;\n\n    filteredCollectionItems.forEach((item) => {\n      if (item.type === 'section') {\n        if (!isFirstSection) {\n          items.push(\n            <StyledDivider\n              key={`divider-${String(item.key)}`}\n              role=\"separator\"\n              aria-orientation=\"horizontal\"\n            />,\n          );\n        }\n\n        items.push(\n          <MenuSection\n            key={item.key}\n            item={item}\n            state={treeState}\n            styles={completeProps.sectionStyles}\n            itemStyles={completeProps.itemStyles}\n            headingStyles={completeProps.sectionHeadingStyles}\n            size={size}\n          />,\n        );\n\n        isFirstSection = false;\n        return;\n      }\n\n      let menuItem = (\n        <MenuItem\n          key={item.key}\n          item={item}\n          state={treeState}\n          styles={completeProps.itemStyles}\n          size={size}\n          onAction={item.onAction}\n        />\n      );\n\n      // Apply tooltip wrapper if tooltip property is provided\n      if (item.props.tooltip) {\n        const tooltipProps =\n          typeof item.props.tooltip === 'string'\n            ? { title: item.props.tooltip }\n            : item.props.tooltip;\n\n        menuItem = (\n          <TooltipProvider\n            key={item.key}\n            activeWrap\n            placement=\"right\"\n            {...tooltipProps}\n          >\n            {menuItem}\n          </TooltipProvider>\n        );\n      }\n\n      // Apply custom wrapper if provided\n      if (item.props.wrapper) {\n        menuItem = item.props.wrapper(menuItem);\n      }\n\n      // Ensure every child has a stable key, even if the wrapper component didn't set one.\n      items.push(React.cloneElement(menuItem, { key: item.key }));\n    });\n\n    return items;\n  }, [\n    filteredCollectionItems,\n    treeState,\n    completeProps.sectionStyles,\n    completeProps.itemStyles,\n\n    completeProps.sectionHeadingStyles,\n  ]);\n\n  // Auto-focus search input\n  React.useEffect(() => {\n    if (autoFocus && searchInputRef.current) {\n      // Use a small timeout to ensure the element is visible and focusable\n      // This is especially important when the CommandMenu is opened in a popover\n      const timeoutId = setTimeout(() => {\n        if (searchInputRef.current) {\n          searchInputRef.current.focus();\n        }\n      }, 0);\n\n      return () => clearTimeout(timeoutId);\n    }\n  }, [autoFocus]);\n\n  // Also focus when the component becomes visible (for trigger/popover usage)\n  React.useEffect(() => {\n    // Check if autoFocus is enabled and we're in a trigger context\n    if (autoFocus && contextProps.autoFocus && searchInputRef.current) {\n      // Use a small timeout to ensure the popover is fully rendered\n      const timeoutId = setTimeout(() => {\n        if (searchInputRef.current) {\n          searchInputRef.current.focus();\n        }\n      }, 50); // Slightly longer timeout for popover context\n\n      return () => clearTimeout(timeoutId);\n    }\n  }, [autoFocus, contextProps.autoFocus]);\n\n  // Track the previous search value to only run auto-focus when search actually changes\n  const prevSearchValueRef = useRef<string>('');\n\n  // Auto-focus first item when search value changes (but not on initial render)\n  React.useEffect(() => {\n    const currentSearchValue = searchValue.trim();\n    const prevSearchValue = prevSearchValueRef.current;\n\n    // Only auto-focus when search value actually changes\n    if (currentSearchValue !== prevSearchValue && currentSearchValue !== '') {\n      const firstSelectableKey = findFirstSelectableItem();\n\n      if (firstSelectableKey && hasFilteredItems) {\n        // Focus the first item in the selection manager\n        treeState.selectionManager.setFocusedKey(firstSelectableKey);\n        setFocusedKey(firstSelectableKey);\n        focusedKeyRef.current = firstSelectableKey;\n      } else {\n        // Clear focus if no items are available\n        treeState.selectionManager.setFocusedKey(null);\n        setFocusedKey(null);\n        focusedKeyRef.current = null;\n      }\n    }\n\n    // Update the previous search value\n    prevSearchValueRef.current = currentSearchValue;\n  }, [searchValue, findFirstSelectableItem, hasFilteredItems]);\n\n  // Extract styles\n  const extractedStyles = useMemo(\n    () => extractStyles(props, CONTAINER_STYLES),\n    [props],\n  );\n\n  // Determine if we should show empty state based on actual filtered collection\n  const hasSearchTerm = searchValue.trim().length > 0;\n  const showEmptyState = hasSearchTerm && !hasFilteredItems && !isLoading;\n\n  // Sync refs\n  useSyncRef(contextProps, menuRef);\n\n  const mods = useMemo(() => {\n    // Determine mods based on menu context\n    let popoverMod = completeProps.mods?.popover;\n    let trayMod = completeProps.mods?.tray;\n\n    return {\n      sections: viewHasSections,\n      footer: !!footer,\n      header: !!header,\n      popover: popoverMod,\n      tray: trayMod,\n    };\n  }, [viewHasSections, footer, header, completeProps.mods]);\n\n  return (\n    <StyledCommandMenu\n      {...(filterBaseProps(props) as Record<string, unknown>)}\n      ref={domRef}\n      qa={qa || 'CommandMenu'}\n      data-size={size}\n      mods={mods}\n      styles={mergeProps(extractedStyles, styles)}\n    >\n      {/* Header */}\n      {header && (\n        <StyledHeader\n          role=\"presentation\"\n          data-size={size}\n          styles={{ border: 'none', ...headerStyles }}\n        >\n          {header}\n        </StyledHeader>\n      )}\n\n      {/* Search Input */}\n      <StyledSearchInput\n        ref={searchInputRef}\n        type=\"search\"\n        placeholder={searchPlaceholder}\n        value={searchValue}\n        styles={searchInputStyles}\n        data-size={size}\n        aria-controls={`${qa || 'CommandMenu'}-menu`}\n        role=\"combobox\"\n        aria-expanded=\"true\"\n        aria-haspopup=\"listbox\"\n        aria-activedescendant={\n          focusedKey != null\n            ? `${qa || 'CommandMenu'}-menu-option-${focusedKey}`\n            : undefined\n        }\n        onChange={(e) => handleSearchChange(e.target.value)}\n        onKeyDown={(e) => {\n          if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {\n            e.preventDefault();\n\n            const isArrowDown = e.key === 'ArrowDown';\n            const { selectionManager } = treeState;\n            // Use the ref to get the current focused key synchronously\n            const currentKey =\n              focusedKeyRef.current || selectionManager.focusedKey;\n\n            // Helper function to get all visible item keys accounting for sections\n            const getVisibleItemKeys = (): Key[] => {\n              const keys: Key[] = [];\n\n              const visit = (items: any[]) => {\n                for (const node of items) {\n                  if (node?.type === 'section') {\n                    visit(Array.from(node.childNodes ?? []));\n                  } else if (node?.type === 'item') {\n                    keys.push(node.key);\n                  }\n                }\n              };\n\n              visit(filteredCollectionItems);\n              return keys;\n            };\n\n            // Helper function to find next selectable key in a direction\n            const findNextSelectableKey = (\n              currentIndex: number,\n              direction: 'forward' | 'backward',\n              visibleKeys: Key[],\n            ) => {\n              const increment = direction === 'forward' ? 1 : -1;\n\n              for (\n                let i = currentIndex + increment;\n                i >= 0 && i < visibleKeys.length;\n                i += increment\n              ) {\n                const key = visibleKeys[i];\n                if (!selectionManager.isDisabled(key)) {\n                  return key;\n                }\n              }\n\n              return null;\n            };\n\n            // Helper function to find first or last selectable key\n            const findFirstLastSelectableKey = (\n              direction: 'forward' | 'backward',\n              visibleKeys: Key[],\n            ) => {\n              const keysToCheck =\n                direction === 'forward'\n                  ? visibleKeys\n                  : [...visibleKeys].reverse();\n\n              for (const key of keysToCheck) {\n                if (!selectionManager.isDisabled(key)) {\n                  return key;\n                }\n              }\n\n              return null;\n            };\n\n            const visibleKeys = getVisibleItemKeys();\n\n            if (visibleKeys.length === 0) {\n              return; // No visible items to navigate\n            }\n\n            let nextKey;\n            const direction = isArrowDown ? 'forward' : 'backward';\n\n            if (currentKey == null) {\n              // No current focus, start from the first/last item\n              nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n            } else {\n              // Find current position in visible keys\n              const currentIndex = visibleKeys.indexOf(currentKey);\n\n              if (currentIndex === -1) {\n                // Current key not in visible items, start from beginning/end\n                nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n              } else {\n                // Find next selectable item from current position\n                nextKey = findNextSelectableKey(\n                  currentIndex,\n                  direction,\n                  visibleKeys,\n                );\n\n                // If no next key found, wrap to first/last selectable item\n                if (nextKey == null) {\n                  nextKey = findFirstLastSelectableKey(direction, visibleKeys);\n                }\n              }\n            }\n\n            if (nextKey != null) {\n              selectionManager.setFocusedKey(nextKey);\n              setFocusedKey(nextKey);\n              focusedKeyRef.current = nextKey; // Update ref immediately\n            }\n          } else if (\n            e.key === 'Enter' ||\n            (e.key === ' ' && !searchValue.trim())\n          ) {\n            const currentFocusedKey =\n              focusedKey || treeState.selectionManager.focusedKey;\n            if (currentFocusedKey != null) {\n              e.preventDefault();\n\n              // Trigger action for the focused item (like Menu does)\n              // First check if there's a selection mode, if so, handle selection\n              if (treeState.selectionManager.selectionMode !== 'none') {\n                treeState.selectionManager.select(currentFocusedKey, e);\n              } else {\n                // Default behavior: trigger action\n                const node = treeState.collection.getItem(currentFocusedKey);\n                if (node) {\n                  // Call the tree state's action handler\n                  const onAction = (completeProps as any).onAction;\n                  if (onAction) {\n                    onAction(currentFocusedKey);\n                  }\n                  // Also call the item's individual onAction if it exists\n                  if (node.props?.onAction) {\n                    node.props.onAction(currentFocusedKey);\n                  }\n                }\n              }\n\n              // Close the menu if we're in a trigger context and closeOnSelect is enabled (default behavior)\n              const { onClose, closeOnSelect } = contextProps;\n              if (onClose && closeOnSelect !== false) {\n                onClose();\n              }\n            }\n          } else if (e.key === 'Escape') {\n            if (searchValue) {\n              e.preventDefault();\n              handleSearchChange('');\n            }\n          }\n        }}\n      />\n\n      {/* Loading State */}\n      {isLoading && (\n        <StyledLoadingWrapper>\n          <LoadingIcon\n            role=\"progressbar\"\n            aria-label=\"Loading commands\"\n            aria-hidden={false}\n          />\n        </StyledLoadingWrapper>\n      )}\n\n      {/* Menu Content - always render unless loading */}\n      {!isLoading && !showEmptyState && (\n        <StyledMenu\n          {...menuProps}\n          ref={menuRef}\n          id={`${qa || 'CommandMenu'}-menu`}\n          aria-label=\"Command menu\"\n          qa=\"Menu\"\n          data-size={size}\n          mods={mods}\n          styles={{\n            border: 'none',\n            boxShadow: 'none',\n            radius: 0,\n            padding: '0.5x',\n          }}\n        >\n          {renderedItems}\n        </StyledMenu>\n      )}\n\n      {/* Empty State - show when search term exists but no results */}\n      {!isLoading && showEmptyState && (\n        <StyledEmptyState>{emptyLabel}</StyledEmptyState>\n      )}\n\n      {/* Footer */}\n      {footer && (\n        <StyledFooter\n          role=\"presentation\"\n          data-size={size}\n          styles={footerStyles}\n        >\n          {footer}\n        </StyledFooter>\n      )}\n    </StyledCommandMenu>\n  );\n}\n\n// forwardRef doesn't support generic parameters, so cast the result to the correct type\nconst _CommandMenu = React.forwardRef(CommandMenu) as <T>(\n  props: CubeCommandMenuProps<T> & React.RefAttributes<HTMLDivElement>,\n) => ReactElement;\n\n// Attach Trigger alias from MenuTrigger for consistent API\n// Also attach Item and Section for compound component pattern\nconst __CommandMenu = Object.assign(_CommandMenu, {\n  Trigger: MenuTrigger,\n  Item,\n  Section,\n  displayName: 'CommandMenu',\n});\n\nexport { __CommandMenu as CommandMenu };\n"],"mappings":"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"}

package/dist/components/actions/CommandMenu/styled.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 
 //#region src/components/actions/CommandMenu/styled.tsx

package/dist/components/actions/ItemAction/ItemAction.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { mergeProps } from "../../../utils/react/mergeProps.js";
 import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
 import { DANGER_CLEAR_STYLES, DANGER_OUTLINE_STYLES, DANGER_PRIMARY_STYLES, DEFAULT_CLEAR_STYLES, DEFAULT_OUTLINE_STYLES, DEFAULT_PRIMARY_STYLES, ITEM_ACTION_BASE_STYLES, NOTE_CLEAR_STYLES, NOTE_OUTLINE_STYLES, NOTE_PRIMARY_STYLES, SPECIAL_CLEAR_STYLES, SPECIAL_OUTLINE_STYLES, SPECIAL_PRIMARY_STYLES, SUCCESS_CLEAR_STYLES, SUCCESS_OUTLINE_STYLES, SUCCESS_PRIMARY_STYLES, WARNING_CLEAR_STYLES, WARNING_OUTLINE_STYLES, WARNING_PRIMARY_STYLES } from "../../../data/item-themes.js";

package/dist/components/actions/ItemActionContext.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { createContext, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
 

package/dist/components/actions/ItemButton/ItemButton.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { mergeRefs } from "../../../utils/react/useCombinedRefs.js";
 import { useDismissParentPopover } from "../../../utils/react/usePopoverSync.js";

package/dist/components/actions/Link/Link.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { Button } from "../Button/Button.js";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/actions/Menu/Menu.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { _CollectionItem } from "../../CollectionItem.js";

package/dist/components/actions/Menu/MenuItem.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { filterCollectionItemProps } from "../../CollectionItem.js";
 import { _Item } from "../../content/Item/Item.js";

package/dist/components/actions/Menu/MenuSection.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { TooltipProvider } from "../../overlays/Tooltip/TooltipProvider.js";
 import { MenuItem } from "./MenuItem.js";
 import { StyledMenu, StyledSection, StyledSectionHeading } from "./styled.js";

package/dist/components/actions/Menu/MenuTrigger.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { SlotProvider } from "../../../utils/react/Slots.js";
 import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";

package/dist/components/actions/Menu/SubMenuTrigger.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { usePopoverSync } from "../../../utils/react/usePopoverSync.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { MenuContext, useMenuContext } from "./context.js";

package/dist/components/actions/Menu/SubmenuTriggerContext.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import React from "react";
 
 //#region src/components/actions/Menu/SubmenuTriggerContext.tsx

package/dist/components/actions/Menu/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import React, { useContext } from "react";
 
 //#region src/components/actions/Menu/context.ts

package/dist/components/actions/Menu/styled.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { DEFAULT_CLEAR_STYLES } from "../../../data/item-themes.js";
 import { Space } from "../../layout/Space.js";
 import { DEFAULT_BUTTON_STYLES } from "../Button/Button.js";

package/dist/components/actions/index.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { ItemActionProvider, useItemActionContext } from "./ItemActionContext.js";
 import { openLink, parseTo, performClickHandler, useAction } from "./use-action.js";
 import { ItemAction } from "./ItemAction/ItemAction.js";

package/dist/components/actions/use-action.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../utils/react/mergeProps.js";
 import { useEvent } from "../../_internal/hooks/use-event.js";
 import { useFocus as useFocus$1 } from "../../utils/react/interactions.js";

package/dist/components/actions/use-anchored-menu.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../utils/react/mergeProps.js";
 import { usePopoverSync } from "../../utils/react/usePopoverSync.js";
 import { useEvent } from "../../_internal/hooks/use-event.js";

package/dist/components/actions/use-context-menu.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { mergeProps as mergeProps$1 } from "../../utils/react/mergeProps.js";
 import { usePopoverSync } from "../../utils/react/usePopoverSync.js";
 import { useEvent } from "../../_internal/hooks/use-event.js";
@@ -8,6 +8,7 @@ import { _MenuTrigger } from "./Menu/MenuTrigger.js";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { VisuallyHidden } from "react-aria";
+import { createPortal } from "react-dom";
 import { Pressable } from "@react-aria/interactions";
 
 //#region src/components/actions/use-context-menu.tsx
@@ -51,45 +52,33 @@ function useContextMenu(Component, defaultTriggerProps, defaultMenuProps) {
 	function setupCheck() {
 		if (!setupRef.current) throw new Error("useContextMenu: MenuTrigger must be rendered. Use `rendered` property to include it in your component tree.");
 	}
+	/**
+	* Where to put the invisible anchor, in **viewport** coordinates.
+	*
+	* Viewport rather than container-relative on purpose. The anchor is rendered
+	* into a fixed-position host pinned to the viewport origin (see
+	* `renderedMenu`), so the two agree by construction. Computing coordinates
+	* against the target element while the anchor's containing block was
+	* whichever positioned ancestor happened to enclose `rendered` is what used
+	* to open the menu one ancestor-origin away from the pointer.
+	*/
 	const calculatePosition = (event) => {
-		const container = targetRef.current;
-		if (!event) {
-			if (!container) return {
-				x: 0,
-				y: 0
-			};
-			container.getBoundingClientRect();
-			const scrollLeft = container.scrollLeft;
-			const scrollTop = container.scrollTop;
-			const computed = window.getComputedStyle(container);
-			parseFloat(computed.borderLeftWidth);
-			parseFloat(computed.borderTopWidth);
-			const x = container.clientWidth / 2 + scrollLeft;
-			const y = container.clientHeight / 2 + scrollTop;
-			return {
-				x: Math.max(0, Math.min(x, container.scrollWidth)),
-				y: Math.max(0, Math.min(y, container.scrollHeight))
-			};
-		}
-		if (!container) {
+		if (event) {
 			const { clientX = 0, clientY = 0 } = event;
 			return {
 				x: clientX,
 				y: clientY
 			};
 		}
-		const containerRect = container.getBoundingClientRect();
-		const { clientX, clientY } = event;
-		const scrollLeft = container.scrollLeft;
-		const scrollTop = container.scrollTop;
-		const computed = window.getComputedStyle(container);
-		const borderLeft = parseFloat(computed.borderLeftWidth) || 0;
-		const borderTop = parseFloat(computed.borderTopWidth) || 0;
-		const x = clientX - containerRect.left - borderLeft + scrollLeft;
-		const y = clientY - containerRect.top - borderTop + scrollTop;
+		const container = targetRef.current;
+		if (!container) return {
+			x: 0,
+			y: 0
+		};
+		const rect = container.getBoundingClientRect();
 		return {
-			x: Math.max(0, Math.min(x, container.scrollWidth)),
-			y: Math.max(0, Math.min(y, container.scrollHeight))
+			x: rect.left + rect.width / 2,
+			y: rect.top + rect.height / 2
 		};
 	};
 	const open = useEvent((props = {}, triggerProps, event) => {
@@ -137,19 +126,28 @@ function useContextMenu(Component, defaultTriggerProps, defaultMenuProps) {
 	}, [onContextMenu]);
 	const renderedMenu = useMemo(() => {
 		if (!componentProps || !anchorPosition) return null;
-		return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("span", {
-			ref: invisibleAnchorRef,
+		return /* @__PURE__ */ jsxs(Fragment$1, { children: [createPortal(/* @__PURE__ */ jsx("div", {
 			style: {
-				position: "absolute",
-				left: `${anchorPosition.x}px`,
-				top: `${anchorPosition.y}px`,
-				width: "0px",
-				height: "0px",
-				lineHeight: "0",
-				pointerEvents: "none",
-				visibility: "hidden"
-			}
-		}), /* @__PURE__ */ jsxs(_MenuTrigger, {
+				position: "fixed",
+				left: 0,
+				top: 0,
+				width: 0,
+				height: 0
+			},
+			children: /* @__PURE__ */ jsx("span", {
+				ref: invisibleAnchorRef,
+				style: {
+					position: "absolute",
+					left: `${anchorPosition.x}px`,
+					top: `${anchorPosition.y}px`,
+					width: "0px",
+					height: "0px",
+					lineHeight: "0",
+					pointerEvents: "none",
+					visibility: "hidden"
+				}
+			})
+		}), document.body), /* @__PURE__ */ jsxs(_MenuTrigger, {
 			offset: 0,
 			crossOffset: 0,
 			placement: triggerProps?.placement || defaultTriggerProps?.placement || "bottom start",

package/dist/components/actions/use-context-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-context-menu.js","names":["MenuTrigger","mergeProps"],"sources":["../../../src/components/actions/use-context-menu.tsx"],"sourcesContent":["import { Pressable } from '@react-aria/interactions';\nimport {\n  ComponentProps,\n  ComponentType,\n  MouseEvent,\n  PointerEvent,\n  ReactElement,\n  RefObject,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { VisuallyHidden } from 'react-aria';\n\nimport { useEvent } from '../../_internal';\nimport { useI18n } from '../../i18n';\nimport { generateRandomId } from '../../utils/random';\nimport { mergeProps } from '../../utils/react';\nimport { usePopoverSync } from '../../utils/react/usePopoverSync';\n\nimport { MenuTrigger } from './Menu';\n\ntype NativeMouseEvent = globalThis.MouseEvent;\ntype NativePointerEvent = globalThis.PointerEvent;\n\nexport interface UseContextMenuReturn<\n  E extends HTMLElement = HTMLElement,\n  P extends object = {},\n  T = ComponentProps<typeof MenuTrigger>,\n> {\n  /** Container element that receives context menu events. Attach this ref to your target element. */\n  targetRef: RefObject<E | null>;\n\n  /**\n   * Programmatically opens the menu at the specified coordinates or element center.\n   * Runtime props are merged with defaultMenuProps (runtime props take precedence).\n   *\n   * @param props - Props to pass to the menu component (optional, defaults to defaultMenuProps)\n   * @param triggerProps - Additional props for MenuTrigger (merged with defaultTriggerProps)\n   * @param event - The pointer/mouse event containing coordinates for positioning (optional, centers on element if not provided)\n   */\n  open(\n    props?: P,\n    triggerProps?: T,\n    event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n  ): void;\n\n  /**\n   * Updates the props of the currently open menu without repositioning.\n   * Props are merged with defaultMenuProps.\n   */\n  update(props: P, triggerProps?: T): void;\n\n  /** Closes the menu programmatically. */\n  close(): void;\n\n  /** Current open/closed state of the menu. */\n  isOpen: boolean;\n\n  /**\n   * JSX element that must be rendered in your component tree.\n   * Contains the MenuTrigger and positioning logic.\n   * IMPORTANT: Must be placed directly inside the target container (the element with targetRef).\n   */\n  get rendered(): ReactElement | null;\n}\n\n/**\n * Generic hook to manage a context menu component that opens at pointer coordinates.\n *\n * @param Component - A React component that represents the menu content (Menu or CommandMenu).\n * @param defaultTriggerProps - Default props to pass to the MenuTrigger.\n * @param defaultMenuProps - Default props to pass to the Menu component.\n * @returns An object with `targetRef` to attach to the container element, `open` function to open the menu at event coordinates, `close` function to close the menu, and `rendered` JSX element to include in your component tree.\n */\nexport function useContextMenu<\n  E extends HTMLElement = HTMLElement,\n  P extends object = {},\n  T = ComponentProps<typeof MenuTrigger>,\n>(\n  Component: ComponentType<P>,\n  defaultTriggerProps?: Omit<\n    ComponentProps<typeof MenuTrigger>,\n    'children' | 'isOpen' | 'onOpenChange' | 'targetRef'\n  >,\n  defaultMenuProps?: P,\n): UseContextMenuReturn<E, P, T> {\n  const { t } = useI18n();\n  const [isOpen, setIsOpen] = useState(false);\n  const [componentProps, setComponentProps] = useState<P | null>(null);\n  const [triggerProps, setTriggerProps] = useState<T | null>(null);\n  const [anchorPosition, setAnchorPosition] = useState<{\n    x: number;\n    y: number;\n  } | null>(null);\n  const targetRef = useRef<E>(null);\n  const invisibleAnchorRef = useRef<HTMLSpanElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const setupRef = useRef(false);\n\n  // Mark the container as a popover trigger so that other open menus' close-on-\n  // outside predicates treat clicks inside it (including programmatic\n  // open buttons rendered alongside a context-menu target) as a legitimate\n  // trigger interaction instead of a generic outside click. This mirrors the\n  // pattern in `useAnchoredMenu`.\n  useEffect(() => {\n    const el = targetRef.current;\n    if (el) {\n      el.dataset.popoverTrigger = '';\n      return () => {\n        delete el.dataset.popoverTrigger;\n      };\n    }\n  }, []);\n\n  // Generate a unique ID for this menu instance\n  const menuId = useMemo(() => generateRandomId(), []);\n\n  // Feed both the context-menu target (`triggerRef`) and the popover\n  // container (`containerRef`) into the sync. The container ref is shared with\n  // the rendered `MenuTrigger` via its `popoverRef` prop — the dummy\n  // `MenuTrigger` opts out of `usePopoverSync` (`enabled: !isDummy`), so\n  // without this the nested-popover guard would have no container to match\n  // against and a `SubMenuTrigger` opened inside this menu would close the\n  // whole menu.\n  usePopoverSync({\n    menuId,\n    isOpen,\n    onClose: () => {\n      setIsOpen(false);\n      setAnchorPosition(null);\n    },\n    triggerRef: targetRef as RefObject<HTMLElement | null>,\n    containerRef: popoverRef,\n  });\n\n  function setupCheck() {\n    if (!setupRef.current) {\n      throw new Error(\n        'useContextMenu: MenuTrigger must be rendered. Use `rendered` property to include it in your component tree.',\n      );\n    }\n  }\n\n  // Helper function to calculate position relative to targetRef, taking the\n  // element's scroll offset into account. Without the scroll offset the menu\n  // would be rendered at the wrong place inside scrollable containers.\n  const calculatePosition = (\n    event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n  ) => {\n    const container = targetRef.current;\n\n    // If no event is provided, position at the center of the element\n    if (!event) {\n      if (!container) {\n        return { x: 0, y: 0 };\n      }\n\n      const containerRect = container.getBoundingClientRect();\n      const scrollLeft = container.scrollLeft;\n      const scrollTop = container.scrollTop;\n\n      const computed = window.getComputedStyle(container);\n      const borderLeft = parseFloat(computed.borderLeftWidth) || 0;\n      const borderTop = parseFloat(computed.borderTopWidth) || 0;\n\n      // Position at the center of the element's content area\n      const x = container.clientWidth / 2 + scrollLeft;\n      const y = container.clientHeight / 2 + scrollTop;\n\n      // Clamp to the full scroll size\n      const clampedX = Math.max(0, Math.min(x, container.scrollWidth));\n      const clampedY = Math.max(0, Math.min(y, container.scrollHeight));\n\n      return { x: clampedX, y: clampedY };\n    }\n\n    // If the target reference is missing, fall back to viewport coordinates.\n    if (!container) {\n      const { clientX = 0, clientY = 0 } = event;\n\n      return { x: clientX, y: clientY };\n    }\n\n    const containerRect = container.getBoundingClientRect();\n\n    // Get coordinates from the event (viewport-relative)\n    const { clientX, clientY } = event;\n\n    // Take the element's scroll offset into account so that the coordinates are\n    // relative to the **content** box, not the visible viewport of the\n    // element.\n    const scrollLeft = container.scrollLeft;\n    const scrollTop = container.scrollTop;\n\n    const computed = window.getComputedStyle(container);\n    const borderLeft = parseFloat(computed.borderLeftWidth) || 0;\n    const borderTop = parseFloat(computed.borderTopWidth) || 0;\n\n    const x = clientX - containerRect.left - borderLeft + scrollLeft;\n    const y = clientY - containerRect.top - borderTop + scrollTop;\n\n    // Clamp to the full scroll size so that the invisible anchor always stays\n    // inside the element regardless of the scroll position.\n    const clampedX = Math.max(0, Math.min(x, container.scrollWidth));\n    const clampedY = Math.max(0, Math.min(y, container.scrollHeight));\n\n    return { x: clampedX, y: clampedY };\n  };\n\n  // 'open' accepts props, trigger props, and optional event for positioning, then opens the menu\n  const open = useEvent(\n    (\n      props: P = {} as P,\n      triggerProps?: T,\n      event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n    ) => {\n      setupCheck();\n\n      // Ensure the target element can serve as a positioning context for the\n      // invisible target element. If the consumer hasn't explicitly set\n      // `position: relative | absolute | fixed | sticky` we switch it to\n      // `relative` so that absolutely-positioned children are laid out correctly.\n      if (targetRef.current) {\n        const computedStyle = window.getComputedStyle(targetRef.current);\n\n        if (computedStyle.position === 'static') {\n          targetRef.current.style.position = 'relative';\n        }\n      }\n\n      // Prevent default context menu if it's a context menu event\n      if (\n        event &&\n        'preventDefault' in event &&\n        typeof event.preventDefault === 'function'\n      ) {\n        event.preventDefault();\n      }\n\n      const { x, y } = calculatePosition(event);\n      setAnchorPosition({ x, y });\n\n      // Merge defaultMenuProps with provided props\n      const finalProps = defaultMenuProps\n        ? { ...defaultMenuProps, ...props }\n        : props;\n\n      setComponentProps(finalProps);\n      setTriggerProps(triggerProps ?? null);\n      setIsOpen(true);\n    },\n  );\n\n  const update = useEvent((props: P, triggerProps?: T) => {\n    setupCheck();\n\n    // Merge defaultMenuProps with provided props\n    const finalProps = defaultMenuProps\n      ? { ...defaultMenuProps, ...props }\n      : props;\n\n    setComponentProps(finalProps as P);\n    setTriggerProps(triggerProps ?? null);\n  });\n\n  const close = useEvent(() => {\n    setIsOpen(false);\n    setAnchorPosition(null);\n  });\n\n  // Context menu event handler\n  const onContextMenu = useEvent(\n    (event: MouseEvent | PointerEvent | MouseEvent | PointerEvent) => {\n      event.preventDefault();\n      if (isOpen) {\n        const pos = calculatePosition(event);\n        setAnchorPosition(pos);\n      } else {\n        open(defaultMenuProps, undefined, event);\n      }\n    },\n  );\n\n  // Bind the onContextMenu event to targetRef\n  useEffect(() => {\n    const element = targetRef.current;\n    if (!element) return;\n\n    element.addEventListener('contextmenu', onContextMenu as any);\n\n    return () => {\n      element.removeEventListener('contextmenu', onContextMenu as any);\n    };\n  }, [onContextMenu]);\n\n  // Render the menu only when componentProps is set\n  const renderedMenu = useMemo(() => {\n    if (!componentProps || !anchorPosition) return null;\n\n    return (\n      <>\n        {/* Invisible anchor element positioned at click coordinates */}\n        <span\n          ref={invisibleAnchorRef}\n          style={{\n            position: 'absolute',\n            left: `${anchorPosition.x}px`,\n            top: `${anchorPosition.y}px`,\n            width: '0px',\n            height: '0px',\n            lineHeight: '0',\n            pointerEvents: 'none',\n            visibility: 'hidden',\n          }}\n        />\n        <MenuTrigger\n          offset={0}\n          crossOffset={0}\n          placement={\n            (triggerProps as ComponentProps<typeof MenuTrigger>)?.placement ||\n            defaultTriggerProps?.placement ||\n            'bottom start'\n          }\n          {...mergeProps(defaultTriggerProps, triggerProps || undefined)}\n          isDummy\n          isOpen={isOpen}\n          targetRef={invisibleAnchorRef}\n          popoverRef={popoverRef}\n          onOpenChange={setIsOpen}\n        >\n          <VisuallyHidden>\n            <Pressable>\n              <button\n                aria-label={t(\n                  'contextMenu.openContextMenu',\n                  'Open context menu',\n                )}\n              />\n            </Pressable>\n          </VisuallyHidden>\n          <Component {...componentProps} />\n        </MenuTrigger>\n      </>\n    );\n  }, [\n    componentProps,\n    triggerProps,\n    isOpen,\n    defaultTriggerProps,\n    anchorPosition,\n    t,\n  ]);\n\n  return {\n    targetRef,\n    open,\n    update,\n    close,\n    isOpen,\n    get rendered() {\n      setupRef.current = true;\n\n      return renderedMenu;\n    },\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA4EA,SAAgB,eAKd,WACA,qBAIA,kBAC+B;CAC/B,MAAM,EAAE,MAAM,SAAS;CACvB,MAAM,CAAC,QAAQ,aAAa,SAAS,MAAM;CAC3C,MAAM,CAAC,gBAAgB,qBAAqB,SAAmB,KAAK;CACpE,MAAM,CAAC,cAAc,mBAAmB,SAAmB,KAAK;CAChE,MAAM,CAAC,gBAAgB,qBAAqB,SAGlC,KAAK;CACf,MAAM,YAAY,OAAU,KAAK;CACjC,MAAM,qBAAqB,OAAwB,KAAK;CACxD,MAAM,aAAa,OAAuB,KAAK;CAC/C,MAAM,WAAW,OAAO,MAAM;AAO9B,iBAAgB;EACd,MAAM,KAAK,UAAU;AACrB,MAAI,IAAI;AACN,MAAG,QAAQ,iBAAiB;AAC5B,gBAAa;AACX,WAAO,GAAG,QAAQ;;;IAGrB,EAAE,CAAC;AAYN,gBAAe;EACb,QAVa,cAAc,kBAAkB,EAAE,EAAE,CAAC;EAWlD;EACA,eAAe;AACb,aAAU,MAAM;AAChB,qBAAkB,KAAK;;EAEzB,YAAY;EACZ,cAAc;EACf,CAAC;CAEF,SAAS,aAAa;AACpB,MAAI,CAAC,SAAS,QACZ,OAAM,IAAI,MACR,8GACD;;CAOL,MAAM,qBACJ,UACG;EACH,MAAM,YAAY,UAAU;AAG5B,MAAI,CAAC,OAAO;AACV,OAAI,CAAC,UACH,QAAO;IAAE,GAAG;IAAG,GAAG;IAAG;AAGD,aAAU,uBAAuB;GACvD,MAAM,aAAa,UAAU;GAC7B,MAAM,YAAY,UAAU;GAE5B,MAAM,WAAW,OAAO,iBAAiB,UAAU;AAChC,cAAW,SAAS,gBAAgB;AACrC,cAAW,SAAS,eAAe;GAGrD,MAAM,IAAI,UAAU,cAAc,IAAI;GACtC,MAAM,IAAI,UAAU,eAAe,IAAI;AAMvC,UAAO;IAAE,GAHQ,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,UAAU,YAAY,CAAC;IAG1C,GAFL,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,UAAU,aAAa,CAAC;IAE9B;;AAIrC,MAAI,CAAC,WAAW;GACd,MAAM,EAAE,UAAU,GAAG,UAAU,MAAM;AAErC,UAAO;IAAE,GAAG;IAAS,GAAG;IAAS;;EAGnC,MAAM,gBAAgB,UAAU,uBAAuB;EAGvD,MAAM,EAAE,SAAS,YAAY;EAK7B,MAAM,aAAa,UAAU;EAC7B,MAAM,YAAY,UAAU;EAE5B,MAAM,WAAW,OAAO,iBAAiB,UAAU;EACnD,MAAM,aAAa,WAAW,SAAS,gBAAgB,IAAI;EAC3D,MAAM,YAAY,WAAW,SAAS,eAAe,IAAI;EAEzD,MAAM,IAAI,UAAU,cAAc,OAAO,aAAa;EACtD,MAAM,IAAI,UAAU,cAAc,MAAM,YAAY;AAOpD,SAAO;GAAE,GAHQ,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,UAAU,YAAY,CAAC;GAG1C,GAFL,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,UAAU,aAAa,CAAC;GAE9B;;CAIrC,MAAM,OAAO,UAET,QAAW,EAAE,EACb,cACA,UACG;AACH,cAAY;AAMZ,MAAI,UAAU,SAGZ;OAFsB,OAAO,iBAAiB,UAAU,QAAQ,CAE9C,aAAa,SAC7B,WAAU,QAAQ,MAAM,WAAW;;AAKvC,MACE,SACA,oBAAoB,SACpB,OAAO,MAAM,mBAAmB,WAEhC,OAAM,gBAAgB;EAGxB,MAAM,EAAE,GAAG,MAAM,kBAAkB,MAAM;AACzC,oBAAkB;GAAE;GAAG;GAAG,CAAC;AAO3B,oBAJmB,mBACf;GAAE,GAAG;GAAkB,GAAG;GAAO,GACjC,MAEyB;AAC7B,kBAAgB,gBAAgB,KAAK;AACrC,YAAU,KAAK;GAElB;CAED,MAAM,SAAS,UAAU,OAAU,iBAAqB;AACtD,cAAY;AAOZ,oBAJmB,mBACf;GAAE,GAAG;GAAkB,GAAG;GAAO,GACjC,MAE8B;AAClC,kBAAgB,gBAAgB,KAAK;GACrC;CAEF,MAAM,QAAQ,eAAe;AAC3B,YAAU,MAAM;AAChB,oBAAkB,KAAK;GACvB;CAGF,MAAM,gBAAgB,UACnB,UAAiE;AAChE,QAAM,gBAAgB;AACtB,MAAI,OAEF,mBADY,kBAAkB,MAAM,CACd;MAEtB,MAAK,kBAAkB,QAAW,MAAM;GAG7C;AAGD,iBAAgB;EACd,MAAM,UAAU,UAAU;AAC1B,MAAI,CAAC,QAAS;AAEd,UAAQ,iBAAiB,eAAe,cAAqB;AAE7D,eAAa;AACX,WAAQ,oBAAoB,eAAe,cAAqB;;IAEjE,CAAC,cAAc,CAAC;CAGnB,MAAM,eAAe,cAAc;AACjC,MAAI,CAAC,kBAAkB,CAAC,eAAgB,QAAO;AAE/C,SACE,8CAEE,oBAAC;GACC,KAAK;GACL,OAAO;IACL,UAAU;IACV,MAAM,GAAG,eAAe,EAAE;IAC1B,KAAK,GAAG,eAAe,EAAE;IACzB,OAAO;IACP,QAAQ;IACR,YAAY;IACZ,eAAe;IACf,YAAY;IACb;IACD,EACF,qBAACA;GACC,QAAQ;GACR,aAAa;GACb,WACG,cAAqD,aACtD,qBAAqB,aACrB;GAEF,GAAIC,aAAW,qBAAqB,gBAAgB,OAAU;GAC9D;GACQ;GACR,WAAW;GACC;GACZ,cAAc;cAEd,oBAAC,4BACC,oBAAC,uBACC,oBAAC,YACC,cAAY,EACV,+BACA,oBACD,GACD,GACQ,GACG,EACjB,oBAAC,aAAU,GAAI,iBAAkB;IACrB,IACb;IAEJ;EACD;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QAAO;EACL;EACA;EACA;EACA;EACA;EACA,IAAI,WAAW;AACb,YAAS,UAAU;AAEnB,UAAO;;EAEV"}
+{"version":3,"file":"use-context-menu.js","names":["MenuTrigger","mergeProps"],"sources":["../../../src/components/actions/use-context-menu.tsx"],"sourcesContent":["import { Pressable } from '@react-aria/interactions';\nimport {\n  ComponentProps,\n  ComponentType,\n  MouseEvent,\n  PointerEvent,\n  ReactElement,\n  RefObject,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { VisuallyHidden } from 'react-aria';\nimport { createPortal } from 'react-dom';\n\nimport { useEvent } from '../../_internal';\nimport { useI18n } from '../../i18n';\nimport { generateRandomId } from '../../utils/random';\nimport { mergeProps } from '../../utils/react';\nimport { usePopoverSync } from '../../utils/react/usePopoverSync';\n\nimport { MenuTrigger } from './Menu';\n\ntype NativeMouseEvent = globalThis.MouseEvent;\ntype NativePointerEvent = globalThis.PointerEvent;\n\nexport interface UseContextMenuReturn<\n  E extends HTMLElement = HTMLElement,\n  P extends object = {},\n  T = ComponentProps<typeof MenuTrigger>,\n> {\n  /** Container element that receives context menu events. Attach this ref to your target element. */\n  targetRef: RefObject<E | null>;\n\n  /**\n   * Programmatically opens the menu at the specified coordinates or element center.\n   * Runtime props are merged with defaultMenuProps (runtime props take precedence).\n   *\n   * @param props - Props to pass to the menu component (optional, defaults to defaultMenuProps)\n   * @param triggerProps - Additional props for MenuTrigger (merged with defaultTriggerProps)\n   * @param event - The pointer/mouse event containing coordinates for positioning (optional, centers on element if not provided)\n   */\n  open(\n    props?: P,\n    triggerProps?: T,\n    event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n  ): void;\n\n  /**\n   * Updates the props of the currently open menu without repositioning.\n   * Props are merged with defaultMenuProps.\n   */\n  update(props: P, triggerProps?: T): void;\n\n  /** Closes the menu programmatically. */\n  close(): void;\n\n  /** Current open/closed state of the menu. */\n  isOpen: boolean;\n\n  /**\n   * JSX element that must be rendered in your component tree.\n   * Contains the MenuTrigger and positioning logic.\n   * IMPORTANT: Must be placed directly inside the target container (the element with targetRef).\n   */\n  get rendered(): ReactElement | null;\n}\n\n/**\n * Generic hook to manage a context menu component that opens at pointer coordinates.\n *\n * @param Component - A React component that represents the menu content (Menu or CommandMenu).\n * @param defaultTriggerProps - Default props to pass to the MenuTrigger.\n * @param defaultMenuProps - Default props to pass to the Menu component.\n * @returns An object with `targetRef` to attach to the container element, `open` function to open the menu at event coordinates, `close` function to close the menu, and `rendered` JSX element to include in your component tree.\n */\nexport function useContextMenu<\n  E extends HTMLElement = HTMLElement,\n  P extends object = {},\n  T = ComponentProps<typeof MenuTrigger>,\n>(\n  Component: ComponentType<P>,\n  defaultTriggerProps?: Omit<\n    ComponentProps<typeof MenuTrigger>,\n    'children' | 'isOpen' | 'onOpenChange' | 'targetRef'\n  >,\n  defaultMenuProps?: P,\n): UseContextMenuReturn<E, P, T> {\n  const { t } = useI18n();\n  const [isOpen, setIsOpen] = useState(false);\n  const [componentProps, setComponentProps] = useState<P | null>(null);\n  const [triggerProps, setTriggerProps] = useState<T | null>(null);\n  const [anchorPosition, setAnchorPosition] = useState<{\n    x: number;\n    y: number;\n  } | null>(null);\n  const targetRef = useRef<E>(null);\n  const invisibleAnchorRef = useRef<HTMLSpanElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const setupRef = useRef(false);\n\n  // Mark the container as a popover trigger so that other open menus' close-on-\n  // outside predicates treat clicks inside it (including programmatic\n  // open buttons rendered alongside a context-menu target) as a legitimate\n  // trigger interaction instead of a generic outside click. This mirrors the\n  // pattern in `useAnchoredMenu`.\n  useEffect(() => {\n    const el = targetRef.current;\n    if (el) {\n      el.dataset.popoverTrigger = '';\n      return () => {\n        delete el.dataset.popoverTrigger;\n      };\n    }\n  }, []);\n\n  // Generate a unique ID for this menu instance\n  const menuId = useMemo(() => generateRandomId(), []);\n\n  // Feed both the context-menu target (`triggerRef`) and the popover\n  // container (`containerRef`) into the sync. The container ref is shared with\n  // the rendered `MenuTrigger` via its `popoverRef` prop — the dummy\n  // `MenuTrigger` opts out of `usePopoverSync` (`enabled: !isDummy`), so\n  // without this the nested-popover guard would have no container to match\n  // against and a `SubMenuTrigger` opened inside this menu would close the\n  // whole menu.\n  usePopoverSync({\n    menuId,\n    isOpen,\n    onClose: () => {\n      setIsOpen(false);\n      setAnchorPosition(null);\n    },\n    triggerRef: targetRef as RefObject<HTMLElement | null>,\n    containerRef: popoverRef,\n  });\n\n  function setupCheck() {\n    if (!setupRef.current) {\n      throw new Error(\n        'useContextMenu: MenuTrigger must be rendered. Use `rendered` property to include it in your component tree.',\n      );\n    }\n  }\n\n  /**\n   * Where to put the invisible anchor, in **viewport** coordinates.\n   *\n   * Viewport rather than container-relative on purpose. The anchor is rendered\n   * into a fixed-position host pinned to the viewport origin (see\n   * `renderedMenu`), so the two agree by construction. Computing coordinates\n   * against the target element while the anchor's containing block was\n   * whichever positioned ancestor happened to enclose `rendered` is what used\n   * to open the menu one ancestor-origin away from the pointer.\n   */\n  const calculatePosition = (\n    event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n  ) => {\n    if (event) {\n      const { clientX = 0, clientY = 0 } = event;\n\n      return { x: clientX, y: clientY };\n    }\n\n    // No event — a keyboard opening, which has no coordinates. Anchor on the\n    // target element's centre instead.\n    const container = targetRef.current;\n\n    if (!container) return { x: 0, y: 0 };\n\n    const rect = container.getBoundingClientRect();\n\n    return { x: rect.left + rect.width / 2, y: rect.top + rect.height / 2 };\n  };\n\n  // 'open' accepts props, trigger props, and optional event for positioning, then opens the menu\n  const open = useEvent(\n    (\n      props: P = {} as P,\n      triggerProps?: T,\n      event?: NativeMouseEvent | NativePointerEvent | MouseEvent | PointerEvent,\n    ) => {\n      setupCheck();\n\n      // Ensure the target element can serve as a positioning context for the\n      // invisible target element. If the consumer hasn't explicitly set\n      // `position: relative | absolute | fixed | sticky` we switch it to\n      // `relative` so that absolutely-positioned children are laid out correctly.\n      if (targetRef.current) {\n        const computedStyle = window.getComputedStyle(targetRef.current);\n\n        if (computedStyle.position === 'static') {\n          targetRef.current.style.position = 'relative';\n        }\n      }\n\n      // Prevent default context menu if it's a context menu event\n      if (\n        event &&\n        'preventDefault' in event &&\n        typeof event.preventDefault === 'function'\n      ) {\n        event.preventDefault();\n      }\n\n      const { x, y } = calculatePosition(event);\n      setAnchorPosition({ x, y });\n\n      // Merge defaultMenuProps with provided props\n      const finalProps = defaultMenuProps\n        ? { ...defaultMenuProps, ...props }\n        : props;\n\n      setComponentProps(finalProps);\n      setTriggerProps(triggerProps ?? null);\n      setIsOpen(true);\n    },\n  );\n\n  const update = useEvent((props: P, triggerProps?: T) => {\n    setupCheck();\n\n    // Merge defaultMenuProps with provided props\n    const finalProps = defaultMenuProps\n      ? { ...defaultMenuProps, ...props }\n      : props;\n\n    setComponentProps(finalProps as P);\n    setTriggerProps(triggerProps ?? null);\n  });\n\n  const close = useEvent(() => {\n    setIsOpen(false);\n    setAnchorPosition(null);\n  });\n\n  // Context menu event handler\n  const onContextMenu = useEvent(\n    (event: MouseEvent | PointerEvent | MouseEvent | PointerEvent) => {\n      event.preventDefault();\n      if (isOpen) {\n        const pos = calculatePosition(event);\n        setAnchorPosition(pos);\n      } else {\n        open(defaultMenuProps, undefined, event);\n      }\n    },\n  );\n\n  // Bind the onContextMenu event to targetRef\n  useEffect(() => {\n    const element = targetRef.current;\n    if (!element) return;\n\n    element.addEventListener('contextmenu', onContextMenu as any);\n\n    return () => {\n      element.removeEventListener('contextmenu', onContextMenu as any);\n    };\n  }, [onContextMenu]);\n\n  // Render the menu only when componentProps is set\n  const renderedMenu = useMemo(() => {\n    if (!componentProps || !anchorPosition) return null;\n\n    return (\n      <>\n        {/*\n          Invisible anchor at the click coordinates.\n\n          Two things make those coordinates mean what they say:\n\n          1. A `fixed` host, so the containing block's origin is the viewport\n             rather than whichever positioned ancestor encloses `rendered` — the\n             table root, the tree row — which is what used to open the menu one\n             ancestor-origin away from the pointer.\n          2. A portal to `body`, because `position: fixed` is captured by any\n             ancestor carrying a transform, filter or `will-change`. A\n             virtualized row is usually translated, so the `fixed` host alone\n             would still be anchored to the row.\n        */}\n        {createPortal(\n          <div\n            style={{\n              position: 'fixed',\n              left: 0,\n              top: 0,\n              width: 0,\n              height: 0,\n            }}\n          >\n            <span\n              ref={invisibleAnchorRef}\n              style={{\n                position: 'absolute',\n                left: `${anchorPosition.x}px`,\n                top: `${anchorPosition.y}px`,\n                width: '0px',\n                height: '0px',\n                lineHeight: '0',\n                pointerEvents: 'none',\n                visibility: 'hidden',\n              }}\n            />\n          </div>,\n          document.body,\n        )}\n        <MenuTrigger\n          offset={0}\n          crossOffset={0}\n          placement={\n            (triggerProps as ComponentProps<typeof MenuTrigger>)?.placement ||\n            defaultTriggerProps?.placement ||\n            'bottom start'\n          }\n          {...mergeProps(defaultTriggerProps, triggerProps || undefined)}\n          isDummy\n          isOpen={isOpen}\n          targetRef={invisibleAnchorRef}\n          popoverRef={popoverRef}\n          onOpenChange={setIsOpen}\n        >\n          <VisuallyHidden>\n            <Pressable>\n              <button\n                aria-label={t(\n                  'contextMenu.openContextMenu',\n                  'Open context menu',\n                )}\n              />\n            </Pressable>\n          </VisuallyHidden>\n          <Component {...componentProps} />\n        </MenuTrigger>\n      </>\n    );\n  }, [\n    componentProps,\n    triggerProps,\n    isOpen,\n    defaultTriggerProps,\n    anchorPosition,\n    t,\n  ]);\n\n  return {\n    targetRef,\n    open,\n    update,\n    close,\n    isOpen,\n    get rendered() {\n      setupRef.current = true;\n\n      return renderedMenu;\n    },\n  };\n}\n"],"mappings":"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"}

package/dist/components/content/ActiveZone/ActiveZone.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useFocus as useFocus$1 } from "../../../utils/react/interactions.js";

package/dist/components/content/Alert/Alert.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import themes_default from "../../../data/themes.js";
 import { useAlert } from "./use-alert.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Alert/use-alert.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useDeprecationWarning } from "../../../_internal/hooks/use-deprecation-warning.js";
 import { CONTAINER_STYLES, TEXT_STYLES, filterBaseProps } from "@tenphi/tasty";

package/dist/components/content/Avatar/Avatar.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { CONTAINER_STYLES, Element, filterBaseProps } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/Badge/Badge.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { _Item } from "../Item/Item.js";
 import themes_default from "../../../data/themes.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/content/Card/Card.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";

package/dist/components/content/Content.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { CONTAINER_STYLES, TEXT_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/CopyPasteBlock/CopyPasteBlock.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useTimer } from "../../../_internal/hooks/use-timer/use-timer.js";
 import { useI18n } from "../../../i18n/useI18n.js";

package/dist/components/content/CopySnippet/CopySnippet.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { _Tooltip } from "../../overlays/Tooltip/Tooltip.js";
 import { TooltipTrigger } from "../../overlays/Tooltip/TooltipTrigger.js";
 import { useI18n } from "../../../i18n/useI18n.js";

package/dist/components/content/Disclosure/Disclosure.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeRefs } from "../../../utils/react/useCombinedRefs.js";
 import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";

package/dist/components/content/Divider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { useCombinedRefs } from "../../utils/react/useCombinedRefs.js";
 import { BASE_STYLES, COLOR_STYLES, OUTER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/Footer.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { CONTAINER_STYLES, TEXT_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/Header.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { CONTAINER_STYLES, TEXT_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/HotKeys/HotKeys.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { _Text } from "../Text.js";
 import { useKeySymbols } from "../../../utils/react/useKeySymbols.js";

package/dist/components/content/InfoBadge/InfoBadge.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { ItemBadge } from "../ItemBadge/ItemBadge.js";
 import { useI18n } from "../../../i18n/useI18n.js";

package/dist/components/content/InlineInput/InlineInput.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.155.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.157.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";