{"version":3,"file":"ProductHero-Chunk-ed8f0c55ddc8e29f0ead.js","mappings":"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","sources":["webpack://nikon-client/./utility/hooks/useHorizontalGrabScroll.ts","webpack://nikon-client/./utility/hooks/useHorizontalScrollShadows.ts","webpack://nikon-client/./components/atoms/ShadowContainerHorizontal/ShadowContainerHorizontal.tsx","webpack://nikon-client/./components/atoms/Tag/Tag.tsx","webpack://nikon-client/./components/organisms/ProductHero/ProductHero.tsx","webpack://nikon-client/./models/enums/ScrollProgressEnum.ts","webpack://nikon-client/./models/enums/SizeEnum.ts","webpack://nikon-client/./models/enums/TagTypesEnum.ts"],"sourcesContent":["import { RefObject, useEffect, useRef, useState } from 'react';\n\nconst useHorizontalGrabScroll = (\n  containerRef: RefObject<HTMLElement>,\n  disabled: boolean\n) => {\n  const [isMouseDown, setIsMouseDown] = useState(false);\n  const mouseScrollPosition = useRef<{\n    top: number;\n    left: number;\n    x: number;\n    y: number;\n  }>({\n    top: 0,\n    left: 0,\n    x: 0,\n    y: 0,\n  });\n\n  useEffect(() => {\n    const container = containerRef.current;\n    if (!container?.clientWidth) return;\n\n    if (container.clientWidth >= container.scrollWidth || disabled) {\n      container.style.cursor = 'inherit';\n      return;\n    }\n\n    if (isMouseDown) {\n      container.style.cursor = 'grabbing';\n      return;\n    }\n\n    container.style.cursor = 'grab';\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [isMouseDown, disabled]);\n\n  useEffect(() => {\n    mouseScrollPosition.current = { top: 0, left: 0, x: 0, y: 0 };\n    const container = containerRef.current;\n\n    if (!container) return () => ({});\n    if (disabled) {\n      container.scrollTop = 0;\n      container.scrollLeft = 0;\n\n      return () => ({});\n    }\n\n    const mouseMoveHandler = (e: MouseEvent) => {\n      const dx = e.clientX - mouseScrollPosition.current.x;\n      const dy = e.clientY - mouseScrollPosition.current.y;\n\n      container.scrollTop = mouseScrollPosition.current.top - dy;\n      container.scrollLeft = mouseScrollPosition.current.left - dx;\n    };\n\n    const mouseUpHandler = () => {\n      document.removeEventListener('mousemove', mouseMoveHandler);\n      document.removeEventListener('mouseup', mouseUpHandler);\n      setIsMouseDown(false);\n    };\n\n    const mouseDownHandler = (e: MouseEvent) => {\n      mouseScrollPosition.current = {\n        top: container.scrollTop,\n        left: container.scrollLeft,\n        x: e.clientX,\n        y: e.clientY,\n      };\n      setIsMouseDown(true);\n\n      document.addEventListener('mousemove', mouseMoveHandler);\n      document.addEventListener('mouseup', mouseUpHandler);\n    };\n\n    const onWheel = (e: WheelEvent) => {\n      if (e.deltaY === 0) return;\n\n      container.scrollTo({\n        left: container.scrollLeft + e.deltaY,\n        behavior: 'smooth',\n      });\n    };\n\n    container.addEventListener('mousedown', mouseDownHandler);\n    container.addEventListener('wheel', onWheel, { passive: true });\n\n    return () => {\n      container.removeEventListener('mousedown', mouseDownHandler);\n      container.removeEventListener('wheel', onWheel);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [disabled]);\n};\n\nexport default useHorizontalGrabScroll;\n","import ScrollProgressEnum from '@models/enums/ScrollProgressEnum';\nimport { useMotionValueEvent, useScroll } from 'framer-motion';\nimport { RefObject, useEffect, useState } from 'react';\n\nconst useHorizontalScrollShadows = (\n  containerRef: RefObject<HTMLElement>,\n  threshold: number,\n  disabled: boolean\n) => {\n  const { scrollXProgress } = useScroll({ container: containerRef });\n  const [isStart, setIsStart] = useState(true);\n  const [isEnd, setIsEnd] = useState(false);\n  const [scrollProgress, setScrollProgress] = useState(\n    ScrollProgressEnum.Start\n  );\n\n  useMotionValueEvent(scrollXProgress, 'change', (value: number) => {\n    if (value < threshold) {\n      setScrollProgress(ScrollProgressEnum.Start);\n    }\n\n    if (value >= threshold && value <= 1 - threshold) {\n      setScrollProgress(ScrollProgressEnum.Middle);\n    }\n\n    if (value > 1 - threshold) {\n      setScrollProgress(ScrollProgressEnum.End);\n    }\n  });\n\n  useEffect(() => {\n    const container = containerRef.current;\n    if (!container?.clientWidth || disabled) return;\n\n    const { clientWidth, scrollWidth } = container;\n    if (clientWidth >= scrollWidth) {\n      setIsStart(true);\n      setIsEnd(true);\n\n      return;\n    }\n\n    if (scrollProgress === ScrollProgressEnum.Start) {\n      setIsStart(true);\n      setIsEnd(false);\n    }\n\n    if (scrollProgress === ScrollProgressEnum.Middle) {\n      setIsStart(false);\n      setIsEnd(false);\n    }\n\n    if (scrollProgress === ScrollProgressEnum.End) {\n      setIsEnd(true);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [disabled, scrollProgress]);\n\n  return { isStart, isEnd };\n};\n\nexport default useHorizontalScrollShadows;\n","import useHorizontalGrabScroll from '@utils/hooks/useHorizontalGrabScroll';\nimport useHorizontalScrollShadows from '@utils/hooks/useHorizontalScrollShadows';\nimport classNames from 'classnames';\nimport { AnimatePresence, motion } from 'framer-motion';\nimport {\n  PropsWithChildren,\n  forwardRef,\n  useImperativeHandle,\n  useRef,\n} from 'react';\n\nexport interface IShadowContainerHorizontalRef {\n  readonly scrollTo: (offset: number) => void;\n  readonly getOffsetWidth: () => number;\n}\n\ninterface Props {\n  readonly className?: string;\n  readonly shadowColour?: string;\n  readonly threshold?: number;\n  readonly showStart?: boolean; // Manually override shadows from a parent component\n  readonly showEnd?: boolean;\n  readonly disableScroll?: boolean; // Used together with showStart/showEnd to disable scrolling within the container (e.g. when we want to wrap a carousel within some left/right shadows, we want to use the carousel's scrolling/swiping, not the container's one)\n  readonly shadowWidth?: string;\n  readonly isNoWrapEnabled?: boolean;\n}\n\nconst ShadowContainerHorizontal = forwardRef<\n  IShadowContainerHorizontalRef,\n  PropsWithChildren<Props>\n>(\n  (\n    {\n      children,\n      className,\n      disableScroll = false,\n      shadowColour = 'from-white dark:from-black-100',\n      threshold = 0.05,\n      showStart = false,\n      showEnd = true,\n      shadowWidth = 'w-10',\n      isNoWrapEnabled = true,\n    },\n    ref\n  ) => {\n    const containerRef = useRef<HTMLDivElement>(null);\n    const { isStart, isEnd } = useHorizontalScrollShadows(\n      containerRef,\n      threshold,\n      disableScroll\n    );\n    useHorizontalGrabScroll(containerRef, disableScroll);\n\n    useImperativeHandle(ref, () => ({\n      scrollTo: (leftOffset: number) => {\n        containerRef.current?.scrollTo({\n          left: leftOffset,\n          behavior: 'smooth',\n        });\n      },\n      getOffsetWidth: () => containerRef.current?.offsetWidth ?? 0,\n    }));\n\n    return (\n      <div className={classNames(className, 'relative')}>\n        <AnimatePresence>\n          {(!isStart || showStart) && (\n            <motion.span\n              animate={{ opacity: 1 }}\n              className={classNames(\n                shadowColour,\n                shadowWidth,\n                'pointer-events-none absolute left-0 top-0 z-10 -ml-[1px] h-full bg-gradient-to-r to-transparent'\n              )}\n              exit={{ opacity: 0 }}\n              initial={{ opacity: 0 }}\n              transition={{ duration: 0.25 }}\n            />\n          )}\n        </AnimatePresence>\n\n        <div\n          ref={containerRef}\n          // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n          tabIndex={0}\n          className={classNames(\n            {\n              'z-0 overflow-x-hidden': disableScroll,\n              'overflow-x-auto': !disableScroll,\n              'whitespace-nowrap': isNoWrapEnabled,\n            },\n            'relative select-none scrollbar-hide'\n          )}\n        >\n          {children}\n        </div>\n\n        {/* isEnd is always false when using showEnd override so !isEnd is always true */}\n        <AnimatePresence>\n          {!isEnd && showEnd && (\n            <motion.span\n              animate={{ opacity: 1 }}\n              className={classNames(\n                shadowColour || 'from-white dark:from-black-100',\n                shadowWidth,\n                'pointer-events-none absolute right-0 top-0 z-10 -ml-[1px] h-full bg-gradient-to-l to-transparent'\n              )}\n              exit={{ opacity: 0 }}\n              initial={{ opacity: 0 }}\n              transition={{ duration: 0.25 }}\n            />\n          )}\n        </AnimatePresence>\n      </div>\n    );\n  }\n);\n\nexport default ShadowContainerHorizontal;\n","import SizeEnum from '@models/enums/SizeEnum';\nimport TagTypesEnum from '@models/enums/TagTypesEnum';\nimport { ILink } from '@models/ILink';\nimport classNames from 'classnames';\nimport {\n  ButtonHTMLAttributes,\n  DetailedHTMLProps,\n  PropsWithChildren,\n} from 'react';\n\ninterface Props {\n  readonly className?: string;\n  readonly disabled?: boolean;\n  readonly editHint?: string;\n  readonly link?: ILink;\n  readonly linkCallback?: () => void;\n  readonly pointerStates?: boolean;\n  readonly size?: Exclude<SizeEnum, SizeEnum.XLarge | SizeEnum.Medium>;\n  readonly tagType?: TagTypesEnum;\n  readonly text?: string;\n  readonly span?: boolean;\n  readonly isLightMode?: boolean;\n  readonly dataTestId?: string;\n}\n\ntype TagProps = Props &\n  DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;\n\nconst Tag = ({\n  children,\n  className,\n  disabled = false,\n  editHint,\n  link,\n  linkCallback,\n  pointerStates = true,\n  size = SizeEnum.Small,\n  span = false,\n  tagType,\n  text,\n  isLightMode,\n  dataTestId,\n  ...buttonProps\n}: PropsWithChildren<TagProps>) => {\n  const tagClasses = classNames(\n    {\n      [`text-black-100 bg-grey-200 ${\n        isLightMode ? '' : 'dark:bg-grey-600 dark:text-white'\n      }`]: tagType === TagTypesEnum.Primary,\n      //\n      [`hover:bg-grey active:text-white active:bg-black-100 ${\n        isLightMode\n          ? ''\n          : 'dark:hover:text-white dark:hover:bg-grey-500 dark:active:text-black-100 dark:active:bg-white'\n      }`]: tagType === TagTypesEnum.Primary && pointerStates,\n      //\n      [`text-white bg-black-100 ${\n        isLightMode ? '' : 'dark:bg-white dark:text-black-100'\n      }`]:\n        tagType === TagTypesEnum.Secondary || tagType === TagTypesEnum.Square,\n      //\n      [`hover:bg-grey hover:text-black-100 active:text-black-100 active:bg-grey-200 ${\n        isLightMode\n          ? ''\n          : 'dark:hover:text-white dark:hover:bg-grey-500 dark:active:text-white dark:active:bg-grey-600'\n      }`]: tagType === TagTypesEnum.Secondary && pointerStates,\n      //\n      [`text-black-100 bg-white ${\n        isLightMode ? '' : 'dark:bg-black-100 dark:text-white'\n      }`]: tagType === TagTypesEnum.Three,\n      //\n      [`hover:bg-grey active:bg-grey-400 ${\n        isLightMode\n          ? ''\n          : 'dark:hover:text-white dark:hover:bg-grey-500 dark:active:text-black-100 dark:active:bg-white'\n      }`]: tagType === TagTypesEnum.Three && pointerStates,\n      //\n      'text-yellow bg-black-100': tagType === TagTypesEnum.Four,\n      //\n      'hover:bg-grey hover:text-black-100 active:text-black-100 active:bg-grey-100':\n        tagType === TagTypesEnum.Four && pointerStates,\n      //\n      'py-2.5 px-5': size === SizeEnum.Large && tagType !== TagTypesEnum.Square,\n      //\n      'px-4 py-1': size === SizeEnum.Small && tagType !== TagTypesEnum.Square,\n      //\n      'pointer-events-none': !pointerStates,\n    },\n    tagType === TagTypesEnum.Square ? 'rounded-[3px]' : 'rounded-full body-two',\n    'select-none',\n    className\n  );\n\n  if (span) {\n    return (\n      <span className={tagClasses} data-testid={dataTestId}>\n        {text}\n      </span>\n    );\n  }\n\n  return link?.url && (link?.name || children) && !disabled ? (\n    <a\n      className={classNames('appearance-none', tagClasses)}\n      href={link.url}\n      target={link.target}\n      data-epi-property-name={editHint}\n      onClick={linkCallback}\n      data-testid={dataTestId}\n    >\n      {children || link.name}\n    </a>\n  ) : (\n    <button\n      {...buttonProps}\n      className={tagClasses}\n      disabled={disabled}\n      data-epi-property-name={editHint}\n      data-testid={dataTestId}\n    >\n      {children || text}\n    </button>\n  );\n};\n\nexport default Tag;\n","import ShadowContainerHorizontal from '@atoms/ShadowContainerHorizontal/ShadowContainerHorizontal';\nimport Tag from '@atoms/Tag/Tag';\nimport SizeEnum from '@models/enums/SizeEnum';\nimport TagTypesEnum from '@models/enums/TagTypesEnum';\nimport { ILink } from '@models/ILink';\nimport { useEffect, useState } from 'react';\n\ninterface Props {\n  readonly links: ILink[];\n  readonly title: string;\n}\n\nconst ProductHero = ({ title, links }: Props) => {\n  const [currentUrl, setCurrentUrl] = useState<string>();\n  const [currentPath, setCurrentPath] = useState<string>();\n\n  useEffect(() => {\n    setCurrentUrl(window.location.href);\n    setCurrentPath(window.location.pathname);\n  }, []);\n\n  return (\n    <section className=\"bg-black-100 text-white dark:bg-grey-600\">\n      <div\n        className=\"flex flex-col gap-5 py-7.5 md:container lg:grid lg:grid-cols-12 lg:py-[4.375rem]\"\n        data-testid=\"CT-04F-Product-Hero\"\n      >\n        {title && (\n          <h1\n            className=\"px-5 md:px-0 lg:col-span-5\"\n            data-testid=\"CT-04F-Product-Hero-Title\"\n          >\n            {title}\n          </h1>\n        )}\n        {!!links.length && (\n          <div className=\"flex select-none items-center justify-start lg:col-span-6 lg:col-start-7 lg:justify-end\">\n            <ShadowContainerHorizontal\n              className=\"flex w-full justify-end\"\n              shadowColour=\"dark:from-grey-600 from-black-100\"\n              threshold={0.01}\n            >\n              <div className=\"flex gap-x-4 px-5 md:px-1\">\n                {links\n                  .filter((link) => link.name && link.url)\n                  .map((link, index) => {\n                    const tabActive =\n                      currentUrl === link.url || currentPath === link.url;\n                    return (\n                      <Tag\n                        className=\"shrink-0 whitespace-nowrap\"\n                        key={link.name}\n                        link={link}\n                        pointerStates={!tabActive}\n                        size={SizeEnum.Large}\n                        text={`${link.name}`}\n                        tagType={\n                          tabActive\n                            ? TagTypesEnum.Secondary\n                            : TagTypesEnum.Three\n                        }\n                        dataTestId={`CT-04F-Product-Hero-Tag-${index}`}\n                      />\n                    );\n                  })}\n              </div>\n            </ShadowContainerHorizontal>\n          </div>\n        )}\n      </div>\n    </section>\n  );\n};\n\nexport default ProductHero;\n","enum ScrollProgressEnum {\n  Start = 'Start',\n  Middle = 'Middle',\n  End = 'End',\n}\n\nexport default ScrollProgressEnum;\n","enum SizeEnum {\n  Small = 'SMALL',\n  Medium = 'MEDIUM',\n  Large = 'LARGE',\n  XLarge = 'XLARGE',\n}\n\nexport default SizeEnum;\n","enum TagTypesEnum {\n  Primary = 'PRIMARY',\n  Secondary = 'SECONDARY',\n  Three = 'THREE',\n  Four = 'FOUR',\n  Square = 'SQUARE',\n}\n\nexport default TagTypesEnum;\n"],"names":["useHorizontalGrabScroll","containerRef","disabled","isMouseDown","setIsMouseDown","useState","mouseScrollPosition","useRef","top","left","x","y","useEffect","container","current","clientWidth","scrollWidth","style","cursor","scrollTop","scrollLeft","mouseMoveHandler","e","dx","clientX","dy","clientY","mouseUpHandler","document","removeEventListener","mouseDownHandler","addEventListener","onWheel","deltaY","scrollTo","behavior","passive","useHorizontalScrollShadows","threshold","scrollXProgress","useScroll","isStart","setIsStart","isEnd","setIsEnd","scrollProgress","setScrollProgress","ScrollProgressEnum","Start","useMotionValueEvent","value","Middle","End","forwardRef","_ref","ref","children","className","disableScroll","shadowColour","showStart","showEnd","shadowWidth","isNoWrapEnabled","useImperativeHandle","leftOffset","getOffsetWidth","offsetWidth","React","createElement","classNames","AnimatePresence","motion","span","animate","opacity","exit","initial","transition","duration","tabIndex","editHint","link","linkCallback","pointerStates","size","SizeEnum","Small","tagType","text","isLightMode","dataTestId","buttonProps","tagClasses","TagTypesEnum","Primary","Secondary","Square","Three","Four","Large","url","name","href","target","onClick","_extends","title","links","currentUrl","setCurrentUrl","currentPath","setCurrentPath","window","location","pathname","length","ShadowContainerHorizontal","filter","map","index","tabActive","Tag","key"],"sourceRoot":""}