vant 3.4.0 → 3.4.1

package/lib/lazyload/vue-lazyload/lazy.js

@@ -1,47 +1,67 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = _default;
-
-var _vue = require("vue");
-
-var _use = require("@vant/use");
-
-var _util = require("./util");
-
-var _utils = require("../../utils");
-
-var _listener = _interopRequireDefault(require("./listener"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var DEFAULT_URL = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';
-var DEFAULT_EVENTS = ['scroll', 'wheel', 'mousewheel', 'resize', 'animationend', 'transitionend', 'touchmove'];
-var DEFAULT_OBSERVER_OPTIONS = {
-  rootMargin: '0px',
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  __markAsModule(target);
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+__export(exports, {
+  default: () => stdin_default
+});
+var import_vue = __toModule(require("vue"));
+var import_use = __toModule(require("@vant/use"));
+var import_util = __toModule(require("./util"));
+var import_utils = __toModule(require("../../utils"));
+var import_listener = __toModule(require("./listener"));
+const DEFAULT_URL = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
+const DEFAULT_EVENTS = [
+  "scroll",
+  "wheel",
+  "mousewheel",
+  "resize",
+  "animationend",
+  "transitionend",
+  "touchmove"
+];
+const DEFAULT_OBSERVER_OPTIONS = {
+  rootMargin: "0px",
   threshold: 0
 };
-
-function _default() {
+function stdin_default() {
   return class Lazy {
-    constructor(_ref) {
-      var {
-        preLoad,
-        error,
-        throttleWait,
-        preLoadTop,
-        dispatchEvent,
-        loading,
-        attempt,
-        silent = true,
-        scale,
-        listenEvents,
-        filter,
-        adapter,
-        observer,
-        observerOptions
-      } = _ref;
-      this.mode = _util.modeType.event;
+    constructor({
+      preLoad,
+      error,
+      throttleWait,
+      preLoadTop,
+      dispatchEvent,
+      loading,
+      attempt,
+      silent = true,
+      scale,
+      listenEvents,
+      filter,
+      adapter,
+      observer,
+      observerOptions
+    }) {
+      this.mode = import_util.modeType.event;
       this.listeners = [];
       this.targetIndex = 0;
       this.targets = [];
@@ -54,99 +74,55 @@ function _default() {
         error: error || DEFAULT_URL,
         loading: loading || DEFAULT_URL,
         attempt: attempt || 3,
-        scale: scale || (0, _util.getDPR)(scale),
+        scale: scale || (0, import_util.getDPR)(scale),
         ListenEvents: listenEvents || DEFAULT_EVENTS,
-        supportWebp: (0, _util.supportWebp)(),
+        supportWebp: (0, import_util.supportWebp)(),
         filter: filter || {},
         adapter: adapter || {},
         observer: !!observer,
         observerOptions: observerOptions || DEFAULT_OBSERVER_OPTIONS
       };
       this.initEvent();
-      this.imageCache = new _util.ImageCache({
-        max: 200
-      });
-      this.lazyLoadHandler = (0, _util.throttle)(this.lazyLoadHandler.bind(this), this.options.throttleWait);
-      this.setMode(this.options.observer ? _util.modeType.observer : _util.modeType.event);
+      this.imageCache = new import_util.ImageCache({ max: 200 });
+      this.lazyLoadHandler = (0, import_util.throttle)(this.lazyLoadHandler.bind(this), this.options.throttleWait);
+      this.setMode(this.options.observer ? import_util.modeType.observer : import_util.modeType.event);
     }
-    /**
-     * update config
-     * @param  {Object} config params
-     * @return
-     */
-
-
-    config(options) {
-      if (options === void 0) {
-        options = {};
-      }
-
+    config(options = {}) {
       Object.assign(this.options, options);
     }
-    /**
-     * output listener's load performance
-     * @return {Array}
-     */
-
-
     performance() {
-      return this.listeners.map(item => item.performance());
+      return this.listeners.map((item) => item.performance());
     }
-    /*
-     * add lazy component to queue
-     * @param  {Vue} vm lazy component instance
-     * @return
-     */
-
-
     addLazyBox(vm) {
       this.listeners.push(vm);
-
-      if (_use.inBrowser) {
+      if (import_use.inBrowser) {
         this.addListenerTarget(window);
         this.observer && this.observer.observe(vm.el);
-
         if (vm.$el && vm.$el.parentNode) {
           this.addListenerTarget(vm.$el.parentNode);
         }
       }
     }
-    /*
-     * add image listener to queue
-     * @param  {DOM} el
-     * @param  {object} binding vue directive binding
-     * @param  {vnode} vnode vue directive vnode
-     * @return
-     */
-
-
     add(el, binding, vnode) {
-      if (this.listeners.some(item => item.el === el)) {
+      if (this.listeners.some((item) => item.el === el)) {
         this.update(el, binding);
-        return (0, _vue.nextTick)(this.lazyLoadHandler);
+        return (0, import_vue.nextTick)(this.lazyLoadHandler);
       }
-
-      var value = this.valueFormatter(binding.value);
-      var {
-        src
-      } = value;
-      (0, _vue.nextTick)(() => {
-        src = (0, _util.getBestSelectionFromSrcset)(el, this.options.scale) || src;
+      const value = this.valueFormatter(binding.value);
+      let { src } = value;
+      (0, import_vue.nextTick)(() => {
+        src = (0, import_util.getBestSelectionFromSrcset)(el, this.options.scale) || src;
         this.observer && this.observer.observe(el);
-        var container = Object.keys(binding.modifiers)[0];
-        var $parent;
-
+        const container = Object.keys(binding.modifiers)[0];
+        let $parent;
         if (container) {
-          $parent = vnode.context.$refs[container]; // if there is container passed in, try ref first, then fallback to getElementById to support the original usage
-
+          $parent = vnode.context.$refs[container];
           $parent = $parent ? $parent.$el || $parent : document.getElementById(container);
         }
-
         if (!$parent) {
-          $parent = (0, _use.getScrollParent)(el);
+          $parent = (0, import_use.getScrollParent)(el);
         }
-
-        var newListener = new _listener.default({
+        const newListener = new import_listener.default({
           bindType: binding.arg,
           $parent,
           el,
@@ -159,32 +135,19 @@ function _default() {
           imageCache: this.imageCache
         });
         this.listeners.push(newListener);
-
-        if (_use.inBrowser) {
+        if (import_use.inBrowser) {
           this.addListenerTarget(window);
           this.addListenerTarget($parent);
         }
-
         this.lazyLoadHandler();
-        (0, _vue.nextTick)(() => this.lazyLoadHandler());
+        (0, import_vue.nextTick)(() => this.lazyLoadHandler());
       });
     }
-    /**
-     * update image src
-     * @param  {DOM} el
-     * @param  {object} vue directive binding
-     * @return
-     */
-
-
     update(el, binding, vnode) {
-      var value = this.valueFormatter(binding.value);
-      var {
-        src
-      } = value;
-      src = (0, _util.getBestSelectionFromSrcset)(el, this.options.scale) || src;
-      var exist = this.listeners.find(item => item.el === el);
-
+      const value = this.valueFormatter(binding.value);
+      let { src } = value;
+      src = (0, import_util.getBestSelectionFromSrcset)(el, this.options.scale) || src;
+      const exist = this.listeners.find((item) => item.el === el);
       if (!exist) {
         this.add(el, binding, vnode);
       } else {
@@ -194,93 +157,61 @@ function _default() {
           loading: value.loading
         });
       }
-
       if (this.observer) {
         this.observer.unobserve(el);
         this.observer.observe(el);
       }
-
       this.lazyLoadHandler();
-      (0, _vue.nextTick)(() => this.lazyLoadHandler());
+      (0, import_vue.nextTick)(() => this.lazyLoadHandler());
     }
-    /**
-     * remove listener form list
-     * @param  {DOM} el
-     * @return
-     */
-
-
     remove(el) {
-      if (!el) return;
+      if (!el)
+        return;
       this.observer && this.observer.unobserve(el);
-      var existItem = this.listeners.find(item => item.el === el);
-
+      const existItem = this.listeners.find((item) => item.el === el);
       if (existItem) {
         this.removeListenerTarget(existItem.$parent);
         this.removeListenerTarget(window);
-        (0, _util.remove)(this.listeners, existItem);
+        (0, import_util.remove)(this.listeners, existItem);
         existItem.$destroy();
       }
     }
-    /*
-     * remove lazy components form list
-     * @param  {Vue} vm Vue instance
-     * @return
-     */
-
-
     removeComponent(vm) {
-      if (!vm) return;
-      (0, _util.remove)(this.listeners, vm);
+      if (!vm)
+        return;
+      (0, import_util.remove)(this.listeners, vm);
       this.observer && this.observer.unobserve(vm.el);
-
       if (vm.$parent && vm.$el.parentNode) {
         this.removeListenerTarget(vm.$el.parentNode);
       }
-
       this.removeListenerTarget(window);
     }
-
     setMode(mode) {
-      if (!_util.hasIntersectionObserver && mode === _util.modeType.observer) {
-        mode = _util.modeType.event;
+      if (!import_util.hasIntersectionObserver && mode === import_util.modeType.observer) {
+        mode = import_util.modeType.event;
       }
-
-      this.mode = mode; // event or observer
-
-      if (mode === _util.modeType.event) {
+      this.mode = mode;
+      if (mode === import_util.modeType.event) {
         if (this.observer) {
-          this.listeners.forEach(listener => {
+          this.listeners.forEach((listener) => {
             this.observer.unobserve(listener.el);
           });
           this.observer = null;
         }
-
-        this.targets.forEach(target => {
+        this.targets.forEach((target) => {
           this.initListen(target.el, true);
         });
       } else {
-        this.targets.forEach(target => {
+        this.targets.forEach((target) => {
           this.initListen(target.el, false);
         });
         this.initIntersectionObserver();
       }
     }
-    /*
-     *** Private functions ***
-     */
-
-    /*
-     * add listener target
-     * @param  {DOM} el listener target
-     * @return
-     */
-
-
     addListenerTarget(el) {
-      if (!el) return;
-      var target = this.targets.find(target => target.el === el);
-
+      if (!el)
+        return;
+      let target = this.targets.find((target2) => target2.el === el);
       if (!target) {
         target = {
           el,
@@ -288,26 +219,17 @@ function _default() {
           childrenCount: 1,
           listened: true
         };
-        this.mode === _util.modeType.event && this.initListen(target.el, true);
+        this.mode === import_util.modeType.event && this.initListen(target.el, true);
         this.targets.push(target);
       } else {
         target.childrenCount++;
       }
-
       return this.targetIndex;
     }
-    /*
-     * remove listener target or reduce target childrenCount
-     * @param  {DOM} el or window
-     * @return
-     */
-
-
     removeListenerTarget(el) {
       this.targets.forEach((target, index) => {
         if (target.el === el) {
           target.childrenCount--;
-
           if (!target.childrenCount) {
             this.initListen(target.el, false);
             this.targets.splice(index, 1);
@@ -316,21 +238,10 @@ function _default() {
         }
       });
     }
-    /*
-     * add or remove eventlistener
-     * @param  {DOM} el DOM or Window
-     * @param  {boolean} start flag
-     * @return
-     */
-
-
     initListen(el, start) {
-      this.options.ListenEvents.forEach(evt => (start ? _util.on : _util.off)(el, evt, this.lazyLoadHandler));
+      this.options.ListenEvents.forEach((evt) => (start ? import_util.on : import_util.off)(el, evt, this.lazyLoadHandler));
     }
-
     initEvent() {
-      var _this = this;
-
       this.Event = {
         listeners: {
           loading: [],
@@ -338,183 +249,120 @@ function _default() {
           error: []
         }
       };
-
       this.$on = (event, func) => {
-        if (!this.Event.listeners[event]) this.Event.listeners[event] = [];
+        if (!this.Event.listeners[event])
+          this.Event.listeners[event] = [];
         this.Event.listeners[event].push(func);
       };
-
       this.$once = (event, func) => {
-        var on = function () {
-          _this.$off(event, on);
-
-          for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-            args[_key] = arguments[_key];
-          }
-
-          func.apply(_this, args);
+        const on2 = (...args) => {
+          this.$off(event, on2);
+          func.apply(this, args);
         };
-
-        this.$on(event, on);
+        this.$on(event, on2);
       };
-
       this.$off = (event, func) => {
         if (!func) {
-          if (!this.Event.listeners[event]) return;
+          if (!this.Event.listeners[event])
+            return;
           this.Event.listeners[event].length = 0;
           return;
         }
-
-        (0, _util.remove)(this.Event.listeners[event], func);
+        (0, import_util.remove)(this.Event.listeners[event], func);
       };
-
       this.$emit = (event, context, inCache) => {
-        if (!this.Event.listeners[event]) return;
-        this.Event.listeners[event].forEach(func => func(context, inCache));
+        if (!this.Event.listeners[event])
+          return;
+        this.Event.listeners[event].forEach((func) => func(context, inCache));
       };
     }
-    /**
-     * find nodes which in viewport and trigger load
-     * @return
-     */
-
-
     lazyLoadHandler() {
-      var freeList = [];
-      this.listeners.forEach(listener => {
+      const freeList = [];
+      this.listeners.forEach((listener) => {
         if (!listener.el || !listener.el.parentNode) {
           freeList.push(listener);
         }
-
-        var catIn = listener.checkInView();
-        if (!catIn) return;
+        const catIn = listener.checkInView();
+        if (!catIn)
+          return;
         listener.load();
       });
-      freeList.forEach(item => {
-        (0, _util.remove)(this.listeners, item);
+      freeList.forEach((item) => {
+        (0, import_util.remove)(this.listeners, item);
         item.$destroy();
       });
     }
-    /**
-     * init IntersectionObserver
-     * set mode to observer
-     * @return
-     */
-
-
     initIntersectionObserver() {
-      if (!_util.hasIntersectionObserver) {
+      if (!import_util.hasIntersectionObserver) {
         return;
       }
-
       this.observer = new IntersectionObserver(this.observerHandler.bind(this), this.options.observerOptions);
-
       if (this.listeners.length) {
-        this.listeners.forEach(listener => {
+        this.listeners.forEach((listener) => {
           this.observer.observe(listener.el);
         });
       }
     }
-    /**
-     * init IntersectionObserver
-     * @return
-     */
-
-
     observerHandler(entries) {
-      entries.forEach(entry => {
+      entries.forEach((entry) => {
         if (entry.isIntersecting) {
-          this.listeners.forEach(listener => {
+          this.listeners.forEach((listener) => {
             if (listener.el === entry.target) {
-              if (listener.state.loaded) return this.observer.unobserve(listener.el);
+              if (listener.state.loaded)
+                return this.observer.unobserve(listener.el);
               listener.load();
             }
           });
         }
       });
     }
-    /**
-     * set element attribute with image'url and state
-     * @param  {object} lazyload listener object
-     * @param  {string} state will be rendered
-     * @param  {bool} inCache  is rendered from cache
-     * @return
-     */
-
-
     elRenderer(listener, state, cache) {
-      if (!listener.el) return;
-      var {
-        el,
-        bindType
-      } = listener;
-      var src;
-
+      if (!listener.el)
+        return;
+      const { el, bindType } = listener;
+      let src;
       switch (state) {
-        case 'loading':
+        case "loading":
           src = listener.loading;
           break;
-
-        case 'error':
+        case "error":
           src = listener.error;
           break;
-
         default:
-          ({
-            src
-          } = listener);
+          ({ src } = listener);
           break;
       }
-
       if (bindType) {
         el.style[bindType] = 'url("' + src + '")';
-      } else if (el.getAttribute('src') !== src) {
-        el.setAttribute('src', src);
+      } else if (el.getAttribute("src") !== src) {
+        el.setAttribute("src", src);
       }
-
-      el.setAttribute('lazy', state);
+      el.setAttribute("lazy", state);
       this.$emit(state, listener, cache);
       this.options.adapter[state] && this.options.adapter[state](listener, this.options);
-
       if (this.options.dispatchEvent) {
-        var event = new CustomEvent(state, {
+        const event = new CustomEvent(state, {
           detail: listener
         });
         el.dispatchEvent(event);
       }
     }
-    /**
-     * generate loading loaded error image url
-     * @param {string} image's src
-     * @return {object} image's loading, loaded, error url
-     */
-
-
     valueFormatter(value) {
-      var src = value;
-      var {
-        loading,
-        error
-      } = this.options; // value is object
-
-      if ((0, _utils.isObject)(value)) {
-        if (process.env.NODE_ENV !== 'production' && !value.src && !this.options.silent) {
-          console.error('[@vant/lazyload] miss src with ' + value);
+      let src = value;
+      let { loading, error } = this.options;
+      if ((0, import_utils.isObject)(value)) {
+        if (process.env.NODE_ENV !== "production" && !value.src && !this.options.silent) {
+          console.error("[@vant/lazyload] miss src with " + value);
         }
-
-        ({
-          src
-        } = value);
+        ({ src } = value);
         loading = value.loading || this.options.loading;
         error = value.error || this.options.error;
       }
-
       return {
         src,
         loading,
         error
       };
     }
-
   };
-}
+}