se-design 1.0.83 → 1.0.84-dev.0

package/dist/index16.js.map

@@ -1 +1 @@
-{"version":3,"file":"index16.js","sources":["../src/components/Tooltip/index.tsx"],"sourcesContent":["import React, { useEffect, useState, useRef } from 'react';\nimport ReactDOM, { flushSync } from 'react-dom';\nimport { useStableId } from '../../utils/useStableId';\nimport { useDismissOnFocusOut } from '../../utils/a11y';\n\nexport interface TooltipProps {\n  /**\n   * Tooltip contents\n   */\n  content: string | React.ReactNode;\n  /**\n   * Tooltip position\n   */\n  position?:\n    | 'top-left'\n    | 'top-center'\n    | 'top-right'\n    | 'bottom-left'\n    | 'bottom-center'\n    | 'bottom-right'\n    | 'left-top'\n    | 'left-center'\n    | 'left-bottom'\n    | 'right-top'\n    | 'right-center'\n    | 'right-bottom';\n  /**\n   * Display tooltip on Hover, Click or Always\n   */\n  displayOn?: 'hover' | 'click' | 'always-on';\n  /**\n   * Tooltip trigger contents\n   */\n  tooltipSrc?: React.ReactNode;\n  /**\n   * Tooltip trigger contents ref\n   */\n  tooltipSrcRef?: React.RefObject<HTMLElement>;\n  /**\n   * When true, the real trigger is disabled and cannot receive focus.\n   * Tooltip will make its wrapper focusable and treat it as a \"button\" that reveals tooltip content.\n   */\n  isTriggerDisabled?: boolean;\n  /**\n   * Required when isTriggerDisabled is true. Provides an accessible name for the focusable wrapper trigger.\n   */\n  disabledTriggerAriaLabel?: string;\n  /**\n   * Max width of the tooltip content\n   */\n  maxWidth?: number;\n  /**\n   * Whether to use portal for the tooltip content\n   */\n  isWithPortal?: boolean;\n  /**\n   * Tooltip content classes\n   */\n  tooltipContentClasses?: string;\n  /**\n   * Tooltip offset\n   */\n  tooltipOffset?: number;\n  /**\n   * Automation ID for testing\n   */\n  automationId?: string;\n}\n\nexport const Tooltip = ({\n  content,\n  tooltipSrc,\n  position = 'bottom-center',\n  displayOn = 'hover',\n  maxWidth = 240,\n  isWithPortal = false,\n  tooltipSrcRef = undefined,\n  isTriggerDisabled = false,\n  disabledTriggerAriaLabel = undefined,\n  tooltipContentClasses = '',\n  tooltipOffset = 8,\n  automationId = ''\n}: TooltipProps) => {\n  const [displayTooltip, setDisplayTooltip] = useState(false);\n  const tooltipContentRef = useRef<HTMLDivElement>(null);\n  // Support for external ref when provided\n  const internalToolTipSrcRef = useRef<HTMLDivElement>(null);\n  const tooltipSourceRef = (tooltipSrcRef || internalToolTipSrcRef) as React.RefObject<HTMLElement>;\n  const [tooltipPortalStyle, setTooltipPortalStyle] = useState({});\n  const [isPortalPositioned, setIsPortalPositioned] = useState(false);\n  const hideTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const isContentString = typeof content === 'string';\n  const tooltipContentId = useStableId(undefined, 'tooltip-content');\n\n  // Helper to clear hide timeout\n  const clearHideTimeout = () => {\n    if (hideTimeoutRef.current) {\n      clearTimeout(hideTimeoutRef.current);\n      hideTimeoutRef.current = null;\n    }\n  };\n\n  // Helper to schedule hide\n  const scheduleHide = () => {\n    if (displayOn !== 'always-on') {\n      clearHideTimeout();\n      hideTimeoutRef.current = setTimeout(() => setDisplayTooltip(false), 150);\n    }\n  };\n\n  const showTooltip = () => {\n    clearHideTimeout();\n    setDisplayTooltip(true);\n  };\n\n  const onDisabledTriggerKeyDown = (e: React.KeyboardEvent) => {\n    if (!isTriggerDisabled) return;\n    if (e.key === 'Escape') {\n      e.preventDefault();\n      setDisplayTooltip(false);\n      return;\n    }\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      setDisplayTooltip((prev) => !prev);\n    }\n  };\n\n  // Enabled trigger: use React focus/blur capture handlers (no native event listeners).\n  // This keeps the tooltip open while focus stays anywhere inside the tooltip wrapper.\n  const dismissOnFocusOutProps = useDismissOnFocusOut<HTMLDivElement>({\n    disabled: isTriggerDisabled,\n    onFocusIn: showTooltip,\n    onFocusOut: scheduleHide,\n    onEscape: () => setDisplayTooltip(false)\n  });\n\n  useEffect(() => {\n    const tooltipContent = tooltipContentRef.current;\n\n    if (!tooltipContent) {\n      return;\n    }\n\n    if (position == 'bottom-center') {\n      tooltipContent.setAttribute('style', `left: 50%;transform: translateX(-50%);`);\n      tooltipContent.classList.add(`before:left-[calc(50%-7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if (position == 'bottom-left') {\n      tooltipContent.classList.add(`before:left-[calc(10%-7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if (position == 'bottom-right') {\n      tooltipContent.setAttribute('style', `right: 0;`);\n      tooltipContent.classList.add(`before:right-[calc(10%+7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if (position == 'top-center') {\n      tooltipContent.setAttribute('style', `left: 50%;transform: translateX(-50%);bottom: calc(100% + 8px);`);\n      tooltipContent.classList.add(`before:left-[calc(50%-7px)]`);\n      tooltipContent.classList.add(`before:bottom-[-7px]`);\n    } else if (position == 'top-left') {\n      tooltipContent.setAttribute('style', `bottom: calc(100% + 8px);`);\n      tooltipContent.classList.add(`before:left-[calc(10%-7px)]`);\n      tooltipContent.classList.add(`before:bottom-[-7px]`);\n    } else if (position == 'top-right') {\n      tooltipContent.setAttribute('style', `right: 0;bottom: calc(100% + 8px);`);\n      tooltipContent.classList.add(`before:right-[calc(10%+7px)]`);\n      tooltipContent.classList.add(`before:bottom-[-7px]`);\n    } else if (position == 'left-top') {\n      tooltipContent.setAttribute('style', `right: calc(100% + 10px);top:0;`);\n      tooltipContent.classList.add(`before:right-[-6px]`);\n      tooltipContent.classList.add(`before:top-[7px]`);\n    } else if (position == 'left-center') {\n      tooltipContent.setAttribute('style', `right: calc(100% + 10px);top: 50%;transform: translateY(-50%);`);\n      tooltipContent.classList.add(`before:right-[-6px]`);\n      tooltipContent.classList.add(`before:top-[calc(50%-7px)]`);\n    } else if (position == 'left-bottom') {\n      tooltipContent.setAttribute('style', `right: calc(100% + 10px);bottom:0;`);\n      tooltipContent.classList.add(`before:right-[-6px]`);\n      tooltipContent.classList.add(`before:bottom-[7px]`);\n    } else if (position == 'right-top') {\n      tooltipContent.setAttribute('style', `left: calc(100% + 10px);top:0;`);\n      tooltipContent.classList.add(`before:left-[-6px]`);\n      tooltipContent.classList.add(`before:top-[7px]`);\n    } else if (position == 'right-center') {\n      tooltipContent.setAttribute('style', `left: calc(100% + 10px);top: 50%;transform: translateY(-50%);`);\n      tooltipContent.classList.add(`before:left-[-6px]`);\n      tooltipContent.classList.add(`before:top-[calc(50%-7px)]`);\n    } else if (position == 'right-bottom') {\n      tooltipContent.setAttribute('style', `left: calc(100% + 10px);bottom:0;`);\n      tooltipContent.classList.add(`before:left-[-6px]`);\n      tooltipContent.classList.add(`before:bottom-[7px]`);\n    }\n\n    if (displayOn == 'hover') {\n      tooltipContent.classList.add(`group-hover:visible`);\n    }\n  }, [content]);\n\n  useEffect(() => {\n    const tooltipContent = tooltipContentRef.current;\n\n    if (!tooltipContent) {\n      return;\n    }\n    if (displayTooltip) {\n      tooltipContent.classList.remove(`invisible`);\n    } else {\n      tooltipContent.classList.add(`invisible`);\n    }\n  }, [displayTooltip]);\n\n  // Ensure tooltip stays open when displayOn is always-on\n  useEffect(() => {\n    if (displayOn === 'always-on') {\n      setDisplayTooltip(true);\n    }\n  }, [displayOn]);\n\n  const onTooltipSrcClick = () => {\n    if (displayOn == 'click') {\n      setDisplayTooltip((displayTooltip) => !displayTooltip);\n    }\n  };\n\n  const toggleTooltip = () => {\n    setDisplayTooltip((displayTooltip) => !displayTooltip);\n  };\n\n  const events = {\n    ...(displayOn === 'click' && { onClick: toggleTooltip }),\n    ...(displayOn === 'hover' && {\n      onMouseEnter: () => setDisplayTooltip(true),\n      onMouseLeave: () => setDisplayTooltip(false)\n    })\n  };\n\n  const calculateTooltipPortalStyle = () => {\n    const refToUse = tooltipSourceRef.current;\n    if (!refToUse) {\n      return {};\n    }\n\n    const srcRect = refToUse.getBoundingClientRect();\n    const scrollX = window.scrollX || window.pageXOffset;\n    const scrollY = window.scrollY || window.pageYOffset;\n    const arrowSize = 14; // 14px (3.5 * 4 = 14px in Tailwind)\n\n    // Get tooltip content dimensions if available\n    const tooltipElement = document.getElementById(tooltipContentId);\n    const tooltipWidth = tooltipElement?.offsetWidth || 0;\n    const tooltipHeight = tooltipElement?.offsetHeight || 0;\n\n    let top = 0;\n    let left = 0;\n    let arrowLeft = 0;\n    let arrowTop = 0;\n\n    switch (position) {\n      case 'bottom-center':\n        top = srcRect.bottom + scrollY + tooltipOffset;\n        left = srcRect.left + scrollX + srcRect.width / 2 - tooltipWidth / 2;\n        arrowLeft = tooltipWidth / 2 - arrowSize / 2;\n        arrowTop = -arrowSize / 2;\n        break;\n      case 'bottom-left':\n        top = srcRect.bottom + scrollY + tooltipOffset;\n        left = srcRect.left + scrollX;\n        arrowLeft = tooltipWidth * 0.1 - arrowSize / 2;\n        arrowTop = -arrowSize / 2;\n        break;\n      case 'bottom-right':\n        top = srcRect.bottom + scrollY + tooltipOffset;\n        left = srcRect.right + scrollX - tooltipWidth;\n        arrowLeft = tooltipWidth - tooltipWidth * 0.1 - arrowSize / 2;\n        arrowTop = -arrowSize / 2;\n        break;\n      case 'top-center':\n        top = srcRect.top + scrollY - tooltipHeight - tooltipOffset;\n        left = srcRect.left + scrollX + srcRect.width / 2 - tooltipWidth / 2;\n        arrowLeft = tooltipWidth / 2 - arrowSize / 2;\n        arrowTop = tooltipHeight - arrowSize / 2;\n        break;\n      case 'top-left':\n        top = srcRect.top + scrollY - tooltipHeight - tooltipOffset;\n        left = srcRect.left + scrollX;\n        arrowLeft = tooltipWidth * 0.1 - arrowSize / 2;\n        arrowTop = tooltipHeight - arrowSize / 2;\n        break;\n      case 'top-right':\n        top = srcRect.top + scrollY - tooltipHeight - tooltipOffset;\n        left = srcRect.right + scrollX - tooltipWidth;\n        arrowLeft = tooltipWidth - tooltipWidth * 0.1 - arrowSize / 2;\n        arrowTop = tooltipHeight - arrowSize / 2;\n        break;\n      case 'left-top':\n        top = srcRect.top + scrollY;\n        left = srcRect.left + scrollX - tooltipWidth - tooltipOffset;\n        arrowLeft = tooltipWidth - arrowSize / 2;\n        arrowTop = arrowSize / 2;\n        break;\n      case 'left-center':\n        top = srcRect.top + scrollY + srcRect.height / 2 - tooltipHeight / 2;\n        left = srcRect.left + scrollX - tooltipWidth - tooltipOffset;\n        arrowLeft = tooltipWidth - arrowSize / 2;\n        arrowTop = tooltipHeight / 2 - arrowSize / 2;\n        break;\n      case 'left-bottom':\n        top = srcRect.bottom + scrollY - tooltipHeight;\n        left = srcRect.left + scrollX - tooltipWidth - tooltipOffset;\n        arrowLeft = tooltipWidth - arrowSize / 2;\n        arrowTop = tooltipHeight - arrowSize / 2;\n        break;\n      case 'right-top':\n        top = srcRect.top + scrollY;\n        left = srcRect.right + scrollX + tooltipOffset;\n        arrowLeft = -arrowSize / 2;\n        arrowTop = arrowSize / 2;\n        break;\n      case 'right-center':\n        top = srcRect.top + scrollY + srcRect.height / 2 - tooltipHeight / 2;\n        left = srcRect.right + scrollX + tooltipOffset;\n        arrowLeft = -arrowSize / 2;\n        arrowTop = tooltipHeight / 2 - arrowSize / 2;\n        break;\n      case 'right-bottom':\n        top = srcRect.bottom + scrollY - tooltipHeight;\n        left = srcRect.right + scrollX + tooltipOffset;\n        arrowLeft = -arrowSize / 2;\n        arrowTop = tooltipHeight - arrowSize / 2;\n        break;\n      default:\n        top = srcRect.bottom + scrollY + tooltipOffset;\n        left = srcRect.left + scrollX + srcRect.width / 2 - tooltipWidth / 2;\n        arrowLeft = tooltipWidth / 2 - arrowSize / 2;\n        arrowTop = -arrowSize / 2;\n        break;\n    }\n\n    return {\n      position: 'absolute',\n      top: `${top}px`,\n      left: `${left}px`,\n      zIndex: 9999,\n      '--arrow-left': `${arrowLeft}px`,\n      '--arrow-top': `${arrowTop}px`\n    } as React.CSSProperties & { '--arrow-left': string; '--arrow-top': string };\n  };\n\n  useEffect(() => {\n    if (!displayTooltip || !isWithPortal) {\n      setIsPortalPositioned(false);\n      return;\n    }\n\n    const updatePosition = () => {\n      const tooltipElement = document.getElementById(tooltipContentId);\n\n      // Wait for tooltip to be rendered and have valid dimensions\n      if (!tooltipElement || tooltipElement.offsetHeight === 0) {\n        requestAnimationFrame(updatePosition);\n        return;\n      }\n\n      const calculatedStyle = calculateTooltipPortalStyle();\n      \n      // Batch both state updates into a single synchronous render using flushSync\n      flushSync(() => {\n        setTooltipPortalStyle(calculatedStyle);\n        setIsPortalPositioned(true);\n      });\n    };\n\n    // Initial position calculation\n    const timeout = setTimeout(updatePosition, tooltipSrcRef ? 60 : 10);\n\n    const handleClick = (e: MouseEvent) => {\n      const tooltip = document.getElementById(tooltipContentId);\n      const source = tooltipSourceRef.current;\n      const target = e.target as Node;\n\n      if (tooltip && source && !tooltip.contains(target) && !source.contains(target)) {\n        setDisplayTooltip(false);\n      }\n    };\n\n    // Only add click listener if not always-on\n    const shouldAddClickListener = displayOn !== 'always-on';\n    if (shouldAddClickListener) {\n      document.body.addEventListener('click', handleClick, true);\n    }\n    window.addEventListener('scroll', updatePosition, true);\n    window.addEventListener('resize', updatePosition);\n\n    // Watch for style changes on the source element when tooltipSrcRef is provided\n    // This ensures the tooltip position updates when the blocker is repositioned\n    let mutationObserver: MutationObserver | null = null;\n    if (tooltipSrcRef && tooltipSourceRef.current) {\n      mutationObserver = new MutationObserver(() => {\n        updatePosition();\n      });\n      mutationObserver.observe(tooltipSourceRef.current, {\n        attributes: true,\n        attributeFilter: ['style', 'class']\n      });\n    }\n\n    return () => {\n      clearTimeout(timeout);\n      clearHideTimeout();\n      if (shouldAddClickListener) {\n        document.body.removeEventListener('click', handleClick, true);\n      }\n      window.removeEventListener('scroll', updatePosition, true);\n      window.removeEventListener('resize', updatePosition);\n      if (mutationObserver) {\n        mutationObserver.disconnect();\n      }\n    };\n  }, [displayTooltip, isWithPortal, position, displayOn, tooltipSrcRef, tooltipContentId]);\n\n  // For enabled triggers: link trigger to tooltip content via aria-describedby so screen\n  // readers announce tooltip text on focus. Native elements need kebab-case only;\n  // se-design components (Icon, Button) also accept camelCase ariaDescribedBy prop.\n  // Disabled trigger already wires aria-describedby in disabledTriggerProps.\n  const linkedTooltipSrc =\n    !isTriggerDisabled && React.isValidElement(tooltipSrc)\n      ? React.cloneElement(tooltipSrc as React.ReactElement<any>, {\n          'aria-describedby': tooltipContentId,\n          ...(typeof tooltipSrc.type !== 'string' && { ariaDescribedBy: tooltipContentId })\n        })\n      : tooltipSrc;\n\n  const disabledTriggerProps = isTriggerDisabled\n    ? {\n        tabIndex: 0,\n        role: 'button' as const,\n        'aria-label': disabledTriggerAriaLabel,\n        'aria-describedby': tooltipContentId,\n        onFocus: showTooltip,\n        onBlur: scheduleHide,\n        onKeyDown: onDisabledTriggerKeyDown\n      }\n    : undefined;\n\n  const enabledTriggerProps = !isTriggerDisabled\n    ? dismissOnFocusOutProps\n    : undefined;\n\n  return !isWithPortal ? (\n    <div\n      className=\"se-design-tooltip group relative\"\n      onClick={onTooltipSrcClick}\n      {...disabledTriggerProps}\n      {...enabledTriggerProps}\n    >\n      <div className=\"cursor-pointer\">\n        {linkedTooltipSrc}\n      </div>\n      <div\n        ref={tooltipContentRef}\n        id={tooltipContentId}\n        role=\"tooltip\"\n        className={`flex justify-center px-3 py-2 min-w-24 max-w-[${maxWidth}px]\n          absolute top-[calc(100%+8px)] w-max bg-[var(--color-gray-800)] text-[var(--color-white)] text-base rounded-[3px]\n          before:content-[' '] before:w-3.5 before:h-3.5 before:bg-[var(--color-gray-800)] before:inline-block\n          before:absolute before:rounded-tl-sm before:rotate-45`}\n        data-automation-id={automationId || 'tooltip-content'}\n      >\n        {isContentString ? <p className=\"leading-normal\">{content}</p> : content}\n      </div>\n    </div>\n  ) : (\n    <div\n      className=\"se-design-tooltip group relative\"\n      {...events}\n      {...disabledTriggerProps}\n      {...enabledTriggerProps}\n    >\n      <div\n        className=\"cursor-pointer\"\n        ref={tooltipSrcRef ? undefined : (tooltipSourceRef as React.RefObject<HTMLDivElement>)}\n        onMouseEnter={displayOn === 'always-on' ? undefined : clearHideTimeout}\n        onMouseLeave={scheduleHide}\n      >\n        {linkedTooltipSrc}\n      </div>\n      {displayTooltip &&\n        ReactDOM.createPortal(\n          <>\n            <style>\n              {`#${tooltipContentId}::before {\n                left: var(--arrow-left, 0);\n                top: var(--arrow-top, 0);\n              }`}\n            </style>\n            <div\n              id={tooltipContentId}\n              role=\"tooltip\"\n              className={`flex justify-center px-3 py-2 min-w-24 bg-[var(--color-gray-800)] text-[var(--color-white)] text-base rounded-[3px]\n                before:content-[' '] before:w-3.5 before:h-3.5 before:bg-[var(--color-gray-800)] before:inline-block\n                before:absolute before:rounded-tl-sm before:rotate-45 ${tooltipContentClasses}`}\n              style={{\n                ...tooltipPortalStyle,\n                maxWidth: `${maxWidth}px`,\n                wordBreak: 'break-word',\n                overflowWrap: 'break-word',\n                visibility: isPortalPositioned ? 'visible' : 'hidden',\n                opacity: isPortalPositioned ? 1 : 0,\n                pointerEvents: isPortalPositioned ? 'auto' : 'none',\n                transition: isPortalPositioned ? 'opacity 0.15s ease-in' : 'none',\n                // Ensure it stays at 0,0 until positioned to avoid any visual flash\n                ...(isPortalPositioned ? {} : { position: 'fixed', top: '0px', left: '0px' })\n              }}\n              onMouseEnter={displayOn === 'always-on' ? undefined : clearHideTimeout}\n              onMouseLeave={scheduleHide}\n            >\n              {isContentString ? <p className=\"leading-normal\">{content}</p> : content}\n            </div>\n          </>,\n          document.body\n        )}\n    </div>\n  );\n};\n"],"names":["Tooltip","content","tooltipSrc","position","displayOn","maxWidth","isWithPortal","tooltipSrcRef","undefined","isTriggerDisabled","disabledTriggerAriaLabel","tooltipContentClasses","tooltipOffset","automationId","displayTooltip","setDisplayTooltip","useState","tooltipContentRef","useRef","internalToolTipSrcRef","tooltipSourceRef","tooltipPortalStyle","setTooltipPortalStyle","isPortalPositioned","setIsPortalPositioned","hideTimeoutRef","isContentString","tooltipContentId","useStableId","clearHideTimeout","current","clearTimeout","scheduleHide","setTimeout","showTooltip","onDisabledTriggerKeyDown","e","key","preventDefault","prev","dismissOnFocusOutProps","useDismissOnFocusOut","disabled","onFocusIn","onFocusOut","onEscape","useEffect","tooltipContent","setAttribute","classList","add","remove","onTooltipSrcClick","events","onClick","toggleTooltip","onMouseEnter","onMouseLeave","calculateTooltipPortalStyle","refToUse","srcRect","getBoundingClientRect","scrollX","window","pageXOffset","scrollY","pageYOffset","arrowSize","tooltipElement","document","getElementById","tooltipWidth","offsetWidth","tooltipHeight","offsetHeight","top","left","arrowLeft","arrowTop","bottom","width","right","height","zIndex","updatePosition","requestAnimationFrame","calculatedStyle","flushSync","timeout","handleClick","tooltip","source","target","contains","shouldAddClickListener","body","addEventListener","mutationObserver","MutationObserver","observe","attributes","attributeFilter","removeEventListener","disconnect","linkedTooltipSrc","React","isValidElement","cloneElement","type","ariaDescribedBy","disabledTriggerProps","tabIndex","role","onFocus","onBlur","onKeyDown","enabledTriggerProps","createElement","_extends","className","ref","ReactDOM","createPortal","Fragment","id","style","wordBreak","overflowWrap","visibility","opacity","pointerEvents","transition"],"mappings":"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"}
+{"version":3,"file":"index16.js","sources":["../src/components/Tooltip/index.tsx"],"sourcesContent":["import React, { useEffect, useState, useRef } from 'react';\nimport ReactDOM, { flushSync } from 'react-dom';\nimport { useStableId } from '../../utils/useStableId';\nimport { useDismissOnFocusOut } from '../../utils/a11y';\n\nexport interface TooltipProps {\n  /**\n   * Tooltip contents\n   */\n  content: string | React.ReactNode;\n  /**\n   * Tooltip position\n   */\n  position?:\n    | 'top-left'\n    | 'top-center'\n    | 'top-right'\n    | 'bottom-left'\n    | 'bottom-center'\n    | 'bottom-right'\n    | 'left-top'\n    | 'left-center'\n    | 'left-bottom'\n    | 'right-top'\n    | 'right-center'\n    | 'right-bottom';\n  /**\n   * Display tooltip on Hover, Click or Always\n   */\n  displayOn?: 'hover' | 'click' | 'always-on';\n  /**\n   * Tooltip trigger contents\n   */\n  tooltipSrc?: React.ReactNode;\n  /**\n   * Tooltip trigger contents ref\n   */\n  tooltipSrcRef?: React.RefObject<HTMLElement>;\n  /**\n   * When true, the real trigger is disabled and cannot receive focus.\n   * Tooltip will make its wrapper focusable and treat it as a \"button\" that reveals tooltip content.\n   */\n  isTriggerDisabled?: boolean;\n  /**\n   * Required when isTriggerDisabled is true. Provides an accessible name for the focusable wrapper trigger.\n   */\n  disabledTriggerAriaLabel?: string;\n  /**\n   * Max width of the tooltip content\n   */\n  maxWidth?: number;\n  /**\n   * Whether to use portal for the tooltip content\n   */\n  isWithPortal?: boolean;\n  /**\n   * Tooltip content classes\n   */\n  tooltipContentClasses?: string;\n  /**\n   * Tooltip offset\n   */\n  tooltipOffset?: number;\n  /**\n   * Automation ID for testing\n   */\n  automationId?: string;\n}\n\nexport const Tooltip = ({\n  content,\n  tooltipSrc,\n  position = 'bottom-center',\n  displayOn = 'hover',\n  maxWidth = 240,\n  isWithPortal = false,\n  tooltipSrcRef = undefined,\n  isTriggerDisabled = false,\n  disabledTriggerAriaLabel = undefined,\n  tooltipContentClasses = '',\n  tooltipOffset = 8,\n  automationId = ''\n}: TooltipProps) => {\n  const [displayTooltip, setDisplayTooltip] = useState(false);\n  const tooltipContentRef = useRef<HTMLDivElement>(null);\n  // Support for external ref when provided\n  const internalToolTipSrcRef = useRef<HTMLDivElement>(null);\n  const tooltipSourceRef = (tooltipSrcRef || internalToolTipSrcRef) as React.RefObject<HTMLElement>;\n  const [tooltipPortalStyle, setTooltipPortalStyle] = useState({});\n  const [isPortalPositioned, setIsPortalPositioned] = useState(false);\n  const hideTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const isContentString = typeof content === 'string';\n  const tooltipContentId = useStableId(undefined, 'tooltip-content');\n\n  // Helper to clear hide timeout\n  const clearHideTimeout = () => {\n    if (hideTimeoutRef.current) {\n      clearTimeout(hideTimeoutRef.current);\n      hideTimeoutRef.current = null;\n    }\n  };\n\n  // Helper to schedule hide\n  const scheduleHide = () => {\n    if (displayOn !== 'always-on') {\n      clearHideTimeout();\n      hideTimeoutRef.current = setTimeout(() => setDisplayTooltip(false), 150);\n    }\n  };\n\n  const showTooltip = () => {\n    clearHideTimeout();\n    setDisplayTooltip(true);\n  };\n\n  const onDisabledTriggerKeyDown = (e: React.KeyboardEvent) => {\n    if (!isTriggerDisabled) return;\n    if (e.key === 'Escape') {\n      e.preventDefault();\n      setDisplayTooltip(false);\n      return;\n    }\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      setDisplayTooltip((prev) => !prev);\n    }\n  };\n\n  // Enabled trigger: use React focus/blur capture handlers (no native event listeners).\n  // This keeps the tooltip open while focus stays anywhere inside the tooltip wrapper.\n  const dismissOnFocusOutProps = useDismissOnFocusOut<HTMLDivElement>({\n    disabled: isTriggerDisabled,\n    onFocusIn: showTooltip,\n    onFocusOut: scheduleHide,\n    onEscape: () => setDisplayTooltip(false)\n  });\n\n  useEffect(() => {\n    const tooltipContent = tooltipContentRef.current;\n\n    if (!tooltipContent) {\n      return;\n    }\n\n    if (position == 'bottom-center') {\n      tooltipContent.setAttribute('style', `left: 50%;transform: translateX(-50%);`);\n      tooltipContent.classList.add(`before:left-[calc(50%-7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if (position == 'bottom-left') {\n      tooltipContent.classList.add(`before:left-[calc(10%-7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if (position == 'bottom-right') {\n      tooltipContent.setAttribute('style', `right: 0;`);\n      tooltipContent.classList.add(`before:right-[calc(10%+7px)]`);\n      tooltipContent.classList.add(`before:top-[-7px]`);\n    } else if (position == 'top-center') {\n      tooltipContent.setAttribute('style', `left: 50%;transform: translateX(-50%);bottom: calc(100% + 8px);`);\n      tooltipContent.classList.add(`before:left-[calc(50%-7px)]`);\n      tooltipContent.classList.add(`before:bottom-[-7px]`);\n    } else if (position == 'top-left') {\n      tooltipContent.setAttribute('style', `bottom: calc(100% + 8px);`);\n      tooltipContent.classList.add(`before:left-[calc(10%-7px)]`);\n      tooltipContent.classList.add(`before:bottom-[-7px]`);\n    } else if (position == 'top-right') {\n      tooltipContent.setAttribute('style', `right: 0;bottom: calc(100% + 8px);`);\n      tooltipContent.classList.add(`before:right-[calc(10%+7px)]`);\n      tooltipContent.classList.add(`before:bottom-[-7px]`);\n    } else if (position == 'left-top') {\n      tooltipContent.setAttribute('style', `right: calc(100% + 10px);top:0;`);\n      tooltipContent.classList.add(`before:right-[-6px]`);\n      tooltipContent.classList.add(`before:top-[7px]`);\n    } else if (position == 'left-center') {\n      tooltipContent.setAttribute('style', `right: calc(100% + 10px);top: 50%;transform: translateY(-50%);`);\n      tooltipContent.classList.add(`before:right-[-6px]`);\n      tooltipContent.classList.add(`before:top-[calc(50%-7px)]`);\n    } else if (position == 'left-bottom') {\n      tooltipContent.setAttribute('style', `right: calc(100% + 10px);bottom:0;`);\n      tooltipContent.classList.add(`before:right-[-6px]`);\n      tooltipContent.classList.add(`before:bottom-[7px]`);\n    } else if (position == 'right-top') {\n      tooltipContent.setAttribute('style', `left: calc(100% + 10px);top:0;`);\n      tooltipContent.classList.add(`before:left-[-6px]`);\n      tooltipContent.classList.add(`before:top-[7px]`);\n    } else if (position == 'right-center') {\n      tooltipContent.setAttribute('style', `left: calc(100% + 10px);top: 50%;transform: translateY(-50%);`);\n      tooltipContent.classList.add(`before:left-[-6px]`);\n      tooltipContent.classList.add(`before:top-[calc(50%-7px)]`);\n    } else if (position == 'right-bottom') {\n      tooltipContent.setAttribute('style', `left: calc(100% + 10px);bottom:0;`);\n      tooltipContent.classList.add(`before:left-[-6px]`);\n      tooltipContent.classList.add(`before:bottom-[7px]`);\n    }\n\n    if (displayOn == 'hover') {\n      tooltipContent.classList.add(`group-hover:visible`);\n    }\n  }, [content]);\n\n  useEffect(() => {\n    const tooltipContent = tooltipContentRef.current;\n\n    if (!tooltipContent) {\n      return;\n    }\n    if (displayTooltip) {\n      tooltipContent.classList.remove(`invisible`);\n    } else {\n      tooltipContent.classList.add(`invisible`);\n    }\n  }, [displayTooltip]);\n\n  // Ensure tooltip stays open when displayOn is always-on\n  useEffect(() => {\n    if (displayOn === 'always-on') {\n      setDisplayTooltip(true);\n    }\n  }, [displayOn]);\n\n  const onTooltipSrcClick = () => {\n    if (displayOn == 'click') {\n      setDisplayTooltip((displayTooltip) => !displayTooltip);\n    }\n  };\n\n  const toggleTooltip = () => {\n    setDisplayTooltip((displayTooltip) => !displayTooltip);\n  };\n\n  const events = {\n    ...(displayOn === 'click' && { onClick: toggleTooltip }),\n    ...(displayOn === 'hover' && {\n      onMouseEnter: () => setDisplayTooltip(true),\n      onMouseLeave: () => setDisplayTooltip(false)\n    })\n  };\n\n  const calculateTooltipPortalStyle = () => {\n    const refToUse = tooltipSourceRef.current;\n    if (!refToUse) {\n      return {};\n    }\n\n    const srcRect = refToUse.getBoundingClientRect();\n    const scrollX = window.scrollX || window.pageXOffset;\n    const scrollY = window.scrollY || window.pageYOffset;\n    const arrowSize = 14; // 14px (3.5 * 4 = 14px in Tailwind)\n\n    // Get tooltip content dimensions if available\n    const tooltipElement = document.getElementById(tooltipContentId);\n    const tooltipWidth = tooltipElement?.offsetWidth || 0;\n    const tooltipHeight = tooltipElement?.offsetHeight || 0;\n\n    let top = 0;\n    let left = 0;\n    let arrowLeft = 0;\n    let arrowTop = 0;\n\n    switch (position) {\n      case 'bottom-center':\n        top = srcRect.bottom + scrollY + tooltipOffset;\n        left = srcRect.left + scrollX + srcRect.width / 2 - tooltipWidth / 2;\n        arrowLeft = tooltipWidth / 2 - arrowSize / 2;\n        arrowTop = -arrowSize / 2;\n        break;\n      case 'bottom-left':\n        top = srcRect.bottom + scrollY + tooltipOffset;\n        left = srcRect.left + scrollX;\n        arrowLeft = tooltipWidth * 0.1 - arrowSize / 2;\n        arrowTop = -arrowSize / 2;\n        break;\n      case 'bottom-right':\n        top = srcRect.bottom + scrollY + tooltipOffset;\n        left = srcRect.right + scrollX - tooltipWidth;\n        arrowLeft = tooltipWidth - tooltipWidth * 0.1 - arrowSize / 2;\n        arrowTop = -arrowSize / 2;\n        break;\n      case 'top-center':\n        top = srcRect.top + scrollY - tooltipHeight - tooltipOffset;\n        left = srcRect.left + scrollX + srcRect.width / 2 - tooltipWidth / 2;\n        arrowLeft = tooltipWidth / 2 - arrowSize / 2;\n        arrowTop = tooltipHeight - arrowSize / 2;\n        break;\n      case 'top-left':\n        top = srcRect.top + scrollY - tooltipHeight - tooltipOffset;\n        left = srcRect.left + scrollX;\n        arrowLeft = tooltipWidth * 0.1 - arrowSize / 2;\n        arrowTop = tooltipHeight - arrowSize / 2;\n        break;\n      case 'top-right':\n        top = srcRect.top + scrollY - tooltipHeight - tooltipOffset;\n        left = srcRect.right + scrollX - tooltipWidth;\n        arrowLeft = tooltipWidth - tooltipWidth * 0.1 - arrowSize / 2;\n        arrowTop = tooltipHeight - arrowSize / 2;\n        break;\n      case 'left-top':\n        top = srcRect.top + scrollY;\n        left = srcRect.left + scrollX - tooltipWidth - tooltipOffset;\n        arrowLeft = tooltipWidth - arrowSize / 2;\n        arrowTop = arrowSize / 2;\n        break;\n      case 'left-center':\n        top = srcRect.top + scrollY + srcRect.height / 2 - tooltipHeight / 2;\n        left = srcRect.left + scrollX - tooltipWidth - tooltipOffset;\n        arrowLeft = tooltipWidth - arrowSize / 2;\n        arrowTop = tooltipHeight / 2 - arrowSize / 2;\n        break;\n      case 'left-bottom':\n        top = srcRect.bottom + scrollY - tooltipHeight;\n        left = srcRect.left + scrollX - tooltipWidth - tooltipOffset;\n        arrowLeft = tooltipWidth - arrowSize / 2;\n        arrowTop = tooltipHeight - arrowSize / 2;\n        break;\n      case 'right-top':\n        top = srcRect.top + scrollY;\n        left = srcRect.right + scrollX + tooltipOffset;\n        arrowLeft = -arrowSize / 2;\n        arrowTop = arrowSize / 2;\n        break;\n      case 'right-center':\n        top = srcRect.top + scrollY + srcRect.height / 2 - tooltipHeight / 2;\n        left = srcRect.right + scrollX + tooltipOffset;\n        arrowLeft = -arrowSize / 2;\n        arrowTop = tooltipHeight / 2 - arrowSize / 2;\n        break;\n      case 'right-bottom':\n        top = srcRect.bottom + scrollY - tooltipHeight;\n        left = srcRect.right + scrollX + tooltipOffset;\n        arrowLeft = -arrowSize / 2;\n        arrowTop = tooltipHeight - arrowSize / 2;\n        break;\n      default:\n        top = srcRect.bottom + scrollY + tooltipOffset;\n        left = srcRect.left + scrollX + srcRect.width / 2 - tooltipWidth / 2;\n        arrowLeft = tooltipWidth / 2 - arrowSize / 2;\n        arrowTop = -arrowSize / 2;\n        break;\n    }\n\n    return {\n      position: 'absolute',\n      top: `${top}px`,\n      left: `${left}px`,\n      zIndex: 9999,\n      '--arrow-left': `${arrowLeft}px`,\n      '--arrow-top': `${arrowTop}px`\n    } as React.CSSProperties & { '--arrow-left': string; '--arrow-top': string };\n  };\n\n  useEffect(() => {\n    if (!displayTooltip || !isWithPortal) {\n      setIsPortalPositioned(false);\n      return;\n    }\n\n    const updatePosition = () => {\n      const tooltipElement = document.getElementById(tooltipContentId);\n\n      // Wait for tooltip to be rendered and have valid dimensions\n      if (!tooltipElement || tooltipElement.offsetHeight === 0) {\n        requestAnimationFrame(updatePosition);\n        return;\n      }\n\n      const calculatedStyle = calculateTooltipPortalStyle();\n      \n      // Batch both state updates into a single synchronous render using flushSync\n      flushSync(() => {\n        setTooltipPortalStyle(calculatedStyle);\n        setIsPortalPositioned(true);\n      });\n    };\n\n    // Initial position calculation\n    const timeout = setTimeout(updatePosition, tooltipSrcRef ? 60 : 10);\n\n    const handleClick = (e: MouseEvent) => {\n      const tooltip = document.getElementById(tooltipContentId);\n      const source = tooltipSourceRef.current;\n      const target = e.target as Node;\n\n      if (tooltip && source && !tooltip.contains(target) && !source.contains(target)) {\n        setDisplayTooltip(false);\n      }\n    };\n\n    // Only add click listener if not always-on\n    const shouldAddClickListener = displayOn !== 'always-on';\n    if (shouldAddClickListener) {\n      document.body.addEventListener('click', handleClick, true);\n    }\n    window.addEventListener('scroll', updatePosition, true);\n    window.addEventListener('resize', updatePosition);\n\n    // Watch for style changes on the source element when tooltipSrcRef is provided\n    // This ensures the tooltip position updates when the blocker is repositioned\n    let mutationObserver: MutationObserver | null = null;\n    if (tooltipSrcRef && tooltipSourceRef.current) {\n      mutationObserver = new MutationObserver(() => {\n        updatePosition();\n      });\n      mutationObserver.observe(tooltipSourceRef.current, {\n        attributes: true,\n        attributeFilter: ['style', 'class']\n      });\n    }\n\n    return () => {\n      clearTimeout(timeout);\n      clearHideTimeout();\n      if (shouldAddClickListener) {\n        document.body.removeEventListener('click', handleClick, true);\n      }\n      window.removeEventListener('scroll', updatePosition, true);\n      window.removeEventListener('resize', updatePosition);\n      if (mutationObserver) {\n        mutationObserver.disconnect();\n      }\n    };\n  }, [displayTooltip, isWithPortal, position, displayOn, tooltipSrcRef, tooltipContentId]);\n\n  // For enabled triggers: link trigger to tooltip content via aria-describedby so screen\n  // readers announce tooltip text on focus. Native elements need kebab-case only;\n  // se-design components (Icon, Button) also accept camelCase ariaDescribedBy prop.\n  // Disabled trigger already wires aria-describedby in disabledTriggerProps.\n  const linkedTooltipSrc =\n    !isTriggerDisabled && React.isValidElement(tooltipSrc)\n      ? React.cloneElement(tooltipSrc as React.ReactElement<any>, {\n          'aria-describedby': tooltipContentId,\n          ...(typeof tooltipSrc.type !== 'string' && { ariaDescribedBy: tooltipContentId })\n        })\n      : tooltipSrc;\n\n  const disabledTriggerProps = isTriggerDisabled\n    ? {\n        tabIndex: 0,\n        role: 'button' as const,\n        'aria-label': disabledTriggerAriaLabel,\n        'aria-describedby': tooltipContentId,\n        onFocus: showTooltip,\n        onBlur: scheduleHide,\n        onKeyDown: onDisabledTriggerKeyDown\n      }\n    : undefined;\n\n  const enabledTriggerProps = !isTriggerDisabled\n    ? dismissOnFocusOutProps\n    : undefined;\n\n  return !isWithPortal ? (\n    <div\n      className=\"se-design-tooltip group relative inline-flex items-center\"\n      onClick={onTooltipSrcClick}\n      {...disabledTriggerProps}\n      {...enabledTriggerProps}\n    >\n      <div className=\"cursor-pointer flex items-center\">\n        {linkedTooltipSrc}\n      </div>\n      <div\n        ref={tooltipContentRef}\n        id={tooltipContentId}\n        role=\"tooltip\"\n        className={`flex justify-center px-3 py-2 min-w-24 max-w-[${maxWidth}px]\n          absolute top-[calc(100%+8px)] w-max bg-[var(--color-gray-800)] text-[var(--color-white)] text-base rounded-[3px]\n          before:content-[' '] before:w-3.5 before:h-3.5 before:bg-[var(--color-gray-800)] before:inline-block\n          before:absolute before:rounded-tl-sm before:rotate-45`}\n        data-automation-id={automationId || 'tooltip-content'}\n      >\n        {isContentString ? <p className=\"leading-normal\">{content}</p> : content}\n      </div>\n    </div>\n  ) : (\n    <div\n      className=\"se-design-tooltip group relative inline-flex items-center\"\n      {...events}\n      {...disabledTriggerProps}\n      {...enabledTriggerProps}\n    >\n      <div\n        className=\"cursor-pointer flex items-center\"\n        ref={tooltipSrcRef ? undefined : (tooltipSourceRef as React.RefObject<HTMLDivElement>)}\n        onMouseEnter={displayOn === 'always-on' ? undefined : clearHideTimeout}\n        onMouseLeave={scheduleHide}\n      >\n        {linkedTooltipSrc}\n      </div>\n      {displayTooltip &&\n        ReactDOM.createPortal(\n          <>\n            <style>\n              {`#${tooltipContentId}::before {\n                left: var(--arrow-left, 0);\n                top: var(--arrow-top, 0);\n              }`}\n            </style>\n            <div\n              id={tooltipContentId}\n              role=\"tooltip\"\n              className={`flex justify-center px-3 py-2 min-w-24 bg-[var(--color-gray-800)] text-[var(--color-white)] text-base rounded-[3px]\n                before:content-[' '] before:w-3.5 before:h-3.5 before:bg-[var(--color-gray-800)] before:inline-block\n                before:absolute before:rounded-tl-sm before:rotate-45 ${tooltipContentClasses}`}\n              style={{\n                ...tooltipPortalStyle,\n                maxWidth: `${maxWidth}px`,\n                wordBreak: 'break-word',\n                overflowWrap: 'break-word',\n                visibility: isPortalPositioned ? 'visible' : 'hidden',\n                opacity: isPortalPositioned ? 1 : 0,\n                pointerEvents: isPortalPositioned ? 'auto' : 'none',\n                transition: isPortalPositioned ? 'opacity 0.15s ease-in' : 'none',\n                // Ensure it stays at 0,0 until positioned to avoid any visual flash\n                ...(isPortalPositioned ? {} : { position: 'fixed', top: '0px', left: '0px' })\n              }}\n              onMouseEnter={displayOn === 'always-on' ? undefined : clearHideTimeout}\n              onMouseLeave={scheduleHide}\n            >\n              {isContentString ? <p className=\"leading-normal\">{content}</p> : content}\n            </div>\n          </>,\n          document.body\n        )}\n    </div>\n  );\n};\n"],"names":["Tooltip","content","tooltipSrc","position","displayOn","maxWidth","isWithPortal","tooltipSrcRef","undefined","isTriggerDisabled","disabledTriggerAriaLabel","tooltipContentClasses","tooltipOffset","automationId","displayTooltip","setDisplayTooltip","useState","tooltipContentRef","useRef","internalToolTipSrcRef","tooltipSourceRef","tooltipPortalStyle","setTooltipPortalStyle","isPortalPositioned","setIsPortalPositioned","hideTimeoutRef","isContentString","tooltipContentId","useStableId","clearHideTimeout","current","clearTimeout","scheduleHide","setTimeout","showTooltip","onDisabledTriggerKeyDown","e","key","preventDefault","prev","dismissOnFocusOutProps","useDismissOnFocusOut","disabled","onFocusIn","onFocusOut","onEscape","useEffect","tooltipContent","setAttribute","classList","add","remove","onTooltipSrcClick","events","onClick","toggleTooltip","onMouseEnter","onMouseLeave","calculateTooltipPortalStyle","refToUse","srcRect","getBoundingClientRect","scrollX","window","pageXOffset","scrollY","pageYOffset","arrowSize","tooltipElement","document","getElementById","tooltipWidth","offsetWidth","tooltipHeight","offsetHeight","top","left","arrowLeft","arrowTop","bottom","width","right","height","zIndex","updatePosition","requestAnimationFrame","calculatedStyle","flushSync","timeout","handleClick","tooltip","source","target","contains","shouldAddClickListener","body","addEventListener","mutationObserver","MutationObserver","observe","attributes","attributeFilter","removeEventListener","disconnect","linkedTooltipSrc","React","isValidElement","cloneElement","type","ariaDescribedBy","disabledTriggerProps","tabIndex","role","onFocus","onBlur","onKeyDown","enabledTriggerProps","createElement","_extends","className","ref","ReactDOM","createPortal","Fragment","id","style","wordBreak","overflowWrap","visibility","opacity","pointerEvents","transition"],"mappings":"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"}

package/dist/index18.js

@@ -1,65 +1,70 @@
-import n, { forwardRef as F, useState as C, useRef as P, useMemo as b } from "react";
-import { MenuItem as O } from "./index17.js";
-import { InputWithIcon as S } from "./index52.js";
-import { useRovingFocus as _ } from "./index70.js";
-function i() {
-  return i = Object.assign ? Object.assign.bind() : function(a) {
-    for (var o = 1; o < arguments.length; o++) {
-      var r = arguments[o];
-      for (var s in r) ({}).hasOwnProperty.call(r, s) && (a[s] = r[s]);
+import n, { forwardRef as M, useState as C, useRef as P, useEffect as O, useMemo as h } from "react";
+import { MenuItem as S } from "./index17.js";
+import { InputWithIcon as _ } from "./index52.js";
+import { useRovingFocus as j } from "./index70.js";
+import { announce as B } from "./index75.js";
+function f() {
+  return f = Object.assign ? Object.assign.bind() : function(o) {
+    for (var a = 1; a < arguments.length; a++) {
+      var r = arguments[a];
+      for (var s in r) ({}).hasOwnProperty.call(r, s) && (o[s] = r[s]);
     }
-    return a;
-  }, i.apply(null, arguments);
+    return o;
+  }, f.apply(null, arguments);
 }
-const j = /* @__PURE__ */ F(({
-  items: a,
-  maxHeight: o,
+const Q = /* @__PURE__ */ M(({
+  items: o,
+  maxHeight: a,
   shouldShowSearch: r = !1,
   searchPlaceholder: s = "Search...",
-  searchBy: h = "label",
-  searchResultEmptyMessage: w = "No results found",
-  className: m = ""
+  searchBy: w = "label",
+  searchResultEmptyMessage: d = "No results found",
+  className: y = ""
 }, x) => {
-  const [d, D] = C(""), y = P(null), u = d.trim() ? a.filter((e) => (e[h]?.toString().toLowerCase() || "").includes(d.toLowerCase())) : a, E = o ? {
-    maxHeight: o,
+  const [c, D] = C(""), g = P(null), l = c.trim() ? o.filter((e) => (e[w]?.toString().toLowerCase() || "").includes(c.toLowerCase())) : o;
+  O(() => {
+    l.length === 0 && c.trim() && B(d);
+  }, [l.length, c, d]);
+  const E = a ? {
+    maxHeight: a,
     overflowY: "auto"
-  } : {}, f = b(() => {
+  } : {}, m = h(() => {
     const e = /* @__PURE__ */ new WeakMap(), t = /* @__PURE__ */ new Set();
-    return a.forEach((l, v) => {
-      const I = l.id || l.automationId || `menu-item-${v}`;
-      let c = I;
-      t.has(c) && (c = `${I}-${v}`), t.add(c), e.set(l, c);
+    return o.forEach((u, I) => {
+      const b = u.id || u.automationId || `menu-item-${I}`;
+      let i = b;
+      t.has(i) && (i = `${b}-${I}`), t.add(i), e.set(u, i);
     }), e;
-  }, [a]), p = b(() => u.filter((e) => e.type !== "header" && e.type !== "separator").map((e) => f.get(e)), [u, f]), {
+  }, [o]), p = h(() => l.filter((e) => e.type !== "header" && e.type !== "separator").map((e) => m.get(e)), [l, m]), {
     getRovingItemProps: K,
-    handleKeyDown: R,
-    setFocusedId: k,
-    focusItem: g,
-    getContainerProps: M
-  } = _({
+    handleKeyDown: k,
+    setFocusedId: N,
+    focusItem: v,
+    getContainerProps: $
+  } = j({
     itemIds: p,
     orientation: "vertical",
     loop: !0,
     role: "menu"
-  }), N = (e) => {
+  }), L = (e) => {
     if (r && e.key === "Tab" && e.shiftKey) {
-      e.preventDefault(), y.current?.focus();
+      e.preventDefault(), g.current?.focus();
       return;
     }
-    R(e);
-  }, $ = (e) => {
+    k(e);
+  }, R = (e) => {
     if (e.key === "ArrowDown") {
       e.preventDefault();
       const t = p[0];
-      t && g(t);
+      t && v(t);
     } else if (e.key === "Tab" && !e.shiftKey) {
       e.preventDefault();
       const t = p[0];
-      t && g(t);
+      t && v(t);
     }
-  }, L = () => /* @__PURE__ */ n.createElement("div", {
+  }, F = () => /* @__PURE__ */ n.createElement("div", {
     className: "w-full relative flex items-center border-b border-[var(--color-gray-300)] px-1"
-  }, /* @__PURE__ */ n.createElement(S, {
+  }, /* @__PURE__ */ n.createElement(_, {
     leftIcon: {
       name: "search",
       position: "left",
@@ -67,7 +72,7 @@ const j = /* @__PURE__ */ F(({
         color: "var(--color-gray-500)"
       }
     },
-    value: d,
+    value: c,
     onChange: (e) => D(e),
     placeholder: s,
     style: {
@@ -81,21 +86,21 @@ const j = /* @__PURE__ */ F(({
     },
     automationId: "se-design-menu-list-search",
     ariaLabel: s,
-    inputRef: y,
+    inputRef: g,
     inputProps: {
-      onKeyDown: $
+      onKeyDown: R
     }
   }));
   return /* @__PURE__ */ n.createElement("div", {
     ref: x,
-    className: `se-design-menu-list border border-[var(--color-gray-200)] rounded shadow-md ${r ? "" : "py-2"}${m ? ` ${m}` : ""}`
-  }, r && L(), /* @__PURE__ */ n.createElement("div", i({
+    className: `se-design-menu-list border border-[var(--color-gray-200)] rounded shadow-md ${r ? "" : "py-2"}${y ? ` ${y}` : ""}`
+  }, r && F(), /* @__PURE__ */ n.createElement("div", f({
     style: E,
     className: `overflow-y-auto ${r ? "py-2" : ""}`
-  }, M({
+  }, $({
     ariaLabel: "Menu"
-  })), u.length > 0 ? u.map((e) => {
-    const t = f.get(e);
+  })), l.length > 0 ? l.map((e) => {
+    const t = m.get(e);
     if (e.type === "separator")
       return /* @__PURE__ */ n.createElement("hr", {
         key: t,
@@ -107,22 +112,20 @@ const j = /* @__PURE__ */ F(({
         className: "se-design-menu-header cursor-default px-2 mx-1 text-sm pt-2 text-[var(--color-gray-650)]",
         role: "presentation"
       }, e.label);
-    const l = K(t);
-    return /* @__PURE__ */ n.createElement(O, i({}, e, {
+    const u = K(t);
+    return /* @__PURE__ */ n.createElement(S, f({}, e, {
       key: t,
-      ref: l.ref,
-      tabIndex: l.tabIndex,
-      onKeyDown: N,
-      onFocus: () => k(t)
+      ref: u.ref,
+      tabIndex: u.tabIndex,
+      onKeyDown: L,
+      onFocus: () => N(t)
     }));
   }) : /* @__PURE__ */ n.createElement("div", {
-    className: "px-3 py-4 text-center text-[var(--color-gray-700)] text-sm",
-    role: "status",
-    "aria-live": "polite"
-  }, w)));
+    className: "px-3 py-4 text-center text-[var(--color-gray-700)] text-sm"
+  }, d)));
 });
-j.displayName = "MenuList";
+Q.displayName = "MenuList";
 export {
-  j as MenuList
+  Q as MenuList
 };
 //# sourceMappingURL=index18.js.map

package/dist/index18.js.map

@@ -1 +1 @@
-{"version":3,"file":"index18.js","sources":["../src/components/MenuList/index.tsx"],"sourcesContent":["import React, { forwardRef, useState, useMemo, useRef } from 'react';\nimport { MenuItem, MenuItemProps } from 'src/components/MenuItem';\nimport { InputWithIcon } from '../InputWithIcon';\nimport { useRovingFocus } from 'src/utils/a11y/useRovingFocus';\n\nexport type MenuListProps = {\n  items: MenuItemProps[];\n  maxHeight?: string;\n  shouldShowSearch?: boolean;\n  searchPlaceholder?: string;\n  searchBy?: string;\n  searchResultEmptyMessage?: string;\n  className?: string;\n};\n\nexport const MenuList = forwardRef<HTMLDivElement, MenuListProps>(({\n  items,\n  maxHeight,\n  shouldShowSearch = false,\n  searchPlaceholder = 'Search...',\n  searchBy = 'label',\n  searchResultEmptyMessage = 'No results found',\n  className = ''\n}, ref) => {\n  const [searchQuery, setSearchQuery] = useState('');\n  const searchInputRef = useRef<HTMLInputElement>(null);\n\n  const getFilteredItems = () => {\n    if (!searchQuery.trim()) {\n      return items;\n    }\n    return items.filter((item) => {\n      const searchValue = item[searchBy as keyof MenuItemProps]?.toString().toLowerCase() || '';\n      return searchValue.includes(searchQuery.toLowerCase());\n    });\n  };\n\n  const filteredItems = getFilteredItems();\n  const containerStyle = maxHeight\n    ? {\n        maxHeight,\n        overflowY: 'auto' as const\n      }\n    : {};\n\n  const itemIdByRef = useMemo(() => {\n    const map = new WeakMap<MenuItemProps, string>();\n    const seen = new Set<string>();\n\n    items.forEach((item, index) => {\n      const baseId = item.id || item.automationId || `menu-item-${index}`;\n      let uniqueId = baseId;\n\n      if (seen.has(uniqueId)) {\n        uniqueId = `${baseId}-${index}`;\n      }\n\n      seen.add(uniqueId);\n      map.set(item, uniqueId);\n    });\n\n    return map;\n  }, [items]);\n\n  const itemIds = useMemo(() => {\n    return filteredItems\n      .filter((item) => item.type !== 'header' && item.type !== 'separator')\n      .map((item) => itemIdByRef.get(item) as string);\n  }, [filteredItems, itemIdByRef]);\n\n  // Use roving focus for arrow key navigation\n  const { getRovingItemProps, handleKeyDown: rovingHandleKeyDown, setFocusedId, focusItem, getContainerProps } = useRovingFocus({\n    itemIds,\n    orientation: 'vertical',\n    loop: true,\n    role: 'menu'\n  });\n\n  // Wrap roving keydown: when on a menu item, Shift+Tab goes back to search input\n  const handleMenuItemKeyDown = (e: React.KeyboardEvent) => {\n    if (shouldShowSearch && e.key === 'Tab' && e.shiftKey) {\n      e.preventDefault();\n      searchInputRef.current?.focus();\n      return;\n    }\n    rovingHandleKeyDown(e);\n  };\n\n  // Search input keydown: ArrowDown enters the menu, Tab moves to first menu item\n  const handleSearchKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      const firstId = itemIds[0];\n      if (firstId) focusItem(firstId);\n    } else if (e.key === 'Tab' && !e.shiftKey) {\n      e.preventDefault();\n      const firstId = itemIds[0];\n      if (firstId) focusItem(firstId);\n    }\n  };\n\n  const renderSearchBar = () => {\n    return (\n      <div className=\"w-full relative flex items-center border-b border-[var(--color-gray-300)] px-1\">\n        <InputWithIcon\n          leftIcon={{ name: 'search', position: 'left', style: { color: 'var(--color-gray-500)' } }}\n          value={searchQuery}\n          onChange={(value: string) => setSearchQuery(value)}\n          placeholder={searchPlaceholder}\n          style={{ margin: 0, gap: 0 }}\n          inputStyle={{ width: '100%', border: 'none', outline: 'none' }}\n          automationId=\"se-design-menu-list-search\"\n          ariaLabel={searchPlaceholder}\n          inputRef={searchInputRef}\n          inputProps={{ onKeyDown: handleSearchKeyDown }}\n        />\n      </div>\n    );\n  };\n\n  return (\n    <div\n      ref={ref}\n      className={`se-design-menu-list border border-[var(--color-gray-200)] rounded shadow-md ${\n        shouldShowSearch ? '' : 'py-2'\n      }${className ? ` ${className}` : ''}`}\n    >\n      {shouldShowSearch && renderSearchBar()}\n      <div\n        style={containerStyle}\n        className={`overflow-y-auto ${shouldShowSearch ? 'py-2' : ''}`}\n        {...getContainerProps({ ariaLabel: 'Menu' })}\n      >\n        {filteredItems.length > 0 ? (\n          filteredItems.map((item) => {\n            const stableId = itemIdByRef.get(item) as string;\n\n            if (item.type === 'separator') {\n              return (\n                <hr key={stableId} className=\"se-design-menu-separator cursor-default border-[var(--color-gray-200)]\" />\n              );\n            }\n\n            if (item.type === 'header') {\n              return (\n                <div\n                  key={stableId}\n                  className=\"se-design-menu-header cursor-default px-2 mx-1 text-sm pt-2 text-[var(--color-gray-650)]\"\n                  role=\"presentation\"\n                >\n                  {item.label}\n                </div>\n              );\n            }\n\n            const rovingProps = getRovingItemProps(stableId);\n            return (\n              <MenuItem\n                {...item}\n                key={stableId}\n                ref={rovingProps.ref}\n                tabIndex={rovingProps.tabIndex}\n                onKeyDown={handleMenuItemKeyDown}\n                onFocus={() => setFocusedId(stableId)}\n              />\n            );\n          })\n        ) : (\n          <div className=\"px-3 py-4 text-center text-[var(--color-gray-700)] text-sm\" role=\"status\" aria-live=\"polite\">{searchResultEmptyMessage}</div>\n        )}\n      </div>\n    </div>\n  );\n});\n\nMenuList.displayName = 'MenuList';\n"],"names":["MenuList","items","maxHeight","shouldShowSearch","searchPlaceholder","searchBy","searchResultEmptyMessage","className","ref","searchQuery","setSearchQuery","useState","searchInputRef","useRef","filteredItems","trim","filter","item","toString","toLowerCase","includes","containerStyle","overflowY","itemIdByRef","useMemo","map","WeakMap","seen","Set","forEach","index","baseId","id","automationId","uniqueId","has","add","set","itemIds","type","get","getRovingItemProps","handleKeyDown","rovingHandleKeyDown","setFocusedId","focusItem","getContainerProps","useRovingFocus","orientation","loop","role","handleMenuItemKeyDown","e","key","shiftKey","preventDefault","current","focus","handleSearchKeyDown","firstId","renderSearchBar","React","createElement","InputWithIcon","leftIcon","name","position","style","color","value","onChange","placeholder","margin","gap","inputStyle","width","border","outline","ariaLabel","inputRef","inputProps","onKeyDown","_extends","length","stableId","label","rovingProps","MenuItem","tabIndex","onFocus","displayName"],"mappings":"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"}
+{"version":3,"file":"index18.js","sources":["../src/components/MenuList/index.tsx"],"sourcesContent":["import React, { forwardRef, useState, useMemo, useRef, useEffect } from 'react';\nimport { MenuItem, MenuItemProps } from 'src/components/MenuItem';\nimport { InputWithIcon } from '../InputWithIcon';\nimport { useRovingFocus } from 'src/utils/a11y/useRovingFocus';\nimport { announce } from '../../utils/a11y/liveAnnouncer';\n\nexport type MenuListProps = {\n  items: MenuItemProps[];\n  maxHeight?: string;\n  shouldShowSearch?: boolean;\n  searchPlaceholder?: string;\n  searchBy?: string;\n  searchResultEmptyMessage?: string;\n  className?: string;\n};\n\nexport const MenuList = forwardRef<HTMLDivElement, MenuListProps>(({\n  items,\n  maxHeight,\n  shouldShowSearch = false,\n  searchPlaceholder = 'Search...',\n  searchBy = 'label',\n  searchResultEmptyMessage = 'No results found',\n  className = ''\n}, ref) => {\n  const [searchQuery, setSearchQuery] = useState('');\n  const searchInputRef = useRef<HTMLInputElement>(null);\n\n  const getFilteredItems = () => {\n    if (!searchQuery.trim()) {\n      return items;\n    }\n    return items.filter((item) => {\n      const searchValue = item[searchBy as keyof MenuItemProps]?.toString().toLowerCase() || '';\n      return searchValue.includes(searchQuery.toLowerCase());\n    });\n  };\n\n  const filteredItems = getFilteredItems();\n\n  useEffect(() => {\n    if (filteredItems.length === 0 && searchQuery.trim()) {\n      announce(searchResultEmptyMessage);\n    }\n  }, [filteredItems.length, searchQuery, searchResultEmptyMessage]);\n\n  const containerStyle = maxHeight\n    ? {\n        maxHeight,\n        overflowY: 'auto' as const\n      }\n    : {};\n\n  const itemIdByRef = useMemo(() => {\n    const map = new WeakMap<MenuItemProps, string>();\n    const seen = new Set<string>();\n\n    items.forEach((item, index) => {\n      const baseId = item.id || item.automationId || `menu-item-${index}`;\n      let uniqueId = baseId;\n\n      if (seen.has(uniqueId)) {\n        uniqueId = `${baseId}-${index}`;\n      }\n\n      seen.add(uniqueId);\n      map.set(item, uniqueId);\n    });\n\n    return map;\n  }, [items]);\n\n  const itemIds = useMemo(() => {\n    return filteredItems\n      .filter((item) => item.type !== 'header' && item.type !== 'separator')\n      .map((item) => itemIdByRef.get(item) as string);\n  }, [filteredItems, itemIdByRef]);\n\n  // Use roving focus for arrow key navigation\n  const { getRovingItemProps, handleKeyDown: rovingHandleKeyDown, setFocusedId, focusItem, getContainerProps } = useRovingFocus({\n    itemIds,\n    orientation: 'vertical',\n    loop: true,\n    role: 'menu'\n  });\n\n  // Wrap roving keydown: when on a menu item, Shift+Tab goes back to search input\n  const handleMenuItemKeyDown = (e: React.KeyboardEvent) => {\n    if (shouldShowSearch && e.key === 'Tab' && e.shiftKey) {\n      e.preventDefault();\n      searchInputRef.current?.focus();\n      return;\n    }\n    rovingHandleKeyDown(e);\n  };\n\n  // Search input keydown: ArrowDown enters the menu, Tab moves to first menu item\n  const handleSearchKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      const firstId = itemIds[0];\n      if (firstId) focusItem(firstId);\n    } else if (e.key === 'Tab' && !e.shiftKey) {\n      e.preventDefault();\n      const firstId = itemIds[0];\n      if (firstId) focusItem(firstId);\n    }\n  };\n\n  const renderSearchBar = () => {\n    return (\n      <div className=\"w-full relative flex items-center border-b border-[var(--color-gray-300)] px-1\">\n        <InputWithIcon\n          leftIcon={{ name: 'search', position: 'left', style: { color: 'var(--color-gray-500)' } }}\n          value={searchQuery}\n          onChange={(value: string) => setSearchQuery(value)}\n          placeholder={searchPlaceholder}\n          style={{ margin: 0, gap: 0 }}\n          inputStyle={{ width: '100%', border: 'none', outline: 'none' }}\n          automationId=\"se-design-menu-list-search\"\n          ariaLabel={searchPlaceholder}\n          inputRef={searchInputRef}\n          inputProps={{ onKeyDown: handleSearchKeyDown }}\n        />\n      </div>\n    );\n  };\n\n  return (\n    <div\n      ref={ref}\n      className={`se-design-menu-list border border-[var(--color-gray-200)] rounded shadow-md ${\n        shouldShowSearch ? '' : 'py-2'\n      }${className ? ` ${className}` : ''}`}\n    >\n      {shouldShowSearch && renderSearchBar()}\n      <div\n        style={containerStyle}\n        className={`overflow-y-auto ${shouldShowSearch ? 'py-2' : ''}`}\n        {...getContainerProps({ ariaLabel: 'Menu' })}\n      >\n        {filteredItems.length > 0 ? (\n          filteredItems.map((item) => {\n            const stableId = itemIdByRef.get(item) as string;\n\n            if (item.type === 'separator') {\n              return (\n                <hr key={stableId} className=\"se-design-menu-separator cursor-default border-[var(--color-gray-200)]\" />\n              );\n            }\n\n            if (item.type === 'header') {\n              return (\n                <div\n                  key={stableId}\n                  className=\"se-design-menu-header cursor-default px-2 mx-1 text-sm pt-2 text-[var(--color-gray-650)]\"\n                  role=\"presentation\"\n                >\n                  {item.label}\n                </div>\n              );\n            }\n\n            const rovingProps = getRovingItemProps(stableId);\n            return (\n              <MenuItem\n                {...item}\n                key={stableId}\n                ref={rovingProps.ref}\n                tabIndex={rovingProps.tabIndex}\n                onKeyDown={handleMenuItemKeyDown}\n                onFocus={() => setFocusedId(stableId)}\n              />\n            );\n          })\n        ) : (\n          <div className=\"px-3 py-4 text-center text-[var(--color-gray-700)] text-sm\">{searchResultEmptyMessage}</div>\n        )}\n      </div>\n    </div>\n  );\n});\n\nMenuList.displayName = 'MenuList';\n"],"names":["MenuList","items","maxHeight","shouldShowSearch","searchPlaceholder","searchBy","searchResultEmptyMessage","className","ref","searchQuery","setSearchQuery","useState","searchInputRef","useRef","filteredItems","trim","filter","item","toString","toLowerCase","includes","useEffect","length","announce","containerStyle","overflowY","itemIdByRef","useMemo","map","WeakMap","seen","Set","forEach","index","baseId","id","automationId","uniqueId","has","add","set","itemIds","type","get","getRovingItemProps","handleKeyDown","rovingHandleKeyDown","setFocusedId","focusItem","getContainerProps","useRovingFocus","orientation","loop","role","handleMenuItemKeyDown","e","key","shiftKey","preventDefault","current","focus","handleSearchKeyDown","firstId","renderSearchBar","React","createElement","InputWithIcon","leftIcon","name","position","style","color","value","onChange","placeholder","margin","gap","inputStyle","width","border","outline","ariaLabel","inputRef","inputProps","onKeyDown","_extends","stableId","label","rovingProps","MenuItem","tabIndex","onFocus","displayName"],"mappings":"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"}

package/dist/index19.js

@@ -6,17 +6,17 @@ import { getFirstFocusableElement as D, getLastFocusableElement as Ee, getFocusa
 import "./index72.js";
 import { useRegisterPortalWithFocusTrap as Pe } from "./index208.js";
 function T() {
-  return T = Object.assign ? Object.assign.bind() : function(b) {
-    for (var y = 1; y < arguments.length; y++) {
-      var m = arguments[y];
-      for (var h in m) ({}).hasOwnProperty.call(m, h) && (b[h] = m[h]);
+  return T = Object.assign ? Object.assign.bind() : function(y) {
+    for (var E = 1; E < arguments.length; E++) {
+      var m = arguments[E];
+      for (var h in m) ({}).hasOwnProperty.call(m, h) && (y[h] = m[h]);
     }
-    return b;
+    return y;
   }, T.apply(null, arguments);
 }
 const He = /* @__PURE__ */ we(({
-  className: b = "",
-  automationId: y = "",
+  className: y = "",
+  automationId: E = "",
   position: m = "bottom-center",
   popoverContentAutomationId: h = "",
   contentWidth: R = "max",
@@ -24,7 +24,7 @@ const He = /* @__PURE__ */ we(({
   renderPopoverSrcElement: oe,
   onPopoverToggle: z,
   isPopoverOpen: C,
-  disabled: E = !1,
+  disabled: k = !1,
   isWithPortal: f = !1,
   ariaLabel: ne,
   ariaLabelledBy: re,
@@ -42,7 +42,7 @@ const He = /* @__PURE__ */ we(({
   focusFirstOnOpen: ie = !1,
   ...ce
 }, ae) => {
-  const [i, p] = F(!1), [k, U] = F(m), [le, V] = F(!1), l = te(null), c = te(null);
+  const [i, p] = F(!1), [P, U] = F(m), [le, V] = F(!1), l = te(null), c = te(null);
   Pe(c, f && i);
   const ue = be({
     ariaLabel: ne,
@@ -59,14 +59,14 @@ const He = /* @__PURE__ */ we(({
     top: 0,
     left: 0,
     srcWidth: 0
-  }), [pe, W] = F(!1), P = () => {
+  }), [pe, W] = F(!1), b = () => {
     g ? (D({
       container: l.current,
       includeRoles: !0
     }) ?? l.current)?.focus() : l.current?.focus();
   }, X = (e) => {
     p(!1), e?.returnFocus !== !1 && requestAnimationFrame(() => {
-      e?.returnFocusTo ? (e.returnFocusTo instanceof HTMLElement ? e.returnFocusTo : e.returnFocusTo.current)?.focus() : P();
+      e?.returnFocusTo ? (e.returnFocusTo instanceof HTMLElement ? e.returnFocusTo : e.returnFocusTo.current)?.focus() : b();
     });
   }, O = (e = "bottom-center") => {
     if (!l.current) return {
@@ -119,13 +119,13 @@ const He = /* @__PURE__ */ we(({
     if (i && f) {
       v ? window.addEventListener("scroll", G) : (document.body.addEventListener("click", I, !0), window.addEventListener("scroll", I)), window.addEventListener("resize", Y);
       const e = (r) => {
-        r.key === "Escape" && c.current?.contains(document.activeElement) && (r.preventDefault(), r.stopPropagation(), p(!1), requestAnimationFrame(() => P()));
+        r.key === "Escape" && c.current?.contains(document.activeElement) && (r.preventDefault(), r.stopPropagation(), p(!1), requestAnimationFrame(() => b()));
       };
       window.addEventListener("keydown", e, !0), H();
       let o, t;
       return o = requestAnimationFrame(() => {
         t = requestAnimationFrame(() => {
-          const r = O(k);
+          const r = O(P);
           r && A(r), W(!0);
         });
       }), () => {
@@ -165,7 +165,7 @@ const He = /* @__PURE__ */ we(({
     const o = l.current, t = c.current;
     if (!o) return;
     if (H(), e.type === "scroll" && i) {
-      const w = O(k);
+      const w = O(P);
       w && A(w);
     }
     const r = e.target, u = o.contains(r), a = t?.contains(r), s = r.closest?.(".se-design-popover-wrapper"), d = s && s !== o, x = c.current?.contains(s);
@@ -173,13 +173,13 @@ const He = /* @__PURE__ */ we(({
   }, Y = () => {
     if (i && f && l.current) {
       H();
-      const e = O(k);
+      const e = O(P);
       e && A(e);
     }
   }, G = () => {
     if (i && f && l.current) {
       H();
-      const e = O(k);
+      const e = O(P);
       e && A(e);
     }
   }, S = (e = !1) => {
@@ -214,7 +214,7 @@ const He = /* @__PURE__ */ we(({
     e.key === "ArrowDown" ? (e.preventDefault(), e.stopPropagation(), a = u < r.length - 1 ? u + 1 : 0) : e.key === "ArrowUp" ? (e.preventDefault(), e.stopPropagation(), a = u > 0 ? u - 1 : r.length - 1) : e.key === "Home" ? (e.preventDefault(), e.stopPropagation(), a = 0) : e.key === "End" && (e.preventDefault(), e.stopPropagation(), a = r.length - 1), a >= 0 && r[a] ? r[a].focus() : u === -1 && r.length > 0 && r[0].focus();
   }, Q = (e) => {
     if (e.key === "Escape")
-      e.preventDefault(), e.stopPropagation(), p(!1), requestAnimationFrame(() => P());
+      e.preventDefault(), e.stopPropagation(), p(!1), requestAnimationFrame(() => b());
     else if (e.key === "Tab") {
       if (_ === "dialog") {
         const o = N({
@@ -222,7 +222,7 @@ const He = /* @__PURE__ */ we(({
           filterHidden: !0
         }), t = o.indexOf(e.target), r = t === o.length - 1, u = t === 0 || t === -1;
         if (e.shiftKey && u)
-          e.preventDefault(), p(!1), P();
+          e.preventDefault(), p(!1), b();
         else if (!e.shiftKey && r && (p(!1), f)) {
           e.preventDefault();
           const a = l.current, n = N({
@@ -232,7 +232,7 @@ const He = /* @__PURE__ */ we(({
           d ? d.focus() : a?.focus();
         }
       } else if (p(!1), e.shiftKey)
-        e.preventDefault(), P();
+        e.preventDefault(), b();
       else if (f) {
         e.preventDefault();
         const o = l.current, t = N({
@@ -245,7 +245,7 @@ const He = /* @__PURE__ */ we(({
   };
   ge(ae, () => ({
     togglePopover: S,
-    focusTrigger: () => l.current?.focus(),
+    focusTrigger: () => b(),
     element: l.current
   }), []);
   const me = {
@@ -277,13 +277,13 @@ const He = /* @__PURE__ */ we(({
     }
   }, Z = se ? "" : "shadow-md border rounded-md";
   return /* @__PURE__ */ B.createElement("div", T({
-    className: "se-design-popover-wrapper cursor-pointer relative focus-outline rounded-md" + (b.length > 0 ? ` ${b}` : "") + (i ? " open" : "") + (E ? " opacity-50 cursor-not-allowed pointer-events-none" : ""),
+    className: "se-design-popover-wrapper cursor-pointer relative focus-outline rounded-md" + (y.length > 0 ? ` ${y}` : "") + (i ? " open" : "") + (k ? " opacity-50 cursor-not-allowed pointer-events-none" : ""),
     ref: l,
     onClick: (e) => {
-      E || g || (e.stopPropagation(), S());
+      k || g || (e.stopPropagation(), S());
     },
     onKeyDown: (e) => {
-      if (!(E || g))
+      if (!(k || g))
         if (e.key === "Enter" || e.key === " ") {
           e.preventDefault(), e.stopPropagation();
           const o = i;
@@ -316,10 +316,10 @@ const He = /* @__PURE__ */ we(({
     role: g ? "none" : q,
     "aria-expanded": g ? void 0 : i ? "true" : "false",
     "aria-haspopup": g ? void 0 : q === "combobox" ? "listbox" : _,
-    tabIndex: E || g ? -1 : 0,
-    "aria-disabled": g ? void 0 : E ? "true" : void 0
+    tabIndex: k || g ? -1 : 0,
+    "aria-disabled": g ? void 0 : k ? "true" : void 0
   }, ue, {
-    "data-automation-id": y
+    "data-automation-id": E
   }, ce), oe({
     displayPopover: i,
     togglePopover: S
@@ -327,7 +327,7 @@ const He = /* @__PURE__ */ we(({
     className: `popover-content absolute ${Z} z-[1000] ${R == "full" ? "w-full" : "w-max"}`,
     style: {
       ...$,
-      ...me[k]
+      ...me[P]
     },
     onClick: (e) => e.stopPropagation(),
     onKeyDown: Q,