@quintype/arrow 3.15.1-perf.0 → 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-4577d5b9.js → index-3976fac4.js} +62 -55
- package/atoms/ExtendedLoadMore/{index-0edaa434.js → index-3c4ac692.js} +243 -208
- package/atoms/ExtendedLoadMore/index-4ddfe28d.js +93 -0
- package/atoms/ExtendedLoadMore/{index-70ce7471.js → index-5c8eda4a.js} +88 -80
- package/atoms/ExtendedLoadMore/{index-b3ef1488.js → index-6e083738.js} +63 -56
- package/atoms/ExtendedLoadMore/{index-48664b07.js → index-6ecceae4.js} +61 -54
- package/atoms/ExtendedLoadMore/{index-4c3c2b6f.js → index-9e0d32b7.js} +79 -72
- package/atoms/ExtendedLoadMore/{index-c47ff5bc.js → index-a5c95f84.js} +73 -66
- package/atoms/ExtendedLoadMore/{index-4b9207c4.js → index-b22f1843.js} +70 -62
- package/atoms/ExtendedLoadMore/{index-8f6483ba.js → index-b5936059.js} +75 -68
- package/atoms/ExtendedLoadMore/{index-b841407e.js → index-bc129cb8.js} +60 -53
- package/atoms/ExtendedLoadMore/{index-d08b6c2f.js → index-e7cde739.js} +74 -46
- package/atoms/ExtendedLoadMore/{index-867b9437.js → index-fee73a14.js} +67 -61
- 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 +75 -66
- 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 +349 -339
- package/rows/AsideCollection/index.js +346 -340
- package/rows/AstrologyCollection/index.js +325 -315
- package/rows/AuthorIntroductionCard/index.js +157 -150
- package/rows/AuthorsList/index.js +187 -180
- package/rows/CollectionFilter/index.js +365 -355
- package/rows/ElevenStories/index.js +360 -351
- package/rows/FourColFiveStories/index.js +308 -279
- package/rows/FourColGrid/index.js +355 -326
- package/rows/FourColPortraitStories/index.js +364 -336
- package/rows/FourColSixteenStories/index.js +291 -281
- package/rows/FourColTwelveStories/index.js +318 -308
- package/rows/FourStorySlider/index.js +362 -352
- package/rows/FourStorySliderPortrait/index.js +363 -353
- package/rows/FourTabbedBigStorySlider/index.js +325 -314
- package/rows/FullScreenSlider/index.js +339 -330
- package/rows/HalfScreenSlider/index.js +311 -302
- package/rows/ListComponent/index.js +325 -315
- package/rows/Listicles/index.js +154 -145
- package/rows/MagazineEditions/index.js +107 -98
- package/rows/MagazineHeaderCard/index.js +107 -98
- package/rows/MagazineWidget/index.js +329 -320
- package/rows/OneColStoryList/index.js +369 -340
- package/rows/OpinionCollection/index.js +254 -225
- package/rows/SixColSixStories/index.js +337 -308
- package/rows/StoryCollection/index.js +346 -340
- package/rows/TagIntroductionCard/index.js +30 -23
- package/rows/ThreeColFlexStories/index.js +352 -323
- package/rows/ThreeColFourteenStories/index.js +288 -278
- package/rows/ThreeColGrid/index.js +356 -327
- package/rows/ThreeColSevenStory/index.js +325 -316
- package/rows/ThreeColSixStories/index.js +326 -316
- package/rows/ThreeColTwelveStories/index.js +305 -295
- package/rows/TwoColFourStories/index.js +319 -308
- package/rows/TwoColFourStoryHighlight/index.js +320 -309
- package/rows/TwoColSevenStories/index.js +326 -315
- package/rows/TwoColSixStories/index.js +319 -310
- package/rows/TwoColTenStoriesSidebar/index.js +341 -330
- package/rows/TwoColThreeStories/index.js +319 -308
- 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/{rows → story-templates}/ListicleStoryTemplate/index.js +947 -926
- package/{rows → story-templates}/ListicleStoryTemplate/styles.arrow.css +0 -0
- package/{rows → story-templates}/LiveBlogStoryTemplate/index.js +952 -931
- package/{rows → story-templates}/LiveBlogStoryTemplate/styles.arrow.css +0 -0
- package/{rows → story-templates}/PhotoStoryTemplate/index.js +922 -901
- package/{rows → story-templates}/PhotoStoryTemplate/styles.arrow.css +0 -0
- package/{rows → story-templates}/TextStoryTemplate/index.js +941 -920
- package/{rows → story-templates}/TextStoryTemplate/styles.arrow.css +0 -0
- package/{rows → story-templates}/VideoStoryTemplate/index.js +907 -886
- package/{rows → story-templates}/VideoStoryTemplate/styles.arrow.css +0 -0
- package/atoms/ExtendedLoadMore/index-96c36b0e.js +0 -86
package/atoms/Author/index.js
CHANGED
|
@@ -1,9 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var PropTypes = require('prop-types');
|
|
7
|
+
var components = require('@quintype/components');
|
|
8
|
+
require('react-timeago');
|
|
9
|
+
require('date-fns-tz');
|
|
10
|
+
var reactRedux = require('react-redux');
|
|
11
|
+
|
|
12
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
13
|
+
|
|
14
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
15
|
+
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
7
16
|
|
|
8
17
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
9
18
|
|
|
@@ -1344,9 +1353,9 @@ function get(object, path, defaultValue) {
|
|
|
1344
1353
|
|
|
1345
1354
|
var get_1 = get;
|
|
1346
1355
|
|
|
1347
|
-
var StateContext = /*#__PURE__*/createContext(); // eslint-disable-next-line react/display-name
|
|
1356
|
+
var StateContext = /*#__PURE__*/React.createContext(); // eslint-disable-next-line react/display-name
|
|
1348
1357
|
var useStateValue = function useStateValue() {
|
|
1349
|
-
return useContext(StateContext);
|
|
1358
|
+
return React.useContext(StateContext);
|
|
1350
1359
|
};
|
|
1351
1360
|
|
|
1352
1361
|
/**
|
|
@@ -2135,15 +2144,15 @@ var getTextColor = function getTextColor() {
|
|
|
2135
2144
|
var textColor = getLuminanceOfColor(getHexValue) < 155 ? "light" : "dark";
|
|
2136
2145
|
return textColor;
|
|
2137
2146
|
};
|
|
2138
|
-
|
|
2139
|
-
"sketches-host":
|
|
2140
|
-
"cdn-name":
|
|
2141
|
-
"cdn-image":
|
|
2147
|
+
PropTypes__default["default"].shape({
|
|
2148
|
+
"sketches-host": PropTypes__default["default"].string,
|
|
2149
|
+
"cdn-name": PropTypes__default["default"].string,
|
|
2150
|
+
"cdn-image": PropTypes__default["default"].string
|
|
2142
2151
|
});
|
|
2143
|
-
|
|
2144
|
-
headline:
|
|
2145
|
-
"last-published-at":
|
|
2146
|
-
subheadline:
|
|
2152
|
+
PropTypes__default["default"].shape({
|
|
2153
|
+
headline: PropTypes__default["default"].string,
|
|
2154
|
+
"last-published-at": PropTypes__default["default"].number,
|
|
2155
|
+
subheadline: PropTypes__default["default"].string
|
|
2147
2156
|
});
|
|
2148
2157
|
|
|
2149
2158
|
var _styleModuleImportMap = {
|
|
@@ -2186,10 +2195,10 @@ var AuthorBase = function AuthorBase(_ref) {
|
|
|
2186
2195
|
return null;
|
|
2187
2196
|
}
|
|
2188
2197
|
|
|
2189
|
-
return /*#__PURE__*/
|
|
2198
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2190
2199
|
"data-test-id": "author-image",
|
|
2191
2200
|
className: _getClassName("author-image ".concat(dir, "-image"), _styleModuleImportMap)
|
|
2192
|
-
}, /*#__PURE__*/
|
|
2201
|
+
}, /*#__PURE__*/React__default["default"].createElement("figure", null, avatarS3Key ? /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
|
|
2193
2202
|
slug: avatarS3Key,
|
|
2194
2203
|
"aspect-ratio": [1, 1],
|
|
2195
2204
|
defaultWidth: 400,
|
|
@@ -2197,14 +2206,14 @@ var AuthorBase = function AuthorBase(_ref) {
|
|
|
2197
2206
|
auto: ["format", "compress"]
|
|
2198
2207
|
},
|
|
2199
2208
|
alt: authorName
|
|
2200
|
-
}) : /*#__PURE__*/
|
|
2209
|
+
}) : /*#__PURE__*/React__default["default"].createElement("img", {
|
|
2201
2210
|
src: avatarUrl
|
|
2202
2211
|
})));
|
|
2203
2212
|
};
|
|
2204
2213
|
|
|
2205
2214
|
var isPrefix = function isPrefix(dir) {
|
|
2206
2215
|
if (prefix) {
|
|
2207
|
-
return /*#__PURE__*/
|
|
2216
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2208
2217
|
className: "arr-author-prefix " + _getClassName("prefix ".concat(textColor), _styleModuleImportMap)
|
|
2209
2218
|
}, prefix);
|
|
2210
2219
|
}
|
|
@@ -2212,11 +2221,11 @@ var AuthorBase = function AuthorBase(_ref) {
|
|
|
2212
2221
|
return !hideAuthorImage && authorImage(dir);
|
|
2213
2222
|
};
|
|
2214
2223
|
|
|
2215
|
-
return /*#__PURE__*/
|
|
2224
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isAuthor && /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
2216
2225
|
href: "".concat(mountAt, "/author/") + slug,
|
|
2217
2226
|
"aria-label": "author-name",
|
|
2218
2227
|
className: "author-name arr-author-name arrow-component " + _getClassName("author ".concat(isBottomClasses), _styleModuleImportMap)
|
|
2219
|
-
}, isPrefix("ltr"), /*#__PURE__*/
|
|
2228
|
+
}, isPrefix("ltr"), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2220
2229
|
"data-test-id": "author-name",
|
|
2221
2230
|
className: "author-name " + _getClassName("author-name ".concat(textColor), _styleModuleImportMap)
|
|
2222
2231
|
}, authorName || story["author-name"]), !prefix && isPrefix("rtl")));
|
|
@@ -2228,18 +2237,18 @@ function mapStateToProps(state) {
|
|
|
2228
2237
|
};
|
|
2229
2238
|
}
|
|
2230
2239
|
|
|
2231
|
-
var Author = connect(mapStateToProps)(AuthorBase);
|
|
2240
|
+
var Author = reactRedux.connect(mapStateToProps)(AuthorBase);
|
|
2232
2241
|
AuthorBase.propTypes = {
|
|
2233
2242
|
/** The Story Object from the API response */
|
|
2234
|
-
story:
|
|
2243
|
+
story: PropTypes__default["default"].object.isRequired,
|
|
2235
2244
|
|
|
2236
2245
|
/** Hide Author Avatar Image */
|
|
2237
|
-
hideAuthorImage:
|
|
2246
|
+
hideAuthorImage: PropTypes__default["default"].bool,
|
|
2238
2247
|
// fix Author bottom of the storyCard
|
|
2239
|
-
isBottom:
|
|
2248
|
+
isBottom: PropTypes__default["default"].bool,
|
|
2240
2249
|
// fix prefix before the author name
|
|
2241
|
-
prefix:
|
|
2242
|
-
config:
|
|
2250
|
+
prefix: PropTypes__default["default"].string,
|
|
2251
|
+
config: PropTypes__default["default"].object
|
|
2243
2252
|
};
|
|
2244
2253
|
AuthorBase.defaultProps = {
|
|
2245
2254
|
hideAuthorImage: false,
|
|
@@ -2247,4 +2256,4 @@ AuthorBase.defaultProps = {
|
|
|
2247
2256
|
prefix: ""
|
|
2248
2257
|
};
|
|
2249
2258
|
|
|
2250
|
-
|
|
2259
|
+
exports.Author = Author;
|
|
@@ -1,9 +1,19 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var PropTypes = require('prop-types');
|
|
7
|
+
var Timeago = require('react-timeago');
|
|
8
|
+
var dateFnsTz = require('date-fns-tz');
|
|
9
|
+
var components = require('@quintype/components');
|
|
10
|
+
var reactRedux = require('react-redux');
|
|
11
|
+
|
|
12
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
13
|
+
|
|
14
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
15
|
+
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
16
|
+
var Timeago__default = /*#__PURE__*/_interopDefaultLegacy(Timeago);
|
|
7
17
|
|
|
8
18
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
9
19
|
|
|
@@ -1344,9 +1354,9 @@ function get(object, path, defaultValue) {
|
|
|
1344
1354
|
|
|
1345
1355
|
var get_1 = get;
|
|
1346
1356
|
|
|
1347
|
-
var StateContext = /*#__PURE__*/createContext(); // eslint-disable-next-line react/display-name
|
|
1357
|
+
var StateContext = /*#__PURE__*/React.createContext(); // eslint-disable-next-line react/display-name
|
|
1348
1358
|
var useStateValue = function useStateValue() {
|
|
1349
|
-
return useContext(StateContext);
|
|
1359
|
+
return React.useContext(StateContext);
|
|
1350
1360
|
};
|
|
1351
1361
|
|
|
1352
1362
|
/**
|
|
@@ -2593,15 +2603,15 @@ var getTextColor = function getTextColor() {
|
|
|
2593
2603
|
var textColor = getLuminanceOfColor(getHexValue) < 155 ? "light" : "dark";
|
|
2594
2604
|
return textColor;
|
|
2595
2605
|
};
|
|
2596
|
-
|
|
2597
|
-
"sketches-host":
|
|
2598
|
-
"cdn-name":
|
|
2599
|
-
"cdn-image":
|
|
2606
|
+
PropTypes__default["default"].shape({
|
|
2607
|
+
"sketches-host": PropTypes__default["default"].string,
|
|
2608
|
+
"cdn-name": PropTypes__default["default"].string,
|
|
2609
|
+
"cdn-image": PropTypes__default["default"].string
|
|
2600
2610
|
});
|
|
2601
|
-
|
|
2602
|
-
headline:
|
|
2603
|
-
"last-published-at":
|
|
2604
|
-
subheadline:
|
|
2611
|
+
PropTypes__default["default"].shape({
|
|
2612
|
+
headline: PropTypes__default["default"].string,
|
|
2613
|
+
"last-published-at": PropTypes__default["default"].number,
|
|
2614
|
+
subheadline: PropTypes__default["default"].string
|
|
2605
2615
|
});
|
|
2606
2616
|
var getTimeStamp = function getTimeStamp(date, _formatter) {
|
|
2607
2617
|
var config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
@@ -2609,17 +2619,17 @@ var getTimeStamp = function getTimeStamp(date, _formatter) {
|
|
|
2609
2619
|
var timezone = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
|
|
2610
2620
|
|
|
2611
2621
|
if (timezone && template === "story") {
|
|
2612
|
-
var zonedTime = timezone && utcToZonedTime(date, timezone);
|
|
2613
|
-
var formatZonedTime = zonedTime && format(zonedTime, "yyyy-MM-dd'T'HH:mm:ssXXX", {
|
|
2622
|
+
var zonedTime = timezone && dateFnsTz.utcToZonedTime(date, timezone);
|
|
2623
|
+
var formatZonedTime = zonedTime && dateFnsTz.format(zonedTime, "yyyy-MM-dd'T'HH:mm:ssXXX", {
|
|
2614
2624
|
timeZone: timezone
|
|
2615
2625
|
});
|
|
2616
2626
|
var timeStamp = timestampToFormat("", "", "", date, config);
|
|
2617
|
-
return /*#__PURE__*/
|
|
2627
|
+
return /*#__PURE__*/React__default["default"].createElement("time", {
|
|
2618
2628
|
dateTime: formatZonedTime
|
|
2619
2629
|
}, timeStamp);
|
|
2620
2630
|
}
|
|
2621
2631
|
|
|
2622
|
-
return /*#__PURE__*/
|
|
2632
|
+
return /*#__PURE__*/React__default["default"].createElement(Timeago__default["default"], {
|
|
2623
2633
|
date: date,
|
|
2624
2634
|
formatter: function formatter(value, unit, suffix, date) {
|
|
2625
2635
|
return _formatter(value, unit, suffix, date, config);
|
|
@@ -2646,18 +2656,18 @@ var TimeStamp = function TimeStamp(_ref) {
|
|
|
2646
2656
|
var time = story["last-published-at"] || story["first-published-at"];
|
|
2647
2657
|
var isBottomClasses = isBottom ? "bottom-fix" : "";
|
|
2648
2658
|
var textColor = getTextColor(configState.theme);
|
|
2649
|
-
return /*#__PURE__*/
|
|
2659
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isTime && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2650
2660
|
"data-test-id": "publish-time",
|
|
2651
2661
|
className: "time arr--publish-time " + _getClassName("time ".concat(textColor, " ").concat(isBottomClasses), _styleModuleImportMap$5)
|
|
2652
|
-
}, /*#__PURE__*/
|
|
2662
|
+
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2653
2663
|
className: "timestamp-m_time-wrapper__3O2lM"
|
|
2654
2664
|
}, getTimeStamp(time, formatter, config))));
|
|
2655
2665
|
};
|
|
2656
2666
|
TimeStamp.propTypes = {
|
|
2657
2667
|
/** The Story Object from the API response */
|
|
2658
|
-
story:
|
|
2659
|
-
isBottom:
|
|
2660
|
-
config:
|
|
2668
|
+
story: PropTypes__default["default"].object,
|
|
2669
|
+
isBottom: PropTypes__default["default"].bool,
|
|
2670
|
+
config: PropTypes__default["default"].object
|
|
2661
2671
|
};
|
|
2662
2672
|
|
|
2663
2673
|
var _styleModuleImportMap$4 = {
|
|
@@ -2700,10 +2710,10 @@ var AuthorBase = function AuthorBase(_ref) {
|
|
|
2700
2710
|
return null;
|
|
2701
2711
|
}
|
|
2702
2712
|
|
|
2703
|
-
return /*#__PURE__*/
|
|
2713
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2704
2714
|
"data-test-id": "author-image",
|
|
2705
2715
|
className: _getClassName("author-image ".concat(dir, "-image"), _styleModuleImportMap$4)
|
|
2706
|
-
}, /*#__PURE__*/
|
|
2716
|
+
}, /*#__PURE__*/React__default["default"].createElement("figure", null, avatarS3Key ? /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
|
|
2707
2717
|
slug: avatarS3Key,
|
|
2708
2718
|
"aspect-ratio": [1, 1],
|
|
2709
2719
|
defaultWidth: 400,
|
|
@@ -2711,14 +2721,14 @@ var AuthorBase = function AuthorBase(_ref) {
|
|
|
2711
2721
|
auto: ["format", "compress"]
|
|
2712
2722
|
},
|
|
2713
2723
|
alt: authorName
|
|
2714
|
-
}) : /*#__PURE__*/
|
|
2724
|
+
}) : /*#__PURE__*/React__default["default"].createElement("img", {
|
|
2715
2725
|
src: avatarUrl
|
|
2716
2726
|
})));
|
|
2717
2727
|
};
|
|
2718
2728
|
|
|
2719
2729
|
var isPrefix = function isPrefix(dir) {
|
|
2720
2730
|
if (prefix) {
|
|
2721
|
-
return /*#__PURE__*/
|
|
2731
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2722
2732
|
className: "arr-author-prefix " + _getClassName("prefix ".concat(textColor), _styleModuleImportMap$4)
|
|
2723
2733
|
}, prefix);
|
|
2724
2734
|
}
|
|
@@ -2726,11 +2736,11 @@ var AuthorBase = function AuthorBase(_ref) {
|
|
|
2726
2736
|
return !hideAuthorImage && authorImage(dir);
|
|
2727
2737
|
};
|
|
2728
2738
|
|
|
2729
|
-
return /*#__PURE__*/
|
|
2739
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isAuthor && /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
2730
2740
|
href: "".concat(mountAt, "/author/") + slug,
|
|
2731
2741
|
"aria-label": "author-name",
|
|
2732
2742
|
className: "author-name arr-author-name arrow-component " + _getClassName("author ".concat(isBottomClasses), _styleModuleImportMap$4)
|
|
2733
|
-
}, isPrefix("ltr"), /*#__PURE__*/
|
|
2743
|
+
}, isPrefix("ltr"), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2734
2744
|
"data-test-id": "author-name",
|
|
2735
2745
|
className: "author-name " + _getClassName("author-name ".concat(textColor), _styleModuleImportMap$4)
|
|
2736
2746
|
}, authorName || story["author-name"]), !prefix && isPrefix("rtl")));
|
|
@@ -2742,18 +2752,18 @@ function mapStateToProps(state) {
|
|
|
2742
2752
|
};
|
|
2743
2753
|
}
|
|
2744
2754
|
|
|
2745
|
-
var Author = connect(mapStateToProps)(AuthorBase);
|
|
2755
|
+
var Author = reactRedux.connect(mapStateToProps)(AuthorBase);
|
|
2746
2756
|
AuthorBase.propTypes = {
|
|
2747
2757
|
/** The Story Object from the API response */
|
|
2748
|
-
story:
|
|
2758
|
+
story: PropTypes__default["default"].object.isRequired,
|
|
2749
2759
|
|
|
2750
2760
|
/** Hide Author Avatar Image */
|
|
2751
|
-
hideAuthorImage:
|
|
2761
|
+
hideAuthorImage: PropTypes__default["default"].bool,
|
|
2752
2762
|
// fix Author bottom of the storyCard
|
|
2753
|
-
isBottom:
|
|
2763
|
+
isBottom: PropTypes__default["default"].bool,
|
|
2754
2764
|
// fix prefix before the author name
|
|
2755
|
-
prefix:
|
|
2756
|
-
config:
|
|
2765
|
+
prefix: PropTypes__default["default"].string,
|
|
2766
|
+
config: PropTypes__default["default"].object
|
|
2757
2767
|
};
|
|
2758
2768
|
AuthorBase.defaultProps = {
|
|
2759
2769
|
hideAuthorImage: false,
|
|
@@ -2774,14 +2784,14 @@ var Dot = function Dot(_ref) {
|
|
|
2774
2784
|
height = _ref$height === void 0 ? "3px" : _ref$height,
|
|
2775
2785
|
_ref$color = _ref.color,
|
|
2776
2786
|
color = _ref$color === void 0 ? "light" : _ref$color;
|
|
2777
|
-
return /*#__PURE__*/
|
|
2787
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2778
2788
|
className: _getClassName(color, _styleModuleImportMap$3)
|
|
2779
|
-
}, /*#__PURE__*/
|
|
2789
|
+
}, /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
2780
2790
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2781
2791
|
width: width,
|
|
2782
2792
|
height: height,
|
|
2783
2793
|
viewBox: "0 0 3 3"
|
|
2784
|
-
}, /*#__PURE__*/
|
|
2794
|
+
}, /*#__PURE__*/React__default["default"].createElement("circle", {
|
|
2785
2795
|
cx: "87",
|
|
2786
2796
|
cy: "9",
|
|
2787
2797
|
r: "1",
|
|
@@ -2792,9 +2802,9 @@ var Dot = function Dot(_ref) {
|
|
|
2792
2802
|
};
|
|
2793
2803
|
Dot.propTypes = {
|
|
2794
2804
|
/** height , width and color of the dot icon */
|
|
2795
|
-
color:
|
|
2796
|
-
width:
|
|
2797
|
-
height:
|
|
2805
|
+
color: PropTypes__default["default"].string,
|
|
2806
|
+
width: PropTypes__default["default"].string,
|
|
2807
|
+
height: PropTypes__default["default"].string
|
|
2798
2808
|
};
|
|
2799
2809
|
|
|
2800
2810
|
var _styleModuleImportMap$2 = {
|
|
@@ -2810,22 +2820,22 @@ var Divider = function Divider(_ref) {
|
|
|
2810
2820
|
height = _ref$height === void 0 ? "10" : _ref$height,
|
|
2811
2821
|
_ref$color = _ref.color,
|
|
2812
2822
|
color = _ref$color === void 0 ? "light" : _ref$color;
|
|
2813
|
-
return /*#__PURE__*/
|
|
2823
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2814
2824
|
className: _getClassName(color, _styleModuleImportMap$2)
|
|
2815
|
-
}, /*#__PURE__*/
|
|
2825
|
+
}, /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
2816
2826
|
xmlns: "http://www.w3.org/2000/svg",
|
|
2817
2827
|
width: width,
|
|
2818
2828
|
height: height
|
|
2819
|
-
}, /*#__PURE__*/
|
|
2829
|
+
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
2820
2830
|
fill: "inherit",
|
|
2821
2831
|
d: "M0 0h1v10H0z"
|
|
2822
2832
|
})));
|
|
2823
2833
|
};
|
|
2824
2834
|
Divider.propTypes = {
|
|
2825
2835
|
/** height , width and color of the dot icon */
|
|
2826
|
-
color:
|
|
2827
|
-
width:
|
|
2828
|
-
height:
|
|
2836
|
+
color: PropTypes__default["default"].string,
|
|
2837
|
+
width: PropTypes__default["default"].string,
|
|
2838
|
+
height: PropTypes__default["default"].string
|
|
2829
2839
|
};
|
|
2830
2840
|
|
|
2831
2841
|
var _styleModuleImportMap$1 = {
|
|
@@ -2848,23 +2858,23 @@ var ReadTime = function ReadTime(_ref) {
|
|
|
2848
2858
|
var textColor = isLightTheme ? "light" : getTextColor(config.theme);
|
|
2849
2859
|
if (!showReadTime || !readTime) return null;
|
|
2850
2860
|
var timeToRead = get_1(opts, ["localizedTimeToRead"]) || "min read";
|
|
2851
|
-
return /*#__PURE__*/
|
|
2861
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2852
2862
|
"data-test-id": "read-time",
|
|
2853
2863
|
className: "arrow-component arr--read-time " + _getClassName("read-time-wrapper ".concat(textColor), _styleModuleImportMap$1)
|
|
2854
|
-
}, /*#__PURE__*/
|
|
2864
|
+
}, /*#__PURE__*/React__default["default"].createElement("span", {
|
|
2855
2865
|
className: "read-time-indicator read-time-m_dot-indicator__3Sqh2"
|
|
2856
|
-
}, /*#__PURE__*/
|
|
2866
|
+
}, /*#__PURE__*/React__default["default"].createElement(Dot, {
|
|
2857
2867
|
color: textColor
|
|
2858
|
-
})), /*#__PURE__*/
|
|
2868
|
+
})), /*#__PURE__*/React__default["default"].createElement("span", null, readTime, " ", timeToRead)));
|
|
2859
2869
|
};
|
|
2860
2870
|
ReadTime.propTypes = {
|
|
2861
|
-
story:
|
|
2862
|
-
"read-time":
|
|
2871
|
+
story: PropTypes__default["default"].shape({
|
|
2872
|
+
"read-time": PropTypes__default["default"].number
|
|
2863
2873
|
}),
|
|
2864
|
-
opts:
|
|
2865
|
-
showReadTime:
|
|
2874
|
+
opts: PropTypes__default["default"].shape({
|
|
2875
|
+
showReadTime: PropTypes__default["default"].bool
|
|
2866
2876
|
}),
|
|
2867
|
-
isLightTheme:
|
|
2877
|
+
isLightTheme: PropTypes__default["default"].bool
|
|
2868
2878
|
};
|
|
2869
2879
|
|
|
2870
2880
|
var _styleModuleImportMap = {
|
|
@@ -2895,33 +2905,33 @@ var AuthorWithTime = function AuthorWithTime(_ref) {
|
|
|
2895
2905
|
|
|
2896
2906
|
var getSeparator = function getSeparator() {
|
|
2897
2907
|
if (separator === "divider") {
|
|
2898
|
-
return /*#__PURE__*/
|
|
2908
|
+
return /*#__PURE__*/React__default["default"].createElement(Divider, {
|
|
2899
2909
|
color: textColor
|
|
2900
2910
|
});
|
|
2901
2911
|
}
|
|
2902
2912
|
|
|
2903
|
-
return /*#__PURE__*/
|
|
2913
|
+
return /*#__PURE__*/React__default["default"].createElement(Dot, {
|
|
2904
2914
|
color: textColor
|
|
2905
2915
|
});
|
|
2906
2916
|
};
|
|
2907
2917
|
|
|
2908
2918
|
var getTimeStamp = function getTimeStamp() {
|
|
2909
2919
|
if (!isTime) return null;
|
|
2910
|
-
return /*#__PURE__*/
|
|
2920
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isAuthor && /*#__PURE__*/React__default["default"].createElement("span", {
|
|
2911
2921
|
className: "arr-separator " + _getClassName("".concat(seperatorStyle), _styleModuleImportMap)
|
|
2912
|
-
}, getSeparator()), /*#__PURE__*/
|
|
2922
|
+
}, getSeparator()), /*#__PURE__*/React__default["default"].createElement(TimeStamp, {
|
|
2913
2923
|
story: story,
|
|
2914
2924
|
config: config
|
|
2915
|
-
}), isReadTime && /*#__PURE__*/
|
|
2925
|
+
}), isReadTime && /*#__PURE__*/React__default["default"].createElement(ReadTime, {
|
|
2916
2926
|
story: story,
|
|
2917
2927
|
opts: config,
|
|
2918
2928
|
isLightTheme: isLightTheme
|
|
2919
2929
|
}));
|
|
2920
2930
|
};
|
|
2921
2931
|
|
|
2922
|
-
return /*#__PURE__*/
|
|
2932
|
+
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2923
2933
|
className: "arr--author-time " + _getClassName("author-time-wrapper ".concat(isBottomClasses), _styleModuleImportMap)
|
|
2924
|
-
}, isAuthor ? /*#__PURE__*/
|
|
2934
|
+
}, isAuthor ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Author, {
|
|
2925
2935
|
story: story,
|
|
2926
2936
|
isBottom: true,
|
|
2927
2937
|
hideAuthorImage: hideAuthorImage,
|
|
@@ -2929,19 +2939,19 @@ var AuthorWithTime = function AuthorWithTime(_ref) {
|
|
|
2929
2939
|
}), getTimeStamp()) : getTimeStamp());
|
|
2930
2940
|
};
|
|
2931
2941
|
AuthorWithTime.propTypes = {
|
|
2932
|
-
story:
|
|
2942
|
+
story: PropTypes__default["default"].object,
|
|
2933
2943
|
|
|
2934
2944
|
/** Style of separator between the Author & Timestamp */
|
|
2935
|
-
separator:
|
|
2945
|
+
separator: PropTypes__default["default"].oneOf(["dot", "divider"]),
|
|
2936
2946
|
|
|
2937
2947
|
/** hide the author image */
|
|
2938
|
-
hideAuthorImage:
|
|
2948
|
+
hideAuthorImage: PropTypes__default["default"].bool,
|
|
2939
2949
|
// fix author and time at the end
|
|
2940
|
-
isBottom:
|
|
2950
|
+
isBottom: PropTypes__default["default"].bool,
|
|
2941
2951
|
// fix prefix before the author name
|
|
2942
|
-
prefix:
|
|
2943
|
-
config:
|
|
2944
|
-
isLightTheme:
|
|
2952
|
+
prefix: PropTypes__default["default"].string,
|
|
2953
|
+
config: PropTypes__default["default"].object,
|
|
2954
|
+
isLightTheme: PropTypes__default["default"].bool
|
|
2945
2955
|
};
|
|
2946
2956
|
AuthorWithTime.defaultProps = {
|
|
2947
2957
|
separator: "dot",
|
|
@@ -2951,4 +2961,4 @@ AuthorWithTime.defaultProps = {
|
|
|
2951
2961
|
isLightTheme: false
|
|
2952
2962
|
};
|
|
2953
2963
|
|
|
2954
|
-
|
|
2964
|
+
exports.AuthorWithTime = AuthorWithTime;
|
|
@@ -1,9 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var reactRedux = require('react-redux');
|
|
7
|
+
var PropTypes = require('prop-types');
|
|
8
|
+
var components = require('@quintype/components');
|
|
9
|
+
require('react-timeago');
|
|
10
|
+
require('date-fns-tz');
|
|
11
|
+
|
|
12
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
13
|
+
|
|
14
|
+
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
15
|
+
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
7
16
|
|
|
8
17
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
9
18
|
|
|
@@ -156,9 +165,9 @@ exports["default"] = _default;
|
|
|
156
165
|
|
|
157
166
|
var _getClassName = /*@__PURE__*/getDefaultExportFromCjs(getClassName);
|
|
158
167
|
|
|
159
|
-
var StateContext = /*#__PURE__*/createContext(); // eslint-disable-next-line react/display-name
|
|
168
|
+
var StateContext = /*#__PURE__*/React.createContext(); // eslint-disable-next-line react/display-name
|
|
160
169
|
var useStateValue = function useStateValue() {
|
|
161
|
-
return useContext(StateContext);
|
|
170
|
+
return React.useContext(StateContext);
|
|
162
171
|
};
|
|
163
172
|
|
|
164
173
|
/**
|
|
@@ -2176,15 +2185,15 @@ var getSlug = function getSlug(collection) {
|
|
|
2176
2185
|
|
|
2177
2186
|
return "/collection/".concat(collection.slug);
|
|
2178
2187
|
};
|
|
2179
|
-
|
|
2180
|
-
"sketches-host":
|
|
2181
|
-
"cdn-name":
|
|
2182
|
-
"cdn-image":
|
|
2188
|
+
PropTypes__default["default"].shape({
|
|
2189
|
+
"sketches-host": PropTypes__default["default"].string,
|
|
2190
|
+
"cdn-name": PropTypes__default["default"].string,
|
|
2191
|
+
"cdn-image": PropTypes__default["default"].string
|
|
2183
2192
|
});
|
|
2184
|
-
|
|
2185
|
-
headline:
|
|
2186
|
-
"last-published-at":
|
|
2187
|
-
subheadline:
|
|
2193
|
+
PropTypes__default["default"].shape({
|
|
2194
|
+
headline: PropTypes__default["default"].string,
|
|
2195
|
+
"last-published-at": PropTypes__default["default"].number,
|
|
2196
|
+
subheadline: PropTypes__default["default"].string
|
|
2188
2197
|
});
|
|
2189
2198
|
|
|
2190
2199
|
var _styleModuleImportMap = {
|
|
@@ -2223,7 +2232,7 @@ var CollectionNameBase = function CollectionNameBase(_ref) {
|
|
|
2223
2232
|
var borderBottomFullStyle = templateStyle.includes("collection-borderBottomFull") ? "4px solid ".concat(CollectionNameBorderColor) : "";
|
|
2224
2233
|
|
|
2225
2234
|
var borderBottomStyle = function borderBottomStyle() {
|
|
2226
|
-
return templateStyle.includes("collection-borderBottom") && !templateStyle.includes("collection-borderBottomFull") ? /*#__PURE__*/
|
|
2235
|
+
return templateStyle.includes("collection-borderBottom") && !templateStyle.includes("collection-borderBottomFull") ? /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2227
2236
|
className: "collection-name-m_border-bottom__1MnlV",
|
|
2228
2237
|
style: {
|
|
2229
2238
|
borderBottom: "4px solid ".concat(CollectionNameBorderColor)
|
|
@@ -2283,40 +2292,40 @@ var CollectionNameBase = function CollectionNameBase(_ref) {
|
|
|
2283
2292
|
}
|
|
2284
2293
|
};
|
|
2285
2294
|
|
|
2286
|
-
return /*#__PURE__*/
|
|
2295
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, showRowTitle && collectionName && /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2287
2296
|
style: {
|
|
2288
2297
|
borderBottom: borderBottomFullStyle
|
|
2289
2298
|
},
|
|
2290
2299
|
"data-test-id": "collection-name",
|
|
2291
2300
|
className: ("arr--collection-name arrow-component ".concat(templateStyle) ? "arr--collection-name arrow-component ".concat(templateStyle) + " " : "") + _getClassName("collection ".concat(textColor, " ").concat(templateStyle), _styleModuleImportMap)
|
|
2292
|
-
}, templateStyle.includes("collection-borderLeft") && /*#__PURE__*/
|
|
2301
|
+
}, templateStyle.includes("collection-borderLeft") && /*#__PURE__*/React__default["default"].createElement("span", {
|
|
2293
2302
|
className: "arr-collection-name-border-left collection-name-m_border-left__3_pYw",
|
|
2294
2303
|
style: {
|
|
2295
2304
|
color: CollectionNameBorderColor,
|
|
2296
2305
|
fontSize: getBorderHeight()
|
|
2297
2306
|
}
|
|
2298
|
-
}), slug && !slug.includes(undefined) ? /*#__PURE__*/
|
|
2307
|
+
}), slug && !slug.includes(undefined) ? /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
2299
2308
|
href: slug,
|
|
2300
2309
|
"aria-label": "collection-name"
|
|
2301
|
-
}, /*#__PURE__*/
|
|
2310
|
+
}, /*#__PURE__*/React__default["default"].createElement(HeaderTag, null, collectionName)) : /*#__PURE__*/React__default["default"].createElement(HeaderTag, null, collectionName), borderBottomStyle()));
|
|
2302
2311
|
};
|
|
2303
2312
|
CollectionNameBase.propTypes = {
|
|
2304
2313
|
/** Collection name border color */
|
|
2305
|
-
collectionNameBorderColor: PropTypes
|
|
2314
|
+
collectionNameBorderColor: PropTypes.PropTypes.string,
|
|
2306
2315
|
|
|
2307
2316
|
/** The Collection Object from the API response */
|
|
2308
|
-
collection: PropTypes
|
|
2317
|
+
collection: PropTypes.PropTypes.object,
|
|
2309
2318
|
|
|
2310
2319
|
/** The publisher config from the API response */
|
|
2311
|
-
config: PropTypes
|
|
2320
|
+
config: PropTypes.PropTypes.object,
|
|
2312
2321
|
|
|
2313
2322
|
/** The style template for the component */
|
|
2314
|
-
collectionNameTemplate: PropTypes
|
|
2323
|
+
collectionNameTemplate: PropTypes.PropTypes.oneOf(["", "borderLeft", "borderBottom", "crossLine", "borderBottomFull"]),
|
|
2315
2324
|
|
|
2316
2325
|
/** Header tags ranging h1-h6, where h[headerLevel] */
|
|
2317
|
-
headerLevel: PropTypes
|
|
2318
|
-
customCollectionName: PropTypes
|
|
2319
|
-
navigate: PropTypes
|
|
2326
|
+
headerLevel: PropTypes.PropTypes.string,
|
|
2327
|
+
customCollectionName: PropTypes.PropTypes.string,
|
|
2328
|
+
navigate: PropTypes.PropTypes.bool
|
|
2320
2329
|
};
|
|
2321
2330
|
CollectionNameBase.defaultProps = {
|
|
2322
2331
|
collectionNameTemplate: "",
|
|
@@ -2329,6 +2338,7 @@ function mapStateToProps(state) {
|
|
|
2329
2338
|
};
|
|
2330
2339
|
}
|
|
2331
2340
|
|
|
2332
|
-
var CollectionName = connect(mapStateToProps)(CollectionNameBase);
|
|
2341
|
+
var CollectionName = reactRedux.connect(mapStateToProps)(CollectionNameBase);
|
|
2333
2342
|
|
|
2334
|
-
|
|
2343
|
+
exports.CollectionName = CollectionName;
|
|
2344
|
+
exports.CollectionNameBase = CollectionNameBase;
|