@mjhls/mjh-framework 1.0.402 → 1.0.403
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/README.md +1 -1
- package/dist/cjs/{ADInfeed-d1783f42.js → ADInfeed-494f5e6b.js} +1 -1
- package/dist/cjs/{AdSlot-20aa927e.js → AdSlot-4d22aad4.js} +2 -2
- package/dist/cjs/DeckContent.js +9 -7
- package/dist/cjs/DeckQueue.js +6 -4
- package/dist/cjs/{Dfp-27b922b0.js → Dfp-2399639f.js} +1 -1
- package/dist/cjs/{Figure-8dd7df44.js → Figure-04d4a60d.js} +1 -1
- package/dist/cjs/{GridContent-c0c0d3e5.js → GridContent-2f42692a.js} +7 -6
- package/dist/cjs/GridContent.js +9 -7
- package/dist/cjs/IssueDeck.js +182 -86
- package/dist/cjs/MasterDeck.js +21 -7
- package/dist/cjs/{Normal-c1c98dcf.js → Normal-4a0d7dfc.js} +82 -2
- package/dist/cjs/QueueDeckExpanded.js +9 -7
- package/dist/cjs/TemplateNormal.js +5 -4
- package/dist/cjs/VideoSeriesListing.js +3 -2
- package/dist/cjs/_iter-detect-234453c3.js +53 -0
- package/dist/cjs/index.es-ab3f2690.js +428 -0
- package/dist/cjs/index.js +19 -97
- package/dist/cjs/{main-2020ba94.js → main-bc4db521.js} +0 -50
- package/dist/cjs/{promise-d5136080.js → promise-0a493c7a.js} +4 -4
- package/dist/cjs/{toConsumableArray-3cf1df2c.js → toConsumableArray-25d0e2a3.js} +4 -4
- package/dist/cjs/{visibility-sensor-43e0b37c.js → visibility-sensor-0c45a583.js} +0 -421
- package/dist/esm/{ADInfeed-40adc8e0.js → ADInfeed-e5cefea5.js} +1 -1
- package/dist/esm/{AdSlot-c3ed3214.js → AdSlot-78e48a2c.js} +2 -2
- package/dist/esm/DeckContent.js +8 -6
- package/dist/esm/DeckQueue.js +5 -3
- package/dist/esm/{Dfp-3b3273ee.js → Dfp-d5fe1252.js} +1 -1
- package/dist/esm/{Figure-f269f495.js → Figure-e32f60c5.js} +1 -1
- package/dist/esm/{GridContent-b042eb2d.js → GridContent-cafb2fe4.js} +6 -5
- package/dist/esm/GridContent.js +9 -7
- package/dist/esm/IssueDeck.js +183 -87
- package/dist/esm/MasterDeck.js +20 -6
- package/dist/esm/{Normal-68ef59cd.js → Normal-b8c423e3.js} +82 -3
- package/dist/esm/QueueDeckExpanded.js +8 -6
- package/dist/esm/TemplateNormal.js +5 -4
- package/dist/esm/VideoSeriesListing.js +2 -1
- package/dist/esm/_iter-detect-7c281f0a.js +49 -0
- package/dist/esm/index.es-938a3a58.js +423 -0
- package/dist/esm/index.js +16 -94
- package/dist/esm/{main-25bb2c75.js → main-7d1b3c98.js} +1 -48
- package/dist/esm/{promise-5d7cd78a.js → promise-2592a80a.js} +1 -1
- package/dist/esm/{toConsumableArray-d7054876.js → toConsumableArray-c5e2fde8.js} +1 -1
- package/dist/esm/{visibility-sensor-49d5805d.js → visibility-sensor-0baa4eea.js} +2 -422
- package/package.json +1 -1
|
@@ -0,0 +1,428 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
4
|
+
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var React__default = _interopDefault(React);
|
|
7
|
+
|
|
8
|
+
/*! *****************************************************************************
|
|
9
|
+
Copyright (c) Microsoft Corporation. All rights reserved.
|
|
10
|
+
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
|
|
11
|
+
this file except in compliance with the License. You may obtain a copy of the
|
|
12
|
+
License at http://www.apache.org/licenses/LICENSE-2.0
|
|
13
|
+
|
|
14
|
+
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
15
|
+
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
|
|
16
|
+
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
|
|
17
|
+
MERCHANTABLITY OR NON-INFRINGEMENT.
|
|
18
|
+
|
|
19
|
+
See the Apache Version 2.0 License for specific language governing permissions
|
|
20
|
+
and limitations under the License.
|
|
21
|
+
***************************************************************************** */
|
|
22
|
+
/* global Reflect, Promise */
|
|
23
|
+
|
|
24
|
+
var extendStatics = function(d, b) {
|
|
25
|
+
extendStatics = Object.setPrototypeOf ||
|
|
26
|
+
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
27
|
+
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
|
28
|
+
return extendStatics(d, b);
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
function __extends(d, b) {
|
|
32
|
+
extendStatics(d, b);
|
|
33
|
+
function __() { this.constructor = d; }
|
|
34
|
+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
var __assign = function() {
|
|
38
|
+
__assign = Object.assign || function __assign(t) {
|
|
39
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
40
|
+
s = arguments[i];
|
|
41
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
42
|
+
}
|
|
43
|
+
return t;
|
|
44
|
+
};
|
|
45
|
+
return __assign.apply(this, arguments);
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
/* eslint-disable no-undefined,no-param-reassign,no-shadow */
|
|
49
|
+
|
|
50
|
+
/**
|
|
51
|
+
* Throttle execution of a function. Especially useful for rate limiting
|
|
52
|
+
* execution of handlers on events like resize and scroll.
|
|
53
|
+
*
|
|
54
|
+
* @param {Number} delay A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher) are most useful.
|
|
55
|
+
* @param {Boolean} [noTrailing] Optional, defaults to false. If noTrailing is true, callback will only execute every `delay` milliseconds while the
|
|
56
|
+
* throttled-function is being called. If noTrailing is false or unspecified, callback will be executed one final time
|
|
57
|
+
* after the last throttled-function call. (After the throttled-function has not been called for `delay` milliseconds,
|
|
58
|
+
* the internal counter is reset)
|
|
59
|
+
* @param {Function} callback A function to be executed after delay milliseconds. The `this` context and all arguments are passed through, as-is,
|
|
60
|
+
* to `callback` when the throttled-function is executed.
|
|
61
|
+
* @param {Boolean} [debounceMode] If `debounceMode` is true (at begin), schedule `clear` to execute after `delay` ms. If `debounceMode` is false (at end),
|
|
62
|
+
* schedule `callback` to execute after `delay` ms.
|
|
63
|
+
*
|
|
64
|
+
* @return {Function} A new, throttled, function.
|
|
65
|
+
*/
|
|
66
|
+
function throttle (delay, noTrailing, callback, debounceMode) {
|
|
67
|
+
/*
|
|
68
|
+
* After wrapper has stopped being called, this timeout ensures that
|
|
69
|
+
* `callback` is executed at the proper times in `throttle` and `end`
|
|
70
|
+
* debounce modes.
|
|
71
|
+
*/
|
|
72
|
+
var timeoutID;
|
|
73
|
+
var cancelled = false; // Keep track of the last time `callback` was executed.
|
|
74
|
+
|
|
75
|
+
var lastExec = 0; // Function to clear existing timeout
|
|
76
|
+
|
|
77
|
+
function clearExistingTimeout() {
|
|
78
|
+
if (timeoutID) {
|
|
79
|
+
clearTimeout(timeoutID);
|
|
80
|
+
}
|
|
81
|
+
} // Function to cancel next exec
|
|
82
|
+
|
|
83
|
+
|
|
84
|
+
function cancel() {
|
|
85
|
+
clearExistingTimeout();
|
|
86
|
+
cancelled = true;
|
|
87
|
+
} // `noTrailing` defaults to falsy.
|
|
88
|
+
|
|
89
|
+
|
|
90
|
+
if (typeof noTrailing !== 'boolean') {
|
|
91
|
+
debounceMode = callback;
|
|
92
|
+
callback = noTrailing;
|
|
93
|
+
noTrailing = undefined;
|
|
94
|
+
}
|
|
95
|
+
/*
|
|
96
|
+
* The `wrapper` function encapsulates all of the throttling / debouncing
|
|
97
|
+
* functionality and when executed will limit the rate at which `callback`
|
|
98
|
+
* is executed.
|
|
99
|
+
*/
|
|
100
|
+
|
|
101
|
+
|
|
102
|
+
function wrapper() {
|
|
103
|
+
var self = this;
|
|
104
|
+
var elapsed = Date.now() - lastExec;
|
|
105
|
+
var args = arguments;
|
|
106
|
+
|
|
107
|
+
if (cancelled) {
|
|
108
|
+
return;
|
|
109
|
+
} // Execute `callback` and update the `lastExec` timestamp.
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
function exec() {
|
|
113
|
+
lastExec = Date.now();
|
|
114
|
+
callback.apply(self, args);
|
|
115
|
+
}
|
|
116
|
+
/*
|
|
117
|
+
* If `debounceMode` is true (at begin) this is used to clear the flag
|
|
118
|
+
* to allow future `callback` executions.
|
|
119
|
+
*/
|
|
120
|
+
|
|
121
|
+
|
|
122
|
+
function clear() {
|
|
123
|
+
timeoutID = undefined;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
if (debounceMode && !timeoutID) {
|
|
127
|
+
/*
|
|
128
|
+
* Since `wrapper` is being called for the first time and
|
|
129
|
+
* `debounceMode` is true (at begin), execute `callback`.
|
|
130
|
+
*/
|
|
131
|
+
exec();
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
clearExistingTimeout();
|
|
135
|
+
|
|
136
|
+
if (debounceMode === undefined && elapsed > delay) {
|
|
137
|
+
/*
|
|
138
|
+
* In throttle mode, if `delay` time has been exceeded, execute
|
|
139
|
+
* `callback`.
|
|
140
|
+
*/
|
|
141
|
+
exec();
|
|
142
|
+
} else if (noTrailing !== true) {
|
|
143
|
+
/*
|
|
144
|
+
* In trailing throttle mode, since `delay` time has not been
|
|
145
|
+
* exceeded, schedule `callback` to execute `delay` ms after most
|
|
146
|
+
* recent execution.
|
|
147
|
+
*
|
|
148
|
+
* If `debounceMode` is true (at begin), schedule `clear` to execute
|
|
149
|
+
* after `delay` ms.
|
|
150
|
+
*
|
|
151
|
+
* If `debounceMode` is false (at end), schedule `callback` to
|
|
152
|
+
* execute after `delay` ms.
|
|
153
|
+
*/
|
|
154
|
+
timeoutID = setTimeout(debounceMode ? clear : exec, debounceMode === undefined ? delay - elapsed : delay);
|
|
155
|
+
}
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
wrapper.cancel = cancel; // Return the wrapper function.
|
|
159
|
+
|
|
160
|
+
return wrapper;
|
|
161
|
+
}
|
|
162
|
+
|
|
163
|
+
var ThresholdUnits = {
|
|
164
|
+
Pixel: 'Pixel',
|
|
165
|
+
Percent: 'Percent',
|
|
166
|
+
};
|
|
167
|
+
var defaultThreshold = {
|
|
168
|
+
unit: ThresholdUnits.Percent,
|
|
169
|
+
value: 0.8,
|
|
170
|
+
};
|
|
171
|
+
function parseThreshold(scrollThreshold) {
|
|
172
|
+
if (typeof scrollThreshold === 'number') {
|
|
173
|
+
return {
|
|
174
|
+
unit: ThresholdUnits.Percent,
|
|
175
|
+
value: scrollThreshold * 100,
|
|
176
|
+
};
|
|
177
|
+
}
|
|
178
|
+
if (typeof scrollThreshold === 'string') {
|
|
179
|
+
if (scrollThreshold.match(/^(\d*(\.\d+)?)px$/)) {
|
|
180
|
+
return {
|
|
181
|
+
unit: ThresholdUnits.Pixel,
|
|
182
|
+
value: parseFloat(scrollThreshold),
|
|
183
|
+
};
|
|
184
|
+
}
|
|
185
|
+
if (scrollThreshold.match(/^(\d*(\.\d+)?)%$/)) {
|
|
186
|
+
return {
|
|
187
|
+
unit: ThresholdUnits.Percent,
|
|
188
|
+
value: parseFloat(scrollThreshold),
|
|
189
|
+
};
|
|
190
|
+
}
|
|
191
|
+
console.warn('scrollThreshold format is invalid. Valid formats: "120px", "50%"...');
|
|
192
|
+
return defaultThreshold;
|
|
193
|
+
}
|
|
194
|
+
console.warn('scrollThreshold should be string or number');
|
|
195
|
+
return defaultThreshold;
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
var InfiniteScroll = /** @class */ (function (_super) {
|
|
199
|
+
__extends(InfiniteScroll, _super);
|
|
200
|
+
function InfiniteScroll(props) {
|
|
201
|
+
var _this = _super.call(this, props) || this;
|
|
202
|
+
_this.lastScrollTop = 0;
|
|
203
|
+
_this.actionTriggered = false;
|
|
204
|
+
// variables to keep track of pull down behaviour
|
|
205
|
+
_this.startY = 0;
|
|
206
|
+
_this.currentY = 0;
|
|
207
|
+
_this.dragging = false;
|
|
208
|
+
// will be populated in componentDidMount
|
|
209
|
+
// based on the height of the pull down element
|
|
210
|
+
_this.maxPullDownDistance = 0;
|
|
211
|
+
_this.getScrollableTarget = function () {
|
|
212
|
+
if (_this.props.scrollableTarget instanceof HTMLElement)
|
|
213
|
+
return _this.props.scrollableTarget;
|
|
214
|
+
if (typeof _this.props.scrollableTarget === 'string') {
|
|
215
|
+
return document.getElementById(_this.props.scrollableTarget);
|
|
216
|
+
}
|
|
217
|
+
if (_this.props.scrollableTarget === null) {
|
|
218
|
+
console.warn("You are trying to pass scrollableTarget but it is null. This might\n happen because the element may not have been added to DOM yet.\n See https://github.com/ankeetmaini/react-infinite-scroll-component/issues/59 for more info.\n ");
|
|
219
|
+
}
|
|
220
|
+
return null;
|
|
221
|
+
};
|
|
222
|
+
_this.onStart = function (evt) {
|
|
223
|
+
if (_this.lastScrollTop)
|
|
224
|
+
return;
|
|
225
|
+
_this.dragging = true;
|
|
226
|
+
if (evt instanceof MouseEvent) {
|
|
227
|
+
_this.startY = evt.pageY;
|
|
228
|
+
}
|
|
229
|
+
else if (evt instanceof TouchEvent) {
|
|
230
|
+
_this.startY = evt.touches[0].pageY;
|
|
231
|
+
}
|
|
232
|
+
_this.currentY = _this.startY;
|
|
233
|
+
if (_this._infScroll) {
|
|
234
|
+
_this._infScroll.style.willChange = 'transform';
|
|
235
|
+
_this._infScroll.style.transition = "transform 0.2s cubic-bezier(0,0,0.31,1)";
|
|
236
|
+
}
|
|
237
|
+
};
|
|
238
|
+
_this.onMove = function (evt) {
|
|
239
|
+
if (!_this.dragging)
|
|
240
|
+
return;
|
|
241
|
+
if (evt instanceof MouseEvent) {
|
|
242
|
+
_this.currentY = evt.pageY;
|
|
243
|
+
}
|
|
244
|
+
else if (evt instanceof TouchEvent) {
|
|
245
|
+
_this.currentY = evt.touches[0].pageY;
|
|
246
|
+
}
|
|
247
|
+
// user is scrolling down to up
|
|
248
|
+
if (_this.currentY < _this.startY)
|
|
249
|
+
return;
|
|
250
|
+
if (_this.currentY - _this.startY >=
|
|
251
|
+
Number(_this.props.pullDownToRefreshThreshold)) {
|
|
252
|
+
_this.setState({
|
|
253
|
+
pullToRefreshThresholdBreached: true,
|
|
254
|
+
});
|
|
255
|
+
}
|
|
256
|
+
// so you can drag upto 1.5 times of the maxPullDownDistance
|
|
257
|
+
if (_this.currentY - _this.startY > _this.maxPullDownDistance * 1.5)
|
|
258
|
+
return;
|
|
259
|
+
if (_this._infScroll) {
|
|
260
|
+
_this._infScroll.style.overflow = 'visible';
|
|
261
|
+
_this._infScroll.style.transform = "translate3d(0px, " + (_this.currentY -
|
|
262
|
+
_this.startY) + "px, 0px)";
|
|
263
|
+
}
|
|
264
|
+
};
|
|
265
|
+
_this.onEnd = function () {
|
|
266
|
+
_this.startY = 0;
|
|
267
|
+
_this.currentY = 0;
|
|
268
|
+
_this.dragging = false;
|
|
269
|
+
if (_this.state.pullToRefreshThresholdBreached) {
|
|
270
|
+
_this.props.refreshFunction && _this.props.refreshFunction();
|
|
271
|
+
_this.setState({
|
|
272
|
+
pullToRefreshThresholdBreached: false,
|
|
273
|
+
});
|
|
274
|
+
}
|
|
275
|
+
requestAnimationFrame(function () {
|
|
276
|
+
// this._infScroll
|
|
277
|
+
if (_this._infScroll) {
|
|
278
|
+
_this._infScroll.style.overflow = 'auto';
|
|
279
|
+
_this._infScroll.style.transform = 'none';
|
|
280
|
+
_this._infScroll.style.willChange = 'none';
|
|
281
|
+
}
|
|
282
|
+
});
|
|
283
|
+
};
|
|
284
|
+
_this.onScrollListener = function (event) {
|
|
285
|
+
if (typeof _this.props.onScroll === 'function') {
|
|
286
|
+
// Execute this callback in next tick so that it does not affect the
|
|
287
|
+
// functionality of the library.
|
|
288
|
+
setTimeout(function () { return _this.props.onScroll && _this.props.onScroll(event); }, 0);
|
|
289
|
+
}
|
|
290
|
+
var target = _this.props.height || _this._scrollableNode
|
|
291
|
+
? event.target
|
|
292
|
+
: document.documentElement.scrollTop
|
|
293
|
+
? document.documentElement
|
|
294
|
+
: document.body;
|
|
295
|
+
// return immediately if the action has already been triggered,
|
|
296
|
+
// prevents multiple triggers.
|
|
297
|
+
if (_this.actionTriggered)
|
|
298
|
+
return;
|
|
299
|
+
var atBottom = _this.isElementAtBottom(target, _this.props.scrollThreshold);
|
|
300
|
+
// call the `next` function in the props to trigger the next data fetch
|
|
301
|
+
if (atBottom && _this.props.hasMore) {
|
|
302
|
+
_this.actionTriggered = true;
|
|
303
|
+
_this.setState({ showLoader: true });
|
|
304
|
+
_this.props.next && _this.props.next();
|
|
305
|
+
}
|
|
306
|
+
_this.lastScrollTop = target.scrollTop;
|
|
307
|
+
};
|
|
308
|
+
_this.state = {
|
|
309
|
+
showLoader: false,
|
|
310
|
+
pullToRefreshThresholdBreached: false,
|
|
311
|
+
};
|
|
312
|
+
_this.throttledOnScrollListener = throttle(150, _this.onScrollListener).bind(_this);
|
|
313
|
+
_this.onStart = _this.onStart.bind(_this);
|
|
314
|
+
_this.onMove = _this.onMove.bind(_this);
|
|
315
|
+
_this.onEnd = _this.onEnd.bind(_this);
|
|
316
|
+
return _this;
|
|
317
|
+
}
|
|
318
|
+
InfiniteScroll.prototype.componentDidMount = function () {
|
|
319
|
+
if (typeof this.props.dataLength === 'undefined') {
|
|
320
|
+
throw new Error("mandatory prop \"dataLength\" is missing. The prop is needed" +
|
|
321
|
+
" when loading more content. Check README.md for usage");
|
|
322
|
+
}
|
|
323
|
+
this._scrollableNode = this.getScrollableTarget();
|
|
324
|
+
this.el = this.props.height
|
|
325
|
+
? this._infScroll
|
|
326
|
+
: this._scrollableNode || window;
|
|
327
|
+
if (this.el) {
|
|
328
|
+
this.el.addEventListener('scroll', this
|
|
329
|
+
.throttledOnScrollListener);
|
|
330
|
+
}
|
|
331
|
+
if (typeof this.props.initialScrollY === 'number' &&
|
|
332
|
+
this.el &&
|
|
333
|
+
this.el instanceof HTMLElement &&
|
|
334
|
+
this.el.scrollHeight > this.props.initialScrollY) {
|
|
335
|
+
this.el.scrollTo(0, this.props.initialScrollY);
|
|
336
|
+
}
|
|
337
|
+
if (this.props.pullDownToRefresh && this.el) {
|
|
338
|
+
this.el.addEventListener('touchstart', this.onStart);
|
|
339
|
+
this.el.addEventListener('touchmove', this.onMove);
|
|
340
|
+
this.el.addEventListener('touchend', this.onEnd);
|
|
341
|
+
this.el.addEventListener('mousedown', this.onStart);
|
|
342
|
+
this.el.addEventListener('mousemove', this.onMove);
|
|
343
|
+
this.el.addEventListener('mouseup', this.onEnd);
|
|
344
|
+
// get BCR of pullDown element to position it above
|
|
345
|
+
this.maxPullDownDistance =
|
|
346
|
+
(this._pullDown &&
|
|
347
|
+
this._pullDown.firstChild &&
|
|
348
|
+
this._pullDown.firstChild.getBoundingClientRect()
|
|
349
|
+
.height) ||
|
|
350
|
+
0;
|
|
351
|
+
this.forceUpdate();
|
|
352
|
+
if (typeof this.props.refreshFunction !== 'function') {
|
|
353
|
+
throw new Error("Mandatory prop \"refreshFunction\" missing.\n Pull Down To Refresh functionality will not work\n as expected. Check README.md for usage'");
|
|
354
|
+
}
|
|
355
|
+
}
|
|
356
|
+
};
|
|
357
|
+
InfiniteScroll.prototype.componentWillUnmount = function () {
|
|
358
|
+
if (this.el) {
|
|
359
|
+
this.el.removeEventListener('scroll', this
|
|
360
|
+
.throttledOnScrollListener);
|
|
361
|
+
if (this.props.pullDownToRefresh) {
|
|
362
|
+
this.el.removeEventListener('touchstart', this.onStart);
|
|
363
|
+
this.el.removeEventListener('touchmove', this.onMove);
|
|
364
|
+
this.el.removeEventListener('touchend', this.onEnd);
|
|
365
|
+
this.el.removeEventListener('mousedown', this.onStart);
|
|
366
|
+
this.el.removeEventListener('mousemove', this.onMove);
|
|
367
|
+
this.el.removeEventListener('mouseup', this.onEnd);
|
|
368
|
+
}
|
|
369
|
+
}
|
|
370
|
+
};
|
|
371
|
+
InfiniteScroll.prototype.UNSAFE_componentWillReceiveProps = function (props) {
|
|
372
|
+
// do nothing when dataLength and key are unchanged
|
|
373
|
+
if (this.props.key === props.key &&
|
|
374
|
+
this.props.dataLength === props.dataLength)
|
|
375
|
+
return;
|
|
376
|
+
this.actionTriggered = false;
|
|
377
|
+
// update state when new data was sent in
|
|
378
|
+
this.setState({
|
|
379
|
+
showLoader: false,
|
|
380
|
+
});
|
|
381
|
+
};
|
|
382
|
+
InfiniteScroll.prototype.isElementAtBottom = function (target, scrollThreshold) {
|
|
383
|
+
if (scrollThreshold === void 0) { scrollThreshold = 0.8; }
|
|
384
|
+
var clientHeight = target === document.body || target === document.documentElement
|
|
385
|
+
? window.screen.availHeight
|
|
386
|
+
: target.clientHeight;
|
|
387
|
+
var threshold = parseThreshold(scrollThreshold);
|
|
388
|
+
if (threshold.unit === ThresholdUnits.Pixel) {
|
|
389
|
+
return (target.scrollTop + clientHeight >= target.scrollHeight - threshold.value);
|
|
390
|
+
}
|
|
391
|
+
return (target.scrollTop + clientHeight >=
|
|
392
|
+
(threshold.value / 100) * target.scrollHeight);
|
|
393
|
+
};
|
|
394
|
+
InfiniteScroll.prototype.render = function () {
|
|
395
|
+
var _this = this;
|
|
396
|
+
var style = __assign({ height: this.props.height || 'auto', overflow: 'auto', WebkitOverflowScrolling: 'touch' }, this.props.style);
|
|
397
|
+
var hasChildren = this.props.hasChildren ||
|
|
398
|
+
!!(this.props.children &&
|
|
399
|
+
this.props.children instanceof Array &&
|
|
400
|
+
this.props.children.length);
|
|
401
|
+
// because heighted infiniteScroll visualy breaks
|
|
402
|
+
// on drag down as overflow becomes visible
|
|
403
|
+
var outerDivStyle = this.props.pullDownToRefresh && this.props.height
|
|
404
|
+
? { overflow: 'auto' }
|
|
405
|
+
: {};
|
|
406
|
+
return (React__default.createElement("div", { style: outerDivStyle, className: "infinite-scroll-component__outerdiv" },
|
|
407
|
+
React__default.createElement("div", { className: "infinite-scroll-component " + (this.props.className || ''), ref: function (infScroll) { return (_this._infScroll = infScroll); }, style: style },
|
|
408
|
+
this.props.pullDownToRefresh && (React__default.createElement("div", { style: { position: 'relative' }, ref: function (pullDown) { return (_this._pullDown = pullDown); } },
|
|
409
|
+
React__default.createElement("div", { style: {
|
|
410
|
+
position: 'absolute',
|
|
411
|
+
left: 0,
|
|
412
|
+
right: 0,
|
|
413
|
+
top: -1 * this.maxPullDownDistance,
|
|
414
|
+
} }, this.state.pullToRefreshThresholdBreached
|
|
415
|
+
? this.props.releaseToRefreshContent
|
|
416
|
+
: this.props.pullDownToRefreshContent))),
|
|
417
|
+
this.props.children,
|
|
418
|
+
!this.state.showLoader &&
|
|
419
|
+
!hasChildren &&
|
|
420
|
+
this.props.hasMore &&
|
|
421
|
+
this.props.loader,
|
|
422
|
+
this.state.showLoader && this.props.hasMore && this.props.loader,
|
|
423
|
+
!this.props.hasMore && this.props.endMessage)));
|
|
424
|
+
};
|
|
425
|
+
return InfiniteScroll;
|
|
426
|
+
}(React.Component));
|
|
427
|
+
|
|
428
|
+
exports.InfiniteScroll = InfiniteScroll;
|
package/dist/cjs/index.js
CHANGED
|
@@ -8,8 +8,8 @@ var _commonjsHelpers = require('./_commonjsHelpers-06173234.js');
|
|
|
8
8
|
var _toObject = require('./_to-object-329a650b.js');
|
|
9
9
|
var web_dom_iterable = require('./web.dom.iterable-5c889cf1.js');
|
|
10
10
|
require('./_library-dd23b178.js');
|
|
11
|
-
|
|
12
|
-
var toConsumableArray = require('./toConsumableArray-
|
|
11
|
+
require('./_iter-detect-234453c3.js');
|
|
12
|
+
var toConsumableArray = require('./toConsumableArray-25d0e2a3.js');
|
|
13
13
|
require('./_object-pie-68c5bcbc.js');
|
|
14
14
|
var _extends$2 = require('./extends-60837c34.js');
|
|
15
15
|
var inherits$2 = require('./inherits-e793003e.js');
|
|
@@ -25,18 +25,20 @@ var Card = _interopDefault(require('react-bootstrap/Card'));
|
|
|
25
25
|
var moment = require('./moment-66a6a284.js');
|
|
26
26
|
var Router = require('next/router');
|
|
27
27
|
var Router__default = _interopDefault(Router);
|
|
28
|
-
var
|
|
28
|
+
var index_es = require('./index.es-ab3f2690.js');
|
|
29
29
|
require('react-dom');
|
|
30
|
+
var visibilitySensor = require('./visibility-sensor-0c45a583.js');
|
|
30
31
|
var index = require('./index-b5eb3ff8.js');
|
|
31
32
|
var index$1 = require('./index-fa0fb52c.js');
|
|
33
|
+
var main = require('./main-bc4db521.js');
|
|
32
34
|
var entities = require('./entities-310b46ee.js');
|
|
33
35
|
var slicedToArray = require('./slicedToArray-419d467a.js');
|
|
34
|
-
var AdSlot = require('./AdSlot-
|
|
35
|
-
var promise = require('./promise-
|
|
36
|
-
var ADInfeed = require('./ADInfeed-
|
|
36
|
+
var AdSlot = require('./AdSlot-4d22aad4.js');
|
|
37
|
+
var promise = require('./promise-0a493c7a.js');
|
|
38
|
+
var ADInfeed = require('./ADInfeed-494f5e6b.js');
|
|
37
39
|
var DeckContent = require('./DeckContent.js');
|
|
38
40
|
var get$1 = require('./get-5aa7468c.js');
|
|
39
|
-
var GridContent = require('./GridContent-
|
|
41
|
+
var GridContent = require('./GridContent-2f42692a.js');
|
|
40
42
|
var AuthorComponent = require('./AuthorComponent-4706f297.js');
|
|
41
43
|
var DeckQueue = require('./DeckQueue.js');
|
|
42
44
|
require('react-bootstrap/Media');
|
|
@@ -57,7 +59,7 @@ var IssueDeck = require('./IssueDeck.js');
|
|
|
57
59
|
require('react-bootstrap/Badge');
|
|
58
60
|
var IssueContentDeck = require('./IssueContentDeck.js');
|
|
59
61
|
var Spinner = _interopDefault(require('react-bootstrap/Spinner'));
|
|
60
|
-
var TemplateNormal = require('./Normal-
|
|
62
|
+
var TemplateNormal = require('./Normal-4a0d7dfc.js');
|
|
61
63
|
require('react-bootstrap/ListGroup');
|
|
62
64
|
var Head = _interopDefault(require('next/head'));
|
|
63
65
|
var Accordion = _interopDefault(require('react-bootstrap/Accordion'));
|
|
@@ -660,7 +662,7 @@ var InfiniteScrollDeck = function InfiniteScrollDeck(props) {
|
|
|
660
662
|
React__default.Fragment,
|
|
661
663
|
null,
|
|
662
664
|
React__default.createElement(
|
|
663
|
-
|
|
665
|
+
index_es.InfiniteScroll,
|
|
664
666
|
{ dataLength: data && data.length, next: function next() {
|
|
665
667
|
return loadMore(values, setValues, per);
|
|
666
668
|
}, hasMore: scrolling, scrollThreshold: 0.9 },
|
|
@@ -2814,7 +2816,7 @@ var EventsDeck = function EventsDeck(_ref) {
|
|
|
2814
2816
|
'div',
|
|
2815
2817
|
{ className: 'cvent-events' },
|
|
2816
2818
|
React__default.createElement(
|
|
2817
|
-
|
|
2819
|
+
index_es.InfiniteScroll,
|
|
2818
2820
|
{ dataLength: data.length, next: loadMore, hasMore: scrolling, scrollThreshold: 0.9 },
|
|
2819
2821
|
cardLoader()
|
|
2820
2822
|
)
|
|
@@ -3159,7 +3161,7 @@ var CMEDeck = function CMEDeck(_ref) {
|
|
|
3159
3161
|
React__default.Fragment,
|
|
3160
3162
|
null,
|
|
3161
3163
|
React__default.createElement(
|
|
3162
|
-
|
|
3164
|
+
index_es.InfiniteScroll,
|
|
3163
3165
|
{
|
|
3164
3166
|
dataLength: data.length,
|
|
3165
3167
|
next: loadMore,
|
|
@@ -3510,9 +3512,7 @@ var ADFloatingFooter = function ADFloatingFooter(_ref) {
|
|
|
3510
3512
|
targeting = _floatingAd$targeting === undefined ? {} : _floatingAd$targeting,
|
|
3511
3513
|
_floatingAd$position = floatingAd.position,
|
|
3512
3514
|
position = _floatingAd$position === undefined ? 'float' : _floatingAd$position,
|
|
3513
|
-
networkID = floatingAd.networkID
|
|
3514
|
-
_floatingAd$sizes = floatingAd.sizes,
|
|
3515
|
-
sizes = _floatingAd$sizes === undefined ? [[1025, 100], [728, 90]] : _floatingAd$sizes;
|
|
3515
|
+
networkID = floatingAd.networkID;
|
|
3516
3516
|
|
|
3517
3517
|
var adTargeting = {
|
|
3518
3518
|
content_placement: targeting.content_placement,
|
|
@@ -3566,7 +3566,7 @@ var ADFloatingFooter = function ADFloatingFooter(_ref) {
|
|
|
3566
3566
|
className: className,
|
|
3567
3567
|
slotId: slotId,
|
|
3568
3568
|
networkID: networkID,
|
|
3569
|
-
sizes:
|
|
3569
|
+
sizes: [[1025, 100]],
|
|
3570
3570
|
adUnit: adUnit,
|
|
3571
3571
|
targeting: adTargeting,
|
|
3572
3572
|
refreshFlag: refreshFlag,
|
|
@@ -3770,84 +3770,6 @@ var ADWelcome = function ADWelcome(_ref) {
|
|
|
3770
3770
|
);
|
|
3771
3771
|
};
|
|
3772
3772
|
|
|
3773
|
-
var ADSponsoredResources = function ADSponsoredResources(_ref) {
|
|
3774
|
-
var sponsoredAd = _ref.sponsoredAd,
|
|
3775
|
-
_ref$minScreenWidth = _ref.minScreenWidth,
|
|
3776
|
-
minScreenWidth = _ref$minScreenWidth === undefined ? 1200 : _ref$minScreenWidth;
|
|
3777
|
-
var className = sponsoredAd.className,
|
|
3778
|
-
slotId = sponsoredAd.slotId,
|
|
3779
|
-
adUnit = sponsoredAd.adUnit,
|
|
3780
|
-
_sponsoredAd$targetin = sponsoredAd.targeting,
|
|
3781
|
-
targeting = _sponsoredAd$targetin === undefined ? {} : _sponsoredAd$targetin,
|
|
3782
|
-
_sponsoredAd$position = sponsoredAd.position,
|
|
3783
|
-
position = _sponsoredAd$position === undefined ? 'sponsor' : _sponsoredAd$position,
|
|
3784
|
-
networkID = sponsoredAd.networkID,
|
|
3785
|
-
sizes = sponsoredAd.sizes;
|
|
3786
|
-
|
|
3787
|
-
|
|
3788
|
-
var adTargeting = {
|
|
3789
|
-
content_placement: targeting.content_placement,
|
|
3790
|
-
tags: targeting.tags,
|
|
3791
|
-
document_group: targeting.document_group,
|
|
3792
|
-
document_url: targeting.document_url,
|
|
3793
|
-
pos: position,
|
|
3794
|
-
campaign_id: targeting.campaign_id,
|
|
3795
|
-
issue_url: targeting.issue_url,
|
|
3796
|
-
publication_url: targeting.publication_url
|
|
3797
|
-
};
|
|
3798
|
-
|
|
3799
|
-
var _useState = React.useState(false),
|
|
3800
|
-
_useState2 = slicedToArray._slicedToArray(_useState, 2),
|
|
3801
|
-
widthFlag = _useState2[0],
|
|
3802
|
-
setWidthFlag = _useState2[1];
|
|
3803
|
-
|
|
3804
|
-
React.useEffect(function () {
|
|
3805
|
-
if (window && window.innerWidth >= minScreenWidth) {
|
|
3806
|
-
setWidthFlag(true);
|
|
3807
|
-
}
|
|
3808
|
-
}, [minScreenWidth]);
|
|
3809
|
-
|
|
3810
|
-
var collapseAd = function collapseAd() {
|
|
3811
|
-
var parent = document.getElementById('sponsored-ad-wrapper');
|
|
3812
|
-
parent.style.height = '0%';
|
|
3813
|
-
parent.style.width = '0%';
|
|
3814
|
-
parent.style.display = 'none';
|
|
3815
|
-
};
|
|
3816
|
-
|
|
3817
|
-
var checkIsAdFound = function checkIsAdFound(isFound) {
|
|
3818
|
-
if (isFound) {
|
|
3819
|
-
var parent = document.getElementById('sponsored-ad-wrapper');
|
|
3820
|
-
parent.style.display = 'block';
|
|
3821
|
-
} else {
|
|
3822
|
-
collapseAd();
|
|
3823
|
-
}
|
|
3824
|
-
};
|
|
3825
|
-
if (widthFlag) {
|
|
3826
|
-
return React__default.createElement(
|
|
3827
|
-
React__default.Fragment,
|
|
3828
|
-
null,
|
|
3829
|
-
React__default.createElement(
|
|
3830
|
-
'div',
|
|
3831
|
-
{ id: 'sponsored-ad-wrapper', className: 'sponsored-ad-wrapper' },
|
|
3832
|
-
React__default.createElement(
|
|
3833
|
-
'div',
|
|
3834
|
-
{ className: 'sponsored-ad' },
|
|
3835
|
-
React__default.createElement(AdSlot.DFPAdSlot, {
|
|
3836
|
-
className: className,
|
|
3837
|
-
slotId: slotId,
|
|
3838
|
-
networkID: networkID,
|
|
3839
|
-
sizes: sizes,
|
|
3840
|
-
adUnit: adUnit,
|
|
3841
|
-
targeting: adTargeting,
|
|
3842
|
-
refreshFlag: false,
|
|
3843
|
-
checkIsAdFound: checkIsAdFound
|
|
3844
|
-
})
|
|
3845
|
-
)
|
|
3846
|
-
)
|
|
3847
|
-
);
|
|
3848
|
-
} else return null;
|
|
3849
|
-
};
|
|
3850
|
-
|
|
3851
3773
|
var urlFor$2 = function urlFor(source, builder) {
|
|
3852
3774
|
return builder.image(source).auto('format');
|
|
3853
3775
|
};
|
|
@@ -14308,7 +14230,7 @@ var MultiFigure = function MultiFigure(props) {
|
|
|
14308
14230
|
};
|
|
14309
14231
|
|
|
14310
14232
|
var Figure = dynamic(function () {
|
|
14311
|
-
return Promise.resolve().then(function () { return require('./Figure-
|
|
14233
|
+
return Promise.resolve().then(function () { return require('./Figure-04d4a60d.js'); });
|
|
14312
14234
|
}, { ssr: false });
|
|
14313
14235
|
|
|
14314
14236
|
var checkUrlIsExternal = function checkUrlIsExternal(url) {
|
|
@@ -18246,7 +18168,7 @@ var ArticleQueue = function ArticleQueue(props) {
|
|
|
18246
18168
|
};
|
|
18247
18169
|
|
|
18248
18170
|
return React__default.createElement(
|
|
18249
|
-
|
|
18171
|
+
index_es.InfiniteScroll,
|
|
18250
18172
|
{ dataLength: queueData.length, next: loadmore, scrollThreshold: '60%', hasMore: true, style: { overflow: 'hidden' } },
|
|
18251
18173
|
queueData.map(function (article, index) {
|
|
18252
18174
|
if (!checkSponseredArticle(article) && Ads.getVideoContextualAD) {
|
|
@@ -23262,7 +23184,7 @@ var ArticleQueue$1 = function ArticleQueue(props) {
|
|
|
23262
23184
|
};
|
|
23263
23185
|
|
|
23264
23186
|
return React__default.createElement(
|
|
23265
|
-
|
|
23187
|
+
index_es.InfiniteScroll,
|
|
23266
23188
|
{ dataLength: queueData.length, next: loadmore, scrollThreshold: '60%', hasMore: true, style: { overflow: 'hidden' } },
|
|
23267
23189
|
queueData.map(function (article, index) {
|
|
23268
23190
|
if (!checkSponseredArticle(article) && Ads.getVideoContextualAD) {
|
|
@@ -23453,6 +23375,7 @@ exports.PublicationDeck = PublicationDeck;
|
|
|
23453
23375
|
exports.IssueDeck = IssueDeck;
|
|
23454
23376
|
exports.IssueContentDeck = IssueContentDeck;
|
|
23455
23377
|
exports.AD728x90 = TemplateNormal.AD728x90;
|
|
23378
|
+
exports.ADSponsoredResources = TemplateNormal.ADSponsoredResources;
|
|
23456
23379
|
exports.Column1 = TemplateNormal.Column1;
|
|
23457
23380
|
exports.Column2 = TemplateNormal.Column2;
|
|
23458
23381
|
exports.Column3 = TemplateNormal.Column3;
|
|
@@ -23473,7 +23396,6 @@ exports.AD300x250x600 = AD300x250x600;
|
|
|
23473
23396
|
exports.ADFloatingFooter = ADFloatingFooter;
|
|
23474
23397
|
exports.ADFooter = ADFooter;
|
|
23475
23398
|
exports.ADGutter = ADGutter;
|
|
23476
|
-
exports.ADSponsoredResources = ADSponsoredResources;
|
|
23477
23399
|
exports.ADWelcome = ADWelcome;
|
|
23478
23400
|
exports.AccordionPanel = AccordionPanel;
|
|
23479
23401
|
exports.AdSlotsProvider = AdSlotsProvider;
|