@razorpay/blade 12.111.0 → 12.120.0

package/build/lib/web/production/components/Spark/RzpGlass/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../../../../../src/components/Spark/RzpGlass/utils.ts"],"sourcesContent":["/**\n * RzpGlass Utility Functions\n */\n\nimport type { RzpGlassPreset } from './presets';\nimport { getPresets } from './presets';\nimport type {\n  RzpGlassAssets,\n  RzpGlassConfig,\n  RzpGlassPresetDefinition,\n  RzpGlassProps,\n} from './types';\n\nconst DEFAULT_CDN_PATH = 'https://cdn.jsdelivr.net/npm/@razorpay/blade@latest/assets/spark';\n\nconst getDefaultAssets = (assetsPath: string): Required<RzpGlassAssets> => ({\n  videoSrc: `${assetsPath}/spark-base-video.mp4`,\n  imageSrc: `${assetsPath}/bottom-frame.jpg`,\n  gradientMapSrc: `${assetsPath}/colorama-gradient-map-green.jpg`,\n  gradientMap2Src: `${assetsPath}/colorama-gradient-map-blue.jpg`,\n  centerGradientMapSrc: `${assetsPath}/colorama-center-gradient-map.jpg`,\n});\n\n/**\n * Extract config from props (exclude non-config props).\n * Strips undefined values so they don't clobber preset defaults.\n */\nfunction extractConfig(props: RzpGlassProps): Partial<RzpGlassConfig> {\n  const {\n    width: _width,\n    height: _height,\n    className: _className,\n    style: _style,\n    onLoad: _onLoad,\n    onError: _onError,\n    preset: _preset,\n    assetsPath: _assetsPath,\n    gradientMapSrc: _gradientMapSrc,\n    gradientMap2Src: _gradientMap2Src,\n    gradientMapCanvas: _gradientMapCanvas,\n    imageSrc: _imageSrc,\n    ...config\n  } = props;\n\n  // Drop keys with undefined values so preset config isn't overridden by unset props\n  return Object.fromEntries(\n    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n    Object.entries(config).filter(([, v]) => v !== undefined),\n  ) as Partial<RzpGlassConfig>;\n}\n\nconst ASSET_KEYS = new Set<string>([\n  'videoSrc',\n  'imageSrc',\n  'gradientMapSrc',\n  'gradientMap2Src',\n  'centerGradientMapSrc',\n]);\n\n/* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return */\nfunction getPresetDefinition(\n  preset: RzpGlassPreset | undefined,\n  assetsPath: string,\n): RzpGlassPresetDefinition {\n  const presets = getPresets(assetsPath);\n  if (preset && preset in presets) return { ...presets[preset] };\n  return {};\n}\n\nfunction getPresetConfig(\n  preset: RzpGlassPreset | undefined,\n  assetsPath: string,\n): Partial<RzpGlassConfig> {\n  const def = getPresetDefinition(preset, assetsPath) as Record<string, unknown>;\n  return Object.fromEntries(\n    Object.entries(def).filter(([k]) => !ASSET_KEYS.has(k)),\n  ) as Partial<RzpGlassConfig>;\n}\n\nfunction getPresetAssets(\n  preset: RzpGlassPreset | undefined,\n  assetsPath: string,\n): Partial<RzpGlassAssets> {\n  const def = getPresetDefinition(preset, assetsPath) as Record<string, unknown>;\n  return Object.fromEntries(\n    Object.entries(def).filter(([k]) => ASSET_KEYS.has(k)),\n  ) as Partial<RzpGlassAssets>;\n}\n\n/**\n * Merge preset config with user-provided config.\n * Preset values are used as base; any explicit prop overrides them.\n */\nfunction resolveConfig(props: RzpGlassProps, assetsPath: string): Partial<RzpGlassConfig> {\n  return {\n    ...getPresetConfig(props.preset, assetsPath),\n    ...extractConfig(props),\n  };\n}\n\n/**\n * Load an image from URL\n */\nfunction loadImage(src: string): Promise<HTMLImageElement> {\n  return new Promise((resolve, reject) => {\n    const img = new Image();\n    img.crossOrigin = 'anonymous';\n    img.onload = () => resolve(img);\n    img.onerror = () => reject(new Error(`Failed to load image: ${src}`));\n    img.src = src;\n  });\n}\n\n/**\n * Load a video from URL\n */\nfunction loadVideo(src: string): Promise<HTMLVideoElement> {\n  return new Promise((resolve, reject) => {\n    const video = document.createElement('video');\n    video.src = src;\n    video.crossOrigin = 'anonymous';\n    video.loop = true;\n    video.muted = true;\n    video.playsInline = true;\n    video.preload = 'auto';\n    video.oncanplaythrough = () => resolve(video);\n    video.onerror = () => reject(new Error(`Failed to load video: ${src}`));\n    video.load();\n  });\n}\n\n/**\n * Check if browser is Safari\n */\nfunction isSafari(): boolean {\n  const ua = navigator.userAgent.toLowerCase();\n  return ua.includes('safari') && !ua.includes('chrome') && !ua.includes('android');\n}\n\n/**\n * Best guess browser zoom level (for Safari which doesn't include zoom in devicePixelRatio)\n */\nfunction bestGuessBrowserZoom(): number {\n  const viewportScale = visualViewport?.scale ?? 1;\n  const viewportWidth = visualViewport?.width ?? window.innerWidth;\n  const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;\n  const innerWidth = viewportScale * viewportWidth + scrollbarWidth;\n\n  const ratio = outerWidth / innerWidth;\n  const zoomPercentageRounded = Math.round(100 * ratio);\n\n  // Common zoom levels divisible by 5%\n  if (zoomPercentageRounded % 5 === 0) {\n    return zoomPercentageRounded / 100;\n  }\n\n  // Handle special zoom levels\n  if (zoomPercentageRounded === 33) return 1 / 3;\n  if (zoomPercentageRounded === 67) return 2 / 3;\n  if (zoomPercentageRounded === 133) return 4 / 3;\n\n  return ratio;\n}\n\n/**\n * Preload all assets for a given RazorSense preset.\n * This ensures videos and images are fully loaded before the component mounts,\n * preventing frame skipping in one-shot animations.\n *\n * @param preset - The preset name to preload assets for\n * @param assetsPath - Optional CDN path for assets (defaults to Blade CDN)\n * @returns Promise that resolves when all assets are loaded\n *\n * @example\n * ```tsx\n * // Preload before showing the animation\n * await preloadRazorSenseAssets('circleSlideUp');\n *\n * // Now mount the component - assets are already cached\n * <RazorSense preset=\"circleSlideUp\" />\n * ```\n */\nasync function preloadRazorSenseAssets(\n  preset: RzpGlassPreset = 'default',\n  assetsPath: string = DEFAULT_CDN_PATH,\n): Promise<void> {\n  const presets = getPresets(assetsPath);\n  const presetDef = presets[preset] || {};\n  const defaultAssets = getDefaultAssets(assetsPath);\n\n  const videoSrc = presetDef.videoSrc ?? defaultAssets.videoSrc;\n  const imageSrc = presetDef.imageSrc;\n  const gradientMapSrc = presetDef.gradientMapSrc ?? defaultAssets.gradientMapSrc;\n  const gradientMap2Src = presetDef.gradientMap2Src ?? defaultAssets.gradientMap2Src;\n  const centerGradientMapSrc = presetDef.centerGradientMapSrc ?? defaultAssets.centerGradientMapSrc;\n\n  const loadPromises: Promise<unknown>[] = [];\n\n  if (imageSrc) {\n    loadPromises.push(loadImage(imageSrc));\n  } else if (videoSrc) {\n    loadPromises.push(loadVideo(videoSrc));\n  }\n\n  loadPromises.push(\n    loadImage(gradientMapSrc),\n    loadImage(gradientMap2Src),\n    loadImage(centerGradientMapSrc),\n  );\n\n  await Promise.all(loadPromises);\n}\n\nexport {\n  DEFAULT_CDN_PATH,\n  getDefaultAssets,\n  loadImage,\n  loadVideo,\n  isSafari,\n  bestGuessBrowserZoom,\n  preloadRazorSenseAssets,\n  getPresetAssets,\n  resolveConfig,\n};\n"],"names":["DEFAULT_CDN_PATH","getDefaultAssets","assetsPath","videoSrc","concat","imageSrc","gradientMapSrc","gradientMap2Src","centerGradientMapSrc","extractConfig","props","_width","width","_height","height","_className","className","_style","style","_onLoad","onLoad","_onError","onError","_preset","preset","_assetsPath","_gradientMapSrc","_gradientMap2Src","_gradientMapCanvas","gradientMapCanvas","_imageSrc","config","_objectWithoutProperties","_excluded","Object","fromEntries","entries","filter","_ref","_ref2","_slicedToArray","v","undefined","ASSET_KEYS","Set","getPresetDefinition","presets","getPresets","_objectSpread","getPresetConfig","def","_ref3","_ref4","k","has","getPresetAssets","_ref5","_ref6","resolveConfig","loadImage","src","Promise","resolve","reject","img","Image","crossOrigin","onload","onerror","Error","loadVideo","video","document","createElement","loop","muted","playsInline","preload","oncanplaythrough","load","isSafari","ua","navigator","userAgent","toLowerCase","includes","bestGuessBrowserZoom","_visualViewport$scale","_visualViewport","_visualViewport$width","_visualViewport2","viewportScale","visualViewport","scale","viewportWidth","window","innerWidth","scrollbarWidth","documentElement","clientWidth","ratio","outerWidth","zoomPercentageRounded","Math","round","preloadRazorSenseAssets","_preloadRazorSenseAssets","apply","arguments","_asyncToGenerator","_regeneratorRuntime","mark","_callee","_presetDef$videoSrc","_presetDef$gradientMa","_presetDef$gradientMa2","_presetDef$centerGrad","presetDef","defaultAssets","loadPromises","_args","wrap","_context","prev","next","length","push","all","stop"],"mappings":"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"}
+{"version":3,"file":"utils.js","sources":["../../../../../../../src/components/Spark/RzpGlass/utils.ts"],"sourcesContent":["/**\n * RzpGlass Utility Functions\n */\n\nimport type { RzpGlassPreset } from './presets';\nimport { getDarkOverlay, getPresets } from './presets';\nimport type {\n  RzpGlassAssets,\n  RzpGlassConfig,\n  RzpGlassPresetDefinition,\n  RzpGlassProps,\n} from './types';\n\nconst DEFAULT_CDN_PATH = 'https://cdn.jsdelivr.net/npm/@razorpay/blade@latest/assets/spark';\n\nconst getDefaultAssets = (assetsPath: string): Required<RzpGlassAssets> => ({\n  videoSrc: `${assetsPath}/spark-base-video.mp4`,\n  imageSrc: `${assetsPath}/bottom-frame.jpg`,\n  gradientMapSrc: `${assetsPath}/colorama-gradient-map-green.jpg`,\n  gradientMap2Src: `${assetsPath}/colorama-gradient-map-blue.jpg`,\n  centerGradientMapSrc: `${assetsPath}/colorama-center-gradient-map.jpg`,\n});\n\n/**\n * Extract config from props (exclude non-config props).\n * Strips undefined values so they don't clobber preset defaults.\n */\nfunction extractConfig(props: RzpGlassProps): Partial<RzpGlassConfig> {\n  const {\n    width: _width,\n    height: _height,\n    className: _className,\n    style: _style,\n    onLoad: _onLoad,\n    onError: _onError,\n    preset: _preset,\n    assetsPath: _assetsPath,\n    gradientMapSrc: _gradientMapSrc,\n    gradientMap2Src: _gradientMap2Src,\n    gradientMapCanvas: _gradientMapCanvas,\n    imageSrc: _imageSrc,\n    ...config\n  } = props;\n\n  // Drop keys with undefined values so preset config isn't overridden by unset props\n  return Object.fromEntries(\n    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n    Object.entries(config).filter(([, v]) => v !== undefined),\n  ) as Partial<RzpGlassConfig>;\n}\n\nconst ASSET_KEYS = new Set<string>([\n  'videoSrc',\n  'imageSrc',\n  'gradientMapSrc',\n  'gradientMap2Src',\n  'centerGradientMapSrc',\n]);\n\n/* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return */\nfunction getPresetDefinition(\n  preset: RzpGlassPreset | undefined,\n  assetsPath: string,\n  isDark = false,\n): RzpGlassPresetDefinition {\n  const presets = getPresets(assetsPath);\n  const definition: RzpGlassPresetDefinition =\n    preset && preset in presets ? { ...presets[preset] } : {};\n\n  // In dark mode every preset gets its dark counterpart layered on top. The\n  // overlay reads the preset's own gamma so the ccWhitePoint guard stays correct.\n  if (!isDark) return definition;\n  return { ...definition, ...getDarkOverlay(assetsPath, definition) };\n}\n\nfunction getPresetConfig(\n  preset: RzpGlassPreset | undefined,\n  assetsPath: string,\n  isDark = false,\n): Partial<RzpGlassConfig> {\n  const def = getPresetDefinition(preset, assetsPath, isDark) as Record<string, unknown>;\n  return Object.fromEntries(\n    Object.entries(def).filter(([k]) => !ASSET_KEYS.has(k)),\n  ) as Partial<RzpGlassConfig>;\n}\n\nfunction getPresetAssets(\n  preset: RzpGlassPreset | undefined,\n  assetsPath: string,\n  isDark = false,\n): Partial<RzpGlassAssets> {\n  const def = getPresetDefinition(preset, assetsPath, isDark) as Record<string, unknown>;\n  return Object.fromEntries(\n    Object.entries(def).filter(([k]) => ASSET_KEYS.has(k)),\n  ) as Partial<RzpGlassAssets>;\n}\n\n/**\n * Merge preset config with user-provided config.\n * Preset values (plus the dark overlay when the color scheme is dark) are used as\n * base; any explicit prop overrides them.\n */\nfunction resolveConfig(\n  props: RzpGlassProps,\n  assetsPath: string,\n  isDark = false,\n): Partial<RzpGlassConfig> {\n  return {\n    ...getPresetConfig(props.preset, assetsPath, isDark),\n    ...extractConfig(props),\n  };\n}\n\n/**\n * Load an image from URL\n */\nfunction loadImage(src: string): Promise<HTMLImageElement> {\n  return new Promise((resolve, reject) => {\n    const img = new Image();\n    img.crossOrigin = 'anonymous';\n    img.onload = () => resolve(img);\n    img.onerror = () => reject(new Error(`Failed to load image: ${src}`));\n    img.src = src;\n  });\n}\n\n/**\n * Load a video from URL\n */\nfunction loadVideo(src: string): Promise<HTMLVideoElement> {\n  return new Promise((resolve, reject) => {\n    const video = document.createElement('video');\n    video.src = src;\n    video.crossOrigin = 'anonymous';\n    video.loop = true;\n    video.muted = true;\n    video.playsInline = true;\n    video.preload = 'auto';\n    video.oncanplaythrough = () => resolve(video);\n    video.onerror = () => reject(new Error(`Failed to load video: ${src}`));\n    video.load();\n  });\n}\n\n/**\n * Check if browser is Safari\n */\nfunction isSafari(): boolean {\n  const ua = navigator.userAgent.toLowerCase();\n  return ua.includes('safari') && !ua.includes('chrome') && !ua.includes('android');\n}\n\n/**\n * Best guess browser zoom level (for Safari which doesn't include zoom in devicePixelRatio)\n */\nfunction bestGuessBrowserZoom(): number {\n  const viewportScale = visualViewport?.scale ?? 1;\n  const viewportWidth = visualViewport?.width ?? window.innerWidth;\n  const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;\n  const innerWidth = viewportScale * viewportWidth + scrollbarWidth;\n\n  const ratio = outerWidth / innerWidth;\n  const zoomPercentageRounded = Math.round(100 * ratio);\n\n  // Common zoom levels divisible by 5%\n  if (zoomPercentageRounded % 5 === 0) {\n    return zoomPercentageRounded / 100;\n  }\n\n  // Handle special zoom levels\n  if (zoomPercentageRounded === 33) return 1 / 3;\n  if (zoomPercentageRounded === 67) return 2 / 3;\n  if (zoomPercentageRounded === 133) return 4 / 3;\n\n  return ratio;\n}\n\n/**\n * Preload all assets for a given RazorSense preset.\n * This ensures videos and images are fully loaded before the component mounts,\n * preventing frame skipping in one-shot animations.\n *\n * @param preset - The preset name to preload assets for\n * @param assetsPath - Optional CDN path for assets (defaults to Blade CDN)\n * @param colorScheme - Color scheme to preload for. Pass `'dark'` to preload the\n * dark gradient maps. Since this runs outside React it cannot read Blade's color\n * scheme itself, so pass the value from `useTheme()` when preloading in dark mode.\n * @returns Promise that resolves when all assets are loaded\n *\n * @example\n * ```tsx\n * // Preload before showing the animation\n * await preloadRazorSenseAssets('circleSlideUp');\n *\n * // Now mount the component - assets are already cached\n * <RazorSense preset=\"circleSlideUp\" />\n *\n * // In dark mode, preload the dark asset set\n * const { colorScheme } = useTheme();\n * await preloadRazorSenseAssets('circleSlideUp', undefined, colorScheme);\n * ```\n */\nasync function preloadRazorSenseAssets(\n  preset: RzpGlassPreset = 'default',\n  assetsPath: string = DEFAULT_CDN_PATH,\n  colorScheme: 'light' | 'dark' = 'light',\n): Promise<void> {\n  const presetDef = getPresetDefinition(preset, assetsPath, colorScheme === 'dark');\n  const defaultAssets = getDefaultAssets(assetsPath);\n\n  const videoSrc = presetDef.videoSrc ?? defaultAssets.videoSrc;\n  const imageSrc = presetDef.imageSrc;\n  const gradientMapSrc = presetDef.gradientMapSrc ?? defaultAssets.gradientMapSrc;\n  const gradientMap2Src = presetDef.gradientMap2Src ?? defaultAssets.gradientMap2Src;\n  const centerGradientMapSrc = presetDef.centerGradientMapSrc ?? defaultAssets.centerGradientMapSrc;\n\n  const loadPromises: Promise<unknown>[] = [];\n\n  if (imageSrc) {\n    loadPromises.push(loadImage(imageSrc));\n  } else if (videoSrc) {\n    loadPromises.push(loadVideo(videoSrc));\n  }\n\n  loadPromises.push(\n    loadImage(gradientMapSrc),\n    loadImage(gradientMap2Src),\n    loadImage(centerGradientMapSrc),\n  );\n\n  await Promise.all(loadPromises);\n}\n\nexport {\n  DEFAULT_CDN_PATH,\n  getDefaultAssets,\n  loadImage,\n  loadVideo,\n  isSafari,\n  bestGuessBrowserZoom,\n  preloadRazorSenseAssets,\n  getPresetAssets,\n  resolveConfig,\n};\n"],"names":["DEFAULT_CDN_PATH","getDefaultAssets","assetsPath","videoSrc","concat","imageSrc","gradientMapSrc","gradientMap2Src","centerGradientMapSrc","extractConfig","props","_width","width","_height","height","_className","className","_style","style","_onLoad","onLoad","_onError","onError","_preset","preset","_assetsPath","_gradientMapSrc","_gradientMap2Src","_gradientMapCanvas","gradientMapCanvas","_imageSrc","config","_objectWithoutProperties","_excluded","Object","fromEntries","entries","filter","_ref","_ref2","_slicedToArray","v","undefined","ASSET_KEYS","Set","getPresetDefinition","isDark","arguments","length","presets","getPresets","definition","_objectSpread","getDarkOverlay","getPresetConfig","def","_ref3","_ref4","k","has","getPresetAssets","_ref5","_ref6","resolveConfig","loadImage","src","Promise","resolve","reject","img","Image","crossOrigin","onload","onerror","Error","loadVideo","video","document","createElement","loop","muted","playsInline","preload","oncanplaythrough","load","isSafari","ua","navigator","userAgent","toLowerCase","includes","bestGuessBrowserZoom","_visualViewport$scale","_visualViewport","_visualViewport$width","_visualViewport2","viewportScale","visualViewport","scale","viewportWidth","window","innerWidth","scrollbarWidth","documentElement","clientWidth","ratio","outerWidth","zoomPercentageRounded","Math","round","preloadRazorSenseAssets","_preloadRazorSenseAssets","apply","_asyncToGenerator","_regeneratorRuntime","mark","_callee","_presetDef$videoSrc","_presetDef$gradientMa","_presetDef$gradientMa2","_presetDef$centerGrad","colorScheme","presetDef","defaultAssets","loadPromises","_args","wrap","_context","prev","next","push","all","stop"],"mappings":"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"}

package/build/lib/web/production/components/SpotlightPopoverTour/Tour.web.js

@@ -3,13 +3,15 @@ import { useState, useMemo, useCallback } from 'react';
 import { FloatingPortal } from '@floating-ui/react';
 import { TourContext } from './TourContext.js';
 import { TourPopover } from './TourPopover.web.js';
-import { useDelayedState, useIsTransitioningBetweenSteps, useIntersectionObserver, smoothScroll, useLockBodyScroll } from './utils.js';
+import { useDelayedState, useIsTransitioningBetweenSteps, useIntersectionObserver, resolveSpotlightTarget, readBorderRadius, smoothScroll, useLockBodyScroll } from './utils.js';
 import { SpotlightPopoverTourMask } from './TourMask.web.js';
 import { transitionDelay } from './tourTokens.js';
 import '../BladeProvider/index.js';
+import '../../utils/index.js';
 import { useIsomorphicLayoutEffect } from '../../utils/useIsomorphicLayoutEffect.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import useTheme from '../BladeProvider/useTheme.js';
+import { isBrowser } from '../../utils/platform/isBrowser.js';
 
 var asHTMLElement = function asHTMLElement(el) {
   return el;
@@ -54,8 +56,10 @@ var SpotlightPopoverTour = function SpotlightPopoverTour(_ref) {
     isScrolling = _useState6[0],
     setIsScrolling = _useState6[1];
   var currentStepRef = refIdMap.get((_steps$activeStep = steps[activeStep]) === null || _steps$activeStep === void 0 ? void 0 : _steps$activeStep.name);
+  // Anchors taller than the viewport can never reach 50% visibility, so we also observe the
+  // 0% crossing as a fallback threshold for those cases (see scrollToStep below).
   var intersection = useIntersectionObserver(currentStepRef, {
-    threshold: 0.5
+    threshold: [0, 0.5]
   });
   // main step logic
   var totalSteps = steps.length;
@@ -102,34 +106,42 @@ var SpotlightPopoverTour = function SpotlightPopoverTour(_ref) {
     var ref = refIdMap.get((_steps$activeStep2 = steps[activeStep]) === null || _steps$activeStep2 === void 0 ? void 0 : _steps$activeStep2.name);
     var el = asHTMLElement((_ref$current = ref === null || ref === void 0 ? void 0 : ref.current) !== null && _ref$current !== void 0 ? _ref$current : null);
     if (!el) return;
-    var rect = el.getBoundingClientRect();
-    setSize({
+
+    // Trace the component the merchant sees, not the layout wrapper around it, so the
+    // spotlight's padding stays even on all four sides.
+    var target = resolveSpotlightTarget(el);
+    var rect = target.getBoundingClientRect();
+    var nextSize = {
       x: rect.x,
       y: rect.y,
       width: rect.width,
-      height: rect.height
-    });
+      height: rect.height,
+      borderRadius: readBorderRadius(target)
+    };
+    setSize(nextSize);
     if (shouldSkipDelay) {
-      setDelayedSize({
-        x: rect.x,
-        y: rect.y,
-        width: rect.width,
-        height: rect.height
-      });
+      setDelayedSize(nextSize);
     }
   }, [activeStep, refIdMap, setDelayedSize, steps]);
   var scrollToStep = useCallback(function () {
-    var _steps$delayedActiveS, _ref$current2;
+    var _steps$delayedActiveS, _ref$current2, _intersection$interse;
+    if (!isBrowser()) return;
     var ref = refIdMap.get((_steps$delayedActiveS = steps[delayedActiveStep]) === null || _steps$delayedActiveS === void 0 ? void 0 : _steps$delayedActiveS.name);
     var el = asHTMLElement((_ref$current2 = ref === null || ref === void 0 ? void 0 : ref.current) !== null && _ref$current2 !== void 0 ? _ref$current2 : null);
     if (!el) return;
+    var viewportHeight = window.innerHeight || document.documentElement.clientHeight;
+    var isAnchorTallerThanViewport = el.getBoundingClientRect().height > viewportHeight;
 
-    // If the element is already in view, don't scroll
-    if (intersection !== null && intersection !== void 0 && intersection.isIntersecting) return;
+    // An anchor taller than the viewport can never satisfy the 0.5 threshold, so require only
+    // partial visibility (ratio > 0) for it instead of waiting on an unreachable isIntersecting.
+    var isVisibleEnough = isAnchorTallerThanViewport ? ((_intersection$interse = intersection === null || intersection === void 0 ? void 0 : intersection.intersectionRatio) !== null && _intersection$interse !== void 0 ? _intersection$interse : 0) > 0 : Boolean(intersection === null || intersection === void 0 ? void 0 : intersection.isIntersecting);
+    if (isVisibleEnough) return;
     setIsScrolling(true);
     smoothScroll(el, {
       behavior: 'smooth',
-      block: 'center',
+      // Centering an anchor taller than the viewport pushes its edges (and the popover
+      // attached near them) outside the viewport, so align to the top instead.
+      block: isAnchorTallerThanViewport ? 'start' : 'center',
       inline: 'center'
     }).then(function () {
       // wait for the scroll to finish before updating the mask size
@@ -138,7 +150,7 @@ var SpotlightPopoverTour = function SpotlightPopoverTour(_ref) {
     })["finally"](function () {
       setIsScrolling(false);
     });
-  }, [delayedActiveStep, refIdMap, steps, updateMaskSize, intersection === null || intersection === void 0 ? void 0 : intersection.isIntersecting]);
+  }, [delayedActiveStep, refIdMap, steps, updateMaskSize, intersection]);
 
   // Update the size of the mask when the active step changes
   useIsomorphicLayoutEffect(function () {
@@ -171,7 +183,8 @@ var SpotlightPopoverTour = function SpotlightPopoverTour(_ref) {
         x: 0,
         y: 0,
         width: 0,
-        height: 0
+        height: 0,
+        borderRadius: 0
       });
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps

package/build/lib/web/production/components/SpotlightPopoverTour/Tour.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tour.web.js","sources":["../../../../../../src/components/SpotlightPopoverTour/Tour.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-use-before-define */\n/* eslint-disable consistent-return */\n/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport React, { useState, useCallback, useMemo } from 'react';\nimport { FloatingPortal } from '@floating-ui/react';\nimport { TourContext } from './TourContext';\nimport type { TourElement } from './TourContext';\nimport { TourPopover } from './TourPopover';\nimport {\n  smoothScroll,\n  useDelayedState,\n  useIntersectionObserver,\n  useIsTransitioningBetweenSteps,\n  useLockBodyScroll,\n} from './utils';\nimport type { SpotlightPopoverTourMaskRect, SpotlightPopoverTourProps } from './types';\nimport { SpotlightPopoverTourMask } from './TourMask';\nimport { transitionDelay } from './tourTokens';\nimport { useTheme } from '~components/BladeProvider';\nimport { useIsomorphicLayoutEffect } from '~utils/useIsomorphicLayoutEffect';\n\nconst asHTMLElement = (el: TourElement | null): HTMLElement | null => el as HTMLElement | null;\n\nconst SpotlightPopoverTour = ({\n  steps,\n  activeStep,\n  isOpen,\n  onFinish,\n  onOpenChange,\n  onStepChange,\n  children,\n}: SpotlightPopoverTourProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const [refIdMap, setRefIdMap] = useState(new Map<string, React.RefObject<TourElement>>());\n  const [size, setSize] = useState<SpotlightPopoverTourMaskRect>({\n    x: 0,\n    y: 0,\n    height: 0,\n    width: 0,\n  });\n\n  // delayed state is used to let the transition finish before reacting to the state changes\n  const [delayedActiveStep] = useDelayedState(activeStep, transitionDelay);\n  const [delayedSize, setDelayedSize] = useDelayedState(size, transitionDelay);\n  // keep track of when we are transitioning between steps\n  const isTransitioning = useIsTransitioningBetweenSteps(activeStep, transitionDelay);\n  const [isScrolling, setIsScrolling] = useState(false);\n\n  const currentStepRef = refIdMap.get(steps[activeStep]?.name);\n  const intersection = useIntersectionObserver(\n    (currentStepRef as React.RefObject<Element> | undefined)!,\n    {\n      threshold: 0.5,\n    },\n  );\n  // main step logic\n  const totalSteps = steps.length;\n  const currentStepData = useMemo(() => {\n    return steps[activeStep];\n  }, [activeStep, steps]);\n\n  const goToStep = useCallback(\n    (step: number) => {\n      if (step < 0 || step >= steps.length) return;\n      onStepChange?.(step);\n    },\n    [onStepChange, steps.length],\n  );\n\n  const goToNext = useCallback(() => {\n    let nextState = activeStep + 1;\n    if (nextState >= steps.length) {\n      nextState = steps.length - 1;\n    }\n    onStepChange?.(nextState);\n  }, [activeStep, onStepChange, steps.length]);\n\n  const goToPrevious = useCallback(() => {\n    let nextState = activeStep - 1;\n    if (nextState < 0) {\n      nextState = 0;\n    }\n    onStepChange?.(nextState);\n  }, [activeStep, onStepChange]);\n\n  const stopTour = useCallback(() => {\n    onFinish?.();\n  }, [onFinish]);\n\n  const attachStep = useCallback((id: string, ref: React.RefObject<TourElement>) => {\n    if (!ref) return;\n    setRefIdMap((prev) => {\n      return new Map(prev).set(id, ref);\n    });\n  }, []);\n\n  const removeStep = useCallback((id: string) => {\n    setRefIdMap((prev) => {\n      const newMap = new Map(prev);\n      newMap.delete(id);\n      return newMap;\n    });\n  }, []);\n\n  const updateMaskSize = useCallback(\n    (shouldSkipDelay = false) => {\n      const ref = refIdMap.get(steps[activeStep]?.name);\n      const el = asHTMLElement(ref?.current ?? null);\n      if (!el) return;\n\n      const rect = el.getBoundingClientRect();\n      setSize({\n        x: rect.x,\n        y: rect.y,\n        width: rect.width,\n        height: rect.height,\n      });\n      if (shouldSkipDelay) {\n        setDelayedSize({\n          x: rect.x,\n          y: rect.y,\n          width: rect.width,\n          height: rect.height,\n        });\n      }\n    },\n    [activeStep, refIdMap, setDelayedSize, steps],\n  );\n\n  const scrollToStep = useCallback(() => {\n    const ref = refIdMap.get(steps[delayedActiveStep]?.name);\n    const el = asHTMLElement(ref?.current ?? null);\n    if (!el) return;\n\n    // If the element is already in view, don't scroll\n    if (intersection?.isIntersecting) return;\n\n    setIsScrolling(true);\n    smoothScroll(el, {\n      behavior: 'smooth',\n      block: 'center',\n      inline: 'center',\n    })\n      .then(() => {\n        // wait for the scroll to finish before updating the mask size\n        // We also don't want to delay the size update since its already delayed by the scroll\n        updateMaskSize(true);\n      })\n      .finally(() => {\n        setIsScrolling(false);\n      });\n  }, [delayedActiveStep, refIdMap, steps, updateMaskSize, intersection?.isIntersecting]);\n\n  // Update the size of the mask when the active step changes\n  useIsomorphicLayoutEffect(() => {\n    updateMaskSize();\n  }, [activeStep, updateMaskSize]);\n\n  // Scroll into view when the active step changes\n  useIsomorphicLayoutEffect(() => {\n    // We need to wait for the transition to finish before scrolling\n    // Otherwise the browser sometimes interrupts the scroll\n    const scrollDelay = 100;\n    setTimeout(() => {\n      if (!isOpen) return;\n      if (isTransitioning) return;\n      scrollToStep();\n    }, scrollDelay);\n  }, [isOpen, scrollToStep, isTransitioning]);\n\n  // reset the mask size when the tour is closed\n  useIsomorphicLayoutEffect(() => {\n    if (isOpen) {\n      // on initial mount, we don't want to delay the size update\n      updateMaskSize(true);\n      onOpenChange?.({ isOpen });\n    }\n    if (!isOpen) {\n      setSize({\n        x: 0,\n        y: 0,\n        width: 0,\n        height: 0,\n      });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isOpen]);\n\n  useLockBodyScroll(isOpen);\n\n  const contextValue = useMemo(() => {\n    return { attachStep, removeStep };\n  }, [attachStep, removeStep]);\n\n  return (\n    <TourContext.Provider value={contextValue}>\n      <FloatingPortal>\n        {isOpen ? (\n          <SpotlightPopoverTourMask\n            isTransitioning={isTransitioning || isScrolling}\n            padding={theme.spacing[4]}\n            size={delayedSize}\n          />\n        ) : null}\n      </FloatingPortal>\n\n      {steps.map((step) => {\n        const isStepActive = currentStepData.name === step.name;\n        const attachTo = isStepActive ? currentStepRef : undefined;\n        // 1. only show popover if the tour is opened\n        // 2. only show the popover if the step is active\n        // 3. do not show the popover if we are transitioning between steps\n        //    this ensures popover suddenly doesn't jump to the next step,\n        //    instead it waits for the transition to finish\n        const isPopoverVisible = isOpen && isStepActive && !isTransitioning;\n\n        return (\n          <TourPopover\n            key={step.name}\n            isTransitioning={delayedActiveStep !== activeStep}\n            placement={step.placement}\n            isOpen={isPopoverVisible}\n            onOpenChange={onOpenChange}\n            title={step.title}\n            titleLeading={step.titleLeading}\n            content={step?.content?.({\n              activeStep: delayedActiveStep,\n              goToPrevious,\n              goToNext,\n              goToStep,\n              totalSteps,\n              stopTour,\n            })}\n            footer={step?.footer?.({\n              activeStep: delayedActiveStep,\n              goToPrevious,\n              goToNext,\n              goToStep,\n              totalSteps,\n              stopTour,\n            })}\n            attachTo={attachTo as React.RefObject<HTMLElement> | undefined}\n          />\n        );\n      })}\n\n      {children}\n    </TourContext.Provider>\n  );\n};\n\nexport { SpotlightPopoverTour };\n"],"names":["asHTMLElement","el","SpotlightPopoverTour","_ref","_steps$activeStep","steps","activeStep","isOpen","onFinish","onOpenChange","onStepChange","children","_useTheme","useTheme","theme","_useState","useState","Map","_useState2","_slicedToArray","refIdMap","setRefIdMap","_useState3","x","y","height","width","_useState4","size","setSize","_useDelayedState","useDelayedState","transitionDelay","_useDelayedState2","delayedActiveStep","_useDelayedState3","_useDelayedState4","delayedSize","setDelayedSize","isTransitioning","useIsTransitioningBetweenSteps","_useState5","_useState6","isScrolling","setIsScrolling","currentStepRef","get","name","intersection","useIntersectionObserver","threshold","totalSteps","length","currentStepData","useMemo","goToStep","useCallback","step","goToNext","nextState","goToPrevious","stopTour","attachStep","id","ref","prev","set","removeStep","newMap","updateMaskSize","_steps$activeStep2","_ref$current","shouldSkipDelay","arguments","undefined","current","rect","getBoundingClientRect","scrollToStep","_steps$delayedActiveS","_ref$current2","isIntersecting","smoothScroll","behavior","block","inline","then","useIsomorphicLayoutEffect","scrollDelay","setTimeout","useLockBodyScroll","contextValue","_jsxs","TourContext","Provider","value","_jsx","FloatingPortal","SpotlightPopoverTourMask","padding","spacing","map","_step$content","_step$footer","isStepActive","attachTo","isPopoverVisible","TourPopover","placement","title","titleLeading","content","call","footer"],"mappings":"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"}
+{"version":3,"file":"Tour.web.js","sources":["../../../../../../src/components/SpotlightPopoverTour/Tour.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-use-before-define */\n/* eslint-disable consistent-return */\n/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport React, { useState, useCallback, useMemo } from 'react';\nimport { FloatingPortal } from '@floating-ui/react';\nimport { TourContext } from './TourContext';\nimport type { TourElement } from './TourContext';\nimport { TourPopover } from './TourPopover';\nimport {\n  readBorderRadius,\n  resolveSpotlightTarget,\n  smoothScroll,\n  useDelayedState,\n  useIntersectionObserver,\n  useIsTransitioningBetweenSteps,\n  useLockBodyScroll,\n} from './utils';\nimport type { SpotlightPopoverTourMaskRect, SpotlightPopoverTourProps } from './types';\nimport { SpotlightPopoverTourMask } from './TourMask';\nimport { transitionDelay } from './tourTokens';\nimport { useTheme } from '~components/BladeProvider';\nimport { isBrowser } from '~utils';\nimport { useIsomorphicLayoutEffect } from '~utils/useIsomorphicLayoutEffect';\n\nconst asHTMLElement = (el: TourElement | null): HTMLElement | null => el as HTMLElement | null;\n\nconst SpotlightPopoverTour = ({\n  steps,\n  activeStep,\n  isOpen,\n  onFinish,\n  onOpenChange,\n  onStepChange,\n  children,\n}: SpotlightPopoverTourProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const [refIdMap, setRefIdMap] = useState(new Map<string, React.RefObject<TourElement>>());\n  const [size, setSize] = useState<SpotlightPopoverTourMaskRect>({\n    x: 0,\n    y: 0,\n    height: 0,\n    width: 0,\n  });\n\n  // delayed state is used to let the transition finish before reacting to the state changes\n  const [delayedActiveStep] = useDelayedState(activeStep, transitionDelay);\n  const [delayedSize, setDelayedSize] = useDelayedState(size, transitionDelay);\n  // keep track of when we are transitioning between steps\n  const isTransitioning = useIsTransitioningBetweenSteps(activeStep, transitionDelay);\n  const [isScrolling, setIsScrolling] = useState(false);\n\n  const currentStepRef = refIdMap.get(steps[activeStep]?.name);\n  // Anchors taller than the viewport can never reach 50% visibility, so we also observe the\n  // 0% crossing as a fallback threshold for those cases (see scrollToStep below).\n  const intersection = useIntersectionObserver(\n    (currentStepRef as React.RefObject<Element> | undefined)!,\n    {\n      threshold: [0, 0.5],\n    },\n  );\n  // main step logic\n  const totalSteps = steps.length;\n  const currentStepData = useMemo(() => {\n    return steps[activeStep];\n  }, [activeStep, steps]);\n\n  const goToStep = useCallback(\n    (step: number) => {\n      if (step < 0 || step >= steps.length) return;\n      onStepChange?.(step);\n    },\n    [onStepChange, steps.length],\n  );\n\n  const goToNext = useCallback(() => {\n    let nextState = activeStep + 1;\n    if (nextState >= steps.length) {\n      nextState = steps.length - 1;\n    }\n    onStepChange?.(nextState);\n  }, [activeStep, onStepChange, steps.length]);\n\n  const goToPrevious = useCallback(() => {\n    let nextState = activeStep - 1;\n    if (nextState < 0) {\n      nextState = 0;\n    }\n    onStepChange?.(nextState);\n  }, [activeStep, onStepChange]);\n\n  const stopTour = useCallback(() => {\n    onFinish?.();\n  }, [onFinish]);\n\n  const attachStep = useCallback((id: string, ref: React.RefObject<TourElement>) => {\n    if (!ref) return;\n    setRefIdMap((prev) => {\n      return new Map(prev).set(id, ref);\n    });\n  }, []);\n\n  const removeStep = useCallback((id: string) => {\n    setRefIdMap((prev) => {\n      const newMap = new Map(prev);\n      newMap.delete(id);\n      return newMap;\n    });\n  }, []);\n\n  const updateMaskSize = useCallback(\n    (shouldSkipDelay = false) => {\n      const ref = refIdMap.get(steps[activeStep]?.name);\n      const el = asHTMLElement(ref?.current ?? null);\n      if (!el) return;\n\n      // Trace the component the merchant sees, not the layout wrapper around it, so the\n      // spotlight's padding stays even on all four sides.\n      const target = resolveSpotlightTarget(el);\n      const rect = target.getBoundingClientRect();\n      const nextSize = {\n        x: rect.x,\n        y: rect.y,\n        width: rect.width,\n        height: rect.height,\n        borderRadius: readBorderRadius(target),\n      };\n\n      setSize(nextSize);\n      if (shouldSkipDelay) {\n        setDelayedSize(nextSize);\n      }\n    },\n    [activeStep, refIdMap, setDelayedSize, steps],\n  );\n\n  const scrollToStep = useCallback(() => {\n    if (!isBrowser()) return;\n\n    const ref = refIdMap.get(steps[delayedActiveStep]?.name);\n    const el = asHTMLElement(ref?.current ?? null);\n    if (!el) return;\n\n    const viewportHeight = window.innerHeight || document.documentElement.clientHeight;\n    const isAnchorTallerThanViewport = el.getBoundingClientRect().height > viewportHeight;\n\n    // An anchor taller than the viewport can never satisfy the 0.5 threshold, so require only\n    // partial visibility (ratio > 0) for it instead of waiting on an unreachable isIntersecting.\n    const isVisibleEnough = isAnchorTallerThanViewport\n      ? (intersection?.intersectionRatio ?? 0) > 0\n      : Boolean(intersection?.isIntersecting);\n    if (isVisibleEnough) return;\n\n    setIsScrolling(true);\n    smoothScroll(el, {\n      behavior: 'smooth',\n      // Centering an anchor taller than the viewport pushes its edges (and the popover\n      // attached near them) outside the viewport, so align to the top instead.\n      block: isAnchorTallerThanViewport ? 'start' : 'center',\n      inline: 'center',\n    })\n      .then(() => {\n        // wait for the scroll to finish before updating the mask size\n        // We also don't want to delay the size update since its already delayed by the scroll\n        updateMaskSize(true);\n      })\n      .finally(() => {\n        setIsScrolling(false);\n      });\n  }, [delayedActiveStep, refIdMap, steps, updateMaskSize, intersection]);\n\n  // Update the size of the mask when the active step changes\n  useIsomorphicLayoutEffect(() => {\n    updateMaskSize();\n  }, [activeStep, updateMaskSize]);\n\n  // Scroll into view when the active step changes\n  useIsomorphicLayoutEffect(() => {\n    // We need to wait for the transition to finish before scrolling\n    // Otherwise the browser sometimes interrupts the scroll\n    const scrollDelay = 100;\n    setTimeout(() => {\n      if (!isOpen) return;\n      if (isTransitioning) return;\n      scrollToStep();\n    }, scrollDelay);\n  }, [isOpen, scrollToStep, isTransitioning]);\n\n  // reset the mask size when the tour is closed\n  useIsomorphicLayoutEffect(() => {\n    if (isOpen) {\n      // on initial mount, we don't want to delay the size update\n      updateMaskSize(true);\n      onOpenChange?.({ isOpen });\n    }\n    if (!isOpen) {\n      setSize({\n        x: 0,\n        y: 0,\n        width: 0,\n        height: 0,\n        borderRadius: 0,\n      });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isOpen]);\n\n  useLockBodyScroll(isOpen);\n\n  const contextValue = useMemo(() => {\n    return { attachStep, removeStep };\n  }, [attachStep, removeStep]);\n\n  return (\n    <TourContext.Provider value={contextValue}>\n      <FloatingPortal>\n        {isOpen ? (\n          <SpotlightPopoverTourMask\n            isTransitioning={isTransitioning || isScrolling}\n            padding={theme.spacing[4]}\n            size={delayedSize}\n          />\n        ) : null}\n      </FloatingPortal>\n\n      {steps.map((step) => {\n        const isStepActive = currentStepData.name === step.name;\n        const attachTo = isStepActive ? currentStepRef : undefined;\n        // 1. only show popover if the tour is opened\n        // 2. only show the popover if the step is active\n        // 3. do not show the popover if we are transitioning between steps\n        //    this ensures popover suddenly doesn't jump to the next step,\n        //    instead it waits for the transition to finish\n        const isPopoverVisible = isOpen && isStepActive && !isTransitioning;\n\n        return (\n          <TourPopover\n            key={step.name}\n            isTransitioning={delayedActiveStep !== activeStep}\n            placement={step.placement}\n            isOpen={isPopoverVisible}\n            onOpenChange={onOpenChange}\n            title={step.title}\n            titleLeading={step.titleLeading}\n            content={step?.content?.({\n              activeStep: delayedActiveStep,\n              goToPrevious,\n              goToNext,\n              goToStep,\n              totalSteps,\n              stopTour,\n            })}\n            footer={step?.footer?.({\n              activeStep: delayedActiveStep,\n              goToPrevious,\n              goToNext,\n              goToStep,\n              totalSteps,\n              stopTour,\n            })}\n            attachTo={attachTo as React.RefObject<HTMLElement> | undefined}\n          />\n        );\n      })}\n\n      {children}\n    </TourContext.Provider>\n  );\n};\n\nexport { SpotlightPopoverTour };\n"],"names":["asHTMLElement","el","SpotlightPopoverTour","_ref","_steps$activeStep","steps","activeStep","isOpen","onFinish","onOpenChange","onStepChange","children","_useTheme","useTheme","theme","_useState","useState","Map","_useState2","_slicedToArray","refIdMap","setRefIdMap","_useState3","x","y","height","width","_useState4","size","setSize","_useDelayedState","useDelayedState","transitionDelay","_useDelayedState2","delayedActiveStep","_useDelayedState3","_useDelayedState4","delayedSize","setDelayedSize","isTransitioning","useIsTransitioningBetweenSteps","_useState5","_useState6","isScrolling","setIsScrolling","currentStepRef","get","name","intersection","useIntersectionObserver","threshold","totalSteps","length","currentStepData","useMemo","goToStep","useCallback","step","goToNext","nextState","goToPrevious","stopTour","attachStep","id","ref","prev","set","removeStep","newMap","updateMaskSize","_steps$activeStep2","_ref$current","shouldSkipDelay","arguments","undefined","current","target","resolveSpotlightTarget","rect","getBoundingClientRect","nextSize","borderRadius","readBorderRadius","scrollToStep","_steps$delayedActiveS","_ref$current2","_intersection$interse","isBrowser","viewportHeight","window","innerHeight","document","documentElement","clientHeight","isAnchorTallerThanViewport","isVisibleEnough","intersectionRatio","Boolean","isIntersecting","smoothScroll","behavior","block","inline","then","useIsomorphicLayoutEffect","scrollDelay","setTimeout","useLockBodyScroll","contextValue","_jsxs","TourContext","Provider","value","_jsx","FloatingPortal","SpotlightPopoverTourMask","padding","spacing","map","_step$content","_step$footer","isStepActive","attachTo","isPopoverVisible","TourPopover","placement","title","titleLeading","content","call","footer"],"mappings":"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"}

package/build/lib/web/production/components/SpotlightPopoverTour/TourMask.web.js

@@ -81,6 +81,7 @@ var absoluteFill = {
   zIndex: componentZIndices.tourMask
 };
 var _SpotlightPopoverTourMask = function _SpotlightPopoverTourMask(_ref4) {
+  var _size$borderRadius;
   var padding = _ref4.padding,
     size = _ref4.size,
     isTransitioning = _ref4.isTransitioning;
@@ -94,7 +95,17 @@ var _SpotlightPopoverTourMask = function _SpotlightPopoverTourMask(_ref4) {
   var x = size.x - (width - size.width) / 2;
   var y = size.y - (height - size.height) / 2;
   var borderWidth = theme.spacing[1];
-  var borderRadius = theme.spacing[2];
+  /**
+   * The spotlight takes the corner radius of the component it highlights, so it reads as a
+   * halo on that element rather than as a box of its own. When the step highlights content
+   * that draws no corner at all (plain text), there is nothing to inherit — we agree with
+   * the popover's radius instead of squaring off to a hard corner.
+   *
+   * Note this is the target's radius verbatim, not `radius + padding / 2`: matching the
+   * component is the intended rule, and the small corner offset that leaves is deliberate.
+   */
+  var spotlightRadius = (_size$borderRadius = size.borderRadius) !== null && _size$borderRadius !== void 0 ? _size$borderRadius : 0;
+  var borderRadius = spotlightRadius > 0 ? spotlightRadius : theme.border.radius.large;
   var isSizeZero = size.width === 0 || size.height === 0;
   return /*#__PURE__*/jsxs("svg", _objectSpread(_objectSpread({
     style: absoluteFill,
@@ -111,8 +122,8 @@ var _SpotlightPopoverTourMask = function _SpotlightPopoverTourMask(_ref4) {
       height: height - borderWidth,
       stroke: theme.colors.surface.background.primary.intense,
       strokeWidth: makeSpace(borderWidth),
-      rx: borderRadius - 1,
-      ry: borderRadius - 1,
+      rx: borderRadius - borderWidth / 2,
+      ry: borderRadius - borderWidth / 2,
       fill: "transparent",
       opacity: isSizeZero ? 0 : 1
     }), /*#__PURE__*/jsxs("mask", {

package/build/lib/web/production/components/SpotlightPopoverTour/TourMask.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"TourMask.web.js","sources":["../../../../../../src/components/SpotlightPopoverTour/TourMask.web.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-useless-fragment */\nimport React from 'react';\nimport type { FlattenSimpleInterpolation } from 'styled-components';\nimport styled, { css, keyframes } from 'styled-components';\nimport usePresence from 'use-presence';\nimport type { SpotlightPopoverTourMaskRect } from './types';\nimport { useTheme } from '~components/BladeProvider';\nimport { useWindowSize } from '~utils/useWindowSize';\nimport { makeSpace } from '~utils';\nimport { makeMotionTime } from '~utils/makeMotionTime';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { componentZIndices } from '~utils/componentZIndices';\n\nconst scaleIn = keyframes`\n  from {\n    fill-opacity: 0;\n  }\n  to {\n    fill-opacity: 1;\n  }\n`;\nconst fadeOut = keyframes`\n  from {\n    fill-opacity: 1;\n  }\n  to {\n    fill-opacity: 0;\n  }\n`;\n\nconst pulsingAnimation = keyframes`\n  0% {\n    opacity: 0.5;\n  }\n  100% {\n    opacity: 1;\n  }\n`;\n\nconst AnimatedFade = styled.rect<{ animationType: FlattenSimpleInterpolation | null }>(\n  ({ animationType }) =>\n    animationType === null\n      ? ''\n      : css`\n          ${animationType}\n        `,\n);\n\nconst StyledPlusing = styled.rect<{ animationType: FlattenSimpleInterpolation | null }>(\n  ({ animationType }) => {\n    return animationType === null\n      ? ''\n      : css`\n          ${animationType}\n        `;\n  },\n);\n\ntype FadeRectProps = React.ComponentProps<'rect'> & {\n  show: boolean;\n};\nconst FadeRect = React.memo(\n  ({ show, children, ...rest }: FadeRectProps): React.ReactElement => {\n    const { theme } = useTheme();\n\n    const duration = theme.motion.duration.gentle;\n    const enter = css`\n      animation: ${scaleIn} ${makeMotionTime(duration)}\n        ${(theme.motion.easing.entrance as unknown) as string};\n      animation-fill-mode: forwards;\n    `;\n\n    const exit = css`\n      animation: ${fadeOut} ${makeMotionTime(duration)}\n        ${(theme.motion.easing.exit as unknown) as string};\n      animation-fill-mode: forwards;\n    `;\n\n    const { isVisible } = usePresence(Boolean(show), {\n      transitionDuration: duration,\n      initialEnter: false,\n    });\n\n    return (\n      // @ts-expect-error styled compoennt types are different from react types\n      <AnimatedFade animationType={isVisible ? enter : exit} {...rest}>\n        {children}\n      </AnimatedFade>\n    );\n  },\n);\n\nconst PulsingRect = React.memo(\n  (props: React.ComponentProps<'rect'>): React.ReactElement => {\n    const pulsing = css`\n      animation: ${pulsingAnimation} 2s;\n      animation-iteration-count: infinite;\n      animation-direction: alternate;\n    `;\n\n    return (\n      // @ts-expect-error styled compoennt types are different from react types\n      <StyledPlusing animationType={pulsing} {...props} />\n    );\n  },\n);\n\ntype SpotlightPopoverTourMaskProps = {\n  padding: number;\n  size: SpotlightPopoverTourMaskRect;\n  isTransitioning: boolean;\n};\n\nconst absoluteFill = {\n  position: 'fixed',\n  top: 0,\n  left: 0,\n  bottom: 0,\n  right: 0,\n  zIndex: componentZIndices.tourMask,\n} as const;\n\nconst _SpotlightPopoverTourMask = ({\n  padding,\n  size,\n  isTransitioning,\n}: SpotlightPopoverTourMaskProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const { width: windowWidth, height: windowHeight } = useWindowSize();\n\n  const width = size.width + padding;\n  const height = size.height + padding;\n  const x = size.x - (width - size.width) / 2;\n  const y = size.y - (height - size.height) / 2;\n\n  const borderWidth = theme.spacing[1];\n  const borderRadius = theme.spacing[2];\n\n  const isSizeZero = size.width === 0 || size.height === 0;\n\n  return (\n    <svg\n      style={absoluteFill}\n      viewBox={`0 0 ${windowWidth} ${windowHeight}`}\n      fill=\"none\"\n      stroke=\"none\"\n      {...metaAttribute({ name: MetaConstants.TourMask })}\n    >\n      <PulsingRect\n        x={x + borderWidth / 2}\n        y={y + borderWidth / 2}\n        width={width - borderWidth}\n        height={height - borderWidth}\n        stroke={theme.colors.surface.background.primary.intense}\n        strokeWidth={makeSpace(borderWidth)}\n        rx={borderRadius - 1}\n        ry={borderRadius - 1}\n        fill=\"transparent\"\n        opacity={isSizeZero ? 0 : 1}\n      />\n\n      <mask id=\"tour-mask\" x={0} y={0} height=\"100%\" width=\"100%\" stroke=\"none\">\n        <rect height=\"100%\" width=\"100%\" fill=\"#fff\" />\n        {!isSizeZero && (\n          <FadeRect\n            show={!isTransitioning}\n            x={x}\n            y={y}\n            width={width}\n            height={height}\n            rx={borderRadius}\n            ry={borderRadius}\n            fill=\"#000\"\n          />\n        )}\n      </mask>\n      <rect\n        height=\"100%\"\n        width=\"100%\"\n        mask=\"url(#tour-mask)\"\n        fill={theme.colors.overlay.background.subtle}\n      />\n    </svg>\n  );\n};\n\nconst SpotlightPopoverTourMask = assignWithoutSideEffects(React.memo(_SpotlightPopoverTourMask), {\n  displayName: 'TourMask',\n});\nexport { SpotlightPopoverTourMask };\n"],"names":["scaleIn","keyframes","fadeOut","pulsingAnimation","AnimatedFade","styled","rect","withConfig","displayName","componentId","_ref","animationType","css","StyledPlusing","_ref2","FadeRect","React","memo","_ref3","show","children","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","duration","motion","gentle","enter","makeMotionTime","easing","entrance","exit","_usePresence","usePresence","Boolean","transitionDuration","initialEnter","isVisible","_jsx","_objectSpread","PulsingRect","props","pulsing","absoluteFill","position","top","left","bottom","right","zIndex","componentZIndices","tourMask","_SpotlightPopoverTourMask","_ref4","padding","size","isTransitioning","_useTheme2","_useWindowSize","useWindowSize","windowWidth","width","windowHeight","height","x","y","borderWidth","spacing","borderRadius","isSizeZero","_jsxs","style","viewBox","concat","fill","stroke","metaAttribute","name","MetaConstants","TourMask","colors","surface","background","primary","intense","strokeWidth","makeSpace","rx","ry","opacity","id","mask","overlay","subtle","SpotlightPopoverTourMask","assignWithoutSideEffects"],"mappings":"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"}
+{"version":3,"file":"TourMask.web.js","sources":["../../../../../../src/components/SpotlightPopoverTour/TourMask.web.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-useless-fragment */\nimport React from 'react';\nimport type { FlattenSimpleInterpolation } from 'styled-components';\nimport styled, { css, keyframes } from 'styled-components';\nimport usePresence from 'use-presence';\nimport type { SpotlightPopoverTourMaskRect } from './types';\nimport { useTheme } from '~components/BladeProvider';\nimport { useWindowSize } from '~utils/useWindowSize';\nimport { makeSpace } from '~utils';\nimport { makeMotionTime } from '~utils/makeMotionTime';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { componentZIndices } from '~utils/componentZIndices';\n\nconst scaleIn = keyframes`\n  from {\n    fill-opacity: 0;\n  }\n  to {\n    fill-opacity: 1;\n  }\n`;\nconst fadeOut = keyframes`\n  from {\n    fill-opacity: 1;\n  }\n  to {\n    fill-opacity: 0;\n  }\n`;\n\nconst pulsingAnimation = keyframes`\n  0% {\n    opacity: 0.5;\n  }\n  100% {\n    opacity: 1;\n  }\n`;\n\nconst AnimatedFade = styled.rect<{ animationType: FlattenSimpleInterpolation | null }>(\n  ({ animationType }) =>\n    animationType === null\n      ? ''\n      : css`\n          ${animationType}\n        `,\n);\n\nconst StyledPlusing = styled.rect<{ animationType: FlattenSimpleInterpolation | null }>(\n  ({ animationType }) => {\n    return animationType === null\n      ? ''\n      : css`\n          ${animationType}\n        `;\n  },\n);\n\ntype FadeRectProps = React.ComponentProps<'rect'> & {\n  show: boolean;\n};\nconst FadeRect = React.memo(\n  ({ show, children, ...rest }: FadeRectProps): React.ReactElement => {\n    const { theme } = useTheme();\n\n    const duration = theme.motion.duration.gentle;\n    const enter = css`\n      animation: ${scaleIn} ${makeMotionTime(duration)}\n        ${(theme.motion.easing.entrance as unknown) as string};\n      animation-fill-mode: forwards;\n    `;\n\n    const exit = css`\n      animation: ${fadeOut} ${makeMotionTime(duration)}\n        ${(theme.motion.easing.exit as unknown) as string};\n      animation-fill-mode: forwards;\n    `;\n\n    const { isVisible } = usePresence(Boolean(show), {\n      transitionDuration: duration,\n      initialEnter: false,\n    });\n\n    return (\n      // @ts-expect-error styled compoennt types are different from react types\n      <AnimatedFade animationType={isVisible ? enter : exit} {...rest}>\n        {children}\n      </AnimatedFade>\n    );\n  },\n);\n\nconst PulsingRect = React.memo(\n  (props: React.ComponentProps<'rect'>): React.ReactElement => {\n    const pulsing = css`\n      animation: ${pulsingAnimation} 2s;\n      animation-iteration-count: infinite;\n      animation-direction: alternate;\n    `;\n\n    return (\n      // @ts-expect-error styled compoennt types are different from react types\n      <StyledPlusing animationType={pulsing} {...props} />\n    );\n  },\n);\n\ntype SpotlightPopoverTourMaskProps = {\n  padding: number;\n  size: SpotlightPopoverTourMaskRect;\n  isTransitioning: boolean;\n};\n\nconst absoluteFill = {\n  position: 'fixed',\n  top: 0,\n  left: 0,\n  bottom: 0,\n  right: 0,\n  zIndex: componentZIndices.tourMask,\n} as const;\n\nconst _SpotlightPopoverTourMask = ({\n  padding,\n  size,\n  isTransitioning,\n}: SpotlightPopoverTourMaskProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const { width: windowWidth, height: windowHeight } = useWindowSize();\n\n  const width = size.width + padding;\n  const height = size.height + padding;\n  const x = size.x - (width - size.width) / 2;\n  const y = size.y - (height - size.height) / 2;\n\n  const borderWidth = theme.spacing[1];\n  /**\n   * The spotlight takes the corner radius of the component it highlights, so it reads as a\n   * halo on that element rather than as a box of its own. When the step highlights content\n   * that draws no corner at all (plain text), there is nothing to inherit — we agree with\n   * the popover's radius instead of squaring off to a hard corner.\n   *\n   * Note this is the target's radius verbatim, not `radius + padding / 2`: matching the\n   * component is the intended rule, and the small corner offset that leaves is deliberate.\n   */\n  const spotlightRadius = size.borderRadius ?? 0;\n  const borderRadius = spotlightRadius > 0 ? spotlightRadius : theme.border.radius.large;\n\n  const isSizeZero = size.width === 0 || size.height === 0;\n\n  return (\n    <svg\n      style={absoluteFill}\n      viewBox={`0 0 ${windowWidth} ${windowHeight}`}\n      fill=\"none\"\n      stroke=\"none\"\n      {...metaAttribute({ name: MetaConstants.TourMask })}\n    >\n      <PulsingRect\n        x={x + borderWidth / 2}\n        y={y + borderWidth / 2}\n        width={width - borderWidth}\n        height={height - borderWidth}\n        stroke={theme.colors.surface.background.primary.intense}\n        strokeWidth={makeSpace(borderWidth)}\n        rx={borderRadius - borderWidth / 2}\n        ry={borderRadius - borderWidth / 2}\n        fill=\"transparent\"\n        opacity={isSizeZero ? 0 : 1}\n      />\n\n      <mask id=\"tour-mask\" x={0} y={0} height=\"100%\" width=\"100%\" stroke=\"none\">\n        <rect height=\"100%\" width=\"100%\" fill=\"#fff\" />\n        {!isSizeZero && (\n          <FadeRect\n            show={!isTransitioning}\n            x={x}\n            y={y}\n            width={width}\n            height={height}\n            rx={borderRadius}\n            ry={borderRadius}\n            fill=\"#000\"\n          />\n        )}\n      </mask>\n      <rect\n        height=\"100%\"\n        width=\"100%\"\n        mask=\"url(#tour-mask)\"\n        fill={theme.colors.overlay.background.subtle}\n      />\n    </svg>\n  );\n};\n\nconst SpotlightPopoverTourMask = assignWithoutSideEffects(React.memo(_SpotlightPopoverTourMask), {\n  displayName: 'TourMask',\n});\nexport { SpotlightPopoverTourMask };\n"],"names":["scaleIn","keyframes","fadeOut","pulsingAnimation","AnimatedFade","styled","rect","withConfig","displayName","componentId","_ref","animationType","css","StyledPlusing","_ref2","FadeRect","React","memo","_ref3","show","children","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","duration","motion","gentle","enter","makeMotionTime","easing","entrance","exit","_usePresence","usePresence","Boolean","transitionDuration","initialEnter","isVisible","_jsx","_objectSpread","PulsingRect","props","pulsing","absoluteFill","position","top","left","bottom","right","zIndex","componentZIndices","tourMask","_SpotlightPopoverTourMask","_ref4","_size$borderRadius","padding","size","isTransitioning","_useTheme2","_useWindowSize","useWindowSize","windowWidth","width","windowHeight","height","x","y","borderWidth","spacing","spotlightRadius","borderRadius","border","radius","large","isSizeZero","_jsxs","style","viewBox","concat","fill","stroke","metaAttribute","name","MetaConstants","TourMask","colors","surface","background","primary","intense","strokeWidth","makeSpace","rx","ry","opacity","id","mask","overlay","subtle","SpotlightPopoverTourMask","assignWithoutSideEffects"],"mappings":"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"}

package/build/lib/web/production/components/SpotlightPopoverTour/TourPopover.web.js

@@ -6,6 +6,7 @@ import { PopoverContent } from '../Popover/PopoverContent.js';
 import { ARROW_HEIGHT, ARROW_WIDTH } from '../Popover/constants.js';
 import { PopoverContext } from '../Popover/PopoverContext.js';
 import { transitionDelay } from './tourTokens.js';
+import { resolveSpotlightTarget } from './utils.js';
 import '../BladeProvider/index.js';
 import '../Box/BaseBox/index.js';
 import '../../utils/metaAttribute/index.js';
@@ -138,8 +139,13 @@ var TourPopover = function TourPopover(_ref) {
   React__default.useLayoutEffect(function () {
     window.setTimeout(function () {
       if (!attachTo) return;
-      refs.setReference(attachTo.current);
-      refs.setPositionReference(attachTo.current);
+      var element = attachTo.current;
+      refs.setReference(element);
+      // The spotlight traces the painted component rather than the layout wrapper the step's
+      // ref happens to sit on, so `GAP` has to be measured from that same rectangle. Anchoring
+      // to the wrapper instead leaks its overhang — a wrapper stretched by a flex row is taller
+      // than the card inside it — into the gap between the arrow tip and the spotlight.
+      refs.setPositionReference(element ? resolveSpotlightTarget(element) : null);
     });
   }, [attachTo, refs, isOpen]);
   return /*#__PURE__*/jsx(PopoverContext.Provider, {
@@ -171,12 +177,25 @@ var TourPopover = function TourPopover(_ref) {
             titleLeading: titleLeading,
             footer: footer,
             style: styles,
-            arrow: /*#__PURE__*/jsx(PopupArrow, {
+            arrow:
+            /*#__PURE__*/
+            // Kept at parity with Popover's arrow. The stroke matters beyond the arrow's
+            // own outline: the popup's surface carries a 1px inset hairline on every edge,
+            // including the one the arrow sits on, so without a stroke that hairline is
+            // drawn straight across the join and the arrow reads as a separate shape. A
+            // non-zero strokeWidth also offsets the arrow onto that edge, letting its fill
+            // cover the hairline underneath it.
+            jsx(PopupArrow, {
               ref: arrowRef,
               context: context,
               width: ARROW_WIDTH,
               height: ARROW_HEIGHT,
-              fillColor: theme.colors.popup.background.gray.subtle
+              fillColor: theme.colors.popup.background.gray.moderate,
+              strokeColor: theme.colors.popup.border.gray.moderate,
+              strokeWidth: theme.border.width.thin,
+              style: {
+                transform: 'translateY(-1px)'
+              }
             }),
             children: content
           })

package/build/lib/web/production/components/SpotlightPopoverTour/TourPopover.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"TourPopover.web.js","sources":["../../../../../../src/components/SpotlightPopoverTour/TourPopover.web.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-useless-fragment */\n/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport {\n  shift,\n  FloatingPortal,\n  arrow,\n  flip,\n  offset,\n  useFloating,\n  useInteractions,\n  useRole,\n  useTransitionStyles,\n  autoUpdate,\n  useClick,\n  FloatingFocusManager,\n} from '@floating-ui/react';\nimport React from 'react';\nimport { PopoverContent } from '../Popover/PopoverContent';\nimport { ARROW_HEIGHT, ARROW_WIDTH } from '../Popover/constants';\nimport { PopoverContext } from '../Popover/PopoverContext';\nimport { transitionDelay } from './tourTokens';\nimport { useTheme } from '~components/BladeProvider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { size } from '~tokens/global';\nimport { useControllableState } from '~utils/useControllable';\nimport { PopupArrow } from '~components/PopupArrow';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { useId } from '~utils/useId';\nimport { getFloatingPlacementParts } from '~utils/getFloatingPlacementParts';\nimport type { PopoverProps } from '~components/Popover';\nimport { componentZIndices } from '~utils/componentZIndices';\n\ntype TourPopoverProps = Omit<PopoverProps, 'children' | 'initialFocusRef'> & {\n  attachTo: React.RefObject<HTMLElement> | undefined;\n  isTransitioning: boolean;\n};\n\n// TODO: Refactor out Popover/FloatingUI logic to a reusable hook/component later on\nconst TourPopover = ({\n  attachTo,\n  content,\n  title,\n  titleLeading,\n  footer,\n  placement = 'top',\n  onOpenChange,\n  zIndex = componentZIndices.popover,\n  isOpen,\n  defaultIsOpen,\n  isTransitioning,\n}: TourPopoverProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const defaultInitialFocusRef = React.useRef<HTMLButtonElement>(null);\n  const arrowRef = React.useRef<SVGSVGElement>(null);\n  const titleId = useId('popover-title');\n\n  const GAP = theme.spacing[4];\n  const [side] = getFloatingPlacementParts(placement);\n  const isHorizontal = side === 'left' || side === 'right';\n  const isOppositeAxis = side === 'right' || side === 'bottom';\n\n  const [controllableIsOpen, controllableSetIsOpen] = useControllableState({\n    value: isOpen,\n    defaultValue: defaultIsOpen,\n    onChange: (isOpen) => onOpenChange?.({ isOpen }),\n  });\n\n  const { refs, floatingStyles, context, placement: computedPlacement } = useFloating({\n    open: controllableIsOpen,\n    onOpenChange: (isOpen) => controllableSetIsOpen(() => isOpen),\n    placement,\n    strategy: 'fixed',\n    middleware: [\n      shift({ crossAxis: false, padding: GAP }),\n      flip({ padding: GAP, fallbackAxisSideDirection: 'end' }),\n      offset(GAP + ARROW_HEIGHT),\n      arrow({\n        element: arrowRef,\n        padding: isHorizontal ? GAP + ARROW_HEIGHT : ARROW_WIDTH,\n      }),\n    ],\n    transform: true,\n    whileElementsMounted: autoUpdate,\n  });\n\n  const close = React.useCallback(() => {\n    controllableSetIsOpen(() => false);\n  }, [controllableSetIsOpen]);\n\n  // we need to animate from the offset of the computed placement\n  // because placement can change dynamically based on available space\n  const [computedSide] = getFloatingPlacementParts(computedPlacement);\n  const computedIsHorizontal = computedSide === 'left' || computedSide === 'right';\n  const animationOffset = isOppositeAxis ? -size[4] : size[4];\n\n  const { isMounted, styles } = useTransitionStyles(context, {\n    duration: {\n      open: transitionDelay,\n      close: theme.motion.duration.xquick,\n    },\n    initial: {\n      opacity: 0,\n      transform: `translate${computedIsHorizontal ? 'X' : 'Y'}(${animationOffset}px)`,\n    },\n  });\n\n  // remove click handler if popover is controlled\n  const isControlled = isOpen !== undefined;\n  const click = useClick(context, { enabled: !isControlled });\n  const role = useRole(context);\n\n  const { getFloatingProps } = useInteractions([click, role]);\n\n  const contextValue = React.useMemo(() => {\n    return {\n      close,\n      defaultInitialFocusRef,\n      titleId,\n      openInteraction: 'click' as const,\n    };\n  }, [close, titleId]);\n\n  // https://github.com/floating-ui/floating-ui/discussions/2352#discussioncomment-6044834\n  React.useLayoutEffect(() => {\n    window.setTimeout(() => {\n      if (!attachTo) return;\n      refs.setReference(attachTo.current);\n      refs.setPositionReference(attachTo.current);\n    });\n  }, [attachTo, refs, isOpen]);\n\n  return (\n    <PopoverContext.Provider value={contextValue}>\n      <FloatingPortal>\n        <FloatingFocusManager\n          // TODO: check if isTransitioning is enough since scrolling can take longer\n          disabled={isOpen === false || !isMounted || isTransitioning}\n          initialFocus={defaultInitialFocusRef}\n          context={context}\n          modal={true}\n          guards={true}\n        >\n          {isMounted ? (\n            <BaseBox\n              ref={refs.setFloating}\n              style={{ ...floatingStyles, pointerEvents: isMounted ? 'auto' : 'none' }}\n              // TODO: Tokenize zIndex values\n              zIndex={zIndex}\n              {...getFloatingProps()}\n              {...metaAttribute({ name: MetaConstants.TourPopover })}\n              {...makeAccessible({ labelledBy: titleId })}\n            >\n              <PopoverContent\n                title={title}\n                titleLeading={titleLeading}\n                footer={footer}\n                style={styles}\n                arrow={\n                  <PopupArrow\n                    ref={arrowRef}\n                    context={context}\n                    width={ARROW_WIDTH}\n                    height={ARROW_HEIGHT}\n                    fillColor={theme.colors.popup.background.gray.subtle}\n                  />\n                }\n              >\n                {content}\n              </PopoverContent>\n            </BaseBox>\n          ) : (\n            <></>\n          )}\n        </FloatingFocusManager>\n      </FloatingPortal>\n    </PopoverContext.Provider>\n  );\n};\n\nexport { TourPopover };\n"],"names":["TourPopover","_ref","attachTo","content","title","titleLeading","footer","_ref$placement","placement","onOpenChange","_ref$zIndex","zIndex","componentZIndices","popover","isOpen","defaultIsOpen","isTransitioning","_useTheme","useTheme","theme","defaultInitialFocusRef","React","useRef","arrowRef","titleId","useId","GAP","spacing","_getFloatingPlacement","getFloatingPlacementParts","_getFloatingPlacement2","_slicedToArray","side","isHorizontal","isOppositeAxis","_useControllableState","useControllableState","value","defaultValue","onChange","_useControllableState2","controllableIsOpen","controllableSetIsOpen","_useFloating","useFloating","open","strategy","middleware","shift","crossAxis","padding","flip","fallbackAxisSideDirection","offset","ARROW_HEIGHT","arrow","element","ARROW_WIDTH","transform","whileElementsMounted","autoUpdate","refs","floatingStyles","context","computedPlacement","close","useCallback","_getFloatingPlacement3","_getFloatingPlacement4","computedSide","computedIsHorizontal","animationOffset","size","_useTransitionStyles","useTransitionStyles","duration","transitionDelay","motion","xquick","initial","opacity","concat","isMounted","styles","isControlled","undefined","click","useClick","enabled","role","useRole","_useInteractions","useInteractions","getFloatingProps","contextValue","useMemo","openInteraction","useLayoutEffect","window","setTimeout","setReference","current","setPositionReference","_jsx","PopoverContext","Provider","children","FloatingPortal","FloatingFocusManager","disabled","initialFocus","modal","guards","BaseBox","_objectSpread","ref","setFloating","style","pointerEvents","metaAttribute","name","MetaConstants","makeAccessible","labelledBy","PopoverContent","PopupArrow","width","height","fillColor","colors","popup","background","gray","subtle","_Fragment"],"mappings":"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"}
+{"version":3,"file":"TourPopover.web.js","sources":["../../../../../../src/components/SpotlightPopoverTour/TourPopover.web.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-useless-fragment */\n/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport {\n  shift,\n  FloatingPortal,\n  arrow,\n  flip,\n  offset,\n  useFloating,\n  useInteractions,\n  useRole,\n  useTransitionStyles,\n  autoUpdate,\n  useClick,\n  FloatingFocusManager,\n} from '@floating-ui/react';\nimport React from 'react';\nimport { PopoverContent } from '../Popover/PopoverContent';\nimport { ARROW_HEIGHT, ARROW_WIDTH } from '../Popover/constants';\nimport { PopoverContext } from '../Popover/PopoverContext';\nimport { transitionDelay } from './tourTokens';\nimport { resolveSpotlightTarget } from './utils';\nimport { useTheme } from '~components/BladeProvider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { size } from '~tokens/global';\nimport { useControllableState } from '~utils/useControllable';\nimport { PopupArrow } from '~components/PopupArrow';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { useId } from '~utils/useId';\nimport { getFloatingPlacementParts } from '~utils/getFloatingPlacementParts';\nimport type { PopoverProps } from '~components/Popover';\nimport { componentZIndices } from '~utils/componentZIndices';\n\ntype TourPopoverProps = Omit<PopoverProps, 'children' | 'initialFocusRef'> & {\n  attachTo: React.RefObject<HTMLElement> | undefined;\n  isTransitioning: boolean;\n};\n\n// TODO: Refactor out Popover/FloatingUI logic to a reusable hook/component later on\nconst TourPopover = ({\n  attachTo,\n  content,\n  title,\n  titleLeading,\n  footer,\n  placement = 'top',\n  onOpenChange,\n  zIndex = componentZIndices.popover,\n  isOpen,\n  defaultIsOpen,\n  isTransitioning,\n}: TourPopoverProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const defaultInitialFocusRef = React.useRef<HTMLButtonElement>(null);\n  const arrowRef = React.useRef<SVGSVGElement>(null);\n  const titleId = useId('popover-title');\n\n  const GAP = theme.spacing[4];\n  const [side] = getFloatingPlacementParts(placement);\n  const isHorizontal = side === 'left' || side === 'right';\n  const isOppositeAxis = side === 'right' || side === 'bottom';\n\n  const [controllableIsOpen, controllableSetIsOpen] = useControllableState({\n    value: isOpen,\n    defaultValue: defaultIsOpen,\n    onChange: (isOpen) => onOpenChange?.({ isOpen }),\n  });\n\n  const { refs, floatingStyles, context, placement: computedPlacement } = useFloating({\n    open: controllableIsOpen,\n    onOpenChange: (isOpen) => controllableSetIsOpen(() => isOpen),\n    placement,\n    strategy: 'fixed',\n    middleware: [\n      shift({ crossAxis: false, padding: GAP }),\n      flip({ padding: GAP, fallbackAxisSideDirection: 'end' }),\n      offset(GAP + ARROW_HEIGHT),\n      arrow({\n        element: arrowRef,\n        padding: isHorizontal ? GAP + ARROW_HEIGHT : ARROW_WIDTH,\n      }),\n    ],\n    transform: true,\n    whileElementsMounted: autoUpdate,\n  });\n\n  const close = React.useCallback(() => {\n    controllableSetIsOpen(() => false);\n  }, [controllableSetIsOpen]);\n\n  // we need to animate from the offset of the computed placement\n  // because placement can change dynamically based on available space\n  const [computedSide] = getFloatingPlacementParts(computedPlacement);\n  const computedIsHorizontal = computedSide === 'left' || computedSide === 'right';\n  const animationOffset = isOppositeAxis ? -size[4] : size[4];\n\n  const { isMounted, styles } = useTransitionStyles(context, {\n    duration: {\n      open: transitionDelay,\n      close: theme.motion.duration.xquick,\n    },\n    initial: {\n      opacity: 0,\n      transform: `translate${computedIsHorizontal ? 'X' : 'Y'}(${animationOffset}px)`,\n    },\n  });\n\n  // remove click handler if popover is controlled\n  const isControlled = isOpen !== undefined;\n  const click = useClick(context, { enabled: !isControlled });\n  const role = useRole(context);\n\n  const { getFloatingProps } = useInteractions([click, role]);\n\n  const contextValue = React.useMemo(() => {\n    return {\n      close,\n      defaultInitialFocusRef,\n      titleId,\n      openInteraction: 'click' as const,\n    };\n  }, [close, titleId]);\n\n  // https://github.com/floating-ui/floating-ui/discussions/2352#discussioncomment-6044834\n  React.useLayoutEffect(() => {\n    window.setTimeout(() => {\n      if (!attachTo) return;\n      const element = attachTo.current;\n      refs.setReference(element);\n      // The spotlight traces the painted component rather than the layout wrapper the step's\n      // ref happens to sit on, so `GAP` has to be measured from that same rectangle. Anchoring\n      // to the wrapper instead leaks its overhang — a wrapper stretched by a flex row is taller\n      // than the card inside it — into the gap between the arrow tip and the spotlight.\n      refs.setPositionReference(element ? resolveSpotlightTarget(element) : null);\n    });\n  }, [attachTo, refs, isOpen]);\n\n  return (\n    <PopoverContext.Provider value={contextValue}>\n      <FloatingPortal>\n        <FloatingFocusManager\n          // TODO: check if isTransitioning is enough since scrolling can take longer\n          disabled={isOpen === false || !isMounted || isTransitioning}\n          initialFocus={defaultInitialFocusRef}\n          context={context}\n          modal={true}\n          guards={true}\n        >\n          {isMounted ? (\n            <BaseBox\n              ref={refs.setFloating}\n              style={{ ...floatingStyles, pointerEvents: isMounted ? 'auto' : 'none' }}\n              // TODO: Tokenize zIndex values\n              zIndex={zIndex}\n              {...getFloatingProps()}\n              {...metaAttribute({ name: MetaConstants.TourPopover })}\n              {...makeAccessible({ labelledBy: titleId })}\n            >\n              <PopoverContent\n                title={title}\n                titleLeading={titleLeading}\n                footer={footer}\n                style={styles}\n                arrow={\n                  // Kept at parity with Popover's arrow. The stroke matters beyond the arrow's\n                  // own outline: the popup's surface carries a 1px inset hairline on every edge,\n                  // including the one the arrow sits on, so without a stroke that hairline is\n                  // drawn straight across the join and the arrow reads as a separate shape. A\n                  // non-zero strokeWidth also offsets the arrow onto that edge, letting its fill\n                  // cover the hairline underneath it.\n                  <PopupArrow\n                    ref={arrowRef}\n                    context={context}\n                    width={ARROW_WIDTH}\n                    height={ARROW_HEIGHT}\n                    fillColor={theme.colors.popup.background.gray.moderate}\n                    strokeColor={theme.colors.popup.border.gray.moderate}\n                    strokeWidth={theme.border.width.thin}\n                    style={{ transform: 'translateY(-1px)' }}\n                  />\n                }\n              >\n                {content}\n              </PopoverContent>\n            </BaseBox>\n          ) : (\n            <></>\n          )}\n        </FloatingFocusManager>\n      </FloatingPortal>\n    </PopoverContext.Provider>\n  );\n};\n\nexport { TourPopover };\n"],"names":["TourPopover","_ref","attachTo","content","title","titleLeading","footer","_ref$placement","placement","onOpenChange","_ref$zIndex","zIndex","componentZIndices","popover","isOpen","defaultIsOpen","isTransitioning","_useTheme","useTheme","theme","defaultInitialFocusRef","React","useRef","arrowRef","titleId","useId","GAP","spacing","_getFloatingPlacement","getFloatingPlacementParts","_getFloatingPlacement2","_slicedToArray","side","isHorizontal","isOppositeAxis","_useControllableState","useControllableState","value","defaultValue","onChange","_useControllableState2","controllableIsOpen","controllableSetIsOpen","_useFloating","useFloating","open","strategy","middleware","shift","crossAxis","padding","flip","fallbackAxisSideDirection","offset","ARROW_HEIGHT","arrow","element","ARROW_WIDTH","transform","whileElementsMounted","autoUpdate","refs","floatingStyles","context","computedPlacement","close","useCallback","_getFloatingPlacement3","_getFloatingPlacement4","computedSide","computedIsHorizontal","animationOffset","size","_useTransitionStyles","useTransitionStyles","duration","transitionDelay","motion","xquick","initial","opacity","concat","isMounted","styles","isControlled","undefined","click","useClick","enabled","role","useRole","_useInteractions","useInteractions","getFloatingProps","contextValue","useMemo","openInteraction","useLayoutEffect","window","setTimeout","current","setReference","setPositionReference","resolveSpotlightTarget","_jsx","PopoverContext","Provider","children","FloatingPortal","FloatingFocusManager","disabled","initialFocus","modal","guards","BaseBox","_objectSpread","ref","setFloating","style","pointerEvents","metaAttribute","name","MetaConstants","makeAccessible","labelledBy","PopoverContent","PopupArrow","width","height","fillColor","colors","popup","background","gray","moderate","strokeColor","border","strokeWidth","thin","_Fragment"],"mappings":"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"}

package/build/lib/web/production/components/SpotlightPopoverTour/utils.js

@@ -132,6 +132,63 @@ function useIntersectionObserver(elementRef, _ref) {
   }, [elementRef === null || elementRef === void 0 ? void 0 : elementRef.current, JSON.stringify(threshold), root, rootMargin]);
   return entry;
 }
+var readBorderRadius = function readBorderRadius(el) {
+  var _window$getComputedSt = window.getComputedStyle(el),
+    borderTopLeftRadius = _window$getComputedSt.borderTopLeftRadius;
+  var parsed = Number.parseFloat(borderTopLeftRadius);
+  if (Number.isNaN(parsed)) return 0;
+  // Percentage radii (e.g. `50%` on a circular avatar) resolve against the box itself.
+  if (borderTopLeftRadius.includes('%')) {
+    var _el$getBoundingClient = el.getBoundingClientRect(),
+      width = _el$getBoundingClient.width,
+      height = _el$getBoundingClient.height;
+    return Math.min(width, height) * parsed / 100;
+  }
+  return parsed;
+};
+
+// `getComputedStyle` reports unset properties as an empty string in some environments
+// (notably jsdom), so treat "unset" the same as "not painted" rather than as a value.
+var isPainted = function isPainted(value) {
+  return Boolean(value) && value !== 'none' && value !== 'transparent' && value !== 'rgba(0, 0, 0, 0)';
+};
+
+/** Whether an element paints anything of its own, or is a bare layout shell. */
+var drawsOwnShape = function drawsOwnShape(el) {
+  var _window$getComputedSt2 = window.getComputedStyle(el),
+    borderTopWidth = _window$getComputedSt2.borderTopWidth,
+    backgroundColor = _window$getComputedSt2.backgroundColor,
+    backgroundImage = _window$getComputedSt2.backgroundImage;
+  return readBorderRadius(el) > 0 || Number.parseFloat(borderTopWidth) > 0 || isPainted(backgroundColor) || isPainted(backgroundImage);
+};
+
+/**
+ * Resolves the element a step should actually be measured against.
+ *
+ * `SpotlightPopoverTourStep` clones its child to attach a ref, so consumers commonly wrap
+ * their UI in a layout element just to forward one. Measuring that wrapper is wrong twice
+ * over: it has no corner radius to inherit, and a wrapper stretched by its parent's layout
+ * (e.g. `alignItems="stretch"` in a flex row) is taller than the component inside it, which
+ * makes the spotlight's padding look uneven — 6px on three sides and more at the bottom.
+ *
+ * So when the step's element paints nothing itself and simply wraps a single child that
+ * fills it on at least one axis, we trace that child instead. The fill check keeps us from
+ * shrinking onto an inner element that merely happens to be first — a wrapper around
+ * narrower content is still measured as the wrapper.
+ *
+ * Both the spotlight and the popover must resolve through this, or they anchor to different
+ * rectangles and the overhang between them shows up as an uneven arrow-to-spotlight gap.
+ */
+var resolveSpotlightTarget = function resolveSpotlightTarget(element) {
+  if (drawsOwnShape(element)) return element;
+  var children = element.children;
+  if (children.length !== 1) return element;
+  var child = children[0];
+  var parentRect = element.getBoundingClientRect();
+  var childRect = child.getBoundingClientRect();
+  var fillsAnAxis = Math.abs(childRect.width - parentRect.width) <= 1 || Math.abs(childRect.height - parentRect.height) <= 1;
+  return fillsAnAxis ? child : element;
+};
 var useLockBodyScroll = function useLockBodyScroll(shouldLock) {
   var scrollLockRef = useScrollLock({
     enabled: true,
@@ -150,5 +207,5 @@ var useLockBodyScroll = function useLockBodyScroll(shouldLock) {
   }, [shouldLock, scrollLockRef]);
 };
 
-export { smoothScroll, useDelayedState, useIntersectionObserver, useIsTransitioningBetweenSteps, useLockBodyScroll };
+export { readBorderRadius, resolveSpotlightTarget, smoothScroll, useDelayedState, useIntersectionObserver, useIsTransitioningBetweenSteps, useLockBodyScroll };
 //# sourceMappingURL=utils.js.map