@egjs/flicking 4.12.0-beta.10 → 4.12.0-beta.12

package/dist/flicking.css

@@ -0,0 +1,44 @@
+.flicking-viewport {
+  position: relative;
+  overflow: hidden;
+}
+
+.flicking-viewport.vertical {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}
+
+.flicking-viewport.vertical > .flicking-camera {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: column;
+  flex-direction: column;
+}
+
+.flicking-viewport.flicking-hidden > .flicking-camera > * {
+  visibility: hidden;
+}
+
+.flicking-camera {
+  width: 100%;
+  height: 100%;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  position: relative;
+  -webkit-box-orient: horizontal;
+  -webkit-box-direction: normal;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  z-index: 1;
+  will-change: transform;
+}
+
+.flicking-camera > * {
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+}

package/dist/flicking.esm.js

@@ -4,7 +4,7 @@ name: @egjs/flicking
 license: MIT
 author: NAVER Corp.
 repository: https://github.com/naver/egjs-flicking
-version: 4.12.0-beta.10
+version: 4.12.0-beta.12
 */
 import Component, { ComponentEvent } from '@egjs/component';
 import Axes, { PanInput } from '@egjs/axes';
@@ -677,6 +677,9 @@ var getStyle = function (el) {
 var setSize = function (el, _a) {
   var width = _a.width,
     height = _a.height;
+  if (!el) {
+    return;
+  }
   if (width != null) {
     if (isString(width)) {
       el.style.width = width;
@@ -1590,6 +1593,9 @@ var HoldingState = /*#__PURE__*/function (_super) {
       axesEvent = ctx.axesEvent,
       transitTo = ctx.transitTo;
     var inputEvent = axesEvent.inputEvent;
+    if (!inputEvent) {
+      return;
+    }
     var offset = flicking.horizontal ? inputEvent.offsetX : inputEvent.offsetY;
     var moveStartEvent = new ComponentEvent(EVENTS.MOVE_START, {
       isTrusted: axesEvent.isTrusted,
@@ -5449,6 +5455,9 @@ var Panel = /*#__PURE__*/function () {
     var flicking = this._flicking;
     var horizontal = flicking.horizontal,
       useFractionalSize = flicking.useFractionalSize;
+    if (!el) {
+      return this;
+    }
     if (cached) {
       this._size = cached.size;
       this._margin = __assign({}, cached.margin);
@@ -7910,7 +7919,7 @@ var Flicking = /*#__PURE__*/function (_super) {
    * Flicking.VERSION;  // ex) 4.0.0
    * ```
    */
-  Flicking.VERSION = "4.12.0-beta.10";
+  Flicking.VERSION = "4.12.0-beta.12";
   return Flicking;
 }(Component);
 
@@ -7921,7 +7930,9 @@ var SIDE_EVENTS = {
   MOVE: "sideMove",
   MOVE_END: "sideMoveEnd",
   WILL_CHANGE: "sideWillChange",
-  CHANGED: "sideChanged"
+  CHANGED: "sideChanged",
+  WILL_RESTORE: "sideWillRestore",
+  RESTORED: "sideRestored"
 };
 var CrossFlicking = /*#__PURE__*/function (_super) {
   __extends(CrossFlicking, _super);
@@ -7979,6 +7990,9 @@ var CrossFlicking = /*#__PURE__*/function (_super) {
         }
       });
     };
+    _this._addSideIndex = function (e) {
+      e.sideIndex = _this._sideFlicking[e.index].index;
+    };
     _this._onHorizontalHoldStart = function () {
       _this._setDraggable(MOVE_DIRECTION.HORIZONTAL, true);
       _this._moveDirection = null;
@@ -8055,6 +8069,15 @@ var CrossFlicking = /*#__PURE__*/function (_super) {
     enumerable: false,
     configurable: true
   });
+  Object.defineProperty(__proto, "sideIndex", {
+    get: function () {
+      return this._sideFlicking.map(function (i) {
+        return i.index;
+      });
+    },
+    enumerable: false,
+    configurable: true
+  });
   Object.defineProperty(__proto, "sideState", {
     get: function () {
       return this._sideState;
@@ -8123,6 +8146,9 @@ var CrossFlicking = /*#__PURE__*/function (_super) {
     this.on(EVENTS.HOLD_START, this._onHorizontalHoldStart);
     this.on(EVENTS.MOVE, this._onHorizontalMove);
     this.on(EVENTS.MOVE_END, this._onHorizontalMoveEnd);
+    [EVENTS.CHANGED, EVENTS.WILL_CHANGE].forEach(function (event) {
+      _this.on(event, _this._addSideIndex);
+    });
     this._sideFlicking.forEach(function (flicking, mainIndex) {
       flicking.on(EVENTS.HOLD_START, _this._onSideHoldStart);
       flicking.on(EVENTS.MOVE, _this._onSideMove);