@quintype/arrow 3.15.1-perf.4 → 3.15.1-perf.8

package/molecules/StoryElementCard/index.js

@@ -1,3091 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _extends = require('@babel/runtime/helpers/extends');
-var _getClassName = require('babel-plugin-react-css-modules/dist/browser/getClassName');
-var React = require('react');
-var lodash = require('lodash');
-var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-var PropTypes = require('prop-types');
-require('@babel/runtime/helpers/asyncToGenerator');
-var _typeof = require('@babel/runtime/helpers/typeof');
-require('@babel/runtime/regenerator');
-require('react-timeago');
-require('date-fns-tz');
-var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
-var components = require('@quintype/components');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var reactRedux = require('react-redux');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n["default"] = e;
-  return Object.freeze(n);
-}
-
-var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
-var _getClassName__default = /*#__PURE__*/_interopDefaultLegacy(_getClassName);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
-var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
-var _typeof__default = /*#__PURE__*/_interopDefaultLegacy(_typeof);
-var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-
-var _excluded$e = ["element", "render"];
-var withElementWrapper = function withElementWrapper(StoryElement) {
-  return function (props) {
-    var element = props.element,
-        render = props.render,
-        restProps = _objectWithoutProperties__default["default"](props, _excluded$e);
-
-    if (!element) return null;
-    if (render && typeof render === "function") return render(props);
-    return /*#__PURE__*/React__default["default"].createElement(StoryElement, _extends__default["default"]({}, restProps, {
-      element: element
-    }));
-  };
-};
-withElementWrapper.propTypes = {
-  StoryElement: PropTypes__default["default"].element
-};
-
-var hexToRGB = function hexToRGB(hex) {
-  var r = parseInt(hex.slice(1, 3), 16);
-  var g = parseInt(hex.slice(3, 5), 16);
-  var b = parseInt(hex.slice(5, 7), 16);
-  return {
-    r: r,
-    g: g,
-    b: b
-  };
-};
-var getLuminanceOfColor = function getLuminanceOfColor(hex) {
-  var _hexToRGB = hexToRGB(hex),
-      r = _hexToRGB.r,
-      g = _hexToRGB.g,
-      b = _hexToRGB.b;
-
-  return r * 0.299 + g * 0.587 + b * 0.114;
-};
-var rgbToHex = function rgbToHex() {
-  var color = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "rgba(255, 255, 255, 0)";
-  var rgba = color.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i);
-  return rgba && rgba.length === 4 ? "#" + ("0" + parseInt(rgba[1], 10).toString(16)).slice(-2) + ("0" + parseInt(rgba[2], 10).toString(16)).slice(-2) + ("0" + parseInt(rgba[3], 10).toString(16)).slice(-2) : color;
-};
-var clientWidths = {
-  mobile: 767,
-  tablet: 1024
-};
-var clientWidth = function clientWidth(device) {
-  var foundDeviceWidth = lodash.get(clientWidths, device);
-
-  if (foundDeviceWidth) {
-    return lodash.get(global, "document.documentElement.clientWidth") <= foundDeviceWidth;
-  }
-
-  return false;
-};
-var getTextColor = function getTextColor() {
-  var theme = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "rgb(255,255,255)";
-  var isRegexCheck = /^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/.test(theme);
-  var getHexValue = !isRegexCheck ? rgbToHex(theme) : theme;
-  var textColor = getLuminanceOfColor(getHexValue) < 155 ? "light" : "dark";
-  return textColor;
-};
-
-var updateContentLinks = function updateContentLinks(content) {
-  var updatedContent = content;
-  var anchorTagsList = content.match(/(<a).*?(>)/g);
-  anchorTagsList && anchorTagsList.forEach(function (anchorTag) {
-    var isTargetPresent = /target=/g.test(anchorTag);
-
-    if (!isTargetPresent) {
-      updatedContent = updatedContent.replace(anchorTag, "<a aria-label='content' target='_blank'".concat(anchorTag.substring(2)));
-    }
-  });
-  return updatedContent;
-};
-var isEmpty = function isEmpty(value) {
-  return value == null || // From standard.js: Always use === - but value == null is allowed to check null || undefined
-  _typeof__default["default"](value) === "object" && Object.entries(value).length === 0 && value.constructor === Object || typeof value === "string" && value.trim().length === 0;
-};
-var shapeConfig = PropTypes__default["default"].shape({
-  "sketches-host": PropTypes__default["default"].string,
-  "cdn-name": PropTypes__default["default"].string,
-  "cdn-image": PropTypes__default["default"].string
-});
-var shapeStory = PropTypes__default["default"].shape({
-  headline: PropTypes__default["default"].string,
-  "last-published-at": PropTypes__default["default"].number,
-  subheadline: PropTypes__default["default"].string
-});
-var facebookMobileVideoResizeFix = function facebookMobileVideoResizeFix() {
-  if (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(max-width: 767px)").matches) {
-    var applyFixAfterTime = 3000;
-    var aspectRatioAdjustmentFactor = 0.7;
-    setTimeout(function () {
-      document.querySelectorAll(".story-element-jsembed.story-element-jsembed-facebook-post span").forEach(function (element) {
-        if (!element.classList.contains("fixed-mobile-fb-video")) {
-          element.style.height = "".concat(Math.ceil(element.offsetHeight * aspectRatioAdjustmentFactor), "px");
-          element.classList.add("fixed-mobile-fb-video");
-        }
-      });
-    }, applyFixAfterTime);
-  }
-};
-
-var StateContext = /*#__PURE__*/React.createContext(); // eslint-disable-next-line react/display-name
-var useStateValue = function useStateValue() {
-  return React.useContext(StateContext);
-};
-
-var _excluded$d = ["element", "opts", "css", "story", "config"];
-var _styleModuleImportMap$g = {
-  "./text.m.css": {
-    "viewports": "\"../../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "promotionalMessage": "text-m_promotionalMessage__CUsPM",
-    "textElement": "text-m_textElement__e3QEt",
-    "dark": "text-m_dark__1TC18",
-    "light": "text-m_light__2cRe8"
-  }
-};
-
-var TextBase = function TextBase(_ref) {
-  var _ref$element = _ref.element,
-      element = _ref$element === void 0 ? {} : _ref$element,
-      _ref$opts = _ref.opts,
-      opts = _ref$opts === void 0 ? {} : _ref$opts,
-      _ref$css = _ref.css,
-      css = _ref$css === void 0 ? {} : _ref$css;
-      _ref.story;
-      _ref.config;
-      var restProps = _objectWithoutProperties__default["default"](_ref, _excluded$d);
-
-  var content = element.text;
-  if (!content) return null;
-  var configData = useStateValue() || {};
-  var textInvertColor = getTextColor(configData.theme);
-  var textColor = css.textColor;
-  var _opts$isExternalLink = opts.isExternalLink,
-      isExternalLink = _opts$isExternalLink === void 0 ? true : _opts$isExternalLink;
-  var text = isExternalLink && updateContentLinks(content) || content;
-  var isPromotionalMessage = lodash.get(element, ["metadata", "promotional-message"], false);
-  var updatedStyle = isPromotionalMessage ? "promotionalMessage" : "textElement";
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-    style: !isPromotionalMessage ? {
-      color: textColor
-    } : {},
-    "data-test-id": isPromotionalMessage ? "promotional-message" : "text",
-    dangerouslySetInnerHTML: {
-      __html: text
-    },
-    id: "text-element"
-  }, restProps, {
-    className: "arrow-component arr--text-element " + _getClassName__default["default"]("".concat(updatedStyle, " ").concat(textInvertColor), _styleModuleImportMap$g) + (" " + (restProps ? restProps.className || "" : ""))
-  }));
-};
-
-TextBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    text: PropTypes__default["default"].string
-  }),
-  opts: PropTypes__default["default"].shape({
-    isExternalLink: PropTypes__default["default"].bool
-  }),
-  css: PropTypes__default["default"].shape({
-    hyperlinkColor: PropTypes__default["default"].string,
-    textColor: PropTypes__default["default"].string
-  }),
-  story: shapeStory,
-  config: shapeConfig
-};
-var Text = withElementWrapper(TextBase);
-
-var _excluded$c = ["element", "template", "opts", "css", "story", "config", "render"];
-var _styleModuleImportMap$f = {
-  "./blurb.m.css": {
-    "viewports": "\"../../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "blurb": "blurb-m_blurb__3pXi5",
-    "blurb-default": "blurb-m_blurb-default__JR86y",
-    "blurb-withBorder": "blurb-m_blurb-withBorder__SjW--",
-    "dark": "blurb-m_dark__1eErz",
-    "light": "blurb-m_light__OBWiH"
-  }
-};
-
-var BlurbBase = function BlurbBase(_ref) {
-  var element = _ref.element,
-      _ref$template = _ref.template,
-      template = _ref$template === void 0 ? "" : _ref$template,
-      _ref$opts = _ref.opts,
-      opts = _ref$opts === void 0 ? {} : _ref$opts,
-      _ref$css = _ref.css,
-      css = _ref$css === void 0 ? {} : _ref$css;
-      _ref.story;
-      _ref.config;
-      _ref.render;
-      var restProps = _objectWithoutProperties__default["default"](_ref, _excluded$c);
-
-  var content = element.text;
-  var borderColor = css.borderColor;
-  var initBorderDirection = template === "withBorder" ? {
-    border: "solid 2px ".concat(borderColor)
-  } : {
-    borderLeft: "solid 2px ".concat(borderColor)
-  };
-
-  var _useState = React.useState(initBorderDirection),
-      _useState2 = _slicedToArray__default["default"](_useState, 2),
-      borderDirection = _useState2[0],
-      setBorderDirection = _useState2[1];
-
-  if (!content) return null;
-  React.useEffect(function () {
-    var htmlElement = document.getElementsByTagName("HTML");
-
-    if (htmlElement && htmlElement.length) {
-      if (htmlElement[0].dir.toLowerCase() === "rtl" && template !== "withBorder") {
-        setBorderDirection({
-          borderRight: "solid 2px ".concat(borderColor)
-        });
-      }
-    }
-  }, []);
-  var _opts$isExternalLink = opts.isExternalLink,
-      isExternalLink = _opts$isExternalLink === void 0 ? true : _opts$isExternalLink;
-  var text = isExternalLink && updateContentLinks(content) || content;
-  var templateStyle = template ? "blurb-".concat(template) : "blurb";
-  var configData = useStateValue() || {};
-  var textInvertColor = getTextColor(configData.theme);
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-    "data-test-id": "blurb",
-    style: borderColor && borderDirection,
-    dangerouslySetInnerHTML: {
-      __html: text
-    }
-  }, restProps, {
-    className: "arrow-component arr-custom-style arr--blurb-element " + _getClassName__default["default"]("".concat(templateStyle, " ").concat(textInvertColor), _styleModuleImportMap$f) + (" " + (restProps ? restProps.className || "" : ""))
-  }));
-};
-
-BlurbBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    text: PropTypes__default["default"].string
-  }),
-
-  /** templates can be either default or withBorder */
-  template: PropTypes__default["default"].string,
-  opts: PropTypes__default["default"].shape({
-    isExternalLink: PropTypes__default["default"].bool
-  }),
-  story: shapeStory,
-  config: shapeConfig,
-  render: PropTypes__default["default"].func,
-  css: PropTypes__default["default"].object
-};
-var Blurb = withElementWrapper(BlurbBase);
-
-var _excluded$b = ["element", "template", "opts", "css", "story", "config", "render"];
-var _styleModuleImportMap$e = {
-  "./summary.m.css": {
-    "viewports": "\"../../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "headline": "summary-m_headline__30sie",
-    "summary": "summary-m_summary__3-CnO",
-    "content": "summary-m_content__37n8C",
-    "summary-header": "summary-m_summary-header__UKVHi",
-    "summary-border": "summary-m_summary-border__M9hrr",
-    "dark": "summary-m_dark__1ZuzR",
-    "light": "summary-m_light__2SYiC",
-    "heading-wrapper": "summary-m_heading-wrapper__23S51",
-    "content-border": "summary-m_content-border__3ilmJ"
-  }
-};
-
-var SummaryBase = function SummaryBase(_ref) {
-  var element = _ref.element,
-      _ref$template = _ref.template,
-      template = _ref$template === void 0 ? "" : _ref$template,
-      _ref$opts = _ref.opts,
-      opts = _ref$opts === void 0 ? {} : _ref$opts,
-      _ref$css = _ref.css,
-      css = _ref$css === void 0 ? {} : _ref$css;
-      _ref.story;
-      _ref.config;
-      _ref.render;
-      var restProps = _objectWithoutProperties__default["default"](_ref, _excluded$b);
-
-  var configData = useStateValue() || {};
-  var textInvertColor = getTextColor(configData.theme);
-  var content = element.text;
-  if (!content) return null;
-  var headerBgColor = css.headerBgColor;
-  var _opts$isExternalLink = opts.isExternalLink,
-      isExternalLink = _opts$isExternalLink === void 0 ? true : _opts$isExternalLink,
-      _opts$headline = opts.headline,
-      headline = _opts$headline === void 0 ? "Summary" : _opts$headline,
-      _opts$hideHeadline = opts.hideHeadline,
-      hideHeadline = _opts$hideHeadline === void 0 ? false : _opts$hideHeadline;
-  var text = isExternalLink && updateContentLinks(content) || content;
-  var supportedTemplates = ["header", "border"];
-  var templateStyle = supportedTemplates.includes(template) ? "summary-".concat(template) : "summary";
-  var contentBorder = hideHeadline ? "content-border" : "";
-  var renderTemplate = template === "header" || template === "border";
-  var updateHeaderColor = renderTemplate ? "".concat(headerBgColor) : "";
-  var textColor = renderTemplate ? getTextColor(headerBgColor) : "";
-  var updateContentColor = template === "header" ? "" : textInvertColor;
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-    "data-test-id": "summary"
-  }, restProps, {
-    className: "arrow-component arr--summary-element arr-custom-style " + _getClassName__default["default"](templateStyle, _styleModuleImportMap$e) + (" " + (restProps ? restProps.className || "" : ""))
-  }), !hideHeadline && /*#__PURE__*/React__default["default"].createElement("div", {
-    "data-test-id": "summary-headline",
-    className: _getClassName__default["default"]("heading-wrapper ".concat(textInvertColor), _styleModuleImportMap$e)
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    style: {
-      backgroundColor: updateHeaderColor
-    },
-    className: _getClassName__default["default"]("headline ".concat(textColor, " ").concat(textInvertColor), _styleModuleImportMap$e)
-  }, headline)), /*#__PURE__*/React__default["default"].createElement("div", {
-    dangerouslySetInnerHTML: {
-      __html: text
-    },
-    className: _getClassName__default["default"]("content ".concat(contentBorder, " ").concat(updateContentColor, " ").concat(textInvertColor), _styleModuleImportMap$e)
-  }));
-};
-
-SummaryBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    text: PropTypes__default["default"].string
-  }),
-  template: PropTypes__default["default"].string,
-  opts: PropTypes__default["default"].shape({
-    isExternalLink: PropTypes__default["default"].bool,
-    headline: PropTypes__default["default"].string,
-    hideHeadline: PropTypes__default["default"].bool
-  }),
-  story: shapeStory,
-  config: shapeConfig,
-  render: PropTypes__default["default"].func,
-  css: PropTypes__default["default"].shape({
-    headerBgColor: PropTypes__default["default"].string
-  })
-};
-var Summary = withElementWrapper(SummaryBase);
-
-var CurveIcon = function CurveIcon(_ref) {
-  var width = _ref.width,
-      height = _ref.height,
-      color = _ref.color,
-      opacity = _ref.opacity;
-  var lightColor = color === "light" && "#ffffff";
-  var darkColor = color === "dark" && "#0d0d0d";
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "icon-m_curve-wrapper__3-sLV",
-    style: {
-      fill: "".concat(lightColor || darkColor || color)
-    }
-  }, /*#__PURE__*/React__default["default"].createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: width,
-    height: height,
-    viewBox: "0 0 64 64"
-  }, /*#__PURE__*/React__default["default"].createElement("path", {
-    fill: "inherit",
-    opacity: opacity,
-    d: "M61 44.702c0 3.465-1.13 6.214-3.39 8.248-2.261 2.033-5.125 3.05-8.59 3.05-4.07 0-7.423-1.356-10.06-4.067-2.638-2.712-3.956-6.704-3.956-11.976 0-4.971.716-9.227 2.147-12.767 1.432-3.54 3.165-6.553 5.2-9.039 2.034-2.485 4.144-4.481 6.33-5.988 2.184-1.506 4.106-2.56 5.763-3.163l5.652 7.909c-3.316 1.657-5.99 3.879-8.025 6.666-2.035 2.786-3.052 6.289-3.052 10.507.603-.15 1.432-.226 2.487-.226 3.014 0 5.35 1.054 7.007 3.163C60.171 39.13 61 41.69 61 44.702zm-33.004 0c0 3.465-1.13 6.214-3.39 8.248-2.261 2.033-5.125 3.05-8.59 3.05-4.07 0-7.423-1.356-10.06-4.067C3.319 49.22 2 45.229 2 39.957c0-4.971.716-9.227 2.148-12.767 1.431-3.54 3.164-6.553 5.199-9.039 2.034-2.485 4.144-4.481 6.33-5.988C17.86 10.657 19.782 9.603 21.44 9l5.651 7.909c-3.316 1.657-5.99 3.879-8.025 6.666-2.034 2.786-3.052 6.289-3.052 10.507.603-.15 1.432-.226 2.487-.226 3.014 0 5.35 1.054 7.008 3.163 1.657 2.11 2.486 4.67 2.486 7.683z"
-  })));
-};
-CurveIcon.propTypes = {
-  width: PropTypes__default["default"].string,
-  height: PropTypes__default["default"].string,
-  color: PropTypes__default["default"].string,
-  opacity: PropTypes__default["default"].string
-};
-
-var EdgeIcon = function EdgeIcon(_ref) {
-  var width = _ref.width,
-      height = _ref.height,
-      color = _ref.color,
-      opacity = _ref.opacity;
-  var lightColor = color === "light" && "#ffffff";
-  var darkColor = color === "dark" && "#0d0d0d";
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "icon-m_edge-wrapper__xUOdp",
-    style: {
-      fill: "".concat(lightColor || darkColor || color)
-    }
-  }, /*#__PURE__*/React__default["default"].createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: width,
-    height: height,
-    viewBox: "0 0 64 64"
-  }, /*#__PURE__*/React__default["default"].createElement("path", {
-    fill: "inherit",
-    opacity: opacity,
-    d: "M16.858 29.836v4.727H28V60H4V29.836c0-9.6 2.606-16.727 7.746-21.187C15.3 5.564 19.8 4 25.122 4v13.627c-2.888 0-8.264 0-8.264 12.209zm40.264-12.21V4c-5.32 0-9.82 1.564-13.376 4.65C38.606 13.108 36 20.236 36 29.835V60h24V34.563H48.857v-4.727c0-12.21 5.377-12.21 8.265-12.21z"
-  })));
-};
-EdgeIcon.propTypes = {
-  width: PropTypes__default["default"].string,
-  height: PropTypes__default["default"].string,
-  color: PropTypes__default["default"].string,
-  opacity: PropTypes__default["default"].string
-};
-
-var _excluded$a = ["element", "template", "css", "story", "config", "render"];
-var _styleModuleImportMap$d = {
-  "./block-quote.m.css": {
-    "viewports": "\"../../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "blockquote-withBackground": "block-quote-m_blockquote-withBackground__1yW-u",
-    "icon": "block-quote-m_icon__m-EIZ",
-    "icon-border": "block-quote-m_icon-border__2xQQY",
-    "blockquote": "block-quote-m_blockquote__HPVh0",
-    "blockquote-default": "block-quote-m_blockquote-default__fZ8a1",
-    "blockquote-withBorder": "block-quote-m_blockquote-withBorder__1GVQL",
-    "border": "block-quote-m_border__1ZTPR",
-    "content": "block-quote-m_content__xpMqX",
-    "wrapper": "block-quote-m_wrapper__2KEhw",
-    "attribution": "block-quote-m_attribution__2m4s2",
-    "quote-wrapper": "block-quote-m_quote-wrapper__83bEy",
-    "dark": "block-quote-m_dark__HaZuG",
-    "light": "block-quote-m_light__1QrNc"
-  }
-};
-
-var SelectionOfIcon = function SelectionOfIcon(iconType, template, blockQuoteColor, quoteColor) {
-  var isMobile = clientWidth("mobile");
-  var dimension = isMobile ? "48px" : "64px";
-
-  if (template === "withBackground") {
-    if (iconType === "edgeIcon") {
-      return /*#__PURE__*/React__default["default"].createElement(EdgeIcon, {
-        width: dimension,
-        height: dimension,
-        color: quoteColor,
-        opacity: ".4"
-      });
-    }
-
-    return /*#__PURE__*/React__default["default"].createElement(CurveIcon, {
-      width: dimension,
-      height: dimension,
-      color: quoteColor,
-      opacity: ".4"
-    });
-  }
-
-  if (template !== "withBackground") {
-    if (iconType === "edgeIcon") {
-      return /*#__PURE__*/React__default["default"].createElement(EdgeIcon, {
-        width: dimension,
-        height: dimension,
-        color: blockQuoteColor
-      });
-    }
-
-    return /*#__PURE__*/React__default["default"].createElement(CurveIcon, {
-      width: dimension,
-      height: dimension,
-      color: blockQuoteColor
-    });
-  }
-};
-
-var BlockQuoteBase = function BlockQuoteBase(_ref) {
-  var element = _ref.element,
-      template = _ref.template,
-      _ref$css = _ref.css,
-      css = _ref$css === void 0 ? {} : _ref$css;
-      _ref.story;
-      _ref.config;
-      _ref.render;
-      var restProps = _objectWithoutProperties__default["default"](_ref, _excluded$a);
-
-  var _get = lodash.get(element, ["metadata"]),
-      content = _get.content,
-      attribution = _get.attribution;
-
-  if (!content) return null;
-  var blockQuoteColor = css.blockQuoteColor,
-      backgroundShade = css.backgroundShade,
-      iconType = css.iconType;
-  var templateStyle = template ? "blockquote-".concat(template) : "blockquote";
-  var isBackground = template === "withBackground";
-  var textColor = isBackground ? getTextColor(backgroundShade) : "";
-  var theme = isBackground && backgroundShade ? {
-    backgroundColor: backgroundShade
-  } : {};
-  var configData = useStateValue() || {};
-  var textInvertColor = getTextColor(isBackground ? theme.backgroundColor : configData.theme);
-
-  var updateStructure = function updateStructure() {
-    return template === "withBorder" ? /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "block-quote-m_icon-border__2xQQY"
-    }, /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "block-quote-m_icon__m-EIZ"
-    }, SelectionOfIcon(iconType, template, blockQuoteColor, textColor)), /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "block-quote-m_border__1ZTPR",
-      style: blockQuoteColor && {
-        backgroundColor: blockQuoteColor
-      }
-    })) : /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "block-quote-m_icon__m-EIZ"
-    }, SelectionOfIcon(iconType, template, blockQuoteColor, textColor));
-  };
-
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-    "data-test-id": "blockquote",
-    style: theme
-  }, restProps, {
-    className: "arrow-component arr--block-quote " + _getClassName__default["default"]("".concat(templateStyle, " ").concat(textColor), _styleModuleImportMap$d) + (" " + (restProps ? restProps.className || "" : ""))
-  }), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "block-quote-m_quote-wrapper__83bEy"
-  }, updateStructure(), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "block-quote-m_wrapper__2KEhw",
-    style: blockQuoteColor && {
-      borderColor: blockQuoteColor
-    }
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    dangerouslySetInnerHTML: {
-      __html: content
-    },
-    className: _getClassName__default["default"]("content ".concat(textInvertColor), _styleModuleImportMap$d)
-  }), /*#__PURE__*/React__default["default"].createElement("div", {
-    dangerouslySetInnerHTML: {
-      __html: attribution
-    },
-    className: _getClassName__default["default"]("attribution ".concat(textInvertColor), _styleModuleImportMap$d)
-  }))));
-};
-BlockQuoteBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    metadata: PropTypes__default["default"].shape({
-      content: PropTypes__default["default"].string,
-      attribution: PropTypes__default["default"].string
-    })
-  }),
-  template: PropTypes__default["default"].string,
-  story: shapeStory,
-  config: shapeConfig,
-  render: PropTypes__default["default"].func,
-  css: PropTypes__default["default"].object
-};
-var BlockQuote = withElementWrapper(BlockQuoteBase);
-
-var _excluded$9 = ["element", "story", "config"];
-var _styleModuleImportMap$c = {
-  "./big-fact.m.css": {
-    "viewports": "\"../../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "bigfact-element": "big-fact-m_bigfact-element__3uAwv",
-    "light": "big-fact-m_light__ha49M",
-    "content": "big-fact-m_content__1u2Ul",
-    "attribution": "big-fact-m_attribution__3XK_P",
-    "dark": "big-fact-m_dark__7a_KC"
-  }
-};
-
-var BigFactBase = function BigFactBase(_ref) {
-  var element = _ref.element;
-      _ref.story;
-      _ref.config;
-      var restProps = _objectWithoutProperties__default["default"](_ref, _excluded$9);
-
-  var configData = useStateValue() || {};
-  var textInvertColor = getTextColor(configData.theme);
-  var _element$metadata = element.metadata,
-      content = _element$metadata.content,
-      attribution = _element$metadata.attribution;
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-    "data-test-id": "bigfact"
-  }, restProps, {
-    className: "arrow-component arr--bigfact-element " + _getClassName__default["default"]("bigfact-element ".concat(textInvertColor), _styleModuleImportMap$c) + (" " + (restProps ? restProps.className || "" : ""))
-  }), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "big-fact-m_content__1u2Ul"
-  }, content), /*#__PURE__*/React__default["default"].createElement("div", {
-    "data-test-id": "attribution",
-    className: _getClassName__default["default"]("attribution ".concat(textInvertColor), _styleModuleImportMap$c)
-  }, attribution));
-};
-
-BigFactBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    metadata: PropTypes__default["default"].shape({
-      content: PropTypes__default["default"].string,
-      attribution: PropTypes__default["default"].string
-    })
-  }),
-  story: PropTypes__default["default"].object,
-  config: PropTypes__default["default"].object
-};
-var BigFact = withElementWrapper(BigFactBase);
-
-var ImageFallbackIcon = function ImageFallbackIcon(_ref) {
-  var _ref$width = _ref.width,
-      width = _ref$width === void 0 ? 40 : _ref$width,
-      _ref$height = _ref.height,
-      height = _ref$height === void 0 ? 30 : _ref$height,
-      _ref$iconColor = _ref.iconColor,
-      iconColor = _ref$iconColor === void 0 ? "#99B0CB" : _ref$iconColor;
-  return /*#__PURE__*/React__default["default"].createElement("svg", {
-    width: width,
-    height: height,
-    viewBox: "0 0 102 76",
-    version: "1.1"
-  }, /*#__PURE__*/React__default["default"].createElement("g", {
-    id: "demo-home-copy",
-    stroke: "none",
-    strokeWidth: "1",
-    fill: "none",
-    fillRule: "evenodd",
-    transform: "translate(-377.000000, -314.000000)"
-  }, /*#__PURE__*/React__default["default"].createElement("g", {
-    id: "Group-13",
-    transform: "translate(377.000000, 314.000000)"
-  }, /*#__PURE__*/React__default["default"].createElement("path", {
-    d: "M43.2,49.7 L62.2,19.2 L87.2,59.4 L17,59.4 L32.8,39.4 L43.2,49.7 Z M29.9,28.6 C25.8683213,28.6 22.6,25.3316787 22.6,21.3 C22.6,17.2683213 25.8683213,14 29.9,14 C33.9316787,14 37.2,17.2683213 37.2,21.3 C37.2,25.3316787 33.9316787,28.6 29.9,28.6 Z",
-    id: "Combined-Shape",
-    fill: iconColor,
-    fillRule: "nonzero"
-  }), /*#__PURE__*/React__default["default"].createElement("rect", {
-    id: "Rectangle-19",
-    stroke: iconColor,
-    strokeWidth: "3",
-    x: "1.5",
-    y: "1.5",
-    width: "99",
-    height: "73",
-    rx: "3"
-  }))));
-};
-ImageFallbackIcon.propTypes = {
-  width: PropTypes__default["default"].object,
-  height: PropTypes__default["default"].object,
-  iconColor: PropTypes__default["default"].object
-};
-
-var imageFallback = function imageFallback() {
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "arr--fallback-image fallback-m_image__1GYCJ fallback-m_image-position__3KddP"
-  }, /*#__PURE__*/React__default["default"].createElement("figure", {
-    className: "arr--fallback-svg fallback-m_fallback-svg__tK9fL"
-  }, /*#__PURE__*/React__default["default"].createElement(ImageFallbackIcon, null)));
-};
-
-var FallbackImage = function FallbackImage(_ref) {
-  var slug = _ref.slug;
-
-  if (slug) {
-    return /*#__PURE__*/React__default["default"].createElement(components.Link, {
-      href: slug,
-      "aria-label": "image-fallback"
-    }, imageFallback());
-  } else {
-    return imageFallback();
-  }
-};
-FallbackImage.propTypes = {
-  slug: PropTypes__default["default"].string
-};
-
-var _excluded$8 = ["story", "element", "template", "opts", "css", "config", "render"];
-var _styleModuleImportMap$b = {
-  "./also-read.m.css": {
-    "viewports": "\"../../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "card-image": "also-read-m_card-image__3CwAv",
-    "default-text": "also-read-m_default-text__hp2dp",
-    "alsoread-textLeftAlign": "also-read-m_alsoread-textLeftAlign__S0Dxe",
-    "alsoread-imageRightAlign": "also-read-m_alsoread-imageRightAlign__1bsF3",
-    "headline": "also-read-m_headline__VzF-c",
-    "alsoread-default": "also-read-m_alsoread-default__3cYER",
-    "card-image-wrapper": "also-read-m_card-image-wrapper__3GFzu",
-    "image": "also-read-m_image__2jdRP",
-    "content-wrapper": "also-read-m_content-wrapper__26AZX",
-    "alsoread": "also-read-m_alsoread__1crOV",
-    "dark": "also-read-m_dark__1pUib",
-    "light": "also-read-m_light__bTCze"
-  }
-};
-
-var DisplayImage = function DisplayImage(_ref) {
-  var story = _ref.story,
-      linkedImage = _ref.linkedImage,
-      template = _ref.template,
-      isRightAlign = _ref.isRightAlign;
-  var isLeftAlign = template === "textLeftAlign";
-  var isMobile = clientWidth("mobile");
-  var rightAlignAspectRatio = isRightAlign && isMobile ? [4, 3] : [16, 9];
-  var imageAspectRatio = isLeftAlign ? [16, 9] : rightAlignAspectRatio;
-  var alternateText = story["hero-image-caption"] || story["headline"];
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "also-read-m_card-image-wrapper__3GFzu"
-  }, !isEmpty(linkedImage) ? /*#__PURE__*/React__default["default"].createElement("figure", {
-    className: "also-read-m_card-image__3CwAv"
-  }, /*#__PURE__*/React__default["default"].createElement(components.LazyLoadImages, null, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
-    slug: linkedImage,
-    "aspect-ratio": imageAspectRatio,
-    defaultWidth: 480,
-    widths: [250, 480, 640],
-    imgParams: {
-      auto: ["format", "compress"]
-    },
-    alt: alternateText
-  }))) : /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "arr--fallback-also-read also-read-m_image__2jdRP"
-  }, /*#__PURE__*/React__default["default"].createElement(FallbackImage, null)));
-};
-
-DisplayImage.propTypes = {
-  story: PropTypes__default["default"].shape({
-    "hero-image-caption": PropTypes__default["default"].string,
-    headline: PropTypes__default["default"].string
-  }),
-  linkedImage: PropTypes__default["default"].string,
-  template: PropTypes__default["default"].string,
-  isRightAlign: PropTypes__default["default"].bool
-};
-
-var AlsoReadBase = function AlsoReadBase(_ref2) {
-  var _ref2$story = _ref2.story,
-      story = _ref2$story === void 0 ? {} : _ref2$story,
-      element = _ref2.element,
-      _ref2$template = _ref2.template,
-      template = _ref2$template === void 0 ? "" : _ref2$template,
-      _ref2$opts = _ref2.opts,
-      opts = _ref2$opts === void 0 ? {} : _ref2$opts,
-      _ref2$css = _ref2.css,
-      css = _ref2$css === void 0 ? {} : _ref2$css;
-      _ref2.config;
-      _ref2.render;
-      var restProps = _objectWithoutProperties__default["default"](_ref2, _excluded$8);
-
-  var content = element.text;
-  if (!content) return null;
-  var linkedStories = lodash.get(story, ["linked-stories"], {});
-  var linkedStoryId = lodash.get(element, ["metadata", "linked-story-id"]);
-  var linkedStorySlug = lodash.get(linkedStories, [linkedStoryId, "url"]);
-  var linkedImage = lodash.get(linkedStories, [linkedStoryId, "hero-image-s3-key"], "");
-  var storyUrl = linkedStorySlug && linkedStorySlug;
-  var configData = useStateValue() || {};
-  var textInvertColor = getTextColor(configData.theme);
-  var _opts$title = opts.title,
-      title = _opts$title === void 0 ? "" : _opts$title;
-  var textColor = css.textColor;
-  var displayTitle = title || "Also Read";
-  var isDefault = template === "" || template === "default";
-  var isRightAlign = template === "imageRightAlign";
-  var templateStyle = template ? "alsoread-".concat(template) : "alsoread-default";
-  return /*#__PURE__*/React__default["default"].createElement(components.Link, _extends__default["default"]({
-    "data-test-id": "also-read",
-    href: storyUrl,
-    "aria-label": "also-read"
-  }, restProps, {
-    className: "arrow-component arr--also-read-element " + _getClassName__default["default"](templateStyle, _styleModuleImportMap$b) + (" " + (restProps ? restProps.className || "" : ""))
-  }), !isDefault && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: _getClassName__default["default"]("default-text ".concat(textInvertColor), _styleModuleImportMap$b)
-  }, displayTitle), isDefault && /*#__PURE__*/React__default["default"].createElement(DisplayImage, {
-    story: story,
-    linkedImage: linkedImage,
-    template: template,
-    isRightAlign: isRightAlign
-  }), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "also-read-m_content-wrapper__26AZX"
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "also-read-m_headline__VzF-c",
-    style: textColor ? {
-      color: textColor
-    } : {
-      color: textInvertColor
-    },
-    dangerouslySetInnerHTML: {
-      __html: content
-    }
-  }), isRightAlign && /*#__PURE__*/React__default["default"].createElement(DisplayImage, {
-    story: story,
-    linkedImage: linkedImage,
-    template: template
-  })));
-};
-
-AlsoReadBase.propTypes = {
-  /**  template can be default, textLeftAlign or imageRightAlign */
-  template: PropTypes__default["default"].string,
-  story: PropTypes__default["default"].shape({
-    "linked-stories": PropTypes__default["default"].object
-  }),
-  element: PropTypes__default["default"].shape({
-    text: PropTypes__default["default"].string,
-    metadata: PropTypes__default["default"].shape({
-      linkedStoryId: PropTypes__default["default"].shape({
-        url: PropTypes__default["default"].string,
-        "hero-image-s3-key": PropTypes__default["default"].string
-      })
-    })
-  }),
-  opts: PropTypes__default["default"].shape({
-    title: PropTypes__default["default"].string
-  }),
-  config: shapeConfig,
-  render: PropTypes__default["default"].func,
-  css: PropTypes__default["default"].object
-};
-var AlsoRead = withElementWrapper(AlsoReadBase);
-
-var Loading = function Loading(_ref) {
-  _ref.width;
-      _ref.height;
-      _ref.iconColor;
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "loading-m_loading-indicator__2Dlst"
-  }, /*#__PURE__*/React__default["default"].createElement("svg", {
-    width: "40",
-    height: "40",
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 100 100",
-    preserveAspectRatio: "xMidYMid"
-  }, /*#__PURE__*/React__default["default"].createElement("circle", {
-    cx: "84",
-    cy: "50",
-    r: "0",
-    fill: "currentColor"
-  }, /*#__PURE__*/React__default["default"].createElement("animate", {
-    attributeName: "r",
-    values: "10;0;0;0;0",
-    keyTimes: "0;0.25;0.5;0.75;1",
-    keySplines: "0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1",
-    calcMode: "spline",
-    dur: "2s",
-    repeatCount: "indefinite",
-    begin: "0s"
-  }), /*#__PURE__*/React__default["default"].createElement("animate", {
-    attributeName: "cx",
-    values: "84;84;84;84;84",
-    keyTimes: "0;0.25;0.5;0.75;1",
-    keySplines: "0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1",
-    calcMode: "spline",
-    dur: "2s",
-    repeatCount: "indefinite",
-    begin: "0s"
-  })), /*#__PURE__*/React__default["default"].createElement("circle", {
-    cx: "84",
-    cy: "50",
-    r: ".709",
-    fill: "currentColor"
-  }, /*#__PURE__*/React__default["default"].createElement("animate", {
-    attributeName: "r",
-    values: "0;10;10;10;0",
-    keyTimes: "0;0.25;0.5;0.75;1",
-    keySplines: "0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1",
-    calcMode: "spline",
-    dur: "2s",
-    repeatCount: "indefinite",
-    begin: "-1s"
-  }), /*#__PURE__*/React__default["default"].createElement("animate", {
-    attributeName: "cx",
-    values: "16;16;50;84;84",
-    keyTimes: "0;0.25;0.5;0.75;1",
-    keySplines: "0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1",
-    calcMode: "spline",
-    dur: "2s",
-    repeatCount: "indefinite",
-    begin: "-1s"
-  })), /*#__PURE__*/React__default["default"].createElement("circle", {
-    cx: "81.59",
-    cy: "50",
-    r: "10",
-    fill: "currentColor"
-  }, /*#__PURE__*/React__default["default"].createElement("animate", {
-    attributeName: "r",
-    values: "0;10;10;10;0",
-    keyTimes: "0;0.25;0.5;0.75;1",
-    keySplines: "0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1",
-    calcMode: "spline",
-    dur: "2s",
-    repeatCount: "indefinite",
-    begin: "-0.5s"
-  }), /*#__PURE__*/React__default["default"].createElement("animate", {
-    attributeName: "cx",
-    values: "16;16;50;84;84",
-    keyTimes: "0;0.25;0.5;0.75;1",
-    keySplines: "0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1",
-    calcMode: "spline",
-    dur: "2s",
-    repeatCount: "indefinite",
-    begin: "-0.5s"
-  })), /*#__PURE__*/React__default["default"].createElement("circle", {
-    cx: "47.59",
-    cy: "50",
-    r: "10",
-    fill: "currentColor"
-  }, /*#__PURE__*/React__default["default"].createElement("animate", {
-    attributeName: "r",
-    values: "0;10;10;10;0",
-    keyTimes: "0;0.25;0.5;0.75;1",
-    keySplines: "0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1",
-    calcMode: "spline",
-    dur: "2s",
-    repeatCount: "indefinite",
-    begin: "0s"
-  }), /*#__PURE__*/React__default["default"].createElement("animate", {
-    attributeName: "cx",
-    values: "16;16;50;84;84",
-    keyTimes: "0;0.25;0.5;0.75;1",
-    keySplines: "0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1",
-    calcMode: "spline",
-    dur: "2s",
-    repeatCount: "indefinite",
-    begin: "0s"
-  })), /*#__PURE__*/React__default["default"].createElement("circle", {
-    cx: "16",
-    cy: "50",
-    r: "9.291",
-    fill: "currentColor"
-  }, /*#__PURE__*/React__default["default"].createElement("animate", {
-    attributeName: "r",
-    values: "0;0;10;10;10",
-    keyTimes: "0;0.25;0.5;0.75;1",
-    keySplines: "0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1",
-    calcMode: "spline",
-    dur: "2s",
-    repeatCount: "indefinite",
-    begin: "0s"
-  }), /*#__PURE__*/React__default["default"].createElement("animate", {
-    attributeName: "cx",
-    values: "16;16;16;50;84",
-    keyTimes: "0;0.25;0.5;0.75;1",
-    keySplines: "0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1",
-    calcMode: "spline",
-    dur: "2s",
-    repeatCount: "indefinite",
-    begin: "0s"
-  }))));
-};
-Loading.propTypes = {
-  width: PropTypes__default["default"].object,
-  height: PropTypes__default["default"].object,
-  iconColor: PropTypes__default["default"].object
-};
-
-var HyperLinkIcon = function HyperLinkIcon() {
-  return /*#__PURE__*/React__default["default"].createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "36",
-    height: "28"
-  }, /*#__PURE__*/React__default["default"].createElement("g", {
-    fill: "none",
-    fillRule: "evenodd"
-  }, /*#__PURE__*/React__default["default"].createElement("rect", {
-    width: "36",
-    height: "28",
-    fill: "#3D6FCF",
-    rx: "4"
-  }), /*#__PURE__*/React__default["default"].createElement("path", {
-    stroke: "#FFF",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: "2",
-    d: "M22 14.667v4c0 .736-.597 1.333-1.333 1.333h-7.334A1.333 1.333 0 0112 18.667v-7.334c0-.736.597-1.333 1.333-1.333h4M20 8h4v4m-7.333 3.333L24 8"
-  })));
-};
-
-var HyperLink = function HyperLink(_ref) {
-  var _ref$hyperLink = _ref.hyperLink,
-      hyperLink = _ref$hyperLink === void 0 ? "" : _ref$hyperLink;
-  if (!hyperLink) return null;
-  return /*#__PURE__*/React__default["default"].createElement(components.Link, {
-    href: hyperLink,
-    "aria-label": "hyperlink-button",
-    className: "arr--hyperlink-button hyperlink-m_hyperlink-button__1CqWx",
-    target: "_blank",
-    rel: "noopener noreferrer"
-  }, /*#__PURE__*/React__default["default"].createElement(HyperLinkIcon, null));
-};
-HyperLink.propTypes = {
-  hyperLink: PropTypes__default["default"].string
-};
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var Lightbox = /*#__PURE__*/React.lazy(function () {
-  return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-image-lightbox')); });
-});
-var FullScreenImages = function FullScreenImages(_ref) {
-  var _ref$imageSlug = _ref.imageSlug,
-      imageSlug = _ref$imageSlug === void 0 ? "" : _ref$imageSlug,
-      template = _ref.template,
-      _ref$element = _ref.element,
-      element = _ref$element === void 0 ? {} : _ref$element,
-      props = _ref.props;
-  var cdnImage = reactRedux.useSelector(function (state) {
-    return lodash.get(state, ["qt", "config", "cdn-image"]);
-  });
-
-  var _useState = React.useState(0),
-      _useState2 = _slicedToArray__default["default"](_useState, 2),
-      photoIndex = _useState2[0],
-      handleImage = _useState2[1];
-
-  var _useState3 = React.useState(false),
-      _useState4 = _slicedToArray__default["default"](_useState3, 2),
-      isOpen = _useState4[0],
-      handleOpen = _useState4[1];
-
-  var deviceWidth = lodash.get(global, ["innerWidth"], 0);
-  var hyperlinks = lodash.get(element, ["story-elements"], []).map(function (image) {
-    return image.hyperlink;
-  });
-  var imageUrlList = [];
-
-  if (!imageSlug) {
-    imageUrlList = lodash.get(element, ["story-elements"], []).map(function (image) {
-      return "//".concat(cdnImage, "/").concat(image["image-s3-key"], "?w=").concat(deviceWidth);
-    });
-  }
-
-  var onClickHandler = function onClickHandler(index) {
-    handleOpen(true);
-    handleImage(index);
-  };
-
-  var onClickKey = imageSlug ? "onClick" : "onClickHandler";
-  var imageUrlListLength = imageUrlList.length;
-
-  var onMoveNext = function onMoveNext(imageUrlListLength) {
-    var next = (photoIndex + 1) % imageUrlListLength;
-    handleImage(next);
-  };
-
-  var onMovePrev = function onMovePrev(imageUrlListLength) {
-    var prev = (photoIndex + imageUrlListLength - 1) % imageUrlListLength;
-    handleImage(prev);
-  };
-
-  var onClose = function onClose() {
-    handleImage(0);
-    handleOpen(false);
-  };
-
-  var getHyperLink = function getHyperLink() {
-    if (element.hyperlink || hyperlinks[photoIndex]) {
-      return /*#__PURE__*/React__default["default"].createElement(HyperLink, {
-        hyperLink: element.hyperlink || hyperlinks[photoIndex]
-      });
-    }
-
-    return null;
-  };
-
-  var lightboxProps = imageSlug ? {
-    mainSrc: "//".concat(cdnImage, "/").concat(imageSlug, "?w=").concat(deviceWidth),
-    toolbarButtons: [getHyperLink()]
-  } : {
-    mainSrc: imageUrlList[photoIndex],
-    nextSrc: imageUrlList[(photoIndex + 1) % imageUrlListLength],
-    prevSrc: imageUrlList[(photoIndex + imageUrlListLength - 1) % imageUrlListLength],
-    onMoveNextRequest: function onMoveNextRequest() {
-      return onMoveNext(imageUrlListLength);
-    },
-    onMovePrevRequest: function onMovePrevRequest() {
-      return onMovePrev(imageUrlListLength);
-    },
-    toolbarButtons: [getHyperLink()]
-  };
-
-  var LoadingScreen = function LoadingScreen() {
-    return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(Loading, null));
-  };
-
-  return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(template, _objectSpread(_defineProperty__default["default"]({}, onClickKey, onClickHandler), props)), isOpen ? /*#__PURE__*/React__default["default"].createElement(React.Suspense, {
-    fallback: /*#__PURE__*/React__default["default"].createElement(LoadingScreen, null)
-  }, /*#__PURE__*/React__default["default"].createElement(Lightbox, _extends__default["default"]({
-    wrapperClassName: "arr--image-lightbox",
-    onCloseRequest: onClose
-  }, lightboxProps))) : null);
-};
-FullScreenImages.propTypes = {
-  imageSlug: PropTypes__default["default"].string,
-  template: PropTypes__default["default"].func,
-  element: PropTypes__default["default"].shape({
-    "story-elements": PropTypes__default["default"].array
-  }),
-  props: PropTypes__default["default"].object
-};
-
-var _styleModuleImportMap$a = {
-  "./caption-attribution.m.css": {
-    "viewports": "\"../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "caption": "caption-attribution-m_caption__BM5NN",
-    "wrapper": "caption-attribution-m_wrapper__oHBX7",
-    "dark": "caption-attribution-m_dark__uER8u",
-    "attribution": "caption-attribution-m_attribution__279W9",
-    "light": "caption-attribution-m_light__19OWp"
-  }
-};
-var CaptionAttribution = function CaptionAttribution(_ref) {
-  var story = _ref.story,
-      element = _ref.element;
-      _ref.config;
-  if (!(story || element)) return null;
-  var configData = useStateValue() || {};
-  var textColor = getTextColor(configData.theme);
-
-  var _ref2 = story || {},
-      _ref2$heroImageCapt = _ref2["hero-image-caption"],
-      heroImageCaption = _ref2$heroImageCapt === void 0 ? "" : _ref2$heroImageCapt,
-      _ref2$heroImageAttr = _ref2["hero-image-attribution"],
-      heroImageAttribution = _ref2$heroImageAttr === void 0 ? "" : _ref2$heroImageAttr;
-
-  var _ref3 = element || {},
-      _ref3$title = _ref3.title,
-      title = _ref3$title === void 0 ? "" : _ref3$title,
-      _ref3$imageAttributi = _ref3["image-attribution"],
-      imageAttribution = _ref3$imageAttributi === void 0 ? "" : _ref3$imageAttributi;
-
-  var caption = heroImageCaption || title;
-  var attribution = heroImageAttribution || imageAttribution;
-  var updateStyle = caption ? "wrapper" : "";
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    "data-test-id": "caption",
-    className: "arr--caption-attribution " + _getClassName__default["default"]("caption ".concat(textColor), _styleModuleImportMap$a)
-  }, /*#__PURE__*/React__default["default"].createElement("span", {
-    dangerouslySetInnerHTML: {
-      __html: caption
-    }
-  }), attribution && /*#__PURE__*/React__default["default"].createElement("span", {
-    "data-test-id": "attribution",
-    dangerouslySetInnerHTML: {
-      __html: attribution
-    },
-    className: _getClassName__default["default"]("attribution ".concat(textColor, " ").concat(updateStyle), _styleModuleImportMap$a)
-  }));
-};
-CaptionAttribution.propTypes = {
-  config: PropTypes__default["default"].shape({
-    theme: PropTypes__default["default"].string
-  }),
-  story: shapeStory,
-  element: PropTypes__default["default"].shape({
-    "image-attribution": PropTypes__default["default"].string,
-    title: PropTypes__default["default"].string
-  })
-};
-
-var _excluded$7 = ["element", "opts", "story", "config", "caption"];
-
-var ImageBase = function ImageBase(_ref) {
-  var element = _ref.element,
-      _ref$opts = _ref.opts,
-      opts = _ref$opts === void 0 ? {} : _ref$opts,
-      _ref$story = _ref.story,
-      story = _ref$story === void 0 ? {} : _ref$story;
-      _ref.config;
-      var _ref$caption = _ref.caption,
-      caption = _ref$caption === void 0 ? true : _ref$caption,
-      restProps = _objectWithoutProperties__default["default"](_ref, _excluded$7);
-
-  if (!element) return null;
-  var configData = useStateValue() || {};
-
-  var ImageTemplate = function ImageTemplate(_ref2) {
-    var _onClick = _ref2.onClick;
-    return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "image-m_image-template__3s9OA"
-    }, /*#__PURE__*/React__default["default"].createElement("figure", {
-      className: "image-m_element__KVuzX",
-      onClick: function onClick() {
-        return _onClick();
-      }
-    }, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
-      slug: element["image-s3-key"],
-      metadata: element["image-metadata"],
-      alt: element["title"],
-      aspectRatio: null,
-      defaultWidth: 640,
-      widths: opts.imageWidths || [360, 640, 1200],
-      imgParams: {
-        auto: ["format", "compress"]
-      }
-    })), element["hyperlink"] && /*#__PURE__*/React__default["default"].createElement(HyperLink, {
-      hyperLink: element["hyperlink"]
-    }));
-  };
-
-  ImageTemplate.propTypes = {
-    onClick: PropTypes__default["default"].func
-  };
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-    className: "arrow-component arr--image-element"
-  }, restProps, {
-    "data-test-id": "image-element"
-  }), /*#__PURE__*/React__default["default"].createElement(FullScreenImages, {
-    template: ImageTemplate,
-    element: element,
-    imageSlug: element["image-s3-key"],
-    story: story
-  }), caption && /*#__PURE__*/React__default["default"].createElement(CaptionAttribution, {
-    element: element,
-    config: configData
-  }));
-};
-
-ImageBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    "image-s3-key": PropTypes__default["default"].string,
-    "image-metadata": PropTypes__default["default"].object,
-    "image-attribution": PropTypes__default["default"].string,
-    title: PropTypes__default["default"].string,
-    hyperlink: PropTypes__default["default"].string
-  }),
-  caption: PropTypes__default["default"].bool,
-  opts: PropTypes__default["default"].shape({
-    imageWidths: PropTypes__default["default"].array
-  }),
-  story: shapeStory,
-  config: shapeConfig
-};
-var Image = withElementWrapper(ImageBase);
-
-var _excluded$6 = ["element", "template", "css", "story", "config", "opts", "render"];
-var _styleModuleImportMap$9 = {
-  "./question-answer.m.css": {
-    "viewports": "\"../../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "qa-withAuthorImage": "question-answer-m_qa-withAuthorImage__1JB3N",
-    "a-element": "question-answer-m_a-element__BTxfl",
-    "qa-default": "question-answer-m_qa-default__2fGK3",
-    "q-element": "question-answer-m_q-element__1ZA5d",
-    "dark": "question-answer-m_dark__O4Mnm",
-    "hidden": "question-answer-m_hidden__K0n4n",
-    "curveIcon": "question-answer-m_curveIcon__64641",
-    "edgeIcon": "question-answer-m_edgeIcon__3js6c",
-    "labelAttribution": "question-answer-m_labelAttribution__Rq-v3",
-    "light": "question-answer-m_light__3Iqv4",
-    "content": "question-answer-m_content__16Ng7"
-  }
-};
-
-var supportedTemplates = function supportedTemplates(type, element) {
-  switch (type) {
-    case "q-and-a":
-      var _get = lodash.get(element, ["metadata"]),
-          qaQuestion = _get.question,
-          qaAnswer = _get.answer;
-
-      var qaQuestionAttribution = lodash.get(element, ["metadata", "interviewer", "avatar-url"]);
-      var qaAnswerAttribution = lodash.get(element, ["metadata", "interviewee", "avatar-url"]);
-      return {
-        question: qaQuestion,
-        answer: qaAnswer,
-        questionAttribution: qaQuestionAttribution,
-        answerAttribution: qaAnswerAttribution
-      };
-
-    case "question":
-      var qQuestion = lodash.get(element, ["text"]);
-      var qAttribution = lodash.get(element, ["metadata", "interviewer", "avatar-url"]);
-      return {
-        question: qQuestion,
-        questionAttribution: qAttribution
-      };
-
-    case "answer":
-      var aAnswer = lodash.get(element, ["text"]);
-      var aAttribution = lodash.get(element, ["metadata", "interviewee", "avatar-url"]);
-      return {
-        answer: aAnswer,
-        answerAttribution: aAttribution
-      };
-  }
-};
-
-var QuestionAnswerBase = function QuestionAnswerBase(_ref) {
-  var element = _ref.element,
-      template = _ref.template,
-      _ref$css = _ref.css,
-      css = _ref$css === void 0 ? {} : _ref$css;
-      _ref.story;
-      _ref.config;
-      var _ref$opts = _ref.opts,
-      opts = _ref$opts === void 0 ? {} : _ref$opts;
-      _ref.render;
-      var restProps = _objectWithoutProperties__default["default"](_ref, _excluded$6);
-
-  var configData = useStateValue() || {};
-  var textInvertColor = getTextColor(configData.theme);
-  if (!element) return null;
-  var type = opts.type,
-      defaultIconType = opts.defaultIconType,
-      _opts$isExternalLink = opts.isExternalLink,
-      isExternalLink = _opts$isExternalLink === void 0 ? true : _opts$isExternalLink;
-  var iconColor = css.iconColor;
-
-  var _supportedTemplates = supportedTemplates(type, element),
-      question = _supportedTemplates.question,
-      answer = _supportedTemplates.answer,
-      questionAttribution = _supportedTemplates.questionAttribution,
-      answerAttribution = _supportedTemplates.answerAttribution;
-
-  var theme = getTextColor(iconColor);
-  var questionData = question && (isExternalLink && updateContentLinks(question) || question);
-  var answerData = answer && (isExternalLink && updateContentLinks(answer) || answer);
-  var isAuthorImageTemplate = template === "withAuthorImage";
-  var templateStyle = isAuthorImageTemplate ? "qa-withAuthorImage" : "qa-default";
-  var iconType = defaultIconType === "curve" ? "curveIcon" : "edgeIcon";
-  var supportQuestionElement = isAuthorImageTemplate ? questionAttribution && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "question-answer-m_labelAttribution__Rq-v3"
-  }, /*#__PURE__*/React__default["default"].createElement("img", {
-    src: questionAttribution,
-    loading: "lazy"
-  })), /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "question-answer-m_hidden__K0n4n"
-  })) : /*#__PURE__*/React__default["default"].createElement("div", {
-    "data-test-id": iconType,
-    style: {
-      backgroundColor: iconColor
-    },
-    className: _getClassName__default["default"]("".concat(iconType, " ").concat(theme), _styleModuleImportMap$9)
-  }, "Q"); // EMPTY SPAN FOR EXTRA SPACE
-
-  var supportAnswerElement = isAuthorImageTemplate ? answerAttribution && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "question-answer-m_labelAttribution__Rq-v3"
-  }, /*#__PURE__*/React__default["default"].createElement("img", {
-    src: answerAttribution,
-    loading: "lazy"
-  })), /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "question-answer-m_hidden__K0n4n"
-  })) : /*#__PURE__*/React__default["default"].createElement("div", {
-    "data-test-id": iconType,
-    style: {
-      backgroundColor: iconColor
-    },
-    className: _getClassName__default["default"]("".concat(iconType, " ").concat(theme), _styleModuleImportMap$9)
-  }, "A");
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-    "data-test-id": "question-answer"
-  }, restProps, {
-    className: "arrow-component arr-custom-style arr--qa-element " + _getClassName__default["default"](templateStyle, _styleModuleImportMap$9) + (" " + (restProps ? restProps.className || "" : ""))
-  }), type !== "answer" && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "question-answer-m_q-element__1ZA5d",
-    "data-test-id": "question"
-  }, supportQuestionElement, /*#__PURE__*/React__default["default"].createElement("div", {
-    dangerouslySetInnerHTML: {
-      __html: questionData
-    },
-    className: _getClassName__default["default"]("content ".concat(textInvertColor), _styleModuleImportMap$9)
-  })), type !== "question" && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "question-answer-m_a-element__BTxfl",
-    "data-test-id": "answer"
-  }, supportAnswerElement, /*#__PURE__*/React__default["default"].createElement("div", {
-    dangerouslySetInnerHTML: {
-      __html: answerData
-    },
-    className: _getClassName__default["default"]("content ".concat(textInvertColor), _styleModuleImportMap$9)
-  })));
-};
-
-QuestionAnswerBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    metadata: PropTypes__default["default"].shape({
-      interviewer: PropTypes__default["default"].shape({
-        "avatar-url": PropTypes__default["default"].string
-      }),
-      interviewee: PropTypes__default["default"].shape({
-        "avatar-url": PropTypes__default["default"].string
-      }),
-      question: PropTypes__default["default"].string,
-      answer: PropTypes__default["default"].string
-    }),
-    text: PropTypes__default["default"].string
-  }),
-  opts: PropTypes__default["default"].shape({
-    type: PropTypes__default["default"].string,
-    defaultIconType: PropTypes__default["default"].string,
-    isExternalLink: PropTypes__default["default"].bool
-  }),
-  template: PropTypes__default["default"].string,
-  css: PropTypes__default["default"].object,
-  config: shapeConfig,
-  story: shapeStory,
-  render: PropTypes__default["default"].func
-};
-var QuestionAnswer = withElementWrapper(QuestionAnswerBase);
-
-var _excluded$5 = ["element", "template", "opts", "story", "config"];
-var _styleModuleImportMap$8 = {
-  "./image-gallery.m.css": {
-    "viewports": "\"../../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "image-gallery": "image-gallery-m_image-gallery__1Q7if",
-    "image": "image-gallery-m_image__3qwSJ",
-    "template-2": "image-gallery-m_template-2__2pjmE",
-    "left-images": "image-gallery-m_left-images__34gjv",
-    "hyperlink-gallery-image": "image-gallery-m_hyperlink-gallery-image__2qgDp"
-  }
-};
-
-var ImageGalleryBase = function ImageGalleryBase(_ref) {
-  var element = _ref.element,
-      _ref$template = _ref.template,
-      template = _ref$template === void 0 ? "" : _ref$template;
-      _ref.opts;
-      _ref.story;
-      _ref.config;
-      var restProps = _objectWithoutProperties__default["default"](_ref, _excluded$5);
-
-  if (!element) return null;
-  var isMobile = clientWidth("mobile");
-  var imageArr = element["story-elements"];
-  var imageBaseOnTemp = template === "template-2" && imageArr.length;
-  var renderImageDesktop = imageBaseOnTemp > 6 ? imageArr.slice(0, 6) : imageArr;
-  var renderMobile = imageBaseOnTemp > 4 ? imageArr.slice(0, 4) : imageArr;
-  var renderImage = isMobile ? renderMobile : renderImageDesktop;
-  var classes = template === "template-2" ? "template-2" : "";
-
-  var hyperlinkClass = function hyperlinkClass(hyperlink) {
-    return hyperlink ? "hyperlink-gallery-image" : "";
-  };
-
-  var ImageGalleryImagesTemplate = function ImageGalleryImagesTemplate(_ref2) {
-    var onClickHandler = _ref2.onClickHandler;
-    var images = renderImage.map(function (image, index) {
-      return /*#__PURE__*/React__default["default"].createElement("div", {
-        key: index,
-        className: _getClassName__default["default"](hyperlinkClass(image["hyperlink"]), _styleModuleImportMap$8)
-      }, /*#__PURE__*/React__default["default"].createElement("figure", {
-        key: index,
-        "data-text-id": "image-".concat(index),
-        onClick: function onClick() {
-          return onClickHandler && onClickHandler(index);
-        },
-        className: _getClassName__default["default"]("image ".concat(classes), _styleModuleImportMap$8)
-      }, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
-        slug: image["image-s3-key"],
-        metadata: image["image-metadata"],
-        alt: image["title"],
-        aspectRatio: [1, 1],
-        defaultWidth: 640,
-        imgParams: {
-          auto: ["format", "compress"]
-        }
-      })), image["hyperlink"] && /*#__PURE__*/React__default["default"].createElement(HyperLink, {
-        hyperLink: image["hyperlink"]
-      }));
-    });
-    return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-      className: " arrow-component arr--image-element image-gallery-m_image-gallery__1Q7if" + (" " + (restProps ? restProps.className || "" : ""))
-    }, restProps, {
-      "data-test-id": "image-gallery"
-    }), images);
-  };
-
-  ImageGalleryImagesTemplate.propTypes = {
-    onClickHandler: PropTypes__default["default"].func
-  };
-  return /*#__PURE__*/React__default["default"].createElement(FullScreenImages, {
-    template: ImageGalleryImagesTemplate,
-    element: element
-  });
-};
-
-ImageGalleryBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    "story-elements": PropTypes__default["default"].array
-  }),
-  opts: PropTypes__default["default"].shape({
-    imageWidths: PropTypes__default["default"].array
-  }),
-  story: shapeStory,
-  config: shapeConfig,
-  template: PropTypes__default["default"].string
-};
-var ImageGallery = withElementWrapper(ImageGalleryBase);
-
-var _excluded$4 = ["element", "story", "config"];
-
-var StoryElementBase = function StoryElementBase(_ref) {
-  var element = _ref.element;
-      _ref.story;
-      _ref.config;
-      var restProps = _objectWithoutProperties__default["default"](_ref, _excluded$4);
-
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({}, restProps, {
-    "data-test-id": "story-elements"
-  }), /*#__PURE__*/React__default["default"].createElement(components.StoryElement, {
-    element: element
-  }));
-};
-
-var StoryElement = withElementWrapper(StoryElementBase);
-StoryElementBase.propTypes = {
-  element: PropTypes__default["default"].object,
-  story: shapeStory,
-  config: shapeConfig
-};
-
-var _excluded$3 = ["element", "story", "config", "loadIframeOnClick"];
-
-var Videobase = function Videobase(_ref) {
-  var element = _ref.element;
-      _ref.story;
-      _ref.config;
-      var _ref$loadIframeOnClic = _ref.loadIframeOnClick,
-      loadIframeOnClick = _ref$loadIframeOnClic === void 0 ? false : _ref$loadIframeOnClic,
-      restProps = _objectWithoutProperties__default["default"](_ref, _excluded$3);
-
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-    className: "video-m_container__MYuWI" + (" " + (restProps ? restProps.className || "" : ""))
-  }, restProps, {
-    "data-test-id": "video"
-  }), /*#__PURE__*/React__default["default"].createElement(components.StoryElement, {
-    element: element,
-    loadIframeOnClick: loadIframeOnClick
-  }));
-};
-
-Videobase.propTypes = {
-  element: PropTypes__default["default"].object,
-  story: shapeStory,
-  config: shapeConfig,
-  loadIframeOnClick: PropTypes__default["default"].bool
-};
-var Video = withElementWrapper(Videobase);
-
-var _excluded$2 = ["element", "template", "css", "story", "config", "render"];
-var _styleModuleImportMap$7 = {
-  "./quote.m.css": {
-    "viewports": "\"../../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "quote": "quote-m_quote__13tTt",
-    "text": "quote-m_text__2hXSE",
-    "quote-borderNone": "quote-m_quote-borderNone__2EuoK",
-    "quote-borderTopSmall": "quote-m_quote-borderTopSmall__2DN-3",
-    "quote-borderLeft": "quote-m_quote-borderLeft__3QaAY",
-    "dark": "quote-m_dark__1migZ",
-    "light": "quote-m_light__30NnM",
-    "attribution": "quote-m_attribution__20Y6O",
-    "line": "quote-m_line__3gtoE"
-  }
-};
-
-var QuoteBase = function QuoteBase(_ref) {
-  var element = _ref.element,
-      _ref$template = _ref.template,
-      template = _ref$template === void 0 ? "" : _ref$template,
-      _ref$css = _ref.css,
-      css = _ref$css === void 0 ? {} : _ref$css;
-      _ref.story;
-      _ref.config;
-      _ref.render;
-      var restProps = _objectWithoutProperties__default["default"](_ref, _excluded$2);
-
-  var configData = useStateValue() || {};
-  var textInvertColor = getTextColor(configData.theme);
-  var _element$metadata = element.metadata,
-      content = _element$metadata.content,
-      attribution = _element$metadata.attribution;
-  if (!content) return null;
-  var borderColor = css.borderColor;
-  var updateBorderColor = template === "borderLeft" && "4px solid ".concat(borderColor);
-  var templateStyle = template ? "quote-".concat(template) : "quote";
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-    "data-test-id": "quote"
-  }, restProps, {
-    className: "arrow-component arr--quote-element " + _getClassName__default["default"](templateStyle, _styleModuleImportMap$7) + (" " + (restProps ? restProps.className || "" : ""))
-  }), template === "borderTopSmall" && /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "quote-m_line__3gtoE",
-    style: borderColor && {
-      backgroundColor: borderColor
-    }
-  }), /*#__PURE__*/React__default["default"].createElement("p", {
-    style: borderColor && {
-      borderLeft: updateBorderColor
-    },
-    dangerouslySetInnerHTML: {
-      __html: content
-    },
-    className: _getClassName__default["default"]("text ".concat(textInvertColor), _styleModuleImportMap$7)
-  }), /*#__PURE__*/React__default["default"].createElement("p", {
-    "data-test-id": "quote-attribution",
-    className: _getClassName__default["default"]("attribution ".concat(textInvertColor), _styleModuleImportMap$7)
-  }, attribution));
-};
-
-QuoteBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    metadata: PropTypes__default["default"].shape({
-      content: PropTypes__default["default"].string,
-      attribution: PropTypes__default["default"].string
-    })
-  }),
-
-  /** template can be default, borderTopSmall and borderLeft  */
-  template: PropTypes__default["default"].string,
-  story: shapeStory,
-  config: shapeConfig,
-  render: PropTypes__default["default"].func,
-  css: PropTypes__default["default"].object
-};
-var Quote = withElementWrapper(QuoteBase);
-
-var _excluded$1 = ["element", "config", "opts"];
-var _styleModuleImportMap$6 = {
-  "./reference.m.css": {
-    "viewports": "\"../../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "tablet": "992px",
-    "wrapper": "reference-m_wrapper__1C4Ot",
-    "name": "reference-m_name__24IwG",
-    "description": "reference-m_description__2x3Io",
-    "dark": "reference-m_dark__3Zlnx",
-    "light": "reference-m_light__1B8Ud"
-  }
-};
-
-var ReferenceBase = function ReferenceBase(_ref) {
-  var element = _ref.element;
-      _ref.config;
-      var _ref$opts = _ref.opts,
-      opts = _ref$opts === void 0 ? {} : _ref$opts,
-      restProps = _objectWithoutProperties__default["default"](_ref, _excluded$1);
-
-  if (!element) return null;
-  var configData = useStateValue() || {};
-  var textInvertColor = getTextColor(configData.theme);
-  var eleArr = element["story-elements"] && element["story-elements"].map(function (ref) {
-    return ref.metadata;
-  });
-  var _opts$showHeadline = opts.showHeadline,
-      showHeadline = _opts$showHeadline === void 0 ? true : _opts$showHeadline,
-      headlineText = opts.headlineText;
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-    className: "arrow-component arr--reference-element"
-  }, restProps), eleArr && eleArr.map(function (metadata, index) {
-    var _metadata$name = metadata.name,
-        name = _metadata$name === void 0 ? "" : _metadata$name,
-        _metadata$description = metadata.description,
-        description = _metadata$description === void 0 ? "" : _metadata$description,
-        url = metadata.url;
-    return /*#__PURE__*/React__default["default"].createElement("div", {
-      key: index,
-      className: _getClassName__default["default"]("wrapper ".concat(textInvertColor), _styleModuleImportMap$6)
-    }, /*#__PURE__*/React__default["default"].createElement(components.Link, {
-      href: url,
-      "aria-label": "reference-headline"
-    }, showHeadline && /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "reference-m_name__24IwG",
-      "data-test-id": "ref-headline"
-    }, headlineText || name), /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "reference-m_description__2x3Io"
-    }, description)));
-  }));
-};
-
-ReferenceBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    "story-elements": PropTypes__default["default"].arrayOf(PropTypes__default["default"].shape({
-      metadata: PropTypes__default["default"].shape({
-        name: PropTypes__default["default"].string,
-        description: PropTypes__default["default"].string,
-        url: PropTypes__default["default"].string
-      })
-    }))
-  }),
-  opts: PropTypes__default["default"].shape({
-    hideHeadline: PropTypes__default["default"].bool
-  }),
-  config: shapeConfig
-};
-var Reference = withElementWrapper(ReferenceBase);
-
-var _excluded = ["element", "render"];
-var _styleModuleImportMap$5 = {
-  "./attachment.m.css": {
-    "viewports": "\"../../../../../assets/stylesheets/viewports.m.css\"",
-    "mobile": "768px",
-    "tablet": "992px",
-    "headline": "attachment-m_headline__kP7Hs",
-    "button-wrapper": "attachment-m_button-wrapper__2fajK",
-    "file-name": "attachment-m_file-name__1LU9q",
-    "dark": "attachment-m_dark__3ixF7",
-    "light": "attachment-m_light__1kcpj",
-    "pdf": "attachment-m_pdf__3i_bR",
-    "doc": "attachment-m_doc__6vUVo attachment-m_pdf__3i_bR",
-    "wrapper": "attachment-m_wrapper__3gMwN",
-    "content-wrapper": "attachment-m_content-wrapper__3Yu0B"
-  }
-};
-
-var AttachmentBase = function AttachmentBase(_ref) {
-  var _ref$element = _ref.element,
-      element = _ref$element === void 0 ? {} : _ref$element;
-      _ref.render;
-      var restProps = _objectWithoutProperties__default["default"](_ref, _excluded);
-
-  var fileName = element["file-name"],
-      url = element.url,
-      contentType = element["content-type"];
-  if (!contentType || !url) return null;
-  var attachmentType = {
-    PDF: "application/pdf"
-  };
-  var isPdf = contentType === attachmentType.PDF;
-  var configData = useStateValue() || {};
-  var textColor = getTextColor(configData.theme);
-  var defaultName = isPdf ? "Attached PDF" : "Attached DOC";
-  var defaultFileName = fileName || defaultName;
-  return /*#__PURE__*/React__default["default"].createElement("div", _extends__default["default"]({
-    "data-test-id": "attachment"
-  }, restProps, {
-    className: "arrow-component arr--attachment-element " + _getClassName__default["default"](textColor, _styleModuleImportMap$5) + (" " + (restProps ? restProps.className || "" : ""))
-  }), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "attachment-m_headline__kP7Hs"
-  }, "Attachment"), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "attachment-m_wrapper__3gMwN"
-  }, isPdf ? /*#__PURE__*/React__default["default"].createElement("div", {
-    "data-test-id": "pdf",
-    className: "attachment-m_pdf__3i_bR"
-  }, "PDF") : /*#__PURE__*/React__default["default"].createElement("div", {
-    "data-test-id": "doc",
-    className: "attachment-m_doc__6vUVo attachment-m_pdf__3i_bR"
-  }, "DOC"), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "attachment-m_content-wrapper__3Yu0B"
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "attachment-m_file-name__1LU9q",
-    dangerouslySetInnerHTML: {
-      __html: defaultFileName
-    }
-  }), /*#__PURE__*/React__default["default"].createElement(components.Link, {
-    className: "attachment-m_button-wrapper__2fajK",
-    href: url,
-    target: "_blank",
-    rel: "noopener noreferrer",
-    download: true,
-    "aria-label": "button"
-  }, isPdf ? "Preview" : "Download"))));
-};
-
-AttachmentBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    url: PropTypes__default["default"].string,
-    fileName: PropTypes__default["default"].string,
-    contentType: PropTypes__default["default"].string
-  }),
-  render: PropTypes__default["default"].func
-};
-var Attachment = withElementWrapper(AttachmentBase);
-
-var Twitter = function Twitter(_ref) {
-  var _ref$color = _ref.color,
-      color = _ref$color === void 0 ? "#1CB7EB" : _ref$color;
-  return /*#__PURE__*/React__default["default"].createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24"
-  }, /*#__PURE__*/React__default["default"].createElement("path", {
-    fill: color,
-    d: "M19.137 8.594c.023.094.035.246.035.457 0 1.687-.41 3.316-1.23 4.887-.844 1.664-2.028 2.988-3.551 3.972-1.664 1.102-3.575 1.652-5.73 1.652-2.063 0-3.95-.55-5.661-1.652.258.024.55.035.879.035 1.71 0 3.246-.527 4.605-1.582-.82 0-1.54-.24-2.162-.72a3.673 3.673 0 01-1.283-1.811c.234.023.457.035.668.035.328 0 .656-.035.984-.105a3.724 3.724 0 01-2.109-1.301 3.542 3.542 0 01-.844-2.32v-.07a3.493 3.493 0 001.653.492 4.097 4.097 0 01-1.196-1.336 3.557 3.557 0 01-.457-1.776c0-.644.176-1.26.528-1.845a10.188 10.188 0 003.357 2.742 10.222 10.222 0 004.236 1.125 5.122 5.122 0 01-.07-.844c0-.656.164-1.272.492-1.846a3.615 3.615 0 011.336-1.353 3.568 3.568 0 011.828-.492c.54 0 1.037.105 1.494.316.457.21.862.492 1.213.844a7.479 7.479 0 002.356-.88c-.281.868-.82 1.548-1.617 2.04A7.926 7.926 0 0021 6.66a8.132 8.132 0 01-1.863 1.934z"
-  }));
-};
-Twitter.propTypes = {
-  color: PropTypes__default["default"].string
-};
-
-var Facebook = function Facebook(_ref) {
-  var _ref$color = _ref.color,
-      color = _ref$color === void 0 ? "#3B5998" : _ref$color;
-  return /*#__PURE__*/React__default["default"].createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24"
-  }, /*#__PURE__*/React__default["default"].createElement("path", {
-    fill: color,
-    d: "M9.906 20v-7.156H7.5V10h2.406V7.75c0-1.187.334-2.11 1-2.766.667-.656 1.552-.984 2.656-.984.896 0 1.625.042 2.188.125v2.531h-1.5c-.563 0-.948.125-1.156.375-.167.209-.25.542-.25 1V10H15.5l-.375 2.844h-2.281V20H9.906z"
-  }));
-};
-Facebook.propTypes = {
-  color: PropTypes__default["default"].string
-};
-
-var LinkedIn = function LinkedIn(_ref) {
-  var _ref$color = _ref.color,
-      color = _ref$color === void 0 ? "#0077B5" : _ref$color;
-  return /*#__PURE__*/React__default["default"].createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24"
-  }, /*#__PURE__*/React__default["default"].createElement("path", {
-    fill: color,
-    d: "M6.71 19H3.26V7.904h3.45V19zM5.005 6.383a1.926 1.926 0 01-1.41-.594A1.923 1.923 0 013 4.38c0-.544.198-1.014.594-1.41a1.926 1.926 0 011.41-.594c.544 0 1.014.198 1.41.594.396.396.594.866.594 1.41 0 .544-.198 1.014-.594 1.41a1.926 1.926 0 01-1.41.594zM19.625 19h-3.451v-5.418c0-.89-.074-1.534-.223-1.93-.272-.668-.804-1.002-1.596-1.002-.791 0-1.348.297-1.67.891-.247.445-.37 1.1-.37 1.967V19H8.9V7.904h3.303v1.522h.037c.248-.495.643-.903 1.188-1.225.593-.396 1.286-.594 2.078-.594 1.608 0 2.734.508 3.377 1.522.495.816.742 2.078.742 3.785V19z"
-  }));
-};
-LinkedIn.propTypes = {
-  color: PropTypes__default["default"].string
-};
-
-var WhatsApp = function WhatsApp(_ref) {
-  var _ref$color = _ref.color,
-      color = _ref$color === void 0 ? "#4AC959" : _ref$color;
-  return /*#__PURE__*/React__default["default"].createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24"
-  }, /*#__PURE__*/React__default["default"].createElement("path", {
-    fill: color,
-    fillRule: "evenodd",
-    d: "M18.404 5.505a9.457 9.457 0 012.02 2.96 8.587 8.587 0 01.715 3.449 8.665 8.665 0 01-1.245 4.53 9.282 9.282 0 01-3.347 3.307 8.894 8.894 0 01-4.552 1.225 8.835 8.835 0 01-4.327-1.102l-4.817 1.265 1.307-4.694a8.775 8.775 0 01-1.225-4.531 8.77 8.77 0 011.225-4.531 9.17 9.17 0 013.306-3.307 8.781 8.781 0 014.531-1.224c1.198 0 2.347.23 3.45.693a9.515 9.515 0 012.959 1.96zm-6.409 13.96c1.36 0 2.626-.34 3.797-1.02a7.75 7.75 0 002.796-2.756 7.202 7.202 0 001.04-3.775c0-.98-.203-1.933-.612-2.858a8.088 8.088 0 00-1.694-2.47 7.565 7.565 0 00-2.449-1.653 7.405 7.405 0 00-2.878-.571c-1.36 0-2.62.34-3.776 1.02a7.646 7.646 0 00-2.755 2.756 7.316 7.316 0 00-1.02 3.776c0 1.442.394 2.775 1.183 4l.164.286-.776 2.775 2.857-.734.286.163a7.275 7.275 0 003.837 1.061zm4.123-5.674l.123.082c.19.082.299.15.326.204.027.054.034.19.02.408a2.11 2.11 0 01-.163.674c-.095.231-.313.462-.653.694-.34.231-.633.36-.878.388-.38.054-.748.054-1.102 0-.408-.082-.952-.273-1.632-.572-1.388-.599-2.654-1.714-3.797-3.347l-.081-.082c-.6-.843-.898-1.62-.898-2.327 0-.707.244-1.32.734-1.837l.041-.04c.19-.19.395-.286.612-.286h.49c.11 0 .198.02.266.061.068.041.129.143.183.306l.694 1.674c.082.163.095.3.041.408a2.832 2.832 0 01-.53.735.917.917 0 00-.205.265c-.027.068 0 .143.082.225.38.707.83 1.265 1.347 1.673.381.3.952.64 1.714 1.02.218.11.381.096.49-.04.354-.408.599-.707.735-.898.054-.109.123-.163.204-.163.082 0 .177.013.286.04.218.082.735.327 1.551.735z"
-  }));
-};
-WhatsApp.propTypes = {
-  color: PropTypes__default["default"].string
-};
-
-var getSocialIcons = function getSocialIcons(color, iconType) {
-  switch (iconType) {
-    case "plain-color-svg":
-      return {
-        facebook: /*#__PURE__*/React__default["default"].createElement(Facebook, {
-          key: iconType
-        }),
-        twitter: /*#__PURE__*/React__default["default"].createElement(Twitter, {
-          key: iconType
-        }),
-        linkedin: /*#__PURE__*/React__default["default"].createElement(LinkedIn, {
-          key: iconType
-        }),
-        whatsapp: /*#__PURE__*/React__default["default"].createElement(WhatsApp, {
-          key: iconType
-        })
-      };
-
-    default:
-      return {
-        facebook: /*#__PURE__*/React__default["default"].createElement(Facebook, {
-          color: color,
-          key: iconType
-        }),
-        twitter: /*#__PURE__*/React__default["default"].createElement(Twitter, {
-          color: color,
-          key: iconType
-        }),
-        linkedin: /*#__PURE__*/React__default["default"].createElement(LinkedIn, {
-          color: color,
-          key: iconType
-        }),
-        whatsapp: /*#__PURE__*/React__default["default"].createElement(WhatsApp, {
-          color: color,
-          key: iconType
-        })
-      };
-  }
-};
-
-var socialShareData = function socialShareData(_ref) {
-  var fbUrl = _ref.fbUrl,
-      twitterUrl = _ref.twitterUrl,
-      linkedinUrl = _ref.linkedinUrl,
-      whatsappUrl = _ref.whatsappUrl,
-      iconColor = _ref.iconColor,
-      _ref$iconType = _ref.iconType,
-      iconType = _ref$iconType === void 0 ? "plain-svg" : _ref$iconType;
-  var socialIcons = getSocialIcons(iconColor, iconType);
-
-  var getOptions = function getOptions() {
-    return [{
-      name: "facebook",
-      url: fbUrl,
-      icon: socialIcons["facebook"],
-      text: "Facebook",
-      bgColor: "#4e71a8",
-      alt: "fb icon"
-    }, {
-      name: "twitter",
-      url: twitterUrl,
-      icon: socialIcons["twitter"],
-      text: "Twitter",
-      bgColor: "#1db7eb",
-      alt: "twitter icon"
-    }, {
-      name: "linkedin",
-      url: linkedinUrl,
-      icon: socialIcons["linkedin"],
-      text: "LinkedIn",
-      bgColor: "#0077B5",
-      alt: "linkedin icon"
-    }, {
-      name: "whatsapp",
-      url: whatsappUrl,
-      icon: socialIcons["whatsapp"],
-      text: "Whatsapp",
-      bgColor: "#25d366",
-      alt: "whatsapp share"
-    }];
-  };
-
-  return getOptions();
-};
-
-var CloseIcon = function CloseIcon(_ref) {
-  var _ref$color = _ref.color,
-      color = _ref$color === void 0 ? "#333" : _ref$color;
-  return /*#__PURE__*/React__default["default"].createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24"
-  }, /*#__PURE__*/React__default["default"].createElement("g", {
-    fill: "none",
-    stroke: color,
-    strokeLinecap: "square",
-    strokeWidth: "2"
-  }, /*#__PURE__*/React__default["default"].createElement("path", {
-    d: "M16.95 6.914l-9.9 9.9M16.95 17.107l-9.9-9.9"
-  })));
-};
-CloseIcon.propTypes = {
-  color: PropTypes__default["default"].string
-};
-
-var _styleModuleImportMap$4 = {
-  "./social-share-popup.m.css": {
-    "share-popup-wrapper": "social-share-popup-m_share-popup-wrapper__GEJqD",
-    "light": "social-share-popup-m_light__gQmxf",
-    "dark": "social-share-popup-m_dark__26Igp",
-    "share-popup": "social-share-popup-m_share-popup__QRt3l social-share-popup-m_share-popup-wrapper__GEJqD",
-    "social-wrapper": "social-share-popup-m_social-wrapper__1lPzr",
-    "social-icon-wrapper": "social-share-popup-m_social-icon-wrapper__36jyV",
-    "wrapper": "social-share-popup-m_wrapper__3Ytce",
-    "top-bar": "social-share-popup-m_top-bar__174Um",
-    "share-text": "social-share-popup-m_share-text__19E-F",
-    "close": "social-share-popup-m_close__3k-Hj",
-    "social-icon": "social-share-popup-m_social-icon__2a4nT",
-    "social-text": "social-share-popup-m_social-text__1QPXb"
-  }
-};
-
-var popupSocialShareItem = function popupSocialShareItem(url, icon, text, index) {
-  return url ? /*#__PURE__*/React__default["default"].createElement("li", {
-    className: "social-share-popup-m_social-icon-wrapper__36jyV",
-    "data-testid": text,
-    key: "popup-item-".concat(index)
-  }, /*#__PURE__*/React__default["default"].createElement("a", {
-    href: url,
-    target: "_blank",
-    rel: "noopener noreferrer",
-    className: "social-share-popup-m_social-wrapper__1lPzr",
-    "aria-label": "social-icon"
-  }, icon, /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "social-share-popup-m_social-text__1QPXb"
-  }, text))) : null;
-};
-
-var SocialSharePopup = function SocialSharePopup(_ref) {
-  var _ref$fbUrl = _ref.fbUrl,
-      fbUrl = _ref$fbUrl === void 0 ? "" : _ref$fbUrl,
-      _ref$twitterUrl = _ref.twitterUrl,
-      twitterUrl = _ref$twitterUrl === void 0 ? "" : _ref$twitterUrl,
-      _ref$linkedinUrl = _ref.linkedinUrl,
-      linkedinUrl = _ref$linkedinUrl === void 0 ? "" : _ref$linkedinUrl,
-      _ref$whatsappUrl = _ref.whatsappUrl,
-      whatsappUrl = _ref$whatsappUrl === void 0 ? "" : _ref$whatsappUrl,
-      theme = _ref.theme,
-      _ref$closePopup = _ref.closePopup,
-      closePopup = _ref$closePopup === void 0 ? "" : _ref$closePopup,
-      _ref$iconType = _ref.iconType,
-      iconType = _ref$iconType === void 0 ? "plain-color-svg" : _ref$iconType;
-  var textColor = getTextColor(theme);
-  var iconColor = textColor === "dark" ? "#000000" : "#ffffff";
-  var options = {
-    fbUrl: fbUrl,
-    twitterUrl: twitterUrl,
-    linkedinUrl: linkedinUrl,
-    whatsappUrl: whatsappUrl,
-    iconColor: iconColor,
-    iconType: iconType
-  };
-  var popupItemsList = socialShareData(options);
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: _getClassName__default["default"]("share-popup-wrapper ".concat(textColor), _styleModuleImportMap$4)
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "social-share-popup-m_share-popup__QRt3l social-share-popup-m_share-popup-wrapper__GEJqD"
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "social-share-popup-m_top-bar__174Um"
-  }, /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "social-share-popup-m_share-text__19E-F"
-  }, "Share via"), /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "social-share-popup-m_close__3k-Hj",
-    onClick: closePopup
-  }, /*#__PURE__*/React__default["default"].createElement(CloseIcon, {
-    color: iconColor
-  }))), /*#__PURE__*/React__default["default"].createElement("ul", {
-    className: "social-share-popup-m_wrapper__3Ytce"
-  }, popupItemsList.map(function (_ref2, index) {
-    var url = _ref2.url,
-        icon = _ref2.icon,
-        text = _ref2.text,
-        bgColor = _ref2.bgColor;
-        _ref2.alt;
-    return popupSocialShareItem(url, icon, text, bgColor);
-  }))));
-};
-SocialSharePopup.propTypes = {
-  fbUrl: PropTypes__default["default"].string,
-  twitterUrl: PropTypes__default["default"].string,
-  linkedinUrl: PropTypes__default["default"].string,
-  whatsappUrl: PropTypes__default["default"].string,
-  grey: PropTypes__default["default"].string,
-  primaryColor: PropTypes__default["default"].string,
-  closePopup: PropTypes__default["default"].bool,
-  theme: PropTypes__default["default"].string,
-  iconType: PropTypes__default["default"].string
-};
-
-var ShareIcon = function ShareIcon(_ref) {
-  var _ref$color = _ref.color,
-      color = _ref$color === void 0 ? "#0D0D0D" : _ref$color;
-  return /*#__PURE__*/React__default["default"].createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24"
-  }, /*#__PURE__*/React__default["default"].createElement("path", {
-    fill: color,
-    fillRule: "evenodd",
-    d: "M15.843 3.189c-1.478 0-2.689 1.239-2.689 2.75 0 .293.046.58.13.846L8.844 9.31a2.638 2.638 0 00-1.687-.621c-1.477 0-2.688 1.238-2.688 2.75 0 1.51 1.21 2.75 2.688 2.75.638 0 1.224-.231 1.687-.615l4.446 2.525a2.778 2.778 0 00-.136.84c0 1.51 1.211 2.75 2.689 2.75 1.477 0 2.688-1.24 2.688-2.75 0-1.512-1.21-2.75-2.688-2.75-.742 0-1.419.317-1.907.82l-4.323-2.46a2.763 2.763 0 000-2.221l4.317-2.459c.488.506 1.168.82 1.913.82 1.477 0 2.688-1.239 2.688-2.75s-1.21-2.75-2.688-2.75z"
-  }));
-};
-ShareIcon.propTypes = {
-  color: PropTypes__default["default"].string
-};
-
-var _styleModuleImportMap$3 = {
-  "./social-share-template.m.css": {
-    "desktop-view": "social-share-template-m_desktop-view__3TmkO",
-    "tablet-view": "social-share-template-m_tablet-view__kATzi",
-    "wrapper": "social-share-template-m_wrapper__1wXin",
-    "horizontal": "social-share-template-m_horizontal__1c9Kt",
-    "vertical": "social-share-template-m_vertical__VU5JY",
-    "light": "social-share-template-m_light__3-V_k",
-    "dark": "social-share-template-m_dark__1lmTM",
-    "icon": "social-share-template-m_icon__1Mnu5",
-    "open": "social-share-template-m_open__3xObA",
-    "popup-wrapper": "social-share-template-m_popup-wrapper__1Zv3e",
-    "popup-open": "social-share-template-m_popup-open__21UNo",
-    "overlay": "social-share-template-m_overlay__1nBp-",
-    "tablet-view-popup": "social-share-template-m_tablet-view-popup__1hXU9"
-  }
-};
-
-var ShareItem = function ShareItem(_ref) {
-  var name = _ref.name,
-      url = _ref.url,
-      icon = _ref.icon,
-      dataTestId = _ref.dataTestId;
-  return url ? /*#__PURE__*/React__default["default"].createElement("li", {
-    "data-testid": dataTestId,
-    className: "social-share-template-m_icon__1Mnu5"
-  }, /*#__PURE__*/React__default["default"].createElement("a", {
-    href: url,
-    target: "_blank",
-    rel: "noopener noreferrer",
-    "data-share-icon": name,
-    "aria-label": "share-icon"
-  }, icon)) : null;
-};
-
-ShareItem.propTypes = {
-  name: PropTypes__default["default"].string,
-  url: PropTypes__default["default"].string,
-  icon: PropTypes__default["default"].node,
-  dataTestId: PropTypes__default["default"].string
-};
-
-function getActionIcon(open, color) {
-  if (!open) return /*#__PURE__*/React__default["default"].createElement(ShareIcon, {
-    color: color
-  });
-  return /*#__PURE__*/React__default["default"].createElement(CloseIcon, {
-    color: color
-  });
-}
-
-var SocialShareTemplate = function SocialShareTemplate(props) {
-  var _props$fbUrl = props.fbUrl,
-      fbUrl = _props$fbUrl === void 0 ? "" : _props$fbUrl,
-      _props$twitterUrl = props.twitterUrl,
-      twitterUrl = _props$twitterUrl === void 0 ? "" : _props$twitterUrl,
-      _props$linkedinUrl = props.linkedinUrl,
-      linkedinUrl = _props$linkedinUrl === void 0 ? "" : _props$linkedinUrl,
-      _props$whatsappUrl = props.whatsappUrl,
-      whatsappUrl = _props$whatsappUrl === void 0 ? "" : _props$whatsappUrl,
-      _props$vertical = props.vertical,
-      vertical = _props$vertical === void 0 ? false : _props$vertical,
-      theme = props.theme,
-      _props$iconType = props.iconType,
-      iconType = _props$iconType === void 0 ? "plain-color-svg" : _props$iconType,
-      _props$open = props.open,
-      open = _props$open === void 0 ? false : _props$open;
-  if (!fbUrl && !twitterUrl && !linkedinUrl && !whatsappUrl) return null;
-  var iconShade = getTextColor(theme);
-  var iconColor = iconShade === "dark" ? "#000000" : "#ffffff";
-  var options = {
-    fbUrl: fbUrl,
-    twitterUrl: twitterUrl,
-    linkedinUrl: linkedinUrl,
-    whatsappUrl: whatsappUrl,
-    iconColor: iconColor,
-    iconType: iconType
-  };
-  var iconsList = socialShareData(options);
-
-  var _useState = React.useState(open),
-      _useState2 = _slicedToArray__default["default"](_useState, 2),
-      isOpen = _useState2[0],
-      setIsOpen = _useState2[1];
-
-  var verticalShare = vertical ? "vertical" : "horizontal";
-  React.useEffect(function () {
-    return setIsOpen(open);
-  }, [open]);
-
-  var shareIcon = function shareIcon() {
-    return /*#__PURE__*/React__default["default"].createElement("li", {
-      className: "social-share-template-m_icon__1Mnu5",
-      key: "horizontal-0"
-    }, /*#__PURE__*/React__default["default"].createElement("div", {
-      onClick: clickHandler
-    }, getActionIcon(isOpen, iconColor)));
-  };
-
-  var clickHandler = function clickHandler() {
-    setIsOpen(!isOpen);
-  };
-
-  var popUpWrapper = function popUpWrapper() {
-    return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "social-share-template-m_tablet-view__kATzi"
-    }, !isOpen && /*#__PURE__*/React__default["default"].createElement("ul", {
-      className: _getClassName__default["default"]("wrapper ".concat(isOpen ? "open" : ""), _styleModuleImportMap$3)
-    }, shareIcon()), isOpen && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "social-share-template-m_overlay__1nBp-",
-      onClick: clickHandler
-    }, /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "arr--popup " + _getClassName__default["default"]("popup-wrapper ".concat(isOpen ? "popup-open" : ""), _styleModuleImportMap$3)
-    }, /*#__PURE__*/React__default["default"].createElement(SocialSharePopup, {
-      fbUrl: fbUrl,
-      twitterUrl: twitterUrl,
-      linkedinUrl: linkedinUrl,
-      whatsappUrl: whatsappUrl,
-      iconType: iconType,
-      theme: theme,
-      closePopup: function closePopup() {
-        setIsOpen(false);
-      }
-    })))));
-  };
-
-  var popupStyle = !isOpen && vertical ? "tablet-view-popup" : "";
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    "data-test-id": verticalShare,
-    className: "arr--share " + _getClassName__default["default"]("".concat(iconShade, " ").concat(verticalShare, " ").concat(popupStyle), _styleModuleImportMap$3)
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "social-share-template-m_desktop-view__3TmkO"
-  }, /*#__PURE__*/React__default["default"].createElement("ul", {
-    "data-test-id": lodash.camelCase(iconType),
-    className: "desktop-share-wrapper " + _getClassName__default["default"]("wrapper ".concat(isOpen ? "open" : ""), _styleModuleImportMap$3)
-  }, shareIcon(), iconsList.map(function (iconData, index) {
-    return /*#__PURE__*/React__default["default"].createElement(ShareItem, _extends__default["default"]({}, iconData, {
-      key: iconData.name,
-      dataTestId: "card-share-".concat(index)
-    }));
-  }))), popUpWrapper());
-};
-SocialShareTemplate.propTypes = {
-  fbUrl: PropTypes__default["default"].string,
-  twitterUrl: PropTypes__default["default"].string,
-  linkedinUrl: PropTypes__default["default"].string,
-  whatsappUrl: PropTypes__default["default"].string,
-  vertical: PropTypes__default["default"].bool,
-  theme: PropTypes__default["default"].string,
-  iconType: PropTypes__default["default"].string,
-  open: PropTypes__default["default"]["boolean"]
-};
-
-var LeftArrow = function LeftArrow(_ref) {
-  var _ref$color = _ref.color,
-      color = _ref$color === void 0 ? "#333" : _ref$color;
-  return /*#__PURE__*/React__default["default"].createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "16",
-    height: "16",
-    viewBox: "0 0 10 16"
-  }, /*#__PURE__*/React__default["default"].createElement("g", {
-    fill: "none",
-    fillRule: "nonzero"
-  }, /*#__PURE__*/React__default["default"].createElement("path", {
-    d: "M17 20H-7V-4h24z",
-    opacity: ".384"
-  }), /*#__PURE__*/React__default["default"].createElement("path", {
-    stroke: color,
-    d: "M9 16L1 8l8-8"
-  })));
-};
-LeftArrow.propTypes = {
-  color: PropTypes__default["default"].string
-};
-
-var RightArrow = function RightArrow(_ref) {
-  var _ref$color = _ref.color,
-      color = _ref$color === void 0 ? "#333" : _ref$color;
-  return /*#__PURE__*/React__default["default"].createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "16",
-    height: "16",
-    viewBox: "0 0 10 16"
-  }, /*#__PURE__*/React__default["default"].createElement("g", {
-    fill: "none",
-    fillRule: "nonzero"
-  }, /*#__PURE__*/React__default["default"].createElement("path", {
-    d: "M-7-4h24v24H-7z",
-    opacity: ".384"
-  }), /*#__PURE__*/React__default["default"].createElement("path", {
-    stroke: color,
-    d: "M1 0l8 8-8 8"
-  })));
-};
-RightArrow.propTypes = {
-  color: PropTypes__default["default"].string
-};
-
-var _styleModuleImportMap$2 = {
-  "./slider-arrow.m.css": {
-    "arrow": "slider-arrow-m_arrow__1eBUU",
-    "left-arrow-dark": "slider-arrow-m_left-arrow-dark__3mTJS",
-    "right-arrow-dark": "slider-arrow-m_right-arrow-dark__3hWZe",
-    "left-arrow-light": "slider-arrow-m_left-arrow-light__2ipUK",
-    "right-arrow-light": "slider-arrow-m_right-arrow-light__3omMU",
-    "left-arrow-ltr": "slider-arrow-m_left-arrow-ltr__1ngNF",
-    "right-arrow-ltr": "slider-arrow-m_right-arrow-ltr__2svWX",
-    "left-arrow-rtl": "slider-arrow-m_left-arrow-rtl__2ynyn",
-    "right-arrow-rtl": "slider-arrow-m_right-arrow-rtl__1GjPz"
-  }
-};
-var SliderArrow = function SliderArrow(_ref) {
-  var selectedIndex = _ref.selectedIndex,
-      previousClick = _ref.previousClick,
-      nextClick = _ref.nextClick,
-      noOfItems = _ref.noOfItems,
-      perView = _ref.perView,
-      languageDirection = _ref.languageDirection;
-
-  if (noOfItems < 1) {
-    return null;
-  }
-
-  var config = useStateValue() || {};
-  var textColor = getTextColor(config.theme);
-
-  var rightArrowView = function rightArrowView() {
-    if (selectedIndex >= noOfItems - perView) return false;
-    return true;
-  };
-
-  var getLeftArrowClassName = languageDirection === "rtl" ? "left-arrow-rtl" : "left-arrow-ltr";
-  var getRightArrowClassName = languageDirection === "rtl" ? "right-arrow-rtl" : "right-arrow-ltr";
-  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, selectedIndex !== 0 ? /*#__PURE__*/React__default["default"].createElement("button", {
-    onClick: previousClick,
-    className: ("left-arrow ".concat(getLeftArrowClassName) ? "left-arrow ".concat(getLeftArrowClassName) + " " : "") + _getClassName__default["default"]("arrow left-arrow-".concat(textColor, " ").concat(getLeftArrowClassName), _styleModuleImportMap$2)
-  }, /*#__PURE__*/React__default["default"].createElement(LeftArrow, {
-    color: textColor === "dark" ? "#fff" : "#333"
-  })) : null, selectedIndex < noOfItems - 1 && rightArrowView() ? /*#__PURE__*/React__default["default"].createElement("button", {
-    onClick: nextClick,
-    className: ("right-arrow ".concat(getRightArrowClassName) ? "right-arrow ".concat(getRightArrowClassName) + " " : "") + _getClassName__default["default"]("arrow right-arrow-".concat(textColor, " ").concat(getRightArrowClassName), _styleModuleImportMap$2)
-  }, /*#__PURE__*/React__default["default"].createElement(RightArrow, {
-    color: textColor === "dark" ? "#fff" : "#333"
-  })) : null);
-};
-SliderArrow.propTypes = {
-  noOfItems: PropTypes.number,
-  perView: PropTypes.number,
-  slideIndicator: PropTypes.string,
-  previousClick: PropTypes.func,
-  nextClick: PropTypes.func,
-  selectedIndex: PropTypes.number,
-  languageDirection: PropTypes.string
-};
-
-var _styleModuleImportMap$1 = {
-  "./slider-indicator.m.css": {
-    "indicators": "slider-indicator-m_indicators__3MNXc",
-    "indicator": "slider-indicator-m_indicator__gTv3x",
-    "indicator-button": "slider-indicator-m_indicator-button__1e82r",
-    "indicator-dots": "slider-indicator-m_indicator-dots__2TR3H",
-    "indicator-dots-dark": "slider-indicator-m_indicator-dots-dark__sGrev",
-    "indicator-dots-light": "slider-indicator-m_indicator-dots-light__2nPn-",
-    "indicator-dashes": "slider-indicator-m_indicator-dashes__DyNCE",
-    "indicator-dashes-dark": "slider-indicator-m_indicator-dashes-dark__VrqJI",
-    "indicator-dashes-light": "slider-indicator-m_indicator-dashes-light__34ESx"
-  }
-};
-var SliderIndicator = function SliderIndicator(_ref) {
-  var indicatorItems = _ref.indicatorItems,
-      indicatorClick = _ref.indicatorClick,
-      selectedIndex = _ref.selectedIndex,
-      indicatorType = _ref.indicatorType;
-
-  if (indicatorItems.length < 1) {
-    return null;
-  }
-
-  var config = useStateValue() || {};
-  var textColor = getTextColor(config.theme);
-  return /*#__PURE__*/React__default["default"].createElement("ul", {
-    className: "slider-indicators slider-indicator-m_indicators__3MNXc"
-  }, indicatorItems.map(function (_, index) {
-    return /*#__PURE__*/React__default["default"].createElement("li", {
-      key: "slider-".concat(index),
-      className: "indicator slider-indicator-m_indicator__gTv3x",
-      onClick: function onClick(e) {
-        return indicatorClick(e, index);
-      }
-    }, /*#__PURE__*/React__default["default"].createElement("button", {
-      "aria-pressed": selectedIndex === index ? "true" : "false",
-      className: ("indicator-button indicator-".concat(indicatorType) ? "indicator-button indicator-".concat(indicatorType) + " " : "") + _getClassName__default["default"]("indicator-button indicator-".concat(indicatorType, " indicator-").concat(indicatorType, "-").concat(textColor), _styleModuleImportMap$1)
-    }));
-  }));
-};
-SliderIndicator.propTypes = {
-  indicatorItems: PropTypes.array,
-  perView: PropTypes.number,
-  indicatorType: PropTypes.string,
-  indicatorClick: PropTypes.func,
-  selectedIndex: PropTypes.number
-};
-
-var smoothScroll = function smoothScroll(node, topOrLeft, horizontal) {
-  var _node$scrollTo;
-
-  node.scrollTo((_node$scrollTo = {}, _defineProperty__default["default"](_node$scrollTo, horizontal ? "left" : "top", topOrLeft), _defineProperty__default["default"](_node$scrollTo, "behavior", "smooth"), _node$scrollTo));
-};
-
-var updateItemSelection = function updateItemSelection(index, languageDirection, scroller, noOfItems) {
-  var getScrollValue = Math.floor(scroller.current.scrollWidth * (index / noOfItems));
-  var scrollValue = languageDirection === "rtl" ? getScrollValue * -1 : getScrollValue;
-  smoothScroll(scroller.current, scrollValue, true);
-};
-
-var setIndicatorValue = function setIndicatorValue(func, ms) {
-  var timeout;
-  return function () {
-    clearTimeout(timeout);
-    timeout = setTimeout(function () {
-      timeout = null;
-      func();
-    }, ms);
-  };
-};
-
-var ScrollSnap = function ScrollSnap(_ref) {
-  var children = _ref.children,
-      isArrow = _ref.isArrow,
-      interval = _ref.interval,
-      isInfinite = _ref.isInfinite,
-      pauseOnHover = _ref.pauseOnHover,
-      perView = _ref.perView,
-      slideIndicator = _ref.slideIndicator;
-
-  var _useState = React.useState(0),
-      _useState2 = _slicedToArray__default["default"](_useState, 2),
-      selectedIndex = _useState2[0],
-      setSelectedIndex = _useState2[1];
-
-  var _useState3 = React.useState(false),
-      _useState4 = _slicedToArray__default["default"](_useState3, 2),
-      autoScroll = _useState4[0],
-      setAutoScroll = _useState4[1];
-
-  var languageDirection = reactRedux.useSelector(function (state) {
-    return lodash.get(state, ["qt", "config", "language", "direction"], "ltr");
-  });
-  var noOfItems = children ? children.length : 0;
-  var scroller = React.useRef(null);
-  var numberOfIndicatorsToShow = children.length - (perView - 1);
-  var indicatorItems = children.slice(0, numberOfIndicatorsToShow);
-  React.useEffect(function () {
-    if (scroller.current) {
-      scroller.current.addEventListener("scroll", setIndicatorValue(function () {
-        var value = Math.round(scroller.current.scrollLeft / scroller.current.scrollWidth * noOfItems);
-        setSelectedIndex(Math.abs(value));
-      }, 150)); // For Default Selection if selectedIndex is not 0 then manually select it
-
-      if (selectedIndex !== 0) {
-        updateItemSelection(selectedIndex);
-      }
-    }
-
-    return function () {
-      scroller.current.removeEventListener("scroll", setIndicatorValue);
-    };
-  }, []); // Infinite scroll
-
-  React.useEffect(function () {
-    if (isInfinite && !autoScroll) {
-      var timer = setInterval(function () {
-        infiniteScroll();
-      }, interval);
-      return function () {
-        clearInterval(timer);
-      };
-    }
-  }, [isInfinite, autoScroll]);
-
-  var infiniteScroll = function infiniteScroll() {
-    setSelectedIndex(function (value) {
-      var newIndex = value === noOfItems - perView ? 0 : value + 1;
-      updateItemSelection(newIndex, languageDirection, scroller, noOfItems);
-      return newIndex;
-    });
-  };
-
-  var pauseAutoPlay = function pauseAutoPlay() {
-    pauseOnHover && setAutoScroll(!autoScroll);
-  };
-
-  var indicatorClick = function indicatorClick(e, newIndex) {
-    e.preventDefault();
-    e.stopPropagation();
-    setSelectedIndex(newIndex);
-    updateItemSelection(newIndex, languageDirection, scroller, noOfItems);
-  };
-
-  var nextClick = function nextClick(e) {
-    e.preventDefault();
-    e.stopPropagation();
-
-    if (selectedIndex < noOfItems) {
-      var newIndex = selectedIndex + 1;
-      setSelectedIndex(newIndex);
-      updateItemSelection(newIndex, languageDirection, scroller, noOfItems);
-    }
-  };
-
-  var previousClick = function previousClick(e) {
-    e.preventDefault();
-    e.stopPropagation();
-    var newIndex = selectedIndex - 1;
-    setSelectedIndex(newIndex);
-    updateItemSelection(newIndex, languageDirection, scroller, noOfItems);
-  };
-
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "scroll-snap-container"
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "scroll-snap-wrapper scroll-snap-m_wrapper__1Rz9v",
-    onMouseEnter: pauseAutoPlay,
-    onMouseLeave: pauseAutoPlay
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    ref: scroller,
-    className: "scroll-snap-carousel scroll-snap-m_carousel__2m3cg"
-  }, children), isArrow && /*#__PURE__*/React__default["default"].createElement(SliderArrow, {
-    noOfItems: noOfItems,
-    perView: perView,
-    previousClick: previousClick,
-    nextClick: nextClick,
-    selectedIndex: selectedIndex,
-    languageDirection: languageDirection
-  })), children.length > perView && slideIndicator !== "none" && /*#__PURE__*/React__default["default"].createElement(SliderIndicator, {
-    indicatorItems: indicatorItems,
-    indicatorClick: indicatorClick,
-    selectedIndex: selectedIndex,
-    indicatorType: slideIndicator
-  }));
-};
-ScrollSnap.defaultProps = {
-  isArrow: true,
-  isInfinite: false,
-  interval: 4000,
-  pauseOnHover: true,
-  perView: 1,
-  slideIndicator: "dots"
-};
-ScrollSnap.propTypes = {
-  children: PropTypes.array.isRequired,
-  isArrow: PropTypes.bool,
-  isInfinite: PropTypes.bool,
-  interval: PropTypes.number,
-  pauseOnHover: PropTypes.bool,
-  perView: PropTypes.number,
-  slideIndicator: PropTypes.string
-};
-
-var ImageSlideshowBase = function ImageSlideshowBase(props) {
-  if (!props.element) return null;
-
-  var Slide = function Slide(image, index, onClickHandler) {
-    var id = image.id,
-        imageS3Key = image["image-s3-key"],
-        metadata = image.metadata,
-        title = image.title,
-        _image$hyperlink = image.hyperlink,
-        hyperlink = _image$hyperlink === void 0 ? "" : _image$hyperlink;
-    return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "image-slideshow-m_slide__3URCC",
-      key: id
-    }, /*#__PURE__*/React__default["default"].createElement("figure", {
-      key: id,
-      className: "image-slideshow-m_image-container__2VTEK",
-      onClick: function onClick() {
-        return onClickHandler(index);
-      }
-    }, /*#__PURE__*/React__default["default"].createElement(components.LazyLoadImages, {
-      margin: "0px"
-    }, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
-      slug: imageS3Key,
-      metadata: metadata,
-      "aspect-ratio": [16, 9],
-      defaultWidth: 480,
-      widths: [250, 480, 640],
-      imgParams: {
-        auto: ["format", "compress"]
-      },
-      className: "image-slideshow-m_image__1p1fO",
-      alt: title
-    }))), hyperlink && /*#__PURE__*/React__default["default"].createElement(HyperLink, {
-      hyperLink: hyperlink
-    }), /*#__PURE__*/React__default["default"].createElement("p", {
-      className: "image-slideshow-m_caption__mWpmc",
-      dangerouslySetInnerHTML: {
-        __html: title
-      }
-    }));
-  };
-
-  var ImageSlideshowTemplate = function ImageSlideshowTemplate(_ref) {
-    var onClickHandler = _ref.onClickHandler;
-    var storyElements = lodash.get(props, ["element", "story-elements"], []);
-    return /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "arr--image-slideshow-element image-slideshow-m_slideshow__3jRFX",
-      "data-test-id": "image-slideshow"
-    }, /*#__PURE__*/React__default["default"].createElement(ScrollSnap, {
-      slideIndicator: "none"
-    }, storyElements.map(function (image, index) {
-      return Slide(image, index, onClickHandler);
-    })));
-  };
-
-  ImageSlideshowTemplate.propTypes = {
-    onClickHandler: PropTypes__default["default"].func
-  };
-  return /*#__PURE__*/React__default["default"].createElement(FullScreenImages, {
-    template: ImageSlideshowTemplate,
-    element: props.element
-  });
-};
-
-ImageSlideshowBase.propTypes = {
-  element: PropTypes__default["default"].shape({
-    "story-elements": PropTypes__default["default"].array
-  }),
-  story: shapeStory
-};
-var ImageSlideshow = withElementWrapper(ImageSlideshowBase);
-
-var _styleModuleImportMap = {
-  "./story-element-card.m.css": {
-    "element-container": "story-element-card-m_element-container__1ZeJL",
-    "live-blog": "story-element-card-m_live-blog__JSpmI",
-    "image-share": "story-element-card-m_image-share__2V7dB",
-    "story-card": "story-element-card-m_story-card__H2VYl",
-    "table": "story-element-card-m_table__34F2c",
-    "dark": "story-element-card-m_dark__1AX15",
-    "light": "story-element-card-m_light__3T2uA"
-  }
-};
-
-var getElementType = function getElementType(element) {
-  return element["subtype"] || element["type"] || "";
-};
-
-var getElement = function getElement(story, element) {
-  var config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  var AdComponent = arguments.length > 3 ? arguments[3] : undefined;
-  var WidgetComp = arguments.length > 4 ? arguments[4] : undefined;
-  var index = arguments.length > 5 ? arguments[5] : undefined;
-  var cardId = arguments.length > 6 ? arguments[6] : undefined;
-  var _config$text = config.text,
-      text = _config$text === void 0 ? {} : _config$text,
-      _config$summary = config.summary,
-      summary = _config$summary === void 0 ? {} : _config$summary,
-      _config$blurb = config.blurb,
-      blurb = _config$blurb === void 0 ? {} : _config$blurb,
-      _config$blockquote = config.blockquote,
-      blockquote = _config$blockquote === void 0 ? {} : _config$blockquote,
-      _config$quote = config.quote,
-      quote = _config$quote === void 0 ? {} : _config$quote,
-      _config$alsoRead = config["also-read"],
-      alsoRead = _config$alsoRead === void 0 ? {} : _config$alsoRead,
-      _config$qAndA = config["q-and-a"],
-      qaElement = _config$qAndA === void 0 ? {} : _config$qAndA,
-      _config$question = config.question,
-      questionElement = _config$question === void 0 ? {} : _config$question,
-      _config$answer = config.answer,
-      answerElement = _config$answer === void 0 ? {} : _config$answer,
-      _config$references = config.references,
-      references = _config$references === void 0 ? {} : _config$references;
-  var elementType = getElementType(element);
-
-  if (elementType === "image-gallery") {
-    elementType = element.metadata["type"];
-  }
-
-  var storyElementId = lodash.get(element, ["id"]);
-
-  switch (elementType) {
-    case "ad":
-      return /*#__PURE__*/React__default["default"].createElement(AdComponent, _extends__default["default"]({}, element, {
-        id: "ad-".concat(index, "_").concat(cardId)
-      }));
-
-    case "widget":
-      return /*#__PURE__*/React__default["default"].createElement(WidgetComp, {
-        widgetCode: element.config.customCode,
-        id: "widget-".concat(index, "_").concat(cardId)
-      });
-
-    case "text":
-    case "cta":
-      var _text$css = text.css;
-      _text$css = _text$css === void 0 ? {} : _text$css;
-      var _text$css$textColor = _text$css.textColor,
-          textElementColor = _text$css$textColor === void 0 ? "#000" : _text$css$textColor,
-          _text$css$hyperlinkCo = _text$css.hyperlinkColor,
-          hyperlinkColor = _text$css$hyperlinkCo === void 0 ? "#2f81cd" : _text$css$hyperlinkCo;
-      return /*#__PURE__*/React__default["default"].createElement(Text, {
-        element: element,
-        css: {
-          textColor: textElementColor,
-          hyperlinkColor: hyperlinkColor
-        }
-      });
-
-    case "summary":
-      var _summary$template = summary.template,
-          summaryTemplate = _summary$template === void 0 ? "" : _summary$template,
-          _summary$css = summary.css;
-      _summary$css = _summary$css === void 0 ? {} : _summary$css;
-      var _summary$css$headerBg = _summary$css.headerBgColor,
-          headerBgColor = _summary$css$headerBg === void 0 ? "" : _summary$css$headerBg,
-          _summary$opts = summary.opts;
-      _summary$opts = _summary$opts === void 0 ? {} : _summary$opts;
-      var _summary$opts$headlin = _summary$opts.headline,
-          headline = _summary$opts$headlin === void 0 ? "" : _summary$opts$headlin,
-          _summary$opts$hideHea = _summary$opts.hideHeadline,
-          hideHeadline = _summary$opts$hideHea === void 0 ? false : _summary$opts$hideHea;
-      return /*#__PURE__*/React__default["default"].createElement(Summary, {
-        element: element,
-        template: summaryTemplate,
-        opts: {
-          headline: headline || "Summary",
-          hideHeadline: hideHeadline
-        },
-        css: {
-          headerBgColor: headerBgColor || ""
-        }
-      });
-
-    case "blurb":
-      var _blurb$template = blurb.template,
-          blurbTemplate = _blurb$template === void 0 ? "default" : _blurb$template,
-          _blurb$css = blurb.css;
-      _blurb$css = _blurb$css === void 0 ? {} : _blurb$css;
-      var _blurb$css$borderColo = _blurb$css.borderColor,
-          borderColor = _blurb$css$borderColo === void 0 ? "#2f81cd" : _blurb$css$borderColo;
-      return /*#__PURE__*/React__default["default"].createElement(Blurb, {
-        element: element,
-        template: blurbTemplate,
-        css: {
-          borderColor: borderColor
-        }
-      });
-
-    case "blockquote":
-      var _blockquote$template = blockquote.template,
-          blockQuoteTemplate = _blockquote$template === void 0 ? "default" : _blockquote$template,
-          _blockquote$css = blockquote.css;
-      _blockquote$css = _blockquote$css === void 0 ? {} : _blockquote$css;
-      var _blockquote$css$iconT = _blockquote$css.iconType,
-          iconType = _blockquote$css$iconT === void 0 ? "edgeIcon" : _blockquote$css$iconT,
-          _blockquote$css$block = _blockquote$css.blockQuoteColor,
-          blockQuoteColor = _blockquote$css$block === void 0 ? "#2f81cd" : _blockquote$css$block,
-          _blockquote$css$backg = _blockquote$css.backgroundShade,
-          backgroundShade = _blockquote$css$backg === void 0 ? "" : _blockquote$css$backg;
-      return /*#__PURE__*/React__default["default"].createElement(BlockQuote, {
-        element: element,
-        template: blockQuoteTemplate,
-        css: {
-          iconType: iconType,
-          blockQuoteColor: blockQuoteColor,
-          backgroundShade: backgroundShade
-        }
-      });
-
-    case "quote":
-      var _quote$template = quote.template,
-          quoteTemplate = _quote$template === void 0 ? "borderNone" : _quote$template,
-          _quote$css = quote.css;
-      _quote$css = _quote$css === void 0 ? {} : _quote$css;
-      var _quote$css$borderColo = _quote$css.borderColor,
-          quoteBorderColor = _quote$css$borderColo === void 0 ? "#2f81cd" : _quote$css$borderColo;
-      return /*#__PURE__*/React__default["default"].createElement(Quote, {
-        element: element,
-        template: quoteTemplate,
-        css: {
-          borderColor: quoteBorderColor
-        }
-      });
-
-    case "bigfact":
-      return /*#__PURE__*/React__default["default"].createElement(BigFact, {
-        element: element
-      });
-
-    case "also-read":
-      var _alsoRead$template = alsoRead.template,
-          alsoReadTemplate = _alsoRead$template === void 0 ? "default" : _alsoRead$template,
-          _alsoRead$css = alsoRead.css;
-      _alsoRead$css = _alsoRead$css === void 0 ? {} : _alsoRead$css;
-      var _alsoRead$css$textCol = _alsoRead$css.textColor,
-          textColor = _alsoRead$css$textCol === void 0 ? "#000" : _alsoRead$css$textCol,
-          _alsoRead$opts = alsoRead.opts;
-      _alsoRead$opts = _alsoRead$opts === void 0 ? {} : _alsoRead$opts;
-      var _alsoRead$opts$title = _alsoRead$opts.title,
-          title = _alsoRead$opts$title === void 0 ? "" : _alsoRead$opts$title;
-      return /*#__PURE__*/React__default["default"].createElement(AlsoRead, {
-        story: story,
-        element: element,
-        template: alsoReadTemplate,
-        css: {
-          textColor: textColor
-        },
-        opts: {
-          title: title
-        }
-      });
-
-    case "image":
-      return /*#__PURE__*/React__default["default"].createElement(Image, {
-        element: element
-      });
-
-    case "q-and-a":
-      var _qaElement$template = qaElement.template,
-          qaTemplate = _qaElement$template === void 0 ? "default" : _qaElement$template,
-          _qaElement$css = qaElement.css;
-      _qaElement$css = _qaElement$css === void 0 ? {} : _qaElement$css;
-      var _qaElement$css$iconCo = _qaElement$css.iconColor,
-          iconColor = _qaElement$css$iconCo === void 0 ? "" : _qaElement$css$iconCo,
-          _qaElement$opts = qaElement.opts;
-      _qaElement$opts = _qaElement$opts === void 0 ? {} : _qaElement$opts;
-      var _qaElement$opts$defau = _qaElement$opts.defaultIconType,
-          defaultIconType = _qaElement$opts$defau === void 0 ? "edge" : _qaElement$opts$defau;
-      return /*#__PURE__*/React__default["default"].createElement(QuestionAnswer, {
-        element: element,
-        opts: {
-          type: "q-and-a",
-          defaultIconType: defaultIconType
-        },
-        template: qaTemplate,
-        css: {
-          iconColor: iconColor
-        }
-      });
-
-    case "question":
-      var _questionElement$temp = questionElement.template,
-          questionTemplate = _questionElement$temp === void 0 ? "default" : _questionElement$temp,
-          _questionElement$css = questionElement.css;
-      _questionElement$css = _questionElement$css === void 0 ? {} : _questionElement$css;
-      var _questionElement$css$ = _questionElement$css.questionIconColor,
-          questionIconColor = _questionElement$css$ === void 0 ? "" : _questionElement$css$,
-          _questionElement$opts = questionElement.opts;
-      _questionElement$opts = _questionElement$opts === void 0 ? {} : _questionElement$opts;
-      var _questionElement$opts2 = _questionElement$opts.defaultQuestionIconType,
-          defaultQuestionIconType = _questionElement$opts2 === void 0 ? "edge" : _questionElement$opts2;
-      return /*#__PURE__*/React__default["default"].createElement(QuestionAnswer, {
-        element: element,
-        opts: {
-          type: "question",
-          defaultIconType: defaultQuestionIconType
-        },
-        template: questionTemplate,
-        css: {
-          iconColor: questionIconColor
-        }
-      });
-
-    case "answer":
-      var _answerElement$templa = answerElement.template,
-          answerTemplate = _answerElement$templa === void 0 ? "default" : _answerElement$templa,
-          _answerElement$css = answerElement.css;
-      _answerElement$css = _answerElement$css === void 0 ? {} : _answerElement$css;
-      var _answerElement$css$an = _answerElement$css.answerIconColor,
-          answerIconColor = _answerElement$css$an === void 0 ? "" : _answerElement$css$an,
-          _answerElement$opts = answerElement.opts;
-      _answerElement$opts = _answerElement$opts === void 0 ? {} : _answerElement$opts;
-      var _answerElement$opts$d = _answerElement$opts.defaultAnswerIconType,
-          defaultAnswerIconType = _answerElement$opts$d === void 0 ? "edge" : _answerElement$opts$d;
-      return /*#__PURE__*/React__default["default"].createElement(QuestionAnswer, {
-        element: element,
-        opts: {
-          type: "answer",
-          defaultIconType: defaultAnswerIconType
-        },
-        template: answerTemplate,
-        css: {
-          iconColor: answerIconColor
-        }
-      });
-
-    case "gallery":
-      return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "content-style",
-        id: "image-gallery-".concat(storyElementId)
-      }, /*#__PURE__*/React__default["default"].createElement(ImageGallery, {
-        element: element
-      }));
-
-    case "slideshow":
-      return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "content-style",
-        id: "image-slideshow-".concat(storyElementId)
-      }, /*#__PURE__*/React__default["default"].createElement(ImageSlideshow, {
-        element: element
-      }));
-
-    case "youtube-video":
-    case "dailymotion-video":
-      return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "content-style",
-        id: "video-".concat(storyElementId)
-      }, /*#__PURE__*/React__default["default"].createElement(Video, {
-        element: element,
-        story: story,
-        loadIframeOnClick: true
-      }));
-
-    case "attachment":
-      return /*#__PURE__*/React__default["default"].createElement(Attachment, {
-        element: element
-      });
-
-    case "tweet":
-    case "jsembed":
-      return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "content-style",
-        id: "jsembed-".concat(storyElementId)
-      }, /*#__PURE__*/React__default["default"].createElement(StoryElement, {
-        element: element
-      }));
-
-    case "references":
-      var _references$opts = references.opts;
-      _references$opts = _references$opts === void 0 ? {} : _references$opts;
-      var _references$opts$show = _references$opts.showHeadline,
-          showHeadline = _references$opts$show === void 0 ? true : _references$opts$show,
-          _references$opts$head = _references$opts.headlineText,
-          headlineText = _references$opts$head === void 0 ? "" : _references$opts$head;
-      return /*#__PURE__*/React__default["default"].createElement(Reference, {
-        element: element,
-        opts: {
-          showHeadline: showHeadline,
-          headlineText: headlineText
-        }
-      });
-
-    default:
-      return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "content-style",
-        id: "element-".concat(storyElementId)
-      }, /*#__PURE__*/React__default["default"].createElement(StoryElement, {
-        element: element,
-        story: story
-      }));
-  }
-};
-
-var MainImageWrapper = function MainImageWrapper(_ref) {
-  var imageElement = _ref.imageElement,
-      story = _ref.story;
-      _ref.children;
-      var config = _ref.config,
-      card = _ref.card;
-  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
-    style: {
-      backgroundColor: config.theme
-    }
-  }, /*#__PURE__*/React__default["default"].createElement(Image, {
-    element: imageElement,
-    caption: false
-  }), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "story-element-card-m_image-share__2V7dB"
-  }, /*#__PURE__*/React__default["default"].createElement(CaptionAttribution, {
-    element: imageElement,
-    config: config
-  }), /*#__PURE__*/React__default["default"].createElement(components.SocialShare, {
-    template: SocialShareTemplate,
-    title: story.headline,
-    theme: config.theme,
-    fullUrl: encodeURI("".concat(lodash.get(story, ["url"], ""), "?cardId=").concat(lodash.get(card, ["id"], -1)))
-  }))));
-};
-
-MainImageWrapper.propTypes = {
-  story: PropTypes__default["default"].object,
-  imageElement: PropTypes__default["default"].object,
-  config: PropTypes__default["default"].object,
-  children: PropTypes__default["default"].node,
-  card: PropTypes__default["default"].shape({
-    id: PropTypes__default["default"].string
-  })
-};
-var StoryElementCard = function StoryElementCard(_ref2) {
-  var story = _ref2.story,
-      card = _ref2.card,
-      _ref2$heroVideoElemen = _ref2.heroVideoElementId,
-      heroVideoElementId = _ref2$heroVideoElemen === void 0 ? -1 : _ref2$heroVideoElemen,
-      config = _ref2.config,
-      isLive = _ref2.isLive,
-      theme = _ref2.theme,
-      adComponent = _ref2.adComponent,
-      widgetComp = _ref2.widgetComp;
-  var textColor = getTextColor(theme);
-  var isLiveBlog = isLive ? "live-blog" : "";
-  var shouldRunFBMobileVideoFix = true;
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "arr--story-page-card-wrapper"
-  }, lodash.get(card, ["story-elements"], []).map(function (element, index) {
-    if (element.id === heroVideoElementId) return false;
-
-    if (element.subtype && element.subtype === "facebook-post" && shouldRunFBMobileVideoFix) {
-      facebookMobileVideoResizeFix();
-      shouldRunFBMobileVideoFix = false;
-    }
-
-    var tableStyle = element && element.subtype === "table" ? "table" : "";
-    var cardId = lodash.get(card, ["id"], "");
-    return /*#__PURE__*/React__default["default"].createElement("div", {
-      key: element.id,
-      className: "arr--element-container " + _getClassName__default["default"]("element-container ".concat(isLiveBlog, " ").concat(tableStyle, " ").concat(textColor), _styleModuleImportMap)
-    }, getElement(story, element, config, adComponent, widgetComp, index, cardId));
-  }));
-};
-StoryElementCard.propTypes = {
-  story: PropTypes__default["default"].object,
-  card: PropTypes__default["default"].array,
-  heroVideoElementId: PropTypes__default["default"].number,
-  config: PropTypes__default["default"].object,
-  isLive: PropTypes__default["default"].bool,
-  theme: PropTypes__default["default"].string,
-  adComponent: PropTypes__default["default"].func,
-  widgetComp: PropTypes__default["default"].func
-};
-var PhotoStoryElement = function PhotoStoryElement(_ref3) {
-  var _ref3$card = _ref3.card,
-      card = _ref3$card === void 0 ? {} : _ref3$card,
-      config = _ref3.config,
-      story = _ref3.story,
-      adComponent = _ref3.adComponent,
-      widgetComp = _ref3.widgetComp;
-  var shouldRunFBMobileVideoFix = true;
-  return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "story-element-card-m_story-card__H2VYl"
-  }, lodash.get(card, ["story-elements"], []).map(function (element, index) {
-    var cardId = lodash.get(card, ["id"], "");
-
-    if (element.type === "image") {
-      return /*#__PURE__*/React__default["default"].createElement(MainImageWrapper, {
-        imageElement: element,
-        story: story,
-        config: config,
-        card: card
-      });
-    } else {
-      if (element.subtype && element.subtype === "facebook-post" && shouldRunFBMobileVideoFix) {
-        facebookMobileVideoResizeFix();
-        shouldRunFBMobileVideoFix = false;
-      }
-
-      return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "story-element-card-m_element-container__1ZeJL",
-        key: index
-      }, getElement(story, element, config, adComponent, widgetComp, index, cardId));
-    }
-  }));
-};
-PhotoStoryElement.propTypes = {
-  story: PropTypes__default["default"].object,
-  card: PropTypes__default["default"].object,
-  config: PropTypes__default["default"].object,
-  adComponent: PropTypes__default["default"].func,
-  widgetComp: PropTypes__default["default"].func
-};
-var SlotAfterStory = function SlotAfterStory(_ref4) {
-  var _ref4$id = _ref4.id,
-      id = _ref4$id === void 0 ? "" : _ref4$id,
-      _ref4$element = _ref4.element,
-      element = _ref4$element === void 0 ? {} : _ref4$element,
-      AdComponent = _ref4.AdComponent,
-      WidgetComp = _ref4.WidgetComp;
-
-  switch (element.type) {
-    case "ad":
-      return /*#__PURE__*/React__default["default"].createElement(AdComponent, _extends__default["default"]({}, element, {
-        id: "ad-after-story-".concat(id)
-      }));
-
-    case "widget":
-      return /*#__PURE__*/React__default["default"].createElement(WidgetComp, {
-        widgetCode: element.config.customCode,
-        id: "widget-after-story-".concat(id)
-      });
-
-    default:
-      return null;
-  }
-};
-SlotAfterStory.propTypes = {
-  id: PropTypes__default["default"].string,
-  element: PropTypes__default["default"].object,
-  AdComponent: PropTypes__default["default"].func,
-  WidgetComp: PropTypes__default["default"].func
-};
-
-exports.PhotoStoryElement = PhotoStoryElement;
-exports.SlotAfterStory = SlotAfterStory;
-exports.StoryElementCard = StoryElementCard;