@nutui/nutui 4.0.0-beta.9 → 4.0.1-2.beta-1

package/dist/packages/_es/Swiper.js

@@ -1,12 +1,11 @@
-import { ref, reactive, computed, provide, onDeactivated, onBeforeUnmount, watch, nextTick, openBlock, createElementBlock, normalizeClass, createElementVNode, normalizeStyle, renderSlot, Fragment, renderList, createCommentVNode } from "vue";
-import { c as createComponent, e as clamp } from "./component-81a4c1d0.js";
-import { u as useTouch } from "./index-7a7385e4.js";
-import { u as useExpose } from "./index-79c5dc33.js";
-import { r as requestAniFrame } from "./raf-729dad54.js";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
+import { ref as Q, reactive as Z, computed as s, provide as _, onDeactivated as ee, onBeforeUnmount as te, watch as E, nextTick as Y, openBlock as P, createElementBlock as b, normalizeClass as S, createElementVNode as ne, normalizeStyle as L, renderSlot as j, Fragment as oe, renderList as ae, createCommentVNode as ie } from "vue";
+import { c as le, e as B } from "./component-234624bc.js";
+import { u as re } from "./index-53ec2d4d.js";
+import { u as ue } from "./index-fadb0974.js";
+import { r as k } from "./raf-a74f1a06.js";
+import { _ as se } from "./_plugin-vue_export-helper-dad06003.js";
 import "../locale/lang";
-const { create, componentName } = createComponent("swiper");
-const _sfc_main = create({
+const { create: ce, componentName: M } = le("swiper"), fe = ce({
   props: {
     width: {
       type: [Number, String],
@@ -19,10 +18,11 @@ const _sfc_main = create({
     direction: {
       type: String,
       default: "horizontal"
+      //horizontal and vertical
     },
     paginationVisible: {
       type: Boolean,
-      default: false
+      default: !1
     },
     paginationColor: {
       type: String,
@@ -30,7 +30,7 @@ const _sfc_main = create({
     },
     loop: {
       type: Boolean,
-      default: true
+      default: !0
     },
     duration: {
       type: [Number, String],
@@ -46,363 +46,225 @@ const _sfc_main = create({
     },
     touchable: {
       type: Boolean,
-      default: true
+      default: !0
     },
     isPreventDefault: {
       type: Boolean,
-      default: true
+      default: !0
     },
     isStopPropagation: {
       type: Boolean,
-      default: true
-    },
-    isCenter: {
-      type: Boolean,
-      default: false
+      default: !0
     }
   },
   emits: ["change"],
-  setup(props, { emit, slots }) {
-    const container = ref();
-    const state = reactive({
+  setup(n, { emit: c, slots: p }) {
+    const N = Q(), e = Z({
       active: 0,
       num: 0,
       rect: null,
       width: 0,
       height: 0,
-      moving: false,
+      moving: !1,
       offset: 0,
       touchTime: 0,
-      autoplayTimer: 0,
+      autoplayTimer: null,
       children: [],
       childrenVNode: [],
       style: {}
-    });
-    const touch = useTouch();
-    const classes = computed(() => {
-      const prefixCls = componentName;
+    }), f = re(), v = s(() => ({
+      [M]: !0
+    })), l = s(() => n.direction === "vertical"), q = s(() => {
+      const t = M;
       return {
-        [prefixCls]: true
+        [`${t}-inner`]: !0,
+        [`${t}-vertical`]: l.value
       };
-    });
-    const isVertical = computed(() => props.direction === "vertical");
-    const classesInner = computed(() => {
-      const prefixCls = componentName;
+    }), R = s(() => {
+      const t = M;
       return {
-        [`${prefixCls}-inner`]: true,
-        [`${prefixCls}-vertical`]: isVertical.value
+        [`${t}-pagination`]: !0,
+        [`${t}-pagination-vertical`]: l.value
       };
-    });
-    const classesPagination = computed(() => {
-      const prefixCls = componentName;
-      return {
-        [`${prefixCls}-pagination`]: true,
-        [`${prefixCls}-pagination-vertical`]: isVertical.value
-      };
-    });
-    const delTa = computed(() => {
-      return isVertical.value ? touch.deltaY.value : touch.deltaX.value;
-    });
-    const isCorrectDirection = computed(() => {
-      return touch.direction.value === props.direction;
-    });
-    const childCount = computed(() => state.children.length);
-    const size = computed(() => state[isVertical.value ? "height" : "width"]);
-    const trackSize = computed(() => childCount.value * size.value);
-    const minOffset = computed(() => {
-      if (state.rect) {
-        const base = isVertical.value ? state.rect.height : state.rect.width;
-        return base - size.value * childCount.value;
-      }
-      return 0;
-    });
-    const activePagination = computed(() => (state.active + childCount.value) % childCount.value);
-    const getStyle = () => {
-      let offset = 0;
-      offset = state.offset;
-      state.style = {
-        transitionDuration: `${state.moving ? 0 : props.duration}ms`,
-        transform: `translate${isVertical.value ? "Y" : "X"}(${offset}px)`,
-        [isVertical.value ? "height" : "width"]: `${size.value * childCount.value}px`,
-        [isVertical.value ? "width" : "height"]: `${isVertical.value ? state.width : state.height}px`
+    }), h = s(() => l.value ? f.deltaY.value : f.deltaX.value), D = s(() => f.direction.value === n.direction), i = s(() => e.children.length), d = s(() => e[l.value ? "height" : "width"]), A = s(() => i.value * d.value), T = s(() => e.rect ? (l.value ? e.rect.height : e.rect.width) - d.value * i.value : 0), O = s(() => (e.active + i.value) % i.value), $ = () => {
+      let t = 0;
+      t = e.offset, e.style = {
+        transitionDuration: `${e.moving ? 0 : n.duration}ms`,
+        transform: `translate${l.value ? "Y" : "X"}(${t}px)`,
+        [l.value ? "height" : "width"]: `${d.value * i.value}px`,
+        [l.value ? "width" : "height"]: `${l.value ? e.width : e.height}px`
       };
-    };
-    const relation = (child) => {
-      var _a;
-      let children = [];
-      const childrenVNodeLen = state.childrenVNode.length;
-      let slot = (_a = slots == null ? void 0 : slots.default) == null ? void 0 : _a.call(slots);
-      slot = slot.filter((item) => item.children && Array.isArray(item.children));
-      slot.forEach((item) => {
-        children = children.concat(item.children);
-      });
-      if (!childrenVNodeLen) {
-        state.childrenVNode = children.slice();
-        child.proxy && state.children.push(child.proxy);
-      } else {
-        if (childrenVNodeLen > children.length) {
-          state.children = state.children.filter((item) => child.proxy !== item);
-        } else if (childrenVNodeLen < children.length) {
-          for (let i = 0; i < childrenVNodeLen; i++) {
-            if (children[i].key !== state.childrenVNode[i].key) {
-              child.proxy && state.children.splice(i, 0, child.proxy);
-              child.vnode && state.childrenVNode.splice(i, 0, child.vnode);
-              break;
-            }
-          }
-          if (childrenVNodeLen !== children.length) {
-            child.proxy && state.children.push(child.proxy);
-            child.vnode && state.childrenVNode.push(child.vnode);
+    }, U = (t) => {
+      var m;
+      let o = [];
+      const u = e.childrenVNode.length;
+      let r = (m = p == null ? void 0 : p.default) == null ? void 0 : m.call(p);
+      if (r = r.filter((a) => a.children && Array.isArray(a.children)), r.forEach((a) => {
+        o = o.concat(a.children);
+      }), !u)
+        e.childrenVNode = o.slice(), t.proxy && e.children.push(t.proxy);
+      else if (u > o.length)
+        e.children = e.children.filter((a) => t.proxy !== a);
+      else if (u < o.length) {
+        for (let a = 0; a < u; a++)
+          if (o[a].key !== e.childrenVNode[a].key) {
+            t.proxy && e.children.splice(a, 0, t.proxy), t.vnode && e.childrenVNode.splice(a, 0, t.vnode);
+            break;
           }
-        } else {
-          state.childrenVNode = children.slice();
-          child.proxy && state.children.push(child.proxy);
-        }
-      }
-    };
-    const getOffset = (active, offset = 0) => {
-      let currentPosition = active * size.value;
-      if (!props.loop) {
-        currentPosition = Math.min(currentPosition, -minOffset.value);
-      }
-      let targetOffset = offset - currentPosition;
-      if (!props.loop) {
-        targetOffset = clamp(targetOffset, minOffset.value, 0);
-      }
-      return targetOffset;
-    };
-    const getActive = (pace) => {
-      const { active } = state;
-      if (pace) {
-        if (props.loop) {
-          return clamp(active + pace, -1, childCount.value);
-        }
-        return clamp(active + pace, 0, childCount.value - 1);
-      }
-      return active;
-    };
-    const move = ({ pace = 0, offset = 0, isEmit = false }) => {
-      if (childCount.value <= 1)
+        u !== o.length && (t.proxy && e.children.push(t.proxy), t.vnode && e.childrenVNode.push(t.vnode));
+      } else
+        e.childrenVNode = o.slice(), t.proxy && e.children.push(t.proxy);
+    }, z = (t, o = 0) => {
+      let u = t * d.value;
+      n.loop || (u = Math.min(u, -T.value));
+      let r = o - u;
+      return n.loop || (r = B(r, T.value, 0)), r;
+    }, W = (t) => {
+      const { active: o } = e;
+      return t ? n.loop ? B(o + t, -1, i.value) : B(o + t, 0, i.value - 1) : o;
+    }, g = ({ pace: t = 0, offset: o = 0, isEmit: u = !1 }) => {
+      if (i.value <= 1)
         return;
-      const { active } = state;
-      const targetActive = getActive(pace);
-      const targetOffset = getOffset(targetActive, offset);
-      if (props.loop) {
-        if (state.children[0] && targetOffset !== minOffset.value) {
-          const rightBound = targetOffset < minOffset.value;
-          state.children[0].setOffset(rightBound ? trackSize.value : 0);
+      const { active: r } = e, m = W(t), a = z(m, o);
+      if (n.loop) {
+        if (e.children[0] && a !== T.value) {
+          const V = a < T.value;
+          e.children[0].setOffset(V ? A.value : 0);
         }
-        if (state.children[childCount.value - 1] && targetOffset !== 0) {
-          const leftBound = targetOffset > 0;
-          state.children[childCount.value - 1].setOffset(leftBound ? -trackSize.value : 0);
+        if (e.children[i.value - 1] && a !== 0) {
+          const V = a > 0;
+          e.children[i.value - 1].setOffset(V ? -A.value : 0);
         }
       }
-      state.active = targetActive;
-      state.offset = targetOffset;
-      if (isEmit && active !== state.active) {
-        emit("change", activePagination.value);
-      }
-      getStyle();
-    };
-    const resettPosition = () => {
-      state.moving = true;
-      if (state.active <= -1) {
-        move({ pace: childCount.value });
-      }
-      if (state.active >= childCount.value) {
-        move({ pace: -childCount.value });
-      }
-    };
-    const stopAutoPlay = () => {
-      clearTimeout(state.autoplayTimer);
-    };
-    const jump = (pace) => {
-      resettPosition();
-      touch.reset();
-      requestAniFrame(() => {
-        requestAniFrame(() => {
-          state.moving = false;
-          move({
-            pace,
-            isEmit: true
+      e.active = m, e.offset = a, u && r !== e.active && c("change", O.value), $();
+    }, C = () => {
+      e.moving = !0, e.active <= -1 && g({ pace: i.value }), e.active >= i.value && g({ pace: -i.value });
+    }, y = () => {
+      e.autoplayTimer && clearTimeout(e.autoplayTimer);
+    }, F = (t) => {
+      C(), f.reset(), k(() => {
+        k(() => {
+          e.moving = !1, g({
+            pace: t,
+            isEmit: !0
           });
         });
       });
-    };
-    const prev = () => {
-      jump(-1);
-    };
-    const next = () => {
-      jump(1);
-    };
-    const to = (index) => {
-      resettPosition();
-      touch.reset();
-      requestAniFrame(() => {
-        state.moving = false;
-        let targetIndex;
-        if (props.loop && childCount.value === index) {
-          targetIndex = state.active === 0 ? 0 : index;
-        } else {
-          targetIndex = index % childCount.value;
-        }
-        move({
-          pace: targetIndex - state.active,
-          isEmit: true
+    }, x = () => {
+      F(-1);
+    }, I = () => {
+      F(1);
+    }, G = (t) => {
+      C(), f.reset(), k(() => {
+        e.moving = !1;
+        let o;
+        n.loop && i.value === t ? o = e.active === 0 ? 0 : t : o = t % i.value, g({
+          pace: o - e.active,
+          isEmit: !0
         });
       });
-    };
-    const autoplay = () => {
-      if (props.autoPlay <= 0 || childCount.value <= 1)
+    }, w = () => {
+      n.autoPlay <= 0 || i.value <= 1 || (y(), e.autoplayTimer = setTimeout(() => {
+        I(), w();
+      }, Number(n.autoPlay)));
+    }, X = (t = +n.initPage) => {
+      y(), e.rect = N.value.getBoundingClientRect(), t = Math.min(i.value - 1, t), e.width = n.width ? +n.width : e.rect.width, e.height = n.height ? +n.height : e.rect.height, e.active = t, e.offset = z(e.active), e.moving = !0, $(), w();
+    }, H = (t) => {
+      n.isPreventDefault && t.preventDefault(), n.isStopPropagation && t.stopPropagation(), n.touchable && (f.start(t), e.touchTime = Date.now(), y(), C());
+    }, J = (t) => {
+      n.touchable && e.moving && (f.move(t), D.value && g({
+        offset: h.value
+      }));
+    }, K = (t) => {
+      if (!n.touchable || !e.moving)
         return;
-      stopAutoPlay();
-      state.autoplayTimer = setTimeout(() => {
-        next();
-        autoplay();
-      }, Number(props.autoPlay));
-    };
-    const init = (active = +props.initPage) => {
-      stopAutoPlay();
-      state.rect = container.value.getBoundingClientRect();
-      active = Math.min(childCount.value - 1, active);
-      state.width = props.width ? +props.width : state.rect.width;
-      state.height = props.height ? +props.height : state.rect.height;
-      state.active = active;
-      state.offset = getOffset(state.active);
-      state.moving = true;
-      getStyle();
-      autoplay();
-    };
-    const onTouchStart = (e) => {
-      if (props.isPreventDefault)
-        e.preventDefault();
-      if (props.isStopPropagation)
-        e.stopPropagation();
-      if (!props.touchable)
-        return;
-      touch.start(e);
-      state.touchTime = Date.now();
-      stopAutoPlay();
-      resettPosition();
-    };
-    const onTouchMove = (e) => {
-      if (props.touchable && state.moving) {
-        touch.move(e);
-        if (isCorrectDirection.value) {
-          move({
-            offset: delTa.value
-          });
-        }
-      }
-    };
-    const onTouchEnd = (e) => {
-      if (!props.touchable || !state.moving)
-        return;
-      const speed = delTa.value / (Date.now() - state.touchTime);
-      const isShouldMove = Math.abs(speed) > 0.3 || Math.abs(delTa.value) > +(size.value / 2).toFixed(2);
-      if (isShouldMove && isCorrectDirection.value) {
-        let pace = 0;
-        const offset = isVertical.value ? touch.offsetY.value : touch.offsetX.value;
-        if (props.loop) {
-          pace = offset > 0 ? delTa.value > 0 ? -1 : 1 : 0;
-        } else {
-          pace = -Math[delTa.value > 0 ? "ceil" : "floor"](delTa.value / size.value);
-        }
-        move({
-          pace,
-          isEmit: true
+      const o = h.value / (Date.now() - e.touchTime);
+      if ((Math.abs(o) > 0.3 || Math.abs(h.value) > +(d.value / 2).toFixed(2)) && D.value) {
+        let r = 0;
+        const m = l.value ? f.offsetY.value : f.offsetX.value;
+        n.loop ? r = m > 0 ? h.value > 0 ? -1 : 1 : 0 : r = -Math[h.value > 0 ? "ceil" : "floor"](h.value / d.value), g({
+          pace: r,
+          isEmit: !0
         });
-      } else if (delTa.value) {
-        move({ pace: 0 });
-      }
-      state.moving = false;
-      getStyle();
-      autoplay();
+      } else
+        h.value && g({ pace: 0 });
+      e.moving = !1, $(), w();
     };
-    provide("parent", {
-      props,
-      size,
-      relation
-    });
-    useExpose({
-      prev,
-      next,
-      to
-    });
-    onDeactivated(() => {
-      stopAutoPlay();
-    });
-    onBeforeUnmount(() => {
-      stopAutoPlay();
-    });
-    watch(
-      () => props.initPage,
-      (val) => {
-        nextTick(() => {
-          init(Number(val));
+    return _("parent", {
+      props: n,
+      size: d,
+      relation: U
+    }), ue({
+      prev: x,
+      next: I,
+      to: G
+    }), ee(() => {
+      y();
+    }), te(() => {
+      y();
+    }), E(
+      () => n.initPage,
+      (t) => {
+        Y(() => {
+          X(Number(t));
         });
       }
-    );
-    watch(
-      () => state.children.length,
+    ), E(
+      () => e.children.length,
       () => {
-        nextTick(() => {
-          init();
+        Y(() => {
+          X();
         });
       }
-    );
-    watch(
-      () => props.autoPlay,
-      (val) => {
-        val > 0 ? autoplay() : stopAutoPlay();
+    ), E(
+      () => n.autoPlay,
+      (t) => {
+        t > 0 ? w() : y();
       }
-    );
-    return {
-      state,
-      classes,
-      classesInner,
-      classesPagination,
-      container,
-      activePagination,
-      onTouchStart,
-      onTouchMove,
-      onTouchEnd
+    ), {
+      state: e,
+      classes: v,
+      classesInner: q,
+      classesPagination: R,
+      container: N,
+      activePagination: O,
+      onTouchStart: H,
+      onTouchMove: J,
+      onTouchEnd: K
     };
   }
 });
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("view", {
+function ve(n, c, p, N, e, f) {
+  return P(), b("view", {
     ref: "container",
-    class: normalizeClass(_ctx.classes),
-    onTouchstart: _cache[0] || (_cache[0] = (...args) => _ctx.onTouchStart && _ctx.onTouchStart(...args)),
-    onTouchmove: _cache[1] || (_cache[1] = (...args) => _ctx.onTouchMove && _ctx.onTouchMove(...args)),
-    onTouchend: _cache[2] || (_cache[2] = (...args) => _ctx.onTouchEnd && _ctx.onTouchEnd(...args)),
-    onTouchcancel: _cache[3] || (_cache[3] = (...args) => _ctx.onTouchEnd && _ctx.onTouchEnd(...args))
+    class: S(n.classes),
+    onTouchstart: c[0] || (c[0] = (...v) => n.onTouchStart && n.onTouchStart(...v)),
+    onTouchmove: c[1] || (c[1] = (...v) => n.onTouchMove && n.onTouchMove(...v)),
+    onTouchend: c[2] || (c[2] = (...v) => n.onTouchEnd && n.onTouchEnd(...v)),
+    onTouchcancel: c[3] || (c[3] = (...v) => n.onTouchEnd && n.onTouchEnd(...v))
   }, [
-    createElementVNode("view", {
-      class: normalizeClass(_ctx.classesInner),
-      style: normalizeStyle(_ctx.state.style)
+    ne("view", {
+      class: S(n.classesInner),
+      style: L(n.state.style)
     }, [
-      renderSlot(_ctx.$slots, "default")
+      j(n.$slots, "default")
     ], 6),
-    renderSlot(_ctx.$slots, "page"),
-    _ctx.paginationVisible && !_ctx.$slots.page ? (openBlock(), createElementBlock("view", {
+    j(n.$slots, "page"),
+    n.paginationVisible && !n.$slots.page ? (P(), b("view", {
       key: 0,
-      class: normalizeClass(_ctx.classesPagination)
+      class: S(n.classesPagination)
     }, [
-      (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.state.children.length, (item, index) => {
-        return openBlock(), createElementBlock("i", {
-          style: normalizeStyle({
-            backgroundColor: _ctx.activePagination === index ? _ctx.paginationColor : "#ddd"
-          }),
-          class: normalizeClass({ active: _ctx.activePagination === index }),
-          key: index
-        }, null, 6);
-      }), 128))
-    ], 2)) : createCommentVNode("", true)
+      (P(!0), b(oe, null, ae(n.state.children.length, (v, l) => (P(), b("i", {
+        style: L({
+          backgroundColor: n.activePagination === l ? n.paginationColor : "#ddd"
+        }),
+        class: S({ active: n.activePagination === l }),
+        key: l
+      }, null, 6))), 128))
+    ], 2)) : ie("", !0)
   ], 34);
 }
-const Swiper = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+const we = /* @__PURE__ */ se(fe, [["render", ve]]);
 export {
-  Swiper as default
+  we as default
 };

package/dist/packages/_es/SwiperItem.js

@@ -1,55 +1,39 @@
-import { inject, getCurrentInstance, reactive, computed, onUnmounted, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot } from "vue";
-import { c as createComponent } from "./component-81a4c1d0.js";
-import { u as useExpose } from "./index-79c5dc33.js";
-import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.js";
+import { inject as p, getCurrentInstance as c, reactive as m, computed as a, onUnmounted as u, openBlock as d, createElementBlock as $, normalizeClass as h, normalizeStyle as z, renderSlot as _ } from "vue";
+import { c as x } from "./component-234624bc.js";
+import { u as y } from "./index-fadb0974.js";
+import { _ as C } from "./_plugin-vue_export-helper-dad06003.js";
 import "../locale/lang";
-const { create, componentName } = createComponent("swiper-item");
-const _sfc_main = create({
-  setup(props, { slots }) {
-    const parent = inject("parent");
-    parent["relation"](getCurrentInstance());
-    const state = reactive({
+const { create: v, componentName: w } = x("swiper-item"), S = v({
+  setup(s, { slots: l }) {
+    const e = p("parent");
+    e.relation(c());
+    const o = m({
       offset: 0
-    });
-    const classes = computed(() => {
-      const prefixCls = componentName;
-      return {
-        [prefixCls]: true
-      };
-    });
-    const style = computed(() => {
-      const style2 = {};
-      const direction = parent == null ? void 0 : parent.props.direction;
-      if (parent == null ? void 0 : parent.size.value) {
-        style2[direction === "horizontal" ? "width" : "height"] = `${parent == null ? void 0 : parent.size.value}px`;
-      }
-      if (state.offset) {
-        style2["transform"] = `translate${direction === "horizontal" ? "X" : "Y"}(${state.offset}px)`;
-      }
-      return style2;
-    });
-    const setOffset = (offset) => {
-      state.offset = offset;
+    }), r = a(() => ({
+      [w]: !0
+    })), n = a(() => {
+      const t = {}, i = e == null ? void 0 : e.props.direction;
+      return e != null && e.size.value && (t[i === "horizontal" ? "width" : "height"] = `${e == null ? void 0 : e.size.value}px`), o.offset && (t.transform = `translate${i === "horizontal" ? "X" : "Y"}(${o.offset}px)`), t;
+    }), f = (t) => {
+      o.offset = t;
     };
-    onUnmounted(() => {
-      parent["relation"](getCurrentInstance(), "unmount");
-    });
-    useExpose({ setOffset });
-    return {
-      style,
-      classes
+    return u(() => {
+      e.relation(c(), "unmount");
+    }), y({ setOffset: f }), {
+      style: n,
+      classes: r
     };
   }
 });
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return openBlock(), createElementBlock("view", {
-    class: normalizeClass(_ctx.classes),
-    style: normalizeStyle(_ctx.style)
+function g(s, l, e, o, r, n) {
+  return d(), $("view", {
+    class: h(s.classes),
+    style: z(s.style)
   }, [
-    renderSlot(_ctx.$slots, "default")
+    _(s.$slots, "default")
   ], 6);
 }
-const SwiperItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+const N = /* @__PURE__ */ C(S, [["render", g]]);
 export {
-  SwiperItem as default
+  N as default
 };