{"version":3,"sources":["webpack:///./Avensia.Common/Features/Shared/Blocks/BlockSlider/BlockSliderBlock.tsx"],"names":["Wrap","padding","y","BlockSliderBlock","state","currentBreakpoint","props","isMobile","contentArea","currentBlock","items","modalData","setModalData","className","slidesPerView","slidesPerGroup","spaceBetween","isCompact","showNav","alternativeNav","listHeading","heading","cssMode","showSwirl","map","item","index","key","ItemComponent","componentName","itemComponent","modalIsShown","showModal","hideModal","products"],"mappings":"2FAAA,4D,EAAA,oGAoBMA,EAAO,YAAO,MAAQ,GAC1BC,QAAS,CACPC,EAAG,UAEJ,UAAY,KAAsB,CACjCD,QAAS,CACPC,EAAG,U,IAKIC,EAAmB,aAC9B,SAAAC,GAAS,OACPC,kBAAmBD,EAAMC,qBAFG,EAI9B,SAACC,GAEO,IAAAD,EAAA,EAAAA,kBACFE,EAAW,YAAkBF,GAC7BG,EAAc,YAAiBF,EAAMG,aAAaC,OAClD,gEAACC,EAAA,KAAWC,EAAA,KAalB,OACE,kBAACZ,EAAI,CAACa,UAAU,YACd,yBAAKA,UAAW,YAAkB,GAAI,GAAI,YAA2B,KACnE,6BACE,kBAAC,IAAU,CACTC,cAAeP,EAAW,IAAM,KAChCQ,eAAgBR,EAAW,EAAI,EAC/BS,aAAcT,EAAW,EAAI,GAC7BU,UAAWV,EACXW,SAAUX,EACVY,gBAAgB,EAChBC,YAAa,YAAiBd,EAAMG,aAAaY,SACjDC,SAAS,EACTC,UAAWhB,GAEVC,GAAeA,EAAYE,MAAMc,KAAI,SAACC,EAAMC,GAC3C,OAAO,yBAAKC,IAAKD,EAAOb,UAAU,gBA3BxB,SAACY,GACrB,IAAMG,EAAgB,aAA2BH,EAAKI,eAEtD,MA3ByB,oFA2BrBJ,EAAKI,cACA,kBAACD,EAAa,aAAChB,aAAcA,GAAkBa,IAG/C,kBAACG,EAAa,eAAKH,IAqBfK,CAAcL,QAIrB,kBAAC,IAAqB,CAAClB,SAAUA,EAAUwB,aAAcpB,EAAUqB,UAAWC,UAAW,WAAM,OAAArB,EAAa,CAACoB,WAAW,EAAOE,SAAU,MAAMA,SAAUvB,EAAUuB,iBAO9J","file":"assets/52.chunk.760b0063ff595b7925a5.js","sourcesContent":["/**\r\n * @ComponentFor BlockSliderBlockViewModel\r\n */\r\n\r\nimport connect from 'Shared/connect';\r\nimport React, { useState } from 'react';\r\nimport { isCompact as functionIsCompact } from 'Shared/Viewport';\r\nimport { styled } from '@glitz/react';\r\nimport BlockSliderBlockViewModel from './BlockSliderBlockViewModel.type';\r\nimport QuickShopProductModal from 'Shared/QuickShopProductModal';\r\nimport ProductListItemViewModel from 'Product/ProductListing/ProductListItemViewModel.type';\r\nimport { epiPropertyValue } from '@polarnopyret/scope-episerver';\r\nimport { resolveSyncIfLoadedOrThrow } from '@polarnopyret/scope/index';\r\nimport SwiperList from 'Shared/SwiperList';\r\nimport { GridWrap } from 'Shared/PageLayout';\r\nimport { createGridClasses, createOffsetGridClassLarge } from 'Shared/grid';\r\nimport * as style from 'Shared/Style';\r\n\r\nconst ShopTheLookComponent = \"Avensia.Common.Features.Shared.Blocks.ShopTheLook.ShopTheLookItemBlockViewModel\";\r\n\r\nconst Wrap = styled(GridWrap, {\r\n  padding: {\r\n    y: '80px',\r\n  },\r\n  ['@media ' + style.mediaMinLarge]: {\r\n    padding: {\r\n      y: '120px',\r\n    },\r\n  },\r\n})\r\n\r\nexport const BlockSliderBlock = connect(\r\n  state => ({\r\n    currentBreakpoint: state.currentBreakpoint,\r\n  })\r\n)((props: BlockSliderBlockViewModel & { currentBreakpoint: number }) => {\r\n  \r\n  const { currentBreakpoint } = props;\r\n  const isMobile = functionIsCompact(currentBreakpoint);\r\n  const contentArea = epiPropertyValue(props.currentBlock.items);\r\n  const [modalData, setModalData] = useState<{ showModal: boolean, products: ProductListItemViewModel[] }>({showModal: false, products: []});\r\n  \r\n  const itemComponent = (item: Scope.ContentAreaItem) => {\r\n    const ItemComponent = resolveSyncIfLoadedOrThrow(item.componentName);\r\n    \r\n    if (item.componentName === ShopTheLookComponent) {\r\n      return <ItemComponent setModalData={setModalData} {...item}/>;\r\n    }\r\n    else {\r\n      return <ItemComponent {...item} />;\r\n    }\r\n  }\r\n\r\n  return (\r\n    <Wrap className='grid wsb'>\r\n      <div className={createGridClasses(12, 11, createOffsetGridClassLarge(2))}>\r\n        <div>\r\n          <SwiperList\r\n            slidesPerView={isMobile ? 1.2 : 2.75}\r\n            slidesPerGroup={isMobile ? 1 : 2}\r\n            spaceBetween={isMobile ? 8 : 16}\r\n            isCompact={isMobile}\r\n            showNav={!isMobile}\r\n            alternativeNav={true}\r\n            listHeading={epiPropertyValue(props.currentBlock.heading)}\r\n            cssMode={true}\r\n            showSwirl={isMobile}\r\n          >\r\n            {contentArea && contentArea.items.map((item, index) => {\r\n              return <div key={index} className=\"swiper-slide\">\r\n                {itemComponent(item)}\r\n              </div>;\r\n            })}\r\n          </SwiperList>\r\n          <QuickShopProductModal isMobile={isMobile} modalIsShown={modalData.showModal} hideModal={() => setModalData({showModal: false, products: []})} products={modalData.products} />\r\n        </div>\r\n      </div>\r\n    </Wrap>\r\n  );\r\n});\r\n\r\nexport default BlockSliderBlock;\r\n"],"sourceRoot":""}