@quintype/arrow 3.15.1-perf.2 → 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.
Files changed (166) hide show
  1. package/cjs/index.js +14589 -0
  2. package/package.json +1 -1
  3. package/atoms/Author/index.js +0 -2250
  4. package/atoms/Author/styles.arrow.css +0 -1
  5. package/atoms/AuthorWithTime/index.js +0 -2954
  6. package/atoms/AuthorWithTime/styles.arrow.css +0 -1
  7. package/atoms/CollectionName/index.js +0 -2334
  8. package/atoms/CollectionName/styles.arrow.css +0 -1
  9. package/atoms/ExtendedLoadMore/index-0519e570.js +0 -243
  10. package/atoms/ExtendedLoadMore/index-1256e453.js +0 -175
  11. package/atoms/ExtendedLoadMore/index-1e444d20.js +0 -990
  12. package/atoms/ExtendedLoadMore/index-4356ce04.js +0 -282
  13. package/atoms/ExtendedLoadMore/index-81eb3978.js +0 -86
  14. package/atoms/ExtendedLoadMore/index-aba6b278.js +0 -166
  15. package/atoms/ExtendedLoadMore/index-ad3c83c3.js +0 -3023
  16. package/atoms/ExtendedLoadMore/index-beed3a68.js +0 -240
  17. package/atoms/ExtendedLoadMore/index-c2f73d18.js +0 -199
  18. package/atoms/ExtendedLoadMore/index-c61a16dc.js +0 -350
  19. package/atoms/ExtendedLoadMore/index-d0f6c865.js +0 -181
  20. package/atoms/ExtendedLoadMore/index-e4cf9cb7.js +0 -223
  21. package/atoms/ExtendedLoadMore/index-fd651f70.js +0 -175
  22. package/atoms/ExtendedLoadMore/index.js +0 -5
  23. package/atoms/ExtendedLoadMore/styles.arrow.css +0 -1
  24. package/atoms/Headline/index.js +0 -2459
  25. package/atoms/Headline/styles.arrow.css +0 -1
  26. package/atoms/HeroImage/index.js +0 -2475
  27. package/atoms/HeroImage/styles.arrow.css +0 -1
  28. package/atoms/LoadmoreButton/index.js +0 -2268
  29. package/atoms/LoadmoreButton/styles.arrow.css +0 -1
  30. package/atoms/ScrollSnap/index.js +0 -2531
  31. package/atoms/ScrollSnap/styles.arrow.css +0 -1
  32. package/atoms/SectionTag/index.js +0 -2220
  33. package/atoms/SectionTag/styles.arrow.css +0 -1
  34. package/atoms/Subheadline/index.js +0 -2200
  35. package/atoms/Subheadline/styles.arrow.css +0 -1
  36. package/atoms/TimeStamp/index.js +0 -2661
  37. package/atoms/TimeStamp/styles.arrow.css +0 -1
  38. package/molecules/KeyEvents/index.js +0 -2968
  39. package/molecules/KeyEvents/styles.arrow.css +0 -1
  40. package/molecules/PageIntroductionCard/index.js +0 -2676
  41. package/molecules/PageIntroductionCard/styles.arrow.css +0 -1
  42. package/molecules/SocialShareTemplate/index.js +0 -3093
  43. package/molecules/SocialShareTemplate/styles.arrow.css +0 -1
  44. package/molecules/StoryCard/index.js +0 -3938
  45. package/molecules/StoryCard/styles.arrow.css +0 -1
  46. package/molecules/StoryElementCard/index.js +0 -5832
  47. package/molecules/StoryElementCard/styles.arrow.css +0 -1
  48. package/molecules/StorycardContent/index.js +0 -3416
  49. package/molecules/StorycardContent/styles.arrow.css +0 -1
  50. package/rows/AlternateCollectionFilter/index.js +0 -4744
  51. package/rows/AlternateCollectionFilter/styles.arrow.css +0 -1
  52. package/rows/AsideCollection/index.js +0 -4690
  53. package/rows/AsideCollection/styles.arrow.css +0 -1
  54. package/rows/AstrologyCollection/index.js +0 -4661
  55. package/rows/AstrologyCollection/styles.arrow.css +0 -1
  56. package/rows/AuthorIntroductionCard/index.js +0 -3520
  57. package/rows/AuthorIntroductionCard/styles.arrow.css +0 -1
  58. package/rows/AuthorsList/index.js +0 -3715
  59. package/rows/AuthorsList/styles.arrow.css +0 -1
  60. package/rows/CollectionFilter/index.js +0 -4834
  61. package/rows/CollectionFilter/styles.arrow.css +0 -1
  62. package/rows/ElevenStories/index.js +0 -4638
  63. package/rows/ElevenStories/styles.arrow.css +0 -1
  64. package/rows/FourColFiveStories/index.js +0 -4359
  65. package/rows/FourColFiveStories/styles.arrow.css +0 -1
  66. package/rows/FourColGrid/index.js +0 -4584
  67. package/rows/FourColGrid/styles.arrow.css +0 -1
  68. package/rows/FourColPortraitStories/index.js +0 -4617
  69. package/rows/FourColPortraitStories/styles.arrow.css +0 -1
  70. package/rows/FourColSixteenStories/index.js +0 -4375
  71. package/rows/FourColSixteenStories/styles.arrow.css +0 -1
  72. package/rows/FourColTwelveStories/index.js +0 -4335
  73. package/rows/FourColTwelveStories/styles.arrow.css +0 -1
  74. package/rows/FourStorySlider/index.js +0 -4743
  75. package/rows/FourStorySlider/styles.arrow.css +0 -1
  76. package/rows/FourStorySliderPortrait/index.js +0 -4746
  77. package/rows/FourStorySliderPortrait/styles.arrow.css +0 -1
  78. package/rows/FourTabbedBigStorySlider/index.js +0 -4505
  79. package/rows/FourTabbedBigStorySlider/styles.arrow.css +0 -1
  80. package/rows/FullScreenSlider/index.js +0 -4661
  81. package/rows/FullScreenSlider/styles.arrow.css +0 -1
  82. package/rows/HalfScreenSlider/index.js +0 -4514
  83. package/rows/HalfScreenSlider/styles.arrow.css +0 -1
  84. package/rows/ListComponent/index.js +0 -4462
  85. package/rows/ListComponent/styles.arrow.css +0 -1
  86. package/rows/Listicles/index.js +0 -3131
  87. package/rows/Listicles/styles.arrow.css +0 -1
  88. package/rows/MagazineEditions/index.js +0 -3142
  89. package/rows/MagazineEditions/styles.arrow.css +0 -1
  90. package/rows/MagazineHeaderCard/index.js +0 -3136
  91. package/rows/MagazineHeaderCard/styles.arrow.css +0 -1
  92. package/rows/MagazineWidget/index.js +0 -4514
  93. package/rows/MagazineWidget/styles.arrow.css +0 -1
  94. package/rows/OneColStoryList/index.js +0 -4670
  95. package/rows/OneColStoryList/styles.arrow.css +0 -1
  96. package/rows/OpinionCollection/index.js +0 -4037
  97. package/rows/OpinionCollection/styles.arrow.css +0 -1
  98. package/rows/SixColSixStories/index.js +0 -4515
  99. package/rows/SixColSixStories/styles.arrow.css +0 -1
  100. package/rows/StoryCollection/index.js +0 -4690
  101. package/rows/StoryCollection/styles.arrow.css +0 -1
  102. package/rows/TagIntroductionCard/index.js +0 -1901
  103. package/rows/TagIntroductionCard/styles.arrow.css +0 -1
  104. package/rows/ThreeColFlexStories/index.js +0 -4575
  105. package/rows/ThreeColFlexStories/styles.arrow.css +0 -1
  106. package/rows/ThreeColFourteenStories/index.js +0 -4283
  107. package/rows/ThreeColFourteenStories/styles.arrow.css +0 -1
  108. package/rows/ThreeColGrid/index.js +0 -4605
  109. package/rows/ThreeColGrid/styles.arrow.css +0 -1
  110. package/rows/ThreeColSevenStory/index.js +0 -4502
  111. package/rows/ThreeColSevenStory/styles.arrow.css +0 -1
  112. package/rows/ThreeColSixStories/index.js +0 -4485
  113. package/rows/ThreeColSixStories/styles.arrow.css +0 -1
  114. package/rows/ThreeColTwelveStories/index.js +0 -4380
  115. package/rows/ThreeColTwelveStories/styles.arrow.css +0 -1
  116. package/rows/TwoColFourStories/index.js +0 -4463
  117. package/rows/TwoColFourStories/styles.arrow.css +0 -1
  118. package/rows/TwoColFourStoryHighlight/index.js +0 -4456
  119. package/rows/TwoColFourStoryHighlight/styles.arrow.css +0 -1
  120. package/rows/TwoColSevenStories/index.js +0 -4490
  121. package/rows/TwoColSevenStories/styles.arrow.css +0 -1
  122. package/rows/TwoColSixStories/index.js +0 -4489
  123. package/rows/TwoColSixStories/styles.arrow.css +0 -1
  124. package/rows/TwoColTenStoriesSidebar/index.js +0 -4549
  125. package/rows/TwoColTenStoriesSidebar/styles.arrow.css +0 -1
  126. package/rows/TwoColThreeStories/index.js +0 -4436
  127. package/rows/TwoColThreeStories/styles.arrow.css +0 -1
  128. package/story-elements/AlsoRead/index.js +0 -2457
  129. package/story-elements/AlsoRead/styles.arrow.css +0 -1
  130. package/story-elements/Attachment/index.js +0 -2013
  131. package/story-elements/Attachment/styles.arrow.css +0 -1
  132. package/story-elements/BigFact/index.js +0 -1983
  133. package/story-elements/BigFact/styles.arrow.css +0 -1
  134. package/story-elements/BlockQuote/index.js +0 -2431
  135. package/story-elements/BlockQuote/styles.arrow.css +0 -1
  136. package/story-elements/Blurb/index.js +0 -2094
  137. package/story-elements/Blurb/styles.arrow.css +0 -1
  138. package/story-elements/Image/index.js +0 -2711
  139. package/story-elements/Image/styles.arrow.css +0 -1
  140. package/story-elements/ImageGallery/index.js +0 -2644
  141. package/story-elements/ImageGallery/styles.arrow.css +0 -1
  142. package/story-elements/ImageSlideshow/index.js +0 -2955
  143. package/story-elements/ImageSlideshow/styles.arrow.css +0 -1
  144. package/story-elements/QuestionAnswer/index.js +0 -2395
  145. package/story-elements/QuestionAnswer/styles.arrow.css +0 -1
  146. package/story-elements/Quote/index.js +0 -2012
  147. package/story-elements/Quote/styles.arrow.css +0 -1
  148. package/story-elements/Reference/index.js +0 -2006
  149. package/story-elements/Reference/styles.arrow.css +0 -1
  150. package/story-elements/StoryElement/index.js +0 -1779
  151. package/story-elements/Summary/index.js +0 -2036
  152. package/story-elements/Summary/styles.arrow.css +0 -1
  153. package/story-elements/Text/index.js +0 -2293
  154. package/story-elements/Text/styles.arrow.css +0 -1
  155. package/story-elements/Video/index.js +0 -1785
  156. package/story-elements/Video/styles.arrow.css +0 -1
  157. package/story-templates/ListicleStoryTemplate/index.js +0 -8442
  158. package/story-templates/ListicleStoryTemplate/styles.arrow.css +0 -1
  159. package/story-templates/LiveBlogStoryTemplate/index.js +0 -8618
  160. package/story-templates/LiveBlogStoryTemplate/styles.arrow.css +0 -1
  161. package/story-templates/PhotoStoryTemplate/index.js +0 -8420
  162. package/story-templates/PhotoStoryTemplate/styles.arrow.css +0 -1
  163. package/story-templates/TextStoryTemplate/index.js +0 -8493
  164. package/story-templates/TextStoryTemplate/styles.arrow.css +0 -1
  165. package/story-templates/VideoStoryTemplate/index.js +0 -8352
  166. package/story-templates/VideoStoryTemplate/styles.arrow.css +0 -1
@@ -1,282 +0,0 @@
1
- import { C as CollectionName, b as Author, H as Headline, A as AuthorWithTime, S as StateProvider, _ as _defineProperty, L as LoadMoreTarget, P as ProgressiveHydration, a as LoadmoreButton } from './index-1e444d20.js';
2
- import { _ as _getClassName, a as get_1, g as getTextColor, l as getSlot, b as generateNavigateSlug, n as navigateTo } from './index-ad3c83c3.js';
3
- import React from 'react';
4
- import { useDispatch, useSelector } from 'react-redux';
5
- import PropTypes from 'prop-types';
6
- import { Link, ResponsiveImage, collectionToStories } from '@quintype/components';
7
- import 'react-dom';
8
- import 'react-timeago';
9
- import 'date-fns-tz';
10
-
11
- var UserFallbackIcon = function UserFallbackIcon(_ref) {
12
- var _ref$width = _ref.width,
13
- width = _ref$width === void 0 ? 120 : _ref$width,
14
- _ref$height = _ref.height,
15
- height = _ref$height === void 0 ? 120 : _ref$height;
16
- return /*#__PURE__*/React.createElement("svg", {
17
- width: width,
18
- height: height,
19
- viewBox: "0 0 120 120",
20
- xmlns: "http://www.w3.org/2000/svg"
21
- }, /*#__PURE__*/React.createElement("path", {
22
- 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",
23
- fill: "#DADADA",
24
- fillRule: "nonzero"
25
- }));
26
- };
27
- UserFallbackIcon.propTypes = {
28
- width: PropTypes.object,
29
- height: PropTypes.object
30
- };
31
-
32
- var _styleModuleImportMap$1 = {
33
- "./author-image.m.css": {
34
- "viewports": "\"../../../../assets/stylesheets/viewports.m.css\"",
35
- "mobile": "768px",
36
- "tablet": "992px",
37
- "image-container": "author-image-m_image-container__19WNd",
38
- "author-image": "author-image-m_author-image__D8GMB",
39
- "square": "author-image-m_square__bjK7M",
40
- "small-circle": "author-image-m_small-circle__DbQMN",
41
- "smaller-circle": "author-image-m_smaller-circle__2yMOZ"
42
- }
43
- };
44
-
45
- var authorWithImage = function authorWithImage(author, templateStyle) {
46
- var avatarUrl = author["avatar-url"],
47
- avatarS3Key = author["avatar-s3-key"],
48
- name = author.name;
49
- return /*#__PURE__*/React.createElement("div", {
50
- "data-test-id": "author-image",
51
- className: "arr--author-image " + _getClassName("author-image ".concat(templateStyle), _styleModuleImportMap$1)
52
- }, /*#__PURE__*/React.createElement("figure", {
53
- className: "author-image-m_image-container__19WNd"
54
- }, avatarS3Key ? /*#__PURE__*/React.createElement(ResponsiveImage, {
55
- slug: avatarS3Key,
56
- alt: name,
57
- defaultWidth: 250,
58
- widths: [250, 480],
59
- aspectRatio: [[1, 1], [1, 1]],
60
- sizes: "98vw",
61
- imgParams: {
62
- auto: ["format", "compress"]
63
- }
64
- }) : avatarUrl ? /*#__PURE__*/React.createElement("img", {
65
- src: avatarUrl
66
- }) : /*#__PURE__*/React.createElement(UserFallbackIcon, null)));
67
- };
68
-
69
- var AuthorImage = function AuthorImage(_ref) {
70
- var _ref$author = _ref.author,
71
- author = _ref$author === void 0 ? {} : _ref$author,
72
- _ref$template = _ref.template,
73
- template = _ref$template === void 0 ? "" : _ref$template,
74
- _ref$config = _ref.config,
75
- config = _ref$config === void 0 ? {} : _ref$config;
76
- var slug = author.slug;
77
- var mountAt = config.mountAt || "";
78
- var templateStyle = "";
79
- if (template === "smallerCircle") templateStyle = "smaller-circle";else if (template === "smallCircle") templateStyle = "small-circle";else if (template === "square") templateStyle = "square";
80
- if (slug) return /*#__PURE__*/React.createElement(Link, {
81
- href: "".concat(mountAt, "/author/") + slug
82
- }, authorWithImage(author, templateStyle));else return authorWithImage(author, templateStyle);
83
- };
84
-
85
- AuthorImage.propTypes = {
86
- author: PropTypes.shape({
87
- "avatar-url": PropTypes.string,
88
- "avatar-s3-key": PropTypes.string,
89
- name: PropTypes.string,
90
- slug: PropTypes.string
91
- }),
92
- template: PropTypes.string
93
- };
94
-
95
- var _styleModuleImportMap = {
96
- "./opinion-collection.m.css": {
97
- "viewports": "\"../../../../assets/stylesheets/viewports.m.css\"",
98
- "mobile": "768px",
99
- "desktop": "1025px",
100
- "opinion-collection": "opinion-collection-m_opinion-collection__1Bc7h",
101
- "content-wrapper": "opinion-collection-m_content-wrapper__y32PE",
102
- "custom-grid": "opinion-collection-m_custom-grid__33uRh",
103
- "wrapper-with-ads": "opinion-collection-m_wrapper-with-ads__2daVe",
104
- "ad-slot": "opinion-collection-m_ad-slot__2ZpaC",
105
- "headline-author": "opinion-collection-m_headline-author__2H6Tv",
106
- "border": "opinion-collection-m_border__38tun",
107
- "light": "opinion-collection-m_light__2Hent",
108
- "dark": "opinion-collection-m_dark__WMRNF",
109
- "count-3": "opinion-collection-m_count-3__3cQUB",
110
- "count-2": "opinion-collection-m_count-2__2e7g_"
111
- }
112
- };
113
-
114
- 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; }
115
-
116
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
117
-
118
- var loadMore = function loadMore(_ref) {
119
- var isLoading = _ref.isLoading,
120
- renderStories = _ref.renderStories,
121
- getMoreStories = _ref.getMoreStories,
122
- _ref$subsequentLoadCo = _ref.subsequentLoadCount,
123
- subsequentLoadCount = _ref$subsequentLoadCo === void 0 ? 3 : _ref$subsequentLoadCo;
124
- if (isLoading) return;
125
- var limit = subsequentLoadCount;
126
- var offset = renderStories.length;
127
- getMoreStories(offset, limit);
128
- };
129
-
130
- var OpinionCollectionBase = function OpinionCollectionBase(_ref2) {
131
- var collection = _ref2.collection,
132
- config = _ref2.config,
133
- getMoreStories = _ref2.getMoreStories,
134
- isLoadMoreVisible = _ref2.isLoadMoreVisible,
135
- isLoading = _ref2.isLoading,
136
- isolatedLoadMore = _ref2.isolatedLoadMore;
137
- var stories = collectionToStories(collection);
138
- var _config$theme = config.theme,
139
- theme = _config$theme === void 0 ? "" : _config$theme,
140
- _config$footerButton = config.footerButton,
141
- footerButton = _config$footerButton === void 0 ? "" : _config$footerButton,
142
- _config$border = config.border,
143
- border = _config$border === void 0 ? "fullBorder" : _config$border,
144
- _config$collectionNam = config.collectionNameBorderColor,
145
- collectionNameBorderColor = _config$collectionNam === void 0 ? "" : _config$collectionNam,
146
- _config$collectionNam2 = config.collectionNameTemplate,
147
- collectionNameTemplate = _config$collectionNam2 === void 0 ? "" : _config$collectionNam2,
148
- _config$slotConfig = config.slotConfig,
149
- slotConfig = _config$slotConfig === void 0 ? [] : _config$slotConfig,
150
- _config$subsequentLoa = config.subsequentLoadCount,
151
- subsequentLoadCount = _config$subsequentLoa === void 0 ? 3 : _config$subsequentLoa;
152
-
153
- var _get = get_1(slotConfig, [0], {}),
154
- _get$type = _get.type,
155
- type = _get$type === void 0 ? "story" : _get$type,
156
- _get$component = _get.component,
157
- component = _get$component === void 0 ? null : _get$component;
158
-
159
- var dispatch = useDispatch();
160
- var qtConfig = useSelector(function (state) {
161
- return get_1(state, ["qt", "config"], {});
162
- });
163
- if (!stories.length) return null;
164
- var textColor = getTextColor(theme);
165
- var borderStyle = border === "fullBorder" ? "border" : "";
166
- var slot = type === "ad" ? getSlot(type, component) : null;
167
- var adStyle = slot ? "custom-grid" : "";
168
-
169
- var getLoadMore = function getLoadMore(opts) {
170
- if (!isLoadMoreVisible) return null;
171
-
172
- if (isolatedLoadMore) {
173
- return /*#__PURE__*/React.createElement(LoadMoreTarget, {
174
- collection: collection,
175
- componentName: "OpinionCollection",
176
- offset: stories.length,
177
- limit: subsequentLoadCount
178
- });
179
- }
180
-
181
- var url = generateNavigateSlug(collection, qtConfig);
182
- return /*#__PURE__*/React.createElement(ProgressiveHydration, null, /*#__PURE__*/React.createElement(LoadmoreButton, {
183
- config: config,
184
- collection: collection,
185
- template: footerButton,
186
- onClick: function onClick() {
187
- return loadMore(opts);
188
- },
189
- navigate: function navigate() {
190
- return navigateTo(dispatch, url);
191
- },
192
- qtConfig: qtConfig
193
- }));
194
- };
195
-
196
- var getAuthorCard = function getAuthorCard(story) {
197
- var authorData = get_1(story, ["authors", "0"]);
198
- return /*#__PURE__*/React.createElement("div", {
199
- "data-test-id": "story-card"
200
- }, /*#__PURE__*/React.createElement(Author, {
201
- story: story,
202
- hideAuthorImage: true
203
- }), /*#__PURE__*/React.createElement("div", {
204
- className: "opinion-collection-m_headline-author__2H6Tv"
205
- }, /*#__PURE__*/React.createElement(Headline, {
206
- story: story
207
- }), /*#__PURE__*/React.createElement(AuthorImage, {
208
- author: authorData,
209
- template: "smallerCircle",
210
- config: config
211
- })), /*#__PURE__*/React.createElement(AuthorWithTime, {
212
- story: story,
213
- config: _objectSpread(_objectSpread({}, config), {}, {
214
- disableMeridiem: true,
215
- showAuthor: false
216
- })
217
- }));
218
- };
219
-
220
- var countStyleName = stories.length === 2 || stories.length === 3 ? "count-".concat(stories.length) : "";
221
- return /*#__PURE__*/React.createElement("div", {
222
- className: "full-width-with-padding arrow-component",
223
- "data-test-id": "opinion-collection",
224
- style: {
225
- backgroundColor: theme,
226
- color: textColor
227
- }
228
- }, /*#__PURE__*/React.createElement("div", {
229
- className: "opinion-collection-m_opinion-collection__1Bc7h",
230
- style: {
231
- backgroundColor: theme,
232
- color: textColor
233
- }
234
- }, /*#__PURE__*/React.createElement(CollectionName, {
235
- collection: collection,
236
- collectionNameTemplate: collectionNameTemplate,
237
- collectionNameBorderColor: collectionNameBorderColor,
238
- headerLevel: 2
239
- }), /*#__PURE__*/React.createElement("div", {
240
- className: ("content-wrapper ".concat(borderStyle, " ").concat(textColor) ? "content-wrapper ".concat(borderStyle, " ").concat(textColor) + " " : "") + _getClassName("content-wrapper ".concat(borderStyle, " ").concat(textColor, " ").concat(adStyle), _styleModuleImportMap)
241
- }, slot ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
242
- className: "wrapper-with-ads " + _getClassName("wrapper-with-ads ".concat(countStyleName), _styleModuleImportMap)
243
- }, stories.slice(0, 4).map(function (story) {
244
- return getAuthorCard(story);
245
- })), /*#__PURE__*/React.createElement("div", {
246
- className: "opinion-collection-m_ad-slot__2ZpaC"
247
- }, slot)) : stories.map(function (story) {
248
- return getAuthorCard(story);
249
- })), getLoadMore({
250
- isLoading: isLoading,
251
- stories: stories,
252
- getMoreStories: getMoreStories,
253
- subsequentLoadCount: subsequentLoadCount
254
- })));
255
- };
256
- OpinionCollectionBase.propTypes = {
257
- collection: PropTypes.object,
258
- config: PropTypes.shape({
259
- collectionNameBorderColor: PropTypes.string,
260
- theme: PropTypes.string,
261
- collectionNameTemplate: PropTypes.string,
262
- footerButton: PropTypes.string,
263
- border: PropTypes.string,
264
- slotConfig: PropTypes.array,
265
- subsequentLoadCount: PropTypes.number
266
- }),
267
- getMoreStories: PropTypes.func,
268
- isLoading: PropTypes.bool,
269
- isLoadMoreVisible: PropTypes.bool,
270
- isolatedLoadMore: PropTypes.bool
271
- };
272
- OpinionCollectionBase.defaultProps = {
273
- getMoreStories: function getMoreStories() {},
274
- isLoadMoreVisible: true,
275
- isLoading: false,
276
- collection: {},
277
- config: {},
278
- hideFirstCard: false
279
- };
280
- var OpinionCollection = StateProvider(OpinionCollectionBase);
281
-
282
- export { OpinionCollection, OpinionCollectionBase };
@@ -1,86 +0,0 @@
1
- import { g as getTextColor, r as rgbToHex, _ as _getClassName } from './index-ad3c83c3.js';
2
- import React from 'react';
3
- import { H as Headline, A as AuthorWithTime } from './index-1e444d20.js';
4
- import { S as SectionTag } from './index-c61a16dc.js';
5
- import PropTypes from 'prop-types';
6
-
7
- var _styleModuleImportMap = {
8
- "./storycardContent.m.css": {
9
- "wrapper": "storycardContent-m_wrapper__TEmfA",
10
- "horizontal-content-wrapper": "storycardContent-m_horizontal-content-wrapper__NgpuC",
11
- "border-full": "storycardContent-m_border-full__2km37"
12
- }
13
- };
14
- var StorycardContent = function StorycardContent(_ref) {
15
- var story = _ref.story,
16
- children = _ref.children,
17
- theme = _ref.theme,
18
- border = _ref.border,
19
- isHorizontalMobile = _ref.isHorizontalMobile,
20
- headerLevel = _ref.headerLevel,
21
- borderColor = _ref.borderColor,
22
- config = _ref.config;
23
- var textColor = getTextColor(theme);
24
- var borderOptions = ["full"];
25
- var SectionTagborderColor = rgbToHex(borderColor);
26
- var borderTemplate = borderOptions.includes(border) ? "border-".concat(border) : "";
27
- var horizontalCard = isHorizontalMobile ? "horizontal-content-wrapper" : "";
28
- return /*#__PURE__*/React.createElement("div", {
29
- "data-test-id": "story-card-content",
30
- style: {
31
- backgroundColor: theme,
32
- color: textColor
33
- },
34
- className: "arr--content-wrapper " + _getClassName("wrapper ".concat(borderTemplate, " ").concat(horizontalCard), _styleModuleImportMap)
35
- }, children || /*#__PURE__*/React.createElement(DefaultStoryCardContent, {
36
- story: story,
37
- headerLevel: headerLevel,
38
- isHorizontalMobile: isHorizontalMobile,
39
- borderColor: SectionTagborderColor,
40
- config: config
41
- }));
42
- };
43
-
44
- var DefaultStoryCardContent = function DefaultStoryCardContent(_ref2) {
45
- var story = _ref2.story,
46
- headerLevel = _ref2.headerLevel,
47
- borderColor = _ref2.borderColor,
48
- _ref2$config = _ref2.config,
49
- config = _ref2$config === void 0 ? {} : _ref2$config;
50
- var SectionTagborderColor = rgbToHex(borderColor);
51
- var _config$localizationC = config.localizationConfig,
52
- localizationConfig = _config$localizationC === void 0 ? {} : _config$localizationC;
53
- return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(SectionTag, {
54
- story: story,
55
- borderColor: SectionTagborderColor
56
- }), /*#__PURE__*/React.createElement(Headline, {
57
- story: story,
58
- headerLevel: headerLevel,
59
- premiumStoryIconConfig: config
60
- }), /*#__PURE__*/React.createElement(AuthorWithTime, {
61
- config: localizationConfig,
62
- story: story
63
- }));
64
- };
65
-
66
- DefaultStoryCardContent.propTypes = {
67
- story: PropTypes.object.isRequired,
68
- border: PropTypes.string,
69
- theme: PropTypes.string,
70
- isHorizontalMobile: PropTypes.bool,
71
- headerLevel: PropTypes.string,
72
- borderColor: PropTypes.string,
73
- config: PropTypes.object
74
- };
75
- StorycardContent.propTypes = {
76
- story: PropTypes.object.isRequired,
77
- children: PropTypes.node,
78
- theme: PropTypes.string,
79
- border: PropTypes.string,
80
- isHorizontalMobile: PropTypes.bool,
81
- headerLevel: PropTypes.string,
82
- borderColor: PropTypes.string,
83
- config: PropTypes.object
84
- };
85
-
86
- export { StorycardContent as S };
@@ -1,166 +0,0 @@
1
- import React, { Fragment } from 'react';
2
- import { S as StoryCard } from './index-0519e570.js';
3
- import { S as StorycardContent } from './index-81eb3978.js';
4
- import { H as HeroImage } from './index-c61a16dc.js';
5
- import { g as getTextColor, a as get_1, b as generateNavigateSlug, n as navigateTo } from './index-ad3c83c3.js';
6
- import { C as CollectionName, S as StateProvider, L as LoadMoreTarget, P as ProgressiveHydration, a as LoadmoreButton } from './index-1e444d20.js';
7
- import { collectionToStories } from '@quintype/components';
8
- import PropTypes from 'prop-types';
9
- import { useDispatch, useSelector } from 'react-redux';
10
- import 'react-timeago';
11
- import 'date-fns-tz';
12
- import 'react-dom';
13
-
14
- var loadMore = function loadMore(_ref) {
15
- var isLoading = _ref.isLoading,
16
- storyItems = _ref.storyItems,
17
- getMoreStories = _ref.getMoreStories,
18
- _ref$subsequentLoadCo = _ref.subsequentLoadCount,
19
- subsequentLoadCount = _ref$subsequentLoadCo === void 0 ? 4 : _ref$subsequentLoadCo;
20
- if (isLoading) return; // prevent multiple clicks/calls
21
-
22
- var limit = subsequentLoadCount;
23
- var offset = storyItems.length;
24
- getMoreStories(offset, limit);
25
- };
26
-
27
- var FourColGridBase = function FourColGridBase(_ref2) {
28
- var collection = _ref2.collection,
29
- _ref2$config = _ref2.config,
30
- config = _ref2$config === void 0 ? {} : _ref2$config,
31
- getMoreStories = _ref2.getMoreStories,
32
- isLoadMoreVisible = _ref2.isLoadMoreVisible,
33
- isLoading = _ref2.isLoading,
34
- isolatedLoadMore = _ref2.isolatedLoadMore;
35
- var _config$collectionNam = config.collectionNameBorderColor,
36
- collectionNameBorderColor = _config$collectionNam === void 0 ? "" : _config$collectionNam,
37
- _config$borderColor = config.borderColor,
38
- borderColor = _config$borderColor === void 0 ? "" : _config$borderColor,
39
- _config$theme = config.theme,
40
- theme = _config$theme === void 0 ? "" : _config$theme,
41
- _config$border = config.border,
42
- border = _config$border === void 0 ? "" : _config$border,
43
- _config$collectionNam2 = config.collectionNameTemplate,
44
- collectionNameTemplate = _config$collectionNam2 === void 0 ? "" : _config$collectionNam2,
45
- _config$footerSlotCon = config.footerSlotConfig,
46
- footerSlotConfig = _config$footerSlotCon === void 0 ? {} : _config$footerSlotCon,
47
- _config$footerButton = config.footerButton,
48
- footerButton = _config$footerButton === void 0 ? "" : _config$footerButton,
49
- customCollectionName = config.customCollectionName,
50
- _config$navigate = config.navigate,
51
- navigate = _config$navigate === void 0 ? true : _config$navigate,
52
- _config$subsequentLoa = config.subsequentLoadCount,
53
- subsequentLoadCount = _config$subsequentLoa === void 0 ? 4 : _config$subsequentLoa;
54
- var storyItems = collectionToStories(collection);
55
- if (!storyItems.length) return null;
56
- var footerSlot = footerSlotConfig.footerSlot;
57
- var footerSlotComp = footerSlot ? footerSlot() : null;
58
- var textColor = getTextColor(theme);
59
- var dispatch = useDispatch();
60
- var qtConfig = useSelector(function (state) {
61
- return get_1(state, ["qt", "config"], {});
62
- });
63
-
64
- var getLoadMore = function getLoadMore(opts) {
65
- if (!isLoadMoreVisible) return null;
66
-
67
- if (isolatedLoadMore) {
68
- return /*#__PURE__*/React.createElement(LoadMoreTarget, {
69
- collection: collection,
70
- componentName: "FourColGrid",
71
- offset: storyItems.length,
72
- limit: subsequentLoadCount
73
- });
74
- }
75
-
76
- var url = generateNavigateSlug(collection, qtConfig);
77
- return /*#__PURE__*/React.createElement(ProgressiveHydration, null, /*#__PURE__*/React.createElement(LoadmoreButton, {
78
- config: config,
79
- collection: collection,
80
- template: footerButton,
81
- onClick: function onClick() {
82
- return loadMore(opts);
83
- },
84
- navigate: function navigate() {
85
- return navigateTo(dispatch, url);
86
- },
87
- qtConfig: qtConfig
88
- }));
89
- };
90
-
91
- return /*#__PURE__*/React.createElement("div", {
92
- className: "full-width-with-padding arrow-component",
93
- "data-test-id": "four-col-grid",
94
- style: {
95
- backgroundColor: theme,
96
- color: textColor
97
- }
98
- }, /*#__PURE__*/React.createElement("div", {
99
- className: "four-col-m_four-col-grid__1EiO7"
100
- }, /*#__PURE__*/React.createElement(CollectionName, {
101
- collection: collection,
102
- collectionNameTemplate: collectionNameTemplate,
103
- collectionNameBorderColor: collectionNameBorderColor,
104
- customCollectionName: customCollectionName,
105
- navigate: navigate
106
- }), /*#__PURE__*/React.createElement("div", {
107
- className: "four-col-m_wrapper__1vOV7"
108
- }, storyItems.map(function (story, index) {
109
- return /*#__PURE__*/React.createElement(Fragment, {
110
- key: "story-4col-".concat(index, "-").concat(get_1(story, ["id"], "0"))
111
- }, /*#__PURE__*/React.createElement("div", {
112
- className: "four-col-m_story-card-wrapper__1e8p0",
113
- key: "default-".concat(index)
114
- }, /*#__PURE__*/React.createElement(StoryCard, {
115
- story: story,
116
- border: border,
117
- theme: theme,
118
- isHorizontalMobile: true,
119
- config: config
120
- }, /*#__PURE__*/React.createElement(HeroImage, {
121
- aspectRatio: [[16, 9]],
122
- story: story,
123
- isHorizontalMobile: true
124
- }), /*#__PURE__*/React.createElement(StorycardContent, {
125
- theme: theme,
126
- border: border,
127
- borderColor: borderColor,
128
- story: story,
129
- isHorizontalMobile: true,
130
- config: config
131
- }))));
132
- })), getLoadMore({
133
- isLoading: isLoading,
134
- storyItems: storyItems,
135
- getMoreStories: getMoreStories,
136
- subsequentLoadCount: subsequentLoadCount
137
- }), footerSlotComp));
138
- };
139
- FourColGridBase.propTypes = {
140
- /** collection is the array of objects which is returning by API */
141
- collection: PropTypes.object.isRequired,
142
-
143
- /** The config for the Row */
144
- config: PropTypes.shape({
145
- borderColor: PropTypes.string,
146
- theme: PropTypes.string,
147
- border: PropTypes.bool,
148
- slotConfig: PropTypes.array,
149
- collectionNameTemplate: PropTypes.string,
150
- footerButton: PropTypes.string,
151
- collectionNameBorderColor: PropTypes.string,
152
- subsequentLoadCount: PropTypes.number
153
- }),
154
- getMoreStories: PropTypes.func,
155
- isLoadMoreVisible: PropTypes.bool,
156
- isLoading: PropTypes.bool,
157
- isolatedLoadMore: PropTypes.bool
158
- };
159
- FourColGridBase.defaultProps = {
160
- getMoreStories: function getMoreStories() {},
161
- isLoadMoreVisible: true,
162
- isLoading: false
163
- };
164
- var FourColGrid = StateProvider(FourColGridBase);
165
-
166
- export { FourColGrid, FourColGridBase };