npm - @bikdotai/bik-component-library - Versions diffs - 0.0.858-beta.1 → 0.0.858 - Mend

@bikdotai/bik-component-library 0.0.858-beta.1 → 0.0.858

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (77) hide show

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

	@@ -1 +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":"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"}
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 = 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":"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"}

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

@@ -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 CHANGED Viewed

	@@ -1 +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":";;;;;;;AAYA,MAAMA,IAAoD,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;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;AAG5C,EAAAC,EAAU,MAAM;AACf,IAAIT,KAEHI,EAAkB,EAAI;AAAA,EAExB,GAAG,CAACJ,CAAS,CAAC;AAEd,QAAMU,IAAgB,MAAY;AACjC,UAAMC,~~IAASpB~~,EAAQ,eAAe;AAEtC,~~QAAIoB~~,MAAW,aAAa;AAC3B,YAAMC,~~IAAMrB~~,EAAQ,eAAe,kBAAkBA,EAAQ;AAC7D,~~MAAIqB~~,KACgBA,EAAI,WAAW,MAAM,KAEvC,OAAO,KAAKA,GAAK,UAAU,qBAAqB;AAAA,IAGnD;AAKA,~~QAJAjB~~,~~EAAUgB~~,CAAM,GAGhBE,EAAiBN,EAAS,OAAO,GAC7BA,EAAS,~~WAAWhB~~,EAAQ,YAAY;AAC3C,~~YAAMuB~~,~~IACLvB~~,EAAQ,WAAW,WAAW,GAAG,KACjCA,EAAQ,WAAW,WAAW,GAAG,KACjCA,EAAQ,WAAW,WAAW,GAAG,IAC9BA,EAAQ,aACR,IAAIA,EAAQ,UAAU,~~IACpBwB~~,IAAgB,SAAS,cAAcD,CAAc;AAC3D,UAAIC,GAAe;AAClB,cAAMC,IAAiBC;AAAA,UACtBV,EAAS;AAAA,UACTQ;AAAA,QAAA;AAED,QAAAT,EAAaU,CAAc;AAAA,MAC5B;AACC,QAAAV,EAAa,UAAU;AAAA,IAEzB;AACC,MAAAA,EAAa,UAAU;AAExB,~~IAAAR~~,IAAqB,EAAI,~~GACzBG~~,EAAa,EAAI;AAAA,EAClB,GAEMiB,IAAwB,MAAY;AACzC,UAAMP,~~IAASpB~~,EAAQ,iBAAiB,~~QAClC4B~~,~~IACLpB,KAAqBL~~;AACtB,~~QAAI0B~~,IAA6B;~~AAIjC~~,QAAIT,MAAW,aAAa;~~AAC3B~~,YAAMC,~~IAAMrB~~,EAAQ,iBAAiB;AACrC,~~MAAIqB~~,MACgBA,EAAI,WAAW,MAAM,IAEvC,OAAO,KAAKA,GAAK,UAAU,qBAAqB,IAEhDQ,IAAcR;AAAA,IAGjB;AAMA,QADAC,EAAiBN,EAAS,OAAO,GAC7BA,EAAS,~~WAAWhB~~,EAAQ,YAAY;AAC3C,~~YAAMwB~~,IAAgBM,~~EAAsB9B~~,EAAQ,UAAU;AAC9D,~~UAAIwB~~,GAAe;AAClB,cAAMC,IAAiBC;AAAA,UACtBV,EAAS;AAAA,UACTQ;AAAA,QAAA;AAED,QAAAT,EAAaU,CAAc;AAAA,MAC5B;AACC,QAAAV,EAAa,UAAU;AAAA,IAEzB;AACC,MAAAA,EAAa,UAAU;AAExB,~~IAAAR~~,IAAqB,EAAI,~~GACzBG~~,EAAa,EAAI,GACjBqB,EAAsB,YAAY;AACjC,YAAMH,~~EAAcR~~,~~CAAM~~,~~GACtBS,~~MACH,OAAO,SAAS,OAAOA;AAAA,IAEzB,CAAC;AAAA,EACF,GAEMG,IAASC,EAAoBrB,GAAgBE,CAAS;AAE5D,2BACE,OAAA,EAAI,KAAKE,GAAU,OAAOgB,EAAO,WAEjC,UAAA;AAAA,IAAA,gBAAAE,EAAC,OAAA,EAAI,OAAOF,EAAO,gBACjB,~~UAAAhC~~,EAAQ,eACR,~~gBAAAkC~~,EAAC,OAAA,EAAI,OAAOF,EAAO,cAClB,UAAA,gBAAAE;AAAA,MAAC;AAAA,MAAA;AAAA,QACA,~~KAAKlC~~,EAAQ;AAAA,QACb,KAAKA,EAAQ;AAAA,QACb,~~OAAOgC~~,EAAO;AAAA,QACd,SAAS,CAACG,MAAM;AACf,~~UAAInC~~,EAAQ,~~UACVmC~~,EAAE,OAA4B,~~MAAMnC~~,EAAQ;AAAA,QAE/C;AAAA,MAAA;AAAA,IAAA,EACD,CACD,IAEA,~~gBAAAkC~~,EAAC,OAAA,EAAI,OAAOF,EAAO,kBACjB,UAAAI,EAAK,4BAAA,CACP,EAAA,CAEF;AAAA,IAGA,gBAAAC,EAAC,OAAA,EAAI,OAAOL,EAAO,kBAClB,UAAA;AAAA,MAAA,gBAAAK,EAAC,OAAA,EACA,UAAA;AAAA,QAAA,gBAAAH,EAAC,MAAA,EAAG,OAAOF,EAAO,OAAQ,YAAQ,OAAM;AAAA,QACxC,gBAAAE;AAAA,UAAC;AAAA,UAAA;AAAA,YACA,OAAOF,EAAO;AAAA,YACd,yBAAyB;AAAA,cACxB,QAAQM,~~EAAmBtC~~,EAAQ,WAAWA,EAAQ,QAAQ,EAAE;AAAA,YAAA;AAAA,UACjE;AAAA,QAAA;AAAA,MACD,GACD;AAAA,MAGA,~~gBAAAqC~~,EAAC,OAAA,EAAI,OAAOL,EAAO,kBAEjB,UAAA;AAAA,~~QAAAhC~~,EAAQ,iBAAiB,QACzB,~~gBAAAkC~~,EAAC,QAAA,EAAK,SAASP,GAAuB,OAAOK,EAAO,gBAClD,~~UAAAhC~~,EAAQ,gBAAgB,MAC1B;AAAA,QAID,~~gBAAAkC~~,EAAC,UAAA,EAAO,SAASf,GAAe,OAAOa,EAAO,eAC5C,~~UAAAhC~~,EAAQ,eAAe,QACvBA,EAAQ,~~cACRoC~~,EAAK,oBAAA,CACP;AAAA,MAAA,EAAA,CACD;AAAA,IAAA,EAAA,CACD;AAAA,EAAA,GACD;AAEF;"}
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}) => {\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 CHANGED Viewed

@@ -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
@@ -54,7 +54,7 @@ export interface FeatureAnnouncementProviderProps extends FeatureAnnouncementRep
      */
     storeId?: string;
     /**
-     * Callback fired when a major or minor announcement popup is shown
+     * Callback fired when a major announcement popup is shown
      */
     onAnnouncementShown?: (event: AnnouncementEvent) => void;
     /**

package/dist/esm/components/input/ChipInput.js CHANGED Viewed

@@ -1,13 +1,14 @@
-import { jsxs as y, jsx as s } from "react/jsx-runtime";
-import { useState as C, useRef as L } from "react";
+import { jsxs as y, jsx as r } from "react/jsx-runtime";
+import { useState as C, useRef as I } from "react";
 import { COLORS as o } from "../../constants/Theme.js";
-import { BodySecondary as O, BodyCaption as T } from "../TypographyStyle.js";
-import { getContainerStyle as $, getContainerHoverStyle as H, getChipStyle as P, getChipRemoveStyle as _, getInputStyle as q } from "./ChipInput.styled.js";
-const U = ({
-  onChipsChange: r,
-  placeholder: f,
+import { stripHtmlTags as L } from "../../helpers/sanitize.js";
+import { BodySecondary as O, BodyCaption as H } from "../TypographyStyle.js";
+import { getContainerStyle as $, getContainerHoverStyle as P, getChipStyle as _, getChipRemoveStyle as q, getInputStyle as z } from "./ChipInput.styled.js";
+const X = ({
+  onChipsChange: c,
+  placeholder: m,
   chips: n,
-  label: m,
+  label: f,
   labelColor: h,
   hintText: p,
   hintTextColor: k,
@@ -17,63 +18,63 @@ const U = ({
   chipsContainerCustomStyle: b,
   nativeID: x
 }) => {
-  const [a, u] = C(""), [c, g] = C(!1), S = L(null), d = R || [",", 188, "Enter", 13], B = (e) => {
+  const [i, u] = C(""), [s, g] = C(!1), S = I(null), d = R || [",", 188, "Enter", 13], B = (e) => {
     if (d.includes(e.key) || d.includes(e.keyCode) || d.includes(e.which)) {
       e.preventDefault();
-      const t = a.trim();
-      t && !n.includes(t) && (r([...n, t]), u(""));
-    } else e.key === "Backspace" && a === "" && n.length > 0 && r(n.slice(0, -1));
+      const t = i.trim();
+      t && !n.includes(t) && (c([...n, t]), u(""));
+    } else e.key === "Backspace" && i === "" && n.length > 0 && c(n.slice(0, -1));
   }, K = (e) => {
-    r(n.filter((i, t) => t !== e));
+    c(n.filter((a, t) => t !== e));
   }, D = () => {
     g(!0);
   }, M = () => {
     g(!1);
-    const e = a.trim();
-    e && !n.includes(e) && (r([...n, e]), u(""));
-  }, V = () => {
+    const e = i.trim();
+    e && !n.includes(e) && (c([...n, e]), u(""));
+  }, T = () => {
     S.current?.focus();
-  }, j = $(
+  }, V = $(
     !!l,
     v,
     b,
-    c
-  ), w = c ? {} : H(), E = P(), F = _(), I = q(v);
+    s
+  ), j = s ? {} : P(), w = _(), E = q(), F = z(v);
   return /* @__PURE__ */ y(
     "div",
     {
       style: { display: "flex", flexDirection: "column", gap: 8 },
       id: x,
       children: [
-        m && /* @__PURE__ */ s(
+        f && /* @__PURE__ */ r(
           O,
           {
             style: {
-              color: c ? o.content.brand : l ? o.content.negative : h || o.content.primary
+              color: s ? o.content.brand : l ? o.content.negative : h || o.content.primary
             },
-            children: m
+            children: f
           }
         ),
         /* @__PURE__ */ y(
           "div",
           {
-            style: j,
-            onClick: V,
+            style: V,
+            onClick: T,
             onMouseEnter: (e) => {
-              c || Object.assign(e.currentTarget.style, w);
+              s || Object.assign(e.currentTarget.style, j);
             },
             onMouseLeave: (e) => {
-              c || (e.currentTarget.style.border = `1px solid ${l ? o.stroke.negative.vibrant : o.stroke.primary}`);
+              s || (e.currentTarget.style.border = `1px solid ${l ? o.stroke.negative.vibrant : o.stroke.primary}`);
             },
             children: [
-              n.map((e, i) => /* @__PURE__ */ y("div", { style: E, children: [
-                /* @__PURE__ */ s("span", { children: e }),
-                /* @__PURE__ */ s(
+              n.map((e, a) => /* @__PURE__ */ y("div", { style: w, children: [
+                /* @__PURE__ */ r("span", { children: e }),
+                /* @__PURE__ */ r(
                   "button",
                   {
-                    style: F,
+                    style: E,
                     onClick: (t) => {
-                      t.stopPropagation(), K(i);
+                      t.stopPropagation(), K(a);
                     },
                     onMouseEnter: (t) => {
                       t.currentTarget.style.color = o.content.secondary;
@@ -85,26 +86,26 @@ const U = ({
                     children: "×"
                   }
                 )
-              ] }, i)),
-              /* @__PURE__ */ s(
+              ] }, a)),
+              /* @__PURE__ */ r(
                 "input",
                 {
                   ref: S,
                   type: "text",
-                  value: a,
-                  onChange: (e) => u(e.target.value),
+                  value: i,
+                  onChange: (e) => u(L(e.target.value)),
                   onKeyDown: B,
                   onFocus: D,
                   onBlur: M,
-                  placeholder: n.length === 0 && f && !c ? f : void 0,
-                  style: I
+                  placeholder: n.length === 0 && m && !s ? m : void 0,
+                  style: F
                 }
               )
             ]
           }
         ),
-        (!!p || !!l) && /* @__PURE__ */ s(
-          T,
+        (!!p || !!l) && /* @__PURE__ */ r(
+          H,
           {
             style: {
               color: l ? o.content.negative : k || o.content.secondary
@@ -117,6 +118,6 @@ const U = ({
   );
 };
 export {
-  U as default
+  X as default
 };
 //# sourceMappingURL=ChipInput.js.map

package/dist/esm/components/input/ChipInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChipInput.js","sources":["../../../../src/components/input/ChipInput.tsx"],"sourcesContent":["import React, { KeyboardEvent, useRef, useState } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { BodyCaption, BodySecondary } from '../TypographyStyle';\nimport {\n\tgetChipRemoveStyle,\n\tgetChipStyle,\n\tgetContainerHoverStyle,\n\tgetContainerStyle,\n\tgetInputStyle,\n} from './ChipInput.styled';\n\nexport const extractSingleValueIfAny = (nativeID: string) =>\n\t(document?.querySelector(`#${nativeID} input`) as HTMLInputElement)?.value;\n\nexport const getInputNode = (nativeID: string) =>\n\tdocument?.querySelector(`#${nativeID} input`) as HTMLInputElement;\n\nexport interface ChipInputProps {\n\tonChipsChange: (chips: (string \| number)[]) => void;\n\tplaceholder: string;\n\tlabel?: string;\n\tlabelColor?: string;\n\thintText?: string;\n\thintTextColor?: string;\n\tchipTheme?: () => void;\n\tchips: string[];\n\terror?: string;\n\tinputHeight?: number;\n\tcreateChipKeys?: (string \| number)[];\n\tchipsContainerCustomStyle?: React.CSSProperties;\n\tnativeID?: string;\n}\n\nconst ChipInput: React.FC<ChipInputProps> = ({\n\tonChipsChange,\n\tplaceholder,\n\tchips,\n\tlabel,\n\tlabelColor,\n\thintText,\n\thintTextColor,\n\terror,\n\tinputHeight,\n\tcreateChipKeys,\n\tchipsContainerCustomStyle,\n\tnativeID,\n}) => {\n\tconst [inputValue, setInputValue] = useState('');\n\tconst [focused, setFocused] = useState(false);\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\n\t// Default chip creation keys: comma (188), enter (13)\n\tconst defaultKeys = [',', 188, 'Enter', 13];\n\tconst chipKeys = createChipKeys \|\| defaultKeys;\n\n\tconst handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n\t\tconst shouldCreateChip =\n\t\t\tchipKeys.includes(e.key) \|\|\n\t\t\tchipKeys.includes(e.keyCode) \|\|\n\t\t\tchipKeys.includes(e.which);\n\n\t\tif (shouldCreateChip) {\n\t\t\te.preventDefault();\n\t\t\tconst trimmedValue = inputValue.trim();\n\t\t\tif (trimmedValue && !chips.includes(trimmedValue)) {\n\t\t\t\tonChipsChange([...chips, trimmedValue]);\n\t\t\t\tsetInputValue('');\n\t\t\t}\n\t\t} else if (e.key === 'Backspace' && inputValue === '' && chips.length > 0) {\n\t\t\t// Remove last chip on backspace when input is empty\n\t\t\tonChipsChange(chips.slice(0, -1));\n\t\t}\n\t};\n\n\tconst handleRemoveChip = (indexToRemove: number) => {\n\t\tonChipsChange(chips.filter((_, index) => index !== indexToRemove));\n\t};\n\n\tconst handleFocus = () => {\n\t\tsetFocused(true);\n\t};\n\n\tconst handleBlur = () => {\n\t\tsetFocused(false);\n\t\t// Optionally create chip on blur if there's a value\n\t\tconst trimmedValue = inputValue.trim();\n\t\tif (trimmedValue && !chips.includes(trimmedValue)) {\n\t\t\tonChipsChange([...chips, trimmedValue]);\n\t\t\tsetInputValue('');\n\t\t}\n\t};\n\n\tconst handleContainerClick = () => {\n\t\tinputRef.current?.focus();\n\t};\n\n\tconst containerStyle = getContainerStyle(\n\t\t!!error,\n\t\tinputHeight,\n\t\tchipsContainerCustomStyle,\n\t\tfocused,\n\t);\n\tconst containerHoverStyle = focused ? {} : getContainerHoverStyle();\n\tconst chipStyle = getChipStyle();\n\tconst chipRemoveStyle = getChipRemoveStyle();\n\tconst inputStyle = getInputStyle(inputHeight);\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{ display: 'flex', flexDirection: 'column', gap: 8 }}\n\t\t\tid={nativeID}\n\t\t>\n\t\t\t{label && (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tcolor: focused\n\t\t\t\t\t\t\t? COLORS.content.brand\n\t\t\t\t\t\t\t: error\n\t\t\t\t\t\t\t? COLORS.content.negative\n\t\t\t\t\t\t\t: labelColor \|\| COLORS.content.primary,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{label}\n\t\t\t\t</BodySecondary>\n\t\t\t)}\n\t\t\t<div\n\t\t\t\tstyle={containerStyle}\n\t\t\t\tonClick={handleContainerClick}\n\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\tif (!focused) {\n\t\t\t\t\t\tObject.assign(e.currentTarget.style, containerHoverStyle);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\tif (!focused) {\n\t\t\t\t\t\te.currentTarget.style.border = `1px solid ${\n\t\t\t\t\t\t\terror ? COLORS.stroke.negative.vibrant : COLORS.stroke.primary\n\t\t\t\t\t\t}`;\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{chips.map((chip, index) => (\n\t\t\t\t\t<div key={index} style={chipStyle}>\n\t\t\t\t\t\t<span>{chip}</span>\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tstyle={chipRemoveStyle}\n\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\t\thandleRemoveChip(index);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\t\t\t\te.currentTarget.style.color = COLORS.content.secondary;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\t\t\t\te.currentTarget.style.color = COLORS.content.secondary;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\taria-label={`Remove ${chip}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t×\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t\t<input\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tvalue={inputValue}\n\t\t\t\t\tonChange={(e) => setInputValue(e.target.value)}\n\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\tonFocus={handleFocus}\n\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tchips.length === 0 && !!placeholder && !focused\n\t\t\t\t\t\t\t? placeholder\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tstyle={inputStyle}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t{(!!hintText \|\| !!error) && (\n\t\t\t\t<BodyCaption\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tcolor: error\n\t\t\t\t\t\t\t? COLORS.content.negative\n\t\t\t\t\t\t\t: hintTextColor \|\| COLORS.content.secondary,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{error ? error : hintText}\n\t\t\t\t</BodyCaption>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default ChipInput;\n"],"names":["ChipInput","onChipsChange","placeholder","chips","label","labelColor","hintText","hintTextColor","error","inputHeight","createChipKeys","chipsContainerCustomStyle","nativeID","inputValue","setInputValue","useState","focused","setFocused","inputRef","useRef","chipKeys","handleKeyDown","trimmedValue","handleRemoveChip","indexToRemove","_","index","handleFocus","handleBlur","handleContainerClick","containerStyle","getContainerStyle","containerHoverStyle","getContainerHoverStyle","chipStyle","getChipStyle","chipRemoveStyle","getChipRemoveStyle","inputStyle","getInputStyle","jsxs","jsx","BodySecondary","COLORS","chip","e","BodyCaption"],"mappings":"~~;;;;;AAiCA~~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~~kBAC7C~~,~~WAAWO~~;AAAA,kBACX,SAASM;AAAA,kBACT,QAAQC;AAAA,kBACR,aACCzB,EAAM,WAAW,KAAOD,KAAe,CAACc,IACrCd,IACA;AAAA,kBAEJ,OAAOoC;AAAA,gBAAA;AAAA,cAAA;AAAA,YACR;AAAA,UAAA;AAAA,QAAA;AAAA,SAEC,CAAC,CAAChC,KAAY,CAAC,CAACE,MACjB,gBAAAiC;AAAA,~~UAACK~~;AAAA,UAAA;AAAA,YACA,OAAO;AAAA,cACN,~~OAAOtC~~,IACJmC,EAAO,QAAQ,WACfpC,KAAiBoC,EAAO,QAAQ;AAAA,YAAA;AAAA,YAGnC,eAAgBrC;AAAA,UAAA;AAAA,QAAA;AAAA,MAClB;AAAA,IAAA;AAAA,EAAA;AAIJ;"}
1	+ {"version":3,"file":"ChipInput.js","sources":["../../../../src/components/input/ChipInput.tsx"],"sourcesContent":["import React, { KeyboardEvent, useRef, useState } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { stripHtmlTags } from '../../helpers/sanitize';\nimport { BodyCaption, BodySecondary } from '../TypographyStyle';\nimport {\n\tgetChipRemoveStyle,\n\tgetChipStyle,\n\tgetContainerHoverStyle,\n\tgetContainerStyle,\n\tgetInputStyle,\n} from './ChipInput.styled';\n\nexport const extractSingleValueIfAny = (nativeID: string) =>\n\t(document?.querySelector(`#${nativeID} input`) as HTMLInputElement)?.value;\n\nexport const getInputNode = (nativeID: string) =>\n\tdocument?.querySelector(`#${nativeID} input`) as HTMLInputElement;\n\nexport interface ChipInputProps {\n\tonChipsChange: (chips: (string \| number)[]) => void;\n\tplaceholder: string;\n\tlabel?: string;\n\tlabelColor?: string;\n\thintText?: string;\n\thintTextColor?: string;\n\tchipTheme?: () => void;\n\tchips: string[];\n\terror?: string;\n\tinputHeight?: number;\n\tcreateChipKeys?: (string \| number)[];\n\tchipsContainerCustomStyle?: React.CSSProperties;\n\tnativeID?: string;\n}\n\nconst ChipInput: React.FC<ChipInputProps> = ({\n\tonChipsChange,\n\tplaceholder,\n\tchips,\n\tlabel,\n\tlabelColor,\n\thintText,\n\thintTextColor,\n\terror,\n\tinputHeight,\n\tcreateChipKeys,\n\tchipsContainerCustomStyle,\n\tnativeID,\n}) => {\n\tconst [inputValue, setInputValue] = useState('');\n\tconst [focused, setFocused] = useState(false);\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\n\t// Default chip creation keys: comma (188), enter (13)\n\tconst defaultKeys = [',', 188, 'Enter', 13];\n\tconst chipKeys = createChipKeys \|\| defaultKeys;\n\n\tconst handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n\t\tconst shouldCreateChip =\n\t\t\tchipKeys.includes(e.key) \|\|\n\t\t\tchipKeys.includes(e.keyCode) \|\|\n\t\t\tchipKeys.includes(e.which);\n\n\t\tif (shouldCreateChip) {\n\t\t\te.preventDefault();\n\t\t\tconst trimmedValue = inputValue.trim();\n\t\t\tif (trimmedValue && !chips.includes(trimmedValue)) {\n\t\t\t\tonChipsChange([...chips, trimmedValue]);\n\t\t\t\tsetInputValue('');\n\t\t\t}\n\t\t} else if (e.key === 'Backspace' && inputValue === '' && chips.length > 0) {\n\t\t\t// Remove last chip on backspace when input is empty\n\t\t\tonChipsChange(chips.slice(0, -1));\n\t\t}\n\t};\n\n\tconst handleRemoveChip = (indexToRemove: number) => {\n\t\tonChipsChange(chips.filter((_, index) => index !== indexToRemove));\n\t};\n\n\tconst handleFocus = () => {\n\t\tsetFocused(true);\n\t};\n\n\tconst handleBlur = () => {\n\t\tsetFocused(false);\n\t\t// Optionally create chip on blur if there's a value\n\t\tconst trimmedValue = inputValue.trim();\n\t\tif (trimmedValue && !chips.includes(trimmedValue)) {\n\t\t\tonChipsChange([...chips, trimmedValue]);\n\t\t\tsetInputValue('');\n\t\t}\n\t};\n\n\tconst handleContainerClick = () => {\n\t\tinputRef.current?.focus();\n\t};\n\n\tconst containerStyle = getContainerStyle(\n\t\t!!error,\n\t\tinputHeight,\n\t\tchipsContainerCustomStyle,\n\t\tfocused,\n\t);\n\tconst containerHoverStyle = focused ? {} : getContainerHoverStyle();\n\tconst chipStyle = getChipStyle();\n\tconst chipRemoveStyle = getChipRemoveStyle();\n\tconst inputStyle = getInputStyle(inputHeight);\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{ display: 'flex', flexDirection: 'column', gap: 8 }}\n\t\t\tid={nativeID}\n\t\t>\n\t\t\t{label && (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tcolor: focused\n\t\t\t\t\t\t\t? COLORS.content.brand\n\t\t\t\t\t\t\t: error\n\t\t\t\t\t\t\t? COLORS.content.negative\n\t\t\t\t\t\t\t: labelColor \|\| COLORS.content.primary,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{label}\n\t\t\t\t</BodySecondary>\n\t\t\t)}\n\t\t\t<div\n\t\t\t\tstyle={containerStyle}\n\t\t\t\tonClick={handleContainerClick}\n\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\tif (!focused) {\n\t\t\t\t\t\tObject.assign(e.currentTarget.style, containerHoverStyle);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\tif (!focused) {\n\t\t\t\t\t\te.currentTarget.style.border = `1px solid ${\n\t\t\t\t\t\t\terror ? COLORS.stroke.negative.vibrant : COLORS.stroke.primary\n\t\t\t\t\t\t}`;\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{chips.map((chip, index) => (\n\t\t\t\t\t<div key={index} style={chipStyle}>\n\t\t\t\t\t\t<span>{chip}</span>\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tstyle={chipRemoveStyle}\n\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\t\thandleRemoveChip(index);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonMouseEnter={(e) => {\n\t\t\t\t\t\t\t\te.currentTarget.style.color = COLORS.content.secondary;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonMouseLeave={(e) => {\n\t\t\t\t\t\t\t\te.currentTarget.style.color = COLORS.content.secondary;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\taria-label={`Remove ${chip}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t×\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t\t<input\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tvalue={inputValue}\n\t\t\t\t\tonChange={(e) => setInputValue(stripHtmlTags(e.target.value))}\n\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t\tonFocus={handleFocus}\n\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tchips.length === 0 && !!placeholder && !focused\n\t\t\t\t\t\t\t? placeholder\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tstyle={inputStyle}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t{(!!hintText \|\| !!error) && (\n\t\t\t\t<BodyCaption\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tcolor: error\n\t\t\t\t\t\t\t? COLORS.content.negative\n\t\t\t\t\t\t\t: hintTextColor \|\| COLORS.content.secondary,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{error ? error : hintText}\n\t\t\t\t</BodyCaption>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default ChipInput;\n"],"names":["ChipInput","onChipsChange","placeholder","chips","label","labelColor","hintText","hintTextColor","error","inputHeight","createChipKeys","chipsContainerCustomStyle","nativeID","inputValue","setInputValue","useState","focused","setFocused","inputRef","useRef","chipKeys","handleKeyDown","trimmedValue","handleRemoveChip","indexToRemove","_","index","handleFocus","handleBlur","handleContainerClick","containerStyle","getContainerStyle","containerHoverStyle","getContainerHoverStyle","chipStyle","getChipStyle","chipRemoveStyle","getChipRemoveStyle","inputStyle","getInputStyle","jsxs","jsx","BodySecondary","COLORS","chip","e","stripHtmlTags","BodyCaption"],"mappings":"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"}

package/dist/esm/components/input/Input-helper.d.ts CHANGED Viewed

@@ -1,5 +1,12 @@
 import { InputTypeI } from './Input.model';
 export declare const isFunction: (fn: any) => boolean;
+/**
+ * Strip any HTML markup from a plain-text input value. Backed by DOMPurify
+ * (parser-based, immune to the malformed-tag bypasses a regex misses); on the
+ * server DOMPurify is unavailable so a regex tag-strip is used as a fallback.
+ * Text characters like `<` / `>` in ordinary content are preserved because
+ * DOMPurify keeps text content and only removes recognised tags.
+ */
 export declare const sanitizeUnsafeInput: (input: string) => string;
 export declare const shouldSanitizeForType: (type: InputTypeI) => boolean;
 export declare const validateInput: (inputText: string | number, type: InputTypeI, rangeValidation?: {