{"version":3,"sources":["webpack:///./Avensia.Common/Features/CustomerService/components/ListFaqBlockAccordion.tsx","webpack:///./Avensia.Common/Features/CustomerService/CustomerServiceMainPageViewModel.tsx"],"names":["props","renderAccordionHeader","heading","index","AccordionHeader","HeaderText","css","fontWeight","state","accordionItems","isOpen","ViewMore","transform","onToggle","newaccordionItems","map","item","idx","this","setState","UNSAFE_componentWillMount","items","length","i","push","render","CustomAccordion","key","header","body","for","text","Component","div","alignItems","display","minHeight","justifyContent","h5","flexBasis","textAlign","letterSpacing","padding","y","Accordion","backgroundColor","marginBottom","paddingLeft","Add","property","duration","willChange","timingFunction","MainContent","appearance","Narrow","PaddedContentWrapper","BreadCrumbsWrapper","breadcrumbs","breadCrumbs","Heading","page","pageHeader","LinkBlockContentArea","linkBlockHolderBlockArea","FaqHeader","faqHeader","Viewport","isCompact","parseLeftBlock","faqBlockAreaLeft","parseRightBlock","faqBlockAreaRight","faqLeftItems","faqRightItems","faqItems","concat","ListFaqBlockAccordion","layout","OneToOne","ContactUs","contactUsHeader","contactUsText","email","contactUsEmail","paddingBottom","maxWidth","h2","fontSize","x"],"mappings":"qNAmBA,cACE,WAAYA,GAAZ,MACE,YAAMA,IAAM,K,OAed,EAAAC,sBAAwB,SAACC,EAAiBC,GACxC,OACE,kBAACC,EAAe,KACd,kBAACC,EAAU,CAACC,IAAK,CAAEC,WAAY,EAAKC,MAAMC,eAAeN,GAAOO,OAAS,OAAS,WAC/ER,GAEH,kBAACS,EAAQ,CACPL,IAAK,CACHM,UAAW,EAAKJ,MAAMC,eAAeN,GAAOO,OAAS,iBAAmB,iBArBhF,EAAKF,MAAQ,CACXC,eAAgB,I,EAqDtB,OA1DiC,iBAS/B,YAAAI,SAAA,SAASV,GACC,IACFW,EADE,WAAAL,eACiCM,KAAI,SAACC,EAAgBC,GAC5D,OAAAA,IAAQd,EAAQ,2BAAKa,GAAI,CAAEN,QAASM,EAAKN,SAAW,2BAAKM,GAAI,CAAEN,QAAQ,OAEzEQ,KAAKC,SAAS,CAAEV,eAAgBK,KAkBlC,YAAAM,0BAAA,WACE,GAAIF,KAAKlB,MAAMqB,MAAMC,OAAS,EAC5B,IAAK,IAAIC,EAAI,EAAGA,GAAKL,KAAKlB,MAAMqB,MAAMC,OAAQC,IAAK,CACjD,IAAMd,EAAiBS,KAAKV,MAAMC,eAClCA,EAAee,KAAK,CAAErB,MAAOoB,EAAGb,QAAQ,IACxCQ,KAAKC,SAAS,CAAEV,eAAc,MAKpC,YAAAgB,OAAA,sBACE,OACE,6BACGP,KAAKlB,MAAMqB,MAAMN,KAAI,SAACC,EAA4Cb,GAAkB,OACnF,kBAACuB,EAAe,CACdC,IAAK,YAAiBX,EAAKY,QAAUzB,EACrCyB,OAAQ,EAAK3B,sBAAsB,YAAiBe,EAAKY,QAASzB,GAClE0B,KAAM,kBAAC,IAAW,CAACC,IAAKd,EAAKe,OAC7BrB,OAAQ,EAAKF,MAAMC,eAAeN,GAAOO,OAEzCG,SAAU,WAAM,SAAKA,SAASV,WAM1C,EA1DA,CAAiC,IAAM6B,WA4DjC5B,EAAkB,IAAO6B,IAAI,CACjCC,WAAY,SACZC,QAAS,OACTC,UAAW,aAAa,IACxBC,eAAgB,kBAEZhC,EAAa,IAAOiC,GAAG,CAC3BH,QAAS,OACTI,UAAW,MACXC,UAAW,OACXC,cAAe,aAAa,KAC5BC,QAAS,CACPC,EAAG,aAAa,OAIdjB,EAAkB,YAAOkB,EAAA,EAAW,CACxCC,gBAAiB,IACjBC,aAAc,aAAa,IAC3BC,YAAa,aAAa,MAGtBpC,EAAW,YAAOqC,EAAA,EAAK,aAC3Bb,QAAS,OACTI,UAAW,OACR,aAAW,CACZU,SAAU,MACVC,SAAU,MACVC,YAAY,EACZC,eAAgB,WAIL,I,SChDTC,GAFS,uBAxCiB,SAACrD,GAAoB,OACnD,kBAACqD,EAAW,CAACC,WAAY,IAAWC,QAClC,kBAACC,EAAoB,KACnB,kBAACC,EAAkB,KACjB,kBAAC,IAAW,CAACC,YAAa1D,EAAM2D,eAElC,kBAACC,EAAO,KAAE,YAAiB5D,EAAM6D,KAAKC,cAExC,kBAAC,IAAK,KACJ,kBAACC,EAAA,EAAoB,CAAC1C,MAAOrB,EAAM6D,KAAKG,2BACxC,kBAACR,EAAoB,KACnB,kBAACS,EAAS,KAAE,YAAiBjE,EAAM6D,KAAKK,YACxC,kBAACC,EAAA,EAAQ,MACN,SAACC,GACA,IAAMC,EAAiB,YAAiBrE,EAAM6D,KAAKS,kBAC7CC,EAAkB,YAAiBvE,EAAM6D,KAAKW,mBAC9CC,EAAiBJ,EAAiBA,EAAehD,MAAQ,GACzDqD,EAAkBH,EAAkBA,EAAgBlD,MAAQ,GAC5DsD,EAAWF,EAAaG,OAAOF,GAErC,OAAON,EACL,kBAACS,EAAqB,CAACxD,MAAOsD,IAE5B,kBAAC,IAAK,CAACG,OAAQ,IAAOC,UACpB,kBAAC,IAAW,CAACjD,IAAK9B,EAAM6D,KAAKS,mBAC7B,kBAAC,IAAW,CAACxC,IAAK9B,EAAM6D,KAAKW,wBAKvC,kBAACQ,EAAA,EAAS,CACRpD,OAAQ,YAAiB5B,EAAM6D,KAAKoB,iBACpClD,KAAM,YAAiB/B,EAAM6D,KAAKqB,eAClCC,MAAO,YAAiBnF,EAAM6D,KAAKuB,wBASzB,YAAO,IAAM,CAC/BC,cAAe,aAAa,KAC5BC,SAAU,aAAa,SAGnB7B,EAAqB,IAAOxB,MAAG,GACnCO,UAAW,WACV,MAAsB,CACrBA,UAAW,Q,IAIToB,EAAU,IAAO2B,KAAE,GACvBhF,WAAY,SACZiC,UAAW,WACV,MAAsB,CACrBgD,SAAU,IACVhD,UAAW,Q,IAITyB,EAAY,IAAOhC,IAAI,CAC3BuD,SAAU,IACVjF,WAAY,OACZkC,cAAe,aAAa,MAC5BC,QAAS,CAAEC,EAAG,aAAa,OAGvBa,EAAuB,IAAOvB,MAAG,GACrCS,QAAS,CAAE+C,EAAG,aAAa,MAC1B,MAAsB,CACrB/C,QAAS,CAAE+C,EAAG,aAAa,M","file":"assets/47.chunk.d9c83d13e6e8df79ae44.js","sourcesContent":["import React from 'react';\r\nimport { styled } from '@glitz/react';\r\nimport { epiPropertyValue, EpiProperty } from '@avensia/scope-episerver';\r\nimport Add from 'Shared/Icon/Add';\r\nimport Accordion from 'Shared/Accordion';\r\nimport { pixelsToUnit, transition, concrete } from 'Shared/Style';\r\nimport FaqBlockType from 'CustomerService/FaqBlock.type';\r\n\r\ntype PropType = { items: Scope.ContentAreaItem[] };\r\n\r\ntype ItemType = {\r\n  index: number;\r\n  isOpen: boolean;\r\n};\r\n\r\ntype StateType = {\r\n  accordionItems: ItemType[];\r\n};\r\n\r\nclass ListBlockAccordion extends React.Component<PropType, StateType> {\r\n  constructor(props: PropType) {\r\n    super(props);\r\n\r\n    this.state = {\r\n      accordionItems: [],\r\n    };\r\n  }\r\n\r\n  onToggle(index: number) {\r\n    const { accordionItems } = this.state;\r\n    const newaccordionItems = accordionItems.map((item: ItemType, idx: number) =>\r\n      idx === index ? { ...item, isOpen: !item.isOpen } : { ...item, isOpen: false },\r\n    );\r\n    this.setState({ accordionItems: newaccordionItems });\r\n  }\r\n\r\n  renderAccordionHeader = (heading: string, index: number) => {\r\n    return (\r\n      <AccordionHeader>\r\n        <HeaderText css={{ fontWeight: this.state.accordionItems[index].isOpen ? 'bold' : 'normal' }}>\r\n          {heading}\r\n        </HeaderText>\r\n        <ViewMore\r\n          css={{\r\n            transform: this.state.accordionItems[index].isOpen ? 'rotate(135deg)' : 'rotate(0)',\r\n          }}\r\n        />\r\n      </AccordionHeader>\r\n    );\r\n  };\r\n\r\n  UNSAFE_componentWillMount() {\r\n    if (this.props.items.length > 0) {\r\n      for (let i = 0; i <= this.props.items.length; i++) {\r\n        const accordionItems = this.state.accordionItems;\r\n        accordionItems.push({ index: i, isOpen: false });\r\n        this.setState({ accordionItems });\r\n      }\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div>\r\n        {this.props.items.map((item: Scope.ContentAreaItem & FaqBlockType, index: number) => (\r\n          <CustomAccordion\r\n            key={epiPropertyValue(item.header) + index}\r\n            header={this.renderAccordionHeader(epiPropertyValue(item.header), index)}\r\n            body={<EpiProperty for={item.text} />}\r\n            isOpen={this.state.accordionItems[index].isOpen}\r\n            // tslint:disable-next-line:jsx-no-lambda\r\n            onToggle={() => this.onToggle(index)}\r\n          />\r\n        ))}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\nconst AccordionHeader = styled.div({\r\n  alignItems: 'center',\r\n  display: 'flex',\r\n  minHeight: pixelsToUnit(44),\r\n  justifyContent: 'space-between',\r\n});\r\nconst HeaderText = styled.h5({\r\n  display: 'flex',\r\n  flexBasis: '88%',\r\n  textAlign: 'left',\r\n  letterSpacing: pixelsToUnit(0.36),\r\n  padding: {\r\n    y: pixelsToUnit(10),\r\n  },\r\n});\r\n\r\nconst CustomAccordion = styled(Accordion, {\r\n  backgroundColor: concrete,\r\n  marginBottom: pixelsToUnit(10),\r\n  paddingLeft: pixelsToUnit(10),\r\n});\r\n\r\nconst ViewMore = styled(Add, {\r\n  display: 'flex',\r\n  flexBasis: '12%',\r\n  ...transition({\r\n    property: 'all',\r\n    duration: '.2s',\r\n    willChange: true,\r\n    timingFunction: 'ease',\r\n  }),\r\n});\r\n\r\nexport default ListBlockAccordion;\r\n","/**\r\n * @ComponentFor CustomerServiceMainPageViewModel\r\n */\r\n\r\nimport React from 'react';\r\nimport { styled, StyledProps } from '@glitz/react';\r\nimport { epiPropertyValue, EpiProperty } from '@avensia/scope-episerver';\r\nimport { Main, Basic, Appearance, Layout } from 'Shared/PageLayout/index';\r\nimport CustomerServiceMainPageViewModelType from './CustomerServiceMainPageViewModel.type';\r\nimport { pixelsToUnit, minMediumMediaQuery } from 'Shared/Style';\r\nimport { iota, alpha } from 'Shared/Style/typography';\r\nimport BreadCrumbs from 'Shared/Breadcrumbs';\r\nimport LinkBlockContentArea from './components/LinkBlockContentArea';\r\nimport Viewport from 'Shared/Viewport';\r\nimport ListFaqBlockAccordion from './components/ListFaqBlockAccordion';\r\nimport ContactUs from 'CustomerService/components/ContactUs';\r\n\r\ntype BreakpointType = {\r\n  currentBreakpoint: number;\r\n};\r\ntype PropType = CustomerServiceMainPageViewModelType & BreakpointType & StyledProps;\r\n\r\nconst CustomerServiceMainPage = (props: PropType) => (\r\n  <MainContent appearance={Appearance.Narrow}>\r\n    <PaddedContentWrapper>\r\n      <BreadCrumbsWrapper>\r\n        <BreadCrumbs breadcrumbs={props.breadCrumbs} />\r\n      </BreadCrumbsWrapper>\r\n      <Heading>{epiPropertyValue(props.page.pageHeader)}</Heading>\r\n    </PaddedContentWrapper>\r\n    <Basic>\r\n      <LinkBlockContentArea items={props.page.linkBlockHolderBlockArea} />\r\n      <PaddedContentWrapper>\r\n        <FaqHeader>{epiPropertyValue(props.page.faqHeader)}</FaqHeader>\r\n        <Viewport>\r\n          {(isCompact: boolean) => {\r\n            const parseLeftBlock = epiPropertyValue(props.page.faqBlockAreaLeft);\r\n            const parseRightBlock = epiPropertyValue(props.page.faqBlockAreaRight);\r\n            const faqLeftItems = !!parseLeftBlock ? parseLeftBlock.items : [];\r\n            const faqRightItems = !!parseRightBlock ? parseRightBlock.items : [];\r\n            const faqItems = faqLeftItems.concat(faqRightItems);\r\n\r\n            return isCompact ? (\r\n              <ListFaqBlockAccordion items={faqItems} />\r\n            ) : (\r\n                <Basic layout={Layout.OneToOne}>\r\n                  <EpiProperty for={props.page.faqBlockAreaLeft} />\r\n                  <EpiProperty for={props.page.faqBlockAreaRight} />\r\n                </Basic>\r\n              );\r\n          }}\r\n        </Viewport>\r\n        <ContactUs\r\n          header={epiPropertyValue(props.page.contactUsHeader)}\r\n          text={epiPropertyValue(props.page.contactUsText)}\r\n          email={epiPropertyValue(props.page.contactUsEmail)}\r\n        />\r\n      </PaddedContentWrapper>\r\n    </Basic>\r\n  </MainContent>\r\n);\r\n\r\nexport default styled(CustomerServiceMainPage);\r\n\r\nconst MainContent = styled(Main, {\r\n  paddingBottom: pixelsToUnit(100),\r\n  maxWidth: pixelsToUnit(1400),\r\n});\r\n\r\nconst BreadCrumbsWrapper = styled.div({\r\n  textAlign: 'center',\r\n  [minMediumMediaQuery]: {\r\n    textAlign: 'left',\r\n  },\r\n});\r\n\r\nconst Heading = styled.h2({\r\n  fontWeight: 'normal',\r\n  textAlign: 'center',\r\n  [minMediumMediaQuery]: {\r\n    fontSize: alpha,\r\n    textAlign: 'left',\r\n  },\r\n});\r\n\r\nconst FaqHeader = styled.div({\r\n  fontSize: iota,\r\n  fontWeight: 'bold',\r\n  letterSpacing: pixelsToUnit(2.44),\r\n  padding: { y: pixelsToUnit(30) },\r\n});\r\n\r\nconst PaddedContentWrapper = styled.div({\r\n  padding: { x: pixelsToUnit(5) },\r\n  [minMediumMediaQuery]: {\r\n    padding: { x: pixelsToUnit(10) },\r\n  },\r\n});\r\n"],"sourceRoot":""}