@nutui/nutui 3.1.21 → 3.1.22-beta.5

package/dist/packages/_es/InfiniteLoading.js

@@ -1,275 +1,64 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 /*!
-* @nutui/nutui v3.1.21 Mon May 30 2022 20:20:01 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.1.22-beta.5 Fri Jun 24 2022 15:10:09 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { reactive, computed, onMounted, onUnmounted, ref, onActivated, onDeactivated, toRefs, resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, normalizeStyle, createVNode, toDisplayString, renderSlot, Fragment, createCommentVNode } from "vue";
-import { c as createComponent } from "./component.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import { reactive as e, computed as t, onMounted as o, onUnmounted as n, ref as s, onActivated as l, onDeactivated as i, toRefs as r, resolveComponent as a, openBlock as c, createElementBlock as u, normalizeClass as d, createElementVNode as f, normalizeStyle as p, createVNode as h, toDisplayString as g, renderSlot as m, Fragment as w, createCommentVNode as T } from "vue";
+import { c as y } from "./component.js";
+import { _ as v } from "./plugin-vue_export-helper.js";
 import "../locale/lang";
-const { componentName, create, translate } = createComponent("infiniteloading");
-const _sfc_main = create({
-  props: {
-    hasMore: {
-      type: Boolean,
-      default: true
-    },
-    threshold: {
-      type: Number,
-      default: 200
-    },
-    pullIcon: {
-      type: String,
-      default: "https://img10.360buyimg.com/imagetools/jfs/t1/169863/6/4565/6306/60125948E7e92774e/40b3a0cf42852bcb.png"
-    },
-    pullTxt: {
-      type: String,
-      default: ""
-    },
-    loadIcon: {
-      type: String,
-      default: "https://img10.360buyimg.com/imagetools/jfs/t1/169863/6/4565/6306/60125948E7e92774e/40b3a0cf42852bcb.png"
-    },
-    loadTxt: {
-      type: String,
-      default: ""
-    },
-    loadMoreTxt: {
-      type: String,
-      default: ""
-    },
-    useWindow: {
-      type: Boolean,
-      default: true
-    },
-    containerId: {
-      type: String,
-      default: ""
-    },
-    useCapture: {
-      type: Boolean,
-      default: false
-    },
-    isOpenRefresh: {
-      type: Boolean,
-      default: false
+const { componentName: b, create: x, translate: E } = y("infiniteloading"), S = x({ props: { hasMore: { type: Boolean, default: true }, threshold: { type: Number, default: 200 }, pullIcon: { type: String, default: "https://img10.360buyimg.com/imagetools/jfs/t1/169863/6/4565/6306/60125948E7e92774e/40b3a0cf42852bcb.png" }, pullTxt: { type: String, default: "" }, loadIcon: { type: String, default: "https://img10.360buyimg.com/imagetools/jfs/t1/169863/6/4565/6306/60125948E7e92774e/40b3a0cf42852bcb.png" }, loadTxt: { type: String, default: "" }, loadMoreTxt: { type: String, default: "" }, useWindow: { type: Boolean, default: true }, containerId: { type: String, default: "" }, useCapture: { type: Boolean, default: false }, isOpenRefresh: { type: Boolean, default: false } }, emits: ["scroll-change", "load-more", "refresh"], setup(a2, { emit: c2, slots: u2 }) {
+  const d2 = e({ scrollEl: window, scroller: null, refreshTop: null, beforeScrollTop: 0, isTouching: false, isInfiniting: false, refreshMaxH: 0, y: 0, x: 0, distance: 0 }), f2 = t(() => ({ [b]: true })), p2 = t(() => ({ height: d2.distance < 0 ? "0px" : `${d2.distance}px`, transition: d2.isTouching ? "height 0s cubic-bezier(0.25,0.1,0.25,1)" : "height 0.2s cubic-bezier(0.25,0.1,0.25,1)" })), h2 = (e2) => e2 ? e2.offsetTop + h2(e2.offsetParent) : 0, g2 = () => {
+    let e2 = 0, t2 = 0, o2 = "down";
+    const n2 = window.pageYOffset !== void 0 ? window.pageYOffset : (document.documentElement || document.body.parentNode || document.body).scrollTop;
+    if (a2.useWindow)
+      d2.scroller && (e2 = h2(d2.scroller) + d2.scroller.offsetHeight - n2 - window.innerHeight), t2 = n2;
+    else {
+      const { scrollHeight: o3, clientHeight: n3, scrollTop: s2 } = d2.scrollEl;
+      e2 = o3 - n3 - s2, t2 = s2;
     }
-  },
-  emits: ["scroll-change", "load-more", "refresh"],
-  setup(props, { emit, slots }) {
-    const state = reactive({
-      scrollEl: window,
-      scroller: null,
-      refreshTop: null,
-      beforeScrollTop: 0,
-      isTouching: false,
-      isInfiniting: false,
-      refreshMaxH: 0,
-      y: 0,
-      x: 0,
-      distance: 0
-    });
-    const classes = computed(() => {
-      const prefixCls = componentName;
-      return {
-        [prefixCls]: true
-      };
-    });
-    const getStyle = computed(() => {
-      return {
-        height: state.distance < 0 ? `0px` : `${state.distance}px`,
-        transition: state.isTouching ? `height 0s cubic-bezier(0.25,0.1,0.25,1)` : `height 0.2s cubic-bezier(0.25,0.1,0.25,1)`
-      };
-    });
-    const requestAniFrame = () => {
-      return window.requestAnimationFrame || window.webkitRequestAnimationFrame || function(callback) {
-        window.setTimeout(callback, 1e3 / 60);
-      };
-    };
-    const getWindowScrollTop = () => {
-      return window.pageYOffset !== void 0 ? window.pageYOffset : (document.documentElement || document.body.parentNode || document.body).scrollTop;
-    };
-    const calculateTopPosition = (el) => {
-      return !el ? 0 : el.offsetTop + calculateTopPosition(el.offsetParent);
-    };
-    const isScrollAtBottom = () => {
-      let offsetDistance = 0;
-      let resScrollTop = 0;
-      let direction = "down";
-      const windowScrollTop = getWindowScrollTop();
-      if (props.useWindow) {
-        if (state.scroller) {
-          offsetDistance = calculateTopPosition(state.scroller) + state.scroller.offsetHeight - windowScrollTop - window.innerHeight;
-        }
-        resScrollTop = windowScrollTop;
-      } else {
-        const { scrollHeight, clientHeight, scrollTop } = state.scrollEl;
-        offsetDistance = scrollHeight - clientHeight - scrollTop;
-        resScrollTop = scrollTop;
-      }
-      if (state.beforeScrollTop > resScrollTop) {
-        direction = "up";
-      } else {
-        direction = "down";
-      }
-      state.beforeScrollTop = resScrollTop;
-      emit("scroll-change", resScrollTop);
-      return offsetDistance <= props.threshold && direction == "down";
-    };
-    const infiniteDone = () => {
-      state.isInfiniting = false;
-    };
-    const handleScroll = () => {
-      requestAniFrame()(() => {
-        if (!isScrollAtBottom() || !props.hasMore || state.isInfiniting) {
-          return false;
-        } else {
-          state.isInfiniting = true;
-          emit("load-more", infiniteDone);
-        }
-      });
-    };
-    const scrollListener = () => {
-      state.scrollEl.addEventListener("scroll", handleScroll, props.useCapture);
-    };
-    const refreshDone = () => {
-      state.distance = 0;
-      state.isTouching = false;
-    };
-    const touchStart = (event) => {
-      if (state.beforeScrollTop == 0 && !state.isTouching && props.isOpenRefresh) {
-        state.y = event.touches[0].pageY;
-        state.isTouching = true;
-        const childHeight = state.refreshTop.firstElementChild.offsetHeight;
-        state.refreshMaxH = Math.floor(childHeight * 1 + 10);
-      }
-    };
-    const touchMove = (event) => {
-      state.distance = event.touches[0].pageY - state.y;
-      if (state.distance > 0 && state.isTouching) {
-        event.preventDefault();
-        if (state.distance >= state.refreshMaxH)
-          state.distance = state.refreshMaxH;
-      } else {
-        state.distance = 0;
-        state.isTouching = false;
-      }
-    };
-    const touchEnd = () => {
-      if (state.distance) {
-        if (state.distance < state.refreshMaxH) {
-          state.distance = 0;
-        } else {
-          emit("refresh", refreshDone);
-        }
-      }
-    };
-    const getParentElement = (el) => {
-      return !!props.containerId ? document.querySelector(`#${props.containerId}`) : el && el.parentNode;
-    };
-    onMounted(() => {
-      const parentElement = getParentElement(state.scroller);
-      state.scrollEl = props.useWindow ? window : parentElement;
-      scrollListener();
-      console.log(slots);
-    });
-    onUnmounted(() => {
-      state.scrollEl.removeEventListener("scroll", handleScroll, props.useCapture);
+    return o2 = d2.beforeScrollTop > t2 ? "up" : "down", d2.beforeScrollTop = t2, c2("scroll-change", t2), e2 <= a2.threshold && o2 == "down";
+  }, m2 = () => {
+    d2.isInfiniting = false;
+  }, w2 = () => {
+    (window.requestAnimationFrame || window.webkitRequestAnimationFrame || function(e2) {
+      window.setTimeout(e2, 1e3 / 60);
+    })(() => {
+      if (!g2() || !a2.hasMore || d2.isInfiniting)
+        return false;
+      d2.isInfiniting = true, c2("load-more", m2);
     });
-    const isKeepAlive = ref(false);
-    onActivated(() => {
-      if (isKeepAlive.value) {
-        isKeepAlive.value = false;
-        scrollListener();
-      }
-    });
-    onDeactivated(() => {
-      isKeepAlive.value = true;
-      state.scrollEl.removeEventListener("scroll", handleScroll, props.useCapture);
-    });
-    return __spreadProps(__spreadValues({
-      classes
-    }, toRefs(state)), {
-      touchStart,
-      touchMove,
-      touchEnd,
-      getStyle,
-      translate,
-      slots
-    });
-  }
-});
-const _hoisted_1 = { class: "top-box" };
-const _hoisted_2 = { class: "top-text" };
-const _hoisted_3 = { class: "nut-infinite-container" };
-const _hoisted_4 = { class: "nut-infinite-bottom" };
-const _hoisted_5 = {
-  key: 0,
-  class: "bottom-box"
-};
-const _hoisted_6 = { class: "bottom-text" };
-const _hoisted_7 = {
-  key: 0,
-  class: "tips"
-};
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_nut_icon = resolveComponent("nut-icon");
-  return openBlock(), createElementBlock("view", {
-    class: normalizeClass(_ctx.classes),
-    ref: "scroller",
-    onTouchstart: _cache[0] || (_cache[0] = (...args) => _ctx.touchStart && _ctx.touchStart(...args)),
-    onTouchmove: _cache[1] || (_cache[1] = (...args) => _ctx.touchMove && _ctx.touchMove(...args)),
-    onTouchend: _cache[2] || (_cache[2] = (...args) => _ctx.touchEnd && _ctx.touchEnd(...args))
-  }, [
-    createElementVNode("view", {
-      class: "nut-infinite-top",
-      ref: "refreshTop",
-      style: normalizeStyle(_ctx.getStyle)
-    }, [
-      createElementVNode("view", _hoisted_1, [
-        createVNode(_component_nut_icon, {
-          class: "top-img",
-          name: _ctx.pullIcon
-        }, null, 8, ["name"]),
-        createElementVNode("view", _hoisted_2, toDisplayString(_ctx.pullTxt || _ctx.translate("pullTxt")), 1)
-      ])
-    ], 4),
-    createElementVNode("view", _hoisted_3, [
-      renderSlot(_ctx.$slots, "default")
-    ]),
-    createElementVNode("view", _hoisted_4, [
-      _ctx.isInfiniting ? (openBlock(), createElementBlock("view", _hoisted_5, [
-        !_ctx.slots.loading ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-          createVNode(_component_nut_icon, {
-            class: "bottom-img",
-            name: _ctx.loadIcon
-          }, null, 8, ["name"]),
-          createElementVNode("view", _hoisted_6, toDisplayString(_ctx.loadTxt || _ctx.translate("loading")), 1)
-        ], 64)) : renderSlot(_ctx.$slots, "loading", { key: 1 })
-      ])) : !_ctx.hasMore ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-        !_ctx.slots.finished ? (openBlock(), createElementBlock("view", _hoisted_7, toDisplayString(_ctx.loadMoreTxt || _ctx.translate("loadMoreTxt")), 1)) : renderSlot(_ctx.$slots, "finished", { key: 1 })
-      ], 64)) : createCommentVNode("", true)
-    ])
-  ], 34);
-}
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+  }, T2 = () => {
+    d2.scrollEl.addEventListener("scroll", w2, a2.useCapture);
+  }, y2 = () => {
+    d2.distance = 0, d2.isTouching = false;
+  };
+  o(() => {
+    const e2 = (t2 = d2.scroller, a2.containerId ? document.querySelector(`#${a2.containerId}`) : t2 && t2.parentNode);
+    var t2;
+    d2.scrollEl = a2.useWindow ? window : e2, T2();
+  }), n(() => {
+    d2.scrollEl.removeEventListener("scroll", w2, a2.useCapture);
+  });
+  const v2 = s(false);
+  return l(() => {
+    v2.value && (v2.value = false, T2());
+  }), i(() => {
+    v2.value = true, d2.scrollEl.removeEventListener("scroll", w2, a2.useCapture);
+  }), { classes: f2, ...r(d2), touchStart: (e2) => {
+    if (d2.beforeScrollTop == 0 && !d2.isTouching && a2.isOpenRefresh) {
+      d2.y = e2.touches[0].pageY, d2.isTouching = true;
+      const t2 = d2.refreshTop.firstElementChild.offsetHeight;
+      d2.refreshMaxH = Math.floor(1 * t2 + 10);
+    }
+  }, touchMove: (e2) => {
+    d2.distance = e2.touches[0].pageY - d2.y, d2.distance > 0 && d2.isTouching ? (e2.preventDefault(), d2.distance >= d2.refreshMaxH && (d2.distance = d2.refreshMaxH)) : (d2.distance = 0, d2.isTouching = false);
+  }, touchEnd: () => {
+    d2.distance && (d2.distance < d2.refreshMaxH ? d2.distance = 0 : c2("refresh", y2));
+  }, getStyle: p2, translate: E, slots: u2 };
+} }), M = { class: "top-box" }, I = { class: "top-text" }, H = { class: "nut-infinite-container" }, k = { class: "nut-infinite-bottom" }, C = { key: 0, class: "bottom-box" }, $ = { class: "bottom-text" }, j = { key: 0, class: "tips" };
+var B = v(S, [["render", function(e2, t2, o2, n2, s2, l2) {
+  const i2 = a("nut-icon");
+  return c(), u("view", { class: d(e2.classes), ref: "scroller", onTouchstart: t2[0] || (t2[0] = (...t3) => e2.touchStart && e2.touchStart(...t3)), onTouchmove: t2[1] || (t2[1] = (...t3) => e2.touchMove && e2.touchMove(...t3)), onTouchend: t2[2] || (t2[2] = (...t3) => e2.touchEnd && e2.touchEnd(...t3)) }, [f("view", { class: "nut-infinite-top", ref: "refreshTop", style: p(e2.getStyle) }, [f("view", M, [h(i2, { class: "top-img", name: e2.pullIcon }, null, 8, ["name"]), f("view", I, g(e2.pullTxt || e2.translate("pullTxt")), 1)])], 4), f("view", H, [m(e2.$slots, "default")]), f("view", k, [e2.isInfiniting ? (c(), u("view", C, [e2.slots.loading ? m(e2.$slots, "loading", { key: 1 }) : (c(), u(w, { key: 0 }, [h(i2, { class: "bottom-img", name: e2.loadIcon }, null, 8, ["name"]), f("view", $, g(e2.loadTxt || e2.translate("loading")), 1)], 64))])) : e2.hasMore ? T("", true) : (c(), u(w, { key: 1 }, [e2.slots.finished ? m(e2.$slots, "finished", { key: 1 }) : (c(), u("view", j, g(e2.loadMoreTxt || e2.translate("loadMoreTxt")), 1))], 64))])], 34);
+}]]);
+export { B as default };