@egjs/flicking 4.7.1 → 4.8.0

package/dist/flicking.pkgd.js

@@ -4,7 +4,7 @@ name: @egjs/flicking
 license: MIT
 author: NAVER Corp.
 repository: https://github.com/naver/egjs-flicking
-version: 4.7.1
+version: 4.8.0
 */
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -1294,7 +1294,7 @@ version: 4.7.1
      * @ko Flicking 내부에서 알려진 오류 발생시 throw되는 에러
      * @property {number} code Error code<ko>에러 코드</ko>
      * @property {string} message Error message<ko>에러 메시지</ko>
-     * @see {@link Constants.ERROR_CODE ERROR_CODE}
+     * @see {@link ERROR_CODE ERROR_CODE}
      * @example
      * ```ts
      * import Flicking, { FlickingError, ERROR_CODES } from "@egjs/flicking";
@@ -1916,7 +1916,7 @@ version: 4.7.1
     license: MIT
     author: NAVER Corp.
     repository: git+https://github.com/naver/agent.git
-    version: 2.3.0
+    version: 2.4.2
     */
     function some(arr, callback) {
       var length = arr.length;
@@ -1940,7 +1940,7 @@ version: 4.7.1
 
       return null;
     }
-    function getUserAgent(agent) {
+    function getUserAgentString(agent) {
       var userAgent = agent;
 
       if (typeof userAgent === "undefined") {
@@ -2106,15 +2106,18 @@ version: 4.7.1
     }, {
       test: "windows nt",
       id: "window"
+    }, {
+      test: "win32|windows",
+      id: "window"
     }, {
       test: "iphone|ipad|ipod",
       id: "ios",
       versionTest: "iphone os|cpu os"
     }, {
-      test: "mac os x",
+      test: "macos|macintel|mac os x",
       id: "mac"
     }, {
-      test: "android",
+      test: "android|linux armv81",
       id: "android"
     }, {
       test: "tizen",
@@ -2124,85 +2127,17 @@ version: 4.7.1
       id: "webos"
     }];
 
-    function parseUserAgentData(osData) {
-      var userAgentData = navigator.userAgentData;
-      var brands = (userAgentData.uaList || userAgentData.brands).slice();
-      var isMobile = userAgentData.mobile || false;
-      var firstBrand = brands[0];
-      var browser = {
-        name: firstBrand.brand,
-        version: firstBrand.version,
-        majorVersion: -1,
-        webkit: false,
-        webkitVersion: "-1",
-        chromium: false,
-        chromiumVersion: "-1",
-        webview: !!findPresetBrand(WEBVIEW_PRESETS, brands).brand
-      };
-      var os = {
-        name: "unknown",
-        version: "-1",
-        majorVersion: -1
-      };
-      browser.webkit = !browser.chromium && some(WEBKIT_PRESETS, function (preset) {
-        return findBrand(brands, preset);
-      });
-      var chromiumBrand = findPresetBrand(CHROMIUM_PRESETS, brands);
-      browser.chromium = !!chromiumBrand.brand;
-      browser.chromiumVersion = chromiumBrand.version;
-
-      if (!browser.chromium) {
-        var webkitBrand = findPresetBrand(WEBKIT_PRESETS, brands);
-        browser.webkit = !!webkitBrand.brand;
-        browser.webkitVersion = webkitBrand.version;
-      }
-
-      if (osData) {
-        var platform_1 = osData.platform.toLowerCase();
-        var result = find(OS_PRESETS, function (preset) {
-          return new RegExp("" + preset.test, "g").exec(platform_1);
-        });
-        os.name = result ? result.id : platform_1;
-        os.version = osData.platformVersion;
-      }
-
-      var browserBrand = findPresetBrand(BROWSER_PRESETS, brands);
-
-      if (browserBrand.brand) {
-        browser.name = browserBrand.brand;
-        browser.version = osData ? osData.uaFullVersion : browserBrand.version;
-      }
-
-      if (navigator.platform === "Linux armv8l") {
-        os.name = "android";
-      } else if (browser.webkit) {
-        os.name = isMobile ? "ios" : "mac";
-      }
-
-      if (os.name === "ios" && browser.webview) {
-        browser.version = "-1";
-      }
-
-      os.version = convertVersion(os.version);
-      browser.version = convertVersion(browser.version);
-      os.majorVersion = parseInt(os.version, 10);
-      browser.majorVersion = parseInt(browser.version, 10);
-      return {
-        browser: browser,
-        os: os,
-        isMobile: isMobile,
-        isHints: true
-      };
+    function isWebView(userAgent) {
+      return !!findPreset(WEBVIEW_PRESETS, userAgent).preset;
     }
-
-    function parseUserAgent(userAgent) {
-      var nextAgent = getUserAgent(userAgent);
+    function getLegacyAgent(userAgent) {
+      var nextAgent = getUserAgentString(userAgent);
       var isMobile = !!/mobi/g.exec(nextAgent);
       var browser = {
         name: "unknown",
         version: "-1",
         majorVersion: -1,
-        webview: !!findPreset(WEBVIEW_PRESETS, nextAgent).preset,
+        webview: isWebView(nextAgent),
         chromium: false,
         chromiumVersion: "-1",
         webkit: false,
@@ -2240,7 +2175,7 @@ version: 4.7.1
 
       if (browserPreset) {
         browser.name = browserPreset.id;
-        browser.version = browserVersion;
+        browser.version = browserVersion; // Early whale bugs
 
         if (browser.webview && os.name === "ios" && browser.name !== "safari") {
           browser.webview = false;
@@ -2255,6 +2190,80 @@ version: 4.7.1
         isHints: false
       };
     }
+
+    function getClientHintsAgent(osData) {
+      var userAgentData = navigator.userAgentData;
+      var brands = (userAgentData.uaList || userAgentData.brands).slice();
+      var fullVersionList = osData && osData.fullVersionList;
+      var isMobile = userAgentData.mobile || false;
+      var firstBrand = brands[0];
+      var platform = (osData && osData.platform || userAgentData.platform || navigator.platform).toLowerCase();
+      var browser = {
+        name: firstBrand.brand,
+        version: firstBrand.version,
+        majorVersion: -1,
+        webkit: false,
+        webkitVersion: "-1",
+        chromium: false,
+        chromiumVersion: "-1",
+        webview: !!findPresetBrand(WEBVIEW_PRESETS, brands).brand || isWebView(getUserAgentString())
+      };
+      var os = {
+        name: "unknown",
+        version: "-1",
+        majorVersion: -1
+      };
+      browser.webkit = !browser.chromium && some(WEBKIT_PRESETS, function (preset) {
+        return findBrand(brands, preset);
+      });
+      var chromiumBrand = findPresetBrand(CHROMIUM_PRESETS, brands);
+      browser.chromium = !!chromiumBrand.brand;
+      browser.chromiumVersion = chromiumBrand.version;
+
+      if (!browser.chromium) {
+        var webkitBrand = findPresetBrand(WEBKIT_PRESETS, brands);
+        browser.webkit = !!webkitBrand.brand;
+        browser.webkitVersion = webkitBrand.version;
+      }
+
+      var platfomResult = find(OS_PRESETS, function (preset) {
+        return new RegExp("" + preset.test, "g").exec(platform);
+      });
+      os.name = platfomResult ? platfomResult.id : "";
+
+      if (osData) {
+        os.version = osData.platformVersion;
+      }
+
+      if (fullVersionList && fullVersionList.length) {
+        var browserBrandByFullVersionList = findPresetBrand(BROWSER_PRESETS, fullVersionList);
+        browser.name = browserBrandByFullVersionList.brand || browser.name;
+        browser.version = browserBrandByFullVersionList.version || browser.version;
+      } else {
+        var browserBrand = findPresetBrand(BROWSER_PRESETS, brands);
+        browser.name = browserBrand.brand || browser.name;
+        browser.version = browserBrand.brand && osData ? osData.uaFullVersion : browserBrand.version;
+      }
+
+      if (browser.webkit) {
+        os.name = isMobile ? "ios" : "mac";
+      }
+
+      if (os.name === "ios" && browser.webview) {
+        browser.version = "-1";
+      }
+
+      os.version = convertVersion(os.version);
+      browser.version = convertVersion(browser.version);
+      os.majorVersion = parseInt(os.version, 10);
+      browser.majorVersion = parseInt(browser.version, 10);
+      return {
+        browser: browser,
+        os: os,
+        isMobile: isMobile,
+        isHints: true
+      };
+    }
     /**
      * Extracts browser and operating system information from the user agent string.
      * @ko 유저 에이전트 문자열에서 브라우저와 운영체제 정보를 추출한다.
@@ -2269,9 +2278,9 @@ version: 4.7.1
 
     function agent(userAgent) {
       if (typeof userAgent === "undefined" && hasUserAgentData()) {
-        return parseUserAgentData();
+        return getClientHintsAgent();
       } else {
-        return parseUserAgent(userAgent);
+        return getLegacyAgent(userAgent);
       }
     }
 
@@ -2281,7 +2290,7 @@ version: 4.7.1
     license: MIT
     author: NAVER Corp.
     repository: https://github.com/naver/egjs-axes
-    version: 3.2.0
+    version: 3.2.2
     */
 
     /*! *****************************************************************************
@@ -4893,7 +4902,7 @@ version: 4.7.1
        */
 
 
-      Axes.VERSION = "3.2.0";
+      Axes.VERSION = "3.2.2";
       /* eslint-enable */
 
       /**
@@ -4969,6 +4978,8 @@ version: 4.7.1
       return Axes;
     }(Component);
 
+    /* eslint-disable @typescript-eslint/no-empty-function */
+
     var getDirectionByAngle = function (angle, thresholdAngle) {
       if (thresholdAngle < 0 || thresholdAngle > 90) {
         return DIRECTION_NONE;
@@ -5278,10 +5289,14 @@ version: 4.7.1
         var _this = this;
 
         activeEvent === null || activeEvent === void 0 ? void 0 : activeEvent.move.forEach(function (event) {
-          window.addEventListener(event, _this._onPanmove);
+          window.addEventListener(event, _this._onPanmove, {
+            passive: false
+          });
         });
         activeEvent === null || activeEvent === void 0 ? void 0 : activeEvent.end.forEach(function (event) {
-          window.addEventListener(event, _this._onPanend);
+          window.addEventListener(event, _this._onPanend, {
+            passive: false
+          });
         });
       };
 
@@ -5302,16 +5317,22 @@ version: 4.7.1
         var activeEvent = convertInputType(this.options.inputType);
 
         if (!activeEvent) {
-          throw new Error("There is currently no inputType available for current device. There must be at least one available inputType.");
+          return;
         }
 
         this._observer = observer;
         this._enabled = true;
         this._activeEvent = activeEvent;
-        activeEvent === null || activeEvent === void 0 ? void 0 : activeEvent.start.forEach(function (event) {
+        activeEvent.start.forEach(function (event) {
           var _a;
 
           (_a = _this.element) === null || _a === void 0 ? void 0 : _a.addEventListener(event, _this._onPanstart);
+        }); // adding event listener to element prevents invalid behavior in iOS Safari
+
+        activeEvent.move.forEach(function (event) {
+          var _a;
+
+          (_a = _this.element) === null || _a === void 0 ? void 0 : _a.addEventListener(event, function () {});
         });
       };
 
@@ -5324,6 +5345,11 @@ version: 4.7.1
 
           (_a = _this.element) === null || _a === void 0 ? void 0 : _a.removeEventListener(event, _this._onPanstart);
         });
+        activeEvent === null || activeEvent === void 0 ? void 0 : activeEvent.move.forEach(function (event) {
+          var _a;
+
+          (_a = _this.element) === null || _a === void 0 ? void 0 : _a.removeEventListener(event, function () {});
+        });
         this._enabled = false;
         this._observer = null;
       };
@@ -5891,8 +5917,15 @@ version: 4.7.1
         var flicking = ctx.flicking,
             axesEvent = ctx.axesEvent,
             transitTo = ctx.transitTo;
+        var targetPanel = this._targetPanel;
+        var control = flicking.control;
         this._delta = 0;
         flicking.control.updateInput();
+
+        if (flicking.changeOnHold && targetPanel) {
+          control.setActive(targetPanel, control.activePanel, axesEvent.isTrusted);
+        }
+
         var holdStartEvent = new ComponentEvent$1(EVENTS.HOLD_START, {
           axesEvent: axesEvent
         });
@@ -7062,7 +7095,7 @@ version: 4.7.1
         var camera = flicking.camera;
         var activeAnchor = camera.findActiveAnchor();
         var anchorAtCamera = camera.findNearestAnchor(camera.position);
-        var state = flicking.control.controller.state;
+        var state = this._controller.state;
 
         if (!activeAnchor || !anchorAtCamera) {
           return Promise.reject(new FlickingError(MESSAGE.POSITION_NOT_REACHABLE(position), CODE.POSITION_NOT_REACHABLE));
@@ -7504,6 +7537,7 @@ version: 4.7.1
         var axesRange = this._controller.range;
         var indexRange = this._indexRange;
         var cameraRange = camera.range;
+        var state = this._controller.state;
         var clampedPosition = clamp$1(camera.clampToReachablePosition(position), axesRange[0], axesRange[1]);
         var anchorAtPosition = camera.findAnchorIncludePosition(clampedPosition);
 
@@ -7512,7 +7546,8 @@ version: 4.7.1
         }
 
         var prevPos = activePanel.position;
-        var isOverThreshold = Math.abs(position - prevPos) >= flicking.threshold;
+        var posDelta = flicking.animating ? state.delta : position - camera.position;
+        var isOverThreshold = Math.abs(posDelta) >= flicking.threshold;
         var adjacentAnchor = position > prevPos ? camera.getNextAnchor(anchorAtPosition) : camera.getPrevAnchor(anchorAtPosition);
         var targetPos;
         var targetPanel;
@@ -8912,7 +8947,7 @@ version: 4.7.1
     license: MIT
     author: NAVER Corp.
     repository: https://github.com/naver/egjs-imready
-    version: 1.2.0
+    version: 1.3.0
     */
 
     /*! *****************************************************************************
@@ -8999,8 +9034,12 @@ version: 4.7.1
 
       return !!target.getAttribute(prefix + "width");
     }
-    function hasLoadingAttribute(target) {
-      return "loading" in target && target.getAttribute("loading") === "lazy";
+    function hasLoadingAttribute(target, prefix) {
+      if (prefix === void 0) {
+        prefix = "data-";
+      }
+
+      return "loading" in target && target.getAttribute("loading") === "lazy" || !!target.getAttribute(prefix + "lazy");
     }
     function hasSkipAttribute(target, prefix) {
       if (prefix === void 0) {
@@ -9125,6 +9164,11 @@ version: 4.7.1
 
           if (e && e.type === "error") {
             _this.onError(_this.element);
+          }
+
+          if (_this.hasLoading && _this.checkElement()) {
+            // I'm not ready
+            return;
           } // I'm pre-ready and ready!
 
 
@@ -9140,7 +9184,7 @@ version: 4.7.1
         var prefix = _this.options.prefix;
         _this.hasDataSize = hasSizeAttribute(element, prefix);
         _this.isSkip = hasSkipAttribute(element, prefix);
-        _this.hasLoading = hasLoadingAttribute(element);
+        _this.hasLoading = hasLoadingAttribute(element, prefix);
         return _this;
       }
 
@@ -9526,6 +9570,7 @@ version: 4.7.1
 
         var tagName = element.tagName.toLowerCase();
         var loaders = this.options.loaders;
+        var prefix = options.prefix;
         var tags = Object.keys(loaders);
 
         if (loaders[tagName]) {
@@ -9535,7 +9580,7 @@ version: 4.7.1
         var loader = new ElementLoader(element, options);
         var children = toArray(element.querySelectorAll(tags.join(", ")));
         loader.setHasLoading(children.some(function (el) {
-          return hasLoadingAttribute(el);
+          return hasLoadingAttribute(el, prefix);
         }));
         var withPreReady = false;
         var childrenImReady = this.clone().on("error", function (e) {
@@ -9620,13 +9665,13 @@ version: 4.7.1
          * ```
          */
 
-        this.trigger("error", {
+        this.trigger(new ComponentEvent$1("error", {
           element: info.element,
           index: index,
           target: target,
           errorCount: this.getErrorCount(),
           totalErrorCount: ++this.totalErrorCount
-        });
+        }));
       };
 
       __proto.onPreReadyElement = function (index) {
@@ -9660,7 +9705,7 @@ version: 4.7.1
          * ```
          */
 
-        this.trigger("preReadyElement", {
+        this.trigger(new ComponentEvent$1("preReadyElement", {
           element: info.element,
           index: index,
           preReadyCount: this.preReadyCount,
@@ -9670,7 +9715,7 @@ version: 4.7.1
           isReady: this.isReady(),
           hasLoading: info.hasLoading,
           isSkip: info.isSkip
-        });
+        }));
       };
 
       __proto.onPreReady = function () {
@@ -9702,12 +9747,12 @@ version: 4.7.1
          * ```
          */
 
-        this.trigger("preReady", {
+        this.trigger(new ComponentEvent$1("preReady", {
           readyCount: this.readyCount,
           totalCount: this.totalCount,
           isReady: this.isReady(),
           hasLoading: this.hasLoading()
-        });
+        }));
       };
 
       __proto.onReadyElement = function (index) {
@@ -9741,7 +9786,7 @@ version: 4.7.1
          * ```
          */
 
-        this.trigger("readyElement", {
+        this.trigger(new ComponentEvent$1("readyElement", {
           index: index,
           element: info.element,
           hasError: info.hasError,
@@ -9755,7 +9800,7 @@ version: 4.7.1
           hasLoading: info.hasLoading,
           isPreReadyOver: this.isPreReadyOver,
           isSkip: info.isSkip
-        });
+        }));
       };
 
       __proto.onReady = function () {
@@ -9789,11 +9834,11 @@ version: 4.7.1
          * });
          * ```
          */
-        this.trigger("ready", {
+        this.trigger(new ComponentEvent$1("ready", {
           errorCount: this.getErrorCount(),
           totalErrorCount: this.totalErrorCount,
           totalCount: this.totalCount
-        });
+        }));
       };
 
       __proto.getErrorCount = function () {
@@ -11668,24 +11713,26 @@ version: 4.7.1
             preventClickOnDrag = _0 === void 0 ? true : _0,
             _1 = _b.disableOnInit,
             disableOnInit = _1 === void 0 ? false : _1,
-            _2 = _b.renderOnlyVisible,
-            renderOnlyVisible = _2 === void 0 ? false : _2,
-            _3 = _b.virtual,
-            virtual = _3 === void 0 ? null : _3,
-            _4 = _b.autoInit,
-            autoInit = _4 === void 0 ? true : _4,
-            _5 = _b.autoResize,
-            autoResize = _5 === void 0 ? true : _5,
-            _6 = _b.useResizeObserver,
-            useResizeObserver = _6 === void 0 ? true : _6,
-            _7 = _b.resizeDebounce,
-            resizeDebounce = _7 === void 0 ? 0 : _7,
-            _8 = _b.maxResizeDebounce,
-            maxResizeDebounce = _8 === void 0 ? 100 : _8,
-            _9 = _b.externalRenderer,
-            externalRenderer = _9 === void 0 ? null : _9,
-            _10 = _b.renderExternal,
-            renderExternal = _10 === void 0 ? null : _10;
+            _2 = _b.changeOnHold,
+            changeOnHold = _2 === void 0 ? false : _2,
+            _3 = _b.renderOnlyVisible,
+            renderOnlyVisible = _3 === void 0 ? false : _3,
+            _4 = _b.virtual,
+            virtual = _4 === void 0 ? null : _4,
+            _5 = _b.autoInit,
+            autoInit = _5 === void 0 ? true : _5,
+            _6 = _b.autoResize,
+            autoResize = _6 === void 0 ? true : _6,
+            _7 = _b.useResizeObserver,
+            useResizeObserver = _7 === void 0 ? true : _7,
+            _8 = _b.resizeDebounce,
+            resizeDebounce = _8 === void 0 ? 0 : _8,
+            _9 = _b.maxResizeDebounce,
+            maxResizeDebounce = _9 === void 0 ? 100 : _9,
+            _10 = _b.externalRenderer,
+            externalRenderer = _10 === void 0 ? null : _10,
+            _11 = _b.renderExternal,
+            renderExternal = _11 === void 0 ? null : _11;
 
         var _this = _super.call(this) || this; // Internal states
 
@@ -11718,6 +11765,7 @@ version: 4.7.1
         _this._iOSEdgeSwipeThreshold = iOSEdgeSwipeThreshold;
         _this._preventClickOnDrag = preventClickOnDrag;
         _this._disableOnInit = disableOnInit;
+        _this._changeOnHold = changeOnHold;
         _this._renderOnlyVisible = renderOnlyVisible;
         _this._autoInit = autoInit;
         _this._autoResize = autoResize;
@@ -12474,6 +12522,24 @@ version: 4.7.1
         enumerable: false,
         configurable: true
       });
+      Object.defineProperty(__proto, "changeOnHold", {
+        /**
+         * Change active panel index on mouse/touch hold while animating.
+         * `index` of the `willChange`/`willRestore` event will be used as new index.
+         * @ko 애니메이션 도중 마우스/터치 입력시 현재 활성화된 패널의 인덱스를 변경합니다.
+         * `willChange`/`willRestore` 이벤트의 `index`값이 새로운 인덱스로 사용될 것입니다.
+         * @type {boolean}
+         * @default false
+         */
+        get: function () {
+          return this._changeOnHold;
+        },
+        set: function (val) {
+          this._changeOnHold = val;
+        },
+        enumerable: false,
+        configurable: true
+      });
       Object.defineProperty(__proto, "renderOnlyVisible", {
         // PERFORMANCE
 
@@ -13154,6 +13220,8 @@ version: 4.7.1
                 camera.updateAlignPos();
                 camera.updateRange();
                 camera.updateAnchors();
+                camera.updateAdaptiveHeight();
+                camera.updateOffset();
                 return [4
                 /*yield*/
                 , renderer.render()];
@@ -13431,7 +13499,7 @@ version: 4.7.1
        */
 
 
-      Flicking.VERSION = "4.7.1";
+      Flicking.VERSION = "4.8.0";
       return Flicking;
     }(Component);