{"version":3,"sources":["webpack:///./src/store/AppStore.tsx","webpack:///./src/components/QuickBuy/QuickBuy.tsx","webpack:///./src/components/ActiveShade/ActiveShade.tsx","webpack:///./src/components/Shade/Shade.tsx","webpack:///./src/components/Shades/Shades.tsx","webpack:///./src/components/Content/Content.tsx","webpack:///./src/components/ErrorNotification/ErrorNotification.tsx","webpack:///./src/App.tsx","webpack:///./src/AppRender.tsx","webpack:///./src/components/ActiveShade/ActiveShade.module.css","webpack:///./src/components/QuickBuy/QuickBuy.module.css","webpack:///./src/components/Shade/Shade.module.css","webpack:///./src/components/Shades/Shades.module.css","webpack:///./src/components/Content/Content.module.css","webpack:///./src/components/ErrorNotification/ErrorNotification.module.css","webpack:///./src/App.module.css"],"names":["initialStore","name","brand","activeShade","undefined","shades","AppStore","StoreProvider","props","state","setState","value","Object","assign","setProduct","length","setActiveShade","code","find","shade","createElement","Provider","children","useStore","style","QuickBuy","isSuccess","setSuccess","useState","isWaiting","setWaiting","isInProgress","setInProgress","isError","setError","onBasketUpdated","event","_a","detail","lastAddedItem","itemCode","setTimeout","onAddToBaskedFailed","onOtherAddToBasket","useEffect","window","addEventListener","removeEventListener","className","onClick","stopPropagation","addtoBasketEvent","CustomEvent","quantity","dispatchEvent","id","v4","version","xmlns","width","height","viewBox","d","x1","y1","x2","y2","gradientUnits","offset","stopColor","stopOpacity","fillRule","fill","transform","enableBackground","xmlSpace","points","stroke","strokeMiterlimit","strokeWidth","icon","ActiveShade","imageVariantsConfig","url","imageUrl","backgroundColor","params","quality","images","join","srcSet","image","map","variant","sizes","src","alt","price","key","Shade","Boolean","colorHexCodes","colorImageUrl","background","oldPrice","Shades","Content","ErrorNotification","errorMessage","setErrorMessage","onError","localizedMessage","setSettings","modifierDelimiter","throwOnError","App","isMultishadeDialogOpen","setMultishadeDialogVisibility","closeMultishadeDialog","onModalOpen","onClose","isCustomContent","isOpen","render","rootEl","document","getElementById","module","exports"],"mappings":";6NACA,MAAMA,EAAe,CACjBC,KAAM,GACNC,MAAO,GACPC,iBAAaC,EACbC,OAAQ,IAENC,EAAW,wBAAcN,GAClBO,EAAiBC,IAC1B,MAAOC,EAAOC,GAAY,mBAASV,GAU7BW,EAAQC,OAAOC,OAAOD,OAAOC,OAAO,GAAIJ,GAAQ,CAAEK,WATrC,CAACb,EAAMC,EAAOG,KAC7BK,EAASE,OAAOC,OAAOD,OAAOC,OAAO,GAAIJ,GAAQ,CAAER,OAC/CC,QACAG,SAAQF,YAAaE,EAAOU,OAAS,EAAIV,EAAO,QAAKD,MAOzDY,eALoBC,IACpB,MAAMd,EAAcM,EAAMJ,OAAOa,KAAMC,GAAUA,EAAMF,OAASA,GAChEP,EAASE,OAAOC,OAAOD,OAAOC,OAAO,GAAIJ,GAAQ,CAAEN,oBAIvD,OAAO,IAAMiB,cAAcd,EAASe,SAAU,CAAEV,MAAOA,GAASH,EAAMc,WAE7DC,EAAW,IAAM,qBAAWjB,G,6GChBzC,MAAMkB,EAAQ,IAAc,KAGfC,EAAYjB,IACrB,MAAOkB,EAAWC,GAAc,IAAMC,UAAS,IACxCC,EAAWC,GAAc,IAAMF,UAAS,IACxCG,EAAcC,GAAiB,IAAMJ,UAAS,IAC9CK,EAASC,GAAY,IAAMN,UAAS,GAYrCO,EAAmBC,IACrB,IAAIC,GACuC,QAArCA,EAAKD,EAAME,OAAOC,qBAAkC,IAAPF,OAAgB,EAASA,EAAGG,YAAchC,EAAMS,MAInGe,GAAc,GACdL,GAAW,GACXc,WAAW,IAAMd,GAAW,GAzBJ,MAoBpBG,GAAW,IAObY,EAAsB,KACxBZ,GAAW,GACXE,GAAc,GACdE,GAAS,GACTO,WAAW,KACPP,GAAS,IAjCS,MAoCpBS,EAAsBP,IACpBA,EAAME,OAAOE,WAAahC,EAAMS,KAIpCe,GAAc,GAHVF,GAAW,IAKnB,IAAMc,UAAU,KACZC,OAAOC,iBAAiB,OAAuBH,GAC/CE,OAAOC,iBAAiB,OAAyBX,GACjDU,OAAOC,iBAAiB,OAA6BJ,GAC9C,KACHG,OAAOC,iBAAiB,OAAuBH,GAC/CE,OAAOE,oBAAoB,OAAyBZ,GACpDU,OAAOE,oBAAoB,OAA6BL,KAG7D,IAyBH,OAAQ,IAAMtB,cAAc,MAAO,CAAE4B,UAAWxB,EAAM,KAAM,CACpD,aAAcK,EACd,iBAAkBE,EAClB,aAAcL,IACduB,SA3EahC,EA2EQT,EAAMS,KA3EJmB,IAC3BA,EAAMc,kBACNlB,GAAc,GACd,MAAMmB,EAAmB,IAAIC,YAAY,OAAuB,CAC5Dd,OAAQ,CACJE,SAAUvB,EACVoC,SAAU,KAGlBR,OAAOS,cAAcH,MAsCZ,MACT,MAAMI,EAAK,OAAAC,EAAA,KACX,OAAIvB,EACQ,IAAMb,cAAc,MAAO,CAAEqC,QAAS,MAAOC,MAAO,6BAA8BC,MAAO,KAAMC,OAAQ,KAAMC,QAAS,aAC1H,IAAMzC,cAAc,OAAQ,CAAE0C,EAAG,ypBAErC/B,EACQ,IAAMX,cAAc,MAAO,CAAEsC,MAAO,6BAA8BC,MAAO,KAAMC,OAAQ,KAAMC,QAAS,aAC1G,IAAMzC,cAAc,OAAQ,KACxB,IAAMA,cAAc,iBAAkB,CAAEmC,GAAI,gBAAgBA,IAAMQ,GAAI,SAAUC,GAAI,OAAQC,GAAI,QAASC,GAAI,QAASC,cAAe,qBACjI,IAAM/C,cAAc,OAAQ,CAAEgD,OAAQ,IAAKC,UAAW,UAAWC,YAAa,MAC9E,IAAMlD,cAAc,OAAQ,CAAEgD,OAAQ,IAAKC,UAAW,cAC9D,IAAMjD,cAAc,OAAQ,CAAEI,MAAO,CAC7B+C,SAAU,UACVC,KAAM,qBAAqBjB,MAC5BO,EAAG,4WAA6WW,UAAW,iCAEtY/C,EACQ,IAAMN,cAAc,MAAO,CAAEsC,MAAO,6BAA8BC,MAAO,KAAMC,OAAQ,KAAMc,iBAAkB,gBAAiBb,QAAS,YAAac,SAAU,YACpK,IAAMvD,cAAc,WAAY,CAAEoD,KAAM,OAAQI,OAAQ,mBAAoBC,OAAQ,UAAWC,iBAAkB,KAAMC,YAAa,SAEpI,IAAM3D,cAAc,MAAO,CAAEqC,QAAS,MAAOC,MAAO,6BAA8BC,MAAO,KAAMC,OAAQ,KAAMC,QAAS,aAC1H,IAAMzC,cAAc,OAAQ,CAAE0C,EAAG,0pBAMGkB,IA3ExB,IAAC/D,GCPnB,EAAQ,IAAc,KAEfgE,EAAc,KACvB,MAAM,KAAEhF,EAAI,MAAEC,EAAK,YAAEC,EAAW,OAAEE,GAAWkB,IAC7C,IAAKpB,EACD,OAAO,KAEX,MAAM+E,EAAsB,CACxBC,IAAKhF,EAAYiF,SACjBC,gBAAiB,UACjBC,OAAQ,CACJ,CACI3B,MAAO,IACPC,OAAQ,IACR2B,QAAS,IAEb,CACI5B,MAAO,IACPC,OAAQ,IACR2B,QAAS,MAIfC,EAAS,2BAAiBN,GAChC,OAAQ,IAAM9D,cAAc,MAAO,CAAE4B,UAAW,KAC5C,IAAM5B,cAAc,MAAO,CAAE4B,UAAW,EAAM,kBAC1C,IAAM5B,cAAc,MAAO,CAAE4B,UAAW,CAAC,EAAM,SAAU,YAAYyC,KAAK,KAAMC,QAzBpEC,EAyB2FH,EAzBjFG,EAAMC,IAAKC,GAAY,GAAGA,EAAQV,OAAOU,EAAQlC,UAAU8B,KAAK,MAyB0BK,MAAO,kCAAmCC,IAAKP,EAAOA,EAAOzE,OAAS,GAAGoE,IAAKa,IAAK7F,EAAYF,OAC/M,IAAMmB,cAAc,MAAO,CAAE4B,UAAW,EAAM,SAC1C,IAAM5B,cAAc,MAAO,CAAE4B,UAAW,EAAM,UAAY9C,GAC1D,IAAMkB,cAAc,MAAO,CAAE4B,UAAW,EAAM,SAAW/C,GACzD,IAAMmB,cAAc,MAAO,CAAE4B,UAAW,EAAM,UAAY7C,EAAY8F,QAC1E5F,EAAOuF,IAAKzE,GAAW,IAAMC,cAAc,MAAO,CAAE8E,IAAK/E,EAAMF,KAAM+B,UAAW,EAAM,WAAY,CAC1F,aAAc7B,EAAMF,OAASd,EAAYc,QAE7C,IAAMG,cAAcK,EAAU,CAAER,KAAME,EAAMF,WAjCrC,IAAC0E,G,sBCJxB,MAAM,EAAQ,IAAc,KAefQ,EAAS3F,IAClB,MAAM,eAAEQ,EAAc,YAAEb,GAAgBoB,IAIxC,OAAQ,IAAMH,cAAc,MAAO,CAAE4B,UAAW,EAAM,CAAE,YAAaoD,SAASjG,aAAiD,EAASA,EAAYc,QAAUT,EAAMS,QAAUgC,QAH9J,KACZjC,EAAeR,EAAMS,QAGrB,IAAMG,cAAc,MAAO,CAAE4B,UAAW,EAAM,UApBlCqD,EAoBwD7F,EAAM6F,cApB/CC,EAoB8D9F,EAAM8F,cAnB/FD,EAActF,OAAS,EACf,IAAMK,cAAc,OAAQ,CAAE4B,UAAW,EAAM,SAAUxB,MAAO,CAChE+E,WAAY,6BAA6BF,EAAc,OAAOA,EAAc,WAAWA,EAAc,YAG7GA,EAActF,OACN,IAAMK,cAAc,OAAQ,CAAE4B,UAAW,EAAM,SAAUxB,MAAO,CAAE6D,gBAAiBgB,EAAc,MAEzGC,EACQ,IAAMlF,cAAc,MAAO,CAAE4B,UAAW,EAAM,SAAU+C,IAAKO,IAElE,IAAMlF,cAAc,OAAQ,CAAE4B,UAAW,EAAM,aASlD,IAAM5B,cAAc,MAAO,CAAE4B,UAAW,EAAM,SAC1C,IAAM5B,cAAc,MAAO,CAAE4B,UAAW,EAAM,SAC1C,IAAM5B,cAAc,OAAQ,CAAE4B,UAAW,EAAM,SAAWxC,EAAMP,MAChE,IAAMmB,cAAc,OAAQ,CAAE4B,UAAW,EAAM,UAAYxC,EAAMyF,QACrE,IAAM7E,cAAc,MAAO,CAAE4B,UAAW,EAAM,SAC1C,IAAM5B,cAAc,OAAQ,CAAE4B,UAAW,EAAM,SAAWxC,EAAMS,MAChE,IAAMG,cAAc,OAAQ,CAAE4B,UAAW,EAAM,cAAgBxC,aAAqC,EAASA,EAAMgG,YAC3H,IAAMpF,cAAc,MAAO,CAAE4B,UAAW,EAAM,aAC1C,IAAM5B,cAAcK,EAAU,CAAER,KAAMT,EAAMS,SA7BrC,IAACoF,EAAeC,G,sBCAnC,MAAM,EAAQ,IAAc,KACfG,EAAS,KAClB,MAAM,OAAEpG,EAAM,YAAEF,GAAgBoB,IAChC,OAAQ,IAAMH,cAAc,MAAO,CAAE4B,UAAW,KAC5C,IAAM5B,cAAc,KAAM,CAAE4B,UAAW,EAAM,iBACzC,IAAM5B,cAAc,KAAM,CAAE4B,UAAW,EAAM,iBAAmB7C,aAAiD,EAASA,EAAYF,MACtI,IAAMmB,cAAc,KAAM,CAAE4B,UAAW,EAAM,iBAAmB7C,aAAiD,EAASA,EAAYc,OAC1I,IAAMG,cAAc,IAAW,KAC3B,IAAMA,cAAc,MAAO,CAAE4B,UAAW,EAAM,YAAc3C,EAAOuF,IAAKzE,GAAU,IAAMC,cAAc+E,EAAOvF,OAAOC,OAAO,CAAEqF,IAAK/E,EAAMF,MAAQE,S,sBCR5J,MAAM,EAAQ,IAAc,KACfuF,EAAU,IAAO,IAAMtF,cAAc,MAAO,CAAE4B,UAAW,KAClE,IAAM5B,cAAc,IAAW,KAC3B,IAAMA,cAAc,MAAO,CAAE4B,UAAW,EAAM,eAC1C,IAAM5B,cAAc6D,EAAa,MACjC,IAAM7D,cAAcqF,EAAQ,S,sBCPxC,MAAM,EAAQ,IAAc,KAEfE,EAAoB,KAC7B,MAAOC,EAAcC,GAAmB,IAAMjF,SAAS,IACjDkF,EAAW1E,IACbyE,EAAgBzE,EAAME,OAAOyE,kBAC7BtE,WAAW,KACPoE,EAAgB,KANE,MAe1B,OANA,IAAMjE,UAAU,KACZC,OAAOC,iBAAiB,OAA6BgE,GAC9C,KACHjE,OAAOE,oBAAoB,OAA6B+D,KAE7D,IACEF,EAGG,IAAMxF,cAAc,MAAO,CAAE4B,UAAW,KAC5C,IAAM5B,cAAc,MAAO,CAAE4B,UAAW,EAAM,QAASS,QAAS,MAAOC,MAAO,6BAA8BC,MAAO,KAAMC,OAAQ,KAAMC,QAAS,aAC5I,IAAMzC,cAAc,OAAQ,CAAE0C,EAAG,gdACrC,IAAM1C,cAAc,OAAQ,KAAMwF,IAL3B,M,oCCXf,MAAM,EAAQ,IAAc,KAC5B,IAAcI,YAAY,CACtBC,kBAAmB,KACnBC,cAAc,IAEX,MAAMC,EAAM,KACf,MAAOC,EAAwBC,GAAkC,IAAMzF,UAAS,IAC1E,WAAEd,GAAeS,IACjB+F,EAAwB,IAAMD,GAA8B,GAC5DE,EAAenF,IACjBtB,EAAWsB,EAAME,OAAOrC,KAAMmC,EAAME,OAAOpC,MAAOkC,EAAME,OAAOjC,QAC/DgH,GAA8B,IASlC,OAPA,IAAMzE,UAAU,KACZC,OAAOC,iBAAiB,OAAgCyE,GACjD,KACH1E,OAAOC,iBAAiB,OAAgCyE,KAG7D,IACK,IAAMnG,cAAc,QAAO,CAAEoG,QAASF,EAAuBG,iBAAiB,EAAMC,OAAQN,GAChG,IAAMhG,cAAc,MAAO,CAAE4B,UAAW,EAAM,SAAUC,QAASqE,GAC7D,IAAMlG,cAAc,MAAO,CAAEsC,MAAO,6BAA8BD,QAAS,MAAOE,MAAO,KAAMC,OAAQ,KAAMC,QAAS,aAClH,IAAMzC,cAAc,OAAQ,CAAE0C,EAAG,4ZACzC,IAAM1C,cAAcuF,EAAmB,MACvC,IAAMvF,cAAcsF,EAAS,QC/BxBiB,EAAS,KAClB,MAAMC,EAASC,SAASC,eAAe,0BACnCF,GACA,IAASD,OAAO,IAAMvG,cAAcb,EAAe,KAC/C,IAAMa,cAAc+F,EAAK,OAAQS,K,oBCP7CG,EAAOC,QAAU,CAAC,eAAe,0BAA0B,8BAA8B,0BAA0B,sBAAsB,wBAAwB,qBAAqB,wBAAwB,sBAAsB,0BAA0B,qBAAqB,0BAA0B,sBAAsB,0BAA0B,yBAAyB,wBAAwB,qCAAqC,4B,oBCAnbD,EAAOC,QAAU,CAAC,YAAY,0BAA0B,wBAAwB,0BAA0B,4BAA4B,0BAA0B,wBAAwB,0BAA0B,SAAW,wBAAwB,KAAO,0B,oBCA5PD,EAAOC,QAAU,CAAC,MAAQ,0BAA0B,mBAAmB,0BAA0B,YAAc,0BAA0B,aAAe,0BAA0B,YAAc,0BAA0B,YAAc,wBAAwB,YAAc,0BAA0B,YAAc,0BAA0B,aAAe,0BAA0B,mBAAmB,0BAA0B,gBAAkB,0B,oBCAxbD,EAAOC,QAAU,CAAC,OAAS,0BAA0B,uBAAuB,0BAA0B,uBAAuB,0BAA0B,gBAAkB,4B,oBCAzKD,EAAOC,QAAU,CAAC,QAAU,0BAA0B,oBAAsB,4B,oBCA5ED,EAAOC,QAAU,CAAC,qBAAqB,0BAA0B,2BAA2B,4B,oBCA5FD,EAAOC,QAAU,CAAC,aAAe","file":"js/app.ea0d28b7948939398982.js","sourcesContent":["import React, { createContext, useState, useContext } from 'react';\r\nconst initialStore = {\r\n name: '',\r\n brand: '',\r\n activeShade: undefined,\r\n shades: [],\r\n};\r\nconst AppStore = createContext(initialStore);\r\nexport const StoreProvider = (props) => {\r\n const [state, setState] = useState(initialStore);\r\n const setProduct = (name, brand, shades) => {\r\n setState(Object.assign(Object.assign({}, state), { name,\r\n brand,\r\n shades, activeShade: shades.length > 0 ? shades[0] : undefined }));\r\n };\r\n const setActiveShade = (code) => {\r\n const activeShade = state.shades.find((shade) => shade.code === code);\r\n setState(Object.assign(Object.assign({}, state), { activeShade }));\r\n };\r\n const value = Object.assign(Object.assign({}, state), { setProduct,\r\n setActiveShade });\r\n return React.createElement(AppStore.Provider, { value: value }, props.children);\r\n};\r\nexport const useStore = () => useContext(AppStore);\r\n","import React from 'react';\r\nimport { default as bemCssModules } from 'bem-css-modules';\r\nimport * as AddToBasketEvent from '@ori-events/add-to-basket';\r\nimport * as AddToBasketFailedEvent from '@ori-events/add-to-basket-failed';\r\nimport * as BasketUpdatedEvent from '@ori-events/basket-updated';\r\nimport { v4 } from 'uuid';\r\nimport { default as QuickBuyStyles } from './QuickBuy.module.css';\r\nconst style = bemCssModules(QuickBuyStyles);\r\nconst ERROR_REMOVAL_TIMEOUT = 300;\r\nconst SUCCESS_REMOVAL_TIMEOUT = 2000;\r\nexport const QuickBuy = (props) => {\r\n const [isSuccess, setSuccess] = React.useState(false);\r\n const [isWaiting, setWaiting] = React.useState(false);\r\n const [isInProgress, setInProgress] = React.useState(false);\r\n const [isError, setError] = React.useState(false);\r\n const addToBasket = (code) => (event) => {\r\n event.stopPropagation();\r\n setInProgress(true);\r\n const addtoBasketEvent = new CustomEvent(AddToBasketEvent.Name, {\r\n detail: {\r\n itemCode: code,\r\n quantity: 1,\r\n },\r\n });\r\n window.dispatchEvent(addtoBasketEvent);\r\n };\r\n const onBasketUpdated = (event) => {\r\n var _a;\r\n if (((_a = event.detail.lastAddedItem) === null || _a === void 0 ? void 0 : _a.itemCode) !== props.code) {\r\n setWaiting(false);\r\n return;\r\n }\r\n setInProgress(false);\r\n setSuccess(true);\r\n setTimeout(() => setSuccess(false), SUCCESS_REMOVAL_TIMEOUT);\r\n };\r\n const onAddToBaskedFailed = () => {\r\n setWaiting(false);\r\n setInProgress(false);\r\n setError(true);\r\n setTimeout(() => {\r\n setError(false);\r\n }, ERROR_REMOVAL_TIMEOUT);\r\n };\r\n const onOtherAddToBasket = (event) => {\r\n if (event.detail.itemCode !== props.code) {\r\n setWaiting(true);\r\n return;\r\n }\r\n setInProgress(true);\r\n };\r\n React.useEffect(() => {\r\n window.addEventListener(AddToBasketEvent.Name, onOtherAddToBasket);\r\n window.addEventListener(BasketUpdatedEvent.Name, onBasketUpdated);\r\n window.addEventListener(AddToBasketFailedEvent.Name, onAddToBaskedFailed);\r\n return () => {\r\n window.addEventListener(AddToBasketEvent.Name, onOtherAddToBasket);\r\n window.removeEventListener(BasketUpdatedEvent.Name, onBasketUpdated);\r\n window.removeEventListener(AddToBasketFailedEvent.Name, onAddToBaskedFailed);\r\n };\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n const icon = () => {\r\n const id = v4();\r\n if (isError) {\r\n return (React.createElement(\"svg\", { version: \"1.1\", xmlns: \"http://www.w3.org/2000/svg\", width: \"25\", height: \"26\", viewBox: \"0 0 43 64\" },\r\n React.createElement(\"path\", { d: \"M41.26 29.1c-0.22-2.191-2.191-3.975-4.394-3.975h-4.125v-2.75c0-6.064-4.936-11-11-11s-11 4.936-11 11v2.75h-4.125c-2.202 0-4.173 1.783-4.394 3.975l-2.202 22.027c-0.11 1.12 0.231 2.181 0.967 2.992 0.73 0.811 1.754 1.257 2.879 1.257h35.75c1.125 0 2.148-0.446 2.879-1.257 0.736-0.811 1.077-1.872 0.967-2.992l-2.202-22.027zM13.491 22.375c0-4.549 3.701-8.25 8.25-8.25s8.25 3.701 8.25 8.25v2.75h-16.5v-2.75zM40.459 52.273c-0.207 0.228-0.505 0.352-0.843 0.352h-35.75c-0.338 0-0.636-0.124-0.843-0.352-0.204-0.228-0.298-0.537-0.263-0.873l2.202-22.027c0.078-0.8 0.854-1.498 1.654-1.498h30.25c0.8 0 1.576 0.698 1.654 1.499l2.202 22.027c0.035 0.336-0.059 0.645-0.263 0.873z\" })));\r\n }\r\n if (isInProgress) {\r\n return (React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"20\", height: \"20\", viewBox: \"0 0 20 20\" },\r\n React.createElement(\"defs\", null,\r\n React.createElement(\"linearGradient\", { id: `spinner-fill-${id}`, x1: \"-0.019\", y1: \"0.75\", x2: \"0.911\", y2: \"0.887\", gradientUnits: \"objectBoundingBox\" },\r\n React.createElement(\"stop\", { offset: \"0\", stopColor: \"#bac5b9\", stopOpacity: \"0\" }),\r\n React.createElement(\"stop\", { offset: \"1\", stopColor: \"#bac5b9\" }))),\r\n React.createElement(\"path\", { style: {\r\n fillRule: 'evenodd',\r\n fill: `url(#spinner-fill-${id})`,\r\n }, d: \"M20.412,962.766a10.224,10.224,0,0,0-10.009,10,11.959,11.959,0,0,0,.1,1.425c.187,1.222.849,1.508,1.4,1.46a.985.985,0,0,0,.7-.365,1.092,1.092,0,0,0,.191-.886c-.013-.057-.018-.12-.026-.174a7.667,7.667,0,0,1-.156-1.46,7.782,7.782,0,1,1,5.074,7.3,1.108,1.108,0,1,0-.877,2.033,9.043,9.043,0,0,0,3.606.669,9.988,9.988,0,0,0,9.991-10A10.317,10.317,0,0,0,20.412,962.766Z\", transform: \"translate(-10.403 -962.766)\" })));\r\n }\r\n if (isSuccess) {\r\n return (React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"18\", height: \"18\", enableBackground: \"new 0 0 24 24\", viewBox: \"0 0 24 24\", xmlSpace: \"preserve\" },\r\n React.createElement(\"polyline\", { fill: \"none\", points: \"23,4 7.5,20 0,12\", stroke: \"#89cd7a\", strokeMiterlimit: \"10\", strokeWidth: \"1.5\" })));\r\n }\r\n return (React.createElement(\"svg\", { version: \"1.1\", xmlns: \"http://www.w3.org/2000/svg\", width: \"25\", height: \"26\", viewBox: \"0 0 43 64\" },\r\n React.createElement(\"path\", { d: \"M41.26 29.1c-0.22-2.191-2.191-3.975-4.394-3.975h-4.125v-2.75c0-6.064-4.936-11-11-11s-11 4.936-11 11v2.75h-4.125c-2.202 0-4.173 1.783-4.394 3.975l-2.202 22.027c-0.11 1.12 0.231 2.181 0.967 2.992 0.73 0.811 1.754 1.257 2.879 1.257h35.75c1.125 0 2.148-0.446 2.879-1.257 0.736-0.811 1.077-1.872 0.967-2.992l-2.202-22.027zM13.491 22.375c0-4.549 3.701-8.25 8.25-8.25s8.25 3.701 8.25 8.25v2.75h-16.5v-2.75zM40.459 52.273c-0.207 0.228-0.505 0.352-0.843 0.352h-35.75c-0.338 0-0.636-0.124-0.843-0.352-0.204-0.228-0.298-0.537-0.263-0.873l2.202-22.027c0.078-0.8 0.854-1.498 1.654-1.498h30.25c0.8 0 1.576 0.698 1.654 1.499l2.202 22.027c0.035 0.336-0.059 0.645-0.263 0.873z\" })));\r\n };\r\n return (React.createElement(\"div\", { className: style(null, {\r\n 'is-waiting': isWaiting,\r\n 'is-in-progress': isInProgress,\r\n 'is-success': isSuccess,\r\n }), onClick: addToBasket(props.code) }, icon()));\r\n};\r\n","import React from 'react';\r\nimport { default as bemCssModules } from 'bem-css-modules';\r\nimport { getImageVariants, } from '@ori/image-sizes-helper';\r\nimport 'lazysizes';\r\nimport 'lazysizes/plugins/attrchange/ls.attrchange';\r\nimport { useStore } from '../../store/AppStore';\r\nimport { default as ActiveShadeStyles } from './ActiveShade.module.css';\r\nimport { QuickBuy } from '../QuickBuy/QuickBuy';\r\nconst style = bemCssModules(ActiveShadeStyles);\r\nconst generateSrcset = (image) => image.map((variant) => `${variant.url} ${variant.width}w`).join(',');\r\nexport const ActiveShade = () => {\r\n const { name, brand, activeShade, shades } = useStore();\r\n if (!activeShade) {\r\n return null;\r\n }\r\n const imageVariantsConfig = {\r\n url: activeShade.imageUrl,\r\n backgroundColor: '#f5f5f5',\r\n params: [\r\n {\r\n width: 695,\r\n height: 695,\r\n quality: 60,\r\n },\r\n {\r\n width: 360,\r\n height: 360,\r\n quality: 90,\r\n },\r\n ],\r\n };\r\n const images = getImageVariants(imageVariantsConfig);\r\n return (React.createElement(\"div\", { className: style() },\r\n React.createElement(\"div\", { className: style('image-wrapper') },\r\n React.createElement(\"img\", { className: [style('image'), 'lazyload'].join(' '), srcSet: generateSrcset(images), sizes: `(max-width: 767px) 696px, 360px`, src: images[images.length - 1].url, alt: activeShade.name }),\r\n React.createElement(\"div\", { className: style('info') },\r\n React.createElement(\"div\", { className: style('brand') }, brand),\r\n React.createElement(\"div\", { className: style('name') }, name),\r\n React.createElement(\"div\", { className: style('price') }, activeShade.price)),\r\n shades.map((shade) => (React.createElement(\"div\", { key: shade.code, className: style('quickbuy', {\r\n 'is-visible': shade.code === activeShade.code,\r\n }) },\r\n React.createElement(QuickBuy, { code: shade.code })))))));\r\n};\r\n","import React from 'react';\r\nimport { default as bemCssModules } from 'bem-css-modules';\r\nimport { QuickBuy } from '../QuickBuy/QuickBuy';\r\nimport { useStore } from '../../store/AppStore';\r\nimport { default as ShadeStyles } from './Shade.module.css';\r\nconst style = bemCssModules(ShadeStyles);\r\nconst shadeColor = (colorHexCodes, colorImageUrl) => {\r\n if (colorHexCodes.length > 1) {\r\n return (React.createElement(\"span\", { className: style('color'), style: {\r\n background: `linear-gradient(to right, ${colorHexCodes[0]}, ${colorHexCodes[0]} 50%, ${colorHexCodes[1]} 50%`\r\n } }));\r\n }\r\n if (colorHexCodes.length) {\r\n return (React.createElement(\"span\", { className: style('color'), style: { backgroundColor: colorHexCodes[0] } }));\r\n }\r\n if (colorImageUrl) {\r\n return (React.createElement(\"img\", { className: style('color'), src: colorImageUrl }));\r\n }\r\n return React.createElement(\"span\", { className: style('shade') });\r\n};\r\nexport const Shade = (props) => {\r\n const { setActiveShade, activeShade } = useStore();\r\n const onClick = () => {\r\n setActiveShade(props.code);\r\n };\r\n return (React.createElement(\"div\", { className: style({ 'is-active': Boolean((activeShade === null || activeShade === void 0 ? void 0 : activeShade.code) === props.code) }), onClick: onClick },\r\n React.createElement(\"div\", { className: style('icon') }, shadeColor(props.colorHexCodes, props.colorImageUrl)),\r\n React.createElement(\"div\", { className: style('info') },\r\n React.createElement(\"div\", { className: style('line') },\r\n React.createElement(\"span\", { className: style('name') }, props.name),\r\n React.createElement(\"span\", { className: style('price') }, props.price)),\r\n React.createElement(\"div\", { className: style('line') },\r\n React.createElement(\"span\", { className: style('code') }, props.code),\r\n React.createElement(\"span\", { className: style('old-price') }, props === null || props === void 0 ? void 0 : props.oldPrice))),\r\n React.createElement(\"div\", { className: style('quickbuy') },\r\n React.createElement(QuickBuy, { code: props.code }))));\r\n};\r\n","import React from 'react';\r\nimport SimpleBar from 'simplebar-react';\r\nimport { default as bemCssModules } from 'bem-css-modules';\r\nimport { Shade } from '../Shade/Shade';\r\nimport { useStore } from '../../store/AppStore';\r\nimport { default as ShadesStyles } from './Shades.module.css';\r\nconst style = bemCssModules(ShadesStyles);\r\nexport const Shades = () => {\r\n const { shades, activeShade } = useStore();\r\n return (React.createElement(\"div\", { className: style() },\r\n React.createElement(\"ul\", { className: style('active-shade') },\r\n React.createElement(\"li\", { className: style('shade-detail') }, activeShade === null || activeShade === void 0 ? void 0 : activeShade.name),\r\n React.createElement(\"li\", { className: style('shade-detail') }, activeShade === null || activeShade === void 0 ? void 0 : activeShade.code)),\r\n React.createElement(SimpleBar, null,\r\n React.createElement(\"div\", { className: style('wrapper') }, shades.map((shade) => React.createElement(Shade, Object.assign({ key: shade.code }, shade)))))));\r\n};\r\n","import React from 'react';\r\nimport { default as bemCssModules } from 'bem-css-modules';\r\nimport SimpleBar from 'simplebar-react';\r\nimport { ActiveShade } from '../ActiveShade/ActiveShade';\r\nimport { Shades } from '../Shades/Shades';\r\nimport { default as ContentStyles } from './Content.module.css';\r\nconst style = bemCssModules(ContentStyles);\r\nexport const Content = () => (React.createElement(\"div\", { className: style() },\r\n React.createElement(SimpleBar, null,\r\n React.createElement(\"div\", { className: style('scrollable') },\r\n React.createElement(ActiveShade, null),\r\n React.createElement(Shades, null)))));\r\n","import React from 'react';\r\nimport { default as bemCssModules } from 'bem-css-modules';\r\nimport * as AddToBasketFailedEvent from '@ori-events/add-to-basket-failed';\r\nimport { default as ErrorNotificationStyles } from './ErrorNotification.module.css';\r\nconst style = bemCssModules(ErrorNotificationStyles);\r\nconst ERROR_REMOVAL_TIMEOUT = 3000;\r\nexport const ErrorNotification = () => {\r\n const [errorMessage, setErrorMessage] = React.useState('');\r\n const onError = (event) => {\r\n setErrorMessage(event.detail.localizedMessage);\r\n setTimeout(() => {\r\n setErrorMessage('');\r\n }, ERROR_REMOVAL_TIMEOUT);\r\n };\r\n React.useEffect(() => {\r\n window.addEventListener(AddToBasketFailedEvent.Name, onError);\r\n return () => {\r\n window.removeEventListener(AddToBasketFailedEvent.Name, onError);\r\n };\r\n }, []);\r\n if (!errorMessage) {\r\n return null;\r\n }\r\n return (React.createElement(\"div\", { className: style() },\r\n React.createElement(\"svg\", { className: style('icon'), version: \"1.1\", xmlns: \"http://www.w3.org/2000/svg\", width: \"44\", height: \"64\", viewBox: \"0 0 44 64\" },\r\n React.createElement(\"path\", { d: \"M22 55.375c12.131 0 22-9.869 22-22s-9.869-22-22-22-22 9.869-22 22 9.869 22 22 22zM22 14.125c10.613 0 19.25 8.637 19.25 19.25s-8.637 19.25-19.25 19.25-19.25-8.637-19.25-19.25 8.637-19.25 19.25-19.25zM20.625 34.75v-11c0-0.76 0.615-1.375 1.375-1.375s1.375 0.615 1.375 1.375v11c0 0.76-0.615 1.375-1.375 1.375s-1.375-0.615-1.375-1.375zM20.351 42.726c0-0.913 0.736-1.649 1.649-1.649s1.649 0.736 1.649 1.649c0 0.913-0.736 1.649-1.649 1.649s-1.649-0.736-1.649-1.649z\" })),\r\n React.createElement(\"span\", null, errorMessage)));\r\n};\r\n","import React from 'react';\r\nimport { Modal } from '@ori/online-modal';\r\nimport { default as bemCssModules } from 'bem-css-modules';\r\nimport * as OpenMultishadeDialogEvent from '@ori-events/open-multishade-dialog';\r\nimport { useStore } from './store/AppStore';\r\nimport { Content } from './components/Content/Content';\r\nimport { ErrorNotification } from './components/ErrorNotification/ErrorNotification';\r\nimport { default as AppStyles } from './App.module.css';\r\nimport '@ori/online-modal/build/style.css';\r\nimport 'simplebar/dist/simplebar.min.css';\r\nconst style = bemCssModules(AppStyles);\r\nbemCssModules.setSettings({\r\n modifierDelimiter: '--',\r\n throwOnError: false,\r\n});\r\nexport const App = () => {\r\n const [isMultishadeDialogOpen, setMultishadeDialogVisibility,] = React.useState(false);\r\n const { setProduct } = useStore();\r\n const closeMultishadeDialog = () => setMultishadeDialogVisibility(false);\r\n const onModalOpen = (event) => {\r\n setProduct(event.detail.name, event.detail.brand, event.detail.shades);\r\n setMultishadeDialogVisibility(true);\r\n };\r\n React.useEffect(() => {\r\n window.addEventListener(OpenMultishadeDialogEvent.Name, onModalOpen);\r\n return () => {\r\n window.addEventListener(OpenMultishadeDialogEvent.Name, onModalOpen);\r\n };\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n return (React.createElement(Modal, { onClose: closeMultishadeDialog, isCustomContent: true, isOpen: isMultishadeDialogOpen },\r\n React.createElement(\"div\", { className: style('close'), onClick: closeMultishadeDialog },\r\n React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", version: \"1.1\", width: \"20\", height: \"20\", viewBox: \"0 0 44 64\" },\r\n React.createElement(\"path\", { d: \"M24.917 33.375l18.48-18.48c0.806-0.806 0.806-2.111 0-2.917s-2.111-0.806-2.916 0l-18.48 18.48-18.48-18.48c-0.806-0.806-2.111-0.806-2.917 0s-0.806 2.111 0 2.917l18.48 18.48-18.48 18.48c-0.806 0.806-0.806 2.111 0 2.917 0.403 0.403 0.929 0.604 1.458 0.604s1.055-0.201 1.458-0.604l18.48-18.48 18.48 18.48c0.403 0.403 0.929 0.604 1.458 0.604s1.055-0.201 1.458-0.604c0.806-0.806 0.806-2.111 0-2.917l-18.48-18.48z\" }))),\r\n React.createElement(ErrorNotification, null),\r\n React.createElement(Content, null)));\r\n};\r\n","import ReactDOM from 'react-dom';\r\nimport React from 'react';\r\nimport { App } from './App';\r\nimport { StoreProvider } from './store/AppStore';\r\nexport const render = () => {\r\n const rootEl = document.getElementById('multishade-dialog-root');\r\n if (rootEl) {\r\n ReactDOM.render(React.createElement(StoreProvider, null,\r\n React.createElement(App, null)), rootEl);\r\n }\r\n};\r\n","// extracted by mini-css-extract-plugin\nmodule.exports = {\"active-shade\":\"_18YksUp0Or8IirJgH4_An1\",\"active-shade__image-wrapper\":\"_1VqdzJqzapdmh6_HnmxOGF\",\"active-shade__image\":\"kQeOZx7Mdi0LADquMNZxV\",\"active-shade__info\":\"x7KsAg5UuE9OmmIaAJfdI\",\"active-shade__brand\":\"_1sHnwpcOs8x7avNVbMEvuW\",\"active-shade__name\":\"_3f2oVhpVammLHO_czVS09X\",\"active-shade__price\":\"_28NqUFWYp9bqjazWigMNJF\",\"active-shade__quickbuy\":\"dREe4QXxYxbjN6V9C7T_I\",\"active-shade__quickbuy--is-visible\":\"_3K5roxbRYphmljBHWy8iZh\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"quick-buy\":\"_37sJyMAS9GfMFIKpuDss5V\",\"quick-buy--is-waiting\":\"_1jg0MS7uGBGiQkPrujTS2i\",\"quick-buy--is-in-progress\":\"_3DCstINPxI9f7jzhb7PuVa\",\"quick-buy--is-success\":\"_24VfsaFa3rIpGlv08Sw6T9\",\"rotating\":\"Bpnb57A1nhRo_UatLmdZX\",\"dash\":\"EH6AOmy0LlWWysuu77nau\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"shade\":\"_3Kp2fJf74KGp4pUrLiExOF\",\"shade--is-active\":\"_27LrFteoQIdWh4fInjl-kl\",\"shade__icon\":\"_32Vs1c-gw2F2uH4mzYIBX0\",\"shade__color\":\"_1GLL-OK7bfkmArmX_KvRBo\",\"shade__info\":\"_1HGxCEe2I-Y0svuctAaHmH\",\"shade__line\":\"VYvGDXJ6sg7pMiIw_pbup\",\"shade__name\":\"_2h5oNAdx4mfPlZVjw80cYb\",\"shade__code\":\"_1c8fFprnvDZt5FtIKBROa-\",\"shade__price\":\"_3FHXliGBvS_ecjbLutjJXk\",\"shade__old-price\":\"_1jTo0sz09qOAmt0s91fuf5\",\"shade__quickbuy\":\"DfxlW2EvTMZzShr6n5o3v\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"shades\":\"_1tb0048lMOD6pMzNp7QE1C\",\"shades__active-shade\":\"_2wFlwRSjNx6waYRH48KNcl\",\"shades__shade-detail\":\"_1jnKyyLdHCaBSZBbAefbgX\",\"shades__wrapper\":\"_1r1WMGA60T2SZZ7mZsDe3V\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"content\":\"_1c9mz2HkEFYPxOBljhC4zy\",\"content__scrollable\":\"_26snD2OX-BA-zs1HwSNrWP\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"error-notification\":\"_3K3KM7TE-vPEVWAzJKmotF\",\"error-notification__icon\":\"_2RwTRwASxz3xmNBMAim9fM\"};","// extracted by mini-css-extract-plugin\nmodule.exports = {\"modal__close\":\"_1s95gEIEwV9PAaj2X6QV5d\"};"],"sourceRoot":""}