{"version":3,"sources":["webpack:///./Avensia.Common/Features/Shared/RotatedHeader.tsx","webpack:///./Avensia.Common/Features/Shared/Blocks/Product/ProductListBlock.tsx"],"names":["Wrap","div","alignSelf","display","whiteSpace","Heading","h2","fontStyle","fontWeight","fontSize","lineHeight","textTransform","margin","xy","render","label","isCompact","css","transform","writingMode","Component","SingleWrap","padding","y","NavWrap","position","LabelWrap","justifyContent","SwiperWrap","overflow","ProductsBlock","connect","state","currentBreakpoint","trackingListName","undefined","currentPage","meta","title","props","items","displaySingleProductOnEachSlide","prevDisabled","setPrevDisabled","nextDisabled","setNextDisabled","isMobile","swiperRef","className","color","monochrome","mediumGrey","black","onClick","current","slidePrev","products","numberOfProductsVisible","cellSpacing","freeMode","showNav","sliderRef","onSlideChange","swiper","isBeginning","isEnd","slideNext","alternativeNav","listHeading","showSwirl"],"mappings":"sKAUMA,EAAO,IAAOC,IAAI,CACtBC,UAAW,MACXC,QAAS,OACTC,WAAY,WAGRC,EAAU,IAAOC,GAAG,CACxBH,QAAS,QACTI,UAAW,SACXC,WAAY,IACZC,SAAU,OACVC,WAAY,OACZC,cAAe,YACfC,OAAQ,CAAEC,GAAI,KAGhB,2B,+CAgBA,OAhB4B,iBAC1B,YAAAC,OAAA,WACQ,iBAAEC,EAAA,EAAAA,MAAO,EAAAC,UAEf,OACE,kBAAChB,EAAI,KACH,kBAACK,EAAO,CACNY,IAAK,CACHC,UAAW,iBACXC,YAAa,gBAEdJ,KAKX,EAhBA,CAA4B,IAAMK,WAkBnB,cAAO,G,6EClBtB,IAAMC,EAAa,YAAO,IAAU,CAClCC,QAAS,CAAEC,EAAG,WAGV,EAAO,YAAO,MAAQ,GAC1BD,QAAS,CAAEC,EAAG,UACb,UAAY,KAAsB,CACjCD,QAAS,CAAEC,EAAG,U,IAIZC,EAAU,IAAOvB,IAAI,CACzBwB,SAAU,aAGNC,EAAY,IAAOzB,IAAI,CAC3B0B,eAAgB,WAGZC,EAAa,IAAO3B,IAAI,CAC5B4B,SAAU,WAGCC,EAAgB,OAAAC,EAAA,IAC3B,SAAAC,GAAS,OACPC,kBAAmBD,EAAMC,kBACzBC,iBAAuCC,MAArBH,EAAMI,aAAsDD,MAA1BH,EAAMI,YAAYC,KAAoBL,EAAMI,YAAYC,KAAKC,MAAQ,MAHhG,EAK3B,SAACC,GACO,IAAAN,EAAA,EAAAA,kBAAmBO,EAAA,EAAAA,MAAOzB,EAAA,EAAAA,MAAO0B,EAAA,EAAAA,gCACnC,wCAACC,EAAA,KAAcC,EAAA,KACf,wCAACC,EAAA,KAAcC,EAAA,KACfC,EAAW,YAAUb,GACrBc,EAAY,iBAAY,MAqB9B,OAJA,qBAAU,WACR,YAAmBR,EAAMC,MAAOD,EAAML,oBACrC,KAEEY,GAAYL,EAEb,kBAACpB,EAAU,CAAC2B,UAAU,YACpB,kBAACxB,EAAO,CAACwB,UAAW,YAAkB,EAAG,EAAG,YAA2B,KACrE,kBAAC,IAAS,CACRhC,UAAW8B,EACXG,MAAOP,EAAe,IAAaQ,WAAWC,WAAa,IAAaD,WAAWE,MACnFC,QAAS,WAAM,OAAAN,EAAUO,QAAQC,gBAGrC,kBAAC7B,EAAS,CAACsB,UAAW,YAAkB,EAAG,EAAG,YAA2B,KACvE,kBAAC,EAAa,CAACjC,MAAOA,EAAOC,UAAW8B,KAE1C,kBAAClB,EAAU,CAACoB,UAAW,YAAkB,EAAG,EAAG,YAA2B,KACxE,kBAAC,IAAe,CACdQ,SAAUhB,EACViB,wBAAyB,EACzBC,YAAa,EACb1C,UAAW8B,EACXa,UAAU,EACVC,SAAS,EACTC,UAAWd,EACXe,cAzCU,SAACC,GACfA,IACFpB,GAAgB,GAChBE,GAAgB,GAEZkB,EAAOC,aACTrB,GAAgB,GAGdoB,EAAOE,OACTpB,GAAgB,QAkChB,kBAACrB,EAAO,CAACwB,UAAW,YAAkB,EAAG,EAAG,YAA2B,MACrE,kBAAC,IAAU,CACThC,UAAW8B,EACXG,MAAOL,EAAe,IAAaM,WAAWC,WAAa,IAAaD,WAAWE,MACnFC,QAAS,WAAM,OAAAN,EAAUO,QAAQY,iBAQzC,kBAAC,EAAI,CAAClB,UAAU,YACd,yBAAKA,UAAW,YAAkB,GAAI,GAAI,YAA2B,KACnE,kBAAC,IAAe,CAACQ,SAAUhB,EAAOxB,UAAW8B,EAAUqB,gBAAgB,EAAMP,SAAUd,EAAUsB,YAAarD,EAAOsD,UAAWvB,SAMzH","file":"assets/61.chunk.46ee16a4eddbb9be15fa.js","sourcesContent":["import React from 'react';\r\nimport { styled, StyledProps } from '@glitz/react';\r\n\r\ntype ConnectedPropType = {\r\n  label: string;\r\n  isCompact: boolean;\r\n};\r\n\r\ntype PropType = StyledProps & ConnectedPropType;\r\n\r\nconst Wrap = styled.div({\r\n  alignSelf: 'end',     \r\n  display: 'flex',\r\n  whiteSpace: 'nowrap',\r\n})\r\n\r\nconst Heading = styled.h2({\r\n  display: 'block',\r\n  fontStyle: 'normal',\r\n  fontWeight: 500,\r\n  fontSize: '14px',\r\n  lineHeight: '100%',\r\n  textTransform: 'uppercase',\r\n  margin: { xy: 0 },\r\n})\r\n\r\nclass RotatedHeader extends React.Component<PropType> {\r\n  render() {\r\n    const { label, isCompact } = this.props;\r\n\r\n    return (\r\n      <Wrap>\r\n        <Heading \r\n          css={{\r\n            transform: 'rotate(180deg)',\r\n            writingMode: 'vertical-rl',\r\n        }}>\r\n          {label}\r\n        </Heading>\r\n      </Wrap>\r\n    );\r\n  }\r\n}\r\n\r\nexport default styled(RotatedHeader);\r\n","/**\r\n * @ComponentFor ProductListBlockViewModel\r\n */\r\nimport React, { useEffect, useRef, useState } from 'react';\r\nimport { styled, StyledProps } from '@glitz/react';\r\nimport ProductListBlockViewModelType from './ProductListBlockViewModel.type';\r\nimport connect from 'Shared/connect';\r\nimport { genericImpressions } from 'TrackingInformation';\r\nimport { isCompact } from 'Shared/Viewport';\r\nimport ProductCardList from 'Product/SwipeableList';\r\nimport RotatedHeader from 'Shared/RotatedHeader';\r\nimport { GridWrap } from 'Shared/PageLayout';\r\nimport { createGridClasses, createOffsetGridClassLarge } from 'Shared/grid';\r\nimport * as style from 'Shared/Style';\r\nimport { SwipeLeft, SwipeRight } from 'Shared/SwiperList/SwiperNav';\r\n\r\ntype RequiredPropType = ProductListBlockViewModelType;\r\n\r\ntype ConnectedPropType = {\r\n  currentBreakpoint: number;\r\n  trackingListName: string;\r\n  spacing: boolean;\r\n};\r\n\r\ntype PropType = RequiredPropType & ConnectedPropType & StyledProps;\r\n\r\nconst SingleWrap = styled(GridWrap, {\r\n  padding: { y: '120px' }\r\n})\r\n\r\nconst Wrap = styled(GridWrap, {\r\n  padding: { y: '80px' },\r\n  ['@media ' + style.mediaMinLarge]: {\r\n    padding: { y: '120px' }\r\n  },\r\n})\r\n\r\nconst NavWrap = styled.div({\r\n  position: 'relative'\r\n})\r\n\r\nconst LabelWrap = styled.div({\r\n  justifyContent: 'center',\r\n})\r\n\r\nconst SwiperWrap = styled.div({\r\n  overflow: 'hidden'\r\n})\r\n\r\nexport const ProductsBlock = connect(\r\n  state => ({\r\n    currentBreakpoint: state.currentBreakpoint,\r\n    trackingListName: state.currentPage != undefined && state.currentPage.meta != undefined ? state.currentPage.meta.title : '',\r\n  }),\r\n)((props: PropType & { currentBreakpoint: number }) => {\r\n  const { currentBreakpoint, items, label, displaySingleProductOnEachSlide } = props;\r\n  const [prevDisabled, setPrevDisabled] = useState(true);\r\n  const [nextDisabled, setNextDisabled] = useState(false);\r\n  const isMobile = isCompact(currentBreakpoint);\r\n  const swiperRef = useRef<any>(null);\r\n\r\n  const slideChange = (swiper: any) => {\r\n    if (swiper) {\r\n      setPrevDisabled(false);\r\n      setNextDisabled(false);\r\n\r\n      if (swiper.isBeginning) {\r\n        setPrevDisabled(true);\r\n      }\r\n\r\n      if (swiper.isEnd) {\r\n        setNextDisabled(true);\r\n      }\r\n    }\r\n  }\r\n\r\n  useEffect(() => {\r\n    genericImpressions(props.items, props.trackingListName);\r\n  }, []);\r\n\r\n  if (!isMobile && displaySingleProductOnEachSlide) {\r\n    return (\r\n      <SingleWrap className='grid wsb'>\r\n        <NavWrap className={createGridClasses(0, 1, createOffsetGridClassLarge(3))}>\r\n          <SwipeLeft\r\n            isCompact={isMobile}\r\n            color={prevDisabled ? style.colors.monochrome.mediumGrey : style.colors.monochrome.black}\r\n            onClick={() => swiperRef.current.slidePrev()}\r\n          />\r\n        </NavWrap>\r\n        <LabelWrap className={createGridClasses(0, 1, createOffsetGridClassLarge(4))}>\r\n          <RotatedHeader label={label} isCompact={isMobile} />\r\n        </LabelWrap>\r\n        <SwiperWrap className={createGridClasses(0, 4, createOffsetGridClassLarge(5))}>\r\n          <ProductCardList\r\n            products={items}\r\n            numberOfProductsVisible={1}\r\n            cellSpacing={0}\r\n            isCompact={isMobile}\r\n            freeMode={false}\r\n            showNav={false}\r\n            sliderRef={swiperRef}\r\n            onSlideChange={slideChange}\r\n          />\r\n        </SwiperWrap>\r\n        <NavWrap className={createGridClasses(0, 1, createOffsetGridClassLarge(10))}>\r\n          <SwipeRight\r\n            isCompact={isMobile}\r\n            color={nextDisabled ? style.colors.monochrome.mediumGrey : style.colors.monochrome.black}\r\n            onClick={() => swiperRef.current.slideNext()}\r\n          />\r\n        </NavWrap>\r\n      </SingleWrap>\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        <ProductCardList products={items} isCompact={isMobile} alternativeNav={true} showNav={!isMobile} listHeading={label} showSwirl={isMobile} />\r\n      </div>\r\n    </Wrap>\r\n  );\r\n});\r\n\r\nexport default ProductsBlock;"],"sourceRoot":""}