{"version":3,"file":"static/chunks/9837.9478d8cdc211c844.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 ImageFactory from '../../../adapters/cloudinary/ImageFactory';\nimport { optimizeImage } from '../../../adapters/helpers/pagespeedHelper';\n\nfunction BackgroundImage(props) {\n    const mobileBackgroundImageId = props?.mobileBackgroundImage?.asset?.fields?.file?.url || props.contentImageId;\n    const desktopBackgroundImageId = props?.desktopBackgroundImage?.asset?.fields?.file?.url || props.contentImageId;\n    const { backgroundOffsetTop: marginTop, backgroundPosition, alt = null, children = null, customStyles = null, ariaHidden = false } = 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 [windowWidth, setWindowWidth] = useState(0);\n    const [customClassName, setCustomClassName] = useState('');\n    const [isPageLoaded, setIsPageLoaded] = useState(false);\n    const [url, setUrl] = useState(`url(${optimizeImage(ImageFactory.buildContentfullImageUrl(props.contentImageId))})`);\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(getBackgroundImage(props.contentImageId, isPreload && isBannerImage && window.innerWidth < 400 ? 450 : props.isMedium ? width * 2 : width, props.transformations, props.format, props.isMedium));\n        }\n    }, [width, props.imageId, props.isMedium, isPageLoaded]);\n\n\n    useEffect(\n        () => {\n            const handleResize = throttle(updateWidth, 100);\n            setWindowWidth(window.innerWidth)\n            window.addEventListener('resize', handleResize);\n\n            return () => {\n                window.removeEventListener('resize', handleResize);\n                handleResize.cancel();\n            };\n        },\n        []\n    );\n\n    useEffect(\n        () => {\n            setCustomClassName(props.customClassName);\n        }, [props.customClassName]\n    );\n\n    useIsomorphicLayoutEffect(\n        updateWidth,\n        []\n    );\n\n\n    return (\n        <React.Fragment>\n            {isPreload && isBannerImage ?\n                <React.Fragment>\n                    <Head>\n                        <link rel=\"preload\" href={optimizeImage(ImageFactory.buildContentfullImageUrl(mobileBackgroundImageId))} as=\"image\" media={`(max-width:${ImageConstants.mobile_max_width})`} />\n                        <link rel=\"preload\" href={optimizeImage(ImageFactory.buildContentfullImageUrl(desktopBackgroundImageId))} as=\"image\" media={`(min-width:${ImageConstants.desktop_min_width})`} />\n                    </Head>\n                    {/* Below code structure have implemented for pagespeed. */}\n                    {isPageLoaded ?\n                        <div\n                            className={`ob-background-wrapper ${width === 0 ? 'ob-background-wrapper-height' : ''} ${props.className ? props.className : ''} ${customClassName ? customClassName : ''}`}\n                            ref={nodeRef}\n                            aria-hidden={ariaHidden}\n                            style={{\n                                marginTop, paddingTop, backgroundPosition,\n                                backgroundImage: `url(${optimizeImage(ImageFactory.buildContentfullImageUrl(props.contentImageId))})`,\n                                ...customStyles\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 ${props.className ? props.className : ''} ${customClassName ? customClassName : ''}`}\n                                ref={nodeRef}\n                                aria-hidden={ariaHidden}\n                                style={{\n                                    marginTop, paddingTop, backgroundPosition,\n                                    backgroundImage: `url(${optimizeImage(ImageFactory.buildContentfullImageUrl(mobileBackgroundImageId))})`,\n                                    ...customStyles\n                                }}>\n                                {alt &&\n                                    <span role=\"img\" aria-label={alt}></span>\n                                }\n                                {children}\n                            </div>\n                            <div\n                                className={`ob-background-wrapper ob-background-wrapper-desktop ${width === 0 ? 'ob-background-wrapper-height' : ''} ${props.className ? props.className : ''} ${customClassName ? customClassName : ''}`}\n                                ref={nodeRef}\n                                aria-hidden={ariaHidden}\n                                style={{\n                                    marginTop, paddingTop, backgroundPosition,\n                                    backgroundImage: `url(${optimizeImage(ImageFactory.buildContentfullImageUrl(desktopBackgroundImageId))})`,\n                                    ...customStyles\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                : <LazyLoad offset={500}\n                    placeholder={\n                        <div\n                            className={`ob-background-wrapper ${props.className ? props.className : ''} ${customClassName}`}\n                            ref={placeholderRef}\n                            aria-hidden={ariaHidden}\n                            style={{\n                                marginTop, paddingTop, backgroundPosition\n                            }}\n                        />\n                    }\n                >\n                    <div\n                        className={`ob-background-wrapper ${props.className ? props.className : ''} ${customClassName}`}\n                        ref={nodeRef}\n                        aria-hidden={ariaHidden}\n                        style={{\n                            marginTop, paddingTop, backgroundPosition,\n                            backgroundImage: ((!props.isLarge && !props.isMedium) || (props.isLarge && !props.isMedium)) ? `url(${optimizeImage(ImageFactory.buildContentfullImageUrl(desktopBackgroundImageId))})` : `url(${optimizeImage(ImageFactory.buildContentfullImageUrl(mobileBackgroundImageId))})`,\n                            ...customStyles\n                        }}>\n                        {alt &&\n                            <span role=\"img\" aria-label={alt}></span>\n                        }\n                        {children}\n                    </div>\n                </LazyLoad>}\n        </React.Fragment>\n\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    isPreload: PropTypes.bool,\n    isBannerImage: PropTypes.bool,\n    preloadImage: PropTypes.object,\n    desktopBackgroundImage: PropTypes.any,\n    mobileBackgroundImage: PropTypes.any\n}\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(42456),p=t(19271),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,S=void 0===E?null:E,C=e.ariaHidden,T=void 0!==C&&C,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],W=M[1],B=(0,i.useState)(0),R=(B[0],B[1]),z=(0,i.useState)(\"\"),F=z[0],X=z[1],V=(0,i.useState)(!1),q=V[0],A=V[1],G=(0,i.useState)(\"url(\".concat((0,p.H)(g.ZP.buildContentfullImageUrl(e.contentImageId)),\")\")),J=(G[0],G[1]);function K(){var e=_.current||D.current;e&&W((0,m.V)(e.getBoundingClientRect().width))}return(0,i.useEffect)((function(){A(!0),0!=Z&&J((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,q]),(0,i.useEffect)((function(){var e=l()(K,100);return R(window.innerWidth),window.addEventListener(\"resize\",e),function(){window.removeEventListener(\"resize\",e),e.cancel()}}),[]),(0,i.useEffect)((function(){X(e.customClassName)}),[e.customClassName]),(0,d.LI)(K,[]),(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,p.H)(g.ZP.buildContentfullImageUrl(v)),as:\"image\",media:\"(max-width:\".concat(f.j6.mobile_max_width,\")\")}),(0,b.jsx)(\"link\",{rel:\"preload\",href:(0,p.H)(g.ZP.buildContentfullImageUrl(O)),as:\"image\",media:\"(min-width:\".concat(f.j6.desktop_min_width,\")\")})]}),q?(0,b.jsxs)(\"div\",{className:\"ob-background-wrapper \".concat(0===Z?\"ob-background-wrapper-height\":\"\",\" \").concat(e.className?e.className:\"\",\" \").concat(F||\"\"),ref:_,\"aria-hidden\":T,style:w({marginTop:P,paddingTop:H,backgroundPosition:k,backgroundImage:\"url(\".concat((0,p.H)(g.ZP.buildContentfullImageUrl(e.contentImageId)),\")\")},S),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(F||\"\"),ref:_,\"aria-hidden\":T,style:w({marginTop:P,paddingTop:H,backgroundPosition:k,backgroundImage:\"url(\".concat((0,p.H)(g.ZP.buildContentfullImageUrl(v)),\")\")},S),children:[x&&(0,b.jsx)(\"span\",{role:\"img\",\"aria-label\":x}),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(F||\"\"),ref:_,\"aria-hidden\":T,style:w({marginTop:P,paddingTop:H,backgroundPosition:k,backgroundImage:\"url(\".concat((0,p.H)(g.ZP.buildContentfullImageUrl(O)),\")\")},S),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(F),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(F),ref:_,\"aria-hidden\":T,style:w({marginTop:P,paddingTop:H,backgroundPosition:k,backgroundImage:!e.isLarge&&!e.isMedium||e.isLarge&&!e.isMedium?\"url(\".concat((0,p.H)(g.ZP.buildContentfullImageUrl(O)),\")\"):\"url(\".concat((0,p.H)(g.ZP.buildContentfullImageUrl(v)),\")\")},S),children:[x&&(0,b.jsx)(\"span\",{role:\"img\",\"aria-label\":x}),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","S","C","ariaHidden","T","H","concat","widthToHeightRatio","L","isPreload","U","isBannerImage","_","useRef","D","M","j6","defaultImageWindWidth","Z","W","B","R","z","F","X","V","q","A","G","ZP","buildContentfullImageUrl","J","K","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":""}