@egjs/flicking 4.10.0 → 4.10.2

package/declaration/control/AxesController.d.ts

@@ -1,4 +1,4 @@
-import Axes, { OnRelease } from "@egjs/axes";
+import Axes, { PanInput, OnRelease } from "@egjs/axes";
 import Flicking from "../Flicking";
 import { ControlParams } from "../type/external";
 import StateMachine from "./StateMachine";
@@ -10,6 +10,7 @@ declare class AxesController {
     private _animatingContext;
     private _dragged;
     get axes(): Axes;
+    get panInput(): PanInput;
     get stateMachine(): StateMachine;
     get state(): import("./states/State").default;
     get animatingContext(): {
@@ -34,6 +35,7 @@ declare class AxesController {
     addPreventClickHandler(): this;
     removePreventClickHandler(): this;
     animateTo(position: number, duration: number, axesEvent?: OnRelease): Promise<void>;
+    updateDirection(): void;
     private _resetInternalValues;
     private _onAxesHold;
     private _onAxesChange;

package/declaration/control/Control.d.ts

@@ -31,6 +31,7 @@ declare abstract class Control {
         axesEvent?: OnRelease;
     }): Promise<void>;
     setActive(newActivePanel: Panel, prevActivePanel: Panel | null, isTrusted: boolean): void;
+    copy(control: Control): void;
     protected _triggerIndexChangeEvent(panel: Panel, position: number, axesEvent?: OnRelease): void;
     protected _animateToPosition({ position, duration, newActivePanel, axesEvent }: {
         position: number;

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.10.0
+version: 4.10.2
 */
 import Component, { ComponentEvent } from '@egjs/component';
 import Axes, { PanInput } from '@egjs/axes';
@@ -2206,10 +2206,10 @@ function () {
   var __proto = AxesController.prototype;
   Object.defineProperty(__proto, "axes", {
     /**
-     * An {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html Axes} instance
-     * @ko {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html Axes}의 인스턴스
-     * @type {Axes}
-     * @see https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html
+     * An {@link https://naver.github.io/egjs-axes/docs/api/Axes Axes} instance
+     * @ko {@link https://naver.github.io/egjs-axes/docs/api/Axes Axes}의 인스턴스
+     * @type {Axes | null}
+     * @see https://naver.github.io/egjs-axes/docs/api/Axes
      * @readonly
      */
     get: function () {
@@ -2218,6 +2218,20 @@ function () {
     enumerable: false,
     configurable: true
   });
+  Object.defineProperty(__proto, "panInput", {
+    /**
+     * An {@link https://naver.github.io/egjs-axes/docs/api/PanInput PanInput} instance
+     * @ko {@link https://naver.github.io/egjs-axes/docs/api/PanInput PanInput}의 인스턴스
+     * @type {PanInput | null}
+     * @see https://naver.github.io/egjs-axes/docs/api/PanInput
+     * @readonly
+     */
+    get: function () {
+      return this._panInput;
+    },
+    enumerable: false,
+    configurable: true
+  });
   Object.defineProperty(__proto, "stateMachine", {
     /**
      * @internal
@@ -2375,6 +2389,7 @@ function () {
     });
     this._panInput = new PanInput(flicking.viewport.element, {
       inputType: flicking.inputType,
+      threshold: 1,
       iOSEdgeSwipeThreshold: flicking.iOSEdgeSwipeThreshold,
       scale: flicking.horizontal ? [-1, 0] : [0, -1],
       releaseOnScroll: true
@@ -2656,6 +2671,15 @@ function () {
     }
   };
 
+  __proto.updateDirection = function () {
+    var flicking = getFlickingAttached(this._flicking);
+    var axes = this._axes;
+    var panInput = this._panInput;
+    axes.disconnect(panInput);
+    axes.connect(flicking.horizontal ? [POSITION_KEY, ""] : ["", POSITION_KEY], panInput);
+    panInput.options.scale = flicking.horizontal ? [-1, 0] : [0, -1];
+  };
+
   __proto._resetInternalValues = function () {
     this._flicking = null;
     this._axes = null;
@@ -3002,6 +3026,16 @@ function () {
       }));
     }
   };
+  /**
+   * @internal
+   */
+
+
+  __proto.copy = function (control) {
+    this._flicking = control._flicking;
+    this._activePanel = control._activePanel;
+    this._controller = control._controller;
+  };
 
   __proto._triggerIndexChangeEvent = function (panel, position, axesEvent) {
     var _a;
@@ -4828,13 +4862,9 @@ function () {
     this._updateMode();
 
     this._range = this._mode.getRange();
-
-    if (this._circularEnabled) {
-      panels.forEach(function (panel) {
-        return panel.updateCircularToggleDirection();
-      });
-    }
-
+    panels.forEach(function (panel) {
+      return panel.updateCircularToggleDirection();
+    });
     return this;
   };
   /**
@@ -5071,6 +5101,7 @@ function () {
       this._circularEnabled = canSetCircularMode;
     } else {
       this._mode = flicking.bound ? new BoundCameraMode(flicking) : new LinearCameraMode(flicking);
+      this._circularEnabled = false;
     }
   };
 
@@ -6099,6 +6130,8 @@ function () {
     // Options Setter
     set: function (val) {
       this._align = val;
+
+      this._updateAlignPos();
     },
     enumerable: false,
     configurable: true
@@ -6393,6 +6426,7 @@ function () {
 
     if (!flicking.circularEnabled) {
       this._toggleDirection = DIRECTION.NONE;
+      this._togglePosition = 0;
       this._toggled = false;
       return this;
     }
@@ -7212,6 +7246,7 @@ function (_super) {
       this._align = val;
       this._renderer.align = val;
       this._camera.align = val;
+      void this.resize();
     },
     enumerable: false,
     configurable: true
@@ -7244,6 +7279,10 @@ function (_super) {
     },
     set: function (val) {
       this._horizontal = val;
+
+      this._control.controller.updateDirection();
+
+      void this.resize();
     },
     enumerable: false,
     configurable: true
@@ -7260,6 +7299,7 @@ function (_super) {
     },
     set: function (val) {
       this._circular = val;
+      void this.resize();
     },
     enumerable: false,
     configurable: true
@@ -7296,6 +7336,7 @@ function (_super) {
     },
     set: function (val) {
       this._bound = val;
+      void this.resize();
     },
     enumerable: false,
     configurable: true
@@ -7312,6 +7353,7 @@ function (_super) {
     },
     set: function (val) {
       this._adaptive = val;
+      void this.resize();
     },
     enumerable: false,
     configurable: true
@@ -7328,6 +7370,7 @@ function (_super) {
     },
     set: function (val) {
       this._panelsPerView = val;
+      void this.resize();
     },
     enumerable: false,
     configurable: true
@@ -7346,6 +7389,7 @@ function (_super) {
     },
     set: function (val) {
       this._noPanelStyleOverride = val;
+      void this.resize();
     },
     enumerable: false,
     configurable: true
@@ -7364,6 +7408,10 @@ function (_super) {
     },
     set: function (val) {
       this._resizeOnContentsReady = val;
+
+      if (val) {
+        this._renderer.checkPanelContentsReady(this._renderer.panels);
+      }
     },
     enumerable: false,
     configurable: true
@@ -7382,6 +7430,11 @@ function (_super) {
     },
     set: function (val) {
       this._nested = val;
+      var axes = this._control.controller.axes;
+
+      if (axes) {
+        axes.options.nested = val;
+      }
     },
     enumerable: false,
     configurable: true
@@ -7436,6 +7489,11 @@ function (_super) {
     // ANIMATION
     set: function (val) {
       this._deceleration = val;
+      var axes = this._control.controller.axes;
+
+      if (axes) {
+        axes.options.deceleration = val;
+      }
     },
     enumerable: false,
     configurable: true
@@ -7453,6 +7511,11 @@ function (_super) {
     },
     set: function (val) {
       this._easing = val;
+      var axes = this._control.controller.axes;
+
+      if (axes) {
+        axes.options.easing = val;
+      }
     },
     enumerable: false,
     configurable: true
@@ -7490,6 +7553,11 @@ function (_super) {
     // INPUT
     set: function (val) {
       this._inputType = val;
+      var panInput = this._control.controller.panInput;
+
+      if (panInput) {
+        panInput.options.inputType = val;
+      }
     },
     enumerable: false,
     configurable: true
@@ -7530,6 +7598,18 @@ function (_super) {
     },
     set: function (val) {
       this._moveType = val;
+      var prevControl = this._control;
+
+      var newControl = this._createControl();
+
+      var activePanel = prevControl.activePanel;
+      newControl.copy(prevControl);
+      var prevProgressInPanel = activePanel ? this._camera.getProgressInPanel(activePanel) : 0;
+      this._control = newControl;
+
+      this._control.updatePosition(prevProgressInPanel);
+
+      this._control.updateInput();
     },
     enumerable: false,
     configurable: true
@@ -7562,6 +7642,11 @@ function (_super) {
     },
     set: function (val) {
       this._interruptable = val;
+      var axes = this._control.controller.axes;
+
+      if (axes) {
+        axes.options.interruptable = val;
+      }
     },
     enumerable: false,
     configurable: true
@@ -7603,6 +7688,8 @@ function (_super) {
     },
     set: function (val) {
       this._bounce = val;
+
+      this._control.updateInput();
     },
     enumerable: false,
     configurable: true
@@ -7619,6 +7706,11 @@ function (_super) {
     },
     set: function (val) {
       this._iOSEdgeSwipeThreshold = val;
+      var panInput = this._control.controller.panInput;
+
+      if (panInput) {
+        panInput.options.iOSEdgeSwipeThreshold = val;
+      }
     },
     enumerable: false,
     configurable: true
@@ -7698,6 +7790,7 @@ function (_super) {
     // PERFORMANCE
     set: function (val) {
       this._renderOnlyVisible = val;
+      void this._renderer.render();
     },
     enumerable: false,
     configurable: true
@@ -8707,7 +8800,7 @@ function (_super) {
    */
 
 
-  Flicking.VERSION = "4.10.0";
+  Flicking.VERSION = "4.10.2";
   return Flicking;
 }(Component);