{"version":3,"sources":["Shared/Icons/CheckIcon.tsx","Shared/Hooks/useOutsideClick.ts","Shared/Icons/PlanogramIcon.tsx","MyPlanogramsPage/MyPlanograms.ts","Shared/Icons/ImagePlaceholderIcon.tsx","MyPlanogramsPage/MyPlanogramsComponent.tsx","PlanogramPage/PlanogramProductCard.tsx","PlanogramPage/PlanogramRowGrid.tsx","PlanogramPage/ProductImagesContainer.tsx","PlanogramPage/AttributeArea.tsx","PlanogramPage/PlanogramProductPage.tsx","PlanogramPage/PlanogramPage.tsx","Shared/Icons/ArrowLeftIconPrimary.tsx","Shared/Button/Dots.tsx"],"names":["styled","compose","Svg","xmlns","viewBox","css","fill","d","stroke","strokeWidth","strokeLinecap","strokeLinejoin","useOutsideClick","ref","callback","handleClick","e","current","contains","target","useEffect","document","addEventListener","removeEventListener","width","height","clipPath","fillRule","clipRule","id","abortController","AbortController","channelId","requestToken","url","setIsLoading","a","abort","signal","litiumContext","JSON","stringify","channelSystemId","Fetcher","data","resolve","Wrapper","div","padding","x","marginBottom","theme","spacing","media","mediaQuery","mediaMinLarge","maxWidth","screenMaxWidth","margin","Container","backgroundColor","white","paddingTop","paddingBottom","borderRadius","DotsWrapper","display","justifyContent","HeadingSection","StyledCtaButton","CtaButton","marginTop","mediaMaxLarge","LinkWrapper","Heading","h3","fontSize","color","black","marginLeft","lineHeight","PlanogramGrid","gridTemplateColumns","gridColumnGap","gridRowGap","mediaMinMedium","pseudo","PlanogramCard","flexDirection","wordBreak","border","xy","style","tiny","veryLightGray","PlanogramImage","ImagePlaceholderIcon","primaryBlue","maxHeight","img","PlanogramText","font","size","beta","weight","fontWeight","bold","textAlign","delta","PlanogramArticleNumber","span","breadText","MyPlanogramsComponent","showAllPlanograms","useAppSettingsData","translations","myPlanogramsLabel","seeAllPlanogramsLabel","myPlanogramsPage","staticPages","languageRoute","planogramPlaceholderImg","placeholderImages","planogramPlaceholder","organizationId","useUserStateData","useState","isLoading","useCurrentPage","myPlanograms","setMyPlanograms","GetCustomerPlanograms","then","length","slice","PlanogramIcon","Dots","data-showbtn","map","planogram","KexLink","key","articleNumber","href","image","src","name","asLink","CellPosition","alpha","textTransform","CellRow","position","left","Cell","PopperArrow","content","transform","zIndex","bottom","top","StockStatus","alignItems","StyledLoadingCircle","LoadingCircle","gamma","right","StyledCheckIcon","CheckIcon","ItemAddedText","ButtonText","transition","property","duration","timingFunction","visibility","opacity","StockStatusCircle","notInStockRed","marginRight","inStockGreen","StockStatusText","AddToCart","QuantitySelector","primaryBackground","MinusButton","button","cursor","QuantityInput","input","MozAppearance","WebkitAppearance","StyledPlusIcon","PlusToggleIcon","StyledMinusIcon","MinusToggleIcon","AddToCartButton","tau","minHeight","MoreInfoButton","ProductCardWrapper","ProductCardModalContainer","boxShadow","paddingRight","PopperWrapper","AttributeArea","paddingLeft","CloseIconWrapper","StyledCloseIcon","CloseIcon","TextWrapper","ProductTitle","QuantityText","middleGray","ProductCard","ProductImage","objectFit","ModalProductImage","PlanogramProductCard","product","planogramId","addToCartLabel","moreInformationLabel","quantityLabel","perPackageLabel","pieceLabel","inStockLabel","notInStockLabel","addedToCartLabel","positionLabel","productPlaceholderImg","productPlaceholder","isActive","setIsActive","inputQuantity","setInputQuantity","itemAdded","setItemAdded","cardRef","useRef","popupRef","inStock","useMedia","productImage","querySelector","bookingNumber","tooltip","createPopper","placement","strategy","modifiers","options","offset","onCardClick","val","scrollIntoView","behavior","block","inline","onInputChange","value","Number","onInputBlur","numb","addToCart","UpdateCart","code","setTimeout","quantityQuery","onCrossClick","onClick","data-is-active","rowPosition","columnPosition","data-ishovered","role","data-instock","quantity","disabled","toString","type","min","max","onChange","onBlur","data-isloading","data-popper-arrow","Grid","PlanogramRowGrid","row","isLast","useScroll","GridStyle","data-usescroll","MainImageDiv","filter","shadows","productImageShadow","none","MainImage","productImageMaxHeight","ProductImagesContainer","alt","AttrContainerWrapper","h1","psi","tight","letterSpacing","wider","Table","borderCollapse","Content","borderTopColor","grayLine","borderTopStyle","borderTopWidth","y","Array","ArrayOrderItemHeading","ArrayOrderItem","TableRow","linkColor","textDecoration","borderBottomColor","borderBottomStyle","borderBottomWidth","TableCell","large","mediaMinVerySmall","PriceContainer","theta","MainPriceContainer","Price","nearGreat","moreLarge","red","loose","wide","epsilon","medium","p","normal","lighter","whiteSpace","Description","relaxed","variation","totalPrice","planogramInputQuantity","planogramVariantList","shortDescription","eanCodeLabel","priceGroupNameLabel","vaLabel","variationCollection","isMobile","mediaMaxMedium","productItem","data-whitebackground","priceGroupName","recommendedPrice","eanCode","BackLinkWrapper","desktopHeaderHeight","ArrowLeftIcon","ArrowLeftIconPrimary","BackLink","Section","section","mediaMinSmall","great","Top","mediaMinHuge","gridGap","massive","gridColumn","start","end","PlanogramProductPage","backToPlanogramLabel","planogramUrl","PageWrapper","TopContent","maxWidthContentPage","InfoTitle","h2","zeta","InfoText","maxWidthSmall","GridContainer","borderSpacing","overflowX","PlanogramPage","pageTitle","planogramProductList","isProductPage","isSeasonal","infoTitle","infoText","backToAllLinkLabel","backToAllSeasonalLinkLabel","myPlanogramsSeasonalPage","isDesktop","forEach","element","index","hasMoreThanThreeColumns","productListRow","Dot","primary","animationName","animationDuration","timings","sevenFifths","animationIterationCount","animationFillMode","animationDelay","oneFifth","twoFifths"],"mappings":"mHAAA,2BAsBeA,iBAnBf,YAA6C,IAAzBC,EAAwB,EAAxBA,QAClB,OACE,kBAAC,IAAOC,IAAR,CACEC,MAAM,6BACNC,QAAQ,YACRC,IAAKJ,IACLK,KAAK,QAEL,0BACEC,EAAE,uCACFC,OAAO,OACPC,YAAY,OACZC,cAAc,QACdC,eAAe,e,iCChBvB,WAkBeC,IAhBS,SAACC,EAA2BC,GAClD,IAAMC,EAAc,SAACC,GACfH,EAAII,UAAYJ,EAAII,QAAQC,SAASF,EAAEG,SACzCL,KAIJM,qBAAU,WAGR,OAFAC,SAASC,iBAAiB,QAASP,GAE5B,WACLM,SAASE,oBAAoB,QAASR,S,iCCb5C,2BAuDef,iBAnDf,YAAkD,IAAzBC,EAAwB,EAAxBA,QACvB,OACE,kBAAC,IAAOC,IAAR,CACEsB,MAAM,KACNC,OAAO,KACPrB,QAAQ,YACRE,KAAK,OACLH,MAAM,6BACNE,IAAKJ,KAEL,uBAAGyB,SAAS,eACV,0BACEC,SAAS,UACTC,SAAS,UACTrB,EAAE,qUACFD,KAAK,UAEP,0BACEqB,SAAS,UACTC,SAAS,UACTrB,EAAE,4MACFD,KAAK,UAEP,0BACEqB,SAAS,UACTC,SAAS,UACTrB,EAAE,qNACFD,KAAK,UAEP,0BACEqB,SAAS,UACTC,SAAS,UACTrB,EAAE,sKACFD,KAAK,UAEP,0BACEqB,SAAS,UACTC,SAAS,UACTrB,EAAE,6JACFD,KAAK,WAGT,8BACE,8BAAUuB,GAAG,SACX,0BAAML,MAAM,KAAKC,OAAO,KAAKnB,KAAK,iB,0GC7CxCwB,EAAmC,IAAIC,gB,4CAEpC,WACLC,EACAC,EACAC,EACAC,GAJK,iBAAAC,EAAA,6DAMLD,GAAgBA,GAAa,GAC7BL,EAAgBO,QAChBP,EAAkB,IAAIC,gBAChBO,EAASR,EAAgBQ,OAEzBC,EAAgBC,KAAKC,UAAU,CACnCC,gBAAiBV,IAZd,kBAcEW,YACLT,EACAI,GACA,SAACM,EAAMC,GACLA,EAAQD,GACRT,GAAgBA,GAAa,KAE/BI,EACAN,IAtBG,4C,0CCWQjC,mBAbf,YAAyD,IAAzBC,EAAwB,EAAxBA,QAC9B,OACE,kBAAC,IAAOC,IAAR,CACEG,IAAKJ,IACLE,MAAM,6BACNC,QAAQ,aAER,0BAAMG,EAAE,kBAAkBD,KAAK,SAC/B,0BAAMC,EAAE,yL,8DC2Fd,IAAMuC,EAAU9C,IAAO+C,IAAP,aACdC,QAAS,CAAEC,EAAG,SACdC,aAAcC,IAAMC,QAAQ,KACzBC,YAAMC,aAAWC,cAAe,CACjCP,QAAS,CAAEC,EAAGE,IAAMC,QAAQ,KAC5BI,SAAUL,IAAMM,eAChBC,OAAQ,CAAET,EAAG,YAIXU,EAAY3D,IAAO+C,IAAP,aAChBa,gBAAiBT,IAAMU,MACvBb,QAAS,CAAEC,EAAGE,IAAMC,QAAQ,IAC5BU,WAAYX,IAAMC,QAAQ,GAC1BW,cAAeZ,IAAMC,QAAQ,IAC7BY,aAAc,QACXX,YAAMC,aAAWC,cAAe,CACjCP,QAAS,CAAEC,EAAGE,IAAMC,QAAQ,KAC5BU,WAAYX,IAAMC,QAAQ,GAC1BW,cAAeZ,IAAMC,QAAQ,QAI3Ba,EAAcjE,IAAO+C,IAAI,CAC7BmB,QAAS,OACTC,eAAgB,SAChBJ,cAAeZ,IAAMC,QAAQ,KAGzBgB,EAAiBpE,IAAO+C,IAAI,CAChCmB,QAAS,OACThB,aAAcC,IAAMC,QAAQ,KAGxBiB,EAAkBrE,YAAOsE,IAAD,aAC5BC,UAAWpB,IAAMC,QAAQ,IACzBF,aAAcC,IAAMC,QAAQ,IACzBC,YAAMC,aAAWkB,cAAe,CACjCd,OAAQ,CAAET,EAAG,YAIXwB,EAAczE,IAAO+C,IAAI,CAC7BmB,QAAS,SAGLQ,EAAU1E,IAAO2E,GAAG,CACxBC,SAAU,OACVC,MAAO1B,IAAM2B,MACbC,WAAY5B,IAAMC,QAAQ,GAC1B4B,WAAY,WAGRC,EAAgBjF,IAAO+C,IAAP,aACpBmB,QAAS,OACTgB,oBAAoB,4BACpBC,cAAehC,IAAMC,QAAQ,GAC7BgC,WAAYjC,IAAMC,QAAQ,IACvBC,YAAMC,aAAW+B,eAAZ,aACNH,oBAAoB,6BACjBI,YAAO,CAAC,sCAAuC,CAChDJ,oBAAoB,gCARJ,GAWjB7B,YAAMC,aAAWC,cAAe,CACjC2B,oBAAoB,4BACpBC,cAAehC,IAAMC,QAAQ,GAC7BgC,WAAYjC,IAAMC,QAAQ,QAIxBmC,EAAgBvF,IAAO+C,IAAI,CAC/BmB,QAAS,OACTsB,cAAe,SACfrB,eAAgB,gBAChB1C,OAAQ,OACRgE,UAAW,aACXC,OAAQ,CACNC,GAAI,CACFC,MAAO,QACPpE,MAAO2B,IAAM0C,KACbhB,MAAO1B,IAAM2C,gBAGjB9B,aAAc,OACdD,cAAeZ,IAAMC,QAAQ,GAC7BU,WAAYX,IAAMC,QAAQ,KAgBtB2C,GAb6B/F,YAAOgG,EAAD,aACvC1F,KAAM6C,IAAM8C,YACZjD,QAAS,CAAEC,EAAGE,IAAMC,QAAQ,IAC5B8C,UAAW,QACXxC,OAAQ,CAAET,EAAG,SACVI,YAAMC,aAAW+B,eAAgB,CAClCa,UAAW,UAN0B,GAQpC7C,YAAMC,aAAWC,cAAe,CACjC2C,UAAW,YAIQlG,IAAOmG,IAAP,aACrBzC,OAAQ,CAAET,EAAG,QACbiD,UAAW,QACXlD,QAAS,CAAEC,EAAGE,IAAMC,QAAQ,KACzBC,YAAMC,aAAW+B,eAAgB,CAClCa,UAAW,UALQ,GAOlB7C,YAAMC,aAAWC,cAAe,CACjC2C,UAAW,aAITE,EAAgBpG,IAAO+C,IAAP,aACpBsD,KAAM,CAAEC,KAAMnD,IAAMoD,KAAMC,OAAQrD,IAAMsD,WAAWC,MACnD1B,WAAY,OACZ2B,UAAW,SACXpC,UAAWpB,IAAMC,QAAQ,GACzByB,MAAO1B,IAAM2B,MACb9B,QAAS,CAAEC,EAAGE,IAAMC,QAAQ,KACzBC,YAAMC,aAAWC,cAAe,CACjCqB,SAAUzB,IAAMyD,MAChB5B,WAAY,WAIV6B,EAAyB7G,IAAO8G,KAAK,CACzCT,KAAM,CAAEC,KAAMnD,IAAMoD,MACpBI,UAAW,SACX9B,MAAO1B,IAAM4D,UACbxC,UAAWpB,IAAMC,QAAQ,KAGZ4D,IAxNf,YAAwE,IAAD,IAAtCC,yBAAsC,WAUjEC,cAViE,IAEnEC,aAC4BC,EAHuC,EAGjE,0BAC8BC,EAJmC,EAIjE,8BAEaC,EANoD,EAMnEC,YAAeD,iBACfE,EAPmE,EAOnEA,cACAvF,EARmE,EAQnEA,aAC2CwF,EATwB,EASnEC,kBAAqBC,qBAEfC,EAAmBC,cAAnBD,eAX6D,EAYnCE,oBAAkB,GAZiB,mBAY9DC,EAZ8D,KAYnD5F,EAZmD,KAc7DH,EAAcgG,cAAdhG,UACFE,EAAG,eAAWsF,EAAX,qDAAqEI,GAfT,EAgB7BE,mBAA0B,IAhBG,mBAgB9DG,EAhB8D,KAgBhDC,EAhBgD,KAgCrE,OAdA9G,qBAAU,WACRwG,GFlCG,SAAP,wCEmCMO,CACEnG,EACAC,EACAC,EACAC,GACAiG,MAAK,SAAAxF,GAAI,OACRqE,GAAuBrE,EAAKyF,QAAUzF,EAAKyF,OAAS,EACjDH,EAAgBtF,EAAK0F,MAAM,EAAG,IAC9BJ,EAAgBtF,QAEvB,CAACZ,IAGF,kBAACc,EAAD,KACE,kBAACa,EAAD,KACE,kBAACS,EAAD,KACE,kBAACmE,EAAA,EAAD,MACA,kBAAC7D,EAAD,KAAU0C,IAEXW,EACC,kBAAC9D,EAAD,KACE,kBAACuE,EAAA,EAAD,OAGF,kBAACvD,EAAD,CAAewD,gBAAexB,KACzBgB,EAAaI,QACdJ,EAAaS,KACX,SAACC,GAAD,OACEA,EAAUzG,KACR,kBAAC0G,EAAA,EAAD,CAASC,IAAKF,EAAUG,cAAeC,KAAMJ,EAAUzG,KACrD,kBAACqD,EAAD,KACGoD,EAAUK,MACT,kBAACjD,EAAD,CACEkD,IAAKN,EAAUK,MAAMC,MAGvB,kBAAClD,EAAD,CACEkD,IAAG,OAAExB,QAAF,IAAEA,OAAF,EAAEA,EAAyBwB,MAGlC,kBAAC7C,EAAD,KAAgBuC,EAAUO,MAC1B,kBAACrC,EAAD,KACG8B,EAAUG,sBAQ3B7B,KAAuBgB,EAAaI,QACpC,kBAAC5D,EAAD,KACE,kBAACJ,EAAD,CAAiB8E,QAAQ,EAAMJ,KAAMzB,GAClCD,Q,2MC4Qf,IAAM+B,EAAepJ,IAAO+C,IAAI,CAC9B8B,MAAO1B,IAAM4D,UACbV,KAAM,CAAEC,KAAMnD,IAAMkG,MAAO7C,OAAQrD,IAAMsD,WAAWC,MACpD4C,cAAe,cAGXC,EAAUvJ,IAAO8G,KAAK,CAC1B0C,SAAU,WACVC,KAAM,OACN5E,MAAO1B,IAAM4D,UACbV,KAAM,CAAEC,KAAMnD,IAAMkG,MAAO7C,OAAQrD,IAAMsD,WAAWC,MACpD4C,cAAe,cAGXI,EAAO1J,IAAO+C,IAAI,IAElB4G,EAAc3J,IAAO+C,IAAP,eACfuC,YAAO,UAAD,aACPsE,QAAS,KACTJ,SAAU,WACVC,KAAM,QACNjI,MAAO,OACPC,OAAQ,OACRuC,aAAc,MACd6F,UAAW,gBACXjG,gBAAiBT,IAAMU,OACpBR,YAAMC,aAAWkB,cAAe,CACjCsF,OAAQ,EACRC,OAAQ,UAXH,GAaJ1G,YAAMC,aAAWC,cAAe,CACjCyG,IAAK,YAKLC,EAAcjK,IAAO+C,IAAI,CAC7BmB,QAAS,OACTgG,WAAY,SACZxG,OAAQ,CAAEqG,OAAQ5G,IAAMC,QAAQ,MAG5B+G,EAAsBnK,YAAOoK,IAAe,CAChDvF,MAAO1B,IAAMU,MACbpC,OAAQ0B,IAAMkH,MACd3G,OAAQ,CAAEiC,GAAI,QACd6D,SAAU,WACVQ,IAAK,EACLP,KAAM,EACNa,MAAO,EACPP,OAAQ,IAGJQ,EAAkBvK,YAAOwK,IAAW,CACxC/I,OAAQ,OACRD,MAAO,OACPuD,WAAY,QAGR0F,EAAgBzK,IAAO+C,IAAI,CAC/BmB,QAAS,OACTgG,WAAY,SACZ/F,eAAgB,SAChBU,MAAO1B,IAAMU,MACbpC,OAAQ0B,IAAMkH,MACd3G,OAAQ,CAAEiC,GAAI,QACd6D,SAAU,WACVQ,IAAK,EACLP,KAAM,EACNa,MAAO,EACPP,OAAQ,IAGJW,EAAa1K,IAAO8G,KAAP,aACjB6D,WAAY,CACVC,SAAU,MACVC,SAAU,OACVC,eAAgB,WAEfxF,YAAO,CAAC,wCAAyC,CAClDyF,WAAY,SACZC,QAAS,MAIPC,EAAoBjL,IAAO+C,IAAP,aACxBiB,aAAc,MACdxC,MAAO,MACPC,OAAQ,MACRmC,gBAAiBT,IAAM+H,cACvBC,YAAahI,IAAMC,QAAQ,IACxBkC,YAAO,CAAC,sCAAuC,CAChD1B,gBAAiBT,IAAMiI,iBAIrBC,EAAkBrL,IAAO8G,KAAK,CAClCjC,MAAO1B,IAAM2B,MACbuB,KAAM,CAAEC,KAAMnD,IAAMkG,MAAO7C,OAAQrD,IAAMsD,WAAWC,MACpD4C,cAAe,cAGXgC,EAAYtL,IAAO+C,IAAI,CAC3BmB,QAAS,OACTgG,WAAY,WAGRqB,EAAmBvL,IAAO+C,IAAI,CAClCa,gBAAiBT,IAAMqI,kBACvBxH,aAAc,QACdE,QAAS,OACTzC,OAAQ,OACRyI,WAAY,SACZlH,QAAS,CAAEC,EAAGE,IAAMC,QAAQ,MAGxBqI,EAAczL,IAAO0L,OAAO,CAChC,YAAa,CACXC,OAAQ,UACRX,QAAS,MAIPY,EAAgB5L,IAAO6L,MAAP,aACpBrK,MAAO2B,IAAMC,QAAQ,GACrBQ,gBAAiBT,IAAMqI,kBACvB7E,UAAW,SACXmF,cAAe,aACZxG,YAAO,CAAC,8BAA+B,+BAAgC,CACxEyG,iBAAkB,OAClBrI,OAAQ,CAAEiC,GAAI,OAIZqG,EAAiBhM,YAAOiM,IAAgB,CAC5CxK,OAAQ,OACRD,MAAO,OACPlB,KAAM6C,IAAM2B,QAGRoH,EAAkBlM,YAAOmM,IAAiB,CAC9C1K,OAAQ,OACRD,MAAO,OACPlB,KAAM6C,IAAM2B,QAGRsH,EAAkBpM,YAAOsE,IAAD,aAC5BkF,SAAU,WACVU,WAAY,SACZ1I,MAAO,OACPoD,SAAUzB,IAAMkJ,IAChBrJ,QAAS,CAAE2C,GAAI,QACfZ,WAAY5B,IAAMC,QAAQ,GAC1BkJ,UAAW,QACRjJ,YAAMC,aAAWC,cAAe,CACjCP,QAAS,CAAE2C,GAAIxC,IAAMC,QAAQ,QAI3BmJ,EAAiBvM,YAAOsE,IAAD,aAC3B9C,MAAO,OACPmF,UAAW,SACX/B,SAAUzB,IAAMkG,MAChB9E,UAAWpB,IAAMC,QAAQ,IACtBC,YAAMF,IAAMG,WAAWC,cAAe,CACvCqB,SAAUzB,IAAMoD,SAIdiG,EAAqBxM,IAAO+C,IAAP,eACtBM,YAAMC,aAAWC,cAAe,CACjCW,QAAS,WAIPuI,EAA4BzM,IAAO+C,IAAP,aAChCmB,QAAS,OACTgG,WAAY,SACZlH,QAAS,CAAE2C,GAAIxC,IAAMC,QAAQ,IAC7BQ,gBAAiBT,IAAMU,MACvB4B,UAAW,aACXuE,IAAK7G,IAAMC,QAAQ,GACnB0G,OAAQ,EACR4C,UAAW,kCACX1I,aAAc,QACXX,YAAMC,aAAWkB,cAAe,CACjChB,SAAU,UAXoB,GAa7BH,YAAMC,aAAWC,cAAe,CACjCP,QAAS,CAAE2C,GAAIxC,IAAMC,QAAQ,IAC7BuJ,aAAcxJ,IAAMC,QAAQ,GAC5BI,SAAU,YAIRoJ,EAAgB5M,IAAO+C,IAAP,aACpBmB,QAAS,OACT4F,OAAQ,GACLxE,YAAO,CAAC,wCAAF,aACPpB,QAAS,gBACNb,YAAMC,aAAWC,cAAe,CACjCW,QAAS,mBANO,GASjBoB,YAAO,CAAC,yDAA0D,CACnEmE,KAAM,UAVY,GAYjBnE,YAAO,CAAC,wDAAyD,CAClEgF,MAAO,SAbW,GAejBhF,YAAO,CAAC,uDAAF,aACPyE,OAAQ,OACRD,OAAQ,GACLzG,YAAMC,aAAWC,cAAe,CACjCwG,OAAQ,WAnBQ,GAsBjBzE,YAAO,CAAC,0DAAF,aACP0E,IAAK,OACLF,OAAQ,GACLzG,YAAMC,aAAWC,cAAe,CACjCyG,IAAK,cAKL6C,EAAgB7M,IAAO+C,IAAP,aACpB+J,YAAa3J,IAAMC,QAAQ,GAC3BU,WAAYX,IAAMC,QAAQ,GAC1Bc,QAAS,OACTsB,cAAe,SACfrB,eAAgB,gBAChB2F,OAAQ,IACLzG,YAAMC,aAAWC,cAAe,CACjCuJ,YAAa3J,IAAMC,QAAQ,OAIzB2J,EAAmB/M,IAAO+C,IAAI,CAClC4I,OAAQ,UACRzH,QAAS,OACTC,eAAgB,MAChBgH,YAAa,OACbjI,aAAc,SAGV8J,EAAkBhN,YAAOiN,IAAW,CACxCxL,OAAQ0B,IAAMC,QAAQ,KAGlB8J,EAAclN,IAAO+C,IAAI,CAC7B+J,YAAa3J,IAAMC,QAAQ,GAC3BF,aAAcC,IAAMC,QAAQ,KAGxB+J,EAAenN,IAAO2E,GAAP,aACnB0B,KAAM,CAAEC,KAAMnD,IAAMyD,MAAOJ,OAAQrD,IAAMsD,WAAWC,MACpD7B,MAAO1B,IAAM2B,MACbE,WAAY,SACZ9B,aAAcC,IAAMC,QAAQ,IACzBC,YAAMC,aAAWC,cAAe,CACjCL,aAAcC,IAAMC,QAAQ,OAI1BgK,EAAepN,IAAO8G,KAAK,CAC/BT,KAAM,CAAEC,KAAMnD,IAAMoD,KAAMC,OAAQrD,IAAMsD,WAAWC,MACnD7B,MAAO1B,IAAMkK,WACb/D,cAAe,cAGXgE,EAActN,IAAO+C,IAAP,aAClByG,SAAU,WACVrF,eAAgB,SAChBD,QAAS,OACT1C,MAAO,OACPC,OAAQ,OACRmC,gBAAiBT,IAAMqI,kBACvB1H,WAAY,OACZC,cAAe,OACf4H,OAAQ,WACLrG,YAAO,CAAC,wCAAyC,CAClD1B,gBAAiBT,IAAMkK,WACvB1B,OAAQ,YAIN4B,EAAevN,IAAOmG,IAAI,CAC9B1E,OAAQ,OACRD,MAAO,OACPgC,SAAU,OACVgK,UAAW,YAGPC,EAAoBzN,IAAOmG,IAAP,aACxB1E,OAAQ,OACRyE,UAAW,QACX1C,SAAU,QACVgK,UAAW,UACX1D,OAAQ,IACLzG,YAAMC,aAAWC,cAAe,CACjCC,SAAU,QACV0C,UAAW,YAIAwH,GAnoBf,YAAmE,IAAnCC,EAAkC,EAAlCA,QAASC,EAAyB,EAAzBA,YAAyB,EAe5D1G,cAf4D,IAE9DC,aAC2B0G,EAHmC,EAG5D,yBAC0BC,EAJkC,EAI5D,0BACmBC,EALyC,EAK5D,mBACqBC,EANuC,EAM5D,qBACgBC,EAP4C,EAO5D,gBACuBC,EARqC,EAQ5D,uBAC0BC,EATkC,EAS5D,0BAC2BC,EAViC,EAU5D,2BACwBC,EAXoC,EAW5D,wBAEF7G,GAb8D,EAa9DA,cACyC8G,GAdqB,EAc9D5G,kBAAqB6G,mBAdyC,GAiBhCzG,oBAAS,GAjBuB,qBAiBzD0G,GAjByD,MAiB/CC,GAjB+C,SAkBtB3G,mBAAiB,KAlBK,qBAkBzD4G,GAlByD,MAkB1CC,GAlB0C,SAmB9B7G,oBAAkB,GAnBY,qBAmBzDC,GAnByD,MAmB9C5F,GAnB8C,SAoB9B2F,oBAAS,GApBqB,qBAoBzD8G,GApByD,MAoB9CC,GApB8C,MAsB1DC,GAAUC,iBAA8B,MACxCC,GAAWD,iBAA8B,MAGzCE,IADYC,YAAS/L,IAAMG,WAAWC,eAC5BoK,EAAQA,SAAWA,EAAQA,QAAQsB,SAEnD7N,qBAAU,WACR,IAAM+N,EACJ9N,UACAA,SAAS+N,cAAT,wBAAwCzB,EAAQ0B,gBAE5CC,EACJjO,UACAA,SAAS+N,cAAT,mBAAgDzB,EAAQ0B,gBAE1DE,YAAaJ,EAAcG,EAAS,CAClCE,UAAW,SACXC,SAAU,QACVC,UAAW,CACT,CACExG,KAAM,SACNyG,QAAS,CACPC,OAAQ,CAAC,EAAG,WAKnB,CAACpB,KAEJ,IAAMqB,GAAc,SAACC,GAEH,IAAD,IADdtB,IAAYC,GAAYqB,GACpBtB,MACI,OAAPM,SAAO,IAAPA,IAAA,UAAAA,GAAS7N,eAAT,SAAkB8O,eAAe,CAC/BC,SAAU,SACVC,MAAO,UACPC,OAAQ,aAKdtP,YAAgBkO,IAAS,WACnBN,IACFC,IAAY,MAIhB,IAAM0B,GAAgB,SAACC,GACjBC,OAAOD,GAAS,EAClBzB,GAAiB,KAGnBA,GAAiByB,IAGbE,GAAc,SAACC,GACnBF,OAAOE,GAAQ,GAAK5B,GAAiB,MAGjC6B,GAAY,WACAC,YACd9C,EAAQA,QAAQ+C,KAChBL,OAAO3B,IACPlH,GACAmG,EAAQ0B,cACRlN,MAGA0M,IAAa,GACb8B,YAAW,WACT9B,IAAa,KACZ,OAID+B,GACJP,OAAO3B,IAAiB,EAAxB,oBAAyCA,IAAkB,GAEvDmC,GAAe,WACnBpC,IAAY,IAGd,OACE,kBAACjC,EAAD,KACE,kBAACc,EAAD,CACEwD,QAAS,kBAAMjB,IAAY,IAC3BhP,IAAKiO,GACLiC,iBAAgBvC,IAEfb,EAAQA,QAAQ3E,MACf,kBAACuE,EAAD,CACE1L,GAAI,gBAAkB8L,EAAQ0B,cAC9BpG,IAAK0E,EAAQA,QAAQ3E,OAAS2E,EAAQA,QAAQ3E,MAAMC,MAGtD,kBAACsE,EAAD,CACE1L,GAAI,gBAAkB8L,EAAQ0B,cAC9BpG,IAAG,OAAEqF,SAAF,IAAEA,QAAF,EAAEA,GAAuBrF,MAGhC,kBAACM,EAAD,KACGoE,EAAQqD,YADX,IACyBrD,EAAQsD,gBAEjC,kBAACrE,EAAD,CACEsE,iBAAgB1C,GAChB3M,GAAI,WAAa8L,EAAQ0B,cACzB8B,KAAK,WAEL,kBAAC1E,EAAD,CAA2B5L,IAAKmO,IAC7BrB,EAAQA,QAAQ3E,MACf,kBAACyE,EAAD,CACExE,IAAK0E,EAAQA,QAAQ3E,OAAS2E,EAAQA,QAAQ3E,MAAMC,MAGtD,kBAACwE,EAAD,CACExE,IAAG,OAAEqF,SAAF,IAAEA,QAAF,EAAEA,GAAuBrF,MAGhC,kBAAC4D,EAAD,KACE,kBAACE,EAAD,CAAkB+D,QAASD,IACzB,kBAAC7D,EAAD,OAEF,kBAACE,EAAD,KACE,kBAACC,EAAD,KACGQ,EAAQA,SAAWA,EAAQA,QAAQzE,MAEtC,kBAACe,EAAD,KACGgF,GACC,oCACE,kBAAChE,EAAD,CAAmBmG,eAAcnC,KACjC,kBAAC5D,EAAD,KAAkB6C,IAGpB,oCACE,kBAACjD,EAAD,MACA,kBAACI,EAAD,KAAkB8C,KAIxB,kBAACzE,EAAD,KACE,kBAACN,EAAD,KACGiF,EADH,QAEGV,EAAQqD,YAFX,IAEyBrD,EAAQsD,iBAGnC,kBAAC7D,EAAD,KACGW,EADH,IACmBC,EADnB,QAEGL,EAAQA,QAAQ0D,SAChBpD,IAGL,6BACGgB,IACC,kBAAC3D,EAAD,KACE,kBAACC,EAAD,KACE,kBAACE,EAAD,CACE6F,SAA4B,MAAlB5C,GACVoC,QAAS,kBACPnC,IACG0B,OAAO3B,IAAiB,GAAG6C,cAIhC,kBAACrF,EAAD,OAEF,kBAACN,EAAD,CACE4F,KAAM,SACNC,IAAK,IACLC,IAAK,KACLtB,MAAO1B,GACPiD,SAAU,SAAA3Q,GAAC,OAAImP,GAAcnP,EAAEG,OAAOiP,QACtCwB,OAAQ,SAAA5Q,GAAC,OAAIsP,GAAYtP,EAAEG,OAAOiP,UAEpC,4BACEU,QAAS,kBACPnC,IACG0B,OAAO3B,IAAiB,GAAG6C,cAIhC,kBAACvF,EAAD,QAGJ,kBAACI,EAAD,CAAiB0E,QAAS,kBAAMN,OAC9B,kBAAC9F,EAAD,CAAYmH,iBAAgB9J,IAAa6G,IACtCf,GAEF9F,IACC,kBAACoC,EAAD,CAAqBpC,UAAWA,KAEjC6G,KAAc7G,IACb,kBAAC0C,EAAD,KACG2D,EACD,kBAAC7D,EAAD,SAMV,6BACE,kBAACgC,EAAD,CACExD,KAAI,UAAK4E,EAAQA,QAAQzL,IAArB,wBAAwC0L,EAAxC,sBAAiED,EAAQ0B,eAAzE,OAAyFuB,IAC7FzH,QAAM,GAEL2E,OAMX,kBAACnE,EAAD,CAAa9H,GAAG,QAAQiQ,qBAAA,KAG1B,kBAAClF,EAAD,CACEkE,QAAS,kBAAMjB,IAAY,IAC3BhO,GAAI,WAAa8L,EAAQ0B,cACzB8B,KAAK,WAEL,kBAAC1E,EAAD,CAA2B5L,IAAKmO,IAC9B,kBAACvB,EAAD,CACExE,IAAK0E,EAAQA,QAAQ3E,OAAS2E,EAAQA,QAAQ3E,MAAMC,MAEtD,kBAAC4D,EAAD,KACE,kBAACE,EAAD,CAAkB+D,QAASD,IACzB,kBAAC7D,EAAD,OAEF,kBAACE,EAAD,KACE,kBAACC,EAAD,KACGQ,EAAQA,SAAWA,EAAQA,QAAQzE,MAEtC,kBAACe,EAAD,KACGgF,GACC,oCACE,kBAAChE,EAAD,CAAmBmG,eAAcnC,KACjC,kBAAC5D,EAAD,KAAkB6C,IAGpB,oCACE,kBAACjD,EAAD,MACA,kBAACI,EAAD,KAAkB8C,KAIxB,kBAACf,EAAD,KACGW,EADH,IACmBC,EADnB,QAEGL,EAAQA,QAAQ0D,SAChBpD,IAIL,6BACGgB,IACC,kBAAC3D,EAAD,KACE,kBAACC,EAAD,KACE,kBAACE,EAAD,CACE6F,SAA4B,MAAlB5C,GACVoC,QAAS,kBACPnC,IACG0B,OAAO3B,IAAiB,GAAG6C,cAIhC,kBAACrF,EAAD,OAEF,kBAACN,EAAD,CACE4F,KAAM,SACNC,IAAK,IACLC,IAAK,KACLtB,MAAO1B,GACPiD,SAAU,SAAA3Q,GAAC,OAAImP,GAAcnP,EAAEG,OAAOiP,QACtCwB,OAAQ,SAAA5Q,GAAC,OAAIsP,GAAYtP,EAAEG,OAAOiP,UAEpC,4BACEU,QAAS,kBACPnC,IACG0B,OAAO3B,IAAiB,GAAG6C,cAIhC,kBAACvF,EAAD,QAGJ,kBAACI,EAAD,CAAiB0E,QAAS,kBAAMN,OAC9B,kBAAC9F,EAAD,CAAYmH,iBAAgB9J,IAAa6G,IACtCf,GAEF9F,IACC,kBAACoC,EAAD,CAAqBpC,UAAWA,KAEjC6G,KAAc7G,IACb,kBAAC0C,EAAD,KACG2D,EACD,kBAAC7D,EAAD,SAMV,6BACE,kBAACgC,EAAD,CACExD,KAAI,UAAK4E,EAAQA,QAAQzL,IAArB,wBAAwC0L,EAAxC,sBAAiED,EAAQ0B,eAAzE,OAAyFuB,IAC7FzH,QAAM,GAEL2E,OAMX,kBAACnE,EAAD,CAAa9H,GAAG,QAAQiQ,qBAAA,QC/TlC,IAAMC,GAAO/R,IAAO+C,IAAP,aACXmB,QAAS,OACTiB,cAAehC,IAAMC,QAAQ,IAC1BC,YAAMC,aAAW+B,eAAgB,CAClC7D,MAAO,UAJE,GAMR6B,YAAMC,aAAWkB,cAAZ,eACHc,YAAO,CAAC,wCAAyC,CAClD9D,MAAO,YARA,GAWR6B,YAAMC,aAAWC,cAAe,CACjC/B,MAAO,WAIIwQ,GAnCf,YAA8E,IAAlDC,EAAiD,EAAjDA,IAAKC,EAA4C,EAA5CA,OAAQC,EAAoC,EAApCA,UAAWvE,EAAyB,EAAzBA,YAC5CwE,EAA+B,CACnClN,oBAAoB,UAAD,OAAY+M,EAAI5J,OAAhB,qBACnBnF,aAAegP,EAAkB,EAAT,QAG1B,OACE,kBAACH,GAAD,CAAM1R,IAAK+R,EAAWC,iBAAgBF,GACnCF,EAAIvJ,KAAI,SAACiF,GAAD,OACP,kBAAC,GAAD,CACE9E,IAAK8E,EAAQ0B,cACb1B,QAASA,EACTC,YAAaA,S,4BCXvB,IAAM0E,GAAetS,IAAO+C,IAAP,aACnByG,SAAU,WACVtF,QAAS,OACTlB,QAAS,CACP2C,GAAIxC,IAAMkH,OAEZtG,cAAe,EACfwO,OAAQpP,IAAMqP,QAAQC,mBACtB/O,OAAQ,CAAET,EAAE,IAAD,OAAME,IAAMkH,SACpBhH,YAAMF,IAAMG,WAAWC,cAAe,CACvCG,OAAQ,CAAET,EAAGE,IAAMuP,UAIjBC,GAAY3S,IAAOmG,IAAP,aAChB3E,MAAO,OACP0E,UAAW/C,IAAMyP,sBACjBpF,UAAW,WACRnK,YAAMF,IAAMG,WAAW+B,eAAgB,CACxCa,UAAW/C,IAAMyP,0BAINC,GA/Bf,YAA2D,IAAzB7J,EAAwB,EAAxBA,MAChC,OACE,kBAACsJ,GAAD,KACE,kBAACK,GAAD,CAAW1J,IAAG,OAAED,QAAF,IAAEA,OAAF,EAAEA,EAAOC,IAAK6J,IAAG,OAAE9J,QAAF,IAAEA,OAAF,EAAEA,EAAO8J,QCwL9B9S,IAAO8G,KAAK,CAC1BjC,MAAO1B,IAAM4D,UACbV,KAAM,CAAEC,KAAMnD,IAAMkG,MAAO7C,OAAQrD,IAAMsD,WAAWC,MACpD4C,cAAe,cAGJtJ,IAAO+C,IAAI,IANxB,IAQMgQ,GAAuB/S,IAAO+C,IAAP,aAC3BvB,MAAO,QACJ6B,YAAMF,IAAMG,WAAWC,cAAe,CACvCC,SAAU,YAIR2G,GAAsBnK,YAAOoK,IAAe,CAChDvF,MAAO1B,IAAMU,MACbpC,OAAQ0B,IAAMkH,MACd3G,OAAQ,CAAEiC,GAAI,QACd6D,SAAU,WACVQ,IAAK,EACLP,KAAM,EACNa,MAAO,EACPP,OAAQ,IAGJW,GAAa1K,IAAO8G,KAAP,aACjB6D,WAAY,CACVC,SAAU,MACVC,SAAU,OACVC,eAAgB,WAEfxF,YAAO,CAAC,wCAAyC,CAClDyF,WAAY,SACZC,QAAS,MAIPtG,GAAU1E,IAAOgT,GAAP,aACdhQ,QAAS,CACPgH,IAAK7G,IAAMC,QAAQ,IAErBiD,KAAM,CACJC,KAAMnD,IAAM8P,IACZzM,OAAQrD,IAAMsD,WAAWC,MAE3B1B,WAAY7B,IAAM6B,WAAWkO,MAC7BC,cAAehQ,IAAMgQ,cAAcC,MACnCvO,MAAO1B,IAAM2B,OACVzB,YAAMF,IAAMG,WAAWC,cAAe,CACvC8C,KAAM,CACJC,KAAM,QAERtD,QAAS,CACPgH,IAAK,YAKLqJ,GAAQrT,IAAO+C,IAAI,CACvBmB,QAAS,QACT1C,MAAO,OACP8R,eAAgB,aAGZC,GAAUvT,IAAO+C,IAAI,CACzByQ,eAAgBrQ,IAAMsQ,SACtBC,eAAgB,QAChBC,eAAgB,MAChBjQ,OAAQ,CAAEkQ,EAAGzQ,IAAMC,QAAQ,IAC3BU,WAAYX,IAAMC,QAAQ,KAGtByQ,GAAQ7T,IAAO+C,IAAP,aACZmB,QAAS,OACTC,eAAgB,gBAChB+F,WAAY,SACZlF,WAAY,SACZhC,QAAS,CAAEC,EAAGE,IAAMC,QAAQ,GAAIwQ,EAAG,SAChCtO,YAAO,CAAC,8CAA+C,CACxD1B,gBAAiBT,IAAMU,UAIrBiQ,GAAwB9T,IAAO8G,KAAK,CACxClC,SAAUzB,IAAMkH,MAChBxF,MAAO1B,IAAM4D,YAGTgN,GAAiB/T,IAAO8G,KAAK,CACjClC,SAAUzB,IAAMkH,MAChBxF,MAAO1B,IAAM2B,MACbE,WAAY,WAURgP,IAPmBhU,IAAO8G,KAAK,CACnClC,SAAUzB,IAAMkH,MAChBxF,MAAO1B,IAAM8Q,UACbtI,OAAQ,UACRuI,eAAgB,cAGDlU,IAAO+C,IAAI,CAC1BmB,QAAS,YACTiQ,kBAAmBhR,IAAMsQ,SACzBW,kBAAmB,QACnBC,kBAAmB,MACnBrR,QAAS,CAAE4Q,EAAGzQ,IAAMC,QAAQ,OAGxBkR,GAAYtU,IAAO+C,IAAP,aAChBmB,QAAS,aACTyC,UAAW,OACX/B,SAAUzB,IAAMoR,MAChBvR,QAAS,CAAE4Q,EAAGzQ,IAAMC,QAAQ,GAAIH,EAAGE,IAAMC,QAAQ,IACjDqC,UAAW,aACRpC,YAAMC,aAAWkR,kBAAmB,CACrC5P,SAAUzB,IAAMoD,KAChBvD,QAAS,CAAE4Q,EAAGzQ,IAAMC,QAAQ,GAAIH,EAAGE,IAAMC,QAAQ,QAI/C6G,GAAcjK,IAAO+C,IAAP,aAClBmB,QAAS,OACTgG,WAAY,SACZxG,OAAQ,CAAEqG,OAAQ5G,IAAMC,QAAQ,GAAI4G,IAAK7G,IAAMC,QAAQ,KACpDC,YAAMC,aAAWC,cAAe,CACjCL,aAAcC,IAAMC,QAAQ,OAI1BmH,GAAkBvK,YAAOwK,IAAW,CACxC/I,OAAQ,OACRD,MAAO,OACPuD,WAAY,QAGR0F,GAAgBzK,IAAO+C,IAAI,CAC/BmB,QAAS,OACTgG,WAAY,SACZ/F,eAAgB,SAChBU,MAAO1B,IAAMU,MACbpC,OAAQ0B,IAAMkH,MACd3G,OAAQ,CAAEiC,GAAI,QACd6D,SAAU,WACVQ,IAAK,EACLP,KAAM,EACNa,MAAO,EACPP,OAAQ,IAGJkB,GAAoBjL,IAAO+C,IAAP,aACxBiB,aAAc,MACdxC,MAAO,MACPC,OAAQ,MACRmC,gBAAiBT,IAAM+H,cACvBC,YAAahI,IAAMC,QAAQ,IACxBkC,YAAO,CAAC,sCAAuC,CAChD1B,gBAAiBT,IAAMiI,iBAIrBC,GAAkBrL,IAAO8G,KAAK,CAClCjC,MAAO1B,IAAM2B,MACbuB,KAAM,CAAEC,KAAMnD,IAAMkG,MAAO7C,OAAQrD,IAAMsD,WAAWC,MACpD4C,cAAe,cAGXmL,GAAiBzU,IAAO+C,IAAI,CAChCmB,QAAS,OACTC,eAAgB,gBAChBT,OAAQ,CACNsG,IAAK7G,IAAMuR,MACX3K,OAAQ5G,IAAM8P,OAIZ0B,GAAqB3U,IAAO+C,IAAI,CACpCmB,QAAS,OACTgG,WAAY,WAGR0K,GAAQ5U,IAAO8G,KAAK,CACxBT,KAAM,CACJC,KAAMnD,IAAM0R,UACZrO,OAAQrD,IAAMsD,WAAWC,MAE3BnC,UAAWpB,IAAMC,QAAQ,GACzB4B,WAAY7B,IAAM6B,WAAWkO,MAC7BC,cAAehQ,IAAMgQ,cAAcC,MACnCvO,MAAO1B,IAAM2B,QAGTwG,GAAYtL,IAAO+C,IAAI,CAC3BmB,QAAS,OACTgG,WAAY,SACZ/F,eAAgB,kBAGZoH,GAAmBvL,IAAO+C,IAAP,aACvBa,gBAAiBT,IAAMU,MACvBG,aAAc,QACdE,QAAS,OACTC,eAAgB,gBAChB3C,MAAO,MACP0I,WAAY,SACZlH,QAAS,CAAEC,EAAGE,IAAMC,QAAQ,GAAIwQ,EAAG,SAChCvQ,YAAMC,aAAWC,cAAe,CACjCP,QAAS,CAAE4Q,EAAG,YAIZnI,GAAczL,IAAO0L,OAAO,CAChC,YAAa,CACXC,OAAQ,UACRX,QAAS,MAIPY,GAAgB5L,IAAO6L,MAAP,aACpBrK,MAAO2B,IAAMC,QAAQ,GACrBQ,gBAAiBT,IAAMU,MACvB8C,UAAW,SACXmF,cAAe,aACZxG,YAAO,CAAC,8BAA+B,+BAAgC,CACxEyG,iBAAkB,OAClBrI,OAAQ,CAAEiC,GAAI,OAIZqG,GAAiBhM,YAAOiM,IAAgB,CAC5CxK,OAAQ,OACRD,MAAO,OACPlB,KAAM6C,IAAM2B,QAGRoH,GAAkBlM,YAAOmM,IAAiB,CAC9C1K,OAAQ,OACRD,MAAO,OACPlB,KAAM6C,IAAM2B,QAGRsH,GAAkBpM,YAAOsE,IAAD,aAC5BkF,SAAU,WACVhI,MAAO,MACPoD,SAAUzB,IAAM2R,UAChBnO,UAAW,SACX3B,WAAY,QACZhC,QAAS,CAAEC,EAAGE,IAAMC,QAAQ,GAAIwQ,EAAG,QACnC7O,WAAY5B,IAAMC,QAAQ,IACvBC,YAAMF,IAAMG,WAAWC,cAAe,CACvCP,QAAS,CAAE4Q,EAAGzQ,IAAMC,QAAQ,QAgD1ByD,IA5CiB7G,IAAO8G,KAAK,CACjCjC,MAAO1B,IAAM4R,IACbpO,UAAW,SACX/B,SAAUzB,IAAMoD,KAChBvB,WAAY7B,IAAM6B,WAAWgQ,MAC7B7B,cAAehQ,IAAMgQ,cAAc8B,OAI5B9R,IAAMkH,MACLlH,IAAM+R,QACG/R,IAAMgS,OAGCnV,IAAOoV,EAAE,CACjC3T,OAAQ,GACRiC,OAAQ,CACNqG,OAAQ5G,IAAMoR,OAEhBlO,KAAM,CACJC,KAAMnD,IAAMkH,MACZ7D,OAAQrD,IAAMsD,WAAW4O,QAE3BrQ,WAAY7B,IAAM6B,WAAWkO,MAC7BC,cAAehQ,IAAMgQ,cAAc8B,KACnCpQ,MAAO1B,IAAM4D,YAGQ/G,IAAO8G,KAAK,CACjCrF,OAAQ,GACR4E,KAAM,CACJC,KAAMnD,IAAMkH,MACZ7D,OAAQrD,IAAMsD,WAAW6O,SAE3BtQ,WAAY7B,IAAM6B,WAAWkO,MAC7BC,cAAehQ,IAAMgQ,cAAc8B,KACnCpQ,MAAO1B,IAAM4D,YAGgB/G,IAAO+C,IAAI,CACxCwS,WAAY,WACZ5O,UAAW,WAGkB3G,IAAO8G,KAAK,CACzCT,KAAM,CAAEC,KAAMnD,IAAMoD,MACpBI,UAAW,SACX9B,MAAO1B,IAAM4D,UACbxC,UAAWpB,IAAMC,QAAQ,MAGrBoS,GAAcxV,IAAOoV,EAAE,CAC3BvQ,MAAO1B,IAAM4D,UACbrD,OAAQ,CAAEkQ,EAAGzQ,IAAMoR,OACnBvP,WAAY7B,IAAM6B,WAAWyQ,QAC7BtC,cAAehQ,IAAMgQ,cAAc8B,KACnC5O,KAAM,CACJC,KAAMnD,IAAM2R,UACZtO,OAAQrD,IAAMsD,WAAW4O,UAIdxI,GAxef,YAMmB,IAAD,IALhB6I,UAAaC,EAKG,EALHA,WAAYjF,EAKT,EALSA,KACzBrB,EAIgB,EAJhBA,cACAuG,EAGgB,EAHhBA,uBACAC,EAEgB,EAFhBA,qBACAC,EACgB,EADhBA,iBACgB,EAC0BhO,mBACxC8N,GAFc,mBACTlH,EADS,KACMC,EADN,OAIkB7G,oBAAkB,GAJpC,mBAITC,EAJS,KAIE5F,EAJF,OAKkB2F,oBAAS,GAL3B,mBAKT8G,EALS,KAKEC,EALF,OAoBZ3H,cApBY,IAQdC,aAC2B0G,EATb,EASZ,yBACuBK,EAVX,EAUZ,uBAC0BC,EAXd,EAWZ,0BAC2BC,EAZf,EAYZ,2BACuB2H,EAbX,EAaZ,uBACwBhI,EAdZ,EAcZ,wBAC8BiI,EAflB,EAeZ,8BACkBC,EAhBN,EAgBZ,kBAGFzO,GAnBc,EAiBZ,wBAjBY,EAmBdA,eAGM0O,EAAwBlO,cAAxBkO,oBACFvN,EAAYuN,GAAuBA,EAAoB,GACvDjH,EAAUtG,EAAUsG,QACpBkH,EAAWjH,YAAS/L,IAAMG,WAAW8S,gBA8B3C,OACE,kBAACrD,GAAD,KACE,kBAACrO,GAAD,KAAUiE,EAAUO,MACpB,kBAACrC,GAAD,KAAyB8B,EAAUG,eACnC,kBAAC0M,GAAD,KAAcM,GACd,kBAAC,GAAD,KACG7G,EACC,oCACE,kBAAC,GAAD,CAAmBmC,eAAcnC,IACjC,kBAAC,GAAD,KAAkBf,IAGpB,oCACE,kBAAC,GAAD,MACA,kBAAC,GAAD,KAAkBC,KAKtBgI,EAAD,OAoBCN,QApBD,IAoBCA,OApBD,EAoBCA,EAAsBnN,KAAI,SAAA2N,GAAW,OACnC,kBAAC9C,GAAD,KACE,kBAAC,GAAD,CAAO+C,uBAAqB,QAC1B,kBAACxC,GAAD,KACGkC,GAEH,kBAACjC,GAAD,KAAiBsC,EAAYE,iBAE/B,kBAAC,GAAD,KACE,kBAACzC,GAAD,KAAwB/F,GACxB,kBAACgG,GAAD,KAAiBsC,EAAYhF,WAE/B,kBAAC,GAAD,CAAOiF,uBAAqB,QAC1B,kBAACxC,GAAD,KAAwBiC,GACxB,kBAAChC,GAAD,KAAiBsC,EAAYvN,gBAE/B,kBAAC,GAAD,KACE,kBAACgL,GAAD,KAAwBmC,GACxB,kBAAClC,GAAD,KAAiBsC,EAAYG,uBArCnC,kBAACnD,GAAD,KACE,kBAACW,GAAD,KACE,kBAACM,GAAD,KAAY0B,GACZ,kBAAC1B,GAAD,KAAYvG,GACZ,kBAACuG,GAAD,KAAYyB,GACZ,kBAACzB,GAAD,KAAY2B,IALhB,OAOGJ,QAPH,IAOGA,OAPH,EAOGA,EAAsBnN,KAAI,SAAA2N,GAAW,OACpC,kBAACrC,GAAD,CAAUnL,IAAKwN,EAAYvN,eACzB,oCACE,kBAACwL,GAAD,KAAY+B,EAAYE,gBACxB,kBAACjC,GAAD,KAAY+B,EAAYhF,UACxB,kBAACiD,GAAD,KAAY+B,EAAYI,SACxB,kBAACnC,GAAD,KAAY+B,EAAYG,wBA6BjCvH,GACC,oCACE,kBAACwF,GAAD,KACE,kBAACE,GAAD,KACE,kBAACC,GAAD,KAAQe,KAGZ,6BACE,kBAAC,GAAD,KACE,kBAAC,GAAD,KACE,kBAAC,GAAD,CACErE,SAA4B,IAAlB5C,EACVoC,QAAS,kBAAMnC,EAAiBD,EAAgB,KAEhD,kBAAC,GAAD,OAEF,kBAAC,GAAD,CACE8C,KAAM,SACNC,IAAK,IACLC,IAAK,KACLtB,MAAO1B,EACPiD,SAAU,SAAA3Q,GAAC,OA/GJoP,EA+GsBpP,EAAEG,OAAOiP,WA9GhDC,OAAOD,GAAS,EAClBzB,EAAiB,GAGnBA,EAAiB0B,OAAOD,KALJ,IAACA,GAgHPwB,OAAQ,SAAA5Q,GAAC,OAxGJuP,EAwGoBvP,EAAEG,OAAOiP,WAvGhDC,OAAOE,GAAQ,GAAK5B,EAAiB,IADnB,IAAC4B,KA0GP,4BAAQO,QAAS,kBAAMnC,EAAiBD,EAAgB,KACtD,kBAAC,GAAD,QAGJ,kBAAC,GAAD,CAAiBoC,QAAS,WAzGpBL,YACdC,EACAhC,EACAlH,EACA6H,GAAgC,GAChClN,KAGA0M,GAAa,GACb8B,YAAW,WACT9B,GAAa,KACZ,QA+FO,kBAAC,GAAD,CAAYgD,iBAAgB9J,GAAa6G,GACtCf,GAEF9F,GAAa,kBAAC,GAAD,CAAqBA,UAAWA,IAC7C6G,IAAc7G,GACb,kBAAC,GAAD,KACGqG,EACD,kBAAC,GAAD,aC7HpB,IAAMsI,GAAkB1W,IAAO+C,IAAI,CACjCyG,SAAU,WACVQ,IAAK7G,IAAMwT,oBACXlN,KAAM,EACNa,MAAO,EACP5G,OAAQ,CAAET,EAAG,QACbO,SAAUL,IAAMM,eAChBjC,MAAO,OACPsC,WAAY,OACZoG,WAAY,SACZhG,QAAS,OACT4I,YAAa,OACb9H,WAAY,KACZmO,cAAe,MAGXyD,GAAgB5W,YAAO6W,KAAsB,CACjDvW,KAAM6C,IAAM8Q,UACZ9I,YAAahI,IAAMC,QAAQ,KAGvB0T,GAAW9W,YAAO4I,KAAS,CAC/BhE,SAAUzB,IAAMkH,MAChBxF,MAAO1B,IAAM8Q,UACbtI,OAAQ,UACRuI,eAAgB,cAGZ6C,GAAU/W,IAAOgX,QAAP,aACdpT,gBAAiBT,IAAMqI,kBACvBhI,SAAU,OACVgG,SAAU,WACV9F,OAAQ,CAAEsG,IAAK7G,IAAMC,QAAQ,IAAK2G,OAAQ5G,IAAMC,QAAQ,KACxDJ,QAAS,CAAEC,EAAGE,IAAMoR,QACjBlR,YAAMF,IAAMG,WAAW2T,cAAe,CACvCjU,QAAS,CAAEC,EAAGE,IAAM+T,SAPR,GASX7T,YAAMF,IAAMG,WAAWC,cAAe,CACvCG,OAAQ,CAAEsG,IAAK7G,IAAMC,QAAQ,IAAK2G,OAAQ5G,IAAMC,QAAQ,SAItD+T,GAAMnX,IAAO+C,IAAP,aACVvB,MAAO,QACJ6B,YAAMF,IAAMG,WAAW8T,aAAc,CACtClT,QAAS,OACTgB,oBAAqB,YAJb,GAMP7B,YAAMF,IAAMG,WAAWC,cAAe,CACvCW,QAAS,OACTgB,oBAAqB,UACrBmS,QAASlU,IAAMmU,YAIb/J,GAAevN,IAAO+C,IAAP,aACnBS,SAAU,QACPH,YAAMF,IAAMG,WAAW+B,eAAgB,CACxCkS,WAAY,CACVC,MAAO,EACPC,IAAK,KALU,GAQhBpU,YAAMF,IAAMG,WAAWC,cAAe,CACvCgU,WAAY,CACVC,MAAO,EACPC,IAAK,OAWIC,IANW1X,IAAOmG,IAAI,CACnC1E,OAAQ,OACRD,MAAO,OACPgM,UAAW,YAzHb,WAAiC,IAAD,EAI1BtG,cAF6CyQ,EAFnB,EAE5BxQ,aAAgB,+BAC2BM,EAHf,EAG5BC,kBAAqBC,qBAHO,EAY1BK,cALF0I,EAP4B,EAO5BA,KACAkH,EAR4B,EAQ5BA,aACA1B,EAT4B,EAS5BA,oBACAL,EAV4B,EAU5BA,qBACAC,EAX4B,EAW5BA,iBAGInN,EAAYuN,GAAuBA,EAAoB,GAE7D,OACE,6BACE,kBAACQ,GAAD,KACE,kBAACE,GAAD,MACA,kBAACE,GAAD,CAAU/N,KAAM6O,GAAeD,IAEjC,kBAACZ,GAAD,KACE,kBAACI,GAAD,KACGxO,EAAUK,MACT,kBAAC,GAAD,KACE,kBAAC,GAAD,CAAwBH,IAAK6H,EAAM1H,MAAOL,EAAUK,SAGtD,kBAAC,GAAD,KACE,kBAAC,GAAD,CAAwBA,MAAOvB,KAGnC,kBAAC,GAAD,CACEoB,IAAK6H,EACLrB,cAAe,GACfuG,uBAAwB,EACxBF,UAAW/M,EACXkN,qBAAsBA,EACtBC,iBAAkBA,SC2C9B,IAAMY,GAAkB1W,IAAO+C,IAAP,aACtByG,SAAU,WACVQ,IAAK7G,IAAMwT,oBACXlN,KAAM,EACNa,MAAO,EACP5G,OAAQ,CAAET,EAAG,QACbO,SAAUL,IAAMM,eAChBjC,MAAO,OACPsC,WAAY,OACZoG,WAAY,SACZhG,QAAS,OACT4I,YAAa,OACb9H,WAAY,KACZmO,cAAe,KACZ9P,YAAMF,IAAMG,WAAWkB,cAAe,CACvCV,WAAY,QAfQ,GAiBnBT,YAAMF,IAAMG,WAAW8S,eAAgB,CACxCtJ,YAAa,WAIX8J,GAAgB5W,YAAO6W,KAAsB,CACjDvW,KAAM6C,IAAM8Q,UACZ9I,YAAahI,IAAMC,QAAQ,KAGvB0T,GAAW9W,YAAO4I,KAAS,CAC/BhE,SAAUzB,IAAMkH,MAChBxF,MAAO1B,IAAM8Q,UACbtI,OAAQ,UACRuI,eAAgB,cAGZ2D,GAAc7X,IAAO+C,IAAP,aAClBa,gBAAiBT,IAAMqI,kBACvB1H,WAAYX,IAAMC,QAAQ,IAC1BW,cAAeZ,IAAMC,QAAQ,KAC1BC,YAAMF,IAAMG,WAAWC,cAAe,CACvCO,WAAYX,IAAMC,QAAQ,IAC1BW,cAAeZ,IAAMC,QAAQ,QAI3B0U,GAAa9X,IAAO+C,IAAP,aACjBS,SAAUL,IAAM4U,oBAChB/U,QAAS,CAAEC,EAAG,SACdS,OAAQ,CAAET,EAAG,QACbC,aAAcC,IAAMC,QAAQ,KACzBC,YAAMF,IAAMG,WAAWC,cAAe,CACvCL,aAAcC,IAAMC,QAAQ,QAI1B4U,GAAYhY,IAAOiY,GAAP,aAChBrT,SAAU,OACVI,WAAY,SACZH,MAAO1B,IAAM2B,MACb5B,aAAcC,IAAMC,QAAQ,IACzBC,YAAMF,IAAMG,WAAWC,cAAe,CACvCqB,SAAUzB,IAAM+U,KAChBlT,WAAY,SACZ9B,aAAcC,IAAMC,QAAQ,OAI1B+U,GAAWnY,IAAOoV,EAAE,CAAExQ,SAAUzB,IAAMkH,MAAOrF,WAAY,WAEzDN,GAAU1E,IAAOgT,GAAP,aACdxP,SAAUL,IAAMiV,cAChB/R,KAAM,CAAEC,KAAMnD,IAAM8P,IAAKzM,OAAQrD,IAAMsD,WAAWC,MAClD7B,MAAO1B,IAAM2B,MACbE,WAAY,SACZ9B,aAAcC,IAAMC,QAAQ,IACzBC,YAAMF,IAAMG,WAAWC,cAAe,CACvC8C,KAAM,CAAEC,KAAM,QACd/B,UAAWpB,IAAMC,QAAQ,GACzBF,aAAcC,IAAMC,QAAQ,GAC5B4B,WAAY,WAIVqT,GAAgBrY,IAAO+C,IAAP,aACpBuV,cAAe,OACf5U,OAAQ,CAAET,EAAG,SACbC,aAAc,OACdM,SAAU,QACPH,YAAMC,aAAW+B,eAAgB,CAClC3B,OAAQ,CAAET,EAAG,UANK,GAQjBI,YAAMC,aAAW8S,eAAZ,eACH9Q,YAAO,CAAC,wCAAF,aACPiT,UAAW,SACXxU,cAAeZ,IAAMC,QAAQ,IAC1BkC,YAAO,sBAAuB,CAC/B7D,OAAQ,OACRuC,aAAc,QACdJ,gBAAiBT,IAAMU,MACvB6B,OAAQ,CACNC,GAAI,CACFC,MAAO,QACPpE,MAAO2B,IAAM0C,KACbhB,MAAO1B,IAAM2C,kBAXZ,GAeJR,YAAO,4BAA6B,CACrC9D,MAAO,OACPwC,aAAc,QACdJ,gBAAiBT,IAAM8C,kBA3BT,GA+BjB5C,YAAMC,aAAWC,cAAe,CACjCC,SAAU,QACVE,OAAQ,CAAET,EAAG,QACbsV,UAAW,YAITzV,GAAU9C,IAAO+C,IAAP,aACdC,QAAS,CAAE2C,GAAI,QACfjC,OAAQ,CAAET,EAAG,QACbW,gBAAiBT,IAAMU,OACpByB,YAAO,CAAC,wCAAyC,CAClD9D,MAAO,gBALK,GAOX6B,YAAMC,aAAW+B,eAAgB,CAClC7D,MAAO,gBARK,GAUX6B,YAAMC,aAAWC,cAAe,CACjCgV,UAAW,QACX/W,MAAO,WAIIgX,UAvNf,WAA0B,IAAD,EAOnBxQ,cALFyQ,EAFqB,EAErBA,UACAC,EAHqB,EAGrBA,qBACAxC,EAJqB,EAIrBA,oBACAyC,EALqB,EAKrBA,cACAC,EANqB,EAMrBA,WANqB,EAiBnB1R,cAjBmB,IAUrBC,aACsC0R,EAXjB,EAWnB,oCACmCC,EAZhB,EAYnB,mCACqCC,EAblB,EAanB,qCAC6CC,EAd1B,EAcnB,6CAdmB,IAgBrBzR,YAAeD,EAhBM,EAgBNA,iBAAkB2R,EAhBZ,EAgBYA,yBAG7BC,EAAYhK,YAAS/L,IAAMG,WAAWC,eACtCqK,EAAcsI,EAAoB,GAAGpN,cAgBrCqJ,EAd0B,WAC9B,IAAIA,GAAY,EAUhB,OATAuG,EAAqBS,SAAQ,SAACC,EAASC,GACrC,GAAID,EAAQ/Q,QAAU,EAAG,OAAO,EAChC+Q,EAAQ1Q,KAAI,SAAAiF,GACV,GAAIA,EAAQsD,eAAiB,EAE3B,OADAkB,GAAY,QAKXA,EAGSmH,KAA8BJ,EAEhD,OACE,0BAAMrX,GAAG,QACL8W,EAiCA,kBAAC,GAAD,MAhCA,oCACE,kBAAC,GAAD,KACE,kBAAC,GAAD,MACA,kBAAC,GAAD,CACE5P,KAAM6P,EAAaK,EAA2B3R,GAE7CsR,EAAaI,EAA6BD,IAG/C,kBAAClB,GAAD,KACE,kBAACC,GAAD,KACE,kBAAC,GAAD,KAAUW,GACV,kBAACT,GAAD,KAAYa,GACZ,kBAACV,GAAD,KAAWW,IAEb,kBAACT,GAAD,CAAehG,iBAAgBF,GAC7B,kBAACrP,GAAD,CAASuP,iBAAgBF,GACtBuG,EAAqBhQ,KAAI,SAAC6Q,EAAgBF,GAAjB,OACxB,kBAAC,GAAD,CACExQ,IAAKwQ,EACLpH,IAAKsH,EACLrH,OAAQmH,IAAUX,EAAqBrQ,OAAS,EAChD8J,UAAWA,EACXvE,YAAaA,SAKrB,kBAAC5G,GAAA,EAAD,W,gCCpFZ,2BAqBehH,iBAjBf,YAAyD,IAAzBC,EAAwB,EAAxBA,QAC9B,OACE,kBAAC,IAAOC,IAAR,CACEsB,MAAM,KACNC,OAAO,KACPpB,IAAKJ,IACLE,MAAM,6BACNC,QAAQ,aAER,0BACEG,EAAE,oQACFsJ,UAAU,iD,yECyBHrB,IA/Bf,YAAgD,IAAhC3D,EAA+B,EAA/BA,MAAOG,EAAwB,EAAxBA,WACrB,OACE,oCACE,kBAACwU,EAAD,CACEnZ,IAAK,CACHwE,MAAOA,GAAgB1B,IAAMsW,QAC7BzU,WAAYA,GAA0B,SAH1C,KAQA,kBAACwU,EAAD,CACEnZ,IAAK,CACHwE,MAAOA,GAAgB1B,IAAMsW,QAC7BzU,WAAYA,GAA0B,SAH1C,KAQA,kBAACwU,EAAD,CACEnZ,IAAK,CACHwE,MAAOA,GAAgB1B,IAAMsW,QAC7BzU,WAAYA,GAA0B,SAH1C,OAgBN,IAAMwU,EAAMxZ,IAAO+C,IAAP,aACVmB,QAAS,eACTmC,KAAM,CAAEC,KAAMnD,IAAMmU,SACpBoC,cAAe,CACb,KAAM,CACJ1O,QAAS,MAEX,MAAO,CACLA,QAAS,KAEX,OAAQ,CACNA,QAAS,OAGb2O,kBAAmBxW,IAAMyW,QAAQC,YACjCC,wBAAyB,WACzBC,kBAAmB,QAChBzU,YAAO,gBAAiB,CACzB0U,eAAgB7W,IAAMyW,QAAQK,WAlBtB,GAoBP3U,YAAO,gBAAiB,CACzB0U,eAAgB7W,IAAMyW,QAAQM","file":"Dist/build-client/static/js/PlanogramPage-PlanogramPage.23def662.chunk.js","sourcesContent":["import React from 'react';\r\nimport { styled, StyledProps } from '@glitz/react';\r\n\r\nfunction CartIcon({ compose }: StyledProps) {\r\n return (\r\n \r\n \r\n \r\n );\r\n}\r\n\r\nexport default styled(CartIcon);\r\n","import { useEffect } from 'react';\r\n\r\nconst useOutsideClick = (ref: React.RefObject, callback: () => void) => {\r\n const handleClick = (e: MouseEvent) => {\r\n if (ref.current && !ref.current.contains(e.target)) {\r\n callback();\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n document.addEventListener('click', handleClick);\r\n\r\n return () => {\r\n document.removeEventListener('click', handleClick);\r\n };\r\n });\r\n};\r\n\r\nexport default useOutsideClick;\r\n","import React from 'react';\r\nimport { styled } from '../../Theme';\r\nimport { StyledProps } from '@glitz/react';\r\n\r\nfunction PlanogramIcon({ compose }: StyledProps) {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n );\r\n}\r\n\r\nexport default styled(PlanogramIcon);\r\n","import Fetcher from '../Shared/Common/Fetcher';\r\nimport SimpleProduct from '../PlanogramPage/Models/SimpleProduct.interface';\r\n\r\nlet abortController: AbortController = new AbortController();\r\n\r\nexport async function GetCustomerPlanograms(\r\n channelId: string,\r\n requestToken: string,\r\n url: string,\r\n setIsLoading?: (value: boolean) => void\r\n) {\r\n setIsLoading && setIsLoading(true);\r\n abortController.abort();\r\n abortController = new AbortController();\r\n const signal = abortController.signal;\r\n\r\n const litiumContext = JSON.stringify({\r\n channelSystemId: channelId,\r\n });\r\n return Fetcher(\r\n url,\r\n signal,\r\n (data, resolve) => {\r\n resolve(data);\r\n setIsLoading && setIsLoading(false);\r\n },\r\n litiumContext,\r\n requestToken\r\n );\r\n}\r\n","import React from 'react';\r\nimport { styled, StyledProps } from '@glitz/react';\r\n\r\nfunction ImagePlaceholderIcon({ compose }: StyledProps) {\r\n return (\r\n \r\n \r\n \r\n \r\n );\r\n}\r\n\r\nexport default styled(ImagePlaceholderIcon);\r\n","import React, { useEffect, useState } from 'react';\r\nimport useCurrentPage from '../Shared/Hooks/useCurrentPage';\r\nimport PageModelBase from '../Shared/Models/PageModelBase.interface';\r\nimport { GetCustomerPlanograms } from './MyPlanograms';\r\nimport PlanogramIcon from '../Shared/Icons/PlanogramIcon';\r\nimport ImagePlaceholderIcon from '../Shared/Icons/ImagePlaceholderIcon';\r\nimport { styled, theme } from '../Theme';\r\nimport SimpleProduct from '../../Features/PlanogramPage/Models/SimpleProduct.interface';\r\nimport KexLink from '../Shared/KexLink/KexLink';\r\nimport { media, pseudo } from '@glitz/core';\r\nimport { mediaQuery } from '../Theme/mediaQueries';\r\nimport { useAppSettingsData } from '../Shared/AppSettingsProvider/AppSettingsProvider';\r\nimport { useUserStateData } from '../Shared/UserContextProvider/UserContextProvider';\r\nimport CtaButton from '../Shared/CtaButton/CtaButton';\r\nimport Dots from '../Shared/Button/Dots';\r\n\r\ntype PropType = {\r\n showAllPlanograms?: boolean;\r\n};\r\n\r\nfunction MyPlanogramsComponent({ showAllPlanograms = true }: PropType) {\r\n const {\r\n translations: {\r\n 'planogram/myPlanograms': myPlanogramsLabel,\r\n 'planogram/seeAllPlanograms': seeAllPlanogramsLabel,\r\n },\r\n staticPages: { myPlanogramsPage },\r\n languageRoute,\r\n requestToken,\r\n placeholderImages: { planogramPlaceholder: planogramPlaceholderImg },\r\n } = useAppSettingsData();\r\n const { organizationId } = useUserStateData();\r\n const [isLoading, setIsLoading] = useState(false);\r\n\r\n const { channelId } = useCurrentPage();\r\n const url = `/api/${languageRoute}/planogram/GetMyPlanograms?organizationId=${organizationId}`;\r\n const [myPlanograms, setMyPlanograms] = useState([]);\r\n\r\n useEffect(() => {\r\n organizationId &&\r\n GetCustomerPlanograms(\r\n channelId,\r\n requestToken,\r\n url,\r\n setIsLoading\r\n ).then(data =>\r\n !showAllPlanograms && !!data.length && data.length > 4\r\n ? setMyPlanograms(data.slice(0, 4))\r\n : setMyPlanograms(data)\r\n );\r\n }, [channelId]);\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n {myPlanogramsLabel}\r\n \r\n {isLoading ? (\r\n \r\n \r\n \r\n ) : (\r\n \r\n {!!myPlanograms.length &&\r\n myPlanograms.map(\r\n (planogram: SimpleProduct) =>\r\n planogram.url && (\r\n \r\n \r\n {planogram.image ? (\r\n \r\n ) : (\r\n \r\n )}\r\n {planogram.name}\r\n \r\n {planogram.articleNumber}\r\n \r\n \r\n \r\n )\r\n )}\r\n \r\n )}\r\n {!showAllPlanograms && !!myPlanograms.length && (\r\n \r\n \r\n {seeAllPlanogramsLabel}\r\n \r\n \r\n )}\r\n \r\n \r\n );\r\n}\r\n\r\nconst Wrapper = styled.div({\r\n padding: { x: '7.5px' },\r\n marginBottom: theme.spacing(10),\r\n ...media(mediaQuery.mediaMinLarge, {\r\n padding: { x: theme.spacing(10) },\r\n maxWidth: theme.screenMaxWidth,\r\n margin: { x: 'auto' },\r\n }),\r\n});\r\n\r\nconst Container = styled.div({\r\n backgroundColor: theme.white,\r\n padding: { x: theme.spacing(6) },\r\n paddingTop: theme.spacing(7),\r\n paddingBottom: theme.spacing(10),\r\n borderRadius: '10px',\r\n ...media(mediaQuery.mediaMinLarge, {\r\n padding: { x: theme.spacing(11) },\r\n paddingTop: theme.spacing(8),\r\n paddingBottom: theme.spacing(16),\r\n }),\r\n});\r\n\r\nconst DotsWrapper = styled.div({\r\n display: 'flex',\r\n justifyContent: 'center',\r\n paddingBottom: theme.spacing(9),\r\n});\r\n\r\nconst HeadingSection = styled.div({\r\n display: 'flex',\r\n marginBottom: theme.spacing(7),\r\n});\r\n\r\nconst StyledCtaButton = styled(CtaButton, {\r\n marginTop: theme.spacing(11),\r\n marginBottom: theme.spacing(6),\r\n ...media(mediaQuery.mediaMaxLarge, {\r\n margin: { x: 'auto' },\r\n }),\r\n});\r\n\r\nconst LinkWrapper = styled.div({\r\n display: 'flex',\r\n});\r\n\r\nconst Heading = styled.h3({\r\n fontSize: '22px',\r\n color: theme.black,\r\n marginLeft: theme.spacing(3),\r\n lineHeight: '26.4px',\r\n});\r\n\r\nconst PlanogramGrid = styled.div({\r\n display: 'grid',\r\n gridTemplateColumns: `repeat(2, minmax(0, 1fr))`,\r\n gridColumnGap: theme.spacing(4),\r\n gridRowGap: theme.spacing(7),\r\n ...media(mediaQuery.mediaMinMedium, {\r\n gridTemplateColumns: `repeat(3, minmax(0, 1fr))`,\r\n ...pseudo([':nth-child(n)[data-showbtn=\"true\"]'], {\r\n gridTemplateColumns: `repeat(4, minmax(0, 1fr))`,\r\n }),\r\n }),\r\n ...media(mediaQuery.mediaMinLarge, {\r\n gridTemplateColumns: `repeat(4, minmax(0, 1fr))`,\r\n gridColumnGap: theme.spacing(9),\r\n gridRowGap: theme.spacing(11),\r\n }),\r\n});\r\n\r\nconst PlanogramCard = styled.div({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n justifyContent: 'space-between',\r\n height: '100%',\r\n wordBreak: 'break-word',\r\n border: {\r\n xy: {\r\n style: 'solid',\r\n width: theme.tiny,\r\n color: theme.veryLightGray,\r\n },\r\n },\r\n borderRadius: '10px',\r\n paddingBottom: theme.spacing(6),\r\n paddingTop: theme.spacing(5),\r\n});\r\n\r\nconst StyledImagePlaceholderIcon = styled(ImagePlaceholderIcon, {\r\n fill: theme.primaryBlue,\r\n padding: { x: theme.spacing(5) },\r\n maxHeight: '110px',\r\n margin: { x: 'auto' },\r\n ...media(mediaQuery.mediaMinMedium, {\r\n maxHeight: '180px',\r\n }),\r\n ...media(mediaQuery.mediaMinLarge, {\r\n maxHeight: '220px',\r\n }),\r\n});\r\n\r\nconst PlanogramImage = styled.img({\r\n margin: { x: 'auto' },\r\n maxHeight: '110px',\r\n padding: { x: theme.spacing(5) },\r\n ...media(mediaQuery.mediaMinMedium, {\r\n maxHeight: '180px',\r\n }),\r\n ...media(mediaQuery.mediaMinLarge, {\r\n maxHeight: '220px',\r\n }),\r\n});\r\n\r\nconst PlanogramText = styled.div({\r\n font: { size: theme.beta, weight: theme.fontWeight.bold },\r\n lineHeight: '17px',\r\n textAlign: 'center',\r\n marginTop: theme.spacing(6),\r\n color: theme.black,\r\n padding: { x: theme.spacing(2) },\r\n ...media(mediaQuery.mediaMinLarge, {\r\n fontSize: theme.delta,\r\n lineHeight: '22px',\r\n }),\r\n});\r\n\r\nconst PlanogramArticleNumber = styled.span({\r\n font: { size: theme.beta },\r\n textAlign: 'center',\r\n color: theme.breadText,\r\n marginTop: theme.spacing(3),\r\n});\r\n\r\nexport default MyPlanogramsComponent;\r\n","import React, { useState, useRef, useEffect } from 'react';\r\nimport ProductInGrid from './Models/ProductInGrid.interface';\r\nimport { styled } from '@glitz/react';\r\nimport { theme } from '../Theme';\r\nimport { pseudo, media } from '@glitz/core';\r\nimport { mediaQuery } from '../Theme/mediaQueries';\r\nimport { useAppSettingsData } from '../Shared/AppSettingsProvider/AppSettingsProvider';\r\nimport { UpdateCart } from '../Cart/Cart';\r\nimport useMedia from '../Shared/Hooks/useMedia';\r\nimport CtaButton from '../Shared/CtaButton/CtaButton';\r\nimport PlusToggleIcon from '../Shared/Icons/PlusToggleIcon';\r\nimport MinusToggleIcon from '../Shared/Icons/MinusToggleIcon';\r\nimport CheckIcon from '../Shared/Icons/CheckIcon';\r\nimport { LoadingCircle } from '../Shared/Icons';\r\nimport useOutsideClick from '../Shared/Hooks/useOutsideClick';\r\nimport CloseIcon from '../Shared/Icons/CloseIcon';\r\n\r\nimport { createPopper } from '@popperjs/core';\r\n\r\ntype PropType = {\r\n product: ProductInGrid;\r\n planogramId: string;\r\n};\r\n\r\nfunction PlanogramProductCard({ product, planogramId }: PropType) {\r\n const {\r\n translations: {\r\n 'productPage/addToCart': addToCartLabel,\r\n 'common/moreInformation': moreInformationLabel,\r\n 'common/quantity': quantityLabel,\r\n 'common/perPackage': perPackageLabel,\r\n 'common/piece': pieceLabel,\r\n 'productPage/inStock': inStockLabel,\r\n 'productPage/notInStock': notInStockLabel,\r\n 'productPage/addedToCart': addedToCartLabel,\r\n 'productPage/position': positionLabel,\r\n },\r\n languageRoute,\r\n placeholderImages: { productPlaceholder: productPlaceholderImg },\r\n } = useAppSettingsData();\r\n\r\n const [isActive, setIsActive] = useState(false);\r\n const [inputQuantity, setInputQuantity] = useState('1');\r\n const [isLoading, setIsLoading] = useState(false);\r\n const [itemAdded, setItemAdded] = useState(false);\r\n\r\n const cardRef = useRef(null)!;\r\n const popupRef = useRef(null);\r\n\r\n const isDesktop = useMedia(theme.mediaQuery.mediaMinLarge);\r\n const inStock = product.product && product.product.inStock;\r\n\r\n useEffect(() => {\r\n const productImage =\r\n document &&\r\n document.querySelector(`#productImage-${product.bookingNumber}`)!;\r\n\r\n const tooltip =\r\n document &&\r\n document.querySelector(`#tooltip-${product.bookingNumber}`)!;\r\n\r\n createPopper(productImage, tooltip, {\r\n placement: 'bottom',\r\n strategy: 'fixed',\r\n modifiers: [\r\n {\r\n name: 'offset',\r\n options: {\r\n offset: [0, 15],\r\n },\r\n },\r\n ],\r\n });\r\n }, [isActive]);\r\n\r\n const onCardClick = (val: boolean) => {\r\n !isActive && setIsActive(val);\r\n if (!isActive) {\r\n cardRef?.current?.scrollIntoView({\r\n behavior: 'smooth',\r\n block: 'nearest',\r\n inline: 'center',\r\n });\r\n }\r\n };\r\n\r\n useOutsideClick(cardRef, () => {\r\n if (isActive) {\r\n setIsActive(false);\r\n }\r\n });\r\n\r\n const onInputChange = (value: string) => {\r\n if (Number(value) < 0) {\r\n setInputQuantity('1');\r\n return;\r\n }\r\n setInputQuantity(value);\r\n };\r\n\r\n const onInputBlur = (numb: string) => {\r\n Number(numb) < 1 && setInputQuantity('1');\r\n };\r\n\r\n const addToCart = () => {\r\n const updated = UpdateCart(\r\n product.product.code,\r\n Number(inputQuantity),\r\n languageRoute,\r\n product.bookingNumber,\r\n setIsLoading\r\n );\r\n if (updated) {\r\n setItemAdded(true);\r\n setTimeout(() => {\r\n setItemAdded(false);\r\n }, 2000);\r\n }\r\n };\r\n\r\n const quantityQuery =\r\n Number(inputQuantity) > 1 ? `&quantity=${inputQuantity}` : '';\r\n\r\n const onCrossClick = () => {\r\n setIsActive(false);\r\n };\r\n\r\n return (\r\n \r\n onCardClick(true)}\r\n ref={cardRef}\r\n data-is-active={isActive}\r\n >\r\n {product.product.image ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n {product.rowPosition}/{product.columnPosition}\r\n \r\n \r\n \r\n {product.product.image ? (\r\n \r\n ) : (\r\n \r\n )}\r\n \r\n \r\n \r\n \r\n \r\n \r\n {product.product && product.product.name}\r\n \r\n \r\n {inStock ? (\r\n <>\r\n \r\n {inStockLabel}\r\n \r\n ) : (\r\n <>\r\n \r\n {notInStockLabel}\r\n \r\n )}\r\n \r\n \r\n \r\n {positionLabel}: \r\n {product.rowPosition}/{product.columnPosition}\r\n \r\n \r\n \r\n {quantityLabel}/{perPackageLabel}: \r\n {product.product.quantity}\r\n {pieceLabel}\r\n \r\n \r\n
\r\n {inStock && (\r\n \r\n \r\n \r\n setInputQuantity(\r\n (Number(inputQuantity) - 1).toString()\r\n )\r\n }\r\n >\r\n \r\n \r\n onInputChange(e.target.value)}\r\n onBlur={e => onInputBlur(e.target.value)}\r\n />\r\n \r\n setInputQuantity(\r\n (Number(inputQuantity) + 1).toString()\r\n )\r\n }\r\n >\r\n \r\n \r\n \r\n addToCart()}>\r\n \r\n {addToCartLabel}\r\n \r\n {isLoading && (\r\n \r\n )}\r\n {itemAdded && !isLoading && (\r\n \r\n {addedToCartLabel}\r\n \r\n \r\n )}\r\n \r\n \r\n )}\r\n
\r\n \r\n {moreInformationLabel}\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n\r\n onCardClick(true)}\r\n id={'tooltip-' + product.bookingNumber}\r\n role=\"tooltip\"\r\n >\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {product.product && product.product.name}\r\n \r\n \r\n {inStock ? (\r\n <>\r\n \r\n {inStockLabel}\r\n \r\n ) : (\r\n <>\r\n \r\n {notInStockLabel}\r\n \r\n )}\r\n \r\n \r\n {quantityLabel}/{perPackageLabel}: \r\n {product.product.quantity}\r\n {pieceLabel}\r\n \r\n \r\n\r\n
\r\n {inStock && (\r\n \r\n \r\n \r\n setInputQuantity(\r\n (Number(inputQuantity) - 1).toString()\r\n )\r\n }\r\n >\r\n \r\n \r\n onInputChange(e.target.value)}\r\n onBlur={e => onInputBlur(e.target.value)}\r\n />\r\n \r\n setInputQuantity(\r\n (Number(inputQuantity) + 1).toString()\r\n )\r\n }\r\n >\r\n \r\n \r\n \r\n addToCart()}>\r\n \r\n {addToCartLabel}\r\n \r\n {isLoading && (\r\n \r\n )}\r\n {itemAdded && !isLoading && (\r\n \r\n {addedToCartLabel}\r\n \r\n \r\n )}\r\n \r\n \r\n )}\r\n
\r\n \r\n {moreInformationLabel}\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n );\r\n}\r\n\r\nconst CellPosition = styled.div({\r\n color: theme.breadText,\r\n font: { size: theme.alpha, weight: theme.fontWeight.bold },\r\n textTransform: 'uppercase',\r\n});\r\n\r\nconst CellRow = styled.span({\r\n position: 'absolute',\r\n left: '10px',\r\n color: theme.breadText,\r\n font: { size: theme.alpha, weight: theme.fontWeight.bold },\r\n textTransform: 'uppercase',\r\n});\r\n\r\nconst Cell = styled.div({});\r\n\r\nconst PopperArrow = styled.div({\r\n ...pseudo(':before', {\r\n content: '\"\"',\r\n position: 'absolute',\r\n left: '-14px',\r\n width: '30px',\r\n height: '30px',\r\n borderRadius: '4px',\r\n transform: 'rotate(45deg)',\r\n backgroundColor: theme.white,\r\n ...media(mediaQuery.mediaMaxLarge, {\r\n zIndex: 9,\r\n bottom: '-26px',\r\n }),\r\n ...media(mediaQuery.mediaMinLarge, {\r\n top: '0px',\r\n }),\r\n }),\r\n});\r\n\r\nconst StockStatus = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n margin: { bottom: theme.spacing(3) },\r\n});\r\n\r\nconst StyledLoadingCircle = styled(LoadingCircle, {\r\n color: theme.white,\r\n height: theme.gamma,\r\n margin: { xy: 'auto' },\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n});\r\n\r\nconst StyledCheckIcon = styled(CheckIcon, {\r\n height: '14px',\r\n width: '14px',\r\n marginLeft: '8px',\r\n});\r\n\r\nconst ItemAddedText = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n color: theme.white,\r\n height: theme.gamma,\r\n margin: { xy: 'auto' },\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n});\r\n\r\nconst ButtonText = styled.span({\r\n transition: {\r\n property: 'all',\r\n duration: '0.2s',\r\n timingFunction: 'linear',\r\n },\r\n ...pseudo([':nth-child(n)[data-isloading=\"true\"]'], {\r\n visibility: 'hidden',\r\n opacity: 0,\r\n }),\r\n});\r\n\r\nconst StockStatusCircle = styled.div({\r\n borderRadius: '50%',\r\n width: '8px',\r\n height: '8px',\r\n backgroundColor: theme.notInStockRed,\r\n marginRight: theme.spacing(2),\r\n ...pseudo([':nth-child(n)[data-instock=\"true\"]'], {\r\n backgroundColor: theme.inStockGreen,\r\n }),\r\n});\r\n\r\nconst StockStatusText = styled.span({\r\n color: theme.black,\r\n font: { size: theme.alpha, weight: theme.fontWeight.bold },\r\n textTransform: 'uppercase',\r\n});\r\n\r\nconst AddToCart = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n});\r\n\r\nconst QuantitySelector = styled.div({\r\n backgroundColor: theme.primaryBackground,\r\n borderRadius: '100px',\r\n display: 'flex',\r\n height: '40px',\r\n alignItems: 'center',\r\n padding: { x: theme.spacing(3) },\r\n});\r\n\r\nconst MinusButton = styled.button({\r\n ':disabled': {\r\n cursor: 'default',\r\n opacity: 0.6,\r\n },\r\n});\r\n\r\nconst QuantityInput = styled.input({\r\n width: theme.spacing(7),\r\n backgroundColor: theme.primaryBackground,\r\n textAlign: 'center',\r\n MozAppearance: 'textfield', // hide number arrows Firefox\r\n ...pseudo(['::-webkit-outer-spin-button', '::-webkit-inner-spin-button'], {\r\n WebkitAppearance: 'none', // hide number arrows Chrome, Safari, Edge, Opera\r\n margin: { xy: 0 },\r\n }),\r\n});\r\n\r\nconst StyledPlusIcon = styled(PlusToggleIcon, {\r\n height: '18px',\r\n width: '18px',\r\n fill: theme.black,\r\n});\r\n\r\nconst StyledMinusIcon = styled(MinusToggleIcon, {\r\n height: '18px',\r\n width: '18px',\r\n fill: theme.black,\r\n});\r\n\r\nconst AddToCartButton = styled(CtaButton, {\r\n position: 'relative',\r\n alignItems: 'center',\r\n width: '100%',\r\n fontSize: theme.tau,\r\n padding: { xy: '10px' },\r\n marginLeft: theme.spacing(2),\r\n minHeight: '40px',\r\n ...media(mediaQuery.mediaMinLarge, {\r\n padding: { xy: theme.spacing(3) },\r\n }),\r\n});\r\n\r\nconst MoreInfoButton = styled(CtaButton, {\r\n width: '100%',\r\n textAlign: 'center',\r\n fontSize: theme.alpha,\r\n marginTop: theme.spacing(3),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n fontSize: theme.beta,\r\n }),\r\n});\r\n\r\nconst ProductCardWrapper = styled.div({\r\n ...media(mediaQuery.mediaMinLarge, {\r\n display: 'flex',\r\n }),\r\n});\r\n\r\nconst ProductCardModalContainer = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n padding: { xy: theme.spacing(3) },\r\n backgroundColor: theme.white,\r\n wordBreak: 'break-word',\r\n top: theme.spacing(4),\r\n zIndex: 9,\r\n boxShadow: '0px 4px 50px rgba(0, 0, 0, 0.2)',\r\n borderRadius: '10px',\r\n ...media(mediaQuery.mediaMaxLarge, {\r\n maxWidth: '345px',\r\n }),\r\n ...media(mediaQuery.mediaMinLarge, {\r\n padding: { xy: theme.spacing(4) },\r\n paddingRight: theme.spacing(3),\r\n maxWidth: '460px',\r\n }),\r\n});\r\n\r\nconst PopperWrapper = styled.div({\r\n display: 'none',\r\n zIndex: 9,\r\n ...pseudo([':nth-child(n)[data-ishovered=\"true\"]'], {\r\n display: 'inline-block',\r\n ...media(mediaQuery.mediaMinLarge, {\r\n display: 'inline-block',\r\n }),\r\n }),\r\n ...pseudo([':nth-child(n)[data-popper-placement=\"right\"] > #arrow'], {\r\n left: '-12px',\r\n }),\r\n ...pseudo([':nth-child(n)[data-popper-placement=\"left\"] > #arrow'], {\r\n right: '18px',\r\n }),\r\n ...pseudo([':nth-child(n)[data-popper-placement=\"top\"] > #arrow'], {\r\n bottom: '12px',\r\n zIndex: 9,\r\n ...media(mediaQuery.mediaMinLarge, {\r\n bottom: '18px',\r\n }),\r\n }),\r\n ...pseudo([':nth-child(n)[data-popper-placement=\"bottom\"] > #arrow'], {\r\n top: '-9px',\r\n zIndex: 9,\r\n ...media(mediaQuery.mediaMinLarge, {\r\n top: '-14px',\r\n }),\r\n }),\r\n});\r\n\r\nconst AttributeArea = styled.div({\r\n paddingLeft: theme.spacing(3),\r\n paddingTop: theme.spacing(2),\r\n display: 'flex',\r\n flexDirection: 'column',\r\n justifyContent: 'space-between',\r\n zIndex: 10,\r\n ...media(mediaQuery.mediaMinLarge, {\r\n paddingLeft: theme.spacing(3),\r\n }),\r\n});\r\n\r\nconst CloseIconWrapper = styled.div({\r\n cursor: 'pointer',\r\n display: 'flex',\r\n justifyContent: 'end',\r\n marginRight: '10px',\r\n marginBottom: '10px',\r\n});\r\n\r\nconst StyledCloseIcon = styled(CloseIcon, {\r\n height: theme.spacing(4),\r\n});\r\n\r\nconst TextWrapper = styled.div({\r\n paddingLeft: theme.spacing(3),\r\n marginBottom: theme.spacing(5),\r\n});\r\n\r\nconst ProductTitle = styled.h3({\r\n font: { size: theme.delta, weight: theme.fontWeight.bold },\r\n color: theme.black,\r\n lineHeight: '21.6px',\r\n marginBottom: theme.spacing(2),\r\n ...media(mediaQuery.mediaMinLarge, {\r\n marginBottom: theme.spacing(3),\r\n }),\r\n});\r\n\r\nconst QuantityText = styled.span({\r\n font: { size: theme.beta, weight: theme.fontWeight.bold },\r\n color: theme.middleGray,\r\n textTransform: 'uppercase',\r\n});\r\n\r\nconst ProductCard = styled.div({\r\n position: 'relative',\r\n justifyContent: 'center',\r\n display: 'flex',\r\n width: '100%',\r\n height: '97px',\r\n backgroundColor: theme.primaryBackground,\r\n paddingTop: '10px',\r\n paddingBottom: '14px',\r\n cursor: 'pointer',\r\n ...pseudo([':nth-child(n)[data-is-active=\"true\"]'], {\r\n backgroundColor: theme.middleGray,\r\n cursor: 'unset',\r\n }),\r\n});\r\n\r\nconst ProductImage = styled.img({\r\n height: '100%',\r\n width: '100%',\r\n maxWidth: '60px',\r\n objectFit: 'contain',\r\n});\r\n\r\nconst ModalProductImage = styled.img({\r\n height: '100%',\r\n maxHeight: '180px',\r\n maxWidth: '125px',\r\n objectFit: 'contain',\r\n zIndex: 10,\r\n ...media(mediaQuery.mediaMinLarge, {\r\n maxWidth: '215px',\r\n maxHeight: '312px',\r\n }),\r\n});\r\n\r\nexport default PlanogramProductCard;\r\n","import React from 'react';\r\nimport { styled } from '@glitz/react';\r\nimport { StyleOrStyleArray } from '@glitz/type';\r\nimport ProductInGrid from './Models/ProductInGrid.interface';\r\nimport PlanogramProductCard from './PlanogramProductCard';\r\nimport { theme } from '../Theme';\r\nimport { media, pseudo } from '@glitz/core';\r\nimport { mediaQuery } from '../Theme/mediaQueries';\r\n\r\ntype PropType = {\r\n row: ProductInGrid[];\r\n isLast: boolean;\r\n useScroll: boolean;\r\n planogramId: string;\r\n};\r\n\r\nfunction PlanogramRowGrid({ row, isLast, useScroll, planogramId }: PropType) {\r\n const GridStyle: StyleOrStyleArray = {\r\n gridTemplateColumns: `repeat(${row.length}, minmax(0, 1fr))`,\r\n marginBottom: !isLast ? '10px' : 0,\r\n };\r\n\r\n return (\r\n \r\n {row.map((product: ProductInGrid) => (\r\n \r\n ))}\r\n \r\n );\r\n}\r\n\r\nconst Grid = styled.div({\r\n display: 'grid',\r\n gridColumnGap: theme.spacing(3),\r\n ...media(mediaQuery.mediaMinMedium, {\r\n width: '730px',\r\n }),\r\n ...media(mediaQuery.mediaMaxLarge, {\r\n ...pseudo([':nth-child(n)[data-usescroll=\"true\"]'], {\r\n width: '730px',\r\n }),\r\n }),\r\n ...media(mediaQuery.mediaMinLarge, {\r\n width: '100%',\r\n }),\r\n});\r\n\r\nexport default PlanogramRowGrid;\r\n","import React from 'react';\r\nimport { styled, theme } from '../Theme';\r\nimport ImageModel from '../Assets/Models/ImageModel.interface';\r\nimport { media } from '@glitz/core';\r\n\r\ntype ProductImages = {\r\n image: ImageModel;\r\n};\r\n\r\nfunction ProductImagesContainer({ image }: ProductImages) {\r\n return (\r\n \r\n \r\n \r\n );\r\n}\r\n\r\nconst MainImageDiv = styled.div({\r\n position: 'relative',\r\n display: 'flex',\r\n padding: {\r\n xy: theme.gamma,\r\n },\r\n paddingBottom: 0,\r\n filter: theme.shadows.productImageShadow,\r\n margin: { x: `-${theme.gamma}` },\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n margin: { x: theme.none },\r\n }),\r\n});\r\n\r\nconst MainImage = styled.img({\r\n width: '100%',\r\n maxHeight: theme.productImageMaxHeight,\r\n objectFit: 'contain',\r\n ...media(theme.mediaQuery.mediaMinMedium, {\r\n maxHeight: theme.productImageMaxHeight,\r\n }),\r\n});\r\n\r\nexport default ProductImagesContainer;\r\n","import React, { useState } from 'react';\r\n\r\nimport { styled, theme } from '../Theme';\r\nimport { UpdateCart } from '../Cart/Cart';\r\nimport { media, pseudo } from '@glitz/core';\r\nimport { LoadingCircle } from '../Shared/Icons';\r\nimport CtaButton from '../Shared/CtaButton/CtaButton';\r\nimport PlusToggleIcon from '../Shared/Icons/PlusToggleIcon';\r\nimport MinusToggleIcon from '../Shared/Icons/MinusToggleIcon';\r\nimport { mediaQuery } from '../Theme/mediaQueries';\r\nimport VariationModel from '../KexVariation/Models/VariationModel.interface';\r\nimport CheckIcon from '../Shared/Icons/CheckIcon';\r\nimport PlanogramPageModel from './Models/PlanogramPageModel.interface';\r\nimport useCurrentPage from '../Shared/Hooks/useCurrentPage';\r\nimport { useAppSettingsData } from '../Shared/AppSettingsProvider/AppSettingsProvider';\r\nimport useMedia from '../Shared/Hooks/useMedia';\r\n\r\ntype AttributeArea = {\r\n variation: VariationModel;\r\n bookingNumber: string;\r\n planogramInputQuantity: number;\r\n planogramVariantList?: VariationModel[];\r\n shortDescription?: string;\r\n};\r\n\r\nfunction AttributeArea({\r\n variation: { totalPrice, code },\r\n bookingNumber,\r\n planogramInputQuantity,\r\n planogramVariantList,\r\n shortDescription,\r\n}: AttributeArea) {\r\n const [inputQuantity, setInputQuantity] = useState(\r\n planogramInputQuantity\r\n );\r\n const [isLoading, setIsLoading] = useState(false);\r\n const [itemAdded, setItemAdded] = useState(false);\r\n\r\n const {\r\n translations: {\r\n 'productPage/addToCart': addToCartLabel,\r\n 'productPage/inStock': inStockLabel,\r\n 'productPage/notInStock': notInStockLabel,\r\n 'productPage/addedToCart': addedToCartLabel,\r\n 'productPage/eanCode': eanCodeLabel,\r\n 'productPage/quantity': quantityLabel,\r\n 'productPage/priceGroupName': priceGroupNameLabel,\r\n 'productPage/va': vaLabel,\r\n 'productPage/position': positionLabel,\r\n },\r\n languageRoute,\r\n } = useAppSettingsData();\r\n\r\n const { variationCollection } = useCurrentPage();\r\n const planogram = variationCollection && variationCollection[0];\r\n const inStock = planogram.inStock;\r\n const isMobile = useMedia(theme.mediaQuery.mediaMaxMedium);\r\n\r\n const onInputChange = (value: string) => {\r\n if (Number(value) < 0) {\r\n setInputQuantity(1);\r\n return;\r\n }\r\n setInputQuantity(Number(value));\r\n };\r\n\r\n const onInputBlur = (numb: string) => {\r\n Number(numb) < 1 && setInputQuantity(1);\r\n };\r\n\r\n const addToCart = () => {\r\n const updated = UpdateCart(\r\n code,\r\n inputQuantity,\r\n languageRoute,\r\n bookingNumber ? bookingNumber : '',\r\n setIsLoading\r\n );\r\n if (updated) {\r\n setItemAdded(true);\r\n setTimeout(() => {\r\n setItemAdded(false);\r\n }, 2000);\r\n }\r\n };\r\n\r\n return (\r\n \r\n {planogram.name}\r\n {planogram.articleNumber}\r\n {shortDescription}\r\n \r\n {inStock ? (\r\n <>\r\n \r\n {inStockLabel}\r\n \r\n ) : (\r\n <>\r\n \r\n {notInStockLabel}\r\n \r\n )}\r\n \r\n\r\n {!isMobile ? (\r\n \r\n \r\n {priceGroupNameLabel}\r\n {quantityLabel}\r\n {eanCodeLabel}\r\n {vaLabel}\r\n \r\n {planogramVariantList?.map(productItem => (\r\n \r\n <>\r\n {productItem.priceGroupName}\r\n {productItem.quantity}\r\n {productItem.eanCode}\r\n {productItem.recommendedPrice}\r\n \r\n \r\n ))}\r\n
\r\n ) : (\r\n planogramVariantList?.map(productItem => (\r\n \r\n \r\n \r\n {priceGroupNameLabel}\r\n \r\n {productItem.priceGroupName}\r\n \r\n \r\n {quantityLabel}\r\n {productItem.quantity}\r\n \r\n \r\n {eanCodeLabel}\r\n {productItem.articleNumber}\r\n \r\n \r\n {vaLabel}\r\n {productItem.recommendedPrice}\r\n \r\n \r\n ))\r\n )}\r\n {inStock && (\r\n <>\r\n \r\n \r\n {totalPrice}\r\n \r\n \r\n
\r\n \r\n \r\n setInputQuantity(inputQuantity - 1)}\r\n >\r\n \r\n \r\n onInputChange(e.target.value)}\r\n onBlur={e => onInputBlur(e.target.value)}\r\n />\r\n \r\n \r\n addToCart()}>\r\n \r\n {addToCartLabel}\r\n \r\n {isLoading && }\r\n {itemAdded && !isLoading && (\r\n \r\n {addedToCartLabel}\r\n \r\n \r\n )}\r\n \r\n \r\n
\r\n \r\n )}\r\n
\r\n );\r\n}\r\n\r\nconst CellRow = styled.span({\r\n color: theme.breadText,\r\n font: { size: theme.alpha, weight: theme.fontWeight.bold },\r\n textTransform: 'uppercase',\r\n});\r\n\r\nconst Cell = styled.div({});\r\n\r\nconst AttrContainerWrapper = styled.div({\r\n width: '100%',\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n maxWidth: '630px',\r\n }),\r\n});\r\n\r\nconst StyledLoadingCircle = styled(LoadingCircle, {\r\n color: theme.white,\r\n height: theme.gamma,\r\n margin: { xy: 'auto' },\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n});\r\n\r\nconst ButtonText = styled.span({\r\n transition: {\r\n property: 'all',\r\n duration: '0.2s',\r\n timingFunction: 'linear',\r\n },\r\n ...pseudo([':nth-child(n)[data-isloading=\"true\"]'], {\r\n visibility: 'hidden',\r\n opacity: 0,\r\n }),\r\n});\r\n\r\nconst Heading = styled.h1({\r\n padding: {\r\n top: theme.spacing(5),\r\n },\r\n font: {\r\n size: theme.psi,\r\n weight: theme.fontWeight.bold,\r\n },\r\n lineHeight: theme.lineHeight.tight,\r\n letterSpacing: theme.letterSpacing.wider,\r\n color: theme.black,\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n font: {\r\n size: '32px',\r\n },\r\n padding: {\r\n top: 'none',\r\n },\r\n }),\r\n});\r\n\r\nconst Table = styled.div({\r\n display: 'table',\r\n width: '100%',\r\n borderCollapse: 'collapse',\r\n});\r\n\r\nconst Content = styled.div({\r\n borderTopColor: theme.grayLine,\r\n borderTopStyle: 'solid',\r\n borderTopWidth: '1px',\r\n margin: { y: theme.spacing(5) },\r\n paddingTop: theme.spacing(6),\r\n});\r\n\r\nconst Array = styled.div({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n alignItems: 'center',\r\n lineHeight: '22.4px',\r\n padding: { x: theme.spacing(4), y: '10px' },\r\n ...pseudo([':nth-child(n)[data-whitebackground=\"true\"]'], {\r\n backgroundColor: theme.white,\r\n }),\r\n});\r\n\r\nconst ArrayOrderItemHeading = styled.span({\r\n fontSize: theme.gamma,\r\n color: theme.breadText,\r\n});\r\n\r\nconst ArrayOrderItem = styled.span({\r\n fontSize: theme.gamma,\r\n color: theme.black,\r\n lineHeight: '25.6px',\r\n});\r\n\r\nconst ArrayOrderNumber = styled.span({\r\n fontSize: theme.gamma,\r\n color: theme.linkColor,\r\n cursor: 'pointer',\r\n textDecoration: 'underline',\r\n});\r\n\r\nconst TableRow = styled.div({\r\n display: 'table-row',\r\n borderBottomColor: theme.grayLine,\r\n borderBottomStyle: 'solid',\r\n borderBottomWidth: '2px',\r\n padding: { y: theme.spacing(3) },\r\n});\r\n\r\nconst TableCell = styled.div({\r\n display: 'table-cell',\r\n textAlign: 'left',\r\n fontSize: theme.large,\r\n padding: { y: theme.spacing(3), x: theme.spacing(2) },\r\n wordBreak: 'break-all',\r\n ...media(mediaQuery.mediaMinVerySmall, {\r\n fontSize: theme.beta,\r\n padding: { y: theme.spacing(3), x: theme.spacing(4) },\r\n }),\r\n});\r\n\r\nconst StockStatus = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n margin: { bottom: theme.spacing(8), top: theme.spacing(4) },\r\n ...media(mediaQuery.mediaMinLarge, {\r\n marginBottom: theme.spacing(6),\r\n }),\r\n});\r\n\r\nconst StyledCheckIcon = styled(CheckIcon, {\r\n height: '18px',\r\n width: '18px',\r\n marginLeft: '8px',\r\n});\r\n\r\nconst ItemAddedText = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n color: theme.white,\r\n height: theme.gamma,\r\n margin: { xy: 'auto' },\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n});\r\n\r\nconst StockStatusCircle = styled.div({\r\n borderRadius: '50%',\r\n width: '8px',\r\n height: '8px',\r\n backgroundColor: theme.notInStockRed,\r\n marginRight: theme.spacing(2),\r\n ...pseudo([':nth-child(n)[data-instock=\"true\"]'], {\r\n backgroundColor: theme.inStockGreen,\r\n }),\r\n});\r\n\r\nconst StockStatusText = styled.span({\r\n color: theme.black,\r\n font: { size: theme.alpha, weight: theme.fontWeight.bold },\r\n textTransform: 'uppercase',\r\n});\r\n\r\nconst PriceContainer = styled.div({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n margin: {\r\n top: theme.theta,\r\n bottom: theme.psi,\r\n },\r\n});\r\n\r\nconst MainPriceContainer = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n});\r\n\r\nconst Price = styled.span({\r\n font: {\r\n size: theme.nearGreat,\r\n weight: theme.fontWeight.bold,\r\n },\r\n marginTop: theme.spacing(2),\r\n lineHeight: theme.lineHeight.tight,\r\n letterSpacing: theme.letterSpacing.wider,\r\n color: theme.black,\r\n});\r\n\r\nconst AddToCart = styled.div({\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'space-between',\r\n});\r\n\r\nconst QuantitySelector = styled.div({\r\n backgroundColor: theme.white,\r\n borderRadius: '100px',\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n width: '35%',\r\n alignItems: 'center',\r\n padding: { x: theme.spacing(5), y: '14px' },\r\n ...media(mediaQuery.mediaMinLarge, {\r\n padding: { y: '18px' },\r\n }),\r\n});\r\n\r\nconst MinusButton = styled.button({\r\n ':disabled': {\r\n cursor: 'default',\r\n opacity: 0.6,\r\n },\r\n});\r\n\r\nconst QuantityInput = styled.input({\r\n width: theme.spacing(7),\r\n backgroundColor: theme.white,\r\n textAlign: 'center',\r\n MozAppearance: 'textfield', // hide number arrows Firefox\r\n ...pseudo(['::-webkit-outer-spin-button', '::-webkit-inner-spin-button'], {\r\n WebkitAppearance: 'none', // hide number arrows Chrome, Safari, Edge, Opera\r\n margin: { xy: 0 },\r\n }),\r\n});\r\n\r\nconst StyledPlusIcon = styled(PlusToggleIcon, {\r\n height: '20px',\r\n width: '20px',\r\n fill: theme.black,\r\n});\r\n\r\nconst StyledMinusIcon = styled(MinusToggleIcon, {\r\n height: '20px',\r\n width: '20px',\r\n fill: theme.black,\r\n});\r\n\r\nconst AddToCartButton = styled(CtaButton, {\r\n position: 'relative',\r\n width: '65%',\r\n fontSize: theme.moreLarge,\r\n textAlign: 'center',\r\n lineHeight: '1.3em',\r\n padding: { x: theme.spacing(5), y: '15px' },\r\n marginLeft: theme.spacing(5),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n padding: { y: theme.spacing(5) },\r\n }),\r\n});\r\n\r\nconst AddToCartError = styled.span({\r\n color: theme.red,\r\n textAlign: 'center',\r\n fontSize: theme.beta,\r\n lineHeight: theme.lineHeight.loose,\r\n letterSpacing: theme.letterSpacing.wide,\r\n});\r\n\r\nconst cartIconCss = {\r\n width: theme.gamma,\r\n height: theme.epsilon,\r\n margin: { right: theme.medium },\r\n};\r\n\r\nconst AttributeProperty = styled.p({\r\n height: 20,\r\n margin: {\r\n bottom: theme.large,\r\n },\r\n font: {\r\n size: theme.gamma,\r\n weight: theme.fontWeight.normal,\r\n },\r\n lineHeight: theme.lineHeight.tight,\r\n letterSpacing: theme.letterSpacing.wide,\r\n color: theme.breadText,\r\n});\r\n\r\nconst AttributeValue = styled.span({\r\n height: 20,\r\n font: {\r\n size: theme.gamma,\r\n weight: theme.fontWeight.lighter,\r\n },\r\n lineHeight: theme.lineHeight.tight,\r\n letterSpacing: theme.letterSpacing.wide,\r\n color: theme.breadText,\r\n});\r\n\r\nconst ProductAttrListWrapper = styled.div({\r\n whiteSpace: 'pre-line',\r\n textAlign: 'center',\r\n});\r\n\r\nconst PlanogramArticleNumber = styled.span({\r\n font: { size: theme.beta },\r\n textAlign: 'center',\r\n color: theme.breadText,\r\n marginTop: theme.spacing(3),\r\n});\r\n\r\nconst Description = styled.p({\r\n color: theme.breadText,\r\n margin: { y: theme.large },\r\n lineHeight: theme.lineHeight.relaxed,\r\n letterSpacing: theme.letterSpacing.wide,\r\n font: {\r\n size: theme.moreLarge,\r\n weight: theme.fontWeight.normal,\r\n },\r\n});\r\n\r\nexport default AttributeArea;\r\n","import React from 'react';\r\nimport useCurrentPage from '../Shared/Hooks/useCurrentPage';\r\nimport PlanogramPageModel from './Models/PlanogramPageModel.interface';\r\nimport { styled } from '@glitz/react';\r\nimport { theme } from '../Theme';\r\nimport { media } from '@glitz/core';\r\nimport KexLink from '../Shared/KexLink/KexLink';\r\nimport ArrowLeftIconPrimary from '../Shared/Icons/ArrowLeftIconPrimary';\r\nimport { useAppSettingsData } from '../Shared/AppSettingsProvider/AppSettingsProvider';\r\nimport ProductImagesContainer from './ProductImagesContainer';\r\nimport AttributeArea from './AttributeArea';\r\n\r\nfunction PlanogramProductPage() {\r\n const {\r\n translations: { 'productPage/backToPlanogram': backToPlanogramLabel },\r\n placeholderImages: { planogramPlaceholder: planogramPlaceholderImg },\r\n } = useAppSettingsData();\r\n\r\n const {\r\n code,\r\n planogramUrl,\r\n variationCollection,\r\n planogramVariantList,\r\n shortDescription,\r\n } = useCurrentPage();\r\n\r\n const planogram = variationCollection && variationCollection[0];\r\n\r\n return (\r\n
\r\n \r\n \r\n {backToPlanogramLabel}\r\n \r\n
\r\n \r\n {planogram.image ? (\r\n \r\n \r\n \r\n ) : (\r\n \r\n \r\n \r\n )}\r\n \r\n \r\n
\r\n
\r\n );\r\n}\r\n\r\nconst BackLinkWrapper = styled.div({\r\n position: 'absolute',\r\n top: theme.desktopHeaderHeight,\r\n left: 0,\r\n right: 0,\r\n margin: { x: 'auto' },\r\n maxWidth: theme.screenMaxWidth,\r\n width: '100%',\r\n paddingTop: '18px',\r\n alignItems: 'center',\r\n display: 'flex',\r\n paddingLeft: '32px',\r\n lineHeight: 1.33,\r\n letterSpacing: 0.45,\r\n});\r\n\r\nconst ArrowLeftIcon = styled(ArrowLeftIconPrimary, {\r\n fill: theme.linkColor,\r\n marginRight: theme.spacing(4),\r\n});\r\n\r\nconst BackLink = styled(KexLink, {\r\n fontSize: theme.gamma,\r\n color: theme.linkColor,\r\n cursor: 'pointer',\r\n textDecoration: 'underline',\r\n});\r\n\r\nconst Section = styled.section({\r\n backgroundColor: theme.primaryBackground,\r\n maxWidth: '100%',\r\n position: 'relative',\r\n margin: { top: theme.spacing(16), bottom: theme.spacing(16) },\r\n padding: { x: theme.large },\r\n ...media(theme.mediaQuery.mediaMinSmall, {\r\n padding: { x: theme.great },\r\n }),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n margin: { top: theme.spacing(13), bottom: theme.spacing(32) },\r\n }),\r\n});\r\n\r\nconst Top = styled.div({\r\n width: '100%',\r\n ...media(theme.mediaQuery.mediaMinHuge, {\r\n display: 'grid',\r\n gridTemplateColumns: '1fr 1fr',\r\n }),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n display: 'grid',\r\n gridTemplateColumns: '1fr 1fr',\r\n gridGap: theme.massive,\r\n }),\r\n});\r\n\r\nconst ProductImage = styled.div({\r\n maxWidth: '100%',\r\n ...media(theme.mediaQuery.mediaMinMedium, {\r\n gridColumn: {\r\n start: 1,\r\n end: 3,\r\n },\r\n }),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n gridColumn: {\r\n start: 1,\r\n end: 1,\r\n },\r\n }),\r\n});\r\n\r\nconst ModalProductImage = styled.img({\r\n height: '100%',\r\n width: '100%',\r\n objectFit: 'contain',\r\n});\r\n\r\nexport default PlanogramProductPage;\r\n","import React from 'react';\r\nimport { styled } from '@glitz/react';\r\nimport PlanogramPageModel from './Models/PlanogramPageModel.interface';\r\nimport { useAppSettingsData } from '../Shared/AppSettingsProvider/AppSettingsProvider';\r\nimport useCurrentPage from '../Shared/Hooks/useCurrentPage';\r\nimport { theme } from '../Theme';\r\nimport { media, pseudo } from '@glitz/core';\r\nimport PlanogramRowGrid from './PlanogramRowGrid';\r\nimport useMedia from '../Shared/Hooks/useMedia';\r\nimport { mediaQuery } from '../Theme/mediaQueries';\r\nimport MyPlanogramsComponent from '../../Features/MyPlanogramsPage/MyPlanogramsComponent';\r\nimport ArrowLeftIconPrimary from '../Shared/Icons/ArrowLeftIconPrimary';\r\nimport KexLink from '../Shared/KexLink/KexLink';\r\nimport PlanogramProductPage from './PlanogramProductPage';\r\n\r\nfunction PlanogramPage() {\r\n const {\r\n pageTitle,\r\n planogramProductList,\r\n variationCollection,\r\n isProductPage,\r\n isSeasonal,\r\n } = useCurrentPage();\r\n\r\n const {\r\n translations: {\r\n 'planogramPage/clickAndOrderTitle': infoTitle,\r\n 'planogramPage/clickAndOrderInfo': infoText,\r\n 'planogramPage/backToAllPlanograms': backToAllLinkLabel,\r\n 'planogramPage/backToAllSeasonalPlanograms': backToAllSeasonalLinkLabel,\r\n },\r\n staticPages: { myPlanogramsPage, myPlanogramsSeasonalPage },\r\n } = useAppSettingsData();\r\n\r\n const isDesktop = useMedia(theme.mediaQuery.mediaMinLarge);\r\n const planogramId = variationCollection[0].articleNumber;\r\n\r\n const hasMoreThanThreeColumns = () => {\r\n let useScroll = false;\r\n planogramProductList.forEach((element, index) => {\r\n if (element.length <= 3) return false;\r\n element.map(product => {\r\n if (product.columnPosition > 3) {\r\n useScroll = true;\r\n return useScroll;\r\n }\r\n });\r\n });\r\n return useScroll;\r\n };\r\n\r\n const useScroll = hasMoreThanThreeColumns() && !isDesktop;\r\n\r\n return (\r\n
\r\n {!isProductPage ? (\r\n <>\r\n \r\n \r\n \r\n {isSeasonal ? backToAllSeasonalLinkLabel : backToAllLinkLabel}\r\n \r\n \r\n \r\n \r\n {pageTitle}\r\n {infoTitle}\r\n {infoText}\r\n \r\n \r\n \r\n {planogramProductList.map((productListRow, index) => (\r\n \r\n ))}\r\n \r\n \r\n \r\n \r\n \r\n ) : (\r\n \r\n )}\r\n
\r\n );\r\n}\r\n\r\nconst BackLinkWrapper = styled.div({\r\n position: 'absolute',\r\n top: theme.desktopHeaderHeight,\r\n left: 0,\r\n right: 0,\r\n margin: { x: 'auto' },\r\n maxWidth: theme.screenMaxWidth,\r\n width: '100%',\r\n paddingTop: '18px',\r\n alignItems: 'center',\r\n display: 'flex',\r\n paddingLeft: '32px',\r\n lineHeight: 1.33,\r\n letterSpacing: 0.45,\r\n ...media(theme.mediaQuery.mediaMaxLarge, {\r\n paddingTop: '0px',\r\n }),\r\n ...media(theme.mediaQuery.mediaMaxMedium, {\r\n paddingLeft: '20px',\r\n }),\r\n});\r\n\r\nconst ArrowLeftIcon = styled(ArrowLeftIconPrimary, {\r\n fill: theme.linkColor,\r\n marginRight: theme.spacing(4),\r\n});\r\n\r\nconst BackLink = styled(KexLink, {\r\n fontSize: theme.gamma,\r\n color: theme.linkColor,\r\n cursor: 'pointer',\r\n textDecoration: 'underline',\r\n});\r\n\r\nconst PageWrapper = styled.div({\r\n backgroundColor: theme.primaryBackground,\r\n paddingTop: theme.spacing(14),\r\n paddingBottom: theme.spacing(19),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n paddingTop: theme.spacing(18),\r\n paddingBottom: theme.spacing(20),\r\n }),\r\n});\r\n\r\nconst TopContent = styled.div({\r\n maxWidth: theme.maxWidthContentPage,\r\n padding: { x: '7.5px' },\r\n margin: { x: 'auto' },\r\n marginBottom: theme.spacing(13),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n marginBottom: theme.spacing(11),\r\n }),\r\n});\r\n\r\nconst InfoTitle = styled.h2({\r\n fontSize: '22px',\r\n lineHeight: '26.4px',\r\n color: theme.black,\r\n marginBottom: theme.spacing(2),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n fontSize: theme.zeta,\r\n lineHeight: '33.6px',\r\n marginBottom: theme.spacing(1),\r\n }),\r\n});\r\n\r\nconst InfoText = styled.p({ fontSize: theme.gamma, lineHeight: '25.6px' });\r\n\r\nconst Heading = styled.h1({\r\n maxWidth: theme.maxWidthSmall,\r\n font: { size: theme.psi, weight: theme.fontWeight.bold },\r\n color: theme.black,\r\n lineHeight: '31.2px',\r\n marginBottom: theme.spacing(5),\r\n ...media(theme.mediaQuery.mediaMinLarge, {\r\n font: { size: '32px' },\r\n marginTop: theme.spacing(5),\r\n marginBottom: theme.spacing(8),\r\n lineHeight: '40px',\r\n }),\r\n});\r\n\r\nconst GridContainer = styled.div({\r\n borderSpacing: '10px',\r\n margin: { x: '7.5px' },\r\n marginBottom: '65px',\r\n maxWidth: '100%',\r\n ...media(mediaQuery.mediaMinMedium, {\r\n margin: { x: 'auto' },\r\n }),\r\n ...media(mediaQuery.mediaMaxMedium, {\r\n ...pseudo([':nth-child(n)[data-usescroll=\"true\"]'], {\r\n overflowX: 'scroll',\r\n paddingBottom: theme.spacing(5),\r\n ...pseudo('::-webkit-scrollbar', {\r\n height: '12px',\r\n borderRadius: '100px',\r\n backgroundColor: theme.white,\r\n border: {\r\n xy: {\r\n style: 'solid',\r\n width: theme.tiny,\r\n color: theme.veryLightGray,\r\n },\r\n },\r\n }),\r\n ...pseudo('::-webkit-scrollbar-thumb', {\r\n width: '60px',\r\n borderRadius: '100px',\r\n backgroundColor: theme.primaryBlue,\r\n }),\r\n }),\r\n }),\r\n ...media(mediaQuery.mediaMinLarge, {\r\n maxWidth: '900px',\r\n margin: { x: 'auto' },\r\n overflowX: 'unset',\r\n }),\r\n});\r\n\r\nconst Wrapper = styled.div({\r\n padding: { xy: '10px' },\r\n margin: { x: 'auto' },\r\n backgroundColor: theme.white,\r\n ...pseudo([':nth-child(n)[data-usescroll=\"true\"]'], {\r\n width: 'fit-content',\r\n }),\r\n ...media(mediaQuery.mediaMinMedium, {\r\n width: 'fit-content',\r\n }),\r\n ...media(mediaQuery.mediaMinLarge, {\r\n overflowX: 'unset',\r\n width: '100%',\r\n }),\r\n});\r\n\r\nexport default PlanogramPage;\r\n","import React from 'react';\r\nimport { styled, StyledProps } from '@glitz/react';\r\nimport { theme } from '../../Theme';\r\n\r\nfunction ArrowLeftIconPrimary({ compose }: StyledProps) {\r\n return (\r\n \r\n \r\n \r\n );\r\n}\r\n\r\nexport default styled(ArrowLeftIconPrimary);\r\n","import React from 'react';\r\nimport { styled, theme } from '../../Theme';\r\nimport { pseudo } from '@glitz/core';\r\n\r\ntype DotsType = {\r\n color?: string;\r\n lineHeight?: string;\r\n};\r\n\r\nfunction Dots({ color, lineHeight }: DotsType) {\r\n return (\r\n <>\r\n \r\n .\r\n \r\n \r\n .\r\n \r\n \r\n .\r\n \r\n \r\n );\r\n}\r\n\r\nexport default Dots;\r\n\r\n// const Wrapper = styled.div({});\r\n\r\nconst Dot = styled.div({\r\n display: 'inline-block',\r\n font: { size: theme.massive },\r\n animationName: {\r\n '0%': {\r\n opacity: '.2',\r\n },\r\n '20%': {\r\n opacity: '1',\r\n },\r\n '100%': {\r\n opacity: '.2',\r\n },\r\n },\r\n animationDuration: theme.timings.sevenFifths,\r\n animationIterationCount: 'infinite',\r\n animationFillMode: 'both',\r\n ...pseudo(':nth-child(2)', {\r\n animationDelay: theme.timings.oneFifth,\r\n }),\r\n ...pseudo(':nth-child(3)', {\r\n animationDelay: theme.timings.twoFifths,\r\n }),\r\n});\r\n"],"sourceRoot":""}