@quintype/arrow 3.15.1-perf.2 → 3.15.1-perf.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/atoms/Author/index.js +38 -29
- package/atoms/AuthorWithTime/index.js +83 -73
- package/atoms/CollectionName/index.js +40 -30
- package/atoms/ExtendedLoadMore/{index-d0f6c865.js → index-3976fac4.js} +59 -51
- package/atoms/ExtendedLoadMore/{index-1e444d20.js → index-3c4ac692.js} +243 -208
- package/atoms/ExtendedLoadMore/index-4ddfe28d.js +93 -0
- package/atoms/ExtendedLoadMore/{index-c61a16dc.js → index-5c8eda4a.js} +88 -80
- package/atoms/ExtendedLoadMore/{index-1256e453.js → index-6e083738.js} +60 -52
- package/atoms/ExtendedLoadMore/{index-fd651f70.js → index-6ecceae4.js} +58 -50
- package/atoms/ExtendedLoadMore/{index-4356ce04.js → index-9e0d32b7.js} +76 -68
- package/atoms/ExtendedLoadMore/{index-beed3a68.js → index-a5c95f84.js} +70 -62
- package/atoms/ExtendedLoadMore/{index-0519e570.js → index-b22f1843.js} +70 -62
- package/atoms/ExtendedLoadMore/{index-e4cf9cb7.js → index-b5936059.js} +72 -64
- package/atoms/ExtendedLoadMore/{index-aba6b278.js → index-bc129cb8.js} +57 -49
- package/atoms/ExtendedLoadMore/{index-ad3c83c3.js → index-e7cde739.js} +74 -46
- package/atoms/ExtendedLoadMore/{index-c2f73d18.js → index-fee73a14.js} +62 -54
- package/atoms/ExtendedLoadMore/index.js +13 -5
- package/atoms/ExtendedLoadMore/styles.arrow.css +1 -1
- package/atoms/Headline/index.js +85 -76
- package/atoms/HeroImage/index.js +69 -60
- package/atoms/LoadmoreButton/index.js +32 -23
- package/atoms/ScrollSnap/index.js +72 -63
- package/atoms/SectionTag/index.js +34 -25
- package/atoms/Subheadline/index.js +31 -22
- package/atoms/TimeStamp/index.js +34 -24
- package/molecules/KeyEvents/index.js +72 -61
- package/molecules/PageIntroductionCard/index.js +43 -34
- package/molecules/SocialShareTemplate/index.js +97 -88
- package/molecules/StoryCard/index.js +242 -232
- package/molecules/StoryElementCard/index.js +512 -483
- package/molecules/StorycardContent/index.js +172 -162
- package/package.json +1 -1
- package/rows/AlternateCollectionFilter/index.js +345 -333
- package/rows/AsideCollection/index.js +340 -328
- package/rows/AstrologyCollection/index.js +321 -309
- package/rows/AuthorIntroductionCard/index.js +157 -148
- package/rows/AuthorsList/index.js +184 -174
- package/rows/CollectionFilter/index.js +361 -349
- package/rows/ElevenStories/index.js +357 -346
- package/rows/FourColFiveStories/index.js +304 -274
- package/rows/FourColGrid/index.js +351 -321
- package/rows/FourColPortraitStories/index.js +357 -327
- package/rows/FourColSixteenStories/index.js +288 -277
- package/rows/FourColTwelveStories/index.js +315 -304
- package/rows/FourStorySlider/index.js +358 -347
- package/rows/FourStorySliderPortrait/index.js +359 -348
- package/rows/FourTabbedBigStorySlider/index.js +322 -311
- package/rows/FullScreenSlider/index.js +336 -325
- package/rows/HalfScreenSlider/index.js +308 -297
- package/rows/ListComponent/index.js +322 -311
- package/rows/Listicles/index.js +150 -139
- package/rows/MagazineEditions/index.js +104 -93
- package/rows/MagazineHeaderCard/index.js +104 -93
- package/rows/MagazineWidget/index.js +326 -315
- package/rows/OneColStoryList/index.js +365 -335
- package/rows/OpinionCollection/index.js +250 -220
- package/rows/SixColSixStories/index.js +333 -303
- package/rows/StoryCollection/index.js +340 -328
- package/rows/TagIntroductionCard/index.js +30 -21
- package/rows/ThreeColFlexStories/index.js +348 -318
- package/rows/ThreeColFourteenStories/index.js +285 -274
- package/rows/ThreeColGrid/index.js +352 -322
- package/rows/ThreeColSevenStory/index.js +322 -311
- package/rows/ThreeColSixStories/index.js +323 -312
- package/rows/ThreeColTwelveStories/index.js +302 -291
- package/rows/TwoColFourStories/index.js +316 -305
- package/rows/TwoColFourStoryHighlight/index.js +317 -306
- package/rows/TwoColSevenStories/index.js +322 -311
- package/rows/TwoColSixStories/index.js +316 -305
- package/rows/TwoColTenStoriesSidebar/index.js +338 -327
- package/rows/TwoColThreeStories/index.js +316 -305
- package/story-elements/AlsoRead/index.js +70 -61
- package/story-elements/Attachment/index.js +40 -31
- package/story-elements/BigFact/index.js +35 -26
- package/story-elements/BlockQuote/index.js +61 -51
- package/story-elements/Blurb/index.js +36 -27
- package/story-elements/Image/index.js +113 -86
- package/story-elements/ImageGallery/index.js +98 -71
- package/story-elements/ImageSlideshow/index.js +147 -120
- package/story-elements/QuestionAnswer/index.js +55 -46
- package/story-elements/Quote/index.js +37 -28
- package/story-elements/Reference/index.js +40 -31
- package/story-elements/StoryElement/index.js +28 -19
- package/story-elements/Summary/index.js +40 -31
- package/story-elements/Text/index.js +34 -25
- package/story-elements/Video/index.js +29 -20
- package/story-templates/ListicleStoryTemplate/index.js +937 -908
- package/story-templates/LiveBlogStoryTemplate/index.js +942 -913
- package/story-templates/PhotoStoryTemplate/index.js +912 -883
- package/story-templates/TextStoryTemplate/index.js +931 -902
- package/story-templates/VideoStoryTemplate/index.js +897 -868
- package/atoms/ExtendedLoadMore/index-81eb3978.js +0 -86
|
@@ -1,9 +1,37 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var components = require('@quintype/components');
|
|
6
|
+
var React = require('react');
|
|
7
|
+
var reactRedux = require('react-redux');
|
|
8
|
+
var PropTypes = require('prop-types');
|
|
9
|
+
var Timeago = require('react-timeago');
|
|
10
|
+
var dateFnsTz = require('date-fns-tz');
|
|
11
|
+
|
|
12
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
13
|
+
|
|
14
|
+
function _interopNamespace(e) {
|
|
15
|
+
if (e && e.__esModule) return e;
|
|
16
|
+
var n = Object.create(null);
|
|
17
|
+
if (e) {
|
|
18
|
+
Object.keys(e).forEach(function (k) {
|
|
19
|
+
if (k !== 'default') {
|
|
20
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
21
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
22
|
+
enumerable: true,
|
|
23
|
+
get: function () { return e[k]; }
|
|
24
|
+
});
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
n["default"] = e;
|
|
29
|
+
return Object.freeze(n);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
33
|
+
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
34
|
+
var Timeago__default = /*#__PURE__*/_interopDefaultLegacy(Timeago);
|
|
7
35
|
|
|
8
36
|
function _extends() {
|
|
9
37
|
_extends = Object.assign || function (target) {
|
|
@@ -1711,14 +1739,14 @@ var Dot = function Dot(_ref) {
|
|
|
1711
1739
|
height = _ref$height === void 0 ? "3px" : _ref$height,
|
|
1712
1740
|
_ref$color = _ref.color,
|
|
1713
1741
|
color = _ref$color === void 0 ? "light" : _ref$color;
|
|
1714
|
-
return /*#__PURE__*/
|
|
1742
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1715
1743
|
className: _getClassName(color, _styleModuleImportMap$A)
|
|
1716
|
-
}, /*#__PURE__*/
|
|
1744
|
+
}, /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
1717
1745
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1718
1746
|
width: width,
|
|
1719
1747
|
height: height,
|
|
1720
1748
|
viewBox: "0 0 3 3"
|
|
1721
|
-
}, /*#__PURE__*/
|
|
1749
|
+
}, /*#__PURE__*/React__default["default"].createElement("circle", {
|
|
1722
1750
|
cx: "87",
|
|
1723
1751
|
cy: "9",
|
|
1724
1752
|
r: "1",
|
|
@@ -1729,43 +1757,43 @@ var Dot = function Dot(_ref) {
|
|
|
1729
1757
|
};
|
|
1730
1758
|
Dot.propTypes = {
|
|
1731
1759
|
/** height , width and color of the dot icon */
|
|
1732
|
-
color:
|
|
1733
|
-
width:
|
|
1734
|
-
height:
|
|
1760
|
+
color: PropTypes__default["default"].string,
|
|
1761
|
+
width: PropTypes__default["default"].string,
|
|
1762
|
+
height: PropTypes__default["default"].string
|
|
1735
1763
|
};
|
|
1736
1764
|
|
|
1737
1765
|
var Twitter = function Twitter(_ref) {
|
|
1738
1766
|
var _ref$color = _ref.color,
|
|
1739
1767
|
color = _ref$color === void 0 ? "#1CB7EB" : _ref$color;
|
|
1740
|
-
return /*#__PURE__*/
|
|
1768
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
1741
1769
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1742
1770
|
width: "24",
|
|
1743
1771
|
height: "24",
|
|
1744
1772
|
viewBox: "0 0 24 24"
|
|
1745
|
-
}, /*#__PURE__*/
|
|
1773
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
1746
1774
|
fill: color,
|
|
1747
1775
|
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"
|
|
1748
1776
|
}));
|
|
1749
1777
|
};
|
|
1750
1778
|
Twitter.propTypes = {
|
|
1751
|
-
color:
|
|
1779
|
+
color: PropTypes__default["default"].string
|
|
1752
1780
|
};
|
|
1753
1781
|
|
|
1754
|
-
var StateContext = /*#__PURE__*/createContext(); // eslint-disable-next-line react/display-name
|
|
1782
|
+
var StateContext = /*#__PURE__*/React.createContext(); // eslint-disable-next-line react/display-name
|
|
1755
1783
|
|
|
1756
1784
|
var StateProvider = function StateProvider(RowComponent) {
|
|
1757
1785
|
return function (props) {
|
|
1758
1786
|
return (
|
|
1759
1787
|
/*#__PURE__*/
|
|
1760
1788
|
// eslint-disable-next-line react/prop-types
|
|
1761
|
-
|
|
1789
|
+
React__default["default"].createElement(StateContext.Provider, {
|
|
1762
1790
|
value: props.config
|
|
1763
|
-
}, /*#__PURE__*/
|
|
1791
|
+
}, /*#__PURE__*/React__default["default"].createElement(RowComponent, props))
|
|
1764
1792
|
);
|
|
1765
1793
|
};
|
|
1766
1794
|
};
|
|
1767
1795
|
var useStateValue = function useStateValue() {
|
|
1768
|
-
return useContext(StateContext);
|
|
1796
|
+
return React.useContext(StateContext);
|
|
1769
1797
|
};
|
|
1770
1798
|
|
|
1771
1799
|
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
|
|
@@ -2824,15 +2852,15 @@ var isEmpty = function isEmpty(value) {
|
|
|
2824
2852
|
return value == null || // From standard.js: Always use === - but value == null is allowed to check null || undefined
|
|
2825
2853
|
_typeof(value) === "object" && Object.entries(value).length === 0 && value.constructor === Object || typeof value === "string" && value.trim().length === 0;
|
|
2826
2854
|
};
|
|
2827
|
-
var shapeConfig =
|
|
2828
|
-
"sketches-host":
|
|
2829
|
-
"cdn-name":
|
|
2830
|
-
"cdn-image":
|
|
2855
|
+
var shapeConfig = PropTypes__default["default"].shape({
|
|
2856
|
+
"sketches-host": PropTypes__default["default"].string,
|
|
2857
|
+
"cdn-name": PropTypes__default["default"].string,
|
|
2858
|
+
"cdn-image": PropTypes__default["default"].string
|
|
2831
2859
|
});
|
|
2832
|
-
var shapeStory =
|
|
2833
|
-
headline:
|
|
2834
|
-
"last-published-at":
|
|
2835
|
-
subheadline:
|
|
2860
|
+
var shapeStory = PropTypes__default["default"].shape({
|
|
2861
|
+
headline: PropTypes__default["default"].string,
|
|
2862
|
+
"last-published-at": PropTypes__default["default"].number,
|
|
2863
|
+
subheadline: PropTypes__default["default"].string
|
|
2836
2864
|
});
|
|
2837
2865
|
var getStoryUrl = function getStoryUrl(story) {
|
|
2838
2866
|
var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
|
|
@@ -2925,17 +2953,17 @@ var getTimeStamp = function getTimeStamp(date, _formatter) {
|
|
|
2925
2953
|
var timezone = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
|
|
2926
2954
|
|
|
2927
2955
|
if (timezone && template === "story") {
|
|
2928
|
-
var zonedTime = timezone && utcToZonedTime(date, timezone);
|
|
2929
|
-
var formatZonedTime = zonedTime && format(zonedTime, "yyyy-MM-dd'T'HH:mm:ssXXX", {
|
|
2956
|
+
var zonedTime = timezone && dateFnsTz.utcToZonedTime(date, timezone);
|
|
2957
|
+
var formatZonedTime = zonedTime && dateFnsTz.format(zonedTime, "yyyy-MM-dd'T'HH:mm:ssXXX", {
|
|
2930
2958
|
timeZone: timezone
|
|
2931
2959
|
});
|
|
2932
2960
|
var timeStamp = timestampToFormat("", "", "", date, config);
|
|
2933
|
-
return /*#__PURE__*/
|
|
2961
|
+
return /*#__PURE__*/React__default["default"].createElement("time", {
|
|
2934
2962
|
dateTime: formatZonedTime
|
|
2935
2963
|
}, timeStamp);
|
|
2936
2964
|
}
|
|
2937
2965
|
|
|
2938
|
-
return /*#__PURE__*/
|
|
2966
|
+
return /*#__PURE__*/React__default["default"].createElement(Timeago__default["default"], {
|
|
2939
2967
|
date: date,
|
|
2940
2968
|
formatter: function formatter(value, unit, suffix, date) {
|
|
2941
2969
|
return _formatter(value, unit, suffix, date, config);
|
|
@@ -2974,9 +3002,9 @@ var authorImage = function authorImage(author) {
|
|
|
2974
3002
|
return null;
|
|
2975
3003
|
}
|
|
2976
3004
|
|
|
2977
|
-
return /*#__PURE__*/
|
|
3005
|
+
return /*#__PURE__*/React__default["default"].createElement("figure", {
|
|
2978
3006
|
"data-test-id": "author-image"
|
|
2979
|
-
}, avatarS3Key ? /*#__PURE__*/
|
|
3007
|
+
}, avatarS3Key ? /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
|
|
2980
3008
|
slug: avatarS3Key,
|
|
2981
3009
|
"aspect-ratio": [1, 1],
|
|
2982
3010
|
defaultWidth: 48,
|
|
@@ -2984,7 +3012,7 @@ var authorImage = function authorImage(author) {
|
|
|
2984
3012
|
auto: ["format", "compress"]
|
|
2985
3013
|
},
|
|
2986
3014
|
alt: authorName
|
|
2987
|
-
}) : /*#__PURE__*/
|
|
3015
|
+
}) : /*#__PURE__*/React__default["default"].createElement("img", {
|
|
2988
3016
|
src: avatarUrl
|
|
2989
3017
|
}));
|
|
2990
3018
|
};
|
|
@@ -3011,60 +3039,60 @@ var AuthorCard = function AuthorCard(_ref) {
|
|
|
3011
3039
|
_opts$showName = opts.showName,
|
|
3012
3040
|
showName = _opts$showName === void 0 ? true : _opts$showName;
|
|
3013
3041
|
var textColor = getTextColor(configData.theme);
|
|
3014
|
-
return /*#__PURE__*/
|
|
3042
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3015
3043
|
"data-test-id": "author-card-".concat(kebabCase_1(template)),
|
|
3016
3044
|
className: (clazzName ? clazzName + " " : "") + _getClassName("author-card-wrapper ".concat(template), _styleModuleImportMap$z)
|
|
3017
3045
|
}, authors.map(function (author, index) {
|
|
3018
|
-
return /*#__PURE__*/
|
|
3046
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
|
|
3019
3047
|
key: author.id
|
|
3020
|
-
}, showImage && (author["avatar-url"] || author["avatar-s3-key"]) && /*#__PURE__*/
|
|
3048
|
+
}, showImage && (author["avatar-url"] || author["avatar-s3-key"]) && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3021
3049
|
"data-test-id": "author-image",
|
|
3022
3050
|
className: "author-card-m_author-image-wrapper__1at-z"
|
|
3023
|
-
}, /*#__PURE__*/
|
|
3051
|
+
}, /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
3024
3052
|
href: "".concat(mountAt, "/author/") + author.slug,
|
|
3025
3053
|
key: "author-image-".concat(index),
|
|
3026
3054
|
"aria-label": "author-image"
|
|
3027
|
-
}, /*#__PURE__*/
|
|
3055
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3028
3056
|
className: _getClassName("author-image ".concat(!index ? "first-author-image" : "", " ").concat(!isSingleAuthor ? "multi-author-image" : ""), _styleModuleImportMap$z)
|
|
3029
3057
|
}, authorImage(author)))));
|
|
3030
|
-
}), showName && /*#__PURE__*/
|
|
3058
|
+
}), showName && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3031
3059
|
"data-test-id": "author-name",
|
|
3032
3060
|
className: "author-card-m_author-name-share__3vb9q"
|
|
3033
3061
|
}, authors.map(function (author, index) {
|
|
3034
3062
|
var spaceHolder = ",\xA0";
|
|
3035
|
-
return /*#__PURE__*/
|
|
3063
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, index !== 0 && (authors.length > 1 ? spaceHolder : ""), /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
3036
3064
|
href: "".concat(mountAt, "/author/") + author.slug,
|
|
3037
3065
|
"aria-label": "author-name"
|
|
3038
|
-
}, /*#__PURE__*/
|
|
3066
|
+
}, /*#__PURE__*/React__default["default"].createElement("h5", {
|
|
3039
3067
|
className: _getClassName("multiple-author-style ".concat(textColor), _styleModuleImportMap$z)
|
|
3040
3068
|
}, author.name)));
|
|
3041
|
-
}), isSingleAuthor && template !== "centerAligned" && /*#__PURE__*/
|
|
3069
|
+
}), 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", {
|
|
3042
3070
|
className: "author-card-m_dot-wrapper__2soc1"
|
|
3043
|
-
}, /*#__PURE__*/
|
|
3071
|
+
}, /*#__PURE__*/React__default["default"].createElement(Dot, {
|
|
3044
3072
|
color: textColor
|
|
3045
|
-
})), /*#__PURE__*/
|
|
3073
|
+
})), /*#__PURE__*/React__default["default"].createElement("a", {
|
|
3046
3074
|
href: "http://twitter.com/" + authors[0]["twitter-handle"],
|
|
3047
3075
|
target: "_blank",
|
|
3048
3076
|
rel: "noopener noreferrer"
|
|
3049
|
-
}, /*#__PURE__*/
|
|
3077
|
+
}, /*#__PURE__*/React__default["default"].createElement(Twitter, null))))), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3050
3078
|
"data-test-id": "author-info",
|
|
3051
3079
|
className: "author-card-m_author-details-wrapper__1c2uc"
|
|
3052
|
-
}, showBio && isSingleAuthor && template !== "default" && /*#__PURE__*/
|
|
3080
|
+
}, showBio && isSingleAuthor && template !== "default" && /*#__PURE__*/React__default["default"].createElement("p", {
|
|
3053
3081
|
className: _getClassName("author-bio ".concat(textColor), _styleModuleImportMap$z)
|
|
3054
3082
|
}, authors[0].bio)));
|
|
3055
3083
|
};
|
|
3056
3084
|
AuthorCard.propTypes = {
|
|
3057
|
-
story:
|
|
3058
|
-
authors:
|
|
3085
|
+
story: PropTypes__default["default"].shape({
|
|
3086
|
+
authors: PropTypes__default["default"].array
|
|
3059
3087
|
}),
|
|
3060
|
-
template:
|
|
3061
|
-
opts:
|
|
3062
|
-
showImage:
|
|
3063
|
-
showBio:
|
|
3064
|
-
showName:
|
|
3088
|
+
template: PropTypes__default["default"].string,
|
|
3089
|
+
opts: PropTypes__default["default"].shape({
|
|
3090
|
+
showImage: PropTypes__default["default"].bool,
|
|
3091
|
+
showBio: PropTypes__default["default"].bool,
|
|
3092
|
+
showName: PropTypes__default["default"].bool
|
|
3065
3093
|
}),
|
|
3066
|
-
mountAt:
|
|
3067
|
-
clazzName:
|
|
3094
|
+
mountAt: PropTypes__default["default"].string,
|
|
3095
|
+
clazzName: PropTypes__default["default"].string
|
|
3068
3096
|
};
|
|
3069
3097
|
|
|
3070
3098
|
var _styleModuleImportMap$y = {
|
|
@@ -3101,14 +3129,14 @@ var CaptionAttribution = function CaptionAttribution(_ref) {
|
|
|
3101
3129
|
var caption = heroImageCaption || title;
|
|
3102
3130
|
var attribution = heroImageAttribution || imageAttribution;
|
|
3103
3131
|
var updateStyle = caption ? "wrapper" : "";
|
|
3104
|
-
return /*#__PURE__*/
|
|
3132
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3105
3133
|
"data-test-id": "caption",
|
|
3106
3134
|
className: "arr--caption-attribution " + _getClassName("caption ".concat(textColor), _styleModuleImportMap$y)
|
|
3107
|
-
}, /*#__PURE__*/
|
|
3135
|
+
}, /*#__PURE__*/React__default["default"].createElement("span", {
|
|
3108
3136
|
dangerouslySetInnerHTML: {
|
|
3109
3137
|
__html: caption
|
|
3110
3138
|
}
|
|
3111
|
-
}), attribution && /*#__PURE__*/
|
|
3139
|
+
}), attribution && /*#__PURE__*/React__default["default"].createElement("span", {
|
|
3112
3140
|
"data-test-id": "attribution",
|
|
3113
3141
|
dangerouslySetInnerHTML: {
|
|
3114
3142
|
__html: attribution
|
|
@@ -3117,13 +3145,13 @@ var CaptionAttribution = function CaptionAttribution(_ref) {
|
|
|
3117
3145
|
}));
|
|
3118
3146
|
};
|
|
3119
3147
|
CaptionAttribution.propTypes = {
|
|
3120
|
-
config:
|
|
3121
|
-
theme:
|
|
3148
|
+
config: PropTypes__default["default"].shape({
|
|
3149
|
+
theme: PropTypes__default["default"].string
|
|
3122
3150
|
}),
|
|
3123
3151
|
story: shapeStory,
|
|
3124
|
-
element:
|
|
3125
|
-
"image-attribution":
|
|
3126
|
-
title:
|
|
3152
|
+
element: PropTypes__default["default"].shape({
|
|
3153
|
+
"image-attribution": PropTypes__default["default"].string,
|
|
3154
|
+
title: PropTypes__default["default"].string
|
|
3127
3155
|
})
|
|
3128
3156
|
};
|
|
3129
3157
|
|
|
@@ -3133,7 +3161,7 @@ var CrownIcon = function CrownIcon(_ref) {
|
|
|
3133
3161
|
_ref$color = _ref.color,
|
|
3134
3162
|
color = _ref$color === void 0 ? "#D8D8D8" : _ref$color,
|
|
3135
3163
|
positionTop = _ref.positionTop;
|
|
3136
|
-
return /*#__PURE__*/
|
|
3164
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
3137
3165
|
xmlns: "http://www.w3.org/2000/svg",
|
|
3138
3166
|
width: width,
|
|
3139
3167
|
height: height,
|
|
@@ -3142,28 +3170,28 @@ var CrownIcon = function CrownIcon(_ref) {
|
|
|
3142
3170
|
position: "relative",
|
|
3143
3171
|
top: positionTop
|
|
3144
3172
|
}
|
|
3145
|
-
}, /*#__PURE__*/
|
|
3173
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3146
3174
|
fill: "none",
|
|
3147
3175
|
fillRule: "evenodd",
|
|
3148
3176
|
stroke: "none",
|
|
3149
3177
|
strokeWidth: "1"
|
|
3150
|
-
}, /*#__PURE__*/
|
|
3178
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", null, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3151
3179
|
transform: "translate(8 8)"
|
|
3152
|
-
}, /*#__PURE__*/
|
|
3180
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
3153
3181
|
d: "M0 0H24V24H0z"
|
|
3154
|
-
}), /*#__PURE__*/
|
|
3182
|
+
}), /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3155
3183
|
fill: color,
|
|
3156
3184
|
fillRule: "nonzero",
|
|
3157
3185
|
transform: "translate(0 2)"
|
|
3158
|
-
}, /*#__PURE__*/
|
|
3186
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
3159
3187
|
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"
|
|
3160
3188
|
}))))));
|
|
3161
3189
|
};
|
|
3162
3190
|
CrownIcon.propTypes = {
|
|
3163
|
-
height:
|
|
3164
|
-
width:
|
|
3165
|
-
color:
|
|
3166
|
-
positionTop:
|
|
3191
|
+
height: PropTypes__default["default"].string,
|
|
3192
|
+
width: PropTypes__default["default"].string,
|
|
3193
|
+
color: PropTypes__default["default"].string,
|
|
3194
|
+
positionTop: PropTypes__default["default"].string
|
|
3167
3195
|
};
|
|
3168
3196
|
|
|
3169
3197
|
var KeyIcon = function KeyIcon(_ref) {
|
|
@@ -3172,7 +3200,7 @@ var KeyIcon = function KeyIcon(_ref) {
|
|
|
3172
3200
|
_ref$color = _ref.color,
|
|
3173
3201
|
color = _ref$color === void 0 ? "#D5D5D5" : _ref$color,
|
|
3174
3202
|
positionTop = _ref.positionTop;
|
|
3175
|
-
return /*#__PURE__*/
|
|
3203
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
3176
3204
|
xmlns: "http://www.w3.org/2000/svg",
|
|
3177
3205
|
width: width,
|
|
3178
3206
|
height: height,
|
|
@@ -3181,16 +3209,16 @@ var KeyIcon = function KeyIcon(_ref) {
|
|
|
3181
3209
|
position: "relative",
|
|
3182
3210
|
top: positionTop
|
|
3183
3211
|
}
|
|
3184
|
-
}, /*#__PURE__*/
|
|
3212
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3185
3213
|
fill: "none",
|
|
3186
3214
|
fillRule: "evenodd",
|
|
3187
3215
|
stroke: "none",
|
|
3188
3216
|
strokeWidth: "1"
|
|
3189
|
-
}, /*#__PURE__*/
|
|
3217
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", null, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3190
3218
|
transform: "translate(8 8)"
|
|
3191
|
-
}, /*#__PURE__*/
|
|
3219
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
3192
3220
|
d: "M0 0H24V24H0z"
|
|
3193
|
-
}), /*#__PURE__*/
|
|
3221
|
+
}), /*#__PURE__*/React__default["default"].createElement("path", {
|
|
3194
3222
|
fill: color,
|
|
3195
3223
|
fillRule: "nonzero",
|
|
3196
3224
|
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",
|
|
@@ -3198,10 +3226,10 @@ var KeyIcon = function KeyIcon(_ref) {
|
|
|
3198
3226
|
})))));
|
|
3199
3227
|
};
|
|
3200
3228
|
KeyIcon.propTypes = {
|
|
3201
|
-
height:
|
|
3202
|
-
width:
|
|
3203
|
-
color:
|
|
3204
|
-
positionTop:
|
|
3229
|
+
height: PropTypes__default["default"].string,
|
|
3230
|
+
width: PropTypes__default["default"].string,
|
|
3231
|
+
color: PropTypes__default["default"].string,
|
|
3232
|
+
positionTop: PropTypes__default["default"].string
|
|
3205
3233
|
};
|
|
3206
3234
|
|
|
3207
3235
|
var LockIcon = function LockIcon(_ref) {
|
|
@@ -3210,7 +3238,7 @@ var LockIcon = function LockIcon(_ref) {
|
|
|
3210
3238
|
_ref$color = _ref.color,
|
|
3211
3239
|
color = _ref$color === void 0 ? "#D5D5D5" : _ref$color,
|
|
3212
3240
|
positionTop = _ref.positionTop;
|
|
3213
|
-
return /*#__PURE__*/
|
|
3241
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
3214
3242
|
xmlns: "http://www.w3.org/2000/svg",
|
|
3215
3243
|
width: width,
|
|
3216
3244
|
height: height,
|
|
@@ -3219,28 +3247,28 @@ var LockIcon = function LockIcon(_ref) {
|
|
|
3219
3247
|
position: "relative",
|
|
3220
3248
|
top: positionTop
|
|
3221
3249
|
}
|
|
3222
|
-
}, /*#__PURE__*/
|
|
3250
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3223
3251
|
fill: "none",
|
|
3224
3252
|
fillRule: "evenodd",
|
|
3225
3253
|
stroke: "none",
|
|
3226
3254
|
strokeWidth: "1"
|
|
3227
|
-
}, /*#__PURE__*/
|
|
3255
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", null, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3228
3256
|
transform: "translate(8 8)"
|
|
3229
|
-
}, /*#__PURE__*/
|
|
3257
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
3230
3258
|
d: "M0 0H24V24H0z"
|
|
3231
|
-
}), /*#__PURE__*/
|
|
3259
|
+
}), /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3232
3260
|
fill: color,
|
|
3233
3261
|
fillRule: "nonzero",
|
|
3234
3262
|
transform: "translate(3)"
|
|
3235
|
-
}, /*#__PURE__*/
|
|
3263
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
3236
3264
|
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"
|
|
3237
3265
|
}))))));
|
|
3238
3266
|
};
|
|
3239
3267
|
LockIcon.propTypes = {
|
|
3240
|
-
height:
|
|
3241
|
-
width:
|
|
3242
|
-
color:
|
|
3243
|
-
positionTop:
|
|
3268
|
+
height: PropTypes__default["default"].string,
|
|
3269
|
+
width: PropTypes__default["default"].string,
|
|
3270
|
+
color: PropTypes__default["default"].string,
|
|
3271
|
+
positionTop: PropTypes__default["default"].string
|
|
3244
3272
|
};
|
|
3245
3273
|
|
|
3246
3274
|
var StarIcon = function StarIcon(_ref) {
|
|
@@ -3250,7 +3278,7 @@ var StarIcon = function StarIcon(_ref) {
|
|
|
3250
3278
|
color = _ref$color === void 0 ? "#D5D5D5" : _ref$color,
|
|
3251
3279
|
_ref$positionTop = _ref.positionTop,
|
|
3252
3280
|
positionTop = _ref$positionTop === void 0 ? "" : _ref$positionTop;
|
|
3253
|
-
return /*#__PURE__*/
|
|
3281
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
3254
3282
|
xmlns: "http://www.w3.org/2000/svg",
|
|
3255
3283
|
width: width,
|
|
3256
3284
|
height: height,
|
|
@@ -3259,21 +3287,21 @@ var StarIcon = function StarIcon(_ref) {
|
|
|
3259
3287
|
position: "relative",
|
|
3260
3288
|
top: positionTop
|
|
3261
3289
|
}
|
|
3262
|
-
}, /*#__PURE__*/
|
|
3290
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3263
3291
|
fill: "none",
|
|
3264
3292
|
fillRule: "evenodd",
|
|
3265
3293
|
stroke: "none",
|
|
3266
3294
|
strokeWidth: "1"
|
|
3267
|
-
}, /*#__PURE__*/
|
|
3295
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", null, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
3268
3296
|
fill: color,
|
|
3269
3297
|
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"
|
|
3270
3298
|
}))));
|
|
3271
3299
|
};
|
|
3272
3300
|
StarIcon.propTypes = {
|
|
3273
|
-
height:
|
|
3274
|
-
width:
|
|
3275
|
-
color:
|
|
3276
|
-
positionTop:
|
|
3301
|
+
height: PropTypes__default["default"].string,
|
|
3302
|
+
width: PropTypes__default["default"].string,
|
|
3303
|
+
color: PropTypes__default["default"].string,
|
|
3304
|
+
positionTop: PropTypes__default["default"].string
|
|
3277
3305
|
};
|
|
3278
3306
|
|
|
3279
3307
|
var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
|
|
@@ -3285,7 +3313,7 @@ var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
|
|
|
3285
3313
|
|
|
3286
3314
|
switch (iconType) {
|
|
3287
3315
|
case "crown":
|
|
3288
|
-
return /*#__PURE__*/
|
|
3316
|
+
return /*#__PURE__*/React__default["default"].createElement(CrownIcon, {
|
|
3289
3317
|
width: width,
|
|
3290
3318
|
height: height,
|
|
3291
3319
|
color: color,
|
|
@@ -3293,7 +3321,7 @@ var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
|
|
|
3293
3321
|
});
|
|
3294
3322
|
|
|
3295
3323
|
case "lock":
|
|
3296
|
-
return /*#__PURE__*/
|
|
3324
|
+
return /*#__PURE__*/React__default["default"].createElement(LockIcon, {
|
|
3297
3325
|
width: width,
|
|
3298
3326
|
height: height,
|
|
3299
3327
|
color: color,
|
|
@@ -3301,7 +3329,7 @@ var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
|
|
|
3301
3329
|
});
|
|
3302
3330
|
|
|
3303
3331
|
case "key":
|
|
3304
|
-
return /*#__PURE__*/
|
|
3332
|
+
return /*#__PURE__*/React__default["default"].createElement(KeyIcon, {
|
|
3305
3333
|
width: width,
|
|
3306
3334
|
height: height,
|
|
3307
3335
|
color: color,
|
|
@@ -3309,7 +3337,7 @@ var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
|
|
|
3309
3337
|
});
|
|
3310
3338
|
|
|
3311
3339
|
default:
|
|
3312
|
-
return /*#__PURE__*/
|
|
3340
|
+
return /*#__PURE__*/React__default["default"].createElement(StarIcon, {
|
|
3313
3341
|
width: width,
|
|
3314
3342
|
height: height,
|
|
3315
3343
|
color: color,
|
|
@@ -3318,11 +3346,11 @@ var PremiumStoryIcon = function PremiumStoryIcon(_ref) {
|
|
|
3318
3346
|
}
|
|
3319
3347
|
};
|
|
3320
3348
|
PremiumStoryIcon.propTypes = {
|
|
3321
|
-
width:
|
|
3322
|
-
height:
|
|
3323
|
-
color:
|
|
3324
|
-
iconType:
|
|
3325
|
-
positionTop:
|
|
3349
|
+
width: PropTypes__default["default"].string,
|
|
3350
|
+
height: PropTypes__default["default"].string,
|
|
3351
|
+
color: PropTypes__default["default"].string,
|
|
3352
|
+
iconType: PropTypes__default["default"].string,
|
|
3353
|
+
positionTop: PropTypes__default["default"].string
|
|
3326
3354
|
};
|
|
3327
3355
|
|
|
3328
3356
|
var _styleModuleImportMap$x = {
|
|
@@ -3349,29 +3377,29 @@ var StoryHeadline = function StoryHeadline(_ref) {
|
|
|
3349
3377
|
var premiumStory = enablePremiumStoryIcon && get_1(story, ["access"]) === "subscription";
|
|
3350
3378
|
var wrapperClass = premiumStory ? "premium-wrapper" : "wrapper";
|
|
3351
3379
|
var iconSize = "40px";
|
|
3352
|
-
return /*#__PURE__*/
|
|
3380
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3353
3381
|
className: "arrow-component arr--story-headline " + _getClassName(wrapperClass, _styleModuleImportMap$x)
|
|
3354
|
-
}, premiumStory && /*#__PURE__*/
|
|
3382
|
+
}, premiumStory && /*#__PURE__*/React__default["default"].createElement(PremiumStoryIcon, {
|
|
3355
3383
|
width: iconSize,
|
|
3356
3384
|
height: iconSize,
|
|
3357
3385
|
color: iconColor,
|
|
3358
3386
|
iconType: iconStyle,
|
|
3359
3387
|
positionTop: "6px"
|
|
3360
|
-
}), /*#__PURE__*/
|
|
3388
|
+
}), /*#__PURE__*/React__default["default"].createElement("h1", {
|
|
3361
3389
|
"data-testid": "story-headline",
|
|
3362
3390
|
className: _getClassName("headline ".concat(textColor), _styleModuleImportMap$x)
|
|
3363
|
-
}, /*#__PURE__*/
|
|
3391
|
+
}, /*#__PURE__*/React__default["default"].createElement("bdi", {
|
|
3364
3392
|
dangerouslySetInnerHTML: {
|
|
3365
3393
|
__html: story.headline
|
|
3366
3394
|
}
|
|
3367
3395
|
})));
|
|
3368
3396
|
};
|
|
3369
3397
|
StoryHeadline.propTypes = {
|
|
3370
|
-
story:
|
|
3371
|
-
premiumStoryIconConfig:
|
|
3372
|
-
iconColor:
|
|
3373
|
-
iconType:
|
|
3374
|
-
enablePremiumStoryIcon:
|
|
3398
|
+
story: PropTypes__default["default"].object.isRequired,
|
|
3399
|
+
premiumStoryIconConfig: PropTypes__default["default"].shape({
|
|
3400
|
+
iconColor: PropTypes__default["default"].string,
|
|
3401
|
+
iconType: PropTypes__default["default"].string,
|
|
3402
|
+
enablePremiumStoryIcon: PropTypes__default["default"].bool
|
|
3375
3403
|
})
|
|
3376
3404
|
};
|
|
3377
3405
|
|
|
@@ -3443,27 +3471,27 @@ var ImageFallbackIcon = function ImageFallbackIcon(_ref) {
|
|
|
3443
3471
|
height = _ref$height === void 0 ? 30 : _ref$height,
|
|
3444
3472
|
_ref$iconColor = _ref.iconColor,
|
|
3445
3473
|
iconColor = _ref$iconColor === void 0 ? "#99B0CB" : _ref$iconColor;
|
|
3446
|
-
return /*#__PURE__*/
|
|
3474
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
3447
3475
|
width: width,
|
|
3448
3476
|
height: height,
|
|
3449
3477
|
viewBox: "0 0 102 76",
|
|
3450
3478
|
version: "1.1"
|
|
3451
|
-
}, /*#__PURE__*/
|
|
3479
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3452
3480
|
id: "demo-home-copy",
|
|
3453
3481
|
stroke: "none",
|
|
3454
3482
|
strokeWidth: "1",
|
|
3455
3483
|
fill: "none",
|
|
3456
3484
|
fillRule: "evenodd",
|
|
3457
3485
|
transform: "translate(-377.000000, -314.000000)"
|
|
3458
|
-
}, /*#__PURE__*/
|
|
3486
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3459
3487
|
id: "Group-13",
|
|
3460
3488
|
transform: "translate(377.000000, 314.000000)"
|
|
3461
|
-
}, /*#__PURE__*/
|
|
3489
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
3462
3490
|
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",
|
|
3463
3491
|
id: "Combined-Shape",
|
|
3464
3492
|
fill: iconColor,
|
|
3465
3493
|
fillRule: "nonzero"
|
|
3466
|
-
}), /*#__PURE__*/
|
|
3494
|
+
}), /*#__PURE__*/React__default["default"].createElement("rect", {
|
|
3467
3495
|
id: "Rectangle-19",
|
|
3468
3496
|
stroke: iconColor,
|
|
3469
3497
|
strokeWidth: "3",
|
|
@@ -3475,24 +3503,24 @@ var ImageFallbackIcon = function ImageFallbackIcon(_ref) {
|
|
|
3475
3503
|
}))));
|
|
3476
3504
|
};
|
|
3477
3505
|
ImageFallbackIcon.propTypes = {
|
|
3478
|
-
width:
|
|
3479
|
-
height:
|
|
3480
|
-
iconColor:
|
|
3506
|
+
width: PropTypes__default["default"].object,
|
|
3507
|
+
height: PropTypes__default["default"].object,
|
|
3508
|
+
iconColor: PropTypes__default["default"].object
|
|
3481
3509
|
};
|
|
3482
3510
|
|
|
3483
3511
|
var imageFallback = function imageFallback() {
|
|
3484
|
-
return /*#__PURE__*/
|
|
3512
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3485
3513
|
className: "arr--fallback-image fallback-m_image__1GYCJ fallback-m_image-position__3KddP"
|
|
3486
|
-
}, /*#__PURE__*/
|
|
3514
|
+
}, /*#__PURE__*/React__default["default"].createElement("figure", {
|
|
3487
3515
|
className: "arr--fallback-svg fallback-m_fallback-svg__tK9fL"
|
|
3488
|
-
}, /*#__PURE__*/
|
|
3516
|
+
}, /*#__PURE__*/React__default["default"].createElement(ImageFallbackIcon, null)));
|
|
3489
3517
|
};
|
|
3490
3518
|
|
|
3491
3519
|
var FallbackImage = function FallbackImage(_ref) {
|
|
3492
3520
|
var slug = _ref.slug;
|
|
3493
3521
|
|
|
3494
3522
|
if (slug) {
|
|
3495
|
-
return /*#__PURE__*/
|
|
3523
|
+
return /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
3496
3524
|
href: slug,
|
|
3497
3525
|
"aria-label": "image-fallback"
|
|
3498
3526
|
}, imageFallback());
|
|
@@ -3501,23 +3529,23 @@ var FallbackImage = function FallbackImage(_ref) {
|
|
|
3501
3529
|
}
|
|
3502
3530
|
};
|
|
3503
3531
|
FallbackImage.propTypes = {
|
|
3504
|
-
slug:
|
|
3532
|
+
slug: PropTypes__default["default"].string
|
|
3505
3533
|
};
|
|
3506
3534
|
|
|
3507
3535
|
var HyperLinkIcon = function HyperLinkIcon() {
|
|
3508
|
-
return /*#__PURE__*/
|
|
3536
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
3509
3537
|
xmlns: "http://www.w3.org/2000/svg",
|
|
3510
3538
|
width: "36",
|
|
3511
3539
|
height: "28"
|
|
3512
|
-
}, /*#__PURE__*/
|
|
3540
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
3513
3541
|
fill: "none",
|
|
3514
3542
|
fillRule: "evenodd"
|
|
3515
|
-
}, /*#__PURE__*/
|
|
3543
|
+
}, /*#__PURE__*/React__default["default"].createElement("rect", {
|
|
3516
3544
|
width: "36",
|
|
3517
3545
|
height: "28",
|
|
3518
3546
|
fill: "#3D6FCF",
|
|
3519
3547
|
rx: "4"
|
|
3520
|
-
}), /*#__PURE__*/
|
|
3548
|
+
}), /*#__PURE__*/React__default["default"].createElement("path", {
|
|
3521
3549
|
stroke: "#FFF",
|
|
3522
3550
|
strokeLinecap: "round",
|
|
3523
3551
|
strokeLinejoin: "round",
|
|
@@ -3530,16 +3558,16 @@ var HyperLink = function HyperLink(_ref) {
|
|
|
3530
3558
|
var _ref$hyperLink = _ref.hyperLink,
|
|
3531
3559
|
hyperLink = _ref$hyperLink === void 0 ? "" : _ref$hyperLink;
|
|
3532
3560
|
if (!hyperLink) return null;
|
|
3533
|
-
return /*#__PURE__*/
|
|
3561
|
+
return /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
3534
3562
|
href: hyperLink,
|
|
3535
3563
|
"aria-label": "hyperlink-button",
|
|
3536
3564
|
className: "arr--hyperlink-button hyperlink-m_hyperlink-button__1CqWx",
|
|
3537
3565
|
target: "_blank",
|
|
3538
3566
|
rel: "noopener noreferrer"
|
|
3539
|
-
}, /*#__PURE__*/
|
|
3567
|
+
}, /*#__PURE__*/React__default["default"].createElement(HyperLinkIcon, null));
|
|
3540
3568
|
};
|
|
3541
3569
|
HyperLink.propTypes = {
|
|
3542
|
-
hyperLink:
|
|
3570
|
+
hyperLink: PropTypes__default["default"].string
|
|
3543
3571
|
};
|
|
3544
3572
|
|
|
3545
3573
|
var _styleModuleImportMap$w = {
|
|
@@ -3575,7 +3603,7 @@ var HeroImage = function HeroImage(_ref) {
|
|
|
3575
3603
|
StoryTemplateIcon = _config$StoryTemplate === void 0 ? function () {
|
|
3576
3604
|
return null;
|
|
3577
3605
|
} : _config$StoryTemplate;
|
|
3578
|
-
var showImagePlaceholder = useSelector(function (state) {
|
|
3606
|
+
var showImagePlaceholder = reactRedux.useSelector(function (state) {
|
|
3579
3607
|
return get_1(state, ["qt", "config", "showPlaceholder"]);
|
|
3580
3608
|
});
|
|
3581
3609
|
var getPlaceholderStyleName = showImagePlaceholder ? "placeholder" : "";
|
|
@@ -3611,37 +3639,37 @@ var HeroImage = function HeroImage(_ref) {
|
|
|
3611
3639
|
var fallbackImage = function fallbackImage() {
|
|
3612
3640
|
if (!slug) {
|
|
3613
3641
|
if (fallbackImageUrl && !isStoryPageImage) {
|
|
3614
|
-
return /*#__PURE__*/
|
|
3642
|
+
return /*#__PURE__*/React__default["default"].createElement("figure", {
|
|
3615
3643
|
style: {
|
|
3616
3644
|
paddingTop: imagePadding + "%"
|
|
3617
3645
|
},
|
|
3618
3646
|
className: "arr--responsive-hero-image " + _getClassName("image ".concat(getPlaceholderStyleName), _styleModuleImportMap$w)
|
|
3619
|
-
}, /*#__PURE__*/
|
|
3647
|
+
}, /*#__PURE__*/React__default["default"].createElement("img", {
|
|
3620
3648
|
className: "qt-image",
|
|
3621
3649
|
"data-src": "".concat(fallbackImageUrl),
|
|
3622
3650
|
alt: "image-fallback"
|
|
3623
3651
|
}));
|
|
3624
3652
|
}
|
|
3625
3653
|
|
|
3626
|
-
return /*#__PURE__*/
|
|
3654
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, defaultFallback ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3627
3655
|
"data-test-id": "arr--fallback-hero-image",
|
|
3628
3656
|
style: {
|
|
3629
3657
|
paddingTop: imagePadding + "%"
|
|
3630
3658
|
},
|
|
3631
3659
|
className: "arr--fallback-hero-image " + _getClassName("image ".concat(getPlaceholderStyleName), _styleModuleImportMap$w)
|
|
3632
|
-
}, /*#__PURE__*/
|
|
3660
|
+
}, /*#__PURE__*/React__default["default"].createElement(StoryTemplateIcon, {
|
|
3633
3661
|
storyTemplate: story["story-template"]
|
|
3634
|
-
}), /*#__PURE__*/
|
|
3662
|
+
}), /*#__PURE__*/React__default["default"].createElement(FallbackImage, null)) : null);
|
|
3635
3663
|
}
|
|
3636
3664
|
|
|
3637
|
-
return /*#__PURE__*/
|
|
3665
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("figure", {
|
|
3638
3666
|
style: {
|
|
3639
3667
|
paddingTop: imagePadding + "%"
|
|
3640
3668
|
},
|
|
3641
3669
|
className: "arr--responsive-hero-image " + _getClassName("image ".concat(getPlaceholderStyleName), _styleModuleImportMap$w)
|
|
3642
|
-
}, /*#__PURE__*/
|
|
3670
|
+
}, /*#__PURE__*/React__default["default"].createElement(StoryTemplateIcon, {
|
|
3643
3671
|
storyTemplate: story["story-template"]
|
|
3644
|
-
}), /*#__PURE__*/
|
|
3672
|
+
}), /*#__PURE__*/React__default["default"].createElement(components.ResponsiveHeroImage, {
|
|
3645
3673
|
story: story,
|
|
3646
3674
|
aspectRatio: imageAspectRatio,
|
|
3647
3675
|
defaultWidth: defaultWidth,
|
|
@@ -3650,15 +3678,15 @@ var HeroImage = function HeroImage(_ref) {
|
|
|
3650
3678
|
auto: ["format", "compress"],
|
|
3651
3679
|
fit: "max"
|
|
3652
3680
|
}
|
|
3653
|
-
})), isStoryPageImage && hyperLink && /*#__PURE__*/
|
|
3681
|
+
})), isStoryPageImage && hyperLink && /*#__PURE__*/React__default["default"].createElement(HyperLink, {
|
|
3654
3682
|
hyperLink: hyperLink
|
|
3655
3683
|
}));
|
|
3656
3684
|
};
|
|
3657
3685
|
|
|
3658
|
-
return story && (isStoryPageImage ? /*#__PURE__*/
|
|
3686
|
+
return story && (isStoryPageImage ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3659
3687
|
"data-test-id": "arr--hero-image",
|
|
3660
3688
|
className: "arr--hero-image " + _getClassName("".concat(heroImageClass, " ").concat(fullBleed, " ").concat(heroImageMobClasses), _styleModuleImportMap$w)
|
|
3661
|
-
}, fallbackImage()) : /*#__PURE__*/
|
|
3689
|
+
}, fallbackImage()) : /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
3662
3690
|
"data-test-id": "arr--hero-image",
|
|
3663
3691
|
href: getStoryUrl(story, "/".concat(story.slug)),
|
|
3664
3692
|
externalLink: isExternalStory(story),
|
|
@@ -3668,30 +3696,30 @@ var HeroImage = function HeroImage(_ref) {
|
|
|
3668
3696
|
};
|
|
3669
3697
|
HeroImage.propTypes = {
|
|
3670
3698
|
/** The Story Object from the API response */
|
|
3671
|
-
story:
|
|
3699
|
+
story: PropTypes__default["default"].object.isRequired,
|
|
3672
3700
|
|
|
3673
3701
|
/** Removes the Hero Image padding for the image to bleed over the margin */
|
|
3674
|
-
FullBleed:
|
|
3702
|
+
FullBleed: PropTypes__default["default"].bool,
|
|
3675
3703
|
|
|
3676
3704
|
/** The default width for the image, in case the browser does not support srcset */
|
|
3677
|
-
defaultWidth:
|
|
3705
|
+
defaultWidth: PropTypes__default["default"].number,
|
|
3678
3706
|
|
|
3679
3707
|
/** The list of available widths */
|
|
3680
|
-
widths:
|
|
3708
|
+
widths: PropTypes__default["default"].array,
|
|
3681
3709
|
// fatch the correct hero image
|
|
3682
|
-
aspectRatio:
|
|
3710
|
+
aspectRatio: PropTypes__default["default"].array,
|
|
3683
3711
|
// Hints for the browser to choose the best size
|
|
3684
3712
|
|
|
3685
3713
|
/** This prop is responsible for adding padding-right of the image and remove padding bottom of the image */
|
|
3686
|
-
isHorizontal:
|
|
3714
|
+
isHorizontal: PropTypes__default["default"].bool,
|
|
3687
3715
|
|
|
3688
3716
|
/** This prop is responsible for adding padding-bottom in desktop and padding-right in mobile */
|
|
3689
|
-
isHorizontalMobile:
|
|
3717
|
+
isHorizontalMobile: PropTypes__default["default"].bool,
|
|
3690
3718
|
// this prop is responsive for rendering fallback image on story page
|
|
3691
|
-
defaultFallback:
|
|
3692
|
-
isHorizontalWithImageLast:
|
|
3693
|
-
isStoryPageImage:
|
|
3694
|
-
config:
|
|
3719
|
+
defaultFallback: PropTypes__default["default"].bool,
|
|
3720
|
+
isHorizontalWithImageLast: PropTypes__default["default"].bool,
|
|
3721
|
+
isStoryPageImage: PropTypes__default["default"].bool,
|
|
3722
|
+
config: PropTypes__default["default"].object
|
|
3695
3723
|
};
|
|
3696
3724
|
HeroImage.defaultProps = {
|
|
3697
3725
|
FullBleed: true,
|
|
@@ -3741,23 +3769,23 @@ var ReadTime = function ReadTime(_ref) {
|
|
|
3741
3769
|
var textColor = isLightTheme ? "light" : getTextColor(config.theme);
|
|
3742
3770
|
if (!showReadTime || !readTime) return null;
|
|
3743
3771
|
var timeToRead = get_1(opts, ["localizedTimeToRead"]) || "min read";
|
|
3744
|
-
return /*#__PURE__*/
|
|
3772
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3745
3773
|
"data-test-id": "read-time",
|
|
3746
3774
|
className: "arrow-component arr--read-time " + _getClassName("read-time-wrapper ".concat(textColor), _styleModuleImportMap$v)
|
|
3747
|
-
}, /*#__PURE__*/
|
|
3775
|
+
}, /*#__PURE__*/React__default["default"].createElement("span", {
|
|
3748
3776
|
className: "read-time-indicator read-time-m_dot-indicator__3Sqh2"
|
|
3749
|
-
}, /*#__PURE__*/
|
|
3777
|
+
}, /*#__PURE__*/React__default["default"].createElement(Dot, {
|
|
3750
3778
|
color: textColor
|
|
3751
|
-
})), /*#__PURE__*/
|
|
3779
|
+
})), /*#__PURE__*/React__default["default"].createElement("span", null, readTime, " ", timeToRead)));
|
|
3752
3780
|
};
|
|
3753
3781
|
ReadTime.propTypes = {
|
|
3754
|
-
story:
|
|
3755
|
-
"read-time":
|
|
3782
|
+
story: PropTypes__default["default"].shape({
|
|
3783
|
+
"read-time": PropTypes__default["default"].number
|
|
3756
3784
|
}),
|
|
3757
|
-
opts:
|
|
3758
|
-
showReadTime:
|
|
3785
|
+
opts: PropTypes__default["default"].shape({
|
|
3786
|
+
showReadTime: PropTypes__default["default"].bool
|
|
3759
3787
|
}),
|
|
3760
|
-
isLightTheme:
|
|
3788
|
+
isLightTheme: PropTypes__default["default"].bool
|
|
3761
3789
|
};
|
|
3762
3790
|
|
|
3763
3791
|
var _styleModuleImportMap$u = {
|
|
@@ -3786,12 +3814,12 @@ var PublishDetails = function PublishDetails(_ref) {
|
|
|
3786
3814
|
_ref$timezone = _ref.timezone,
|
|
3787
3815
|
timezone = _ref$timezone === void 0 ? null : _ref$timezone;
|
|
3788
3816
|
|
|
3789
|
-
var _useState = useState("ltr"),
|
|
3817
|
+
var _useState = React.useState("ltr"),
|
|
3790
3818
|
_useState2 = _slicedToArray(_useState, 2),
|
|
3791
3819
|
direction = _useState2[0],
|
|
3792
3820
|
setDirection = _useState2[1];
|
|
3793
3821
|
|
|
3794
|
-
useEffect(function () {
|
|
3822
|
+
React.useEffect(function () {
|
|
3795
3823
|
var htmlElement = document.getElementsByTagName("HTML");
|
|
3796
3824
|
|
|
3797
3825
|
if (htmlElement && htmlElement.length > 0 && htmlElement[0].dir.toLocaleLowerCase() === "rtl") {
|
|
@@ -3817,41 +3845,41 @@ var PublishDetails = function PublishDetails(_ref) {
|
|
|
3817
3845
|
direction: direction,
|
|
3818
3846
|
showTime: true
|
|
3819
3847
|
});
|
|
3820
|
-
return /*#__PURE__*/
|
|
3848
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3821
3849
|
"data-test-id": "timeStamp",
|
|
3822
3850
|
className: "arrow-component arr-publish-details " + _getClassName("timeStamp ".concat(textColor), _styleModuleImportMap$u)
|
|
3823
|
-
}, /*#__PURE__*/
|
|
3851
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3824
3852
|
"data-test-id": "publishDetails",
|
|
3825
3853
|
className: _getClassName("publish-details ".concat(textColor), _styleModuleImportMap$u)
|
|
3826
|
-
}, enablePublishedTime && /*#__PURE__*/
|
|
3854
|
+
}, enablePublishedTime && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, localizedPublishedOn || "Published on", " :\xA0", /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3827
3855
|
className: "publish-details-m_date__3ZIQN"
|
|
3828
|
-
}, getTimeStamp(time, timestampToFormat, timeStampProps, template, timezone)), showReadTime && /*#__PURE__*/
|
|
3856
|
+
}, getTimeStamp(time, timestampToFormat, timeStampProps, template, timezone)), showReadTime && /*#__PURE__*/React__default["default"].createElement(ReadTime, {
|
|
3829
3857
|
story: story,
|
|
3830
3858
|
opts: opts
|
|
3831
|
-
}))), enableUpdatedTime && /*#__PURE__*/
|
|
3859
|
+
}))), enableUpdatedTime && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3832
3860
|
"data-test-id": "updateDetails",
|
|
3833
3861
|
className: _getClassName("update-details ".concat(textColor), _styleModuleImportMap$u)
|
|
3834
|
-
}, localizedUpdatedOn || "Updated on", " :\xA0", /*#__PURE__*/
|
|
3862
|
+
}, localizedUpdatedOn || "Updated on", " :\xA0", /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3835
3863
|
className: "publish-details-m_date__3ZIQN"
|
|
3836
|
-
}, getTimeStamp(updatedAt, timestampToFormat, timeStampProps, template, timezone)), showReadTime && /*#__PURE__*/
|
|
3864
|
+
}, getTimeStamp(updatedAt, timestampToFormat, timeStampProps, template, timezone)), showReadTime && /*#__PURE__*/React__default["default"].createElement(ReadTime, {
|
|
3837
3865
|
story: story,
|
|
3838
3866
|
opts: opts
|
|
3839
3867
|
})));
|
|
3840
3868
|
};
|
|
3841
3869
|
PublishDetails.propTypes = {
|
|
3842
3870
|
/** The Story Object from the API response */
|
|
3843
|
-
story:
|
|
3844
|
-
"first-published-at":
|
|
3845
|
-
"last-published-at":
|
|
3846
|
-
"read-time":
|
|
3847
|
-
"updated-at":
|
|
3871
|
+
story: PropTypes__default["default"].shape({
|
|
3872
|
+
"first-published-at": PropTypes__default["default"].number,
|
|
3873
|
+
"last-published-at": PropTypes__default["default"].number,
|
|
3874
|
+
"read-time": PropTypes__default["default"].number,
|
|
3875
|
+
"updated-at": PropTypes__default["default"].number
|
|
3848
3876
|
}),
|
|
3849
|
-
timezone:
|
|
3850
|
-
template:
|
|
3851
|
-
opts:
|
|
3852
|
-
showReadTime:
|
|
3853
|
-
enableUpdatedTime:
|
|
3854
|
-
enablePublishedTime:
|
|
3877
|
+
timezone: PropTypes__default["default"].string,
|
|
3878
|
+
template: PropTypes__default["default"].string,
|
|
3879
|
+
opts: PropTypes__default["default"].shape({
|
|
3880
|
+
showReadTime: PropTypes__default["default"].bool,
|
|
3881
|
+
enableUpdatedTime: PropTypes__default["default"].bool,
|
|
3882
|
+
enablePublishedTime: PropTypes__default["default"].bool
|
|
3855
3883
|
})
|
|
3856
3884
|
};
|
|
3857
3885
|
|
|
@@ -3890,22 +3918,22 @@ var SectionTag = function SectionTag(_ref) {
|
|
|
3890
3918
|
}
|
|
3891
3919
|
|
|
3892
3920
|
if (!isSection) return null;
|
|
3893
|
-
return /*#__PURE__*/
|
|
3921
|
+
return /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
3894
3922
|
href: getUrl,
|
|
3895
3923
|
className: "arrow-component arr--section-name",
|
|
3896
3924
|
"aria-label": "section-name"
|
|
3897
|
-
}, /*#__PURE__*/
|
|
3925
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3898
3926
|
"data-test-id": "sectionTag",
|
|
3899
3927
|
style: {
|
|
3900
3928
|
backgroundColor: templateStyle.includes("section-solid") ? sectionTagBorderColor : ""
|
|
3901
3929
|
},
|
|
3902
3930
|
className: "section-tag arrow-component " + _getClassName("".concat(textColor, " ").concat(templateStyle), _styleModuleImportMap$t)
|
|
3903
|
-
}, templateStyle.includes("section-borderLeft") && /*#__PURE__*/
|
|
3931
|
+
}, templateStyle.includes("section-borderLeft") && /*#__PURE__*/React__default["default"].createElement("span", {
|
|
3904
3932
|
className: "section-m_border-left__2oUyp",
|
|
3905
3933
|
style: {
|
|
3906
3934
|
color: sectionTagBorderColor
|
|
3907
3935
|
}
|
|
3908
|
-
}), section["display-name"] || section["name"], /*#__PURE__*/
|
|
3936
|
+
}), section["display-name"] || section["name"], /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3909
3937
|
className: "section-m_border-bottom__3cRoD",
|
|
3910
3938
|
style: {
|
|
3911
3939
|
backgroundColor: "".concat(template === "solid" ? "" : sectionTagBorderColor)
|
|
@@ -3914,13 +3942,13 @@ var SectionTag = function SectionTag(_ref) {
|
|
|
3914
3942
|
};
|
|
3915
3943
|
SectionTag.propTypes = {
|
|
3916
3944
|
/** The Story Object from the API response */
|
|
3917
|
-
story:
|
|
3945
|
+
story: PropTypes__default["default"].object.isRequired,
|
|
3918
3946
|
|
|
3919
3947
|
/** The style template for section tag */
|
|
3920
|
-
template:
|
|
3921
|
-
borderColor:
|
|
3922
|
-
solidBorderColor:
|
|
3923
|
-
isLightTheme:
|
|
3948
|
+
template: PropTypes__default["default"].oneOf(["", "borderBottomSml", "borderLeft", "solid"]),
|
|
3949
|
+
borderColor: PropTypes__default["default"].string,
|
|
3950
|
+
solidBorderColor: PropTypes__default["default"].string,
|
|
3951
|
+
isLightTheme: PropTypes__default["default"].bool
|
|
3924
3952
|
};
|
|
3925
3953
|
SectionTag.defaultProps = {
|
|
3926
3954
|
template: "",
|
|
@@ -3947,7 +3975,7 @@ var Subheadline = function Subheadline(_ref) {
|
|
|
3947
3975
|
var subheadline = forceShowAtom || get_1(config, ["showSubheadline"], true);
|
|
3948
3976
|
if (!subheadline) return null;
|
|
3949
3977
|
var textColor = getTextColor(config.theme);
|
|
3950
|
-
return /*#__PURE__*/
|
|
3978
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3951
3979
|
style: {
|
|
3952
3980
|
WebkitLineClamp: lineClamp
|
|
3953
3981
|
},
|
|
@@ -3957,15 +3985,15 @@ var Subheadline = function Subheadline(_ref) {
|
|
|
3957
3985
|
};
|
|
3958
3986
|
Subheadline.propTypes = {
|
|
3959
3987
|
/** The Story Object from the API response */
|
|
3960
|
-
story:
|
|
3988
|
+
story: PropTypes__default["default"].object.isRequired,
|
|
3961
3989
|
// Restricts the number of lines for subheadline.
|
|
3962
|
-
lineClamp:
|
|
3990
|
+
lineClamp: PropTypes__default["default"].number,
|
|
3963
3991
|
|
|
3964
3992
|
/** Number of characters to truncate the subheadline */
|
|
3965
|
-
truncateChars:
|
|
3966
|
-
clazzName:
|
|
3967
|
-
forceShowAtom:
|
|
3968
|
-
showFullContent:
|
|
3993
|
+
truncateChars: PropTypes__default["default"].number,
|
|
3994
|
+
clazzName: PropTypes__default["default"].string,
|
|
3995
|
+
forceShowAtom: PropTypes__default["default"].bool,
|
|
3996
|
+
showFullContent: PropTypes__default["default"].bool
|
|
3969
3997
|
};
|
|
3970
3998
|
Subheadline.defaultProps = {
|
|
3971
3999
|
forceShowAtom: false,
|
|
@@ -3975,88 +4003,88 @@ Subheadline.defaultProps = {
|
|
|
3975
4003
|
var Facebook = function Facebook(_ref) {
|
|
3976
4004
|
var _ref$color = _ref.color,
|
|
3977
4005
|
color = _ref$color === void 0 ? "#3B5998" : _ref$color;
|
|
3978
|
-
return /*#__PURE__*/
|
|
4006
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
3979
4007
|
xmlns: "http://www.w3.org/2000/svg",
|
|
3980
4008
|
width: "24",
|
|
3981
4009
|
height: "24",
|
|
3982
4010
|
viewBox: "0 0 24 24"
|
|
3983
|
-
}, /*#__PURE__*/
|
|
4011
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
3984
4012
|
fill: color,
|
|
3985
4013
|
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"
|
|
3986
4014
|
}));
|
|
3987
4015
|
};
|
|
3988
4016
|
Facebook.propTypes = {
|
|
3989
|
-
color:
|
|
4017
|
+
color: PropTypes__default["default"].string
|
|
3990
4018
|
};
|
|
3991
4019
|
|
|
3992
4020
|
var LinkedIn = function LinkedIn(_ref) {
|
|
3993
4021
|
var _ref$color = _ref.color,
|
|
3994
4022
|
color = _ref$color === void 0 ? "#0077B5" : _ref$color;
|
|
3995
|
-
return /*#__PURE__*/
|
|
4023
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
3996
4024
|
xmlns: "http://www.w3.org/2000/svg",
|
|
3997
4025
|
width: "24",
|
|
3998
4026
|
height: "24",
|
|
3999
4027
|
viewBox: "0 0 24 24"
|
|
4000
|
-
}, /*#__PURE__*/
|
|
4028
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
4001
4029
|
fill: color,
|
|
4002
4030
|
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"
|
|
4003
4031
|
}));
|
|
4004
4032
|
};
|
|
4005
4033
|
LinkedIn.propTypes = {
|
|
4006
|
-
color:
|
|
4034
|
+
color: PropTypes__default["default"].string
|
|
4007
4035
|
};
|
|
4008
4036
|
|
|
4009
4037
|
var WhatsApp = function WhatsApp(_ref) {
|
|
4010
4038
|
var _ref$color = _ref.color,
|
|
4011
4039
|
color = _ref$color === void 0 ? "#4AC959" : _ref$color;
|
|
4012
|
-
return /*#__PURE__*/
|
|
4040
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
4013
4041
|
xmlns: "http://www.w3.org/2000/svg",
|
|
4014
4042
|
width: "24",
|
|
4015
4043
|
height: "24",
|
|
4016
4044
|
viewBox: "0 0 24 24"
|
|
4017
|
-
}, /*#__PURE__*/
|
|
4045
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
4018
4046
|
fill: color,
|
|
4019
4047
|
fillRule: "evenodd",
|
|
4020
4048
|
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"
|
|
4021
4049
|
}));
|
|
4022
4050
|
};
|
|
4023
4051
|
WhatsApp.propTypes = {
|
|
4024
|
-
color:
|
|
4052
|
+
color: PropTypes__default["default"].string
|
|
4025
4053
|
};
|
|
4026
4054
|
|
|
4027
4055
|
var getSocialIcons = function getSocialIcons(color, iconType) {
|
|
4028
4056
|
switch (iconType) {
|
|
4029
4057
|
case "plain-color-svg":
|
|
4030
4058
|
return {
|
|
4031
|
-
facebook: /*#__PURE__*/
|
|
4059
|
+
facebook: /*#__PURE__*/React__default["default"].createElement(Facebook, {
|
|
4032
4060
|
key: iconType
|
|
4033
4061
|
}),
|
|
4034
|
-
twitter: /*#__PURE__*/
|
|
4062
|
+
twitter: /*#__PURE__*/React__default["default"].createElement(Twitter, {
|
|
4035
4063
|
key: iconType
|
|
4036
4064
|
}),
|
|
4037
|
-
linkedin: /*#__PURE__*/
|
|
4065
|
+
linkedin: /*#__PURE__*/React__default["default"].createElement(LinkedIn, {
|
|
4038
4066
|
key: iconType
|
|
4039
4067
|
}),
|
|
4040
|
-
whatsapp: /*#__PURE__*/
|
|
4068
|
+
whatsapp: /*#__PURE__*/React__default["default"].createElement(WhatsApp, {
|
|
4041
4069
|
key: iconType
|
|
4042
4070
|
})
|
|
4043
4071
|
};
|
|
4044
4072
|
|
|
4045
4073
|
default:
|
|
4046
4074
|
return {
|
|
4047
|
-
facebook: /*#__PURE__*/
|
|
4075
|
+
facebook: /*#__PURE__*/React__default["default"].createElement(Facebook, {
|
|
4048
4076
|
color: color,
|
|
4049
4077
|
key: iconType
|
|
4050
4078
|
}),
|
|
4051
|
-
twitter: /*#__PURE__*/
|
|
4079
|
+
twitter: /*#__PURE__*/React__default["default"].createElement(Twitter, {
|
|
4052
4080
|
color: color,
|
|
4053
4081
|
key: iconType
|
|
4054
4082
|
}),
|
|
4055
|
-
linkedin: /*#__PURE__*/
|
|
4083
|
+
linkedin: /*#__PURE__*/React__default["default"].createElement(LinkedIn, {
|
|
4056
4084
|
color: color,
|
|
4057
4085
|
key: iconType
|
|
4058
4086
|
}),
|
|
4059
|
-
whatsapp: /*#__PURE__*/
|
|
4087
|
+
whatsapp: /*#__PURE__*/React__default["default"].createElement(WhatsApp, {
|
|
4060
4088
|
color: color,
|
|
4061
4089
|
key: iconType
|
|
4062
4090
|
})
|
|
@@ -4112,22 +4140,22 @@ var socialShareData = function socialShareData(_ref) {
|
|
|
4112
4140
|
var CloseIcon = function CloseIcon(_ref) {
|
|
4113
4141
|
var _ref$color = _ref.color,
|
|
4114
4142
|
color = _ref$color === void 0 ? "#333" : _ref$color;
|
|
4115
|
-
return /*#__PURE__*/
|
|
4143
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
4116
4144
|
xmlns: "http://www.w3.org/2000/svg",
|
|
4117
4145
|
width: "24",
|
|
4118
4146
|
height: "24",
|
|
4119
4147
|
viewBox: "0 0 24 24"
|
|
4120
|
-
}, /*#__PURE__*/
|
|
4148
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
4121
4149
|
fill: "none",
|
|
4122
4150
|
stroke: color,
|
|
4123
4151
|
strokeLinecap: "square",
|
|
4124
4152
|
strokeWidth: "2"
|
|
4125
|
-
}, /*#__PURE__*/
|
|
4153
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
4126
4154
|
d: "M16.95 6.914l-9.9 9.9M16.95 17.107l-9.9-9.9"
|
|
4127
4155
|
})));
|
|
4128
4156
|
};
|
|
4129
4157
|
CloseIcon.propTypes = {
|
|
4130
|
-
color:
|
|
4158
|
+
color: PropTypes__default["default"].string
|
|
4131
4159
|
};
|
|
4132
4160
|
|
|
4133
4161
|
var _styleModuleImportMap$r = {
|
|
@@ -4148,17 +4176,17 @@ var _styleModuleImportMap$r = {
|
|
|
4148
4176
|
};
|
|
4149
4177
|
|
|
4150
4178
|
var popupSocialShareItem = function popupSocialShareItem(url, icon, text, index) {
|
|
4151
|
-
return url ? /*#__PURE__*/
|
|
4179
|
+
return url ? /*#__PURE__*/React__default["default"].createElement("li", {
|
|
4152
4180
|
className: "social-share-popup-m_social-icon-wrapper__36jyV",
|
|
4153
4181
|
"data-testid": text,
|
|
4154
4182
|
key: "popup-item-".concat(index)
|
|
4155
|
-
}, /*#__PURE__*/
|
|
4183
|
+
}, /*#__PURE__*/React__default["default"].createElement("a", {
|
|
4156
4184
|
href: url,
|
|
4157
4185
|
target: "_blank",
|
|
4158
4186
|
rel: "noopener noreferrer",
|
|
4159
4187
|
className: "social-share-popup-m_social-wrapper__1lPzr",
|
|
4160
4188
|
"aria-label": "social-icon"
|
|
4161
|
-
}, icon, /*#__PURE__*/
|
|
4189
|
+
}, icon, /*#__PURE__*/React__default["default"].createElement("span", {
|
|
4162
4190
|
className: "social-share-popup-m_social-text__1QPXb"
|
|
4163
4191
|
}, text))) : null;
|
|
4164
4192
|
};
|
|
@@ -4188,20 +4216,20 @@ var SocialSharePopup = function SocialSharePopup(_ref) {
|
|
|
4188
4216
|
iconType: iconType
|
|
4189
4217
|
};
|
|
4190
4218
|
var popupItemsList = socialShareData(options);
|
|
4191
|
-
return /*#__PURE__*/
|
|
4219
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4192
4220
|
className: _getClassName("share-popup-wrapper ".concat(textColor), _styleModuleImportMap$r)
|
|
4193
|
-
}, /*#__PURE__*/
|
|
4221
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4194
4222
|
className: "social-share-popup-m_share-popup__QRt3l social-share-popup-m_share-popup-wrapper__GEJqD"
|
|
4195
|
-
}, /*#__PURE__*/
|
|
4223
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4196
4224
|
className: "social-share-popup-m_top-bar__174Um"
|
|
4197
|
-
}, /*#__PURE__*/
|
|
4225
|
+
}, /*#__PURE__*/React__default["default"].createElement("span", {
|
|
4198
4226
|
className: "social-share-popup-m_share-text__19E-F"
|
|
4199
|
-
}, "Share via"), /*#__PURE__*/
|
|
4227
|
+
}, "Share via"), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
4200
4228
|
className: "social-share-popup-m_close__3k-Hj",
|
|
4201
4229
|
onClick: closePopup
|
|
4202
|
-
}, /*#__PURE__*/
|
|
4230
|
+
}, /*#__PURE__*/React__default["default"].createElement(CloseIcon, {
|
|
4203
4231
|
color: iconColor
|
|
4204
|
-
}))), /*#__PURE__*/
|
|
4232
|
+
}))), /*#__PURE__*/React__default["default"].createElement("ul", {
|
|
4205
4233
|
className: "social-share-popup-m_wrapper__3Ytce"
|
|
4206
4234
|
}, popupItemsList.map(function (_ref2, index) {
|
|
4207
4235
|
var url = _ref2.url,
|
|
@@ -4213,33 +4241,33 @@ var SocialSharePopup = function SocialSharePopup(_ref) {
|
|
|
4213
4241
|
}))));
|
|
4214
4242
|
};
|
|
4215
4243
|
SocialSharePopup.propTypes = {
|
|
4216
|
-
fbUrl:
|
|
4217
|
-
twitterUrl:
|
|
4218
|
-
linkedinUrl:
|
|
4219
|
-
whatsappUrl:
|
|
4220
|
-
grey:
|
|
4221
|
-
primaryColor:
|
|
4222
|
-
closePopup:
|
|
4223
|
-
theme:
|
|
4224
|
-
iconType:
|
|
4244
|
+
fbUrl: PropTypes__default["default"].string,
|
|
4245
|
+
twitterUrl: PropTypes__default["default"].string,
|
|
4246
|
+
linkedinUrl: PropTypes__default["default"].string,
|
|
4247
|
+
whatsappUrl: PropTypes__default["default"].string,
|
|
4248
|
+
grey: PropTypes__default["default"].string,
|
|
4249
|
+
primaryColor: PropTypes__default["default"].string,
|
|
4250
|
+
closePopup: PropTypes__default["default"].bool,
|
|
4251
|
+
theme: PropTypes__default["default"].string,
|
|
4252
|
+
iconType: PropTypes__default["default"].string
|
|
4225
4253
|
};
|
|
4226
4254
|
|
|
4227
4255
|
var ShareIcon = function ShareIcon(_ref) {
|
|
4228
4256
|
var _ref$color = _ref.color,
|
|
4229
4257
|
color = _ref$color === void 0 ? "#0D0D0D" : _ref$color;
|
|
4230
|
-
return /*#__PURE__*/
|
|
4258
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
4231
4259
|
xmlns: "http://www.w3.org/2000/svg",
|
|
4232
4260
|
width: "24",
|
|
4233
4261
|
height: "24",
|
|
4234
4262
|
viewBox: "0 0 24 24"
|
|
4235
|
-
}, /*#__PURE__*/
|
|
4263
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
4236
4264
|
fill: color,
|
|
4237
4265
|
fillRule: "evenodd",
|
|
4238
4266
|
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"
|
|
4239
4267
|
}));
|
|
4240
4268
|
};
|
|
4241
4269
|
ShareIcon.propTypes = {
|
|
4242
|
-
color:
|
|
4270
|
+
color: PropTypes__default["default"].string
|
|
4243
4271
|
};
|
|
4244
4272
|
|
|
4245
4273
|
/**
|
|
@@ -4508,10 +4536,10 @@ var ShareItem = function ShareItem(_ref) {
|
|
|
4508
4536
|
url = _ref.url,
|
|
4509
4537
|
icon = _ref.icon,
|
|
4510
4538
|
dataTestId = _ref.dataTestId;
|
|
4511
|
-
return url ? /*#__PURE__*/
|
|
4539
|
+
return url ? /*#__PURE__*/React__default["default"].createElement("li", {
|
|
4512
4540
|
"data-testid": dataTestId,
|
|
4513
4541
|
className: "social-share-template-m_icon__1Mnu5"
|
|
4514
|
-
}, /*#__PURE__*/
|
|
4542
|
+
}, /*#__PURE__*/React__default["default"].createElement("a", {
|
|
4515
4543
|
href: url,
|
|
4516
4544
|
target: "_blank",
|
|
4517
4545
|
rel: "noopener noreferrer",
|
|
@@ -4521,17 +4549,17 @@ var ShareItem = function ShareItem(_ref) {
|
|
|
4521
4549
|
};
|
|
4522
4550
|
|
|
4523
4551
|
ShareItem.propTypes = {
|
|
4524
|
-
name:
|
|
4525
|
-
url:
|
|
4526
|
-
icon:
|
|
4527
|
-
dataTestId:
|
|
4552
|
+
name: PropTypes__default["default"].string,
|
|
4553
|
+
url: PropTypes__default["default"].string,
|
|
4554
|
+
icon: PropTypes__default["default"].node,
|
|
4555
|
+
dataTestId: PropTypes__default["default"].string
|
|
4528
4556
|
};
|
|
4529
4557
|
|
|
4530
4558
|
function getActionIcon(open, color) {
|
|
4531
|
-
if (!open) return /*#__PURE__*/
|
|
4559
|
+
if (!open) return /*#__PURE__*/React__default["default"].createElement(ShareIcon, {
|
|
4532
4560
|
color: color
|
|
4533
4561
|
});
|
|
4534
|
-
return /*#__PURE__*/
|
|
4562
|
+
return /*#__PURE__*/React__default["default"].createElement(CloseIcon, {
|
|
4535
4563
|
color: color
|
|
4536
4564
|
});
|
|
4537
4565
|
}
|
|
@@ -4565,21 +4593,21 @@ var SocialShareTemplate = function SocialShareTemplate(props) {
|
|
|
4565
4593
|
};
|
|
4566
4594
|
var iconsList = socialShareData(options);
|
|
4567
4595
|
|
|
4568
|
-
var _useState = useState(open),
|
|
4596
|
+
var _useState = React.useState(open),
|
|
4569
4597
|
_useState2 = _slicedToArray(_useState, 2),
|
|
4570
4598
|
isOpen = _useState2[0],
|
|
4571
4599
|
setIsOpen = _useState2[1];
|
|
4572
4600
|
|
|
4573
4601
|
var verticalShare = vertical ? "vertical" : "horizontal";
|
|
4574
|
-
useEffect(function () {
|
|
4602
|
+
React.useEffect(function () {
|
|
4575
4603
|
return setIsOpen(open);
|
|
4576
4604
|
}, [open]);
|
|
4577
4605
|
|
|
4578
4606
|
var shareIcon = function shareIcon() {
|
|
4579
|
-
return /*#__PURE__*/
|
|
4607
|
+
return /*#__PURE__*/React__default["default"].createElement("li", {
|
|
4580
4608
|
className: "social-share-template-m_icon__1Mnu5",
|
|
4581
4609
|
key: "horizontal-0"
|
|
4582
|
-
}, /*#__PURE__*/
|
|
4610
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4583
4611
|
onClick: clickHandler
|
|
4584
4612
|
}, getActionIcon(isOpen, iconColor)));
|
|
4585
4613
|
};
|
|
@@ -4589,16 +4617,16 @@ var SocialShareTemplate = function SocialShareTemplate(props) {
|
|
|
4589
4617
|
};
|
|
4590
4618
|
|
|
4591
4619
|
var popUpWrapper = function popUpWrapper() {
|
|
4592
|
-
return /*#__PURE__*/
|
|
4620
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4593
4621
|
className: "social-share-template-m_tablet-view__kATzi"
|
|
4594
|
-
}, !isOpen && /*#__PURE__*/
|
|
4622
|
+
}, !isOpen && /*#__PURE__*/React__default["default"].createElement("ul", {
|
|
4595
4623
|
className: _getClassName("wrapper ".concat(isOpen ? "open" : ""), _styleModuleImportMap$q)
|
|
4596
|
-
}, shareIcon()), isOpen && /*#__PURE__*/
|
|
4624
|
+
}, shareIcon()), isOpen && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4597
4625
|
className: "social-share-template-m_overlay__1nBp-",
|
|
4598
4626
|
onClick: clickHandler
|
|
4599
|
-
}, /*#__PURE__*/
|
|
4627
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4600
4628
|
className: "arr--popup " + _getClassName("popup-wrapper ".concat(isOpen ? "popup-open" : ""), _styleModuleImportMap$q)
|
|
4601
|
-
}, /*#__PURE__*/
|
|
4629
|
+
}, /*#__PURE__*/React__default["default"].createElement(SocialSharePopup, {
|
|
4602
4630
|
fbUrl: fbUrl,
|
|
4603
4631
|
twitterUrl: twitterUrl,
|
|
4604
4632
|
linkedinUrl: linkedinUrl,
|
|
@@ -4612,30 +4640,30 @@ var SocialShareTemplate = function SocialShareTemplate(props) {
|
|
|
4612
4640
|
};
|
|
4613
4641
|
|
|
4614
4642
|
var popupStyle = !isOpen && vertical ? "tablet-view-popup" : "";
|
|
4615
|
-
return /*#__PURE__*/
|
|
4643
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4616
4644
|
"data-test-id": verticalShare,
|
|
4617
4645
|
className: "arr--share " + _getClassName("".concat(iconShade, " ").concat(verticalShare, " ").concat(popupStyle), _styleModuleImportMap$q)
|
|
4618
|
-
}, /*#__PURE__*/
|
|
4646
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4619
4647
|
className: "social-share-template-m_desktop-view__3TmkO"
|
|
4620
|
-
}, /*#__PURE__*/
|
|
4648
|
+
}, /*#__PURE__*/React__default["default"].createElement("ul", {
|
|
4621
4649
|
"data-test-id": camelCase_1(iconType),
|
|
4622
4650
|
className: "desktop-share-wrapper " + _getClassName("wrapper ".concat(isOpen ? "open" : ""), _styleModuleImportMap$q)
|
|
4623
4651
|
}, shareIcon(), iconsList.map(function (iconData, index) {
|
|
4624
|
-
return /*#__PURE__*/
|
|
4652
|
+
return /*#__PURE__*/React__default["default"].createElement(ShareItem, _extends({}, iconData, {
|
|
4625
4653
|
key: iconData.name,
|
|
4626
4654
|
dataTestId: "card-share-".concat(index)
|
|
4627
4655
|
}));
|
|
4628
4656
|
}))), popUpWrapper());
|
|
4629
4657
|
};
|
|
4630
4658
|
SocialShareTemplate.propTypes = {
|
|
4631
|
-
fbUrl:
|
|
4632
|
-
twitterUrl:
|
|
4633
|
-
linkedinUrl:
|
|
4634
|
-
whatsappUrl:
|
|
4635
|
-
vertical:
|
|
4636
|
-
theme:
|
|
4637
|
-
iconType:
|
|
4638
|
-
open:
|
|
4659
|
+
fbUrl: PropTypes__default["default"].string,
|
|
4660
|
+
twitterUrl: PropTypes__default["default"].string,
|
|
4661
|
+
linkedinUrl: PropTypes__default["default"].string,
|
|
4662
|
+
whatsappUrl: PropTypes__default["default"].string,
|
|
4663
|
+
vertical: PropTypes__default["default"].bool,
|
|
4664
|
+
theme: PropTypes__default["default"].string,
|
|
4665
|
+
iconType: PropTypes__default["default"].string,
|
|
4666
|
+
open: PropTypes__default["default"]["boolean"]
|
|
4639
4667
|
};
|
|
4640
4668
|
|
|
4641
4669
|
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
@@ -4681,13 +4709,13 @@ var withElementWrapper = function withElementWrapper(StoryElement) {
|
|
|
4681
4709
|
|
|
4682
4710
|
if (!element) return null;
|
|
4683
4711
|
if (render && typeof render === "function") return render(props);
|
|
4684
|
-
return /*#__PURE__*/
|
|
4712
|
+
return /*#__PURE__*/React__default["default"].createElement(StoryElement, _extends({}, restProps, {
|
|
4685
4713
|
element: element
|
|
4686
4714
|
}));
|
|
4687
4715
|
};
|
|
4688
4716
|
};
|
|
4689
4717
|
withElementWrapper.propTypes = {
|
|
4690
|
-
StoryElement:
|
|
4718
|
+
StoryElement: PropTypes__default["default"].element
|
|
4691
4719
|
};
|
|
4692
4720
|
|
|
4693
4721
|
var _excluded$d = ["element", "opts", "css", "story", "config"];
|
|
@@ -4723,7 +4751,7 @@ var TextBase = function TextBase(_ref) {
|
|
|
4723
4751
|
var text = isExternalLink && updateContentLinks(content) || content;
|
|
4724
4752
|
var isPromotionalMessage = get_1(element, ["metadata", "promotional-message"], false);
|
|
4725
4753
|
var updatedStyle = isPromotionalMessage ? "promotionalMessage" : "textElement";
|
|
4726
|
-
return /*#__PURE__*/
|
|
4754
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
4727
4755
|
style: !isPromotionalMessage ? {
|
|
4728
4756
|
color: textColor
|
|
4729
4757
|
} : {},
|
|
@@ -4738,15 +4766,15 @@ var TextBase = function TextBase(_ref) {
|
|
|
4738
4766
|
};
|
|
4739
4767
|
|
|
4740
4768
|
TextBase.propTypes = {
|
|
4741
|
-
element:
|
|
4742
|
-
text:
|
|
4769
|
+
element: PropTypes__default["default"].shape({
|
|
4770
|
+
text: PropTypes__default["default"].string
|
|
4743
4771
|
}),
|
|
4744
|
-
opts:
|
|
4745
|
-
isExternalLink:
|
|
4772
|
+
opts: PropTypes__default["default"].shape({
|
|
4773
|
+
isExternalLink: PropTypes__default["default"].bool
|
|
4746
4774
|
}),
|
|
4747
|
-
css:
|
|
4748
|
-
hyperlinkColor:
|
|
4749
|
-
textColor:
|
|
4775
|
+
css: PropTypes__default["default"].shape({
|
|
4776
|
+
hyperlinkColor: PropTypes__default["default"].string,
|
|
4777
|
+
textColor: PropTypes__default["default"].string
|
|
4750
4778
|
}),
|
|
4751
4779
|
story: shapeStory,
|
|
4752
4780
|
config: shapeConfig
|
|
@@ -4787,13 +4815,13 @@ var BlurbBase = function BlurbBase(_ref) {
|
|
|
4787
4815
|
borderLeft: "solid 2px ".concat(borderColor)
|
|
4788
4816
|
};
|
|
4789
4817
|
|
|
4790
|
-
var _useState = useState(initBorderDirection),
|
|
4818
|
+
var _useState = React.useState(initBorderDirection),
|
|
4791
4819
|
_useState2 = _slicedToArray(_useState, 2),
|
|
4792
4820
|
borderDirection = _useState2[0],
|
|
4793
4821
|
setBorderDirection = _useState2[1];
|
|
4794
4822
|
|
|
4795
4823
|
if (!content) return null;
|
|
4796
|
-
useEffect(function () {
|
|
4824
|
+
React.useEffect(function () {
|
|
4797
4825
|
var htmlElement = document.getElementsByTagName("HTML");
|
|
4798
4826
|
|
|
4799
4827
|
if (htmlElement && htmlElement.length) {
|
|
@@ -4810,7 +4838,7 @@ var BlurbBase = function BlurbBase(_ref) {
|
|
|
4810
4838
|
var templateStyle = template ? "blurb-".concat(template) : "blurb";
|
|
4811
4839
|
var configData = useStateValue() || {};
|
|
4812
4840
|
var textInvertColor = getTextColor(configData.theme);
|
|
4813
|
-
return /*#__PURE__*/
|
|
4841
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
4814
4842
|
"data-test-id": "blurb",
|
|
4815
4843
|
style: borderColor && borderDirection,
|
|
4816
4844
|
dangerouslySetInnerHTML: {
|
|
@@ -4822,19 +4850,19 @@ var BlurbBase = function BlurbBase(_ref) {
|
|
|
4822
4850
|
};
|
|
4823
4851
|
|
|
4824
4852
|
BlurbBase.propTypes = {
|
|
4825
|
-
element:
|
|
4826
|
-
text:
|
|
4853
|
+
element: PropTypes__default["default"].shape({
|
|
4854
|
+
text: PropTypes__default["default"].string
|
|
4827
4855
|
}),
|
|
4828
4856
|
|
|
4829
4857
|
/** templates can be either default or withBorder */
|
|
4830
|
-
template:
|
|
4831
|
-
opts:
|
|
4832
|
-
isExternalLink:
|
|
4858
|
+
template: PropTypes__default["default"].string,
|
|
4859
|
+
opts: PropTypes__default["default"].shape({
|
|
4860
|
+
isExternalLink: PropTypes__default["default"].bool
|
|
4833
4861
|
}),
|
|
4834
4862
|
story: shapeStory,
|
|
4835
4863
|
config: shapeConfig,
|
|
4836
|
-
render:
|
|
4837
|
-
css:
|
|
4864
|
+
render: PropTypes__default["default"].func,
|
|
4865
|
+
css: PropTypes__default["default"].object
|
|
4838
4866
|
};
|
|
4839
4867
|
var Blurb = withElementWrapper(BlurbBase);
|
|
4840
4868
|
|
|
@@ -4887,19 +4915,19 @@ var SummaryBase = function SummaryBase(_ref) {
|
|
|
4887
4915
|
var updateHeaderColor = renderTemplate ? "".concat(headerBgColor) : "";
|
|
4888
4916
|
var textColor = renderTemplate ? getTextColor(headerBgColor) : "";
|
|
4889
4917
|
var updateContentColor = template === "header" ? "" : textInvertColor;
|
|
4890
|
-
return /*#__PURE__*/
|
|
4918
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
4891
4919
|
"data-test-id": "summary"
|
|
4892
4920
|
}, restProps, {
|
|
4893
4921
|
className: "arrow-component arr--summary-element arr-custom-style " + _getClassName(templateStyle, _styleModuleImportMap$n) + (" " + (restProps ? restProps.className || "" : ""))
|
|
4894
|
-
}), !hideHeadline && /*#__PURE__*/
|
|
4922
|
+
}), !hideHeadline && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4895
4923
|
"data-test-id": "summary-headline",
|
|
4896
4924
|
className: _getClassName("heading-wrapper ".concat(textInvertColor), _styleModuleImportMap$n)
|
|
4897
|
-
}, /*#__PURE__*/
|
|
4925
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4898
4926
|
style: {
|
|
4899
4927
|
backgroundColor: updateHeaderColor
|
|
4900
4928
|
},
|
|
4901
4929
|
className: _getClassName("headline ".concat(textColor, " ").concat(textInvertColor), _styleModuleImportMap$n)
|
|
4902
|
-
}, headline)), /*#__PURE__*/
|
|
4930
|
+
}, headline)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4903
4931
|
dangerouslySetInnerHTML: {
|
|
4904
4932
|
__html: text
|
|
4905
4933
|
},
|
|
@@ -4908,20 +4936,20 @@ var SummaryBase = function SummaryBase(_ref) {
|
|
|
4908
4936
|
};
|
|
4909
4937
|
|
|
4910
4938
|
SummaryBase.propTypes = {
|
|
4911
|
-
element:
|
|
4912
|
-
text:
|
|
4939
|
+
element: PropTypes__default["default"].shape({
|
|
4940
|
+
text: PropTypes__default["default"].string
|
|
4913
4941
|
}),
|
|
4914
|
-
template:
|
|
4915
|
-
opts:
|
|
4916
|
-
isExternalLink:
|
|
4917
|
-
headline:
|
|
4918
|
-
hideHeadline:
|
|
4942
|
+
template: PropTypes__default["default"].string,
|
|
4943
|
+
opts: PropTypes__default["default"].shape({
|
|
4944
|
+
isExternalLink: PropTypes__default["default"].bool,
|
|
4945
|
+
headline: PropTypes__default["default"].string,
|
|
4946
|
+
hideHeadline: PropTypes__default["default"].bool
|
|
4919
4947
|
}),
|
|
4920
4948
|
story: shapeStory,
|
|
4921
4949
|
config: shapeConfig,
|
|
4922
|
-
render:
|
|
4923
|
-
css:
|
|
4924
|
-
headerBgColor:
|
|
4950
|
+
render: PropTypes__default["default"].func,
|
|
4951
|
+
css: PropTypes__default["default"].shape({
|
|
4952
|
+
headerBgColor: PropTypes__default["default"].string
|
|
4925
4953
|
})
|
|
4926
4954
|
};
|
|
4927
4955
|
var Summary = withElementWrapper(SummaryBase);
|
|
@@ -4933,27 +4961,27 @@ var CurveIcon = function CurveIcon(_ref) {
|
|
|
4933
4961
|
opacity = _ref.opacity;
|
|
4934
4962
|
var lightColor = color === "light" && "#ffffff";
|
|
4935
4963
|
var darkColor = color === "dark" && "#0d0d0d";
|
|
4936
|
-
return /*#__PURE__*/
|
|
4964
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4937
4965
|
className: "icon-m_curve-wrapper__3-sLV",
|
|
4938
4966
|
style: {
|
|
4939
4967
|
fill: "".concat(lightColor || darkColor || color)
|
|
4940
4968
|
}
|
|
4941
|
-
}, /*#__PURE__*/
|
|
4969
|
+
}, /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
4942
4970
|
xmlns: "http://www.w3.org/2000/svg",
|
|
4943
4971
|
width: width,
|
|
4944
4972
|
height: height,
|
|
4945
4973
|
viewBox: "0 0 64 64"
|
|
4946
|
-
}, /*#__PURE__*/
|
|
4974
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
4947
4975
|
fill: "inherit",
|
|
4948
4976
|
opacity: opacity,
|
|
4949
4977
|
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"
|
|
4950
4978
|
})));
|
|
4951
4979
|
};
|
|
4952
4980
|
CurveIcon.propTypes = {
|
|
4953
|
-
width:
|
|
4954
|
-
height:
|
|
4955
|
-
color:
|
|
4956
|
-
opacity:
|
|
4981
|
+
width: PropTypes__default["default"].string,
|
|
4982
|
+
height: PropTypes__default["default"].string,
|
|
4983
|
+
color: PropTypes__default["default"].string,
|
|
4984
|
+
opacity: PropTypes__default["default"].string
|
|
4957
4985
|
};
|
|
4958
4986
|
|
|
4959
4987
|
var EdgeIcon = function EdgeIcon(_ref) {
|
|
@@ -4963,27 +4991,27 @@ var EdgeIcon = function EdgeIcon(_ref) {
|
|
|
4963
4991
|
opacity = _ref.opacity;
|
|
4964
4992
|
var lightColor = color === "light" && "#ffffff";
|
|
4965
4993
|
var darkColor = color === "dark" && "#0d0d0d";
|
|
4966
|
-
return /*#__PURE__*/
|
|
4994
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
4967
4995
|
className: "icon-m_edge-wrapper__xUOdp",
|
|
4968
4996
|
style: {
|
|
4969
4997
|
fill: "".concat(lightColor || darkColor || color)
|
|
4970
4998
|
}
|
|
4971
|
-
}, /*#__PURE__*/
|
|
4999
|
+
}, /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
4972
5000
|
xmlns: "http://www.w3.org/2000/svg",
|
|
4973
5001
|
width: width,
|
|
4974
5002
|
height: height,
|
|
4975
5003
|
viewBox: "0 0 64 64"
|
|
4976
|
-
}, /*#__PURE__*/
|
|
5004
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
4977
5005
|
fill: "inherit",
|
|
4978
5006
|
opacity: opacity,
|
|
4979
5007
|
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"
|
|
4980
5008
|
})));
|
|
4981
5009
|
};
|
|
4982
5010
|
EdgeIcon.propTypes = {
|
|
4983
|
-
width:
|
|
4984
|
-
height:
|
|
4985
|
-
color:
|
|
4986
|
-
opacity:
|
|
5011
|
+
width: PropTypes__default["default"].string,
|
|
5012
|
+
height: PropTypes__default["default"].string,
|
|
5013
|
+
color: PropTypes__default["default"].string,
|
|
5014
|
+
opacity: PropTypes__default["default"].string
|
|
4987
5015
|
};
|
|
4988
5016
|
|
|
4989
5017
|
var _excluded$a = ["element", "template", "css", "story", "config", "render"];
|
|
@@ -5013,7 +5041,7 @@ var SelectionOfIcon = function SelectionOfIcon(iconType, template, blockQuoteCol
|
|
|
5013
5041
|
|
|
5014
5042
|
if (template === "withBackground") {
|
|
5015
5043
|
if (iconType === "edgeIcon") {
|
|
5016
|
-
return /*#__PURE__*/
|
|
5044
|
+
return /*#__PURE__*/React__default["default"].createElement(EdgeIcon, {
|
|
5017
5045
|
width: dimension,
|
|
5018
5046
|
height: dimension,
|
|
5019
5047
|
color: quoteColor,
|
|
@@ -5021,7 +5049,7 @@ var SelectionOfIcon = function SelectionOfIcon(iconType, template, blockQuoteCol
|
|
|
5021
5049
|
});
|
|
5022
5050
|
}
|
|
5023
5051
|
|
|
5024
|
-
return /*#__PURE__*/
|
|
5052
|
+
return /*#__PURE__*/React__default["default"].createElement(CurveIcon, {
|
|
5025
5053
|
width: dimension,
|
|
5026
5054
|
height: dimension,
|
|
5027
5055
|
color: quoteColor,
|
|
@@ -5031,14 +5059,14 @@ var SelectionOfIcon = function SelectionOfIcon(iconType, template, blockQuoteCol
|
|
|
5031
5059
|
|
|
5032
5060
|
if (template !== "withBackground") {
|
|
5033
5061
|
if (iconType === "edgeIcon") {
|
|
5034
|
-
return /*#__PURE__*/
|
|
5062
|
+
return /*#__PURE__*/React__default["default"].createElement(EdgeIcon, {
|
|
5035
5063
|
width: dimension,
|
|
5036
5064
|
height: dimension,
|
|
5037
5065
|
color: blockQuoteColor
|
|
5038
5066
|
});
|
|
5039
5067
|
}
|
|
5040
5068
|
|
|
5041
|
-
return /*#__PURE__*/
|
|
5069
|
+
return /*#__PURE__*/React__default["default"].createElement(CurveIcon, {
|
|
5042
5070
|
width: dimension,
|
|
5043
5071
|
height: dimension,
|
|
5044
5072
|
color: blockQuoteColor
|
|
@@ -5074,38 +5102,38 @@ var BlockQuoteBase = function BlockQuoteBase(_ref) {
|
|
|
5074
5102
|
var textInvertColor = getTextColor(isBackground ? theme.backgroundColor : configData.theme);
|
|
5075
5103
|
|
|
5076
5104
|
var updateStructure = function updateStructure() {
|
|
5077
|
-
return template === "withBorder" ? /*#__PURE__*/
|
|
5105
|
+
return template === "withBorder" ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5078
5106
|
className: "block-quote-m_icon-border__2xQQY"
|
|
5079
|
-
}, /*#__PURE__*/
|
|
5107
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5080
5108
|
className: "block-quote-m_icon__m-EIZ"
|
|
5081
|
-
}, SelectionOfIcon(iconType, template, blockQuoteColor, textColor)), /*#__PURE__*/
|
|
5109
|
+
}, SelectionOfIcon(iconType, template, blockQuoteColor, textColor)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5082
5110
|
className: "block-quote-m_border__1ZTPR",
|
|
5083
5111
|
style: blockQuoteColor && {
|
|
5084
5112
|
backgroundColor: blockQuoteColor
|
|
5085
5113
|
}
|
|
5086
|
-
})) : /*#__PURE__*/
|
|
5114
|
+
})) : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5087
5115
|
className: "block-quote-m_icon__m-EIZ"
|
|
5088
5116
|
}, SelectionOfIcon(iconType, template, blockQuoteColor, textColor));
|
|
5089
5117
|
};
|
|
5090
5118
|
|
|
5091
|
-
return /*#__PURE__*/
|
|
5119
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
5092
5120
|
"data-test-id": "blockquote",
|
|
5093
5121
|
style: theme
|
|
5094
5122
|
}, restProps, {
|
|
5095
5123
|
className: "arrow-component arr--block-quote " + _getClassName("".concat(templateStyle, " ").concat(textColor), _styleModuleImportMap$m) + (" " + (restProps ? restProps.className || "" : ""))
|
|
5096
|
-
}), /*#__PURE__*/
|
|
5124
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5097
5125
|
className: "block-quote-m_quote-wrapper__83bEy"
|
|
5098
|
-
}, updateStructure(), /*#__PURE__*/
|
|
5126
|
+
}, updateStructure(), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5099
5127
|
className: "block-quote-m_wrapper__2KEhw",
|
|
5100
5128
|
style: blockQuoteColor && {
|
|
5101
5129
|
borderColor: blockQuoteColor
|
|
5102
5130
|
}
|
|
5103
|
-
}, /*#__PURE__*/
|
|
5131
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5104
5132
|
dangerouslySetInnerHTML: {
|
|
5105
5133
|
__html: content
|
|
5106
5134
|
},
|
|
5107
5135
|
className: _getClassName("content ".concat(textInvertColor), _styleModuleImportMap$m)
|
|
5108
|
-
}), /*#__PURE__*/
|
|
5136
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5109
5137
|
dangerouslySetInnerHTML: {
|
|
5110
5138
|
__html: attribution
|
|
5111
5139
|
},
|
|
@@ -5113,17 +5141,17 @@ var BlockQuoteBase = function BlockQuoteBase(_ref) {
|
|
|
5113
5141
|
}))));
|
|
5114
5142
|
};
|
|
5115
5143
|
BlockQuoteBase.propTypes = {
|
|
5116
|
-
element:
|
|
5117
|
-
metadata:
|
|
5118
|
-
content:
|
|
5119
|
-
attribution:
|
|
5144
|
+
element: PropTypes__default["default"].shape({
|
|
5145
|
+
metadata: PropTypes__default["default"].shape({
|
|
5146
|
+
content: PropTypes__default["default"].string,
|
|
5147
|
+
attribution: PropTypes__default["default"].string
|
|
5120
5148
|
})
|
|
5121
5149
|
}),
|
|
5122
|
-
template:
|
|
5150
|
+
template: PropTypes__default["default"].string,
|
|
5123
5151
|
story: shapeStory,
|
|
5124
5152
|
config: shapeConfig,
|
|
5125
|
-
render:
|
|
5126
|
-
css:
|
|
5153
|
+
render: PropTypes__default["default"].func,
|
|
5154
|
+
css: PropTypes__default["default"].object
|
|
5127
5155
|
};
|
|
5128
5156
|
var BlockQuote = withElementWrapper(BlockQuoteBase);
|
|
5129
5157
|
|
|
@@ -5151,27 +5179,27 @@ var BigFactBase = function BigFactBase(_ref) {
|
|
|
5151
5179
|
var _element$metadata = element.metadata,
|
|
5152
5180
|
content = _element$metadata.content,
|
|
5153
5181
|
attribution = _element$metadata.attribution;
|
|
5154
|
-
return /*#__PURE__*/
|
|
5182
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
5155
5183
|
"data-test-id": "bigfact"
|
|
5156
5184
|
}, restProps, {
|
|
5157
5185
|
className: "arrow-component arr--bigfact-element " + _getClassName("bigfact-element ".concat(textInvertColor), _styleModuleImportMap$l) + (" " + (restProps ? restProps.className || "" : ""))
|
|
5158
|
-
}), /*#__PURE__*/
|
|
5186
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5159
5187
|
className: "big-fact-m_content__1u2Ul"
|
|
5160
|
-
}, content), /*#__PURE__*/
|
|
5188
|
+
}, content), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5161
5189
|
"data-test-id": "attribution",
|
|
5162
5190
|
className: _getClassName("attribution ".concat(textInvertColor), _styleModuleImportMap$l)
|
|
5163
5191
|
}, attribution));
|
|
5164
5192
|
};
|
|
5165
5193
|
|
|
5166
5194
|
BigFactBase.propTypes = {
|
|
5167
|
-
element:
|
|
5168
|
-
metadata:
|
|
5169
|
-
content:
|
|
5170
|
-
attribution:
|
|
5195
|
+
element: PropTypes__default["default"].shape({
|
|
5196
|
+
metadata: PropTypes__default["default"].shape({
|
|
5197
|
+
content: PropTypes__default["default"].string,
|
|
5198
|
+
attribution: PropTypes__default["default"].string
|
|
5171
5199
|
})
|
|
5172
5200
|
}),
|
|
5173
|
-
story:
|
|
5174
|
-
config:
|
|
5201
|
+
story: PropTypes__default["default"].object,
|
|
5202
|
+
config: PropTypes__default["default"].object
|
|
5175
5203
|
};
|
|
5176
5204
|
var BigFact = withElementWrapper(BigFactBase);
|
|
5177
5205
|
|
|
@@ -5205,11 +5233,11 @@ var DisplayImage = function DisplayImage(_ref) {
|
|
|
5205
5233
|
var rightAlignAspectRatio = isRightAlign && isMobile ? [4, 3] : [16, 9];
|
|
5206
5234
|
var imageAspectRatio = isLeftAlign ? [16, 9] : rightAlignAspectRatio;
|
|
5207
5235
|
var alternateText = story["hero-image-caption"] || story["headline"];
|
|
5208
|
-
return /*#__PURE__*/
|
|
5236
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5209
5237
|
className: "also-read-m_card-image-wrapper__3GFzu"
|
|
5210
|
-
}, !isEmpty(linkedImage) ? /*#__PURE__*/
|
|
5238
|
+
}, !isEmpty(linkedImage) ? /*#__PURE__*/React__default["default"].createElement("figure", {
|
|
5211
5239
|
className: "also-read-m_card-image__3CwAv"
|
|
5212
|
-
}, /*#__PURE__*/
|
|
5240
|
+
}, /*#__PURE__*/React__default["default"].createElement(components.LazyLoadImages, null, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
|
|
5213
5241
|
slug: linkedImage,
|
|
5214
5242
|
"aspect-ratio": imageAspectRatio,
|
|
5215
5243
|
defaultWidth: 480,
|
|
@@ -5218,19 +5246,19 @@ var DisplayImage = function DisplayImage(_ref) {
|
|
|
5218
5246
|
auto: ["format", "compress"]
|
|
5219
5247
|
},
|
|
5220
5248
|
alt: alternateText
|
|
5221
|
-
}))) : /*#__PURE__*/
|
|
5249
|
+
}))) : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5222
5250
|
className: "arr--fallback-also-read also-read-m_image__2jdRP"
|
|
5223
|
-
}, /*#__PURE__*/
|
|
5251
|
+
}, /*#__PURE__*/React__default["default"].createElement(FallbackImage, null)));
|
|
5224
5252
|
};
|
|
5225
5253
|
|
|
5226
5254
|
DisplayImage.propTypes = {
|
|
5227
|
-
story:
|
|
5228
|
-
"hero-image-caption":
|
|
5229
|
-
headline:
|
|
5255
|
+
story: PropTypes__default["default"].shape({
|
|
5256
|
+
"hero-image-caption": PropTypes__default["default"].string,
|
|
5257
|
+
headline: PropTypes__default["default"].string
|
|
5230
5258
|
}),
|
|
5231
|
-
linkedImage:
|
|
5232
|
-
template:
|
|
5233
|
-
isRightAlign:
|
|
5259
|
+
linkedImage: PropTypes__default["default"].string,
|
|
5260
|
+
template: PropTypes__default["default"].string,
|
|
5261
|
+
isRightAlign: PropTypes__default["default"].bool
|
|
5234
5262
|
};
|
|
5235
5263
|
|
|
5236
5264
|
var AlsoReadBase = function AlsoReadBase(_ref2) {
|
|
@@ -5263,22 +5291,22 @@ var AlsoReadBase = function AlsoReadBase(_ref2) {
|
|
|
5263
5291
|
var isDefault = template === "" || template === "default";
|
|
5264
5292
|
var isRightAlign = template === "imageRightAlign";
|
|
5265
5293
|
var templateStyle = template ? "alsoread-".concat(template) : "alsoread-default";
|
|
5266
|
-
return /*#__PURE__*/
|
|
5294
|
+
return /*#__PURE__*/React__default["default"].createElement(components.Link, _extends({
|
|
5267
5295
|
"data-test-id": "also-read",
|
|
5268
5296
|
href: storyUrl,
|
|
5269
5297
|
"aria-label": "also-read"
|
|
5270
5298
|
}, restProps, {
|
|
5271
5299
|
className: "arrow-component arr--also-read-element " + _getClassName(templateStyle, _styleModuleImportMap$k) + (" " + (restProps ? restProps.className || "" : ""))
|
|
5272
|
-
}), !isDefault && /*#__PURE__*/
|
|
5300
|
+
}), !isDefault && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5273
5301
|
className: _getClassName("default-text ".concat(textInvertColor), _styleModuleImportMap$k)
|
|
5274
|
-
}, displayTitle), isDefault && /*#__PURE__*/
|
|
5302
|
+
}, displayTitle), isDefault && /*#__PURE__*/React__default["default"].createElement(DisplayImage, {
|
|
5275
5303
|
story: story,
|
|
5276
5304
|
linkedImage: linkedImage,
|
|
5277
5305
|
template: template,
|
|
5278
5306
|
isRightAlign: isRightAlign
|
|
5279
|
-
}), /*#__PURE__*/
|
|
5307
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5280
5308
|
className: "also-read-m_content-wrapper__26AZX"
|
|
5281
|
-
}, /*#__PURE__*/
|
|
5309
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5282
5310
|
className: "also-read-m_headline__VzF-c",
|
|
5283
5311
|
style: textColor ? {
|
|
5284
5312
|
color: textColor
|
|
@@ -5288,7 +5316,7 @@ var AlsoReadBase = function AlsoReadBase(_ref2) {
|
|
|
5288
5316
|
dangerouslySetInnerHTML: {
|
|
5289
5317
|
__html: content
|
|
5290
5318
|
}
|
|
5291
|
-
}), isRightAlign && /*#__PURE__*/
|
|
5319
|
+
}), isRightAlign && /*#__PURE__*/React__default["default"].createElement(DisplayImage, {
|
|
5292
5320
|
story: story,
|
|
5293
5321
|
linkedImage: linkedImage,
|
|
5294
5322
|
template: template
|
|
@@ -5297,25 +5325,25 @@ var AlsoReadBase = function AlsoReadBase(_ref2) {
|
|
|
5297
5325
|
|
|
5298
5326
|
AlsoReadBase.propTypes = {
|
|
5299
5327
|
/** template can be default, textLeftAlign or imageRightAlign */
|
|
5300
|
-
template:
|
|
5301
|
-
story:
|
|
5302
|
-
"linked-stories":
|
|
5328
|
+
template: PropTypes__default["default"].string,
|
|
5329
|
+
story: PropTypes__default["default"].shape({
|
|
5330
|
+
"linked-stories": PropTypes__default["default"].object
|
|
5303
5331
|
}),
|
|
5304
|
-
element:
|
|
5305
|
-
text:
|
|
5306
|
-
metadata:
|
|
5307
|
-
linkedStoryId:
|
|
5308
|
-
url:
|
|
5309
|
-
"hero-image-s3-key":
|
|
5332
|
+
element: PropTypes__default["default"].shape({
|
|
5333
|
+
text: PropTypes__default["default"].string,
|
|
5334
|
+
metadata: PropTypes__default["default"].shape({
|
|
5335
|
+
linkedStoryId: PropTypes__default["default"].shape({
|
|
5336
|
+
url: PropTypes__default["default"].string,
|
|
5337
|
+
"hero-image-s3-key": PropTypes__default["default"].string
|
|
5310
5338
|
})
|
|
5311
5339
|
})
|
|
5312
5340
|
}),
|
|
5313
|
-
opts:
|
|
5314
|
-
title:
|
|
5341
|
+
opts: PropTypes__default["default"].shape({
|
|
5342
|
+
title: PropTypes__default["default"].string
|
|
5315
5343
|
}),
|
|
5316
5344
|
config: shapeConfig,
|
|
5317
|
-
render:
|
|
5318
|
-
css:
|
|
5345
|
+
render: PropTypes__default["default"].func,
|
|
5346
|
+
css: PropTypes__default["default"].object
|
|
5319
5347
|
};
|
|
5320
5348
|
var AlsoRead = withElementWrapper(AlsoReadBase);
|
|
5321
5349
|
|
|
@@ -5323,20 +5351,20 @@ var Loading = function Loading(_ref) {
|
|
|
5323
5351
|
_ref.width;
|
|
5324
5352
|
_ref.height;
|
|
5325
5353
|
_ref.iconColor;
|
|
5326
|
-
return /*#__PURE__*/
|
|
5354
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5327
5355
|
className: "loading-m_loading-indicator__2Dlst"
|
|
5328
|
-
}, /*#__PURE__*/
|
|
5356
|
+
}, /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
5329
5357
|
width: "40",
|
|
5330
5358
|
height: "40",
|
|
5331
5359
|
xmlns: "http://www.w3.org/2000/svg",
|
|
5332
5360
|
viewBox: "0 0 100 100",
|
|
5333
5361
|
preserveAspectRatio: "xMidYMid"
|
|
5334
|
-
}, /*#__PURE__*/
|
|
5362
|
+
}, /*#__PURE__*/React__default["default"].createElement("circle", {
|
|
5335
5363
|
cx: "84",
|
|
5336
5364
|
cy: "50",
|
|
5337
5365
|
r: "0",
|
|
5338
5366
|
fill: "currentColor"
|
|
5339
|
-
}, /*#__PURE__*/
|
|
5367
|
+
}, /*#__PURE__*/React__default["default"].createElement("animate", {
|
|
5340
5368
|
attributeName: "r",
|
|
5341
5369
|
values: "10;0;0;0;0",
|
|
5342
5370
|
keyTimes: "0;0.25;0.5;0.75;1",
|
|
@@ -5345,7 +5373,7 @@ var Loading = function Loading(_ref) {
|
|
|
5345
5373
|
dur: "2s",
|
|
5346
5374
|
repeatCount: "indefinite",
|
|
5347
5375
|
begin: "0s"
|
|
5348
|
-
}), /*#__PURE__*/
|
|
5376
|
+
}), /*#__PURE__*/React__default["default"].createElement("animate", {
|
|
5349
5377
|
attributeName: "cx",
|
|
5350
5378
|
values: "84;84;84;84;84",
|
|
5351
5379
|
keyTimes: "0;0.25;0.5;0.75;1",
|
|
@@ -5354,12 +5382,12 @@ var Loading = function Loading(_ref) {
|
|
|
5354
5382
|
dur: "2s",
|
|
5355
5383
|
repeatCount: "indefinite",
|
|
5356
5384
|
begin: "0s"
|
|
5357
|
-
})), /*#__PURE__*/
|
|
5385
|
+
})), /*#__PURE__*/React__default["default"].createElement("circle", {
|
|
5358
5386
|
cx: "84",
|
|
5359
5387
|
cy: "50",
|
|
5360
5388
|
r: ".709",
|
|
5361
5389
|
fill: "currentColor"
|
|
5362
|
-
}, /*#__PURE__*/
|
|
5390
|
+
}, /*#__PURE__*/React__default["default"].createElement("animate", {
|
|
5363
5391
|
attributeName: "r",
|
|
5364
5392
|
values: "0;10;10;10;0",
|
|
5365
5393
|
keyTimes: "0;0.25;0.5;0.75;1",
|
|
@@ -5368,7 +5396,7 @@ var Loading = function Loading(_ref) {
|
|
|
5368
5396
|
dur: "2s",
|
|
5369
5397
|
repeatCount: "indefinite",
|
|
5370
5398
|
begin: "-1s"
|
|
5371
|
-
}), /*#__PURE__*/
|
|
5399
|
+
}), /*#__PURE__*/React__default["default"].createElement("animate", {
|
|
5372
5400
|
attributeName: "cx",
|
|
5373
5401
|
values: "16;16;50;84;84",
|
|
5374
5402
|
keyTimes: "0;0.25;0.5;0.75;1",
|
|
@@ -5377,12 +5405,12 @@ var Loading = function Loading(_ref) {
|
|
|
5377
5405
|
dur: "2s",
|
|
5378
5406
|
repeatCount: "indefinite",
|
|
5379
5407
|
begin: "-1s"
|
|
5380
|
-
})), /*#__PURE__*/
|
|
5408
|
+
})), /*#__PURE__*/React__default["default"].createElement("circle", {
|
|
5381
5409
|
cx: "81.59",
|
|
5382
5410
|
cy: "50",
|
|
5383
5411
|
r: "10",
|
|
5384
5412
|
fill: "currentColor"
|
|
5385
|
-
}, /*#__PURE__*/
|
|
5413
|
+
}, /*#__PURE__*/React__default["default"].createElement("animate", {
|
|
5386
5414
|
attributeName: "r",
|
|
5387
5415
|
values: "0;10;10;10;0",
|
|
5388
5416
|
keyTimes: "0;0.25;0.5;0.75;1",
|
|
@@ -5391,7 +5419,7 @@ var Loading = function Loading(_ref) {
|
|
|
5391
5419
|
dur: "2s",
|
|
5392
5420
|
repeatCount: "indefinite",
|
|
5393
5421
|
begin: "-0.5s"
|
|
5394
|
-
}), /*#__PURE__*/
|
|
5422
|
+
}), /*#__PURE__*/React__default["default"].createElement("animate", {
|
|
5395
5423
|
attributeName: "cx",
|
|
5396
5424
|
values: "16;16;50;84;84",
|
|
5397
5425
|
keyTimes: "0;0.25;0.5;0.75;1",
|
|
@@ -5400,12 +5428,12 @@ var Loading = function Loading(_ref) {
|
|
|
5400
5428
|
dur: "2s",
|
|
5401
5429
|
repeatCount: "indefinite",
|
|
5402
5430
|
begin: "-0.5s"
|
|
5403
|
-
})), /*#__PURE__*/
|
|
5431
|
+
})), /*#__PURE__*/React__default["default"].createElement("circle", {
|
|
5404
5432
|
cx: "47.59",
|
|
5405
5433
|
cy: "50",
|
|
5406
5434
|
r: "10",
|
|
5407
5435
|
fill: "currentColor"
|
|
5408
|
-
}, /*#__PURE__*/
|
|
5436
|
+
}, /*#__PURE__*/React__default["default"].createElement("animate", {
|
|
5409
5437
|
attributeName: "r",
|
|
5410
5438
|
values: "0;10;10;10;0",
|
|
5411
5439
|
keyTimes: "0;0.25;0.5;0.75;1",
|
|
@@ -5414,7 +5442,7 @@ var Loading = function Loading(_ref) {
|
|
|
5414
5442
|
dur: "2s",
|
|
5415
5443
|
repeatCount: "indefinite",
|
|
5416
5444
|
begin: "0s"
|
|
5417
|
-
}), /*#__PURE__*/
|
|
5445
|
+
}), /*#__PURE__*/React__default["default"].createElement("animate", {
|
|
5418
5446
|
attributeName: "cx",
|
|
5419
5447
|
values: "16;16;50;84;84",
|
|
5420
5448
|
keyTimes: "0;0.25;0.5;0.75;1",
|
|
@@ -5423,12 +5451,12 @@ var Loading = function Loading(_ref) {
|
|
|
5423
5451
|
dur: "2s",
|
|
5424
5452
|
repeatCount: "indefinite",
|
|
5425
5453
|
begin: "0s"
|
|
5426
|
-
})), /*#__PURE__*/
|
|
5454
|
+
})), /*#__PURE__*/React__default["default"].createElement("circle", {
|
|
5427
5455
|
cx: "16",
|
|
5428
5456
|
cy: "50",
|
|
5429
5457
|
r: "9.291",
|
|
5430
5458
|
fill: "currentColor"
|
|
5431
|
-
}, /*#__PURE__*/
|
|
5459
|
+
}, /*#__PURE__*/React__default["default"].createElement("animate", {
|
|
5432
5460
|
attributeName: "r",
|
|
5433
5461
|
values: "0;0;10;10;10",
|
|
5434
5462
|
keyTimes: "0;0.25;0.5;0.75;1",
|
|
@@ -5437,7 +5465,7 @@ var Loading = function Loading(_ref) {
|
|
|
5437
5465
|
dur: "2s",
|
|
5438
5466
|
repeatCount: "indefinite",
|
|
5439
5467
|
begin: "0s"
|
|
5440
|
-
}), /*#__PURE__*/
|
|
5468
|
+
}), /*#__PURE__*/React__default["default"].createElement("animate", {
|
|
5441
5469
|
attributeName: "cx",
|
|
5442
5470
|
values: "16;16;16;50;84",
|
|
5443
5471
|
keyTimes: "0;0.25;0.5;0.75;1",
|
|
@@ -5449,16 +5477,16 @@ var Loading = function Loading(_ref) {
|
|
|
5449
5477
|
}))));
|
|
5450
5478
|
};
|
|
5451
5479
|
Loading.propTypes = {
|
|
5452
|
-
width:
|
|
5453
|
-
height:
|
|
5454
|
-
iconColor:
|
|
5480
|
+
width: PropTypes__default["default"].object,
|
|
5481
|
+
height: PropTypes__default["default"].object,
|
|
5482
|
+
iconColor: PropTypes__default["default"].object
|
|
5455
5483
|
};
|
|
5456
5484
|
|
|
5457
5485
|
function ownKeys$2(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; }
|
|
5458
5486
|
|
|
5459
5487
|
function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5460
|
-
var Lightbox = /*#__PURE__*/lazy(function () {
|
|
5461
|
-
return
|
|
5488
|
+
var Lightbox = /*#__PURE__*/React.lazy(function () {
|
|
5489
|
+
return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('react-image-lightbox')); });
|
|
5462
5490
|
});
|
|
5463
5491
|
var FullScreenImages = function FullScreenImages(_ref) {
|
|
5464
5492
|
var _ref$imageSlug = _ref.imageSlug,
|
|
@@ -5467,16 +5495,16 @@ var FullScreenImages = function FullScreenImages(_ref) {
|
|
|
5467
5495
|
_ref$element = _ref.element,
|
|
5468
5496
|
element = _ref$element === void 0 ? {} : _ref$element,
|
|
5469
5497
|
props = _ref.props;
|
|
5470
|
-
var cdnImage = useSelector(function (state) {
|
|
5498
|
+
var cdnImage = reactRedux.useSelector(function (state) {
|
|
5471
5499
|
return get_1(state, ["qt", "config", "cdn-image"]);
|
|
5472
5500
|
});
|
|
5473
5501
|
|
|
5474
|
-
var _useState = useState(0),
|
|
5502
|
+
var _useState = React.useState(0),
|
|
5475
5503
|
_useState2 = _slicedToArray(_useState, 2),
|
|
5476
5504
|
photoIndex = _useState2[0],
|
|
5477
5505
|
handleImage = _useState2[1];
|
|
5478
5506
|
|
|
5479
|
-
var _useState3 = useState(false),
|
|
5507
|
+
var _useState3 = React.useState(false),
|
|
5480
5508
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
5481
5509
|
isOpen = _useState4[0],
|
|
5482
5510
|
handleOpen = _useState4[1];
|
|
@@ -5518,7 +5546,7 @@ var FullScreenImages = function FullScreenImages(_ref) {
|
|
|
5518
5546
|
|
|
5519
5547
|
var getHyperLink = function getHyperLink() {
|
|
5520
5548
|
if (element.hyperlink || hyperlinks[photoIndex]) {
|
|
5521
|
-
return /*#__PURE__*/
|
|
5549
|
+
return /*#__PURE__*/React__default["default"].createElement(HyperLink, {
|
|
5522
5550
|
hyperLink: element.hyperlink || hyperlinks[photoIndex]
|
|
5523
5551
|
});
|
|
5524
5552
|
}
|
|
@@ -5543,23 +5571,23 @@ var FullScreenImages = function FullScreenImages(_ref) {
|
|
|
5543
5571
|
};
|
|
5544
5572
|
|
|
5545
5573
|
var LoadingScreen = function LoadingScreen() {
|
|
5546
|
-
return /*#__PURE__*/
|
|
5574
|
+
return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(Loading, null));
|
|
5547
5575
|
};
|
|
5548
5576
|
|
|
5549
|
-
return /*#__PURE__*/
|
|
5550
|
-
fallback: /*#__PURE__*/
|
|
5551
|
-
}, /*#__PURE__*/
|
|
5577
|
+
return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(template, _objectSpread$2(_defineProperty({}, onClickKey, onClickHandler), props)), isOpen ? /*#__PURE__*/React__default["default"].createElement(React.Suspense, {
|
|
5578
|
+
fallback: /*#__PURE__*/React__default["default"].createElement(LoadingScreen, null)
|
|
5579
|
+
}, /*#__PURE__*/React__default["default"].createElement(Lightbox, _extends({
|
|
5552
5580
|
wrapperClassName: "arr--image-lightbox",
|
|
5553
5581
|
onCloseRequest: onClose
|
|
5554
5582
|
}, lightboxProps))) : null);
|
|
5555
5583
|
};
|
|
5556
5584
|
FullScreenImages.propTypes = {
|
|
5557
|
-
imageSlug:
|
|
5558
|
-
template:
|
|
5559
|
-
element:
|
|
5560
|
-
"story-elements":
|
|
5585
|
+
imageSlug: PropTypes__default["default"].string,
|
|
5586
|
+
template: PropTypes__default["default"].func,
|
|
5587
|
+
element: PropTypes__default["default"].shape({
|
|
5588
|
+
"story-elements": PropTypes__default["default"].array
|
|
5561
5589
|
}),
|
|
5562
|
-
props:
|
|
5590
|
+
props: PropTypes__default["default"].object
|
|
5563
5591
|
};
|
|
5564
5592
|
|
|
5565
5593
|
var _excluded$7 = ["element", "opts", "story", "config", "caption"];
|
|
@@ -5580,14 +5608,14 @@ var ImageBase = function ImageBase(_ref) {
|
|
|
5580
5608
|
|
|
5581
5609
|
var ImageTemplate = function ImageTemplate(_ref2) {
|
|
5582
5610
|
var _onClick = _ref2.onClick;
|
|
5583
|
-
return /*#__PURE__*/
|
|
5611
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5584
5612
|
className: "image-m_image-template__3s9OA"
|
|
5585
|
-
}, /*#__PURE__*/
|
|
5613
|
+
}, /*#__PURE__*/React__default["default"].createElement("figure", {
|
|
5586
5614
|
className: "image-m_element__KVuzX",
|
|
5587
5615
|
onClick: function onClick() {
|
|
5588
5616
|
return _onClick();
|
|
5589
5617
|
}
|
|
5590
|
-
}, /*#__PURE__*/
|
|
5618
|
+
}, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
|
|
5591
5619
|
slug: element["image-s3-key"],
|
|
5592
5620
|
metadata: element["image-metadata"],
|
|
5593
5621
|
alt: element["title"],
|
|
@@ -5597,40 +5625,40 @@ var ImageBase = function ImageBase(_ref) {
|
|
|
5597
5625
|
imgParams: {
|
|
5598
5626
|
auto: ["format", "compress"]
|
|
5599
5627
|
}
|
|
5600
|
-
})), element["hyperlink"] && /*#__PURE__*/
|
|
5628
|
+
})), element["hyperlink"] && /*#__PURE__*/React__default["default"].createElement(HyperLink, {
|
|
5601
5629
|
hyperLink: element["hyperlink"]
|
|
5602
5630
|
}));
|
|
5603
5631
|
};
|
|
5604
5632
|
|
|
5605
5633
|
ImageTemplate.propTypes = {
|
|
5606
|
-
onClick:
|
|
5634
|
+
onClick: PropTypes__default["default"].func
|
|
5607
5635
|
};
|
|
5608
|
-
return /*#__PURE__*/
|
|
5636
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
5609
5637
|
className: "arrow-component arr--image-element"
|
|
5610
5638
|
}, restProps, {
|
|
5611
5639
|
"data-test-id": "image-element"
|
|
5612
|
-
}), /*#__PURE__*/
|
|
5640
|
+
}), /*#__PURE__*/React__default["default"].createElement(FullScreenImages, {
|
|
5613
5641
|
template: ImageTemplate,
|
|
5614
5642
|
element: element,
|
|
5615
5643
|
imageSlug: element["image-s3-key"],
|
|
5616
5644
|
story: story
|
|
5617
|
-
}), caption && /*#__PURE__*/
|
|
5645
|
+
}), caption && /*#__PURE__*/React__default["default"].createElement(CaptionAttribution, {
|
|
5618
5646
|
element: element,
|
|
5619
5647
|
config: configData
|
|
5620
5648
|
}));
|
|
5621
5649
|
};
|
|
5622
5650
|
|
|
5623
5651
|
ImageBase.propTypes = {
|
|
5624
|
-
element:
|
|
5625
|
-
"image-s3-key":
|
|
5626
|
-
"image-metadata":
|
|
5627
|
-
"image-attribution":
|
|
5628
|
-
title:
|
|
5629
|
-
hyperlink:
|
|
5652
|
+
element: PropTypes__default["default"].shape({
|
|
5653
|
+
"image-s3-key": PropTypes__default["default"].string,
|
|
5654
|
+
"image-metadata": PropTypes__default["default"].object,
|
|
5655
|
+
"image-attribution": PropTypes__default["default"].string,
|
|
5656
|
+
title: PropTypes__default["default"].string,
|
|
5657
|
+
hyperlink: PropTypes__default["default"].string
|
|
5630
5658
|
}),
|
|
5631
|
-
caption:
|
|
5632
|
-
opts:
|
|
5633
|
-
imageWidths:
|
|
5659
|
+
caption: PropTypes__default["default"].bool,
|
|
5660
|
+
opts: PropTypes__default["default"].shape({
|
|
5661
|
+
imageWidths: PropTypes__default["default"].array
|
|
5634
5662
|
}),
|
|
5635
5663
|
story: shapeStory,
|
|
5636
5664
|
config: shapeConfig
|
|
@@ -5723,14 +5751,14 @@ var QuestionAnswerBase = function QuestionAnswerBase(_ref) {
|
|
|
5723
5751
|
var isAuthorImageTemplate = template === "withAuthorImage";
|
|
5724
5752
|
var templateStyle = isAuthorImageTemplate ? "qa-withAuthorImage" : "qa-default";
|
|
5725
5753
|
var iconType = defaultIconType === "curve" ? "curveIcon" : "edgeIcon";
|
|
5726
|
-
var supportQuestionElement = isAuthorImageTemplate ? questionAttribution && /*#__PURE__*/
|
|
5754
|
+
var supportQuestionElement = isAuthorImageTemplate ? questionAttribution && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5727
5755
|
className: "question-answer-m_labelAttribution__Rq-v3"
|
|
5728
|
-
}, /*#__PURE__*/
|
|
5756
|
+
}, /*#__PURE__*/React__default["default"].createElement("img", {
|
|
5729
5757
|
src: questionAttribution,
|
|
5730
5758
|
loading: "lazy"
|
|
5731
|
-
})), /*#__PURE__*/
|
|
5759
|
+
})), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
5732
5760
|
className: "question-answer-m_hidden__K0n4n"
|
|
5733
|
-
})) : /*#__PURE__*/
|
|
5761
|
+
})) : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5734
5762
|
"data-test-id": iconType,
|
|
5735
5763
|
style: {
|
|
5736
5764
|
backgroundColor: iconColor
|
|
@@ -5738,36 +5766,36 @@ var QuestionAnswerBase = function QuestionAnswerBase(_ref) {
|
|
|
5738
5766
|
className: _getClassName("".concat(iconType, " ").concat(theme), _styleModuleImportMap$j)
|
|
5739
5767
|
}, "Q"); // EMPTY SPAN FOR EXTRA SPACE
|
|
5740
5768
|
|
|
5741
|
-
var supportAnswerElement = isAuthorImageTemplate ? answerAttribution && /*#__PURE__*/
|
|
5769
|
+
var supportAnswerElement = isAuthorImageTemplate ? answerAttribution && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5742
5770
|
className: "question-answer-m_labelAttribution__Rq-v3"
|
|
5743
|
-
}, /*#__PURE__*/
|
|
5771
|
+
}, /*#__PURE__*/React__default["default"].createElement("img", {
|
|
5744
5772
|
src: answerAttribution,
|
|
5745
5773
|
loading: "lazy"
|
|
5746
|
-
})), /*#__PURE__*/
|
|
5774
|
+
})), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
5747
5775
|
className: "question-answer-m_hidden__K0n4n"
|
|
5748
|
-
})) : /*#__PURE__*/
|
|
5776
|
+
})) : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5749
5777
|
"data-test-id": iconType,
|
|
5750
5778
|
style: {
|
|
5751
5779
|
backgroundColor: iconColor
|
|
5752
5780
|
},
|
|
5753
5781
|
className: _getClassName("".concat(iconType, " ").concat(theme), _styleModuleImportMap$j)
|
|
5754
5782
|
}, "A");
|
|
5755
|
-
return /*#__PURE__*/
|
|
5783
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
5756
5784
|
"data-test-id": "question-answer"
|
|
5757
5785
|
}, restProps, {
|
|
5758
5786
|
className: "arrow-component arr-custom-style arr--qa-element " + _getClassName(templateStyle, _styleModuleImportMap$j) + (" " + (restProps ? restProps.className || "" : ""))
|
|
5759
|
-
}), type !== "answer" && /*#__PURE__*/
|
|
5787
|
+
}), type !== "answer" && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5760
5788
|
className: "question-answer-m_q-element__1ZA5d",
|
|
5761
5789
|
"data-test-id": "question"
|
|
5762
|
-
}, supportQuestionElement, /*#__PURE__*/
|
|
5790
|
+
}, supportQuestionElement, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5763
5791
|
dangerouslySetInnerHTML: {
|
|
5764
5792
|
__html: questionData
|
|
5765
5793
|
},
|
|
5766
5794
|
className: _getClassName("content ".concat(textInvertColor), _styleModuleImportMap$j)
|
|
5767
|
-
})), type !== "question" && /*#__PURE__*/
|
|
5795
|
+
})), type !== "question" && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5768
5796
|
className: "question-answer-m_a-element__BTxfl",
|
|
5769
5797
|
"data-test-id": "answer"
|
|
5770
|
-
}, supportAnswerElement, /*#__PURE__*/
|
|
5798
|
+
}, supportAnswerElement, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5771
5799
|
dangerouslySetInnerHTML: {
|
|
5772
5800
|
__html: answerData
|
|
5773
5801
|
},
|
|
@@ -5776,29 +5804,29 @@ var QuestionAnswerBase = function QuestionAnswerBase(_ref) {
|
|
|
5776
5804
|
};
|
|
5777
5805
|
|
|
5778
5806
|
QuestionAnswerBase.propTypes = {
|
|
5779
|
-
element:
|
|
5780
|
-
metadata:
|
|
5781
|
-
interviewer:
|
|
5782
|
-
"avatar-url":
|
|
5807
|
+
element: PropTypes__default["default"].shape({
|
|
5808
|
+
metadata: PropTypes__default["default"].shape({
|
|
5809
|
+
interviewer: PropTypes__default["default"].shape({
|
|
5810
|
+
"avatar-url": PropTypes__default["default"].string
|
|
5783
5811
|
}),
|
|
5784
|
-
interviewee:
|
|
5785
|
-
"avatar-url":
|
|
5812
|
+
interviewee: PropTypes__default["default"].shape({
|
|
5813
|
+
"avatar-url": PropTypes__default["default"].string
|
|
5786
5814
|
}),
|
|
5787
|
-
question:
|
|
5788
|
-
answer:
|
|
5815
|
+
question: PropTypes__default["default"].string,
|
|
5816
|
+
answer: PropTypes__default["default"].string
|
|
5789
5817
|
}),
|
|
5790
|
-
text:
|
|
5818
|
+
text: PropTypes__default["default"].string
|
|
5791
5819
|
}),
|
|
5792
|
-
opts:
|
|
5793
|
-
type:
|
|
5794
|
-
defaultIconType:
|
|
5795
|
-
isExternalLink:
|
|
5820
|
+
opts: PropTypes__default["default"].shape({
|
|
5821
|
+
type: PropTypes__default["default"].string,
|
|
5822
|
+
defaultIconType: PropTypes__default["default"].string,
|
|
5823
|
+
isExternalLink: PropTypes__default["default"].bool
|
|
5796
5824
|
}),
|
|
5797
|
-
template:
|
|
5798
|
-
css:
|
|
5825
|
+
template: PropTypes__default["default"].string,
|
|
5826
|
+
css: PropTypes__default["default"].object,
|
|
5799
5827
|
config: shapeConfig,
|
|
5800
5828
|
story: shapeStory,
|
|
5801
|
-
render:
|
|
5829
|
+
render: PropTypes__default["default"].func
|
|
5802
5830
|
};
|
|
5803
5831
|
var QuestionAnswer = withElementWrapper(QuestionAnswerBase);
|
|
5804
5832
|
|
|
@@ -5840,17 +5868,17 @@ var ImageGalleryBase = function ImageGalleryBase(_ref) {
|
|
|
5840
5868
|
var ImageGalleryImagesTemplate = function ImageGalleryImagesTemplate(_ref2) {
|
|
5841
5869
|
var onClickHandler = _ref2.onClickHandler;
|
|
5842
5870
|
var images = renderImage.map(function (image, index) {
|
|
5843
|
-
return /*#__PURE__*/
|
|
5871
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5844
5872
|
key: index,
|
|
5845
5873
|
className: _getClassName(hyperlinkClass(image["hyperlink"]), _styleModuleImportMap$i)
|
|
5846
|
-
}, /*#__PURE__*/
|
|
5874
|
+
}, /*#__PURE__*/React__default["default"].createElement("figure", {
|
|
5847
5875
|
key: index,
|
|
5848
5876
|
"data-text-id": "image-".concat(index),
|
|
5849
5877
|
onClick: function onClick() {
|
|
5850
5878
|
return onClickHandler && onClickHandler(index);
|
|
5851
5879
|
},
|
|
5852
5880
|
className: _getClassName("image ".concat(classes), _styleModuleImportMap$i)
|
|
5853
|
-
}, /*#__PURE__*/
|
|
5881
|
+
}, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
|
|
5854
5882
|
slug: image["image-s3-key"],
|
|
5855
5883
|
metadata: image["image-metadata"],
|
|
5856
5884
|
alt: image["title"],
|
|
@@ -5859,11 +5887,11 @@ var ImageGalleryBase = function ImageGalleryBase(_ref) {
|
|
|
5859
5887
|
imgParams: {
|
|
5860
5888
|
auto: ["format", "compress"]
|
|
5861
5889
|
}
|
|
5862
|
-
})), image["hyperlink"] && /*#__PURE__*/
|
|
5890
|
+
})), image["hyperlink"] && /*#__PURE__*/React__default["default"].createElement(HyperLink, {
|
|
5863
5891
|
hyperLink: image["hyperlink"]
|
|
5864
5892
|
}));
|
|
5865
5893
|
});
|
|
5866
|
-
return /*#__PURE__*/
|
|
5894
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
5867
5895
|
className: " arrow-component arr--image-element image-gallery-m_image-gallery__1Q7if" + (" " + (restProps ? restProps.className || "" : ""))
|
|
5868
5896
|
}, restProps, {
|
|
5869
5897
|
"data-test-id": "image-gallery"
|
|
@@ -5871,24 +5899,24 @@ var ImageGalleryBase = function ImageGalleryBase(_ref) {
|
|
|
5871
5899
|
};
|
|
5872
5900
|
|
|
5873
5901
|
ImageGalleryImagesTemplate.propTypes = {
|
|
5874
|
-
onClickHandler:
|
|
5902
|
+
onClickHandler: PropTypes__default["default"].func
|
|
5875
5903
|
};
|
|
5876
|
-
return /*#__PURE__*/
|
|
5904
|
+
return /*#__PURE__*/React__default["default"].createElement(FullScreenImages, {
|
|
5877
5905
|
template: ImageGalleryImagesTemplate,
|
|
5878
5906
|
element: element
|
|
5879
5907
|
});
|
|
5880
5908
|
};
|
|
5881
5909
|
|
|
5882
5910
|
ImageGalleryBase.propTypes = {
|
|
5883
|
-
element:
|
|
5884
|
-
"story-elements":
|
|
5911
|
+
element: PropTypes__default["default"].shape({
|
|
5912
|
+
"story-elements": PropTypes__default["default"].array
|
|
5885
5913
|
}),
|
|
5886
|
-
opts:
|
|
5887
|
-
imageWidths:
|
|
5914
|
+
opts: PropTypes__default["default"].shape({
|
|
5915
|
+
imageWidths: PropTypes__default["default"].array
|
|
5888
5916
|
}),
|
|
5889
5917
|
story: shapeStory,
|
|
5890
5918
|
config: shapeConfig,
|
|
5891
|
-
template:
|
|
5919
|
+
template: PropTypes__default["default"].string
|
|
5892
5920
|
};
|
|
5893
5921
|
var ImageGallery = withElementWrapper(ImageGalleryBase);
|
|
5894
5922
|
|
|
@@ -5900,16 +5928,16 @@ var StoryElementBase = function StoryElementBase(_ref) {
|
|
|
5900
5928
|
_ref.config;
|
|
5901
5929
|
var restProps = _objectWithoutProperties(_ref, _excluded$4);
|
|
5902
5930
|
|
|
5903
|
-
return /*#__PURE__*/
|
|
5931
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({}, restProps, {
|
|
5904
5932
|
"data-test-id": "story-elements"
|
|
5905
|
-
}), /*#__PURE__*/
|
|
5933
|
+
}), /*#__PURE__*/React__default["default"].createElement(components.StoryElement, {
|
|
5906
5934
|
element: element
|
|
5907
5935
|
}));
|
|
5908
5936
|
};
|
|
5909
5937
|
|
|
5910
5938
|
var StoryElement = withElementWrapper(StoryElementBase);
|
|
5911
5939
|
StoryElementBase.propTypes = {
|
|
5912
|
-
element:
|
|
5940
|
+
element: PropTypes__default["default"].object,
|
|
5913
5941
|
story: shapeStory,
|
|
5914
5942
|
config: shapeConfig
|
|
5915
5943
|
};
|
|
@@ -5924,21 +5952,21 @@ var Videobase = function Videobase(_ref) {
|
|
|
5924
5952
|
loadIframeOnClick = _ref$loadIframeOnClic === void 0 ? false : _ref$loadIframeOnClic,
|
|
5925
5953
|
restProps = _objectWithoutProperties(_ref, _excluded$3);
|
|
5926
5954
|
|
|
5927
|
-
return /*#__PURE__*/
|
|
5955
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
5928
5956
|
className: "video-m_container__MYuWI" + (" " + (restProps ? restProps.className || "" : ""))
|
|
5929
5957
|
}, restProps, {
|
|
5930
5958
|
"data-test-id": "video"
|
|
5931
|
-
}), /*#__PURE__*/
|
|
5959
|
+
}), /*#__PURE__*/React__default["default"].createElement(components.StoryElement, {
|
|
5932
5960
|
element: element,
|
|
5933
5961
|
loadIframeOnClick: loadIframeOnClick
|
|
5934
5962
|
}));
|
|
5935
5963
|
};
|
|
5936
5964
|
|
|
5937
5965
|
Videobase.propTypes = {
|
|
5938
|
-
element:
|
|
5966
|
+
element: PropTypes__default["default"].object,
|
|
5939
5967
|
story: shapeStory,
|
|
5940
5968
|
config: shapeConfig,
|
|
5941
|
-
loadIframeOnClick:
|
|
5969
|
+
loadIframeOnClick: PropTypes__default["default"].bool
|
|
5942
5970
|
};
|
|
5943
5971
|
var Video = withElementWrapper(Videobase);
|
|
5944
5972
|
|
|
@@ -5979,16 +6007,16 @@ var QuoteBase = function QuoteBase(_ref) {
|
|
|
5979
6007
|
var borderColor = css.borderColor;
|
|
5980
6008
|
var updateBorderColor = template === "borderLeft" && "4px solid ".concat(borderColor);
|
|
5981
6009
|
var templateStyle = template ? "quote-".concat(template) : "quote";
|
|
5982
|
-
return /*#__PURE__*/
|
|
6010
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
5983
6011
|
"data-test-id": "quote"
|
|
5984
6012
|
}, restProps, {
|
|
5985
6013
|
className: "arrow-component arr--quote-element " + _getClassName(templateStyle, _styleModuleImportMap$h) + (" " + (restProps ? restProps.className || "" : ""))
|
|
5986
|
-
}), template === "borderTopSmall" && /*#__PURE__*/
|
|
6014
|
+
}), template === "borderTopSmall" && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
5987
6015
|
className: "quote-m_line__3gtoE",
|
|
5988
6016
|
style: borderColor && {
|
|
5989
6017
|
backgroundColor: borderColor
|
|
5990
6018
|
}
|
|
5991
|
-
}), /*#__PURE__*/
|
|
6019
|
+
}), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
5992
6020
|
style: borderColor && {
|
|
5993
6021
|
borderLeft: updateBorderColor
|
|
5994
6022
|
},
|
|
@@ -5996,26 +6024,26 @@ var QuoteBase = function QuoteBase(_ref) {
|
|
|
5996
6024
|
__html: content
|
|
5997
6025
|
},
|
|
5998
6026
|
className: _getClassName("text ".concat(textInvertColor), _styleModuleImportMap$h)
|
|
5999
|
-
}), /*#__PURE__*/
|
|
6027
|
+
}), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
6000
6028
|
"data-test-id": "quote-attribution",
|
|
6001
6029
|
className: _getClassName("attribution ".concat(textInvertColor), _styleModuleImportMap$h)
|
|
6002
6030
|
}, attribution));
|
|
6003
6031
|
};
|
|
6004
6032
|
|
|
6005
6033
|
QuoteBase.propTypes = {
|
|
6006
|
-
element:
|
|
6007
|
-
metadata:
|
|
6008
|
-
content:
|
|
6009
|
-
attribution:
|
|
6034
|
+
element: PropTypes__default["default"].shape({
|
|
6035
|
+
metadata: PropTypes__default["default"].shape({
|
|
6036
|
+
content: PropTypes__default["default"].string,
|
|
6037
|
+
attribution: PropTypes__default["default"].string
|
|
6010
6038
|
})
|
|
6011
6039
|
}),
|
|
6012
6040
|
|
|
6013
6041
|
/** template can be default, borderTopSmall and borderLeft */
|
|
6014
|
-
template:
|
|
6042
|
+
template: PropTypes__default["default"].string,
|
|
6015
6043
|
story: shapeStory,
|
|
6016
6044
|
config: shapeConfig,
|
|
6017
|
-
render:
|
|
6018
|
-
css:
|
|
6045
|
+
render: PropTypes__default["default"].func,
|
|
6046
|
+
css: PropTypes__default["default"].object
|
|
6019
6047
|
};
|
|
6020
6048
|
var Quote = withElementWrapper(QuoteBase);
|
|
6021
6049
|
|
|
@@ -6049,7 +6077,7 @@ var ReferenceBase = function ReferenceBase(_ref) {
|
|
|
6049
6077
|
var _opts$showHeadline = opts.showHeadline,
|
|
6050
6078
|
showHeadline = _opts$showHeadline === void 0 ? true : _opts$showHeadline,
|
|
6051
6079
|
headlineText = opts.headlineText;
|
|
6052
|
-
return /*#__PURE__*/
|
|
6080
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
6053
6081
|
className: "arrow-component arr--reference-element"
|
|
6054
6082
|
}, restProps), eleArr && eleArr.map(function (metadata, index) {
|
|
6055
6083
|
var _metadata$name = metadata.name,
|
|
@@ -6057,33 +6085,33 @@ var ReferenceBase = function ReferenceBase(_ref) {
|
|
|
6057
6085
|
_metadata$description = metadata.description,
|
|
6058
6086
|
description = _metadata$description === void 0 ? "" : _metadata$description,
|
|
6059
6087
|
url = metadata.url;
|
|
6060
|
-
return /*#__PURE__*/
|
|
6088
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6061
6089
|
key: index,
|
|
6062
6090
|
className: _getClassName("wrapper ".concat(textInvertColor), _styleModuleImportMap$g)
|
|
6063
|
-
}, /*#__PURE__*/
|
|
6091
|
+
}, /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
6064
6092
|
href: url,
|
|
6065
6093
|
"aria-label": "reference-headline"
|
|
6066
|
-
}, showHeadline && /*#__PURE__*/
|
|
6094
|
+
}, showHeadline && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6067
6095
|
className: "reference-m_name__24IwG",
|
|
6068
6096
|
"data-test-id": "ref-headline"
|
|
6069
|
-
}, headlineText || name), /*#__PURE__*/
|
|
6097
|
+
}, headlineText || name), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6070
6098
|
className: "reference-m_description__2x3Io"
|
|
6071
6099
|
}, description)));
|
|
6072
6100
|
}));
|
|
6073
6101
|
};
|
|
6074
6102
|
|
|
6075
6103
|
ReferenceBase.propTypes = {
|
|
6076
|
-
element:
|
|
6077
|
-
"story-elements":
|
|
6078
|
-
metadata:
|
|
6079
|
-
name:
|
|
6080
|
-
description:
|
|
6081
|
-
url:
|
|
6104
|
+
element: PropTypes__default["default"].shape({
|
|
6105
|
+
"story-elements": PropTypes__default["default"].arrayOf(PropTypes__default["default"].shape({
|
|
6106
|
+
metadata: PropTypes__default["default"].shape({
|
|
6107
|
+
name: PropTypes__default["default"].string,
|
|
6108
|
+
description: PropTypes__default["default"].string,
|
|
6109
|
+
url: PropTypes__default["default"].string
|
|
6082
6110
|
})
|
|
6083
6111
|
}))
|
|
6084
6112
|
}),
|
|
6085
|
-
opts:
|
|
6086
|
-
hideHeadline:
|
|
6113
|
+
opts: PropTypes__default["default"].shape({
|
|
6114
|
+
hideHeadline: PropTypes__default["default"].bool
|
|
6087
6115
|
}),
|
|
6088
6116
|
config: shapeConfig
|
|
6089
6117
|
};
|
|
@@ -6125,28 +6153,28 @@ var AttachmentBase = function AttachmentBase(_ref) {
|
|
|
6125
6153
|
var textColor = getTextColor(configData.theme);
|
|
6126
6154
|
var defaultName = isPdf ? "Attached PDF" : "Attached DOC";
|
|
6127
6155
|
var defaultFileName = fileName || defaultName;
|
|
6128
|
-
return /*#__PURE__*/
|
|
6156
|
+
return /*#__PURE__*/React__default["default"].createElement("div", _extends({
|
|
6129
6157
|
"data-test-id": "attachment"
|
|
6130
6158
|
}, restProps, {
|
|
6131
6159
|
className: "arrow-component arr--attachment-element " + _getClassName(textColor, _styleModuleImportMap$f) + (" " + (restProps ? restProps.className || "" : ""))
|
|
6132
|
-
}), /*#__PURE__*/
|
|
6160
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6133
6161
|
className: "attachment-m_headline__kP7Hs"
|
|
6134
|
-
}, "Attachment"), /*#__PURE__*/
|
|
6162
|
+
}, "Attachment"), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6135
6163
|
className: "attachment-m_wrapper__3gMwN"
|
|
6136
|
-
}, isPdf ? /*#__PURE__*/
|
|
6164
|
+
}, isPdf ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6137
6165
|
"data-test-id": "pdf",
|
|
6138
6166
|
className: "attachment-m_pdf__3i_bR"
|
|
6139
|
-
}, "PDF") : /*#__PURE__*/
|
|
6167
|
+
}, "PDF") : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6140
6168
|
"data-test-id": "doc",
|
|
6141
6169
|
className: "attachment-m_doc__6vUVo attachment-m_pdf__3i_bR"
|
|
6142
|
-
}, "DOC"), /*#__PURE__*/
|
|
6170
|
+
}, "DOC"), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6143
6171
|
className: "attachment-m_content-wrapper__3Yu0B"
|
|
6144
|
-
}, /*#__PURE__*/
|
|
6172
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6145
6173
|
className: "attachment-m_file-name__1LU9q",
|
|
6146
6174
|
dangerouslySetInnerHTML: {
|
|
6147
6175
|
__html: defaultFileName
|
|
6148
6176
|
}
|
|
6149
|
-
}), /*#__PURE__*/
|
|
6177
|
+
}), /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
6150
6178
|
className: "attachment-m_button-wrapper__2fajK",
|
|
6151
6179
|
href: url,
|
|
6152
6180
|
target: "_blank",
|
|
@@ -6157,59 +6185,59 @@ var AttachmentBase = function AttachmentBase(_ref) {
|
|
|
6157
6185
|
};
|
|
6158
6186
|
|
|
6159
6187
|
AttachmentBase.propTypes = {
|
|
6160
|
-
element:
|
|
6161
|
-
url:
|
|
6162
|
-
fileName:
|
|
6163
|
-
contentType:
|
|
6188
|
+
element: PropTypes__default["default"].shape({
|
|
6189
|
+
url: PropTypes__default["default"].string,
|
|
6190
|
+
fileName: PropTypes__default["default"].string,
|
|
6191
|
+
contentType: PropTypes__default["default"].string
|
|
6164
6192
|
}),
|
|
6165
|
-
render:
|
|
6193
|
+
render: PropTypes__default["default"].func
|
|
6166
6194
|
};
|
|
6167
6195
|
var Attachment = withElementWrapper(AttachmentBase);
|
|
6168
6196
|
|
|
6169
6197
|
var LeftArrow = function LeftArrow(_ref) {
|
|
6170
6198
|
var _ref$color = _ref.color,
|
|
6171
6199
|
color = _ref$color === void 0 ? "#333" : _ref$color;
|
|
6172
|
-
return /*#__PURE__*/
|
|
6200
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
6173
6201
|
xmlns: "http://www.w3.org/2000/svg",
|
|
6174
6202
|
width: "16",
|
|
6175
6203
|
height: "16",
|
|
6176
6204
|
viewBox: "0 0 10 16"
|
|
6177
|
-
}, /*#__PURE__*/
|
|
6205
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
6178
6206
|
fill: "none",
|
|
6179
6207
|
fillRule: "nonzero"
|
|
6180
|
-
}, /*#__PURE__*/
|
|
6208
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
6181
6209
|
d: "M17 20H-7V-4h24z",
|
|
6182
6210
|
opacity: ".384"
|
|
6183
|
-
}), /*#__PURE__*/
|
|
6211
|
+
}), /*#__PURE__*/React__default["default"].createElement("path", {
|
|
6184
6212
|
stroke: color,
|
|
6185
6213
|
d: "M9 16L1 8l8-8"
|
|
6186
6214
|
})));
|
|
6187
6215
|
};
|
|
6188
6216
|
LeftArrow.propTypes = {
|
|
6189
|
-
color:
|
|
6217
|
+
color: PropTypes__default["default"].string
|
|
6190
6218
|
};
|
|
6191
6219
|
|
|
6192
6220
|
var RightArrow = function RightArrow(_ref) {
|
|
6193
6221
|
var _ref$color = _ref.color,
|
|
6194
6222
|
color = _ref$color === void 0 ? "#333" : _ref$color;
|
|
6195
|
-
return /*#__PURE__*/
|
|
6223
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
6196
6224
|
xmlns: "http://www.w3.org/2000/svg",
|
|
6197
6225
|
width: "16",
|
|
6198
6226
|
height: "16",
|
|
6199
6227
|
viewBox: "0 0 10 16"
|
|
6200
|
-
}, /*#__PURE__*/
|
|
6228
|
+
}, /*#__PURE__*/React__default["default"].createElement("g", {
|
|
6201
6229
|
fill: "none",
|
|
6202
6230
|
fillRule: "nonzero"
|
|
6203
|
-
}, /*#__PURE__*/
|
|
6231
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
6204
6232
|
d: "M-7-4h24v24H-7z",
|
|
6205
6233
|
opacity: ".384"
|
|
6206
|
-
}), /*#__PURE__*/
|
|
6234
|
+
}), /*#__PURE__*/React__default["default"].createElement("path", {
|
|
6207
6235
|
stroke: color,
|
|
6208
6236
|
d: "M1 0l8 8-8 8"
|
|
6209
6237
|
})));
|
|
6210
6238
|
};
|
|
6211
6239
|
RightArrow.propTypes = {
|
|
6212
|
-
color:
|
|
6240
|
+
color: PropTypes__default["default"].string
|
|
6213
6241
|
};
|
|
6214
6242
|
|
|
6215
6243
|
var _styleModuleImportMap$e = {
|
|
@@ -6247,26 +6275,26 @@ var SliderArrow = function SliderArrow(_ref) {
|
|
|
6247
6275
|
|
|
6248
6276
|
var getLeftArrowClassName = languageDirection === "rtl" ? "left-arrow-rtl" : "left-arrow-ltr";
|
|
6249
6277
|
var getRightArrowClassName = languageDirection === "rtl" ? "right-arrow-rtl" : "right-arrow-ltr";
|
|
6250
|
-
return /*#__PURE__*/
|
|
6278
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, selectedIndex !== 0 ? /*#__PURE__*/React__default["default"].createElement("button", {
|
|
6251
6279
|
onClick: previousClick,
|
|
6252
6280
|
className: ("left-arrow ".concat(getLeftArrowClassName) ? "left-arrow ".concat(getLeftArrowClassName) + " " : "") + _getClassName("arrow left-arrow-".concat(textColor, " ").concat(getLeftArrowClassName), _styleModuleImportMap$e)
|
|
6253
|
-
}, /*#__PURE__*/
|
|
6281
|
+
}, /*#__PURE__*/React__default["default"].createElement(LeftArrow, {
|
|
6254
6282
|
color: textColor === "dark" ? "#fff" : "#333"
|
|
6255
|
-
})) : null, selectedIndex < noOfItems - 1 && rightArrowView() ? /*#__PURE__*/
|
|
6283
|
+
})) : null, selectedIndex < noOfItems - 1 && rightArrowView() ? /*#__PURE__*/React__default["default"].createElement("button", {
|
|
6256
6284
|
onClick: nextClick,
|
|
6257
6285
|
className: ("right-arrow ".concat(getRightArrowClassName) ? "right-arrow ".concat(getRightArrowClassName) + " " : "") + _getClassName("arrow right-arrow-".concat(textColor, " ").concat(getRightArrowClassName), _styleModuleImportMap$e)
|
|
6258
|
-
}, /*#__PURE__*/
|
|
6286
|
+
}, /*#__PURE__*/React__default["default"].createElement(RightArrow, {
|
|
6259
6287
|
color: textColor === "dark" ? "#fff" : "#333"
|
|
6260
6288
|
})) : null);
|
|
6261
6289
|
};
|
|
6262
6290
|
SliderArrow.propTypes = {
|
|
6263
|
-
noOfItems: number,
|
|
6264
|
-
perView: number,
|
|
6265
|
-
slideIndicator: string,
|
|
6266
|
-
previousClick: func,
|
|
6267
|
-
nextClick: func,
|
|
6268
|
-
selectedIndex: number,
|
|
6269
|
-
languageDirection: string
|
|
6291
|
+
noOfItems: PropTypes.number,
|
|
6292
|
+
perView: PropTypes.number,
|
|
6293
|
+
slideIndicator: PropTypes.string,
|
|
6294
|
+
previousClick: PropTypes.func,
|
|
6295
|
+
nextClick: PropTypes.func,
|
|
6296
|
+
selectedIndex: PropTypes.number,
|
|
6297
|
+
languageDirection: PropTypes.string
|
|
6270
6298
|
};
|
|
6271
6299
|
|
|
6272
6300
|
var _styleModuleImportMap$d = {
|
|
@@ -6294,27 +6322,27 @@ var SliderIndicator = function SliderIndicator(_ref) {
|
|
|
6294
6322
|
|
|
6295
6323
|
var config = useStateValue() || {};
|
|
6296
6324
|
var textColor = getTextColor(config.theme);
|
|
6297
|
-
return /*#__PURE__*/
|
|
6325
|
+
return /*#__PURE__*/React__default["default"].createElement("ul", {
|
|
6298
6326
|
className: "slider-indicators slider-indicator-m_indicators__3MNXc"
|
|
6299
6327
|
}, indicatorItems.map(function (_, index) {
|
|
6300
|
-
return /*#__PURE__*/
|
|
6328
|
+
return /*#__PURE__*/React__default["default"].createElement("li", {
|
|
6301
6329
|
key: "slider-".concat(index),
|
|
6302
6330
|
className: "indicator slider-indicator-m_indicator__gTv3x",
|
|
6303
6331
|
onClick: function onClick(e) {
|
|
6304
6332
|
return indicatorClick(e, index);
|
|
6305
6333
|
}
|
|
6306
|
-
}, /*#__PURE__*/
|
|
6334
|
+
}, /*#__PURE__*/React__default["default"].createElement("button", {
|
|
6307
6335
|
"aria-pressed": selectedIndex === index ? "true" : "false",
|
|
6308
6336
|
className: ("indicator-button indicator-".concat(indicatorType) ? "indicator-button indicator-".concat(indicatorType) + " " : "") + _getClassName("indicator-button indicator-".concat(indicatorType, " indicator-").concat(indicatorType, "-").concat(textColor), _styleModuleImportMap$d)
|
|
6309
6337
|
}));
|
|
6310
6338
|
}));
|
|
6311
6339
|
};
|
|
6312
6340
|
SliderIndicator.propTypes = {
|
|
6313
|
-
indicatorItems: array,
|
|
6314
|
-
perView: number,
|
|
6315
|
-
indicatorType: string,
|
|
6316
|
-
indicatorClick: func,
|
|
6317
|
-
selectedIndex: number
|
|
6341
|
+
indicatorItems: PropTypes.array,
|
|
6342
|
+
perView: PropTypes.number,
|
|
6343
|
+
indicatorType: PropTypes.string,
|
|
6344
|
+
indicatorClick: PropTypes.func,
|
|
6345
|
+
selectedIndex: PropTypes.number
|
|
6318
6346
|
};
|
|
6319
6347
|
|
|
6320
6348
|
var smoothScroll = function smoothScroll(node, topOrLeft, horizontal) {
|
|
@@ -6349,24 +6377,24 @@ var ScrollSnap = function ScrollSnap(_ref) {
|
|
|
6349
6377
|
perView = _ref.perView,
|
|
6350
6378
|
slideIndicator = _ref.slideIndicator;
|
|
6351
6379
|
|
|
6352
|
-
var _useState = useState(0),
|
|
6380
|
+
var _useState = React.useState(0),
|
|
6353
6381
|
_useState2 = _slicedToArray(_useState, 2),
|
|
6354
6382
|
selectedIndex = _useState2[0],
|
|
6355
6383
|
setSelectedIndex = _useState2[1];
|
|
6356
6384
|
|
|
6357
|
-
var _useState3 = useState(false),
|
|
6385
|
+
var _useState3 = React.useState(false),
|
|
6358
6386
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
6359
6387
|
autoScroll = _useState4[0],
|
|
6360
6388
|
setAutoScroll = _useState4[1];
|
|
6361
6389
|
|
|
6362
|
-
var languageDirection = useSelector(function (state) {
|
|
6390
|
+
var languageDirection = reactRedux.useSelector(function (state) {
|
|
6363
6391
|
return get_1(state, ["qt", "config", "language", "direction"], "ltr");
|
|
6364
6392
|
});
|
|
6365
6393
|
var noOfItems = children ? children.length : 0;
|
|
6366
|
-
var scroller = useRef(null);
|
|
6394
|
+
var scroller = React.useRef(null);
|
|
6367
6395
|
var numberOfIndicatorsToShow = children.length - (perView - 1);
|
|
6368
6396
|
var indicatorItems = children.slice(0, numberOfIndicatorsToShow);
|
|
6369
|
-
useEffect(function () {
|
|
6397
|
+
React.useEffect(function () {
|
|
6370
6398
|
if (scroller.current) {
|
|
6371
6399
|
scroller.current.addEventListener("scroll", setIndicatorValue(function () {
|
|
6372
6400
|
var value = Math.round(scroller.current.scrollLeft / scroller.current.scrollWidth * noOfItems);
|
|
@@ -6383,7 +6411,7 @@ var ScrollSnap = function ScrollSnap(_ref) {
|
|
|
6383
6411
|
};
|
|
6384
6412
|
}, []); // Infinite scroll
|
|
6385
6413
|
|
|
6386
|
-
useEffect(function () {
|
|
6414
|
+
React.useEffect(function () {
|
|
6387
6415
|
if (isInfinite && !autoScroll) {
|
|
6388
6416
|
var timer = setInterval(function () {
|
|
6389
6417
|
infiniteScroll();
|
|
@@ -6432,23 +6460,23 @@ var ScrollSnap = function ScrollSnap(_ref) {
|
|
|
6432
6460
|
updateItemSelection(newIndex, languageDirection, scroller, noOfItems);
|
|
6433
6461
|
};
|
|
6434
6462
|
|
|
6435
|
-
return /*#__PURE__*/
|
|
6463
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6436
6464
|
className: "scroll-snap-container"
|
|
6437
|
-
}, /*#__PURE__*/
|
|
6465
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6438
6466
|
className: "scroll-snap-wrapper scroll-snap-m_wrapper__1Rz9v",
|
|
6439
6467
|
onMouseEnter: pauseAutoPlay,
|
|
6440
6468
|
onMouseLeave: pauseAutoPlay
|
|
6441
|
-
}, /*#__PURE__*/
|
|
6469
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6442
6470
|
ref: scroller,
|
|
6443
6471
|
className: "scroll-snap-carousel scroll-snap-m_carousel__2m3cg"
|
|
6444
|
-
}, children), isArrow && /*#__PURE__*/
|
|
6472
|
+
}, children), isArrow && /*#__PURE__*/React__default["default"].createElement(SliderArrow, {
|
|
6445
6473
|
noOfItems: noOfItems,
|
|
6446
6474
|
perView: perView,
|
|
6447
6475
|
previousClick: previousClick,
|
|
6448
6476
|
nextClick: nextClick,
|
|
6449
6477
|
selectedIndex: selectedIndex,
|
|
6450
6478
|
languageDirection: languageDirection
|
|
6451
|
-
})), children.length > perView && slideIndicator !== "none" && /*#__PURE__*/
|
|
6479
|
+
})), children.length > perView && slideIndicator !== "none" && /*#__PURE__*/React__default["default"].createElement(SliderIndicator, {
|
|
6452
6480
|
indicatorItems: indicatorItems,
|
|
6453
6481
|
indicatorClick: indicatorClick,
|
|
6454
6482
|
selectedIndex: selectedIndex,
|
|
@@ -6464,13 +6492,13 @@ ScrollSnap.defaultProps = {
|
|
|
6464
6492
|
slideIndicator: "dots"
|
|
6465
6493
|
};
|
|
6466
6494
|
ScrollSnap.propTypes = {
|
|
6467
|
-
children: array.isRequired,
|
|
6468
|
-
isArrow: bool,
|
|
6469
|
-
isInfinite: bool,
|
|
6470
|
-
interval: number,
|
|
6471
|
-
pauseOnHover: bool,
|
|
6472
|
-
perView: number,
|
|
6473
|
-
slideIndicator: string
|
|
6495
|
+
children: PropTypes.array.isRequired,
|
|
6496
|
+
isArrow: PropTypes.bool,
|
|
6497
|
+
isInfinite: PropTypes.bool,
|
|
6498
|
+
interval: PropTypes.number,
|
|
6499
|
+
pauseOnHover: PropTypes.bool,
|
|
6500
|
+
perView: PropTypes.number,
|
|
6501
|
+
slideIndicator: PropTypes.string
|
|
6474
6502
|
};
|
|
6475
6503
|
|
|
6476
6504
|
var ImageSlideshowBase = function ImageSlideshowBase(props) {
|
|
@@ -6483,18 +6511,18 @@ var ImageSlideshowBase = function ImageSlideshowBase(props) {
|
|
|
6483
6511
|
title = image.title,
|
|
6484
6512
|
_image$hyperlink = image.hyperlink,
|
|
6485
6513
|
hyperlink = _image$hyperlink === void 0 ? "" : _image$hyperlink;
|
|
6486
|
-
return /*#__PURE__*/
|
|
6514
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6487
6515
|
className: "image-slideshow-m_slide__3URCC",
|
|
6488
6516
|
key: id
|
|
6489
|
-
}, /*#__PURE__*/
|
|
6517
|
+
}, /*#__PURE__*/React__default["default"].createElement("figure", {
|
|
6490
6518
|
key: id,
|
|
6491
6519
|
className: "image-slideshow-m_image-container__2VTEK",
|
|
6492
6520
|
onClick: function onClick() {
|
|
6493
6521
|
return onClickHandler(index);
|
|
6494
6522
|
}
|
|
6495
|
-
}, /*#__PURE__*/
|
|
6523
|
+
}, /*#__PURE__*/React__default["default"].createElement(components.LazyLoadImages, {
|
|
6496
6524
|
margin: "0px"
|
|
6497
|
-
}, /*#__PURE__*/
|
|
6525
|
+
}, /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
|
|
6498
6526
|
slug: imageS3Key,
|
|
6499
6527
|
metadata: metadata,
|
|
6500
6528
|
"aspect-ratio": [16, 9],
|
|
@@ -6505,9 +6533,9 @@ var ImageSlideshowBase = function ImageSlideshowBase(props) {
|
|
|
6505
6533
|
},
|
|
6506
6534
|
className: "image-slideshow-m_image__1p1fO",
|
|
6507
6535
|
alt: title
|
|
6508
|
-
}))), hyperlink && /*#__PURE__*/
|
|
6536
|
+
}))), hyperlink && /*#__PURE__*/React__default["default"].createElement(HyperLink, {
|
|
6509
6537
|
hyperLink: hyperlink
|
|
6510
|
-
}), /*#__PURE__*/
|
|
6538
|
+
}), /*#__PURE__*/React__default["default"].createElement("p", {
|
|
6511
6539
|
className: "image-slideshow-m_caption__mWpmc",
|
|
6512
6540
|
dangerouslySetInnerHTML: {
|
|
6513
6541
|
__html: title
|
|
@@ -6518,10 +6546,10 @@ var ImageSlideshowBase = function ImageSlideshowBase(props) {
|
|
|
6518
6546
|
var ImageSlideshowTemplate = function ImageSlideshowTemplate(_ref) {
|
|
6519
6547
|
var onClickHandler = _ref.onClickHandler;
|
|
6520
6548
|
var storyElements = get_1(props, ["element", "story-elements"], []);
|
|
6521
|
-
return /*#__PURE__*/
|
|
6549
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6522
6550
|
className: "arr--image-slideshow-element image-slideshow-m_slideshow__3jRFX",
|
|
6523
6551
|
"data-test-id": "image-slideshow"
|
|
6524
|
-
}, /*#__PURE__*/
|
|
6552
|
+
}, /*#__PURE__*/React__default["default"].createElement(ScrollSnap, {
|
|
6525
6553
|
slideIndicator: "none"
|
|
6526
6554
|
}, storyElements.map(function (image, index) {
|
|
6527
6555
|
return Slide(image, index, onClickHandler);
|
|
@@ -6529,17 +6557,17 @@ var ImageSlideshowBase = function ImageSlideshowBase(props) {
|
|
|
6529
6557
|
};
|
|
6530
6558
|
|
|
6531
6559
|
ImageSlideshowTemplate.propTypes = {
|
|
6532
|
-
onClickHandler:
|
|
6560
|
+
onClickHandler: PropTypes__default["default"].func
|
|
6533
6561
|
};
|
|
6534
|
-
return /*#__PURE__*/
|
|
6562
|
+
return /*#__PURE__*/React__default["default"].createElement(FullScreenImages, {
|
|
6535
6563
|
template: ImageSlideshowTemplate,
|
|
6536
6564
|
element: props.element
|
|
6537
6565
|
});
|
|
6538
6566
|
};
|
|
6539
6567
|
|
|
6540
6568
|
ImageSlideshowBase.propTypes = {
|
|
6541
|
-
element:
|
|
6542
|
-
"story-elements":
|
|
6569
|
+
element: PropTypes__default["default"].shape({
|
|
6570
|
+
"story-elements": PropTypes__default["default"].array
|
|
6543
6571
|
}),
|
|
6544
6572
|
story: shapeStory
|
|
6545
6573
|
};
|
|
@@ -6597,12 +6625,12 @@ var getElement = function getElement(story, element) {
|
|
|
6597
6625
|
|
|
6598
6626
|
switch (elementType) {
|
|
6599
6627
|
case "ad":
|
|
6600
|
-
return /*#__PURE__*/
|
|
6628
|
+
return /*#__PURE__*/React__default["default"].createElement(AdComponent, _extends({}, element, {
|
|
6601
6629
|
id: "ad-".concat(index, "_").concat(cardId)
|
|
6602
6630
|
}));
|
|
6603
6631
|
|
|
6604
6632
|
case "widget":
|
|
6605
|
-
return /*#__PURE__*/
|
|
6633
|
+
return /*#__PURE__*/React__default["default"].createElement(WidgetComp, {
|
|
6606
6634
|
widgetCode: element.config.customCode,
|
|
6607
6635
|
id: "widget-".concat(index, "_").concat(cardId)
|
|
6608
6636
|
});
|
|
@@ -6615,7 +6643,7 @@ var getElement = function getElement(story, element) {
|
|
|
6615
6643
|
textElementColor = _text$css$textColor === void 0 ? "#000" : _text$css$textColor,
|
|
6616
6644
|
_text$css$hyperlinkCo = _text$css.hyperlinkColor,
|
|
6617
6645
|
hyperlinkColor = _text$css$hyperlinkCo === void 0 ? "#2f81cd" : _text$css$hyperlinkCo;
|
|
6618
|
-
return /*#__PURE__*/
|
|
6646
|
+
return /*#__PURE__*/React__default["default"].createElement(Text, {
|
|
6619
6647
|
element: element,
|
|
6620
6648
|
css: {
|
|
6621
6649
|
textColor: textElementColor,
|
|
@@ -6636,7 +6664,7 @@ var getElement = function getElement(story, element) {
|
|
|
6636
6664
|
headline = _summary$opts$headlin === void 0 ? "" : _summary$opts$headlin,
|
|
6637
6665
|
_summary$opts$hideHea = _summary$opts.hideHeadline,
|
|
6638
6666
|
hideHeadline = _summary$opts$hideHea === void 0 ? false : _summary$opts$hideHea;
|
|
6639
|
-
return /*#__PURE__*/
|
|
6667
|
+
return /*#__PURE__*/React__default["default"].createElement(Summary, {
|
|
6640
6668
|
element: element,
|
|
6641
6669
|
template: summaryTemplate,
|
|
6642
6670
|
opts: {
|
|
@@ -6655,7 +6683,7 @@ var getElement = function getElement(story, element) {
|
|
|
6655
6683
|
_blurb$css = _blurb$css === void 0 ? {} : _blurb$css;
|
|
6656
6684
|
var _blurb$css$borderColo = _blurb$css.borderColor,
|
|
6657
6685
|
borderColor = _blurb$css$borderColo === void 0 ? "#2f81cd" : _blurb$css$borderColo;
|
|
6658
|
-
return /*#__PURE__*/
|
|
6686
|
+
return /*#__PURE__*/React__default["default"].createElement(Blurb, {
|
|
6659
6687
|
element: element,
|
|
6660
6688
|
template: blurbTemplate,
|
|
6661
6689
|
css: {
|
|
@@ -6674,7 +6702,7 @@ var getElement = function getElement(story, element) {
|
|
|
6674
6702
|
blockQuoteColor = _blockquote$css$block === void 0 ? "#2f81cd" : _blockquote$css$block,
|
|
6675
6703
|
_blockquote$css$backg = _blockquote$css.backgroundShade,
|
|
6676
6704
|
backgroundShade = _blockquote$css$backg === void 0 ? "" : _blockquote$css$backg;
|
|
6677
|
-
return /*#__PURE__*/
|
|
6705
|
+
return /*#__PURE__*/React__default["default"].createElement(BlockQuote, {
|
|
6678
6706
|
element: element,
|
|
6679
6707
|
template: blockQuoteTemplate,
|
|
6680
6708
|
css: {
|
|
@@ -6691,7 +6719,7 @@ var getElement = function getElement(story, element) {
|
|
|
6691
6719
|
_quote$css = _quote$css === void 0 ? {} : _quote$css;
|
|
6692
6720
|
var _quote$css$borderColo = _quote$css.borderColor,
|
|
6693
6721
|
quoteBorderColor = _quote$css$borderColo === void 0 ? "#2f81cd" : _quote$css$borderColo;
|
|
6694
|
-
return /*#__PURE__*/
|
|
6722
|
+
return /*#__PURE__*/React__default["default"].createElement(Quote, {
|
|
6695
6723
|
element: element,
|
|
6696
6724
|
template: quoteTemplate,
|
|
6697
6725
|
css: {
|
|
@@ -6700,7 +6728,7 @@ var getElement = function getElement(story, element) {
|
|
|
6700
6728
|
});
|
|
6701
6729
|
|
|
6702
6730
|
case "bigfact":
|
|
6703
|
-
return /*#__PURE__*/
|
|
6731
|
+
return /*#__PURE__*/React__default["default"].createElement(BigFact, {
|
|
6704
6732
|
element: element
|
|
6705
6733
|
});
|
|
6706
6734
|
|
|
@@ -6715,7 +6743,7 @@ var getElement = function getElement(story, element) {
|
|
|
6715
6743
|
_alsoRead$opts = _alsoRead$opts === void 0 ? {} : _alsoRead$opts;
|
|
6716
6744
|
var _alsoRead$opts$title = _alsoRead$opts.title,
|
|
6717
6745
|
title = _alsoRead$opts$title === void 0 ? "" : _alsoRead$opts$title;
|
|
6718
|
-
return /*#__PURE__*/
|
|
6746
|
+
return /*#__PURE__*/React__default["default"].createElement(AlsoRead, {
|
|
6719
6747
|
story: story,
|
|
6720
6748
|
element: element,
|
|
6721
6749
|
template: alsoReadTemplate,
|
|
@@ -6728,7 +6756,7 @@ var getElement = function getElement(story, element) {
|
|
|
6728
6756
|
});
|
|
6729
6757
|
|
|
6730
6758
|
case "image":
|
|
6731
|
-
return /*#__PURE__*/
|
|
6759
|
+
return /*#__PURE__*/React__default["default"].createElement(Image, {
|
|
6732
6760
|
element: element
|
|
6733
6761
|
});
|
|
6734
6762
|
|
|
@@ -6743,7 +6771,7 @@ var getElement = function getElement(story, element) {
|
|
|
6743
6771
|
_qaElement$opts = _qaElement$opts === void 0 ? {} : _qaElement$opts;
|
|
6744
6772
|
var _qaElement$opts$defau = _qaElement$opts.defaultIconType,
|
|
6745
6773
|
defaultIconType = _qaElement$opts$defau === void 0 ? "edge" : _qaElement$opts$defau;
|
|
6746
|
-
return /*#__PURE__*/
|
|
6774
|
+
return /*#__PURE__*/React__default["default"].createElement(QuestionAnswer, {
|
|
6747
6775
|
element: element,
|
|
6748
6776
|
opts: {
|
|
6749
6777
|
type: "q-and-a",
|
|
@@ -6766,7 +6794,7 @@ var getElement = function getElement(story, element) {
|
|
|
6766
6794
|
_questionElement$opts = _questionElement$opts === void 0 ? {} : _questionElement$opts;
|
|
6767
6795
|
var _questionElement$opts2 = _questionElement$opts.defaultQuestionIconType,
|
|
6768
6796
|
defaultQuestionIconType = _questionElement$opts2 === void 0 ? "edge" : _questionElement$opts2;
|
|
6769
|
-
return /*#__PURE__*/
|
|
6797
|
+
return /*#__PURE__*/React__default["default"].createElement(QuestionAnswer, {
|
|
6770
6798
|
element: element,
|
|
6771
6799
|
opts: {
|
|
6772
6800
|
type: "question",
|
|
@@ -6789,7 +6817,7 @@ var getElement = function getElement(story, element) {
|
|
|
6789
6817
|
_answerElement$opts = _answerElement$opts === void 0 ? {} : _answerElement$opts;
|
|
6790
6818
|
var _answerElement$opts$d = _answerElement$opts.defaultAnswerIconType,
|
|
6791
6819
|
defaultAnswerIconType = _answerElement$opts$d === void 0 ? "edge" : _answerElement$opts$d;
|
|
6792
|
-
return /*#__PURE__*/
|
|
6820
|
+
return /*#__PURE__*/React__default["default"].createElement(QuestionAnswer, {
|
|
6793
6821
|
element: element,
|
|
6794
6822
|
opts: {
|
|
6795
6823
|
type: "answer",
|
|
@@ -6802,43 +6830,43 @@ var getElement = function getElement(story, element) {
|
|
|
6802
6830
|
});
|
|
6803
6831
|
|
|
6804
6832
|
case "gallery":
|
|
6805
|
-
return /*#__PURE__*/
|
|
6833
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6806
6834
|
className: "content-style",
|
|
6807
6835
|
id: "image-gallery-".concat(storyElementId)
|
|
6808
|
-
}, /*#__PURE__*/
|
|
6836
|
+
}, /*#__PURE__*/React__default["default"].createElement(ImageGallery, {
|
|
6809
6837
|
element: element
|
|
6810
6838
|
}));
|
|
6811
6839
|
|
|
6812
6840
|
case "slideshow":
|
|
6813
|
-
return /*#__PURE__*/
|
|
6841
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6814
6842
|
className: "content-style",
|
|
6815
6843
|
id: "image-slideshow-".concat(storyElementId)
|
|
6816
|
-
}, /*#__PURE__*/
|
|
6844
|
+
}, /*#__PURE__*/React__default["default"].createElement(ImageSlideshow, {
|
|
6817
6845
|
element: element
|
|
6818
6846
|
}));
|
|
6819
6847
|
|
|
6820
6848
|
case "youtube-video":
|
|
6821
6849
|
case "dailymotion-video":
|
|
6822
|
-
return /*#__PURE__*/
|
|
6850
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6823
6851
|
className: "content-style",
|
|
6824
6852
|
id: "video-".concat(storyElementId)
|
|
6825
|
-
}, /*#__PURE__*/
|
|
6853
|
+
}, /*#__PURE__*/React__default["default"].createElement(Video, {
|
|
6826
6854
|
element: element,
|
|
6827
6855
|
story: story,
|
|
6828
6856
|
loadIframeOnClick: true
|
|
6829
6857
|
}));
|
|
6830
6858
|
|
|
6831
6859
|
case "attachment":
|
|
6832
|
-
return /*#__PURE__*/
|
|
6860
|
+
return /*#__PURE__*/React__default["default"].createElement(Attachment, {
|
|
6833
6861
|
element: element
|
|
6834
6862
|
});
|
|
6835
6863
|
|
|
6836
6864
|
case "tweet":
|
|
6837
6865
|
case "jsembed":
|
|
6838
|
-
return /*#__PURE__*/
|
|
6866
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6839
6867
|
className: "content-style",
|
|
6840
6868
|
id: "jsembed-".concat(storyElementId)
|
|
6841
|
-
}, /*#__PURE__*/
|
|
6869
|
+
}, /*#__PURE__*/React__default["default"].createElement(StoryElement, {
|
|
6842
6870
|
element: element
|
|
6843
6871
|
}));
|
|
6844
6872
|
|
|
@@ -6849,7 +6877,7 @@ var getElement = function getElement(story, element) {
|
|
|
6849
6877
|
showHeadline = _references$opts$show === void 0 ? true : _references$opts$show,
|
|
6850
6878
|
_references$opts$head = _references$opts.headlineText,
|
|
6851
6879
|
headlineText = _references$opts$head === void 0 ? "" : _references$opts$head;
|
|
6852
|
-
return /*#__PURE__*/
|
|
6880
|
+
return /*#__PURE__*/React__default["default"].createElement(Reference, {
|
|
6853
6881
|
element: element,
|
|
6854
6882
|
opts: {
|
|
6855
6883
|
showHeadline: showHeadline,
|
|
@@ -6858,10 +6886,10 @@ var getElement = function getElement(story, element) {
|
|
|
6858
6886
|
});
|
|
6859
6887
|
|
|
6860
6888
|
default:
|
|
6861
|
-
return /*#__PURE__*/
|
|
6889
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6862
6890
|
className: "content-style",
|
|
6863
6891
|
id: "element-".concat(storyElementId)
|
|
6864
|
-
}, /*#__PURE__*/
|
|
6892
|
+
}, /*#__PURE__*/React__default["default"].createElement(StoryElement, {
|
|
6865
6893
|
element: element,
|
|
6866
6894
|
story: story
|
|
6867
6895
|
}));
|
|
@@ -6869,12 +6897,12 @@ var getElement = function getElement(story, element) {
|
|
|
6869
6897
|
};
|
|
6870
6898
|
|
|
6871
6899
|
({
|
|
6872
|
-
story:
|
|
6873
|
-
imageElement:
|
|
6874
|
-
config:
|
|
6875
|
-
children:
|
|
6876
|
-
card:
|
|
6877
|
-
id:
|
|
6900
|
+
story: PropTypes__default["default"].object,
|
|
6901
|
+
imageElement: PropTypes__default["default"].object,
|
|
6902
|
+
config: PropTypes__default["default"].object,
|
|
6903
|
+
children: PropTypes__default["default"].node,
|
|
6904
|
+
card: PropTypes__default["default"].shape({
|
|
6905
|
+
id: PropTypes__default["default"].string
|
|
6878
6906
|
})
|
|
6879
6907
|
});
|
|
6880
6908
|
var StoryElementCard = function StoryElementCard(_ref2) {
|
|
@@ -6890,7 +6918,7 @@ var StoryElementCard = function StoryElementCard(_ref2) {
|
|
|
6890
6918
|
var textColor = getTextColor(theme);
|
|
6891
6919
|
var isLiveBlog = isLive ? "live-blog" : "";
|
|
6892
6920
|
var shouldRunFBMobileVideoFix = true;
|
|
6893
|
-
return /*#__PURE__*/
|
|
6921
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6894
6922
|
className: "arr--story-page-card-wrapper"
|
|
6895
6923
|
}, get_1(card, ["story-elements"], []).map(function (element, index) {
|
|
6896
6924
|
if (element.id === heroVideoElementId) return false;
|
|
@@ -6902,28 +6930,28 @@ var StoryElementCard = function StoryElementCard(_ref2) {
|
|
|
6902
6930
|
|
|
6903
6931
|
var tableStyle = element && element.subtype === "table" ? "table" : "";
|
|
6904
6932
|
var cardId = get_1(card, ["id"], "");
|
|
6905
|
-
return /*#__PURE__*/
|
|
6933
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6906
6934
|
key: element.id,
|
|
6907
6935
|
className: "arr--element-container " + _getClassName("element-container ".concat(isLiveBlog, " ").concat(tableStyle, " ").concat(textColor), _styleModuleImportMap$c)
|
|
6908
6936
|
}, getElement(story, element, config, adComponent, widgetComp, index, cardId));
|
|
6909
6937
|
}));
|
|
6910
6938
|
};
|
|
6911
6939
|
StoryElementCard.propTypes = {
|
|
6912
|
-
story:
|
|
6913
|
-
card:
|
|
6914
|
-
heroVideoElementId:
|
|
6915
|
-
config:
|
|
6916
|
-
isLive:
|
|
6917
|
-
theme:
|
|
6918
|
-
adComponent:
|
|
6919
|
-
widgetComp:
|
|
6940
|
+
story: PropTypes__default["default"].object,
|
|
6941
|
+
card: PropTypes__default["default"].array,
|
|
6942
|
+
heroVideoElementId: PropTypes__default["default"].number,
|
|
6943
|
+
config: PropTypes__default["default"].object,
|
|
6944
|
+
isLive: PropTypes__default["default"].bool,
|
|
6945
|
+
theme: PropTypes__default["default"].string,
|
|
6946
|
+
adComponent: PropTypes__default["default"].func,
|
|
6947
|
+
widgetComp: PropTypes__default["default"].func
|
|
6920
6948
|
};
|
|
6921
6949
|
({
|
|
6922
|
-
story:
|
|
6923
|
-
card:
|
|
6924
|
-
config:
|
|
6925
|
-
adComponent:
|
|
6926
|
-
widgetComp:
|
|
6950
|
+
story: PropTypes__default["default"].object,
|
|
6951
|
+
card: PropTypes__default["default"].object,
|
|
6952
|
+
config: PropTypes__default["default"].object,
|
|
6953
|
+
adComponent: PropTypes__default["default"].func,
|
|
6954
|
+
widgetComp: PropTypes__default["default"].func
|
|
6927
6955
|
});
|
|
6928
6956
|
var SlotAfterStory = function SlotAfterStory(_ref4) {
|
|
6929
6957
|
var _ref4$id = _ref4.id,
|
|
@@ -6935,12 +6963,12 @@ var SlotAfterStory = function SlotAfterStory(_ref4) {
|
|
|
6935
6963
|
|
|
6936
6964
|
switch (element.type) {
|
|
6937
6965
|
case "ad":
|
|
6938
|
-
return /*#__PURE__*/
|
|
6966
|
+
return /*#__PURE__*/React__default["default"].createElement(AdComponent, _extends({}, element, {
|
|
6939
6967
|
id: "ad-after-story-".concat(id)
|
|
6940
6968
|
}));
|
|
6941
6969
|
|
|
6942
6970
|
case "widget":
|
|
6943
|
-
return /*#__PURE__*/
|
|
6971
|
+
return /*#__PURE__*/React__default["default"].createElement(WidgetComp, {
|
|
6944
6972
|
widgetCode: element.config.customCode,
|
|
6945
6973
|
id: "widget-after-story-".concat(id)
|
|
6946
6974
|
});
|
|
@@ -6950,10 +6978,10 @@ var SlotAfterStory = function SlotAfterStory(_ref4) {
|
|
|
6950
6978
|
}
|
|
6951
6979
|
};
|
|
6952
6980
|
SlotAfterStory.propTypes = {
|
|
6953
|
-
id:
|
|
6954
|
-
element:
|
|
6955
|
-
AdComponent:
|
|
6956
|
-
WidgetComp:
|
|
6981
|
+
id: PropTypes__default["default"].string,
|
|
6982
|
+
element: PropTypes__default["default"].object,
|
|
6983
|
+
AdComponent: PropTypes__default["default"].func,
|
|
6984
|
+
WidgetComp: PropTypes__default["default"].func
|
|
6957
6985
|
};
|
|
6958
6986
|
|
|
6959
6987
|
var _styleModuleImportMap$b = {
|
|
@@ -6975,24 +7003,24 @@ var StoryTags = function StoryTags(_ref) {
|
|
|
6975
7003
|
var textColor = getTextColor(configData.theme);
|
|
6976
7004
|
var mountAt = get_1(config, ["mountAt"], "");
|
|
6977
7005
|
var templateStyle = template === "roundCorners" ? "roundCorners" : "";
|
|
6978
|
-
return /*#__PURE__*/
|
|
7006
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6979
7007
|
className: "arrow-component arr--story-tags"
|
|
6980
7008
|
}, tags.length > 0 && tags.map(function (tag, index) {
|
|
6981
|
-
return /*#__PURE__*/
|
|
7009
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
6982
7010
|
key: index,
|
|
6983
7011
|
"data-test-id": "story-tag",
|
|
6984
7012
|
className: _getClassName("tags ".concat(templateStyle, " ").concat(textColor), _styleModuleImportMap$b)
|
|
6985
|
-
}, /*#__PURE__*/
|
|
7013
|
+
}, /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
6986
7014
|
href: "".concat(mountAt, "/topic/") + tag.slug,
|
|
6987
7015
|
"aria-label": "story-tag-name"
|
|
6988
7016
|
}, tag.name));
|
|
6989
7017
|
}));
|
|
6990
7018
|
};
|
|
6991
7019
|
StoryTags.propTypes = {
|
|
6992
|
-
tags:
|
|
6993
|
-
borderColor:
|
|
6994
|
-
config:
|
|
6995
|
-
template: string
|
|
7020
|
+
tags: PropTypes__default["default"].array,
|
|
7021
|
+
borderColor: PropTypes__default["default"].string,
|
|
7022
|
+
config: PropTypes__default["default"].object,
|
|
7023
|
+
template: PropTypes.string
|
|
6996
7024
|
};
|
|
6997
7025
|
|
|
6998
7026
|
var _styleModuleImportMap$a = {
|
|
@@ -7014,18 +7042,18 @@ var TimeStamp = function TimeStamp(_ref) {
|
|
|
7014
7042
|
var time = story["last-published-at"] || story["first-published-at"];
|
|
7015
7043
|
var isBottomClasses = isBottom ? "bottom-fix" : "";
|
|
7016
7044
|
var textColor = getTextColor(configState.theme);
|
|
7017
|
-
return /*#__PURE__*/
|
|
7045
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isTime && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7018
7046
|
"data-test-id": "publish-time",
|
|
7019
7047
|
className: "time arr--publish-time " + _getClassName("time ".concat(textColor, " ").concat(isBottomClasses), _styleModuleImportMap$a)
|
|
7020
|
-
}, /*#__PURE__*/
|
|
7048
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7021
7049
|
className: "timestamp-m_time-wrapper__3O2lM"
|
|
7022
7050
|
}, getTimeStamp(time, formatter, config))));
|
|
7023
7051
|
};
|
|
7024
7052
|
TimeStamp.propTypes = {
|
|
7025
7053
|
/** The Story Object from the API response */
|
|
7026
|
-
story:
|
|
7027
|
-
isBottom:
|
|
7028
|
-
config:
|
|
7054
|
+
story: PropTypes__default["default"].object,
|
|
7055
|
+
isBottom: PropTypes__default["default"].bool,
|
|
7056
|
+
config: PropTypes__default["default"].object
|
|
7029
7057
|
};
|
|
7030
7058
|
|
|
7031
7059
|
var _styleModuleImportMap$9 = {
|
|
@@ -7068,10 +7096,10 @@ var AuthorBase = function AuthorBase(_ref) {
|
|
|
7068
7096
|
return null;
|
|
7069
7097
|
}
|
|
7070
7098
|
|
|
7071
|
-
return /*#__PURE__*/
|
|
7099
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7072
7100
|
"data-test-id": "author-image",
|
|
7073
7101
|
className: _getClassName("author-image ".concat(dir, "-image"), _styleModuleImportMap$9)
|
|
7074
|
-
}, /*#__PURE__*/
|
|
7102
|
+
}, /*#__PURE__*/React__default["default"].createElement("figure", null, avatarS3Key ? /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
|
|
7075
7103
|
slug: avatarS3Key,
|
|
7076
7104
|
"aspect-ratio": [1, 1],
|
|
7077
7105
|
defaultWidth: 400,
|
|
@@ -7079,14 +7107,14 @@ var AuthorBase = function AuthorBase(_ref) {
|
|
|
7079
7107
|
auto: ["format", "compress"]
|
|
7080
7108
|
},
|
|
7081
7109
|
alt: authorName
|
|
7082
|
-
}) : /*#__PURE__*/
|
|
7110
|
+
}) : /*#__PURE__*/React__default["default"].createElement("img", {
|
|
7083
7111
|
src: avatarUrl
|
|
7084
7112
|
})));
|
|
7085
7113
|
};
|
|
7086
7114
|
|
|
7087
7115
|
var isPrefix = function isPrefix(dir) {
|
|
7088
7116
|
if (prefix) {
|
|
7089
|
-
return /*#__PURE__*/
|
|
7117
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7090
7118
|
className: "arr-author-prefix " + _getClassName("prefix ".concat(textColor), _styleModuleImportMap$9)
|
|
7091
7119
|
}, prefix);
|
|
7092
7120
|
}
|
|
@@ -7094,11 +7122,11 @@ var AuthorBase = function AuthorBase(_ref) {
|
|
|
7094
7122
|
return !hideAuthorImage && authorImage(dir);
|
|
7095
7123
|
};
|
|
7096
7124
|
|
|
7097
|
-
return /*#__PURE__*/
|
|
7125
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isAuthor && /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
7098
7126
|
href: "".concat(mountAt, "/author/") + slug,
|
|
7099
7127
|
"aria-label": "author-name",
|
|
7100
7128
|
className: "author-name arr-author-name arrow-component " + _getClassName("author ".concat(isBottomClasses), _styleModuleImportMap$9)
|
|
7101
|
-
}, isPrefix("ltr"), /*#__PURE__*/
|
|
7129
|
+
}, isPrefix("ltr"), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7102
7130
|
"data-test-id": "author-name",
|
|
7103
7131
|
className: "author-name " + _getClassName("author-name ".concat(textColor), _styleModuleImportMap$9)
|
|
7104
7132
|
}, authorName || story["author-name"]), !prefix && isPrefix("rtl")));
|
|
@@ -7110,18 +7138,18 @@ function mapStateToProps$1(state) {
|
|
|
7110
7138
|
};
|
|
7111
7139
|
}
|
|
7112
7140
|
|
|
7113
|
-
var Author = connect(mapStateToProps$1)(AuthorBase);
|
|
7141
|
+
var Author = reactRedux.connect(mapStateToProps$1)(AuthorBase);
|
|
7114
7142
|
AuthorBase.propTypes = {
|
|
7115
7143
|
/** The Story Object from the API response */
|
|
7116
|
-
story:
|
|
7144
|
+
story: PropTypes__default["default"].object.isRequired,
|
|
7117
7145
|
|
|
7118
7146
|
/** Hide Author Avatar Image */
|
|
7119
|
-
hideAuthorImage:
|
|
7147
|
+
hideAuthorImage: PropTypes__default["default"].bool,
|
|
7120
7148
|
// fix Author bottom of the storyCard
|
|
7121
|
-
isBottom:
|
|
7149
|
+
isBottom: PropTypes__default["default"].bool,
|
|
7122
7150
|
// fix prefix before the author name
|
|
7123
|
-
prefix:
|
|
7124
|
-
config:
|
|
7151
|
+
prefix: PropTypes__default["default"].string,
|
|
7152
|
+
config: PropTypes__default["default"].object
|
|
7125
7153
|
};
|
|
7126
7154
|
AuthorBase.defaultProps = {
|
|
7127
7155
|
hideAuthorImage: false,
|
|
@@ -7142,22 +7170,22 @@ var Divider = function Divider(_ref) {
|
|
|
7142
7170
|
height = _ref$height === void 0 ? "10" : _ref$height,
|
|
7143
7171
|
_ref$color = _ref.color,
|
|
7144
7172
|
color = _ref$color === void 0 ? "light" : _ref$color;
|
|
7145
|
-
return /*#__PURE__*/
|
|
7173
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7146
7174
|
className: _getClassName(color, _styleModuleImportMap$8)
|
|
7147
|
-
}, /*#__PURE__*/
|
|
7175
|
+
}, /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
7148
7176
|
xmlns: "http://www.w3.org/2000/svg",
|
|
7149
7177
|
width: width,
|
|
7150
7178
|
height: height
|
|
7151
|
-
}, /*#__PURE__*/
|
|
7179
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
7152
7180
|
fill: "inherit",
|
|
7153
7181
|
d: "M0 0h1v10H0z"
|
|
7154
7182
|
})));
|
|
7155
7183
|
};
|
|
7156
7184
|
Divider.propTypes = {
|
|
7157
7185
|
/** height , width and color of the dot icon */
|
|
7158
|
-
color:
|
|
7159
|
-
width:
|
|
7160
|
-
height:
|
|
7186
|
+
color: PropTypes__default["default"].string,
|
|
7187
|
+
width: PropTypes__default["default"].string,
|
|
7188
|
+
height: PropTypes__default["default"].string
|
|
7161
7189
|
};
|
|
7162
7190
|
|
|
7163
7191
|
var _styleModuleImportMap$7 = {
|
|
@@ -7188,33 +7216,33 @@ var AuthorWithTime = function AuthorWithTime(_ref) {
|
|
|
7188
7216
|
|
|
7189
7217
|
var getSeparator = function getSeparator() {
|
|
7190
7218
|
if (separator === "divider") {
|
|
7191
|
-
return /*#__PURE__*/
|
|
7219
|
+
return /*#__PURE__*/React__default["default"].createElement(Divider, {
|
|
7192
7220
|
color: textColor
|
|
7193
7221
|
});
|
|
7194
7222
|
}
|
|
7195
7223
|
|
|
7196
|
-
return /*#__PURE__*/
|
|
7224
|
+
return /*#__PURE__*/React__default["default"].createElement(Dot, {
|
|
7197
7225
|
color: textColor
|
|
7198
7226
|
});
|
|
7199
7227
|
};
|
|
7200
7228
|
|
|
7201
7229
|
var getTimeStamp = function getTimeStamp() {
|
|
7202
7230
|
if (!isTime) return null;
|
|
7203
|
-
return /*#__PURE__*/
|
|
7231
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isAuthor && /*#__PURE__*/React__default["default"].createElement("span", {
|
|
7204
7232
|
className: "arr-separator " + _getClassName("".concat(seperatorStyle), _styleModuleImportMap$7)
|
|
7205
|
-
}, getSeparator()), /*#__PURE__*/
|
|
7233
|
+
}, getSeparator()), /*#__PURE__*/React__default["default"].createElement(TimeStamp, {
|
|
7206
7234
|
story: story,
|
|
7207
7235
|
config: config
|
|
7208
|
-
}), isReadTime && /*#__PURE__*/
|
|
7236
|
+
}), isReadTime && /*#__PURE__*/React__default["default"].createElement(ReadTime, {
|
|
7209
7237
|
story: story,
|
|
7210
7238
|
opts: config,
|
|
7211
7239
|
isLightTheme: isLightTheme
|
|
7212
7240
|
}));
|
|
7213
7241
|
};
|
|
7214
7242
|
|
|
7215
|
-
return /*#__PURE__*/
|
|
7243
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7216
7244
|
className: "arr--author-time " + _getClassName("author-time-wrapper ".concat(isBottomClasses), _styleModuleImportMap$7)
|
|
7217
|
-
}, isAuthor ? /*#__PURE__*/
|
|
7245
|
+
}, isAuthor ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Author, {
|
|
7218
7246
|
story: story,
|
|
7219
7247
|
isBottom: true,
|
|
7220
7248
|
hideAuthorImage: hideAuthorImage,
|
|
@@ -7222,19 +7250,19 @@ var AuthorWithTime = function AuthorWithTime(_ref) {
|
|
|
7222
7250
|
}), getTimeStamp()) : getTimeStamp());
|
|
7223
7251
|
};
|
|
7224
7252
|
AuthorWithTime.propTypes = {
|
|
7225
|
-
story:
|
|
7253
|
+
story: PropTypes__default["default"].object,
|
|
7226
7254
|
|
|
7227
7255
|
/** Style of separator between the Author & Timestamp */
|
|
7228
|
-
separator:
|
|
7256
|
+
separator: PropTypes__default["default"].oneOf(["dot", "divider"]),
|
|
7229
7257
|
|
|
7230
7258
|
/** hide the author image */
|
|
7231
|
-
hideAuthorImage:
|
|
7259
|
+
hideAuthorImage: PropTypes__default["default"].bool,
|
|
7232
7260
|
// fix author and time at the end
|
|
7233
|
-
isBottom:
|
|
7261
|
+
isBottom: PropTypes__default["default"].bool,
|
|
7234
7262
|
// fix prefix before the author name
|
|
7235
|
-
prefix:
|
|
7236
|
-
config:
|
|
7237
|
-
isLightTheme:
|
|
7263
|
+
prefix: PropTypes__default["default"].string,
|
|
7264
|
+
config: PropTypes__default["default"].object,
|
|
7265
|
+
isLightTheme: PropTypes__default["default"].bool
|
|
7238
7266
|
};
|
|
7239
7267
|
AuthorWithTime.defaultProps = {
|
|
7240
7268
|
separator: "dot",
|
|
@@ -7280,7 +7308,7 @@ var CollectionNameBase = function CollectionNameBase(_ref) {
|
|
|
7280
7308
|
var borderBottomFullStyle = templateStyle.includes("collection-borderBottomFull") ? "4px solid ".concat(CollectionNameBorderColor) : "";
|
|
7281
7309
|
|
|
7282
7310
|
var borderBottomStyle = function borderBottomStyle() {
|
|
7283
|
-
return templateStyle.includes("collection-borderBottom") && !templateStyle.includes("collection-borderBottomFull") ? /*#__PURE__*/
|
|
7311
|
+
return templateStyle.includes("collection-borderBottom") && !templateStyle.includes("collection-borderBottomFull") ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7284
7312
|
className: "collection-name-m_border-bottom__1MnlV",
|
|
7285
7313
|
style: {
|
|
7286
7314
|
borderBottom: "4px solid ".concat(CollectionNameBorderColor)
|
|
@@ -7340,40 +7368,40 @@ var CollectionNameBase = function CollectionNameBase(_ref) {
|
|
|
7340
7368
|
}
|
|
7341
7369
|
};
|
|
7342
7370
|
|
|
7343
|
-
return /*#__PURE__*/
|
|
7371
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, showRowTitle && collectionName && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7344
7372
|
style: {
|
|
7345
7373
|
borderBottom: borderBottomFullStyle
|
|
7346
7374
|
},
|
|
7347
7375
|
"data-test-id": "collection-name",
|
|
7348
7376
|
className: ("arr--collection-name arrow-component ".concat(templateStyle) ? "arr--collection-name arrow-component ".concat(templateStyle) + " " : "") + _getClassName("collection ".concat(textColor, " ").concat(templateStyle), _styleModuleImportMap$6)
|
|
7349
|
-
}, templateStyle.includes("collection-borderLeft") && /*#__PURE__*/
|
|
7377
|
+
}, templateStyle.includes("collection-borderLeft") && /*#__PURE__*/React__default["default"].createElement("span", {
|
|
7350
7378
|
className: "arr-collection-name-border-left collection-name-m_border-left__3_pYw",
|
|
7351
7379
|
style: {
|
|
7352
7380
|
color: CollectionNameBorderColor,
|
|
7353
7381
|
fontSize: getBorderHeight()
|
|
7354
7382
|
}
|
|
7355
|
-
}), slug && !slug.includes(undefined) ? /*#__PURE__*/
|
|
7383
|
+
}), slug && !slug.includes(undefined) ? /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
7356
7384
|
href: slug,
|
|
7357
7385
|
"aria-label": "collection-name"
|
|
7358
|
-
}, /*#__PURE__*/
|
|
7386
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeaderTag, null, collectionName)) : /*#__PURE__*/React__default["default"].createElement(HeaderTag, null, collectionName), borderBottomStyle()));
|
|
7359
7387
|
};
|
|
7360
7388
|
CollectionNameBase.propTypes = {
|
|
7361
7389
|
/** Collection name border color */
|
|
7362
|
-
collectionNameBorderColor: PropTypes
|
|
7390
|
+
collectionNameBorderColor: PropTypes.PropTypes.string,
|
|
7363
7391
|
|
|
7364
7392
|
/** The Collection Object from the API response */
|
|
7365
|
-
collection: PropTypes
|
|
7393
|
+
collection: PropTypes.PropTypes.object,
|
|
7366
7394
|
|
|
7367
7395
|
/** The publisher config from the API response */
|
|
7368
|
-
config: PropTypes
|
|
7396
|
+
config: PropTypes.PropTypes.object,
|
|
7369
7397
|
|
|
7370
7398
|
/** The style template for the component */
|
|
7371
|
-
collectionNameTemplate: PropTypes
|
|
7399
|
+
collectionNameTemplate: PropTypes.PropTypes.oneOf(["", "borderLeft", "borderBottom", "crossLine", "borderBottomFull"]),
|
|
7372
7400
|
|
|
7373
7401
|
/** Header tags ranging h1-h6, where h[headerLevel] */
|
|
7374
|
-
headerLevel: PropTypes
|
|
7375
|
-
customCollectionName: PropTypes
|
|
7376
|
-
navigate: PropTypes
|
|
7402
|
+
headerLevel: PropTypes.PropTypes.string,
|
|
7403
|
+
customCollectionName: PropTypes.PropTypes.string,
|
|
7404
|
+
navigate: PropTypes.PropTypes.bool
|
|
7377
7405
|
};
|
|
7378
7406
|
CollectionNameBase.defaultProps = {
|
|
7379
7407
|
collectionNameTemplate: "",
|
|
@@ -7386,16 +7414,16 @@ function mapStateToProps(state) {
|
|
|
7386
7414
|
};
|
|
7387
7415
|
}
|
|
7388
7416
|
|
|
7389
|
-
var CollectionName = connect(mapStateToProps)(CollectionNameBase);
|
|
7417
|
+
var CollectionName = reactRedux.connect(mapStateToProps)(CollectionNameBase);
|
|
7390
7418
|
|
|
7391
7419
|
function LiveIcon() {
|
|
7392
|
-
return /*#__PURE__*/
|
|
7420
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
7393
7421
|
className: "live-icon",
|
|
7394
7422
|
xmlns: "http://www.w3.org/2000/svg",
|
|
7395
7423
|
width: "25",
|
|
7396
7424
|
height: "24",
|
|
7397
7425
|
viewBox: "0 0 25 24"
|
|
7398
|
-
}, /*#__PURE__*/
|
|
7426
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
7399
7427
|
fill: "#ff5858",
|
|
7400
7428
|
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"
|
|
7401
7429
|
}));
|
|
@@ -7452,37 +7480,37 @@ var Headline = function Headline(_ref) {
|
|
|
7452
7480
|
var wrapperClass = premiumStory ? "wrapper" : "";
|
|
7453
7481
|
var iconSize = "24px";
|
|
7454
7482
|
var enableLiveIcon = showLiveIcon && story["story-template"] === "live-blog" && !get_1(story, ["metadata", "is-closed"], false);
|
|
7455
|
-
return /*#__PURE__*/
|
|
7483
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7456
7484
|
"data-test-id": "headline",
|
|
7457
7485
|
className: "arrow-component arr--headline " + _getClassName(wrapperClass, _styleModuleImportMap$5)
|
|
7458
|
-
}, premiumStory && /*#__PURE__*/
|
|
7486
|
+
}, premiumStory && /*#__PURE__*/React__default["default"].createElement(PremiumStoryIcon, {
|
|
7459
7487
|
width: iconSize,
|
|
7460
7488
|
height: iconSize,
|
|
7461
7489
|
color: iconColor,
|
|
7462
7490
|
iconType: iconStyle,
|
|
7463
7491
|
positionTop: positionHeadline()
|
|
7464
|
-
}), isLink ? /*#__PURE__*/
|
|
7492
|
+
}), isLink ? /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
7465
7493
|
href: getStoryUrl(story, "/".concat(story.slug)),
|
|
7466
7494
|
externalLink: isExternalStory(story),
|
|
7467
7495
|
"aria-label": "headline"
|
|
7468
|
-
}, /*#__PURE__*/
|
|
7496
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeaderTag, {
|
|
7469
7497
|
className: _getClassName("headline ".concat(textColor), _styleModuleImportMap$5)
|
|
7470
|
-
}, enableLiveIcon && /*#__PURE__*/
|
|
7498
|
+
}, enableLiveIcon && /*#__PURE__*/React__default["default"].createElement(LiveIcon, null), headline)) : /*#__PURE__*/React__default["default"].createElement(HeaderTag, {
|
|
7471
7499
|
className: _getClassName("headline ".concat(textColor), _styleModuleImportMap$5)
|
|
7472
|
-
}, enableLiveIcon && /*#__PURE__*/
|
|
7500
|
+
}, enableLiveIcon && /*#__PURE__*/React__default["default"].createElement(LiveIcon, null), headline));
|
|
7473
7501
|
};
|
|
7474
7502
|
Headline.propTypes = {
|
|
7475
7503
|
/** The Story Object from the API response */
|
|
7476
|
-
story:
|
|
7504
|
+
story: PropTypes__default["default"].object.isRequired,
|
|
7477
7505
|
|
|
7478
7506
|
/** Header tags ranging h1-h6, where h[headerLevel] */
|
|
7479
|
-
headerLevel:
|
|
7480
|
-
premiumStoryIconConfig:
|
|
7481
|
-
iconColor:
|
|
7482
|
-
iconType:
|
|
7483
|
-
enablePremiumStoryIcon:
|
|
7507
|
+
headerLevel: PropTypes__default["default"].string,
|
|
7508
|
+
premiumStoryIconConfig: PropTypes__default["default"].shape({
|
|
7509
|
+
iconColor: PropTypes__default["default"].string,
|
|
7510
|
+
iconType: PropTypes__default["default"].string,
|
|
7511
|
+
enablePremiumStoryIcon: PropTypes__default["default"].bool
|
|
7484
7512
|
}),
|
|
7485
|
-
isLink:
|
|
7513
|
+
isLink: PropTypes__default["default"].bool
|
|
7486
7514
|
};
|
|
7487
7515
|
Headline.defaultProps = {
|
|
7488
7516
|
headerLevel: "6",
|
|
@@ -7531,7 +7559,7 @@ var StoryCard = function StoryCard(_ref) {
|
|
|
7531
7559
|
prefix = _ref.prefix,
|
|
7532
7560
|
config = _ref.config,
|
|
7533
7561
|
isHorizontalWithImageLast = _ref.isHorizontalWithImageLast;
|
|
7534
|
-
if (!story || isEmpty(story)) return /*#__PURE__*/
|
|
7562
|
+
if (!story || isEmpty(story)) return /*#__PURE__*/React__default["default"].createElement("div", null);
|
|
7535
7563
|
var borderOptions = ["default", "full", "bottom", "boxShadow"];
|
|
7536
7564
|
var borderTemplate = borderOptions.includes(border) ? "border-".concat(border) : ""; // TODO optimize conditions
|
|
7537
7565
|
|
|
@@ -7541,7 +7569,7 @@ var StoryCard = function StoryCard(_ref) {
|
|
|
7541
7569
|
var bgImgContentOverlapClass = bgImgContentOverlap ? "content-overlap" : "";
|
|
7542
7570
|
var textColor = getTextColor(theme);
|
|
7543
7571
|
var horizontalMobileClasses = isHorizontalMobile ? "horizontal-mob" : "";
|
|
7544
|
-
var defaultStorycard = /*#__PURE__*/
|
|
7572
|
+
var defaultStorycard = /*#__PURE__*/React__default["default"].createElement(DefaultStoryCard, {
|
|
7545
7573
|
story: story,
|
|
7546
7574
|
aspectRatio: aspectRatio,
|
|
7547
7575
|
border: border,
|
|
@@ -7555,7 +7583,7 @@ var StoryCard = function StoryCard(_ref) {
|
|
|
7555
7583
|
config: config,
|
|
7556
7584
|
isHorizontalWithImageLast: isHorizontalWithImageLast
|
|
7557
7585
|
});
|
|
7558
|
-
return /*#__PURE__*/
|
|
7586
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7559
7587
|
"data-test-id": "story-card",
|
|
7560
7588
|
style: {
|
|
7561
7589
|
backgroundColor: theme,
|
|
@@ -7584,91 +7612,91 @@ var DefaultStoryCard = function DefaultStoryCard(_ref2) {
|
|
|
7584
7612
|
var SectionTagborderColor = rgbToHex(borderColor);
|
|
7585
7613
|
var _config$localizationC = config.localizationConfig,
|
|
7586
7614
|
localizationConfig = _config$localizationC === void 0 ? {} : _config$localizationC;
|
|
7587
|
-
return /*#__PURE__*/
|
|
7615
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isHorizontal ? /*#__PURE__*/React__default["default"].createElement(HeroImage, {
|
|
7588
7616
|
config: config,
|
|
7589
7617
|
story: story,
|
|
7590
7618
|
isHorizontal: true,
|
|
7591
7619
|
isHorizontalMobile: isHorizontalMobile,
|
|
7592
7620
|
aspectRatio: aspectRatio
|
|
7593
|
-
}) : isHorizontalWithImageLast ? /*#__PURE__*/
|
|
7621
|
+
}) : isHorizontalWithImageLast ? /*#__PURE__*/React__default["default"].createElement(HeroImage, {
|
|
7594
7622
|
config: config,
|
|
7595
7623
|
story: story,
|
|
7596
7624
|
isHorizontalWithImageLast: true,
|
|
7597
7625
|
isHorizontalMobile: isHorizontalMobile,
|
|
7598
7626
|
aspectRatio: aspectRatio
|
|
7599
|
-
}) : /*#__PURE__*/
|
|
7627
|
+
}) : /*#__PURE__*/React__default["default"].createElement(HeroImage, {
|
|
7600
7628
|
story: story,
|
|
7601
7629
|
config: config,
|
|
7602
7630
|
isHorizontalMobile: isHorizontalMobile,
|
|
7603
7631
|
aspectRatio: aspectRatio
|
|
7604
|
-
}), /*#__PURE__*/
|
|
7632
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7605
7633
|
className: "arr--story-content " + _getClassName("content ".concat(alignment), _styleModuleImportMap$4)
|
|
7606
|
-
}, /*#__PURE__*/
|
|
7634
|
+
}, /*#__PURE__*/React__default["default"].createElement(SectionTag, {
|
|
7607
7635
|
story: story,
|
|
7608
7636
|
borderColor: SectionTagborderColor
|
|
7609
|
-
}), /*#__PURE__*/
|
|
7637
|
+
}), /*#__PURE__*/React__default["default"].createElement(Headline, {
|
|
7610
7638
|
story: story,
|
|
7611
7639
|
headerLevel: headerLevel,
|
|
7612
7640
|
premiumStoryIconConfig: config
|
|
7613
|
-
}), /*#__PURE__*/
|
|
7641
|
+
}), /*#__PURE__*/React__default["default"].createElement(AuthorWithTime, {
|
|
7614
7642
|
config: localizationConfig,
|
|
7615
7643
|
story: story,
|
|
7616
7644
|
isBottom: true,
|
|
7617
7645
|
prefix: prefix,
|
|
7618
7646
|
hideAuthorImage: hideAuthorImage
|
|
7619
|
-
}), /*#__PURE__*/
|
|
7647
|
+
}), /*#__PURE__*/React__default["default"].createElement(Subheadline, {
|
|
7620
7648
|
story: story
|
|
7621
7649
|
})));
|
|
7622
7650
|
};
|
|
7623
7651
|
|
|
7624
7652
|
DefaultStoryCard.propTypes = {
|
|
7625
|
-
story:
|
|
7626
|
-
border:
|
|
7627
|
-
isBottom:
|
|
7628
|
-
isHorizontal:
|
|
7629
|
-
aspectRatio:
|
|
7630
|
-
isHorizontalMobile:
|
|
7631
|
-
centerAlign:
|
|
7632
|
-
headerLevel:
|
|
7633
|
-
borderColor:
|
|
7634
|
-
hideAuthorImage:
|
|
7635
|
-
prefix:
|
|
7636
|
-
config:
|
|
7637
|
-
isHorizontalWithImageLast:
|
|
7653
|
+
story: PropTypes__default["default"].object.isRequired,
|
|
7654
|
+
border: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string]),
|
|
7655
|
+
isBottom: PropTypes__default["default"].bool,
|
|
7656
|
+
isHorizontal: PropTypes__default["default"].bool,
|
|
7657
|
+
aspectRatio: PropTypes__default["default"].oneOfType([PropTypes__default["default"].array]),
|
|
7658
|
+
isHorizontalMobile: PropTypes__default["default"].bool,
|
|
7659
|
+
centerAlign: PropTypes__default["default"].bool,
|
|
7660
|
+
headerLevel: PropTypes__default["default"].string,
|
|
7661
|
+
borderColor: PropTypes__default["default"].string,
|
|
7662
|
+
hideAuthorImage: PropTypes__default["default"].bool,
|
|
7663
|
+
prefix: PropTypes__default["default"].string,
|
|
7664
|
+
config: PropTypes__default["default"].object,
|
|
7665
|
+
isHorizontalWithImageLast: PropTypes__default["default"].bool
|
|
7638
7666
|
};
|
|
7639
7667
|
StoryCard.propTypes = {
|
|
7640
7668
|
/** The Story Object from the API response */
|
|
7641
|
-
story:
|
|
7642
|
-
children:
|
|
7669
|
+
story: PropTypes__default["default"].object.isRequired,
|
|
7670
|
+
children: PropTypes__default["default"].node,
|
|
7643
7671
|
|
|
7644
7672
|
/** Flip the Story Card to Horizonal mode */
|
|
7645
|
-
isHorizontal:
|
|
7673
|
+
isHorizontal: PropTypes__default["default"].bool,
|
|
7646
7674
|
|
|
7647
7675
|
/** Add border to the Story Card */
|
|
7648
|
-
border:
|
|
7676
|
+
border: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string]),
|
|
7649
7677
|
// story card with background image
|
|
7650
|
-
useImageAsBackground:
|
|
7678
|
+
useImageAsBackground: PropTypes__default["default"].bool,
|
|
7651
7679
|
// story card content overlap with image
|
|
7652
|
-
bgImgContentOverlap:
|
|
7680
|
+
bgImgContentOverlap: PropTypes__default["default"].bool,
|
|
7653
7681
|
|
|
7654
7682
|
/** add aspect ratio for hero image */
|
|
7655
|
-
aspectRatio:
|
|
7683
|
+
aspectRatio: PropTypes__default["default"].oneOfType([PropTypes__default["default"].array]),
|
|
7656
7684
|
|
|
7657
7685
|
/** add theme(dark /light/custom color) for storycard */
|
|
7658
|
-
theme:
|
|
7686
|
+
theme: PropTypes__default["default"].string,
|
|
7659
7687
|
|
|
7660
7688
|
/** flip the story card mobile design horizontal */
|
|
7661
|
-
isHorizontalMobile:
|
|
7689
|
+
isHorizontalMobile: PropTypes__default["default"].bool,
|
|
7662
7690
|
// make content center align in desktop and left align in mobile
|
|
7663
|
-
centerAlign:
|
|
7664
|
-
headerLevel:
|
|
7665
|
-
borderColor:
|
|
7691
|
+
centerAlign: PropTypes__default["default"].bool,
|
|
7692
|
+
headerLevel: PropTypes__default["default"].string,
|
|
7693
|
+
borderColor: PropTypes__default["default"].string,
|
|
7666
7694
|
// handle author image through storycard
|
|
7667
|
-
hideAuthorImage:
|
|
7695
|
+
hideAuthorImage: PropTypes__default["default"].bool,
|
|
7668
7696
|
// handle author prefix through storycard
|
|
7669
|
-
prefix:
|
|
7670
|
-
config:
|
|
7671
|
-
isHorizontalWithImageLast:
|
|
7697
|
+
prefix: PropTypes__default["default"].string,
|
|
7698
|
+
config: PropTypes__default["default"].object,
|
|
7699
|
+
isHorizontalWithImageLast: PropTypes__default["default"].bool
|
|
7672
7700
|
};
|
|
7673
7701
|
StoryCard.defaultProps = {
|
|
7674
7702
|
isHorizontal: false,
|
|
@@ -7683,19 +7711,19 @@ StoryCard.defaultProps = {
|
|
|
7683
7711
|
var ClockIcon = function ClockIcon(_ref) {
|
|
7684
7712
|
var _ref$color = _ref.color,
|
|
7685
7713
|
color = _ref$color === void 0 ? "#333" : _ref$color;
|
|
7686
|
-
return /*#__PURE__*/
|
|
7714
|
+
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
7687
7715
|
xmlns: "http://www.w3.org/2000/svg",
|
|
7688
7716
|
width: "24",
|
|
7689
7717
|
height: "24",
|
|
7690
7718
|
viewBox: "0 0 24 24"
|
|
7691
|
-
}, /*#__PURE__*/
|
|
7719
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
7692
7720
|
fill: color,
|
|
7693
7721
|
fillRule: "evenodd",
|
|
7694
7722
|
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"
|
|
7695
7723
|
}));
|
|
7696
7724
|
};
|
|
7697
7725
|
ClockIcon.propTypes = {
|
|
7698
|
-
color:
|
|
7726
|
+
color: PropTypes__default["default"].string
|
|
7699
7727
|
};
|
|
7700
7728
|
|
|
7701
7729
|
var _styleModuleImportMap$3 = {
|
|
@@ -7730,26 +7758,26 @@ var LoadmoreButton = function LoadmoreButton(_ref) {
|
|
|
7730
7758
|
if (!showButton) return null;
|
|
7731
7759
|
var textColor = getTextColor(theme);
|
|
7732
7760
|
var slug = customUrlPath ? "/".concat(customUrlPath) : generateNavigateSlug(collection, _objectSpread$1(_objectSpread$1({}, qtConfig), config));
|
|
7733
|
-
return template === "SubsequentLoadCount" ? /*#__PURE__*/
|
|
7761
|
+
return template === "SubsequentLoadCount" ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7734
7762
|
onClick: onClick,
|
|
7735
7763
|
"data-test-id": "load-more",
|
|
7736
7764
|
className: "arr--button " + _getClassName("button ".concat(textColor, " default"), _styleModuleImportMap$3)
|
|
7737
|
-
}, buttonText) : /*#__PURE__*/
|
|
7765
|
+
}, buttonText) : /*#__PURE__*/React__default["default"].createElement(components.LinkBase, {
|
|
7738
7766
|
href: slug,
|
|
7739
7767
|
navigateTo: navigate,
|
|
7740
7768
|
"data-test-id": "load-more",
|
|
7741
7769
|
"aria-label": "load-more"
|
|
7742
|
-
}, /*#__PURE__*/
|
|
7770
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7743
7771
|
className: "arr--button " + _getClassName("button ".concat(textColor, " default"), _styleModuleImportMap$3)
|
|
7744
7772
|
}, buttonText));
|
|
7745
7773
|
};
|
|
7746
7774
|
LoadmoreButton.propTypes = {
|
|
7747
|
-
collection:
|
|
7748
|
-
template:
|
|
7749
|
-
config:
|
|
7750
|
-
onClick:
|
|
7751
|
-
navigate:
|
|
7752
|
-
qtConfig:
|
|
7775
|
+
collection: PropTypes__default["default"].object,
|
|
7776
|
+
template: PropTypes__default["default"].string,
|
|
7777
|
+
config: PropTypes__default["default"].object,
|
|
7778
|
+
onClick: PropTypes__default["default"].func,
|
|
7779
|
+
navigate: PropTypes__default["default"].func,
|
|
7780
|
+
qtConfig: PropTypes__default["default"].object
|
|
7753
7781
|
};
|
|
7754
7782
|
|
|
7755
7783
|
var _styleModuleImportMap$2 = {
|
|
@@ -7787,23 +7815,23 @@ var KeyEventCards = function KeyEventCards(props) {
|
|
|
7787
7815
|
var updateColor = textColor === "dark" ? dark : light;
|
|
7788
7816
|
var lastElement = index === cardLength - 1;
|
|
7789
7817
|
var borderLeft = lastElement ? "borderNone" : "";
|
|
7790
|
-
return /*#__PURE__*/
|
|
7818
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7791
7819
|
className: _getClassName("time-wrapper ".concat(textColor), _styleModuleImportMap$2)
|
|
7792
|
-
}, /*#__PURE__*/
|
|
7820
|
+
}, /*#__PURE__*/React__default["default"].createElement(ClockIcon, {
|
|
7793
7821
|
color: updateColor
|
|
7794
7822
|
}), getTimeStamp(cardAddedAt, timestampToFormat, {
|
|
7795
7823
|
showTime: true,
|
|
7796
7824
|
isTimeFirst: true
|
|
7797
|
-
})), /*#__PURE__*/
|
|
7825
|
+
})), /*#__PURE__*/React__default["default"].createElement("a", {
|
|
7798
7826
|
href: "".concat(mountAt, "/").concat(slug, "#").concat(id),
|
|
7799
7827
|
"aria-label": "event-title"
|
|
7800
|
-
}, /*#__PURE__*/
|
|
7828
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7801
7829
|
className: _getClassName("event-title ".concat(textColor, " ").concat(borderLeft), _styleModuleImportMap$2)
|
|
7802
7830
|
}, storyElements.map(function (element, index) {
|
|
7803
|
-
return element.type === "title" && /*#__PURE__*/
|
|
7831
|
+
return element.type === "title" && /*#__PURE__*/React__default["default"].createElement("h3", {
|
|
7804
7832
|
key: index
|
|
7805
7833
|
}, element.text);
|
|
7806
|
-
}), showLoadMore && lastElement && loadCards && /*#__PURE__*/
|
|
7834
|
+
}), showLoadMore && lastElement && loadCards && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7807
7835
|
className: "key-events-m_fade-out__11jv_",
|
|
7808
7836
|
style: {
|
|
7809
7837
|
backgroundImage: "linear-gradient(to bottom, transparent, ".concat(theme, ")")
|
|
@@ -7812,19 +7840,19 @@ var KeyEventCards = function KeyEventCards(props) {
|
|
|
7812
7840
|
};
|
|
7813
7841
|
|
|
7814
7842
|
KeyEventCards.propTypes = {
|
|
7815
|
-
card:
|
|
7816
|
-
"card-added-at":
|
|
7817
|
-
"story-elements":
|
|
7818
|
-
id:
|
|
7843
|
+
card: PropTypes__default["default"].shape({
|
|
7844
|
+
"card-added-at": PropTypes__default["default"].number,
|
|
7845
|
+
"story-elements": PropTypes__default["default"].array,
|
|
7846
|
+
id: PropTypes__default["default"].string
|
|
7819
7847
|
}),
|
|
7820
|
-
config:
|
|
7821
|
-
slug:
|
|
7822
|
-
story:
|
|
7823
|
-
elements:
|
|
7824
|
-
index:
|
|
7825
|
-
cardLength:
|
|
7826
|
-
loadCards:
|
|
7827
|
-
showLoadMore:
|
|
7848
|
+
config: PropTypes__default["default"].object,
|
|
7849
|
+
slug: PropTypes__default["default"].string,
|
|
7850
|
+
story: PropTypes__default["default"].object,
|
|
7851
|
+
elements: PropTypes__default["default"].array,
|
|
7852
|
+
index: PropTypes__default["default"].number,
|
|
7853
|
+
cardLength: PropTypes__default["default"].number,
|
|
7854
|
+
loadCards: PropTypes__default["default"].bool,
|
|
7855
|
+
showLoadMore: PropTypes__default["default"].bool
|
|
7828
7856
|
};
|
|
7829
7857
|
var KeyEventsBase = function KeyEventsBase(_ref) {
|
|
7830
7858
|
var _ref$story = _ref.story,
|
|
@@ -7839,7 +7867,7 @@ var KeyEventsBase = function KeyEventsBase(_ref) {
|
|
|
7839
7867
|
initialLoadCount = _config$initialLoadCo === void 0 ? 4 : _config$initialLoadCo;
|
|
7840
7868
|
var textColor = getTextColor(theme);
|
|
7841
7869
|
|
|
7842
|
-
var _useState = useState(initialLoadCount),
|
|
7870
|
+
var _useState = React.useState(initialLoadCount),
|
|
7843
7871
|
_useState2 = _slicedToArray(_useState, 2),
|
|
7844
7872
|
initialCount = _useState2[0],
|
|
7845
7873
|
updatedCount = _useState2[1];
|
|
@@ -7848,7 +7876,7 @@ var KeyEventsBase = function KeyEventsBase(_ref) {
|
|
|
7848
7876
|
return get_1(card.metadata, ["attributes", "key-event"]);
|
|
7849
7877
|
});
|
|
7850
7878
|
var lastElement = cardsWithKeyEvents.length > initialCount;
|
|
7851
|
-
var qtConfig = useSelector(function (state) {
|
|
7879
|
+
var qtConfig = reactRedux.useSelector(function (state) {
|
|
7852
7880
|
return get_1(state, ["qt", "config"], {});
|
|
7853
7881
|
});
|
|
7854
7882
|
|
|
@@ -7862,7 +7890,7 @@ var KeyEventsBase = function KeyEventsBase(_ref) {
|
|
|
7862
7890
|
|
|
7863
7891
|
var showAllCards = !showLoadMore ? cardsWithKeyEvents.slice(0, 4) : cardsWithKeyEvents.slice(0, initialCount);
|
|
7864
7892
|
var keyEvents = showAllCards.map(function (card, index, source) {
|
|
7865
|
-
return /*#__PURE__*/
|
|
7893
|
+
return /*#__PURE__*/React__default["default"].createElement(KeyEventCards, {
|
|
7866
7894
|
cardLength: source.length,
|
|
7867
7895
|
card: card,
|
|
7868
7896
|
key: card.id,
|
|
@@ -7873,14 +7901,14 @@ var KeyEventsBase = function KeyEventsBase(_ref) {
|
|
|
7873
7901
|
showLoadMore: showLoadMore
|
|
7874
7902
|
});
|
|
7875
7903
|
});
|
|
7876
|
-
return /*#__PURE__*/
|
|
7904
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7877
7905
|
style: {
|
|
7878
7906
|
background: theme
|
|
7879
7907
|
},
|
|
7880
7908
|
className: "arrow-component " + _getClassName("container ".concat(textColor), _styleModuleImportMap$2)
|
|
7881
|
-
}, /*#__PURE__*/
|
|
7909
|
+
}, /*#__PURE__*/React__default["default"].createElement("h3", null, "Key Events"), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7882
7910
|
className: "key-events-m_cards-wrapper__3f8aB"
|
|
7883
|
-
}, keyEvents), showLoadMore && lastElement && /*#__PURE__*/
|
|
7911
|
+
}, keyEvents), showLoadMore && lastElement && /*#__PURE__*/React__default["default"].createElement(LoadmoreButton, {
|
|
7884
7912
|
onClick: onClick,
|
|
7885
7913
|
template: "SubsequentLoadCount",
|
|
7886
7914
|
config: config,
|
|
@@ -7888,9 +7916,9 @@ var KeyEventsBase = function KeyEventsBase(_ref) {
|
|
|
7888
7916
|
}));
|
|
7889
7917
|
};
|
|
7890
7918
|
KeyEventsBase.propTypes = {
|
|
7891
|
-
story:
|
|
7892
|
-
config:
|
|
7893
|
-
showLoadMore:
|
|
7919
|
+
story: PropTypes__default["default"].object,
|
|
7920
|
+
config: PropTypes__default["default"].object,
|
|
7921
|
+
showLoadMore: PropTypes__default["default"].bool
|
|
7894
7922
|
};
|
|
7895
7923
|
var KeyEvents = StateProvider(KeyEventsBase);
|
|
7896
7924
|
|
|
@@ -7931,12 +7959,12 @@ var StoryCollection = function StoryCollection(_ref) {
|
|
|
7931
7959
|
var isHorizontal = horizontal ? "horizontal-wrapper" : "";
|
|
7932
7960
|
var mountAt = get_1(config, ["mountAtPrefix"], "");
|
|
7933
7961
|
|
|
7934
|
-
var _useState = useState([]),
|
|
7962
|
+
var _useState = React.useState([]),
|
|
7935
7963
|
_useState2 = _slicedToArray(_useState, 2),
|
|
7936
7964
|
storyList = _useState2[0],
|
|
7937
7965
|
updateStoryList = _useState2[1];
|
|
7938
7966
|
|
|
7939
|
-
var _useState3 = useState([]),
|
|
7967
|
+
var _useState3 = React.useState([]),
|
|
7940
7968
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
7941
7969
|
collectionData = _useState4[0],
|
|
7942
7970
|
updateCollectionData = _useState4[1];
|
|
@@ -7970,59 +7998,59 @@ var StoryCollection = function StoryCollection(_ref) {
|
|
|
7970
7998
|
};
|
|
7971
7999
|
}();
|
|
7972
8000
|
|
|
7973
|
-
useEffect(function () {
|
|
8001
|
+
React.useEffect(function () {
|
|
7974
8002
|
if (collectionSlug) {
|
|
7975
8003
|
updateStoryListItems(collectionSlug);
|
|
7976
8004
|
}
|
|
7977
8005
|
}, [collectionSlug]);
|
|
7978
|
-
useEffect(function () {
|
|
8006
|
+
React.useEffect(function () {
|
|
7979
8007
|
if (!collectionSlug && data) {
|
|
7980
8008
|
var storyItems = data.items || data;
|
|
7981
8009
|
updateStoryList(storyItems);
|
|
7982
8010
|
}
|
|
7983
8011
|
}, [data, collectionSlug]);
|
|
7984
|
-
return /*#__PURE__*/
|
|
8012
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(CollectionName, {
|
|
7985
8013
|
customCollectionName: heading,
|
|
7986
8014
|
textColor: true,
|
|
7987
8015
|
collection: collectionData
|
|
7988
|
-
}), /*#__PURE__*/
|
|
8016
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7989
8017
|
className: "aside-collection-m_stories__9wfUs"
|
|
7990
8018
|
}, storyList && storyList.length > 0 ? storyList.slice(0, 4).map(function (item) {
|
|
7991
8019
|
var story = item.story || item;
|
|
7992
|
-
return /*#__PURE__*/
|
|
8020
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
7993
8021
|
className: "aside-collection-m_story__17Jdm",
|
|
7994
8022
|
key: story.id
|
|
7995
|
-
}, /*#__PURE__*/
|
|
8023
|
+
}, /*#__PURE__*/React__default["default"].createElement(StoryCard, {
|
|
7996
8024
|
story: story,
|
|
7997
8025
|
isHorizontal: true,
|
|
7998
8026
|
theme: theme,
|
|
7999
8027
|
config: config
|
|
8000
|
-
}, /*#__PURE__*/
|
|
8028
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8001
8029
|
className: "aside-collection-m_story-hero-image__13nFY"
|
|
8002
|
-
}, /*#__PURE__*/
|
|
8030
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeroImage, {
|
|
8003
8031
|
story: story,
|
|
8004
8032
|
aspectRatio: [[4, 3]]
|
|
8005
|
-
})), /*#__PURE__*/
|
|
8033
|
+
})), /*#__PURE__*/React__default["default"].createElement("div", null, isHorizontal && /*#__PURE__*/React__default["default"].createElement(SectionTag, {
|
|
8006
8034
|
story: story
|
|
8007
|
-
}), /*#__PURE__*/
|
|
8035
|
+
}), /*#__PURE__*/React__default["default"].createElement(Headline, {
|
|
8008
8036
|
story: story
|
|
8009
|
-
}), /*#__PURE__*/
|
|
8037
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8010
8038
|
className: "aside-collection-m_story-byline__37KRG"
|
|
8011
|
-
}, /*#__PURE__*/
|
|
8039
|
+
}, /*#__PURE__*/React__default["default"].createElement(AuthorWithTime, {
|
|
8012
8040
|
config: opts,
|
|
8013
8041
|
story: story
|
|
8014
8042
|
})))));
|
|
8015
|
-
}) : /*#__PURE__*/
|
|
8043
|
+
}) : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8016
8044
|
"data-test-id": "no-stories",
|
|
8017
8045
|
className: "aside-collection-m_info__3p4zt"
|
|
8018
8046
|
}, "No stories found.")));
|
|
8019
8047
|
};
|
|
8020
8048
|
StoryCollection.propTypes = {
|
|
8021
|
-
data:
|
|
8022
|
-
config:
|
|
8023
|
-
horizontal:
|
|
8024
|
-
slotData:
|
|
8025
|
-
opts:
|
|
8049
|
+
data: PropTypes__default["default"].oneOfType([PropTypes__default["default"].object, PropTypes__default["default"].array]),
|
|
8050
|
+
config: PropTypes__default["default"].object,
|
|
8051
|
+
horizontal: PropTypes__default["default"].bool,
|
|
8052
|
+
slotData: PropTypes__default["default"].object,
|
|
8053
|
+
opts: PropTypes__default["default"].object
|
|
8026
8054
|
};
|
|
8027
8055
|
var AsideCollectionBase = function AsideCollectionBase(_ref4) {
|
|
8028
8056
|
var _ref4$data = _ref4.data,
|
|
@@ -8049,14 +8077,14 @@ var AsideCollectionBase = function AsideCollectionBase(_ref4) {
|
|
|
8049
8077
|
var isHorizontal = horizontal ? "horizontal-wrapper" : "";
|
|
8050
8078
|
|
|
8051
8079
|
if (horizontal) {
|
|
8052
|
-
return /*#__PURE__*/
|
|
8080
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8053
8081
|
style: {
|
|
8054
8082
|
backgroundColor: theme
|
|
8055
8083
|
},
|
|
8056
8084
|
"data-test-id": "aside-collection",
|
|
8057
8085
|
id: "aside-collection-".concat(storyId),
|
|
8058
8086
|
className: "arrow-component arr--aside-collection " + _getClassName("wrapper ".concat(isHorizontal), _styleModuleImportMap$1)
|
|
8059
|
-
}, /*#__PURE__*/
|
|
8087
|
+
}, /*#__PURE__*/React__default["default"].createElement(StoryCollection, {
|
|
8060
8088
|
data: data,
|
|
8061
8089
|
horizontal: horizontal,
|
|
8062
8090
|
config: config,
|
|
@@ -8069,23 +8097,23 @@ var AsideCollectionBase = function AsideCollectionBase(_ref4) {
|
|
|
8069
8097
|
var asideSlot = function asideSlot(type, slot, index) {
|
|
8070
8098
|
switch (type) {
|
|
8071
8099
|
case "ad":
|
|
8072
|
-
return /*#__PURE__*/
|
|
8100
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8073
8101
|
className: "aside-collection-ad-slot aside-collection-m_ad-slot__28nE2"
|
|
8074
8102
|
}, adComponent(_objectSpread(_objectSpread({}, slot), {}, {
|
|
8075
8103
|
id: "ad-".concat(index, "_").concat(storyId)
|
|
8076
8104
|
})));
|
|
8077
8105
|
|
|
8078
8106
|
case "widget":
|
|
8079
|
-
return /*#__PURE__*/
|
|
8107
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8080
8108
|
className: "aside-collection-ad-slot aside-collection-m_ad-slot__28nE2"
|
|
8081
8109
|
}, widgetComp(_objectSpread(_objectSpread({}, slot), {}, {
|
|
8082
8110
|
id: "widget-".concat(index, "_").concat(storyId)
|
|
8083
8111
|
})));
|
|
8084
8112
|
|
|
8085
8113
|
case "collection":
|
|
8086
|
-
return /*#__PURE__*/
|
|
8114
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8087
8115
|
id: "aside-collection-".concat(index, "_").concat(storyId)
|
|
8088
|
-
}, /*#__PURE__*/
|
|
8116
|
+
}, /*#__PURE__*/React__default["default"].createElement(StoryCollection, {
|
|
8089
8117
|
slotData: slot,
|
|
8090
8118
|
data: data,
|
|
8091
8119
|
horizontal: horizontal,
|
|
@@ -8095,13 +8123,13 @@ var AsideCollectionBase = function AsideCollectionBase(_ref4) {
|
|
|
8095
8123
|
}
|
|
8096
8124
|
};
|
|
8097
8125
|
|
|
8098
|
-
return /*#__PURE__*/
|
|
8126
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8099
8127
|
style: {
|
|
8100
8128
|
backgroundColor: theme
|
|
8101
8129
|
},
|
|
8102
8130
|
"data-test-id": "aside-collection",
|
|
8103
8131
|
className: "arrow-component arr--aside-collection " + _getClassName(["wrapper", isHorizontal, isSticky].join(" "), _styleModuleImportMap$1)
|
|
8104
|
-
}, enableKeyEvents && /*#__PURE__*/
|
|
8132
|
+
}, enableKeyEvents && /*#__PURE__*/React__default["default"].createElement(KeyEvents, {
|
|
8105
8133
|
story: keyEventsData.story,
|
|
8106
8134
|
showLoadMore: keyEventsData.showLoadMore,
|
|
8107
8135
|
config: keyEventsData.config
|
|
@@ -8110,21 +8138,21 @@ var AsideCollectionBase = function AsideCollectionBase(_ref4) {
|
|
|
8110
8138
|
}));
|
|
8111
8139
|
};
|
|
8112
8140
|
AsideCollectionBase.propTypes = {
|
|
8113
|
-
data:
|
|
8114
|
-
config:
|
|
8115
|
-
opts:
|
|
8116
|
-
horizontal:
|
|
8117
|
-
slots:
|
|
8118
|
-
adComponent:
|
|
8119
|
-
widgetComp:
|
|
8120
|
-
sticky:
|
|
8121
|
-
keyEventsData:
|
|
8122
|
-
story:
|
|
8123
|
-
config:
|
|
8124
|
-
showLoadMore:
|
|
8141
|
+
data: PropTypes__default["default"].oneOfType([PropTypes__default["default"].object, PropTypes__default["default"].array]),
|
|
8142
|
+
config: PropTypes__default["default"].object,
|
|
8143
|
+
opts: PropTypes__default["default"].object,
|
|
8144
|
+
horizontal: PropTypes__default["default"].bool,
|
|
8145
|
+
slots: PropTypes__default["default"].array,
|
|
8146
|
+
adComponent: PropTypes__default["default"].func,
|
|
8147
|
+
widgetComp: PropTypes__default["default"].func,
|
|
8148
|
+
sticky: PropTypes__default["default"].bool,
|
|
8149
|
+
keyEventsData: PropTypes__default["default"].shape({
|
|
8150
|
+
story: PropTypes__default["default"].object,
|
|
8151
|
+
config: PropTypes__default["default"].object,
|
|
8152
|
+
showLoadMore: PropTypes__default["default"]["boolean"]
|
|
8125
8153
|
}),
|
|
8126
|
-
enableKeyEvents:
|
|
8127
|
-
storyId:
|
|
8154
|
+
enableKeyEvents: PropTypes__default["default"]["boolean"],
|
|
8155
|
+
storyId: PropTypes__default["default"].string
|
|
8128
8156
|
};
|
|
8129
8157
|
var AsideCollection = StateProvider(AsideCollectionBase);
|
|
8130
8158
|
|
|
@@ -8192,7 +8220,7 @@ var ListicleStoryTemplateBase = function ListicleStoryTemplateBase(_ref) {
|
|
|
8192
8220
|
storyBulletType = _story$bulletType === void 0 ? "" : _story$bulletType;
|
|
8193
8221
|
var storyId = get_1(story, ["id"], "");
|
|
8194
8222
|
var isNumberedBullet = storyBulletType !== "bullets";
|
|
8195
|
-
var timezone = useSelector(function (state) {
|
|
8223
|
+
var timezone = reactRedux.useSelector(function (state) {
|
|
8196
8224
|
return get_1(state, ["qt", "data", "timezone"], null);
|
|
8197
8225
|
}); // Content Blocks
|
|
8198
8226
|
|
|
@@ -8201,7 +8229,7 @@ var ListicleStoryTemplateBase = function ListicleStoryTemplateBase(_ref) {
|
|
|
8201
8229
|
widths = _settings$widths === void 0 ? [320, 480, 768, 1024, 1140] : _settings$widths,
|
|
8202
8230
|
_settings$aspectRatio = settings.aspectRatio,
|
|
8203
8231
|
aspectRatio = _settings$aspectRatio === void 0 ? [[16, 9]] : _settings$aspectRatio;
|
|
8204
|
-
return /*#__PURE__*/
|
|
8232
|
+
return /*#__PURE__*/React__default["default"].createElement(HeroImage, {
|
|
8205
8233
|
defaultWidth: 320,
|
|
8206
8234
|
story: story,
|
|
8207
8235
|
widths: widths,
|
|
@@ -8212,43 +8240,43 @@ var ListicleStoryTemplateBase = function ListicleStoryTemplateBase(_ref) {
|
|
|
8212
8240
|
};
|
|
8213
8241
|
|
|
8214
8242
|
var CaptionAttributionBlock = function CaptionAttributionBlock() {
|
|
8215
|
-
return /*#__PURE__*/
|
|
8243
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8216
8244
|
className: "listicle-story-m_caption-attribution-block__1HlXc"
|
|
8217
|
-
}, /*#__PURE__*/
|
|
8245
|
+
}, /*#__PURE__*/React__default["default"].createElement(CaptionAttribution, {
|
|
8218
8246
|
story: story
|
|
8219
8247
|
}));
|
|
8220
8248
|
};
|
|
8221
8249
|
|
|
8222
8250
|
var HeadlineBlock = function HeadlineBlock() {
|
|
8223
|
-
return /*#__PURE__*/
|
|
8251
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8224
8252
|
className: "listicle-story-m_headline-block__2zouc"
|
|
8225
|
-
}, /*#__PURE__*/
|
|
8253
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8226
8254
|
className: "listicle-story-m_section-tag__3U7ij"
|
|
8227
|
-
}, showSection && /*#__PURE__*/
|
|
8255
|
+
}, showSection && /*#__PURE__*/React__default["default"].createElement(SectionTag, _extends({
|
|
8228
8256
|
story: story
|
|
8229
|
-
}, sectionTagSettings))), /*#__PURE__*/
|
|
8257
|
+
}, sectionTagSettings))), /*#__PURE__*/React__default["default"].createElement(StoryHeadline, {
|
|
8230
8258
|
story: story,
|
|
8231
8259
|
premiumStoryIconConfig: premiumStoryIconConfig
|
|
8232
|
-
}), /*#__PURE__*/
|
|
8260
|
+
}), /*#__PURE__*/React__default["default"].createElement(Subheadline, {
|
|
8233
8261
|
story: story,
|
|
8234
8262
|
showFullContent: true
|
|
8235
8263
|
}));
|
|
8236
8264
|
};
|
|
8237
8265
|
|
|
8238
8266
|
var AuthourBlock = function AuthourBlock() {
|
|
8239
|
-
return /*#__PURE__*/
|
|
8267
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(AuthorCard, _extends({
|
|
8240
8268
|
story: story
|
|
8241
|
-
}, authorDetails)), /*#__PURE__*/
|
|
8269
|
+
}, authorDetails)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8242
8270
|
className: "listicle-story-m_timestamp-social-share__1QaP8"
|
|
8243
|
-
}, /*#__PURE__*/
|
|
8271
|
+
}, /*#__PURE__*/React__default["default"].createElement(PublishDetails, {
|
|
8244
8272
|
story: story,
|
|
8245
8273
|
opts: publishedDetails,
|
|
8246
8274
|
template: "story",
|
|
8247
8275
|
timezone: timezone
|
|
8248
|
-
}), /*#__PURE__*/
|
|
8276
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8249
8277
|
id: "story-share-".concat(storyId),
|
|
8250
8278
|
className: "content-style"
|
|
8251
|
-
}, /*#__PURE__*/
|
|
8279
|
+
}, /*#__PURE__*/React__default["default"].createElement(components.SocialShare, {
|
|
8252
8280
|
template: SocialShareTemplate,
|
|
8253
8281
|
theme: theme,
|
|
8254
8282
|
fullUrl: encodeURI(story.url),
|
|
@@ -8258,16 +8286,16 @@ var ListicleStoryTemplateBase = function ListicleStoryTemplateBase(_ref) {
|
|
|
8258
8286
|
};
|
|
8259
8287
|
|
|
8260
8288
|
var BodyBlock = function BodyBlock() {
|
|
8261
|
-
return /*#__PURE__*/
|
|
8289
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8262
8290
|
className: _getClassName("body-block ".concat(isNumberedBullet ? "numbered-bullet-style" : ""), _styleModuleImportMap)
|
|
8263
8291
|
}, visibledCards.map(function (card, index) {
|
|
8264
|
-
return /*#__PURE__*/
|
|
8292
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
|
|
8265
8293
|
key: card.id
|
|
8266
|
-
}, !isNumberedBullet ? /*#__PURE__*/
|
|
8294
|
+
}, !isNumberedBullet ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8267
8295
|
className: "listicle-story-m_bullet-style-dash__3w8Xk"
|
|
8268
|
-
}) : /*#__PURE__*/
|
|
8296
|
+
}) : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8269
8297
|
className: "listicle-story-m_bullet-style-number__Pu-qB"
|
|
8270
|
-
}, index + 1, "."), /*#__PURE__*/
|
|
8298
|
+
}, index + 1, "."), /*#__PURE__*/React__default["default"].createElement(StoryElementCard, {
|
|
8271
8299
|
story: story,
|
|
8272
8300
|
card: card,
|
|
8273
8301
|
key: card.id,
|
|
@@ -8275,11 +8303,11 @@ var ListicleStoryTemplateBase = function ListicleStoryTemplateBase(_ref) {
|
|
|
8275
8303
|
adComponent: adComponent,
|
|
8276
8304
|
widgetComp: widgetComp
|
|
8277
8305
|
}));
|
|
8278
|
-
}), firstChild, /*#__PURE__*/
|
|
8306
|
+
}), firstChild, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8279
8307
|
className: "listicle-story-m_story-tags__3wgXG"
|
|
8280
|
-
}, /*#__PURE__*/
|
|
8308
|
+
}, /*#__PURE__*/React__default["default"].createElement(StoryTags, {
|
|
8281
8309
|
tags: story.tags
|
|
8282
|
-
}), /*#__PURE__*/
|
|
8310
|
+
}), /*#__PURE__*/React__default["default"].createElement(SlotAfterStory, {
|
|
8283
8311
|
id: story.id,
|
|
8284
8312
|
element: story.customSlotAfterStory,
|
|
8285
8313
|
AdComponent: adComponent,
|
|
@@ -8288,7 +8316,7 @@ var ListicleStoryTemplateBase = function ListicleStoryTemplateBase(_ref) {
|
|
|
8288
8316
|
};
|
|
8289
8317
|
|
|
8290
8318
|
var SideColumnBlock = function SideColumnBlock() {
|
|
8291
|
-
return asideCollection && /*#__PURE__*/
|
|
8319
|
+
return asideCollection && /*#__PURE__*/React__default["default"].createElement(AsideCollection, _extends({}, asideCollection, {
|
|
8292
8320
|
adComponent: adComponent,
|
|
8293
8321
|
widgetComp: widgetComp,
|
|
8294
8322
|
sticky: true,
|
|
@@ -8299,123 +8327,123 @@ var ListicleStoryTemplateBase = function ListicleStoryTemplateBase(_ref) {
|
|
|
8299
8327
|
|
|
8300
8328
|
|
|
8301
8329
|
var DefaultTemplate = function DefaultTemplate() {
|
|
8302
|
-
return /*#__PURE__*/
|
|
8330
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(HeroImageBlock, {
|
|
8303
8331
|
aspectRatio: [[16, 9], [16, 6]]
|
|
8304
|
-
}), /*#__PURE__*/
|
|
8332
|
+
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8305
8333
|
className: "listicle-story-m_grid-container__3QPf4"
|
|
8306
|
-
}, /*#__PURE__*/
|
|
8334
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8307
8335
|
className: "listicle-story-m_full-grid__1JW4I"
|
|
8308
|
-
}, /*#__PURE__*/
|
|
8336
|
+
}, /*#__PURE__*/React__default["default"].createElement(CaptionAttributionBlock, null)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8309
8337
|
"data-type-column": "left",
|
|
8310
8338
|
className: "listicle-story-m_left-column__7wBoP"
|
|
8311
|
-
}, /*#__PURE__*/
|
|
8339
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeadlineBlock, null), /*#__PURE__*/React__default["default"].createElement(AuthourBlock, null), /*#__PURE__*/React__default["default"].createElement(BodyBlock, null)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8312
8340
|
"data-type-column": "right",
|
|
8313
8341
|
className: "listicle-story-m_right-column__mZg2Z"
|
|
8314
|
-
}, /*#__PURE__*/
|
|
8342
|
+
}, /*#__PURE__*/React__default["default"].createElement(SideColumnBlock, null))));
|
|
8315
8343
|
};
|
|
8316
8344
|
|
|
8317
8345
|
var HeroPriority = function HeroPriority() {
|
|
8318
|
-
return /*#__PURE__*/
|
|
8346
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8319
8347
|
className: "listicle-story-m_hero-priority-template__1D9lF"
|
|
8320
|
-
}, /*#__PURE__*/
|
|
8348
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8321
8349
|
className: "listicle-story-m_grid-container__3QPf4"
|
|
8322
|
-
}, /*#__PURE__*/
|
|
8350
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8323
8351
|
className: "listicle-story-m_full-grid__1JW4I"
|
|
8324
|
-
}, /*#__PURE__*/
|
|
8352
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeroImageBlock, null)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8325
8353
|
className: "listicle-story-m_center-column__2JfyN"
|
|
8326
|
-
}, /*#__PURE__*/
|
|
8354
|
+
}, /*#__PURE__*/React__default["default"].createElement(CaptionAttributionBlock, null), /*#__PURE__*/React__default["default"].createElement(HeadlineBlock, null), /*#__PURE__*/React__default["default"].createElement(AuthourBlock, null), /*#__PURE__*/React__default["default"].createElement(BodyBlock, null))));
|
|
8327
8355
|
};
|
|
8328
8356
|
|
|
8329
8357
|
var HeadlinePriority = function HeadlinePriority() {
|
|
8330
|
-
return /*#__PURE__*/
|
|
8358
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8331
8359
|
className: "listicle-story-m_headline-priority-template__2Dkhi"
|
|
8332
|
-
}, /*#__PURE__*/
|
|
8360
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8333
8361
|
className: "listicle-story-m_grid-container__3QPf4"
|
|
8334
|
-
}, /*#__PURE__*/
|
|
8362
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8335
8363
|
className: "listicle-story-m_headline-priority-grid__1KLB7"
|
|
8336
|
-
}, /*#__PURE__*/
|
|
8364
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeadlineBlock, null)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8337
8365
|
className: "listicle-story-m_left-column__7wBoP"
|
|
8338
|
-
}, /*#__PURE__*/
|
|
8366
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeroImageBlock, null), /*#__PURE__*/React__default["default"].createElement(CaptionAttributionBlock, null), /*#__PURE__*/React__default["default"].createElement(AuthourBlock, null), /*#__PURE__*/React__default["default"].createElement(BodyBlock, null)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8339
8367
|
className: "listicle-story-m_right-column__mZg2Z"
|
|
8340
|
-
}, /*#__PURE__*/
|
|
8368
|
+
}, /*#__PURE__*/React__default["default"].createElement(SideColumnBlock, null))));
|
|
8341
8369
|
};
|
|
8342
8370
|
|
|
8343
8371
|
var HeadlineHeroPriority = function HeadlineHeroPriority() {
|
|
8344
|
-
return /*#__PURE__*/
|
|
8372
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8345
8373
|
className: "listicle-story-m_headline-hero-priority-template__3ZEnh"
|
|
8346
|
-
}, /*#__PURE__*/
|
|
8374
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8347
8375
|
className: "listicle-story-m_grid-container__3QPf4"
|
|
8348
|
-
}, /*#__PURE__*/
|
|
8376
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8349
8377
|
className: "listicle-story-m_center-column__2JfyN"
|
|
8350
|
-
}, /*#__PURE__*/
|
|
8378
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeadlineBlock, null)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8351
8379
|
className: "listicle-story-m_full-grid__1JW4I"
|
|
8352
|
-
}, /*#__PURE__*/
|
|
8380
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeroImageBlock, null)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8353
8381
|
className: "listicle-story-m_center-column__2JfyN"
|
|
8354
|
-
}, /*#__PURE__*/
|
|
8382
|
+
}, /*#__PURE__*/React__default["default"].createElement(CaptionAttributionBlock, null), /*#__PURE__*/React__default["default"].createElement(AuthourBlock, null), /*#__PURE__*/React__default["default"].createElement(BodyBlock, null))));
|
|
8355
8383
|
};
|
|
8356
8384
|
|
|
8357
8385
|
var HeroOverlay = function HeroOverlay() {
|
|
8358
|
-
return /*#__PURE__*/
|
|
8386
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8359
8387
|
className: "listicle-story-m_hero-overlay-template__SeVui"
|
|
8360
|
-
}, /*#__PURE__*/
|
|
8388
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8361
8389
|
className: "listicle-story-m_grid-container__3QPf4"
|
|
8362
|
-
}, /*#__PURE__*/
|
|
8390
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8363
8391
|
className: "listicle-story-m_full-grid__1JW4I listicle-story-m_hero-faded-relative__3yRRc"
|
|
8364
|
-
}, /*#__PURE__*/
|
|
8392
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8365
8393
|
className: "listicle-story-m_hero-faded-wrapper__1ydbl"
|
|
8366
|
-
}, /*#__PURE__*/
|
|
8394
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8367
8395
|
className: "listicle-story-m_headline-content-holder__14Z-H"
|
|
8368
|
-
}, /*#__PURE__*/
|
|
8396
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeadlineBlock, null))), /*#__PURE__*/React__default["default"].createElement(HeroImageBlock, {
|
|
8369
8397
|
aspectRatio: [[2, 3], [16, 9]]
|
|
8370
|
-
}))), /*#__PURE__*/
|
|
8398
|
+
}))), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8371
8399
|
className: "listicle-story-m_grid-container__3QPf4"
|
|
8372
|
-
}, /*#__PURE__*/
|
|
8400
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8373
8401
|
className: "listicle-story-m_center-column__2JfyN"
|
|
8374
|
-
}, /*#__PURE__*/
|
|
8402
|
+
}, /*#__PURE__*/React__default["default"].createElement(CaptionAttributionBlock, null), /*#__PURE__*/React__default["default"].createElement(AuthourBlock, null), /*#__PURE__*/React__default["default"].createElement(BodyBlock, null))));
|
|
8375
8403
|
};
|
|
8376
8404
|
|
|
8377
8405
|
var HeadlineSideway = function HeadlineSideway() {
|
|
8378
|
-
return /*#__PURE__*/
|
|
8406
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8379
8407
|
className: "listicle-story-m_headline-sideway-template__1kjin"
|
|
8380
|
-
}, /*#__PURE__*/
|
|
8408
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8381
8409
|
className: "listicle-story-m_sideway-grid__1_W8y"
|
|
8382
|
-
}, /*#__PURE__*/
|
|
8410
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8383
8411
|
className: "listicle-story-m_sideway-headline__3zISp"
|
|
8384
|
-
}, /*#__PURE__*/
|
|
8412
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeadlineBlock, null)), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8385
8413
|
className: "listicle-story-m_sideway-hero__358H3"
|
|
8386
|
-
}, /*#__PURE__*/
|
|
8414
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeroImageBlock, {
|
|
8387
8415
|
aspectRatio: [[16, 9], [4, 3]]
|
|
8388
|
-
}), /*#__PURE__*/
|
|
8416
|
+
}), /*#__PURE__*/React__default["default"].createElement(CaptionAttributionBlock, null))), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8389
8417
|
className: "listicle-story-m_grid-container__3QPf4"
|
|
8390
|
-
}, /*#__PURE__*/
|
|
8418
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8391
8419
|
className: "listicle-story-m_center-column__2JfyN"
|
|
8392
|
-
}, /*#__PURE__*/
|
|
8420
|
+
}, /*#__PURE__*/React__default["default"].createElement(AuthourBlock, null), /*#__PURE__*/React__default["default"].createElement(BodyBlock, null))));
|
|
8393
8421
|
};
|
|
8394
8422
|
|
|
8395
8423
|
var renderTemplate = function renderTemplate() {
|
|
8396
8424
|
switch (templateType) {
|
|
8397
8425
|
case "hero-priority":
|
|
8398
|
-
return /*#__PURE__*/
|
|
8426
|
+
return /*#__PURE__*/React__default["default"].createElement(HeroPriority, null);
|
|
8399
8427
|
|
|
8400
8428
|
case "headline-priority":
|
|
8401
|
-
return /*#__PURE__*/
|
|
8429
|
+
return /*#__PURE__*/React__default["default"].createElement(HeadlinePriority, null);
|
|
8402
8430
|
|
|
8403
8431
|
case "headline-hero-priority":
|
|
8404
|
-
return /*#__PURE__*/
|
|
8432
|
+
return /*#__PURE__*/React__default["default"].createElement(HeadlineHeroPriority, null);
|
|
8405
8433
|
|
|
8406
8434
|
case "hero-overlay":
|
|
8407
|
-
return /*#__PURE__*/
|
|
8435
|
+
return /*#__PURE__*/React__default["default"].createElement(HeroOverlay, null);
|
|
8408
8436
|
|
|
8409
8437
|
case "headline-sideway":
|
|
8410
|
-
return /*#__PURE__*/
|
|
8438
|
+
return /*#__PURE__*/React__default["default"].createElement(HeadlineSideway, null);
|
|
8411
8439
|
|
|
8412
8440
|
default:
|
|
8413
|
-
return /*#__PURE__*/
|
|
8441
|
+
return /*#__PURE__*/React__default["default"].createElement(DefaultTemplate, null);
|
|
8414
8442
|
}
|
|
8415
8443
|
};
|
|
8416
8444
|
|
|
8417
8445
|
var dataTestId = templateType ? "listicle-story-".concat(templateType) : "listicle-story";
|
|
8418
|
-
return /*#__PURE__*/
|
|
8446
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
8419
8447
|
"data-test-id": dataTestId,
|
|
8420
8448
|
className: "arrow-component arr--content-wrapper arr--listicle-story-template-wrapper",
|
|
8421
8449
|
style: {
|
|
@@ -8424,19 +8452,20 @@ var ListicleStoryTemplateBase = function ListicleStoryTemplateBase(_ref) {
|
|
|
8424
8452
|
}, renderTemplate());
|
|
8425
8453
|
};
|
|
8426
8454
|
ListicleStoryTemplateBase.propTypes = {
|
|
8427
|
-
story:
|
|
8428
|
-
config:
|
|
8429
|
-
templateType:
|
|
8430
|
-
authorCard:
|
|
8431
|
-
asideCollection:
|
|
8455
|
+
story: PropTypes__default["default"].object,
|
|
8456
|
+
config: PropTypes__default["default"].shape({
|
|
8457
|
+
templateType: PropTypes__default["default"].string,
|
|
8458
|
+
authorCard: PropTypes__default["default"].object,
|
|
8459
|
+
asideCollection: PropTypes__default["default"].object
|
|
8432
8460
|
}),
|
|
8433
|
-
firstChild:
|
|
8434
|
-
secondChild:
|
|
8435
|
-
storyElementsConfig:
|
|
8436
|
-
adComponent:
|
|
8437
|
-
widgetComp:
|
|
8438
|
-
premiumStoryIconConfig:
|
|
8461
|
+
firstChild: PropTypes__default["default"].node,
|
|
8462
|
+
secondChild: PropTypes__default["default"].node,
|
|
8463
|
+
storyElementsConfig: PropTypes__default["default"].object,
|
|
8464
|
+
adComponent: PropTypes__default["default"].func,
|
|
8465
|
+
widgetComp: PropTypes__default["default"].func,
|
|
8466
|
+
premiumStoryIconConfig: PropTypes__default["default"].object
|
|
8439
8467
|
};
|
|
8440
8468
|
var ListicleStoryTemplate = StateProvider(ListicleStoryTemplateBase);
|
|
8441
8469
|
|
|
8442
|
-
|
|
8470
|
+
exports.ListicleStoryTemplate = ListicleStoryTemplate;
|
|
8471
|
+
exports.ListicleStoryTemplateBase = ListicleStoryTemplateBase;
|