se-design 1.0.68-dev → 1.0.68-devnav

package/dist/index62.js.map

@@ -1 +1 @@
-{"version":3,"file":"index62.js","sources":["../src/components/GuidedTour/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { Icon, RotationTypes } from '../Icon';\nimport { Button } from '../Button';\nimport { debounce } from 'src/utils/debounce';\n\n// Constants\nconst ANIMATION_DURATION_MS = 500;\nconst VIEWPORT_MARGIN_PX = 50;\nconst SCROLL_DEBOUNCE_MS = 150;\n\nconst ARROW_STYLES = {\n  'top-left': { rotate: '315', class: '-top-5 left-0' },\n  'top-right': { rotate: '45', class: '-top-5 right-0' },\n  'bottom-left': { rotate: '225', class: '-bottom-5 left-0' },\n  'bottom-right': { rotate: '135', class: '-bottom-5 right-0' }\n};\n\nexport type TooltipArrowPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';\n\nexport interface GuidedTourStep {\n  targetElementSelector: string;\n  iframeSelector?: string;\n  content: string;\n  tooltipPosition?:\n    | 'top-left'\n    | 'top-right'\n    | 'top-center'\n    | 'bottom-left'\n    | 'bottom-right'\n    | 'bottom-center'\n    | 'left-top'\n    | 'left-center'\n    | 'left-bottom'\n    | 'right-top'\n    | 'right-center'\n    | 'right-bottom';\n  tooltipPositionOffset?: {\n    horizontal?: number;\n    vertical?: number;\n  };\n  isOptionalStep?: boolean;\n  automationId?: string;\n  waitForElement?: boolean;\n  zIndex?: number;\n  isDropdownStep?: boolean;\n}\n\nexport interface GuidedTourProps {\n  steps: GuidedTourStep[];\n  screenBaseElementSelector?: string;\n  onClose: () => void;\n  tooltipBackgroundColor?: string;\n  tooltipTextColor?: string;\n  maxWidth?: number;\n  automationId?: string;\n}\n\ninterface TooltipPosition {\n  top: number;\n  left: number;\n}\n\n// Helper to get the iframe's content document\nconst getIframeDocument = (iframeSelector: string): Document | null => {\n  const iframe = document.querySelector(iframeSelector) as HTMLIFrameElement;\n  if (!iframe) {\n    console.warn(`Iframe not found: ${iframeSelector}`);\n    return null;\n  }\n\n  try {\n    return iframe.contentDocument || iframe.contentWindow?.document || null;\n  } catch (error) {\n    console.error('Cannot access iframe document:', error);\n    return null;\n  }\n};\n\n// Helper to get target element from main document or iframe\nconst getTargetElement = (selector: string, iframeSelector?: string): HTMLElement | null => {\n  if (!iframeSelector) {\n    return document.querySelector(selector);\n  }\n\n  const iframeDoc = getIframeDocument(iframeSelector);\n  return iframeDoc ? iframeDoc.querySelector(selector) : null;\n};\n\n// Helper to get adjusted bounding rect accounting for iframe position\nconst getAdjustedBoundingRect = (element: HTMLElement, iframeSelector?: string): DOMRect => {\n  const rect = element.getBoundingClientRect();\n\n  if (!iframeSelector) {\n    return rect;\n  }\n\n  const iframe = document.querySelector(iframeSelector) as HTMLIFrameElement;\n  if (!iframe) {\n    return rect;\n  }\n\n  const iframeRect = iframe.getBoundingClientRect();\n\n  // Get iframe's computed styles to account for borders\n  const borderLeft = iframe.clientLeft || 0;\n  const borderTop = iframe.clientTop || 0;\n\n  // Adjust coordinates relative to the main document\n  return new DOMRect(\n    rect.left + iframeRect.left + borderLeft,\n    rect.top + iframeRect.top + borderTop,\n    rect.width,\n    rect.height\n  );\n};\n\n// Determines the arrow position based on the tooltip position\nconst getArrowPosition = (position?: GuidedTourStep['tooltipPosition']): TooltipArrowPosition => {\n  switch (position) {\n    case 'left-bottom':\n    case 'left-center':\n    case 'bottom-left':\n      return 'top-right';\n    case 'right-bottom':\n    case 'right-center':\n    case 'bottom-right':\n    case 'bottom-center':\n      return 'top-left';\n    case 'top-left':\n    case 'left-top':\n      return 'bottom-right';\n    case 'top-right':\n    case 'top-center':\n    case 'right-top':\n      return 'bottom-left';\n    default:\n      return 'top-left';\n  }\n};\n\n// Gets current scroll position for window or container\nconst getScrollPosition = (): { x: number; y: number } => ({\n  x: window.scrollX || window.pageXOffset,\n  y: window.scrollY || window.pageYOffset\n});\n\n// Helper to wait for an element to appear using requestAnimationFrame\nconst waitForElement = (\n  selector: string,\n  callback: (element: HTMLElement) => void,\n  iframeSelector?: string\n): (() => void) => {\n  let rafId: number;\n\n  const checkElement = () => {\n    const element = getTargetElement(selector, iframeSelector);\n    if (element) {\n      callback(element);\n    } else {\n      rafId = requestAnimationFrame(checkElement);\n    }\n  };\n\n  rafId = requestAnimationFrame(checkElement);\n\n  // Return cleanup function\n  return () => {\n    if (rafId) {\n      cancelAnimationFrame(rafId);\n    }\n  };\n};\n\nexport const GuidedTour: FC<GuidedTourProps> = ({\n  steps,\n  screenBaseElementSelector,\n  onClose,\n  tooltipBackgroundColor = '#E04E05',\n  tooltipTextColor = 'var(--color-white)',\n  maxWidth = 350\n}) => {\n  const [currentStepIndex, setCurrentStepIndex] = useState<number>(0);\n  const previousTooltipPositionRef = useRef<TooltipPosition | null>(null);\n  const tooltipRef = useRef<HTMLDivElement>(null);\n\n  // To handle navigation to the next step\n  const navigateToNextStep = () => {\n    if (currentStepIndex < steps.length - 1) {\n      setCurrentStepIndex(currentStepIndex + 1);\n    } else {\n      onClose?.();\n    }\n  };\n\n  const handleTargetElementClick = () => {\n    navigateToNextStep();\n  };\n\n  // To handle clicks outside current target\n  useEffect(() => {\n    const currentStep = steps[currentStepIndex];\n\n    const handleBodyClick = (event: MouseEvent) => {\n      const target = event.target as Node;\n      const currentTargetElement = getTargetElement(currentStep?.targetElementSelector, currentStep?.iframeSelector);\n      const tooltipElement = tooltipRef.current;\n\n      // Ignore clicks on the tooltip itself\n      if (tooltipElement && tooltipElement.contains(target)) {\n        return;\n      }\n\n      // Check if click is outside current target element\n      if (currentTargetElement && !currentTargetElement.contains(target)) {\n        // If dropdown step, go to next step on any outside click\n        if (currentStep?.isDropdownStep) {\n          navigateToNextStep();\n          return;\n        }\n\n        // Otherwise, check if click is on last step's target to close tour\n        const lastStep = steps[steps.length - 1];\n        const lastStepTargetElement = getTargetElement(lastStep.targetElementSelector, lastStep.iframeSelector);\n\n        if (lastStepTargetElement && lastStepTargetElement.contains(target)) {\n          onClose();\n        }\n      }\n    };\n\n    // Wait for tooltip positioning animation to complete before listening\n    const timeoutId = setTimeout(() => {\n      document.body.addEventListener('mousedown', handleBodyClick, true);\n    }, ANIMATION_DURATION_MS + SCROLL_DEBOUNCE_MS);\n\n    return () => {\n      clearTimeout(timeoutId);\n      document.body.removeEventListener('mousedown', handleBodyClick, true);\n    };\n  }, [currentStepIndex, steps, onClose]);\n\n  // Initialize tooltip styles\n  useEffect(() => {\n    setCurrentStepIndex(0);\n    previousTooltipPositionRef.current = null;\n\n    const tooltipElement = tooltipRef.current;\n    if (tooltipElement) {\n      tooltipElement.style.maxWidth = `${maxWidth}px`;\n      tooltipElement.style.backgroundColor = tooltipBackgroundColor;\n      tooltipElement.style.color = tooltipTextColor;\n    }\n  }, [maxWidth, tooltipBackgroundColor, tooltipTextColor]);\n\n  // To position and manage the current step\n  useEffect(() => {\n    const currentStep = steps[currentStepIndex];\n\n    if (!currentStep?.targetElementSelector) {\n      onClose?.();\n      return;\n    }\n\n    const scrollableContainer = screenBaseElementSelector\n      ? (document.querySelector(screenBaseElementSelector) as HTMLElement)\n      : null;\n\n    const tooltipElement = tooltipRef.current;\n    if (!tooltipElement) return;\n\n    let targetElement: HTMLElement | null = null;\n    let cleanupWait: (() => void) | null = null;\n    let handleScroll: (ReturnType<typeof debounce> & (() => void)) | null = null;\n\n    const hasScrollableContainer = Boolean(\n      scrollableContainer && scrollableContainer.scrollHeight > scrollableContainer.clientHeight\n    );\n\n    const viewportDimensions = {\n      height: scrollableContainer?.clientHeight || window.innerHeight,\n      width: scrollableContainer?.clientWidth || window.innerWidth\n    };\n\n    const initializeStep = (element: HTMLElement) => {\n      targetElement = element;\n      targetElement.addEventListener('click', handleTargetElementClick);\n\n      // To calculate the tooltip position relative to the target element\n      const calculateTooltipPosition = (\n        targetRect: DOMRect,\n        tooltipWidth: number,\n        tooltipHeight: number,\n        scroll: { x: number; y: number }\n      ): TooltipPosition => {\n        const position = currentStep.tooltipPosition || 'bottom-center';\n        const offsetVertical = currentStep.tooltipPositionOffset?.vertical || 0;\n        const offsetHorizontal = currentStep.tooltipPositionOffset?.horizontal || 0;\n\n        let top = 0;\n        let left = 0;\n\n        // To calculate the position based on the tooltip position prop and the offset\n        switch (position) {\n          case 'bottom-center':\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x + targetRect.width / 2 + offsetHorizontal;\n            break;\n          case 'bottom-left':\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x - tooltipWidth + offsetHorizontal;\n            break;\n          case 'bottom-right':\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.right + scroll.x + offsetHorizontal;\n            break;\n          case 'top-center':\n            top = targetRect.top - tooltipHeight + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x + targetRect.width / 2 + offsetHorizontal;\n            break;\n          case 'top-left':\n            top = targetRect.top - tooltipHeight + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x - tooltipWidth + offsetHorizontal;\n            break;\n          case 'top-right':\n            top = targetRect.top - tooltipHeight + scroll.y + offsetVertical;\n            left = targetRect.right + scroll.x + offsetHorizontal;\n            break;\n          case 'left-top':\n            top = targetRect.top - tooltipHeight + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x - tooltipWidth + offsetHorizontal;\n            break;\n          case 'left-center':\n            top = targetRect.top + scroll.y + targetRect.height / 2 + offsetVertical;\n            left = targetRect.left + scroll.x - tooltipWidth + offsetHorizontal;\n            break;\n          case 'left-bottom':\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x - tooltipWidth + offsetHorizontal;\n            break;\n          case 'right-top':\n            top = targetRect.top - tooltipHeight + scroll.y + offsetVertical;\n            left = targetRect.right + scroll.x + offsetHorizontal;\n            break;\n          case 'right-center':\n            top = targetRect.top + scroll.y + targetRect.height / 2 + offsetVertical;\n            left = targetRect.right + scroll.x + offsetHorizontal;\n            break;\n          case 'right-bottom':\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.right + scroll.x + offsetHorizontal;\n            break;\n          default:\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x + targetRect.width / 2 + offsetHorizontal;\n            break;\n        }\n\n        return { top, left };\n      };\n\n      // To apply the position to the tooltip with optional animation\n      const applyTooltipPosition = (position: TooltipPosition, shouldAnimate: boolean) => {\n        tooltipElement.style.position = 'absolute';\n\n        const applyStyles = () => {\n          tooltipElement.style.top = `${position.top}px`;\n          tooltipElement.style.left = `${position.left}px`;\n        };\n\n        if (shouldAnimate && previousTooltipPositionRef.current) {\n          // Animate to new position immediately\n          tooltipElement.style.transition = `top ${ANIMATION_DURATION_MS}ms ease-in-out, left ${ANIMATION_DURATION_MS}ms ease-in-out`;\n          applyStyles();\n          previousTooltipPositionRef.current = position;\n        } else {\n          // Direct positioning without animation for first time\n          applyStyles();\n          previousTooltipPositionRef.current = position;\n        }\n      };\n\n      const positionTooltip = () => {\n        if (!tooltipElement || !targetElement) return;\n\n        // Wait for tooltip to be rendered with valid dimensions\n        const tooltipDimensions = {\n          width: tooltipElement.offsetWidth || 0,\n          height: tooltipElement.offsetHeight || 0\n        };\n\n        if (tooltipDimensions.width === 0 && tooltipDimensions.height === 0) {\n          requestAnimationFrame(positionTooltip);\n          return;\n        }\n\n        const targetRect = getAdjustedBoundingRect(targetElement, currentStep.iframeSelector);\n        const scroll = getScrollPosition();\n        const position = calculateTooltipPosition(\n          targetRect,\n          tooltipDimensions.width,\n          tooltipDimensions.height,\n          scroll\n        );\n\n        const shouldAnimate = previousTooltipPositionRef.current !== null;\n        applyTooltipPosition(position, shouldAnimate);\n      };\n\n      // To handle scroll events with debouncing to prevent excessive repositioning\n      handleScroll = debounce(() => {\n        if (!targetElement || !tooltipElement) return;\n\n        // Preserve current position for animation\n        const currentPosition = {\n          top: parseFloat(tooltipElement.style.top) || 0,\n          left: parseFloat(tooltipElement.style.left) || 0\n        };\n\n        if (!previousTooltipPositionRef.current && (currentPosition.top !== 0 || currentPosition.left !== 0)) {\n          previousTooltipPositionRef.current = currentPosition;\n        }\n\n        positionTooltip();\n\n        // Update reference after animation completes\n        if (previousTooltipPositionRef.current) {\n          setTimeout(() => {\n            const finalPosition = {\n              top: parseFloat(tooltipElement.style.top) || 0,\n              left: parseFloat(tooltipElement.style.left) || 0\n            };\n            if (finalPosition.top !== 0 || finalPosition.left !== 0) {\n              previousTooltipPositionRef.current = finalPosition;\n            }\n          }, ANIMATION_DURATION_MS);\n        }\n      }, SCROLL_DEBOUNCE_MS);\n\n      // Checks if both target and tooltip are fully visible in viewport\n      const areElementsVisible = (\n        targetRect: DOMRect,\n        tooltipTopViewport: number,\n        tooltipLeftViewport: number,\n        tooltipWidth: number,\n        tooltipHeight: number\n      ): boolean => {\n        const combinedBoundingBox = {\n          top: Math.min(targetRect.top, tooltipTopViewport),\n          bottom: Math.max(targetRect.bottom, tooltipTopViewport + tooltipHeight),\n          left: Math.min(targetRect.left, tooltipLeftViewport),\n          right: Math.max(targetRect.right, tooltipLeftViewport + tooltipWidth)\n        };\n\n        if (scrollableContainer) {\n          const containerRect = scrollableContainer.getBoundingClientRect();\n          return (\n            combinedBoundingBox.top >= containerRect.top + VIEWPORT_MARGIN_PX &&\n            combinedBoundingBox.bottom <= containerRect.top + containerRect.height - VIEWPORT_MARGIN_PX &&\n            combinedBoundingBox.left >= containerRect.left + VIEWPORT_MARGIN_PX &&\n            combinedBoundingBox.right <= containerRect.left + containerRect.width - VIEWPORT_MARGIN_PX &&\n            targetRect.width > 0 &&\n            targetRect.height > 0\n          );\n        }\n\n        return (\n          combinedBoundingBox.top >= VIEWPORT_MARGIN_PX &&\n          combinedBoundingBox.bottom <= viewportDimensions.height - VIEWPORT_MARGIN_PX &&\n          combinedBoundingBox.left >= VIEWPORT_MARGIN_PX &&\n          combinedBoundingBox.right <= viewportDimensions.width - VIEWPORT_MARGIN_PX &&\n          targetRect.width > 0 &&\n          targetRect.height > 0\n        );\n      };\n\n      // Calculates the scroll position needed to make both target and tooltip in viewport\n      const calculateScrollToCenter = (\n        targetRect: DOMRect,\n        tooltipTopViewport: number,\n        tooltipHeight: number\n      ): number | null => {\n        const combinedTop = Math.min(targetRect.top, tooltipTopViewport);\n        const combinedBottom = Math.max(targetRect.bottom, tooltipTopViewport + tooltipHeight);\n        const combinedHeight = combinedBottom - combinedTop;\n\n        // Determine scroll context (container or window)\n        const isContainer = Boolean(scrollableContainer && hasScrollableContainer);\n        const containerRect = isContainer ? scrollableContainer!.getBoundingClientRect() : null;\n\n        const viewportHeight = isContainer ? containerRect!.height : window.innerHeight;\n        const currentScroll = isContainer ? scrollableContainer!.scrollTop : getScrollPosition().y;\n        const maxScroll = isContainer\n          ? scrollableContainer!.scrollHeight - scrollableContainer!.clientHeight\n          : document.documentElement.scrollHeight - window.innerHeight;\n\n        const availableHeight = viewportHeight - 2 * VIEWPORT_MARGIN_PX;\n\n        // To calculate the center point\n        let centerPoint: number;\n\n        if (combinedHeight > availableHeight) {\n          // Combined area too tall - center the target element only\n          const targetCenter = (targetRect.top + targetRect.bottom) / 2;\n          centerPoint = isContainer ? targetCenter - containerRect!.top + currentScroll : targetCenter + currentScroll;\n        } else {\n          // Center the combined area (target + tooltip)\n          const combinedCenter = (combinedTop + combinedBottom) / 2;\n          centerPoint = isContainer\n            ? combinedCenter - containerRect!.top + currentScroll\n            : combinedCenter + currentScroll;\n        }\n\n        // Calculate final scroll position and clamp to valid range\n        const scrollPosition = centerPoint - viewportHeight / 2;\n        return Math.max(0, Math.min(scrollPosition, maxScroll));\n      };\n\n      // To initialize the tooltip positioning and handle scrolling if needed\n      const initializeTooltip = () => {\n        if (!tooltipElement || !targetElement) return;\n\n        const waitForDimensions = () => {\n          if (!tooltipElement || !targetElement) return;\n\n          const tooltipDimensions = {\n            width: tooltipElement.offsetWidth || 0,\n            height: tooltipElement.offsetHeight || 0\n          };\n\n          if (tooltipDimensions.width === 0 && tooltipDimensions.height === 0) {\n            requestAnimationFrame(waitForDimensions);\n            return;\n          }\n\n          const targetRect = getAdjustedBoundingRect(targetElement, currentStep.iframeSelector);\n          const scroll = getScrollPosition();\n\n          // Calculate tooltip position in absolute coordinates\n          const tooltipAbsolutePosition = calculateTooltipPosition(\n            targetRect,\n            tooltipDimensions.width,\n            tooltipDimensions.height,\n            scroll\n          );\n\n          // Convert to viewport coordinates for visibility check\n          const tooltipViewportPosition = {\n            top: tooltipAbsolutePosition.top - scroll.y,\n            left: tooltipAbsolutePosition.left - scroll.x\n          };\n\n          // Check if both elements are visible\n          const isVisible = areElementsVisible(\n            targetRect,\n            tooltipViewportPosition.top,\n            tooltipViewportPosition.left,\n            tooltipDimensions.width,\n            tooltipDimensions.height\n          );\n\n          if (!isVisible) {\n            // Calculate scroll needed to make both visible\n            const requiredScrollY = calculateScrollToCenter(\n              targetRect,\n              tooltipViewportPosition.top,\n              tooltipDimensions.height\n            );\n\n            if (requiredScrollY !== null) {\n              const scrollElement = hasScrollableContainer && scrollableContainer ? scrollableContainer : window;\n              scrollElement.scrollTo({ top: requiredScrollY, behavior: 'auto' });\n\n              // Position tooltip immediately after instant scroll\n              requestAnimationFrame(() => positionTooltip());\n            } else {\n              // Cannot fit with scrolling, position anyway\n              const shouldAnimate = previousTooltipPositionRef.current !== null;\n              applyTooltipPosition(tooltipAbsolutePosition, shouldAnimate);\n            }\n          } else {\n            // Both are visible, position tooltip\n            const shouldAnimate = previousTooltipPositionRef.current !== null;\n            applyTooltipPosition(tooltipAbsolutePosition, shouldAnimate);\n          }\n        };\n\n        waitForDimensions();\n      };\n\n      window.addEventListener('scroll', handleScroll, { passive: true });\n      if (hasScrollableContainer && scrollableContainer) {\n        scrollableContainer.addEventListener('scroll', handleScroll, { passive: true });\n      }\n\n      // Add scroll listener for iframe if target is inside iframe\n      if (currentStep.iframeSelector) {\n        const iframeDoc = getIframeDocument(currentStep.iframeSelector);\n        const iframeWindow = iframeDoc?.defaultView;\n        if (iframeWindow) {\n          iframeWindow.addEventListener('scroll', handleScroll, { passive: true });\n        }\n      }\n\n      initializeTooltip();\n    };\n\n    // Check if we need to wait for the element or get it immediately\n    if (currentStep.waitForElement) {\n      // Wait for element to appear\n      cleanupWait = waitForElement(currentStep.targetElementSelector, initializeStep, currentStep.iframeSelector);\n    } else {\n      const element = getTargetElement(currentStep.targetElementSelector, currentStep.iframeSelector);\n      if (!element) return;\n      initializeStep(element);\n    }\n\n    return () => {\n      if (cleanupWait) {\n        cleanupWait();\n      }\n      if (targetElement) {\n        targetElement.removeEventListener('click', handleTargetElementClick);\n      }\n      if (handleScroll) {\n        window.removeEventListener('scroll', handleScroll);\n        if (hasScrollableContainer && scrollableContainer) {\n          scrollableContainer.removeEventListener('scroll', handleScroll);\n        }\n        // Clean up iframe scroll listener\n        if (currentStep.iframeSelector) {\n          const iframeDoc = getIframeDocument(currentStep.iframeSelector);\n          const iframeWindow = iframeDoc?.defaultView;\n          if (iframeWindow) {\n            iframeWindow.removeEventListener('scroll', handleScroll);\n          }\n        }\n        // Cancel any pending debounced calls\n        (handleScroll as ReturnType<typeof debounce> & (() => void)).cancel();\n      }\n    };\n  }, [currentStepIndex, steps, onClose, screenBaseElementSelector, maxWidth]);\n\n  // Don't render if all steps completed\n  if (currentStepIndex >= steps.length) {\n    return null;\n  }\n\n  const currentStep = steps[currentStepIndex];\n  const arrowPosition = getArrowPosition(currentStep?.tooltipPosition);\n  const arrowStyle = ARROW_STYLES[arrowPosition];\n\n  return createPortal(\n    <div\n      ref={tooltipRef}\n      className={`guided-tour-tooltip relative rounded-md p-1`}\n      data-automation-id={`${currentStep?.automationId || 'guided-tour'}-tooltip`}\n      style={{ zIndex: currentStep?.zIndex || 1300 }}\n    >\n      <Icon\n        name=\"arrow-head\"\n        fill={tooltipBackgroundColor}\n        rotation={arrowStyle.rotate as RotationTypes}\n        className={`guided-tour-tooltip-arrow absolute ${arrowStyle.class}`}\n      />\n      <div className=\"guided-tour-tooltip-content flex flex-col gap-2\">\n        <p>{currentStep?.content}</p>\n        {currentStep?.isOptionalStep && (\n          <Button type=\"link\" label=\"Got it\" className=\"!text-white !underline\" onClick={handleTargetElementClick} />\n        )}\n      </div>\n    </div>,\n    document.body\n  );\n};\n"],"names":["ANIMATION_DURATION_MS","VIEWPORT_MARGIN_PX","SCROLL_DEBOUNCE_MS","ARROW_STYLES","rotate","class","getIframeDocument","iframeSelector","iframe","document","querySelector","warn","contentDocument","contentWindow","error","getTargetElement","selector","iframeDoc","getAdjustedBoundingRect","element","rect","getBoundingClientRect","iframeRect","borderLeft","clientLeft","borderTop","clientTop","DOMRect","left","top","width","height","getArrowPosition","position","getScrollPosition","x","window","scrollX","pageXOffset","y","scrollY","pageYOffset","waitForElement","callback","rafId","checkElement","requestAnimationFrame","cancelAnimationFrame","GuidedTour","steps","screenBaseElementSelector","onClose","tooltipBackgroundColor","tooltipTextColor","maxWidth","currentStepIndex","setCurrentStepIndex","useState","previousTooltipPositionRef","useRef","tooltipRef","navigateToNextStep","length","handleTargetElementClick","useEffect","currentStep","handleBodyClick","event","target","currentTargetElement","targetElementSelector","tooltipElement","current","contains","isDropdownStep","lastStep","lastStepTargetElement","timeoutId","setTimeout","body","addEventListener","clearTimeout","removeEventListener","style","backgroundColor","color","scrollableContainer","targetElement","cleanupWait","handleScroll","hasScrollableContainer","Boolean","scrollHeight","clientHeight","viewportDimensions","innerHeight","clientWidth","innerWidth","initializeStep","calculateTooltipPosition","targetRect","tooltipWidth","tooltipHeight","scroll","tooltipPosition","offsetVertical","tooltipPositionOffset","vertical","offsetHorizontal","horizontal","bottom","right","applyTooltipPosition","shouldAnimate","applyStyles","transition","positionTooltip","tooltipDimensions","offsetWidth","offsetHeight","debounce","currentPosition","parseFloat","finalPosition","areElementsVisible","tooltipTopViewport","tooltipLeftViewport","combinedBoundingBox","Math","min","max","containerRect","calculateScrollToCenter","combinedTop","combinedBottom","combinedHeight","isContainer","viewportHeight","currentScroll","scrollTop","maxScroll","documentElement","availableHeight","centerPoint","targetCenter","combinedCenter","scrollPosition","initializeTooltip","waitForDimensions","tooltipAbsolutePosition","tooltipViewportPosition","requiredScrollY","scrollElement","scrollTo","behavior","passive","iframeWindow","defaultView","cancel","arrowPosition","arrowStyle","createPortal","createElement","ref","className","automationId","zIndex","Icon","name","fill","rotation","React","content","isOptionalStep","Button","type","label","onClick"],"mappings":"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"}
+{"version":3,"file":"index62.js","sources":["../src/components/GuidedTour/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { Icon, RotationTypes } from '../Icon';\nimport { Button } from '../Button';\nimport { debounce } from 'src/utils/debounce';\n\n// Constants\nconst ANIMATION_DURATION_MS = 500;\nconst VIEWPORT_MARGIN_PX = 50;\nconst SCROLL_DEBOUNCE_MS = 150;\n\nconst ARROW_STYLES = {\n  'top-left': { rotate: '315', class: '-top-5 left-0' },\n  'top-right': { rotate: '45', class: '-top-5 right-0' },\n  'bottom-left': { rotate: '225', class: '-bottom-5 left-0' },\n  'bottom-right': { rotate: '135', class: '-bottom-5 right-0' }\n};\n\nexport type TooltipArrowPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';\n\nexport interface GuidedTourStep {\n  targetElementSelector: string;\n  iframeSelector?: string;\n  content: string;\n  tooltipPosition?:\n    | 'top-left'\n    | 'top-right'\n    | 'top-center'\n    | 'bottom-left'\n    | 'bottom-right'\n    | 'bottom-center'\n    | 'left-top'\n    | 'left-center'\n    | 'left-bottom'\n    | 'right-top'\n    | 'right-center'\n    | 'right-bottom';\n  tooltipPositionOffset?: {\n    horizontal?: number;\n    vertical?: number;\n  };\n  isOptionalStep?: boolean;\n  automationId?: string;\n  waitForElement?: boolean;\n  zIndex?: number;\n  isDropdownStep?: boolean;\n}\n\nexport interface GuidedTourProps {\n  steps: GuidedTourStep[];\n  screenBaseElementSelector?: string;\n  onClose: () => void;\n  tooltipBackgroundColor?: string;\n  tooltipTextColor?: string;\n  maxWidth?: number;\n  automationId?: string;\n}\n\ninterface TooltipPosition {\n  top: number;\n  left: number;\n}\n\n// Helper to get the iframe's content document\nconst getIframeDocument = (iframeSelector: string): Document | null => {\n  const iframe = document.querySelector(iframeSelector) as HTMLIFrameElement;\n  if (!iframe) {\n    console.warn(`Iframe not found: ${iframeSelector}`);\n    return null;\n  }\n\n  try {\n    return iframe.contentDocument || iframe.contentWindow?.document || null;\n  } catch (error) {\n    console.error('Cannot access iframe document:', error);\n    return null;\n  }\n};\n\n// Helper to get target element from main document or iframe\nconst getTargetElement = (selector: string, iframeSelector?: string): HTMLElement | null => {\n  if (!iframeSelector) {\n    return document.querySelector(selector);\n  }\n\n  const iframeDoc = getIframeDocument(iframeSelector);\n  return iframeDoc ? iframeDoc.querySelector(selector) : null;\n};\n\n// Helper to get adjusted bounding rect accounting for iframe position\nconst getAdjustedBoundingRect = (element: HTMLElement, iframeSelector?: string): DOMRect => {\n  const rect = element.getBoundingClientRect();\n\n  if (!iframeSelector) {\n    return rect;\n  }\n\n  const iframe = document.querySelector(iframeSelector) as HTMLIFrameElement;\n  if (!iframe) {\n    return rect;\n  }\n\n  const iframeRect = iframe.getBoundingClientRect();\n\n  // Get iframe's computed styles to account for borders\n  const borderLeft = iframe.clientLeft || 0;\n  const borderTop = iframe.clientTop || 0;\n\n  // Adjust coordinates relative to the main document\n  return new DOMRect(\n    rect.left + iframeRect.left + borderLeft,\n    rect.top + iframeRect.top + borderTop,\n    rect.width,\n    rect.height\n  );\n};\n\n// Determines the arrow position based on the tooltip position\nconst getArrowPosition = (position?: GuidedTourStep['tooltipPosition']): TooltipArrowPosition => {\n  switch (position) {\n    case 'left-bottom':\n    case 'left-center':\n    case 'bottom-left':\n      return 'top-right';\n    case 'right-bottom':\n    case 'right-center':\n    case 'bottom-right':\n    case 'bottom-center':\n      return 'top-left';\n    case 'top-left':\n    case 'left-top':\n      return 'bottom-right';\n    case 'top-right':\n    case 'top-center':\n    case 'right-top':\n      return 'bottom-left';\n    default:\n      return 'top-left';\n  }\n};\n\n// Gets current scroll position for window or container\nconst getScrollPosition = (): { x: number; y: number } => ({\n  x: window.scrollX || window.pageXOffset,\n  y: window.scrollY || window.pageYOffset\n});\n\n// Helper to wait for an element to appear using requestAnimationFrame\nconst waitForElement = (\n  selector: string,\n  callback: (element: HTMLElement) => void,\n  iframeSelector?: string\n): (() => void) => {\n  let rafId: number;\n\n  const checkElement = () => {\n    const element = getTargetElement(selector, iframeSelector);\n    if (element) {\n      callback(element);\n    } else {\n      rafId = requestAnimationFrame(checkElement);\n    }\n  };\n\n  rafId = requestAnimationFrame(checkElement);\n\n  // Return cleanup function\n  return () => {\n    if (rafId) {\n      cancelAnimationFrame(rafId);\n    }\n  };\n};\n\nexport const GuidedTour: FC<GuidedTourProps> = ({\n  steps,\n  screenBaseElementSelector,\n  onClose,\n  tooltipBackgroundColor = '#E04E05',\n  tooltipTextColor = 'var(--color-white)',\n  maxWidth = 350\n}) => {\n  const [currentStepIndex, setCurrentStepIndex] = useState<number>(0);\n  const previousTooltipPositionRef = useRef<TooltipPosition | null>(null);\n  const tooltipRef = useRef<HTMLDivElement>(null);\n\n  // To handle navigation to the next step\n  const navigateToNextStep = () => {\n    if (currentStepIndex < steps.length - 1) {\n      setCurrentStepIndex(currentStepIndex + 1);\n    } else {\n      onClose?.();\n    }\n  };\n\n  const handleTargetElementClick = () => {\n    navigateToNextStep();\n  };\n\n  // To handle clicks outside current target\n  useEffect(() => {\n    const currentStep = steps[currentStepIndex];\n\n    const handleBodyClick = (event: MouseEvent) => {\n      const target = event.target as Node;\n      const currentTargetElement = getTargetElement(currentStep?.targetElementSelector, currentStep?.iframeSelector);\n      const tooltipElement = tooltipRef.current;\n\n      // Ignore clicks on the tooltip itself\n      if (tooltipElement && tooltipElement.contains(target)) {\n        return;\n      }\n\n      // Check if click is outside current target element\n      if (currentTargetElement && !currentTargetElement.contains(target)) {\n        // If dropdown step, go to next step on any outside click\n        if (currentStep?.isDropdownStep) {\n          navigateToNextStep();\n          return;\n        }\n\n        // Otherwise, check if click is on last step's target to close tour\n        const lastStep = steps[steps.length - 1];\n        const lastStepTargetElement = getTargetElement(lastStep.targetElementSelector, lastStep.iframeSelector);\n\n        if (lastStepTargetElement && lastStepTargetElement.contains(target)) {\n          onClose();\n        }\n      }\n    };\n\n    // Wait for tooltip positioning animation to complete before listening\n    const timeoutId = setTimeout(() => {\n      document.body.addEventListener('mousedown', handleBodyClick, true);\n    }, ANIMATION_DURATION_MS + SCROLL_DEBOUNCE_MS);\n\n    return () => {\n      clearTimeout(timeoutId);\n      document.body.removeEventListener('mousedown', handleBodyClick, true);\n    };\n  }, [currentStepIndex, steps, onClose]);\n\n  // Initialize tooltip styles\n  useEffect(() => {\n    setCurrentStepIndex(0);\n    previousTooltipPositionRef.current = null;\n\n    const tooltipElement = tooltipRef.current;\n    if (tooltipElement) {\n      tooltipElement.style.maxWidth = `${maxWidth}px`;\n      tooltipElement.style.backgroundColor = tooltipBackgroundColor;\n      tooltipElement.style.color = tooltipTextColor;\n    }\n  }, [maxWidth, tooltipBackgroundColor, tooltipTextColor]);\n\n  // To position and manage the current step\n  useEffect(() => {\n    const currentStep = steps[currentStepIndex];\n\n    if (!currentStep?.targetElementSelector) {\n      onClose?.();\n      return;\n    }\n\n    const scrollableContainer = screenBaseElementSelector\n      ? (document.querySelector(screenBaseElementSelector) as HTMLElement)\n      : null;\n\n    const tooltipElement = tooltipRef.current;\n    if (!tooltipElement) return;\n\n    let targetElement: HTMLElement | null = null;\n    let cleanupWait: (() => void) | null = null;\n    let handleScroll: (ReturnType<typeof debounce> & (() => void)) | null = null;\n\n    const hasScrollableContainer = Boolean(\n      scrollableContainer && scrollableContainer.scrollHeight > scrollableContainer.clientHeight\n    );\n\n    const viewportDimensions = {\n      height: scrollableContainer?.clientHeight || window.innerHeight,\n      width: scrollableContainer?.clientWidth || window.innerWidth\n    };\n\n    const initializeStep = (element: HTMLElement) => {\n      targetElement = element;\n      targetElement.addEventListener('click', handleTargetElementClick);\n\n      // To calculate the tooltip position relative to the target element\n      const calculateTooltipPosition = (\n        targetRect: DOMRect,\n        tooltipWidth: number,\n        tooltipHeight: number,\n        scroll: { x: number; y: number }\n      ): TooltipPosition => {\n        const position = currentStep.tooltipPosition || 'bottom-center';\n        const offsetVertical = currentStep.tooltipPositionOffset?.vertical || 0;\n        const offsetHorizontal = currentStep.tooltipPositionOffset?.horizontal || 0;\n\n        let top = 0;\n        let left = 0;\n\n        // To calculate the position based on the tooltip position prop and the offset\n        switch (position) {\n          case 'bottom-center':\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x + targetRect.width / 2 + offsetHorizontal;\n            break;\n          case 'bottom-left':\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x - tooltipWidth + offsetHorizontal;\n            break;\n          case 'bottom-right':\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.right + scroll.x + offsetHorizontal;\n            break;\n          case 'top-center':\n            top = targetRect.top - tooltipHeight + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x + targetRect.width / 2 + offsetHorizontal;\n            break;\n          case 'top-left':\n            top = targetRect.top - tooltipHeight + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x - tooltipWidth + offsetHorizontal;\n            break;\n          case 'top-right':\n            top = targetRect.top - tooltipHeight + scroll.y + offsetVertical;\n            left = targetRect.right + scroll.x + offsetHorizontal;\n            break;\n          case 'left-top':\n            top = targetRect.top - tooltipHeight + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x - tooltipWidth + offsetHorizontal;\n            break;\n          case 'left-center':\n            top = targetRect.top + scroll.y + targetRect.height / 2 + offsetVertical;\n            left = targetRect.left + scroll.x - tooltipWidth + offsetHorizontal;\n            break;\n          case 'left-bottom':\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x - tooltipWidth + offsetHorizontal;\n            break;\n          case 'right-top':\n            top = targetRect.top - tooltipHeight + scroll.y + offsetVertical;\n            left = targetRect.right + scroll.x + offsetHorizontal;\n            break;\n          case 'right-center':\n            top = targetRect.top + scroll.y + targetRect.height / 2 + offsetVertical;\n            left = targetRect.right + scroll.x + offsetHorizontal;\n            break;\n          case 'right-bottom':\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.right + scroll.x + offsetHorizontal;\n            break;\n          default:\n            top = targetRect.bottom + scroll.y + offsetVertical;\n            left = targetRect.left + scroll.x + targetRect.width / 2 + offsetHorizontal;\n            break;\n        }\n\n        return { top, left };\n      };\n\n      // To apply the position to the tooltip with optional animation\n      const applyTooltipPosition = (position: TooltipPosition, shouldAnimate: boolean) => {\n        tooltipElement.style.position = 'absolute';\n\n        const applyStyles = () => {\n          tooltipElement.style.top = `${position.top}px`;\n          tooltipElement.style.left = `${position.left}px`;\n        };\n\n        if (shouldAnimate && previousTooltipPositionRef.current) {\n          // Animate to new position immediately\n          tooltipElement.style.transition = `top ${ANIMATION_DURATION_MS}ms ease-in-out, left ${ANIMATION_DURATION_MS}ms ease-in-out`;\n          applyStyles();\n          previousTooltipPositionRef.current = position;\n        } else {\n          // Direct positioning without animation for first time\n          applyStyles();\n          previousTooltipPositionRef.current = position;\n        }\n      };\n\n      const positionTooltip = () => {\n        if (!tooltipElement || !targetElement) return;\n\n        // Wait for tooltip to be rendered with valid dimensions\n        const tooltipDimensions = {\n          width: tooltipElement.offsetWidth || 0,\n          height: tooltipElement.offsetHeight || 0\n        };\n\n        if (tooltipDimensions.width === 0 && tooltipDimensions.height === 0) {\n          requestAnimationFrame(positionTooltip);\n          return;\n        }\n\n        const targetRect = getAdjustedBoundingRect(targetElement, currentStep.iframeSelector);\n        const scroll = getScrollPosition();\n        const position = calculateTooltipPosition(\n          targetRect,\n          tooltipDimensions.width,\n          tooltipDimensions.height,\n          scroll\n        );\n\n        const shouldAnimate = previousTooltipPositionRef.current !== null;\n        applyTooltipPosition(position, shouldAnimate);\n      };\n\n      // To handle scroll events with debouncing to prevent excessive repositioning\n      handleScroll = debounce(() => {\n        if (!targetElement || !tooltipElement) return;\n\n        // Preserve current position for animation\n        const currentPosition = {\n          top: parseFloat(tooltipElement.style.top) || 0,\n          left: parseFloat(tooltipElement.style.left) || 0\n        };\n\n        if (!previousTooltipPositionRef.current && (currentPosition.top !== 0 || currentPosition.left !== 0)) {\n          previousTooltipPositionRef.current = currentPosition;\n        }\n\n        positionTooltip();\n\n        // Update reference after animation completes\n        if (previousTooltipPositionRef.current) {\n          setTimeout(() => {\n            const finalPosition = {\n              top: parseFloat(tooltipElement.style.top) || 0,\n              left: parseFloat(tooltipElement.style.left) || 0\n            };\n            if (finalPosition.top !== 0 || finalPosition.left !== 0) {\n              previousTooltipPositionRef.current = finalPosition;\n            }\n          }, ANIMATION_DURATION_MS);\n        }\n      }, SCROLL_DEBOUNCE_MS);\n\n      // Checks if both target and tooltip are fully visible in viewport\n      const areElementsVisible = (\n        targetRect: DOMRect,\n        tooltipTopViewport: number,\n        tooltipLeftViewport: number,\n        tooltipWidth: number,\n        tooltipHeight: number\n      ): boolean => {\n        const combinedBoundingBox = {\n          top: Math.min(targetRect.top, tooltipTopViewport),\n          bottom: Math.max(targetRect.bottom, tooltipTopViewport + tooltipHeight),\n          left: Math.min(targetRect.left, tooltipLeftViewport),\n          right: Math.max(targetRect.right, tooltipLeftViewport + tooltipWidth)\n        };\n\n        if (scrollableContainer) {\n          const containerRect = scrollableContainer.getBoundingClientRect();\n          return (\n            combinedBoundingBox.top >= containerRect.top + VIEWPORT_MARGIN_PX &&\n            combinedBoundingBox.bottom <= containerRect.top + containerRect.height - VIEWPORT_MARGIN_PX &&\n            combinedBoundingBox.left >= containerRect.left + VIEWPORT_MARGIN_PX &&\n            combinedBoundingBox.right <= containerRect.left + containerRect.width - VIEWPORT_MARGIN_PX &&\n            targetRect.width > 0 &&\n            targetRect.height > 0\n          );\n        }\n\n        return (\n          combinedBoundingBox.top >= VIEWPORT_MARGIN_PX &&\n          combinedBoundingBox.bottom <= viewportDimensions.height - VIEWPORT_MARGIN_PX &&\n          combinedBoundingBox.left >= VIEWPORT_MARGIN_PX &&\n          combinedBoundingBox.right <= viewportDimensions.width - VIEWPORT_MARGIN_PX &&\n          targetRect.width > 0 &&\n          targetRect.height > 0\n        );\n      };\n\n      // Calculates the scroll position needed to make both target and tooltip in viewport\n      const calculateScrollToCenter = (\n        targetRect: DOMRect,\n        tooltipTopViewport: number,\n        tooltipHeight: number\n      ): number | null => {\n        const combinedTop = Math.min(targetRect.top, tooltipTopViewport);\n        const combinedBottom = Math.max(targetRect.bottom, tooltipTopViewport + tooltipHeight);\n        const combinedHeight = combinedBottom - combinedTop;\n\n        // Determine scroll context (container or window)\n        const isContainer = Boolean(scrollableContainer && hasScrollableContainer);\n        const containerRect = isContainer ? scrollableContainer!.getBoundingClientRect() : null;\n\n        const viewportHeight = isContainer ? containerRect!.height : window.innerHeight;\n        const currentScroll = isContainer ? scrollableContainer!.scrollTop : getScrollPosition().y;\n        const maxScroll = isContainer\n          ? scrollableContainer!.scrollHeight - scrollableContainer!.clientHeight\n          : document.documentElement.scrollHeight - window.innerHeight;\n\n        const availableHeight = viewportHeight - 2 * VIEWPORT_MARGIN_PX;\n\n        // To calculate the center point\n        let centerPoint: number;\n\n        if (combinedHeight > availableHeight) {\n          // Combined area too tall - center the target element only\n          const targetCenter = (targetRect.top + targetRect.bottom) / 2;\n          centerPoint = isContainer ? targetCenter - containerRect!.top + currentScroll : targetCenter + currentScroll;\n        } else {\n          // Center the combined area (target + tooltip)\n          const combinedCenter = (combinedTop + combinedBottom) / 2;\n          centerPoint = isContainer\n            ? combinedCenter - containerRect!.top + currentScroll\n            : combinedCenter + currentScroll;\n        }\n\n        // Calculate final scroll position and clamp to valid range\n        const scrollPosition = centerPoint - viewportHeight / 2;\n        return Math.max(0, Math.min(scrollPosition, maxScroll));\n      };\n\n      // To initialize the tooltip positioning and handle scrolling if needed\n      const initializeTooltip = () => {\n        if (!tooltipElement || !targetElement) return;\n\n        const waitForDimensions = () => {\n          if (!tooltipElement || !targetElement) return;\n\n          const tooltipDimensions = {\n            width: tooltipElement.offsetWidth || 0,\n            height: tooltipElement.offsetHeight || 0\n          };\n\n          if (tooltipDimensions.width === 0 && tooltipDimensions.height === 0) {\n            requestAnimationFrame(waitForDimensions);\n            return;\n          }\n\n          const targetRect = getAdjustedBoundingRect(targetElement, currentStep.iframeSelector);\n          const scroll = getScrollPosition();\n\n          // Calculate tooltip position in absolute coordinates\n          const tooltipAbsolutePosition = calculateTooltipPosition(\n            targetRect,\n            tooltipDimensions.width,\n            tooltipDimensions.height,\n            scroll\n          );\n\n          // Convert to viewport coordinates for visibility check\n          const tooltipViewportPosition = {\n            top: tooltipAbsolutePosition.top - scroll.y,\n            left: tooltipAbsolutePosition.left - scroll.x\n          };\n\n          // Check if both elements are visible\n          const isVisible = areElementsVisible(\n            targetRect,\n            tooltipViewportPosition.top,\n            tooltipViewportPosition.left,\n            tooltipDimensions.width,\n            tooltipDimensions.height\n          );\n\n          if (!isVisible) {\n            // Calculate scroll needed to make both visible\n            const requiredScrollY = calculateScrollToCenter(\n              targetRect,\n              tooltipViewportPosition.top,\n              tooltipDimensions.height\n            );\n\n            if (requiredScrollY !== null) {\n              const scrollElement = hasScrollableContainer && scrollableContainer ? scrollableContainer : window;\n              scrollElement.scrollTo({ top: requiredScrollY, behavior: 'auto' });\n\n              // Position tooltip immediately after instant scroll\n              requestAnimationFrame(() => positionTooltip());\n            } else {\n              // Cannot fit with scrolling, position anyway\n              const shouldAnimate = previousTooltipPositionRef.current !== null;\n              applyTooltipPosition(tooltipAbsolutePosition, shouldAnimate);\n            }\n          } else {\n            // Both are visible, position tooltip\n            const shouldAnimate = previousTooltipPositionRef.current !== null;\n            applyTooltipPosition(tooltipAbsolutePosition, shouldAnimate);\n          }\n        };\n\n        waitForDimensions();\n      };\n\n      window.addEventListener('scroll', handleScroll, { passive: true });\n      if (hasScrollableContainer && scrollableContainer) {\n        scrollableContainer.addEventListener('scroll', handleScroll, { passive: true });\n      }\n\n      // Add scroll listener for iframe if target is inside iframe\n      if (currentStep.iframeSelector) {\n        const iframeDoc = getIframeDocument(currentStep.iframeSelector);\n        const iframeWindow = iframeDoc?.defaultView;\n        if (iframeWindow) {\n          iframeWindow.addEventListener('scroll', handleScroll, { passive: true });\n        }\n      }\n\n      initializeTooltip();\n    };\n\n    // Check if we need to wait for the element or get it immediately\n    if (currentStep.waitForElement) {\n      // Wait for element to appear\n      cleanupWait = waitForElement(currentStep.targetElementSelector, initializeStep, currentStep.iframeSelector);\n    } else {\n      const element = getTargetElement(currentStep.targetElementSelector, currentStep.iframeSelector);\n      if (!element) return;\n      initializeStep(element);\n    }\n\n    return () => {\n      if (cleanupWait) {\n        cleanupWait();\n      }\n      if (targetElement) {\n        targetElement.removeEventListener('click', handleTargetElementClick);\n      }\n      if (handleScroll) {\n        window.removeEventListener('scroll', handleScroll);\n        if (hasScrollableContainer && scrollableContainer) {\n          scrollableContainer.removeEventListener('scroll', handleScroll);\n        }\n        // Clean up iframe scroll listener\n        if (currentStep.iframeSelector) {\n          const iframeDoc = getIframeDocument(currentStep.iframeSelector);\n          const iframeWindow = iframeDoc?.defaultView;\n          if (iframeWindow) {\n            iframeWindow.removeEventListener('scroll', handleScroll);\n          }\n        }\n        // Cancel any pending debounced calls\n        (handleScroll as ReturnType<typeof debounce> & (() => void)).cancel();\n      }\n    };\n  }, [currentStepIndex, steps, onClose, screenBaseElementSelector, maxWidth]);\n\n  // Don't render if all steps completed\n  if (currentStepIndex >= steps.length) {\n    return null;\n  }\n\n  const currentStep = steps[currentStepIndex];\n  const arrowPosition = getArrowPosition(currentStep?.tooltipPosition);\n  const arrowStyle = ARROW_STYLES[arrowPosition];\n\n  return createPortal(\n    <div\n      ref={tooltipRef}\n      className={`guided-tour-tooltip relative rounded-md p-1`}\n      data-automation-id={`${currentStep?.automationId || 'guided-tour'}-tooltip`}\n      style={{ zIndex: currentStep?.zIndex || 1300 }}\n    >\n      <Icon\n        name=\"arrow-head\"\n        fill={tooltipBackgroundColor}\n        rotation={arrowStyle.rotate as RotationTypes}\n        className={`guided-tour-tooltip-arrow absolute ${arrowStyle.class}`}\n      />\n      <div className=\"guided-tour-tooltip-content flex flex-col gap-2\">\n        <p>{currentStep?.content}</p>\n        {currentStep?.isOptionalStep && (\n          <Button type=\"link\" label=\"Got it\" className=\"!text-white !underline\" onClick={handleTargetElementClick} />\n        )}\n      </div>\n    </div>,\n    document.body\n  );\n};\n"],"names":["ANIMATION_DURATION_MS","VIEWPORT_MARGIN_PX","SCROLL_DEBOUNCE_MS","ARROW_STYLES","rotate","class","getIframeDocument","iframeSelector","iframe","document","querySelector","console","warn","contentDocument","contentWindow","error","getTargetElement","selector","iframeDoc","getAdjustedBoundingRect","element","rect","getBoundingClientRect","iframeRect","borderLeft","clientLeft","borderTop","clientTop","DOMRect","left","top","width","height","getArrowPosition","position","getScrollPosition","x","window","scrollX","pageXOffset","y","scrollY","pageYOffset","waitForElement","callback","rafId","checkElement","requestAnimationFrame","cancelAnimationFrame","GuidedTour","steps","screenBaseElementSelector","onClose","tooltipBackgroundColor","tooltipTextColor","maxWidth","currentStepIndex","setCurrentStepIndex","useState","previousTooltipPositionRef","useRef","tooltipRef","navigateToNextStep","length","handleTargetElementClick","useEffect","currentStep","handleBodyClick","event","target","currentTargetElement","targetElementSelector","tooltipElement","current","contains","isDropdownStep","lastStep","lastStepTargetElement","timeoutId","setTimeout","body","addEventListener","clearTimeout","removeEventListener","style","backgroundColor","color","scrollableContainer","targetElement","cleanupWait","handleScroll","hasScrollableContainer","Boolean","scrollHeight","clientHeight","viewportDimensions","innerHeight","clientWidth","innerWidth","initializeStep","calculateTooltipPosition","targetRect","tooltipWidth","tooltipHeight","scroll","tooltipPosition","offsetVertical","tooltipPositionOffset","vertical","offsetHorizontal","horizontal","bottom","right","applyTooltipPosition","shouldAnimate","applyStyles","transition","positionTooltip","tooltipDimensions","offsetWidth","offsetHeight","debounce","currentPosition","parseFloat","finalPosition","areElementsVisible","tooltipTopViewport","tooltipLeftViewport","combinedBoundingBox","Math","min","max","containerRect","calculateScrollToCenter","combinedTop","combinedBottom","combinedHeight","isContainer","viewportHeight","currentScroll","scrollTop","maxScroll","documentElement","availableHeight","centerPoint","targetCenter","combinedCenter","scrollPosition","initializeTooltip","waitForDimensions","tooltipAbsolutePosition","tooltipViewportPosition","requiredScrollY","scrollElement","scrollTo","behavior","passive","iframeWindow","defaultView","cancel","arrowPosition","arrowStyle","createPortal","React","createElement","ref","className","automationId","zIndex","Icon","name","fill","rotation","content","isOptionalStep","Button","type","label","onClick"],"mappings":";;;;;AAOA,MAAMA,IAAwB,KACxBC,IAAqB,IACrBC,IAAqB,KAErBC,KAAe;AAAA,EACnB,YAAY;AAAA,IAAEC,QAAQ;AAAA,IAAOC,OAAO;AAAA,EAAA;AAAA,EACpC,aAAa;AAAA,IAAED,QAAQ;AAAA,IAAMC,OAAO;AAAA,EAAA;AAAA,EACpC,eAAe;AAAA,IAAED,QAAQ;AAAA,IAAOC,OAAO;AAAA,EAAA;AAAA,EACvC,gBAAgB;AAAA,IAAED,QAAQ;AAAA,IAAOC,OAAO;AAAA,EAAA;AAC1C,GAgDMC,IAAoBA,CAACC,MAA4C;AACrE,QAAMC,IAASC,SAASC,cAAcH,CAAc;AACpD,MAAI,CAACC;AACHG,mBAAQC,KAAK,qBAAqBL,CAAc,EAAE,GAC3C;AAGT,MAAI;AACF,WAAOC,EAAOK,mBAAmBL,EAAOM,eAAeL,YAAY;AAAA,EACrE,SAASM,GAAO;AACdJ,mBAAQI,MAAM,kCAAkCA,CAAK,GAC9C;AAAA,EACT;AACF,GAGMC,IAAmBA,CAACC,GAAkBV,MAAgD;AAC1F,MAAI,CAACA;AACH,WAAOE,SAASC,cAAcO,CAAQ;AAGxC,QAAMC,IAAYZ,EAAkBC,CAAc;AAClD,SAAOW,IAAYA,EAAUR,cAAcO,CAAQ,IAAI;AACzD,GAGME,IAA0BA,CAACC,GAAsBb,MAAqC;AAC1F,QAAMc,IAAOD,EAAQE,sBAAAA;AAErB,MAAI,CAACf;AACH,WAAOc;AAGT,QAAMb,IAASC,SAASC,cAAcH,CAAc;AACpD,MAAI,CAACC;AACH,WAAOa;AAGT,QAAME,IAAaf,EAAOc,sBAAAA,GAGpBE,IAAahB,EAAOiB,cAAc,GAClCC,IAAYlB,EAAOmB,aAAa;AAGtC,SAAO,IAAIC,QACTP,EAAKQ,OAAON,EAAWM,OAAOL,GAC9BH,EAAKS,MAAMP,EAAWO,MAAMJ,GAC5BL,EAAKU,OACLV,EAAKW,MACP;AACF,GAGMC,KAAmBA,CAACC,MAAuE;AAC/F,UAAQA,GAAAA;AAAAA,IACN,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EAAA;AAEb,GAGMC,IAAoBA,OAAiC;AAAA,EACzDC,GAAGC,OAAOC,WAAWD,OAAOE;AAAAA,EAC5BC,GAAGH,OAAOI,WAAWJ,OAAOK;AAC9B,IAGMC,KAAiBA,CACrB1B,GACA2B,GACArC,MACiB;AACjB,MAAIsC;AAEJ,QAAMC,IAAeA,MAAM;AACzB,UAAM1B,IAAUJ,EAAiBC,GAAUV,CAAc;AACzD,IAAIa,IACFwB,EAASxB,CAAO,IAEhByB,IAAQE,sBAAsBD,CAAY;AAAA,EAE9C;AAEAD,SAAAA,IAAQE,sBAAsBD,CAAY,GAGnC,MAAM;AACX,IAAID,KACFG,qBAAqBH,CAAK;AAAA,EAE9B;AACF,GAEaI,KAAkCA,CAAC;AAAA,EAC9CC,OAAAA;AAAAA,EACAC,2BAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,wBAAAA,IAAyB;AAAA,EACzBC,kBAAAA,IAAmB;AAAA,EACnBC,UAAAA,IAAW;AACb,MAAM;AACJ,QAAM,CAACC,GAAkBC,CAAmB,IAAIC,GAAiB,CAAC,GAC5DC,IAA6BC,EAA+B,IAAI,GAChEC,IAAaD,EAAuB,IAAI,GAGxCE,IAAqBA,MAAM;AAC/B,IAAIN,IAAmBN,EAAMa,SAAS,IACpCN,EAAoBD,IAAmB,CAAC,IAExCJ,IAAAA;AAAAA,EAEJ,GAEMY,IAA2BA,MAAM;AACrCF,IAAAA,EAAAA;AAAAA,EACF;AA+bA,MA5bAG,EAAU,MAAM;AACd,UAAMC,IAAchB,EAAMM,CAAgB,GAEpCW,IAAkBA,CAACC,MAAsB;AAC7C,YAAMC,IAASD,EAAMC,QACfC,IAAuBtD,EAAiBkD,GAAaK,uBAAuBL,GAAa3D,cAAc,GACvGiE,IAAiBX,EAAWY;AAGlC,UAAID,EAAAA,KAAkBA,EAAeE,SAASL,CAAM,MAKhDC,KAAwB,CAACA,EAAqBI,SAASL,CAAM,GAAG;AAElE,YAAIH,GAAaS,gBAAgB;AAC/Bb,UAAAA,EAAAA;AACA;AAAA,QACF;AAGA,cAAMc,IAAW1B,EAAMA,EAAMa,SAAS,CAAC,GACjCc,IAAwB7D,EAAiB4D,EAASL,uBAAuBK,EAASrE,cAAc;AAEtG,QAAIsE,KAAyBA,EAAsBH,SAASL,CAAM,KAChEjB,EAAAA;AAAAA,MAEJ;AAAA,IACF,GAGM0B,IAAYC,WAAW,MAAM;AACjCtE,eAASuE,KAAKC,iBAAiB,aAAad,GAAiB,EAAI;AAAA,IACnE,GAAGnE,IAAwBE,CAAkB;AAE7C,WAAO,MAAM;AACXgF,mBAAaJ,CAAS,GACtBrE,SAASuE,KAAKG,oBAAoB,aAAahB,GAAiB,EAAI;AAAA,IACtE;AAAA,EACF,GAAG,CAACX,GAAkBN,GAAOE,CAAO,CAAC,GAGrCa,EAAU,MAAM;AACdR,IAAAA,EAAoB,CAAC,GACrBE,EAA2Bc,UAAU;AAErC,UAAMD,IAAiBX,EAAWY;AAClC,IAAID,MACFA,EAAeY,MAAM7B,WAAW,GAAGA,CAAQ,MAC3CiB,EAAeY,MAAMC,kBAAkBhC,GACvCmB,EAAeY,MAAME,QAAQhC;AAAAA,EAEjC,GAAG,CAACC,GAAUF,GAAwBC,CAAgB,CAAC,GAGvDW,EAAU,MAAM;AACd,UAAMC,IAAchB,EAAMM,CAAgB;AAE1C,QAAI,CAACU,GAAaK,uBAAuB;AACvCnB,MAAAA,IAAAA;AACA;AAAA,IACF;AAEA,UAAMmC,IAAsBpC,IACvB1C,SAASC,cAAcyC,CAAyB,IACjD,MAEEqB,IAAiBX,EAAWY;AAClC,QAAI,CAACD,EAAgB;AAErB,QAAIgB,IAAoC,MACpCC,IAAmC,MACnCC,IAAoE;AAExE,UAAMC,IAAyBC,GAC7BL,KAAuBA,EAAoBM,eAAeN,EAAoBO,eAG1EC,IAAqB;AAAA,MACzB/D,QAAQuD,GAAqBO,gBAAgBzD,OAAO2D;AAAAA,MACpDjE,OAAOwD,GAAqBU,eAAe5D,OAAO6D;AAAAA,IAAAA,GAG9CC,IAAiBA,CAAC/E,MAAyB;AAC/CoE,MAAAA,IAAgBpE,GAChBoE,EAAcP,iBAAiB,SAASjB,CAAwB;AAGhE,YAAMoC,IAA2BA,CAC/BC,GACAC,GACAC,GACAC,MACoB;AACpB,cAAMtE,IAAWgC,EAAYuC,mBAAmB,iBAC1CC,IAAiBxC,EAAYyC,uBAAuBC,YAAY,GAChEC,IAAmB3C,EAAYyC,uBAAuBG,cAAc;AAE1E,YAAIhF,IAAM,GACND,IAAO;AAGX,gBAAQK,GAAAA;AAAAA,UACN,KAAK;AACHJ,YAAAA,IAAMuE,EAAWU,SAASP,EAAOhE,IAAIkE,GACrC7E,IAAOwE,EAAWxE,OAAO2E,EAAOpE,IAAIiE,EAAWtE,QAAQ,IAAI8E;AAC3D;AAAA,UACF,KAAK;AACH/E,YAAAA,IAAMuE,EAAWU,SAASP,EAAOhE,IAAIkE,GACrC7E,IAAOwE,EAAWxE,OAAO2E,EAAOpE,IAAIkE,IAAeO;AACnD;AAAA,UACF,KAAK;AACH/E,YAAAA,IAAMuE,EAAWU,SAASP,EAAOhE,IAAIkE,GACrC7E,IAAOwE,EAAWW,QAAQR,EAAOpE,IAAIyE;AACrC;AAAA,UACF,KAAK;AACH/E,YAAAA,IAAMuE,EAAWvE,MAAMyE,IAAgBC,EAAOhE,IAAIkE,GAClD7E,IAAOwE,EAAWxE,OAAO2E,EAAOpE,IAAIiE,EAAWtE,QAAQ,IAAI8E;AAC3D;AAAA,UACF,KAAK;AACH/E,YAAAA,IAAMuE,EAAWvE,MAAMyE,IAAgBC,EAAOhE,IAAIkE,GAClD7E,IAAOwE,EAAWxE,OAAO2E,EAAOpE,IAAIkE,IAAeO;AACnD;AAAA,UACF,KAAK;AACH/E,YAAAA,IAAMuE,EAAWvE,MAAMyE,IAAgBC,EAAOhE,IAAIkE,GAClD7E,IAAOwE,EAAWW,QAAQR,EAAOpE,IAAIyE;AACrC;AAAA,UACF,KAAK;AACH/E,YAAAA,IAAMuE,EAAWvE,MAAMyE,IAAgBC,EAAOhE,IAAIkE,GAClD7E,IAAOwE,EAAWxE,OAAO2E,EAAOpE,IAAIkE,IAAeO;AACnD;AAAA,UACF,KAAK;AACH/E,YAAAA,IAAMuE,EAAWvE,MAAM0E,EAAOhE,IAAI6D,EAAWrE,SAAS,IAAI0E,GAC1D7E,IAAOwE,EAAWxE,OAAO2E,EAAOpE,IAAIkE,IAAeO;AACnD;AAAA,UACF,KAAK;AACH/E,YAAAA,IAAMuE,EAAWU,SAASP,EAAOhE,IAAIkE,GACrC7E,IAAOwE,EAAWxE,OAAO2E,EAAOpE,IAAIkE,IAAeO;AACnD;AAAA,UACF,KAAK;AACH/E,YAAAA,IAAMuE,EAAWvE,MAAMyE,IAAgBC,EAAOhE,IAAIkE,GAClD7E,IAAOwE,EAAWW,QAAQR,EAAOpE,IAAIyE;AACrC;AAAA,UACF,KAAK;AACH/E,YAAAA,IAAMuE,EAAWvE,MAAM0E,EAAOhE,IAAI6D,EAAWrE,SAAS,IAAI0E,GAC1D7E,IAAOwE,EAAWW,QAAQR,EAAOpE,IAAIyE;AACrC;AAAA,UACF,KAAK;AACH/E,YAAAA,IAAMuE,EAAWU,SAASP,EAAOhE,IAAIkE,GACrC7E,IAAOwE,EAAWW,QAAQR,EAAOpE,IAAIyE;AACrC;AAAA,UACF;AACE/E,YAAAA,IAAMuE,EAAWU,SAASP,EAAOhE,IAAIkE,GACrC7E,IAAOwE,EAAWxE,OAAO2E,EAAOpE,IAAIiE,EAAWtE,QAAQ,IAAI8E;AAC3D;AAAA,QAAA;AAGJ,eAAO;AAAA,UAAE/E,KAAAA;AAAAA,UAAKD,MAAAA;AAAAA,QAAAA;AAAAA,MAChB,GAGMoF,IAAuBA,CAAC/E,GAA2BgF,MAA2B;AAClF1C,QAAAA,EAAeY,MAAMlD,WAAW;AAEhC,cAAMiF,IAAcA,MAAM;AACxB3C,UAAAA,EAAeY,MAAMtD,MAAM,GAAGI,EAASJ,GAAG,MAC1C0C,EAAeY,MAAMvD,OAAO,GAAGK,EAASL,IAAI;AAAA,QAC9C;AAEA,QAAIqF,KAAiBvD,EAA2Bc,WAE9CD,EAAeY,MAAMgC,aAAa,OAAOpH,CAAqB,wBAAwBA,CAAqB,kBAC3GmH,EAAAA,GACAxD,EAA2Bc,UAAUvC,MAGrCiF,EAAAA,GACAxD,EAA2Bc,UAAUvC;AAAAA,MAEzC,GAEMmF,IAAkBA,MAAM;AAC5B,YAAI,CAAC7C,KAAkB,CAACgB,EAAe;AAGvC,cAAM8B,IAAoB;AAAA,UACxBvF,OAAOyC,EAAe+C,eAAe;AAAA,UACrCvF,QAAQwC,EAAegD,gBAAgB;AAAA,QAAA;AAGzC,YAAIF,EAAkBvF,UAAU,KAAKuF,EAAkBtF,WAAW,GAAG;AACnEe,gCAAsBsE,CAAe;AACrC;AAAA,QACF;AAEA,cAAMhB,IAAalF,EAAwBqE,GAAetB,EAAY3D,cAAc,GAC9EiG,IAASrE,EAAAA,GACTD,IAAWkE,EACfC,GACAiB,EAAkBvF,OAClBuF,EAAkBtF,QAClBwE,CACF,GAEMU,IAAgBvD,EAA2Bc,YAAY;AAC7DwC,QAAAA,EAAqB/E,GAAUgF,CAAa;AAAA,MAC9C;AAGAxB,MAAAA,IAAe+B,GAAS,MAAM;AAC5B,YAAI,CAACjC,KAAiB,CAAChB,EAAgB;AAGvC,cAAMkD,IAAkB;AAAA,UACtB5F,KAAK6F,WAAWnD,EAAeY,MAAMtD,GAAG,KAAK;AAAA,UAC7CD,MAAM8F,WAAWnD,EAAeY,MAAMvD,IAAI,KAAK;AAAA,QAAA;AAGjD,QAAI,CAAC8B,EAA2Bc,YAAYiD,EAAgB5F,QAAQ,KAAK4F,EAAgB7F,SAAS,OAChG8B,EAA2Bc,UAAUiD,IAGvCL,EAAAA,GAGI1D,EAA2Bc,WAC7BM,WAAW,MAAM;AACf,gBAAM6C,IAAgB;AAAA,YACpB9F,KAAK6F,WAAWnD,EAAeY,MAAMtD,GAAG,KAAK;AAAA,YAC7CD,MAAM8F,WAAWnD,EAAeY,MAAMvD,IAAI,KAAK;AAAA,UAAA;AAEjD,WAAI+F,EAAc9F,QAAQ,KAAK8F,EAAc/F,SAAS,OACpD8B,EAA2Bc,UAAUmD;AAAAA,QAEzC,GAAG5H,CAAqB;AAAA,MAE5B,GAAGE,CAAkB;AAGrB,YAAM2H,IAAqBA,CACzBxB,GACAyB,GACAC,GACAzB,GACAC,MACY;AACZ,cAAMyB,IAAsB;AAAA,UAC1BlG,KAAKmG,KAAKC,IAAI7B,EAAWvE,KAAKgG,CAAkB;AAAA,UAChDf,QAAQkB,KAAKE,IAAI9B,EAAWU,QAAQe,IAAqBvB,CAAa;AAAA,UACtE1E,MAAMoG,KAAKC,IAAI7B,EAAWxE,MAAMkG,CAAmB;AAAA,UACnDf,OAAOiB,KAAKE,IAAI9B,EAAWW,OAAOe,IAAsBzB,CAAY;AAAA,QAAA;AAGtE,YAAIf,GAAqB;AACvB,gBAAM6C,IAAgB7C,EAAoBjE,sBAAAA;AAC1C,iBACE0G,EAAoBlG,OAAOsG,EAActG,MAAM7B,KAC/C+H,EAAoBjB,UAAUqB,EAActG,MAAMsG,EAAcpG,SAAS/B,KACzE+H,EAAoBnG,QAAQuG,EAAcvG,OAAO5B,KACjD+H,EAAoBhB,SAASoB,EAAcvG,OAAOuG,EAAcrG,QAAQ9B,KACxEoG,EAAWtE,QAAQ,KACnBsE,EAAWrE,SAAS;AAAA,QAExB;AAEA,eACEgG,EAAoBlG,OAAO7B,KAC3B+H,EAAoBjB,UAAUhB,EAAmB/D,SAAS/B,KAC1D+H,EAAoBnG,QAAQ5B,KAC5B+H,EAAoBhB,SAASjB,EAAmBhE,QAAQ9B,KACxDoG,EAAWtE,QAAQ,KACnBsE,EAAWrE,SAAS;AAAA,MAExB,GAGMqG,IAA0BA,CAC9BhC,GACAyB,GACAvB,MACkB;AAClB,cAAM+B,IAAcL,KAAKC,IAAI7B,EAAWvE,KAAKgG,CAAkB,GACzDS,IAAiBN,KAAKE,IAAI9B,EAAWU,QAAQe,IAAqBvB,CAAa,GAC/EiC,IAAiBD,IAAiBD,GAGlCG,IAAc7C,GAAQL,KAAuBI,IAC7CyC,IAAgBK,IAAclD,EAAqBjE,sBAAAA,IAA0B,MAE7EoH,IAAiBD,IAAcL,EAAepG,SAASK,OAAO2D,aAC9D2C,IAAgBF,IAAclD,EAAqBqD,YAAYzG,IAAoBK,GACnFqG,IAAYJ,IACdlD,EAAqBM,eAAeN,EAAqBO,eACzDrF,SAASqI,gBAAgBjD,eAAexD,OAAO2D,aAE7C+C,KAAkBL,IAAiB,IAAIzI;AAG7C,YAAI+I;AAEJ,YAAIR,IAAiBO,IAAiB;AAEpC,gBAAME,KAAgB5C,EAAWvE,MAAMuE,EAAWU,UAAU;AAC5DiC,UAAAA,IAAcP,IAAcQ,IAAeb,EAAetG,MAAM6G,IAAgBM,IAAeN;AAAAA,QACjG,OAAO;AAEL,gBAAMO,KAAkBZ,IAAcC,KAAkB;AACxDS,UAAAA,IAAcP,IACVS,IAAiBd,EAAetG,MAAM6G,IACtCO,IAAiBP;AAAAA,QACvB;AAGA,cAAMQ,KAAiBH,IAAcN,IAAiB;AACtD,eAAOT,KAAKE,IAAI,GAAGF,KAAKC,IAAIiB,IAAgBN,CAAS,CAAC;AAAA,MACxD,GAGMO,IAAoBA,MAAM;AAC9B,YAAI,CAAC5E,KAAkB,CAACgB,EAAe;AAEvC,cAAM6D,IAAoBA,MAAM;AAC9B,cAAI,CAAC7E,KAAkB,CAACgB,EAAe;AAEvC,gBAAM8B,IAAoB;AAAA,YACxBvF,OAAOyC,EAAe+C,eAAe;AAAA,YACrCvF,QAAQwC,EAAegD,gBAAgB;AAAA,UAAA;AAGzC,cAAIF,EAAkBvF,UAAU,KAAKuF,EAAkBtF,WAAW,GAAG;AACnEe,kCAAsBsG,CAAiB;AACvC;AAAA,UACF;AAEA,gBAAMhD,IAAalF,EAAwBqE,GAAetB,EAAY3D,cAAc,GAC9EiG,IAASrE,EAAAA,GAGTmH,IAA0BlD,EAC9BC,GACAiB,EAAkBvF,OAClBuF,EAAkBtF,QAClBwE,CACF,GAGM+C,IAA0B;AAAA,YAC9BzH,KAAKwH,EAAwBxH,MAAM0E,EAAOhE;AAAAA,YAC1CX,MAAMyH,EAAwBzH,OAAO2E,EAAOpE;AAAAA,UAAAA;AAY9C,cARkByF,EAChBxB,GACAkD,EAAwBzH,KACxByH,EAAwB1H,MACxByF,EAAkBvF,OAClBuF,EAAkBtF,MACpB,GAqBO;AAEL,kBAAMkF,IAAgBvD,EAA2Bc,YAAY;AAC7DwC,YAAAA,EAAqBqC,GAAyBpC,CAAa;AAAA,UAC7D,OAvBgB;AAEd,kBAAMsC,IAAkBnB,EACtBhC,GACAkD,EAAwBzH,KACxBwF,EAAkBtF,MACpB;AAEA,gBAAIwH,MAAoB;AAEtBC,eADsB9D,KAA0BJ,IAAsBA,IAAsBlD,QAC9EqH,SAAS;AAAA,gBAAE5H,KAAK0H;AAAAA,gBAAiBG,UAAU;AAAA,cAAA,CAAQ,GAGjE5G,sBAAsB,MAAMsE,GAAiB;AAAA,iBACxC;AAEL,oBAAMH,IAAgBvD,EAA2Bc,YAAY;AAC7DwC,cAAAA,EAAqBqC,GAAyBpC,CAAa;AAAA,YAC7D;AAAA,UACF;AAAA,QAKF;AAEAmC,QAAAA,EAAAA;AAAAA,MACF;AAQA,UANAhH,OAAO4C,iBAAiB,UAAUS,GAAc;AAAA,QAAEkE,SAAS;AAAA,MAAA,CAAM,GAC7DjE,KAA0BJ,KAC5BA,EAAoBN,iBAAiB,UAAUS,GAAc;AAAA,QAAEkE,SAAS;AAAA,MAAA,CAAM,GAI5E1F,EAAY3D,gBAAgB;AAE9B,cAAMsJ,IADYvJ,EAAkB4D,EAAY3D,cAAc,GAC9BuJ;AAChC,QAAID,KACFA,EAAa5E,iBAAiB,UAAUS,GAAc;AAAA,UAAEkE,SAAS;AAAA,QAAA,CAAM;AAAA,MAE3E;AAEAR,MAAAA,EAAAA;AAAAA,IACF;AAGA,QAAIlF,EAAYvB;AAEd8C,MAAAA,IAAc9C,GAAeuB,EAAYK,uBAAuB4B,GAAgBjC,EAAY3D,cAAc;AAAA,SACrG;AACL,YAAMa,IAAUJ,EAAiBkD,EAAYK,uBAAuBL,EAAY3D,cAAc;AAC9F,UAAI,CAACa,EAAS;AACd+E,MAAAA,EAAe/E,CAAO;AAAA,IACxB;AAEA,WAAO,MAAM;AAOX,UANIqE,KACFA,EAAAA,GAEED,KACFA,EAAcL,oBAAoB,SAASnB,CAAwB,GAEjE0B,GAAc;AAMhB,YALArD,OAAO8C,oBAAoB,UAAUO,CAAY,GAC7CC,KAA0BJ,KAC5BA,EAAoBJ,oBAAoB,UAAUO,CAAY,GAG5DxB,EAAY3D,gBAAgB;AAE9B,gBAAMsJ,IADYvJ,EAAkB4D,EAAY3D,cAAc,GAC9BuJ;AAChC,UAAID,KACFA,EAAa1E,oBAAoB,UAAUO,CAAY;AAAA,QAE3D;AAECA,QAAAA,EAA4DqE,OAAAA;AAAAA,MAC/D;AAAA,IACF;AAAA,EACF,GAAG,CAACvG,GAAkBN,GAAOE,GAASD,GAA2BI,CAAQ,CAAC,GAGtEC,KAAoBN,EAAMa;AAC5B,WAAO;AAGT,QAAMG,IAAchB,EAAMM,CAAgB,GACpCwG,IAAgB/H,GAAiBiC,GAAauC,eAAe,GAC7DwD,IAAa9J,GAAa6J,CAAa;AAE7C,SAAOE,gBAAAA,GACLC,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACEC,KAAKxG;AAAAA,IACLyG,WAAW;AAAA,IACX,sBAAoB,GAAGpG,GAAaqG,gBAAgB,aAAa;AAAA,IACjEnF,OAAO;AAAA,MAAEoF,QAAQtG,GAAasG,UAAU;AAAA,IAAA;AAAA,EAAK,GAE7CL,gBAAAA,EAAAC,cAACK,IAAI;AAAA,IACHC,MAAK;AAAA,IACLC,MAAMtH;AAAAA,IACNuH,UAAUX,EAAW7J;AAAAA,IACrBkK,WAAW,sCAAsCL,EAAW5J,KAAK;AAAA,EAAA,CAClE,GACD8J,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKE,WAAU;AAAA,EAAA,GACbH,gBAAAA,EAAAC,cAAA,KAAA,MAAIlG,GAAa2G,OAAW,GAC3B3G,GAAa4G,kBACZX,gBAAAA,EAAAC,cAACW,IAAM;AAAA,IAACC,MAAK;AAAA,IAAOC,OAAM;AAAA,IAASX,WAAU;AAAA,IAAyBY,SAASlH;AAAAA,EAAAA,CAA2B,CAEzG,CACF,GACLvD,SAASuE,IACX;AACF;"}

package/dist/index63.js.map

@@ -1 +1 @@
-{"version":3,"file":"index63.js","sources":["../src/components/Link/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { getA11yNameAttributes } from '../../utils/a11y';\nimport './style.scss';\n\n/**\n * Allows native anchor attributes (aria-*, data-*, etc.) to be passed through,\n * but keeps our own href/onClick/aria-label/aria-labelledby/aria-describedby typing.\n */\ntype NativeAnchorProps = Omit<\n  React.AnchorHTMLAttributes<HTMLAnchorElement>,\n  'href' | 'onClick' | 'target' | 'rel' | 'aria-label' | 'aria-labelledby' | 'aria-describedby'\n>;\n\nexport interface LinkProps extends NativeAnchorProps {\n  /**\n   * URL to navigate to (required for actual links)\n   */\n  href: string;\n  /**\n   * Link text content (string only)\n   */\n  label: string;\n  /**\n   * If true, automatically adds target=\"_blank\" and rel=\"noopener noreferrer\"\n   * Also appends \" (opens in a new tab)\" to aria-label for screen readers\n   */\n  external?: boolean;\n  /**\n   * Accessible name for the link. Use when link text is generic or unclear.\n   * Prefer ariaLabelledBy when a visible label exists.\n   */\n  ariaLabel?: string;\n  /**\n   * ID(s) of element(s) that label this link.\n   * Preferred over ariaLabel when a visible label exists (keeps SR and visual text in sync).\n   */\n  ariaLabelledBy?: string;\n  /**\n   * ID(s) of element(s) that describe this link.\n   * Provides additional context announced after the accessible name.\n   */\n  ariaDescribedBy?: string;\n  /**\n   * Click handler (e.g., for analytics tracking)\n   */\n  onClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void;\n  /**\n   * Custom class name\n   */\n  className?: string;\n  /**\n   * Automation ID for testing\n   */\n  automationId?: string;\n  /**\n   * Override target (if you need something other than \"_blank\" for external links).\n   * Note: If external={true} and target is provided, the provided target will be used.\n   */\n  target?: string;\n  /**\n   * Override rel (if you need something other than \"noopener noreferrer\" for external links).\n   * Note: If external={true} and rel is provided, the provided rel will be used.\n   */\n  rel?: string;\n}\n\nconst EXTERNAL_LINK_ARIA_SUFFIX = ' (opens in a new tab)';\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(\n  (\n    {\n      href,\n      label,\n      external = false,\n      className = '',\n      automationId = '',\n      ariaLabel,\n      ariaLabelledBy,\n      ariaDescribedBy,\n      onClick,\n      target,\n      rel,\n      ...props\n    },\n    ref\n  ) => {\n    // Handle external link attributes\n    // If external={true}, default to target=\"_blank\" and rel=\"noopener noreferrer\"\n    // Explicit target/rel props can override these defaults\n    const targetAttr = external ? (target ?? '_blank') : target;\n    const relAttr = external ? (rel ?? 'noopener noreferrer') : rel;\n\n    // Compute accessible name/description props with correct precedence\n    // Precedence: ariaLabelledBy > ariaLabel > visible text content\n    const accessibleNameProps = getA11yNameAttributes({\n      // External link aria-label enhancement for screen readers:\n      // When external={true}, always append \"(opens in a new tab)\"\n      ariaLabel:\n        external ? `${ariaLabel ?? label}${EXTERNAL_LINK_ARIA_SUFFIX}` : ariaLabel,\n      ariaLabelledBy,\n      ariaDescribedBy\n    });\n\n    const linkClassName = ['se-design-link', 'focus-outline', 'focus-visible:underline', className]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <a\n        ref={ref}\n        href={href}\n        target={targetAttr}\n        rel={relAttr}\n        className={linkClassName}\n        data-automation-id={automationId}\n        onClick={onClick}\n        {...props}\n        {...accessibleNameProps}\n      >\n        {label}\n      </a>\n    );\n  }\n);\n\nLink.displayName = 'Link';\n"],"names":["EXTERNAL_LINK_ARIA_SUFFIX","Link","href","label","external","className","automationId","ariaLabel","ariaLabelledBy","ariaDescribedBy","onClick","target","rel","props","ref","targetAttr","relAttr","accessibleNameProps","getA11yNameAttributes","linkClassName","filter","Boolean","join","React","createElement","_extends","displayName"],"mappings":";;;;;;;;;;;;AAkEA,MAAMA,IAA4B,yBAErBC,sBACX,CACE;AAAA,EACEC,MAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,UAAAA,IAAW;AAAA,EACXC,WAAAA,IAAY;AAAA,EACZC,cAAAA,IAAe;AAAA,EACfC,WAAAA;AAAAA,EACAC,gBAAAA;AAAAA,EACAC,iBAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,KAAAA;AAAAA,EACA,GAAGC;AACL,GACAC,MACG;AAIGC,QAAAA,IAAaX,IAAYO,KAAU,WAAYA,GAC/CK,IAAUZ,IAAYQ,KAAO,wBAAyBA,GAItDK,IAAsBC,EAAsB;AAAA;AAAA;AAAA,IAGhDX,WACEH,IAAW,GAAGG,KAAaJ,CAAK,GAAGH,CAAyB,KAAKO;AAAAA,IACnEC,gBAAAA;AAAAA,IACAC,iBAAAA;AAAAA,EAAAA,CACD,GAEKU,IAAgB,CAAC,kBAAkB,iBAAiB,2BAA2Bd,CAAS,EAC3Fe,OAAOC,OAAO,EACdC,KAAK,GAAG;AAGTC,SAAAA,gBAAAA,EAAAC,cAAA,KAAAC,EAAA;AAAA,IACEX,KAAAA;AAAAA,IACAZ,MAAAA;AAAAA,IACAS,QAAQI;AAAAA,IACRH,KAAKI;AAAAA,IACLX,WAAWc;AAAAA,IACX,sBAAoBb;AAAAA,IACpBI,SAAAA;AAAAA,EACIG,GAAAA,GACAI,CAAmB,GAEtBd,CACA;AAEP,CACF;AAEAF,EAAKyB,cAAc;"}
+{"version":3,"file":"index63.js","sources":["../src/components/Link/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { getA11yNameAttributes } from '../../utils/a11y';\nimport './style.scss';\n\n/**\n * Allows native anchor attributes (aria-*, data-*, etc.) to be passed through,\n * but keeps our own href/onClick/aria-label/aria-labelledby/aria-describedby typing.\n */\ntype NativeAnchorProps = Omit<\n  React.AnchorHTMLAttributes<HTMLAnchorElement>,\n  'href' | 'onClick' | 'target' | 'rel' | 'aria-label' | 'aria-labelledby' | 'aria-describedby'\n>;\n\nexport interface LinkProps extends NativeAnchorProps {\n  /**\n   * URL to navigate to (required for actual links)\n   */\n  href: string;\n  /**\n   * Link text content (string only)\n   */\n  label: string;\n  /**\n   * If true, automatically adds target=\"_blank\" and rel=\"noopener noreferrer\"\n   * Also appends \" (opens in a new tab)\" to aria-label for screen readers\n   */\n  external?: boolean;\n  /**\n   * Accessible name for the link. Use when link text is generic or unclear.\n   * Prefer ariaLabelledBy when a visible label exists.\n   */\n  ariaLabel?: string;\n  /**\n   * ID(s) of element(s) that label this link.\n   * Preferred over ariaLabel when a visible label exists (keeps SR and visual text in sync).\n   */\n  ariaLabelledBy?: string;\n  /**\n   * ID(s) of element(s) that describe this link.\n   * Provides additional context announced after the accessible name.\n   */\n  ariaDescribedBy?: string;\n  /**\n   * Click handler (e.g., for analytics tracking)\n   */\n  onClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void;\n  /**\n   * Custom class name\n   */\n  className?: string;\n  /**\n   * Automation ID for testing\n   */\n  automationId?: string;\n  /**\n   * Override target (if you need something other than \"_blank\" for external links).\n   * Note: If external={true} and target is provided, the provided target will be used.\n   */\n  target?: string;\n  /**\n   * Override rel (if you need something other than \"noopener noreferrer\" for external links).\n   * Note: If external={true} and rel is provided, the provided rel will be used.\n   */\n  rel?: string;\n}\n\nconst EXTERNAL_LINK_ARIA_SUFFIX = ' (opens in a new tab)';\n\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(\n  (\n    {\n      href,\n      label,\n      external = false,\n      className = '',\n      automationId = '',\n      ariaLabel,\n      ariaLabelledBy,\n      ariaDescribedBy,\n      onClick,\n      target,\n      rel,\n      ...props\n    },\n    ref\n  ) => {\n    // Handle external link attributes\n    // If external={true}, default to target=\"_blank\" and rel=\"noopener noreferrer\"\n    // Explicit target/rel props can override these defaults\n    const targetAttr = external ? (target ?? '_blank') : target;\n    const relAttr = external ? (rel ?? 'noopener noreferrer') : rel;\n\n    // Compute accessible name/description props with correct precedence\n    // Precedence: ariaLabelledBy > ariaLabel > visible text content\n    const accessibleNameProps = getA11yNameAttributes({\n      // External link aria-label enhancement for screen readers:\n      // When external={true}, always append \"(opens in a new tab)\"\n      ariaLabel:\n        external ? `${ariaLabel ?? label}${EXTERNAL_LINK_ARIA_SUFFIX}` : ariaLabel,\n      ariaLabelledBy,\n      ariaDescribedBy\n    });\n\n    const linkClassName = ['se-design-link', 'focus-outline', 'focus-visible:underline', className]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <a\n        ref={ref}\n        href={href}\n        target={targetAttr}\n        rel={relAttr}\n        className={linkClassName}\n        data-automation-id={automationId}\n        onClick={onClick}\n        {...props}\n        {...accessibleNameProps}\n      >\n        {label}\n      </a>\n    );\n  }\n);\n\nLink.displayName = 'Link';\n"],"names":["EXTERNAL_LINK_ARIA_SUFFIX","Link","href","label","external","className","automationId","ariaLabel","ariaLabelledBy","ariaDescribedBy","onClick","target","rel","props","ref","targetAttr","relAttr","accessibleNameProps","getA11yNameAttributes","linkClassName","filter","Boolean","join","React","createElement","_extends","displayName"],"mappings":";;;;;;;;;;;;AAkEA,MAAMA,IAA4B,yBAErBC,sBACX,CACE;AAAA,EACEC,MAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,UAAAA,IAAW;AAAA,EACXC,WAAAA,IAAY;AAAA,EACZC,cAAAA,IAAe;AAAA,EACfC,WAAAA;AAAAA,EACAC,gBAAAA;AAAAA,EACAC,iBAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,KAAAA;AAAAA,EACA,GAAGC;AACL,GACAC,MACG;AAIH,QAAMC,IAAaX,IAAYO,KAAU,WAAYA,GAC/CK,IAAUZ,IAAYQ,KAAO,wBAAyBA,GAItDK,IAAsBC,EAAsB;AAAA;AAAA;AAAA,IAGhDX,WACEH,IAAW,GAAGG,KAAaJ,CAAK,GAAGH,CAAyB,KAAKO;AAAAA,IACnEC,gBAAAA;AAAAA,IACAC,iBAAAA;AAAAA,EAAAA,CACD,GAEKU,IAAgB,CAAC,kBAAkB,iBAAiB,2BAA2Bd,CAAS,EAC3Fe,OAAOC,OAAO,EACdC,KAAK,GAAG;AAEX,SACEC,gBAAAA,EAAAC,cAAA,KAAAC,EAAA;AAAA,IACEX,KAAAA;AAAAA,IACAZ,MAAAA;AAAAA,IACAS,QAAQI;AAAAA,IACRH,KAAKI;AAAAA,IACLX,WAAWc;AAAAA,IACX,sBAAoBb;AAAAA,IACpBI,SAAAA;AAAAA,EAAAA,GACIG,GACAI,CAAmB,GAEtBd,CACA;AAEP,CACF;AAEAF,EAAKyB,cAAc;"}

package/dist/index64.js

@@ -1,13 +1,13 @@
-import a, { useRef as j } from "react";
+import a, { useRef as G } from "react";
 import { Button as u } from "./index3.js";
-import { Badge as q } from "./index9.js";
-import { Icon as D } from "./index5.js";
-import { Link as G } from "./index63.js";
-import { CustomModal as H } from "./index12.js";
-import { useFocusTrap as J } from "./index227.js";
-import { useStableId as K } from "./index188.js";
+import { Badge as J } from "./index9.js";
+import { Icon as K } from "./index5.js";
+import { Link as E } from "./index63.js";
+import { CustomModal as O } from "./index12.js";
+import { useFocusTrap as Q } from "./index227.js";
+import { useStableId as T } from "./index188.js";
 /* empty css         */
-const O = {
+const U = {
   lg: {
     width: "768px",
     height: "500px"
@@ -17,52 +17,56 @@ const O = {
     height: "384px"
   }
 }, ca = ({
-  isOpen: t,
-  onClose: E,
+  isOpen: n,
+  onClose: N,
   trigger: c,
-  modalWidth: h,
-  modalHeight: N,
-  variant: f,
-  size: l = "lg",
-  availabilityLabel: b = "Available on ",
-  availabilityBadgeText: g,
-  title: x,
-  description: C,
-  learnMoreLinkText: n,
-  learnMoreHref: r,
-  onLearnMoreClick: v,
-  featureListDesc: o,
-  featuresList: k = [],
-  featureItemIcon: F,
-  mediaContent: I,
-  laterButtonText: R,
-  purchaseButtonText: S,
-  onLaterClick: _,
-  onPurchaseClick: A,
-  className: P = "",
-  modalContentClassName: $ = "",
-  automationId: s = "",
-  id: B
+  modalWidth: b,
+  modalHeight: g,
+  variant: x,
+  size: t = "lg",
+  availabilityLabel: C = "Available on ",
+  availabilityBadgeText: k,
+  title: v,
+  description: F,
+  learnMoreLinkText: r,
+  learnMoreHref: l,
+  onLearnMoreClick: o,
+  featureListDesc: s,
+  featuresList: I = [],
+  featureItemIcon: L,
+  mediaContent: R,
+  laterButtonText: S,
+  purchaseButtonText: _,
+  onLaterClick: A,
+  onPurchaseClick: P,
+  className: $ = "",
+  modalContentClassName: B = "",
+  automationId: i = "",
+  id: D
 }) => {
-  const m = j(null), i = K(B, "paywall-title");
-  J({
-    enabled: t,
+  const m = G(null), p = T(D, "paywall-title");
+  Q({
+    enabled: n,
     containerRef: m,
     restoreFocus: !0,
     initialFocus: ".paywall-card-btn-later"
   });
-  const L = () => {
-    _?.(), E();
-  }, d = O[l], M = h ?? d.width, p = N ?? d.height, y = f === "with-points" && l === "lg", w = k.map((e) => typeof e == "string" ? {
+  const z = () => {
+    A?.(), N();
+  }, d = U[t], W = b ?? d.width, y = g ?? d.height, w = x === "with-points" && t === "lg", h = I.map((e) => typeof e == "string" ? {
     text: e
   } : {
     text: e.text,
-    icon: e.icon
-  }), z = y && w.length > 0, W = F ?? /* @__PURE__ */ a.createElement(D, {
-    name: "info"
-  }), Y = /* @__PURE__ */ a.createElement("section", {
-    className: `paywall paywall-ctn paywall-ctn--${l} ${P}`,
-    "data-automation-id": s
+    icon: e.icon,
+    href: e.href,
+    external: e.external,
+    onLinkClick: e.onLinkClick
+  }), Y = w && h.length > 0, Z = L ?? /* @__PURE__ */ a.createElement(K, {
+    name: "info",
+    rotation: "180"
+  }), j = /* @__PURE__ */ a.createElement("section", {
+    className: `paywall paywall-ctn paywall-ctn--${t} ${$}`,
+    "data-automation-id": i
   }, /* @__PURE__ */ a.createElement("div", {
     className: "paywall-card"
   }, /* @__PURE__ */ a.createElement("div", {
@@ -71,73 +75,81 @@ const O = {
     className: "paywall-card-availability"
   }, /* @__PURE__ */ a.createElement("span", {
     className: "paywall-card-availability-label"
-  }, b), /* @__PURE__ */ a.createElement(q, {
-    label: g,
+  }, C), /* @__PURE__ */ a.createElement(J, {
+    label: k,
     className: "paywall-card-badge",
     bgColor: "var(--color-yellow-100)",
     textColor: "var(--color-yellow-700)"
   })), /* @__PURE__ */ a.createElement("h3", {
-    id: i,
+    id: p,
     className: "paywall-card-title"
-  }, x), /* @__PURE__ */ a.createElement("p", {
+  }, v), /* @__PURE__ */ a.createElement("p", {
     className: "paywall-card-description"
-  }, C, n && r && /* @__PURE__ */ a.createElement(G, {
-    href: r,
-    label: n,
-    external: !0,
+  }, F, r && (l || o) && /* @__PURE__ */ a.createElement(E, {
+    href: l ?? "#",
+    label: r,
+    external: !!l,
     className: "paywall-card-learn-more",
-    onClick: v
-  })), y && o && /* @__PURE__ */ a.createElement("p", {
+    onClick: (e) => {
+      l || e.preventDefault(), o?.(e);
+    }
+  })), w && s && /* @__PURE__ */ a.createElement("p", {
     className: "paywall-card-features-intro"
-  }, o), z && /* @__PURE__ */ a.createElement("ul", {
+  }, s), Y && /* @__PURE__ */ a.createElement("ul", {
     className: "paywall-card-features-list"
-  }, w.map((e) => /* @__PURE__ */ a.createElement("li", {
+  }, h.map((e) => /* @__PURE__ */ a.createElement("li", {
     key: e.text,
     className: "paywall-card-feature-item"
   }, /* @__PURE__ */ a.createElement("span", {
     className: "paywall-card-feature-icon",
     "aria-hidden": !0
-  }, e.icon ?? W), /* @__PURE__ */ a.createElement("span", null, e.text)))), /* @__PURE__ */ a.createElement("div", {
+  }, e.icon ?? Z), /* @__PURE__ */ a.createElement("span", null, e.href || e.onLinkClick ? /* @__PURE__ */ a.createElement(E, {
+    href: e.href ?? "#",
+    label: e.text,
+    external: e.external,
+    onClick: (f) => {
+      e.href || f.preventDefault(), e.onLinkClick?.(f);
+    }
+  }) : e.text)))), /* @__PURE__ */ a.createElement("div", {
     className: "paywall-card-actions"
   }, /* @__PURE__ */ a.createElement(u, {
     type: "ghost",
     size: "md",
-    label: R,
-    onClick: L,
+    label: S,
+    onClick: z,
     className: "paywall-card-btn-later"
   }), /* @__PURE__ */ a.createElement(u, {
     type: "primary",
     size: "md",
-    label: S,
-    onClick: A,
+    label: _,
+    onClick: P,
     className: "paywall-card-btn-purchase"
   }))), /* @__PURE__ */ a.createElement("div", {
     className: "paywall-card-media"
-  }, I))), Z = /* @__PURE__ */ a.createElement("div", {
+  }, R))), q = /* @__PURE__ */ a.createElement("div", {
     ref: m,
     role: "dialog",
     "aria-modal": "true",
-    "aria-labelledby": i,
-    className: `paywall-modal-content ${$}`,
+    "aria-labelledby": p,
+    className: `paywall-modal-content ${B}`,
     style: {
-      height: p,
-      minHeight: p
+      height: y,
+      minHeight: y
     }
-  }, Y);
+  }, j);
   return /* @__PURE__ */ a.createElement(a.Fragment, null, c && /* @__PURE__ */ a.createElement("span", {
     className: "paywall-trigger"
-  }, c), /* @__PURE__ */ a.createElement(H, {
-    isOpen: t,
+  }, c), /* @__PURE__ */ a.createElement(O, {
+    isOpen: n,
     onModalClick: () => {
     },
-    renderModalContent: () => Z,
-    width: M,
+    renderModalContent: () => q,
+    width: W,
     contentClassName: "paywall-modal-content-wrapper",
-    automationId: s
+    automationId: i
   }));
 };
 export {
-  ca as Paywall,
-  ca as default
+  ca as Paywall
 };
 //# sourceMappingURL=index64.js.map

package/dist/index64.js.map

@@ -1 +1 @@
-{"version":3,"file":"index64.js","sources":["../src/components/Paywall/index.tsx"],"sourcesContent":["import React, { FC, ReactNode, useRef } from 'react';\nimport { Button } from 'src/components/Button';\nimport { Badge } from 'src/components/Badge';\nimport { Icon } from 'src/components/Icon';\nimport { Link } from 'src/components/Link';\nimport { CustomModal } from 'src/components/CustomModal';\nimport { useFocusTrap } from 'src/utils/a11y';\nimport { useStableId } from 'src/utils/useStableId';\nimport './style.scss';\n\n/** Variant: with bullet points list, or description only */\nexport type PaywallVariant = 'with-points' | 'description-only';\n\n/** Size: small (656×384) or large (768×500) – sets modal dimensions and media panel proportion */\nexport type PaywallSize = 'sm' | 'lg';\n\n/** Feature list item: plain string (uses default/list icon) or object with text and optional per-item icon */\nexport type PaywallFeatureItem = string | { text: string; icon?: ReactNode };\n\nconst PAYWALL_SIZE_DIMENSIONS: Record<PaywallSize, { width: string; height: string }> = {\n  lg: { width: '768px', height: '500px' },\n  sm: { width: '656px', height: '384px' },\n};\n\nexport interface PaywallProps {\n  isOpen: boolean;\n  onClose: () => void;\n  trigger?: ReactNode;\n  modalWidth?: string;\n  modalHeight?: string;\n  variant: PaywallVariant;\n  size?: PaywallSize;\n  availabilityLabel?: string;\n  availabilityBadgeText: string;\n  title: string;\n  description: string;\n  learnMoreLinkText?: string;\n  learnMoreHref?: string;\n  onLearnMoreClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void;\n  featureListDesc?: string;\n  featuresList?: PaywallFeatureItem[];\n  featureItemIcon?: ReactNode;\n  mediaContent?: ReactNode;\n  laterButtonText: string;\n  purchaseButtonText: string;\n  onLaterClick?: () => void;\n  onPurchaseClick?: () => void;\n  className?: string;\n  modalContentClassName?: string;\n  automationId?: string;\n  id?: string;\n}\n\n/** Paywall – always shown in a modal. Pass isOpen/onClose and optionally a trigger. */\nexport const Paywall: FC<PaywallProps> = ({\n  isOpen,\n  onClose,\n  trigger,\n  modalWidth,\n  modalHeight,\n  variant,\n  size = 'lg',\n  availabilityLabel = 'Available on ',\n  availabilityBadgeText,\n  title,\n  description,\n  learnMoreLinkText,\n  learnMoreHref,\n  onLearnMoreClick,\n  featureListDesc,\n  featuresList = [],\n  featureItemIcon,\n  mediaContent,\n  laterButtonText,\n  purchaseButtonText,\n  onLaterClick,\n  onPurchaseClick,\n  className = '',\n  modalContentClassName = '',\n  automationId = '',\n  id: providedId,\n}) => {\n  const modalRef = useRef<HTMLDivElement>(null);\n  const titleId = useStableId(providedId, 'paywall-title');\n\n  useFocusTrap({\n    enabled: isOpen,\n    containerRef: modalRef,\n    restoreFocus: true,\n    initialFocus: '.paywall-card-btn-later',\n  });\n\n  const handleLaterClick = () => {\n    onLaterClick?.();\n    onClose();\n  };\n\n  const dimensions = PAYWALL_SIZE_DIMENSIONS[size];\n  const width = modalWidth ?? dimensions.width;\n  const height = modalHeight ?? dimensions.height;\n\n  const withPoints = variant === 'with-points' && size === 'lg';\n  const normalizedFeatures = featuresList.map((item): { text: string; icon?: ReactNode } =>\n    typeof item === 'string' ? { text: item } : { text: item.text, icon: item.icon }\n  );\n  const showFeatures = withPoints && normalizedFeatures.length > 0;\n  const defaultIcon = featureItemIcon ?? <Icon name=\"info\" />;\n\n  const content = (\n    <section\n      className={`paywall paywall-ctn paywall-ctn--${size} ${className}`}\n      data-automation-id={automationId}\n    >\n      <div className=\"paywall-card\">\n        <div className=\"paywall-card-content\">\n          <span className=\"paywall-card-availability\">\n            <span className=\"paywall-card-availability-label\">{availabilityLabel}</span>\n            <Badge\n              label={availabilityBadgeText}\n              className=\"paywall-card-badge\"\n              bgColor=\"var(--color-yellow-100)\"\n              textColor=\"var(--color-yellow-700)\"\n            />\n          </span>\n          <h3 id={titleId} className=\"paywall-card-title\">{title}</h3>\n          <p className=\"paywall-card-description\">\n            {description}\n            {learnMoreLinkText && learnMoreHref && (\n                <Link\n                  href={learnMoreHref}\n                  label={learnMoreLinkText}\n                  external\n                  className=\"paywall-card-learn-more\"\n                  onClick={onLearnMoreClick}\n                />\n            )}\n          </p>\n          {withPoints && featureListDesc && (\n            <p className=\"paywall-card-features-intro\">{featureListDesc}</p>\n          )}\n          {showFeatures && (\n            <ul className=\"paywall-card-features-list\">\n              {normalizedFeatures.map((item) => (\n                <li key={item.text} className=\"paywall-card-feature-item\">\n                  <span className=\"paywall-card-feature-icon\" aria-hidden>\n                    {item.icon ?? defaultIcon}\n                  </span>\n                  <span>{item.text}</span>\n                </li>\n              ))}\n            </ul>\n          )}\n          <div className=\"paywall-card-actions\">\n            <Button\n              type=\"ghost\"\n              size=\"md\"\n              label={laterButtonText}\n              onClick={handleLaterClick}\n              className=\"paywall-card-btn-later\"\n            />\n            <Button\n              type=\"primary\"\n              size=\"md\"\n              label={purchaseButtonText}\n              onClick={onPurchaseClick}\n              className=\"paywall-card-btn-purchase\"\n            />\n          </div>\n        </div>\n        <div className=\"paywall-card-media\">\n          {mediaContent}\n        </div>\n      </div>\n    </section>\n  );\n\n  const modalContent = (\n    <div\n      ref={modalRef}\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-labelledby={titleId}\n      className={`paywall-modal-content ${modalContentClassName}`}\n      style={{ height, minHeight: height }}\n    >\n      {content}\n    </div>\n  );\n\n  return (\n    <>\n      {trigger && <span className=\"paywall-trigger\">{trigger}</span>}\n      <CustomModal\n        isOpen={isOpen}\n        onModalClick={() => {}}\n        renderModalContent={() => modalContent}\n        width={width}\n        contentClassName=\"paywall-modal-content-wrapper\"\n        automationId={automationId}\n      />\n    </>\n  );\n};\n\nexport default Paywall;\n"],"names":["React__default","useRef","Button","Badge","Icon","Link","CustomModal","useFocusTrap","useStableId","PAYWALL_SIZE_DIMENSIONS","lg","width","height","sm","Paywall","isOpen","onClose","trigger","modalWidth","modalHeight","variant","size","availabilityLabel","availabilityBadgeText","title","description","learnMoreLinkText","learnMoreHref","onLearnMoreClick","featureListDesc","featuresList","featureItemIcon","mediaContent","laterButtonText","purchaseButtonText","onLaterClick","onPurchaseClick","className","modalContentClassName","automationId","id","providedId","modalRef","titleId","enabled","containerRef","restoreFocus","initialFocus","handleLaterClick","dimensions","withPoints","normalizedFeatures","map","item","text","icon","showFeatures","length","defaultIcon","createElement","name","content","React","label","bgColor","textColor","href","external","onClick","key","type","modalContent","ref","role","style","minHeight","Fragment","onModalClick","renderModalContent","contentClassName"],"mappings":"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"}
+{"version":3,"file":"index64.js","sources":["../src/components/Paywall/index.tsx"],"sourcesContent":["import React, { FC, ReactNode, useRef } from 'react';\nimport { Button } from 'src/components/Button';\nimport { Badge } from 'src/components/Badge';\nimport { Icon } from 'src/components/Icon';\nimport { Link } from 'src/components/Link';\nimport { CustomModal } from 'src/components/CustomModal';\nimport { useFocusTrap } from 'src/utils/a11y';\nimport { useStableId } from 'src/utils/useStableId';\nimport './style.scss';\n\n/** Variant: with bullet points list, or description only */\nexport type PaywallVariant = 'with-points' | 'description-only';\n\n/** Size: small (656×384) or large (768×500) – sets modal dimensions and media panel proportion */\nexport type PaywallSize = 'sm' | 'lg';\n\n/** Feature list item: plain string (uses default/list icon) or object with text, optional per-item icon, and optional link/action */\nexport type PaywallFeatureItem =\n  | string\n  | {\n      text: string;\n      icon?: ReactNode;\n      /** If provided, the feature text becomes a hyperlink navigating to this URL */\n      href?: string;\n      /** If true, opens the href in a new tab (only applicable when href is set) */\n      external?: boolean;\n      /** Click handler — use with href for analytics, or alone for SPA actions */\n      onLinkClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void;\n    };\n\nconst PAYWALL_SIZE_DIMENSIONS: Record<PaywallSize, { width: string; height: string }> = {\n  lg: { width: '768px', height: '500px' },\n  sm: { width: '656px', height: '384px' },\n};\n\nexport interface PaywallProps {\n  isOpen: boolean;\n  onClose: () => void;\n  trigger?: ReactNode;\n  modalWidth?: string;\n  modalHeight?: string;\n  variant: PaywallVariant;\n  size?: PaywallSize;\n  availabilityLabel?: string;\n  availabilityBadgeText: string;\n  title: string;\n  description: string;\n  learnMoreLinkText?: string;\n  learnMoreHref?: string;\n  onLearnMoreClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void;\n  featureListDesc?: string;\n  featuresList?: PaywallFeatureItem[];\n  featureItemIcon?: ReactNode;\n  mediaContent?: ReactNode;\n  laterButtonText: string;\n  purchaseButtonText: string;\n  onLaterClick?: () => void;\n  onPurchaseClick?: () => void;\n  className?: string;\n  modalContentClassName?: string;\n  automationId?: string;\n  id?: string;\n}\n\n/** Paywall – always shown in a modal. Pass isOpen/onClose and optionally a trigger. */\nexport const Paywall: FC<PaywallProps> = ({\n  isOpen,\n  onClose,\n  trigger,\n  modalWidth,\n  modalHeight,\n  variant,\n  size = 'lg',\n  availabilityLabel = 'Available on ',\n  availabilityBadgeText,\n  title,\n  description,\n  learnMoreLinkText,\n  learnMoreHref,\n  onLearnMoreClick,\n  featureListDesc,\n  featuresList = [],\n  featureItemIcon,\n  mediaContent,\n  laterButtonText,\n  purchaseButtonText,\n  onLaterClick,\n  onPurchaseClick,\n  className = '',\n  modalContentClassName = '',\n  automationId = '',\n  id: providedId,\n}) => {\n  const modalRef = useRef<HTMLDivElement>(null);\n  const titleId = useStableId(providedId, 'paywall-title');\n\n  useFocusTrap({\n    enabled: isOpen,\n    containerRef: modalRef,\n    restoreFocus: true,\n    initialFocus: '.paywall-card-btn-later',\n  });\n\n  const handleLaterClick = () => {\n    onLaterClick?.();\n    onClose();\n  };\n\n  const dimensions = PAYWALL_SIZE_DIMENSIONS[size];\n  const width = modalWidth ?? dimensions.width;\n  const height = modalHeight ?? dimensions.height;\n\n  const withPoints = variant === 'with-points' && size === 'lg';\n  const normalizedFeatures = featuresList.map((item): { text: string; icon?: ReactNode; href?: string; external?: boolean; onLinkClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void } =>\n    typeof item === 'string'\n      ? { text: item }\n      : { text: item.text, icon: item.icon, href: item.href, external: item.external, onLinkClick: item.onLinkClick }\n  );\n  const showFeatures = withPoints && normalizedFeatures.length > 0;\n  const defaultIcon = featureItemIcon ?? <Icon name=\"info\" rotation='180'/>;\n\n  const content = (\n    <section\n      className={`paywall paywall-ctn paywall-ctn--${size} ${className}`}\n      data-automation-id={automationId}\n    >\n      <div className=\"paywall-card\">\n        <div className=\"paywall-card-content\">\n          <span className=\"paywall-card-availability\">\n            <span className=\"paywall-card-availability-label\">{availabilityLabel}</span>\n            <Badge\n              label={availabilityBadgeText}\n              className=\"paywall-card-badge\"\n              bgColor=\"var(--color-yellow-100)\"\n              textColor=\"var(--color-yellow-700)\"\n            />\n          </span>\n          <h3 id={titleId} className=\"paywall-card-title\">{title}</h3>\n          <p className=\"paywall-card-description\">\n            {description}\n            {learnMoreLinkText && (learnMoreHref || onLearnMoreClick) && (\n              <Link\n                href={learnMoreHref ?? '#'}\n                label={learnMoreLinkText}\n                external={!!learnMoreHref}\n                className=\"paywall-card-learn-more\"\n                onClick={(e) => { if (!learnMoreHref) { e.preventDefault(); } onLearnMoreClick?.(e); }}\n              />\n            )}\n          </p>\n          {withPoints && featureListDesc && (\n            <p className=\"paywall-card-features-intro\">{featureListDesc}</p>\n          )}\n          {showFeatures && (\n            <ul className=\"paywall-card-features-list\">\n              {normalizedFeatures.map((item) => (\n                <li key={item.text} className=\"paywall-card-feature-item\">\n                  <span className=\"paywall-card-feature-icon\" aria-hidden>\n                    {item.icon ?? defaultIcon}\n                  </span>\n                  <span>\n                    {item.href || item.onLinkClick ? (\n                      <Link\n                        href={item.href ?? '#'}\n                        label={item.text}\n                        external={item.external}\n                        onClick={(e) => { if (!item.href) { e.preventDefault(); } item.onLinkClick?.(e); }}\n                      />\n                    ) : (\n                      item.text\n                    )}\n                  </span>\n                </li>\n              ))}\n            </ul>\n          )}\n          <div className=\"paywall-card-actions\">\n            <Button\n              type=\"ghost\"\n              size=\"md\"\n              label={laterButtonText}\n              onClick={handleLaterClick}\n              className=\"paywall-card-btn-later\"\n            />\n            <Button\n              type=\"primary\"\n              size=\"md\"\n              label={purchaseButtonText}\n              onClick={onPurchaseClick}\n              className=\"paywall-card-btn-purchase\"\n            />\n          </div>\n        </div>\n        <div className=\"paywall-card-media\">\n          {mediaContent}\n        </div>\n      </div>\n    </section>\n  );\n\n  const modalContent = (\n    <div\n      ref={modalRef}\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-labelledby={titleId}\n      className={`paywall-modal-content ${modalContentClassName}`}\n      style={{ height, minHeight: height }}\n    >\n      {content}\n    </div>\n  );\n\n  return (\n    <>\n      {trigger && <span className=\"paywall-trigger\">{trigger}</span>}\n      <CustomModal\n        isOpen={isOpen}\n        onModalClick={() => {}}\n        renderModalContent={() => modalContent}\n        width={width}\n        contentClassName=\"paywall-modal-content-wrapper\"\n        automationId={automationId}\n      />\n    </>\n  );\n};\n\nexport default Paywall;\n"],"names":["React__default","useRef","Button","Badge","Icon","Link","CustomModal","useFocusTrap","useStableId","PAYWALL_SIZE_DIMENSIONS","lg","width","height","sm","Paywall","isOpen","onClose","trigger","modalWidth","modalHeight","variant","size","availabilityLabel","availabilityBadgeText","title","description","learnMoreLinkText","learnMoreHref","onLearnMoreClick","featureListDesc","featuresList","featureItemIcon","mediaContent","laterButtonText","purchaseButtonText","onLaterClick","onPurchaseClick","className","modalContentClassName","automationId","id","providedId","modalRef","titleId","enabled","containerRef","restoreFocus","initialFocus","handleLaterClick","dimensions","withPoints","normalizedFeatures","map","item","text","icon","href","external","onLinkClick","showFeatures","length","defaultIcon","React","createElement","name","rotation","content","label","bgColor","textColor","onClick","e","preventDefault","key","type","modalContent","ref","role","style","minHeight","Fragment","onModalClick","renderModalContent","contentClassName"],"mappings":"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"}

package/dist/index66.js.map

@@ -1 +1 @@
-{"version":3,"file":"index66.js","sources":["../src/utils/a11y/useAccessiblePress.ts"],"sourcesContent":["import * as React from 'react';\nimport { isVirtualClick } from '../virtualClick';\n\n/**\n * Hook for accessible press interactions (pointer vs keyboard vs virtual click).\n *\n * Handles:\n * - Pointer intent tracking (mouse/touch)\n * - Virtual click detection (NVDA browse mode, etc.)\n * - Routing to appropriate handler (onClick vs onKeyboardActivate)\n * - For non-native elements: Enter/Space → activation\n * - Optional stopPropagation and preventDefault\n *\n * @example\n * // Native button (isNative=true, the default)\n * const { pressProps } = useAccessiblePress({ onClick, disabled });\n * <button {...pressProps}>Click me</button>\n *\n * @example\n * // Non-native element (div acting as button)\n * const { pressProps, role, tabIndex } = useAccessiblePress({ onClick, isNative: false });\n * <div role={role} tabIndex={tabIndex} {...pressProps}>Click me</div>\n *\n * @example\n * // Element nested inside clickable parent (prevent event bubbling)\n * const { pressProps, tabIndex } = useAccessiblePress({ \n *   onClick, \n *   isNative: false, \n *   stopPropagation: true \n * });\n * <div role=\"button\" tabIndex={tabIndex} {...pressProps}>Click me</div>\n */\n\ntype InputKind = 'pointer' | 'keyboard' | 'virtual';\n\nexport type UseAccessiblePressOptions = {\n  /**\n   * Whether the element is disabled\n   */\n  disabled?: boolean;\n\n  /**\n   * Whether the element is in a loading state (will also disable)\n   */\n  loading?: boolean;\n\n  /**\n   * Handler for pointer/touch activations (or all activations if onKeyboardActivate is not provided)\n   */\n  onClick?: (e: React.MouseEvent<HTMLElement>) => void;\n\n  /**\n   * Handler for keyboard + assistive tech virtual activation.\n   * If omitted, onClick is used for all activations.\n   */\n  onKeyboardActivate?: (e: React.MouseEvent<HTMLElement>) => void;\n\n  /**\n   * If true, this is a native <button> (or other native pressable) and we MUST NOT add Enter/Space handling.\n   * Default: true\n   */\n  isNative?: boolean;\n\n  /**\n   * Only for non-native elements (div/span). Defaults to 'button'.\n   */\n  role?: string;\n\n  /**\n   * Only for non-native elements. Defaults to 0.\n   */\n  tabIndex?: number;\n\n  /**\n   * If true, calls e.stopPropagation() before invoking onClick handler.\n   * Useful when element is nested inside another clickable element.\n   * Default: false\n   */\n  stopPropagation?: boolean;\n\n  /**\n   * If true, calls e.preventDefault() before invoking onClick handler.\n   * Note: For non-native elements, preventDefault is already called on Space/Enter keys.\n   * Default: false\n   */\n  preventDefault?: boolean;\n\n  /**\n   * Toggle/pressed state. When true or false, sets aria-pressed on the element (e.g. selected color swatch).\n   * Omit for non-toggle buttons.\n   */\n  pressed?: boolean;\n};\n\nexport type UseAccessiblePressReturn = {\n  /**\n   * Props to spread onto the element. Includes event handlers and ARIA attributes.\n   * Does NOT include role/tabIndex — apply those separately.\n   */\n  pressProps: React.HTMLAttributes<HTMLElement> & {\n    'aria-disabled'?: 'true';\n    'aria-busy'?: 'true';\n    'aria-pressed'?: boolean;\n  };\n\n  /**\n   * Combined disabled state (disabled || loading)\n   */\n  isDisabled: boolean;\n\n  /**\n   * Role for non-native elements (e.g., 'button', 'menuitem').\n   * Only returned when isNative=false.\n   */\n  role?: string;\n\n  /**\n   * TabIndex for non-native elements.\n   * Returns -1 when disabled, otherwise the provided tabIndex (default 0).\n   * Only returned when isNative=false.\n   */\n  tabIndex?: number;\n};\n\nexport function useAccessiblePress({\n  disabled = false,\n  loading = false,\n  onClick,\n  onKeyboardActivate,\n  isNative = true,\n  role = 'button',\n  tabIndex = 0,\n  stopPropagation = false,\n  preventDefault = false,\n  pressed\n}: UseAccessiblePressOptions = {}): UseAccessiblePressReturn {\n  const isDisabled = disabled || loading;\n  const lastWasPointerRef = React.useRef(false);\n\n  const markPointer = React.useCallback(() => {\n    lastWasPointerRef.current = true;\n  }, []);\n\n  const handleClick = React.useCallback(\n    (e: React.MouseEvent<HTMLElement>) => {\n      if (isDisabled) return;\n\n      // Handle event control flags\n      if (stopPropagation) e.stopPropagation();\n      if (preventDefault) e.preventDefault();\n\n      const virtual = isVirtualClick(e.nativeEvent as any);\n      const isPointer = lastWasPointerRef.current;\n      lastWasPointerRef.current = false;\n\n      const input: InputKind = virtual ? 'virtual' : isPointer ? 'pointer' : 'keyboard';\n\n      // If we have a keyboard handler, route keyboard + virtual clicks there.\n      if ((input === 'keyboard' || input === 'virtual') && onKeyboardActivate) {\n        onKeyboardActivate(e);\n        return;\n      }\n\n      onClick?.(e);\n    },\n    [isDisabled, onClick, onKeyboardActivate, stopPropagation, preventDefault]\n  );\n\n  // Only used for non-native elements: Enter/Space should trigger click(), reusing the same click routing.\n  const handleKeyDown = React.useCallback(\n    (e: React.KeyboardEvent<HTMLElement>) => {\n      if (isDisabled) return;\n\n      if (e.key === 'Enter' || e.key === ' ') {\n        e.preventDefault();\n        // Trigger native click event so all routing goes through handleClick\n        (e.currentTarget as HTMLElement).click();\n      }\n    },\n    [isDisabled]\n  );\n\n  const pressProps: UseAccessiblePressReturn['pressProps'] = {\n    onPointerDown: markPointer,\n    onMouseDown: markPointer,\n    onTouchStart: markPointer,\n    onClick: handleClick,\n    'aria-disabled': isDisabled ? 'true' : undefined,\n    'aria-busy': loading ? 'true' : undefined,\n    'aria-pressed': pressed\n  };\n\n  // For non-native elements, add Enter/Space handling\n  if (!isNative) {\n    pressProps.onKeyDown = handleKeyDown;\n  }\n\n  // Return role/tabIndex separately (only for non-native elements)\n  const result: UseAccessiblePressReturn = { pressProps, isDisabled };\n\n  if (!isNative) {\n    result.role = role;\n    result.tabIndex = isDisabled ? -1 : tabIndex;\n  }\n\n  return result;\n}\n\n"],"names":["React","isVirtualClick","useAccessiblePress","disabled","loading","onClick","onKeyboardActivate","isNative","role","tabIndex","stopPropagation","preventDefault","pressed","isDisabled","lastWasPointerRef","useRef","markPointer","useCallback","current","handleClick","e","virtual","nativeEvent","isPointer","input","handleKeyDown","key","currentTarget","click","pressProps","onPointerDown","onMouseDown","onTouchStart","undefined","onKeyDown","result"],"mappings":"AA4HO,YAAAA,OAAA;AAAA,SAAA,kBAAAC,SAAA;AAAA,SAASC,EAAmB;AAAA,EACjCC,UAAAA,IAAW;AAAA,EACXC,SAAAA,IAAU;AAAA,EACVC,SAAAA;AAAAA,EACAC,oBAAAA;AAAAA,EACAC,UAAAA,IAAW;AAAA,EACXC,MAAAA,IAAO;AAAA,EACPC,UAAAA,IAAW;AAAA,EACXC,iBAAAA,IAAkB;AAAA,EAClBC,gBAAAA,IAAiB;AAAA,EACjBC,SAAAA;AACyB,IAAI,IAA8B;AAC3D,QAAMC,IAAaV,KAAYC,GACzBU,IAAoBd,EAAMe,OAAO,EAAK,GAEtCC,IAAchB,EAAMiB,YAAY,MAAM;AAC1CH,IAAAA,EAAkBI,UAAU;AAAA,EAC9B,GAAG,CAAE,CAAA,GAECC,IAAcnB,EAAMiB,YACxB,CAACG,MAAqC;AACpC,QAAIP,EAAY;AAGZH,IAAAA,OAAmBA,mBACnBC,OAAkBA;AAEhBU,UAAAA,IAAUpB,EAAemB,EAAEE,WAAkB,GAC7CC,IAAYT,EAAkBI;AACpCJ,IAAAA,EAAkBI,UAAU;AAE5B,UAAMM,IAAmBH,IAAU,YAAYE,IAAY,YAAY;AAGvE,SAAKC,MAAU,cAAcA,MAAU,cAAclB,GAAoB;AACvEA,MAAAA,EAAmBc,CAAC;AACpB;AAAA,IACF;AAEAf,IAAAA,IAAUe,CAAC;AAAA,EAAA,GAEb,CAACP,GAAYR,GAASC,GAAoBI,GAAiBC,CAAc,CAC3E,GAGMc,IAAgBzB,EAAMiB,YAC1B,CAACG,MAAwC;AACvC,IAAIP,MAEAO,EAAEM,QAAQ,WAAWN,EAAEM,QAAQ,SACjCN,EAAET,eAAe,GAEhBS,EAAEO,cAA8BC;EACnC,GAEF,CAACf,CAAU,CACb,GAEMgB,IAAqD;AAAA,IACzDC,eAAed;AAAAA,IACfe,aAAaf;AAAAA,IACbgB,cAAchB;AAAAA,IACdX,SAASc;AAAAA,IACT,iBAAiBN,IAAa,SAASoB;AAAAA,IACvC,aAAa7B,IAAU,SAAS6B;AAAAA,IAChC,gBAAgBrB;AAAAA,EAAAA;AAIlB,EAAKL,MACHsB,EAAWK,YAAYT;AAIzB,QAAMU,IAAmC;AAAA,IAAEN,YAAAA;AAAAA,IAAYhB,YAAAA;AAAAA,EAAAA;AAEvD,SAAKN,MACH4B,EAAO3B,OAAOA,GACPC,EAAAA,WAAWI,IAAa,KAAKJ,IAG/B0B;AACT;"}
+{"version":3,"file":"index66.js","sources":["../src/utils/a11y/useAccessiblePress.ts"],"sourcesContent":["import * as React from 'react';\nimport { isVirtualClick } from '../virtualClick';\n\n/**\n * Hook for accessible press interactions (pointer vs keyboard vs virtual click).\n *\n * Handles:\n * - Pointer intent tracking (mouse/touch)\n * - Virtual click detection (NVDA browse mode, etc.)\n * - Routing to appropriate handler (onClick vs onKeyboardActivate)\n * - For non-native elements: Enter/Space → activation\n * - Optional stopPropagation and preventDefault\n *\n * @example\n * // Native button (isNative=true, the default)\n * const { pressProps } = useAccessiblePress({ onClick, disabled });\n * <button {...pressProps}>Click me</button>\n *\n * @example\n * // Non-native element (div acting as button)\n * const { pressProps, role, tabIndex } = useAccessiblePress({ onClick, isNative: false });\n * <div role={role} tabIndex={tabIndex} {...pressProps}>Click me</div>\n *\n * @example\n * // Element nested inside clickable parent (prevent event bubbling)\n * const { pressProps, tabIndex } = useAccessiblePress({ \n *   onClick, \n *   isNative: false, \n *   stopPropagation: true \n * });\n * <div role=\"button\" tabIndex={tabIndex} {...pressProps}>Click me</div>\n */\n\ntype InputKind = 'pointer' | 'keyboard' | 'virtual';\n\nexport type UseAccessiblePressOptions = {\n  /**\n   * Whether the element is disabled\n   */\n  disabled?: boolean;\n\n  /**\n   * Whether the element is in a loading state (will also disable)\n   */\n  loading?: boolean;\n\n  /**\n   * Handler for pointer/touch activations (or all activations if onKeyboardActivate is not provided)\n   */\n  onClick?: (e: React.MouseEvent<HTMLElement>) => void;\n\n  /**\n   * Handler for keyboard + assistive tech virtual activation.\n   * If omitted, onClick is used for all activations.\n   */\n  onKeyboardActivate?: (e: React.MouseEvent<HTMLElement>) => void;\n\n  /**\n   * If true, this is a native <button> (or other native pressable) and we MUST NOT add Enter/Space handling.\n   * Default: true\n   */\n  isNative?: boolean;\n\n  /**\n   * Only for non-native elements (div/span). Defaults to 'button'.\n   */\n  role?: string;\n\n  /**\n   * Only for non-native elements. Defaults to 0.\n   */\n  tabIndex?: number;\n\n  /**\n   * If true, calls e.stopPropagation() before invoking onClick handler.\n   * Useful when element is nested inside another clickable element.\n   * Default: false\n   */\n  stopPropagation?: boolean;\n\n  /**\n   * If true, calls e.preventDefault() before invoking onClick handler.\n   * Note: For non-native elements, preventDefault is already called on Space/Enter keys.\n   * Default: false\n   */\n  preventDefault?: boolean;\n\n  /**\n   * Toggle/pressed state. When true or false, sets aria-pressed on the element (e.g. selected color swatch).\n   * Omit for non-toggle buttons.\n   */\n  pressed?: boolean;\n};\n\nexport type UseAccessiblePressReturn = {\n  /**\n   * Props to spread onto the element. Includes event handlers and ARIA attributes.\n   * Does NOT include role/tabIndex — apply those separately.\n   */\n  pressProps: React.HTMLAttributes<HTMLElement> & {\n    'aria-disabled'?: 'true';\n    'aria-busy'?: 'true';\n    'aria-pressed'?: boolean;\n  };\n\n  /**\n   * Combined disabled state (disabled || loading)\n   */\n  isDisabled: boolean;\n\n  /**\n   * Role for non-native elements (e.g., 'button', 'menuitem').\n   * Only returned when isNative=false.\n   */\n  role?: string;\n\n  /**\n   * TabIndex for non-native elements.\n   * Returns -1 when disabled, otherwise the provided tabIndex (default 0).\n   * Only returned when isNative=false.\n   */\n  tabIndex?: number;\n};\n\nexport function useAccessiblePress({\n  disabled = false,\n  loading = false,\n  onClick,\n  onKeyboardActivate,\n  isNative = true,\n  role = 'button',\n  tabIndex = 0,\n  stopPropagation = false,\n  preventDefault = false,\n  pressed\n}: UseAccessiblePressOptions = {}): UseAccessiblePressReturn {\n  const isDisabled = disabled || loading;\n  const lastWasPointerRef = React.useRef(false);\n\n  const markPointer = React.useCallback(() => {\n    lastWasPointerRef.current = true;\n  }, []);\n\n  const handleClick = React.useCallback(\n    (e: React.MouseEvent<HTMLElement>) => {\n      if (isDisabled) return;\n\n      // Handle event control flags\n      if (stopPropagation) e.stopPropagation();\n      if (preventDefault) e.preventDefault();\n\n      const virtual = isVirtualClick(e.nativeEvent as any);\n      const isPointer = lastWasPointerRef.current;\n      lastWasPointerRef.current = false;\n\n      const input: InputKind = virtual ? 'virtual' : isPointer ? 'pointer' : 'keyboard';\n\n      // If we have a keyboard handler, route keyboard + virtual clicks there.\n      if ((input === 'keyboard' || input === 'virtual') && onKeyboardActivate) {\n        onKeyboardActivate(e);\n        return;\n      }\n\n      onClick?.(e);\n    },\n    [isDisabled, onClick, onKeyboardActivate, stopPropagation, preventDefault]\n  );\n\n  // Only used for non-native elements: Enter/Space should trigger click(), reusing the same click routing.\n  const handleKeyDown = React.useCallback(\n    (e: React.KeyboardEvent<HTMLElement>) => {\n      if (isDisabled) return;\n\n      if (e.key === 'Enter' || e.key === ' ') {\n        e.preventDefault();\n        // Trigger native click event so all routing goes through handleClick\n        (e.currentTarget as HTMLElement).click();\n      }\n    },\n    [isDisabled]\n  );\n\n  const pressProps: UseAccessiblePressReturn['pressProps'] = {\n    onPointerDown: markPointer,\n    onMouseDown: markPointer,\n    onTouchStart: markPointer,\n    onClick: handleClick,\n    'aria-disabled': isDisabled ? 'true' : undefined,\n    'aria-busy': loading ? 'true' : undefined,\n    'aria-pressed': pressed\n  };\n\n  // For non-native elements, add Enter/Space handling\n  if (!isNative) {\n    pressProps.onKeyDown = handleKeyDown;\n  }\n\n  // Return role/tabIndex separately (only for non-native elements)\n  const result: UseAccessiblePressReturn = { pressProps, isDisabled };\n\n  if (!isNative) {\n    result.role = role;\n    result.tabIndex = isDisabled ? -1 : tabIndex;\n  }\n\n  return result;\n}\n\n"],"names":["React","isVirtualClick","useAccessiblePress","disabled","loading","onClick","onKeyboardActivate","isNative","role","tabIndex","stopPropagation","preventDefault","pressed","isDisabled","lastWasPointerRef","useRef","markPointer","useCallback","current","handleClick","e","virtual","nativeEvent","isPointer","input","handleKeyDown","key","currentTarget","click","pressProps","onPointerDown","onMouseDown","onTouchStart","undefined","onKeyDown","result"],"mappings":"AA4HO,YAAAA,OAAA;AAAA,SAAA,kBAAAC,SAAA;AAAA,SAASC,EAAmB;AAAA,EACjCC,UAAAA,IAAW;AAAA,EACXC,SAAAA,IAAU;AAAA,EACVC,SAAAA;AAAAA,EACAC,oBAAAA;AAAAA,EACAC,UAAAA,IAAW;AAAA,EACXC,MAAAA,IAAO;AAAA,EACPC,UAAAA,IAAW;AAAA,EACXC,iBAAAA,IAAkB;AAAA,EAClBC,gBAAAA,IAAiB;AAAA,EACjBC,SAAAA;AACyB,IAAI,IAA8B;AAC3D,QAAMC,IAAaV,KAAYC,GACzBU,IAAoBd,EAAMe,OAAO,EAAK,GAEtCC,IAAchB,EAAMiB,YAAY,MAAM;AAC1CH,IAAAA,EAAkBI,UAAU;AAAA,EAC9B,GAAG,CAAA,CAAE,GAECC,IAAcnB,EAAMiB,YACxB,CAACG,MAAqC;AACpC,QAAIP,EAAY;AAGhB,IAAIH,OAAmBA,gBAAAA,GACnBC,OAAkBA,eAAAA;AAEtB,UAAMU,IAAUpB,EAAemB,EAAEE,WAAkB,GAC7CC,IAAYT,EAAkBI;AACpCJ,IAAAA,EAAkBI,UAAU;AAE5B,UAAMM,IAAmBH,IAAU,YAAYE,IAAY,YAAY;AAGvE,SAAKC,MAAU,cAAcA,MAAU,cAAclB,GAAoB;AACvEA,MAAAA,EAAmBc,CAAC;AACpB;AAAA,IACF;AAEAf,IAAAA,IAAUe,CAAC;AAAA,EACb,GACA,CAACP,GAAYR,GAASC,GAAoBI,GAAiBC,CAAc,CAC3E,GAGMc,IAAgBzB,EAAMiB,YAC1B,CAACG,MAAwC;AACvC,IAAIP,MAEAO,EAAEM,QAAQ,WAAWN,EAAEM,QAAQ,SACjCN,EAAET,eAAAA,GAEDS,EAAEO,cAA8BC,MAAAA;AAAAA,EAErC,GACA,CAACf,CAAU,CACb,GAEMgB,IAAqD;AAAA,IACzDC,eAAed;AAAAA,IACfe,aAAaf;AAAAA,IACbgB,cAAchB;AAAAA,IACdX,SAASc;AAAAA,IACT,iBAAiBN,IAAa,SAASoB;AAAAA,IACvC,aAAa7B,IAAU,SAAS6B;AAAAA,IAChC,gBAAgBrB;AAAAA,EAAAA;AAIlB,EAAKL,MACHsB,EAAWK,YAAYT;AAIzB,QAAMU,IAAmC;AAAA,IAAEN,YAAAA;AAAAA,IAAYhB,YAAAA;AAAAA,EAAAA;AAEvD,SAAKN,MACH4B,EAAO3B,OAAOA,GACd2B,EAAO1B,WAAWI,IAAa,KAAKJ,IAG/B0B;AACT;"}

package/dist/index67.js.map

@@ -1 +1 @@
-{"version":3,"file":"index67.js","sources":["../src/utils/a11y/useFocusManagement.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport type { DependencyList } from 'react';\n\nexport interface UseFocusManagementOptions {\n  /**\n   * CSS selector to query the primary focus target.\n   * Default: 'h1'\n   */\n  targetSelector?: string;\n  /**\n   * Fallback element id if selector target is not found.\n   * Default: 'main-content'\n   */\n  fallbackId?: string;\n}\n\n/**\n * Generic focus management hook for route/state driven UI transitions.\n * Useful for both route changes and in-page multi-step wizards.\n * \n * Always skips first render and uses animation frame for safe DOM timing.\n */\nexport function useFocusManagement(\n  dependencies: DependencyList,\n  {\n    targetSelector = '#main-content h1',\n    fallbackId = 'main-content'\n  }: UseFocusManagementOptions = {}\n): void {\n  const isFirstRender = useRef(true);\n\n  useEffect(() => {\n    // Always skip first render\n    if (isFirstRender.current) {\n      isFirstRender.current = false;\n      return;\n    }\n\n    const focusTarget = () => {\n      const el = (document.querySelector(targetSelector) || document.getElementById(fallbackId)) as HTMLElement;\n      if (el) {\n        if (!el.hasAttribute('tabindex')) el.setAttribute('tabindex', '-1');\n        el.focus();\n      }\n    };\n\n    // Always use animation frame for safe DOM timing\n    const rafId = requestAnimationFrame(focusTarget);\n    return () => cancelAnimationFrame(rafId);\n  }, dependencies);\n}\n"],"names":["useFocusManagement","dependencies","targetSelector","fallbackId","isFirstRender","useRef","useEffect","current","rafId","requestAnimationFrame","focusTarget","el","document","querySelector","getElementById","hasAttribute","setAttribute","focus","cancelAnimationFrame"],"mappings":";AAsBO,SAASA,EACdC,GACA;AAAA,EACEC,gBAAAA,IAAiB;AAAA,EACjBC,YAAAA,IAAa;AACY,IAAI,IACzB;AACAC,QAAAA,IAAgBC,EAAO,EAAI;AAEjCC,EAAAA,EAAU,MAAM;AAEd,QAAIF,EAAcG,SAAS;AACzBH,MAAAA,EAAcG,UAAU;AACxB;AAAA,IACF;AAWMC,UAAAA,IAAQC,sBATMC,MAAM;AACxB,YAAMC,IAAMC,SAASC,cAAcX,CAAc,KAAKU,SAASE,eAAeX,CAAU;AACxF,MAAIQ,MACGA,EAAGI,aAAa,UAAU,KAAMC,EAAAA,aAAa,YAAY,IAAI,GAClEL,EAAGM,MAAM;AAAA,IACX,CAI6C;AACxC,WAAA,MAAMC,qBAAqBV,CAAK;AAAA,KACtCP,CAAY;AACjB;"}
+{"version":3,"file":"index67.js","sources":["../src/utils/a11y/useFocusManagement.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport type { DependencyList } from 'react';\n\nexport interface UseFocusManagementOptions {\n  /**\n   * CSS selector to query the primary focus target.\n   * Default: 'h1'\n   */\n  targetSelector?: string;\n  /**\n   * Fallback element id if selector target is not found.\n   * Default: 'main-content'\n   */\n  fallbackId?: string;\n}\n\n/**\n * Generic focus management hook for route/state driven UI transitions.\n * Useful for both route changes and in-page multi-step wizards.\n * \n * Always skips first render and uses animation frame for safe DOM timing.\n */\nexport function useFocusManagement(\n  dependencies: DependencyList,\n  {\n    targetSelector = '#main-content h1',\n    fallbackId = 'main-content'\n  }: UseFocusManagementOptions = {}\n): void {\n  const isFirstRender = useRef(true);\n\n  useEffect(() => {\n    // Always skip first render\n    if (isFirstRender.current) {\n      isFirstRender.current = false;\n      return;\n    }\n\n    const focusTarget = () => {\n      const el = (document.querySelector(targetSelector) || document.getElementById(fallbackId)) as HTMLElement;\n      if (el) {\n        if (!el.hasAttribute('tabindex')) el.setAttribute('tabindex', '-1');\n        el.focus();\n      }\n    };\n\n    // Always use animation frame for safe DOM timing\n    const rafId = requestAnimationFrame(focusTarget);\n    return () => cancelAnimationFrame(rafId);\n  }, dependencies);\n}\n"],"names":["useFocusManagement","dependencies","targetSelector","fallbackId","isFirstRender","useRef","useEffect","current","rafId","requestAnimationFrame","focusTarget","el","document","querySelector","getElementById","hasAttribute","setAttribute","focus","cancelAnimationFrame"],"mappings":";AAsBO,SAASA,EACdC,GACA;AAAA,EACEC,gBAAAA,IAAiB;AAAA,EACjBC,YAAAA,IAAa;AACY,IAAI,IACzB;AACN,QAAMC,IAAgBC,EAAO,EAAI;AAEjCC,EAAAA,EAAU,MAAM;AAEd,QAAIF,EAAcG,SAAS;AACzBH,MAAAA,EAAcG,UAAU;AACxB;AAAA,IACF;AAWA,UAAMC,IAAQC,sBATMC,MAAM;AACxB,YAAMC,IAAMC,SAASC,cAAcX,CAAc,KAAKU,SAASE,eAAeX,CAAU;AACxF,MAAIQ,MACGA,EAAGI,aAAa,UAAU,KAAGJ,EAAGK,aAAa,YAAY,IAAI,GAClEL,EAAGM,MAAAA;AAAAA,IAEP,CAG+C;AAC/C,WAAO,MAAMC,qBAAqBV,CAAK;AAAA,EACzC,GAAGP,CAAY;AACjB;"}