@quintype/arrow 3.15.1-perf.2 → 3.15.1-perf.3

package/story-templates/VideoStoryTemplate/index.js

@@ -1,9 +1,37 @@
-import { Link, StoryElement as StoryElement$1, ResponsiveImage, ResponsiveHeroImage, LinkBase, LazyLoadImages, SocialShare } from '@quintype/components';
-import PropTypes, { PropTypes as PropTypes$1, string, number, func, array, bool } from 'prop-types';
-import React, { useState, useEffect, useContext, createContext, Suspense, lazy, useRef } from 'react';
-import { connect, useSelector } from 'react-redux';
-import Timeago from 'react-timeago';
-import { utcToZonedTime, format } from 'date-fns-tz';
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components = require('@quintype/components');
+var PropTypes = require('prop-types');
+var React = require('react');
+var reactRedux = require('react-redux');
+var Timeago = require('react-timeago');
+var dateFnsTz = require('date-fns-tz');
+
+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 PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var Timeago__default = /*#__PURE__*/_interopDefaultLegacy(Timeago);
 
 function _extends() {
   _extends = Object.assign || function (target) {
@@ -1426,105 +1454,105 @@ function _slicedToArray(arr, i) {
 var Twitter = function Twitter(_ref) {
   var _ref$color = _ref.color,
       color = _ref$color === void 0 ? "#1CB7EB" : _ref$color;
-  return /*#__PURE__*/React.createElement("svg", {
+  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.createElement("path", {
+  }, /*#__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.string
+  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.createElement("svg", {
+  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.createElement("path", {
+  }, /*#__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.string
+  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.createElement("svg", {
+  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.createElement("path", {
+  }, /*#__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.string
+  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.createElement("svg", {
+  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.createElement("path", {
+  }, /*#__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.string
+  color: PropTypes__default["default"].string
 };
 
 var getSocialIcons = function getSocialIcons(color, iconType) {
   switch (iconType) {
     case "plain-color-svg":
       return {
-        facebook: /*#__PURE__*/React.createElement(Facebook, {
+        facebook: /*#__PURE__*/React__default["default"].createElement(Facebook, {
           key: iconType
         }),
-        twitter: /*#__PURE__*/React.createElement(Twitter, {
+        twitter: /*#__PURE__*/React__default["default"].createElement(Twitter, {
           key: iconType
         }),
-        linkedin: /*#__PURE__*/React.createElement(LinkedIn, {
+        linkedin: /*#__PURE__*/React__default["default"].createElement(LinkedIn, {
           key: iconType
         }),
-        whatsapp: /*#__PURE__*/React.createElement(WhatsApp, {
+        whatsapp: /*#__PURE__*/React__default["default"].createElement(WhatsApp, {
           key: iconType
         })
       };
 
     default:
       return {
-        facebook: /*#__PURE__*/React.createElement(Facebook, {
+        facebook: /*#__PURE__*/React__default["default"].createElement(Facebook, {
           color: color,
           key: iconType
         }),
-        twitter: /*#__PURE__*/React.createElement(Twitter, {
+        twitter: /*#__PURE__*/React__default["default"].createElement(Twitter, {
           color: color,
           key: iconType
         }),
-        linkedin: /*#__PURE__*/React.createElement(LinkedIn, {
+        linkedin: /*#__PURE__*/React__default["default"].createElement(LinkedIn, {
           color: color,
           key: iconType
         }),
-        whatsapp: /*#__PURE__*/React.createElement(WhatsApp, {
+        whatsapp: /*#__PURE__*/React__default["default"].createElement(WhatsApp, {
           color: color,
           key: iconType
         })
@@ -1580,22 +1608,22 @@ var socialShareData = function socialShareData(_ref) {
 var CloseIcon = function CloseIcon(_ref) {
   var _ref$color = _ref.color,
       color = _ref$color === void 0 ? "#333" : _ref$color;
-  return /*#__PURE__*/React.createElement("svg", {
+  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.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", {
     fill: "none",
     stroke: color,
     strokeLinecap: "square",
     strokeWidth: "2"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__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.string
+  color: PropTypes__default["default"].string
 };
 
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
@@ -2963,15 +2991,15 @@ var isEmpty = function isEmpty(value) {
   return value == null || // From standard.js: Always use === - but value == null is allowed to check null || undefined
   _typeof(value) === "object" && Object.entries(value).length === 0 && value.constructor === Object || typeof value === "string" && value.trim().length === 0;
 };
-var shapeConfig = PropTypes.shape({
-  "sketches-host": PropTypes.string,
-  "cdn-name": PropTypes.string,
-  "cdn-image": PropTypes.string
+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.shape({
-  headline: PropTypes.string,
-  "last-published-at": PropTypes.number,
-  subheadline: PropTypes.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 getStoryUrl = function getStoryUrl(story) {
   var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
@@ -3064,17 +3092,17 @@ var getTimeStamp = function getTimeStamp(date, _formatter) {
   var timezone = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
 
   if (timezone && template === "story") {
-    var zonedTime = timezone && utcToZonedTime(date, timezone);
-    var formatZonedTime = zonedTime && format(zonedTime, "yyyy-MM-dd'T'HH:mm:ssXXX", {
+    var zonedTime = timezone && dateFnsTz.utcToZonedTime(date, timezone);
+    var formatZonedTime = zonedTime && dateFnsTz.format(zonedTime, "yyyy-MM-dd'T'HH:mm:ssXXX", {
       timeZone: timezone
     });
     var timeStamp = timestampToFormat("", "", "", date, config);
-    return /*#__PURE__*/React.createElement("time", {
+    return /*#__PURE__*/React__default["default"].createElement("time", {
       dateTime: formatZonedTime
     }, timeStamp);
   }
 
-  return /*#__PURE__*/React.createElement(Timeago, {
+  return /*#__PURE__*/React__default["default"].createElement(Timeago__default["default"], {
     date: date,
     formatter: function formatter(value, unit, suffix, date) {
       return _formatter(value, unit, suffix, date, config);
@@ -3100,17 +3128,17 @@ var _styleModuleImportMap$A = {
 };
 
 var popupSocialShareItem = function popupSocialShareItem(url, icon, text, index) {
-  return url ? /*#__PURE__*/React.createElement("li", {
+  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.createElement("a", {
+  }, /*#__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.createElement("span", {
+  }, icon, /*#__PURE__*/React__default["default"].createElement("span", {
     className: "social-share-popup-m_social-text__1QPXb"
   }, text))) : null;
 };
@@ -3140,20 +3168,20 @@ var SocialSharePopup = function SocialSharePopup(_ref) {
     iconType: iconType
   };
   var popupItemsList = socialShareData(options);
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: _getClassName("share-popup-wrapper ".concat(textColor), _styleModuleImportMap$A)
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "social-share-popup-m_share-popup__QRt3l social-share-popup-m_share-popup-wrapper__GEJqD"
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "social-share-popup-m_top-bar__174Um"
-  }, /*#__PURE__*/React.createElement("span", {
+  }, /*#__PURE__*/React__default["default"].createElement("span", {
     className: "social-share-popup-m_share-text__19E-F"
-  }, "Share via"), /*#__PURE__*/React.createElement("span", {
+  }, "Share via"), /*#__PURE__*/React__default["default"].createElement("span", {
     className: "social-share-popup-m_close__3k-Hj",
     onClick: closePopup
-  }, /*#__PURE__*/React.createElement(CloseIcon, {
+  }, /*#__PURE__*/React__default["default"].createElement(CloseIcon, {
     color: iconColor
-  }))), /*#__PURE__*/React.createElement("ul", {
+  }))), /*#__PURE__*/React__default["default"].createElement("ul", {
     className: "social-share-popup-m_wrapper__3Ytce"
   }, popupItemsList.map(function (_ref2, index) {
     var url = _ref2.url,
@@ -3165,33 +3193,33 @@ var SocialSharePopup = function SocialSharePopup(_ref) {
   }))));
 };
 SocialSharePopup.propTypes = {
-  fbUrl: PropTypes.string,
-  twitterUrl: PropTypes.string,
-  linkedinUrl: PropTypes.string,
-  whatsappUrl: PropTypes.string,
-  grey: PropTypes.string,
-  primaryColor: PropTypes.string,
-  closePopup: PropTypes.bool,
-  theme: PropTypes.string,
-  iconType: PropTypes.string
+  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.createElement("svg", {
+  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.createElement("path", {
+  }, /*#__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.string
+  color: PropTypes__default["default"].string
 };
 
 /**
@@ -3460,10 +3488,10 @@ var ShareItem = function ShareItem(_ref) {
       url = _ref.url,
       icon = _ref.icon,
       dataTestId = _ref.dataTestId;
-  return url ? /*#__PURE__*/React.createElement("li", {
+  return url ? /*#__PURE__*/React__default["default"].createElement("li", {
     "data-testid": dataTestId,
     className: "social-share-template-m_icon__1Mnu5"
-  }, /*#__PURE__*/React.createElement("a", {
+  }, /*#__PURE__*/React__default["default"].createElement("a", {
     href: url,
     target: "_blank",
     rel: "noopener noreferrer",
@@ -3473,17 +3501,17 @@ var ShareItem = function ShareItem(_ref) {
 };
 
 ShareItem.propTypes = {
-  name: PropTypes.string,
-  url: PropTypes.string,
-  icon: PropTypes.node,
-  dataTestId: PropTypes.string
+  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.createElement(ShareIcon, {
+  if (!open) return /*#__PURE__*/React__default["default"].createElement(ShareIcon, {
     color: color
   });
-  return /*#__PURE__*/React.createElement(CloseIcon, {
+  return /*#__PURE__*/React__default["default"].createElement(CloseIcon, {
     color: color
   });
 }
@@ -3517,21 +3545,21 @@ var SocialShareTemplate = function SocialShareTemplate(props) {
   };
   var iconsList = socialShareData(options);
 
-  var _useState = useState(open),
+  var _useState = React.useState(open),
       _useState2 = _slicedToArray(_useState, 2),
       isOpen = _useState2[0],
       setIsOpen = _useState2[1];
 
   var verticalShare = vertical ? "vertical" : "horizontal";
-  useEffect(function () {
+  React.useEffect(function () {
     return setIsOpen(open);
   }, [open]);
 
   var shareIcon = function shareIcon() {
-    return /*#__PURE__*/React.createElement("li", {
+    return /*#__PURE__*/React__default["default"].createElement("li", {
       className: "social-share-template-m_icon__1Mnu5",
       key: "horizontal-0"
-    }, /*#__PURE__*/React.createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
       onClick: clickHandler
     }, getActionIcon(isOpen, iconColor)));
   };
@@ -3541,16 +3569,16 @@ var SocialShareTemplate = function SocialShareTemplate(props) {
   };
 
   var popUpWrapper = function popUpWrapper() {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "social-share-template-m_tablet-view__kATzi"
-    }, !isOpen && /*#__PURE__*/React.createElement("ul", {
+    }, !isOpen && /*#__PURE__*/React__default["default"].createElement("ul", {
       className: _getClassName("wrapper ".concat(isOpen ? "open" : ""), _styleModuleImportMap$z)
-    }, shareIcon()), isOpen && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    }, 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.createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "arr--popup " + _getClassName("popup-wrapper ".concat(isOpen ? "popup-open" : ""), _styleModuleImportMap$z)
-    }, /*#__PURE__*/React.createElement(SocialSharePopup, {
+    }, /*#__PURE__*/React__default["default"].createElement(SocialSharePopup, {
       fbUrl: fbUrl,
       twitterUrl: twitterUrl,
       linkedinUrl: linkedinUrl,
@@ -3564,47 +3592,47 @@ var SocialShareTemplate = function SocialShareTemplate(props) {
   };
 
   var popupStyle = !isOpen && vertical ? "tablet-view-popup" : "";
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": verticalShare,
     className: "arr--share " + _getClassName("".concat(iconShade, " ").concat(verticalShare, " ").concat(popupStyle), _styleModuleImportMap$z)
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "social-share-template-m_desktop-view__3TmkO"
-  }, /*#__PURE__*/React.createElement("ul", {
+  }, /*#__PURE__*/React__default["default"].createElement("ul", {
     "data-test-id": camelCase_1(iconType),
     className: "desktop-share-wrapper " + _getClassName("wrapper ".concat(isOpen ? "open" : ""), _styleModuleImportMap$z)
   }, shareIcon(), iconsList.map(function (iconData, index) {
-    return /*#__PURE__*/React.createElement(ShareItem, _extends({}, iconData, {
+    return /*#__PURE__*/React__default["default"].createElement(ShareItem, _extends({}, iconData, {
       key: iconData.name,
       dataTestId: "card-share-".concat(index)
     }));
   }))), popUpWrapper());
 };
 SocialShareTemplate.propTypes = {
-  fbUrl: PropTypes.string,
-  twitterUrl: PropTypes.string,
-  linkedinUrl: PropTypes.string,
-  whatsappUrl: PropTypes.string,
-  vertical: PropTypes.bool,
-  theme: PropTypes.string,
-  iconType: PropTypes.string,
-  open: PropTypes["boolean"]
+  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 StateContext = /*#__PURE__*/createContext(); // eslint-disable-next-line react/display-name
+var StateContext = /*#__PURE__*/React.createContext(); // eslint-disable-next-line react/display-name
 
 var StateProvider = function StateProvider(RowComponent) {
   return function (props) {
     return (
       /*#__PURE__*/
       // eslint-disable-next-line react/prop-types
-      React.createElement(StateContext.Provider, {
+      React__default["default"].createElement(StateContext.Provider, {
         value: props.config
-      }, /*#__PURE__*/React.createElement(RowComponent, props))
+      }, /*#__PURE__*/React__default["default"].createElement(RowComponent, props))
     );
   };
 };
 var useStateValue = function useStateValue() {
-  return useContext(StateContext);
+  return React.useContext(StateContext);
 };
 
 var _styleModuleImportMap$y = {
@@ -3642,22 +3670,22 @@ var SectionTag = function SectionTag(_ref) {
   }
 
   if (!isSection) return null;
-  return /*#__PURE__*/React.createElement(Link, {
+  return /*#__PURE__*/React__default["default"].createElement(components.Link, {
     href: getUrl,
     className: "arrow-component arr--section-name",
     "aria-label": "section-name"
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "sectionTag",
     style: {
       backgroundColor: templateStyle.includes("section-solid") ? sectionTagBorderColor : ""
     },
     className: "section-tag arrow-component " + _getClassName("".concat(textColor, " ").concat(templateStyle), _styleModuleImportMap$y)
-  }, templateStyle.includes("section-borderLeft") && /*#__PURE__*/React.createElement("span", {
+  }, templateStyle.includes("section-borderLeft") && /*#__PURE__*/React__default["default"].createElement("span", {
     className: "section-m_border-left__2oUyp",
     style: {
       color: sectionTagBorderColor
     }
-  }), section["display-name"] || section["name"], /*#__PURE__*/React.createElement("div", {
+  }), section["display-name"] || section["name"], /*#__PURE__*/React__default["default"].createElement("div", {
     className: "section-m_border-bottom__3cRoD",
     style: {
       backgroundColor: "".concat(template === "solid" ? "" : sectionTagBorderColor)
@@ -3666,13 +3694,13 @@ var SectionTag = function SectionTag(_ref) {
 };
 SectionTag.propTypes = {
   /** The Story Object from the API response */
-  story: PropTypes.object.isRequired,
+  story: PropTypes__default["default"].object.isRequired,
 
   /** The style template for section tag */
-  template: PropTypes.oneOf(["", "borderBottomSml", "borderLeft", "solid"]),
-  borderColor: PropTypes.string,
-  solidBorderColor: PropTypes.string,
-  isLightTheme: PropTypes.bool
+  template: PropTypes__default["default"].oneOf(["", "borderBottomSml", "borderLeft", "solid"]),
+  borderColor: PropTypes__default["default"].string,
+  solidBorderColor: PropTypes__default["default"].string,
+  isLightTheme: PropTypes__default["default"].bool
 };
 SectionTag.defaultProps = {
   template: "",
@@ -3685,7 +3713,7 @@ var CrownIcon = function CrownIcon(_ref) {
       _ref$color = _ref.color,
       color = _ref$color === void 0 ? "#D8D8D8" : _ref$color,
       positionTop = _ref.positionTop;
-  return /*#__PURE__*/React.createElement("svg", {
+  return /*#__PURE__*/React__default["default"].createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: width,
     height: height,
@@ -3694,28 +3722,28 @@ var CrownIcon = function CrownIcon(_ref) {
       position: "relative",
       top: positionTop
     }
-  }, /*#__PURE__*/React.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", {
     fill: "none",
     fillRule: "evenodd",
     stroke: "none",
     strokeWidth: "1"
-  }, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", null, /*#__PURE__*/React__default["default"].createElement("g", {
     transform: "translate(8 8)"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
     d: "M0 0H24V24H0z"
-  }), /*#__PURE__*/React.createElement("g", {
+  }), /*#__PURE__*/React__default["default"].createElement("g", {
     fill: color,
     fillRule: "nonzero",
     transform: "translate(0 2)"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
     d: "M21.043 19.553c0-.743-.601-1.344-1.344-1.344h-15.4a1.343 1.343 0 100 2.688h15.4c.743 0 1.344-.603 1.344-1.344zM1.598 8.673c.022 0 .042 0 .064-.003l2.131 7.713h16.411l2.132-7.713c.022 0 .041.003.063.003a1.599 1.599 0 10-1.52-1.108L17.025 9.82 12.882 2.95a1.599 1.599 0 10-1.765 0L6.976 9.82 3.121 7.565a1.599 1.599 0 10-1.523 1.107z"
   }))))));
 };
 CrownIcon.propTypes = {
-  height: PropTypes.string,
-  width: PropTypes.string,
-  color: PropTypes.string,
-  positionTop: PropTypes.string
+  height: PropTypes__default["default"].string,
+  width: PropTypes__default["default"].string,
+  color: PropTypes__default["default"].string,
+  positionTop: PropTypes__default["default"].string
 };
 
 var KeyIcon = function KeyIcon(_ref) {
@@ -3724,7 +3752,7 @@ var KeyIcon = function KeyIcon(_ref) {
       _ref$color = _ref.color,
       color = _ref$color === void 0 ? "#D5D5D5" : _ref$color,
       positionTop = _ref.positionTop;
-  return /*#__PURE__*/React.createElement("svg", {
+  return /*#__PURE__*/React__default["default"].createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: width,
     height: height,
@@ -3733,16 +3761,16 @@ var KeyIcon = function KeyIcon(_ref) {
       position: "relative",
       top: positionTop
     }
-  }, /*#__PURE__*/React.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", {
     fill: "none",
     fillRule: "evenodd",
     stroke: "none",
     strokeWidth: "1"
-  }, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", null, /*#__PURE__*/React__default["default"].createElement("g", {
     transform: "translate(8 8)"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
     d: "M0 0H24V24H0z"
-  }), /*#__PURE__*/React.createElement("path", {
+  }), /*#__PURE__*/React__default["default"].createElement("path", {
     fill: color,
     fillRule: "nonzero",
     d: "M12.71 4.364A6.54 6.54 0 000 6.545a6.54 6.54 0 0012.71 2.182h4.745v4.364h4.363V8.727H24V4.364H12.71zM6.544 8.727a2.181 2.181 0 110-4.362 2.181 2.181 0 010 4.362z",
@@ -3750,10 +3778,10 @@ var KeyIcon = function KeyIcon(_ref) {
   })))));
 };
 KeyIcon.propTypes = {
-  height: PropTypes.string,
-  width: PropTypes.string,
-  color: PropTypes.string,
-  positionTop: PropTypes.string
+  height: PropTypes__default["default"].string,
+  width: PropTypes__default["default"].string,
+  color: PropTypes__default["default"].string,
+  positionTop: PropTypes__default["default"].string
 };
 
 var LockIcon = function LockIcon(_ref) {
@@ -3762,7 +3790,7 @@ var LockIcon = function LockIcon(_ref) {
       _ref$color = _ref.color,
       color = _ref$color === void 0 ? "#D5D5D5" : _ref$color,
       positionTop = _ref.positionTop;
-  return /*#__PURE__*/React.createElement("svg", {
+  return /*#__PURE__*/React__default["default"].createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: width,
     height: height,
@@ -3771,28 +3799,28 @@ var LockIcon = function LockIcon(_ref) {
       position: "relative",
       top: positionTop
     }
-  }, /*#__PURE__*/React.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", {
     fill: "none",
     fillRule: "evenodd",
     stroke: "none",
     strokeWidth: "1"
-  }, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", null, /*#__PURE__*/React__default["default"].createElement("g", {
     transform: "translate(8 8)"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
     d: "M0 0H24V24H0z"
-  }), /*#__PURE__*/React.createElement("g", {
+  }), /*#__PURE__*/React__default["default"].createElement("g", {
     fill: color,
     fillRule: "nonzero",
     transform: "translate(3)"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
     d: "M15.692 9h-.747V6c0-3.31-2.681-6-5.978-6C5.67 0 2.989 2.69 2.989 6v3h-.747A2.249 2.249 0 000 11.25v10.5A2.249 2.249 0 002.242 24h13.45a2.249 2.249 0 002.242-2.25v-10.5A2.249 2.249 0 0015.692 9zM4.982 6c0-2.206 1.787-4 3.985-4s3.985 1.794 3.985 4v3h-7.97V6z"
   }))))));
 };
 LockIcon.propTypes = {
-  height: PropTypes.string,
-  width: PropTypes.string,
-  color: PropTypes.string,
-  positionTop: PropTypes.string
+  height: PropTypes__default["default"].string,
+  width: PropTypes__default["default"].string,
+  color: PropTypes__default["default"].string,
+  positionTop: PropTypes__default["default"].string
 };
 
 var StarIcon = function StarIcon(_ref) {
@@ -3802,7 +3830,7 @@ var StarIcon = function StarIcon(_ref) {
       color = _ref$color === void 0 ? "#D5D5D5" : _ref$color,
       _ref$positionTop = _ref.positionTop,
       positionTop = _ref$positionTop === void 0 ? "" : _ref$positionTop;
-  return /*#__PURE__*/React.createElement("svg", {
+  return /*#__PURE__*/React__default["default"].createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: width,
     height: height,
@@ -3811,21 +3839,21 @@ var StarIcon = function StarIcon(_ref) {
       position: "relative",
       top: positionTop
     }
-  }, /*#__PURE__*/React.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", {
     fill: "none",
     fillRule: "evenodd",
     stroke: "none",
     strokeWidth: "1"
-  }, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("path", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", null, /*#__PURE__*/React__default["default"].createElement("path", {
     fill: color,
     d: "M20 26L12.946577 29.7082039 14.2936609 21.854102 8.5873218 16.2917961 16.4732885 15.145898 20 8 23.5267115 15.145898 31.4126782 16.2917961 25.7063391 21.854102 27.053423 29.7082039z"
   }))));
 };
 StarIcon.propTypes = {
-  height: PropTypes.string,
-  width: PropTypes.string,
-  color: PropTypes.string,
-  positionTop: PropTypes.string
+  height: PropTypes__default["default"].string,
+  width: PropTypes__default["default"].string,
+  color: PropTypes__default["default"].string,
+  positionTop: PropTypes__default["default"].string
 };
 
 var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
@@ -3837,7 +3865,7 @@ var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
 
   switch (iconType) {
     case "crown":
-      return /*#__PURE__*/React.createElement(CrownIcon, {
+      return /*#__PURE__*/React__default["default"].createElement(CrownIcon, {
         width: width,
         height: height,
         color: color,
@@ -3845,7 +3873,7 @@ var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
       });
 
     case "lock":
-      return /*#__PURE__*/React.createElement(LockIcon, {
+      return /*#__PURE__*/React__default["default"].createElement(LockIcon, {
         width: width,
         height: height,
         color: color,
@@ -3853,7 +3881,7 @@ var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
       });
 
     case "key":
-      return /*#__PURE__*/React.createElement(KeyIcon, {
+      return /*#__PURE__*/React__default["default"].createElement(KeyIcon, {
         width: width,
         height: height,
         color: color,
@@ -3861,7 +3889,7 @@ var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
       });
 
     default:
-      return /*#__PURE__*/React.createElement(StarIcon, {
+      return /*#__PURE__*/React__default["default"].createElement(StarIcon, {
         width: width,
         height: height,
         color: color,
@@ -3870,11 +3898,11 @@ var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
   }
 };
 PremiumStoryIcon.propTypes = {
-  width: PropTypes.string,
-  height: PropTypes.string,
-  color: PropTypes.string,
-  iconType: PropTypes.string,
-  positionTop: PropTypes.string
+  width: PropTypes__default["default"].string,
+  height: PropTypes__default["default"].string,
+  color: PropTypes__default["default"].string,
+  iconType: PropTypes__default["default"].string,
+  positionTop: PropTypes__default["default"].string
 };
 
 var _styleModuleImportMap$x = {
@@ -3901,29 +3929,29 @@ var StoryHeadline = function StoryHeadline(_ref) {
   var premiumStory = enablePremiumStoryIcon && get_1(story, ["access"]) === "subscription";
   var wrapperClass = premiumStory ? "premium-wrapper" : "wrapper";
   var iconSize = "40px";
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "arrow-component arr--story-headline " + _getClassName(wrapperClass, _styleModuleImportMap$x)
-  }, premiumStory && /*#__PURE__*/React.createElement(PremiumStoryIcon, {
+  }, premiumStory && /*#__PURE__*/React__default["default"].createElement(PremiumStoryIcon, {
     width: iconSize,
     height: iconSize,
     color: iconColor,
     iconType: iconStyle,
     positionTop: "6px"
-  }), /*#__PURE__*/React.createElement("h1", {
+  }), /*#__PURE__*/React__default["default"].createElement("h1", {
     "data-testid": "story-headline",
     className: _getClassName("headline ".concat(textColor), _styleModuleImportMap$x)
-  }, /*#__PURE__*/React.createElement("bdi", {
+  }, /*#__PURE__*/React__default["default"].createElement("bdi", {
     dangerouslySetInnerHTML: {
       __html: story.headline
     }
   })));
 };
 StoryHeadline.propTypes = {
-  story: PropTypes.object.isRequired,
-  premiumStoryIconConfig: PropTypes.shape({
-    iconColor: PropTypes.string,
-    iconType: PropTypes.string,
-    enablePremiumStoryIcon: PropTypes.bool
+  story: PropTypes__default["default"].object.isRequired,
+  premiumStoryIconConfig: PropTypes__default["default"].shape({
+    iconColor: PropTypes__default["default"].string,
+    iconType: PropTypes__default["default"].string,
+    enablePremiumStoryIcon: PropTypes__default["default"].bool
   })
 };
 
@@ -3947,7 +3975,7 @@ var Subheadline = function Subheadline(_ref) {
   var subheadline = forceShowAtom || get_1(config, ["showSubheadline"], true);
   if (!subheadline) return null;
   var textColor = getTextColor(config.theme);
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     style: {
       WebkitLineClamp: lineClamp
     },
@@ -3957,15 +3985,15 @@ var Subheadline = function Subheadline(_ref) {
 };
 Subheadline.propTypes = {
   /** The Story Object from the API response */
-  story: PropTypes.object.isRequired,
+  story: PropTypes__default["default"].object.isRequired,
   //  Restricts the number of lines for subheadline.
-  lineClamp: PropTypes.number,
+  lineClamp: PropTypes__default["default"].number,
 
   /** Number of characters to truncate the subheadline */
-  truncateChars: PropTypes.number,
-  clazzName: PropTypes.string,
-  forceShowAtom: PropTypes.bool,
-  showFullContent: PropTypes.bool
+  truncateChars: PropTypes__default["default"].number,
+  clazzName: PropTypes__default["default"].string,
+  forceShowAtom: PropTypes__default["default"].bool,
+  showFullContent: PropTypes__default["default"].bool
 };
 Subheadline.defaultProps = {
   forceShowAtom: false,
@@ -4015,13 +4043,13 @@ var withElementWrapper = function withElementWrapper(StoryElement) {
 
     if (!element) return null;
     if (render && typeof render === "function") return render(props);
-    return /*#__PURE__*/React.createElement(StoryElement, _extends({}, restProps, {
+    return /*#__PURE__*/React__default["default"].createElement(StoryElement, _extends({}, restProps, {
       element: element
     }));
   };
 };
 withElementWrapper.propTypes = {
-  StoryElement: PropTypes.element
+  StoryElement: PropTypes__default["default"].element
 };
 
 var _excluded$d = ["element", "story", "config", "loadIframeOnClick"];
@@ -4034,21 +4062,21 @@ var Videobase = function Videobase(_ref) {
       loadIframeOnClick = _ref$loadIframeOnClic === void 0 ? false : _ref$loadIframeOnClic,
       restProps = _objectWithoutProperties(_ref, _excluded$d);
 
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     className: "video-m_container__MYuWI" + (" " + (restProps ? restProps.className || "" : ""))
   }, restProps, {
     "data-test-id": "video"
-  }), /*#__PURE__*/React.createElement(StoryElement$1, {
+  }), /*#__PURE__*/React__default["default"].createElement(components.StoryElement, {
     element: element,
     loadIframeOnClick: loadIframeOnClick
   }));
 };
 
 Videobase.propTypes = {
-  element: PropTypes.object,
+  element: PropTypes__default["default"].object,
   story: shapeStory,
   config: shapeConfig,
-  loadIframeOnClick: PropTypes.bool
+  loadIframeOnClick: PropTypes__default["default"].bool
 };
 var Video = withElementWrapper(Videobase);
 
@@ -4086,18 +4114,18 @@ var TimeStamp = function TimeStamp(_ref) {
   var time = story["last-published-at"] || story["first-published-at"];
   var isBottomClasses = isBottom ? "bottom-fix" : "";
   var textColor = getTextColor(configState.theme);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, isTime && /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isTime && /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "publish-time",
     className: "time arr--publish-time " + _getClassName("time  ".concat(textColor, " ").concat(isBottomClasses), _styleModuleImportMap$v)
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "timestamp-m_time-wrapper__3O2lM"
   }, getTimeStamp(time, formatter, config))));
 };
 TimeStamp.propTypes = {
   /** The Story Object from the API response */
-  story: PropTypes.object,
-  isBottom: PropTypes.bool,
-  config: PropTypes.object
+  story: PropTypes__default["default"].object,
+  isBottom: PropTypes__default["default"].bool,
+  config: PropTypes__default["default"].object
 };
 
 var _styleModuleImportMap$u = {
@@ -4140,10 +4168,10 @@ var AuthorBase = function AuthorBase(_ref) {
       return null;
     }
 
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       "data-test-id": "author-image",
       className: _getClassName("author-image ".concat(dir, "-image"), _styleModuleImportMap$u)
-    }, /*#__PURE__*/React.createElement("figure", null, avatarS3Key ? /*#__PURE__*/React.createElement(ResponsiveImage, {
+    }, /*#__PURE__*/React__default["default"].createElement("figure", null, avatarS3Key ? /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
       slug: avatarS3Key,
       "aspect-ratio": [1, 1],
       defaultWidth: 400,
@@ -4151,14 +4179,14 @@ var AuthorBase = function AuthorBase(_ref) {
         auto: ["format", "compress"]
       },
       alt: authorName
-    }) : /*#__PURE__*/React.createElement("img", {
+    }) : /*#__PURE__*/React__default["default"].createElement("img", {
       src: avatarUrl
     })));
   };
 
   var isPrefix = function isPrefix(dir) {
     if (prefix) {
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "arr-author-prefix " + _getClassName("prefix ".concat(textColor), _styleModuleImportMap$u)
       }, prefix);
     }
@@ -4166,11 +4194,11 @@ var AuthorBase = function AuthorBase(_ref) {
     return !hideAuthorImage && authorImage(dir);
   };
 
-  return /*#__PURE__*/React.createElement(React.Fragment, null, isAuthor && /*#__PURE__*/React.createElement(Link, {
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isAuthor && /*#__PURE__*/React__default["default"].createElement(components.Link, {
     href: "".concat(mountAt, "/author/") + slug,
     "aria-label": "author-name",
     className: "author-name arr-author-name arrow-component " + _getClassName("author ".concat(isBottomClasses), _styleModuleImportMap$u)
-  }, isPrefix("ltr"), /*#__PURE__*/React.createElement("div", {
+  }, isPrefix("ltr"), /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "author-name",
     className: "author-name " + _getClassName("author-name ".concat(textColor), _styleModuleImportMap$u)
   }, authorName || story["author-name"]), !prefix && isPrefix("rtl")));
@@ -4182,18 +4210,18 @@ function mapStateToProps$1(state) {
   };
 }
 
-var Author = connect(mapStateToProps$1)(AuthorBase);
+var Author = reactRedux.connect(mapStateToProps$1)(AuthorBase);
 AuthorBase.propTypes = {
   /** The Story Object from the API response */
-  story: PropTypes.object.isRequired,
+  story: PropTypes__default["default"].object.isRequired,
 
   /** Hide Author Avatar Image */
-  hideAuthorImage: PropTypes.bool,
+  hideAuthorImage: PropTypes__default["default"].bool,
   // fix Author bottom of the storyCard
-  isBottom: PropTypes.bool,
+  isBottom: PropTypes__default["default"].bool,
   // fix prefix before the author name
-  prefix: PropTypes.string,
-  config: PropTypes.object
+  prefix: PropTypes__default["default"].string,
+  config: PropTypes__default["default"].object
 };
 AuthorBase.defaultProps = {
   hideAuthorImage: false,
@@ -4214,14 +4242,14 @@ var Dot = function Dot(_ref) {
       height = _ref$height === void 0 ? "3px" : _ref$height,
       _ref$color = _ref.color,
       color = _ref$color === void 0 ? "light" : _ref$color;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: _getClassName(color, _styleModuleImportMap$t)
-  }, /*#__PURE__*/React.createElement("svg", {
+  }, /*#__PURE__*/React__default["default"].createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: width,
     height: height,
     viewBox: "0 0 3 3"
-  }, /*#__PURE__*/React.createElement("circle", {
+  }, /*#__PURE__*/React__default["default"].createElement("circle", {
     cx: "87",
     cy: "9",
     r: "1",
@@ -4232,9 +4260,9 @@ var Dot = function Dot(_ref) {
 };
 Dot.propTypes = {
   /** height , width and color of the dot icon */
-  color: PropTypes.string,
-  width: PropTypes.string,
-  height: PropTypes.string
+  color: PropTypes__default["default"].string,
+  width: PropTypes__default["default"].string,
+  height: PropTypes__default["default"].string
 };
 
 var _styleModuleImportMap$s = {
@@ -4250,22 +4278,22 @@ var Divider = function Divider(_ref) {
       height = _ref$height === void 0 ? "10" : _ref$height,
       _ref$color = _ref.color,
       color = _ref$color === void 0 ? "light" : _ref$color;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: _getClassName(color, _styleModuleImportMap$s)
-  }, /*#__PURE__*/React.createElement("svg", {
+  }, /*#__PURE__*/React__default["default"].createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: width,
     height: height
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
     fill: "inherit",
     d: "M0 0h1v10H0z"
   })));
 };
 Divider.propTypes = {
   /** height , width and color of the dot icon */
-  color: PropTypes.string,
-  width: PropTypes.string,
-  height: PropTypes.string
+  color: PropTypes__default["default"].string,
+  width: PropTypes__default["default"].string,
+  height: PropTypes__default["default"].string
 };
 
 var _styleModuleImportMap$r = {
@@ -4288,23 +4316,23 @@ var ReadTime = function ReadTime(_ref) {
   var textColor = isLightTheme ? "light" : getTextColor(config.theme);
   if (!showReadTime || !readTime) return null;
   var timeToRead = get_1(opts, ["localizedTimeToRead"]) || "min read";
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "read-time",
     className: "arrow-component arr--read-time " + _getClassName("read-time-wrapper ".concat(textColor), _styleModuleImportMap$r)
-  }, /*#__PURE__*/React.createElement("span", {
+  }, /*#__PURE__*/React__default["default"].createElement("span", {
     className: "read-time-indicator read-time-m_dot-indicator__3Sqh2"
-  }, /*#__PURE__*/React.createElement(Dot, {
+  }, /*#__PURE__*/React__default["default"].createElement(Dot, {
     color: textColor
-  })), /*#__PURE__*/React.createElement("span", null, readTime, " ", timeToRead)));
+  })), /*#__PURE__*/React__default["default"].createElement("span", null, readTime, " ", timeToRead)));
 };
 ReadTime.propTypes = {
-  story: PropTypes.shape({
-    "read-time": PropTypes.number
+  story: PropTypes__default["default"].shape({
+    "read-time": PropTypes__default["default"].number
   }),
-  opts: PropTypes.shape({
-    showReadTime: PropTypes.bool
+  opts: PropTypes__default["default"].shape({
+    showReadTime: PropTypes__default["default"].bool
   }),
-  isLightTheme: PropTypes.bool
+  isLightTheme: PropTypes__default["default"].bool
 };
 
 var _styleModuleImportMap$q = {
@@ -4335,33 +4363,33 @@ var AuthorWithTime = function AuthorWithTime(_ref) {
 
   var getSeparator = function getSeparator() {
     if (separator === "divider") {
-      return /*#__PURE__*/React.createElement(Divider, {
+      return /*#__PURE__*/React__default["default"].createElement(Divider, {
         color: textColor
       });
     }
 
-    return /*#__PURE__*/React.createElement(Dot, {
+    return /*#__PURE__*/React__default["default"].createElement(Dot, {
       color: textColor
     });
   };
 
   var getTimeStamp = function getTimeStamp() {
     if (!isTime) return null;
-    return /*#__PURE__*/React.createElement(React.Fragment, null, isAuthor && /*#__PURE__*/React.createElement("span", {
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isAuthor && /*#__PURE__*/React__default["default"].createElement("span", {
       className: "arr-separator " + _getClassName("".concat(seperatorStyle), _styleModuleImportMap$q)
-    }, getSeparator()), /*#__PURE__*/React.createElement(TimeStamp, {
+    }, getSeparator()), /*#__PURE__*/React__default["default"].createElement(TimeStamp, {
       story: story,
       config: config
-    }), isReadTime && /*#__PURE__*/React.createElement(ReadTime, {
+    }), isReadTime && /*#__PURE__*/React__default["default"].createElement(ReadTime, {
       story: story,
       opts: config,
       isLightTheme: isLightTheme
     }));
   };
 
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "arr--author-time " + _getClassName("author-time-wrapper ".concat(isBottomClasses), _styleModuleImportMap$q)
-  }, isAuthor ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Author, {
+  }, isAuthor ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Author, {
     story: story,
     isBottom: true,
     hideAuthorImage: hideAuthorImage,
@@ -4369,19 +4397,19 @@ var AuthorWithTime = function AuthorWithTime(_ref) {
   }), getTimeStamp()) : getTimeStamp());
 };
 AuthorWithTime.propTypes = {
-  story: PropTypes.object,
+  story: PropTypes__default["default"].object,
 
   /** Style of separator between the Author & Timestamp */
-  separator: PropTypes.oneOf(["dot", "divider"]),
+  separator: PropTypes__default["default"].oneOf(["dot", "divider"]),
 
   /** hide the author image */
-  hideAuthorImage: PropTypes.bool,
+  hideAuthorImage: PropTypes__default["default"].bool,
   // fix author and time at the end
-  isBottom: PropTypes.bool,
+  isBottom: PropTypes__default["default"].bool,
   // fix prefix before the author name
-  prefix: PropTypes.string,
-  config: PropTypes.object,
-  isLightTheme: PropTypes.bool
+  prefix: PropTypes__default["default"].string,
+  config: PropTypes__default["default"].object,
+  isLightTheme: PropTypes__default["default"].bool
 };
 AuthorWithTime.defaultProps = {
   separator: "dot",
@@ -4427,7 +4455,7 @@ var CollectionNameBase = function CollectionNameBase(_ref) {
   var borderBottomFullStyle = templateStyle.includes("collection-borderBottomFull") ? "4px solid ".concat(CollectionNameBorderColor) : "";
 
   var borderBottomStyle = function borderBottomStyle() {
-    return templateStyle.includes("collection-borderBottom") && !templateStyle.includes("collection-borderBottomFull") ? /*#__PURE__*/React.createElement("div", {
+    return templateStyle.includes("collection-borderBottom") && !templateStyle.includes("collection-borderBottomFull") ? /*#__PURE__*/React__default["default"].createElement("div", {
       className: "collection-name-m_border-bottom__1MnlV",
       style: {
         borderBottom: "4px solid ".concat(CollectionNameBorderColor)
@@ -4487,40 +4515,40 @@ var CollectionNameBase = function CollectionNameBase(_ref) {
     }
   };
 
-  return /*#__PURE__*/React.createElement(React.Fragment, null, showRowTitle && collectionName && /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, showRowTitle && collectionName && /*#__PURE__*/React__default["default"].createElement("div", {
     style: {
       borderBottom: borderBottomFullStyle
     },
     "data-test-id": "collection-name",
     className: ("arr--collection-name arrow-component ".concat(templateStyle) ? "arr--collection-name arrow-component ".concat(templateStyle) + " " : "") + _getClassName("collection ".concat(textColor, " ").concat(templateStyle), _styleModuleImportMap$p)
-  }, templateStyle.includes("collection-borderLeft") && /*#__PURE__*/React.createElement("span", {
+  }, templateStyle.includes("collection-borderLeft") && /*#__PURE__*/React__default["default"].createElement("span", {
     className: "arr-collection-name-border-left collection-name-m_border-left__3_pYw",
     style: {
       color: CollectionNameBorderColor,
       fontSize: getBorderHeight()
     }
-  }), slug && !slug.includes(undefined) ? /*#__PURE__*/React.createElement(Link, {
+  }), slug && !slug.includes(undefined) ? /*#__PURE__*/React__default["default"].createElement(components.Link, {
     href: slug,
     "aria-label": "collection-name"
-  }, /*#__PURE__*/React.createElement(HeaderTag, null, collectionName)) : /*#__PURE__*/React.createElement(HeaderTag, null, collectionName), borderBottomStyle()));
+  }, /*#__PURE__*/React__default["default"].createElement(HeaderTag, null, collectionName)) : /*#__PURE__*/React__default["default"].createElement(HeaderTag, null, collectionName), borderBottomStyle()));
 };
 CollectionNameBase.propTypes = {
   /** Collection name border color */
-  collectionNameBorderColor: PropTypes$1.string,
+  collectionNameBorderColor: PropTypes.PropTypes.string,
 
   /** The Collection Object from the API response */
-  collection: PropTypes$1.object,
+  collection: PropTypes.PropTypes.object,
 
   /** The publisher config from the API response */
-  config: PropTypes$1.object,
+  config: PropTypes.PropTypes.object,
 
   /** The style template for the component  */
-  collectionNameTemplate: PropTypes$1.oneOf(["", "borderLeft", "borderBottom", "crossLine", "borderBottomFull"]),
+  collectionNameTemplate: PropTypes.PropTypes.oneOf(["", "borderLeft", "borderBottom", "crossLine", "borderBottomFull"]),
 
   /** Header tags ranging h1-h6, where h[headerLevel] */
-  headerLevel: PropTypes$1.string,
-  customCollectionName: PropTypes$1.string,
-  navigate: PropTypes$1.bool
+  headerLevel: PropTypes.PropTypes.string,
+  customCollectionName: PropTypes.PropTypes.string,
+  navigate: PropTypes.PropTypes.bool
 };
 CollectionNameBase.defaultProps = {
   collectionNameTemplate: "",
@@ -4533,16 +4561,16 @@ function mapStateToProps(state) {
   };
 }
 
-var CollectionName = connect(mapStateToProps)(CollectionNameBase);
+var CollectionName = reactRedux.connect(mapStateToProps)(CollectionNameBase);
 
 function LiveIcon() {
-  return /*#__PURE__*/React.createElement("svg", {
+  return /*#__PURE__*/React__default["default"].createElement("svg", {
     className: "live-icon",
     xmlns: "http://www.w3.org/2000/svg",
     width: "25",
     height: "24",
     viewBox: "0 0 25 24"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
     fill: "#ff5858",
     d: "M12 18a6 6 0 110-12 6 6 0 010 12zm0 2.5a8.5 8.5 0 110-17 8.5 8.5 0 010 17zm0-1a7.5 7.5 0 100-15 7.5 7.5 0 000 15z"
   }));
@@ -4599,37 +4627,37 @@ var Headline = function Headline(_ref) {
   var wrapperClass = premiumStory ? "wrapper" : "";
   var iconSize = "24px";
   var enableLiveIcon = showLiveIcon && story["story-template"] === "live-blog" && !get_1(story, ["metadata", "is-closed"], false);
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "headline",
     className: "arrow-component arr--headline " + _getClassName(wrapperClass, _styleModuleImportMap$o)
-  }, premiumStory && /*#__PURE__*/React.createElement(PremiumStoryIcon, {
+  }, premiumStory && /*#__PURE__*/React__default["default"].createElement(PremiumStoryIcon, {
     width: iconSize,
     height: iconSize,
     color: iconColor,
     iconType: iconStyle,
     positionTop: positionHeadline()
-  }), isLink ? /*#__PURE__*/React.createElement(Link, {
+  }), isLink ? /*#__PURE__*/React__default["default"].createElement(components.Link, {
     href: getStoryUrl(story, "/".concat(story.slug)),
     externalLink: isExternalStory(story),
     "aria-label": "headline"
-  }, /*#__PURE__*/React.createElement(HeaderTag, {
+  }, /*#__PURE__*/React__default["default"].createElement(HeaderTag, {
     className: _getClassName("headline ".concat(textColor), _styleModuleImportMap$o)
-  }, enableLiveIcon && /*#__PURE__*/React.createElement(LiveIcon, null), headline)) : /*#__PURE__*/React.createElement(HeaderTag, {
+  }, enableLiveIcon && /*#__PURE__*/React__default["default"].createElement(LiveIcon, null), headline)) : /*#__PURE__*/React__default["default"].createElement(HeaderTag, {
     className: _getClassName("headline ".concat(textColor), _styleModuleImportMap$o)
-  }, enableLiveIcon && /*#__PURE__*/React.createElement(LiveIcon, null), headline));
+  }, enableLiveIcon && /*#__PURE__*/React__default["default"].createElement(LiveIcon, null), headline));
 };
 Headline.propTypes = {
   /** The Story Object from the API response */
-  story: PropTypes.object.isRequired,
+  story: PropTypes__default["default"].object.isRequired,
 
   /** Header tags ranging h1-h6, where h[headerLevel] */
-  headerLevel: PropTypes.string,
-  premiumStoryIconConfig: PropTypes.shape({
-    iconColor: PropTypes.string,
-    iconType: PropTypes.string,
-    enablePremiumStoryIcon: PropTypes.bool
+  headerLevel: PropTypes__default["default"].string,
+  premiumStoryIconConfig: PropTypes__default["default"].shape({
+    iconColor: PropTypes__default["default"].string,
+    iconType: PropTypes__default["default"].string,
+    enablePremiumStoryIcon: PropTypes__default["default"].bool
   }),
-  isLink: PropTypes.bool
+  isLink: PropTypes__default["default"].bool
 };
 Headline.defaultProps = {
   headerLevel: "6",
@@ -4643,27 +4671,27 @@ var ImageFallbackIcon = function ImageFallbackIcon(_ref) {
       height = _ref$height === void 0 ? 30 : _ref$height,
       _ref$iconColor = _ref.iconColor,
       iconColor = _ref$iconColor === void 0 ? "#99B0CB" : _ref$iconColor;
-  return /*#__PURE__*/React.createElement("svg", {
+  return /*#__PURE__*/React__default["default"].createElement("svg", {
     width: width,
     height: height,
     viewBox: "0 0 102 76",
     version: "1.1"
-  }, /*#__PURE__*/React.createElement("g", {
+  }, /*#__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.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", {
     id: "Group-13",
     transform: "translate(377.000000, 314.000000)"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__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.createElement("rect", {
+  }), /*#__PURE__*/React__default["default"].createElement("rect", {
     id: "Rectangle-19",
     stroke: iconColor,
     strokeWidth: "3",
@@ -4675,24 +4703,24 @@ var ImageFallbackIcon = function ImageFallbackIcon(_ref) {
   }))));
 };
 ImageFallbackIcon.propTypes = {
-  width: PropTypes.object,
-  height: PropTypes.object,
-  iconColor: PropTypes.object
+  width: PropTypes__default["default"].object,
+  height: PropTypes__default["default"].object,
+  iconColor: PropTypes__default["default"].object
 };
 
 var imageFallback = function imageFallback() {
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "arr--fallback-image fallback-m_image__1GYCJ fallback-m_image-position__3KddP"
-  }, /*#__PURE__*/React.createElement("figure", {
+  }, /*#__PURE__*/React__default["default"].createElement("figure", {
     className: "arr--fallback-svg fallback-m_fallback-svg__tK9fL"
-  }, /*#__PURE__*/React.createElement(ImageFallbackIcon, null)));
+  }, /*#__PURE__*/React__default["default"].createElement(ImageFallbackIcon, null)));
 };
 
 var FallbackImage = function FallbackImage(_ref) {
   var slug = _ref.slug;
 
   if (slug) {
-    return /*#__PURE__*/React.createElement(Link, {
+    return /*#__PURE__*/React__default["default"].createElement(components.Link, {
       href: slug,
       "aria-label": "image-fallback"
     }, imageFallback());
@@ -4701,23 +4729,23 @@ var FallbackImage = function FallbackImage(_ref) {
   }
 };
 FallbackImage.propTypes = {
-  slug: PropTypes.string
+  slug: PropTypes__default["default"].string
 };
 
 var HyperLinkIcon = function HyperLinkIcon() {
-  return /*#__PURE__*/React.createElement("svg", {
+  return /*#__PURE__*/React__default["default"].createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "36",
     height: "28"
-  }, /*#__PURE__*/React.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", {
     fill: "none",
     fillRule: "evenodd"
-  }, /*#__PURE__*/React.createElement("rect", {
+  }, /*#__PURE__*/React__default["default"].createElement("rect", {
     width: "36",
     height: "28",
     fill: "#3D6FCF",
     rx: "4"
-  }), /*#__PURE__*/React.createElement("path", {
+  }), /*#__PURE__*/React__default["default"].createElement("path", {
     stroke: "#FFF",
     strokeLinecap: "round",
     strokeLinejoin: "round",
@@ -4730,16 +4758,16 @@ var HyperLink = function HyperLink(_ref) {
   var _ref$hyperLink = _ref.hyperLink,
       hyperLink = _ref$hyperLink === void 0 ? "" : _ref$hyperLink;
   if (!hyperLink) return null;
-  return /*#__PURE__*/React.createElement(Link, {
+  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.createElement(HyperLinkIcon, null));
+  }, /*#__PURE__*/React__default["default"].createElement(HyperLinkIcon, null));
 };
 HyperLink.propTypes = {
-  hyperLink: PropTypes.string
+  hyperLink: PropTypes__default["default"].string
 };
 
 var _styleModuleImportMap$n = {
@@ -4775,7 +4803,7 @@ var HeroImage = function HeroImage(_ref) {
       StoryTemplateIcon = _config$StoryTemplate === void 0 ? function () {
     return null;
   } : _config$StoryTemplate;
-  var showImagePlaceholder = useSelector(function (state) {
+  var showImagePlaceholder = reactRedux.useSelector(function (state) {
     return get_1(state, ["qt", "config", "showPlaceholder"]);
   });
   var getPlaceholderStyleName = showImagePlaceholder ? "placeholder" : "";
@@ -4811,37 +4839,37 @@ var HeroImage = function HeroImage(_ref) {
   var fallbackImage = function fallbackImage() {
     if (!slug) {
       if (fallbackImageUrl && !isStoryPageImage) {
-        return /*#__PURE__*/React.createElement("figure", {
+        return /*#__PURE__*/React__default["default"].createElement("figure", {
           style: {
             paddingTop: imagePadding + "%"
           },
           className: "arr--responsive-hero-image " + _getClassName("image ".concat(getPlaceholderStyleName), _styleModuleImportMap$n)
-        }, /*#__PURE__*/React.createElement("img", {
+        }, /*#__PURE__*/React__default["default"].createElement("img", {
           className: "qt-image",
           "data-src": "".concat(fallbackImageUrl),
           alt: "image-fallback"
         }));
       }
 
-      return /*#__PURE__*/React.createElement(React.Fragment, null, defaultFallback ? /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, defaultFallback ? /*#__PURE__*/React__default["default"].createElement("div", {
         "data-test-id": "arr--fallback-hero-image",
         style: {
           paddingTop: imagePadding + "%"
         },
         className: "arr--fallback-hero-image " + _getClassName("image ".concat(getPlaceholderStyleName), _styleModuleImportMap$n)
-      }, /*#__PURE__*/React.createElement(StoryTemplateIcon, {
+      }, /*#__PURE__*/React__default["default"].createElement(StoryTemplateIcon, {
         storyTemplate: story["story-template"]
-      }), /*#__PURE__*/React.createElement(FallbackImage, null)) : null);
+      }), /*#__PURE__*/React__default["default"].createElement(FallbackImage, null)) : null);
     }
 
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("figure", {
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("figure", {
       style: {
         paddingTop: imagePadding + "%"
       },
       className: "arr--responsive-hero-image " + _getClassName("image ".concat(getPlaceholderStyleName), _styleModuleImportMap$n)
-    }, /*#__PURE__*/React.createElement(StoryTemplateIcon, {
+    }, /*#__PURE__*/React__default["default"].createElement(StoryTemplateIcon, {
       storyTemplate: story["story-template"]
-    }), /*#__PURE__*/React.createElement(ResponsiveHeroImage, {
+    }), /*#__PURE__*/React__default["default"].createElement(components.ResponsiveHeroImage, {
       story: story,
       aspectRatio: imageAspectRatio,
       defaultWidth: defaultWidth,
@@ -4850,15 +4878,15 @@ var HeroImage = function HeroImage(_ref) {
         auto: ["format", "compress"],
         fit: "max"
       }
-    })), isStoryPageImage && hyperLink && /*#__PURE__*/React.createElement(HyperLink, {
+    })), isStoryPageImage && hyperLink && /*#__PURE__*/React__default["default"].createElement(HyperLink, {
       hyperLink: hyperLink
     }));
   };
 
-  return story && (isStoryPageImage ? /*#__PURE__*/React.createElement("div", {
+  return story && (isStoryPageImage ? /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "arr--hero-image",
     className: "arr--hero-image " + _getClassName("".concat(heroImageClass, " ").concat(fullBleed, " ").concat(heroImageMobClasses), _styleModuleImportMap$n)
-  }, fallbackImage()) : /*#__PURE__*/React.createElement(Link, {
+  }, fallbackImage()) : /*#__PURE__*/React__default["default"].createElement(components.Link, {
     "data-test-id": "arr--hero-image",
     href: getStoryUrl(story, "/".concat(story.slug)),
     externalLink: isExternalStory(story),
@@ -4868,30 +4896,30 @@ var HeroImage = function HeroImage(_ref) {
 };
 HeroImage.propTypes = {
   /** The Story Object from the API response */
-  story: PropTypes.object.isRequired,
+  story: PropTypes__default["default"].object.isRequired,
 
   /** Removes the Hero Image padding for the image to bleed over the margin */
-  FullBleed: PropTypes.bool,
+  FullBleed: PropTypes__default["default"].bool,
 
   /** The default width for the image, in case the browser does not support srcset */
-  defaultWidth: PropTypes.number,
+  defaultWidth: PropTypes__default["default"].number,
 
   /** The list of available widths */
-  widths: PropTypes.array,
+  widths: PropTypes__default["default"].array,
   // fatch the correct hero image
-  aspectRatio: PropTypes.array,
+  aspectRatio: PropTypes__default["default"].array,
   //  Hints for the browser to choose the best size
 
   /** This prop is responsible for adding padding-right of the image and remove padding bottom of the image  */
-  isHorizontal: PropTypes.bool,
+  isHorizontal: PropTypes__default["default"].bool,
 
   /** This prop is responsible for adding padding-bottom in desktop and padding-right in mobile */
-  isHorizontalMobile: PropTypes.bool,
+  isHorizontalMobile: PropTypes__default["default"].bool,
   // this prop is responsive for rendering fallback image on story page
-  defaultFallback: PropTypes.bool,
-  isHorizontalWithImageLast: PropTypes.bool,
-  isStoryPageImage: PropTypes.bool,
-  config: PropTypes.object
+  defaultFallback: PropTypes__default["default"].bool,
+  isHorizontalWithImageLast: PropTypes__default["default"].bool,
+  isStoryPageImage: PropTypes__default["default"].bool,
+  config: PropTypes__default["default"].object
 };
 HeroImage.defaultProps = {
   FullBleed: true,
@@ -4948,7 +4976,7 @@ var StoryCard = function StoryCard(_ref) {
       prefix = _ref.prefix,
       config = _ref.config,
       isHorizontalWithImageLast = _ref.isHorizontalWithImageLast;
-  if (!story || isEmpty(story)) return /*#__PURE__*/React.createElement("div", null);
+  if (!story || isEmpty(story)) return /*#__PURE__*/React__default["default"].createElement("div", null);
   var borderOptions = ["default", "full", "bottom", "boxShadow"];
   var borderTemplate = borderOptions.includes(border) ? "border-".concat(border) : ""; // TODO optimize conditions
 
@@ -4958,7 +4986,7 @@ var StoryCard = function StoryCard(_ref) {
   var bgImgContentOverlapClass = bgImgContentOverlap ? "content-overlap" : "";
   var textColor = getTextColor(theme);
   var horizontalMobileClasses = isHorizontalMobile ? "horizontal-mob" : "";
-  var defaultStorycard = /*#__PURE__*/React.createElement(DefaultStoryCard, {
+  var defaultStorycard = /*#__PURE__*/React__default["default"].createElement(DefaultStoryCard, {
     story: story,
     aspectRatio: aspectRatio,
     border: border,
@@ -4972,7 +5000,7 @@ var StoryCard = function StoryCard(_ref) {
     config: config,
     isHorizontalWithImageLast: isHorizontalWithImageLast
   });
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "story-card",
     style: {
       backgroundColor: theme,
@@ -5001,91 +5029,91 @@ var DefaultStoryCard = function DefaultStoryCard(_ref2) {
   var SectionTagborderColor = rgbToHex(borderColor);
   var _config$localizationC = config.localizationConfig,
       localizationConfig = _config$localizationC === void 0 ? {} : _config$localizationC;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, isHorizontal ? /*#__PURE__*/React.createElement(HeroImage, {
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isHorizontal ? /*#__PURE__*/React__default["default"].createElement(HeroImage, {
     config: config,
     story: story,
     isHorizontal: true,
     isHorizontalMobile: isHorizontalMobile,
     aspectRatio: aspectRatio
-  }) : isHorizontalWithImageLast ? /*#__PURE__*/React.createElement(HeroImage, {
+  }) : isHorizontalWithImageLast ? /*#__PURE__*/React__default["default"].createElement(HeroImage, {
     config: config,
     story: story,
     isHorizontalWithImageLast: true,
     isHorizontalMobile: isHorizontalMobile,
     aspectRatio: aspectRatio
-  }) : /*#__PURE__*/React.createElement(HeroImage, {
+  }) : /*#__PURE__*/React__default["default"].createElement(HeroImage, {
     story: story,
     config: config,
     isHorizontalMobile: isHorizontalMobile,
     aspectRatio: aspectRatio
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "arr--story-content " + _getClassName("content ".concat(alignment), _styleModuleImportMap$m)
-  }, /*#__PURE__*/React.createElement(SectionTag, {
+  }, /*#__PURE__*/React__default["default"].createElement(SectionTag, {
     story: story,
     borderColor: SectionTagborderColor
-  }), /*#__PURE__*/React.createElement(Headline, {
+  }), /*#__PURE__*/React__default["default"].createElement(Headline, {
     story: story,
     headerLevel: headerLevel,
     premiumStoryIconConfig: config
-  }), /*#__PURE__*/React.createElement(AuthorWithTime, {
+  }), /*#__PURE__*/React__default["default"].createElement(AuthorWithTime, {
     config: localizationConfig,
     story: story,
     isBottom: true,
     prefix: prefix,
     hideAuthorImage: hideAuthorImage
-  }), /*#__PURE__*/React.createElement(Subheadline, {
+  }), /*#__PURE__*/React__default["default"].createElement(Subheadline, {
     story: story
   })));
 };
 
 DefaultStoryCard.propTypes = {
-  story: PropTypes.object.isRequired,
-  border: PropTypes.oneOfType([PropTypes.string]),
-  isBottom: PropTypes.bool,
-  isHorizontal: PropTypes.bool,
-  aspectRatio: PropTypes.oneOfType([PropTypes.array]),
-  isHorizontalMobile: PropTypes.bool,
-  centerAlign: PropTypes.bool,
-  headerLevel: PropTypes.string,
-  borderColor: PropTypes.string,
-  hideAuthorImage: PropTypes.bool,
-  prefix: PropTypes.string,
-  config: PropTypes.object,
-  isHorizontalWithImageLast: PropTypes.bool
+  story: PropTypes__default["default"].object.isRequired,
+  border: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string]),
+  isBottom: PropTypes__default["default"].bool,
+  isHorizontal: PropTypes__default["default"].bool,
+  aspectRatio: PropTypes__default["default"].oneOfType([PropTypes__default["default"].array]),
+  isHorizontalMobile: PropTypes__default["default"].bool,
+  centerAlign: PropTypes__default["default"].bool,
+  headerLevel: PropTypes__default["default"].string,
+  borderColor: PropTypes__default["default"].string,
+  hideAuthorImage: PropTypes__default["default"].bool,
+  prefix: PropTypes__default["default"].string,
+  config: PropTypes__default["default"].object,
+  isHorizontalWithImageLast: PropTypes__default["default"].bool
 };
 StoryCard.propTypes = {
   /** The Story Object from the API response */
-  story: PropTypes.object.isRequired,
-  children: PropTypes.node,
+  story: PropTypes__default["default"].object.isRequired,
+  children: PropTypes__default["default"].node,
 
   /** Flip the Story Card to Horizonal mode */
-  isHorizontal: PropTypes.bool,
+  isHorizontal: PropTypes__default["default"].bool,
 
   /** Add border to the Story Card  */
-  border: PropTypes.oneOfType([PropTypes.string]),
+  border: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string]),
   // story card with background image
-  useImageAsBackground: PropTypes.bool,
+  useImageAsBackground: PropTypes__default["default"].bool,
   // story card  content overlap with image
-  bgImgContentOverlap: PropTypes.bool,
+  bgImgContentOverlap: PropTypes__default["default"].bool,
 
   /** add aspect ratio for hero image  */
-  aspectRatio: PropTypes.oneOfType([PropTypes.array]),
+  aspectRatio: PropTypes__default["default"].oneOfType([PropTypes__default["default"].array]),
 
   /** add theme(dark /light/custom color) for storycard  */
-  theme: PropTypes.string,
+  theme: PropTypes__default["default"].string,
 
   /** flip the story card mobile design horizontal */
-  isHorizontalMobile: PropTypes.bool,
+  isHorizontalMobile: PropTypes__default["default"].bool,
   // make content center align in desktop and left align in mobile
-  centerAlign: PropTypes.bool,
-  headerLevel: PropTypes.string,
-  borderColor: PropTypes.string,
+  centerAlign: PropTypes__default["default"].bool,
+  headerLevel: PropTypes__default["default"].string,
+  borderColor: PropTypes__default["default"].string,
   // handle author image through storycard
-  hideAuthorImage: PropTypes.bool,
+  hideAuthorImage: PropTypes__default["default"].bool,
   // handle author prefix through storycard
-  prefix: PropTypes.string,
-  config: PropTypes.object,
-  isHorizontalWithImageLast: PropTypes.bool
+  prefix: PropTypes__default["default"].string,
+  config: PropTypes__default["default"].object,
+  isHorizontalWithImageLast: PropTypes__default["default"].bool
 };
 StoryCard.defaultProps = {
   isHorizontal: false,
@@ -5100,19 +5128,19 @@ StoryCard.defaultProps = {
 var ClockIcon = function ClockIcon(_ref) {
   var _ref$color = _ref.color,
       color = _ref$color === void 0 ? "#333" : _ref$color;
-  return /*#__PURE__*/React.createElement("svg", {
+  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.createElement("path", {
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
     fill: color,
     fillRule: "evenodd",
     d: "M12 19.75a7.513 7.513 0 003.875-1.047 7.832 7.832 0 002.828-2.828A7.513 7.513 0 0019.75 12a7.513 7.513 0 00-1.047-3.875c-.698-1.187-1.64-2.13-2.828-2.828S13.395 4.25 12 4.25a7.51 7.51 0 00-3.875 1.047c-1.188.698-2.13 1.64-2.828 2.828S4.25 10.605 4.25 12a7.51 7.51 0 001.047 3.875 7.824 7.824 0 002.828 2.828A7.513 7.513 0 0012 19.75zm.016-1a6.64 6.64 0 01-3.391-.906 6.716 6.716 0 01-2.469-2.453 6.563 6.563 0 01-.906-3.375c0-1.22.302-2.35.906-3.391A6.711 6.711 0 018.61 6.156a6.563 6.563 0 013.375-.906c1.22 0 2.35.302 3.391.906a6.716 6.716 0 012.469 2.453A6.592 6.592 0 0118.751 12a6.616 6.616 0 01-.906 3.375 6.716 6.716 0 01-2.453 2.469 6.563 6.563 0 01-3.375.906zm2.283-3.92l.076-.002a.343.343 0 00.25-.14l.25-.375a.365.365 0 00.078-.266.328.328 0 00-.14-.234l-2.22-1.625V7.625a.362.362 0 00-.109-.266.36.36 0 00-.265-.109h-.438a.357.357 0 00-.265.11.358.358 0 00-.11.265v5c0 .125.052.219.156.281l2.532 1.844a.383.383 0 00.281.078l-.076.001z"
   }));
 };
 ClockIcon.propTypes = {
-  color: PropTypes.string
+  color: PropTypes__default["default"].string
 };
 
 var _styleModuleImportMap$l = {
@@ -5147,26 +5175,26 @@ var LoadmoreButton = function LoadmoreButton(_ref) {
   if (!showButton) return null;
   var textColor = getTextColor(theme);
   var slug = customUrlPath ? "/".concat(customUrlPath) : generateNavigateSlug(collection, _objectSpread$3(_objectSpread$3({}, qtConfig), config));
-  return template === "SubsequentLoadCount" ? /*#__PURE__*/React.createElement("div", {
+  return template === "SubsequentLoadCount" ? /*#__PURE__*/React__default["default"].createElement("div", {
     onClick: onClick,
     "data-test-id": "load-more",
     className: "arr--button " + _getClassName("button ".concat(textColor, " default"), _styleModuleImportMap$l)
-  }, buttonText) : /*#__PURE__*/React.createElement(LinkBase, {
+  }, buttonText) : /*#__PURE__*/React__default["default"].createElement(components.LinkBase, {
     href: slug,
     navigateTo: navigate,
     "data-test-id": "load-more",
     "aria-label": "load-more"
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "arr--button " + _getClassName("button ".concat(textColor, " default"), _styleModuleImportMap$l)
   }, buttonText));
 };
 LoadmoreButton.propTypes = {
-  collection: PropTypes.object,
-  template: PropTypes.string,
-  config: PropTypes.object,
-  onClick: PropTypes.func,
-  navigate: PropTypes.func,
-  qtConfig: PropTypes.object
+  collection: PropTypes__default["default"].object,
+  template: PropTypes__default["default"].string,
+  config: PropTypes__default["default"].object,
+  onClick: PropTypes__default["default"].func,
+  navigate: PropTypes__default["default"].func,
+  qtConfig: PropTypes__default["default"].object
 };
 
 var _styleModuleImportMap$k = {
@@ -5204,23 +5232,23 @@ var KeyEventCards = function KeyEventCards(props) {
   var updateColor = textColor === "dark" ? dark : light;
   var lastElement = index === cardLength - 1;
   var borderLeft = lastElement ? "borderNone" : "";
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
     className: _getClassName("time-wrapper ".concat(textColor), _styleModuleImportMap$k)
-  }, /*#__PURE__*/React.createElement(ClockIcon, {
+  }, /*#__PURE__*/React__default["default"].createElement(ClockIcon, {
     color: updateColor
   }), getTimeStamp(cardAddedAt, timestampToFormat, {
     showTime: true,
     isTimeFirst: true
-  })), /*#__PURE__*/React.createElement("a", {
+  })), /*#__PURE__*/React__default["default"].createElement("a", {
     href: "".concat(mountAt, "/").concat(slug, "#").concat(id),
     "aria-label": "event-title"
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: _getClassName("event-title ".concat(textColor, " ").concat(borderLeft), _styleModuleImportMap$k)
   }, storyElements.map(function (element, index) {
-    return element.type === "title" && /*#__PURE__*/React.createElement("h3", {
+    return element.type === "title" && /*#__PURE__*/React__default["default"].createElement("h3", {
       key: index
     }, element.text);
-  }), showLoadMore && lastElement && loadCards && /*#__PURE__*/React.createElement("div", {
+  }), showLoadMore && lastElement && loadCards && /*#__PURE__*/React__default["default"].createElement("div", {
     className: "key-events-m_fade-out__11jv_",
     style: {
       backgroundImage: "linear-gradient(to bottom, transparent, ".concat(theme, ")")
@@ -5229,19 +5257,19 @@ var KeyEventCards = function KeyEventCards(props) {
 };
 
 KeyEventCards.propTypes = {
-  card: PropTypes.shape({
-    "card-added-at": PropTypes.number,
-    "story-elements": PropTypes.array,
-    id: PropTypes.string
+  card: PropTypes__default["default"].shape({
+    "card-added-at": PropTypes__default["default"].number,
+    "story-elements": PropTypes__default["default"].array,
+    id: PropTypes__default["default"].string
   }),
-  config: PropTypes.object,
-  slug: PropTypes.string,
-  story: PropTypes.object,
-  elements: PropTypes.array,
-  index: PropTypes.number,
-  cardLength: PropTypes.number,
-  loadCards: PropTypes.bool,
-  showLoadMore: PropTypes.bool
+  config: PropTypes__default["default"].object,
+  slug: PropTypes__default["default"].string,
+  story: PropTypes__default["default"].object,
+  elements: PropTypes__default["default"].array,
+  index: PropTypes__default["default"].number,
+  cardLength: PropTypes__default["default"].number,
+  loadCards: PropTypes__default["default"].bool,
+  showLoadMore: PropTypes__default["default"].bool
 };
 var KeyEventsBase = function KeyEventsBase(_ref) {
   var _ref$story = _ref.story,
@@ -5256,7 +5284,7 @@ var KeyEventsBase = function KeyEventsBase(_ref) {
       initialLoadCount = _config$initialLoadCo === void 0 ? 4 : _config$initialLoadCo;
   var textColor = getTextColor(theme);
 
-  var _useState = useState(initialLoadCount),
+  var _useState = React.useState(initialLoadCount),
       _useState2 = _slicedToArray(_useState, 2),
       initialCount = _useState2[0],
       updatedCount = _useState2[1];
@@ -5265,7 +5293,7 @@ var KeyEventsBase = function KeyEventsBase(_ref) {
     return get_1(card.metadata, ["attributes", "key-event"]);
   });
   var lastElement = cardsWithKeyEvents.length > initialCount;
-  var qtConfig = useSelector(function (state) {
+  var qtConfig = reactRedux.useSelector(function (state) {
     return get_1(state, ["qt", "config"], {});
   });
 
@@ -5279,7 +5307,7 @@ var KeyEventsBase = function KeyEventsBase(_ref) {
 
   var showAllCards = !showLoadMore ? cardsWithKeyEvents.slice(0, 4) : cardsWithKeyEvents.slice(0, initialCount);
   var keyEvents = showAllCards.map(function (card, index, source) {
-    return /*#__PURE__*/React.createElement(KeyEventCards, {
+    return /*#__PURE__*/React__default["default"].createElement(KeyEventCards, {
       cardLength: source.length,
       card: card,
       key: card.id,
@@ -5290,14 +5318,14 @@ var KeyEventsBase = function KeyEventsBase(_ref) {
       showLoadMore: showLoadMore
     });
   });
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     style: {
       background: theme
     },
     className: "arrow-component " + _getClassName("container ".concat(textColor), _styleModuleImportMap$k)
-  }, /*#__PURE__*/React.createElement("h3", null, "Key Events"), /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("h3", null, "Key Events"), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "key-events-m_cards-wrapper__3f8aB"
-  }, keyEvents), showLoadMore && lastElement && /*#__PURE__*/React.createElement(LoadmoreButton, {
+  }, keyEvents), showLoadMore && lastElement && /*#__PURE__*/React__default["default"].createElement(LoadmoreButton, {
     onClick: onClick,
     template: "SubsequentLoadCount",
     config: config,
@@ -5305,9 +5333,9 @@ var KeyEventsBase = function KeyEventsBase(_ref) {
   }));
 };
 KeyEventsBase.propTypes = {
-  story: PropTypes.object,
-  config: PropTypes.object,
-  showLoadMore: PropTypes.bool
+  story: PropTypes__default["default"].object,
+  config: PropTypes__default["default"].object,
+  showLoadMore: PropTypes__default["default"].bool
 };
 var KeyEvents = StateProvider(KeyEventsBase);
 
@@ -5348,12 +5376,12 @@ var StoryCollection = function StoryCollection(_ref) {
   var isHorizontal = horizontal ? "horizontal-wrapper" : "";
   var mountAt = get_1(config, ["mountAtPrefix"], "");
 
-  var _useState = useState([]),
+  var _useState = React.useState([]),
       _useState2 = _slicedToArray(_useState, 2),
       storyList = _useState2[0],
       updateStoryList = _useState2[1];
 
-  var _useState3 = useState([]),
+  var _useState3 = React.useState([]),
       _useState4 = _slicedToArray(_useState3, 2),
       collectionData = _useState4[0],
       updateCollectionData = _useState4[1];
@@ -5387,59 +5415,59 @@ var StoryCollection = function StoryCollection(_ref) {
     };
   }();
 
-  useEffect(function () {
+  React.useEffect(function () {
     if (collectionSlug) {
       updateStoryListItems(collectionSlug);
     }
   }, [collectionSlug]);
-  useEffect(function () {
+  React.useEffect(function () {
     if (!collectionSlug && data) {
       var storyItems = data.items || data;
       updateStoryList(storyItems);
     }
   }, [data, collectionSlug]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CollectionName, {
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(CollectionName, {
     customCollectionName: heading,
     textColor: true,
     collection: collectionData
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "aside-collection-m_stories__9wfUs"
   }, storyList && storyList.length > 0 ? storyList.slice(0, 4).map(function (item) {
     var story = item.story || item;
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "aside-collection-m_story__17Jdm",
       key: story.id
-    }, /*#__PURE__*/React.createElement(StoryCard, {
+    }, /*#__PURE__*/React__default["default"].createElement(StoryCard, {
       story: story,
       isHorizontal: true,
       theme: theme,
       config: config
-    }, /*#__PURE__*/React.createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "aside-collection-m_story-hero-image__13nFY"
-    }, /*#__PURE__*/React.createElement(HeroImage, {
+    }, /*#__PURE__*/React__default["default"].createElement(HeroImage, {
       story: story,
       aspectRatio: [[4, 3]]
-    })), /*#__PURE__*/React.createElement("div", null, isHorizontal && /*#__PURE__*/React.createElement(SectionTag, {
+    })), /*#__PURE__*/React__default["default"].createElement("div", null, isHorizontal && /*#__PURE__*/React__default["default"].createElement(SectionTag, {
       story: story
-    }), /*#__PURE__*/React.createElement(Headline, {
+    }), /*#__PURE__*/React__default["default"].createElement(Headline, {
       story: story
-    }), /*#__PURE__*/React.createElement("div", {
+    }), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "aside-collection-m_story-byline__37KRG"
-    }, /*#__PURE__*/React.createElement(AuthorWithTime, {
+    }, /*#__PURE__*/React__default["default"].createElement(AuthorWithTime, {
       config: opts,
       story: story
     })))));
-  }) : /*#__PURE__*/React.createElement("div", {
+  }) : /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "no-stories",
     className: "aside-collection-m_info__3p4zt"
   }, "No stories found.")));
 };
 StoryCollection.propTypes = {
-  data: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
-  config: PropTypes.object,
-  horizontal: PropTypes.bool,
-  slotData: PropTypes.object,
-  opts: PropTypes.object
+  data: PropTypes__default["default"].oneOfType([PropTypes__default["default"].object, PropTypes__default["default"].array]),
+  config: PropTypes__default["default"].object,
+  horizontal: PropTypes__default["default"].bool,
+  slotData: PropTypes__default["default"].object,
+  opts: PropTypes__default["default"].object
 };
 var AsideCollectionBase = function AsideCollectionBase(_ref4) {
   var _ref4$data = _ref4.data,
@@ -5466,14 +5494,14 @@ var AsideCollectionBase = function AsideCollectionBase(_ref4) {
   var isHorizontal = horizontal ? "horizontal-wrapper" : "";
 
   if (horizontal) {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       style: {
         backgroundColor: theme
       },
       "data-test-id": "aside-collection",
       id: "aside-collection-".concat(storyId),
       className: "arrow-component arr--aside-collection " + _getClassName("wrapper ".concat(isHorizontal), _styleModuleImportMap$j)
-    }, /*#__PURE__*/React.createElement(StoryCollection, {
+    }, /*#__PURE__*/React__default["default"].createElement(StoryCollection, {
       data: data,
       horizontal: horizontal,
       config: config,
@@ -5486,23 +5514,23 @@ var AsideCollectionBase = function AsideCollectionBase(_ref4) {
   var asideSlot = function asideSlot(type, slot, index) {
     switch (type) {
       case "ad":
-        return /*#__PURE__*/React.createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           className: "aside-collection-ad-slot aside-collection-m_ad-slot__28nE2"
         }, adComponent(_objectSpread$2(_objectSpread$2({}, slot), {}, {
           id: "ad-".concat(index, "_").concat(storyId)
         })));
 
       case "widget":
-        return /*#__PURE__*/React.createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           className: "aside-collection-ad-slot aside-collection-m_ad-slot__28nE2"
         }, widgetComp(_objectSpread$2(_objectSpread$2({}, slot), {}, {
           id: "widget-".concat(index, "_").concat(storyId)
         })));
 
       case "collection":
-        return /*#__PURE__*/React.createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           id: "aside-collection-".concat(index, "_").concat(storyId)
-        }, /*#__PURE__*/React.createElement(StoryCollection, {
+        }, /*#__PURE__*/React__default["default"].createElement(StoryCollection, {
           slotData: slot,
           data: data,
           horizontal: horizontal,
@@ -5512,13 +5540,13 @@ var AsideCollectionBase = function AsideCollectionBase(_ref4) {
     }
   };
 
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     style: {
       backgroundColor: theme
     },
     "data-test-id": "aside-collection",
     className: "arrow-component arr--aside-collection " + _getClassName(["wrapper", isHorizontal, isSticky].join(" "), _styleModuleImportMap$j)
-  }, enableKeyEvents && /*#__PURE__*/React.createElement(KeyEvents, {
+  }, enableKeyEvents && /*#__PURE__*/React__default["default"].createElement(KeyEvents, {
     story: keyEventsData.story,
     showLoadMore: keyEventsData.showLoadMore,
     config: keyEventsData.config
@@ -5527,21 +5555,21 @@ var AsideCollectionBase = function AsideCollectionBase(_ref4) {
   }));
 };
 AsideCollectionBase.propTypes = {
-  data: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
-  config: PropTypes.object,
-  opts: PropTypes.object,
-  horizontal: PropTypes.bool,
-  slots: PropTypes.array,
-  adComponent: PropTypes.func,
-  widgetComp: PropTypes.func,
-  sticky: PropTypes.bool,
-  keyEventsData: PropTypes.shape({
-    story: PropTypes.object,
-    config: PropTypes.object,
-    showLoadMore: PropTypes["boolean"]
+  data: PropTypes__default["default"].oneOfType([PropTypes__default["default"].object, PropTypes__default["default"].array]),
+  config: PropTypes__default["default"].object,
+  opts: PropTypes__default["default"].object,
+  horizontal: PropTypes__default["default"].bool,
+  slots: PropTypes__default["default"].array,
+  adComponent: PropTypes__default["default"].func,
+  widgetComp: PropTypes__default["default"].func,
+  sticky: PropTypes__default["default"].bool,
+  keyEventsData: PropTypes__default["default"].shape({
+    story: PropTypes__default["default"].object,
+    config: PropTypes__default["default"].object,
+    showLoadMore: PropTypes__default["default"]["boolean"]
   }),
-  enableKeyEvents: PropTypes["boolean"],
-  storyId: PropTypes.string
+  enableKeyEvents: PropTypes__default["default"]["boolean"],
+  storyId: PropTypes__default["default"].string
 };
 var AsideCollection = StateProvider(AsideCollectionBase);
 
@@ -5603,9 +5631,9 @@ var authorImage = function authorImage(author) {
     return null;
   }
 
-  return /*#__PURE__*/React.createElement("figure", {
+  return /*#__PURE__*/React__default["default"].createElement("figure", {
     "data-test-id": "author-image"
-  }, avatarS3Key ? /*#__PURE__*/React.createElement(ResponsiveImage, {
+  }, avatarS3Key ? /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
     slug: avatarS3Key,
     "aspect-ratio": [1, 1],
     defaultWidth: 48,
@@ -5613,7 +5641,7 @@ var authorImage = function authorImage(author) {
       auto: ["format", "compress"]
     },
     alt: authorName
-  }) : /*#__PURE__*/React.createElement("img", {
+  }) : /*#__PURE__*/React__default["default"].createElement("img", {
     src: avatarUrl
   }));
 };
@@ -5640,60 +5668,60 @@ var AuthorCard = function AuthorCard(_ref) {
       _opts$showName = opts.showName,
       showName = _opts$showName === void 0 ? true : _opts$showName;
   var textColor = getTextColor(configData.theme);
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "author-card-".concat(kebabCase_1(template)),
     className: (clazzName ? clazzName + " " : "") + _getClassName("author-card-wrapper ".concat(template), _styleModuleImportMap$i)
   }, authors.map(function (author, index) {
-    return /*#__PURE__*/React.createElement(React.Fragment, {
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
       key: author.id
-    }, showImage && (author["avatar-url"] || author["avatar-s3-key"]) && /*#__PURE__*/React.createElement("div", {
+    }, showImage && (author["avatar-url"] || author["avatar-s3-key"]) && /*#__PURE__*/React__default["default"].createElement("div", {
       "data-test-id": "author-image",
       className: "author-card-m_author-image-wrapper__1at-z"
-    }, /*#__PURE__*/React.createElement(Link, {
+    }, /*#__PURE__*/React__default["default"].createElement(components.Link, {
       href: "".concat(mountAt, "/author/") + author.slug,
       key: "author-image-".concat(index),
       "aria-label": "author-image"
-    }, /*#__PURE__*/React.createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: _getClassName("author-image ".concat(!index ? "first-author-image" : "", " ").concat(!isSingleAuthor ? "multi-author-image" : ""), _styleModuleImportMap$i)
     }, authorImage(author)))));
-  }), showName && /*#__PURE__*/React.createElement("div", {
+  }), showName && /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "author-name",
     className: "author-card-m_author-name-share__3vb9q"
   }, authors.map(function (author, index) {
     var spaceHolder = ",\xA0";
-    return /*#__PURE__*/React.createElement(React.Fragment, null, index !== 0 && (authors.length > 1 ? spaceHolder : ""), /*#__PURE__*/React.createElement(Link, {
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, index !== 0 && (authors.length > 1 ? spaceHolder : ""), /*#__PURE__*/React__default["default"].createElement(components.Link, {
       href: "".concat(mountAt, "/author/") + author.slug,
       "aria-label": "author-name"
-    }, /*#__PURE__*/React.createElement("h5", {
+    }, /*#__PURE__*/React__default["default"].createElement("h5", {
       className: _getClassName("multiple-author-style ".concat(textColor), _styleModuleImportMap$i)
     }, author.name)));
-  }), isSingleAuthor && template !== "centerAligned" && /*#__PURE__*/React.createElement(React.Fragment, null, authors[0]["twitter-handle"] && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+  }), isSingleAuthor && template !== "centerAligned" && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, authors[0]["twitter-handle"] && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "author-card-m_dot-wrapper__2soc1"
-  }, /*#__PURE__*/React.createElement(Dot, {
+  }, /*#__PURE__*/React__default["default"].createElement(Dot, {
     color: textColor
-  })), /*#__PURE__*/React.createElement("a", {
+  })), /*#__PURE__*/React__default["default"].createElement("a", {
     href: "http://twitter.com/" + authors[0]["twitter-handle"],
     target: "_blank",
     rel: "noopener noreferrer"
-  }, /*#__PURE__*/React.createElement(Twitter, null))))), /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement(Twitter, null))))), /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "author-info",
     className: "author-card-m_author-details-wrapper__1c2uc"
-  }, showBio && isSingleAuthor && template !== "default" && /*#__PURE__*/React.createElement("p", {
+  }, showBio && isSingleAuthor && template !== "default" && /*#__PURE__*/React__default["default"].createElement("p", {
     className: _getClassName("author-bio ".concat(textColor), _styleModuleImportMap$i)
   }, authors[0].bio)));
 };
 AuthorCard.propTypes = {
-  story: PropTypes.shape({
-    authors: PropTypes.array
+  story: PropTypes__default["default"].shape({
+    authors: PropTypes__default["default"].array
   }),
-  template: PropTypes.string,
-  opts: PropTypes.shape({
-    showImage: PropTypes.bool,
-    showBio: PropTypes.bool,
-    showName: PropTypes.bool
+  template: PropTypes__default["default"].string,
+  opts: PropTypes__default["default"].shape({
+    showImage: PropTypes__default["default"].bool,
+    showBio: PropTypes__default["default"].bool,
+    showName: PropTypes__default["default"].bool
   }),
-  mountAt: PropTypes.string,
-  clazzName: PropTypes.string
+  mountAt: PropTypes__default["default"].string,
+  clazzName: PropTypes__default["default"].string
 };
 
 var _styleModuleImportMap$h = {
@@ -5722,12 +5750,12 @@ var PublishDetails = function PublishDetails(_ref) {
       _ref$timezone = _ref.timezone,
       timezone = _ref$timezone === void 0 ? null : _ref$timezone;
 
-  var _useState = useState("ltr"),
+  var _useState = React.useState("ltr"),
       _useState2 = _slicedToArray(_useState, 2),
       direction = _useState2[0],
       setDirection = _useState2[1];
 
-  useEffect(function () {
+  React.useEffect(function () {
     var htmlElement = document.getElementsByTagName("HTML");
 
     if (htmlElement && htmlElement.length > 0 && htmlElement[0].dir.toLocaleLowerCase() === "rtl") {
@@ -5753,41 +5781,41 @@ var PublishDetails = function PublishDetails(_ref) {
     direction: direction,
     showTime: true
   });
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "timeStamp",
     className: "arrow-component arr-publish-details " + _getClassName("timeStamp ".concat(textColor), _styleModuleImportMap$h)
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "publishDetails",
     className: _getClassName("publish-details ".concat(textColor), _styleModuleImportMap$h)
-  }, enablePublishedTime && /*#__PURE__*/React.createElement(React.Fragment, null, localizedPublishedOn || "Published on", " :\xA0", /*#__PURE__*/React.createElement("div", {
+  }, enablePublishedTime && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, localizedPublishedOn || "Published on", " :\xA0", /*#__PURE__*/React__default["default"].createElement("div", {
     className: "publish-details-m_date__3ZIQN"
-  }, getTimeStamp(time, timestampToFormat, timeStampProps, template, timezone)), showReadTime && /*#__PURE__*/React.createElement(ReadTime, {
+  }, getTimeStamp(time, timestampToFormat, timeStampProps, template, timezone)), showReadTime && /*#__PURE__*/React__default["default"].createElement(ReadTime, {
     story: story,
     opts: opts
-  }))), enableUpdatedTime && /*#__PURE__*/React.createElement("div", {
+  }))), enableUpdatedTime && /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "updateDetails",
     className: _getClassName("update-details ".concat(textColor), _styleModuleImportMap$h)
-  }, localizedUpdatedOn || "Updated on", " :\xA0", /*#__PURE__*/React.createElement("div", {
+  }, localizedUpdatedOn || "Updated on", " :\xA0", /*#__PURE__*/React__default["default"].createElement("div", {
     className: "publish-details-m_date__3ZIQN"
-  }, getTimeStamp(updatedAt, timestampToFormat, timeStampProps, template, timezone)), showReadTime && /*#__PURE__*/React.createElement(ReadTime, {
+  }, getTimeStamp(updatedAt, timestampToFormat, timeStampProps, template, timezone)), showReadTime && /*#__PURE__*/React__default["default"].createElement(ReadTime, {
     story: story,
     opts: opts
   })));
 };
 PublishDetails.propTypes = {
   /** The Story Object from the API response */
-  story: PropTypes.shape({
-    "first-published-at": PropTypes.number,
-    "last-published-at": PropTypes.number,
-    "read-time": PropTypes.number,
-    "updated-at": PropTypes.number
+  story: PropTypes__default["default"].shape({
+    "first-published-at": PropTypes__default["default"].number,
+    "last-published-at": PropTypes__default["default"].number,
+    "read-time": PropTypes__default["default"].number,
+    "updated-at": PropTypes__default["default"].number
   }),
-  timezone: PropTypes.string,
-  template: PropTypes.string,
-  opts: PropTypes.shape({
-    showReadTime: PropTypes.bool,
-    enableUpdatedTime: PropTypes.bool,
-    enablePublishedTime: PropTypes.bool
+  timezone: PropTypes__default["default"].string,
+  template: PropTypes__default["default"].string,
+  opts: PropTypes__default["default"].shape({
+    showReadTime: PropTypes__default["default"].bool,
+    enableUpdatedTime: PropTypes__default["default"].bool,
+    enablePublishedTime: PropTypes__default["default"].bool
   })
 };
 
@@ -5810,24 +5838,24 @@ var StoryTags = function StoryTags(_ref) {
   var textColor = getTextColor(configData.theme);
   var mountAt = get_1(config, ["mountAt"], "");
   var templateStyle = template === "roundCorners" ? "roundCorners" : "";
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "arrow-component arr--story-tags"
   }, tags.length > 0 && tags.map(function (tag, index) {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       key: index,
       "data-test-id": "story-tag",
       className: _getClassName("tags ".concat(templateStyle, " ").concat(textColor), _styleModuleImportMap$g)
-    }, /*#__PURE__*/React.createElement(Link, {
+    }, /*#__PURE__*/React__default["default"].createElement(components.Link, {
       href: "".concat(mountAt, "/topic/") + tag.slug,
       "aria-label": "story-tag-name"
     }, tag.name));
   }));
 };
 StoryTags.propTypes = {
-  tags: PropTypes.array,
-  borderColor: PropTypes.string,
-  config: PropTypes.object,
-  template: string
+  tags: PropTypes__default["default"].array,
+  borderColor: PropTypes__default["default"].string,
+  config: PropTypes__default["default"].object,
+  template: PropTypes.string
 };
 
 var _excluded$c = ["element", "opts", "css", "story", "config"];
@@ -5863,7 +5891,7 @@ var TextBase = function TextBase(_ref) {
   var text = isExternalLink && updateContentLinks(content) || content;
   var isPromotionalMessage = get_1(element, ["metadata", "promotional-message"], false);
   var updatedStyle = isPromotionalMessage ? "promotionalMessage" : "textElement";
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     style: !isPromotionalMessage ? {
       color: textColor
     } : {},
@@ -5878,15 +5906,15 @@ var TextBase = function TextBase(_ref) {
 };
 
 TextBase.propTypes = {
-  element: PropTypes.shape({
-    text: PropTypes.string
+  element: PropTypes__default["default"].shape({
+    text: PropTypes__default["default"].string
   }),
-  opts: PropTypes.shape({
-    isExternalLink: PropTypes.bool
+  opts: PropTypes__default["default"].shape({
+    isExternalLink: PropTypes__default["default"].bool
   }),
-  css: PropTypes.shape({
-    hyperlinkColor: PropTypes.string,
-    textColor: PropTypes.string
+  css: PropTypes__default["default"].shape({
+    hyperlinkColor: PropTypes__default["default"].string,
+    textColor: PropTypes__default["default"].string
   }),
   story: shapeStory,
   config: shapeConfig
@@ -5927,13 +5955,13 @@ var BlurbBase = function BlurbBase(_ref) {
     borderLeft: "solid 2px ".concat(borderColor)
   };
 
-  var _useState = useState(initBorderDirection),
+  var _useState = React.useState(initBorderDirection),
       _useState2 = _slicedToArray(_useState, 2),
       borderDirection = _useState2[0],
       setBorderDirection = _useState2[1];
 
   if (!content) return null;
-  useEffect(function () {
+  React.useEffect(function () {
     var htmlElement = document.getElementsByTagName("HTML");
 
     if (htmlElement && htmlElement.length) {
@@ -5950,7 +5978,7 @@ var BlurbBase = function BlurbBase(_ref) {
   var templateStyle = template ? "blurb-".concat(template) : "blurb";
   var configData = useStateValue() || {};
   var textInvertColor = getTextColor(configData.theme);
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     "data-test-id": "blurb",
     style: borderColor && borderDirection,
     dangerouslySetInnerHTML: {
@@ -5962,19 +5990,19 @@ var BlurbBase = function BlurbBase(_ref) {
 };
 
 BlurbBase.propTypes = {
-  element: PropTypes.shape({
-    text: PropTypes.string
+  element: PropTypes__default["default"].shape({
+    text: PropTypes__default["default"].string
   }),
 
   /** templates can be either default or withBorder */
-  template: PropTypes.string,
-  opts: PropTypes.shape({
-    isExternalLink: PropTypes.bool
+  template: PropTypes__default["default"].string,
+  opts: PropTypes__default["default"].shape({
+    isExternalLink: PropTypes__default["default"].bool
   }),
   story: shapeStory,
   config: shapeConfig,
-  render: PropTypes.func,
-  css: PropTypes.object
+  render: PropTypes__default["default"].func,
+  css: PropTypes__default["default"].object
 };
 var Blurb = withElementWrapper(BlurbBase);
 
@@ -6027,19 +6055,19 @@ var SummaryBase = function SummaryBase(_ref) {
   var updateHeaderColor = renderTemplate ? "".concat(headerBgColor) : "";
   var textColor = renderTemplate ? getTextColor(headerBgColor) : "";
   var updateContentColor = template === "header" ? "" : textInvertColor;
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     "data-test-id": "summary"
   }, restProps, {
     className: "arrow-component arr--summary-element arr-custom-style " + _getClassName(templateStyle, _styleModuleImportMap$d) + (" " + (restProps ? restProps.className || "" : ""))
-  }), !hideHeadline && /*#__PURE__*/React.createElement("div", {
+  }), !hideHeadline && /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "summary-headline",
     className: _getClassName("heading-wrapper ".concat(textInvertColor), _styleModuleImportMap$d)
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     style: {
       backgroundColor: updateHeaderColor
     },
     className: _getClassName("headline ".concat(textColor, " ").concat(textInvertColor), _styleModuleImportMap$d)
-  }, headline)), /*#__PURE__*/React.createElement("div", {
+  }, headline)), /*#__PURE__*/React__default["default"].createElement("div", {
     dangerouslySetInnerHTML: {
       __html: text
     },
@@ -6048,20 +6076,20 @@ var SummaryBase = function SummaryBase(_ref) {
 };
 
 SummaryBase.propTypes = {
-  element: PropTypes.shape({
-    text: PropTypes.string
+  element: PropTypes__default["default"].shape({
+    text: PropTypes__default["default"].string
   }),
-  template: PropTypes.string,
-  opts: PropTypes.shape({
-    isExternalLink: PropTypes.bool,
-    headline: PropTypes.string,
-    hideHeadline: PropTypes.bool
+  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.func,
-  css: PropTypes.shape({
-    headerBgColor: PropTypes.string
+  render: PropTypes__default["default"].func,
+  css: PropTypes__default["default"].shape({
+    headerBgColor: PropTypes__default["default"].string
   })
 };
 var Summary = withElementWrapper(SummaryBase);
@@ -6073,27 +6101,27 @@ var CurveIcon = function CurveIcon(_ref) {
       opacity = _ref.opacity;
   var lightColor = color === "light" && "#ffffff";
   var darkColor = color === "dark" && "#0d0d0d";
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "icon-m_curve-wrapper__3-sLV",
     style: {
       fill: "".concat(lightColor || darkColor || color)
     }
-  }, /*#__PURE__*/React.createElement("svg", {
+  }, /*#__PURE__*/React__default["default"].createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: width,
     height: height,
     viewBox: "0 0 64 64"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__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.string,
-  height: PropTypes.string,
-  color: PropTypes.string,
-  opacity: PropTypes.string
+  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) {
@@ -6103,27 +6131,27 @@ var EdgeIcon = function EdgeIcon(_ref) {
       opacity = _ref.opacity;
   var lightColor = color === "light" && "#ffffff";
   var darkColor = color === "dark" && "#0d0d0d";
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "icon-m_edge-wrapper__xUOdp",
     style: {
       fill: "".concat(lightColor || darkColor || color)
     }
-  }, /*#__PURE__*/React.createElement("svg", {
+  }, /*#__PURE__*/React__default["default"].createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: width,
     height: height,
     viewBox: "0 0 64 64"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__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.string,
-  height: PropTypes.string,
-  color: PropTypes.string,
-  opacity: PropTypes.string
+  width: PropTypes__default["default"].string,
+  height: PropTypes__default["default"].string,
+  color: PropTypes__default["default"].string,
+  opacity: PropTypes__default["default"].string
 };
 
 var _excluded$9 = ["element", "template", "css", "story", "config", "render"];
@@ -6153,7 +6181,7 @@ var SelectionOfIcon = function SelectionOfIcon(iconType, template, blockQuoteCol
 
   if (template === "withBackground") {
     if (iconType === "edgeIcon") {
-      return /*#__PURE__*/React.createElement(EdgeIcon, {
+      return /*#__PURE__*/React__default["default"].createElement(EdgeIcon, {
         width: dimension,
         height: dimension,
         color: quoteColor,
@@ -6161,7 +6189,7 @@ var SelectionOfIcon = function SelectionOfIcon(iconType, template, blockQuoteCol
       });
     }
 
-    return /*#__PURE__*/React.createElement(CurveIcon, {
+    return /*#__PURE__*/React__default["default"].createElement(CurveIcon, {
       width: dimension,
       height: dimension,
       color: quoteColor,
@@ -6171,14 +6199,14 @@ var SelectionOfIcon = function SelectionOfIcon(iconType, template, blockQuoteCol
 
   if (template !== "withBackground") {
     if (iconType === "edgeIcon") {
-      return /*#__PURE__*/React.createElement(EdgeIcon, {
+      return /*#__PURE__*/React__default["default"].createElement(EdgeIcon, {
         width: dimension,
         height: dimension,
         color: blockQuoteColor
       });
     }
 
-    return /*#__PURE__*/React.createElement(CurveIcon, {
+    return /*#__PURE__*/React__default["default"].createElement(CurveIcon, {
       width: dimension,
       height: dimension,
       color: blockQuoteColor
@@ -6214,38 +6242,38 @@ var BlockQuoteBase = function BlockQuoteBase(_ref) {
   var textInvertColor = getTextColor(isBackground ? theme.backgroundColor : configData.theme);
 
   var updateStructure = function updateStructure() {
-    return template === "withBorder" ? /*#__PURE__*/React.createElement("div", {
+    return template === "withBorder" ? /*#__PURE__*/React__default["default"].createElement("div", {
       className: "block-quote-m_icon-border__2xQQY"
-    }, /*#__PURE__*/React.createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "block-quote-m_icon__m-EIZ"
-    }, SelectionOfIcon(iconType, template, blockQuoteColor, textColor)), /*#__PURE__*/React.createElement("div", {
+    }, SelectionOfIcon(iconType, template, blockQuoteColor, textColor)), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "block-quote-m_border__1ZTPR",
       style: blockQuoteColor && {
         backgroundColor: blockQuoteColor
       }
-    })) : /*#__PURE__*/React.createElement("div", {
+    })) : /*#__PURE__*/React__default["default"].createElement("div", {
       className: "block-quote-m_icon__m-EIZ"
     }, SelectionOfIcon(iconType, template, blockQuoteColor, textColor));
   };
 
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     "data-test-id": "blockquote",
     style: theme
   }, restProps, {
     className: "arrow-component arr--block-quote " + _getClassName("".concat(templateStyle, " ").concat(textColor), _styleModuleImportMap$c) + (" " + (restProps ? restProps.className || "" : ""))
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "block-quote-m_quote-wrapper__83bEy"
-  }, updateStructure(), /*#__PURE__*/React.createElement("div", {
+  }, updateStructure(), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "block-quote-m_wrapper__2KEhw",
     style: blockQuoteColor && {
       borderColor: blockQuoteColor
     }
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     dangerouslySetInnerHTML: {
       __html: content
     },
     className: _getClassName("content ".concat(textInvertColor), _styleModuleImportMap$c)
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     dangerouslySetInnerHTML: {
       __html: attribution
     },
@@ -6253,17 +6281,17 @@ var BlockQuoteBase = function BlockQuoteBase(_ref) {
   }))));
 };
 BlockQuoteBase.propTypes = {
-  element: PropTypes.shape({
-    metadata: PropTypes.shape({
-      content: PropTypes.string,
-      attribution: PropTypes.string
+  element: PropTypes__default["default"].shape({
+    metadata: PropTypes__default["default"].shape({
+      content: PropTypes__default["default"].string,
+      attribution: PropTypes__default["default"].string
     })
   }),
-  template: PropTypes.string,
+  template: PropTypes__default["default"].string,
   story: shapeStory,
   config: shapeConfig,
-  render: PropTypes.func,
-  css: PropTypes.object
+  render: PropTypes__default["default"].func,
+  css: PropTypes__default["default"].object
 };
 var BlockQuote = withElementWrapper(BlockQuoteBase);
 
@@ -6291,27 +6319,27 @@ var BigFactBase = function BigFactBase(_ref) {
   var _element$metadata = element.metadata,
       content = _element$metadata.content,
       attribution = _element$metadata.attribution;
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     "data-test-id": "bigfact"
   }, restProps, {
     className: "arrow-component arr--bigfact-element " + _getClassName("bigfact-element ".concat(textInvertColor), _styleModuleImportMap$b) + (" " + (restProps ? restProps.className || "" : ""))
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "big-fact-m_content__1u2Ul"
-  }, content), /*#__PURE__*/React.createElement("div", {
+  }, content), /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "attribution",
     className: _getClassName("attribution ".concat(textInvertColor), _styleModuleImportMap$b)
   }, attribution));
 };
 
 BigFactBase.propTypes = {
-  element: PropTypes.shape({
-    metadata: PropTypes.shape({
-      content: PropTypes.string,
-      attribution: PropTypes.string
+  element: PropTypes__default["default"].shape({
+    metadata: PropTypes__default["default"].shape({
+      content: PropTypes__default["default"].string,
+      attribution: PropTypes__default["default"].string
     })
   }),
-  story: PropTypes.object,
-  config: PropTypes.object
+  story: PropTypes__default["default"].object,
+  config: PropTypes__default["default"].object
 };
 var BigFact = withElementWrapper(BigFactBase);
 
@@ -6345,11 +6373,11 @@ var DisplayImage = function DisplayImage(_ref) {
   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.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "also-read-m_card-image-wrapper__3GFzu"
-  }, !isEmpty(linkedImage) ? /*#__PURE__*/React.createElement("figure", {
+  }, !isEmpty(linkedImage) ? /*#__PURE__*/React__default["default"].createElement("figure", {
     className: "also-read-m_card-image__3CwAv"
-  }, /*#__PURE__*/React.createElement(LazyLoadImages, null, /*#__PURE__*/React.createElement(ResponsiveImage, {
+  }, /*#__PURE__*/React__default["default"].createElement(components.LazyLoadImages, null, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
     slug: linkedImage,
     "aspect-ratio": imageAspectRatio,
     defaultWidth: 480,
@@ -6358,19 +6386,19 @@ var DisplayImage = function DisplayImage(_ref) {
       auto: ["format", "compress"]
     },
     alt: alternateText
-  }))) : /*#__PURE__*/React.createElement("div", {
+  }))) : /*#__PURE__*/React__default["default"].createElement("div", {
     className: "arr--fallback-also-read also-read-m_image__2jdRP"
-  }, /*#__PURE__*/React.createElement(FallbackImage, null)));
+  }, /*#__PURE__*/React__default["default"].createElement(FallbackImage, null)));
 };
 
 DisplayImage.propTypes = {
-  story: PropTypes.shape({
-    "hero-image-caption": PropTypes.string,
-    headline: PropTypes.string
+  story: PropTypes__default["default"].shape({
+    "hero-image-caption": PropTypes__default["default"].string,
+    headline: PropTypes__default["default"].string
   }),
-  linkedImage: PropTypes.string,
-  template: PropTypes.string,
-  isRightAlign: PropTypes.bool
+  linkedImage: PropTypes__default["default"].string,
+  template: PropTypes__default["default"].string,
+  isRightAlign: PropTypes__default["default"].bool
 };
 
 var AlsoReadBase = function AlsoReadBase(_ref2) {
@@ -6403,22 +6431,22 @@ var AlsoReadBase = function AlsoReadBase(_ref2) {
   var isDefault = template === "" || template === "default";
   var isRightAlign = template === "imageRightAlign";
   var templateStyle = template ? "alsoread-".concat(template) : "alsoread-default";
-  return /*#__PURE__*/React.createElement(Link, _extends({
+  return /*#__PURE__*/React__default["default"].createElement(components.Link, _extends({
     "data-test-id": "also-read",
     href: storyUrl,
     "aria-label": "also-read"
   }, restProps, {
     className: "arrow-component arr--also-read-element " + _getClassName(templateStyle, _styleModuleImportMap$a) + (" " + (restProps ? restProps.className || "" : ""))
-  }), !isDefault && /*#__PURE__*/React.createElement("div", {
+  }), !isDefault && /*#__PURE__*/React__default["default"].createElement("div", {
     className: _getClassName("default-text ".concat(textInvertColor), _styleModuleImportMap$a)
-  }, displayTitle), isDefault && /*#__PURE__*/React.createElement(DisplayImage, {
+  }, displayTitle), isDefault && /*#__PURE__*/React__default["default"].createElement(DisplayImage, {
     story: story,
     linkedImage: linkedImage,
     template: template,
     isRightAlign: isRightAlign
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "also-read-m_content-wrapper__26AZX"
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "also-read-m_headline__VzF-c",
     style: textColor ? {
       color: textColor
@@ -6428,7 +6456,7 @@ var AlsoReadBase = function AlsoReadBase(_ref2) {
     dangerouslySetInnerHTML: {
       __html: content
     }
-  }), isRightAlign && /*#__PURE__*/React.createElement(DisplayImage, {
+  }), isRightAlign && /*#__PURE__*/React__default["default"].createElement(DisplayImage, {
     story: story,
     linkedImage: linkedImage,
     template: template
@@ -6437,25 +6465,25 @@ var AlsoReadBase = function AlsoReadBase(_ref2) {
 
 AlsoReadBase.propTypes = {
   /**  template can be default, textLeftAlign or imageRightAlign */
-  template: PropTypes.string,
-  story: PropTypes.shape({
-    "linked-stories": PropTypes.object
+  template: PropTypes__default["default"].string,
+  story: PropTypes__default["default"].shape({
+    "linked-stories": PropTypes__default["default"].object
   }),
-  element: PropTypes.shape({
-    text: PropTypes.string,
-    metadata: PropTypes.shape({
-      linkedStoryId: PropTypes.shape({
-        url: PropTypes.string,
-        "hero-image-s3-key": PropTypes.string
+  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.shape({
-    title: PropTypes.string
+  opts: PropTypes__default["default"].shape({
+    title: PropTypes__default["default"].string
   }),
   config: shapeConfig,
-  render: PropTypes.func,
-  css: PropTypes.object
+  render: PropTypes__default["default"].func,
+  css: PropTypes__default["default"].object
 };
 var AlsoRead = withElementWrapper(AlsoReadBase);
 
@@ -6463,20 +6491,20 @@ var Loading = function Loading(_ref) {
   _ref.width;
       _ref.height;
       _ref.iconColor;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "loading-m_loading-indicator__2Dlst"
-  }, /*#__PURE__*/React.createElement("svg", {
+  }, /*#__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.createElement("circle", {
+  }, /*#__PURE__*/React__default["default"].createElement("circle", {
     cx: "84",
     cy: "50",
     r: "0",
     fill: "currentColor"
-  }, /*#__PURE__*/React.createElement("animate", {
+  }, /*#__PURE__*/React__default["default"].createElement("animate", {
     attributeName: "r",
     values: "10;0;0;0;0",
     keyTimes: "0;0.25;0.5;0.75;1",
@@ -6485,7 +6513,7 @@ var Loading = function Loading(_ref) {
     dur: "2s",
     repeatCount: "indefinite",
     begin: "0s"
-  }), /*#__PURE__*/React.createElement("animate", {
+  }), /*#__PURE__*/React__default["default"].createElement("animate", {
     attributeName: "cx",
     values: "84;84;84;84;84",
     keyTimes: "0;0.25;0.5;0.75;1",
@@ -6494,12 +6522,12 @@ var Loading = function Loading(_ref) {
     dur: "2s",
     repeatCount: "indefinite",
     begin: "0s"
-  })), /*#__PURE__*/React.createElement("circle", {
+  })), /*#__PURE__*/React__default["default"].createElement("circle", {
     cx: "84",
     cy: "50",
     r: ".709",
     fill: "currentColor"
-  }, /*#__PURE__*/React.createElement("animate", {
+  }, /*#__PURE__*/React__default["default"].createElement("animate", {
     attributeName: "r",
     values: "0;10;10;10;0",
     keyTimes: "0;0.25;0.5;0.75;1",
@@ -6508,7 +6536,7 @@ var Loading = function Loading(_ref) {
     dur: "2s",
     repeatCount: "indefinite",
     begin: "-1s"
-  }), /*#__PURE__*/React.createElement("animate", {
+  }), /*#__PURE__*/React__default["default"].createElement("animate", {
     attributeName: "cx",
     values: "16;16;50;84;84",
     keyTimes: "0;0.25;0.5;0.75;1",
@@ -6517,12 +6545,12 @@ var Loading = function Loading(_ref) {
     dur: "2s",
     repeatCount: "indefinite",
     begin: "-1s"
-  })), /*#__PURE__*/React.createElement("circle", {
+  })), /*#__PURE__*/React__default["default"].createElement("circle", {
     cx: "81.59",
     cy: "50",
     r: "10",
     fill: "currentColor"
-  }, /*#__PURE__*/React.createElement("animate", {
+  }, /*#__PURE__*/React__default["default"].createElement("animate", {
     attributeName: "r",
     values: "0;10;10;10;0",
     keyTimes: "0;0.25;0.5;0.75;1",
@@ -6531,7 +6559,7 @@ var Loading = function Loading(_ref) {
     dur: "2s",
     repeatCount: "indefinite",
     begin: "-0.5s"
-  }), /*#__PURE__*/React.createElement("animate", {
+  }), /*#__PURE__*/React__default["default"].createElement("animate", {
     attributeName: "cx",
     values: "16;16;50;84;84",
     keyTimes: "0;0.25;0.5;0.75;1",
@@ -6540,12 +6568,12 @@ var Loading = function Loading(_ref) {
     dur: "2s",
     repeatCount: "indefinite",
     begin: "-0.5s"
-  })), /*#__PURE__*/React.createElement("circle", {
+  })), /*#__PURE__*/React__default["default"].createElement("circle", {
     cx: "47.59",
     cy: "50",
     r: "10",
     fill: "currentColor"
-  }, /*#__PURE__*/React.createElement("animate", {
+  }, /*#__PURE__*/React__default["default"].createElement("animate", {
     attributeName: "r",
     values: "0;10;10;10;0",
     keyTimes: "0;0.25;0.5;0.75;1",
@@ -6554,7 +6582,7 @@ var Loading = function Loading(_ref) {
     dur: "2s",
     repeatCount: "indefinite",
     begin: "0s"
-  }), /*#__PURE__*/React.createElement("animate", {
+  }), /*#__PURE__*/React__default["default"].createElement("animate", {
     attributeName: "cx",
     values: "16;16;50;84;84",
     keyTimes: "0;0.25;0.5;0.75;1",
@@ -6563,12 +6591,12 @@ var Loading = function Loading(_ref) {
     dur: "2s",
     repeatCount: "indefinite",
     begin: "0s"
-  })), /*#__PURE__*/React.createElement("circle", {
+  })), /*#__PURE__*/React__default["default"].createElement("circle", {
     cx: "16",
     cy: "50",
     r: "9.291",
     fill: "currentColor"
-  }, /*#__PURE__*/React.createElement("animate", {
+  }, /*#__PURE__*/React__default["default"].createElement("animate", {
     attributeName: "r",
     values: "0;0;10;10;10",
     keyTimes: "0;0.25;0.5;0.75;1",
@@ -6577,7 +6605,7 @@ var Loading = function Loading(_ref) {
     dur: "2s",
     repeatCount: "indefinite",
     begin: "0s"
-  }), /*#__PURE__*/React.createElement("animate", {
+  }), /*#__PURE__*/React__default["default"].createElement("animate", {
     attributeName: "cx",
     values: "16;16;16;50;84",
     keyTimes: "0;0.25;0.5;0.75;1",
@@ -6589,16 +6617,16 @@ var Loading = function Loading(_ref) {
   }))));
 };
 Loading.propTypes = {
-  width: PropTypes.object,
-  height: PropTypes.object,
-  iconColor: PropTypes.object
+  width: PropTypes__default["default"].object,
+  height: PropTypes__default["default"].object,
+  iconColor: PropTypes__default["default"].object
 };
 
 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(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__*/lazy(function () {
-  return import('react-image-lightbox');
+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,
@@ -6607,16 +6635,16 @@ var FullScreenImages = function FullScreenImages(_ref) {
       _ref$element = _ref.element,
       element = _ref$element === void 0 ? {} : _ref$element,
       props = _ref.props;
-  var cdnImage = useSelector(function (state) {
+  var cdnImage = reactRedux.useSelector(function (state) {
     return get_1(state, ["qt", "config", "cdn-image"]);
   });
 
-  var _useState = useState(0),
+  var _useState = React.useState(0),
       _useState2 = _slicedToArray(_useState, 2),
       photoIndex = _useState2[0],
       handleImage = _useState2[1];
 
-  var _useState3 = useState(false),
+  var _useState3 = React.useState(false),
       _useState4 = _slicedToArray(_useState3, 2),
       isOpen = _useState4[0],
       handleOpen = _useState4[1];
@@ -6658,7 +6686,7 @@ var FullScreenImages = function FullScreenImages(_ref) {
 
   var getHyperLink = function getHyperLink() {
     if (element.hyperlink || hyperlinks[photoIndex]) {
-      return /*#__PURE__*/React.createElement(HyperLink, {
+      return /*#__PURE__*/React__default["default"].createElement(HyperLink, {
         hyperLink: element.hyperlink || hyperlinks[photoIndex]
       });
     }
@@ -6683,23 +6711,23 @@ var FullScreenImages = function FullScreenImages(_ref) {
   };
 
   var LoadingScreen = function LoadingScreen() {
-    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Loading, null));
+    return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(Loading, null));
   };
 
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(template, _objectSpread(_defineProperty({}, onClickKey, onClickHandler), props)), isOpen ? /*#__PURE__*/React.createElement(Suspense, {
-    fallback: /*#__PURE__*/React.createElement(LoadingScreen, null)
-  }, /*#__PURE__*/React.createElement(Lightbox, _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(template, _objectSpread(_defineProperty({}, 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({
     wrapperClassName: "arr--image-lightbox",
     onCloseRequest: onClose
   }, lightboxProps))) : null);
 };
 FullScreenImages.propTypes = {
-  imageSlug: PropTypes.string,
-  template: PropTypes.func,
-  element: PropTypes.shape({
-    "story-elements": PropTypes.array
+  imageSlug: PropTypes__default["default"].string,
+  template: PropTypes__default["default"].func,
+  element: PropTypes__default["default"].shape({
+    "story-elements": PropTypes__default["default"].array
   }),
-  props: PropTypes.object
+  props: PropTypes__default["default"].object
 };
 
 var _styleModuleImportMap$9 = {
@@ -6736,14 +6764,14 @@ var CaptionAttribution = function CaptionAttribution(_ref) {
   var caption = heroImageCaption || title;
   var attribution = heroImageAttribution || imageAttribution;
   var updateStyle = caption ? "wrapper" : "";
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "caption",
     className: "arr--caption-attribution " + _getClassName("caption ".concat(textColor), _styleModuleImportMap$9)
-  }, /*#__PURE__*/React.createElement("span", {
+  }, /*#__PURE__*/React__default["default"].createElement("span", {
     dangerouslySetInnerHTML: {
       __html: caption
     }
-  }), attribution && /*#__PURE__*/React.createElement("span", {
+  }), attribution && /*#__PURE__*/React__default["default"].createElement("span", {
     "data-test-id": "attribution",
     dangerouslySetInnerHTML: {
       __html: attribution
@@ -6752,13 +6780,13 @@ var CaptionAttribution = function CaptionAttribution(_ref) {
   }));
 };
 CaptionAttribution.propTypes = {
-  config: PropTypes.shape({
-    theme: PropTypes.string
+  config: PropTypes__default["default"].shape({
+    theme: PropTypes__default["default"].string
   }),
   story: shapeStory,
-  element: PropTypes.shape({
-    "image-attribution": PropTypes.string,
-    title: PropTypes.string
+  element: PropTypes__default["default"].shape({
+    "image-attribution": PropTypes__default["default"].string,
+    title: PropTypes__default["default"].string
   })
 };
 
@@ -6780,14 +6808,14 @@ var ImageBase = function ImageBase(_ref) {
 
   var ImageTemplate = function ImageTemplate(_ref2) {
     var _onClick = _ref2.onClick;
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "image-m_image-template__3s9OA"
-    }, /*#__PURE__*/React.createElement("figure", {
+    }, /*#__PURE__*/React__default["default"].createElement("figure", {
       className: "image-m_element__KVuzX",
       onClick: function onClick() {
         return _onClick();
       }
-    }, /*#__PURE__*/React.createElement(ResponsiveImage, {
+    }, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
       slug: element["image-s3-key"],
       metadata: element["image-metadata"],
       alt: element["title"],
@@ -6797,40 +6825,40 @@ var ImageBase = function ImageBase(_ref) {
       imgParams: {
         auto: ["format", "compress"]
       }
-    })), element["hyperlink"] && /*#__PURE__*/React.createElement(HyperLink, {
+    })), element["hyperlink"] && /*#__PURE__*/React__default["default"].createElement(HyperLink, {
       hyperLink: element["hyperlink"]
     }));
   };
 
   ImageTemplate.propTypes = {
-    onClick: PropTypes.func
+    onClick: PropTypes__default["default"].func
   };
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     className: "arrow-component arr--image-element"
   }, restProps, {
     "data-test-id": "image-element"
-  }), /*#__PURE__*/React.createElement(FullScreenImages, {
+  }), /*#__PURE__*/React__default["default"].createElement(FullScreenImages, {
     template: ImageTemplate,
     element: element,
     imageSlug: element["image-s3-key"],
     story: story
-  }), caption && /*#__PURE__*/React.createElement(CaptionAttribution, {
+  }), caption && /*#__PURE__*/React__default["default"].createElement(CaptionAttribution, {
     element: element,
     config: configData
   }));
 };
 
 ImageBase.propTypes = {
-  element: PropTypes.shape({
-    "image-s3-key": PropTypes.string,
-    "image-metadata": PropTypes.object,
-    "image-attribution": PropTypes.string,
-    title: PropTypes.string,
-    hyperlink: PropTypes.string
+  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.bool,
-  opts: PropTypes.shape({
-    imageWidths: PropTypes.array
+  caption: PropTypes__default["default"].bool,
+  opts: PropTypes__default["default"].shape({
+    imageWidths: PropTypes__default["default"].array
   }),
   story: shapeStory,
   config: shapeConfig
@@ -6923,14 +6951,14 @@ var QuestionAnswerBase = function QuestionAnswerBase(_ref) {
   var isAuthorImageTemplate = template === "withAuthorImage";
   var templateStyle = isAuthorImageTemplate ? "qa-withAuthorImage" : "qa-default";
   var iconType = defaultIconType === "curve" ? "curveIcon" : "edgeIcon";
-  var supportQuestionElement = isAuthorImageTemplate ? questionAttribution && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+  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.createElement("img", {
+  }, /*#__PURE__*/React__default["default"].createElement("img", {
     src: questionAttribution,
     loading: "lazy"
-  })), /*#__PURE__*/React.createElement("span", {
+  })), /*#__PURE__*/React__default["default"].createElement("span", {
     className: "question-answer-m_hidden__K0n4n"
-  })) : /*#__PURE__*/React.createElement("div", {
+  })) : /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": iconType,
     style: {
       backgroundColor: iconColor
@@ -6938,36 +6966,36 @@ var QuestionAnswerBase = function QuestionAnswerBase(_ref) {
     className: _getClassName("".concat(iconType, " ").concat(theme), _styleModuleImportMap$8)
   }, "Q"); // EMPTY SPAN FOR EXTRA SPACE
 
-  var supportAnswerElement = isAuthorImageTemplate ? answerAttribution && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+  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.createElement("img", {
+  }, /*#__PURE__*/React__default["default"].createElement("img", {
     src: answerAttribution,
     loading: "lazy"
-  })), /*#__PURE__*/React.createElement("span", {
+  })), /*#__PURE__*/React__default["default"].createElement("span", {
     className: "question-answer-m_hidden__K0n4n"
-  })) : /*#__PURE__*/React.createElement("div", {
+  })) : /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": iconType,
     style: {
       backgroundColor: iconColor
     },
     className: _getClassName("".concat(iconType, " ").concat(theme), _styleModuleImportMap$8)
   }, "A");
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     "data-test-id": "question-answer"
   }, restProps, {
     className: "arrow-component arr-custom-style arr--qa-element " + _getClassName(templateStyle, _styleModuleImportMap$8) + (" " + (restProps ? restProps.className || "" : ""))
-  }), type !== "answer" && /*#__PURE__*/React.createElement("div", {
+  }), type !== "answer" && /*#__PURE__*/React__default["default"].createElement("div", {
     className: "question-answer-m_q-element__1ZA5d",
     "data-test-id": "question"
-  }, supportQuestionElement, /*#__PURE__*/React.createElement("div", {
+  }, supportQuestionElement, /*#__PURE__*/React__default["default"].createElement("div", {
     dangerouslySetInnerHTML: {
       __html: questionData
     },
     className: _getClassName("content ".concat(textInvertColor), _styleModuleImportMap$8)
-  })), type !== "question" && /*#__PURE__*/React.createElement("div", {
+  })), type !== "question" && /*#__PURE__*/React__default["default"].createElement("div", {
     className: "question-answer-m_a-element__BTxfl",
     "data-test-id": "answer"
-  }, supportAnswerElement, /*#__PURE__*/React.createElement("div", {
+  }, supportAnswerElement, /*#__PURE__*/React__default["default"].createElement("div", {
     dangerouslySetInnerHTML: {
       __html: answerData
     },
@@ -6976,29 +7004,29 @@ var QuestionAnswerBase = function QuestionAnswerBase(_ref) {
 };
 
 QuestionAnswerBase.propTypes = {
-  element: PropTypes.shape({
-    metadata: PropTypes.shape({
-      interviewer: PropTypes.shape({
-        "avatar-url": PropTypes.string
+  element: PropTypes__default["default"].shape({
+    metadata: PropTypes__default["default"].shape({
+      interviewer: PropTypes__default["default"].shape({
+        "avatar-url": PropTypes__default["default"].string
       }),
-      interviewee: PropTypes.shape({
-        "avatar-url": PropTypes.string
+      interviewee: PropTypes__default["default"].shape({
+        "avatar-url": PropTypes__default["default"].string
       }),
-      question: PropTypes.string,
-      answer: PropTypes.string
+      question: PropTypes__default["default"].string,
+      answer: PropTypes__default["default"].string
     }),
-    text: PropTypes.string
+    text: PropTypes__default["default"].string
   }),
-  opts: PropTypes.shape({
-    type: PropTypes.string,
-    defaultIconType: PropTypes.string,
-    isExternalLink: PropTypes.bool
+  opts: PropTypes__default["default"].shape({
+    type: PropTypes__default["default"].string,
+    defaultIconType: PropTypes__default["default"].string,
+    isExternalLink: PropTypes__default["default"].bool
   }),
-  template: PropTypes.string,
-  css: PropTypes.object,
+  template: PropTypes__default["default"].string,
+  css: PropTypes__default["default"].object,
   config: shapeConfig,
   story: shapeStory,
-  render: PropTypes.func
+  render: PropTypes__default["default"].func
 };
 var QuestionAnswer = withElementWrapper(QuestionAnswerBase);
 
@@ -7040,17 +7068,17 @@ var ImageGalleryBase = function ImageGalleryBase(_ref) {
   var ImageGalleryImagesTemplate = function ImageGalleryImagesTemplate(_ref2) {
     var onClickHandler = _ref2.onClickHandler;
     var images = renderImage.map(function (image, index) {
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         key: index,
         className: _getClassName(hyperlinkClass(image["hyperlink"]), _styleModuleImportMap$7)
-      }, /*#__PURE__*/React.createElement("figure", {
+      }, /*#__PURE__*/React__default["default"].createElement("figure", {
         key: index,
         "data-text-id": "image-".concat(index),
         onClick: function onClick() {
           return onClickHandler && onClickHandler(index);
         },
         className: _getClassName("image ".concat(classes), _styleModuleImportMap$7)
-      }, /*#__PURE__*/React.createElement(ResponsiveImage, {
+      }, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
         slug: image["image-s3-key"],
         metadata: image["image-metadata"],
         alt: image["title"],
@@ -7059,11 +7087,11 @@ var ImageGalleryBase = function ImageGalleryBase(_ref) {
         imgParams: {
           auto: ["format", "compress"]
         }
-      })), image["hyperlink"] && /*#__PURE__*/React.createElement(HyperLink, {
+      })), image["hyperlink"] && /*#__PURE__*/React__default["default"].createElement(HyperLink, {
         hyperLink: image["hyperlink"]
       }));
     });
-    return /*#__PURE__*/React.createElement("div", _extends({
+    return /*#__PURE__*/React__default["default"].createElement("div", _extends({
       className: " arrow-component arr--image-element image-gallery-m_image-gallery__1Q7if" + (" " + (restProps ? restProps.className || "" : ""))
     }, restProps, {
       "data-test-id": "image-gallery"
@@ -7071,24 +7099,24 @@ var ImageGalleryBase = function ImageGalleryBase(_ref) {
   };
 
   ImageGalleryImagesTemplate.propTypes = {
-    onClickHandler: PropTypes.func
+    onClickHandler: PropTypes__default["default"].func
   };
-  return /*#__PURE__*/React.createElement(FullScreenImages, {
+  return /*#__PURE__*/React__default["default"].createElement(FullScreenImages, {
     template: ImageGalleryImagesTemplate,
     element: element
   });
 };
 
 ImageGalleryBase.propTypes = {
-  element: PropTypes.shape({
-    "story-elements": PropTypes.array
+  element: PropTypes__default["default"].shape({
+    "story-elements": PropTypes__default["default"].array
   }),
-  opts: PropTypes.shape({
-    imageWidths: PropTypes.array
+  opts: PropTypes__default["default"].shape({
+    imageWidths: PropTypes__default["default"].array
   }),
   story: shapeStory,
   config: shapeConfig,
-  template: PropTypes.string
+  template: PropTypes__default["default"].string
 };
 var ImageGallery = withElementWrapper(ImageGalleryBase);
 
@@ -7100,16 +7128,16 @@ var StoryElementBase = function StoryElementBase(_ref) {
       _ref.config;
       var restProps = _objectWithoutProperties(_ref, _excluded$3);
 
-  return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({}, restProps, {
     "data-test-id": "story-elements"
-  }), /*#__PURE__*/React.createElement(StoryElement$1, {
+  }), /*#__PURE__*/React__default["default"].createElement(components.StoryElement, {
     element: element
   }));
 };
 
 var StoryElement = withElementWrapper(StoryElementBase);
 StoryElementBase.propTypes = {
-  element: PropTypes.object,
+  element: PropTypes__default["default"].object,
   story: shapeStory,
   config: shapeConfig
 };
@@ -7151,16 +7179,16 @@ var QuoteBase = function QuoteBase(_ref) {
   var borderColor = css.borderColor;
   var updateBorderColor = template === "borderLeft" && "4px solid ".concat(borderColor);
   var templateStyle = template ? "quote-".concat(template) : "quote";
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     "data-test-id": "quote"
   }, restProps, {
     className: "arrow-component arr--quote-element " + _getClassName(templateStyle, _styleModuleImportMap$6) + (" " + (restProps ? restProps.className || "" : ""))
-  }), template === "borderTopSmall" && /*#__PURE__*/React.createElement("div", {
+  }), template === "borderTopSmall" && /*#__PURE__*/React__default["default"].createElement("div", {
     className: "quote-m_line__3gtoE",
     style: borderColor && {
       backgroundColor: borderColor
     }
-  }), /*#__PURE__*/React.createElement("p", {
+  }), /*#__PURE__*/React__default["default"].createElement("p", {
     style: borderColor && {
       borderLeft: updateBorderColor
     },
@@ -7168,26 +7196,26 @@ var QuoteBase = function QuoteBase(_ref) {
       __html: content
     },
     className: _getClassName("text ".concat(textInvertColor), _styleModuleImportMap$6)
-  }), /*#__PURE__*/React.createElement("p", {
+  }), /*#__PURE__*/React__default["default"].createElement("p", {
     "data-test-id": "quote-attribution",
     className: _getClassName("attribution ".concat(textInvertColor), _styleModuleImportMap$6)
   }, attribution));
 };
 
 QuoteBase.propTypes = {
-  element: PropTypes.shape({
-    metadata: PropTypes.shape({
-      content: PropTypes.string,
-      attribution: PropTypes.string
+  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.string,
+  template: PropTypes__default["default"].string,
   story: shapeStory,
   config: shapeConfig,
-  render: PropTypes.func,
-  css: PropTypes.object
+  render: PropTypes__default["default"].func,
+  css: PropTypes__default["default"].object
 };
 var Quote = withElementWrapper(QuoteBase);
 
@@ -7221,7 +7249,7 @@ var ReferenceBase = function ReferenceBase(_ref) {
   var _opts$showHeadline = opts.showHeadline,
       showHeadline = _opts$showHeadline === void 0 ? true : _opts$showHeadline,
       headlineText = opts.headlineText;
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     className: "arrow-component arr--reference-element"
   }, restProps), eleArr && eleArr.map(function (metadata, index) {
     var _metadata$name = metadata.name,
@@ -7229,33 +7257,33 @@ var ReferenceBase = function ReferenceBase(_ref) {
         _metadata$description = metadata.description,
         description = _metadata$description === void 0 ? "" : _metadata$description,
         url = metadata.url;
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       key: index,
       className: _getClassName("wrapper ".concat(textInvertColor), _styleModuleImportMap$5)
-    }, /*#__PURE__*/React.createElement(Link, {
+    }, /*#__PURE__*/React__default["default"].createElement(components.Link, {
       href: url,
       "aria-label": "reference-headline"
-    }, showHeadline && /*#__PURE__*/React.createElement("div", {
+    }, showHeadline && /*#__PURE__*/React__default["default"].createElement("div", {
       className: "reference-m_name__24IwG",
       "data-test-id": "ref-headline"
-    }, headlineText || name), /*#__PURE__*/React.createElement("div", {
+    }, headlineText || name), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "reference-m_description__2x3Io"
     }, description)));
   }));
 };
 
 ReferenceBase.propTypes = {
-  element: PropTypes.shape({
-    "story-elements": PropTypes.arrayOf(PropTypes.shape({
-      metadata: PropTypes.shape({
-        name: PropTypes.string,
-        description: PropTypes.string,
-        url: PropTypes.string
+  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.shape({
-    hideHeadline: PropTypes.bool
+  opts: PropTypes__default["default"].shape({
+    hideHeadline: PropTypes__default["default"].bool
   }),
   config: shapeConfig
 };
@@ -7297,28 +7325,28 @@ var AttachmentBase = function AttachmentBase(_ref) {
   var textColor = getTextColor(configData.theme);
   var defaultName = isPdf ? "Attached PDF" : "Attached DOC";
   var defaultFileName = fileName || defaultName;
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React__default["default"].createElement("div", _extends({
     "data-test-id": "attachment"
   }, restProps, {
     className: "arrow-component arr--attachment-element " + _getClassName(textColor, _styleModuleImportMap$4) + (" " + (restProps ? restProps.className || "" : ""))
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "attachment-m_headline__kP7Hs"
-  }, "Attachment"), /*#__PURE__*/React.createElement("div", {
+  }, "Attachment"), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "attachment-m_wrapper__3gMwN"
-  }, isPdf ? /*#__PURE__*/React.createElement("div", {
+  }, isPdf ? /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "pdf",
     className: "attachment-m_pdf__3i_bR"
-  }, "PDF") : /*#__PURE__*/React.createElement("div", {
+  }, "PDF") : /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": "doc",
     className: "attachment-m_doc__6vUVo attachment-m_pdf__3i_bR"
-  }, "DOC"), /*#__PURE__*/React.createElement("div", {
+  }, "DOC"), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "attachment-m_content-wrapper__3Yu0B"
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "attachment-m_file-name__1LU9q",
     dangerouslySetInnerHTML: {
       __html: defaultFileName
     }
-  }), /*#__PURE__*/React.createElement(Link, {
+  }), /*#__PURE__*/React__default["default"].createElement(components.Link, {
     className: "attachment-m_button-wrapper__2fajK",
     href: url,
     target: "_blank",
@@ -7329,59 +7357,59 @@ var AttachmentBase = function AttachmentBase(_ref) {
 };
 
 AttachmentBase.propTypes = {
-  element: PropTypes.shape({
-    url: PropTypes.string,
-    fileName: PropTypes.string,
-    contentType: PropTypes.string
+  element: PropTypes__default["default"].shape({
+    url: PropTypes__default["default"].string,
+    fileName: PropTypes__default["default"].string,
+    contentType: PropTypes__default["default"].string
   }),
-  render: PropTypes.func
+  render: PropTypes__default["default"].func
 };
 var Attachment = withElementWrapper(AttachmentBase);
 
 var LeftArrow = function LeftArrow(_ref) {
   var _ref$color = _ref.color,
       color = _ref$color === void 0 ? "#333" : _ref$color;
-  return /*#__PURE__*/React.createElement("svg", {
+  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.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", {
     fill: "none",
     fillRule: "nonzero"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
     d: "M17 20H-7V-4h24z",
     opacity: ".384"
-  }), /*#__PURE__*/React.createElement("path", {
+  }), /*#__PURE__*/React__default["default"].createElement("path", {
     stroke: color,
     d: "M9 16L1 8l8-8"
   })));
 };
 LeftArrow.propTypes = {
-  color: PropTypes.string
+  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.createElement("svg", {
+  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.createElement("g", {
+  }, /*#__PURE__*/React__default["default"].createElement("g", {
     fill: "none",
     fillRule: "nonzero"
-  }, /*#__PURE__*/React.createElement("path", {
+  }, /*#__PURE__*/React__default["default"].createElement("path", {
     d: "M-7-4h24v24H-7z",
     opacity: ".384"
-  }), /*#__PURE__*/React.createElement("path", {
+  }), /*#__PURE__*/React__default["default"].createElement("path", {
     stroke: color,
     d: "M1 0l8 8-8 8"
   })));
 };
 RightArrow.propTypes = {
-  color: PropTypes.string
+  color: PropTypes__default["default"].string
 };
 
 var _styleModuleImportMap$3 = {
@@ -7419,26 +7447,26 @@ var SliderArrow = function SliderArrow(_ref) {
 
   var getLeftArrowClassName = languageDirection === "rtl" ? "left-arrow-rtl" : "left-arrow-ltr";
   var getRightArrowClassName = languageDirection === "rtl" ? "right-arrow-rtl" : "right-arrow-ltr";
-  return /*#__PURE__*/React.createElement(React.Fragment, null, selectedIndex !== 0 ? /*#__PURE__*/React.createElement("button", {
+  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("arrow left-arrow-".concat(textColor, " ").concat(getLeftArrowClassName), _styleModuleImportMap$3)
-  }, /*#__PURE__*/React.createElement(LeftArrow, {
+  }, /*#__PURE__*/React__default["default"].createElement(LeftArrow, {
     color: textColor === "dark" ? "#fff" : "#333"
-  })) : null, selectedIndex < noOfItems - 1 && rightArrowView() ? /*#__PURE__*/React.createElement("button", {
+  })) : null, selectedIndex < noOfItems - 1 && rightArrowView() ? /*#__PURE__*/React__default["default"].createElement("button", {
     onClick: nextClick,
     className: ("right-arrow ".concat(getRightArrowClassName) ? "right-arrow ".concat(getRightArrowClassName) + " " : "") + _getClassName("arrow right-arrow-".concat(textColor, " ").concat(getRightArrowClassName), _styleModuleImportMap$3)
-  }, /*#__PURE__*/React.createElement(RightArrow, {
+  }, /*#__PURE__*/React__default["default"].createElement(RightArrow, {
     color: textColor === "dark" ? "#fff" : "#333"
   })) : null);
 };
 SliderArrow.propTypes = {
-  noOfItems: number,
-  perView: number,
-  slideIndicator: string,
-  previousClick: func,
-  nextClick: func,
-  selectedIndex: number,
-  languageDirection: string
+  noOfItems: PropTypes.number,
+  perView: PropTypes.number,
+  slideIndicator: PropTypes.string,
+  previousClick: PropTypes.func,
+  nextClick: PropTypes.func,
+  selectedIndex: PropTypes.number,
+  languageDirection: PropTypes.string
 };
 
 var _styleModuleImportMap$2 = {
@@ -7466,27 +7494,27 @@ var SliderIndicator = function SliderIndicator(_ref) {
 
   var config = useStateValue() || {};
   var textColor = getTextColor(config.theme);
-  return /*#__PURE__*/React.createElement("ul", {
+  return /*#__PURE__*/React__default["default"].createElement("ul", {
     className: "slider-indicators slider-indicator-m_indicators__3MNXc"
   }, indicatorItems.map(function (_, index) {
-    return /*#__PURE__*/React.createElement("li", {
+    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.createElement("button", {
+    }, /*#__PURE__*/React__default["default"].createElement("button", {
       "aria-pressed": selectedIndex === index ? "true" : "false",
       className: ("indicator-button indicator-".concat(indicatorType) ? "indicator-button indicator-".concat(indicatorType) + " " : "") + _getClassName("indicator-button indicator-".concat(indicatorType, " indicator-").concat(indicatorType, "-").concat(textColor), _styleModuleImportMap$2)
     }));
   }));
 };
 SliderIndicator.propTypes = {
-  indicatorItems: array,
-  perView: number,
-  indicatorType: string,
-  indicatorClick: func,
-  selectedIndex: number
+  indicatorItems: PropTypes.array,
+  perView: PropTypes.number,
+  indicatorType: PropTypes.string,
+  indicatorClick: PropTypes.func,
+  selectedIndex: PropTypes.number
 };
 
 var smoothScroll = function smoothScroll(node, topOrLeft, horizontal) {
@@ -7521,24 +7549,24 @@ var ScrollSnap = function ScrollSnap(_ref) {
       perView = _ref.perView,
       slideIndicator = _ref.slideIndicator;
 
-  var _useState = useState(0),
+  var _useState = React.useState(0),
       _useState2 = _slicedToArray(_useState, 2),
       selectedIndex = _useState2[0],
       setSelectedIndex = _useState2[1];
 
-  var _useState3 = useState(false),
+  var _useState3 = React.useState(false),
       _useState4 = _slicedToArray(_useState3, 2),
       autoScroll = _useState4[0],
       setAutoScroll = _useState4[1];
 
-  var languageDirection = useSelector(function (state) {
+  var languageDirection = reactRedux.useSelector(function (state) {
     return get_1(state, ["qt", "config", "language", "direction"], "ltr");
   });
   var noOfItems = children ? children.length : 0;
-  var scroller = useRef(null);
+  var scroller = React.useRef(null);
   var numberOfIndicatorsToShow = children.length - (perView - 1);
   var indicatorItems = children.slice(0, numberOfIndicatorsToShow);
-  useEffect(function () {
+  React.useEffect(function () {
     if (scroller.current) {
       scroller.current.addEventListener("scroll", setIndicatorValue(function () {
         var value = Math.round(scroller.current.scrollLeft / scroller.current.scrollWidth * noOfItems);
@@ -7555,7 +7583,7 @@ var ScrollSnap = function ScrollSnap(_ref) {
     };
   }, []); // Infinite scroll
 
-  useEffect(function () {
+  React.useEffect(function () {
     if (isInfinite && !autoScroll) {
       var timer = setInterval(function () {
         infiniteScroll();
@@ -7604,23 +7632,23 @@ var ScrollSnap = function ScrollSnap(_ref) {
     updateItemSelection(newIndex, languageDirection, scroller, noOfItems);
   };
 
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "scroll-snap-container"
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "scroll-snap-wrapper scroll-snap-m_wrapper__1Rz9v",
     onMouseEnter: pauseAutoPlay,
     onMouseLeave: pauseAutoPlay
-  }, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
     ref: scroller,
     className: "scroll-snap-carousel scroll-snap-m_carousel__2m3cg"
-  }, children), isArrow && /*#__PURE__*/React.createElement(SliderArrow, {
+  }, 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.createElement(SliderIndicator, {
+  })), children.length > perView && slideIndicator !== "none" && /*#__PURE__*/React__default["default"].createElement(SliderIndicator, {
     indicatorItems: indicatorItems,
     indicatorClick: indicatorClick,
     selectedIndex: selectedIndex,
@@ -7636,13 +7664,13 @@ ScrollSnap.defaultProps = {
   slideIndicator: "dots"
 };
 ScrollSnap.propTypes = {
-  children: array.isRequired,
-  isArrow: bool,
-  isInfinite: bool,
-  interval: number,
-  pauseOnHover: bool,
-  perView: number,
-  slideIndicator: string
+  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) {
@@ -7655,18 +7683,18 @@ var ImageSlideshowBase = function ImageSlideshowBase(props) {
         title = image.title,
         _image$hyperlink = image.hyperlink,
         hyperlink = _image$hyperlink === void 0 ? "" : _image$hyperlink;
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "image-slideshow-m_slide__3URCC",
       key: id
-    }, /*#__PURE__*/React.createElement("figure", {
+    }, /*#__PURE__*/React__default["default"].createElement("figure", {
       key: id,
       className: "image-slideshow-m_image-container__2VTEK",
       onClick: function onClick() {
         return onClickHandler(index);
       }
-    }, /*#__PURE__*/React.createElement(LazyLoadImages, {
+    }, /*#__PURE__*/React__default["default"].createElement(components.LazyLoadImages, {
       margin: "0px"
-    }, /*#__PURE__*/React.createElement(ResponsiveImage, {
+    }, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
       slug: imageS3Key,
       metadata: metadata,
       "aspect-ratio": [16, 9],
@@ -7677,9 +7705,9 @@ var ImageSlideshowBase = function ImageSlideshowBase(props) {
       },
       className: "image-slideshow-m_image__1p1fO",
       alt: title
-    }))), hyperlink && /*#__PURE__*/React.createElement(HyperLink, {
+    }))), hyperlink && /*#__PURE__*/React__default["default"].createElement(HyperLink, {
       hyperLink: hyperlink
-    }), /*#__PURE__*/React.createElement("p", {
+    }), /*#__PURE__*/React__default["default"].createElement("p", {
       className: "image-slideshow-m_caption__mWpmc",
       dangerouslySetInnerHTML: {
         __html: title
@@ -7690,10 +7718,10 @@ var ImageSlideshowBase = function ImageSlideshowBase(props) {
   var ImageSlideshowTemplate = function ImageSlideshowTemplate(_ref) {
     var onClickHandler = _ref.onClickHandler;
     var storyElements = get_1(props, ["element", "story-elements"], []);
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "arr--image-slideshow-element image-slideshow-m_slideshow__3jRFX",
       "data-test-id": "image-slideshow"
-    }, /*#__PURE__*/React.createElement(ScrollSnap, {
+    }, /*#__PURE__*/React__default["default"].createElement(ScrollSnap, {
       slideIndicator: "none"
     }, storyElements.map(function (image, index) {
       return Slide(image, index, onClickHandler);
@@ -7701,17 +7729,17 @@ var ImageSlideshowBase = function ImageSlideshowBase(props) {
   };
 
   ImageSlideshowTemplate.propTypes = {
-    onClickHandler: PropTypes.func
+    onClickHandler: PropTypes__default["default"].func
   };
-  return /*#__PURE__*/React.createElement(FullScreenImages, {
+  return /*#__PURE__*/React__default["default"].createElement(FullScreenImages, {
     template: ImageSlideshowTemplate,
     element: props.element
   });
 };
 
 ImageSlideshowBase.propTypes = {
-  element: PropTypes.shape({
-    "story-elements": PropTypes.array
+  element: PropTypes__default["default"].shape({
+    "story-elements": PropTypes__default["default"].array
   }),
   story: shapeStory
 };
@@ -7769,12 +7797,12 @@ var getElement = function getElement(story, element) {
 
   switch (elementType) {
     case "ad":
-      return /*#__PURE__*/React.createElement(AdComponent, _extends({}, element, {
+      return /*#__PURE__*/React__default["default"].createElement(AdComponent, _extends({}, element, {
         id: "ad-".concat(index, "_").concat(cardId)
       }));
 
     case "widget":
-      return /*#__PURE__*/React.createElement(WidgetComp, {
+      return /*#__PURE__*/React__default["default"].createElement(WidgetComp, {
         widgetCode: element.config.customCode,
         id: "widget-".concat(index, "_").concat(cardId)
       });
@@ -7787,7 +7815,7 @@ var getElement = function getElement(story, element) {
           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.createElement(Text, {
+      return /*#__PURE__*/React__default["default"].createElement(Text, {
         element: element,
         css: {
           textColor: textElementColor,
@@ -7808,7 +7836,7 @@ var getElement = function getElement(story, element) {
           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.createElement(Summary, {
+      return /*#__PURE__*/React__default["default"].createElement(Summary, {
         element: element,
         template: summaryTemplate,
         opts: {
@@ -7827,7 +7855,7 @@ var getElement = function getElement(story, element) {
       _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.createElement(Blurb, {
+      return /*#__PURE__*/React__default["default"].createElement(Blurb, {
         element: element,
         template: blurbTemplate,
         css: {
@@ -7846,7 +7874,7 @@ var getElement = function getElement(story, element) {
           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.createElement(BlockQuote, {
+      return /*#__PURE__*/React__default["default"].createElement(BlockQuote, {
         element: element,
         template: blockQuoteTemplate,
         css: {
@@ -7863,7 +7891,7 @@ var getElement = function getElement(story, element) {
       _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.createElement(Quote, {
+      return /*#__PURE__*/React__default["default"].createElement(Quote, {
         element: element,
         template: quoteTemplate,
         css: {
@@ -7872,7 +7900,7 @@ var getElement = function getElement(story, element) {
       });
 
     case "bigfact":
-      return /*#__PURE__*/React.createElement(BigFact, {
+      return /*#__PURE__*/React__default["default"].createElement(BigFact, {
         element: element
       });
 
@@ -7887,7 +7915,7 @@ var getElement = function getElement(story, element) {
       _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.createElement(AlsoRead, {
+      return /*#__PURE__*/React__default["default"].createElement(AlsoRead, {
         story: story,
         element: element,
         template: alsoReadTemplate,
@@ -7900,7 +7928,7 @@ var getElement = function getElement(story, element) {
       });
 
     case "image":
-      return /*#__PURE__*/React.createElement(Image, {
+      return /*#__PURE__*/React__default["default"].createElement(Image, {
         element: element
       });
 
@@ -7915,7 +7943,7 @@ var getElement = function getElement(story, element) {
       _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.createElement(QuestionAnswer, {
+      return /*#__PURE__*/React__default["default"].createElement(QuestionAnswer, {
         element: element,
         opts: {
           type: "q-and-a",
@@ -7938,7 +7966,7 @@ var getElement = function getElement(story, element) {
       _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.createElement(QuestionAnswer, {
+      return /*#__PURE__*/React__default["default"].createElement(QuestionAnswer, {
         element: element,
         opts: {
           type: "question",
@@ -7961,7 +7989,7 @@ var getElement = function getElement(story, element) {
       _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.createElement(QuestionAnswer, {
+      return /*#__PURE__*/React__default["default"].createElement(QuestionAnswer, {
         element: element,
         opts: {
           type: "answer",
@@ -7974,43 +8002,43 @@ var getElement = function getElement(story, element) {
       });
 
     case "gallery":
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "content-style",
         id: "image-gallery-".concat(storyElementId)
-      }, /*#__PURE__*/React.createElement(ImageGallery, {
+      }, /*#__PURE__*/React__default["default"].createElement(ImageGallery, {
         element: element
       }));
 
     case "slideshow":
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "content-style",
         id: "image-slideshow-".concat(storyElementId)
-      }, /*#__PURE__*/React.createElement(ImageSlideshow, {
+      }, /*#__PURE__*/React__default["default"].createElement(ImageSlideshow, {
         element: element
       }));
 
     case "youtube-video":
     case "dailymotion-video":
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "content-style",
         id: "video-".concat(storyElementId)
-      }, /*#__PURE__*/React.createElement(Video, {
+      }, /*#__PURE__*/React__default["default"].createElement(Video, {
         element: element,
         story: story,
         loadIframeOnClick: true
       }));
 
     case "attachment":
-      return /*#__PURE__*/React.createElement(Attachment, {
+      return /*#__PURE__*/React__default["default"].createElement(Attachment, {
         element: element
       });
 
     case "tweet":
     case "jsembed":
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "content-style",
         id: "jsembed-".concat(storyElementId)
-      }, /*#__PURE__*/React.createElement(StoryElement, {
+      }, /*#__PURE__*/React__default["default"].createElement(StoryElement, {
         element: element
       }));
 
@@ -8021,7 +8049,7 @@ var getElement = function getElement(story, element) {
           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.createElement(Reference, {
+      return /*#__PURE__*/React__default["default"].createElement(Reference, {
         element: element,
         opts: {
           showHeadline: showHeadline,
@@ -8030,10 +8058,10 @@ var getElement = function getElement(story, element) {
       });
 
     default:
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "content-style",
         id: "element-".concat(storyElementId)
-      }, /*#__PURE__*/React.createElement(StoryElement, {
+      }, /*#__PURE__*/React__default["default"].createElement(StoryElement, {
         element: element,
         story: story
       }));
@@ -8041,12 +8069,12 @@ var getElement = function getElement(story, element) {
 };
 
 ({
-  story: PropTypes.object,
-  imageElement: PropTypes.object,
-  config: PropTypes.object,
-  children: PropTypes.node,
-  card: PropTypes.shape({
-    id: PropTypes.string
+  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) {
@@ -8062,7 +8090,7 @@ var StoryElementCard = function StoryElementCard(_ref2) {
   var textColor = getTextColor(theme);
   var isLiveBlog = isLive ? "live-blog" : "";
   var shouldRunFBMobileVideoFix = true;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "arr--story-page-card-wrapper"
   }, get_1(card, ["story-elements"], []).map(function (element, index) {
     if (element.id === heroVideoElementId) return false;
@@ -8074,28 +8102,28 @@ var StoryElementCard = function StoryElementCard(_ref2) {
 
     var tableStyle = element && element.subtype === "table" ? "table" : "";
     var cardId = get_1(card, ["id"], "");
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       key: element.id,
       className: "arr--element-container " + _getClassName("element-container ".concat(isLiveBlog, " ").concat(tableStyle, " ").concat(textColor), _styleModuleImportMap$1)
     }, getElement(story, element, config, adComponent, widgetComp, index, cardId));
   }));
 };
 StoryElementCard.propTypes = {
-  story: PropTypes.object,
-  card: PropTypes.array,
-  heroVideoElementId: PropTypes.number,
-  config: PropTypes.object,
-  isLive: PropTypes.bool,
-  theme: PropTypes.string,
-  adComponent: PropTypes.func,
-  widgetComp: PropTypes.func
+  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
 };
 ({
-  story: PropTypes.object,
-  card: PropTypes.object,
-  config: PropTypes.object,
-  adComponent: PropTypes.func,
-  widgetComp: PropTypes.func
+  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,
@@ -8107,12 +8135,12 @@ var SlotAfterStory = function SlotAfterStory(_ref4) {
 
   switch (element.type) {
     case "ad":
-      return /*#__PURE__*/React.createElement(AdComponent, _extends({}, element, {
+      return /*#__PURE__*/React__default["default"].createElement(AdComponent, _extends({}, element, {
         id: "ad-after-story-".concat(id)
       }));
 
     case "widget":
-      return /*#__PURE__*/React.createElement(WidgetComp, {
+      return /*#__PURE__*/React__default["default"].createElement(WidgetComp, {
         widgetCode: element.config.customCode,
         id: "widget-after-story-".concat(id)
       });
@@ -8122,10 +8150,10 @@ var SlotAfterStory = function SlotAfterStory(_ref4) {
   }
 };
 SlotAfterStory.propTypes = {
-  id: PropTypes.string,
-  element: PropTypes.object,
-  AdComponent: PropTypes.func,
-  WidgetComp: PropTypes.func
+  id: PropTypes__default["default"].string,
+  element: PropTypes__default["default"].object,
+  AdComponent: PropTypes__default["default"].func,
+  WidgetComp: PropTypes__default["default"].func
 };
 
 var _styleModuleImportMap = {
@@ -8187,25 +8215,25 @@ var VideoStoryTemplateBase = function VideoStoryTemplateBase(_ref) {
       premiumStoryIconConfig = _config$premiumStoryI === void 0 ? {} : _config$premiumStoryI;
   var visibledCards = noOfVisibleCards < 0 ? story.cards : story.cards.slice(0, noOfVisibleCards);
   var storyId = get_1(story, ["id"], "");
-  var timezone = useSelector(function (state) {
+  var timezone = reactRedux.useSelector(function (state) {
     return get_1(state, ["qt", "data", "timezone"], null);
   });
 
   var HeroVideo = function HeroVideo() {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_hero-video__1rumO video-story-m_index-2__32Kzt",
       id: "video-".concat(get_1(heroVideo, ["id"]))
-    }, /*#__PURE__*/React.createElement(Video, {
+    }, /*#__PURE__*/React__default["default"].createElement(Video, {
       element: heroVideo,
       loadIframeOnClick: true
     }));
   };
 
   var SocialShareComponent = function SocialShareComponent() {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       id: "story-share-".concat(storyId),
       className: "content-style"
-    }, /*#__PURE__*/React.createElement(SocialShare, {
+    }, /*#__PURE__*/React__default["default"].createElement(components.SocialShare, {
       template: SocialShareTemplate,
       fullUrl: encodeURI(story.url),
       title: story.headline,
@@ -8217,37 +8245,37 @@ var VideoStoryTemplateBase = function VideoStoryTemplateBase(_ref) {
   };
 
   var HeaderCard = function HeaderCard() {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_header-details__1MgWw"
-    }, /*#__PURE__*/React.createElement(SectionTag, {
+    }, /*#__PURE__*/React__default["default"].createElement(SectionTag, {
       story: story
-    }), /*#__PURE__*/React.createElement(StoryHeadline, {
+    }), /*#__PURE__*/React__default["default"].createElement(StoryHeadline, {
       story: story,
       premiumStoryIconConfig: premiumStoryIconConfig
-    }), /*#__PURE__*/React.createElement(Subheadline, {
+    }), /*#__PURE__*/React__default["default"].createElement(Subheadline, {
       story: story,
       showFullContent: true
     }));
   };
 
   var StoryData = function StoryData() {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_story-details__2KI1H"
-    }, /*#__PURE__*/React.createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_author__3AscN"
-    }, authorCard && /*#__PURE__*/React.createElement(AuthorCard, {
+    }, authorCard && /*#__PURE__*/React__default["default"].createElement(AuthorCard, {
       story: story,
       template: authorDetails.template,
       opts: authorDetails.opts
-    })), /*#__PURE__*/React.createElement("div", {
+    })), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_timestamp-social-share__1Vma8"
-    }, /*#__PURE__*/React.createElement(PublishDetails, {
+    }, /*#__PURE__*/React__default["default"].createElement(PublishDetails, {
       story: story,
       opts: publishedDetails,
       template: "story",
       timezone: timezone
-    }), !verticalShare && /*#__PURE__*/React.createElement(SocialShareComponent, null)), visibledCards.map(function (card) {
-      return /*#__PURE__*/React.createElement(StoryElementCard, {
+    }), !verticalShare && /*#__PURE__*/React__default["default"].createElement(SocialShareComponent, null)), visibledCards.map(function (card) {
+      return /*#__PURE__*/React__default["default"].createElement(StoryElementCard, {
         heroVideoElementId: heroVideo.id,
         story: story,
         card: card,
@@ -8256,11 +8284,11 @@ var VideoStoryTemplateBase = function VideoStoryTemplateBase(_ref) {
         adComponent: adComponent,
         widgetComp: widgetComp
       });
-    }), firstChild, /*#__PURE__*/React.createElement("div", {
+    }), firstChild, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_story-tags__1OnlS"
-    }, /*#__PURE__*/React.createElement(StoryTags, {
+    }, /*#__PURE__*/React__default["default"].createElement(StoryTags, {
       tags: story.tags
-    }), /*#__PURE__*/React.createElement(SlotAfterStory, {
+    }), /*#__PURE__*/React__default["default"].createElement(SlotAfterStory, {
       id: story.id,
       element: story.customSlotAfterStory,
       AdComponent: adComponent,
@@ -8269,9 +8297,9 @@ var VideoStoryTemplateBase = function VideoStoryTemplateBase(_ref) {
   };
 
   var SideColumn = function SideColumn() {
-    return asideCollection && /*#__PURE__*/React.createElement("div", {
+    return asideCollection && /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_video-story-side-column__155nW"
-    }, /*#__PURE__*/React.createElement(AsideCollection, _extends({}, asideCollection, {
+    }, /*#__PURE__*/React__default["default"].createElement(AsideCollection, _extends({}, asideCollection, {
       widgetComp: widgetComp,
       adComponent: adComponent,
       sticky: true,
@@ -8281,11 +8309,11 @@ var VideoStoryTemplateBase = function VideoStoryTemplateBase(_ref) {
   };
 
   var heroPriorityTemplate = function heroPriorityTemplate() {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(HeroVideo, null), /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(HeroVideo, null), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_story-content-wrapper__g87mo"
-    }, /*#__PURE__*/React.createElement(HeaderCard, null), /*#__PURE__*/React.createElement(StoryData, null)), verticalShare && /*#__PURE__*/React.createElement(SocialShareComponent, null), asideCollection && /*#__PURE__*/React.createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement(HeaderCard, null), /*#__PURE__*/React__default["default"].createElement(StoryData, null)), verticalShare && /*#__PURE__*/React__default["default"].createElement(SocialShareComponent, null), asideCollection && /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_aside-collection__3ecnd video-story-m_tablet-index-2__2sPXB"
-    }, /*#__PURE__*/React.createElement(AsideCollection, _extends({
+    }, /*#__PURE__*/React__default["default"].createElement(AsideCollection, _extends({
       horizontal: true
     }, asideCollection, {
       widgetComp: widgetComp,
@@ -8296,19 +8324,19 @@ var VideoStoryTemplateBase = function VideoStoryTemplateBase(_ref) {
   };
 
   var headlinePriorityTemplate = function headlinePriorityTemplate() {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_story-content-wrapper__g87mo"
-    }, /*#__PURE__*/React.createElement(HeaderCard, null)), /*#__PURE__*/React.createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement(HeaderCard, null)), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_story-content-wrapper__g87mo video-story-m_index-2__32Kzt"
-    }, /*#__PURE__*/React.createElement(HeroVideo, null)), /*#__PURE__*/React.createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement(HeroVideo, null)), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_story-content-wrapper__g87mo"
-    }, /*#__PURE__*/React.createElement(StoryData, null)), verticalShare && /*#__PURE__*/React.createElement(SocialShareComponent, null), /*#__PURE__*/React.createElement(SideColumn, null));
+    }, /*#__PURE__*/React__default["default"].createElement(StoryData, null)), verticalShare && /*#__PURE__*/React__default["default"].createElement(SocialShareComponent, null), /*#__PURE__*/React__default["default"].createElement(SideColumn, null));
   };
 
   var defaultTemplate = function defaultTemplate() {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(HeroVideo, null), /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(HeroVideo, null), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "video-story-m_story-content-wrapper__g87mo"
-    }, /*#__PURE__*/React.createElement(HeaderCard, null), /*#__PURE__*/React.createElement(StoryData, null)), verticalShare && /*#__PURE__*/React.createElement(SocialShareComponent, null), /*#__PURE__*/React.createElement(SideColumn, null));
+    }, /*#__PURE__*/React__default["default"].createElement(HeaderCard, null), /*#__PURE__*/React__default["default"].createElement(StoryData, null)), verticalShare && /*#__PURE__*/React__default["default"].createElement(SocialShareComponent, null), /*#__PURE__*/React__default["default"].createElement(SideColumn, null));
   };
 
   var getStoryTemplate = function getStoryTemplate(templateType) {
@@ -8326,7 +8354,7 @@ var VideoStoryTemplateBase = function VideoStoryTemplateBase(_ref) {
 
   var templateClass = templateType && templateType !== "default" ? templateType : "default";
   var dataTestId = templateType ? "video-story-".concat(templateType) : "video-story";
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default["default"].createElement("div", {
     "data-test-id": dataTestId,
     style: {
       backgroundColor: theme
@@ -8335,18 +8363,19 @@ var VideoStoryTemplateBase = function VideoStoryTemplateBase(_ref) {
   }, getStoryTemplate(templateType));
 };
 VideoStoryTemplateBase.propTypes = {
-  story: PropTypes.object,
-  config: PropTypes.shape({
-    templateType: PropTypes.string,
-    authorCard: PropTypes.object,
-    asideCollection: PropTypes.object
+  story: PropTypes__default["default"].object,
+  config: PropTypes__default["default"].shape({
+    templateType: PropTypes__default["default"].string,
+    authorCard: PropTypes__default["default"].object,
+    asideCollection: PropTypes__default["default"].object
   }),
-  firstChild: PropTypes.node,
-  secondChild: PropTypes.node,
-  storyElementsConfig: PropTypes.object,
-  adComponent: PropTypes.func,
-  widgetComp: PropTypes.func
+  firstChild: PropTypes__default["default"].node,
+  secondChild: PropTypes__default["default"].node,
+  storyElementsConfig: PropTypes__default["default"].object,
+  adComponent: PropTypes__default["default"].func,
+  widgetComp: PropTypes__default["default"].func
 };
 var VideoStoryTemplate = StateProvider(VideoStoryTemplateBase);
 
-export { VideoStoryTemplate, VideoStoryTemplateBase };
+exports.VideoStoryTemplate = VideoStoryTemplate;
+exports.VideoStoryTemplateBase = VideoStoryTemplateBase;