{"version":3,"file":"js/AdditionalInfo-Articles-Articles-2f4b961fe5eff2794442.chunk.js","mappings":"+LAcMA,EAAc,SAAHC,GAAA,IAAAC,EAAAD,EACfE,QAAWC,EAAUF,EAAVE,WAAYC,EAAUH,EAAVG,WAAYC,EAAOJ,EAAPI,QAASC,EAASL,EAATK,UAAWC,EAAKN,EAALM,MAAK,OAE5DC,EAAAA,cAAA,OAAKC,UAAU,wEACbD,EAAAA,cAAA,OAAKC,UAAU,OACbD,EAAAA,cAACE,EAAAA,EAAK,CAACC,IAAKL,EAAWM,IAAKL,EAAOM,OAAQ,IAAKC,MAAO,OAEzDN,EAAAA,cAAA,OAAKC,UAAU,wCACbD,EAAAA,cAAA,OAAKC,UAAU,qBACbD,EAAAA,cAAA,OAAKC,UAAU,+BAA+BF,GAC9CC,EAAAA,cAAA,OAAKC,UAAU,qCAAqCJ,IAEtDG,EAAAA,cAAA,OAAKC,UAAU,uDACbD,EAAAA,cAACO,EAAAA,EAAC,CACAC,KAAMb,EACNc,UAAU,OACVC,MAAM,QACNT,UAAU,+CAETL,GAEHI,EAAAA,cAACO,EAAAA,EAAC,CAACC,KAAMb,EAAYe,MAAM,QAAQD,UAAU,QAC3CT,EAAAA,cAACW,EAAAA,GAAc,CAACV,UAAU,2BAI5B,EAqBR,QAlBiB,SAAHW,GAAA,IAAAC,EAAAD,EAAME,UAAajB,EAAOgB,EAAPhB,QAASkB,EAAQF,EAARE,SAAUC,EAAWH,EAAXG,YAAajB,EAAKc,EAALd,MAAK,OACpEC,EAAAA,cAAA,OACEiB,GAAG,gBACHhB,UAAU,uFAEVD,EAAAA,cAAA,OAAKC,UAAU,uHACbD,EAAAA,cAAA,MAAIC,UAAU,yEAAyEF,GACvFC,EAAAA,cAAA,OAAKC,UAAU,8CAA8CJ,GAC7DG,EAAAA,cAAA,OAAKC,UAAU,8CAA8Cc,IAE/Df,EAAAA,cAAA,OAAKC,UAAU,wHACZe,EAAYE,KAAI,SAACxB,GAAmB,OACnCM,EAAAA,cAACT,EAAW,CAACG,QAASA,GAAW,KAGjC,C","sources":["webpack://printivity/./client/app/bundles/App/pages/ProductDetailsPage/AdditionalInfo/Articles/Articles.tsx"],"sourcesContent":["import * as React from 'react';\nimport Image from 'styleguide/components/Image/Image';\nimport A from 'styleguide/components/Links/A';\nimport { IconArrowRight } from 'styleguide/icons';\nimport { ImageBlock, InfoBlock } from 'contexts/AppContext/types';\n\ninterface Props {\n  infoBlock: InfoBlock;\n}\n\ninterface ArticleCardProps {\n  article: ImageBlock;\n}\n\nconst ArticleCard = ({\n  article: { actionLink, actionText, content, imagePath, title },\n}: ArticleCardProps) => (\n  <div className=\"flex min-h-[360px] w-[300px] flex-col justify-between rounded shadow\">\n    <div className=\"p-4\">\n      <Image url={imagePath} alt={title} height={140} width={268} />\n    </div>\n    <div className=\"flex h-full flex-col justify-between\">\n      <div className=\"flex flex-col p-4\">\n        <div className=\"paragraph-bold-desktop mb-5\">{title}</div>\n        <div className=\"paragraph-desktop overflow-hidden\">{content}</div>\n      </div>\n      <div className=\"flex items-center justify-between bg-neutral-50 p-4\">\n        <A\n          href={actionLink}\n          underline=\"none\"\n          color=\"black\"\n          className=\"!font-hvBold !text-xs !font-bold !leading-3\"\n        >\n          {actionText}\n        </A>\n        <A href={actionLink} color=\"black\" underline=\"none\">\n          <IconArrowRight className=\"!h-3 cursor-pointer\" />\n        </A>\n      </div>\n    </div>\n  </div>\n);\n\nconst Articles = ({ infoBlock: { content, content2, imageBlocks, title } }: Props) => (\n  <div\n    id=\"articles-body\"\n    className=\"items-center px-6 py-16 flex max-w-base mx-auto flex-col xl:flex-row justify-center\"\n  >\n    <div className=\"flex flex-col -sm:max-w-[300px] space-y-2 xl:space-y-4 md:max-w-2xl lg:max-w-4xl xl:px-0 xl:self-start mb-4 xl:mb-0\">\n      <h6 className=\"font-hvBold text-lg/6 sm:text-2xl md:text-3xl lg:text-4xl xl:text-3xl\">{title}</h6>\n      <div className=\"font-hvLite text-sm md:text-base leading-4\">{content}</div>\n      <div className=\"font-hvLite text-sm md:text-base leading-4\">{content2}</div>\n    </div>\n    <div className=\"flex flex-col sm:flex-row sm:flex-wrap sm:justify-center lg:justify-normal lg:flex-nowrap md:space-x-6 -sm:space-y-4\">\n      {imageBlocks.map((article: ImageBlock) => (\n        <ArticleCard article={article} />\n      ))}\n    </div>\n  </div>\n);\n\nexport default Articles;\n"],"names":["ArticleCard","_ref","_ref$article","article","actionLink","actionText","content","imagePath","title","React","className","Image","url","alt","height","width","A","href","underline","color","IconArrowRight","_ref2","_ref2$infoBlock","infoBlock","content2","imageBlocks","id","map"],"sourceRoot":""}