@bikdotai/bik-component-library 0.0.852-beta.9 → 0.0.853-beta.0

package/dist/esm/components/feature-announcements/MajorUpdatePopup.js.map

@@ -1 +1 @@
-{"version":3,"file":"MajorUpdatePopup.js","sources":["../../../../src/components/feature-announcements/MajorUpdatePopup.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport Arrow from '../../assets/icons/chevronRight2.svg';\nimport PlayIcon from '../../assets/icons/play.svg';\nimport { TEXT } from './constants';\nimport { getMajorPopupStyles } from './styles';\nimport { MajorUpdatePopupProps } from './types';\nimport {\n\tcalculateCloseTransform,\n\tdecodeHTMLEntities,\n\texecuteAfterAnimation,\n\tfindWhatsNewButton,\n\thideJoyrideArrow,\n} from './utils';\n\nconst MajorUpdatePopup: React.FC<MajorUpdatePopupProps> = ({\n\tfeature,\n\tcurrentIndex,\n\ttotalFeatures,\n\tonSkip,\n\tonExplore,\n\tonPrevious,\n\tonNext,\n\tsetIsClosing: setIsClosingParent,\n\tonSecondaryAction,\n\tratio = '16:9',\n\tpadding,\n}) => {\n\tconst [isClosing, setIsClosing] = useState(false);\n\tconst [startAnimation, setStartAnimation] = useState(false);\n\tconst [transform, setTransform] = useState('');\n\tconst popupRef = useRef<HTMLDivElement>(null);\n\tconst [isVideoPaused, setIsVideoPaused] = useState(false);\n\tconst [showPlayIcon, setShowPlayIcon] = useState(true);\n\tconst videoRef = useRef<HTMLVideoElement>(null);\n\tconst [imageAspectRatio, setImageAspectRatio] = useState<\n\t\t'16:9' | '1:1' | '4:3'\n\t>(ratio);\n\n\tconst imageRef = useRef<HTMLImageElement>(null);\n\n\tuseEffect(() => {\n\t\tif (isClosing) {\n\t\t\t// Start the shrink animation immediately\n\t\t\tsetStartAnimation(true);\n\t\t}\n\t}, [isClosing]);\n\n\tconst handleClose = (callback: () => Promise<void> | void): void => {\n\t\thideJoyrideArrow(popupRef.current);\n\n\t\tconst targetButton = findWhatsNewButton();\n\n\t\tif (targetButton && popupRef.current) {\n\t\t\tconst transformValue = calculateCloseTransform(\n\t\t\t\tpopupRef.current,\n\t\t\t\ttargetButton,\n\t\t\t);\n\t\t\tsetTransform(transformValue);\n\t\t} else {\n\t\t\tsetTransform('scale(0)');\n\t\t}\n\n\t\tsetIsClosingParent?.(true);\n\t\tsetIsClosing(true);\n\t\texecuteAfterAnimation(callback);\n\t};\n\n\tconst handleImageLoad = (e: React.SyntheticEvent<HTMLImageElement>) => {\n\t\tconst img = e.currentTarget;\n\t\tconst width = img.naturalWidth;\n\t\tconst height = img.naturalHeight;\n\n\t\tif (width && height) {\n\t\t\tconst aspectRatio = width / height;\n\n\t\t\t// Determine closest predefined ratio\n\t\t\tif (Math.abs(aspectRatio - 16 / 9) < 0.1) {\n\t\t\t\tsetImageAspectRatio('16:9');\n\t\t\t} else if (Math.abs(aspectRatio - 1) < 0.1) {\n\t\t\t\tsetImageAspectRatio('1:1');\n\t\t\t} else if (Math.abs(aspectRatio - 4 / 3) < 0.1) {\n\t\t\t\tsetImageAspectRatio('4:3');\n\t\t\t} else if (aspectRatio > 1.5) {\n\t\t\t\t// Wide images default to 16:9\n\t\t\t\tsetImageAspectRatio('16:9');\n\t\t\t} else if (aspectRatio < 0.9) {\n\t\t\t\t// Tall images default to 4:3\n\t\t\t\tsetImageAspectRatio('4:3');\n\t\t\t} else {\n\t\t\t\t// Close to square, use 1:1\n\t\t\t\tsetImageAspectRatio('1:1');\n\t\t\t}\n\t\t}\n\t};\n\n\tconst handleVideoLoadedMetadata = (\n\t\te: React.SyntheticEvent<HTMLVideoElement>,\n\t) => {\n\t\tconst video = e.currentTarget;\n\t\tconst width = video.videoWidth;\n\t\tconst height = video.videoHeight;\n\n\t\tif (width && height) {\n\t\t\tconst aspectRatio = width / height;\n\n\t\t\tif (Math.abs(aspectRatio - 16 / 9) < 0.1) {\n\t\t\t\tsetImageAspectRatio('16:9');\n\t\t\t} else if (Math.abs(aspectRatio - 1) < 0.1) {\n\t\t\t\tsetImageAspectRatio('1:1');\n\t\t\t} else if (Math.abs(aspectRatio - 4 / 3) < 0.1) {\n\t\t\t\tsetImageAspectRatio('4:3');\n\t\t\t} else if (aspectRatio > 1.5) {\n\t\t\t\t// Wide videos default to 16:9\n\t\t\t\tsetImageAspectRatio('16:9');\n\t\t\t} else if (aspectRatio < 0.9) {\n\t\t\t\t// Tall videos default to 4:3\n\t\t\t\tsetImageAspectRatio('4:3');\n\t\t\t} else {\n\t\t\t\t// Close to square, use 1:1\n\t\t\t\tsetImageAspectRatio('1:1');\n\t\t\t}\n\t\t}\n\t};\n\n\tconst handleExplore = (): void => {\n\t\tconst action = feature.primaryButton?.action;\n\n\t\tif (action === 'Open link') {\n\t\t\tconst url = feature.primaryButton?.redirectionUrl || feature.redirectUrl;\n\t\t\tif (url) {\n\t\t\t\tconst isExternal = url.startsWith('http');\n\t\t\t\tif (isExternal) {\n\t\t\t\t\twindow.open(url, '_blank', 'noopener,noreferrer');\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tonExplore(action);\n\n\t\t// Run closing animation in background\n\t\thideJoyrideArrow(popupRef.current);\n\t\tconst targetButton = findWhatsNewButton();\n\t\tif (targetButton && popupRef.current) {\n\t\t\tconst transformValue = calculateCloseTransform(\n\t\t\t\tpopupRef.current,\n\t\t\t\ttargetButton,\n\t\t\t);\n\t\t\tsetTransform(transformValue);\n\t\t} else {\n\t\t\tsetTransform('scale(0)');\n\t\t}\n\t\tsetIsClosingParent?.(true);\n\t\tsetIsClosing(true);\n\t};\n\n\tconst handleSkipClick = (e: React.MouseEvent<HTMLButtonElement>): void => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\thandleClose(onSkip);\n\t};\n\n\tconst handlePreviousClick = (\n\t\te: React.MouseEvent<HTMLButtonElement>,\n\t): void => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\tonPrevious();\n\t};\n\n\tconst handleNextClick = (e: React.MouseEvent<HTMLButtonElement>): void => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\tonNext();\n\t};\n\n\tconst handleSecondaryAction = (e: React.MouseEvent): void => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\n\t\tconst action = feature.secondaryButton?.action;\n\t\tconst closeCallback: (triggeredAction?: string) => Promise<void> | void =\n\t\t\tonSecondaryAction || onSkip;\n\t\tlet internalUrl: string | null = null;\n\n\t\t// Handle based on action type. 'Play Video' is opened by closeCallback so the\n\t\t// click is not attributed to the primary button via onExplore.\n\t\tif (action === 'Open link') {\n\t\t\tconst url = feature.secondaryButton?.redirectionUrl;\n\t\t\tif (url) {\n\t\t\t\tconst isExternal = url.startsWith('http');\n\t\t\t\tif (isExternal) {\n\t\t\t\t\twindow.open(url, '_blank', 'noopener,noreferrer');\n\t\t\t\t} else {\n\t\t\t\t\tinternalUrl = url;\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (action === 'Close popup' || action === '') {\n\t\t\t// Just close the popup (empty action also closes)\n\t\t\t// callback is executed after closing animation completes\n\t\t}\n\n\t\t// Always close popup after secondary action\n\t\thideJoyrideArrow(popupRef.current);\n\t\tconst targetButton = findWhatsNewButton();\n\t\tif (targetButton && popupRef.current) {\n\t\t\tconst transformValue = calculateCloseTransform(\n\t\t\t\tpopupRef.current,\n\t\t\t\ttargetButton,\n\t\t\t);\n\t\t\tsetTransform(transformValue);\n\t\t} else {\n\t\t\tsetTransform('scale(0)');\n\t\t}\n\t\tsetIsClosingParent?.(true);\n\t\tsetIsClosing(true);\n\t\texecuteAfterAnimation(async () => {\n\t\t\tawait closeCallback(action);\n\t\t\tif (internalUrl) {\n\t\t\t\twindow.location.href = internalUrl;\n\t\t\t}\n\t\t});\n\t};\n\n\tconst styles = getMajorPopupStyles(\n\t\tstartAnimation,\n\t\ttransform,\n\t\timageAspectRatio,\n\t\tpadding || feature.padding,\n\t\tfeature.primaryButton?.style,\n\t\tfeature.secondaryButton?.style,\n\t);\n\n\tconst handleVideoClick = (e: React.MouseEvent) => {\n\t\te.stopPropagation();\n\t\tif (videoRef.current) {\n\t\t\tif (videoRef.current.paused) {\n\t\t\t\tvideoRef.current.play();\n\t\t\t\tsetIsVideoPaused(false);\n\t\t\t\tsetShowPlayIcon(false);\n\t\t\t} else {\n\t\t\t\tvideoRef.current.pause();\n\t\t\t\tsetIsVideoPaused(true);\n\t\t\t\tsetShowPlayIcon(true);\n\t\t\t}\n\t\t}\n\t};\n\n\tconst handleVideoKeyDown = (e: React.KeyboardEvent) => {\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\te.preventDefault();\n\t\t\te.stopPropagation();\n\t\t\tif (videoRef.current) {\n\t\t\t\tif (videoRef.current.paused) {\n\t\t\t\t\tvideoRef.current.play();\n\t\t\t\t\tsetIsVideoPaused(false);\n\t\t\t\t\tsetShowPlayIcon(false);\n\t\t\t\t} else {\n\t\t\t\t\tvideoRef.current.pause();\n\t\t\t\t\tsetIsVideoPaused(true);\n\t\t\t\t\tsetShowPlayIcon(true);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n\n\treturn (\n\t\t<div style={styles.outerWrapper}>\n\t\t\t<div\n\t\t\t\tref={popupRef}\n\t\t\t\tstyle={{\n\t\t\t\t\t...styles.container,\n\t\t\t\t\topacity: startAnimation ? 0 : 1,\n\t\t\t\t\ttransition: 'opacity 0.2s ease-in-out, transform 0.3s ease',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<style>{`\n\t\t\t\t[data-popup-content] ul {\n\t\t\t\t\tmargin: 0;\n\t\t\t\t\tpadding-left: 20px;\n\t\t\t\t\tlist-style-type: disc;\n\t\t\t\t}\n\t\t\t\t[data-popup-content] ul li {\n\t\t\t\t\tmargin-bottom: 8px;\n\t\t\t\t\tcolor: rgba(255, 255, 255, 0.8);\n\t\t\t\t\tfont-size: 12px;\n\t\t\t\t\tline-height: 16px;\n\t\t\t\t\tfont-family: Inter, sans-serif;\n\t\t\t\t}\n\t\t\t`}</style>\n\t\t\t\t{/* Content Wrapper - contains image and text side by side */}\n\t\t\t\t<div style={styles.contentWrapper}>\n\t\t\t\t\t{/* Image/Video section */}\n\t\t\t\t\t<div style={styles.imageContainer}>\n\t\t\t\t\t\t{feature.productVideo ? (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<video\n\t\t\t\t\t\t\t\t\tref={videoRef}\n\t\t\t\t\t\t\t\t\tsrc={feature.productVideo}\n\t\t\t\t\t\t\t\t\tstyle={styles.image}\n\t\t\t\t\t\t\t\t\tautoPlay\n\t\t\t\t\t\t\t\t\tmuted\n\t\t\t\t\t\t\t\t\tloop\n\t\t\t\t\t\t\t\t\tplaysInline\n\t\t\t\t\t\t\t\t\tcontrols\n\t\t\t\t\t\t\t\t\taria-label={`Product video for ${feature.title}`}\n\t\t\t\t\t\t\t\t\tonLoadedMetadata={handleVideoLoadedMetadata}\n\t\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t\t{(isVideoPaused || showPlayIcon) && (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={styles.videoOverlay}\n\t\t\t\t\t\t\t\t\t\tonClick={handleVideoClick}\n\t\t\t\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t\t\t\ttabIndex={0}\n\t\t\t\t\t\t\t\t\t\taria-label={isVideoPaused ? 'Play video' : 'Pause video'}\n\t\t\t\t\t\t\t\t\t\tonKeyDown={handleVideoKeyDown}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<PlayIcon width={20} height={20} />\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) : feature.displayImage ? (\n\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\tref={imageRef}\n\t\t\t\t\t\t\t\tsrc={feature.displayImage}\n\t\t\t\t\t\t\t\talt={feature.title}\n\t\t\t\t\t\t\t\tstyle={styles.image}\n\t\t\t\t\t\t\t\tonLoad={handleImageLoad}\n\t\t\t\t\t\t\t\tonError={(e) => {\n\t\t\t\t\t\t\t\t\tif (feature.image) {\n\t\t\t\t\t\t\t\t\t\t(e.target as HTMLImageElement).src = feature.image;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<div style={styles.imagePlaceholder}>\n\t\t\t\t\t\t\t\t{TEXT.FEATURE_PREVIEW_PLACEHOLDER}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/* Content section */}\n\t\t\t\t\t<div style={styles.contentContainer}>\n\t\t\t\t\t\t{/* Skip Button at top-right */}\n\t\t\t\t\t\t<div style={styles.skipButtonContainer}>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tonClick={handleSkipClick}\n\t\t\t\t\t\t\t\tstyle={styles.skipButton.base}\n\t\t\t\t\t\t\t\tonMouseEnter={(e) =>\n\t\t\t\t\t\t\t\t\tObject.assign(e.currentTarget.style, styles.skipButton.hover)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonMouseLeave={(e) =>\n\t\t\t\t\t\t\t\t\tObject.assign(e.currentTarget.style, styles.skipButton.base)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\taria-label=\"Skip feature announcement\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tSkip\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t{/* Title */}\n\t\t\t\t\t\t<h3 style={styles.title}>{feature.title}</h3>\n\n\t\t\t\t\t\t{/* Content/Description */}\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tdata-popup-content\n\t\t\t\t\t\t\tstyle={styles.content}\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t\t\t\t__html: decodeHTMLEntities(\n\t\t\t\t\t\t\t\t\tfeature.content || feature.body || '',\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t{/* Actions - Buttons and Navigation */}\n\t\t\t\t\t\t<div style={styles.actionsWrapper}>\n\t\t\t\t\t\t\t<div style={styles.buttonsGroup}>\n\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\tonClick={handleExplore}\n\t\t\t\t\t\t\t\t\tstyle={styles.exploreButton.base}\n\t\t\t\t\t\t\t\t\tonMouseEnter={(e) =>\n\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\tstyles.exploreButton.hover,\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonMouseLeave={(e) =>\n\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\tstyles.exploreButton.base,\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{feature.primaryButton?.text ||\n\t\t\t\t\t\t\t\t\t\tfeature.buttonText ||\n\t\t\t\t\t\t\t\t\t\tTEXT.DEFAULT_BUTTON_TEXT}\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t{/* Secondary Button (Optional) */}\n\t\t\t\t\t\t\t\t{feature.secondaryButton?.text &&\n\t\t\t\t\t\t\t\t\t(feature.secondaryButton?.redirectionUrl &&\n\t\t\t\t\t\t\t\t\tfeature.secondaryButton?.action !== 'Play Video' ? (\n\t\t\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t\t\thref={feature.secondaryButton.redirectionUrl}\n\t\t\t\t\t\t\t\t\t\t\ttarget={\n\t\t\t\t\t\t\t\t\t\t\t\tfeature.secondaryButton.redirectionUrl.startsWith(\n\t\t\t\t\t\t\t\t\t\t\t\t\t'http',\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t? '_blank'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: '_self'\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\trel={\n\t\t\t\t\t\t\t\t\t\t\t\tfeature.secondaryButton.redirectionUrl.startsWith(\n\t\t\t\t\t\t\t\t\t\t\t\t\t'http',\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 'noopener noreferrer'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tonClick={handleSecondaryAction}\n\t\t\t\t\t\t\t\t\t\t\tstyle={styles.secondaryButton.base}\n\t\t\t\t\t\t\t\t\t\t\tonMouseEnter={(e) =>\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.secondaryButton.hover,\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tonMouseLeave={(e) =>\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.secondaryButton.base,\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{feature.secondaryButton.text}\n\t\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\tonClick={handleSecondaryAction}\n\t\t\t\t\t\t\t\t\t\t\tstyle={styles.secondaryButton.base}\n\t\t\t\t\t\t\t\t\t\t\tonMouseEnter={(e) =>\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.secondaryButton.hover,\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tonMouseLeave={(e) =>\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.secondaryButton.base,\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{feature.secondaryButton.text}\n\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t{/* Navigation arrows */}\n\t\t\t\t\t\t\t{totalFeatures > 1 && (\n\t\t\t\t\t\t\t\t<div style={styles.navigationContainer}>\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tonClick={handlePreviousClick}\n\t\t\t\t\t\t\t\t\t\tdisabled={currentIndex === 0}\n\t\t\t\t\t\t\t\t\t\tstyle={styles.navigationButton(currentIndex === 0).base}\n\t\t\t\t\t\t\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tif (currentIndex !== 0) {\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.navigationButton(false).hover,\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tif (currentIndex !== 0) {\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.navigationButton(false).base,\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\taria-label=\"Previous feature\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<Arrow style={{ transform: 'rotate(180deg)' }} />\n\t\t\t\t\t\t\t\t\t</button>\n\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tonClick={handleNextClick}\n\t\t\t\t\t\t\t\t\t\tdisabled={currentIndex === totalFeatures - 1}\n\t\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\t\tstyles.navigationButton(\n\t\t\t\t\t\t\t\t\t\t\t\tcurrentIndex === totalFeatures - 1,\n\t\t\t\t\t\t\t\t\t\t\t).base\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tif (currentIndex !== totalFeatures - 1) {\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.navigationButton(false).hover,\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tif (currentIndex !== totalFeatures - 1) {\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.navigationButton(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcurrentIndex === totalFeatures - 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\t).base,\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\taria-label=\"Next feature\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<Arrow />\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t{/* Close contentWrapper */}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default MajorUpdatePopup;\n"],"names":["MajorUpdatePopup","feature","currentIndex","totalFeatures","onSkip","onExplore","onPrevious","onNext","setIsClosingParent","onSecondaryAction","ratio","padding","isClosing","setIsClosing","useState","startAnimation","setStartAnimation","transform","setTransform","popupRef","useRef","isVideoPaused","setIsVideoPaused","showPlayIcon","setShowPlayIcon","videoRef","imageAspectRatio","setImageAspectRatio","imageRef","useEffect","handleClose","callback","hideJoyrideArrow","targetButton","findWhatsNewButton","transformValue","calculateCloseTransform","executeAfterAnimation","handleImageLoad","e","img","width","height","aspectRatio","handleVideoLoadedMetadata","video","handleExplore","action","url","handleSkipClick","handlePreviousClick","handleNextClick","handleSecondaryAction","closeCallback","internalUrl","styles","getMajorPopupStyles","handleVideoClick","handleVideoKeyDown","jsx","jsxs","Fragment","PlayIcon","TEXT","decodeHTMLEntities","Arrow"],"mappings":";;;;;;;;;AAcA,MAAMA,KAAoD,CAAC;AAAA,EAC1D,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,QAAAC;AAAA,EACA,cAAcC;AAAA,EACd,mBAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,SAAAC;AACD,MAAM;AACL,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAgBC,CAAiB,IAAIF,EAAS,EAAK,GACpD,CAACG,GAAWC,CAAY,IAAIJ,EAAS,EAAE,GACvCK,IAAWC,EAAuB,IAAI,GACtC,CAACC,GAAeC,CAAgB,IAAIR,EAAS,EAAK,GAClD,CAACS,GAAcC,CAAe,IAAIV,EAAS,EAAI,GAC/CW,IAAWL,EAAyB,IAAI,GACxC,CAACM,GAAkBC,CAAmB,IAAIb,EAE9CJ,CAAK,GAEDkB,IAAWR,EAAyB,IAAI;AAE9C,EAAAS,GAAU,MAAM;AACf,IAAIjB,KAEHI,EAAkB,EAAI;AAAA,EAExB,GAAG,CAACJ,CAAS,CAAC;AAEd,QAAMkB,IAAc,CAACC,MAA+C;AACnE,IAAAC,EAAiBb,EAAS,OAAO;AAEjC,UAAMc,IAAeC,EAAA;AAErB,QAAID,KAAgBd,EAAS,SAAS;AACrC,YAAMgB,IAAiBC;AAAA,QACtBjB,EAAS;AAAA,QACTc;AAAA,MAAA;AAED,MAAAf,EAAaiB,CAAc;AAAA,IAC5B;AACC,MAAAjB,EAAa,UAAU;AAGxB,IAAAV,IAAqB,EAAI,GACzBK,EAAa,EAAI,GACjBwB,EAAsBN,CAAQ;AAAA,EAC/B,GAEMO,IAAkB,CAACC,MAA8C;AACtE,UAAMC,IAAMD,EAAE,eACRE,IAAQD,EAAI,cACZE,IAASF,EAAI;AAEnB,QAAIC,KAASC,GAAQ;AACpB,YAAMC,IAAcF,IAAQC;AAG5B,MAAI,KAAK,IAAIC,IAAc,KAAK,CAAC,IAAI,MACpChB,EAAoB,MAAM,IAChB,KAAK,IAAIgB,IAAc,CAAC,IAAI,MACtChB,EAAoB,KAAK,IACf,KAAK,IAAIgB,IAAc,IAAI,CAAC,IAAI,MAC1ChB,EAAoB,KAAK,IACfgB,IAAc,MAExBhB,EAAoB,MAAM,IAChBgB,IAAc,MAExBhB,EAAoB,KAAK,IAGzBA,EAAoB,KAAK;AAAA,IAE3B;AAAA,EACD,GAEMiB,IAA4B,CACjCL,MACI;AACJ,UAAMM,IAAQN,EAAE,eACVE,IAAQI,EAAM,YACdH,IAASG,EAAM;AAErB,QAAIJ,KAASC,GAAQ;AACpB,YAAMC,IAAcF,IAAQC;AAE5B,MAAI,KAAK,IAAIC,IAAc,KAAK,CAAC,IAAI,MACpChB,EAAoB,MAAM,IAChB,KAAK,IAAIgB,IAAc,CAAC,IAAI,MACtChB,EAAoB,KAAK,IACf,KAAK,IAAIgB,IAAc,IAAI,CAAC,IAAI,MAC1ChB,EAAoB,KAAK,IACfgB,IAAc,MAExBhB,EAAoB,MAAM,IAChBgB,IAAc,MAExBhB,EAAoB,KAAK,IAGzBA,EAAoB,KAAK;AAAA,IAE3B;AAAA,EACD,GAEMmB,IAAgB,MAAY;AACjC,UAAMC,IAAS9C,EAAQ,eAAe;AAEtC,QAAI8C,MAAW,aAAa;AAC3B,YAAMC,IAAM/C,EAAQ,eAAe,kBAAkBA,EAAQ;AAC7D,MAAI+C,KACgBA,EAAI,WAAW,MAAM,KAEvC,OAAO,KAAKA,GAAK,UAAU,qBAAqB;AAAA,IAGnD;AACA,IAAA3C,EAAU0C,CAAM,GAGhBf,EAAiBb,EAAS,OAAO;AACjC,UAAMc,IAAeC,EAAA;AACrB,QAAID,KAAgBd,EAAS,SAAS;AACrC,YAAMgB,IAAiBC;AAAA,QACtBjB,EAAS;AAAA,QACTc;AAAA,MAAA;AAED,MAAAf,EAAaiB,CAAc;AAAA,IAC5B;AACC,MAAAjB,EAAa,UAAU;AAExB,IAAAV,IAAqB,EAAI,GACzBK,EAAa,EAAI;AAAA,EAClB,GAEMoC,IAAkB,CAACV,MAAiD;AACzE,IAAAA,EAAE,eAAA,GACFA,EAAE,gBAAA,GACFT,EAAY1B,CAAM;AAAA,EACnB,GAEM8C,IAAsB,CAC3BX,MACU;AACV,IAAAA,EAAE,eAAA,GACFA,EAAE,gBAAA,GACFjC,EAAA;AAAA,EACD,GAEM6C,IAAkB,CAACZ,MAAiD;AACzE,IAAAA,EAAE,eAAA,GACFA,EAAE,gBAAA,GACFhC,EAAA;AAAA,EACD,GAEM6C,IAAwB,CAACb,MAA8B;AAC5D,IAAAA,EAAE,eAAA,GACFA,EAAE,gBAAA;AAEF,UAAMQ,IAAS9C,EAAQ,iBAAiB,QAClCoD,IACL5C,KAAqBL;AACtB,QAAIkD,IAA6B;AAIjC,QAAIP,MAAW,aAAa;AAC3B,YAAMC,IAAM/C,EAAQ,iBAAiB;AACrC,MAAI+C,MACgBA,EAAI,WAAW,MAAM,IAEvC,OAAO,KAAKA,GAAK,UAAU,qBAAqB,IAEhDM,IAAcN;AAAA,IAGjB;AAMA,IAAAhB,EAAiBb,EAAS,OAAO;AACjC,UAAMc,IAAeC,EAAA;AACrB,QAAID,KAAgBd,EAAS,SAAS;AACrC,YAAMgB,IAAiBC;AAAA,QACtBjB,EAAS;AAAA,QACTc;AAAA,MAAA;AAED,MAAAf,EAAaiB,CAAc;AAAA,IAC5B;AACC,MAAAjB,EAAa,UAAU;AAExB,IAAAV,IAAqB,EAAI,GACzBK,EAAa,EAAI,GACjBwB,EAAsB,YAAY;AACjC,YAAMgB,EAAcN,CAAM,GACtBO,MACH,OAAO,SAAS,OAAOA;AAAA,IAEzB,CAAC;AAAA,EACF,GAEMC,IAASC;AAAA,IACdzC;AAAA,IACAE;AAAA,IACAS;AAAA,IACAf,KAAWV,EAAQ;AAAA,IACnBA,EAAQ,eAAe;AAAA,IACvBA,EAAQ,iBAAiB;AAAA,EAAA,GAGpBwD,IAAmB,CAAClB,MAAwB;AACjD,IAAAA,EAAE,gBAAA,GACEd,EAAS,YACRA,EAAS,QAAQ,UACpBA,EAAS,QAAQ,KAAA,GACjBH,EAAiB,EAAK,GACtBE,EAAgB,EAAK,MAErBC,EAAS,QAAQ,MAAA,GACjBH,EAAiB,EAAI,GACrBE,EAAgB,EAAI;AAAA,EAGvB,GAEMkC,IAAqB,CAACnB,MAA2B;AACtD,KAAIA,EAAE,QAAQ,WAAWA,EAAE,QAAQ,SAClCA,EAAE,eAAA,GACFA,EAAE,gBAAA,GACEd,EAAS,YACRA,EAAS,QAAQ,UACpBA,EAAS,QAAQ,KAAA,GACjBH,EAAiB,EAAK,GACtBE,EAAgB,EAAK,MAErBC,EAAS,QAAQ,MAAA,GACjBH,EAAiB,EAAI,GACrBE,EAAgB,EAAI;AAAA,EAIxB;AAEA,SACC,gBAAAmC,EAAC,OAAA,EAAI,OAAOJ,EAAO,cAClB,UAAA,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,KAAKzC;AAAA,MACL,OAAO;AAAA,QACN,GAAGoC,EAAO;AAAA,QACV,SAASxC,IAAiB,IAAI;AAAA,QAC9B,YAAY;AAAA,MAAA;AAAA,MAGb,UAAA;AAAA,QAAA,gBAAA4C,EAAC,SAAA,EAAO,UAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAaP;AAAA,QAED,gBAAAC,EAAC,OAAA,EAAI,OAAOL,EAAO,gBAElB,UAAA;AAAA,UAAA,gBAAAI,EAAC,SAAI,OAAOJ,EAAO,gBACjB,UAAAtD,EAAQ,eACR,gBAAA2D,EAAAC,GAAA,EACC,UAAA;AAAA,YAAA,gBAAAF;AAAA,cAAC;AAAA,cAAA;AAAA,gBACA,KAAKlC;AAAA,gBACL,KAAKxB,EAAQ;AAAA,gBACb,OAAOsD,EAAO;AAAA,gBACd,UAAQ;AAAA,gBACR,OAAK;AAAA,gBACL,MAAI;AAAA,gBACJ,aAAW;AAAA,gBACX,UAAQ;AAAA,gBACR,cAAY,qBAAqBtD,EAAQ,KAAK;AAAA,gBAC9C,kBAAkB2C;AAAA,cAAA;AAAA,YAAA;AAAA,aAGjBvB,KAAiBE,MAClB,gBAAAoC;AAAA,cAAC;AAAA,cAAA;AAAA,gBACA,OAAOJ,EAAO;AAAA,gBACd,SAASE;AAAA,gBACT,MAAK;AAAA,gBACL,UAAU;AAAA,gBACV,cAAYpC,IAAgB,eAAe;AAAA,gBAC3C,WAAWqC;AAAA,gBAEX,UAAA,gBAAAC,EAACG,IAAA,EAAS,OAAO,IAAI,QAAQ,GAAA,CAAI;AAAA,cAAA;AAAA,YAAA;AAAA,UAClC,GAEF,IACG7D,EAAQ,eACX,gBAAA0D;AAAA,YAAC;AAAA,YAAA;AAAA,cACA,KAAK/B;AAAA,cACL,KAAK3B,EAAQ;AAAA,cACb,KAAKA,EAAQ;AAAA,cACb,OAAOsD,EAAO;AAAA,cACd,QAAQjB;AAAA,cACR,SAAS,CAACC,MAAM;AACf,gBAAItC,EAAQ,UACVsC,EAAE,OAA4B,MAAMtC,EAAQ;AAAA,cAE/C;AAAA,YAAA;AAAA,UAAA,sBAGA,OAAA,EAAI,OAAOsD,EAAO,kBACjB,UAAAQ,EAAK,6BACP,GAEF;AAAA,UAGA,gBAAAH,EAAC,OAAA,EAAI,OAAOL,EAAO,kBAElB,UAAA;AAAA,YAAA,gBAAAI,EAAC,OAAA,EAAI,OAAOJ,EAAO,qBAClB,UAAA,gBAAAI;AAAA,cAAC;AAAA,cAAA;AAAA,gBACA,SAASV;AAAA,gBACT,OAAOM,EAAO,WAAW;AAAA,gBACzB,cAAc,CAAChB,MACd,OAAO,OAAOA,EAAE,cAAc,OAAOgB,EAAO,WAAW,KAAK;AAAA,gBAE7D,cAAc,CAAChB,MACd,OAAO,OAAOA,EAAE,cAAc,OAAOgB,EAAO,WAAW,IAAI;AAAA,gBAE5D,cAAW;AAAA,gBACX,UAAA;AAAA,cAAA;AAAA,YAAA,GAGF;AAAA,8BAGC,MAAA,EAAG,OAAOA,EAAO,OAAQ,YAAQ,OAAM;AAAA,YAGxC,gBAAAI;AAAA,cAAC;AAAA,cAAA;AAAA,gBACA,sBAAkB;AAAA,gBAClB,OAAOJ,EAAO;AAAA,gBACd,yBAAyB;AAAA,kBACxB,QAAQS;AAAA,oBACP/D,EAAQ,WAAWA,EAAQ,QAAQ;AAAA,kBAAA;AAAA,gBACpC;AAAA,cACD;AAAA,YAAA;AAAA,YAID,gBAAA2D,EAAC,OAAA,EAAI,OAAOL,EAAO,gBAClB,UAAA;AAAA,cAAA,gBAAAK,EAAC,OAAA,EAAI,OAAOL,EAAO,cAClB,UAAA;AAAA,gBAAA,gBAAAI;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACA,SAASb;AAAA,oBACT,OAAOS,EAAO,cAAc;AAAA,oBAC5B,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,cAAc;AAAA,oBAAA;AAAA,oBAGvB,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,cAAc;AAAA,oBAAA;AAAA,oBAItB,UAAAtD,EAAQ,eAAe,QACvBA,EAAQ,cACR8D,EAAK;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGN9D,EAAQ,iBAAiB,SACxBA,EAAQ,iBAAiB,kBAC1BA,EAAQ,iBAAiB,WAAW,eACnC,gBAAA0D;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACA,MAAM1D,EAAQ,gBAAgB;AAAA,oBAC9B,QACCA,EAAQ,gBAAgB,eAAe;AAAA,sBACtC;AAAA,oBAAA,IAEE,WACA;AAAA,oBAEJ,KACCA,EAAQ,gBAAgB,eAAe;AAAA,sBACtC;AAAA,oBAAA,IAEE,wBACA;AAAA,oBAEJ,SAASmD;AAAA,oBACT,OAAOG,EAAO,gBAAgB;AAAA,oBAC9B,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,gBAAgB;AAAA,oBAAA;AAAA,oBAGzB,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,gBAAgB;AAAA,oBAAA;AAAA,oBAIxB,YAAQ,gBAAgB;AAAA,kBAAA;AAAA,gBAAA,IAG1B,gBAAAI;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACA,SAASP;AAAA,oBACT,OAAOG,EAAO,gBAAgB;AAAA,oBAC9B,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,gBAAgB;AAAA,oBAAA;AAAA,oBAGzB,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,gBAAgB;AAAA,oBAAA;AAAA,oBAIxB,YAAQ,gBAAgB;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAC1B,GAEH;AAAA,cAGCpD,IAAgB,KAChB,gBAAAyD,EAAC,OAAA,EAAI,OAAOL,EAAO,qBAClB,UAAA;AAAA,gBAAA,gBAAAI;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACA,SAAST;AAAA,oBACT,UAAUhD,MAAiB;AAAA,oBAC3B,OAAOqD,EAAO,iBAAiBrD,MAAiB,CAAC,EAAE;AAAA,oBACnD,cAAc,CAACqC,MAAM;AACpB,sBAAIrC,MAAiB,KACpB,OAAO;AAAA,wBACNqC,EAAE,cAAc;AAAA,wBAChBgB,EAAO,iBAAiB,EAAK,EAAE;AAAA,sBAAA;AAAA,oBAGlC;AAAA,oBACA,cAAc,CAAChB,MAAM;AACpB,sBAAIrC,MAAiB,KACpB,OAAO;AAAA,wBACNqC,EAAE,cAAc;AAAA,wBAChBgB,EAAO,iBAAiB,EAAK,EAAE;AAAA,sBAAA;AAAA,oBAGlC;AAAA,oBACA,cAAW;AAAA,oBAEX,4BAACU,GAAA,EAAM,OAAO,EAAE,WAAW,mBAAiB,CAAG;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGhD,gBAAAN;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACA,SAASR;AAAA,oBACT,UAAUjD,MAAiBC,IAAgB;AAAA,oBAC3C,OACCoD,EAAO;AAAA,sBACNrD,MAAiBC,IAAgB;AAAA,oBAAA,EAChC;AAAA,oBAEH,cAAc,CAACoC,MAAM;AACpB,sBAAIrC,MAAiBC,IAAgB,KACpC,OAAO;AAAA,wBACNoC,EAAE,cAAc;AAAA,wBAChBgB,EAAO,iBAAiB,EAAK,EAAE;AAAA,sBAAA;AAAA,oBAGlC;AAAA,oBACA,cAAc,CAAChB,MAAM;AACpB,sBAAIrC,MAAiBC,IAAgB,KACpC,OAAO;AAAA,wBACNoC,EAAE,cAAc;AAAA,wBAChBgB,EAAO;AAAA,0BACNrD,MAAiBC,IAAgB;AAAA,wBAAA,EAChC;AAAA,sBAAA;AAAA,oBAGL;AAAA,oBACA,cAAW;AAAA,oBAEX,4BAAC8D,GAAA,CAAA,CAAM;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACR,EAAA,CACD;AAAA,YAAA,EAAA,CAEF;AAAA,UAAA,EAAA,CACD;AAAA,QAAA,EAAA,CAED;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAEF;AAEF;"}
+{"version":3,"file":"MajorUpdatePopup.js","sources":["../../../../src/components/feature-announcements/MajorUpdatePopup.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport Arrow from '../../assets/icons/chevronRight2.svg';\nimport PlayIcon from '../../assets/icons/play.svg';\nimport { TEXT } from './constants';\nimport { getMajorPopupStyles } from './styles';\nimport { MajorUpdatePopupProps } from './types';\nimport {\n\tcalculateCloseTransform,\n\tdecodeHTMLEntities,\n\texecuteAfterAnimation,\n\tfindWhatsNewButton,\n\thideJoyrideArrow,\n} from './utils';\n\nconst MajorUpdatePopup: React.FC<MajorUpdatePopupProps> = ({\n\tfeature,\n\tcurrentIndex,\n\ttotalFeatures,\n\tonSkip,\n\tonExplore,\n\tonPrevious,\n\tonNext,\n\tsetIsClosing: setIsClosingParent,\n\tonSecondaryAction,\n\tratio = '16:9',\n\tpadding,\n}) => {\n\tconst [isClosing, setIsClosing] = useState(false);\n\tconst [startAnimation, setStartAnimation] = useState(false);\n\tconst [transform, setTransform] = useState('');\n\tconst popupRef = useRef<HTMLDivElement>(null);\n\tconst [isVideoPaused, setIsVideoPaused] = useState(false);\n\tconst [showPlayIcon, setShowPlayIcon] = useState(true);\n\tconst videoRef = useRef<HTMLVideoElement>(null);\n\tconst [imageAspectRatio, setImageAspectRatio] = useState<\n\t\t'16:9' | '1:1' | '4:3'\n\t>(ratio);\n\n\tconst imageRef = useRef<HTMLImageElement>(null);\n\n\tuseEffect(() => {\n\t\tif (isClosing) {\n\t\t\t// Start the shrink animation immediately\n\t\t\tsetStartAnimation(true);\n\t\t}\n\t}, [isClosing]);\n\n\tconst handleClose = (callback: () => Promise<void> | void): void => {\n\t\thideJoyrideArrow(popupRef.current);\n\n\t\tconst targetButton = findWhatsNewButton();\n\n\t\tif (targetButton && popupRef.current) {\n\t\t\tconst transformValue = calculateCloseTransform(\n\t\t\t\tpopupRef.current,\n\t\t\t\ttargetButton,\n\t\t\t);\n\t\t\tsetTransform(transformValue);\n\t\t} else {\n\t\t\tsetTransform('scale(0)');\n\t\t}\n\n\t\tsetIsClosingParent?.(true);\n\t\tsetIsClosing(true);\n\t\texecuteAfterAnimation(callback);\n\t};\n\n\tconst handleImageLoad = (e: React.SyntheticEvent<HTMLImageElement>) => {\n\t\tconst img = e.currentTarget;\n\t\tconst width = img.naturalWidth;\n\t\tconst height = img.naturalHeight;\n\n\t\tif (width && height) {\n\t\t\tconst aspectRatio = width / height;\n\n\t\t\t// Determine closest predefined ratio\n\t\t\tif (Math.abs(aspectRatio - 16 / 9) < 0.1) {\n\t\t\t\tsetImageAspectRatio('16:9');\n\t\t\t} else if (Math.abs(aspectRatio - 1) < 0.1) {\n\t\t\t\tsetImageAspectRatio('1:1');\n\t\t\t} else if (Math.abs(aspectRatio - 4 / 3) < 0.1) {\n\t\t\t\tsetImageAspectRatio('4:3');\n\t\t\t} else if (aspectRatio > 1.5) {\n\t\t\t\t// Wide images default to 16:9\n\t\t\t\tsetImageAspectRatio('16:9');\n\t\t\t} else if (aspectRatio < 0.9) {\n\t\t\t\t// Tall images default to 4:3\n\t\t\t\tsetImageAspectRatio('4:3');\n\t\t\t} else {\n\t\t\t\t// Close to square, use 1:1\n\t\t\t\tsetImageAspectRatio('1:1');\n\t\t\t}\n\t\t}\n\t};\n\n\tconst handleVideoLoadedMetadata = (\n\t\te: React.SyntheticEvent<HTMLVideoElement>,\n\t) => {\n\t\tconst video = e.currentTarget;\n\t\tconst width = video.videoWidth;\n\t\tconst height = video.videoHeight;\n\n\t\tif (width && height) {\n\t\t\tconst aspectRatio = width / height;\n\n\t\t\tif (Math.abs(aspectRatio - 16 / 9) < 0.1) {\n\t\t\t\tsetImageAspectRatio('16:9');\n\t\t\t} else if (Math.abs(aspectRatio - 1) < 0.1) {\n\t\t\t\tsetImageAspectRatio('1:1');\n\t\t\t} else if (Math.abs(aspectRatio - 4 / 3) < 0.1) {\n\t\t\t\tsetImageAspectRatio('4:3');\n\t\t\t} else if (aspectRatio > 1.5) {\n\t\t\t\t// Wide videos default to 16:9\n\t\t\t\tsetImageAspectRatio('16:9');\n\t\t\t} else if (aspectRatio < 0.9) {\n\t\t\t\t// Tall videos default to 4:3\n\t\t\t\tsetImageAspectRatio('4:3');\n\t\t\t} else {\n\t\t\t\t// Close to square, use 1:1\n\t\t\t\tsetImageAspectRatio('1:1');\n\t\t\t}\n\t\t}\n\t};\n\n\tconst handleExplore = (): void => {\n\t\tconst action = feature.primaryButton?.action;\n\n\t\tif (action === 'Open link') {\n\t\t\tconst url = feature.primaryButton?.redirectionUrl || feature.redirectUrl;\n\t\t\tif (url) {\n\t\t\t\tconst isExternal = url.startsWith('http');\n\t\t\t\tif (isExternal) {\n\t\t\t\t\twindow.open(url, '_blank', 'noopener,noreferrer');\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tonExplore(action);\n\n\t\t// Run closing animation in background\n\t\thideJoyrideArrow(popupRef.current);\n\t\tconst targetButton = findWhatsNewButton();\n\t\tif (targetButton && popupRef.current) {\n\t\t\tconst transformValue = calculateCloseTransform(\n\t\t\t\tpopupRef.current,\n\t\t\t\ttargetButton,\n\t\t\t);\n\t\t\tsetTransform(transformValue);\n\t\t} else {\n\t\t\tsetTransform('scale(0)');\n\t\t}\n\t\tsetIsClosingParent?.(true);\n\t\tsetIsClosing(true);\n\t};\n\n\tconst handleSkipClick = (e: React.MouseEvent<HTMLButtonElement>): void => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\thandleClose(onSkip);\n\t};\n\n\tconst handlePreviousClick = (\n\t\te: React.MouseEvent<HTMLButtonElement>,\n\t): void => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\tonPrevious();\n\t};\n\n\tconst handleNextClick = (e: React.MouseEvent<HTMLButtonElement>): void => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\tonNext();\n\t};\n\n\tconst handleSecondaryAction = (e: React.MouseEvent): void => {\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\n\t\tconst action = feature.secondaryButton?.action;\n\t\tconst closeCallback = onSecondaryAction || onSkip;\n\t\tlet internalUrl: string | null = null;\n\n\t\t// Handle based on action type\n\t\tif (action === 'Play Video') {\n\t\t\tonExplore('Play Video');\n\t\t} else if (action === 'Open link') {\n\t\t\tconst url = feature.secondaryButton?.redirectionUrl;\n\t\t\tif (url) {\n\t\t\t\tconst isExternal = url.startsWith('http');\n\t\t\t\tif (isExternal) {\n\t\t\t\t\twindow.open(url, '_blank', 'noopener,noreferrer');\n\t\t\t\t} else {\n\t\t\t\t\tinternalUrl = url;\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (action === 'Close popup' || action === '') {\n\t\t\t// Just close the popup (empty action also closes)\n\t\t\t// callback is executed after closing animation completes\n\t\t}\n\n\t\t// Always close popup after secondary action\n\t\thideJoyrideArrow(popupRef.current);\n\t\tconst targetButton = findWhatsNewButton();\n\t\tif (targetButton && popupRef.current) {\n\t\t\tconst transformValue = calculateCloseTransform(\n\t\t\t\tpopupRef.current,\n\t\t\t\ttargetButton,\n\t\t\t);\n\t\t\tsetTransform(transformValue);\n\t\t} else {\n\t\t\tsetTransform('scale(0)');\n\t\t}\n\t\tsetIsClosingParent?.(true);\n\t\tsetIsClosing(true);\n\t\texecuteAfterAnimation(async () => {\n\t\t\tawait closeCallback();\n\t\t\tif (internalUrl) {\n\t\t\t\twindow.location.href = internalUrl;\n\t\t\t}\n\t\t});\n\t};\n\n\tconst styles = getMajorPopupStyles(\n\t\tstartAnimation,\n\t\ttransform,\n\t\timageAspectRatio,\n\t\tpadding || feature.padding,\n\t\tfeature.primaryButton?.style,\n\t\tfeature.secondaryButton?.style,\n\t);\n\n\tconst handleVideoClick = (e: React.MouseEvent) => {\n\t\te.stopPropagation();\n\t\tif (videoRef.current) {\n\t\t\tif (videoRef.current.paused) {\n\t\t\t\tvideoRef.current.play();\n\t\t\t\tsetIsVideoPaused(false);\n\t\t\t\tsetShowPlayIcon(false);\n\t\t\t} else {\n\t\t\t\tvideoRef.current.pause();\n\t\t\t\tsetIsVideoPaused(true);\n\t\t\t\tsetShowPlayIcon(true);\n\t\t\t}\n\t\t}\n\t};\n\n\tconst handleVideoKeyDown = (e: React.KeyboardEvent) => {\n\t\tif (e.key === 'Enter' || e.key === ' ') {\n\t\t\te.preventDefault();\n\t\t\te.stopPropagation();\n\t\t\tif (videoRef.current) {\n\t\t\t\tif (videoRef.current.paused) {\n\t\t\t\t\tvideoRef.current.play();\n\t\t\t\t\tsetIsVideoPaused(false);\n\t\t\t\t\tsetShowPlayIcon(false);\n\t\t\t\t} else {\n\t\t\t\t\tvideoRef.current.pause();\n\t\t\t\t\tsetIsVideoPaused(true);\n\t\t\t\t\tsetShowPlayIcon(true);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t};\n\n\treturn (\n\t\t<div style={styles.outerWrapper}>\n\t\t\t<div\n\t\t\t\tref={popupRef}\n\t\t\t\tstyle={{\n\t\t\t\t\t...styles.container,\n\t\t\t\t\topacity: startAnimation ? 0 : 1,\n\t\t\t\t\ttransition: 'opacity 0.2s ease-in-out, transform 0.3s ease',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<style>{`\n\t\t\t\t[data-popup-content] ul {\n\t\t\t\t\tmargin: 0;\n\t\t\t\t\tpadding-left: 20px;\n\t\t\t\t\tlist-style-type: disc;\n\t\t\t\t}\n\t\t\t\t[data-popup-content] ul li {\n\t\t\t\t\tmargin-bottom: 8px;\n\t\t\t\t\tcolor: rgba(255, 255, 255, 0.8);\n\t\t\t\t\tfont-size: 12px;\n\t\t\t\t\tline-height: 16px;\n\t\t\t\t\tfont-family: Inter, sans-serif;\n\t\t\t\t}\n\t\t\t`}</style>\n\t\t\t\t{/* Content Wrapper - contains image and text side by side */}\n\t\t\t\t<div style={styles.contentWrapper}>\n\t\t\t\t\t{/* Image/Video section */}\n\t\t\t\t\t<div style={styles.imageContainer}>\n\t\t\t\t\t\t{feature.productVideo ? (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<video\n\t\t\t\t\t\t\t\t\tref={videoRef}\n\t\t\t\t\t\t\t\t\tsrc={feature.productVideo}\n\t\t\t\t\t\t\t\t\tstyle={styles.image}\n\t\t\t\t\t\t\t\t\tautoPlay\n\t\t\t\t\t\t\t\t\tmuted\n\t\t\t\t\t\t\t\t\tloop\n\t\t\t\t\t\t\t\t\tplaysInline\n\t\t\t\t\t\t\t\t\tcontrols\n\t\t\t\t\t\t\t\t\taria-label={`Product video for ${feature.title}`}\n\t\t\t\t\t\t\t\t\tonLoadedMetadata={handleVideoLoadedMetadata}\n\t\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t\t{(isVideoPaused || showPlayIcon) && (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={styles.videoOverlay}\n\t\t\t\t\t\t\t\t\t\tonClick={handleVideoClick}\n\t\t\t\t\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\t\t\t\t\ttabIndex={0}\n\t\t\t\t\t\t\t\t\t\taria-label={isVideoPaused ? 'Play video' : 'Pause video'}\n\t\t\t\t\t\t\t\t\t\tonKeyDown={handleVideoKeyDown}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<PlayIcon width={20} height={20} />\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) : feature.displayImage ? (\n\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\tref={imageRef}\n\t\t\t\t\t\t\t\tsrc={feature.displayImage}\n\t\t\t\t\t\t\t\talt={feature.title}\n\t\t\t\t\t\t\t\tstyle={styles.image}\n\t\t\t\t\t\t\t\tonLoad={handleImageLoad}\n\t\t\t\t\t\t\t\tonError={(e) => {\n\t\t\t\t\t\t\t\t\tif (feature.image) {\n\t\t\t\t\t\t\t\t\t\t(e.target as HTMLImageElement).src = feature.image;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<div style={styles.imagePlaceholder}>\n\t\t\t\t\t\t\t\t{TEXT.FEATURE_PREVIEW_PLACEHOLDER}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/* Content section */}\n\t\t\t\t\t<div style={styles.contentContainer}>\n\t\t\t\t\t\t{/* Skip Button at top-right */}\n\t\t\t\t\t\t<div style={styles.skipButtonContainer}>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tonClick={handleSkipClick}\n\t\t\t\t\t\t\t\tstyle={styles.skipButton.base}\n\t\t\t\t\t\t\t\tonMouseEnter={(e) =>\n\t\t\t\t\t\t\t\t\tObject.assign(e.currentTarget.style, styles.skipButton.hover)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonMouseLeave={(e) =>\n\t\t\t\t\t\t\t\t\tObject.assign(e.currentTarget.style, styles.skipButton.base)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\taria-label=\"Skip feature announcement\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tSkip\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t{/* Title */}\n\t\t\t\t\t\t<h3 style={styles.title}>{feature.title}</h3>\n\n\t\t\t\t\t\t{/* Content/Description */}\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tdata-popup-content\n\t\t\t\t\t\t\tstyle={styles.content}\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t\t\t\t__html: decodeHTMLEntities(\n\t\t\t\t\t\t\t\t\tfeature.content || feature.body || '',\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t{/* Actions - Buttons and Navigation */}\n\t\t\t\t\t\t<div style={styles.actionsWrapper}>\n\t\t\t\t\t\t\t<div style={styles.buttonsGroup}>\n\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\tonClick={handleExplore}\n\t\t\t\t\t\t\t\t\tstyle={styles.exploreButton.base}\n\t\t\t\t\t\t\t\t\tonMouseEnter={(e) =>\n\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\tstyles.exploreButton.hover,\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonMouseLeave={(e) =>\n\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\tstyles.exploreButton.base,\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{feature.primaryButton?.text ||\n\t\t\t\t\t\t\t\t\t\tfeature.buttonText ||\n\t\t\t\t\t\t\t\t\t\tTEXT.DEFAULT_BUTTON_TEXT}\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t{/* Secondary Button (Optional) */}\n\t\t\t\t\t\t\t\t{feature.secondaryButton?.text &&\n\t\t\t\t\t\t\t\t\t(feature.secondaryButton?.redirectionUrl &&\n\t\t\t\t\t\t\t\t\tfeature.secondaryButton?.action !== 'Play Video' ? (\n\t\t\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t\t\thref={feature.secondaryButton.redirectionUrl}\n\t\t\t\t\t\t\t\t\t\t\ttarget={\n\t\t\t\t\t\t\t\t\t\t\t\tfeature.secondaryButton.redirectionUrl.startsWith(\n\t\t\t\t\t\t\t\t\t\t\t\t\t'http',\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t? '_blank'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: '_self'\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\trel={\n\t\t\t\t\t\t\t\t\t\t\t\tfeature.secondaryButton.redirectionUrl.startsWith(\n\t\t\t\t\t\t\t\t\t\t\t\t\t'http',\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 'noopener noreferrer'\n\t\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tonClick={handleSecondaryAction}\n\t\t\t\t\t\t\t\t\t\t\tstyle={styles.secondaryButton.base}\n\t\t\t\t\t\t\t\t\t\t\tonMouseEnter={(e) =>\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.secondaryButton.hover,\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tonMouseLeave={(e) =>\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.secondaryButton.base,\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{feature.secondaryButton.text}\n\t\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\tonClick={handleSecondaryAction}\n\t\t\t\t\t\t\t\t\t\t\tstyle={styles.secondaryButton.base}\n\t\t\t\t\t\t\t\t\t\t\tonMouseEnter={(e) =>\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.secondaryButton.hover,\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tonMouseLeave={(e) =>\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.secondaryButton.base,\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{feature.secondaryButton.text}\n\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t{/* Navigation arrows */}\n\t\t\t\t\t\t\t{totalFeatures > 1 && (\n\t\t\t\t\t\t\t\t<div style={styles.navigationContainer}>\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tonClick={handlePreviousClick}\n\t\t\t\t\t\t\t\t\t\tdisabled={currentIndex === 0}\n\t\t\t\t\t\t\t\t\t\tstyle={styles.navigationButton(currentIndex === 0).base}\n\t\t\t\t\t\t\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tif (currentIndex !== 0) {\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.navigationButton(false).hover,\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tif (currentIndex !== 0) {\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.navigationButton(false).base,\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\taria-label=\"Previous feature\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<Arrow style={{ transform: 'rotate(180deg)' }} />\n\t\t\t\t\t\t\t\t\t</button>\n\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\tonClick={handleNextClick}\n\t\t\t\t\t\t\t\t\t\tdisabled={currentIndex === totalFeatures - 1}\n\t\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\t\tstyles.navigationButton(\n\t\t\t\t\t\t\t\t\t\t\t\tcurrentIndex === totalFeatures - 1,\n\t\t\t\t\t\t\t\t\t\t\t).base\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tif (currentIndex !== totalFeatures - 1) {\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.navigationButton(false).hover,\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tif (currentIndex !== totalFeatures - 1) {\n\t\t\t\t\t\t\t\t\t\t\t\tObject.assign(\n\t\t\t\t\t\t\t\t\t\t\t\t\te.currentTarget.style,\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles.navigationButton(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcurrentIndex === totalFeatures - 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\t).base,\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\taria-label=\"Next feature\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<Arrow />\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t{/* Close contentWrapper */}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default MajorUpdatePopup;\n"],"names":["MajorUpdatePopup","feature","currentIndex","totalFeatures","onSkip","onExplore","onPrevious","onNext","setIsClosingParent","onSecondaryAction","ratio","padding","isClosing","setIsClosing","useState","startAnimation","setStartAnimation","transform","setTransform","popupRef","useRef","isVideoPaused","setIsVideoPaused","showPlayIcon","setShowPlayIcon","videoRef","imageAspectRatio","setImageAspectRatio","imageRef","useEffect","handleClose","callback","hideJoyrideArrow","targetButton","findWhatsNewButton","transformValue","calculateCloseTransform","executeAfterAnimation","handleImageLoad","e","img","width","height","aspectRatio","handleVideoLoadedMetadata","video","handleExplore","action","url","handleSkipClick","handlePreviousClick","handleNextClick","handleSecondaryAction","closeCallback","internalUrl","styles","getMajorPopupStyles","handleVideoClick","handleVideoKeyDown","jsx","jsxs","Fragment","PlayIcon","TEXT","decodeHTMLEntities","Arrow"],"mappings":";;;;;;;;;AAcA,MAAMA,KAAoD,CAAC;AAAA,EAC1D,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,QAAAC;AAAA,EACA,cAAcC;AAAA,EACd,mBAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,SAAAC;AACD,MAAM;AACL,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAgBC,CAAiB,IAAIF,EAAS,EAAK,GACpD,CAACG,GAAWC,CAAY,IAAIJ,EAAS,EAAE,GACvCK,IAAWC,EAAuB,IAAI,GACtC,CAACC,GAAeC,CAAgB,IAAIR,EAAS,EAAK,GAClD,CAACS,GAAcC,CAAe,IAAIV,EAAS,EAAI,GAC/CW,IAAWL,EAAyB,IAAI,GACxC,CAACM,GAAkBC,CAAmB,IAAIb,EAE9CJ,CAAK,GAEDkB,IAAWR,EAAyB,IAAI;AAE9C,EAAAS,GAAU,MAAM;AACf,IAAIjB,KAEHI,EAAkB,EAAI;AAAA,EAExB,GAAG,CAACJ,CAAS,CAAC;AAEd,QAAMkB,IAAc,CAACC,MAA+C;AACnE,IAAAC,EAAiBb,EAAS,OAAO;AAEjC,UAAMc,IAAeC,EAAA;AAErB,QAAID,KAAgBd,EAAS,SAAS;AACrC,YAAMgB,IAAiBC;AAAA,QACtBjB,EAAS;AAAA,QACTc;AAAA,MAAA;AAED,MAAAf,EAAaiB,CAAc;AAAA,IAC5B;AACC,MAAAjB,EAAa,UAAU;AAGxB,IAAAV,IAAqB,EAAI,GACzBK,EAAa,EAAI,GACjBwB,EAAsBN,CAAQ;AAAA,EAC/B,GAEMO,IAAkB,CAACC,MAA8C;AACtE,UAAMC,IAAMD,EAAE,eACRE,IAAQD,EAAI,cACZE,IAASF,EAAI;AAEnB,QAAIC,KAASC,GAAQ;AACpB,YAAMC,IAAcF,IAAQC;AAG5B,MAAI,KAAK,IAAIC,IAAc,KAAK,CAAC,IAAI,MACpChB,EAAoB,MAAM,IAChB,KAAK,IAAIgB,IAAc,CAAC,IAAI,MACtChB,EAAoB,KAAK,IACf,KAAK,IAAIgB,IAAc,IAAI,CAAC,IAAI,MAC1ChB,EAAoB,KAAK,IACfgB,IAAc,MAExBhB,EAAoB,MAAM,IAChBgB,IAAc,MAExBhB,EAAoB,KAAK,IAGzBA,EAAoB,KAAK;AAAA,IAE3B;AAAA,EACD,GAEMiB,IAA4B,CACjCL,MACI;AACJ,UAAMM,IAAQN,EAAE,eACVE,IAAQI,EAAM,YACdH,IAASG,EAAM;AAErB,QAAIJ,KAASC,GAAQ;AACpB,YAAMC,IAAcF,IAAQC;AAE5B,MAAI,KAAK,IAAIC,IAAc,KAAK,CAAC,IAAI,MACpChB,EAAoB,MAAM,IAChB,KAAK,IAAIgB,IAAc,CAAC,IAAI,MACtChB,EAAoB,KAAK,IACf,KAAK,IAAIgB,IAAc,IAAI,CAAC,IAAI,MAC1ChB,EAAoB,KAAK,IACfgB,IAAc,MAExBhB,EAAoB,MAAM,IAChBgB,IAAc,MAExBhB,EAAoB,KAAK,IAGzBA,EAAoB,KAAK;AAAA,IAE3B;AAAA,EACD,GAEMmB,IAAgB,MAAY;AACjC,UAAMC,IAAS9C,EAAQ,eAAe;AAEtC,QAAI8C,MAAW,aAAa;AAC3B,YAAMC,IAAM/C,EAAQ,eAAe,kBAAkBA,EAAQ;AAC7D,MAAI+C,KACgBA,EAAI,WAAW,MAAM,KAEvC,OAAO,KAAKA,GAAK,UAAU,qBAAqB;AAAA,IAGnD;AACA,IAAA3C,EAAU0C,CAAM,GAGhBf,EAAiBb,EAAS,OAAO;AACjC,UAAMc,IAAeC,EAAA;AACrB,QAAID,KAAgBd,EAAS,SAAS;AACrC,YAAMgB,IAAiBC;AAAA,QACtBjB,EAAS;AAAA,QACTc;AAAA,MAAA;AAED,MAAAf,EAAaiB,CAAc;AAAA,IAC5B;AACC,MAAAjB,EAAa,UAAU;AAExB,IAAAV,IAAqB,EAAI,GACzBK,EAAa,EAAI;AAAA,EAClB,GAEMoC,IAAkB,CAACV,MAAiD;AACzE,IAAAA,EAAE,eAAA,GACFA,EAAE,gBAAA,GACFT,EAAY1B,CAAM;AAAA,EACnB,GAEM8C,IAAsB,CAC3BX,MACU;AACV,IAAAA,EAAE,eAAA,GACFA,EAAE,gBAAA,GACFjC,EAAA;AAAA,EACD,GAEM6C,IAAkB,CAACZ,MAAiD;AACzE,IAAAA,EAAE,eAAA,GACFA,EAAE,gBAAA,GACFhC,EAAA;AAAA,EACD,GAEM6C,IAAwB,CAACb,MAA8B;AAC5D,IAAAA,EAAE,eAAA,GACFA,EAAE,gBAAA;AAEF,UAAMQ,IAAS9C,EAAQ,iBAAiB,QAClCoD,IAAgB5C,KAAqBL;AAC3C,QAAIkD,IAA6B;AAGjC,QAAIP,MAAW;AACd,MAAA1C,EAAU,YAAY;AAAA,aACZ0C,MAAW,aAAa;AAClC,YAAMC,IAAM/C,EAAQ,iBAAiB;AACrC,MAAI+C,MACgBA,EAAI,WAAW,MAAM,IAEvC,OAAO,KAAKA,GAAK,UAAU,qBAAqB,IAEhDM,IAAcN;AAAA,IAGjB;AAMA,IAAAhB,EAAiBb,EAAS,OAAO;AACjC,UAAMc,IAAeC,EAAA;AACrB,QAAID,KAAgBd,EAAS,SAAS;AACrC,YAAMgB,IAAiBC;AAAA,QACtBjB,EAAS;AAAA,QACTc;AAAA,MAAA;AAED,MAAAf,EAAaiB,CAAc;AAAA,IAC5B;AACC,MAAAjB,EAAa,UAAU;AAExB,IAAAV,IAAqB,EAAI,GACzBK,EAAa,EAAI,GACjBwB,EAAsB,YAAY;AACjC,YAAMgB,EAAA,GACFC,MACH,OAAO,SAAS,OAAOA;AAAA,IAEzB,CAAC;AAAA,EACF,GAEMC,IAASC;AAAA,IACdzC;AAAA,IACAE;AAAA,IACAS;AAAA,IACAf,KAAWV,EAAQ;AAAA,IACnBA,EAAQ,eAAe;AAAA,IACvBA,EAAQ,iBAAiB;AAAA,EAAA,GAGpBwD,IAAmB,CAAClB,MAAwB;AACjD,IAAAA,EAAE,gBAAA,GACEd,EAAS,YACRA,EAAS,QAAQ,UACpBA,EAAS,QAAQ,KAAA,GACjBH,EAAiB,EAAK,GACtBE,EAAgB,EAAK,MAErBC,EAAS,QAAQ,MAAA,GACjBH,EAAiB,EAAI,GACrBE,EAAgB,EAAI;AAAA,EAGvB,GAEMkC,IAAqB,CAACnB,MAA2B;AACtD,KAAIA,EAAE,QAAQ,WAAWA,EAAE,QAAQ,SAClCA,EAAE,eAAA,GACFA,EAAE,gBAAA,GACEd,EAAS,YACRA,EAAS,QAAQ,UACpBA,EAAS,QAAQ,KAAA,GACjBH,EAAiB,EAAK,GACtBE,EAAgB,EAAK,MAErBC,EAAS,QAAQ,MAAA,GACjBH,EAAiB,EAAI,GACrBE,EAAgB,EAAI;AAAA,EAIxB;AAEA,SACC,gBAAAmC,EAAC,OAAA,EAAI,OAAOJ,EAAO,cAClB,UAAA,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACA,KAAKzC;AAAA,MACL,OAAO;AAAA,QACN,GAAGoC,EAAO;AAAA,QACV,SAASxC,IAAiB,IAAI;AAAA,QAC9B,YAAY;AAAA,MAAA;AAAA,MAGb,UAAA;AAAA,QAAA,gBAAA4C,EAAC,SAAA,EAAO,UAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAaP;AAAA,QAED,gBAAAC,EAAC,OAAA,EAAI,OAAOL,EAAO,gBAElB,UAAA;AAAA,UAAA,gBAAAI,EAAC,SAAI,OAAOJ,EAAO,gBACjB,UAAAtD,EAAQ,eACR,gBAAA2D,EAAAC,GAAA,EACC,UAAA;AAAA,YAAA,gBAAAF;AAAA,cAAC;AAAA,cAAA;AAAA,gBACA,KAAKlC;AAAA,gBACL,KAAKxB,EAAQ;AAAA,gBACb,OAAOsD,EAAO;AAAA,gBACd,UAAQ;AAAA,gBACR,OAAK;AAAA,gBACL,MAAI;AAAA,gBACJ,aAAW;AAAA,gBACX,UAAQ;AAAA,gBACR,cAAY,qBAAqBtD,EAAQ,KAAK;AAAA,gBAC9C,kBAAkB2C;AAAA,cAAA;AAAA,YAAA;AAAA,aAGjBvB,KAAiBE,MAClB,gBAAAoC;AAAA,cAAC;AAAA,cAAA;AAAA,gBACA,OAAOJ,EAAO;AAAA,gBACd,SAASE;AAAA,gBACT,MAAK;AAAA,gBACL,UAAU;AAAA,gBACV,cAAYpC,IAAgB,eAAe;AAAA,gBAC3C,WAAWqC;AAAA,gBAEX,UAAA,gBAAAC,EAACG,IAAA,EAAS,OAAO,IAAI,QAAQ,GAAA,CAAI;AAAA,cAAA;AAAA,YAAA;AAAA,UAClC,GAEF,IACG7D,EAAQ,eACX,gBAAA0D;AAAA,YAAC;AAAA,YAAA;AAAA,cACA,KAAK/B;AAAA,cACL,KAAK3B,EAAQ;AAAA,cACb,KAAKA,EAAQ;AAAA,cACb,OAAOsD,EAAO;AAAA,cACd,QAAQjB;AAAA,cACR,SAAS,CAACC,MAAM;AACf,gBAAItC,EAAQ,UACVsC,EAAE,OAA4B,MAAMtC,EAAQ;AAAA,cAE/C;AAAA,YAAA;AAAA,UAAA,sBAGA,OAAA,EAAI,OAAOsD,EAAO,kBACjB,UAAAQ,EAAK,6BACP,GAEF;AAAA,UAGA,gBAAAH,EAAC,OAAA,EAAI,OAAOL,EAAO,kBAElB,UAAA;AAAA,YAAA,gBAAAI,EAAC,OAAA,EAAI,OAAOJ,EAAO,qBAClB,UAAA,gBAAAI;AAAA,cAAC;AAAA,cAAA;AAAA,gBACA,SAASV;AAAA,gBACT,OAAOM,EAAO,WAAW;AAAA,gBACzB,cAAc,CAAChB,MACd,OAAO,OAAOA,EAAE,cAAc,OAAOgB,EAAO,WAAW,KAAK;AAAA,gBAE7D,cAAc,CAAChB,MACd,OAAO,OAAOA,EAAE,cAAc,OAAOgB,EAAO,WAAW,IAAI;AAAA,gBAE5D,cAAW;AAAA,gBACX,UAAA;AAAA,cAAA;AAAA,YAAA,GAGF;AAAA,8BAGC,MAAA,EAAG,OAAOA,EAAO,OAAQ,YAAQ,OAAM;AAAA,YAGxC,gBAAAI;AAAA,cAAC;AAAA,cAAA;AAAA,gBACA,sBAAkB;AAAA,gBAClB,OAAOJ,EAAO;AAAA,gBACd,yBAAyB;AAAA,kBACxB,QAAQS;AAAA,oBACP/D,EAAQ,WAAWA,EAAQ,QAAQ;AAAA,kBAAA;AAAA,gBACpC;AAAA,cACD;AAAA,YAAA;AAAA,YAID,gBAAA2D,EAAC,OAAA,EAAI,OAAOL,EAAO,gBAClB,UAAA;AAAA,cAAA,gBAAAK,EAAC,OAAA,EAAI,OAAOL,EAAO,cAClB,UAAA;AAAA,gBAAA,gBAAAI;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACA,SAASb;AAAA,oBACT,OAAOS,EAAO,cAAc;AAAA,oBAC5B,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,cAAc;AAAA,oBAAA;AAAA,oBAGvB,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,cAAc;AAAA,oBAAA;AAAA,oBAItB,UAAAtD,EAAQ,eAAe,QACvBA,EAAQ,cACR8D,EAAK;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGN9D,EAAQ,iBAAiB,SACxBA,EAAQ,iBAAiB,kBAC1BA,EAAQ,iBAAiB,WAAW,eACnC,gBAAA0D;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACA,MAAM1D,EAAQ,gBAAgB;AAAA,oBAC9B,QACCA,EAAQ,gBAAgB,eAAe;AAAA,sBACtC;AAAA,oBAAA,IAEE,WACA;AAAA,oBAEJ,KACCA,EAAQ,gBAAgB,eAAe;AAAA,sBACtC;AAAA,oBAAA,IAEE,wBACA;AAAA,oBAEJ,SAASmD;AAAA,oBACT,OAAOG,EAAO,gBAAgB;AAAA,oBAC9B,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,gBAAgB;AAAA,oBAAA;AAAA,oBAGzB,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,gBAAgB;AAAA,oBAAA;AAAA,oBAIxB,YAAQ,gBAAgB;AAAA,kBAAA;AAAA,gBAAA,IAG1B,gBAAAI;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACA,SAASP;AAAA,oBACT,OAAOG,EAAO,gBAAgB;AAAA,oBAC9B,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,gBAAgB;AAAA,oBAAA;AAAA,oBAGzB,cAAc,CAAChB,MACd,OAAO;AAAA,sBACNA,EAAE,cAAc;AAAA,sBAChBgB,EAAO,gBAAgB;AAAA,oBAAA;AAAA,oBAIxB,YAAQ,gBAAgB;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAC1B,GAEH;AAAA,cAGCpD,IAAgB,KAChB,gBAAAyD,EAAC,OAAA,EAAI,OAAOL,EAAO,qBAClB,UAAA;AAAA,gBAAA,gBAAAI;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACA,SAAST;AAAA,oBACT,UAAUhD,MAAiB;AAAA,oBAC3B,OAAOqD,EAAO,iBAAiBrD,MAAiB,CAAC,EAAE;AAAA,oBACnD,cAAc,CAACqC,MAAM;AACpB,sBAAIrC,MAAiB,KACpB,OAAO;AAAA,wBACNqC,EAAE,cAAc;AAAA,wBAChBgB,EAAO,iBAAiB,EAAK,EAAE;AAAA,sBAAA;AAAA,oBAGlC;AAAA,oBACA,cAAc,CAAChB,MAAM;AACpB,sBAAIrC,MAAiB,KACpB,OAAO;AAAA,wBACNqC,EAAE,cAAc;AAAA,wBAChBgB,EAAO,iBAAiB,EAAK,EAAE;AAAA,sBAAA;AAAA,oBAGlC;AAAA,oBACA,cAAW;AAAA,oBAEX,4BAACU,GAAA,EAAM,OAAO,EAAE,WAAW,mBAAiB,CAAG;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGhD,gBAAAN;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACA,SAASR;AAAA,oBACT,UAAUjD,MAAiBC,IAAgB;AAAA,oBAC3C,OACCoD,EAAO;AAAA,sBACNrD,MAAiBC,IAAgB;AAAA,oBAAA,EAChC;AAAA,oBAEH,cAAc,CAACoC,MAAM;AACpB,sBAAIrC,MAAiBC,IAAgB,KACpC,OAAO;AAAA,wBACNoC,EAAE,cAAc;AAAA,wBAChBgB,EAAO,iBAAiB,EAAK,EAAE;AAAA,sBAAA;AAAA,oBAGlC;AAAA,oBACA,cAAc,CAAChB,MAAM;AACpB,sBAAIrC,MAAiBC,IAAgB,KACpC,OAAO;AAAA,wBACNoC,EAAE,cAAc;AAAA,wBAChBgB,EAAO;AAAA,0BACNrD,MAAiBC,IAAgB;AAAA,wBAAA,EAChC;AAAA,sBAAA;AAAA,oBAGL;AAAA,oBACA,cAAW;AAAA,oBAEX,4BAAC8D,GAAA,CAAA,CAAM;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACR,EAAA,CACD;AAAA,YAAA,EAAA,CAEF;AAAA,UAAA,EAAA,CACD;AAAA,QAAA,EAAA,CAED;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAEF;AAEF;"}

package/dist/esm/components/feature-announcements/MinorUpdatePopup.js

@@ -1,68 +1,69 @@
-import { jsxs as a, jsx as r } from "react/jsx-runtime";
-import { useState as d, useRef as U, useEffect as _ } from "react";
-import { TEXT as g } from "./constants/index.js";
-import { getMinorPopupStyles as k } from "./styles/minorPopup.styles.js";
-import { decodeHTMLEntities as S } from "./utils/htmlHelpers.js";
-import { hideJoyrideArrow as h, calculateCloseTransform as T, executeAfterAnimation as W } from "./utils/animationHelpers.js";
-import { findFeatureTagElement as b } from "./utils/elementHelpers.js";
-const N = ({
+import { jsxs as c, jsx as r } from "react/jsx-runtime";
+import { useState as d, useRef as w, useEffect as U } from "react";
+import { TEXT as h } from "./constants/index.js";
+import { getMinorPopupStyles as _ } from "./styles/minorPopup.styles.js";
+import { decodeHTMLEntities as k } from "./utils/htmlHelpers.js";
+import { hideJoyrideArrow as f, calculateCloseTransform as T, executeAfterAnimation as P } from "./utils/animationHelpers.js";
+import { findFeatureTagElement as S } from "./utils/elementHelpers.js";
+const D = ({
   feature: t,
-  currentIndex: I,
-  totalFeatures: L,
-  onSkip: f,
-  onExplore: E,
-  onPrevious: P,
-  onNext: R,
-  setIsClosing: m,
-  onSecondaryAction: x
+  currentIndex: W,
+  totalFeatures: b,
+  onSkip: E,
+  onExplore: m,
+  onPrevious: I,
+  onNext: L,
+  setIsClosing: p
 }) => {
-  const [p, u] = d(!1), [C, v] = d(!1), [A, c] = d(""), o = U(null);
-  _(() => {
-    p && v(!0);
-  }, [p]);
-  const B = () => {
+  const [y, u] = d(!1), [x, C] = d(!1), [v, a] = d(""), o = w(null);
+  U(() => {
+    y && C(!0);
+  }, [y]);
+  const A = () => {
     const i = t.primaryButton?.action;
     if (i === "Open link") {
       const s = t.primaryButton?.redirectionUrl || t.redirectUrl;
       s && s.startsWith("http") && window.open(s, "_blank", "noopener,noreferrer");
     }
-    if (E(i), h(o.current), o.current && t.featureTag) {
+    if (m(i), f(o.current), o.current && t.featureTag) {
       const s = t.featureTag.startsWith("#") || t.featureTag.startsWith(".") || t.featureTag.startsWith("[") ? t.featureTag : `#${t.featureTag}`, l = document.querySelector(s);
       if (l) {
         const n = T(
           o.current,
           l
         );
-        c(n);
+        a(n);
       } else
-        c("scale(0)");
+        a("scale(0)");
     } else
-      c("scale(0)");
-    m?.(!0), u(!0);
-  }, w = () => {
-    const i = t.secondaryButton?.action, s = x || f;
+      a("scale(0)");
+    p?.(!0), u(!0);
+  }, B = () => {
+    const i = t.secondaryButton?.action, s = E;
     let l = null;
-    if (i === "Open link") {
+    if (i === "Play Video")
+      m("Play Video");
+    else if (i === "Open link") {
       const n = t.secondaryButton?.redirectionUrl;
       n && (n.startsWith("http") ? window.open(n, "_blank", "noopener,noreferrer") : l = n);
     }
-    if (h(o.current), o.current && t.featureTag) {
-      const n = b(t.featureTag);
+    if (f(o.current), o.current && t.featureTag) {
+      const n = S(t.featureTag);
       if (n) {
-        const y = T(
+        const g = T(
           o.current,
           n
         );
-        c(y);
+        a(g);
       } else
-        c("scale(0)");
+        a("scale(0)");
     } else
-      c("scale(0)");
-    m?.(!0), u(!0), W(async () => {
-      await s(i), l && (window.location.href = l);
+      a("scale(0)");
+    p?.(!0), u(!0), P(async () => {
+      await s(), l && (window.location.href = l);
     });
-  }, e = k(C, A);
-  return /* @__PURE__ */ a("div", { ref: o, style: e.container, children: [
+  }, e = _(x, v);
+  return /* @__PURE__ */ c("div", { ref: o, style: e.container, children: [
     /* @__PURE__ */ r("div", { style: e.imageContainer, children: t.displayImage ? /* @__PURE__ */ r("div", { style: e.imageWrapper, children: /* @__PURE__ */ r(
       "img",
       {
@@ -73,28 +74,28 @@ const N = ({
           t.image && (i.target.src = t.image);
         }
       }
-    ) }) : /* @__PURE__ */ r("div", { style: e.imagePlaceholder, children: g.FEATURE_PREVIEW_PLACEHOLDER }) }),
-    /* @__PURE__ */ a("div", { style: e.contentContainer, children: [
-      /* @__PURE__ */ a("div", { children: [
+    ) }) : /* @__PURE__ */ r("div", { style: e.imagePlaceholder, children: h.FEATURE_PREVIEW_PLACEHOLDER }) }),
+    /* @__PURE__ */ c("div", { style: e.contentContainer, children: [
+      /* @__PURE__ */ c("div", { children: [
         /* @__PURE__ */ r("h3", { style: e.title, children: t.title }),
         /* @__PURE__ */ r(
           "div",
           {
             style: e.content,
             dangerouslySetInnerHTML: {
-              __html: S(t.content || t.body || "")
+              __html: k(t.content || t.body || "")
             }
           }
         )
       ] }),
-      /* @__PURE__ */ a("div", { style: e.actionsContainer, children: [
-        t.secondaryButton?.text && /* @__PURE__ */ r("span", { onClick: w, style: e.understoodText, children: t.secondaryButton.text }),
-        /* @__PURE__ */ r("button", { onClick: B, style: e.exploreButton, children: t.primaryButton?.text || t.buttonText || g.DEFAULT_BUTTON_TEXT })
+      /* @__PURE__ */ c("div", { style: e.actionsContainer, children: [
+        t.secondaryButton?.text && /* @__PURE__ */ r("span", { onClick: B, style: e.understoodText, children: t.secondaryButton.text }),
+        /* @__PURE__ */ r("button", { onClick: A, style: e.exploreButton, children: t.primaryButton?.text || t.buttonText || h.DEFAULT_BUTTON_TEXT })
       ] })
     ] })
   ] });
 };
 export {
-  N as default
+  D as default
 };
 //# sourceMappingURL=MinorUpdatePopup.js.map

package/dist/esm/components/feature-announcements/MinorUpdatePopup.js.map

@@ -1 +1 @@
-{"version":3,"file":"MinorUpdatePopup.js","sources":["../../../../src/components/feature-announcements/MinorUpdatePopup.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { TEXT } from './constants';\nimport { getMinorPopupStyles } from './styles';\nimport { MinorUpdatePopupProps } from './types';\nimport {\n\tcalculateCloseTransform,\n\tdecodeHTMLEntities,\n\texecuteAfterAnimation,\n\tfindFeatureTagElement,\n\thideJoyrideArrow,\n} from './utils';\n\nconst MinorUpdatePopup: React.FC<MinorUpdatePopupProps> = ({\n\tfeature,\n\tcurrentIndex,\n\ttotalFeatures,\n\tonSkip,\n\tonExplore,\n\tonPrevious,\n\tonNext,\n\tsetIsClosing: setIsClosingParent,\n\tonSecondaryAction,\n}) => {\n\tconst [isClosing, setIsClosing] = useState(false);\n\tconst [startAnimation, setStartAnimation] = useState(false);\n\tconst [transform, setTransform] = useState('');\n\tconst popupRef = useRef<HTMLDivElement>(null);\n\n\t// Hide Joyride arrow when closing starts, then trigger animation immediately\n\tuseEffect(() => {\n\t\tif (isClosing) {\n\t\t\t// Start the shrink animation immediately\n\t\t\tsetStartAnimation(true);\n\t\t}\n\t}, [isClosing]);\n\n\tconst handleExplore = (): void => {\n\t\tconst action = feature.primaryButton?.action;\n\n\t\tif (action === 'Open link') {\n\t\t\tconst url = feature.primaryButton?.redirectionUrl || feature.redirectUrl;\n\t\t\tif (url) {\n\t\t\t\tconst isExternal = url.startsWith('http');\n\t\t\t\tif (isExternal) {\n\t\t\t\t\twindow.open(url, '_blank', 'noopener,noreferrer');\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tonExplore(action);\n\n\t\t// Run closing animation in background\n\t\thideJoyrideArrow(popupRef.current);\n\t\tif (popupRef.current && feature.featureTag) {\n\t\t\tconst targetSelector =\n\t\t\t\tfeature.featureTag.startsWith('#') ||\n\t\t\t\tfeature.featureTag.startsWith('.') ||\n\t\t\t\tfeature.featureTag.startsWith('[')\n\t\t\t\t\t? feature.featureTag\n\t\t\t\t\t: `#${feature.featureTag}`;\n\t\t\tconst targetElement = document.querySelector(targetSelector);\n\t\t\tif (targetElement) {\n\t\t\t\tconst transformValue = calculateCloseTransform(\n\t\t\t\t\tpopupRef.current,\n\t\t\t\t\ttargetElement,\n\t\t\t\t);\n\t\t\t\tsetTransform(transformValue);\n\t\t\t} else {\n\t\t\t\tsetTransform('scale(0)');\n\t\t\t}\n\t\t} else {\n\t\t\tsetTransform('scale(0)');\n\t\t}\n\t\tsetIsClosingParent?.(true);\n\t\tsetIsClosing(true);\n\t};\n\n\tconst handleSecondaryAction = (): void => {\n\t\tconst action = feature.secondaryButton?.action;\n\t\tconst closeCallback: (triggeredAction?: string) => Promise<void> | void =\n\t\t\tonSecondaryAction || onSkip;\n\t\tlet internalUrl: string | null = null;\n\n\t\t// Handle based on action type. 'Play Video' is opened by closeCallback so the\n\t\t// click is not attributed to the primary button via onExplore.\n\t\tif (action === 'Open link') {\n\t\t\tconst url = feature.secondaryButton?.redirectionUrl;\n\t\t\tif (url) {\n\t\t\t\tconst isExternal = url.startsWith('http');\n\t\t\t\tif (isExternal) {\n\t\t\t\t\twindow.open(url, '_blank', 'noopener,noreferrer');\n\t\t\t\t} else {\n\t\t\t\t\tinternalUrl = url;\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (action === 'Close popup' || action === '') {\n\t\t\t// Just close the popup\n\t\t}\n\n\t\t// Always close popup after secondary action\n\t\thideJoyrideArrow(popupRef.current);\n\t\tif (popupRef.current && feature.featureTag) {\n\t\t\tconst targetElement = findFeatureTagElement(feature.featureTag);\n\t\t\tif (targetElement) {\n\t\t\t\tconst transformValue = calculateCloseTransform(\n\t\t\t\t\tpopupRef.current,\n\t\t\t\t\ttargetElement,\n\t\t\t\t);\n\t\t\t\tsetTransform(transformValue);\n\t\t\t} else {\n\t\t\t\tsetTransform('scale(0)');\n\t\t\t}\n\t\t} else {\n\t\t\tsetTransform('scale(0)');\n\t\t}\n\t\tsetIsClosingParent?.(true);\n\t\tsetIsClosing(true);\n\t\texecuteAfterAnimation(async () => {\n\t\t\tawait closeCallback(action);\n\t\t\tif (internalUrl) {\n\t\t\t\twindow.location.href = internalUrl;\n\t\t\t}\n\t\t});\n\t};\n\n\tconst styles = getMinorPopupStyles(startAnimation, transform);\n\n\treturn (\n\t\t<div ref={popupRef} style={styles.container}>\n\t\t\t{/* Image section */}\n\t\t\t<div style={styles.imageContainer}>\n\t\t\t\t{feature.displayImage ? (\n\t\t\t\t\t<div style={styles.imageWrapper}>\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tsrc={feature.displayImage}\n\t\t\t\t\t\t\talt={feature.title}\n\t\t\t\t\t\t\tstyle={styles.image}\n\t\t\t\t\t\t\tonError={(e) => {\n\t\t\t\t\t\t\t\tif (feature.image) {\n\t\t\t\t\t\t\t\t\t(e.target as HTMLImageElement).src = feature.image;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<div style={styles.imagePlaceholder}>\n\t\t\t\t\t\t{TEXT.FEATURE_PREVIEW_PLACEHOLDER}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t{/* Content section */}\n\t\t\t<div style={styles.contentContainer}>\n\t\t\t\t<div>\n\t\t\t\t\t<h3 style={styles.title}>{feature.title}</h3>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={styles.content}\n\t\t\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t\t\t__html: decodeHTMLEntities(feature.content || feature.body || ''),\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t{/* Action buttons */}\n\t\t\t\t<div style={styles.actionsContainer}>\n\t\t\t\t\t{/* Secondary Button (if configured, shows as text link on left) */}\n\t\t\t\t\t{feature.secondaryButton?.text && (\n\t\t\t\t\t\t<span onClick={handleSecondaryAction} style={styles.understoodText}>\n\t\t\t\t\t\t\t{feature.secondaryButton.text}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{/* Primary Button (always shows) */}\n\t\t\t\t\t<button onClick={handleExplore} style={styles.exploreButton}>\n\t\t\t\t\t\t{feature.primaryButton?.text ||\n\t\t\t\t\t\t\tfeature.buttonText ||\n\t\t\t\t\t\t\tTEXT.DEFAULT_BUTTON_TEXT}\n\t\t\t\t\t</button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default MinorUpdatePopup;\n"],"names":["MinorUpdatePopup","feature","currentIndex","totalFeatures","onSkip","onExplore","onPrevious","onNext","setIsClosingParent","onSecondaryAction","isClosing","setIsClosing","useState","startAnimation","setStartAnimation","transform","setTransform","popupRef","useRef","useEffect","handleExplore","action","url","hideJoyrideArrow","targetSelector","targetElement","transformValue","calculateCloseTransform","handleSecondaryAction","closeCallback","internalUrl","findFeatureTagElement","executeAfterAnimation","styles","getMinorPopupStyles","jsx","e","TEXT","jsxs","decodeHTMLEntities"],"mappings":"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"}
+{"version":3,"file":"MinorUpdatePopup.js","sources":["../../../../src/components/feature-announcements/MinorUpdatePopup.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { TEXT } from './constants';\nimport { getMinorPopupStyles } from './styles';\nimport { MinorUpdatePopupProps } from './types';\nimport {\n\tcalculateCloseTransform,\n\tdecodeHTMLEntities,\n\texecuteAfterAnimation,\n\tfindFeatureTagElement,\n\thideJoyrideArrow,\n} from './utils';\n\nconst MinorUpdatePopup: React.FC<MinorUpdatePopupProps> = ({\n\tfeature,\n\tcurrentIndex,\n\ttotalFeatures,\n\tonSkip,\n\tonExplore,\n\tonPrevious,\n\tonNext,\n\tsetIsClosing: setIsClosingParent,\n}) => {\n\tconst [isClosing, setIsClosing] = useState(false);\n\tconst [startAnimation, setStartAnimation] = useState(false);\n\tconst [transform, setTransform] = useState('');\n\tconst popupRef = useRef<HTMLDivElement>(null);\n\n\t// Hide Joyride arrow when closing starts, then trigger animation immediately\n\tuseEffect(() => {\n\t\tif (isClosing) {\n\t\t\t// Start the shrink animation immediately\n\t\t\tsetStartAnimation(true);\n\t\t}\n\t}, [isClosing]);\n\n\tconst handleExplore = (): void => {\n\t\tconst action = feature.primaryButton?.action;\n\n\t\tif (action === 'Open link') {\n\t\t\tconst url = feature.primaryButton?.redirectionUrl || feature.redirectUrl;\n\t\t\tif (url) {\n\t\t\t\tconst isExternal = url.startsWith('http');\n\t\t\t\tif (isExternal) {\n\t\t\t\t\twindow.open(url, '_blank', 'noopener,noreferrer');\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tonExplore(action);\n\n\t\t// Run closing animation in background\n\t\thideJoyrideArrow(popupRef.current);\n\t\tif (popupRef.current && feature.featureTag) {\n\t\t\tconst targetSelector =\n\t\t\t\tfeature.featureTag.startsWith('#') ||\n\t\t\t\tfeature.featureTag.startsWith('.') ||\n\t\t\t\tfeature.featureTag.startsWith('[')\n\t\t\t\t\t? feature.featureTag\n\t\t\t\t\t: `#${feature.featureTag}`;\n\t\t\tconst targetElement = document.querySelector(targetSelector);\n\t\t\tif (targetElement) {\n\t\t\t\tconst transformValue = calculateCloseTransform(\n\t\t\t\t\tpopupRef.current,\n\t\t\t\t\ttargetElement,\n\t\t\t\t);\n\t\t\t\tsetTransform(transformValue);\n\t\t\t} else {\n\t\t\t\tsetTransform('scale(0)');\n\t\t\t}\n\t\t} else {\n\t\t\tsetTransform('scale(0)');\n\t\t}\n\t\tsetIsClosingParent?.(true);\n\t\tsetIsClosing(true);\n\t};\n\n\tconst handleSecondaryAction = (): void => {\n\t\tconst action = feature.secondaryButton?.action;\n\t\tconst closeCallback = onSkip;\n\t\tlet internalUrl: string | null = null;\n\n\t\t// Handle based on action type\n\t\tif (action === 'Play Video') {\n\t\t\tonExplore('Play Video');\n\t\t} else if (action === 'Open link') {\n\t\t\tconst url = feature.secondaryButton?.redirectionUrl;\n\t\t\tif (url) {\n\t\t\t\tconst isExternal = url.startsWith('http');\n\t\t\t\tif (isExternal) {\n\t\t\t\t\twindow.open(url, '_blank', 'noopener,noreferrer');\n\t\t\t\t} else {\n\t\t\t\t\tinternalUrl = url;\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (action === 'Close popup' || action === '') {\n\t\t\t// Just close the popup\n\t\t}\n\n\t\t// Always close popup after secondary action\n\t\thideJoyrideArrow(popupRef.current);\n\t\tif (popupRef.current && feature.featureTag) {\n\t\t\tconst targetElement = findFeatureTagElement(feature.featureTag);\n\t\t\tif (targetElement) {\n\t\t\t\tconst transformValue = calculateCloseTransform(\n\t\t\t\t\tpopupRef.current,\n\t\t\t\t\ttargetElement,\n\t\t\t\t);\n\t\t\t\tsetTransform(transformValue);\n\t\t\t} else {\n\t\t\t\tsetTransform('scale(0)');\n\t\t\t}\n\t\t} else {\n\t\t\tsetTransform('scale(0)');\n\t\t}\n\t\tsetIsClosingParent?.(true);\n\t\tsetIsClosing(true);\n\t\texecuteAfterAnimation(async () => {\n\t\t\tawait closeCallback();\n\t\t\tif (internalUrl) {\n\t\t\t\twindow.location.href = internalUrl;\n\t\t\t}\n\t\t});\n\t};\n\n\tconst styles = getMinorPopupStyles(startAnimation, transform);\n\n\treturn (\n\t\t<div ref={popupRef} style={styles.container}>\n\t\t\t{/* Image section */}\n\t\t\t<div style={styles.imageContainer}>\n\t\t\t\t{feature.displayImage ? (\n\t\t\t\t\t<div style={styles.imageWrapper}>\n\t\t\t\t\t\t<img\n\t\t\t\t\t\t\tsrc={feature.displayImage}\n\t\t\t\t\t\t\talt={feature.title}\n\t\t\t\t\t\t\tstyle={styles.image}\n\t\t\t\t\t\t\tonError={(e) => {\n\t\t\t\t\t\t\t\tif (feature.image) {\n\t\t\t\t\t\t\t\t\t(e.target as HTMLImageElement).src = feature.image;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<div style={styles.imagePlaceholder}>\n\t\t\t\t\t\t{TEXT.FEATURE_PREVIEW_PLACEHOLDER}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t{/* Content section */}\n\t\t\t<div style={styles.contentContainer}>\n\t\t\t\t<div>\n\t\t\t\t\t<h3 style={styles.title}>{feature.title}</h3>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={styles.content}\n\t\t\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t\t\t__html: decodeHTMLEntities(feature.content || feature.body || ''),\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t{/* Action buttons */}\n\t\t\t\t<div style={styles.actionsContainer}>\n\t\t\t\t\t{/* Secondary Button (if configured, shows as text link on left) */}\n\t\t\t\t\t{feature.secondaryButton?.text && (\n\t\t\t\t\t\t<span onClick={handleSecondaryAction} style={styles.understoodText}>\n\t\t\t\t\t\t\t{feature.secondaryButton.text}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{/* Primary Button (always shows) */}\n\t\t\t\t\t<button onClick={handleExplore} style={styles.exploreButton}>\n\t\t\t\t\t\t{feature.primaryButton?.text ||\n\t\t\t\t\t\t\tfeature.buttonText ||\n\t\t\t\t\t\t\tTEXT.DEFAULT_BUTTON_TEXT}\n\t\t\t\t\t</button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default MinorUpdatePopup;\n"],"names":["MinorUpdatePopup","feature","currentIndex","totalFeatures","onSkip","onExplore","onPrevious","onNext","setIsClosingParent","isClosing","setIsClosing","useState","startAnimation","setStartAnimation","transform","setTransform","popupRef","useRef","useEffect","handleExplore","action","url","hideJoyrideArrow","targetSelector","targetElement","transformValue","calculateCloseTransform","handleSecondaryAction","closeCallback","internalUrl","findFeatureTagElement","executeAfterAnimation","styles","getMinorPopupStyles","jsx","e","TEXT","jsxs","decodeHTMLEntities"],"mappings":"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"}

package/dist/esm/components/feature-announcements/types/props.types.d.ts

@@ -13,7 +13,7 @@ export interface PopupBaseProps {
     onPrevious: () => void;
     onNext: () => void;
     setIsClosing?: (isClosing: boolean) => void;
-    onSecondaryAction?: (triggeredAction?: string) => Promise<void> | void;
+    onSecondaryAction?: () => Promise<void> | void;
 }
 /**
  * Major update popup props

package/dist/esm/components/product-picker-v2/constants.d.ts

@@ -24,4 +24,36 @@ export declare const CurrencySymbols: {
     SGD: string;
     PKR: string;
     RO: string;
+    KES: string;
+    NGN: string;
+    HKD: string;
+    TWD: string;
+    THB: string;
+    MYR: string;
+    IDR: string;
+    PHP: string;
+    VND: string;
+    BDT: string;
+    LKR: string;
+    NPR: string;
+    NOK: string;
+    PLN: string;
+    CZK: string;
+    HUF: string;
+    RON: string;
+    BGN: string;
+    UAH: string;
+    ILS: string;
+    QAR: string;
+    KWD: string;
+    BHD: string;
+    OMR: string;
+    JOD: string;
+    GHS: string;
+    TZS: string;
+    UGX: string;
+    ARS: string;
+    CLP: string;
+    COP: string;
+    PEN: string;
 };

package/dist/esm/components/product-picker-v2/constants.js

@@ -23,7 +23,39 @@ const R = {
   KRW: "₩",
   SGD: "S$",
   PKR: "Rs",
-  RO: "lei"
+  RO: "lei",
+  KES: "KSh",
+  NGN: "₦",
+  HKD: "HK$",
+  TWD: "NT$",
+  THB: "฿",
+  MYR: "RM",
+  IDR: "Rp",
+  PHP: "₱",
+  VND: "₫",
+  BDT: "৳",
+  LKR: "Rs",
+  NPR: "Rs",
+  NOK: "kr",
+  PLN: "zł",
+  CZK: "Kč",
+  HUF: "Ft",
+  RON: "lei",
+  BGN: "лв",
+  UAH: "₴",
+  ILS: "₪",
+  QAR: "ر.ق",
+  KWD: "د.ك",
+  BHD: "د.ب",
+  OMR: "ر.ع.",
+  JOD: "د.ا",
+  GHS: "₵",
+  TZS: "TSh",
+  UGX: "USh",
+  ARS: "$",
+  CLP: "$",
+  COP: "$",
+  PEN: "S/"
 };
 export {
   R as CurrencySymbols

package/dist/esm/components/product-picker-v2/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../../../src/components/product-picker-v2/constants.ts"],"sourcesContent":["export const CurrencySymbols = {\n\tUSD: '$',\n\tGBP: '£',\n\tCAD: 'C$',\n\tAUD: 'A$',\n\tDKK: 'DKK',\n\tSEK: 'SEK',\n\tEUR: '€',\n\tBRL: 'R$',\n\tTRY: '₺',\n\tJPY: '¥',\n\tSAR: 'ر.س',\n\tAED: 'د.إ',\n\tEGP: 'E£',\n\tMAD: 'د.م.',\n\tINR: '₹',\n\tCHF: 'Fr',\n\tCNY: '¥',\n\tNZD: 'NZ$',\n\tMXN: 'Mex$',\n\tZAR: 'R',\n\tRUB: '₽',\n\tKRW: '₩',\n\tSGD: 'S$',\n\tPKR: 'Rs',\n\tRO: 'lei',\n};\n"],"names":["CurrencySymbols"],"mappings":"AAAO,MAAMA,IAAkB;AAAA,EAC9B,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,IAAI;AACL;"}
+{"version":3,"file":"constants.js","sources":["../../../../src/components/product-picker-v2/constants.ts"],"sourcesContent":["export const CurrencySymbols = {\n\tUSD: '$',\n\tGBP: '£',\n\tCAD: 'C$',\n\tAUD: 'A$',\n\tDKK: 'DKK',\n\tSEK: 'SEK',\n\tEUR: '€',\n\tBRL: 'R$',\n\tTRY: '₺',\n\tJPY: '¥',\n\tSAR: 'ر.س',\n\tAED: 'د.إ',\n\tEGP: 'E£',\n\tMAD: 'د.م.',\n\tINR: '₹',\n\tCHF: 'Fr',\n\tCNY: '¥',\n\tNZD: 'NZ$',\n\tMXN: 'Mex$',\n\tZAR: 'R',\n\tRUB: '₽',\n\tKRW: '₩',\n\tSGD: 'S$',\n\tPKR: 'Rs',\n\tRO: 'lei',\n\tKES: 'KSh',\n\tNGN: '₦',\n\tHKD: 'HK$',\n\tTWD: 'NT$',\n\tTHB: '฿',\n\tMYR: 'RM',\n\tIDR: 'Rp',\n\tPHP: '₱',\n\tVND: '₫',\n\tBDT: '৳',\n\tLKR: 'Rs',\n\tNPR: 'Rs',\n\tNOK: 'kr',\n\tPLN: 'zł',\n\tCZK: 'Kč',\n\tHUF: 'Ft',\n\tRON: 'lei',\n\tBGN: 'лв',\n\tUAH: '₴',\n\tILS: '₪',\n\tQAR: 'ر.ق',\n\tKWD: 'د.ك',\n\tBHD: 'د.ب',\n\tOMR: 'ر.ع.',\n\tJOD: 'د.ا',\n\tGHS: '₵',\n\tTZS: 'TSh',\n\tUGX: 'USh',\n\tARS: '$',\n\tCLP: '$',\n\tCOP: '$',\n\tPEN: 'S/',\n};\n"],"names":["CurrencySymbols"],"mappings":"AAAO,MAAMA,IAAkB;AAAA,EAC9B,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AAAA,EACL,KAAK;AACN;"}

package/dist/esm/components/product-picker-v2/index.d.ts

@@ -1,2 +1,3 @@
 export * from './modal';
 export * from './type';
+export * from './constants';

package/dist/esm/components/variable-picker-v3/Content.js

@@ -8,9 +8,9 @@ import { flushSync as he } from "react-dom";
 import { COLORS as d } from "../../constants/Theme.js";
 import { TitleRegular as me, BodySecondary as U, BodyCaption as ue, TitleSmall as fe } from "../TypographyStyle.js";
 import { VariablePickerContext as pe } from "./context.js";
-import { DefaultVariableContent as ye } from "./DefaultVariableContent.js";
+import { DefaultVariableContent as ge } from "./DefaultVariableContent.js";
 import { highlightSearchText as X } from "./highlightSearchText.js";
-import { PickerType as ge } from "./model.js";
+import { PickerType as ye } from "./model.js";
 import Se from "./NoResult.js";
 import { showOnlyRecommendedVariables as S } from "./recommendVaribles.js";
 import { searchVariables as w } from "./searchVariables.js";
@@ -26,16 +26,16 @@ const Ie = /.*\..*/, De = (o) => /\w+\[\d+\]/g.test(o), He = (o) => {
   if (o.actualValue.match(Ie)) {
     const i = o.actualValue.replace("{{", "").replace("}}", "").split(".");
     let s = i[0];
-    return i.forEach((y, b) => {
+    return i.forEach((g, b) => {
       if (b === 0) return;
-      if (De(y)) {
-        const g = y.match(/(\w+)\[(\d+)\]/);
-        if (g) {
-          const x = g[1], B = g[2];
+      if (De(g)) {
+        const y = g.match(/(\w+)\[(\d+)\]/);
+        if (y) {
+          const x = y[1], B = y[2];
           s = s + `['${x}'][${B}]`;
         }
       } else
-        s = s + `['${y}']`;
+        s = s + `['${g}']`;
     }), s;
   } else
     return o.actualValueEval ? o.actualValueEval : o.actualValue;
@@ -43,17 +43,17 @@ const Ie = /.*\..*/, De = (o) => /\w+\[\d+\]/g.test(o), He = (o) => {
   const {
     data: i,
     onSelect: s,
-    showHeader: y,
+    showHeader: g,
     showBackButton: b,
     hideHeaderCross: P,
-    onBackButtonClick: g,
+    onBackButtonClick: y,
     isEvaluationList: x,
     autoOpenFirst: B,
     headerText: ee,
     contentHeight: E,
     onDefaultVariableSelect: te,
     skipDefaultVariableContent: R
-  } = o, [k, a] = m(i), [c, T] = m(""), [n, O] = m([]), [I, A] = m(""), [u, F] = m(!1), [D, L] = m([]), [h, H] = m(!1), [$, j] = m(), C = J(null), W = J([]), oe = h && o.type === ge.EMBEDDED && !P;
+  } = o, [k, a] = m(i), [c, T] = m(""), [n, O] = m([]), [I, A] = m(""), [u, F] = m(!1), [D, L] = m([]), [h, H] = m(!1), [$, j] = m(), C = J(null), W = J([]), oe = h && o.type === ye.EMBEDDED && !P;
   Q(() => {
     z(o.showRecommendedBar ?? !0);
   }, []), Q(() => {
@@ -203,18 +203,18 @@ const Ie = /.*\..*/, De = (o) => /\w+\[\d+\]/g.test(o), He = (o) => {
           },
           onClick: (e) => e.stopPropagation(),
           children: [
-            (y || b || h) && /* @__PURE__ */ p(be, { openDefault: h, children: [
+            (g || b || h) && /* @__PURE__ */ p(be, { openDefault: h, children: [
               /* @__PURE__ */ p("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
                 (b || h) && /* @__PURE__ */ t(
                   v,
                   {
                     Icon: le,
                     onClick: () => {
-                      h ? H(!1) : g && g();
+                      h ? H(!1) : y && y();
                     }
                   }
                 ),
-                (y || h) && /* @__PURE__ */ t(me, { children: h ? "Set up" : ee ?? "Select Variable" })
+                (g || h) && /* @__PURE__ */ t(me, { children: h ? "Set up" : ee ?? "Select Variable" })
               ] }),
               oe && /* @__PURE__ */ t(
                 v,
@@ -226,7 +226,7 @@ const Ie = /.*\..*/, De = (o) => /\w+\[\d+\]/g.test(o), He = (o) => {
               )
             ] }),
             h && $ && !R ? /* @__PURE__ */ t(
-              ye,
+              ge,
               {
                 variable: $,
                 onInsertVariable: (e) => {
@@ -264,6 +264,7 @@ const Ie = /.*\..*/, De = (o) => /\w+\[\d+\]/g.test(o), He = (o) => {
                 /* @__PURE__ */ t(
                   Be,
                   {
+                    "data-test": "variable-recommended-toggle",
                     value: u,
                     onValueChange: async (e) => {
                       await z(e);