{"version":3,"file":"VideoWithAnimatedText-Chunk-4c945e1a8e18177f5006.js","mappings":"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","sources":["webpack://nikon-client/./components/atoms/Image/Image.tsx","webpack://nikon-client/./components/atoms/Video/Video.tsx","webpack://nikon-client/./components/molecules/InViewVideo/InViewVideo.tsx","webpack://nikon-client/./components/organisms/VideoWithAnimatedText/VideoWithAnimatedTextItem.tsx","webpack://nikon-client/./components/organisms/VideoWithAnimatedText/VideoWithAnimatedText.tsx","webpack://nikon-client/./models/enums/BreakpointEnum.ts","webpack://nikon-client/./state-management/AriaLabelsStore.ts","webpack://nikon-client/./utility/helpers/gtm.ts","webpack://nikon-client/./utility/hooks/useAriaLabels.ts","webpack://nikon-client/./utility/hooks/useBreakpoint.ts","webpack://nikon-client/./utility/hooks/usePreviewMode.ts"],"sourcesContent":["import BreakpointEnum from '@models/enums/BreakpointEnum';\nimport { IImage } from '@models/IImage';\nimport useBreakpoint from '@utils/hooks/useBreakpoint';\nimport classNames from 'classnames';\nimport { PropsWithChildren, RefObject, useState } from 'react';\n\ninterface Props {\n  readonly classes?: string;\n  readonly dataTestId?: string;\n  readonly epiEdit?: string;\n  readonly image?: IImage;\n  readonly imageClasses?: string;\n  readonly imageRef?:\n    | RefObject<HTMLImageElement>\n    | ((node: HTMLElement | null) => void);\n  readonly lazyLoad?: boolean;\n  readonly progressiveLoad?: boolean;\n  readonly sizes?: string;\n}\n\nconst Image = ({\n  children,\n  classes,\n  dataTestId,\n  epiEdit,\n  image,\n  imageClasses,\n  imageRef,\n  lazyLoad = true,\n  progressiveLoad = true,\n  sizes = '',\n}: PropsWithChildren<Props>) => {\n  const mobileSource = image?.mobile;\n  const tabletSource = image?.tablet;\n  const desktopSource = image?.desktop;\n  const largeDesktopSource = image?.largeDesktop;\n  const breakpoint = useBreakpoint() as BreakpointEnum;\n  const [isLoaded, setIsLoaded] = useState<boolean>(false);\n\n  if (!desktopSource?.url) return null;\n\n  const currentSrc = {\n    [BreakpointEnum.Small]: mobileSource,\n    [BreakpointEnum.Medium]: tabletSource,\n    [BreakpointEnum.Large]: desktopSource,\n    [BreakpointEnum.XLarge]: largeDesktopSource,\n  };\n\n  return (\n    <picture className={classNames(classes)}>\n      <source\n        type=\"image/webp\"\n        sizes={sizes}\n        srcSet={`${mobileSource?.url} 376w, ${tabletSource?.url} 768w, ${desktopSource?.url} 1024w, ${largeDesktopSource?.url} 1440w`}\n      />\n      <img\n        ref={imageRef}\n        alt={image?.altText?.length ? image?.altText : 'nikon-image'}\n        className={classNames(\n          imageClasses,\n          'transition duration-500 ease-in-out'\n        )}\n        data-epi-property-name={epiEdit}\n        draggable=\"false\"\n        loading={lazyLoad ? 'lazy' : 'eager'}\n        onLoad={() => setIsLoaded(true)}\n        sizes={sizes}\n        src={\n          isLoaded && progressiveLoad\n            ? currentSrc[breakpoint]?.url\n            : mobileSource?.url\n        }\n        height={currentSrc[breakpoint]?.height}\n        width={currentSrc[breakpoint]?.width}\n        srcSet={`${mobileSource?.originalUrl} 376w, ${tabletSource?.originalUrl} 768w, ${desktopSource?.originalUrl} 1024w, ${largeDesktopSource?.originalUrl} 1440w`}\n        {...(dataTestId && { 'data-testid': dataTestId })}\n      />\n      {isLoaded && children}\n    </picture>\n  );\n};\n\nexport default Image;\n","import loadable from '@loadable/component';\nimport { AspectRatioType } from '@models/IAspectRatio';\nimport { IVideoAttributes } from '@models/IVideoAttributes';\nimport updateDataLayer from '@utils/helpers/gtm';\nimport classNames from 'classnames';\nimport { motion, MotionValue } from 'framer-motion';\nimport {\n  ChangeEvent,\n  ForwardedRef,\n  forwardRef,\n  useEffect,\n  useState,\n} from 'react';\nimport { Config } from 'react-player';\n\nconst ReactPlayer = loadable(\n  () => import(/* webpackChunkName: \"react-player\" */ 'react-player')\n);\n\ninterface Props {\n  readonly classes?: string;\n  readonly config?: Config;\n  readonly controls?: boolean;\n  readonly epiEdit?: string;\n  readonly isPlaying?: boolean;\n  readonly title?: string;\n  readonly url?: string;\n  readonly videoAttributes?: IVideoAttributes;\n  readonly videoRatio?: AspectRatioType;\n  readonly videoSource?: string;\n  readonly videoWrapperOpacityProgress?: MotionValue<number>;\n  readonly onEndedVideo?: () => void;\n  readonly onVideoReady?: () => void;\n  readonly onVideoStart?: () => void;\n  readonly onVolumeChange?: (videoElement: HTMLVideoElement) => void;\n  readonly setIsPlaying?: (playing: boolean) => void;\n}\n\nconst Video = forwardRef(\n  (\n    {\n      classes,\n      config,\n      controls = true,\n      epiEdit,\n      isPlaying,\n      title,\n      videoAttributes,\n      videoRatio = 'aspect-video',\n      videoSource,\n      videoWrapperOpacityProgress,\n      onEndedVideo,\n      onVideoReady,\n      onVideoStart,\n      onVolumeChange,\n      setIsPlaying,\n    }: Props,\n    ref\n  ) => {\n    const [prevProgress, setPrevProgress] = useState(0);\n    const [isBrowser, setIsBrowser] = useState(false);\n\n    useEffect(() => {\n      setIsBrowser(typeof window !== 'undefined');\n    }, []);\n\n    useEffect(() => {\n      setPrevProgress(0);\n    }, [title]);\n\n    const handleProgressUpdate = (progress: string) => {\n      updateDataLayer({\n        event: 'videoInteraction',\n        video_interaction: 'video_progress',\n        video_progress: progress,\n        video_title: title,\n      });\n    };\n\n    const handleVideoAction = (action: string) => {\n      updateDataLayer({\n        event: 'videoInteraction',\n        video_interaction:\n          action === 'START' ? 'video_start' : 'video_complete',\n        video_progress: action === 'START' ? 'video_start' : 'video_complete',\n        video_title: title,\n      });\n    };\n\n    const updateVideoProgressData = (progress: number) => {\n      if (prevProgress < 0.25 && progress > 0.25) {\n        handleProgressUpdate('25%');\n      }\n      if (prevProgress < 0.5 && progress > 0.5) {\n        handleProgressUpdate('50%');\n      }\n      if (prevProgress < 0.75 && progress > 0.75) {\n        handleProgressUpdate('75%');\n      }\n      if (prevProgress > 0.9 && progress < 0.1) {\n        handleVideoAction('COMPLETE');\n      }\n      setPrevProgress(progress);\n    };\n\n    if (!videoSource) return null;\n\n    return (\n      <motion.div\n        ref={ref as ForwardedRef<HTMLDivElement>}\n        className={classNames(classes, videoRatio, 'w-full')}\n        data-epi-property-name={epiEdit}\n        data-testid={isPlaying ? 'video-playing' : 'video-paused'}\n        style={{\n          opacity: videoWrapperOpacityProgress ?? 1,\n        }}\n      >\n        {isBrowser && (\n          <ReactPlayer\n            url={videoSource}\n            width=\"100%\"\n            height=\"100%\"\n            controls={controls}\n            playing\n            onProgress={({ played }) => updateVideoProgressData(played)}\n            onStart={() => {\n              onVideoStart?.();\n              handleVideoAction('START');\n            }}\n            onEnded={() => {\n              onEndedVideo?.();\n              handleVideoAction('COMPLETE');\n            }}\n            onPause={() => setIsPlaying?.(false)}\n            onPlay={() => setIsPlaying?.(true)}\n            onReady={onVideoReady}\n            config={config}\n            onVolumeChange={(event: ChangeEvent<HTMLVideoElement>) => {\n              onVolumeChange?.(event.target);\n            }}\n            {...videoAttributes}\n          />\n        )}\n      </motion.div>\n    );\n  }\n);\n\nexport default Video;\n","import Icon from '@atoms/Icon/Icon';\nimport Image from '@atoms/Image/Image';\nimport Video from '@atoms/Video/Video';\nimport { AspectRatioType } from '@models/IAspectRatio';\nimport { IImage } from '@models/IImage';\nimport { IMeta } from '@models/IMeta';\nimport { IVideo } from '@models/IVideo';\nimport useAriaLabels from '@utils/hooks/useAriaLabels';\nimport classNames from 'classnames';\nimport { AnimatePresence, motion, MotionValue, useInView } from 'framer-motion';\nimport { RefObject, useEffect, useRef, useState } from 'react';\n\ninterface Props {\n  readonly autoPlay?: boolean;\n  readonly controls?: boolean;\n  readonly coverImage?: IImage;\n  readonly dataTestId?: string;\n  readonly hasInVideoPlayButton?: boolean;\n  readonly inVideoPlayButtonClassName?: string;\n  readonly inVideoPlayButtonPositionClassName?: string;\n  readonly inVideoPlayButtonTabIndex?: number;\n  readonly inViewThreshold?: number;\n  readonly meta?: IMeta;\n  readonly playOnCoverClick?: boolean;\n  readonly video: IVideo;\n  readonly videoClasses?: string;\n  readonly videoRatio?: AspectRatioType;\n  readonly videoWrapperOpacityProgress?: MotionValue<number>;\n  readonly wrapperClasses?: string;\n  readonly onFocusCallback?: (e: React.FocusEvent<HTMLButtonElement>) => void;\n}\n\nconst InViewVideo = ({\n  autoPlay = false,\n  controls,\n  coverImage,\n  dataTestId = 'In-View-Video',\n  hasInVideoPlayButton,\n  inVideoPlayButtonClassName,\n  inVideoPlayButtonPositionClassName = 'bottom-5 left-5',\n  inVideoPlayButtonTabIndex = 0,\n  inViewThreshold = 0.5,\n  meta,\n  onFocusCallback,\n  playOnCoverClick = true,\n  video,\n  videoClasses,\n  videoRatio,\n  videoWrapperOpacityProgress,\n  wrapperClasses,\n}: Props) => {\n  const [isPlaying, setIsPlaying] = useState(false);\n  const [isVideoManuallyPaused, setIsVideoManuallyPaused] = useState(false);\n  const [isMuted, setIsMuted] = useState(false);\n  const [videoReady, setVideoReady] = useState(false);\n  const videoRef = useRef<HTMLDivElement>(null);\n  const inView = useInView(videoRef, { amount: inViewThreshold });\n  const isAutoPlaying = !hasInVideoPlayButton\n    ? autoPlay\n    : autoPlay && !isVideoManuallyPaused;\n  const { playVideoAriaLabel, pauseVideoAriaLabel } = useAriaLabels();\n\n  useEffect(() => {\n    setIsPlaying(isAutoPlaying && inView);\n    setIsMuted(!controls || !inView || isAutoPlaying);\n  }, [isAutoPlaying, inView, controls]);\n\n  return (\n    <div\n      className={classNames('relative', wrapperClasses)}\n      data-testid={dataTestId}\n    >\n      <Video\n        classes={videoClasses}\n        title={video?.url}\n        videoSource={video?.url}\n        ref={videoRef as unknown as RefObject<HTMLDivElement>}\n        videoAttributes={{\n          playsinline: true,\n          muted: isMuted,\n          playing: isPlaying,\n          loop: true,\n        }}\n        onVideoReady={() => setVideoReady(true)}\n        epiEdit={meta?.editHints?.video as string | undefined}\n        controls={controls}\n        videoRatio={videoRatio}\n        isPlaying={isPlaying}\n        setIsPlaying={setIsPlaying}\n        videoWrapperOpacityProgress={videoWrapperOpacityProgress}\n        onVolumeChange={(videoElement) => {\n          setIsMuted(videoElement.volume === 0 || videoElement.muted);\n        }}\n      />\n\n      {hasInVideoPlayButton && videoReady && (\n        <button\n          type=\"button\"\n          aria-label={isPlaying ? pauseVideoAriaLabel : playVideoAriaLabel}\n          className={classNames(\n            'absolute z-20 flex h-7.5 w-7.5 items-center justify-center rounded-full bg-black bg-opacity-50',\n            inVideoPlayButtonPositionClassName,\n            inVideoPlayButtonClassName\n          )}\n          onClick={() => {\n            setIsPlaying(!isPlaying);\n            setIsVideoManuallyPaused(isPlaying);\n          }}\n          onFocus={onFocusCallback}\n          data-testid={`${dataTestId}-${isPlaying ? 'Pause' : 'Play'}-Button`}\n          data-video-control=\"toggle\"\n          tabIndex={inVideoPlayButtonTabIndex}\n        >\n          <Icon\n            name={isPlaying ? 'pause' : 'play_icon_filled'}\n            colorClassName=\"text-white\"\n            size=\"1.4rem\"\n            className=\"pointer-events-none\"\n          />\n        </button>\n      )}\n\n      {(coverImage || !isAutoPlaying) && (\n        <AnimatePresence>\n          {!isPlaying && (\n            <motion.div\n              initial={{ opacity: 0 }}\n              animate={{ opacity: 1 }}\n              exit={{ opacity: 0 }}\n              onClick={() => playOnCoverClick && setIsPlaying(true)}\n              className=\"group absolute inset-0 flex items-center justify-center hover:cursor-pointer\"\n            >\n              {coverImage && (\n                <Image\n                  classes=\"relative w-full h-full\"\n                  image={coverImage}\n                  imageClasses=\"w-full h-full object-cover object-center\"\n                  epiEdit={meta?.editHints?.video as string | undefined}\n                  dataTestId={`${dataTestId}-Cover-Image`}\n                />\n              )}\n\n              {!isAutoPlaying && coverImage && (\n                <button\n                  type=\"button\"\n                  aria-label={playVideoAriaLabel}\n                  className=\"absolute bottom-2.5 left-2.5 flex items-center md:bottom-5 md:left-5\"\n                  onClick={() => setIsPlaying(true)}\n                  data-testid={`${dataTestId}-Play-Button`}\n                >\n                  <div className=\"h-[2.1875rem] w-[2.1875rem] md:h-[2.875rem] md:w-[2.875rem]\">\n                    <Icon name=\"play_icon_circle\" size=\"100%\" />\n                  </div>\n                </button>\n              )}\n            </motion.div>\n          )}\n        </AnimatePresence>\n      )}\n    </div>\n  );\n};\n\nexport default InViewVideo;\n","import { Dispatch, SetStateAction, useEffect, useRef } from 'react';\nimport { motion, useInView } from 'framer-motion';\n\ninterface Props {\n  readonly text: string;\n  readonly currentItemIndex: number;\n  readonly activeItemIndex: number;\n  readonly setActiveItemIndex: Dispatch<SetStateAction<number>>;\n}\n\nconst VideoWithAnimatedTextItem = ({\n  text,\n  currentItemIndex,\n  activeItemIndex,\n  setActiveItemIndex,\n}: Props) => {\n  const ref = useRef<HTMLLIElement>(null);\n  const isInView = useInView(ref, { margin: '-40% 0px -40% 0px', amount: 0 });\n  const isActiveItem = currentItemIndex === activeItemIndex;\n\n  useEffect(() => {\n    if (isInView) {\n      setActiveItemIndex(currentItemIndex);\n    }\n  }, [isInView, setActiveItemIndex, currentItemIndex]);\n\n  const animationVariants = {\n    hidden: {\n      opacity: isActiveItem ? 1 : 0,\n      y: (() => {\n        if (isActiveItem) return '0px';\n\n        return currentItemIndex < activeItemIndex ? '-70px' : '70px';\n      })(),\n    },\n    visible: { opacity: 1, y: '0px' },\n  };\n\n  return (\n    <motion.li\n      ref={ref}\n      initial=\"hidden\"\n      animate={isActiveItem ? 'visible' : 'hidden'}\n      variants={animationVariants}\n      transition={{\n        damping: 20,\n        duration: 0.4,\n        mass: 0.2,\n        type: 'spring',\n      }}\n      className=\"h1 flex w-full items-center justify-center text-center xl:justify-start xl:text-left\"\n    >\n      {text}\n    </motion.li>\n  );\n};\n\nexport default VideoWithAnimatedTextItem;\n","import { IVideo } from '@models/IVideo';\nimport InViewVideo from '@molecules/InViewVideo/InViewVideo';\nimport usePreviewMode from '@utils/hooks/usePreviewMode';\nimport classNames from 'classnames';\nimport { motion, useScroll, useTransform } from 'framer-motion';\nimport { useRef, useState } from 'react';\nimport VideoWithAnimatedTextItem from './VideoWithAnimatedTextItem';\n\ninterface Props {\n  readonly video: IVideo;\n  readonly text: string[];\n}\n\nconst VideoWithAnimatedText = ({ video, text }: Props) => {\n  const videoContainerRef = useRef<HTMLDivElement>(null);\n  const listContainerRef = useRef<HTMLUListElement>(null);\n  const [activeTextIndex, setActiveTextIndex] = useState(0);\n  const isPreview = usePreviewMode();\n\n  const { scrollYProgress: videoScrollYProgress } = useScroll({\n    target: videoContainerRef,\n    offset: ['start end', 'end end'],\n  });\n  const listContainerScrollYProgress = useTransform(\n    videoScrollYProgress,\n    [0.4, 1],\n    [0, 1]\n  );\n\n  return (\n    <section\n      className={classNames(\n        'component-padding relative bg-black-100 text-white',\n        { 'overflow-hidden': isPreview }\n      )}\n    >\n      <motion.div\n        className={classNames('sticky top-0', {\n          'h-screen': !isPreview,\n          'h-[1080px]': isPreview,\n        })}\n        ref={videoContainerRef}\n      >\n        <InViewVideo\n          wrapperClasses=\"h-full\"\n          videoClasses=\"[&>div>video]:object-cover h-full overflow-hidden\"\n          autoPlay\n          controls={false}\n          video={video}\n          inViewThreshold={0}\n          hasInVideoPlayButton\n          inVideoPlayButtonPositionClassName=\"top-2.5 left-2.5 md:top-5 md:left-5\"\n          videoWrapperOpacityProgress={videoScrollYProgress}\n        />\n      </motion.div>\n\n      <motion.div\n        className={classNames(\n          'container pointer-events-none relative xl:grid xl:grid-cols-12',\n          {\n            '-mt-[100vh]': !isPreview,\n            '-mt-[1080px] h-[1080px]': isPreview,\n          }\n        )}\n        style={{ opacity: videoScrollYProgress }}\n      >\n        <motion.ul\n          ref={listContainerRef}\n          className={classNames('flex flex-col xl:col-start-2 xl:col-end-11', {\n            'gap-y-[15vh] py-[50vh]': !isPreview,\n            'h-full gap-y-[162px] overflow-hidden py-[540px]': isPreview,\n          })}\n          style={{ opacity: listContainerScrollYProgress }}\n        >\n          {text.map((value, index) => (\n            <VideoWithAnimatedTextItem\n              key={value}\n              text={value}\n              currentItemIndex={index}\n              activeItemIndex={activeTextIndex}\n              setActiveItemIndex={setActiveTextIndex}\n            />\n          ))}\n        </motion.ul>\n      </motion.div>\n    </section>\n  );\n};\n\nexport default VideoWithAnimatedText;\n","const enum BreakpointEnum {\n  Small = 'sm',\n  Medium = 'md',\n  Large = 'lg',\n  XLarge = 'xl',\n}\n\nexport default BreakpointEnum;\n","import { IAriaLabels } from '@models/IAriaLabels';\nimport create from 'zustand';\n\ninterface IAriaLabelsState {\n  ariaLabels: IAriaLabels;\n  setAriaLabels: (ariaLabels: IAriaLabels) => void;\n}\n\nexport const initialAriaLabels: IAriaLabels = {\n  backToFirstLevelNavigationAriaLabel: 'Back to first level of navigation',\n  breadcrumbAriaLabel: 'Breadcrumb navigation',\n  breadcrumbFooterAriaLabel: 'Breadcrumb footer navigation',\n  clearFiltersAriaLabel: 'Clear filters',\n  closeMenuAriaLabel: 'Close menu',\n  closeAddressListAriaLabel: 'Close address list',\n  closeMobileNavigationAriaLabel: 'Close navigation',\n  closeModalAriaLabel: 'Close Modal',\n  closeSignUpFormAriaLabel: 'Close signup form',\n  closeSiteNotificationAriaLabel: 'Close site notification',\n  copyToClipboardAriaLabel: 'Copy to clipboard',\n  editOrDeleteAriaLabel: 'Edit or delete',\n  mainNavigationAriaLabel: 'Main navigation',\n  moreInformationAriaLabel: 'More information',\n  nextAriaLabel: 'Go to next slide',\n  openAddressListAriaLabel: 'Open address list',\n  openImageInFullScreenAriaLabel: 'Open image in full screen',\n  openMenuAriaLabel: 'Open menu',\n  overlayToCloseDesktopNavigationAriaLabel: 'Close overlay',\n  pauseVideoAriaLabel: 'Pause video',\n  playVideoAriaLabel: 'Play video',\n  previousAriaLabel: 'Go to previous slide',\n  searchAriaLabel: 'Search',\n  shareToFacebookAriaLabel: 'Share to Facebook',\n  shareToWhatsappAriaLabel: 'Share to Whatsapp',\n  shareToXAriaLabel: 'Share to X',\n  siteNotificationsAriaLabel: 'Site notifications banner',\n  uspStripAriaLabel: 'Unique Selling Point Strip',\n  zoomInAriaLabel: 'Zoom in',\n  zoomOutAriaLabel: 'Zoom out',\n};\n\nconst useAriaLabelsStore = create<IAriaLabelsState>((set) => ({\n  ariaLabels: initialAriaLabels,\n  setAriaLabels: (ariaLabels: IAriaLabels) => set({ ariaLabels }),\n}));\n\nexport default useAriaLabelsStore;\n","const updateDataLayer = (eventPayload: Record<string, unknown>) => {\n  if (typeof window !== 'undefined') {\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push(eventPayload);\n  }\n};\n\nexport default updateDataLayer;\n","import { IAriaLabels } from '@models/IAriaLabels';\nimport useAriaLabelsStore, { initialAriaLabels } from '@state/AriaLabelsStore';\nimport { useEffect, useState } from 'react';\n\nconst useAriaLabels = () => {\n  const [ariaLabels, setAriaLabels] = useState<IAriaLabels>(initialAriaLabels);\n  const ariaLabelsFromStore = useAriaLabelsStore((state) => state.ariaLabels);\n\n  useEffect(() => {\n    setAriaLabels(ariaLabelsFromStore);\n  }, [ariaLabelsFromStore]);\n\n  return ariaLabels;\n};\n\nexport default useAriaLabels;\n","import BreakpointEnum from '@models/enums/BreakpointEnum';\nimport { useCallback, useEffect, useState } from 'react';\n\nconst getCurrentBreakpoint = () => {\n  const breakpoints = { tablet: 768, desktop: 1024, lgDesktop: 1440 };\n  const width = window.innerWidth;\n\n  if (width < breakpoints.tablet) {\n    return BreakpointEnum.Small;\n  }\n  if (width >= breakpoints.tablet && width < breakpoints.desktop) {\n    return BreakpointEnum.Medium;\n  }\n  if (width >= breakpoints.desktop && width < breakpoints.lgDesktop) {\n    return BreakpointEnum.Large;\n  }\n  return BreakpointEnum.XLarge;\n};\n\nconst useBreakpoint = () => {\n  const [screen, setScreen] = useState<BreakpointEnum>();\n\n  const resizeHandler = useCallback(\n    () => setScreen(getCurrentBreakpoint()),\n    []\n  );\n\n  useEffect(() => {\n    window.addEventListener('resize', resizeHandler);\n    setScreen(getCurrentBreakpoint());\n\n    return () => {\n      window.removeEventListener('resize', resizeHandler);\n    };\n  }, [resizeHandler]);\n\n  return screen;\n};\n\nexport default useBreakpoint;\n","import { useEffect, useState } from 'react';\n\nconst usePreviewMode = () => {\n  const [isPreview, setIsPreview] = useState(false);\n\n  useEffect(() => {\n    setIsPreview(window.self !== window.top);\n  }, []);\n\n  return isPreview;\n};\n\nexport default usePreviewMode;\n"],"names":["_ref","children","classes","dataTestId","epiEdit","image","imageClasses","imageRef","lazyLoad","progressiveLoad","sizes","mobileSource","mobile","tabletSource","tablet","desktopSource","desktop","largeDesktopSource","largeDesktop","breakpoint","useBreakpoint","isLoaded","setIsLoaded","useState","url","currentSrc","BreakpointEnum","Small","Medium","Large","XLarge","React","createElement","className","classNames","type","srcSet","_extends","ref","alt","altText","length","draggable","loading","onLoad","src","height","width","originalUrl","ReactPlayer","loadable","forwardRef","config","controls","isPlaying","title","videoAttributes","videoRatio","videoSource","videoWrapperOpacityProgress","onEndedVideo","onVideoReady","onVideoStart","onVolumeChange","setIsPlaying","prevProgress","setPrevProgress","isBrowser","setIsBrowser","useEffect","window","handleProgressUpdate","progress","updateDataLayer","event","video_interaction","video_progress","video_title","handleVideoAction","action","motion","div","style","opacity","playing","onProgress","_ref2","played","onStart","onEnded","onPause","onPlay","onReady","target","autoPlay","coverImage","hasInVideoPlayButton","inVideoPlayButtonClassName","inVideoPlayButtonPositionClassName","inVideoPlayButtonTabIndex","inViewThreshold","meta","onFocusCallback","playOnCoverClick","video","videoClasses","wrapperClasses","isVideoManuallyPaused","setIsVideoManuallyPaused","isMuted","setIsMuted","videoReady","setVideoReady","videoRef","useRef","inView","useInView","amount","isAutoPlaying","playVideoAriaLabel","pauseVideoAriaLabel","useAriaLabels","Video","playsinline","muted","loop","editHints","videoElement","volume","onClick","onFocus","tabIndex","Icon","name","colorClassName","size","AnimatePresence","initial","animate","exit","Image","text","currentItemIndex","activeItemIndex","setActiveItemIndex","isInView","margin","isActiveItem","animationVariants","hidden","y","visible","li","variants","transition","damping","duration","mass","videoContainerRef","listContainerRef","activeTextIndex","setActiveTextIndex","isPreview","usePreviewMode","scrollYProgress","videoScrollYProgress","useScroll","offset","listContainerScrollYProgress","useTransform","InViewVideo","ul","map","value","index","VideoWithAnimatedTextItem","key","initialAriaLabels","backToFirstLevelNavigationAriaLabel","breadcrumbAriaLabel","breadcrumbFooterAriaLabel","clearFiltersAriaLabel","closeMenuAriaLabel","closeAddressListAriaLabel","closeMobileNavigationAriaLabel","closeModalAriaLabel","closeSignUpFormAriaLabel","closeSiteNotificationAriaLabel","copyToClipboardAriaLabel","editOrDeleteAriaLabel","mainNavigationAriaLabel","moreInformationAriaLabel","nextAriaLabel","openAddressListAriaLabel","openImageInFullScreenAriaLabel","openMenuAriaLabel","overlayToCloseDesktopNavigationAriaLabel","previousAriaLabel","searchAriaLabel","shareToFacebookAriaLabel","shareToWhatsappAriaLabel","shareToXAriaLabel","siteNotificationsAriaLabel","uspStripAriaLabel","zoomInAriaLabel","zoomOutAriaLabel","create","set","ariaLabels","setAriaLabels","eventPayload","dataLayer","push","ariaLabelsFromStore","useAriaLabelsStore","state","getCurrentBreakpoint","breakpoints","innerWidth","screen","setScreen","resizeHandler","useCallback","addEventListener","removeEventListener","setIsPreview","self","top"],"sourceRoot":""}