{"version":3,"sources":["webpack:///./Avensia.Common/Features/Shared/SharedComponents/atoms/Breadcrumbs.tsx"],"names":["BaseWrap","div","textDecoration","display","flexDirection","padding","xy","VerticalWrap","transform","justifyContent","writingMode","alignItems","x","HorizontalWrap","flexWrap","overflowX","overflowY","scrollbarWidth","ListWrap","ListItem","gap","BreadCrumbLink","whiteSpace","props","vertical","breadcrumbs","white","opaqueColor","isCompact","isProductPage","monochrome","black","halfTransparentColor","rgbaFilters","white50","black50","length","containerRef","current","scrollLeft","offsetWidth","Wrapper","ref","itemType","itemScope","map","crumb","index","array","key","css","color","itemProp","to","url","title","text","content","String","window","location","protocol","host"],"mappings":"wJAQMA,EAAW,IAAOC,IAAI,CAC1BC,eAAgB,OAChBC,QAAS,OACTC,cAAe,MACfC,QAAS,CAAEC,GAAI,SAGXC,EAAe,YAAOP,IAAQ,GAClCQ,UAAW,iBACXC,eAAgB,SAChBC,YAAa,cACbC,WAAY,UACX,UAAY,KAAuB,CAClCN,QAAS,CACPO,EAAG,S,IAKHC,EAAiB,YAAOb,IAAQ,GACpCW,WAAY,SACZG,SAAU,SACVC,UAAW,OACXC,UAAW,SACXC,eAAgB,OAEhB,qBAAsB,OACtB,sBAAuB,CACrBd,QAAS,UAEV,UAAY,KAAuB,CAClCE,QAAS,CACPO,EAAG,S,IAKHM,EAAW,IAAOjB,IAAI,CAC1BE,QAAS,OACTQ,WAAY,WAGRQ,EAAW,IAAOlB,IAAI,CAC1BE,QAAS,OACTiB,IAAK,MACLT,WAAY,WAGRU,EAAiB,YAAO,IAAM,CAClCC,WAAY,SACZpB,eAAgB,OAChBG,QAAS,CAAEC,GAAI,SAiFF,IA9EY,SAACiB,G,QAClBC,EAAA,EAAAA,SAAUC,EAAA,EAAAA,YAAaC,EAAA,EAAAA,MACzBC,GADgC,EAAAC,UAAW,EAAAC,cAC7BH,EAAQ,IAAaI,WAAWJ,MAAQ,IAAaI,WAAWC,OAC9EC,EAAuBN,EACzB,IAAaO,YAAYC,QACzB,IAAaD,YAAYE,QAE7B,IAAe,QAAX,EAAAV,SAAW,eAAEW,QAAS,EACxB,OAAO,qCAGT,IAAMC,EAAe,iBAAuB,MAE5C,qBAAU,WACR,OAAIb,EACK,cAENa,GAAyC,OAAzBA,EAAaC,UAC9BD,EAAaC,QAAQC,WAAaF,EAAaC,QAAQE,aAGlD,gBACN,CAACf,IACJ,IAAMgB,EAAUjB,EAAWjB,EAAeM,EAC1C,OACE,kBAAC4B,EAAO,CAACC,IAAKL,GACZ,kBAACnB,EAAQ,CACPyB,SAAS,mCACTC,WAAS,GAEC,QAFD,EAEVnB,SAAW,eAAEoB,KAAI,SAACC,EAAOC,EAAOC,GAC/B,OACE,kBAAC7B,EAAQ,CAAC8B,IAAKF,GACF,IAAVA,IACEvB,EACC,kBAAC,IAAS,CACR0B,IAAK,CACHC,MAAOJ,IAAUC,EAAMZ,OAAS,EAAIT,EAAcK,KAItD,kBAAC,IAAU,CACXkB,IAAK,CACHC,MAAOJ,IAAUC,EAAMZ,OAAS,EAAIT,EAAcK,MAMxD,yBACEiB,IAAKF,EACLK,SAAS,kBACPT,SAAS,6BACTC,WAAS,GAEX,kBAACvB,EAAc,CACb6B,IAAK,CACHC,MAAOJ,IAAUC,EAAMZ,OAAS,EAAIT,EAAcK,GAEpDqB,GAAIP,EAAMQ,IACVC,MAAOT,EAAMU,KACbP,IAAKF,EACLK,SAAS,QAET,kBAAC,IAAS,KAAEN,EAAMU,OAEpB,0BAAMJ,SAAS,WAAWK,QAASC,OAAOX,EAAQ,KAClD,0BAAMK,SAAS,OAAOK,QAASX,EAAMU,OACrC,0BAAMJ,SAAS,MAAMK,QAAYE,OAAOC,SAASC,SAAQ,KAAKF,OAAOC,SAASE,KAAOhB,EAAMQ","file":"assets/4.chunk.bcff2483856d97cc170f.js","sourcesContent":["import { styled } from '@glitz/react';\r\nimport React, { useRef, useEffect }  from 'react';\r\nimport Link from 'Shared/Link';\r\nimport { TextLabel } from './Typography';\r\nimport { Down12x12, Right12x12 } from 'Shared/Icons/Chevron';\r\nimport BreadcrumbsViewModel from 'Shared/Breadcrumbs/BreadcrumbsViewModel.type';\r\nimport * as style from 'Shared/Style';\r\n\r\nconst BaseWrap = styled.div({\r\n  textDecoration: 'none',\r\n  display: 'flex',\r\n  flexDirection: 'row',\r\n  padding: { xy: '0px' },\r\n})\r\n\r\nconst VerticalWrap = styled(BaseWrap, {\r\n  transform: 'rotate(180deg)',\r\n  justifyContent: 'center',\r\n  writingMode: 'vertical-rl',\r\n  alignItems: 'start',\r\n  ['@media ' + style.mediaUpToLarge]: {\r\n    padding: {\r\n      x: '12px'\r\n    }\r\n  },\r\n})\r\n\r\nconst HorizontalWrap = styled(BaseWrap, {\r\n  alignItems: 'center',\r\n  flexWrap: 'nowrap',\r\n  overflowX: 'auto',\r\n  overflowY: 'hidden',\r\n  scrollbarWidth: 'none',\r\n  //@ts-ignore\r\n  '-ms-overflow-style': 'none',\r\n  '::-webkit-scrollbar': {\r\n    display: 'none'\r\n  },\r\n  ['@media ' + style.mediaUpToLarge]: {\r\n    padding: {\r\n      x: '12px'\r\n    }\r\n  },\r\n})\r\n\r\nconst ListWrap = styled.div({\r\n  display: 'flex',\r\n  alignItems: 'center',\r\n})\r\n\r\nconst ListItem = styled.div({\r\n  display: 'flex',\r\n  gap: '2px',\r\n  alignItems: 'center',\r\n})\r\n\r\nconst BreadCrumbLink = styled(Link, {\r\n  whiteSpace: 'nowrap',\r\n  textDecoration: 'none',\r\n  padding: { xy: '0px' },\r\n})\r\n\r\nexport const Breadcrumbs = (props: { breadcrumbs: BreadcrumbsViewModel[]; vertical?: boolean; white?: boolean, isProductPage?: boolean, isCompact?: boolean }) => {\r\n  const { vertical, breadcrumbs, white, isCompact, isProductPage } = props;\r\n  const opaqueColor = white ? style.colors.monochrome.white : style.colors.monochrome.black;\r\n  const halfTransparentColor = white\r\n    ? style.colors.rgbaFilters.white50\r\n    : style.colors.rgbaFilters.black50;\r\n\r\n  if (breadcrumbs?.length < 1) {\r\n    return <></>;\r\n  }\r\n\r\n  const containerRef = useRef<HTMLDivElement>(null)\r\n\r\n  useEffect(() => {\r\n    if (vertical) {\r\n      return () => {}\r\n    }\r\n    if(containerRef && containerRef.current !== null) {\r\n      containerRef.current.scrollLeft = containerRef.current.offsetWidth; \r\n    }\r\n\r\n    return () => {} \r\n  }, [breadcrumbs])\r\n  const Wrapper = vertical ? VerticalWrap : HorizontalWrap;\r\n  return (\r\n    <Wrapper ref={containerRef}>\r\n      <ListWrap\r\n        itemType=\"http://schema.org/BreadcrumbList\"\r\n        itemScope\r\n      >\r\n      {breadcrumbs?.map((crumb, index, array) => {\r\n        return (\r\n          <ListItem key={index}>\r\n            {index !== 0 &&\r\n              (vertical ? (\r\n                <Down12x12 \r\n                  css={{\r\n                    color: index === array.length - 1 ? opaqueColor : halfTransparentColor,\r\n                  }}\r\n                />\r\n              ) : (\r\n                <Right12x12 \r\n                css={{\r\n                  color: index === array.length - 1 ? opaqueColor : halfTransparentColor,\r\n                }}\r\n                />\r\n              )\r\n              )\r\n            }\r\n            <div\r\n              key={index}\r\n              itemProp=\"itemListElement\"\r\n                itemType=\"http://schema.org/ListItem\"\r\n                itemScope\r\n            >\r\n              <BreadCrumbLink\r\n                css={{\r\n                  color: index === array.length - 1 ? opaqueColor : halfTransparentColor,\r\n                }}\r\n                to={crumb.url}\r\n                title={crumb.text}\r\n                key={index}\r\n                itemProp=\"item\" \r\n              >\r\n                <TextLabel>{crumb.text}</TextLabel>  \r\n              </BreadCrumbLink>\r\n              <meta itemProp=\"position\" content={String(index + 1)} />\r\n              <meta itemProp=\"name\" content={crumb.text} />\r\n              <meta itemProp=\"url\" content={`${window.location.protocol}//${window.location.host}${crumb.url}`} />\r\n            </div>\r\n          </ListItem>\r\n        );\r\n      })}\r\n      </ListWrap>\r\n    </Wrapper>\r\n  );\r\n};\r\n\r\nexport default Breadcrumbs;\r\n"],"sourceRoot":""}