@egjs/react-flicking 4.16.2 → 4.16.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.
package/dist/flicking.js CHANGED
@@ -1,7 +1,61 @@
1
1
  (function(global, factory) {
2
2
  typeof exports === "object" && typeof module !== "undefined" ? module.exports = factory(require("react"), require("@egjs/component"), require("@egjs/flicking"), require("@egjs/list-differ")) : typeof define === "function" && define.amd ? define(["react", "@egjs/component", "@egjs/flicking", "@egjs/list-differ"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, global.ReactFlicking = factory(global.React, global.Component, global.Flicking, global.eg.ListDiffer));
3
3
  })(this, (function(React, Component, VanillaFlicking, ListDiffer) {
4
- "use strict";
4
+ "use strict";var __defProp = Object.defineProperty;
5
+ var __defProps = Object.defineProperties;
6
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
7
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
8
+ var __getProtoOf = Object.getPrototypeOf;
9
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
10
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
11
+ var __reflectGet = Reflect.get;
12
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
13
+ var __spreadValues = (a, b) => {
14
+ for (var prop in b || (b = {}))
15
+ if (__hasOwnProp.call(b, prop))
16
+ __defNormalProp(a, prop, b[prop]);
17
+ if (__getOwnPropSymbols)
18
+ for (var prop of __getOwnPropSymbols(b)) {
19
+ if (__propIsEnum.call(b, prop))
20
+ __defNormalProp(a, prop, b[prop]);
21
+ }
22
+ return a;
23
+ };
24
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
25
+ var __objRest = (source, exclude) => {
26
+ var target = {};
27
+ for (var prop in source)
28
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
29
+ target[prop] = source[prop];
30
+ if (source != null && __getOwnPropSymbols)
31
+ for (var prop of __getOwnPropSymbols(source)) {
32
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
33
+ target[prop] = source[prop];
34
+ }
35
+ return target;
36
+ };
37
+ var __superGet = (cls, obj, key) => __reflectGet(__getProtoOf(cls), key, obj);
38
+ var __async = (__this, __arguments, generator) => {
39
+ return new Promise((resolve, reject) => {
40
+ var fulfilled = (value) => {
41
+ try {
42
+ step(generator.next(value));
43
+ } catch (e) {
44
+ reject(e);
45
+ }
46
+ };
47
+ var rejected = (value) => {
48
+ try {
49
+ step(generator.throw(value));
50
+ } catch (e) {
51
+ reject(e);
52
+ }
53
+ };
54
+ var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
55
+ step((generator = generator.apply(__this, __arguments)).next());
56
+ });
57
+ };
58
+
5
59
  function _interopNamespaceDefault(e) {
6
60
  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
7
61
  if (e) {
@@ -975,19 +1029,23 @@
975
1029
  };
976
1030
  class ReactElementProvider {
977
1031
  get element() {
978
- return this._el?.nativeElement;
1032
+ var _a;
1033
+ return (_a = this._el) == null ? void 0 : _a.nativeElement;
979
1034
  }
980
1035
  get rendered() {
981
- return this._el?.rendered;
1036
+ var _a;
1037
+ return (_a = this._el) == null ? void 0 : _a.rendered;
982
1038
  }
983
1039
  constructor(el) {
984
1040
  this._el = el;
985
1041
  }
986
1042
  show() {
987
- this._el?.show();
1043
+ var _a;
1044
+ (_a = this._el) == null ? void 0 : _a.show();
988
1045
  }
989
1046
  hide() {
990
- this._el?.hide();
1047
+ var _a;
1048
+ (_a = this._el) == null ? void 0 : _a.hide();
991
1049
  }
992
1050
  }
993
1051
  class ReactRenderer extends VanillaFlicking.ExternalRenderer {
@@ -996,37 +1054,41 @@
996
1054
  this._reactFlicking = options.reactFlicking;
997
1055
  }
998
1056
  // eslint-disable-next-line @typescript-eslint/require-await
999
- async render() {
1000
- const flicking = VanillaFlicking.getFlickingAttached(this._flicking);
1001
- const reactFlicking = this._reactFlicking;
1002
- const strategy = this._strategy;
1003
- if (flicking.virtualEnabled) {
1004
- strategy.updateRenderingPanels(flicking);
1005
- this._rendering = true;
1006
- } else {
1007
- this._rendering = true;
1008
- strategy.updateRenderingPanels(flicking);
1009
- }
1010
- strategy.renderPanels(flicking);
1011
- return new Promise((resolve) => {
1012
- reactFlicking.renderEmitter.once("render", () => {
1013
- this._rendering = false;
1014
- this._afterRender();
1015
- resolve();
1057
+ render() {
1058
+ return __async(this, null, function* () {
1059
+ const flicking = VanillaFlicking.getFlickingAttached(this._flicking);
1060
+ const reactFlicking = this._reactFlicking;
1061
+ const strategy = this._strategy;
1062
+ if (flicking.virtualEnabled) {
1063
+ strategy.updateRenderingPanels(flicking);
1064
+ this._rendering = true;
1065
+ } else {
1066
+ this._rendering = true;
1067
+ strategy.updateRenderingPanels(flicking);
1068
+ }
1069
+ strategy.renderPanels(flicking);
1070
+ return new Promise((resolve) => {
1071
+ reactFlicking.renderEmitter.once("render", () => {
1072
+ this._rendering = false;
1073
+ this._afterRender();
1074
+ resolve();
1075
+ });
1076
+ reactFlicking.forceUpdate();
1016
1077
  });
1017
- reactFlicking.forceUpdate();
1018
1078
  });
1019
1079
  }
1020
- async forceRenderAllPanels() {
1021
- const reactFlicking = this._reactFlicking;
1022
- this._rendering = true;
1023
- await super.forceRenderAllPanels();
1024
- return new Promise((resolve) => {
1025
- reactFlicking.renderEmitter.once("render", () => {
1026
- this._rendering = false;
1027
- resolve();
1080
+ forceRenderAllPanels() {
1081
+ return __async(this, null, function* () {
1082
+ const reactFlicking = this._reactFlicking;
1083
+ this._rendering = true;
1084
+ yield __superGet(ReactRenderer.prototype, this, "forceRenderAllPanels").call(this);
1085
+ return new Promise((resolve) => {
1086
+ reactFlicking.renderEmitter.once("render", () => {
1087
+ this._rendering = false;
1088
+ resolve();
1089
+ });
1090
+ reactFlicking.forceUpdate();
1028
1091
  });
1029
- reactFlicking.forceUpdate();
1030
1092
  });
1031
1093
  }
1032
1094
  destroy() {
@@ -1074,13 +1136,13 @@
1074
1136
  }
1075
1137
  }
1076
1138
  const ViewportSlot = React.memo((props) => /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: props.children }));
1077
- var __defProp = Object.defineProperty;
1139
+ var __defProp2 = Object.defineProperty;
1078
1140
  var __decorateClass = (decorators, target, key, kind) => {
1079
1141
  var result = void 0;
1080
1142
  for (var i = decorators.length - 1, decorator; i >= 0; i--)
1081
1143
  if (decorator = decorators[i])
1082
1144
  result = decorator(target, key, result) || result;
1083
- if (result) __defProp(target, key, result);
1145
+ if (result) __defProp2(target, key, result);
1084
1146
  return result;
1085
1147
  };
1086
1148
  const _Flicking = class _Flicking extends React__namespace.Component {
@@ -1107,10 +1169,9 @@
1107
1169
  providerCtor: ReactElementProvider
1108
1170
  })
1109
1171
  };
1110
- const flicking = new VanillaFlicking(this._viewportElement, {
1111
- ...props,
1172
+ const flicking = new VanillaFlicking(this._viewportElement, __spreadProps(__spreadValues({}, props), {
1112
1173
  externalRenderer: new ReactRenderer(rendererOptions)
1113
- });
1174
+ }));
1114
1175
  this._vanillaFlicking = flicking;
1115
1176
  const children = this._getChildren();
1116
1177
  this._jsxDiffer = new ListDiffer(children, (panel) => panel.key);
@@ -1123,13 +1184,14 @@
1123
1184
  }
1124
1185
  }
1125
1186
  componentWillUnmount() {
1126
- this._vanillaFlicking?.destroy();
1187
+ var _a;
1188
+ (_a = this._vanillaFlicking) == null ? void 0 : _a.destroy();
1127
1189
  }
1128
1190
  shouldComponentUpdate(nextProps) {
1129
1191
  const vanillaFlicking = this._vanillaFlicking;
1130
1192
  const prevProps = this.props;
1131
1193
  if (!vanillaFlicking || !vanillaFlicking.initialized) return false;
1132
- const { children, ...restProps } = nextProps;
1194
+ const _a = nextProps, { children } = _a, restProps = __objRest(_a, ["children"]);
1133
1195
  for (const key in restProps) {
1134
1196
  if (prevProps[key] !== nextProps[key]) {
1135
1197
  return true;
@@ -1159,7 +1221,7 @@
1159
1221
  this._checkPlugins();
1160
1222
  renderEmitter.trigger("render");
1161
1223
  flicking.camera.updateOffset();
1162
- const { virtual, ...props } = this.props;
1224
+ const _a = this.props, { virtual } = _a, props = __objRest(_a, ["virtual"]);
1163
1225
  for (const key in props) {
1164
1226
  if (key in flicking && flicking[key] !== props[key]) {
1165
1227
  flicking[key] = props[key];
@@ -1170,6 +1232,7 @@
1170
1232
  this._diffResult = null;
1171
1233
  }
1172
1234
  render() {
1235
+ var _a;
1173
1236
  const props = this.props;
1174
1237
  const Viewport = props.viewportTag;
1175
1238
  const Camera = props.cameraTag;
@@ -1181,24 +1244,24 @@
1181
1244
  }
1182
1245
  }
1183
1246
  const { viewportClasses, cameraClasses, cameraProps } = this._getClasses(attributes, props);
1184
- const panels = !!props.virtual && (props.panelsPerView ?? -1) > 0 ? this._getVirtualPanels() : this._getPanels();
1247
+ const panels = !!props.virtual && ((_a = props.panelsPerView) != null ? _a : -1) > 0 ? this._getVirtualPanels() : this._getPanels();
1185
1248
  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
1186
1249
  Viewport,
1187
- {
1188
- ...attributes,
1250
+ __spreadProps(__spreadValues({}, attributes), {
1189
1251
  className: viewportClasses.join(" "),
1190
1252
  ref: (e) => {
1191
1253
  e && (this._viewportElement = e);
1192
1254
  },
1193
1255
  children: [
1194
- /* @__PURE__ */ jsxRuntimeExports.jsx(Camera, { className: cameraClasses.join(" "), ...cameraProps, children: panels }),
1256
+ /* @__PURE__ */ jsxRuntimeExports.jsx(Camera, __spreadProps(__spreadValues({ className: cameraClasses.join(" ") }, cameraProps), { children: panels })),
1195
1257
  this._getViewportSlot()
1196
1258
  ]
1197
- }
1259
+ })
1198
1260
  );
1199
1261
  }
1200
1262
  _createPanelRefs(props, children) {
1201
- const panelsPerView = props.panelsPerView ?? -1;
1263
+ var _a;
1264
+ const panelsPerView = (_a = props.panelsPerView) != null ? _a : -1;
1202
1265
  return panelsPerView > 0 && !!props.virtual ? VanillaFlicking.range(panelsPerView + 1).map(() => React__namespace.createRef()) : children.map(() => React__namespace.createRef());
1203
1266
  }
1204
1267
  _bindEvents() {
@@ -1226,11 +1289,12 @@
1226
1289
  flicking.removePlugins(...removed.map((index) => prevList[index]));
1227
1290
  }
1228
1291
  _getClasses(attributes, props) {
1292
+ var _a;
1229
1293
  const flicking = this._vanillaFlicking;
1230
- const initialized = flicking?.initialized;
1294
+ const initialized = flicking == null ? void 0 : flicking.initialized;
1231
1295
  const viewportClasses = ["flicking-viewport"];
1232
1296
  const cameraClasses = ["flicking-camera"];
1233
- const isHorizontal = flicking ? flicking.horizontal : props.horizontal ?? true;
1297
+ const isHorizontal = flicking ? flicking.horizontal : (_a = props.horizontal) != null ? _a : true;
1234
1298
  if (!isHorizontal) {
1235
1299
  viewportClasses.push("vertical");
1236
1300
  }
@@ -1285,9 +1349,9 @@
1285
1349
  const { panelClass = "flicking-panel" } = this.props.virtual;
1286
1350
  const panelsPerView = this.props.panelsPerView;
1287
1351
  const flicking = this._vanillaFlicking;
1288
- const initialized = flicking?.initialized;
1352
+ const initialized = flicking == null ? void 0 : flicking.initialized;
1289
1353
  const renderingIndexes = initialized ? flicking.renderer.strategy.getRenderingIndexesByOrder(flicking) : VanillaFlicking.range(panelsPerView + 1);
1290
- const firstPanel = flicking?.panels[0];
1354
+ const firstPanel = flicking == null ? void 0 : flicking.panels[0];
1291
1355
  const size = firstPanel ? flicking.horizontal ? { width: firstPanel.size } : { height: firstPanel.size } : {};
1292
1356
  return renderingIndexes.map((idx) => {
1293
1357
  return /* @__PURE__ */ jsxRuntimeExports.jsx(StrictPanel, { ref: this._panels[idx], children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { "data-element-index": idx, className: panelClass, style: size }) }, idx);
@@ -1297,7 +1361,7 @@
1297
1361
  const origChildren = this._getChildren();
1298
1362
  const vanillaFlicking = this._vanillaFlicking;
1299
1363
  const diffResult = this._diffResult;
1300
- const children = vanillaFlicking?.initialized ? diffResult ? VanillaFlicking.getRenderingPanels(vanillaFlicking, diffResult) : VanillaFlicking.getRenderingPanels(vanillaFlicking, ListDiffer.diff(origChildren, origChildren)) : origChildren;
1364
+ const children = (vanillaFlicking == null ? void 0 : vanillaFlicking.initialized) ? diffResult ? VanillaFlicking.getRenderingPanels(vanillaFlicking, diffResult) : VanillaFlicking.getRenderingPanels(vanillaFlicking, ListDiffer.diff(origChildren, origChildren)) : origChildren;
1301
1365
  return children.map((child, idx) => /* @__PURE__ */ jsxRuntimeExports.jsx(StrictPanel, { ref: this._panels[idx], children: child }, child.key));
1302
1366
  }
1303
1367
  _isFragment(child) {
@@ -1622,10 +1686,13 @@
1622
1686
  return result;
1623
1687
  }
1624
1688
  const useFlickingReactiveAPI = (flickingRef, options) => {
1625
- return useReactive(VanillaFlicking.flickingReactiveAPIAdapter, () => ({
1626
- flicking: flickingRef.current ?? void 0,
1627
- options
1628
- }));
1689
+ return useReactive(VanillaFlicking.flickingReactiveAPIAdapter, () => {
1690
+ var _a;
1691
+ return {
1692
+ flicking: (_a = flickingRef.current) != null ? _a : void 0,
1693
+ options
1694
+ };
1695
+ });
1629
1696
  };
1630
1697
  Flicking.ViewportSlot = ViewportSlot;
1631
1698
  Flicking.useFlickingReactiveAPI = useFlickingReactiveAPI;