{"version":3,"file":"static/chunks/9837.f1c7d44e0e4d8e03.js","mappings":"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","sources":["webpack://_N_E/./adapters/helpers/Hooks.js","webpack://_N_E/./components/Image/BackgroundImage/BackgroundImage.js","webpack://_N_E/<anon>"],"sourcesContent":["import React, { useState, useEffect, useLayoutEffect } from 'react';\n\n// https://github.com/streamich/react-use/blob/master/docs/useIsomorphicLayoutEffect.md\nexport const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;\n\nexport function useMatchMedia(mediaQueryString, initialValue = null) {\n    const [match, setMatch] = useState(initialValue);\n\n    useEffect(\n        () => {\n            if(!window.matchMedia) {\n                return;\n            }\n\n            function handleMatch(event) {\n                setMatch(event.matches);\n            }\n\n            const matchMedia = window.matchMedia(mediaQueryString);\n\n            setMatch(matchMedia.matches);\n            matchMedia.addListener(handleMatch);\n\n            return () => {\n                matchMedia.removeListener(handleMatch);\n            };\n        },\n        [mediaQueryString]\n    );\n\n    return match;\n}\n\nexport const mediaQueryHOC = (Component) => {\n    function MediaQueryHOC(props) {\n        const isXSmall = useMatchMedia('(max-width: 375px)');\n        const isSmall = useMatchMedia('(max-width: 479px)');\n        const isMedium = useMatchMedia('(max-width: 767px)');\n        const isLarge = useMatchMedia('(max-width: 991px)');\n        const isXLarge = useMatchMedia('(max-width: 1023px)');\n        return (\n            <Component\n                isXSmall={isXSmall}\n                isSmall={isSmall}\n                isMedium={isMedium}\n                isLarge={isLarge}\n                isXLarge={isXLarge}\n                {...props}\n            />\n        );\n    }\n    return MediaQueryHOC;\n};\n\nlet listeners = [];\nlet state = { currentProductIndex: 0};\n\n\nconst setState = (newState) => {\n    state = { ...state, ...newState };\n    listeners.forEach((listener) => {\n        listener(state);\n    });\n};\n\nexport const updateCurrentProductIndex = () => {\n    const newListener = useState()[1];\n    useEffect(() => {\n        listeners.push(newListener);\n    }, []);\n    return [state, setState];\n};\n","import React, { useEffect, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport LazyLoad from \"react-lazyload\";\nimport throttle from \"lodash/throttle\";\nimport Head from \"next/head\";\nimport { useIsomorphicLayoutEffect } from \"../../../adapters/helpers/Hooks\";\nimport { getBackgroundImage, roundUpTheSize } from \"./BackgroundImage.helpers\";\nimport { mediaQueryHOC } from \"../../../adapters/helpers/Hooks\";\nimport { ImageConstants } from \"../../../adapters/helpers/Constants\";\nimport { optimizeImage } from \"../../../adapters/helpers/PageSpeedHelper\";\n\nimport ImageFactory from \"../../../adapters/cloudinary/ImageFactory\";\n\nfunction BackgroundImage(props) {\n  const mobileBackgroundImageId =\n    props?.mobileBackgroundImage?.asset?.fields?.file?.url ||\n    props.contentImageId;\n  const desktopBackgroundImageId =\n    props?.desktopBackgroundImage?.asset?.fields?.file?.url ||\n    props.contentImageId;\n  const {\n    backgroundOffsetTop: marginTop,\n    backgroundPosition,\n    alt = null,\n    children = null,\n    customStyles = null,\n    ariaHidden = false,\n  } = props;\n  const paddingTop = `${100 / props.widthToHeightRatio}%`;\n  const isPreload = props.isPreload ? props.isPreload : false;\n  const isBannerImage = props.isBannerImage ? props.isBannerImage : false;\n  const nodeRef = useRef(null);\n  const placeholderRef = useRef(null);\n  const [width, setWidth] = useState(ImageConstants.defaultImageWindWidth);\n  const [isPageLoaded, setIsPageLoaded] = useState(false);\n  const [customClassName, setCustomClassName] = useState(\"\");\n  const [url, setUrl] = useState(\n    `url(${optimizeImage(\n      ImageFactory.buildContentfullImageUrl(props.contentImageId)\n    )})`\n  );\n  function updateWidth() {\n    const node = nodeRef.current || placeholderRef.current;\n    if (node) {\n      setWidth(roundUpTheSize(node.getBoundingClientRect().width));\n    }\n  }\n\n  useEffect(() => {\n    setIsPageLoaded(true);\n    if (width != 0) {\n      // Set background width*2 for mobile because the background is larger than the with parent\n      setUrl(\n        getBackgroundImage(\n          props.contentImageId,\n          isPreload && isBannerImage && window.innerWidth < 400\n            ? 450\n            : props.isMedium\n            ? width * 2\n            : width,\n          props.transformations,\n          props.format,\n          props.isMedium\n        )\n      );\n    }\n  }, [width, props.imageId, props.isMedium, isPageLoaded]);\n\n  useEffect(() => {\n    const handleResize = throttle(updateWidth, 100);\n\n    window.addEventListener(\"resize\", handleResize);\n\n    return () => {\n      window.removeEventListener(\"resize\", handleResize);\n      handleResize.cancel();\n    };\n  }, []);\n\n  useEffect(() => {\n    setCustomClassName(props.customClassName);\n  }, [props.customClassName]);\n\n  useIsomorphicLayoutEffect(updateWidth, []);\n\n  return (\n    <React.Fragment>\n      {isPreload && isBannerImage ? (\n        <React.Fragment>\n          <Head>\n            <link\n              rel=\"preload\"\n              href={optimizeImage(\n                ImageFactory.buildContentfullImageUrl(mobileBackgroundImageId)\n              )}\n              as=\"image\"\n              media={`(max-width:${ImageConstants.mobile_max_width})`}\n            />\n            <link\n              rel=\"preload\"\n              href={optimizeImage(\n                ImageFactory.buildContentfullImageUrl(desktopBackgroundImageId)\n              )}\n              as=\"image\"\n              media={`(min-width:${ImageConstants.desktop_min_width})`}\n            />\n          </Head>\n          {/* Below code structure have implemented for pagespeed. */}\n          {isPageLoaded ? (\n            <div\n              className={`ob-background-wrapper ${\n                width === 0 ? \"ob-background-wrapper-height\" : \"\"\n              } ${props.className ? props.className : \"\"} ${\n                customClassName ? customClassName : \"\"\n              }`}\n              ref={nodeRef}\n              aria-hidden={ariaHidden}\n              style={{\n                marginTop,\n                paddingTop,\n                backgroundPosition,\n                backgroundImage: `url(${optimizeImage(\n                  ImageFactory.buildContentfullImageUrl(props.contentImageId)\n                )})`,\n                ...customStyles,\n              }}\n            >\n              {alt && (\n                <span role=\"img\" aria-label={alt} aria-hidden=\"true\"></span>\n              )}\n              {children}\n            </div>\n          ) : (\n            <React.Fragment>\n              <div\n                className={`ob-background-wrapper ob-background-wrapper-mobile ${\n                  props.className ? props.className : \"\"\n                } ${customClassName ? customClassName : \"\"}`}\n                ref={nodeRef}\n                aria-hidden={ariaHidden}\n                style={{\n                  marginTop,\n                  paddingTop,\n                  backgroundPosition,\n                  backgroundImage: `url(${optimizeImage(\n                    ImageFactory.buildContentfullImageUrl(\n                      mobileBackgroundImageId\n                    )\n                  )})`,\n                  ...customStyles,\n                }}\n              >\n                {alt && (\n                  <span role=\"img\" aria-label={alt} aria-hidden=\"true\"></span>\n                )}\n                {children}\n              </div>\n              <div\n                className={`ob-background-wrapper ob-background-wrapper-desktop ${\n                  width === 0 ? \"ob-background-wrapper-height\" : \"\"\n                } ${props.className ? props.className : \"\"} ${\n                  customClassName ? customClassName : \"\"\n                }`}\n                ref={nodeRef}\n                aria-hidden={ariaHidden}\n                style={{\n                  marginTop,\n                  paddingTop,\n                  backgroundPosition,\n                  backgroundImage: `url(${optimizeImage(\n                    ImageFactory.buildContentfullImageUrl(\n                      desktopBackgroundImageId\n                    )\n                  )})`,\n                  ...customStyles,\n                }}\n              >\n                {alt && (\n                  <span role=\"img\" aria-label={alt} aria-hidden=\"true\"></span>\n                )}\n                {children}\n              </div>\n            </React.Fragment>\n          )}\n        </React.Fragment>\n      ) : (\n        <LazyLoad\n          offset={500}\n          placeholder={\n            <div\n              className={`ob-background-wrapper ${\n                props.className ? props.className : \"\"\n              } ${customClassName ? customClassName : \"\"}`}\n              ref={placeholderRef}\n              aria-hidden={ariaHidden}\n              style={{\n                marginTop,\n                paddingTop,\n                backgroundPosition,\n              }}\n            />\n          }\n        >\n          <div\n            className={`ob-background-wrapper ${\n              props.className ? props.className : \"\"\n            } ${customClassName}`}\n            ref={nodeRef}\n            aria-hidden={ariaHidden}\n            style={{\n              marginTop,\n              paddingTop,\n              backgroundPosition,\n              backgroundImage:\n                (!props.isLarge && !props.isMedium) ||\n                (props.isLarge && !props.isMedium)\n                  ? `url(${optimizeImage(\n                      ImageFactory.buildContentfullImageUrl(\n                        desktopBackgroundImageId\n                      )\n                    )})`\n                  : `url(${optimizeImage(\n                      ImageFactory.buildContentfullImageUrl(\n                        mobileBackgroundImageId\n                      )\n                    )})`,\n              ...customStyles,\n            }}\n          >\n            {alt && (\n              <span role=\"img\" aria-label={alt} aria-hidden=\"true\"></span>\n            )}\n            {children}\n          </div>\n        </LazyLoad>\n      )}\n    </React.Fragment>\n  );\n}\n\nexport default mediaQueryHOC(BackgroundImage);\n\nBackgroundImage.defaultProps = {\n  transformations: \"c_limit\",\n  fragments: [{ minWidth: 0, size: 1 }],\n  widthToHeightRatio: 1,\n};\n\nBackgroundImage.propTypes = {\n  imageId: PropTypes.string,\n  transformations: PropTypes.string,\n  className: PropTypes.string,\n  customClassName: PropTypes.string,\n  fragments: PropTypes.array,\n  widthToHeightRatio: PropTypes.number,\n  children: PropTypes.node,\n  backgroundOffsetTop: PropTypes.string,\n  backgroundPosition: PropTypes.string,\n  customStyles: PropTypes.object,\n  format: PropTypes.any,\n  isMedium: PropTypes.bool,\n  ariaHidden: PropTypes.bool,\n  alt: PropTypes.string,\n  isPreload: PropTypes.bool,\n  isBannerImage: PropTypes.bool,\n  preloadImage: PropTypes.any,\n  desktopBackgroundImage: PropTypes.any,\n  mobileBackgroundImage: PropTypes.any,\n};\n","\"use strict\";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[9837],{71357:function(e,n,t){t.d(n,{LI:function(){return s},Ui:function(){return d},ag:function(){return u},y3:function(){return p}});var r=t(930),a=t.n(r),i=t(67294),o=t(85893);function c(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function l(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?c(Object(t),!0).forEach((function(n){a()(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):c(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}var s=i.useLayoutEffect;function u(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null,t=(0,i.useState)(n),r=t[0],a=t[1];return(0,i.useEffect)((function(){if(window.matchMedia){var n=window.matchMedia(e);return a(n.matches),n.addListener(t),function(){n.removeListener(t)}}function t(e){a(e.matches)}}),[e]),r}var d=function(e){return function(n){var t=u(\"(max-width: 375px)\"),r=u(\"(max-width: 479px)\"),a=u(\"(max-width: 767px)\"),i=u(\"(max-width: 991px)\"),c=u(\"(max-width: 1023px)\");return(0,o.jsx)(e,l({isXSmall:t,isSmall:r,isMedium:a,isLarge:i,isXLarge:c},n))}},m=[],f={currentProductIndex:0},g=function(e){f=l(l({},f),e),m.forEach((function(e){e(f)}))},p=function(){var e=(0,i.useState)()[1];return(0,i.useEffect)((function(){m.push(e)}),[]),[f,g]}},89837:function(e,n,t){t.r(n);var r=t(930),a=t.n(r),i=t(67294),o=t(1216),c=t(23493),l=t.n(c),s=t(9008),u=t.n(s),d=t(71357),m=t(53633),f=t(24036),g=t(88726),p=t(42456),b=t(85893);function h(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);n&&(r=r.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,r)}return t}function w(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?h(Object(t),!0).forEach((function(n){a()(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):h(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}function j(e){var n,t,r,a,c,s,h,j,v=(null==e||null==(n=e.mobileBackgroundImage)||null==(t=n.asset)||null==(r=t.fields)||null==(a=r.file)?void 0:a.url)||e.contentImageId,O=(null==e||null==(c=e.desktopBackgroundImage)||null==(s=c.asset)||null==(h=s.fields)||null==(j=h.file)?void 0:j.url)||e.contentImageId,P=e.backgroundOffsetTop,k=e.backgroundPosition,I=e.alt,x=void 0===I?null:I,y=e.children,N=void 0===y?null:y,E=e.customStyles,C=void 0===E?null:E,S=e.ariaHidden,T=void 0!==S&&S,H=\"\".concat(100/e.widthToHeightRatio,\"%\"),L=!!e.isPreload&&e.isPreload,U=!!e.isBannerImage&&e.isBannerImage,_=(0,i.useRef)(null),D=(0,i.useRef)(null),M=(0,i.useState)(f.j6.defaultImageWindWidth),Z=M[0],B=M[1],R=(0,i.useState)(!1),W=R[0],z=R[1],F=(0,i.useState)(\"\"),X=F[0],V=F[1],q=(0,i.useState)(\"url(\".concat((0,g.H)(p.ZP.buildContentfullImageUrl(e.contentImageId)),\")\")),A=(q[0],q[1]);function G(){var e=_.current||D.current;e&&B((0,m.V)(e.getBoundingClientRect().width))}return(0,i.useEffect)((function(){z(!0),0!=Z&&A((0,m.W)(e.contentImageId,L&&U&&window.innerWidth<400?450:e.isMedium?2*Z:Z,e.transformations,e.format,e.isMedium))}),[Z,e.imageId,e.isMedium,W]),(0,i.useEffect)((function(){var e=l()(G,100);return window.addEventListener(\"resize\",e),function(){window.removeEventListener(\"resize\",e),e.cancel()}}),[]),(0,i.useEffect)((function(){V(e.customClassName)}),[e.customClassName]),(0,d.LI)(G,[]),(0,b.jsx)(i.Fragment,{children:L&&U?(0,b.jsxs)(i.Fragment,{children:[(0,b.jsxs)(u(),{children:[(0,b.jsx)(\"link\",{rel:\"preload\",href:(0,g.H)(p.ZP.buildContentfullImageUrl(v)),as:\"image\",media:\"(max-width:\".concat(f.j6.mobile_max_width,\")\")}),(0,b.jsx)(\"link\",{rel:\"preload\",href:(0,g.H)(p.ZP.buildContentfullImageUrl(O)),as:\"image\",media:\"(min-width:\".concat(f.j6.desktop_min_width,\")\")})]}),W?(0,b.jsxs)(\"div\",{className:\"ob-background-wrapper \".concat(0===Z?\"ob-background-wrapper-height\":\"\",\" \").concat(e.className?e.className:\"\",\" \").concat(X||\"\"),ref:_,\"aria-hidden\":T,style:w({marginTop:P,paddingTop:H,backgroundPosition:k,backgroundImage:\"url(\".concat((0,g.H)(p.ZP.buildContentfullImageUrl(e.contentImageId)),\")\")},C),children:[x&&(0,b.jsx)(\"span\",{role:\"img\",\"aria-label\":x,\"aria-hidden\":\"true\"}),N]}):(0,b.jsxs)(i.Fragment,{children:[(0,b.jsxs)(\"div\",{className:\"ob-background-wrapper ob-background-wrapper-mobile \".concat(e.className?e.className:\"\",\" \").concat(X||\"\"),ref:_,\"aria-hidden\":T,style:w({marginTop:P,paddingTop:H,backgroundPosition:k,backgroundImage:\"url(\".concat((0,g.H)(p.ZP.buildContentfullImageUrl(v)),\")\")},C),children:[x&&(0,b.jsx)(\"span\",{role:\"img\",\"aria-label\":x,\"aria-hidden\":\"true\"}),N]}),(0,b.jsxs)(\"div\",{className:\"ob-background-wrapper ob-background-wrapper-desktop \".concat(0===Z?\"ob-background-wrapper-height\":\"\",\" \").concat(e.className?e.className:\"\",\" \").concat(X||\"\"),ref:_,\"aria-hidden\":T,style:w({marginTop:P,paddingTop:H,backgroundPosition:k,backgroundImage:\"url(\".concat((0,g.H)(p.ZP.buildContentfullImageUrl(O)),\")\")},C),children:[x&&(0,b.jsx)(\"span\",{role:\"img\",\"aria-label\":x,\"aria-hidden\":\"true\"}),N]})]})]}):(0,b.jsx)(o.default,{offset:500,placeholder:(0,b.jsx)(\"div\",{className:\"ob-background-wrapper \".concat(e.className?e.className:\"\",\" \").concat(X||\"\"),ref:D,\"aria-hidden\":T,style:{marginTop:P,paddingTop:H,backgroundPosition:k}}),children:(0,b.jsxs)(\"div\",{className:\"ob-background-wrapper \".concat(e.className?e.className:\"\",\" \").concat(X),ref:_,\"aria-hidden\":T,style:w({marginTop:P,paddingTop:H,backgroundPosition:k,backgroundImage:!e.isLarge&&!e.isMedium||e.isLarge&&!e.isMedium?\"url(\".concat((0,g.H)(p.ZP.buildContentfullImageUrl(O)),\")\"):\"url(\".concat((0,g.H)(p.ZP.buildContentfullImageUrl(v)),\")\")},C),children:[x&&(0,b.jsx)(\"span\",{role:\"img\",\"aria-label\":x,\"aria-hidden\":\"true\"}),N]})})})}n.default=(0,d.Ui)(j),j.defaultProps={transformations:\"c_limit\",fragments:[{minWidth:0,size:1}],widthToHeightRatio:1}}}]);"],"names":["self","webpackChunk_N_E","push","e","n","t","d","LI","s","Ui","ag","u","y3","p","r","a","i","o","c","Object","keys","getOwnPropertySymbols","filter","getOwnPropertyDescriptor","enumerable","apply","l","arguments","length","forEach","getOwnPropertyDescriptors","defineProperties","defineProperty","useLayoutEffect","useState","useEffect","window","matchMedia","matches","addListener","removeListener","jsx","isXSmall","isSmall","isMedium","isLarge","isXLarge","m","f","currentProductIndex","g","b","h","w","j","v","mobileBackgroundImage","asset","fields","file","url","contentImageId","O","desktopBackgroundImage","P","backgroundOffsetTop","k","backgroundPosition","I","alt","x","y","children","N","E","customStyles","C","S","ariaHidden","T","H","concat","widthToHeightRatio","L","isPreload","U","isBannerImage","_","useRef","D","M","j6","defaultImageWindWidth","Z","B","R","W","z","F","X","V","q","ZP","buildContentfullImageUrl","A","G","current","getBoundingClientRect","width","innerWidth","transformations","format","imageId","addEventListener","removeEventListener","cancel","customClassName","Fragment","jsxs","rel","href","as","media","mobile_max_width","desktop_min_width","className","ref","style","marginTop","paddingTop","backgroundImage","role","default","offset","placeholder","defaultProps","fragments","minWidth","size"],"sourceRoot":""}