{"version":3,"sources":["components/Corporate/CallToAction/StyledCallToAction.ts","components/Corporate/CallToAction/index.tsx"],"names":["CTA","styled","article","theme","spacing","p","callToAction","color","borderRadius","backgroundColor","multiLink","css","mq","SecondaryContainer","Heading","h2","heading_m","PrimaryContainer","heading_l","Description","text_s","mt","TextWrapper","div","LinkWrapper","ml","LinkItem","Link","linkStyle","colors","link","white","LinkButton","button","LinkList","ul","listReset","pr","cssInlineSvg","EditorDiv","EditorText","compose","withEditModeNotice","withEditMode","fields","editMode","data","datasource","noticeEnabled","noticeLevel","noticeMessage","renderTextField","field","markup","jss","value","title","description","validatedLinks","links","filter","l","ctaLink","href","length","component","linkTheme","linkSize","map","key","id","renderLinks"],"mappings":"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","file":"static/js/CallToAction.f7c86fd1.chunk.js","sourcesContent":["import styled, { css } from 'styled-components';\r\n\r\nimport { spacing } from '_utils/props';\r\nimport {\r\n  mq,\r\n  color,\r\n  heading_l,\r\n  heading_m,\r\n  text_s,\r\n  button,\r\n  linkStyle,\r\n  listReset\r\n} from '_utils/styles';\r\nimport { cssInlineSvg } from '_utils/styles/svg';\r\n\r\nimport { Link } from '_utils/components/Corporate';\r\n\r\nimport {\r\n  Primary as PrimaryContainer,\r\n  Secondary as SecondaryContainer\r\n} from '../TwoColumn/StyledTwoColumn';\r\n\r\nexport const CTA = styled.article`\r\n  ${({ theme }) => spacing({ theme, p: 3 })};\r\n  color: ${({ theme }) => theme.callToAction.color};\r\n  border-radius: ${({ theme }) => theme.callToAction.borderRadius}px;\r\n  background-color: ${({ theme }) => theme.callToAction.backgroundColor};\r\n\r\n  ${({ multiLink }) => {\r\n    if (multiLink === false) {\r\n      return css`\r\n        ${mq('sm')} {\r\n          display: flex;\r\n          justify-content: space-between;\r\n          align-items: center;\r\n        }\r\n      `;\r\n    }\r\n  }}\r\n\r\n  ${SecondaryContainer} & {\r\n    display: block;\r\n  }\r\n`;\r\n\r\nexport const Heading = styled.h2`\r\n  ${heading_m};\r\n  margin: 0;\r\n\r\n  ${PrimaryContainer} & {\r\n    ${heading_l}\r\n  }\r\n`;\r\n\r\nexport const Description = styled.p`\r\n  ${text_s};\r\n  margin: 0;\r\n  ${({ theme }) => spacing({ theme, mt: 1 })};\r\n`;\r\n\r\nexport const TextWrapper = styled.div``;\r\n\r\nexport const LinkWrapper = styled.div`\r\n  ${({ theme }) => spacing({ theme, mt: 2 })};\r\n  color: ${color('all.white')};\r\n\r\n  ${PrimaryContainer} & {\r\n    ${({ theme }) => spacing({ theme, mt: 1 })};\r\n\r\n    ${({ multiLink }) => {\r\n      if (multiLink === false) {\r\n        return css`\r\n          ${mq('sm')} {\r\n            ${({ theme }) => spacing({ theme, mt: 0, ml: 3 })};\r\n          }\r\n        `;\r\n      }\r\n    }}\r\n  }\r\n`;\r\n\r\nexport const LinkItem = styled(Link)`\r\n  a {\r\n    ${({ theme }) => linkStyle(theme.colors.link.white)};\r\n\r\n    &:not(.button-primary):not(.button-outline) {\r\n      &:hover,\r\n      &:focus {\r\n        text-decoration: none;\r\n      }\r\n    }\r\n\r\n    path {\r\n      fill: ${color('all.white')};\r\n    }\r\n  }\r\n`;\r\n\r\nexport const LinkButton = styled(Link)`\r\n  a {\r\n    ${button('default', 'white')};\r\n    transition: 200ms;\r\n    min-width: 140px;\r\n\r\n    span {\r\n      top: 1px;\r\n    }\r\n\r\n    path {\r\n      fill: ${color('all.greenTint110')};\r\n    }\r\n  }\r\n`;\r\n\r\nexport const LinkList = styled.ul`\r\n  ${listReset}\r\n\r\n  ${mq('sm')} {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n\r\n    ${SecondaryContainer} & {\r\n      display: block;\r\n    }\r\n  }\r\n\r\n  li {\r\n    position: relative;\r\n    padding-left: 24px;\r\n\r\n    & + & {\r\n      ${({ theme }) => spacing({ theme, mt: 2 })}\r\n    }\r\n\r\n    ${mq('sm')} {\r\n      flex: 0 0 50%;\r\n      max-width: 50%;\r\n      ${({ theme }) => spacing({ theme, mt: 1 })};\r\n\r\n      &:nth-child(2n + 1) {\r\n        ${({ theme }) => spacing({ theme, pr: 3 })};\r\n      }\r\n\r\n      ${SecondaryContainer} & {\r\n        max-width: 100%;\r\n        padding-right: 0;\r\n      }\r\n    }\r\n\r\n    &:before {\r\n      content: '';\r\n      position: absolute;\r\n      top: 10px;\r\n      left: 0;\r\n      display: block;\r\n      width: 12px;\r\n      height: 12px;\r\n      background-image: ${cssInlineSvg(\r\n        `<svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M11.7667 5.68333C11.727 5.58104 11.6675 5.48759 11.5917 5.40833L6.59166 0.408334C6.51396 0.330635 6.42172 0.269001 6.3202 0.226951C6.21868 0.184901 6.10987 0.163258 5.99999 0.163258C5.77807 0.163258 5.56524 0.251414 5.40832 0.408334C5.33062 0.486033 5.26899 0.578275 5.22694 0.679793C5.18489 0.781311 5.16325 0.890118 5.16325 1C5.16325 1.22192 5.2514 1.43475 5.40832 1.59167L8.99166 5.16667H0.99999C0.778976 5.16667 0.567015 5.25447 0.410734 5.41075C0.254454 5.56703 0.166656 5.77899 0.166656 6C0.166656 6.22101 0.254454 6.43298 0.410734 6.58926C0.567015 6.74554 0.778976 6.83333 0.99999 6.83333H8.99166L5.40832 10.4083C5.33022 10.4858 5.26822 10.578 5.22591 10.6795C5.18361 10.7811 5.16182 10.89 5.16182 11C5.16182 11.11 5.18361 11.2189 5.22591 11.3205C5.26822 11.422 5.33022 11.5142 5.40832 11.5917C5.48579 11.6698 5.57796 11.7318 5.67951 11.7741C5.78106 11.8164 5.88998 11.8382 5.99999 11.8382C6.11 11.8382 6.21892 11.8164 6.32047 11.7741C6.42202 11.7318 6.51419 11.6698 6.59166 11.5917L11.5917 6.59167C11.6675 6.51241 11.727 6.41896 11.7667 6.31667C11.85 6.11378 11.85 5.88622 11.7667 5.68333Z\" fill=\"#fff\"/></svg>`\r\n      )};\r\n      @media print {\r\n        background-image: ${cssInlineSvg(\r\n          `<svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M11.7667 5.68333C11.727 5.58104 11.6675 5.48759 11.5917 5.40833L6.59166 0.408334C6.51396 0.330635 6.42172 0.269001 6.3202 0.226951C6.21868 0.184901 6.10987 0.163258 5.99999 0.163258C5.77807 0.163258 5.56524 0.251414 5.40832 0.408334C5.33062 0.486033 5.26899 0.578275 5.22694 0.679793C5.18489 0.781311 5.16325 0.890118 5.16325 1C5.16325 1.22192 5.2514 1.43475 5.40832 1.59167L8.99166 5.16667H0.99999C0.778976 5.16667 0.567015 5.25447 0.410734 5.41075C0.254454 5.56703 0.166656 5.77899 0.166656 6C0.166656 6.22101 0.254454 6.43298 0.410734 6.58926C0.567015 6.74554 0.778976 6.83333 0.99999 6.83333H8.99166L5.40832 10.4083C5.33022 10.4858 5.26822 10.578 5.22591 10.6795C5.18361 10.7811 5.16182 10.89 5.16182 11C5.16182 11.11 5.18361 11.2189 5.22591 11.3205C5.26822 11.422 5.33022 11.5142 5.40832 11.5917C5.48579 11.6698 5.57796 11.7318 5.67951 11.7741C5.78106 11.8164 5.88998 11.8382 5.99999 11.8382C6.11 11.8382 6.21892 11.8164 6.32047 11.7741C6.42202 11.7318 6.51419 11.6698 6.59166 11.5917L11.5917 6.59167C11.6675 6.51241 11.727 6.41896 11.7667 6.31667C11.85 6.11378 11.85 5.88622 11.7667 5.68333Z\" fill=\"#000\"/></svg>`\r\n        )};\r\n      }\r\n    }\r\n  }\r\n`;\r\n\r\nexport const EditorDiv = styled.div``;\r\n","import React from 'react';\r\nimport { compose } from 'ramda';\r\nimport { Text } from '@sitecore-jss/sitecore-jss-react';\r\n\r\nimport { withEditMode, withEditModeNotice } from '_containers/BaseComponent';\r\n\r\nimport { CallToActionProps } from './definitions';\r\nimport {\r\n  CTA,\r\n  Heading,\r\n  Description,\r\n  TextWrapper,\r\n  LinkWrapper,\r\n  LinkButton,\r\n  LinkItem,\r\n  LinkList,\r\n  EditorDiv\r\n} from './StyledCallToAction';\r\n\r\nconst EditorText = compose(withEditModeNotice)(EditorDiv);\r\n\r\nconst renderLinks = (links) => {\r\n  if (links.length === 1) {\r\n    // button style\r\n    return (\r\n      <LinkWrapper multiLink={false}>\r\n        <LinkButton field={links[0].ctaLink.jss} linkTheme=\"none\" linkSize=\"s\" />\r\n      </LinkWrapper>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <LinkWrapper multiLink={true}>\r\n      <LinkList>\r\n        {links.map((l) => (\r\n          <li key={l.id}>\r\n            <LinkItem field={l.ctaLink.jss} linkTheme=\"secondary\" linkSize=\"s\" />\r\n          </li>\r\n        ))}\r\n      </LinkList>\r\n    </LinkWrapper>\r\n  );\r\n};\r\n\r\nconst CallToAction: React.FC<CallToActionProps> = ({ fields, editMode }) => {\r\n  if (fields.data.datasource === null) {\r\n    if (editMode) {\r\n      return (\r\n        <EditorText\r\n          noticeEnabled\r\n          noticeLevel=\"warning\"\r\n          noticeMessage={`This component needs a datasource to render.`}\r\n        />\r\n      );\r\n    }\r\n\r\n    return null;\r\n  }\r\n\r\n  const renderTextField = (field, markup) => {\r\n    if (editMode === false && !field?.jss?.value) {\r\n      return null;\r\n    }\r\n\r\n    return markup;\r\n  };\r\n\r\n  const { title, description, links } = fields.data.datasource;\r\n\r\n  const validatedLinks = links.filter((l) => editMode || l?.ctaLink?.jss?.value?.href !== '');\r\n\r\n  let noticeEnabled = false;\r\n\r\n  // no links, no component\r\n  if (validatedLinks.length === 0) {\r\n    if (editMode) {\r\n      noticeEnabled = true;\r\n    } else {\r\n      return null;\r\n    }\r\n  }\r\n\r\n  const component = (\r\n    <CTA multiLink={validatedLinks.length > 1}>\r\n      <TextWrapper>\r\n        {renderTextField(\r\n          title,\r\n          <Heading>\r\n            <Text field={title.jss} />\r\n          </Heading>\r\n        )}\r\n        {renderTextField(\r\n          description,\r\n          <Description>\r\n            <Text field={description.jss} />\r\n          </Description>\r\n        )}\r\n      </TextWrapper>\r\n      {renderLinks(validatedLinks)}\r\n    </CTA>\r\n  );\r\n\r\n  return editMode ? (\r\n    <EditorText\r\n      noticeEnabled={noticeEnabled}\r\n      noticeMessage={'Call to action component has no valid links and will not be displayed.'}\r\n    >\r\n      {component}\r\n    </EditorText>\r\n  ) : (\r\n    component\r\n  );\r\n};\r\n\r\nexport default compose(withEditMode)(CallToAction);\r\n"],"sourceRoot":""}