se-design 1.0.83-dev.5 → 1.0.84-dev.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +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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"}
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 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":";;;;;;;;;;;;;;AAqEO,MAAMA,KAAUA,CAAC;AAAA,EACtBC,SAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,UAAAA,IAAW;AAAA,EACXC,WAAAA,IAAY;AAAA,EACZC,UAAAA,IAAW;AAAA,EACXC,cAAAA,IAAe;AAAA,EACfC,eAAAA,IAAgBC;AAAAA,EAChBC,mBAAAA,IAAoB;AAAA,EACpBC,0BAAAA,IAA2BF;AAAAA,EAC3BG,uBAAAA,IAAwB;AAAA,EACxBC,eAAAA,IAAgB;AAAA,EAChBC,cAAAA,IAAe;AACH,MAAM;AAClB,QAAM,CAACC,GAAgBC,CAAiB,IAAIC,EAAS,EAAK,GACpDC,IAAoBC,EAAuB,IAAI,GAE/CC,IAAwBD,EAAuB,IAAI,GACnDE,IAAoBb,KAAiBY,GACrC,CAACE,GAAoBC,CAAqB,IAAIN,EAAS,CAAA,CAAE,GACzD,CAACO,GAAoBC,CAAqB,IAAIR,EAAS,EAAK,GAC5DS,IAAiBP,EAA6C,IAAI,GAClEQ,IAAkB,OAAOzB,KAAY,UACrC0B,IAAmBC,GAAYpB,QAAW,iBAAiB,GAG3DqB,IAAmBA,MAAM;AAC7B,IAAIJ,EAAeK,YACjBC,aAAaN,EAAeK,OAAO,GACnCL,EAAeK,UAAU;AAAA,EAE7B,GAGME,IAAeA,MAAM;AACzB,IAAI5B,MAAc,gBAChByB,EAAAA,GACAJ,EAAeK,UAAUG,WAAW,MAAMlB,EAAkB,EAAK,GAAG,GAAG;AAAA,EAE3E,GAEMmB,IAAcA,MAAM;AACxBL,IAAAA,EAAAA,GACAd,EAAkB,EAAI;AAAA,EACxB,GAEMoB,IAA2BA,CAACC,MAA2B;AAC3D,QAAK3B,GACL;AAAA,UAAI2B,EAAEC,QAAQ,UAAU;AACtBD,UAAEE,eAAAA,GACFvB,EAAkB,EAAK;AACvB;AAAA,MACF;AACA,OAAIqB,EAAEC,QAAQ,WAAWD,EAAEC,QAAQ,SACjCD,EAAEE,eAAAA,GACFvB,EAAmBwB,CAAAA,MAAS,CAACA,CAAI;AAAA;AAAA,EAErC,GAIMC,IAAyBC,GAAqC;AAAA,IAClEC,UAAUjC;AAAAA,IACVkC,WAAWT;AAAAA,IACXU,YAAYZ;AAAAA,IACZa,UAAUA,MAAM9B,EAAkB,EAAK;AAAA,EAAA,CACxC;AAED+B,EAAAA,EAAU,MAAM;AACd,UAAMC,IAAiB9B,EAAkBa;AAEzC,IAAKiB,MAID5C,KAAY,mBACd4C,EAAeC,aAAa,SAAS,wCAAwC,GAC7ED,EAAeE,UAAUC,IAAI,6BAA6B,GAC1DH,EAAeE,UAAUC,IAAI,mBAAmB,KACvC/C,KAAY,iBACrB4C,EAAeE,UAAUC,IAAI,6BAA6B,GAC1DH,EAAeE,UAAUC,IAAI,mBAAmB,KACvC/C,KAAY,kBACrB4C,EAAeC,aAAa,SAAS,WAAW,GAChDD,EAAeE,UAAUC,IAAI,8BAA8B,GAC3DH,EAAeE,UAAUC,IAAI,mBAAmB,KACvC/C,KAAY,gBACrB4C,EAAeC,aAAa,SAAS,iEAAiE,GACtGD,EAAeE,UAAUC,IAAI,6BAA6B,GAC1DH,EAAeE,UAAUC,IAAI,sBAAsB,KAC1C/C,KAAY,cACrB4C,EAAeC,aAAa,SAAS,2BAA2B,GAChED,EAAeE,UAAUC,IAAI,6BAA6B,GAC1DH,EAAeE,UAAUC,IAAI,sBAAsB,KAC1C/C,KAAY,eACrB4C,EAAeC,aAAa,SAAS,oCAAoC,GACzED,EAAeE,UAAUC,IAAI,8BAA8B,GAC3DH,EAAeE,UAAUC,IAAI,sBAAsB,KAC1C/C,KAAY,cACrB4C,EAAeC,aAAa,SAAS,iCAAiC,GACtED,EAAeE,UAAUC,IAAI,qBAAqB,GAClDH,EAAeE,UAAUC,IAAI,kBAAkB,KACtC/C,KAAY,iBACrB4C,EAAeC,aAAa,SAAS,gEAAgE,GACrGD,EAAeE,UAAUC,IAAI,qBAAqB,GAClDH,EAAeE,UAAUC,IAAI,4BAA4B,KAChD/C,KAAY,iBACrB4C,EAAeC,aAAa,SAAS,oCAAoC,GACzED,EAAeE,UAAUC,IAAI,qBAAqB,GAClDH,EAAeE,UAAUC,IAAI,qBAAqB,KACzC/C,KAAY,eACrB4C,EAAeC,aAAa,SAAS,gCAAgC,GACrED,EAAeE,UAAUC,IAAI,oBAAoB,GACjDH,EAAeE,UAAUC,IAAI,kBAAkB,KACtC/C,KAAY,kBACrB4C,EAAeC,aAAa,SAAS,+DAA+D,GACpGD,EAAeE,UAAUC,IAAI,oBAAoB,GACjDH,EAAeE,UAAUC,IAAI,4BAA4B,KAChD/C,KAAY,mBACrB4C,EAAeC,aAAa,SAAS,mCAAmC,GACxED,EAAeE,UAAUC,IAAI,oBAAoB,GACjDH,EAAeE,UAAUC,IAAI,qBAAqB,IAGhD9C,KAAa,WACf2C,EAAeE,UAAUC,IAAI,qBAAqB;AAAA,EAEtD,GAAG,CAACjD,CAAO,CAAC,GAEZ6C,EAAU,MAAM;AACd,UAAMC,IAAiB9B,EAAkBa;AAEzC,IAAKiB,MAGDjC,IACFiC,EAAeE,UAAUE,OAAO,WAAW,IAE3CJ,EAAeE,UAAUC,IAAI,WAAW;AAAA,EAE5C,GAAG,CAACpC,CAAc,CAAC,GAGnBgC,EAAU,MAAM;AACd,IAAI1C,MAAc,eAChBW,EAAkB,EAAI;AAAA,EAE1B,GAAG,CAACX,CAAS,CAAC;AAEd,QAAMgD,IAAoBA,MAAM;AAC9B,IAAIhD,KAAa,WACfW,EAAmBD,CAAAA,MAAmB,CAACA,CAAc;AAAA,EAEzD,GAMMuC,IAAS;AAAA,IACb,GAAIjD,MAAc,WAAW;AAAA,MAAEkD,SALXC,MAAM;AAC1BxC,QAAAA,EAAmBD,CAAAA,MAAmB,CAACA,CAAc;AAAA,MACvD;AAAA,IAG0CyC;AAAAA,IACxC,GAAInD,MAAc,WAAW;AAAA,MAC3BoD,cAAcA,MAAMzC,EAAkB,EAAI;AAAA,MAC1C0C,cAAcA,MAAM1C,EAAkB,EAAK;AAAA,IAAA;AAAA,EAC7C,GAGI2C,IAA8BA,MAAM;AACxC,UAAMC,IAAWvC,EAAiBU;AAClC,QAAI,CAAC6B;AACH,aAAO,CAAA;AAGT,UAAMC,IAAUD,EAASE,sBAAAA,GACnBC,IAAUC,OAAOD,WAAWC,OAAOC,aACnCC,IAAUF,OAAOE,WAAWF,OAAOG,aACnCC,IAAY,IAGZC,IAAiBC,SAASC,eAAe3C,CAAgB,GACzD4C,IAAeH,GAAgBI,eAAe,GAC9CC,IAAgBL,GAAgBM,gBAAgB;AAEtD,QAAIC,IAAM,GACNC,IAAO,GACPC,IAAY,GACZC,IAAW;AAEf,YAAQ3E,GAAAA;AAAAA,MACN,KAAK;AACHwE,QAAAA,IAAMf,EAAQmB,SAASd,IAAUrD,GACjCgE,IAAOhB,EAAQgB,OAAOd,IAAUF,EAAQoB,QAAQ,IAAIT,IAAe,GACnEM,IAAYN,IAAe,IAAIJ,IAAY,GAC3CW,IAAW,CAACX,IAAY;AACxB;AAAA,MACF,KAAK;AACHQ,QAAAA,IAAMf,EAAQmB,SAASd,IAAUrD,GACjCgE,IAAOhB,EAAQgB,OAAOd,GACtBe,IAAYN,IAAe,MAAMJ,IAAY,GAC7CW,IAAW,CAACX,IAAY;AACxB;AAAA,MACF,KAAK;AACHQ,QAAAA,IAAMf,EAAQmB,SAASd,IAAUrD,GACjCgE,IAAOhB,EAAQqB,QAAQnB,IAAUS,GACjCM,IAAYN,IAAeA,IAAe,MAAMJ,IAAY,GAC5DW,IAAW,CAACX,IAAY;AACxB;AAAA,MACF,KAAK;AACHQ,QAAAA,IAAMf,EAAQe,MAAMV,IAAUQ,IAAgB7D,GAC9CgE,IAAOhB,EAAQgB,OAAOd,IAAUF,EAAQoB,QAAQ,IAAIT,IAAe,GACnEM,IAAYN,IAAe,IAAIJ,IAAY,GAC3CW,IAAWL,IAAgBN,IAAY;AACvC;AAAA,MACF,KAAK;AACHQ,QAAAA,IAAMf,EAAQe,MAAMV,IAAUQ,IAAgB7D,GAC9CgE,IAAOhB,EAAQgB,OAAOd,GACtBe,IAAYN,IAAe,MAAMJ,IAAY,GAC7CW,IAAWL,IAAgBN,IAAY;AACvC;AAAA,MACF,KAAK;AACHQ,QAAAA,IAAMf,EAAQe,MAAMV,IAAUQ,IAAgB7D,GAC9CgE,IAAOhB,EAAQqB,QAAQnB,IAAUS,GACjCM,IAAYN,IAAeA,IAAe,MAAMJ,IAAY,GAC5DW,IAAWL,IAAgBN,IAAY;AACvC;AAAA,MACF,KAAK;AACHQ,QAAAA,IAAMf,EAAQe,MAAMV,GACpBW,IAAOhB,EAAQgB,OAAOd,IAAUS,IAAe3D,GAC/CiE,IAAYN,IAAeJ,IAAY,GACvCW,IAAWX,IAAY;AACvB;AAAA,MACF,KAAK;AACHQ,QAAAA,IAAMf,EAAQe,MAAMV,IAAUL,EAAQsB,SAAS,IAAIT,IAAgB,GACnEG,IAAOhB,EAAQgB,OAAOd,IAAUS,IAAe3D,GAC/CiE,IAAYN,IAAeJ,IAAY,GACvCW,IAAWL,IAAgB,IAAIN,IAAY;AAC3C;AAAA,MACF,KAAK;AACHQ,QAAAA,IAAMf,EAAQmB,SAASd,IAAUQ,GACjCG,IAAOhB,EAAQgB,OAAOd,IAAUS,IAAe3D,GAC/CiE,IAAYN,IAAeJ,IAAY,GACvCW,IAAWL,IAAgBN,IAAY;AACvC;AAAA,MACF,KAAK;AACHQ,QAAAA,IAAMf,EAAQe,MAAMV,GACpBW,IAAOhB,EAAQqB,QAAQnB,IAAUlD,GACjCiE,IAAY,CAACV,IAAY,GACzBW,IAAWX,IAAY;AACvB;AAAA,MACF,KAAK;AACHQ,QAAAA,IAAMf,EAAQe,MAAMV,IAAUL,EAAQsB,SAAS,IAAIT,IAAgB,GACnEG,IAAOhB,EAAQqB,QAAQnB,IAAUlD,GACjCiE,IAAY,CAACV,IAAY,GACzBW,IAAWL,IAAgB,IAAIN,IAAY;AAC3C;AAAA,MACF,KAAK;AACHQ,QAAAA,IAAMf,EAAQmB,SAASd,IAAUQ,GACjCG,IAAOhB,EAAQqB,QAAQnB,IAAUlD,GACjCiE,IAAY,CAACV,IAAY,GACzBW,IAAWL,IAAgBN,IAAY;AACvC;AAAA,MACF;AACEQ,QAAAA,IAAMf,EAAQmB,SAASd,IAAUrD,GACjCgE,IAAOhB,EAAQgB,OAAOd,IAAUF,EAAQoB,QAAQ,IAAIT,IAAe,GACnEM,IAAYN,IAAe,IAAIJ,IAAY,GAC3CW,IAAW,CAACX,IAAY;AACxB;AAAA,IAAA;AAGJ,WAAO;AAAA,MACLhE,UAAU;AAAA,MACVwE,KAAK,GAAGA,CAAG;AAAA,MACXC,MAAM,GAAGA,CAAI;AAAA,MACbO,QAAQ;AAAA,MACR,gBAAgB,GAAGN,CAAS;AAAA,MAC5B,eAAe,GAAGC,CAAQ;AAAA,IAAA;AAAA,EAE9B;AAEAhC,EAAAA,EAAU,MAAM;AACd,QAAI,CAAChC,KAAkB,CAACR,GAAc;AACpCkB,MAAAA,EAAsB,EAAK;AAC3B;AAAA,IACF;AAEA,UAAM4D,IAAiBA,MAAM;AAC3B,YAAMhB,IAAiBC,SAASC,eAAe3C,CAAgB;AAG/D,UAAI,CAACyC,KAAkBA,EAAeM,iBAAiB,GAAG;AACxDW,8BAAsBD,CAAc;AACpC;AAAA,MACF;AAEA,YAAME,IAAkB5B,EAAAA;AAGxB6B,MAAAA,EAAU,MAAM;AACdjE,QAAAA,EAAsBgE,CAAe,GACrC9D,EAAsB,EAAI;AAAA,MAC5B,CAAC;AAAA,IACH,GAGMgE,IAAUvD,WAAWmD,GAAgB7E,IAAgB,KAAK,EAAE,GAE5DkF,IAAcA,CAACrD,MAAkB;AACrC,YAAMsD,IAAUrB,SAASC,eAAe3C,CAAgB,GAClDgE,IAASvE,EAAiBU,SAC1B8D,IAASxD,EAAEwD;AAEjB,MAAIF,KAAWC,KAAU,CAACD,EAAQG,SAASD,CAAM,KAAK,CAACD,EAAOE,SAASD,CAAM,KAC3E7E,EAAkB,EAAK;AAAA,IAE3B,GAGM+E,IAAyB1F,MAAc;AAC7C,IAAI0F,KACFzB,SAAS0B,KAAKC,iBAAiB,SAASP,GAAa,EAAI,GAE3D1B,OAAOiC,iBAAiB,UAAUZ,GAAgB,EAAI,GACtDrB,OAAOiC,iBAAiB,UAAUZ,CAAc;AAIhD,QAAIa,IAA4C;AAChD,WAAI1F,KAAiBa,EAAiBU,YACpCmE,IAAmB,IAAIC,iBAAiB,MAAM;AAC5Cd,MAAAA,EAAAA;AAAAA,IACF,CAAC,GACDa,EAAiBE,QAAQ/E,EAAiBU,SAAS;AAAA,MACjDsE,YAAY;AAAA,MACZC,iBAAiB,CAAC,SAAS,OAAO;AAAA,IAAA,CACnC,IAGI,MAAM;AACXtE,mBAAayD,CAAO,GACpB3D,EAAAA,GACIiE,KACFzB,SAAS0B,KAAKO,oBAAoB,SAASb,GAAa,EAAI,GAE9D1B,OAAOuC,oBAAoB,UAAUlB,GAAgB,EAAI,GACzDrB,OAAOuC,oBAAoB,UAAUlB,CAAc,GAC/Ca,KACFA,EAAiBM,WAAAA;AAAAA,IAErB;AAAA,EACF,GAAG,CAACzF,GAAgBR,GAAcH,GAAUC,GAAWG,GAAeoB,CAAgB,CAAC;AAMvF,QAAM6E,IACJ,CAAC/F,KAAqBgG,gBAAAA,EAAMC,eAAexG,CAAU,IACjDuG,gBAAAA,EAAME,aAAazG,GAAuC;AAAA,IACxD,oBAAoByB;AAAAA,IACpB,GAAI,OAAOzB,EAAW0G,QAAS,YAAY;AAAA,MAAEC,iBAAiBlF;AAAAA,IAAAA;AAAAA,EAAiB,CAChF,IACDzB,GAEA4G,IAAuBrG,IACzB;AAAA,IACEsG,UAAU;AAAA,IACVC,MAAM;AAAA,IACN,cAActG;AAAAA,IACd,oBAAoBiB;AAAAA,IACpBsF,SAAS/E;AAAAA,IACTgF,QAAQlF;AAAAA,IACRmF,WAAWhF;AAAAA,EAAAA,IAEb3B,QAEE4G,IAAuB3G,IAEzBD,SADAgC;AAGJ,SAAQlC,IAwBNmG,gBAAAA,EAAAY,cAAA,OAAAC,EAAA;AAAA,IACEC,WAAU;AAAA,EAAA,GACNlE,GACAyD,GACAM,CAAmB,GAEvBX,gBAAAA,EAAAY,cAAA,OAAA;AAAA,IACEE,WAAU;AAAA,IACVC,KAAKjH,IAAgBC,SAAaY;AAAAA,IAClCoC,cAAcpD,MAAc,cAAcI,SAAYqB;AAAAA,IACtD4B,cAAczB;AAAAA,EAAAA,GAEbwE,CACE,GACJ1F,KACC2G,gBAAAA,EAASC,aACPjB,gBAAAA,EAAAY,cAAAZ,EAAAkB,UAAA,MACElB,gBAAAA,EAAAY,cAAA,SAAA,MACG,IAAI1F,CAAgB;AAAA;AAAA;AAAA,gBAIhB,GACP8E,gBAAAA,EAAAY,cAAA,OAAA;AAAA,IACEO,IAAIjG;AAAAA,IACJqF,MAAK;AAAA,IACLO,WAAW;AAAA;AAAA,wEAE+C5G,CAAqB;AAAA,IAC/EkH,OAAO;AAAA,MACL,GAAGxG;AAAAA,MACHhB,UAAU,GAAGA,CAAQ;AAAA,MACrByH,WAAW;AAAA,MACXC,cAAc;AAAA,MACdC,YAAYzG,IAAqB,YAAY;AAAA,MAC7C0G,SAAS1G,IAAqB,IAAI;AAAA,MAClC2G,eAAe3G,IAAqB,SAAS;AAAA,MAC7C4G,YAAY5G,IAAqB,0BAA0B;AAAA;AAAA,MAE3D,GAAIA,IAAqB,CAAA,IAAK;AAAA,QAAEpB,UAAU;AAAA,QAASwE,KAAK;AAAA,QAAOC,MAAM;AAAA,MAAA;AAAA,IAAM;AAAA,IAE7EpB,cAAcpD,MAAc,cAAcI,SAAYqB;AAAAA,IACtD4B,cAAczB;AAAAA,EAAAA,GAEbN,IAAkB+E,gBAAAA,EAAAY,cAAA,KAAA;AAAA,IAAGE,WAAU;AAAA,EAAA,GAAkBtH,CAAW,IAAIA,CAC9D,CACL,GACFoE,SAAS0B,IACX,CACC,IAxELU,gBAAAA,EAAAY,qBAAAC,EAAA;AAAA,IACEC,WAAU;AAAA,IACVjE,SAASF;AAAAA,EAAAA,GACL0D,GACAM,CAAmB,GAEvBX,gBAAAA,EAAAY,cAAA,OAAA;AAAA,IAAKE,WAAU;AAAA,EAAA,GACZf,CACE,GACLC,gBAAAA,EAAAY,cAAA,OAAA;AAAA,IACEG,KAAKvG;AAAAA,IACL2G,IAAIjG;AAAAA,IACJqF,MAAK;AAAA,IACLO,WAAW,iDAAiDlH,CAAQ;AAAA;AAAA;AAAA;AAAA,IAIpE,sBAAoBQ,KAAgB;AAAA,EAAA,GAEnCa,IAAkB+E,gBAAAA,EAAAY,cAAA,KAAA;AAAA,IAAGE,WAAU;AAAA,EAAA,GAAkBtH,CAAW,IAAIA,CAC9D,CACF;AAqDT;"}
package/dist/index18.js CHANGED
@@ -1,65 +1,70 @@
1
- import n, { forwardRef as F, useState as C, useRef as P, useMemo as b } from "react";
2
- import { MenuItem as O } from "./index17.js";
3
- import { InputWithIcon as S } from "./index52.js";
4
- import { useRovingFocus as _ } from "./index70.js";
5
- function i() {
6
- return i = Object.assign ? Object.assign.bind() : function(a) {
7
- for (var o = 1; o < arguments.length; o++) {
8
- var r = arguments[o];
9
- for (var s in r) ({}).hasOwnProperty.call(r, s) && (a[s] = r[s]);
1
+ import n, { forwardRef as M, useState as C, useRef as P, useEffect as O, useMemo as h } from "react";
2
+ import { MenuItem as S } from "./index17.js";
3
+ import { InputWithIcon as _ } from "./index52.js";
4
+ import { useRovingFocus as j } from "./index70.js";
5
+ import { announce as B } from "./index75.js";
6
+ function f() {
7
+ return f = Object.assign ? Object.assign.bind() : function(o) {
8
+ for (var a = 1; a < arguments.length; a++) {
9
+ var r = arguments[a];
10
+ for (var s in r) ({}).hasOwnProperty.call(r, s) && (o[s] = r[s]);
10
11
  }
11
- return a;
12
- }, i.apply(null, arguments);
12
+ return o;
13
+ }, f.apply(null, arguments);
13
14
  }
14
- const j = /* @__PURE__ */ F(({
15
- items: a,
16
- maxHeight: o,
15
+ const Q = /* @__PURE__ */ M(({
16
+ items: o,
17
+ maxHeight: a,
17
18
  shouldShowSearch: r = !1,
18
19
  searchPlaceholder: s = "Search...",
19
- searchBy: h = "label",
20
- searchResultEmptyMessage: w = "No results found",
21
- className: m = ""
20
+ searchBy: w = "label",
21
+ searchResultEmptyMessage: d = "No results found",
22
+ className: y = ""
22
23
  }, x) => {
23
- const [d, D] = C(""), y = P(null), u = d.trim() ? a.filter((e) => (e[h]?.toString().toLowerCase() || "").includes(d.toLowerCase())) : a, E = o ? {
24
- maxHeight: o,
24
+ const [c, D] = C(""), g = P(null), l = c.trim() ? o.filter((e) => (e[w]?.toString().toLowerCase() || "").includes(c.toLowerCase())) : o;
25
+ O(() => {
26
+ l.length === 0 && c.trim() && B(d);
27
+ }, [l.length, c, d]);
28
+ const E = a ? {
29
+ maxHeight: a,
25
30
  overflowY: "auto"
26
- } : {}, f = b(() => {
31
+ } : {}, m = h(() => {
27
32
  const e = /* @__PURE__ */ new WeakMap(), t = /* @__PURE__ */ new Set();
28
- return a.forEach((l, v) => {
29
- const I = l.id || l.automationId || `menu-item-${v}`;
30
- let c = I;
31
- t.has(c) && (c = `${I}-${v}`), t.add(c), e.set(l, c);
33
+ return o.forEach((u, I) => {
34
+ const b = u.id || u.automationId || `menu-item-${I}`;
35
+ let i = b;
36
+ t.has(i) && (i = `${b}-${I}`), t.add(i), e.set(u, i);
32
37
  }), e;
33
- }, [a]), p = b(() => u.filter((e) => e.type !== "header" && e.type !== "separator").map((e) => f.get(e)), [u, f]), {
38
+ }, [o]), p = h(() => l.filter((e) => e.type !== "header" && e.type !== "separator").map((e) => m.get(e)), [l, m]), {
34
39
  getRovingItemProps: K,
35
- handleKeyDown: R,
36
- setFocusedId: k,
37
- focusItem: g,
38
- getContainerProps: M
39
- } = _({
40
+ handleKeyDown: k,
41
+ setFocusedId: N,
42
+ focusItem: v,
43
+ getContainerProps: $
44
+ } = j({
40
45
  itemIds: p,
41
46
  orientation: "vertical",
42
47
  loop: !0,
43
48
  role: "menu"
44
- }), N = (e) => {
49
+ }), L = (e) => {
45
50
  if (r && e.key === "Tab" && e.shiftKey) {
46
- e.preventDefault(), y.current?.focus();
51
+ e.preventDefault(), g.current?.focus();
47
52
  return;
48
53
  }
49
- R(e);
50
- }, $ = (e) => {
54
+ k(e);
55
+ }, R = (e) => {
51
56
  if (e.key === "ArrowDown") {
52
57
  e.preventDefault();
53
58
  const t = p[0];
54
- t && g(t);
59
+ t && v(t);
55
60
  } else if (e.key === "Tab" && !e.shiftKey) {
56
61
  e.preventDefault();
57
62
  const t = p[0];
58
- t && g(t);
63
+ t && v(t);
59
64
  }
60
- }, L = () => /* @__PURE__ */ n.createElement("div", {
65
+ }, F = () => /* @__PURE__ */ n.createElement("div", {
61
66
  className: "w-full relative flex items-center border-b border-[var(--color-gray-300)] px-1"
62
- }, /* @__PURE__ */ n.createElement(S, {
67
+ }, /* @__PURE__ */ n.createElement(_, {
63
68
  leftIcon: {
64
69
  name: "search",
65
70
  position: "left",
@@ -67,7 +72,7 @@ const j = /* @__PURE__ */ F(({
67
72
  color: "var(--color-gray-500)"
68
73
  }
69
74
  },
70
- value: d,
75
+ value: c,
71
76
  onChange: (e) => D(e),
72
77
  placeholder: s,
73
78
  style: {
@@ -81,21 +86,21 @@ const j = /* @__PURE__ */ F(({
81
86
  },
82
87
  automationId: "se-design-menu-list-search",
83
88
  ariaLabel: s,
84
- inputRef: y,
89
+ inputRef: g,
85
90
  inputProps: {
86
- onKeyDown: $
91
+ onKeyDown: R
87
92
  }
88
93
  }));
89
94
  return /* @__PURE__ */ n.createElement("div", {
90
95
  ref: x,
91
- className: `se-design-menu-list border border-[var(--color-gray-200)] rounded shadow-md ${r ? "" : "py-2"}${m ? ` ${m}` : ""}`
92
- }, r && L(), /* @__PURE__ */ n.createElement("div", i({
96
+ className: `se-design-menu-list border border-[var(--color-gray-200)] rounded shadow-md ${r ? "" : "py-2"}${y ? ` ${y}` : ""}`
97
+ }, r && F(), /* @__PURE__ */ n.createElement("div", f({
93
98
  style: E,
94
99
  className: `overflow-y-auto ${r ? "py-2" : ""}`
95
- }, M({
100
+ }, $({
96
101
  ariaLabel: "Menu"
97
- })), u.length > 0 ? u.map((e) => {
98
- const t = f.get(e);
102
+ })), l.length > 0 ? l.map((e) => {
103
+ const t = m.get(e);
99
104
  if (e.type === "separator")
100
105
  return /* @__PURE__ */ n.createElement("hr", {
101
106
  key: t,
@@ -107,22 +112,20 @@ const j = /* @__PURE__ */ F(({
107
112
  className: "se-design-menu-header cursor-default px-2 mx-1 text-sm pt-2 text-[var(--color-gray-650)]",
108
113
  role: "presentation"
109
114
  }, e.label);
110
- const l = K(t);
111
- return /* @__PURE__ */ n.createElement(O, i({}, e, {
115
+ const u = K(t);
116
+ return /* @__PURE__ */ n.createElement(S, f({}, e, {
112
117
  key: t,
113
- ref: l.ref,
114
- tabIndex: l.tabIndex,
115
- onKeyDown: N,
116
- onFocus: () => k(t)
118
+ ref: u.ref,
119
+ tabIndex: u.tabIndex,
120
+ onKeyDown: L,
121
+ onFocus: () => N(t)
117
122
  }));
118
123
  }) : /* @__PURE__ */ n.createElement("div", {
119
- className: "px-3 py-4 text-center text-[var(--color-gray-700)] text-sm",
120
- role: "status",
121
- "aria-live": "polite"
122
- }, w)));
124
+ className: "px-3 py-4 text-center text-[var(--color-gray-700)] text-sm"
125
+ }, d)));
123
126
  });
124
- j.displayName = "MenuList";
127
+ Q.displayName = "MenuList";
125
128
  export {
126
- j as MenuList
129
+ Q as MenuList
127
130
  };
128
131
  //# sourceMappingURL=index18.js.map
@@ -1 +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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"}
1
+ {"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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"}