@laerdal/life-react-components 3.5.1-dev.16 → 3.5.1-dev.18

package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs

@@ -20,11 +20,33 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 var NewsletterAndSocial = _styledComponents["default"].section(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  flex-direction: column;\n  margin-bottom: 16px;\n\n  ", " {\n    flex-direction: row;\n  }\n"])), _styles.BREAKPOINTS.MEDIUM);
-var NewsletterEmailSection = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  width: 100%;\n  margin: 16px auto 0 auto;\n\n  ", " {\n    width: 60%;\n    margin: 16px 0 0 0;\n  }\n\n  label {\n    ", "\n    margin-bottom: 2px;\n  }\n  div div {\n    width: 100%;\n    ", " {\n      width: calc(100% - 82px);\n      width: 288px;\n    }\n  }\n  input {\n    height: 48px;\n  }\n"])), _styles.BREAKPOINTS.MEDIUM, (0, _styles.ComponentXXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.white), _styles.BREAKPOINTS.MEDIUM);
+var NewsletterEmailSection = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  width: 100%;\n  margin: 16px auto 0 auto;\n\n  ", " {\n    width: 60%;\n    margin: 16px 0 0 0;\n  }\n\n  label {\n    ", "\n    margin-bottom: 2px;\n  }\n  div div {\n    width: 100%;\n    ", " {\n      width: calc(100% - 82px);\n      width: 288px;\n    }\n  }\n  input {\n    height: 48px;\n  }\n"])), _styles.BREAKPOINTS.MEDIUM, function (props) {
+  return (0, _styles.ComponentXXSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('white', props.theme));
+}, _styles.BREAKPOINTS.MEDIUM);
 var NewsletterEmail = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  flex-direction: column;\n  margin: 2px auto 0;\n\n  ", " {\n    margin: 2px 0 0 0;\n    flex-direction: row;\n  }\n\n  ", " {\n    &.focus-visible {\n      ", "\n    }\n  }\n"])), _styles.BREAKPOINTS.MEDIUM, _InputFields.InputFieldStyling, _styles.invertedFocusStyles);
-var NewsletterButton = _styledComponents["default"].button(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n  background: transparent;\n  width: 100%;\n  height: 40px;\n  border: 2px solid ", ";\n  box-sizing: border-box;\n  border-radius: 8px;\n  margin: 8px 0 4px 0;\n\n  ", "\n\n  ", " {\n    width: 94px;\n    margin: auto 0 4px 8px;\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n  \n  &:focus {\n    ", "\n  }\n"])), _styles.COLORS.white, (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.white), _styles.BREAKPOINTS.MEDIUM, _styles.invertedFocusStyles);
-var SocialMedia = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n  color: ", ";\n  margin: 0 auto;\n\n  button div {\n    box-sizing: border-box;\n    border-radius: 4px;\n  }\n\n  h4 {\n    margin-top: 16px;\n    margin-bottom: 8px;\n    \n    ", "\n  }\n\n  ", " {\n    margin: 0 0 0 auto;\n    button {\n      margin: 0 0 0 12px;\n    }\n  }\n"])), _styles.COLORS.white, (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, 'inherit'), _styles.BREAKPOINTS.MEDIUM);
-var SocialMediaButtons = _styledComponents["default"].div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  justify-content: center;\n\n  button div {\n    display: flex;\n    background-color: transparent;\n    color: ", ";\n    margin: 0 0 0 20px;\n\n    svg {\n      fill: ", ";\n      path {\n        fill: ", ";\n      }\n    }\n\n    &:first-child {\n      margin: 0;\n    }\n    &:hover {\n      background-color: ", ";\n      color: ", ";\n    }\n    &:active {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n  a {\n    &:focus {\n      ", "\n    }\n  }\n\n  ", " {\n    justify-content: flex-end;\n  }\n"])), _styles.COLORS.white, _styles.COLORS.white, _styles.COLORS.white, _styles.COLORS.white, _styles.COLORS.neutral_600, _styles.COLORS.primary_800, _styles.COLORS.primary_100, _styles.invertedFocusStyles, _styles.BREAKPOINTS.MEDIUM);
+var NewsletterButton = _styledComponents["default"].button(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n  background: transparent;\n  width: 100%;\n  height: 40px;\n  border: 2px solid ", ";\n  box-sizing: border-box;\n  border-radius: 8px;\n  margin: 8px 0 4px 0;\n\n  ", "\n\n  ", " {\n    width: 94px;\n    margin: auto 0 4px 8px;\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n  \n  &:focus {\n    ", "\n  }\n"])), function (props) {
+  return _styles.COLORS.getColor('white', props.theme);
+}, function (props) {
+  return (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Bold, _styles.COLORS.getColor('white', props.theme));
+}, _styles.BREAKPOINTS.MEDIUM, _styles.invertedFocusStyles);
+var SocialMedia = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n  color: ", ";\n  margin: 0 auto;\n\n  button div {\n    box-sizing: border-box;\n    border-radius: 4px;\n  }\n\n  h4 {\n    margin-top: 16px;\n    margin-bottom: 8px;\n    \n    ", "\n  }\n\n  ", " {\n    margin: 0 0 0 auto;\n    button {\n      margin: 0 0 0 12px;\n    }\n  }\n"])), function (props) {
+  return _styles.COLORS.getColor('white', props.theme);
+}, (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, 'inherit'), _styles.BREAKPOINTS.MEDIUM);
+var SocialMediaButtons = _styledComponents["default"].div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  justify-content: center;\n\n  button div {\n    display: flex;\n    background-color: transparent;\n    color: ", ";\n    margin: 0 0 0 20px;\n\n    svg {\n      fill: ", ";\n      path {\n        fill: ", ";\n      }\n    }\n\n    &:first-child {\n      margin: 0;\n    }\n    &:hover {\n      background-color: ", ";\n      color: ", ";\n    }\n    &:active {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n  a {\n    &:focus {\n      ", "\n    }\n  }\n\n  ", " {\n    justify-content: flex-end;\n  }\n"])), function (props) {
+  return _styles.COLORS.getColor('white', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('white', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('white', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('white', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('neutral_600', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('primary_800', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('primary_100', props.theme);
+}, _styles.invertedFocusStyles, _styles.BREAKPOINTS.MEDIUM);
 var FooterNewsletterAndSocialSection = function FooterNewsletterAndSocialSection(_ref) {
   var actionOnNewsletterSignup = _ref.actionOnNewsletterSignup,
     newsletterLabel = _ref.newsletterLabel,

package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FooterNewsletterAndSocialSection.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_styles","_InputFields","_icons","_Button","_jsxRuntime","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","NewsletterAndSocial","styled","section","_taggedTemplateLiteral2","BREAKPOINTS","MEDIUM","NewsletterEmailSection","div","ComponentXXSStyling","ComponentTextStyle","Regular","COLORS","white","NewsletterEmail","InputFieldStyling","invertedFocusStyles","NewsletterButton","button","ComponentLStyling","Bold","SocialMedia","ComponentXSStyling","SocialMediaButtons","neutral_600","primary_800","primary_100","FooterNewsletterAndSocialSection","_ref","actionOnNewsletterSignup","newsletterLabel","placeholderEmail","_React$useState","useState","_React$useState2","_slicedToArray2","emailInput","setEmailInput","jsxs","children","jsx","TextField","id","withoutBorder","placeholder","value","onChange","onClick","target","href","rel","IconButton","variant","action","tabIndex","SystemIcons","Facebook","Twitter","Youtube","propTypes","_propTypes","func","string","isRequired","_default","exports"],"sources":["../../../src/Footer/Components/FooterNewsletterAndSocialSection.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\n\r\nimport {BREAKPOINTS, COLORS, focusStyles, invertedFocusStyles} from '../../styles';\r\nimport {TextField} from '../../InputFields';\r\nimport {SystemIcons} from '../../icons';\r\nimport {IconButton} from '../../Button';\r\nimport {\r\n  ComponentLStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n  ComponentXXSStyling\r\n} from '../../styles';\r\nimport {InputFieldStyling} from '../../InputFields';\r\n\r\nconst NewsletterAndSocial = styled.section`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin-bottom: 16px;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    flex-direction: row;\r\n  }\r\n`;\r\n\r\nconst NewsletterEmailSection = styled.div`\r\n  width: 100%;\r\n  margin: 16px auto 0 auto;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    width: 60%;\r\n    margin: 16px 0 0 0;\r\n  }\r\n\r\n  label {\r\n    ${ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.white)}\r\n    margin-bottom: 2px;\r\n  }\r\n  div div {\r\n    width: 100%;\r\n    ${BREAKPOINTS.MEDIUM} {\r\n      width: calc(100% - 82px);\r\n      width: 288px;\r\n    }\r\n  }\r\n  input {\r\n    height: 48px;\r\n  }\r\n`;\r\n\r\nconst NewsletterEmail = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin: 2px auto 0;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    margin: 2px 0 0 0;\r\n    flex-direction: row;\r\n  }\r\n\r\n  ${InputFieldStyling} {\r\n    &.focus-visible {\r\n      ${invertedFocusStyles}\r\n    }\r\n  }\r\n`;\r\n\r\nconst NewsletterButton = styled.button`\r\n  background: transparent;\r\n  width: 100%;\r\n  height: 40px;\r\n  border: 2px solid ${COLORS.white};\r\n  box-sizing: border-box;\r\n  border-radius: 8px;\r\n  margin: 8px 0 4px 0;\r\n\r\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.white)}\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    width: 94px;\r\n    margin: auto 0 4px 8px;\r\n  }\r\n\r\n  &:hover {\r\n    cursor: pointer;\r\n  }\r\n  \r\n  &:focus {\r\n    ${invertedFocusStyles}\r\n  }\r\n`;\r\n\r\nconst SocialMedia = styled.div`\r\n  color: ${COLORS.white};\r\n  margin: 0 auto;\r\n\r\n  button div {\r\n    box-sizing: border-box;\r\n    border-radius: 4px;\r\n  }\r\n\r\n  h4 {\r\n    margin-top: 16px;\r\n    margin-bottom: 8px;\r\n    \r\n    ${ComponentXSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    margin: 0 0 0 auto;\r\n    button {\r\n      margin: 0 0 0 12px;\r\n    }\r\n  }\r\n`;\r\n\r\nconst SocialMediaButtons = styled.div`\r\n  display: flex;\r\n  justify-content: center;\r\n\r\n  button div {\r\n    display: flex;\r\n    background-color: transparent;\r\n    color: ${COLORS.white};\r\n    margin: 0 0 0 20px;\r\n\r\n    svg {\r\n      fill: ${COLORS.white};\r\n      path {\r\n        fill: ${COLORS.white};\r\n      }\r\n    }\r\n\r\n    &:first-child {\r\n      margin: 0;\r\n    }\r\n    &:hover {\r\n      background-color: ${COLORS.white};\r\n      color: ${COLORS.neutral_600};\r\n    }\r\n    &:active {\r\n      background-color: ${COLORS.primary_800};\r\n      color: ${COLORS.primary_100};\r\n    }\r\n  }\r\n  a {\r\n    &:focus {\r\n      ${invertedFocusStyles}\r\n    }\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    justify-content: flex-end;\r\n  }\r\n`;\r\n\r\ninterface FooterNewsletterAndSocialSection {\r\n  actionOnNewsletterSignup?: (email: string) => void;\r\n  newsletterLabel: string;\r\n  placeholderEmail?: string;\r\n}\r\n\r\nconst FooterNewsletterAndSocialSection = ({ actionOnNewsletterSignup, newsletterLabel, placeholderEmail }: FooterNewsletterAndSocialSection) => {\r\n  const [emailInput, setEmailInput] = React.useState<string>('');\r\n  return (\r\n    <NewsletterAndSocial>\r\n      <NewsletterEmailSection>\r\n        <label>{newsletterLabel}</label>\r\n        <NewsletterEmail>\r\n          <TextField id=\"NewsletterEmail\" withoutBorder={true} placeholder={placeholderEmail} value={emailInput} onChange={(value: string) => setEmailInput(value)} />\r\n          <NewsletterButton data-testid={'newsBtn'} onClick={(e: any) => actionOnNewsletterSignup && actionOnNewsletterSignup(e.target.value)}>Sign up</NewsletterButton>\r\n        </NewsletterEmail>\r\n      </NewsletterEmailSection>\r\n      <SocialMedia>\r\n        <h4>Follow us on social media</h4>\r\n        <SocialMediaButtons>\r\n          <a href=\"https://www.facebook.com/LaerdalMedical/\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Facebook />\r\n            </IconButton>\r\n          </a>\r\n          <a href=\"https://twitter.com/laerdalmedical\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Twitter />\r\n            </IconButton>\r\n          </a>\r\n          <a href=\"https://www.youtube.com/user/LaerdalMedical\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Youtube />\r\n            </IconButton>\r\n          </a>\r\n        </SocialMediaButtons>\r\n      </SocialMedia>\r\n    </NewsletterAndSocial>\r\n  );\r\n};\r\n\r\nexport default FooterNewsletterAndSocialSection;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"FooterNewsletterAndSocialSection.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_styles","_InputFields","_icons","_Button","_jsxRuntime","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","NewsletterAndSocial","styled","section","_taggedTemplateLiteral2","BREAKPOINTS","MEDIUM","NewsletterEmailSection","div","props","ComponentXXSStyling","ComponentTextStyle","Regular","COLORS","getColor","theme","NewsletterEmail","InputFieldStyling","invertedFocusStyles","NewsletterButton","button","ComponentLStyling","Bold","SocialMedia","ComponentXSStyling","SocialMediaButtons","FooterNewsletterAndSocialSection","_ref","actionOnNewsletterSignup","newsletterLabel","placeholderEmail","_React$useState","useState","_React$useState2","_slicedToArray2","emailInput","setEmailInput","jsxs","children","jsx","TextField","id","withoutBorder","placeholder","value","onChange","onClick","target","href","rel","IconButton","variant","action","tabIndex","SystemIcons","Facebook","Twitter","Youtube","propTypes","_propTypes","func","string","isRequired","_default","exports"],"sources":["../../../src/Footer/Components/FooterNewsletterAndSocialSection.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\n\r\nimport {BREAKPOINTS, COLORS, focusStyles, invertedFocusStyles} from '../../styles';\r\nimport {TextField} from '../../InputFields';\r\nimport {SystemIcons} from '../../icons';\r\nimport {IconButton} from '../../Button';\r\nimport {\r\n  ComponentLStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n  ComponentXXSStyling\r\n} from '../../styles';\r\nimport {InputFieldStyling} from '../../InputFields';\r\n\r\nconst NewsletterAndSocial = styled.section`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin-bottom: 16px;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    flex-direction: row;\r\n  }\r\n`;\r\n\r\nconst NewsletterEmailSection = styled.div`\r\n  width: 100%;\r\n  margin: 16px auto 0 auto;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    width: 60%;\r\n    margin: 16px 0 0 0;\r\n  }\r\n\r\n  label {\r\n    ${props => ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.getColor('white', props.theme))}\r\n    margin-bottom: 2px;\r\n  }\r\n  div div {\r\n    width: 100%;\r\n    ${BREAKPOINTS.MEDIUM} {\r\n      width: calc(100% - 82px);\r\n      width: 288px;\r\n    }\r\n  }\r\n  input {\r\n    height: 48px;\r\n  }\r\n`;\r\n\r\nconst NewsletterEmail = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin: 2px auto 0;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    margin: 2px 0 0 0;\r\n    flex-direction: row;\r\n  }\r\n\r\n  ${InputFieldStyling} {\r\n    &.focus-visible {\r\n      ${invertedFocusStyles}\r\n    }\r\n  }\r\n`;\r\n\r\nconst NewsletterButton = styled.button`\r\n  background: transparent;\r\n  width: 100%;\r\n  height: 40px;\r\n  border: 2px solid ${props => COLORS.getColor('white', props.theme)};\r\n  box-sizing: border-box;\r\n  border-radius: 8px;\r\n  margin: 8px 0 4px 0;\r\n\r\n  ${props => ComponentLStyling(ComponentTextStyle.Bold, COLORS.getColor('white', props.theme))}\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    width: 94px;\r\n    margin: auto 0 4px 8px;\r\n  }\r\n\r\n  &:hover {\r\n    cursor: pointer;\r\n  }\r\n  \r\n  &:focus {\r\n    ${invertedFocusStyles}\r\n  }\r\n`;\r\n\r\nconst SocialMedia = styled.div`\r\n  color: ${props => COLORS.getColor('white', props.theme)};\r\n  margin: 0 auto;\r\n\r\n  button div {\r\n    box-sizing: border-box;\r\n    border-radius: 4px;\r\n  }\r\n\r\n  h4 {\r\n    margin-top: 16px;\r\n    margin-bottom: 8px;\r\n    \r\n    ${ComponentXSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    margin: 0 0 0 auto;\r\n    button {\r\n      margin: 0 0 0 12px;\r\n    }\r\n  }\r\n`;\r\n\r\nconst SocialMediaButtons = styled.div`\r\n  display: flex;\r\n  justify-content: center;\r\n\r\n  button div {\r\n    display: flex;\r\n    background-color: transparent;\r\n    color: ${props => COLORS.getColor('white', props.theme)};\r\n    margin: 0 0 0 20px;\r\n\r\n    svg {\r\n      fill: ${props => COLORS.getColor('white', props.theme)};\r\n      path {\r\n        fill: ${props => COLORS.getColor('white', props.theme)};\r\n      }\r\n    }\r\n\r\n    &:first-child {\r\n      margin: 0;\r\n    }\r\n    &:hover {\r\n      background-color: ${props => COLORS.getColor('white', props.theme)};\r\n      color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n    }\r\n    &:active {\r\n      background-color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n    }\r\n  }\r\n  a {\r\n    &:focus {\r\n      ${invertedFocusStyles}\r\n    }\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    justify-content: flex-end;\r\n  }\r\n`;\r\n\r\ninterface FooterNewsletterAndSocialSection {\r\n  actionOnNewsletterSignup?: (email: string) => void;\r\n  newsletterLabel: string;\r\n  placeholderEmail?: string;\r\n}\r\n\r\nconst FooterNewsletterAndSocialSection = ({ actionOnNewsletterSignup, newsletterLabel, placeholderEmail }: FooterNewsletterAndSocialSection) => {\r\n  const [emailInput, setEmailInput] = React.useState<string>('');\r\n  return (\r\n    <NewsletterAndSocial>\r\n      <NewsletterEmailSection>\r\n        <label>{newsletterLabel}</label>\r\n        <NewsletterEmail>\r\n          <TextField id=\"NewsletterEmail\" withoutBorder={true} placeholder={placeholderEmail} value={emailInput} onChange={(value: string) => setEmailInput(value)} />\r\n          <NewsletterButton data-testid={'newsBtn'} onClick={(e: any) => actionOnNewsletterSignup && actionOnNewsletterSignup(e.target.value)}>Sign up</NewsletterButton>\r\n        </NewsletterEmail>\r\n      </NewsletterEmailSection>\r\n      <SocialMedia>\r\n        <h4>Follow us on social media</h4>\r\n        <SocialMediaButtons>\r\n          <a href=\"https://www.facebook.com/LaerdalMedical/\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Facebook />\r\n            </IconButton>\r\n          </a>\r\n          <a href=\"https://twitter.com/laerdalmedical\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Twitter />\r\n            </IconButton>\r\n          </a>\r\n          <a href=\"https://www.youtube.com/user/LaerdalMedical\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Youtube />\r\n            </IconButton>\r\n          </a>\r\n        </SocialMediaButtons>\r\n      </SocialMedia>\r\n    </NewsletterAndSocial>\r\n  );\r\n};\r\n\r\nexport default FooterNewsletterAndSocialSection;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Footer/Components/FooterNewsletterAndSocialSection.js

@@ -13,11 +13,33 @@ import { InputFieldStyling } from '../../InputFields';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var NewsletterAndSocial = styled.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  margin-bottom: 16px;\n\n  ", " {\n    flex-direction: row;\n  }\n"])), BREAKPOINTS.MEDIUM);
-var NewsletterEmailSection = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  width: 100%;\n  margin: 16px auto 0 auto;\n\n  ", " {\n    width: 60%;\n    margin: 16px 0 0 0;\n  }\n\n  label {\n    ", "\n    margin-bottom: 2px;\n  }\n  div div {\n    width: 100%;\n    ", " {\n      width: calc(100% - 82px);\n      width: 288px;\n    }\n  }\n  input {\n    height: 48px;\n  }\n"])), BREAKPOINTS.MEDIUM, ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.white), BREAKPOINTS.MEDIUM);
+var NewsletterEmailSection = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  width: 100%;\n  margin: 16px auto 0 auto;\n\n  ", " {\n    width: 60%;\n    margin: 16px 0 0 0;\n  }\n\n  label {\n    ", "\n    margin-bottom: 2px;\n  }\n  div div {\n    width: 100%;\n    ", " {\n      width: calc(100% - 82px);\n      width: 288px;\n    }\n  }\n  input {\n    height: 48px;\n  }\n"])), BREAKPOINTS.MEDIUM, function (props) {
+  return ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.getColor('white', props.theme));
+}, BREAKPOINTS.MEDIUM);
 var NewsletterEmail = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  margin: 2px auto 0;\n\n  ", " {\n    margin: 2px 0 0 0;\n    flex-direction: row;\n  }\n\n  ", " {\n    &.focus-visible {\n      ", "\n    }\n  }\n"])), BREAKPOINTS.MEDIUM, InputFieldStyling, invertedFocusStyles);
-var NewsletterButton = styled.button(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  background: transparent;\n  width: 100%;\n  height: 40px;\n  border: 2px solid ", ";\n  box-sizing: border-box;\n  border-radius: 8px;\n  margin: 8px 0 4px 0;\n\n  ", "\n\n  ", " {\n    width: 94px;\n    margin: auto 0 4px 8px;\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n  \n  &:focus {\n    ", "\n  }\n"])), COLORS.white, ComponentLStyling(ComponentTextStyle.Bold, COLORS.white), BREAKPOINTS.MEDIUM, invertedFocusStyles);
-var SocialMedia = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  color: ", ";\n  margin: 0 auto;\n\n  button div {\n    box-sizing: border-box;\n    border-radius: 4px;\n  }\n\n  h4 {\n    margin-top: 16px;\n    margin-bottom: 8px;\n    \n    ", "\n  }\n\n  ", " {\n    margin: 0 0 0 auto;\n    button {\n      margin: 0 0 0 12px;\n    }\n  }\n"])), COLORS.white, ComponentXSStyling(ComponentTextStyle.Regular, 'inherit'), BREAKPOINTS.MEDIUM);
-var SocialMediaButtons = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n\n  button div {\n    display: flex;\n    background-color: transparent;\n    color: ", ";\n    margin: 0 0 0 20px;\n\n    svg {\n      fill: ", ";\n      path {\n        fill: ", ";\n      }\n    }\n\n    &:first-child {\n      margin: 0;\n    }\n    &:hover {\n      background-color: ", ";\n      color: ", ";\n    }\n    &:active {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n  a {\n    &:focus {\n      ", "\n    }\n  }\n\n  ", " {\n    justify-content: flex-end;\n  }\n"])), COLORS.white, COLORS.white, COLORS.white, COLORS.white, COLORS.neutral_600, COLORS.primary_800, COLORS.primary_100, invertedFocusStyles, BREAKPOINTS.MEDIUM);
+var NewsletterButton = styled.button(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  background: transparent;\n  width: 100%;\n  height: 40px;\n  border: 2px solid ", ";\n  box-sizing: border-box;\n  border-radius: 8px;\n  margin: 8px 0 4px 0;\n\n  ", "\n\n  ", " {\n    width: 94px;\n    margin: auto 0 4px 8px;\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n  \n  &:focus {\n    ", "\n  }\n"])), function (props) {
+  return COLORS.getColor('white', props.theme);
+}, function (props) {
+  return ComponentLStyling(ComponentTextStyle.Bold, COLORS.getColor('white', props.theme));
+}, BREAKPOINTS.MEDIUM, invertedFocusStyles);
+var SocialMedia = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  color: ", ";\n  margin: 0 auto;\n\n  button div {\n    box-sizing: border-box;\n    border-radius: 4px;\n  }\n\n  h4 {\n    margin-top: 16px;\n    margin-bottom: 8px;\n    \n    ", "\n  }\n\n  ", " {\n    margin: 0 0 0 auto;\n    button {\n      margin: 0 0 0 12px;\n    }\n  }\n"])), function (props) {
+  return COLORS.getColor('white', props.theme);
+}, ComponentXSStyling(ComponentTextStyle.Regular, 'inherit'), BREAKPOINTS.MEDIUM);
+var SocialMediaButtons = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: center;\n\n  button div {\n    display: flex;\n    background-color: transparent;\n    color: ", ";\n    margin: 0 0 0 20px;\n\n    svg {\n      fill: ", ";\n      path {\n        fill: ", ";\n      }\n    }\n\n    &:first-child {\n      margin: 0;\n    }\n    &:hover {\n      background-color: ", ";\n      color: ", ";\n    }\n    &:active {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n  a {\n    &:focus {\n      ", "\n    }\n  }\n\n  ", " {\n    justify-content: flex-end;\n  }\n"])), function (props) {
+  return COLORS.getColor('white', props.theme);
+}, function (props) {
+  return COLORS.getColor('white', props.theme);
+}, function (props) {
+  return COLORS.getColor('white', props.theme);
+}, function (props) {
+  return COLORS.getColor('white', props.theme);
+}, function (props) {
+  return COLORS.getColor('neutral_600', props.theme);
+}, function (props) {
+  return COLORS.getColor('primary_800', props.theme);
+}, function (props) {
+  return COLORS.getColor('primary_100', props.theme);
+}, invertedFocusStyles, BREAKPOINTS.MEDIUM);
 var FooterNewsletterAndSocialSection = function FooterNewsletterAndSocialSection(_ref) {
   var actionOnNewsletterSignup = _ref.actionOnNewsletterSignup,
     newsletterLabel = _ref.newsletterLabel,

package/dist/Footer/Components/FooterNewsletterAndSocialSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"FooterNewsletterAndSocialSection.js","names":["React","styled","BREAKPOINTS","COLORS","invertedFocusStyles","TextField","SystemIcons","IconButton","ComponentLStyling","ComponentTextStyle","ComponentXSStyling","ComponentXXSStyling","InputFieldStyling","jsx","_jsx","jsxs","_jsxs","NewsletterAndSocial","section","_templateObject","_taggedTemplateLiteral","MEDIUM","NewsletterEmailSection","div","_templateObject2","Regular","white","NewsletterEmail","_templateObject3","NewsletterButton","button","_templateObject4","Bold","SocialMedia","_templateObject5","SocialMediaButtons","_templateObject6","neutral_600","primary_800","primary_100","FooterNewsletterAndSocialSection","_ref","actionOnNewsletterSignup","newsletterLabel","placeholderEmail","_React$useState","useState","_React$useState2","_slicedToArray","emailInput","setEmailInput","children","id","withoutBorder","placeholder","value","onChange","onClick","e","target","href","rel","variant","action","tabIndex","Facebook","Twitter","Youtube","propTypes","_pt","func","string","isRequired"],"sources":["../../../src/Footer/Components/FooterNewsletterAndSocialSection.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\n\r\nimport {BREAKPOINTS, COLORS, focusStyles, invertedFocusStyles} from '../../styles';\r\nimport {TextField} from '../../InputFields';\r\nimport {SystemIcons} from '../../icons';\r\nimport {IconButton} from '../../Button';\r\nimport {\r\n  ComponentLStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n  ComponentXXSStyling\r\n} from '../../styles';\r\nimport {InputFieldStyling} from '../../InputFields';\r\n\r\nconst NewsletterAndSocial = styled.section`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin-bottom: 16px;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    flex-direction: row;\r\n  }\r\n`;\r\n\r\nconst NewsletterEmailSection = styled.div`\r\n  width: 100%;\r\n  margin: 16px auto 0 auto;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    width: 60%;\r\n    margin: 16px 0 0 0;\r\n  }\r\n\r\n  label {\r\n    ${ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.white)}\r\n    margin-bottom: 2px;\r\n  }\r\n  div div {\r\n    width: 100%;\r\n    ${BREAKPOINTS.MEDIUM} {\r\n      width: calc(100% - 82px);\r\n      width: 288px;\r\n    }\r\n  }\r\n  input {\r\n    height: 48px;\r\n  }\r\n`;\r\n\r\nconst NewsletterEmail = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin: 2px auto 0;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    margin: 2px 0 0 0;\r\n    flex-direction: row;\r\n  }\r\n\r\n  ${InputFieldStyling} {\r\n    &.focus-visible {\r\n      ${invertedFocusStyles}\r\n    }\r\n  }\r\n`;\r\n\r\nconst NewsletterButton = styled.button`\r\n  background: transparent;\r\n  width: 100%;\r\n  height: 40px;\r\n  border: 2px solid ${COLORS.white};\r\n  box-sizing: border-box;\r\n  border-radius: 8px;\r\n  margin: 8px 0 4px 0;\r\n\r\n  ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.white)}\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    width: 94px;\r\n    margin: auto 0 4px 8px;\r\n  }\r\n\r\n  &:hover {\r\n    cursor: pointer;\r\n  }\r\n  \r\n  &:focus {\r\n    ${invertedFocusStyles}\r\n  }\r\n`;\r\n\r\nconst SocialMedia = styled.div`\r\n  color: ${COLORS.white};\r\n  margin: 0 auto;\r\n\r\n  button div {\r\n    box-sizing: border-box;\r\n    border-radius: 4px;\r\n  }\r\n\r\n  h4 {\r\n    margin-top: 16px;\r\n    margin-bottom: 8px;\r\n    \r\n    ${ComponentXSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    margin: 0 0 0 auto;\r\n    button {\r\n      margin: 0 0 0 12px;\r\n    }\r\n  }\r\n`;\r\n\r\nconst SocialMediaButtons = styled.div`\r\n  display: flex;\r\n  justify-content: center;\r\n\r\n  button div {\r\n    display: flex;\r\n    background-color: transparent;\r\n    color: ${COLORS.white};\r\n    margin: 0 0 0 20px;\r\n\r\n    svg {\r\n      fill: ${COLORS.white};\r\n      path {\r\n        fill: ${COLORS.white};\r\n      }\r\n    }\r\n\r\n    &:first-child {\r\n      margin: 0;\r\n    }\r\n    &:hover {\r\n      background-color: ${COLORS.white};\r\n      color: ${COLORS.neutral_600};\r\n    }\r\n    &:active {\r\n      background-color: ${COLORS.primary_800};\r\n      color: ${COLORS.primary_100};\r\n    }\r\n  }\r\n  a {\r\n    &:focus {\r\n      ${invertedFocusStyles}\r\n    }\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    justify-content: flex-end;\r\n  }\r\n`;\r\n\r\ninterface FooterNewsletterAndSocialSection {\r\n  actionOnNewsletterSignup?: (email: string) => void;\r\n  newsletterLabel: string;\r\n  placeholderEmail?: string;\r\n}\r\n\r\nconst FooterNewsletterAndSocialSection = ({ actionOnNewsletterSignup, newsletterLabel, placeholderEmail }: FooterNewsletterAndSocialSection) => {\r\n  const [emailInput, setEmailInput] = React.useState<string>('');\r\n  return (\r\n    <NewsletterAndSocial>\r\n      <NewsletterEmailSection>\r\n        <label>{newsletterLabel}</label>\r\n        <NewsletterEmail>\r\n          <TextField id=\"NewsletterEmail\" withoutBorder={true} placeholder={placeholderEmail} value={emailInput} onChange={(value: string) => setEmailInput(value)} />\r\n          <NewsletterButton data-testid={'newsBtn'} onClick={(e: any) => actionOnNewsletterSignup && actionOnNewsletterSignup(e.target.value)}>Sign up</NewsletterButton>\r\n        </NewsletterEmail>\r\n      </NewsletterEmailSection>\r\n      <SocialMedia>\r\n        <h4>Follow us on social media</h4>\r\n        <SocialMediaButtons>\r\n          <a href=\"https://www.facebook.com/LaerdalMedical/\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Facebook />\r\n            </IconButton>\r\n          </a>\r\n          <a href=\"https://twitter.com/laerdalmedical\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Twitter />\r\n            </IconButton>\r\n          </a>\r\n          <a href=\"https://www.youtube.com/user/LaerdalMedical\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Youtube />\r\n            </IconButton>\r\n          </a>\r\n        </SocialMediaButtons>\r\n      </SocialMedia>\r\n    </NewsletterAndSocial>\r\n  );\r\n};\r\n\r\nexport default FooterNewsletterAndSocialSection;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"FooterNewsletterAndSocialSection.js","names":["React","styled","BREAKPOINTS","COLORS","invertedFocusStyles","TextField","SystemIcons","IconButton","ComponentLStyling","ComponentTextStyle","ComponentXSStyling","ComponentXXSStyling","InputFieldStyling","jsx","_jsx","jsxs","_jsxs","NewsletterAndSocial","section","_templateObject","_taggedTemplateLiteral","MEDIUM","NewsletterEmailSection","div","_templateObject2","props","Regular","getColor","theme","NewsletterEmail","_templateObject3","NewsletterButton","button","_templateObject4","Bold","SocialMedia","_templateObject5","SocialMediaButtons","_templateObject6","FooterNewsletterAndSocialSection","_ref","actionOnNewsletterSignup","newsletterLabel","placeholderEmail","_React$useState","useState","_React$useState2","_slicedToArray","emailInput","setEmailInput","children","id","withoutBorder","placeholder","value","onChange","onClick","e","target","href","rel","variant","action","tabIndex","Facebook","Twitter","Youtube","propTypes","_pt","func","string","isRequired"],"sources":["../../../src/Footer/Components/FooterNewsletterAndSocialSection.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\n\r\nimport {BREAKPOINTS, COLORS, focusStyles, invertedFocusStyles} from '../../styles';\r\nimport {TextField} from '../../InputFields';\r\nimport {SystemIcons} from '../../icons';\r\nimport {IconButton} from '../../Button';\r\nimport {\r\n  ComponentLStyling,\r\n  ComponentTextStyle,\r\n  ComponentXSStyling,\r\n  ComponentXXSStyling\r\n} from '../../styles';\r\nimport {InputFieldStyling} from '../../InputFields';\r\n\r\nconst NewsletterAndSocial = styled.section`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin-bottom: 16px;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    flex-direction: row;\r\n  }\r\n`;\r\n\r\nconst NewsletterEmailSection = styled.div`\r\n  width: 100%;\r\n  margin: 16px auto 0 auto;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    width: 60%;\r\n    margin: 16px 0 0 0;\r\n  }\r\n\r\n  label {\r\n    ${props => ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.getColor('white', props.theme))}\r\n    margin-bottom: 2px;\r\n  }\r\n  div div {\r\n    width: 100%;\r\n    ${BREAKPOINTS.MEDIUM} {\r\n      width: calc(100% - 82px);\r\n      width: 288px;\r\n    }\r\n  }\r\n  input {\r\n    height: 48px;\r\n  }\r\n`;\r\n\r\nconst NewsletterEmail = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin: 2px auto 0;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    margin: 2px 0 0 0;\r\n    flex-direction: row;\r\n  }\r\n\r\n  ${InputFieldStyling} {\r\n    &.focus-visible {\r\n      ${invertedFocusStyles}\r\n    }\r\n  }\r\n`;\r\n\r\nconst NewsletterButton = styled.button`\r\n  background: transparent;\r\n  width: 100%;\r\n  height: 40px;\r\n  border: 2px solid ${props => COLORS.getColor('white', props.theme)};\r\n  box-sizing: border-box;\r\n  border-radius: 8px;\r\n  margin: 8px 0 4px 0;\r\n\r\n  ${props => ComponentLStyling(ComponentTextStyle.Bold, COLORS.getColor('white', props.theme))}\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    width: 94px;\r\n    margin: auto 0 4px 8px;\r\n  }\r\n\r\n  &:hover {\r\n    cursor: pointer;\r\n  }\r\n  \r\n  &:focus {\r\n    ${invertedFocusStyles}\r\n  }\r\n`;\r\n\r\nconst SocialMedia = styled.div`\r\n  color: ${props => COLORS.getColor('white', props.theme)};\r\n  margin: 0 auto;\r\n\r\n  button div {\r\n    box-sizing: border-box;\r\n    border-radius: 4px;\r\n  }\r\n\r\n  h4 {\r\n    margin-top: 16px;\r\n    margin-bottom: 8px;\r\n    \r\n    ${ComponentXSStyling(ComponentTextStyle.Regular, 'inherit')}\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    margin: 0 0 0 auto;\r\n    button {\r\n      margin: 0 0 0 12px;\r\n    }\r\n  }\r\n`;\r\n\r\nconst SocialMediaButtons = styled.div`\r\n  display: flex;\r\n  justify-content: center;\r\n\r\n  button div {\r\n    display: flex;\r\n    background-color: transparent;\r\n    color: ${props => COLORS.getColor('white', props.theme)};\r\n    margin: 0 0 0 20px;\r\n\r\n    svg {\r\n      fill: ${props => COLORS.getColor('white', props.theme)};\r\n      path {\r\n        fill: ${props => COLORS.getColor('white', props.theme)};\r\n      }\r\n    }\r\n\r\n    &:first-child {\r\n      margin: 0;\r\n    }\r\n    &:hover {\r\n      background-color: ${props => COLORS.getColor('white', props.theme)};\r\n      color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n    }\r\n    &:active {\r\n      background-color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n    }\r\n  }\r\n  a {\r\n    &:focus {\r\n      ${invertedFocusStyles}\r\n    }\r\n  }\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    justify-content: flex-end;\r\n  }\r\n`;\r\n\r\ninterface FooterNewsletterAndSocialSection {\r\n  actionOnNewsletterSignup?: (email: string) => void;\r\n  newsletterLabel: string;\r\n  placeholderEmail?: string;\r\n}\r\n\r\nconst FooterNewsletterAndSocialSection = ({ actionOnNewsletterSignup, newsletterLabel, placeholderEmail }: FooterNewsletterAndSocialSection) => {\r\n  const [emailInput, setEmailInput] = React.useState<string>('');\r\n  return (\r\n    <NewsletterAndSocial>\r\n      <NewsletterEmailSection>\r\n        <label>{newsletterLabel}</label>\r\n        <NewsletterEmail>\r\n          <TextField id=\"NewsletterEmail\" withoutBorder={true} placeholder={placeholderEmail} value={emailInput} onChange={(value: string) => setEmailInput(value)} />\r\n          <NewsletterButton data-testid={'newsBtn'} onClick={(e: any) => actionOnNewsletterSignup && actionOnNewsletterSignup(e.target.value)}>Sign up</NewsletterButton>\r\n        </NewsletterEmail>\r\n      </NewsletterEmailSection>\r\n      <SocialMedia>\r\n        <h4>Follow us on social media</h4>\r\n        <SocialMediaButtons>\r\n          <a href=\"https://www.facebook.com/LaerdalMedical/\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Facebook />\r\n            </IconButton>\r\n          </a>\r\n          <a href=\"https://twitter.com/laerdalmedical\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Twitter />\r\n            </IconButton>\r\n          </a>\r\n          <a href=\"https://www.youtube.com/user/LaerdalMedical\" target=\"_blank\" rel=\"noreferrer noopener\">\r\n            <IconButton variant=\"secondary\" action={() => {}} tabIndex={-1}>\r\n              <SystemIcons.Youtube />\r\n            </IconButton>\r\n          </a>\r\n        </SocialMediaButtons>\r\n      </SocialMedia>\r\n    </NewsletterAndSocial>\r\n  );\r\n};\r\n\r\nexport default FooterNewsletterAndSocialSection;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Footer/Components/FooterTop.cjs

@@ -9,7 +9,7 @@ exports["default"] = void 0;
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var React = _interopRequireWildcard(require("react"));
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _animatedScrollTo = _interopRequireDefault(require("animated-scroll-to"));
 var _styles = require("../../styles");
 var _Logo = _interopRequireDefault(require("../../GlobalNavigationBar/Logo"));
@@ -19,11 +19,24 @@ var _templateObject, _templateObject2;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 var FooterTopSection = _styledComponents["default"].section(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  min-height: 8px;\n  color: white;\n  display: flex;\n  flex-direction: row;\n  margin-bottom: 16px;\n"])));
-var ToTop = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  flex-direction: column;\n  margin: auto 0 auto auto;\n  border-radius: 4px;\n  height: 48px;\n  width: 48px;\n  padding: 8px;\n\n  svg {\n    margin: 0 auto;\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n  span {\n    margin: 14px auto 0 auto;\n    ", "\n  }\n\n  &:hover:not(:disabled) {\n    background-color: ", ";\n    svg path,\n    svg {\n      fill: ", ";\n    }\n    span {\n      color: ", ";\n    }\n  }\n\n  &:focus:not(:disabled) {\n    ", "\n  }\n\n  &:active:not(:disabled) {\n    background: ", ";\n    svg path,\n    svg {\n      fill: ", ";\n    }\n    span {\n      color: ", ";\n    }\n  }\n"])), (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.UppercaseBold, 'inherit'), _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.COLORS.primary_700, _styles.invertedFocusStyles, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _styles.COLORS.primary_800);
+var ToTop = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  display: flex;\n  flex-direction: column;\n  margin: auto 0 auto auto;\n  border-radius: 4px;\n  height: 48px;\n  width: 48px;\n  padding: 8px;\n\n  svg {\n    margin: 0 auto;\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n  span {\n    margin: 14px auto 0 auto;\n    ", "\n  }\n\n  &:hover:not(:disabled) {\n    background-color: ", ";\n    svg path,\n    svg {\n      fill: ", ";\n    }\n    span {\n      color: ", ";\n    }\n  }\n\n  &:focus:not(:disabled) {\n    ", "\n  }\n\n  &:active:not(:disabled) {\n    background: ", ";\n    svg path,\n    svg {\n      fill: ", ";\n    }\n    span {\n      color: ", ";\n    }\n  }\n"])), (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.UppercaseBold, 'inherit'), function (props) {
+  return _styles.COLORS.getColor('primary_20', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('primary_700', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('primary_700', props.theme);
+}, _styles.invertedFocusStyles, function (props) {
+  return _styles.COLORS.getColor('primary_100', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('primary_800', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('primary_800', props.theme);
+});
 var FooterTop = function FooterTop(_ref) {
   var sitename = _ref.sitename,
     showBetaTag = _ref.showBetaTag,
     toTopText = _ref.toTopText;
+  var theme = (0, _styledComponents.useTheme)();
   var isPressingEnter = function isPressingEnter(e) {
     if (e.key === 'Enter') {
       e.preventDefault();
@@ -39,10 +52,10 @@ var FooterTop = function FooterTop(_ref) {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Logo["default"], {
       name: sitename || '',
       showBetaTag: showBetaTag,
-      color: _styles.COLORS.white,
+      color: _styles.COLORS.getColor('white', theme),
       inverted: true,
-      betaTagBackgroundColor: _styles.COLORS.white,
-      betaTagColor: _styles.COLORS.neutral_800
+      betaTagBackgroundColor: _styles.COLORS.getColor('white', theme),
+      betaTagColor: _styles.COLORS.getColor('neutral_800', theme)
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(ToTop, {
       "data-testid": 'toTopNavigation',
       tabIndex: 0,
@@ -52,7 +65,7 @@ var FooterTop = function FooterTop(_ref) {
       onClick: action,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ArrowLineUp, {
         size: "24px",
-        color: _styles.COLORS.white
+        color: _styles.COLORS.getColor('white', theme)
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         children: toTopText
       })]

package/dist/Footer/Components/FooterTop.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FooterTop.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_animatedScrollTo","_styles","_Logo","_icons","_jsxRuntime","_templateObject","_templateObject2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","FooterTopSection","styled","section","_taggedTemplateLiteral2","ToTop","div","ComponentXSStyling","ComponentTextStyle","UppercaseBold","COLORS","primary_20","primary_700","invertedFocusStyles","primary_100","primary_800","FooterTop","_ref","sitename","showBetaTag","toTopText","isPressingEnter","key","preventDefault","stopPropagation","action","animateScrollTo","jsxs","children","jsx","name","color","white","inverted","betaTagBackgroundColor","betaTagColor","neutral_800","tabIndex","onKeyDown","onClick","SystemIcons","ArrowLineUp","size","propTypes","_propTypes","string","bool","isRequired","_default","exports"],"sources":["../../../src/Footer/Components/FooterTop.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport animateScrollTo from 'animated-scroll-to';\r\n\r\nimport {COLORS, invertedFocusStyles} from '../../styles';\r\nimport Logo from '../../GlobalNavigationBar/Logo';\r\nimport {SystemIcons} from '../../icons';\r\nimport {ComponentTextStyle, ComponentXSStyling} from '../../styles';\r\n\r\nconst FooterTopSection = styled.section`\r\n  min-height: 8px;\r\n  color: white;\r\n  display: flex;\r\n  flex-direction: row;\r\n  margin-bottom: 16px;\r\n`;\r\n\r\nconst ToTop = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin: auto 0 auto auto;\r\n  border-radius: 4px;\r\n  height: 48px;\r\n  width: 48px;\r\n  padding: 8px;\r\n\r\n  svg {\r\n    margin: 0 auto;\r\n  }\r\n\r\n  &:hover {\r\n    cursor: pointer;\r\n  }\r\n  span {\r\n    margin: 14px auto 0 auto;\r\n    ${ComponentXSStyling(ComponentTextStyle.UppercaseBold, 'inherit')}\r\n  }\r\n\r\n  &:hover:not(:disabled) {\r\n    background-color: ${COLORS.primary_20};\r\n    svg path,\r\n    svg {\r\n      fill: ${COLORS.primary_700};\r\n    }\r\n    span {\r\n      color: ${COLORS.primary_700};\r\n    }\r\n  }\r\n\r\n  &:focus:not(:disabled) {\r\n    ${invertedFocusStyles}\r\n  }\r\n\r\n  &:active:not(:disabled) {\r\n    background: ${COLORS.primary_100};\r\n    svg path,\r\n    svg {\r\n      fill: ${COLORS.primary_800};\r\n    }\r\n    span {\r\n      color: ${COLORS.primary_800};\r\n    }\r\n  }\r\n`;\r\n\r\ninterface FooterTopProps {\r\n  sitename?: string;\r\n  showBetaTag?: boolean;\r\n  toTopText: string;\r\n}\r\n\r\nconst FooterTop = ({ sitename, showBetaTag, toTopText }: FooterTopProps) => {\r\n  const isPressingEnter = (e: any) => {\r\n    if (e.key === 'Enter') {\r\n      e.preventDefault();\r\n      e.stopPropagation();\r\n      return true;\r\n    }\r\n    return false;\r\n  };\r\n  const action = () => {\r\n    animateScrollTo(0);\r\n  };\r\n  return (\r\n    <FooterTopSection>\r\n      <Logo\r\n        name={sitename || ''}\r\n        showBetaTag={showBetaTag}\r\n        color={COLORS.white}\r\n        inverted={true}\r\n        betaTagBackgroundColor={COLORS.white}\r\n        betaTagColor={COLORS.neutral_800}\r\n      />\r\n      <ToTop data-testid={'toTopNavigation'} tabIndex={0} onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)} onClick={action}>\r\n        <SystemIcons.ArrowLineUp size=\"24px\" color={COLORS.white} />\r\n        <span>{toTopText}</span>\r\n      </ToTop>\r\n    </FooterTopSection>\r\n  );\r\n};\r\n\r\nexport default FooterTop;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"FooterTop.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_animatedScrollTo","_interopRequireDefault","_styles","_Logo","_icons","_jsxRuntime","_templateObject","_templateObject2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","FooterTopSection","styled","section","_taggedTemplateLiteral2","ToTop","div","ComponentXSStyling","ComponentTextStyle","UppercaseBold","props","COLORS","getColor","theme","invertedFocusStyles","FooterTop","_ref","sitename","showBetaTag","toTopText","useTheme","isPressingEnter","key","preventDefault","stopPropagation","action","animateScrollTo","jsxs","children","jsx","name","color","inverted","betaTagBackgroundColor","betaTagColor","tabIndex","onKeyDown","onClick","SystemIcons","ArrowLineUp","size","propTypes","_propTypes","string","bool","isRequired","_default","exports"],"sources":["../../../src/Footer/Components/FooterTop.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { useTheme } from 'styled-components';\r\nimport animateScrollTo from 'animated-scroll-to';\r\n\r\nimport {COLORS, invertedFocusStyles} from '../../styles';\r\nimport Logo from '../../GlobalNavigationBar/Logo';\r\nimport {SystemIcons} from '../../icons';\r\nimport {ComponentTextStyle, ComponentXSStyling} from '../../styles';\r\n\r\nconst FooterTopSection = styled.section`\r\n  min-height: 8px;\r\n  color: white;\r\n  display: flex;\r\n  flex-direction: row;\r\n  margin-bottom: 16px;\r\n`;\r\n\r\nconst ToTop = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin: auto 0 auto auto;\r\n  border-radius: 4px;\r\n  height: 48px;\r\n  width: 48px;\r\n  padding: 8px;\r\n\r\n  svg {\r\n    margin: 0 auto;\r\n  }\r\n\r\n  &:hover {\r\n    cursor: pointer;\r\n  }\r\n  span {\r\n    margin: 14px auto 0 auto;\r\n    ${ComponentXSStyling(ComponentTextStyle.UppercaseBold, 'inherit')}\r\n  }\r\n\r\n  &:hover:not(:disabled) {\r\n    background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    svg path,\r\n    svg {\r\n      fill: ${props => COLORS.getColor('primary_700', props.theme)};\r\n    }\r\n    span {\r\n      color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n    }\r\n  }\r\n\r\n  &:focus:not(:disabled) {\r\n    ${invertedFocusStyles}\r\n  }\r\n\r\n  &:active:not(:disabled) {\r\n    background: ${props => COLORS.getColor('primary_100', props.theme)};\r\n    svg path,\r\n    svg {\r\n      fill: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n    span {\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n  }\r\n`;\r\n\r\ninterface FooterTopProps {\r\n  sitename?: string;\r\n  showBetaTag?: boolean;\r\n  toTopText: string;\r\n}\r\n\r\nconst FooterTop = ({ sitename, showBetaTag, toTopText }: FooterTopProps) => {\r\n  const theme = useTheme();\r\n  const isPressingEnter = (e: any) => {\r\n    if (e.key === 'Enter') {\r\n      e.preventDefault();\r\n      e.stopPropagation();\r\n      return true;\r\n    }\r\n    return false;\r\n  };\r\n  const action = () => {\r\n    animateScrollTo(0);\r\n  };\r\n  return (\r\n    <FooterTopSection>\r\n      <Logo\r\n        name={sitename || ''}\r\n        showBetaTag={showBetaTag}\r\n        color={COLORS.getColor('white', theme)}\r\n        inverted={true}\r\n        betaTagBackgroundColor={COLORS.getColor('white', theme)}\r\n        betaTagColor={COLORS.getColor('neutral_800', theme)}\r\n      />\r\n      <ToTop data-testid={'toTopNavigation'} tabIndex={0} onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)} onClick={action}>\r\n        <SystemIcons.ArrowLineUp size=\"24px\" color={COLORS.getColor('white', theme)} />\r\n        <span>{toTopText}</span>\r\n      </ToTop>\r\n    </FooterTopSection>\r\n  );\r\n};\r\n\r\nexport default FooterTop;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Footer/Components/FooterTop.js

@@ -2,7 +2,7 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLit
 import _pt from "prop-types";
 var _templateObject, _templateObject2;
 import * as React from 'react';
-import styled from 'styled-components';
+import styled, { useTheme } from 'styled-components';
 import animateScrollTo from 'animated-scroll-to';
 import { COLORS, invertedFocusStyles } from '../../styles';
 import Logo from '../../GlobalNavigationBar/Logo';
@@ -11,11 +11,24 @@ import { ComponentTextStyle, ComponentXSStyling } from '../../styles';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var FooterTopSection = styled.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  min-height: 8px;\n  color: white;\n  display: flex;\n  flex-direction: row;\n  margin-bottom: 16px;\n"])));
-var ToTop = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  margin: auto 0 auto auto;\n  border-radius: 4px;\n  height: 48px;\n  width: 48px;\n  padding: 8px;\n\n  svg {\n    margin: 0 auto;\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n  span {\n    margin: 14px auto 0 auto;\n    ", "\n  }\n\n  &:hover:not(:disabled) {\n    background-color: ", ";\n    svg path,\n    svg {\n      fill: ", ";\n    }\n    span {\n      color: ", ";\n    }\n  }\n\n  &:focus:not(:disabled) {\n    ", "\n  }\n\n  &:active:not(:disabled) {\n    background: ", ";\n    svg path,\n    svg {\n      fill: ", ";\n    }\n    span {\n      color: ", ";\n    }\n  }\n"])), ComponentXSStyling(ComponentTextStyle.UppercaseBold, 'inherit'), COLORS.primary_20, COLORS.primary_700, COLORS.primary_700, invertedFocusStyles, COLORS.primary_100, COLORS.primary_800, COLORS.primary_800);
+var ToTop = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  margin: auto 0 auto auto;\n  border-radius: 4px;\n  height: 48px;\n  width: 48px;\n  padding: 8px;\n\n  svg {\n    margin: 0 auto;\n  }\n\n  &:hover {\n    cursor: pointer;\n  }\n  span {\n    margin: 14px auto 0 auto;\n    ", "\n  }\n\n  &:hover:not(:disabled) {\n    background-color: ", ";\n    svg path,\n    svg {\n      fill: ", ";\n    }\n    span {\n      color: ", ";\n    }\n  }\n\n  &:focus:not(:disabled) {\n    ", "\n  }\n\n  &:active:not(:disabled) {\n    background: ", ";\n    svg path,\n    svg {\n      fill: ", ";\n    }\n    span {\n      color: ", ";\n    }\n  }\n"])), ComponentXSStyling(ComponentTextStyle.UppercaseBold, 'inherit'), function (props) {
+  return COLORS.getColor('primary_20', props.theme);
+}, function (props) {
+  return COLORS.getColor('primary_700', props.theme);
+}, function (props) {
+  return COLORS.getColor('primary_700', props.theme);
+}, invertedFocusStyles, function (props) {
+  return COLORS.getColor('primary_100', props.theme);
+}, function (props) {
+  return COLORS.getColor('primary_800', props.theme);
+}, function (props) {
+  return COLORS.getColor('primary_800', props.theme);
+});
 var FooterTop = function FooterTop(_ref) {
   var sitename = _ref.sitename,
     showBetaTag = _ref.showBetaTag,
     toTopText = _ref.toTopText;
+  var theme = useTheme();
   var isPressingEnter = function isPressingEnter(e) {
     if (e.key === 'Enter') {
       e.preventDefault();
@@ -31,10 +44,10 @@ var FooterTop = function FooterTop(_ref) {
     children: [/*#__PURE__*/_jsx(Logo, {
       name: sitename || '',
       showBetaTag: showBetaTag,
-      color: COLORS.white,
+      color: COLORS.getColor('white', theme),
       inverted: true,
-      betaTagBackgroundColor: COLORS.white,
-      betaTagColor: COLORS.neutral_800
+      betaTagBackgroundColor: COLORS.getColor('white', theme),
+      betaTagColor: COLORS.getColor('neutral_800', theme)
     }), /*#__PURE__*/_jsxs(ToTop, {
       "data-testid": 'toTopNavigation',
       tabIndex: 0,
@@ -44,7 +57,7 @@ var FooterTop = function FooterTop(_ref) {
       onClick: action,
       children: [/*#__PURE__*/_jsx(SystemIcons.ArrowLineUp, {
         size: "24px",
-        color: COLORS.white
+        color: COLORS.getColor('white', theme)
       }), /*#__PURE__*/_jsx("span", {
         children: toTopText
       })]

package/dist/Footer/Components/FooterTop.js.map

@@ -1 +1 @@
-{"version":3,"file":"FooterTop.js","names":["React","styled","animateScrollTo","COLORS","invertedFocusStyles","Logo","SystemIcons","ComponentTextStyle","ComponentXSStyling","jsx","_jsx","jsxs","_jsxs","FooterTopSection","section","_templateObject","_taggedTemplateLiteral","ToTop","div","_templateObject2","UppercaseBold","primary_20","primary_700","primary_100","primary_800","FooterTop","_ref","sitename","showBetaTag","toTopText","isPressingEnter","e","key","preventDefault","stopPropagation","action","children","name","color","white","inverted","betaTagBackgroundColor","betaTagColor","neutral_800","tabIndex","onKeyDown","onClick","ArrowLineUp","size","propTypes","_pt","string","bool","isRequired"],"sources":["../../../src/Footer/Components/FooterTop.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport animateScrollTo from 'animated-scroll-to';\r\n\r\nimport {COLORS, invertedFocusStyles} from '../../styles';\r\nimport Logo from '../../GlobalNavigationBar/Logo';\r\nimport {SystemIcons} from '../../icons';\r\nimport {ComponentTextStyle, ComponentXSStyling} from '../../styles';\r\n\r\nconst FooterTopSection = styled.section`\r\n  min-height: 8px;\r\n  color: white;\r\n  display: flex;\r\n  flex-direction: row;\r\n  margin-bottom: 16px;\r\n`;\r\n\r\nconst ToTop = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin: auto 0 auto auto;\r\n  border-radius: 4px;\r\n  height: 48px;\r\n  width: 48px;\r\n  padding: 8px;\r\n\r\n  svg {\r\n    margin: 0 auto;\r\n  }\r\n\r\n  &:hover {\r\n    cursor: pointer;\r\n  }\r\n  span {\r\n    margin: 14px auto 0 auto;\r\n    ${ComponentXSStyling(ComponentTextStyle.UppercaseBold, 'inherit')}\r\n  }\r\n\r\n  &:hover:not(:disabled) {\r\n    background-color: ${COLORS.primary_20};\r\n    svg path,\r\n    svg {\r\n      fill: ${COLORS.primary_700};\r\n    }\r\n    span {\r\n      color: ${COLORS.primary_700};\r\n    }\r\n  }\r\n\r\n  &:focus:not(:disabled) {\r\n    ${invertedFocusStyles}\r\n  }\r\n\r\n  &:active:not(:disabled) {\r\n    background: ${COLORS.primary_100};\r\n    svg path,\r\n    svg {\r\n      fill: ${COLORS.primary_800};\r\n    }\r\n    span {\r\n      color: ${COLORS.primary_800};\r\n    }\r\n  }\r\n`;\r\n\r\ninterface FooterTopProps {\r\n  sitename?: string;\r\n  showBetaTag?: boolean;\r\n  toTopText: string;\r\n}\r\n\r\nconst FooterTop = ({ sitename, showBetaTag, toTopText }: FooterTopProps) => {\r\n  const isPressingEnter = (e: any) => {\r\n    if (e.key === 'Enter') {\r\n      e.preventDefault();\r\n      e.stopPropagation();\r\n      return true;\r\n    }\r\n    return false;\r\n  };\r\n  const action = () => {\r\n    animateScrollTo(0);\r\n  };\r\n  return (\r\n    <FooterTopSection>\r\n      <Logo\r\n        name={sitename || ''}\r\n        showBetaTag={showBetaTag}\r\n        color={COLORS.white}\r\n        inverted={true}\r\n        betaTagBackgroundColor={COLORS.white}\r\n        betaTagColor={COLORS.neutral_800}\r\n      />\r\n      <ToTop data-testid={'toTopNavigation'} tabIndex={0} onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)} onClick={action}>\r\n        <SystemIcons.ArrowLineUp size=\"24px\" color={COLORS.white} />\r\n        <span>{toTopText}</span>\r\n      </ToTop>\r\n    </FooterTopSection>\r\n  );\r\n};\r\n\r\nexport default FooterTop;\r\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AACtC,OAAOC,eAAe,MAAM,oBAAoB;AAEhD,SAAQC,MAAM,EAAEC,mBAAmB,QAAO,cAAc;AACxD,OAAOC,IAAI,MAAM,gCAAgC;AACjD,SAAQC,WAAW,QAAO,aAAa;AACvC,SAAQC,kBAAkB,EAAEC,kBAAkB,QAAO,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAEpE,IAAMC,gBAAgB,GAAGZ,MAAM,CAACa,OAAO,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,iHAMtC;AAED,IAAMC,KAAK,GAAGhB,MAAM,CAACiB,GAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAAH,sBAAA,moBAkBlBR,kBAAkB,CAACD,kBAAkB,CAACa,aAAa,EAAE,SAAS,CAAC,EAI7CjB,MAAM,CAACkB,UAAU,EAG3BlB,MAAM,CAACmB,WAAW,EAGjBnB,MAAM,CAACmB,WAAW,EAK3BlB,mBAAmB,EAIPD,MAAM,CAACoB,WAAW,EAGtBpB,MAAM,CAACqB,WAAW,EAGjBrB,MAAM,CAACqB,WAAW,CAGhC;AAQD,IAAMC,SAAS,GAAG,SAAZA,SAASA,CAAAC,IAAA,EAA6D;EAAA,IAAvDC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,WAAW,GAAAF,IAAA,CAAXE,WAAW;IAAEC,SAAS,GAAAH,IAAA,CAATG,SAAS;EACnD,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,CAAM,EAAK;IAClC,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAE;MACrBD,CAAC,CAACE,cAAc,CAAC,CAAC;MAClBF,CAAC,CAACG,eAAe,CAAC,CAAC;MACnB,OAAO,IAAI;IACb;IACA,OAAO,KAAK;EACd,CAAC;EACD,IAAMC,MAAM,GAAG,SAATA,MAAMA,CAAA,EAAS;IACnBjC,eAAe,CAAC,CAAC,CAAC;EACpB,CAAC;EACD,oBACEU,KAAA,CAACC,gBAAgB;IAAAuB,QAAA,gBACf1B,IAAA,CAACL,IAAI;MACHgC,IAAI,EAAEV,QAAQ,IAAI,EAAG;MACrBC,WAAW,EAAEA,WAAY;MACzBU,KAAK,EAAEnC,MAAM,CAACoC,KAAM;MACpBC,QAAQ,EAAE,IAAK;MACfC,sBAAsB,EAAEtC,MAAM,CAACoC,KAAM;MACrCG,YAAY,EAAEvC,MAAM,CAACwC;IAAY,CAClC,CAAC,eACF/B,KAAA,CAACK,KAAK;MAAC,eAAa,iBAAkB;MAAC2B,QAAQ,EAAE,CAAE;MAACC,SAAS,EAAE,SAAAA,UAACd,CAAM;QAAA,OAAMD,eAAe,CAACC,CAAC,CAAC,GAAGI,MAAM,CAAC,CAAC,GAAG,IAAI;MAAA,CAAE;MAACW,OAAO,EAAEX,MAAO;MAAAC,QAAA,gBACjI1B,IAAA,CAACJ,WAAW,CAACyC,WAAW;QAACC,IAAI,EAAC,MAAM;QAACV,KAAK,EAAEnC,MAAM,CAACoC;MAAM,CAAE,CAAC,eAC5D7B,IAAA;QAAA0B,QAAA,EAAOP;MAAS,CAAO,CAAC;IAAA,CACnB,CAAC;EAAA,CACQ,CAAC;AAEvB,CAAC;AAACJ,SAAA,CAAAwB,SAAA;EAjCAtB,QAAQ,EAAAuB,GAAA,CAAAC,MAAA;EACRvB,WAAW,EAAAsB,GAAA,CAAAE,IAAA;EACXvB,SAAS,EAAAqB,GAAA,CAAAC,MAAA,CAAAE;AAAA;AAiCX,eAAe5B,SAAS","ignoreList":[]}
+{"version":3,"file":"FooterTop.js","names":["React","styled","useTheme","animateScrollTo","COLORS","invertedFocusStyles","Logo","SystemIcons","ComponentTextStyle","ComponentXSStyling","jsx","_jsx","jsxs","_jsxs","FooterTopSection","section","_templateObject","_taggedTemplateLiteral","ToTop","div","_templateObject2","UppercaseBold","props","getColor","theme","FooterTop","_ref","sitename","showBetaTag","toTopText","isPressingEnter","e","key","preventDefault","stopPropagation","action","children","name","color","inverted","betaTagBackgroundColor","betaTagColor","tabIndex","onKeyDown","onClick","ArrowLineUp","size","propTypes","_pt","string","bool","isRequired"],"sources":["../../../src/Footer/Components/FooterTop.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { useTheme } from 'styled-components';\r\nimport animateScrollTo from 'animated-scroll-to';\r\n\r\nimport {COLORS, invertedFocusStyles} from '../../styles';\r\nimport Logo from '../../GlobalNavigationBar/Logo';\r\nimport {SystemIcons} from '../../icons';\r\nimport {ComponentTextStyle, ComponentXSStyling} from '../../styles';\r\n\r\nconst FooterTopSection = styled.section`\r\n  min-height: 8px;\r\n  color: white;\r\n  display: flex;\r\n  flex-direction: row;\r\n  margin-bottom: 16px;\r\n`;\r\n\r\nconst ToTop = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin: auto 0 auto auto;\r\n  border-radius: 4px;\r\n  height: 48px;\r\n  width: 48px;\r\n  padding: 8px;\r\n\r\n  svg {\r\n    margin: 0 auto;\r\n  }\r\n\r\n  &:hover {\r\n    cursor: pointer;\r\n  }\r\n  span {\r\n    margin: 14px auto 0 auto;\r\n    ${ComponentXSStyling(ComponentTextStyle.UppercaseBold, 'inherit')}\r\n  }\r\n\r\n  &:hover:not(:disabled) {\r\n    background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    svg path,\r\n    svg {\r\n      fill: ${props => COLORS.getColor('primary_700', props.theme)};\r\n    }\r\n    span {\r\n      color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n    }\r\n  }\r\n\r\n  &:focus:not(:disabled) {\r\n    ${invertedFocusStyles}\r\n  }\r\n\r\n  &:active:not(:disabled) {\r\n    background: ${props => COLORS.getColor('primary_100', props.theme)};\r\n    svg path,\r\n    svg {\r\n      fill: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n    span {\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n  }\r\n`;\r\n\r\ninterface FooterTopProps {\r\n  sitename?: string;\r\n  showBetaTag?: boolean;\r\n  toTopText: string;\r\n}\r\n\r\nconst FooterTop = ({ sitename, showBetaTag, toTopText }: FooterTopProps) => {\r\n  const theme = useTheme();\r\n  const isPressingEnter = (e: any) => {\r\n    if (e.key === 'Enter') {\r\n      e.preventDefault();\r\n      e.stopPropagation();\r\n      return true;\r\n    }\r\n    return false;\r\n  };\r\n  const action = () => {\r\n    animateScrollTo(0);\r\n  };\r\n  return (\r\n    <FooterTopSection>\r\n      <Logo\r\n        name={sitename || ''}\r\n        showBetaTag={showBetaTag}\r\n        color={COLORS.getColor('white', theme)}\r\n        inverted={true}\r\n        betaTagBackgroundColor={COLORS.getColor('white', theme)}\r\n        betaTagColor={COLORS.getColor('neutral_800', theme)}\r\n      />\r\n      <ToTop data-testid={'toTopNavigation'} tabIndex={0} onKeyDown={(e: any) => (isPressingEnter(e) ? action() : null)} onClick={action}>\r\n        <SystemIcons.ArrowLineUp size=\"24px\" color={COLORS.getColor('white', theme)} />\r\n        <span>{toTopText}</span>\r\n      </ToTop>\r\n    </FooterTopSection>\r\n  );\r\n};\r\n\r\nexport default FooterTop;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Footer/Footer.cjs

@@ -15,7 +15,9 @@ var _templateObject, _templateObject2;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 var FooterContainer = _styledComponents["default"].footer(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  margin-top: auto;\n"])));
-var FooterGlobalContent = _styledComponents["default"].section(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  min-height: 8px;\n  background-color: ", ";\n  color: white;\n"])), _styles.COLORS.primary_700);
+var FooterGlobalContent = _styledComponents["default"].section(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  min-height: 8px;\n  background-color: ", ";\n  color: white;\n"])), function (props) {
+  return _styles.COLORS.getColor('primary_700', props.theme);
+});
 var Footer = function Footer(_ref) {
   var children = _ref.children;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(FooterContainer, {

package/dist/Footer/Footer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Footer.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_styles","_jsxRuntime","_templateObject","_templateObject2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","FooterContainer","styled","footer","_taggedTemplateLiteral2","FooterGlobalContent","section","COLORS","primary_700","Footer","_ref","children","jsxs","role","jsx","_default","exports"],"sources":["../../src/Footer/Footer.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\n\r\nimport { COLORS } from '../styles';\r\n\r\nconst FooterContainer = styled.footer`\r\n  margin-top: auto;\r\n`;\r\n\r\nconst FooterGlobalContent = styled.section`\r\n  min-height: 8px;\r\n  background-color: ${COLORS.primary_700};\r\n  color: white;\r\n`;\r\n\r\nconst Footer = ({ children }: any) => {\r\n  return (\r\n    <FooterContainer role=\"contentinfo\">\r\n      {children}\r\n      <FooterGlobalContent data-testid={'footer-content'} />\r\n    </FooterContainer>\r\n  );\r\n};\r\n\r\nexport default Footer;\r\n"],"mappings":";;;;;;;;;AAAA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,OAAA,GAAAH,OAAA;AAAmC,IAAAI,WAAA,GAAAJ,OAAA;AAAA,IAAAK,eAAA,EAAAC,gBAAA;AAAA,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAT,wBAAAS,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,gBAAAK,OAAA,CAAAL,CAAA,0BAAAA,CAAA,sBAAAA,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,cAAAR,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAEnC,IAAMW,eAAe,GAAGC,4BAAM,CAACC,MAAM,CAAAxB,eAAA,KAAAA,eAAA,OAAAyB,uBAAA,2CAEpC;AAED,IAAMC,mBAAmB,GAAGH,4BAAM,CAACI,OAAO,CAAA1B,gBAAA,KAAAA,gBAAA,OAAAwB,uBAAA,uFAEpBG,cAAM,CAACC,WAAW,CAEvC;AAED,IAAMC,MAAM,GAAG,SAATA,MAAMA,CAAAC,IAAA,EAA0B;EAAA,IAApBC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;EACxB,oBACE,IAAAjC,WAAA,CAAAkC,IAAA,EAACX,eAAe;IAACY,IAAI,EAAC,aAAa;IAAAF,QAAA,GAChCA,QAAQ,eACT,IAAAjC,WAAA,CAAAoC,GAAA,EAACT,mBAAmB;MAAC,eAAa;IAAiB,CAAE,CAAC;EAAA,CACvC,CAAC;AAEtB,CAAC;AAAC,IAAAU,QAAA,GAEaN,MAAM;AAAAO,OAAA,cAAAD,QAAA","ignoreList":[]}
+{"version":3,"file":"Footer.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_styles","_jsxRuntime","_templateObject","_templateObject2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","FooterContainer","styled","footer","_taggedTemplateLiteral2","FooterGlobalContent","section","props","COLORS","getColor","theme","Footer","_ref","children","jsxs","role","jsx","_default","exports"],"sources":["../../src/Footer/Footer.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\n\r\nimport { COLORS } from '../styles';\r\n\r\nconst FooterContainer = styled.footer`\r\n  margin-top: auto;\r\n`;\r\n\r\nconst FooterGlobalContent = styled.section`\r\n  min-height: 8px;\r\n  background-color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n  color: white;\r\n`;\r\n\r\nconst Footer = ({ children }: any) => {\r\n  return (\r\n    <FooterContainer role=\"contentinfo\">\r\n      {children}\r\n      <FooterGlobalContent data-testid={'footer-content'} />\r\n    </FooterContainer>\r\n  );\r\n};\r\n\r\nexport default Footer;\r\n"],"mappings":";;;;;;;;;AAAA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,OAAA,GAAAH,OAAA;AAAmC,IAAAI,WAAA,GAAAJ,OAAA;AAAA,IAAAK,eAAA,EAAAC,gBAAA;AAAA,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAT,wBAAAS,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,gBAAAK,OAAA,CAAAL,CAAA,0BAAAA,CAAA,sBAAAA,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,cAAAR,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAEnC,IAAMW,eAAe,GAAGC,4BAAM,CAACC,MAAM,CAAAxB,eAAA,KAAAA,eAAA,OAAAyB,uBAAA,2CAEpC;AAED,IAAMC,mBAAmB,GAAGH,4BAAM,CAACI,OAAO,CAAA1B,gBAAA,KAAAA,gBAAA,OAAAwB,uBAAA,uFAEpB,UAAAG,KAAK;EAAA,OAAIC,cAAM,CAACC,QAAQ,CAAC,aAAa,EAAEF,KAAK,CAACG,KAAK,CAAC;AAAA,EAEzE;AAED,IAAMC,MAAM,GAAG,SAATA,MAAMA,CAAAC,IAAA,EAA0B;EAAA,IAApBC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;EACxB,oBACE,IAAAnC,WAAA,CAAAoC,IAAA,EAACb,eAAe;IAACc,IAAI,EAAC,aAAa;IAAAF,QAAA,GAChCA,QAAQ,eACT,IAAAnC,WAAA,CAAAsC,GAAA,EAACX,mBAAmB;MAAC,eAAa;IAAiB,CAAE,CAAC;EAAA,CACvC,CAAC;AAEtB,CAAC;AAAC,IAAAY,QAAA,GAEaN,MAAM;AAAAO,OAAA,cAAAD,QAAA","ignoreList":[]}

package/dist/Footer/Footer.js

@@ -6,7 +6,9 @@ import { COLORS } from '../styles';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var FooterContainer = styled.footer(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  margin-top: auto;\n"])));
-var FooterGlobalContent = styled.section(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  min-height: 8px;\n  background-color: ", ";\n  color: white;\n"])), COLORS.primary_700);
+var FooterGlobalContent = styled.section(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  min-height: 8px;\n  background-color: ", ";\n  color: white;\n"])), function (props) {
+  return COLORS.getColor('primary_700', props.theme);
+});
 var Footer = function Footer(_ref) {
   var children = _ref.children;
   return /*#__PURE__*/_jsxs(FooterContainer, {

package/dist/Footer/Footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Footer.js","names":["React","styled","COLORS","jsx","_jsx","jsxs","_jsxs","FooterContainer","footer","_templateObject","_taggedTemplateLiteral","FooterGlobalContent","section","_templateObject2","primary_700","Footer","_ref","children","role"],"sources":["../../src/Footer/Footer.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\n\r\nimport { COLORS } from '../styles';\r\n\r\nconst FooterContainer = styled.footer`\r\n  margin-top: auto;\r\n`;\r\n\r\nconst FooterGlobalContent = styled.section`\r\n  min-height: 8px;\r\n  background-color: ${COLORS.primary_700};\r\n  color: white;\r\n`;\r\n\r\nconst Footer = ({ children }: any) => {\r\n  return (\r\n    <FooterContainer role=\"contentinfo\">\r\n      {children}\r\n      <FooterGlobalContent data-testid={'footer-content'} />\r\n    </FooterContainer>\r\n  );\r\n};\r\n\r\nexport default Footer;\r\n"],"mappings":";;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AAEtC,SAASC,MAAM,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAEnC,IAAMC,eAAe,GAAGN,MAAM,CAACO,MAAM,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,+BAEpC;AAED,IAAMC,mBAAmB,GAAGV,MAAM,CAACW,OAAO,CAAAC,gBAAA,KAAAA,gBAAA,GAAAH,sBAAA,2EAEpBR,MAAM,CAACY,WAAW,CAEvC;AAED,IAAMC,MAAM,GAAG,SAATA,MAAMA,CAAAC,IAAA,EAA0B;EAAA,IAApBC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;EACxB,oBACEX,KAAA,CAACC,eAAe;IAACW,IAAI,EAAC,aAAa;IAAAD,QAAA,GAChCA,QAAQ,eACTb,IAAA,CAACO,mBAAmB;MAAC,eAAa;IAAiB,CAAE,CAAC;EAAA,CACvC,CAAC;AAEtB,CAAC;AAED,eAAeI,MAAM","ignoreList":[]}
+{"version":3,"file":"Footer.js","names":["React","styled","COLORS","jsx","_jsx","jsxs","_jsxs","FooterContainer","footer","_templateObject","_taggedTemplateLiteral","FooterGlobalContent","section","_templateObject2","props","getColor","theme","Footer","_ref","children","role"],"sources":["../../src/Footer/Footer.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\n\r\nimport { COLORS } from '../styles';\r\n\r\nconst FooterContainer = styled.footer`\r\n  margin-top: auto;\r\n`;\r\n\r\nconst FooterGlobalContent = styled.section`\r\n  min-height: 8px;\r\n  background-color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n  color: white;\r\n`;\r\n\r\nconst Footer = ({ children }: any) => {\r\n  return (\r\n    <FooterContainer role=\"contentinfo\">\r\n      {children}\r\n      <FooterGlobalContent data-testid={'footer-content'} />\r\n    </FooterContainer>\r\n  );\r\n};\r\n\r\nexport default Footer;\r\n"],"mappings":";;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,MAAM,MAAM,mBAAmB;AAEtC,SAASC,MAAM,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAEnC,IAAMC,eAAe,GAAGN,MAAM,CAACO,MAAM,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,+BAEpC;AAED,IAAMC,mBAAmB,GAAGV,MAAM,CAACW,OAAO,CAAAC,gBAAA,KAAAA,gBAAA,GAAAH,sBAAA,2EAEpB,UAAAI,KAAK;EAAA,OAAIZ,MAAM,CAACa,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAAA,EAEzE;AAED,IAAMC,MAAM,GAAG,SAATA,MAAMA,CAAAC,IAAA,EAA0B;EAAA,IAApBC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;EACxB,oBACEb,KAAA,CAACC,eAAe;IAACa,IAAI,EAAC,aAAa;IAAAD,QAAA,GAChCA,QAAQ,eACTf,IAAA,CAACO,mBAAmB;MAAC,eAAa;IAAiB,CAAE,CAAC;EAAA,CACvC,CAAC;AAEtB,CAAC;AAED,eAAeM,MAAM","ignoreList":[]}

package/dist/Footer/SiteFooter.cjs

@@ -37,8 +37,14 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var FooterContainer = _styledComponents["default"].footer(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  margin-top: auto;\n  background-color: ", ";\n  border-top: 8px solid ", ";\n\n  padding-top: 0;\n  padding-bottom: 16px;\n\n  ", " {\n    padding: 16px 0;\n  }\n\n  ", " {\n    padding: 16px 0;\n  }\n"])), _styles.COLORS.neutral_800, _styles.COLORS.neutral_200, _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.LARGE);
-var FooterLine = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  border-top: 1px solid ", ";\n  display: none;\n  ", " {\n    display: block;\n  }\n"])), _styles.COLORS.white, _styles.BREAKPOINTS.MEDIUM);
+var FooterContainer = _styledComponents["default"].footer(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  margin-top: auto;\n  background-color: ", ";\n  border-top: 8px solid ", ";\n\n  padding-top: 0;\n  padding-bottom: 16px;\n\n  ", " {\n    padding: 16px 0;\n  }\n\n  ", " {\n    padding: 16px 0;\n  }\n"])), function (props) {
+  return _styles.COLORS.getColor('neutral_800', props.theme);
+}, function (props) {
+  return _styles.COLORS.getColor('neutral_200', props.theme);
+}, _styles.BREAKPOINTS.MEDIUM, _styles.BREAKPOINTS.LARGE);
+var FooterLine = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  border-top: 1px solid ", ";\n  display: none;\n  ", " {\n    display: block;\n  }\n"])), function (props) {
+  return _styles.COLORS.getColor('white', props.theme);
+}, _styles.BREAKPOINTS.MEDIUM);
 var SiteFooter = function SiteFooter(_ref) {
   var id = _ref.id,
     sitename = _ref.sitename,

package/dist/Footer/SiteFooter.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SiteFooter.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_FooterBottomLinks","_FooterTop","_FooterNewsletterAndSocialSection","_FooterNavSection","_styles","_Layouts","_jsxRuntime","_excluded","_templateObject","_templateObject2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","FooterContainer","styled","footer","_taggedTemplateLiteral2","COLORS","neutral_800","neutral_200","BREAKPOINTS","MEDIUM","LARGE","FooterLine","div","white","SiteFooter","_ref","id","sitename","bottomLinks","showBetaTag","copyrightText","toTopText","placeholderEmailField","includeNewsletterAndSocialSection","newsletterLabel","navOptions","onNewsletterSignup","_ref$useMaxWidth","useMaxWidth","maxWidth","rest","_objectWithoutProperties2","jsx","children","jsxs","PageWidth","unsetMargin","mainId","placeholderEmail","actionOnNewsletterSignup","propTypes","_propTypes","string","isRequired","bool","array","func","number","_default","exports"],"sources":["../../src/Footer/SiteFooter.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import third-party libraries.\r\n */\r\nimport styled from 'styled-components';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport FooterBottomLinks from './Components/FooterBottomLinks';\r\nimport FooterTop from './Components/FooterTop';\r\nimport FooterNewsletterAndSocialSection from './Components/FooterNewsletterAndSocialSection';\r\nimport FooterNavSection from './Components/FooterNavSection';\r\nimport { BREAKPOINTS, COLORS } from '../styles';\r\n\r\n/**\r\n * Import custom styles.\r\n */\r\nimport { NavLink, NavOptions } from '../types';\r\nimport {PageWidth} from \"../Layouts\";\r\n\r\nconst FooterContainer = styled.footer`\r\n  margin-top: auto;\r\n  background-color: ${COLORS.neutral_800};\r\n  border-top: 8px solid ${COLORS.neutral_200};\r\n\r\n  padding-top: 0;\r\n  padding-bottom: 16px;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    padding: 16px 0;\r\n  }\r\n\r\n  ${BREAKPOINTS.LARGE} {\r\n    padding: 16px 0;\r\n  }\r\n`;\r\nconst FooterLine = styled.div`\r\n  border-top: 1px solid ${COLORS.white};\r\n  display: none;\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    display: block;\r\n  }\r\n`;\r\n\r\ninterface NewFooterProps  extends Omit<React.HTMLAttributes<HTMLElement>, 'id'> {\r\n  id: string;\r\n  sitename?: string;\r\n  showBetaTag?: boolean;\r\n  bottomLinks?: NavLink[];\r\n  copyrightText?: string;\r\n  includeNewsletterAndSocialSection?: boolean;\r\n  actionOnNewsletterSignup?: (email: string) => void;\r\n  newsletterLabel?: string;\r\n  toTopText: string;\r\n  navOptions?: NavOptions;\r\n  placeholderEmailField?: string;\r\n  onNewsletterSignup?: (email: string) => void;\r\n  useMaxWidth?: boolean;\r\n  maxWidth?: number;\r\n}\r\n\r\nconst SiteFooter = ({\r\n  id,\r\n  sitename,\r\n  bottomLinks,\r\n  showBetaTag,\r\n  copyrightText,\r\n  toTopText,\r\n  placeholderEmailField,\r\n  includeNewsletterAndSocialSection,\r\n  newsletterLabel,\r\n  navOptions,\r\n  onNewsletterSignup,\r\n  useMaxWidth = true,\r\n  maxWidth,\r\n  ...rest\r\n}: NewFooterProps) => {\r\n  return (\r\n    <FooterContainer id={id} data-testid={'footer-container'} {...rest}>\r\n      <PageWidth unsetMargin={true} useMaxWidth={useMaxWidth} maxWidth={maxWidth}>\r\n        <FooterTop sitename={sitename} showBetaTag={showBetaTag} toTopText={toTopText} />\r\n        {navOptions && <FooterNavSection mainId={id} navOptions={navOptions} />}\r\n        <FooterLine />\r\n        {includeNewsletterAndSocialSection && (\r\n          <FooterNewsletterAndSocialSection placeholderEmail={placeholderEmailField} actionOnNewsletterSignup={onNewsletterSignup} newsletterLabel={newsletterLabel || ''} />\r\n        )}\r\n        <FooterBottomLinks bottomLinks={bottomLinks} copyrightText={copyrightText} />\r\n      </PageWidth>\r\n    </FooterContainer>\r\n  );\r\n};\r\n\r\nexport default SiteFooter;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"SiteFooter.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_FooterBottomLinks","_FooterTop","_FooterNewsletterAndSocialSection","_FooterNavSection","_styles","_Layouts","_jsxRuntime","_excluded","_templateObject","_templateObject2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","FooterContainer","styled","footer","_taggedTemplateLiteral2","props","COLORS","getColor","theme","BREAKPOINTS","MEDIUM","LARGE","FooterLine","div","SiteFooter","_ref","id","sitename","bottomLinks","showBetaTag","copyrightText","toTopText","placeholderEmailField","includeNewsletterAndSocialSection","newsletterLabel","navOptions","onNewsletterSignup","_ref$useMaxWidth","useMaxWidth","maxWidth","rest","_objectWithoutProperties2","jsx","children","jsxs","PageWidth","unsetMargin","mainId","placeholderEmail","actionOnNewsletterSignup","propTypes","_propTypes","string","isRequired","bool","array","func","number","_default","exports"],"sources":["../../src/Footer/SiteFooter.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\n\r\n/**\r\n * Import third-party libraries.\r\n */\r\nimport styled from 'styled-components';\r\n\r\n/**\r\n * Import custom components.\r\n */\r\nimport FooterBottomLinks from './Components/FooterBottomLinks';\r\nimport FooterTop from './Components/FooterTop';\r\nimport FooterNewsletterAndSocialSection from './Components/FooterNewsletterAndSocialSection';\r\nimport FooterNavSection from './Components/FooterNavSection';\r\nimport { BREAKPOINTS, COLORS } from '../styles';\r\n\r\n/**\r\n * Import custom styles.\r\n */\r\nimport { NavLink, NavOptions } from '../types';\r\nimport {PageWidth} from \"../Layouts\";\r\n\r\nconst FooterContainer = styled.footer`\r\n  margin-top: auto;\r\n  background-color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n  border-top: 8px solid ${props => COLORS.getColor('neutral_200', props.theme)};\r\n\r\n  padding-top: 0;\r\n  padding-bottom: 16px;\r\n\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    padding: 16px 0;\r\n  }\r\n\r\n  ${BREAKPOINTS.LARGE} {\r\n    padding: 16px 0;\r\n  }\r\n`;\r\nconst FooterLine = styled.div`\r\n  border-top: 1px solid ${props => COLORS.getColor('white', props.theme)};\r\n  display: none;\r\n  ${BREAKPOINTS.MEDIUM} {\r\n    display: block;\r\n  }\r\n`;\r\n\r\ninterface NewFooterProps  extends Omit<React.HTMLAttributes<HTMLElement>, 'id'> {\r\n  id: string;\r\n  sitename?: string;\r\n  showBetaTag?: boolean;\r\n  bottomLinks?: NavLink[];\r\n  copyrightText?: string;\r\n  includeNewsletterAndSocialSection?: boolean;\r\n  actionOnNewsletterSignup?: (email: string) => void;\r\n  newsletterLabel?: string;\r\n  toTopText: string;\r\n  navOptions?: NavOptions;\r\n  placeholderEmailField?: string;\r\n  onNewsletterSignup?: (email: string) => void;\r\n  useMaxWidth?: boolean;\r\n  maxWidth?: number;\r\n}\r\n\r\nconst SiteFooter = ({\r\n  id,\r\n  sitename,\r\n  bottomLinks,\r\n  showBetaTag,\r\n  copyrightText,\r\n  toTopText,\r\n  placeholderEmailField,\r\n  includeNewsletterAndSocialSection,\r\n  newsletterLabel,\r\n  navOptions,\r\n  onNewsletterSignup,\r\n  useMaxWidth = true,\r\n  maxWidth,\r\n  ...rest\r\n}: NewFooterProps) => {\r\n  return (\r\n    <FooterContainer id={id} data-testid={'footer-container'} {...rest}>\r\n      <PageWidth unsetMargin={true} useMaxWidth={useMaxWidth} maxWidth={maxWidth}>\r\n        <FooterTop sitename={sitename} showBetaTag={showBetaTag} toTopText={toTopText} />\r\n        {navOptions && <FooterNavSection mainId={id} navOptions={navOptions} />}\r\n        <FooterLine />\r\n        {includeNewsletterAndSocialSection && (\r\n          <FooterNewsletterAndSocialSection placeholderEmail={placeholderEmailField} actionOnNewsletterSignup={onNewsletterSignup} newsletterLabel={newsletterLabel || ''} />\r\n        )}\r\n        <FooterBottomLinks bottomLinks={bottomLinks} copyrightText={copyrightText} />\r\n      </PageWidth>\r\n    </FooterContainer>\r\n  );\r\n};\r\n\r\nexport default SiteFooter;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Footer/SiteFooter.js

@@ -32,8 +32,14 @@ import { BREAKPOINTS, COLORS } from '../styles';
 import { PageWidth } from "../Layouts";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-var FooterContainer = styled.footer(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  margin-top: auto;\n  background-color: ", ";\n  border-top: 8px solid ", ";\n\n  padding-top: 0;\n  padding-bottom: 16px;\n\n  ", " {\n    padding: 16px 0;\n  }\n\n  ", " {\n    padding: 16px 0;\n  }\n"])), COLORS.neutral_800, COLORS.neutral_200, BREAKPOINTS.MEDIUM, BREAKPOINTS.LARGE);
-var FooterLine = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  border-top: 1px solid ", ";\n  display: none;\n  ", " {\n    display: block;\n  }\n"])), COLORS.white, BREAKPOINTS.MEDIUM);
+var FooterContainer = styled.footer(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  margin-top: auto;\n  background-color: ", ";\n  border-top: 8px solid ", ";\n\n  padding-top: 0;\n  padding-bottom: 16px;\n\n  ", " {\n    padding: 16px 0;\n  }\n\n  ", " {\n    padding: 16px 0;\n  }\n"])), function (props) {
+  return COLORS.getColor('neutral_800', props.theme);
+}, function (props) {
+  return COLORS.getColor('neutral_200', props.theme);
+}, BREAKPOINTS.MEDIUM, BREAKPOINTS.LARGE);
+var FooterLine = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  border-top: 1px solid ", ";\n  display: none;\n  ", " {\n    display: block;\n  }\n"])), function (props) {
+  return COLORS.getColor('white', props.theme);
+}, BREAKPOINTS.MEDIUM);
 var SiteFooter = function SiteFooter(_ref) {
   var id = _ref.id,
     sitename = _ref.sitename,