@egjs/react-flicking 4.10.7 → 4.10.9
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/declaration/ReactRenderer.d.ts +1 -0
- package/dist/flicking.cjs.js +43 -185
- package/dist/flicking.cjs.js.map +1 -1
- package/dist/flicking.esm.js +43 -185
- package/dist/flicking.esm.js.map +1 -1
- package/dist/flicking.umd.js +43 -185
- package/dist/flicking.umd.js.map +1 -1
- package/package.json +4 -4
- package/src/react-flicking/ReactRenderer.ts +5 -0
package/dist/flicking.umd.js
CHANGED
|
@@ -4,7 +4,7 @@ name: @egjs/react-flicking
|
|
|
4
4
|
license: MIT
|
|
5
5
|
author: NAVER Corp.
|
|
6
6
|
repository: https://github.com/naver/egjs-flicking/tree/master/packages/react-flicking
|
|
7
|
-
version: 4.10.
|
|
7
|
+
version: 4.10.9
|
|
8
8
|
*/
|
|
9
9
|
(function (global, factory) {
|
|
10
10
|
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('@egjs/component'), require('@egjs/list-differ'), require('@egjs/flicking'), require('react-dom')) :
|
|
@@ -12,7 +12,7 @@ version: 4.10.7
|
|
|
12
12
|
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.ReactFlicking = factory(global.React, global.Component, global.eg.ListDiffer, global.Flicking, global.ReactDOM));
|
|
13
13
|
})(this, (function (React, Component, ListDiffer, VanillaFlicking, reactDom) { 'use strict';
|
|
14
14
|
|
|
15
|
-
|
|
15
|
+
/******************************************************************************
|
|
16
16
|
Copyright (c) Microsoft Corporation.
|
|
17
17
|
|
|
18
18
|
Permission to use, copy, modify, and/or distribute this software for any
|
|
@@ -26,8 +26,8 @@ version: 4.10.7
|
|
|
26
26
|
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
27
27
|
PERFORMANCE OF THIS SOFTWARE.
|
|
28
28
|
***************************************************************************** */
|
|
29
|
-
|
|
30
29
|
/* global Reflect, Promise */
|
|
30
|
+
|
|
31
31
|
var extendStatics = function (d, b) {
|
|
32
32
|
extendStatics = Object.setPrototypeOf || {
|
|
33
33
|
__proto__: []
|
|
@@ -36,38 +36,29 @@ version: 4.10.7
|
|
|
36
36
|
} || function (d, b) {
|
|
37
37
|
for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p];
|
|
38
38
|
};
|
|
39
|
-
|
|
40
39
|
return extendStatics(d, b);
|
|
41
40
|
};
|
|
42
|
-
|
|
43
41
|
function __extends(d, b) {
|
|
44
42
|
if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
|
|
45
43
|
extendStatics(d, b);
|
|
46
|
-
|
|
47
44
|
function __() {
|
|
48
45
|
this.constructor = d;
|
|
49
46
|
}
|
|
50
|
-
|
|
51
47
|
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
52
48
|
}
|
|
53
49
|
var __assign = function () {
|
|
54
50
|
__assign = Object.assign || function __assign(t) {
|
|
55
51
|
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
56
52
|
s = arguments[i];
|
|
57
|
-
|
|
58
53
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
59
54
|
}
|
|
60
|
-
|
|
61
55
|
return t;
|
|
62
56
|
};
|
|
63
|
-
|
|
64
57
|
return __assign.apply(this, arguments);
|
|
65
58
|
};
|
|
66
59
|
function __rest(s, e) {
|
|
67
60
|
var t = {};
|
|
68
|
-
|
|
69
61
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
70
|
-
|
|
71
62
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
72
63
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
73
64
|
}
|
|
@@ -75,8 +66,8 @@ version: 4.10.7
|
|
|
75
66
|
}
|
|
76
67
|
function __decorate(decorators, target, key, desc) {
|
|
77
68
|
var c = arguments.length,
|
|
78
|
-
|
|
79
|
-
|
|
69
|
+
r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
|
|
70
|
+
d;
|
|
80
71
|
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
81
72
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
82
73
|
}
|
|
@@ -86,7 +77,6 @@ version: 4.10.7
|
|
|
86
77
|
resolve(value);
|
|
87
78
|
});
|
|
88
79
|
}
|
|
89
|
-
|
|
90
80
|
return new (P || (P = Promise))(function (resolve, reject) {
|
|
91
81
|
function fulfilled(value) {
|
|
92
82
|
try {
|
|
@@ -95,7 +85,6 @@ version: 4.10.7
|
|
|
95
85
|
reject(e);
|
|
96
86
|
}
|
|
97
87
|
}
|
|
98
|
-
|
|
99
88
|
function rejected(value) {
|
|
100
89
|
try {
|
|
101
90
|
step(generator["throw"](value));
|
|
@@ -103,28 +92,26 @@ version: 4.10.7
|
|
|
103
92
|
reject(e);
|
|
104
93
|
}
|
|
105
94
|
}
|
|
106
|
-
|
|
107
95
|
function step(result) {
|
|
108
96
|
result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
|
|
109
97
|
}
|
|
110
|
-
|
|
111
98
|
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
112
99
|
});
|
|
113
100
|
}
|
|
114
101
|
function __generator(thisArg, body) {
|
|
115
102
|
var _ = {
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
103
|
+
label: 0,
|
|
104
|
+
sent: function () {
|
|
105
|
+
if (t[0] & 1) throw t[1];
|
|
106
|
+
return t[1];
|
|
107
|
+
},
|
|
108
|
+
trys: [],
|
|
109
|
+
ops: []
|
|
120
110
|
},
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
y,
|
|
126
|
-
t,
|
|
127
|
-
g;
|
|
111
|
+
f,
|
|
112
|
+
y,
|
|
113
|
+
t,
|
|
114
|
+
g;
|
|
128
115
|
return g = {
|
|
129
116
|
next: verb(0),
|
|
130
117
|
"throw": verb(1),
|
|
@@ -132,78 +119,59 @@ version: 4.10.7
|
|
|
132
119
|
}, typeof Symbol === "function" && (g[Symbol.iterator] = function () {
|
|
133
120
|
return this;
|
|
134
121
|
}), g;
|
|
135
|
-
|
|
136
122
|
function verb(n) {
|
|
137
123
|
return function (v) {
|
|
138
124
|
return step([n, v]);
|
|
139
125
|
};
|
|
140
126
|
}
|
|
141
|
-
|
|
142
127
|
function step(op) {
|
|
143
128
|
if (f) throw new TypeError("Generator is already executing.");
|
|
144
|
-
|
|
145
|
-
while (_) try {
|
|
129
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
146
130
|
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
147
131
|
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
148
|
-
|
|
149
132
|
switch (op[0]) {
|
|
150
133
|
case 0:
|
|
151
134
|
case 1:
|
|
152
135
|
t = op;
|
|
153
136
|
break;
|
|
154
|
-
|
|
155
137
|
case 4:
|
|
156
138
|
_.label++;
|
|
157
139
|
return {
|
|
158
140
|
value: op[1],
|
|
159
141
|
done: false
|
|
160
142
|
};
|
|
161
|
-
|
|
162
143
|
case 5:
|
|
163
144
|
_.label++;
|
|
164
145
|
y = op[1];
|
|
165
146
|
op = [0];
|
|
166
147
|
continue;
|
|
167
|
-
|
|
168
148
|
case 7:
|
|
169
149
|
op = _.ops.pop();
|
|
170
|
-
|
|
171
150
|
_.trys.pop();
|
|
172
|
-
|
|
173
151
|
continue;
|
|
174
|
-
|
|
175
152
|
default:
|
|
176
153
|
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
|
|
177
154
|
_ = 0;
|
|
178
155
|
continue;
|
|
179
156
|
}
|
|
180
|
-
|
|
181
157
|
if (op[0] === 3 && (!t || op[1] > t[0] && op[1] < t[3])) {
|
|
182
158
|
_.label = op[1];
|
|
183
159
|
break;
|
|
184
160
|
}
|
|
185
|
-
|
|
186
161
|
if (op[0] === 6 && _.label < t[1]) {
|
|
187
162
|
_.label = t[1];
|
|
188
163
|
t = op;
|
|
189
164
|
break;
|
|
190
165
|
}
|
|
191
|
-
|
|
192
166
|
if (t && _.label < t[2]) {
|
|
193
167
|
_.label = t[2];
|
|
194
|
-
|
|
195
168
|
_.ops.push(op);
|
|
196
|
-
|
|
197
169
|
break;
|
|
198
170
|
}
|
|
199
|
-
|
|
200
171
|
if (t[2]) _.ops.pop();
|
|
201
|
-
|
|
202
172
|
_.trys.pop();
|
|
203
|
-
|
|
204
173
|
continue;
|
|
205
174
|
}
|
|
206
|
-
|
|
207
175
|
op = body.call(thisArg, _);
|
|
208
176
|
} catch (e) {
|
|
209
177
|
op = [6, e];
|
|
@@ -211,7 +179,6 @@ version: 4.10.7
|
|
|
211
179
|
} finally {
|
|
212
180
|
f = t = 0;
|
|
213
181
|
}
|
|
214
|
-
|
|
215
182
|
if (op[0] & 5) throw op[1];
|
|
216
183
|
return {
|
|
217
184
|
value: op[0] ? op[1] : void 0,
|
|
@@ -256,27 +223,19 @@ version: 4.10.7
|
|
|
256
223
|
onPanelChange: function (e) {}
|
|
257
224
|
};
|
|
258
225
|
|
|
259
|
-
var ReactRenderer =
|
|
260
|
-
/*#__PURE__*/
|
|
261
|
-
function (_super) {
|
|
226
|
+
var ReactRenderer = /*#__PURE__*/function (_super) {
|
|
262
227
|
__extends(ReactRenderer, _super);
|
|
263
|
-
|
|
264
228
|
function ReactRenderer(options) {
|
|
265
229
|
var _this = _super.call(this, options) || this;
|
|
266
|
-
|
|
267
230
|
_this._reactFlicking = options.reactFlicking;
|
|
268
231
|
return _this;
|
|
269
|
-
}
|
|
270
|
-
|
|
271
|
-
|
|
232
|
+
}
|
|
233
|
+
// eslint-disable-next-line @typescript-eslint/require-await
|
|
272
234
|
var __proto = ReactRenderer.prototype;
|
|
273
|
-
|
|
274
235
|
__proto.render = function () {
|
|
275
236
|
return __awaiter(this, void 0, void 0, function () {
|
|
276
237
|
var flicking, reactFlicking, strategy;
|
|
277
|
-
|
|
278
238
|
var _this = this;
|
|
279
|
-
|
|
280
239
|
return __generator(this, function (_a) {
|
|
281
240
|
flicking = VanillaFlicking.getFlickingAttached(this._flicking);
|
|
282
241
|
reactFlicking = this._reactFlicking;
|
|
@@ -284,14 +243,10 @@ version: 4.10.7
|
|
|
284
243
|
this._rendering = true;
|
|
285
244
|
strategy.updateRenderingPanels(flicking);
|
|
286
245
|
strategy.renderPanels(flicking);
|
|
287
|
-
return [2
|
|
288
|
-
/*return*/
|
|
289
|
-
, new Promise(function (resolve) {
|
|
246
|
+
return [2 /*return*/, new Promise(function (resolve) {
|
|
290
247
|
reactFlicking.renderEmitter.once("render", function () {
|
|
291
248
|
_this._rendering = false;
|
|
292
|
-
|
|
293
249
|
_this._afterRender();
|
|
294
|
-
|
|
295
250
|
resolve();
|
|
296
251
|
});
|
|
297
252
|
reactFlicking.forceUpdate();
|
|
@@ -299,28 +254,19 @@ version: 4.10.7
|
|
|
299
254
|
});
|
|
300
255
|
});
|
|
301
256
|
};
|
|
302
|
-
|
|
303
257
|
__proto.forceRenderAllPanels = function () {
|
|
304
258
|
return __awaiter(this, void 0, void 0, function () {
|
|
305
259
|
var reactFlicking;
|
|
306
|
-
|
|
307
260
|
var _this = this;
|
|
308
|
-
|
|
309
261
|
return __generator(this, function (_a) {
|
|
310
262
|
switch (_a.label) {
|
|
311
263
|
case 0:
|
|
312
264
|
reactFlicking = this._reactFlicking;
|
|
313
265
|
this._rendering = true;
|
|
314
|
-
return [4
|
|
315
|
-
/*yield*/
|
|
316
|
-
, _super.prototype.forceRenderAllPanels.call(this)];
|
|
317
|
-
|
|
266
|
+
return [4 /*yield*/, _super.prototype.forceRenderAllPanels.call(this)];
|
|
318
267
|
case 1:
|
|
319
268
|
_a.sent();
|
|
320
|
-
|
|
321
|
-
return [2
|
|
322
|
-
/*return*/
|
|
323
|
-
, new Promise(function (resolve) {
|
|
269
|
+
return [2 /*return*/, new Promise(function (resolve) {
|
|
324
270
|
reactFlicking.renderEmitter.once("render", function () {
|
|
325
271
|
_this._rendering = false;
|
|
326
272
|
resolve();
|
|
@@ -331,34 +277,30 @@ version: 4.10.7
|
|
|
331
277
|
});
|
|
332
278
|
});
|
|
333
279
|
};
|
|
334
|
-
|
|
280
|
+
__proto.destroy = function () {
|
|
281
|
+
_super.prototype.destroy.call(this);
|
|
282
|
+
this._reactFlicking.renderEmitter.off("render");
|
|
283
|
+
};
|
|
335
284
|
__proto._collectPanels = function () {
|
|
336
285
|
var flicking = VanillaFlicking.getFlickingAttached(this._flicking);
|
|
337
286
|
var reactFlicking = this._reactFlicking;
|
|
338
287
|
var reactPanels = reactFlicking.reactPanels;
|
|
339
288
|
this._panels = this._strategy.collectPanels(flicking, reactPanels);
|
|
340
289
|
};
|
|
341
|
-
|
|
342
290
|
__proto._createPanel = function (externalComponent, options) {
|
|
343
291
|
return this._strategy.createPanel(externalComponent, options);
|
|
344
292
|
};
|
|
345
|
-
|
|
346
293
|
return ReactRenderer;
|
|
347
294
|
}(VanillaFlicking.ExternalRenderer);
|
|
348
295
|
|
|
349
|
-
var StrictPanel =
|
|
350
|
-
/*#__PURE__*/
|
|
351
|
-
function (_super) {
|
|
296
|
+
var StrictPanel = /*#__PURE__*/function (_super) {
|
|
352
297
|
__extends(StrictPanel, _super);
|
|
353
|
-
|
|
354
298
|
function StrictPanel() {
|
|
355
299
|
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
356
|
-
|
|
357
300
|
_this._hide = false;
|
|
358
301
|
_this._elRef = React.createRef();
|
|
359
302
|
return _this;
|
|
360
303
|
}
|
|
361
|
-
|
|
362
304
|
var __proto = StrictPanel.prototype;
|
|
363
305
|
Object.defineProperty(__proto, "nativeElement", {
|
|
364
306
|
get: function () {
|
|
@@ -374,40 +316,30 @@ version: 4.10.7
|
|
|
374
316
|
enumerable: false,
|
|
375
317
|
configurable: true
|
|
376
318
|
});
|
|
377
|
-
|
|
378
319
|
__proto.render = function () {
|
|
379
320
|
return this._hide ? React.createElement(React.Fragment, null) : this._getElement();
|
|
380
321
|
};
|
|
381
|
-
|
|
382
322
|
__proto.show = function () {
|
|
383
323
|
this._hide = false;
|
|
384
324
|
};
|
|
385
|
-
|
|
386
325
|
__proto.hide = function () {
|
|
387
326
|
this._hide = true;
|
|
388
327
|
};
|
|
389
|
-
|
|
390
328
|
__proto._getElement = function () {
|
|
391
329
|
return React.cloneElement(React.Children.only(this.props.children), {
|
|
392
330
|
ref: this._elRef
|
|
393
331
|
});
|
|
394
332
|
};
|
|
395
|
-
|
|
396
333
|
return StrictPanel;
|
|
397
334
|
}(React.Component);
|
|
398
335
|
|
|
399
|
-
var NonStrictPanel =
|
|
400
|
-
/*#__PURE__*/
|
|
401
|
-
function (_super) {
|
|
336
|
+
var NonStrictPanel = /*#__PURE__*/function (_super) {
|
|
402
337
|
__extends(NonStrictPanel, _super);
|
|
403
|
-
|
|
404
338
|
function NonStrictPanel() {
|
|
405
339
|
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
406
|
-
|
|
407
340
|
_this._hide = false;
|
|
408
341
|
return _this;
|
|
409
342
|
}
|
|
410
|
-
|
|
411
343
|
var __proto = NonStrictPanel.prototype;
|
|
412
344
|
Object.defineProperty(__proto, "nativeElement", {
|
|
413
345
|
get: function () {
|
|
@@ -423,19 +355,15 @@ version: 4.10.7
|
|
|
423
355
|
enumerable: false,
|
|
424
356
|
configurable: true
|
|
425
357
|
});
|
|
426
|
-
|
|
427
358
|
__proto.render = function () {
|
|
428
359
|
return this._hide ? React.createElement(React.Fragment, null) : this.props.children;
|
|
429
360
|
};
|
|
430
|
-
|
|
431
361
|
__proto.show = function () {
|
|
432
362
|
this._hide = false;
|
|
433
363
|
};
|
|
434
|
-
|
|
435
364
|
__proto.hide = function () {
|
|
436
365
|
this._hide = true;
|
|
437
366
|
};
|
|
438
|
-
|
|
439
367
|
return NonStrictPanel;
|
|
440
368
|
}(React.Component);
|
|
441
369
|
|
|
@@ -447,13 +375,10 @@ version: 4.10.7
|
|
|
447
375
|
return React.createElement(React.Fragment, null, props.children);
|
|
448
376
|
});
|
|
449
377
|
|
|
450
|
-
var ReactElementProvider =
|
|
451
|
-
/*#__PURE__*/
|
|
452
|
-
function () {
|
|
378
|
+
var ReactElementProvider = /*#__PURE__*/function () {
|
|
453
379
|
function ReactElementProvider(el) {
|
|
454
380
|
this._el = el;
|
|
455
381
|
}
|
|
456
|
-
|
|
457
382
|
var __proto = ReactElementProvider.prototype;
|
|
458
383
|
Object.defineProperty(__proto, "element", {
|
|
459
384
|
get: function () {
|
|
@@ -469,36 +394,26 @@ version: 4.10.7
|
|
|
469
394
|
enumerable: false,
|
|
470
395
|
configurable: true
|
|
471
396
|
});
|
|
472
|
-
|
|
473
397
|
__proto.show = function () {
|
|
474
398
|
this._el.show();
|
|
475
399
|
};
|
|
476
|
-
|
|
477
400
|
__proto.hide = function () {
|
|
478
401
|
this._el.hide();
|
|
479
402
|
};
|
|
480
|
-
|
|
481
403
|
return ReactElementProvider;
|
|
482
404
|
}();
|
|
483
405
|
|
|
484
|
-
var Flicking =
|
|
485
|
-
/*#__PURE__*/
|
|
486
|
-
function (_super) {
|
|
406
|
+
var Flicking = /*#__PURE__*/function (_super) {
|
|
487
407
|
__extends(Flicking, _super);
|
|
488
|
-
|
|
489
408
|
function Flicking(props) {
|
|
490
409
|
var _this = _super.call(this, props) || this;
|
|
491
|
-
|
|
492
410
|
_this._panels = [];
|
|
493
411
|
_this._renderEmitter = new Component();
|
|
494
|
-
|
|
495
412
|
var children = _this._getChildren();
|
|
496
|
-
|
|
497
413
|
_this._panels = _this._createPanelRefs(props, children);
|
|
498
414
|
_this._prevChildren = children;
|
|
499
415
|
return _this;
|
|
500
416
|
}
|
|
501
|
-
|
|
502
417
|
var __proto = Flicking.prototype;
|
|
503
418
|
Object.defineProperty(__proto, "reactPanels", {
|
|
504
419
|
get: function () {
|
|
@@ -516,7 +431,6 @@ version: 4.10.7
|
|
|
516
431
|
enumerable: false,
|
|
517
432
|
configurable: true
|
|
518
433
|
});
|
|
519
|
-
|
|
520
434
|
__proto.componentDidMount = function () {
|
|
521
435
|
var props = this.props;
|
|
522
436
|
var rendererOptions = {
|
|
@@ -530,134 +444,103 @@ version: 4.10.7
|
|
|
530
444
|
externalRenderer: new ReactRenderer(rendererOptions)
|
|
531
445
|
}));
|
|
532
446
|
this._vanillaFlicking = flicking;
|
|
533
|
-
|
|
534
447
|
var children = this._getChildren();
|
|
535
|
-
|
|
536
448
|
this._jsxDiffer = new ListDiffer(children, function (panel) {
|
|
537
449
|
return panel.key;
|
|
538
450
|
});
|
|
539
451
|
this._pluginsDiffer = new ListDiffer();
|
|
540
452
|
this._prevChildren = children;
|
|
541
|
-
|
|
542
453
|
this._bindEvents();
|
|
543
|
-
|
|
544
454
|
this._checkPlugins();
|
|
545
|
-
|
|
546
455
|
if (props.status) {
|
|
547
456
|
flicking.setStatus(props.status);
|
|
548
457
|
}
|
|
549
458
|
};
|
|
550
|
-
|
|
551
459
|
__proto.componentWillUnmount = function () {
|
|
552
460
|
var _a;
|
|
553
|
-
|
|
554
461
|
(_a = this._vanillaFlicking) === null || _a === void 0 ? void 0 : _a.destroy();
|
|
555
462
|
};
|
|
556
|
-
|
|
557
463
|
__proto.shouldComponentUpdate = function (nextProps) {
|
|
558
464
|
var vanillaFlicking = this._vanillaFlicking;
|
|
559
465
|
var prevProps = this.props;
|
|
560
466
|
if (!vanillaFlicking || !vanillaFlicking.initialized) return false;
|
|
561
|
-
|
|
562
467
|
var children = nextProps.children,
|
|
563
|
-
|
|
564
|
-
|
|
468
|
+
restProps = __rest(nextProps, ["children"]);
|
|
565
469
|
for (var key in restProps) {
|
|
566
470
|
if (prevProps[key] !== nextProps[key]) {
|
|
567
471
|
return true;
|
|
568
472
|
}
|
|
569
473
|
}
|
|
570
|
-
|
|
571
474
|
var prevChildren = this._prevChildren;
|
|
572
|
-
|
|
573
475
|
var nextChildren = this._getChildren(children);
|
|
574
|
-
|
|
575
476
|
if (nextProps.renderOnSameKey || !this._hasSameChildren(prevChildren, nextChildren)) return true;
|
|
576
477
|
return false;
|
|
577
478
|
};
|
|
578
|
-
|
|
579
479
|
__proto.beforeRender = function () {
|
|
580
480
|
var vanillaFlicking = this._vanillaFlicking;
|
|
581
481
|
var props = this.props;
|
|
582
|
-
var prevChildren = this._prevChildren;
|
|
482
|
+
var prevChildren = this._prevChildren;
|
|
483
|
+
// Ignore updates before init, they will be updated after "ready" event's force update
|
|
583
484
|
// Also, prevent updates when another update is already queued.
|
|
584
485
|
// This usually happens when render() called twice without calling componentDidMount, like in the case of React.StrictMode.
|
|
585
|
-
|
|
586
486
|
if (!vanillaFlicking || !vanillaFlicking.initialized || this._diffResult) return;
|
|
587
|
-
|
|
588
487
|
var nextChildren = this._getChildren(props.children);
|
|
589
|
-
|
|
590
488
|
if (props.renderOnSameKey || !this._hasSameChildren(prevChildren, nextChildren)) {
|
|
591
489
|
this._panels = this._createPanelRefs(props, nextChildren);
|
|
592
490
|
this._diffResult = this._jsxDiffer.update(nextChildren);
|
|
593
491
|
this._prevChildren = nextChildren;
|
|
594
492
|
}
|
|
595
493
|
};
|
|
596
|
-
|
|
597
494
|
__proto.componentDidUpdate = function () {
|
|
598
495
|
var flicking = this._vanillaFlicking;
|
|
599
496
|
var renderEmitter = this._renderEmitter;
|
|
600
497
|
var diffResult = this._diffResult;
|
|
601
|
-
|
|
602
498
|
this._checkPlugins();
|
|
603
|
-
|
|
604
499
|
renderEmitter.trigger("render");
|
|
605
|
-
flicking.camera.updateOffset();
|
|
606
|
-
|
|
500
|
+
flicking.camera.updateOffset();
|
|
501
|
+
// Omit 'virtual', as it can't have any setter
|
|
607
502
|
var _a = this.props;
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
503
|
+
_a.virtual;
|
|
504
|
+
var props = __rest(_a, ["virtual"]);
|
|
611
505
|
for (var key in props) {
|
|
612
506
|
if (key in flicking && flicking[key] !== props[key]) {
|
|
613
507
|
flicking[key] = props[key];
|
|
614
508
|
}
|
|
615
509
|
}
|
|
616
|
-
|
|
617
510
|
if (!diffResult || !flicking.initialized) return;
|
|
618
511
|
VanillaFlicking.sync(flicking, diffResult, this.reactPanels);
|
|
619
512
|
this._diffResult = null;
|
|
620
513
|
};
|
|
621
|
-
|
|
622
514
|
__proto.render = function () {
|
|
623
515
|
var _this = this;
|
|
624
|
-
|
|
625
516
|
var _a, _b;
|
|
626
|
-
|
|
627
517
|
var props = this.props;
|
|
628
518
|
var Viewport = props.viewportTag;
|
|
629
519
|
var Camera = props.cameraTag;
|
|
630
520
|
var attributes = {};
|
|
631
521
|
var flicking = this._vanillaFlicking;
|
|
632
522
|
this.beforeRender();
|
|
633
|
-
|
|
634
523
|
for (var name in props) {
|
|
635
524
|
if (!(name in DEFAULT_PROPS) && !(name in VanillaFlicking.prototype)) {
|
|
636
525
|
attributes[name] = props[name];
|
|
637
526
|
}
|
|
638
527
|
}
|
|
639
|
-
|
|
640
528
|
var initialized = flicking && flicking.initialized;
|
|
641
529
|
var viewportClasses = ["flicking-viewport"];
|
|
642
530
|
var cameraClasses = ["flicking-camera"];
|
|
643
531
|
var isHorizontal = flicking ? flicking.horizontal : (_a = props.horizontal) !== null && _a !== void 0 ? _a : true;
|
|
644
|
-
|
|
645
532
|
if (!isHorizontal) {
|
|
646
533
|
viewportClasses.push("vertical");
|
|
647
534
|
}
|
|
648
|
-
|
|
649
535
|
if (props.hideBeforeInit && !initialized) {
|
|
650
536
|
viewportClasses.push("flicking-hidden");
|
|
651
537
|
}
|
|
652
|
-
|
|
653
538
|
if (attributes.className) {
|
|
654
539
|
viewportClasses.push(attributes.className);
|
|
655
540
|
}
|
|
656
|
-
|
|
657
541
|
if (props.cameraClass) {
|
|
658
542
|
cameraClasses.push(props.cameraClass);
|
|
659
543
|
}
|
|
660
|
-
|
|
661
544
|
var cameraProps = !initialized && props.firstPanelSize ? {
|
|
662
545
|
style: {
|
|
663
546
|
transform: VanillaFlicking.getDefaultCameraTransform(this.props.align, this.props.horizontal, this.props.firstPanelSize)
|
|
@@ -673,10 +556,8 @@ version: 4.10.7
|
|
|
673
556
|
className: cameraClasses.join(" ")
|
|
674
557
|
}, cameraProps), panels), this._getViewportSlot());
|
|
675
558
|
};
|
|
676
|
-
|
|
677
559
|
__proto._createPanelRefs = function (props, children) {
|
|
678
560
|
var _a;
|
|
679
|
-
|
|
680
561
|
var panelsPerView = (_a = props.panelsPerView) !== null && _a !== void 0 ? _a : -1;
|
|
681
562
|
return panelsPerView > 0 && !!props.virtual ? VanillaFlicking.range(panelsPerView + 1).map(function () {
|
|
682
563
|
return React.createRef();
|
|
@@ -684,10 +565,8 @@ version: 4.10.7
|
|
|
684
565
|
return React.createRef();
|
|
685
566
|
});
|
|
686
567
|
};
|
|
687
|
-
|
|
688
568
|
__proto._bindEvents = function () {
|
|
689
569
|
var _this = this;
|
|
690
|
-
|
|
691
570
|
var flicking = this._vanillaFlicking;
|
|
692
571
|
Object.keys(VanillaFlicking.EVENTS).forEach(function (eventKey) {
|
|
693
572
|
var eventName = VanillaFlicking.EVENTS[eventKey];
|
|
@@ -702,16 +581,13 @@ version: 4.10.7
|
|
|
702
581
|
_this.forceUpdate();
|
|
703
582
|
});
|
|
704
583
|
};
|
|
705
|
-
|
|
706
584
|
__proto._checkPlugins = function () {
|
|
707
585
|
var flicking = this._vanillaFlicking;
|
|
708
|
-
|
|
709
586
|
var _a = this._pluginsDiffer.update(this.props.plugins),
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
587
|
+
list = _a.list,
|
|
588
|
+
added = _a.added,
|
|
589
|
+
removed = _a.removed,
|
|
590
|
+
prevList = _a.prevList;
|
|
715
591
|
flicking.addPlugins.apply(flicking, added.map(function (index) {
|
|
716
592
|
return list[index];
|
|
717
593
|
}));
|
|
@@ -719,12 +595,10 @@ version: 4.10.7
|
|
|
719
595
|
return prevList[index];
|
|
720
596
|
}));
|
|
721
597
|
};
|
|
722
|
-
|
|
723
598
|
__proto._hasSameChildren = function (prevChildren, nextChildren) {
|
|
724
599
|
if (prevChildren.length !== nextChildren.length || prevChildren.length === 0) return false;
|
|
725
600
|
var same = prevChildren.every(function (child, idx) {
|
|
726
601
|
var nextChild = nextChildren[idx];
|
|
727
|
-
|
|
728
602
|
if (child.key && nextChild.key) {
|
|
729
603
|
return child.key === nextChild.key;
|
|
730
604
|
} else {
|
|
@@ -733,40 +607,32 @@ version: 4.10.7
|
|
|
733
607
|
});
|
|
734
608
|
return same;
|
|
735
609
|
};
|
|
736
|
-
|
|
737
610
|
__proto._getChildren = function (children) {
|
|
738
611
|
var _this = this;
|
|
739
|
-
|
|
740
612
|
if (children === void 0) {
|
|
741
613
|
children = this.props.children;
|
|
742
614
|
}
|
|
743
|
-
|
|
744
615
|
return React.Children.toArray(children).filter(function (child) {
|
|
745
616
|
return child.type !== ViewportSlot;
|
|
746
617
|
}).reduce(function (all, child) {
|
|
747
618
|
return __spreadArray(__spreadArray([], all, true), _this._unpackFragment(child), true);
|
|
748
619
|
}, []);
|
|
749
620
|
};
|
|
750
|
-
|
|
751
621
|
__proto._getViewportSlot = function () {
|
|
752
622
|
return React.Children.toArray(this.props.children).filter(function (child) {
|
|
753
623
|
return child.type === ViewportSlot;
|
|
754
624
|
});
|
|
755
625
|
};
|
|
756
|
-
|
|
757
626
|
__proto._unpackFragment = function (child) {
|
|
758
627
|
var _this = this;
|
|
759
|
-
|
|
760
628
|
return this._isFragment(child) ? React.Children.toArray(child.props.children).reduce(function (allChilds, fragChild) {
|
|
761
629
|
return __spreadArray(__spreadArray([], allChilds, true), _this._unpackFragment(fragChild), true);
|
|
762
630
|
}, []) : [child];
|
|
763
631
|
};
|
|
764
|
-
|
|
765
632
|
__proto._getVirtualPanels = function () {
|
|
766
633
|
var _this = this;
|
|
767
|
-
|
|
768
634
|
var _a = this.props.virtual.panelClass,
|
|
769
|
-
|
|
635
|
+
panelClass = _a === void 0 ? "flicking-panel" : _a;
|
|
770
636
|
var panelsPerView = this.props.panelsPerView;
|
|
771
637
|
var flicking = this._vanillaFlicking;
|
|
772
638
|
var initialized = flicking && flicking.initialized;
|
|
@@ -787,12 +653,9 @@ version: 4.10.7
|
|
|
787
653
|
});
|
|
788
654
|
});
|
|
789
655
|
};
|
|
790
|
-
|
|
791
656
|
__proto._getPanels = function () {
|
|
792
657
|
var _this = this;
|
|
793
|
-
|
|
794
658
|
var origChildren = this._getChildren();
|
|
795
|
-
|
|
796
659
|
var vanillaFlicking = this._vanillaFlicking;
|
|
797
660
|
var diffResult = this._diffResult;
|
|
798
661
|
var children = vanillaFlicking && vanillaFlicking.initialized ? diffResult ? VanillaFlicking.getRenderingPanels(vanillaFlicking, diffResult) : VanillaFlicking.getRenderingPanels(vanillaFlicking, ListDiffer.diff(origChildren, origChildren)) : origChildren;
|
|
@@ -808,19 +671,14 @@ version: 4.10.7
|
|
|
808
671
|
}, child);
|
|
809
672
|
});
|
|
810
673
|
};
|
|
811
|
-
|
|
812
674
|
__proto._isFragment = function (child) {
|
|
813
675
|
if (child.type) {
|
|
814
676
|
return child.type === React.Fragment;
|
|
815
677
|
}
|
|
816
|
-
|
|
817
678
|
return child === React.Fragment;
|
|
818
679
|
};
|
|
819
|
-
|
|
820
680
|
Flicking.defaultProps = DEFAULT_PROPS;
|
|
821
|
-
|
|
822
681
|
__decorate([VanillaFlicking.withFlickingMethods], Flicking.prototype, "_vanillaFlicking", void 0);
|
|
823
|
-
|
|
824
682
|
return Flicking;
|
|
825
683
|
}(React.Component);
|
|
826
684
|
|