@egjs/flicking 4.9.0 → 4.9.3-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@egjs/flicking",
-	"version": "4.9.0",
+	"version": "4.9.3-beta.0",
 	"description": "Everyday 30 million people experience. It's reliable, flexible and extendable carousel.",
 	"main": "dist/flicking.js",
 	"module": "dist/flicking.esm.js",
@@ -23,7 +23,7 @@
 		"test": "npm run test --prefix test/unit",
 		"test:chrome": "npm run test:chrome --prefix test/unit",
 		"test:cfc": "npm run test --prefix test/cfc",
-		"lint": "eslint 'src/**/*.ts'",
+		"lint": "eslint src/**/*.ts",
 		"lint:test": "eslint 'test/unit/**/*.ts'",
 		"jsdoc": "jsdoc -c jsdoc.json",
 		"jsdoc:watch": "npm-watch jsdoc",
@@ -136,7 +136,7 @@
 		"typescript-transform-paths": "^2.2.3"
 	},
 	"dependencies": {
-		"@egjs/axes": "^3.2.2",
+		"@egjs/axes": "^3.8.0",
 		"@egjs/component": "^3.0.1",
 		"@egjs/imready": "^1.1.3",
 		"@egjs/list-differ": "^1.0.0"

package/src/Flicking.ts

@@ -1084,6 +1084,10 @@ class Flicking extends Component<FlickingEvents> {
       return Promise.reject(new FlickingError(ERROR.MESSAGE.ANIMATION_ALREADY_PLAYING, ERROR.CODE.ANIMATION_ALREADY_PLAYING));
     }
 
+    if (this._control.holding) {
+      this._control.controller.release();
+    }
+
     return this._control.moveToPanel(panel, {
       duration,
       direction
@@ -1502,11 +1506,12 @@ class Flicking extends Component<FlickingEvents> {
     const renderer = this._renderer;
     const control = this._control;
     const camera = this._camera;
-    const initialPanel = renderer.getPanel(this._defaultIndex) || renderer.getPanel(0);
+    const defaultPanel = renderer.getPanel(this._defaultIndex) || renderer.getPanel(0);
 
-    if (!initialPanel) return;
+    if (!defaultPanel) return;
 
-    const nearestAnchor = camera.findNearestAnchor(initialPanel.position);
+    const nearestAnchor = camera.findNearestAnchor(defaultPanel.position);
+    const initialPanel = (nearestAnchor && defaultPanel.index !== nearestAnchor.panel.index) ? nearestAnchor.panel : defaultPanel;
     control.setActive(initialPanel, null, false);
 
     if (!nearestAnchor) {

package/src/control/AxesController.ts

@@ -202,6 +202,18 @@ class AxesController {
     return this;
   }
 
+  /**
+   * Releases ongoing user input (mouse/touch)
+   * @ko 사용자의 현재 입력(마우스/터치)를 중단시킵니다
+   * @chainable
+   * @return {this}
+   */
+  public release(): this {
+    this._panInput?.release();
+
+    return this;
+  }
+
   /**
    * Update {@link https://naver.github.io/egjs-axes/ @egjs/axes}'s state
    * @ko {@link https://naver.github.io/egjs-axes/ @egjs/axes}의 상태를 갱신합니다

package/src/control/Control.ts

@@ -161,6 +161,18 @@ abstract class Control {
     return this;
   }
 
+  /**
+   * Releases ongoing user input (mouse/touch)
+   * @ko 사용자의 현재 입력(마우스/터치)를 중단시킵니다
+   * @chainable
+   * @return {this}
+   */
+  public release(): this {
+    this._controller.release();
+
+    return this;
+  }
+
   /**
    * Update position after resizing
    * @ko resize 이후에 position을 업데이트합니다

package/src/core/panel/Panel.ts

@@ -308,7 +308,7 @@ class Panel {
    */
   public resize(cached?: {
     size: number;
-    height: number;
+    height?: number;
     margin: { prev: number; next: number };
   }): this {
     const el = this.element;
@@ -321,7 +321,13 @@ class Panel {
     if (cached) {
       this._size = cached.size;
       this._margin = { ...cached.margin };
-      this._height = cached.height;
+      this._height = cached.height ?? getElementSize({
+        el,
+        horizontal: false,
+        useFractionalSize,
+        useOffset: true,
+        style: getStyle(el)
+      });
     } else {
       const elStyle = getStyle(el);
 

package/src/renderer/Renderer.ts

@@ -496,8 +496,8 @@ abstract class Renderer {
       : { height: panelSize };
     const firstPanelSizeObj = {
       size: panelSize,
-      height: referencePanel.height,
-      margin: referencePanel.margin
+      margin: referencePanel.margin,
+      ...(!flicking.horizontal && { height: referencePanel.height})
     };
 
     if (!flicking.noPanelStyleOverride) {

package/TODO.md

@@ -1,3 +0,0 @@
-## React 18 대응
-- [] updateoffset을 미루기
-  - render가 완료되기 전에 updateOffset이 3번 호출되었음