@quintype/arrow 3.15.1-perf.4 → 3.15.1-perf.5
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/cjs/index.js +14589 -0
- package/package.json +1 -1
- package/atoms/Author/index.js +0 -170
- package/atoms/Author/styles.arrow.css +0 -1
- package/atoms/AuthorWithTime/index.js +0 -514
- package/atoms/AuthorWithTime/styles.arrow.css +0 -1
- package/atoms/CollectionName/index.js +0 -255
- package/atoms/CollectionName/styles.arrow.css +0 -1
- package/atoms/ExtendedLoadMore/index-0f809dd9.js +0 -254
- package/atoms/ExtendedLoadMore/index-142f015c.js +0 -476
- package/atoms/ExtendedLoadMore/index-37a9ccff.js +0 -182
- package/atoms/ExtendedLoadMore/index-446679c8.js +0 -191
- package/atoms/ExtendedLoadMore/index-44f97338.js +0 -300
- package/atoms/ExtendedLoadMore/index-57dd4870.js +0 -239
- package/atoms/ExtendedLoadMore/index-66dd4dbd.js +0 -215
- package/atoms/ExtendedLoadMore/index-8462c597.js +0 -363
- package/atoms/ExtendedLoadMore/index-93cb06d1.js +0 -1016
- package/atoms/ExtendedLoadMore/index-afd44863.js +0 -95
- package/atoms/ExtendedLoadMore/index-b5754c5d.js +0 -195
- package/atoms/ExtendedLoadMore/index-bbaf526e.js +0 -256
- package/atoms/ExtendedLoadMore/index-cfb262ef.js +0 -192
- package/atoms/ExtendedLoadMore/index.js +0 -20
- package/atoms/ExtendedLoadMore/styles.arrow.css +0 -1
- package/atoms/Headline/index.js +0 -379
- package/atoms/Headline/styles.arrow.css +0 -1
- package/atoms/HeroImage/index.js +0 -336
- package/atoms/HeroImage/styles.arrow.css +0 -1
- package/atoms/LoadmoreButton/index.js +0 -175
- package/atoms/LoadmoreButton/styles.arrow.css +0 -1
- package/atoms/ScrollSnap/index.js +0 -379
- package/atoms/ScrollSnap/styles.arrow.css +0 -1
- package/atoms/SectionTag/index.js +0 -140
- package/atoms/SectionTag/styles.arrow.css +0 -1
- package/atoms/Subheadline/index.js +0 -120
- package/atoms/Subheadline/styles.arrow.css +0 -1
- package/atoms/TimeStamp/index.js +0 -221
- package/atoms/TimeStamp/styles.arrow.css +0 -1
- package/molecules/KeyEvents/index.js +0 -457
- package/molecules/KeyEvents/styles.arrow.css +0 -1
- package/molecules/PageIntroductionCard/index.js +0 -248
- package/molecules/PageIntroductionCard/styles.arrow.css +0 -1
- package/molecules/SocialShareTemplate/index.js +0 -506
- package/molecules/SocialShareTemplate/styles.arrow.css +0 -1
- package/molecules/StoryCard/index.js +0 -1430
- package/molecules/StoryCard/styles.arrow.css +0 -1
- package/molecules/StoryElementCard/index.js +0 -3091
- package/molecules/StoryElementCard/styles.arrow.css +0 -1
- package/molecules/StorycardContent/index.js +0 -976
- package/molecules/StorycardContent/styles.arrow.css +0 -1
- package/rows/AlternateCollectionFilter/index.js +0 -2189
- package/rows/AlternateCollectionFilter/styles.arrow.css +0 -1
- package/rows/AsideCollection/index.js +0 -2135
- package/rows/AsideCollection/styles.arrow.css +0 -1
- package/rows/AstrologyCollection/index.js +0 -2106
- package/rows/AstrologyCollection/styles.arrow.css +0 -1
- package/rows/AuthorIntroductionCard/index.js +0 -813
- package/rows/AuthorIntroductionCard/styles.arrow.css +0 -1
- package/rows/AuthorsList/index.js +0 -996
- package/rows/AuthorsList/styles.arrow.css +0 -1
- package/rows/CollectionFilter/index.js +0 -2279
- package/rows/CollectionFilter/styles.arrow.css +0 -1
- package/rows/ElevenStories/index.js +0 -2118
- package/rows/ElevenStories/styles.arrow.css +0 -1
- package/rows/FourColFiveStories/index.js +0 -1861
- package/rows/FourColFiveStories/styles.arrow.css +0 -1
- package/rows/FourColGrid/index.js +0 -2083
- package/rows/FourColGrid/styles.arrow.css +0 -1
- package/rows/FourColPortraitStories/index.js +0 -2116
- package/rows/FourColPortraitStories/styles.arrow.css +0 -1
- package/rows/FourColSixteenStories/index.js +0 -1849
- package/rows/FourColSixteenStories/styles.arrow.css +0 -1
- package/rows/FourColTwelveStories/index.js +0 -1822
- package/rows/FourColTwelveStories/styles.arrow.css +0 -1
- package/rows/FourStorySlider/index.js +0 -2223
- package/rows/FourStorySlider/styles.arrow.css +0 -1
- package/rows/FourStorySliderPortrait/index.js +0 -2226
- package/rows/FourStorySliderPortrait/styles.arrow.css +0 -1
- package/rows/FourTabbedBigStorySlider/index.js +0 -1985
- package/rows/FourTabbedBigStorySlider/styles.arrow.css +0 -1
- package/rows/FullScreenSlider/index.js +0 -2141
- package/rows/FullScreenSlider/styles.arrow.css +0 -1
- package/rows/HalfScreenSlider/index.js +0 -1994
- package/rows/HalfScreenSlider/styles.arrow.css +0 -1
- package/rows/ListComponent/index.js +0 -1942
- package/rows/ListComponent/styles.arrow.css +0 -1
- package/rows/Listicles/index.js +0 -945
- package/rows/Listicles/styles.arrow.css +0 -1
- package/rows/MagazineEditions/index.js +0 -690
- package/rows/MagazineEditions/styles.arrow.css +0 -1
- package/rows/MagazineHeaderCard/index.js +0 -684
- package/rows/MagazineHeaderCard/styles.arrow.css +0 -1
- package/rows/MagazineWidget/index.js +0 -1994
- package/rows/MagazineWidget/styles.arrow.css +0 -1
- package/rows/OneColStoryList/index.js +0 -2169
- package/rows/OneColStoryList/styles.arrow.css +0 -1
- package/rows/OpinionCollection/index.js +0 -1545
- package/rows/OpinionCollection/styles.arrow.css +0 -1
- package/rows/SixColSixStories/index.js +0 -2014
- package/rows/SixColSixStories/styles.arrow.css +0 -1
- package/rows/StoryCollection/index.js +0 -2135
- package/rows/StoryCollection/styles.arrow.css +0 -1
- package/rows/TagIntroductionCard/index.js +0 -103
- package/rows/TagIntroductionCard/styles.arrow.css +0 -1
- package/rows/ThreeColFlexStories/index.js +0 -2074
- package/rows/ThreeColFlexStories/styles.arrow.css +0 -1
- package/rows/ThreeColFourteenStories/index.js +0 -1770
- package/rows/ThreeColFourteenStories/styles.arrow.css +0 -1
- package/rows/ThreeColGrid/index.js +0 -2104
- package/rows/ThreeColGrid/styles.arrow.css +0 -1
- package/rows/ThreeColSevenStory/index.js +0 -1982
- package/rows/ThreeColSevenStory/styles.arrow.css +0 -1
- package/rows/ThreeColSixStories/index.js +0 -1965
- package/rows/ThreeColSixStories/styles.arrow.css +0 -1
- package/rows/ThreeColTwelveStories/index.js +0 -1854
- package/rows/ThreeColTwelveStories/styles.arrow.css +0 -1
- package/rows/TwoColFourStories/index.js +0 -1943
- package/rows/TwoColFourStories/styles.arrow.css +0 -1
- package/rows/TwoColFourStoryHighlight/index.js +0 -1930
- package/rows/TwoColFourStoryHighlight/styles.arrow.css +0 -1
- package/rows/TwoColSevenStories/index.js +0 -1970
- package/rows/TwoColSevenStories/styles.arrow.css +0 -1
- package/rows/TwoColSixStories/index.js +0 -1963
- package/rows/TwoColSixStories/styles.arrow.css +0 -1
- package/rows/TwoColTenStoriesSidebar/index.js +0 -2029
- package/rows/TwoColTenStoriesSidebar/styles.arrow.css +0 -1
- package/rows/TwoColThreeStories/index.js +0 -1916
- package/rows/TwoColThreeStories/styles.arrow.css +0 -1
- package/story-elements/AlsoRead/index.js +0 -320
- package/story-elements/AlsoRead/styles.arrow.css +0 -1
- package/story-elements/Attachment/index.js +0 -167
- package/story-elements/Attachment/styles.arrow.css +0 -1
- package/story-elements/BigFact/index.js +0 -137
- package/story-elements/BigFact/styles.arrow.css +0 -1
- package/story-elements/BlockQuote/index.js +0 -304
- package/story-elements/BlockQuote/styles.arrow.css +0 -1
- package/story-elements/Blurb/index.js +0 -189
- package/story-elements/Blurb/styles.arrow.css +0 -1
- package/story-elements/Image/index.js +0 -529
- package/story-elements/Image/styles.arrow.css +0 -1
- package/story-elements/ImageGallery/index.js +0 -462
- package/story-elements/ImageGallery/styles.arrow.css +0 -1
- package/story-elements/ImageSlideshow/index.js +0 -773
- package/story-elements/ImageSlideshow/styles.arrow.css +0 -1
- package/story-elements/QuestionAnswer/index.js +0 -267
- package/story-elements/QuestionAnswer/styles.arrow.css +0 -1
- package/story-elements/Quote/index.js +0 -166
- package/story-elements/Quote/styles.arrow.css +0 -1
- package/story-elements/Reference/index.js +0 -160
- package/story-elements/Reference/styles.arrow.css +0 -1
- package/story-elements/StoryElement/index.js +0 -75
- package/story-elements/Summary/index.js +0 -190
- package/story-elements/Summary/styles.arrow.css +0 -1
- package/story-elements/Text/index.js +0 -165
- package/story-elements/Text/styles.arrow.css +0 -1
- package/story-elements/Video/index.js +0 -81
- package/story-elements/Video/styles.arrow.css +0 -1
- package/story-templates/ListicleStoryTemplate/index.js +0 -5586
- package/story-templates/ListicleStoryTemplate/styles.arrow.css +0 -1
- package/story-templates/LiveBlogStoryTemplate/index.js +0 -5762
- package/story-templates/LiveBlogStoryTemplate/styles.arrow.css +0 -1
- package/story-templates/PhotoStoryTemplate/index.js +0 -5564
- package/story-templates/PhotoStoryTemplate/styles.arrow.css +0 -1
- package/story-templates/TextStoryTemplate/index.js +0 -5637
- package/story-templates/TextStoryTemplate/styles.arrow.css +0 -1
- package/story-templates/VideoStoryTemplate/index.js +0 -5496
- package/story-templates/VideoStoryTemplate/styles.arrow.css +0 -1
|
@@ -1,191 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var React = require('react');
|
|
4
|
-
var lodash = require('lodash');
|
|
5
|
-
var index$2 = require('./index-0f809dd9.js');
|
|
6
|
-
var index$3 = require('./index-8462c597.js');
|
|
7
|
-
var index$4 = require('./index-afd44863.js');
|
|
8
|
-
var index$1 = require('./index-93cb06d1.js');
|
|
9
|
-
var index = require('./index-142f015c.js');
|
|
10
|
-
var components = require('@quintype/components');
|
|
11
|
-
var PropTypes = require('prop-types');
|
|
12
|
-
var reactRedux = require('react-redux');
|
|
13
|
-
require('babel-plugin-react-css-modules/dist/browser/getClassName');
|
|
14
|
-
require('@babel/runtime/helpers/slicedToArray');
|
|
15
|
-
require('@babel/runtime/helpers/defineProperty');
|
|
16
|
-
require('react-dom');
|
|
17
|
-
require('@babel/runtime/helpers/toConsumableArray');
|
|
18
|
-
require('@babel/runtime/helpers/asyncToGenerator');
|
|
19
|
-
require('@babel/runtime/regenerator');
|
|
20
|
-
require('@babel/runtime/helpers/typeof');
|
|
21
|
-
require('react-timeago');
|
|
22
|
-
require('date-fns-tz');
|
|
23
|
-
|
|
24
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
25
|
-
|
|
26
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
27
|
-
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
28
|
-
|
|
29
|
-
var loadMore = function loadMore(_ref) {
|
|
30
|
-
var isLoading = _ref.isLoading,
|
|
31
|
-
storyItems = _ref.storyItems,
|
|
32
|
-
getMoreStories = _ref.getMoreStories,
|
|
33
|
-
_ref$subsequentLoadCo = _ref.subsequentLoadCount,
|
|
34
|
-
subsequentLoadCount = _ref$subsequentLoadCo === void 0 ? 3 : _ref$subsequentLoadCo;
|
|
35
|
-
if (isLoading) return;
|
|
36
|
-
var limit = subsequentLoadCount;
|
|
37
|
-
var offset = storyItems.length;
|
|
38
|
-
getMoreStories(offset, limit);
|
|
39
|
-
};
|
|
40
|
-
|
|
41
|
-
var ThreeColGridBase = function ThreeColGridBase(_ref2) {
|
|
42
|
-
var collection = _ref2.collection,
|
|
43
|
-
_ref2$config = _ref2.config,
|
|
44
|
-
config = _ref2$config === void 0 ? {} : _ref2$config,
|
|
45
|
-
getMoreStories = _ref2.getMoreStories,
|
|
46
|
-
isLoadMoreVisible = _ref2.isLoadMoreVisible,
|
|
47
|
-
isLoading = _ref2.isLoading,
|
|
48
|
-
isolatedLoadMore = _ref2.isolatedLoadMore;
|
|
49
|
-
var _config$collectionNam = config.collectionNameBorderColor,
|
|
50
|
-
collectionNameBorderColor = _config$collectionNam === void 0 ? "" : _config$collectionNam,
|
|
51
|
-
_config$borderColor = config.borderColor,
|
|
52
|
-
borderColor = _config$borderColor === void 0 ? "" : _config$borderColor,
|
|
53
|
-
_config$theme = config.theme,
|
|
54
|
-
theme = _config$theme === void 0 ? "" : _config$theme,
|
|
55
|
-
_config$slotConfig = config.slotConfig,
|
|
56
|
-
slotConfig = _config$slotConfig === void 0 ? [] : _config$slotConfig,
|
|
57
|
-
_config$border = config.border,
|
|
58
|
-
border = _config$border === void 0 ? "" : _config$border,
|
|
59
|
-
_config$collectionNam2 = config.collectionNameTemplate,
|
|
60
|
-
collectionNameTemplate = _config$collectionNam2 === void 0 ? "" : _config$collectionNam2,
|
|
61
|
-
_config$footerSlotCon = config.footerSlotConfig,
|
|
62
|
-
footerSlotConfig = _config$footerSlotCon === void 0 ? {} : _config$footerSlotCon,
|
|
63
|
-
_config$footerButton = config.footerButton,
|
|
64
|
-
footerButton = _config$footerButton === void 0 ? "" : _config$footerButton,
|
|
65
|
-
_config$subsequentLoa = config.subsequentLoadCount,
|
|
66
|
-
subsequentLoadCount = _config$subsequentLoa === void 0 ? 3 : _config$subsequentLoa;
|
|
67
|
-
var storyItems = components.collectionToStories(collection);
|
|
68
|
-
if (!storyItems.length) return null;
|
|
69
|
-
var textColor = index.getTextColor(theme);
|
|
70
|
-
var footerSlot = footerSlotConfig.footerSlot;
|
|
71
|
-
var footerSlotComp = footerSlot ? footerSlot() : null;
|
|
72
|
-
|
|
73
|
-
var _get = lodash.get(slotConfig, [0], {}),
|
|
74
|
-
_get$type = _get.type,
|
|
75
|
-
type = _get$type === void 0 ? "" : _get$type,
|
|
76
|
-
component = _get.component;
|
|
77
|
-
|
|
78
|
-
var adWidgetSlot = type === "ad" || type === "widget" ? index.getSlot(type, component) : null;
|
|
79
|
-
var dispatch = reactRedux.useDispatch();
|
|
80
|
-
var qtConfig = reactRedux.useSelector(function (state) {
|
|
81
|
-
return lodash.get(state, ["qt", "config"], {});
|
|
82
|
-
});
|
|
83
|
-
|
|
84
|
-
var getLoadMore = function getLoadMore(opts) {
|
|
85
|
-
if (!isLoadMoreVisible) return null;
|
|
86
|
-
|
|
87
|
-
if (isolatedLoadMore) {
|
|
88
|
-
return /*#__PURE__*/React__default["default"].createElement(index$1.LoadMoreTarget, {
|
|
89
|
-
collection: collection,
|
|
90
|
-
componentName: "ThreeColGrid",
|
|
91
|
-
offset: storyItems.length,
|
|
92
|
-
limit: subsequentLoadCount
|
|
93
|
-
});
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
var url = index.generateNavigateSlug(collection, qtConfig);
|
|
97
|
-
return /*#__PURE__*/React__default["default"].createElement(index$1.ProgressiveHydration, null, /*#__PURE__*/React__default["default"].createElement(index$1.LoadmoreButton, {
|
|
98
|
-
config: config,
|
|
99
|
-
collection: collection,
|
|
100
|
-
template: footerButton,
|
|
101
|
-
onClick: function onClick() {
|
|
102
|
-
return loadMore(opts);
|
|
103
|
-
},
|
|
104
|
-
navigate: function navigate() {
|
|
105
|
-
return index.navigateTo(dispatch, url);
|
|
106
|
-
},
|
|
107
|
-
qtConfig: qtConfig
|
|
108
|
-
}));
|
|
109
|
-
};
|
|
110
|
-
|
|
111
|
-
var storyCard = function storyCard(story) {
|
|
112
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
113
|
-
className: "three-col-m_cards__2HyyK"
|
|
114
|
-
}, /*#__PURE__*/React__default["default"].createElement(index$2.StoryCard, {
|
|
115
|
-
story: story,
|
|
116
|
-
border: border,
|
|
117
|
-
theme: theme,
|
|
118
|
-
isHorizontalMobile: true,
|
|
119
|
-
config: config
|
|
120
|
-
}, /*#__PURE__*/React__default["default"].createElement(index$3.HeroImage, {
|
|
121
|
-
aspectRatio: [[16, 9]],
|
|
122
|
-
story: story,
|
|
123
|
-
isHorizontalMobile: true
|
|
124
|
-
}), /*#__PURE__*/React__default["default"].createElement(index$4.StorycardContent, {
|
|
125
|
-
theme: theme,
|
|
126
|
-
border: border,
|
|
127
|
-
story: story,
|
|
128
|
-
isHorizontalMobile: true,
|
|
129
|
-
borderColor: borderColor,
|
|
130
|
-
config: config
|
|
131
|
-
})));
|
|
132
|
-
};
|
|
133
|
-
|
|
134
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
135
|
-
className: "full-width-with-padding arrow-component",
|
|
136
|
-
"data-test-id": "three-col-grid",
|
|
137
|
-
style: {
|
|
138
|
-
backgroundColor: theme,
|
|
139
|
-
color: textColor
|
|
140
|
-
}
|
|
141
|
-
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
142
|
-
className: "three-col-m_three-col-grid__y7rZK"
|
|
143
|
-
}, /*#__PURE__*/React__default["default"].createElement(index$1.CollectionName, {
|
|
144
|
-
collection: collection,
|
|
145
|
-
collectionNameTemplate: collectionNameTemplate,
|
|
146
|
-
collectionNameBorderColor: collectionNameBorderColor
|
|
147
|
-
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
148
|
-
className: "three-col-m_wrapper__20m5m"
|
|
149
|
-
}, storyItems.slice(0, 2).map(function (story, index) {
|
|
150
|
-
return /*#__PURE__*/React__default["default"].createElement(React.Fragment, {
|
|
151
|
-
key: "story-3col1-".concat(index, "-").concat(lodash.get(story, ["id"], "0"))
|
|
152
|
-
}, storyCard(story));
|
|
153
|
-
}), storyItems.length < 2 && /*#__PURE__*/React__default["default"].createElement("div", null), adWidgetSlot, storyItems.slice(2).map(function (story, index) {
|
|
154
|
-
return /*#__PURE__*/React__default["default"].createElement(React.Fragment, {
|
|
155
|
-
key: "story-3col1-".concat(index, "-").concat(lodash.get(story, ["id"], "0"))
|
|
156
|
-
}, storyCard(story));
|
|
157
|
-
})), getLoadMore({
|
|
158
|
-
isLoading: isLoading,
|
|
159
|
-
storyItems: storyItems,
|
|
160
|
-
getMoreStories: getMoreStories,
|
|
161
|
-
subsequentLoadCount: subsequentLoadCount
|
|
162
|
-
}), footerSlotComp));
|
|
163
|
-
};
|
|
164
|
-
ThreeColGridBase.propTypes = {
|
|
165
|
-
/** collection is the array of objects which is returning by API */
|
|
166
|
-
collection: PropTypes__default["default"].object.isRequired,
|
|
167
|
-
|
|
168
|
-
/** The config for the Row */
|
|
169
|
-
config: PropTypes__default["default"].shape({
|
|
170
|
-
theme: PropTypes__default["default"].string,
|
|
171
|
-
border: PropTypes__default["default"].bool,
|
|
172
|
-
slotConfig: PropTypes__default["default"].array,
|
|
173
|
-
footerButton: PropTypes__default["default"].string,
|
|
174
|
-
collectionNameTemplate: PropTypes__default["default"].string,
|
|
175
|
-
collectionNameBorderColor: PropTypes__default["default"].string,
|
|
176
|
-
subsequentLoadCount: PropTypes__default["default"].number
|
|
177
|
-
}),
|
|
178
|
-
getMoreStories: PropTypes__default["default"].func,
|
|
179
|
-
isLoadMoreVisible: PropTypes__default["default"].bool,
|
|
180
|
-
isLoading: PropTypes__default["default"].bool,
|
|
181
|
-
isolatedLoadMore: PropTypes__default["default"].bool
|
|
182
|
-
};
|
|
183
|
-
ThreeColGridBase.defaultProps = {
|
|
184
|
-
getMoreStories: function getMoreStories() {},
|
|
185
|
-
isLoadMoreVisible: true,
|
|
186
|
-
isLoading: false
|
|
187
|
-
};
|
|
188
|
-
var ThreeColGrid = index$1.StateProvider(ThreeColGridBase);
|
|
189
|
-
|
|
190
|
-
exports.ThreeColGrid = ThreeColGrid;
|
|
191
|
-
exports.ThreeColGridBase = ThreeColGridBase;
|
|
@@ -1,300 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
|
-
var _getClassName = require('babel-plugin-react-css-modules/dist/browser/getClassName');
|
|
5
|
-
var React = require('react');
|
|
6
|
-
var reactRedux = require('react-redux');
|
|
7
|
-
var lodash = require('lodash');
|
|
8
|
-
var PropTypes = require('prop-types');
|
|
9
|
-
var components = require('@quintype/components');
|
|
10
|
-
var index$1 = require('./index-93cb06d1.js');
|
|
11
|
-
var index = require('./index-142f015c.js');
|
|
12
|
-
require('react-dom');
|
|
13
|
-
require('@babel/runtime/helpers/slicedToArray');
|
|
14
|
-
require('@babel/runtime/helpers/toConsumableArray');
|
|
15
|
-
require('@babel/runtime/helpers/asyncToGenerator');
|
|
16
|
-
require('@babel/runtime/regenerator');
|
|
17
|
-
require('@babel/runtime/helpers/typeof');
|
|
18
|
-
require('react-timeago');
|
|
19
|
-
require('date-fns-tz');
|
|
20
|
-
|
|
21
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
22
|
-
|
|
23
|
-
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
24
|
-
var _getClassName__default = /*#__PURE__*/_interopDefaultLegacy(_getClassName);
|
|
25
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
26
|
-
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
|
|
27
|
-
|
|
28
|
-
var UserFallbackIcon = function UserFallbackIcon(_ref) {
|
|
29
|
-
var _ref$width = _ref.width,
|
|
30
|
-
width = _ref$width === void 0 ? 120 : _ref$width,
|
|
31
|
-
_ref$height = _ref.height,
|
|
32
|
-
height = _ref$height === void 0 ? 120 : _ref$height;
|
|
33
|
-
return /*#__PURE__*/React__default["default"].createElement("svg", {
|
|
34
|
-
width: width,
|
|
35
|
-
height: height,
|
|
36
|
-
viewBox: "0 0 120 120",
|
|
37
|
-
xmlns: "http://www.w3.org/2000/svg"
|
|
38
|
-
}, /*#__PURE__*/React__default["default"].createElement("path", {
|
|
39
|
-
d: "M93.28 108.98c-1.055-17.675-15.47-31.678-33.098-31.678-17.708 0-32.173 14.129-33.11 31.916 9.415 6.311 20.741 9.993 32.927 9.993 12.338 0 23.795-3.774 33.28-10.23l.001-.001zM58.584 73.283c9.928 0 17.977-8.275 17.977-18.483 0-10.209-8.049-18.484-17.977-18.484-9.929 0-17.977 8.275-17.977 18.484 0 10.208 8.048 18.483 17.977 18.483zM60 120C26.863 120 0 93.137 0 60S26.863 0 60 0s60 26.863 60 60-26.863 60-60 60z",
|
|
40
|
-
fill: "#DADADA",
|
|
41
|
-
fillRule: "nonzero"
|
|
42
|
-
}));
|
|
43
|
-
};
|
|
44
|
-
UserFallbackIcon.propTypes = {
|
|
45
|
-
width: PropTypes__default["default"].object,
|
|
46
|
-
height: PropTypes__default["default"].object
|
|
47
|
-
};
|
|
48
|
-
|
|
49
|
-
var _styleModuleImportMap$1 = {
|
|
50
|
-
"./author-image.m.css": {
|
|
51
|
-
"viewports": "\"../../../../assets/stylesheets/viewports.m.css\"",
|
|
52
|
-
"mobile": "768px",
|
|
53
|
-
"tablet": "992px",
|
|
54
|
-
"image-container": "author-image-m_image-container__19WNd",
|
|
55
|
-
"author-image": "author-image-m_author-image__D8GMB",
|
|
56
|
-
"square": "author-image-m_square__bjK7M",
|
|
57
|
-
"small-circle": "author-image-m_small-circle__DbQMN",
|
|
58
|
-
"smaller-circle": "author-image-m_smaller-circle__2yMOZ"
|
|
59
|
-
}
|
|
60
|
-
};
|
|
61
|
-
|
|
62
|
-
var authorWithImage = function authorWithImage(author, templateStyle) {
|
|
63
|
-
var avatarUrl = author["avatar-url"],
|
|
64
|
-
avatarS3Key = author["avatar-s3-key"],
|
|
65
|
-
name = author.name;
|
|
66
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
67
|
-
"data-test-id": "author-image",
|
|
68
|
-
className: "arr--author-image " + _getClassName__default["default"]("author-image ".concat(templateStyle), _styleModuleImportMap$1)
|
|
69
|
-
}, /*#__PURE__*/React__default["default"].createElement("figure", {
|
|
70
|
-
className: "author-image-m_image-container__19WNd"
|
|
71
|
-
}, avatarS3Key ? /*#__PURE__*/React__default["default"].createElement(components.ResponsiveImage, {
|
|
72
|
-
slug: avatarS3Key,
|
|
73
|
-
alt: name,
|
|
74
|
-
defaultWidth: 250,
|
|
75
|
-
widths: [250, 480],
|
|
76
|
-
aspectRatio: [[1, 1], [1, 1]],
|
|
77
|
-
sizes: "98vw",
|
|
78
|
-
imgParams: {
|
|
79
|
-
auto: ["format", "compress"]
|
|
80
|
-
}
|
|
81
|
-
}) : avatarUrl ? /*#__PURE__*/React__default["default"].createElement("img", {
|
|
82
|
-
src: avatarUrl
|
|
83
|
-
}) : /*#__PURE__*/React__default["default"].createElement(UserFallbackIcon, null)));
|
|
84
|
-
};
|
|
85
|
-
|
|
86
|
-
var AuthorImage = function AuthorImage(_ref) {
|
|
87
|
-
var _ref$author = _ref.author,
|
|
88
|
-
author = _ref$author === void 0 ? {} : _ref$author,
|
|
89
|
-
_ref$template = _ref.template,
|
|
90
|
-
template = _ref$template === void 0 ? "" : _ref$template,
|
|
91
|
-
_ref$config = _ref.config,
|
|
92
|
-
config = _ref$config === void 0 ? {} : _ref$config;
|
|
93
|
-
var slug = author.slug;
|
|
94
|
-
var mountAt = config.mountAt || "";
|
|
95
|
-
var templateStyle = "";
|
|
96
|
-
if (template === "smallerCircle") templateStyle = "smaller-circle";else if (template === "smallCircle") templateStyle = "small-circle";else if (template === "square") templateStyle = "square";
|
|
97
|
-
if (slug) return /*#__PURE__*/React__default["default"].createElement(components.Link, {
|
|
98
|
-
href: "".concat(mountAt, "/author/") + slug
|
|
99
|
-
}, authorWithImage(author, templateStyle));else return authorWithImage(author, templateStyle);
|
|
100
|
-
};
|
|
101
|
-
|
|
102
|
-
AuthorImage.propTypes = {
|
|
103
|
-
author: PropTypes__default["default"].shape({
|
|
104
|
-
"avatar-url": PropTypes__default["default"].string,
|
|
105
|
-
"avatar-s3-key": PropTypes__default["default"].string,
|
|
106
|
-
name: PropTypes__default["default"].string,
|
|
107
|
-
slug: PropTypes__default["default"].string
|
|
108
|
-
}),
|
|
109
|
-
template: PropTypes__default["default"].string
|
|
110
|
-
};
|
|
111
|
-
|
|
112
|
-
var _styleModuleImportMap = {
|
|
113
|
-
"./opinion-collection.m.css": {
|
|
114
|
-
"viewports": "\"../../../../assets/stylesheets/viewports.m.css\"",
|
|
115
|
-
"mobile": "768px",
|
|
116
|
-
"desktop": "1025px",
|
|
117
|
-
"opinion-collection": "opinion-collection-m_opinion-collection__1Bc7h",
|
|
118
|
-
"content-wrapper": "opinion-collection-m_content-wrapper__y32PE",
|
|
119
|
-
"custom-grid": "opinion-collection-m_custom-grid__33uRh",
|
|
120
|
-
"wrapper-with-ads": "opinion-collection-m_wrapper-with-ads__2daVe",
|
|
121
|
-
"ad-slot": "opinion-collection-m_ad-slot__2ZpaC",
|
|
122
|
-
"headline-author": "opinion-collection-m_headline-author__2H6Tv",
|
|
123
|
-
"border": "opinion-collection-m_border__38tun",
|
|
124
|
-
"light": "opinion-collection-m_light__2Hent",
|
|
125
|
-
"dark": "opinion-collection-m_dark__WMRNF",
|
|
126
|
-
"count-3": "opinion-collection-m_count-3__3cQUB",
|
|
127
|
-
"count-2": "opinion-collection-m_count-2__2e7g_"
|
|
128
|
-
}
|
|
129
|
-
};
|
|
130
|
-
|
|
131
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
132
|
-
|
|
133
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
134
|
-
|
|
135
|
-
var loadMore = function loadMore(_ref) {
|
|
136
|
-
var isLoading = _ref.isLoading,
|
|
137
|
-
renderStories = _ref.renderStories,
|
|
138
|
-
getMoreStories = _ref.getMoreStories,
|
|
139
|
-
_ref$subsequentLoadCo = _ref.subsequentLoadCount,
|
|
140
|
-
subsequentLoadCount = _ref$subsequentLoadCo === void 0 ? 3 : _ref$subsequentLoadCo;
|
|
141
|
-
if (isLoading) return;
|
|
142
|
-
var limit = subsequentLoadCount;
|
|
143
|
-
var offset = renderStories.length;
|
|
144
|
-
getMoreStories(offset, limit);
|
|
145
|
-
};
|
|
146
|
-
|
|
147
|
-
var OpinionCollectionBase = function OpinionCollectionBase(_ref2) {
|
|
148
|
-
var collection = _ref2.collection,
|
|
149
|
-
config = _ref2.config,
|
|
150
|
-
getMoreStories = _ref2.getMoreStories,
|
|
151
|
-
isLoadMoreVisible = _ref2.isLoadMoreVisible,
|
|
152
|
-
isLoading = _ref2.isLoading,
|
|
153
|
-
isolatedLoadMore = _ref2.isolatedLoadMore;
|
|
154
|
-
var stories = components.collectionToStories(collection);
|
|
155
|
-
var _config$theme = config.theme,
|
|
156
|
-
theme = _config$theme === void 0 ? "" : _config$theme,
|
|
157
|
-
_config$footerButton = config.footerButton,
|
|
158
|
-
footerButton = _config$footerButton === void 0 ? "" : _config$footerButton,
|
|
159
|
-
_config$border = config.border,
|
|
160
|
-
border = _config$border === void 0 ? "fullBorder" : _config$border,
|
|
161
|
-
_config$collectionNam = config.collectionNameBorderColor,
|
|
162
|
-
collectionNameBorderColor = _config$collectionNam === void 0 ? "" : _config$collectionNam,
|
|
163
|
-
_config$collectionNam2 = config.collectionNameTemplate,
|
|
164
|
-
collectionNameTemplate = _config$collectionNam2 === void 0 ? "" : _config$collectionNam2,
|
|
165
|
-
_config$slotConfig = config.slotConfig,
|
|
166
|
-
slotConfig = _config$slotConfig === void 0 ? [] : _config$slotConfig,
|
|
167
|
-
_config$subsequentLoa = config.subsequentLoadCount,
|
|
168
|
-
subsequentLoadCount = _config$subsequentLoa === void 0 ? 3 : _config$subsequentLoa;
|
|
169
|
-
|
|
170
|
-
var _get = lodash.get(slotConfig, [0], {}),
|
|
171
|
-
_get$type = _get.type,
|
|
172
|
-
type = _get$type === void 0 ? "story" : _get$type,
|
|
173
|
-
_get$component = _get.component,
|
|
174
|
-
component = _get$component === void 0 ? null : _get$component;
|
|
175
|
-
|
|
176
|
-
var dispatch = reactRedux.useDispatch();
|
|
177
|
-
var qtConfig = reactRedux.useSelector(function (state) {
|
|
178
|
-
return lodash.get(state, ["qt", "config"], {});
|
|
179
|
-
});
|
|
180
|
-
if (!stories.length) return null;
|
|
181
|
-
var textColor = index.getTextColor(theme);
|
|
182
|
-
var borderStyle = border === "fullBorder" ? "border" : "";
|
|
183
|
-
var slot = type === "ad" ? index.getSlot(type, component) : null;
|
|
184
|
-
var adStyle = slot ? "custom-grid" : "";
|
|
185
|
-
|
|
186
|
-
var getLoadMore = function getLoadMore(opts) {
|
|
187
|
-
if (!isLoadMoreVisible) return null;
|
|
188
|
-
|
|
189
|
-
if (isolatedLoadMore) {
|
|
190
|
-
return /*#__PURE__*/React__default["default"].createElement(index$1.LoadMoreTarget, {
|
|
191
|
-
collection: collection,
|
|
192
|
-
componentName: "OpinionCollection",
|
|
193
|
-
offset: stories.length,
|
|
194
|
-
limit: subsequentLoadCount
|
|
195
|
-
});
|
|
196
|
-
}
|
|
197
|
-
|
|
198
|
-
var url = index.generateNavigateSlug(collection, qtConfig);
|
|
199
|
-
return /*#__PURE__*/React__default["default"].createElement(index$1.ProgressiveHydration, null, /*#__PURE__*/React__default["default"].createElement(index$1.LoadmoreButton, {
|
|
200
|
-
config: config,
|
|
201
|
-
collection: collection,
|
|
202
|
-
template: footerButton,
|
|
203
|
-
onClick: function onClick() {
|
|
204
|
-
return loadMore(opts);
|
|
205
|
-
},
|
|
206
|
-
navigate: function navigate() {
|
|
207
|
-
return index.navigateTo(dispatch, url);
|
|
208
|
-
},
|
|
209
|
-
qtConfig: qtConfig
|
|
210
|
-
}));
|
|
211
|
-
};
|
|
212
|
-
|
|
213
|
-
var getAuthorCard = function getAuthorCard(story) {
|
|
214
|
-
var authorData = lodash.get(story, ["authors", "0"]);
|
|
215
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
216
|
-
"data-test-id": "story-card"
|
|
217
|
-
}, /*#__PURE__*/React__default["default"].createElement(index$1.Author, {
|
|
218
|
-
story: story,
|
|
219
|
-
hideAuthorImage: true
|
|
220
|
-
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
221
|
-
className: "opinion-collection-m_headline-author__2H6Tv"
|
|
222
|
-
}, /*#__PURE__*/React__default["default"].createElement(index$1.Headline, {
|
|
223
|
-
story: story
|
|
224
|
-
}), /*#__PURE__*/React__default["default"].createElement(AuthorImage, {
|
|
225
|
-
author: authorData,
|
|
226
|
-
template: "smallerCircle",
|
|
227
|
-
config: config
|
|
228
|
-
})), /*#__PURE__*/React__default["default"].createElement(index$1.AuthorWithTime, {
|
|
229
|
-
story: story,
|
|
230
|
-
config: _objectSpread(_objectSpread({}, config), {}, {
|
|
231
|
-
disableMeridiem: true,
|
|
232
|
-
showAuthor: false
|
|
233
|
-
})
|
|
234
|
-
}));
|
|
235
|
-
};
|
|
236
|
-
|
|
237
|
-
var countStyleName = stories.length === 2 || stories.length === 3 ? "count-".concat(stories.length) : "";
|
|
238
|
-
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
239
|
-
className: "full-width-with-padding arrow-component",
|
|
240
|
-
"data-test-id": "opinion-collection",
|
|
241
|
-
style: {
|
|
242
|
-
backgroundColor: theme,
|
|
243
|
-
color: textColor
|
|
244
|
-
}
|
|
245
|
-
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
246
|
-
className: "opinion-collection-m_opinion-collection__1Bc7h",
|
|
247
|
-
style: {
|
|
248
|
-
backgroundColor: theme,
|
|
249
|
-
color: textColor
|
|
250
|
-
}
|
|
251
|
-
}, /*#__PURE__*/React__default["default"].createElement(index$1.CollectionName, {
|
|
252
|
-
collection: collection,
|
|
253
|
-
collectionNameTemplate: collectionNameTemplate,
|
|
254
|
-
collectionNameBorderColor: collectionNameBorderColor,
|
|
255
|
-
headerLevel: 2
|
|
256
|
-
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
257
|
-
className: ("content-wrapper ".concat(borderStyle, " ").concat(textColor) ? "content-wrapper ".concat(borderStyle, " ").concat(textColor) + " " : "") + _getClassName__default["default"]("content-wrapper ".concat(borderStyle, " ").concat(textColor, " ").concat(adStyle), _styleModuleImportMap)
|
|
258
|
-
}, slot ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
259
|
-
className: "wrapper-with-ads " + _getClassName__default["default"]("wrapper-with-ads ".concat(countStyleName), _styleModuleImportMap)
|
|
260
|
-
}, stories.slice(0, 4).map(function (story) {
|
|
261
|
-
return getAuthorCard(story);
|
|
262
|
-
})), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
263
|
-
className: "opinion-collection-m_ad-slot__2ZpaC"
|
|
264
|
-
}, slot)) : stories.map(function (story) {
|
|
265
|
-
return getAuthorCard(story);
|
|
266
|
-
})), getLoadMore({
|
|
267
|
-
isLoading: isLoading,
|
|
268
|
-
stories: stories,
|
|
269
|
-
getMoreStories: getMoreStories,
|
|
270
|
-
subsequentLoadCount: subsequentLoadCount
|
|
271
|
-
})));
|
|
272
|
-
};
|
|
273
|
-
OpinionCollectionBase.propTypes = {
|
|
274
|
-
collection: PropTypes__default["default"].object,
|
|
275
|
-
config: PropTypes__default["default"].shape({
|
|
276
|
-
collectionNameBorderColor: PropTypes__default["default"].string,
|
|
277
|
-
theme: PropTypes__default["default"].string,
|
|
278
|
-
collectionNameTemplate: PropTypes__default["default"].string,
|
|
279
|
-
footerButton: PropTypes__default["default"].string,
|
|
280
|
-
border: PropTypes__default["default"].string,
|
|
281
|
-
slotConfig: PropTypes__default["default"].array,
|
|
282
|
-
subsequentLoadCount: PropTypes__default["default"].number
|
|
283
|
-
}),
|
|
284
|
-
getMoreStories: PropTypes__default["default"].func,
|
|
285
|
-
isLoading: PropTypes__default["default"].bool,
|
|
286
|
-
isLoadMoreVisible: PropTypes__default["default"].bool,
|
|
287
|
-
isolatedLoadMore: PropTypes__default["default"].bool
|
|
288
|
-
};
|
|
289
|
-
OpinionCollectionBase.defaultProps = {
|
|
290
|
-
getMoreStories: function getMoreStories() {},
|
|
291
|
-
isLoadMoreVisible: true,
|
|
292
|
-
isLoading: false,
|
|
293
|
-
collection: {},
|
|
294
|
-
config: {},
|
|
295
|
-
hideFirstCard: false
|
|
296
|
-
};
|
|
297
|
-
var OpinionCollection = index$1.StateProvider(OpinionCollectionBase);
|
|
298
|
-
|
|
299
|
-
exports.OpinionCollection = OpinionCollection;
|
|
300
|
-
exports.OpinionCollectionBase = OpinionCollectionBase;
|