@egjs/flicking 4.6.0 → 4.6.3

package/declaration/camera/mode/CameraMode.d.ts

@@ -11,6 +11,7 @@ declare abstract class CameraMode {
     };
     getAnchors(): AnchorPoint[];
     findAnchorIncludePosition(position: number): AnchorPoint | null;
+    findNearestAnchor(position: number): AnchorPoint | null;
     clampToReachablePosition(position: number): number;
     getCircularOffset(): number;
     canReach(panel: Panel): boolean;

package/declaration/camera/mode/CircularCameraMode.d.ts

@@ -8,6 +8,7 @@ declare class CircularCameraMode extends CameraMode {
         max: number;
     };
     getAnchors(): AnchorPoint[];
+    findNearestAnchor(position: number): AnchorPoint | null;
     findAnchorIncludePosition(position: number): AnchorPoint | null;
     getCircularOffset(): number;
     clampToReachablePosition(position: number): number;

package/declaration/control/Control.d.ts

@@ -19,7 +19,7 @@ declare abstract class Control {
     destroy(): void;
     enable(): this;
     disable(): this;
-    updatePosition(_progressInPanel: number): void;
+    updatePosition(progressInPanel: number): void;
     updateInput(): this;
     resetActive(): this;
     moveToPanel(panel: Panel, { duration, direction, axesEvent }: {

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.6.0
+version: 4.6.3
 */
 import Component, { ComponentEvent } from '@egjs/component';
 import Axes, { PanInput } from '@egjs/axes';
@@ -1868,6 +1868,8 @@ function (_super) {
   };
 
   __proto.onRelease = function (ctx) {
+    var _a;
+
     var flicking = ctx.flicking,
         axesEvent = ctx.axesEvent,
         transitTo = ctx.transitTo; // Update last position to cope with Axes's animating behavior
@@ -1887,7 +1889,13 @@ function (_super) {
     var control = flicking.control;
     var position = axesEvent.destPos[POSITION_KEY];
     var duration = Math.max(axesEvent.duration, flicking.duration);
-    void control.moveToPosition(position, duration, axesEvent);
+
+    try {
+      void control.moveToPosition(position, duration, axesEvent);
+    } catch (err) {
+      transitTo(STATE_TYPE.IDLE);
+      axesEvent.setTo((_a = {}, _a[POSITION_KEY] = flicking.camera.position, _a), 0);
+    }
   };
 
   return DraggingState;
@@ -1963,7 +1971,11 @@ function (_super) {
       direction: getDirection(animatingContext.start, animatingContext.end),
       axesEvent: axesEvent
     }));
-    control.setActive(this._targetPanel, control.activePanel, axesEvent.isTrusted);
+    var targetPanel = this._targetPanel;
+
+    if (targetPanel) {
+      control.setActive(targetPanel, control.activePanel, axesEvent.isTrusted);
+    }
   };
 
   return AnimatingState;
@@ -2718,7 +2730,7 @@ function () {
    */
 
 
-  __proto.updatePosition = function (_progressInPanel) {
+  __proto.updatePosition = function (progressInPanel) {
     var flicking = getFlickingAttached(this._flicking);
     var camera = flicking.camera;
     var activePanel = this._activePanel;
@@ -3094,48 +3106,41 @@ function (_super) {
    */
 
   __proto.moveToPosition = function (position, duration, axesEvent) {
-    return __awaiter(this, void 0, void 0, function () {
-      var flicking, camera, activeAnchor, anchorAtCamera, state, snapThreshold, posDelta, absPosDelta, snapDelta, targetAnchor;
-      return __generator(this, function (_a) {
-        flicking = getFlickingAttached(this._flicking);
-        camera = flicking.camera;
-        activeAnchor = camera.findActiveAnchor();
-        anchorAtCamera = camera.findNearestAnchor(camera.position);
-        state = flicking.control.controller.state;
+    var flicking = getFlickingAttached(this._flicking);
+    var camera = flicking.camera;
+    var activeAnchor = camera.findActiveAnchor();
+    var anchorAtCamera = camera.findNearestAnchor(camera.position);
+    var state = flicking.control.controller.state;
 
-        if (!activeAnchor || !anchorAtCamera) {
-          return [2
-          /*return*/
-          , Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE))];
-        }
+    if (!activeAnchor || !anchorAtCamera) {
+      return Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE));
+    }
 
-        snapThreshold = this._calcSnapThreshold(position, activeAnchor);
-        posDelta = flicking.animating ? state.delta : position - camera.position;
-        absPosDelta = Math.abs(posDelta);
-        snapDelta = axesEvent && axesEvent.delta[POSITION_KEY] !== 0 ? Math.abs(axesEvent.delta[POSITION_KEY]) : absPosDelta;
-
-        if (snapDelta >= snapThreshold && snapDelta > 0) {
-          // Move to anchor at position
-          targetAnchor = this._findSnappedAnchor(position, anchorAtCamera);
-        } else if (absPosDelta >= flicking.threshold && absPosDelta > 0) {
-          // Move to the adjacent panel
-          targetAnchor = this._findAdjacentAnchor(posDelta, anchorAtCamera);
-        } else {
-          // Restore to active panel
-          targetAnchor = anchorAtCamera;
-        }
+    var snapThreshold = this._calcSnapThreshold(position, activeAnchor);
 
-        this._triggerIndexChangeEvent(targetAnchor.panel, position, axesEvent);
+    var posDelta = flicking.animating ? state.delta : position - camera.position;
+    var absPosDelta = Math.abs(posDelta);
+    var snapDelta = axesEvent && axesEvent.delta[POSITION_KEY] !== 0 ? Math.abs(axesEvent.delta[POSITION_KEY]) : absPosDelta;
+    var targetAnchor;
 
-        return [2
-        /*return*/
-        , this._animateToPosition({
-          position: camera.clampToReachablePosition(targetAnchor.position),
-          duration: duration,
-          newActivePanel: targetAnchor.panel,
-          axesEvent: axesEvent
-        })];
-      });
+    if (snapDelta >= snapThreshold && snapDelta > 0) {
+      // Move to anchor at position
+      targetAnchor = this._findSnappedAnchor(position, anchorAtCamera);
+    } else if (absPosDelta >= flicking.threshold && absPosDelta > 0) {
+      // Move to the adjacent panel
+      targetAnchor = this._findAdjacentAnchor(posDelta, anchorAtCamera);
+    } else {
+      // Restore to active panel
+      targetAnchor = anchorAtCamera;
+    }
+
+    this._triggerIndexChangeEvent(targetAnchor.panel, position, axesEvent);
+
+    return this._animateToPosition({
+      position: camera.clampToReachablePosition(targetAnchor.position),
+      duration: duration,
+      newActivePanel: targetAnchor.panel,
+      axesEvent: axesEvent
     });
   };
 
@@ -3324,35 +3329,26 @@ function (_super) {
 
 
   __proto.moveToPosition = function (position, duration, axesEvent) {
-    return __awaiter(this, void 0, void 0, function () {
-      var flicking, camera, targetPos, anchorAtPosition, targetPanel;
-      return __generator(this, function (_a) {
-        flicking = getFlickingAttached(this._flicking);
-        camera = flicking.camera;
-        targetPos = camera.clampToReachablePosition(position);
-        anchorAtPosition = camera.findAnchorIncludePosition(targetPos);
+    var flicking = getFlickingAttached(this._flicking);
+    var camera = flicking.camera;
+    var targetPos = camera.clampToReachablePosition(position);
+    var anchorAtPosition = camera.findAnchorIncludePosition(targetPos);
 
-        if (!anchorAtPosition) {
-          return [2
-          /*return*/
-          , Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE))];
-        }
+    if (!anchorAtPosition) {
+      return Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE));
+    }
 
-        targetPanel = anchorAtPosition.panel; // Trigger only change event
+    var targetPanel = anchorAtPosition.panel; // Trigger only change event
 
-        if (targetPanel !== this._activePanel) {
-          this._triggerIndexChangeEvent(targetPanel, position, axesEvent);
-        }
+    if (targetPanel !== this._activePanel) {
+      this._triggerIndexChangeEvent(targetPanel, position, axesEvent);
+    }
 
-        return [2
-        /*return*/
-        , this._animateToPosition({
-          position: this._stopAtEdge ? targetPos : position,
-          duration: duration,
-          newActivePanel: targetPanel,
-          axesEvent: axesEvent
-        })];
-      });
+    return this._animateToPosition({
+      position: this._stopAtEdge ? targetPos : position,
+      duration: duration,
+      newActivePanel: targetPanel,
+      axesEvent: axesEvent
     });
   };
 
@@ -3550,62 +3546,57 @@ function (_super) {
 
 
   __proto.moveToPosition = function (position, duration, axesEvent) {
-    return __awaiter(this, void 0, void 0, function () {
-      var flicking, camera, activePanel, axesRange, indexRange, cameraRange, clampedPosition, anchorAtPosition, prevPos, isOverThreshold, adjacentAnchor, targetPos, targetPanel, anchors, firstAnchor, lastAnchor, shouldBounceToFirst, shouldBounceToLast, targetAnchor;
-      return __generator(this, function (_a) {
-        flicking = getFlickingAttached(this._flicking);
-        camera = flicking.camera;
-        activePanel = this._activePanel;
-        axesRange = this._controller.range;
-        indexRange = this._indexRange;
-        cameraRange = camera.range;
-        clampedPosition = clamp(camera.clampToReachablePosition(position), axesRange[0], axesRange[1]);
-        anchorAtPosition = camera.findAnchorIncludePosition(clampedPosition);
-
-        if (!anchorAtPosition || !activePanel) {
-          return [2
-          /*return*/
-          , Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE))];
-        }
+    var flicking = getFlickingAttached(this._flicking);
+    var camera = flicking.camera;
+    var activePanel = this._activePanel;
+    var axesRange = this._controller.range;
+    var indexRange = this._indexRange;
+    var cameraRange = camera.range;
+    var clampedPosition = clamp(camera.clampToReachablePosition(position), axesRange[0], axesRange[1]);
+    var anchorAtPosition = camera.findAnchorIncludePosition(clampedPosition);
 
-        prevPos = activePanel.position;
-        isOverThreshold = Math.abs(position - prevPos) >= flicking.threshold;
-        adjacentAnchor = position > prevPos ? camera.getNextAnchor(anchorAtPosition) : camera.getPrevAnchor(anchorAtPosition);
-        anchors = camera.anchorPoints;
-        firstAnchor = anchors[0];
-        lastAnchor = anchors[anchors.length - 1];
-        shouldBounceToFirst = position <= cameraRange.min && isBetween(firstAnchor.panel.index, indexRange.min, indexRange.max);
-        shouldBounceToLast = position >= cameraRange.max && isBetween(lastAnchor.panel.index, indexRange.min, indexRange.max);
-
-        if (shouldBounceToFirst || shouldBounceToLast) {
-          targetAnchor = position < cameraRange.min ? firstAnchor : lastAnchor;
-          targetPanel = targetAnchor.panel;
-          targetPos = targetAnchor.position;
-        } else if (isOverThreshold && anchorAtPosition.position !== activePanel.position) {
-          // Move to anchor at position
-          targetPanel = anchorAtPosition.panel;
-          targetPos = anchorAtPosition.position;
-        } else if (isOverThreshold && adjacentAnchor && isBetween(adjacentAnchor.index, indexRange.min, indexRange.max)) {
-          // Move to adjacent anchor
-          targetPanel = adjacentAnchor.panel;
-          targetPos = adjacentAnchor.position;
-        } else {
-          // Restore to active panel
-          targetPos = camera.clampToReachablePosition(activePanel.position);
-          targetPanel = activePanel;
-        }
+    if (!anchorAtPosition || !activePanel) {
+      return Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE));
+    }
 
-        this._triggerIndexChangeEvent(targetPanel, position, axesEvent);
+    var prevPos = activePanel.position;
+    var isOverThreshold = Math.abs(position - prevPos) >= flicking.threshold;
+    var adjacentAnchor = position > prevPos ? camera.getNextAnchor(anchorAtPosition) : camera.getPrevAnchor(anchorAtPosition);
+    var targetPos;
+    var targetPanel;
+    var anchors = camera.anchorPoints;
+    var firstAnchor = anchors[0];
+    var lastAnchor = anchors[anchors.length - 1];
+    var shouldBounceToFirst = position <= cameraRange.min && isBetween(firstAnchor.panel.index, indexRange.min, indexRange.max);
+    var shouldBounceToLast = position >= cameraRange.max && isBetween(lastAnchor.panel.index, indexRange.min, indexRange.max);
+    var isAdjacent = adjacentAnchor && (indexRange.min <= indexRange.max ? isBetween(adjacentAnchor.index, indexRange.min, indexRange.max) : adjacentAnchor.index >= indexRange.min || adjacentAnchor.index <= indexRange.max);
+
+    if (shouldBounceToFirst || shouldBounceToLast) {
+      // In bounce area
+      var targetAnchor = position < cameraRange.min ? firstAnchor : lastAnchor;
+      targetPanel = targetAnchor.panel;
+      targetPos = targetAnchor.position;
+    } else if (isOverThreshold && anchorAtPosition.position !== activePanel.position) {
+      // Move to anchor at position
+      targetPanel = anchorAtPosition.panel;
+      targetPos = anchorAtPosition.position;
+    } else if (isOverThreshold && isAdjacent) {
+      // Move to adjacent anchor
+      targetPanel = adjacentAnchor.panel;
+      targetPos = adjacentAnchor.position;
+    } else {
+      // Restore to active panel
+      targetPos = camera.clampToReachablePosition(activePanel.position);
+      targetPanel = activePanel;
+    }
 
-        return [2
-        /*return*/
-        , this._animateToPosition({
-          position: targetPos,
-          duration: duration,
-          newActivePanel: targetPanel,
-          axesEvent: axesEvent
-        })];
-      });
+    this._triggerIndexChangeEvent(targetPanel, position, axesEvent);
+
+    return this._animateToPosition({
+      position: targetPos,
+      duration: duration,
+      newActivePanel: targetPanel,
+      axesEvent: axesEvent
     });
   };
 
@@ -3655,6 +3646,27 @@ function () {
     }, null);
   };
 
+  __proto.findNearestAnchor = function (position) {
+    var anchors = this._flicking.camera.anchorPoints;
+    if (anchors.length <= 0) return null;
+    var prevDist = Infinity;
+
+    for (var anchorIdx = 0; anchorIdx < anchors.length; anchorIdx++) {
+      var anchor = anchors[anchorIdx];
+      var dist = Math.abs(anchor.position - position);
+
+      if (dist > prevDist) {
+        // Return previous anchor
+        return anchors[anchorIdx - 1];
+      }
+
+      prevDist = dist;
+    } // Return last anchor
+
+
+    return anchors[anchors.length - 1];
+  };
+
   __proto.clampToReachablePosition = function (position) {
     var camera = this._flicking.camera;
     var range = camera.range;
@@ -3784,6 +3796,28 @@ function (_super) {
     });
   };
 
+  __proto.findNearestAnchor = function (position) {
+    var camera = this._flicking.camera;
+    var anchors = camera.anchorPoints;
+    if (anchors.length <= 0) return null;
+    var camRange = camera.range;
+    var minDist = Infinity;
+    var minDistIndex = -1;
+
+    for (var anchorIdx = 0; anchorIdx < anchors.length; anchorIdx++) {
+      var anchor = anchors[anchorIdx];
+      var dist = Math.min(Math.abs(anchor.position - position), Math.abs(anchor.position - camRange.min + camRange.max - position), Math.abs(position - camRange.min + camRange.max - anchor.position));
+
+      if (dist < minDist) {
+        minDist = dist;
+        minDistIndex = anchorIdx;
+      }
+    } // Return last anchor
+
+
+    return anchors[minDistIndex];
+  };
+
   __proto.findAnchorIncludePosition = function (position) {
     var camera = this._flicking.camera;
     var range = camera.range;
@@ -4552,24 +4586,7 @@ function () {
 
 
   __proto.findNearestAnchor = function (position) {
-    var anchors = this._anchors;
-    if (anchors.length <= 0) return null;
-    var prevDist = Infinity;
-
-    for (var anchorIdx = 0; anchorIdx < anchors.length; anchorIdx++) {
-      var anchor = anchors[anchorIdx];
-      var dist = Math.abs(anchor.position - position);
-
-      if (dist > prevDist) {
-        // Return previous anchor
-        return anchors[anchorIdx - 1];
-      }
-
-      prevDist = dist;
-    } // Return last anchor
-
-
-    return anchors[anchors.length - 1];
+    return this._mode.findNearestAnchor(position);
   };
   /**
    * Return {@link AnchorPoint} that matches {@link Flicking#currentPanel}
@@ -5253,29 +5270,31 @@ function () {
 
     void this.render();
 
-    if (!activePanel || activePanel.removed) {
-      if (panels.length <= 0) {
-        // All panels removed
-        camera.lookAt(0);
-      } else {
-        var targetIndex = (_a = activePanel === null || activePanel === void 0 ? void 0 : activePanel.index) !== null && _a !== void 0 ? _a : 0;
+    if (!flicking.animating) {
+      if (!activePanel || activePanel.removed) {
+        if (panels.length <= 0) {
+          // All panels removed
+          camera.lookAt(0);
+        } else {
+          var targetIndex = (_a = activePanel === null || activePanel === void 0 ? void 0 : activePanel.index) !== null && _a !== void 0 ? _a : 0;
 
-        if (targetIndex > panels.length - 1) {
-          targetIndex = panels.length - 1;
-        }
+          if (targetIndex > panels.length - 1) {
+            targetIndex = panels.length - 1;
+          }
 
-        void control.moveToPanel(panels[targetIndex], {
+          void control.moveToPanel(panels[targetIndex], {
+            duration: 0
+          }).catch(function () {
+            return void 0;
+          });
+        }
+      } else {
+        void control.moveToPanel(activePanel, {
           duration: 0
         }).catch(function () {
           return void 0;
         });
       }
-    } else {
-      void control.moveToPanel(control.activePanel, {
-        duration: 0
-      }).catch(function () {
-        return void 0;
-      });
     }
 
     flicking.camera.updateOffset();
@@ -8384,7 +8403,7 @@ function (_super) {
    */
 
 
-  Flicking.VERSION = "4.6.0";
+  Flicking.VERSION = "4.6.3";
   return Flicking;
 }(Component);
 
@@ -8538,7 +8557,9 @@ var sync = (function (flicking, diffResult, rendered) {
     }
   }
 
-  renderer.updateAfterPanelChange(added, removed);
+  if (diffResult.added.length > 0 || diffResult.removed.length > 0) {
+    renderer.updateAfterPanelChange(added, removed);
+  }
 });
 
 var batchInsert = function (renderer, diffResult, addedElements, startIdx, endIdx) {