@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.
Files changed (97) hide show
  1. package/atoms/Author/index.js +38 -29
  2. package/atoms/AuthorWithTime/index.js +83 -73
  3. package/atoms/CollectionName/index.js +40 -30
  4. package/atoms/ExtendedLoadMore/{index-4577d5b9.js → index-3976fac4.js} +62 -55
  5. package/atoms/ExtendedLoadMore/{index-0edaa434.js → index-3c4ac692.js} +243 -208
  6. package/atoms/ExtendedLoadMore/index-4ddfe28d.js +93 -0
  7. package/atoms/ExtendedLoadMore/{index-70ce7471.js → index-5c8eda4a.js} +88 -80
  8. package/atoms/ExtendedLoadMore/{index-b3ef1488.js → index-6e083738.js} +63 -56
  9. package/atoms/ExtendedLoadMore/{index-48664b07.js → index-6ecceae4.js} +61 -54
  10. package/atoms/ExtendedLoadMore/{index-4c3c2b6f.js → index-9e0d32b7.js} +79 -72
  11. package/atoms/ExtendedLoadMore/{index-c47ff5bc.js → index-a5c95f84.js} +73 -66
  12. package/atoms/ExtendedLoadMore/{index-4b9207c4.js → index-b22f1843.js} +70 -62
  13. package/atoms/ExtendedLoadMore/{index-8f6483ba.js → index-b5936059.js} +75 -68
  14. package/atoms/ExtendedLoadMore/{index-b841407e.js → index-bc129cb8.js} +60 -53
  15. package/atoms/ExtendedLoadMore/{index-d08b6c2f.js → index-e7cde739.js} +74 -46
  16. package/atoms/ExtendedLoadMore/{index-867b9437.js → index-fee73a14.js} +67 -61
  17. package/atoms/ExtendedLoadMore/index.js +13 -5
  18. package/atoms/ExtendedLoadMore/styles.arrow.css +1 -1
  19. package/atoms/Headline/index.js +85 -76
  20. package/atoms/HeroImage/index.js +69 -60
  21. package/atoms/LoadmoreButton/index.js +32 -23
  22. package/atoms/ScrollSnap/index.js +72 -63
  23. package/atoms/SectionTag/index.js +34 -25
  24. package/atoms/Subheadline/index.js +31 -22
  25. package/atoms/TimeStamp/index.js +34 -24
  26. package/molecules/KeyEvents/index.js +75 -66
  27. package/molecules/PageIntroductionCard/index.js +43 -34
  28. package/molecules/SocialShareTemplate/index.js +97 -88
  29. package/molecules/StoryCard/index.js +242 -232
  30. package/molecules/StoryElementCard/index.js +512 -483
  31. package/molecules/StorycardContent/index.js +172 -162
  32. package/package.json +1 -1
  33. package/rows/AlternateCollectionFilter/index.js +349 -339
  34. package/rows/AsideCollection/index.js +346 -340
  35. package/rows/AstrologyCollection/index.js +325 -315
  36. package/rows/AuthorIntroductionCard/index.js +157 -150
  37. package/rows/AuthorsList/index.js +187 -180
  38. package/rows/CollectionFilter/index.js +365 -355
  39. package/rows/ElevenStories/index.js +360 -351
  40. package/rows/FourColFiveStories/index.js +308 -279
  41. package/rows/FourColGrid/index.js +355 -326
  42. package/rows/FourColPortraitStories/index.js +364 -336
  43. package/rows/FourColSixteenStories/index.js +291 -281
  44. package/rows/FourColTwelveStories/index.js +318 -308
  45. package/rows/FourStorySlider/index.js +362 -352
  46. package/rows/FourStorySliderPortrait/index.js +363 -353
  47. package/rows/FourTabbedBigStorySlider/index.js +325 -314
  48. package/rows/FullScreenSlider/index.js +339 -330
  49. package/rows/HalfScreenSlider/index.js +311 -302
  50. package/rows/ListComponent/index.js +325 -315
  51. package/rows/Listicles/index.js +154 -145
  52. package/rows/MagazineEditions/index.js +107 -98
  53. package/rows/MagazineHeaderCard/index.js +107 -98
  54. package/rows/MagazineWidget/index.js +329 -320
  55. package/rows/OneColStoryList/index.js +369 -340
  56. package/rows/OpinionCollection/index.js +254 -225
  57. package/rows/SixColSixStories/index.js +337 -308
  58. package/rows/StoryCollection/index.js +346 -340
  59. package/rows/TagIntroductionCard/index.js +30 -23
  60. package/rows/ThreeColFlexStories/index.js +352 -323
  61. package/rows/ThreeColFourteenStories/index.js +288 -278
  62. package/rows/ThreeColGrid/index.js +356 -327
  63. package/rows/ThreeColSevenStory/index.js +325 -316
  64. package/rows/ThreeColSixStories/index.js +326 -316
  65. package/rows/ThreeColTwelveStories/index.js +305 -295
  66. package/rows/TwoColFourStories/index.js +319 -308
  67. package/rows/TwoColFourStoryHighlight/index.js +320 -309
  68. package/rows/TwoColSevenStories/index.js +326 -315
  69. package/rows/TwoColSixStories/index.js +319 -310
  70. package/rows/TwoColTenStoriesSidebar/index.js +341 -330
  71. package/rows/TwoColThreeStories/index.js +319 -308
  72. package/story-elements/AlsoRead/index.js +70 -61
  73. package/story-elements/Attachment/index.js +40 -31
  74. package/story-elements/BigFact/index.js +35 -26
  75. package/story-elements/BlockQuote/index.js +61 -51
  76. package/story-elements/Blurb/index.js +36 -27
  77. package/story-elements/Image/index.js +113 -86
  78. package/story-elements/ImageGallery/index.js +98 -71
  79. package/story-elements/ImageSlideshow/index.js +147 -120
  80. package/story-elements/QuestionAnswer/index.js +55 -46
  81. package/story-elements/Quote/index.js +37 -28
  82. package/story-elements/Reference/index.js +40 -31
  83. package/story-elements/StoryElement/index.js +28 -19
  84. package/story-elements/Summary/index.js +40 -31
  85. package/story-elements/Text/index.js +34 -25
  86. package/story-elements/Video/index.js +29 -20
  87. package/{rows → story-templates}/ListicleStoryTemplate/index.js +947 -926
  88. package/{rows → story-templates}/ListicleStoryTemplate/styles.arrow.css +0 -0
  89. package/{rows → story-templates}/LiveBlogStoryTemplate/index.js +952 -931
  90. package/{rows → story-templates}/LiveBlogStoryTemplate/styles.arrow.css +0 -0
  91. package/{rows → story-templates}/PhotoStoryTemplate/index.js +922 -901
  92. package/{rows → story-templates}/PhotoStoryTemplate/styles.arrow.css +0 -0
  93. package/{rows → story-templates}/TextStoryTemplate/index.js +941 -920
  94. package/{rows → story-templates}/TextStoryTemplate/styles.arrow.css +0 -0
  95. package/{rows → story-templates}/VideoStoryTemplate/index.js +907 -886
  96. package/{rows → story-templates}/VideoStoryTemplate/styles.arrow.css +0 -0
  97. package/atoms/ExtendedLoadMore/index-96c36b0e.js +0 -86
@@ -1,15 +1,22 @@
1
- import React, { Fragment } from 'react';
2
- import { S as StoryCard } from './index-4b9207c4.js';
3
- import { S as StorycardContent } from './index-96c36b0e.js';
4
- import { H as HeroImage } from './index-70ce7471.js';
5
- import { g as getTextColor, a as get_1, b as generateNavigateSlug, n as navigateTo } from './index-d08b6c2f.js';
6
- import { S as StateProvider, C as CollectionName, L as LoadMoreTarget, P as ProgressiveHydration, a as LoadmoreButton } from './index-0edaa434.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';
1
+ 'use strict';
2
+
3
+ var React = require('react');
4
+ var index$2 = require('./index-b22f1843.js');
5
+ var index$4 = require('./index-4ddfe28d.js');
6
+ var index$3 = require('./index-5c8eda4a.js');
7
+ var index = require('./index-e7cde739.js');
8
+ var index$1 = require('./index-3c4ac692.js');
9
+ var components = require('@quintype/components');
10
+ var PropTypes = require('prop-types');
11
+ var reactRedux = require('react-redux');
12
+ require('react-timeago');
13
+ require('date-fns-tz');
14
+ require('react-dom');
15
+
16
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
17
+
18
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
19
+ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
13
20
 
14
21
  var loadMore = function loadMore(_ref) {
15
22
  var isLoading = _ref.isLoading,
@@ -24,7 +31,7 @@ var loadMore = function loadMore(_ref) {
24
31
  getMoreStories(offset, limit);
25
32
  };
26
33
 
27
- var FourColGrid = function FourColGrid(_ref2) {
34
+ var FourColGridBase = function FourColGridBase(_ref2) {
28
35
  var collection = _ref2.collection,
29
36
  _ref2$config = _ref2.config,
30
37
  config = _ref2$config === void 0 ? {} : _ref2$config,
@@ -51,21 +58,21 @@ var FourColGrid = function FourColGrid(_ref2) {
51
58
  navigate = _config$navigate === void 0 ? true : _config$navigate,
52
59
  _config$subsequentLoa = config.subsequentLoadCount,
53
60
  subsequentLoadCount = _config$subsequentLoa === void 0 ? 4 : _config$subsequentLoa;
54
- var storyItems = collectionToStories(collection);
61
+ var storyItems = components.collectionToStories(collection);
55
62
  if (!storyItems.length) return null;
56
63
  var footerSlot = footerSlotConfig.footerSlot;
57
64
  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"], {});
65
+ var textColor = index.getTextColor(theme);
66
+ var dispatch = reactRedux.useDispatch();
67
+ var qtConfig = reactRedux.useSelector(function (state) {
68
+ return index.get_1(state, ["qt", "config"], {});
62
69
  });
63
70
 
64
71
  var getLoadMore = function getLoadMore(opts) {
65
72
  if (!isLoadMoreVisible) return null;
66
73
 
67
74
  if (isolatedLoadMore) {
68
- return /*#__PURE__*/React.createElement(LoadMoreTarget, {
75
+ return /*#__PURE__*/React__default["default"].createElement(index$1.LoadMoreTarget, {
69
76
  collection: collection,
70
77
  componentName: "FourColGrid",
71
78
  offset: storyItems.length,
@@ -73,8 +80,8 @@ var FourColGrid = function FourColGrid(_ref2) {
73
80
  });
74
81
  }
75
82
 
76
- var url = generateNavigateSlug(collection, qtConfig);
77
- return /*#__PURE__*/React.createElement(ProgressiveHydration, null, /*#__PURE__*/React.createElement(LoadmoreButton, {
83
+ var url = index.generateNavigateSlug(collection, qtConfig);
84
+ return /*#__PURE__*/React__default["default"].createElement(index$1.ProgressiveHydration, null, /*#__PURE__*/React__default["default"].createElement(index$1.LoadmoreButton, {
78
85
  config: config,
79
86
  collection: collection,
80
87
  template: footerButton,
@@ -82,46 +89,46 @@ var FourColGrid = function FourColGrid(_ref2) {
82
89
  return loadMore(opts);
83
90
  },
84
91
  navigate: function navigate() {
85
- return navigateTo(dispatch, url);
92
+ return index.navigateTo(dispatch, url);
86
93
  },
87
94
  qtConfig: qtConfig
88
95
  }));
89
96
  };
90
97
 
91
- return /*#__PURE__*/React.createElement("div", {
98
+ return /*#__PURE__*/React__default["default"].createElement("div", {
92
99
  className: "full-width-with-padding arrow-component",
93
100
  "data-test-id": "four-col-grid",
94
101
  style: {
95
102
  backgroundColor: theme,
96
103
  color: textColor
97
104
  }
98
- }, /*#__PURE__*/React.createElement("div", {
105
+ }, /*#__PURE__*/React__default["default"].createElement("div", {
99
106
  className: "four-col-m_four-col-grid__1EiO7"
100
- }, /*#__PURE__*/React.createElement(CollectionName, {
107
+ }, /*#__PURE__*/React__default["default"].createElement(index$1.CollectionName, {
101
108
  collection: collection,
102
109
  collectionNameTemplate: collectionNameTemplate,
103
110
  collectionNameBorderColor: collectionNameBorderColor,
104
111
  customCollectionName: customCollectionName,
105
112
  navigate: navigate
106
- }), /*#__PURE__*/React.createElement("div", {
113
+ }), /*#__PURE__*/React__default["default"].createElement("div", {
107
114
  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", {
115
+ }, storyItems.map(function (story, index$1) {
116
+ return /*#__PURE__*/React__default["default"].createElement(React.Fragment, {
117
+ key: "story-4col-".concat(index$1, "-").concat(index.get_1(story, ["id"], "0"))
118
+ }, /*#__PURE__*/React__default["default"].createElement("div", {
112
119
  className: "four-col-m_story-card-wrapper__1e8p0",
113
- key: "default-".concat(index)
114
- }, /*#__PURE__*/React.createElement(StoryCard, {
120
+ key: "default-".concat(index$1)
121
+ }, /*#__PURE__*/React__default["default"].createElement(index$2.StoryCard, {
115
122
  story: story,
116
123
  border: border,
117
124
  theme: theme,
118
125
  isHorizontalMobile: true,
119
126
  config: config
120
- }, /*#__PURE__*/React.createElement(HeroImage, {
127
+ }, /*#__PURE__*/React__default["default"].createElement(index$3.HeroImage, {
121
128
  aspectRatio: [[16, 9]],
122
129
  story: story,
123
130
  isHorizontalMobile: true
124
- }), /*#__PURE__*/React.createElement(StorycardContent, {
131
+ }), /*#__PURE__*/React__default["default"].createElement(index$4.StorycardContent, {
125
132
  theme: theme,
126
133
  border: border,
127
134
  borderColor: borderColor,
@@ -136,32 +143,32 @@ var FourColGrid = function FourColGrid(_ref2) {
136
143
  subsequentLoadCount: subsequentLoadCount
137
144
  }), footerSlotComp));
138
145
  };
139
-
140
- FourColGrid.propTypes = {
146
+ FourColGridBase.propTypes = {
141
147
  /** collection is the array of objects which is returning by API */
142
- collection: PropTypes.object.isRequired,
148
+ collection: PropTypes__default["default"].object.isRequired,
143
149
 
144
150
  /** The config for the Row */
145
- config: PropTypes.shape({
146
- borderColor: PropTypes.string,
147
- theme: PropTypes.string,
148
- border: PropTypes.bool,
149
- slotConfig: PropTypes.array,
150
- collectionNameTemplate: PropTypes.string,
151
- footerButton: PropTypes.string,
152
- collectionNameBorderColor: PropTypes.string,
153
- subsequentLoadCount: PropTypes.number
151
+ config: PropTypes__default["default"].shape({
152
+ borderColor: PropTypes__default["default"].string,
153
+ theme: PropTypes__default["default"].string,
154
+ border: PropTypes__default["default"].bool,
155
+ slotConfig: PropTypes__default["default"].array,
156
+ collectionNameTemplate: PropTypes__default["default"].string,
157
+ footerButton: PropTypes__default["default"].string,
158
+ collectionNameBorderColor: PropTypes__default["default"].string,
159
+ subsequentLoadCount: PropTypes__default["default"].number
154
160
  }),
155
- getMoreStories: PropTypes.func,
156
- isLoadMoreVisible: PropTypes.bool,
157
- isLoading: PropTypes.bool,
158
- isolatedLoadMore: PropTypes.bool
161
+ getMoreStories: PropTypes__default["default"].func,
162
+ isLoadMoreVisible: PropTypes__default["default"].bool,
163
+ isLoading: PropTypes__default["default"].bool,
164
+ isolatedLoadMore: PropTypes__default["default"].bool
159
165
  };
160
- FourColGrid.defaultProps = {
166
+ FourColGridBase.defaultProps = {
161
167
  getMoreStories: function getMoreStories() {},
162
168
  isLoadMoreVisible: true,
163
169
  isLoading: false
164
170
  };
165
- var index = StateProvider(FourColGrid);
171
+ var FourColGrid = index$1.StateProvider(FourColGridBase);
166
172
 
167
- export { index as default };
173
+ exports.FourColGrid = FourColGrid;
174
+ exports.FourColGridBase = FourColGridBase;
@@ -1,7 +1,15 @@
1
- import PropTypes from 'prop-types';
2
- import React, { useState, Suspense, lazy } from 'react';
3
- import Timeago from 'react-timeago';
4
- import { utcToZonedTime, format } from 'date-fns-tz';
1
+ 'use strict';
2
+
3
+ var PropTypes = require('prop-types');
4
+ var React = require('react');
5
+ var Timeago = require('react-timeago');
6
+ var dateFnsTz = require('date-fns-tz');
7
+
8
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
9
+
10
+ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
11
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
+ var Timeago__default = /*#__PURE__*/_interopDefaultLegacy(Timeago);
5
13
 
6
14
  function _arrayLikeToArray(arr, len) {
7
15
  if (len == null || len > arr.length) len = arr.length;
@@ -2783,15 +2791,15 @@ var isEmpty = function isEmpty(value) {
2783
2791
  return value == null || // From standard.js: Always use === - but value == null is allowed to check null || undefined
2784
2792
  _typeof(value) === "object" && Object.entries(value).length === 0 && value.constructor === Object || typeof value === "string" && value.trim().length === 0;
2785
2793
  };
2786
- PropTypes.shape({
2787
- "sketches-host": PropTypes.string,
2788
- "cdn-name": PropTypes.string,
2789
- "cdn-image": PropTypes.string
2794
+ PropTypes__default["default"].shape({
2795
+ "sketches-host": PropTypes__default["default"].string,
2796
+ "cdn-name": PropTypes__default["default"].string,
2797
+ "cdn-image": PropTypes__default["default"].string
2790
2798
  });
2791
- PropTypes.shape({
2792
- headline: PropTypes.string,
2793
- "last-published-at": PropTypes.number,
2794
- subheadline: PropTypes.string
2799
+ PropTypes__default["default"].shape({
2800
+ headline: PropTypes__default["default"].string,
2801
+ "last-published-at": PropTypes__default["default"].number,
2802
+ subheadline: PropTypes__default["default"].string
2795
2803
  });
2796
2804
  var getStoryUrl = function getStoryUrl(story) {
2797
2805
  var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
@@ -2835,17 +2843,17 @@ var getTimeStamp = function getTimeStamp(date, _formatter) {
2835
2843
  var timezone = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : null;
2836
2844
 
2837
2845
  if (timezone && template === "story") {
2838
- var zonedTime = timezone && utcToZonedTime(date, timezone);
2839
- var formatZonedTime = zonedTime && format(zonedTime, "yyyy-MM-dd'T'HH:mm:ssXXX", {
2846
+ var zonedTime = timezone && dateFnsTz.utcToZonedTime(date, timezone);
2847
+ var formatZonedTime = zonedTime && dateFnsTz.format(zonedTime, "yyyy-MM-dd'T'HH:mm:ssXXX", {
2840
2848
  timeZone: timezone
2841
2849
  });
2842
2850
  var timeStamp = timestampToFormat("", "", "", date, config);
2843
- return /*#__PURE__*/React.createElement("time", {
2851
+ return /*#__PURE__*/React__default["default"].createElement("time", {
2844
2852
  dateTime: formatZonedTime
2845
2853
  }, timeStamp);
2846
2854
  }
2847
2855
 
2848
- return /*#__PURE__*/React.createElement(Timeago, {
2856
+ return /*#__PURE__*/React__default["default"].createElement(Timeago__default["default"], {
2849
2857
  date: date,
2850
2858
  formatter: function formatter(value, unit, suffix, date) {
2851
2859
  return _formatter(value, unit, suffix, date, config);
@@ -2865,48 +2873,48 @@ var _styleModuleImportMap = {
2865
2873
  var getTemplate = function getTemplate(templateName) {
2866
2874
  switch (templateName) {
2867
2875
  case "ArrowFourColGrid":
2868
- return /*#__PURE__*/lazy(function () {
2869
- return import('./index-b841407e.js');
2876
+ return /*#__PURE__*/React.lazy(function () {
2877
+ return Promise.resolve().then(function () { return require('./index-bc129cb8.js'); });
2870
2878
  });
2871
2879
 
2872
2880
  case "ArrowThreeColGrid":
2873
- return /*#__PURE__*/lazy(function () {
2874
- return import('./index-b3ef1488.js');
2881
+ return /*#__PURE__*/React.lazy(function () {
2882
+ return Promise.resolve().then(function () { return require('./index-6e083738.js'); });
2875
2883
  });
2876
2884
 
2877
2885
  case "ArrowOneColStoryList":
2878
- return /*#__PURE__*/lazy(function () {
2879
- return import('./index-c47ff5bc.js');
2886
+ return /*#__PURE__*/React.lazy(function () {
2887
+ return Promise.resolve().then(function () { return require('./index-a5c95f84.js'); });
2880
2888
  });
2881
2889
 
2882
2890
  case "ArrowFourColFiveStories":
2883
- return /*#__PURE__*/lazy(function () {
2884
- return import('./index-4577d5b9.js');
2891
+ return /*#__PURE__*/React.lazy(function () {
2892
+ return Promise.resolve().then(function () { return require('./index-3976fac4.js'); });
2885
2893
  });
2886
2894
 
2887
2895
  case "ArrowOpinionCollection":
2888
- return /*#__PURE__*/lazy(function () {
2889
- return import('./index-4c3c2b6f.js');
2896
+ return /*#__PURE__*/React.lazy(function () {
2897
+ return Promise.resolve().then(function () { return require('./index-9e0d32b7.js'); });
2890
2898
  });
2891
2899
 
2892
2900
  case "ArrowSixColSixStories":
2893
- return /*#__PURE__*/lazy(function () {
2894
- return import('./index-48664b07.js');
2901
+ return /*#__PURE__*/React.lazy(function () {
2902
+ return Promise.resolve().then(function () { return require('./index-6ecceae4.js'); });
2895
2903
  });
2896
2904
 
2897
2905
  case "ArrowThreeColFlexStories":
2898
- return /*#__PURE__*/lazy(function () {
2899
- return import('./index-8f6483ba.js');
2906
+ return /*#__PURE__*/React.lazy(function () {
2907
+ return Promise.resolve().then(function () { return require('./index-b5936059.js'); });
2900
2908
  });
2901
2909
 
2902
2910
  case "ArrowFourColPortraitStories":
2903
- return /*#__PURE__*/lazy(function () {
2904
- return import('./index-867b9437.js');
2911
+ return /*#__PURE__*/React.lazy(function () {
2912
+ return Promise.resolve().then(function () { return require('./index-fee73a14.js'); });
2905
2913
  });
2906
2914
 
2907
2915
  default:
2908
- return /*#__PURE__*/lazy(function () {
2909
- return import('./index-b3ef1488.js');
2916
+ return /*#__PURE__*/React.lazy(function () {
2917
+ return Promise.resolve().then(function () { return require('./index-6e083738.js'); });
2910
2918
  });
2911
2919
  }
2912
2920
  };
@@ -2922,7 +2930,7 @@ var ExtendedLoadMore = function ExtendedLoadMore(_ref) {
2922
2930
  var textColor = getTextColor(theme);
2923
2931
  /* Open an array to maintain load-more initiated components to re-render */
2924
2932
 
2925
- var _useState = useState([]),
2933
+ var _useState = React.useState([]),
2926
2934
  _useState2 = _slicedToArray(_useState, 2),
2927
2935
  components = _useState2[0],
2928
2936
  setComponents = _useState2[1];
@@ -2995,29 +3003,49 @@ var ExtendedLoadMore = function ExtendedLoadMore(_ref) {
2995
3003
  } : {};
2996
3004
  };
2997
3005
 
2998
- return /*#__PURE__*/React.createElement(React.Fragment, null, components.map(function (_ref3, index) {
3006
+ return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, components.map(function (_ref3, index) {
2999
3007
  var Component = _ref3.Component,
3000
3008
  props = _ref3.props;
3001
- return /*#__PURE__*/React.createElement("div", {
3009
+ return /*#__PURE__*/React__default["default"].createElement("div", {
3002
3010
  style: {
3003
3011
  maxWidth: 1172,
3004
3012
  margin: "auto"
3005
3013
  },
3006
3014
  key: "extendedLoadMoreBase-key-".concat(index)
3007
- }, /*#__PURE__*/React.createElement(Suspense, {
3008
- fallback: /*#__PURE__*/React.createElement("div", null, "Loading...")
3009
- }, /*#__PURE__*/React.createElement(Component, props)));
3010
- }), /*#__PURE__*/React.createElement("div", {
3015
+ }, /*#__PURE__*/React__default["default"].createElement(React.Suspense, {
3016
+ fallback: /*#__PURE__*/React__default["default"].createElement("div", null, "Loading...")
3017
+ }, /*#__PURE__*/React__default["default"].createElement(Component, props)));
3018
+ }), /*#__PURE__*/React__default["default"].createElement("div", {
3011
3019
  style: componentStyles(componentName),
3012
3020
  onClick: addComponent,
3013
3021
  className: "arr--button " + _getClassName("button ".concat(textColor, " default"), _styleModuleImportMap)
3014
3022
  }, btnText));
3015
3023
  };
3016
3024
  ExtendedLoadMore.propTypes = {
3017
- componentName: PropTypes.string,
3018
- config: PropTypes.object,
3019
- WithArrowConfig: PropTypes.func,
3020
- withSubsequentLoad: PropTypes.func
3025
+ componentName: PropTypes__default["default"].string,
3026
+ config: PropTypes__default["default"].object,
3027
+ WithArrowConfig: PropTypes__default["default"].func,
3028
+ withSubsequentLoad: PropTypes__default["default"].func
3021
3029
  };
3022
3030
 
3023
- export { ExtendedLoadMore as E, _getClassName as _, get_1 as a, generateNavigateSlug as b, _slicedToArray as c, clientWidth as d, getStoryUrl as e, isExternalStory as f, getTextColor as g, getTimeStamp as h, isEmpty as i, formatter as j, getSlug as k, getSlot as l, _arrayWithHoles as m, navigateTo as n, _iterableToArray as o, _unsupportedIterableToArray as p, _nonIterableRest as q, rgbToHex as r, truncate as t };
3031
+ exports.ExtendedLoadMore = ExtendedLoadMore;
3032
+ exports._arrayWithHoles = _arrayWithHoles;
3033
+ exports._getClassName = _getClassName;
3034
+ exports._iterableToArray = _iterableToArray;
3035
+ exports._nonIterableRest = _nonIterableRest;
3036
+ exports._slicedToArray = _slicedToArray;
3037
+ exports._unsupportedIterableToArray = _unsupportedIterableToArray;
3038
+ exports.clientWidth = clientWidth;
3039
+ exports.formatter = formatter;
3040
+ exports.generateNavigateSlug = generateNavigateSlug;
3041
+ exports.getSlot = getSlot;
3042
+ exports.getSlug = getSlug;
3043
+ exports.getStoryUrl = getStoryUrl;
3044
+ exports.getTextColor = getTextColor;
3045
+ exports.getTimeStamp = getTimeStamp;
3046
+ exports.get_1 = get_1;
3047
+ exports.isEmpty = isEmpty;
3048
+ exports.isExternalStory = isExternalStory;
3049
+ exports.navigateTo = navigateTo;
3050
+ exports.rgbToHex = rgbToHex;
3051
+ exports.truncate = truncate;
@@ -1,17 +1,24 @@
1
- import React from 'react';
2
- import { useDispatch, useSelector } from 'react-redux';
3
- import { i as isEmpty, g as getTextColor, a as get_1, b as generateNavigateSlug, n as navigateTo } from './index-d08b6c2f.js';
4
- import PropTypes from 'prop-types';
5
- import { collectionToStories } from '@quintype/components';
6
- import { S as StateProvider, C as CollectionName, L as LoadMoreTarget, P as ProgressiveHydration, a as LoadmoreButton } from './index-0edaa434.js';
7
- import { S as StoryCard } from './index-4b9207c4.js';
8
- import { S as StorycardContent } from './index-96c36b0e.js';
9
- import { H as HeroImage } from './index-70ce7471.js';
10
- import 'react-timeago';
11
- import 'date-fns-tz';
12
- import 'react-dom';
1
+ 'use strict';
13
2
 
14
- var PortraitStoryCard = function PortraitStoryCard(_ref) {
3
+ var React = require('react');
4
+ var reactRedux = require('react-redux');
5
+ var index$1 = require('./index-e7cde739.js');
6
+ var PropTypes = require('prop-types');
7
+ var components = require('@quintype/components');
8
+ var index = require('./index-3c4ac692.js');
9
+ var index$2 = require('./index-b22f1843.js');
10
+ var index$4 = require('./index-4ddfe28d.js');
11
+ var index$3 = require('./index-5c8eda4a.js');
12
+ require('react-timeago');
13
+ require('date-fns-tz');
14
+ require('react-dom');
15
+
16
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
17
+
18
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
19
+ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
20
+
21
+ var PortraitStoryCardBase = function PortraitStoryCardBase(_ref) {
15
22
  var story = _ref.story,
16
23
  _ref$border = _ref.border,
17
24
  border = _ref$border === void 0 ? "" : _ref$border,
@@ -25,19 +32,19 @@ var PortraitStoryCard = function PortraitStoryCard(_ref) {
25
32
  config = _ref$config === void 0 ? {} : _ref$config,
26
33
  _ref$borderColor = _ref.borderColor,
27
34
  borderColor = _ref$borderColor === void 0 ? "" : _ref$borderColor;
28
- if (isEmpty(story)) return null;
29
- return /*#__PURE__*/React.createElement("div", {
35
+ if (index$1.isEmpty(story)) return null;
36
+ return /*#__PURE__*/React__default["default"].createElement("div", {
30
37
  className: "portrait-story-card-m_wrapper__3nche"
31
- }, /*#__PURE__*/React.createElement(StoryCard, {
38
+ }, /*#__PURE__*/React__default["default"].createElement(index$2.StoryCard, {
32
39
  story: story,
33
40
  border: border,
34
41
  theme: theme,
35
42
  config: config,
36
43
  useImageAsBackground: true
37
- }, /*#__PURE__*/React.createElement(HeroImage, {
44
+ }, /*#__PURE__*/React__default["default"].createElement(index$3.HeroImage, {
38
45
  story: story,
39
46
  aspectRatio: [[9, 16]]
40
- }), /*#__PURE__*/React.createElement(StorycardContent, {
47
+ }), /*#__PURE__*/React__default["default"].createElement(index$4.StorycardContent, {
41
48
  story: story,
42
49
  config: config,
43
50
  separator: separator,
@@ -45,17 +52,16 @@ var PortraitStoryCard = function PortraitStoryCard(_ref) {
45
52
  headerLevel: headerLevel
46
53
  })));
47
54
  };
48
-
49
- PortraitStoryCard.propTypes = {
50
- border: PropTypes.string,
51
- theme: PropTypes.string,
52
- headerLevel: PropTypes.string,
53
- separator: PropTypes.string,
54
- borderColor: PropTypes.string,
55
- config: PropTypes.object,
56
- story: PropTypes.object
55
+ PortraitStoryCardBase.propTypes = {
56
+ border: PropTypes__default["default"].string,
57
+ theme: PropTypes__default["default"].string,
58
+ headerLevel: PropTypes__default["default"].string,
59
+ separator: PropTypes__default["default"].string,
60
+ borderColor: PropTypes__default["default"].string,
61
+ config: PropTypes__default["default"].object,
62
+ story: PropTypes__default["default"].object
57
63
  };
58
- var PortraitStoryCard$1 = StateProvider(PortraitStoryCard);
64
+ var PortraitStoryCard = index.StateProvider(PortraitStoryCardBase);
59
65
 
60
66
  var loadMore = function loadMore(_ref) {
61
67
  var isLoading = _ref.isLoading,
@@ -70,7 +76,7 @@ var loadMore = function loadMore(_ref) {
70
76
  getMoreStories(offset, limit);
71
77
  };
72
78
 
73
- var FourColPortraitStories = function FourColPortraitStories(_ref2) {
79
+ var FourColPortraitStoriesBase = function FourColPortraitStoriesBase(_ref2) {
74
80
  var collection = _ref2.collection,
75
81
  _ref2$config = _ref2.config,
76
82
  config = _ref2$config === void 0 ? {} : _ref2$config,
@@ -78,7 +84,7 @@ var FourColPortraitStories = function FourColPortraitStories(_ref2) {
78
84
  isLoadMoreVisible = _ref2.isLoadMoreVisible,
79
85
  isLoading = _ref2.isLoading,
80
86
  isolatedLoadMore = _ref2.isolatedLoadMore;
81
- var storyItems = collectionToStories(collection);
87
+ var storyItems = components.collectionToStories(collection);
82
88
  if (!storyItems.length) return null;
83
89
  var _config$collectionNam = config.collectionNameBorderColor,
84
90
  collectionNameBorderColor = _config$collectionNam === void 0 ? "" : _config$collectionNam,
@@ -101,17 +107,17 @@ var FourColPortraitStories = function FourColPortraitStories(_ref2) {
101
107
  subsequentLoadCount = _config$subsequentLoa === void 0 ? 4 : _config$subsequentLoa;
102
108
  var footerSlot = footerSlotConfig.footerSlot;
103
109
  var footerSlotComp = typeof footerSlot === "function" ? footerSlot() : null;
104
- var textColor = getTextColor(theme);
105
- var dispatch = useDispatch();
106
- var qtConfig = useSelector(function (state) {
107
- return get_1(state, ["qt", "config"], {});
110
+ var textColor = index$1.getTextColor(theme);
111
+ var dispatch = reactRedux.useDispatch();
112
+ var qtConfig = reactRedux.useSelector(function (state) {
113
+ return index$1.get_1(state, ["qt", "config"], {});
108
114
  });
109
115
 
110
116
  var getLoadMore = function getLoadMore(opts) {
111
117
  if (!isLoadMoreVisible) return null;
112
118
 
113
119
  if (isolatedLoadMore) {
114
- return /*#__PURE__*/React.createElement(LoadMoreTarget, {
120
+ return /*#__PURE__*/React__default["default"].createElement(index.LoadMoreTarget, {
115
121
  collection: collection,
116
122
  componentName: "FourColPortraitStories",
117
123
  offset: storyItems.length,
@@ -119,8 +125,8 @@ var FourColPortraitStories = function FourColPortraitStories(_ref2) {
119
125
  });
120
126
  }
121
127
 
122
- var url = generateNavigateSlug(collection, qtConfig);
123
- return /*#__PURE__*/React.createElement(ProgressiveHydration, null, /*#__PURE__*/React.createElement(LoadmoreButton, {
128
+ var url = index$1.generateNavigateSlug(collection, qtConfig);
129
+ return /*#__PURE__*/React__default["default"].createElement(index.ProgressiveHydration, null, /*#__PURE__*/React__default["default"].createElement(index.LoadmoreButton, {
124
130
  config: config,
125
131
  collection: collection,
126
132
  template: footerButton,
@@ -128,31 +134,31 @@ var FourColPortraitStories = function FourColPortraitStories(_ref2) {
128
134
  return loadMore(opts);
129
135
  },
130
136
  navigate: function navigate() {
131
- return navigateTo(dispatch, url);
137
+ return index$1.navigateTo(dispatch, url);
132
138
  },
133
139
  qtConfig: qtConfig
134
140
  }));
135
141
  };
136
142
 
137
- return /*#__PURE__*/React.createElement("div", {
143
+ return /*#__PURE__*/React__default["default"].createElement("div", {
138
144
  className: "full-width-with-padding arrow-component",
139
145
  "data-test-id": "four-col-portrait-stories",
140
146
  style: {
141
147
  backgroundColor: theme,
142
148
  color: textColor
143
149
  }
144
- }, /*#__PURE__*/React.createElement("div", {
150
+ }, /*#__PURE__*/React__default["default"].createElement("div", {
145
151
  className: "four-col-portrait-stories-m_four-col-portrait__AtWub"
146
- }, /*#__PURE__*/React.createElement(CollectionName, {
152
+ }, /*#__PURE__*/React__default["default"].createElement(index.CollectionName, {
147
153
  collection: collection,
148
154
  collectionNameTemplate: collectionNameTemplate,
149
155
  collectionNameBorderColor: collectionNameBorderColor,
150
156
  customCollectionName: customCollectionName,
151
157
  navigate: navigate
152
- }), /*#__PURE__*/React.createElement("div", {
158
+ }), /*#__PURE__*/React__default["default"].createElement("div", {
153
159
  className: "four-col-portrait-stories-m_wrapper__1BX02"
154
160
  }, storyItems.map(function (story, index) {
155
- return /*#__PURE__*/React.createElement(PortraitStoryCard$1, {
161
+ return /*#__PURE__*/React__default["default"].createElement(PortraitStoryCard, {
156
162
  story: story,
157
163
  border: border,
158
164
  theme: theme,
@@ -171,31 +177,31 @@ var FourColPortraitStories = function FourColPortraitStories(_ref2) {
171
177
  subsequentLoadCount: subsequentLoadCount
172
178
  }), footerSlotComp));
173
179
  };
174
-
175
- FourColPortraitStories.propTypes = {
180
+ FourColPortraitStoriesBase.propTypes = {
176
181
  /** collection is the array of objects which is returning by API */
177
- collection: PropTypes.object.isRequired,
182
+ collection: PropTypes__default["default"].object.isRequired,
178
183
 
179
184
  /** The config for the Row */
180
- config: PropTypes.shape({
181
- borderColor: PropTypes.string,
182
- theme: PropTypes.string,
183
- border: PropTypes.bool,
184
- collectionNameTemplate: PropTypes.string,
185
- footerButton: PropTypes.string,
186
- collectionNameBorderColor: PropTypes.string,
187
- subsequentLoadCount: PropTypes.number
185
+ config: PropTypes__default["default"].shape({
186
+ borderColor: PropTypes__default["default"].string,
187
+ theme: PropTypes__default["default"].string,
188
+ border: PropTypes__default["default"].bool,
189
+ collectionNameTemplate: PropTypes__default["default"].string,
190
+ footerButton: PropTypes__default["default"].string,
191
+ collectionNameBorderColor: PropTypes__default["default"].string,
192
+ subsequentLoadCount: PropTypes__default["default"].number
188
193
  }),
189
- getMoreStories: PropTypes.func,
190
- isLoadMoreVisible: PropTypes.bool,
191
- isLoading: PropTypes.bool,
192
- isolatedLoadMore: PropTypes.bool
194
+ getMoreStories: PropTypes__default["default"].func,
195
+ isLoadMoreVisible: PropTypes__default["default"].bool,
196
+ isLoading: PropTypes__default["default"].bool,
197
+ isolatedLoadMore: PropTypes__default["default"].bool
193
198
  };
194
- FourColPortraitStories.defaultProps = {
199
+ FourColPortraitStoriesBase.defaultProps = {
195
200
  getMoreStories: function getMoreStories() {},
196
201
  isLoadMoreVisible: true,
197
202
  isLoading: false
198
203
  };
199
- var index = StateProvider(FourColPortraitStories);
204
+ var FourColPortraitStories = index.StateProvider(FourColPortraitStoriesBase);
200
205
 
201
- export { index as default };
206
+ exports.FourColPortraitStories = FourColPortraitStories;
207
+ exports.FourColPortraitStoriesBase = FourColPortraitStoriesBase;
@@ -1,5 +1,13 @@
1
- export { E as ExtendedLoadMore } from './index-d08b6c2f.js';
2
- import 'prop-types';
3
- import 'react';
4
- import 'react-timeago';
5
- import 'date-fns-tz';
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var index = require('./index-e7cde739.js');
6
+ require('prop-types');
7
+ require('react');
8
+ require('react-timeago');
9
+ require('date-fns-tz');
10
+
11
+
12
+
13
+ exports.ExtendedLoadMore = index.ExtendedLoadMore;