@nutui/nutui 3.3.1 → 4.0.0-beta.0

package/dist/packages/_es/ImagePreview.js

@@ -1,26 +1,30 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
 /*!
-* @nutui/nutui v3.3.1 Fri Dec 16 2022 17:34:28 GMT+0800 (中国标准时间)
+* @nutui/nutui v4.0.0-beta.0 Mon Dec 26 2022 00:00:21 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { reactive, computed, watch, toRefs, resolveComponent, openBlock, createBlock, withCtx, createElementVNode, normalizeStyle, createElementBlock, createCommentVNode, ref, onMounted, Fragment, renderList, toDisplayString, normalizeClass, createVNode, mergeProps, h } from "vue";
-import { c as createComponent, d as clamp, a as preventDefault, l as isArray } from "./component.js";
-import { u as useRect } from "./index2.js";
-import { u as useTouch } from "./index4.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
-import { f as funInterceptor } from "./interceptor.js";
-import "../locale/lang";
-import { C as CreateComponent } from "./mountComponent.js";
-import Popup from "./Popup.js";
+import { reactive, computed, watch, toRefs, resolveComponent, openBlock, createBlock, withCtx, createElementVNode, normalizeStyle, createElementBlock, createCommentVNode, ref, onMounted, Fragment, renderList, toDisplayString, normalizeClass, renderSlot, createVNode, h } from "vue";
+import { c as createComponent, e as clamp, d as preventDefault, i as isArray } from "./component.fb9ce7ad.js";
+import { u as useRect } from "./index.af02c42d.js";
+import { u as useTouch } from "./index.983240fc.js";
 import Video from "./Video.js";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper.bf57b04e.js";
+import { CircleClose } from "@nutui/icons-vue";
+import { P as Popup } from "./index.4ed42c18.js";
 import Swiper from "./Swiper.js";
 import SwiperItem from "./SwiperItem.js";
-import _sfc_main$2 from "./Icon.js";
-import OverLay from "./OverLay.js";
-import "./props.js";
-import "./index3.js";
-import "./raf.js";
-import "./pxCheck.js";
+import { f as funInterceptor } from "./interceptor.ba45688c.js";
+import "../locale/lang";
+import { C as CreateComponent } from "./mountComponent.dddeb43c.js";
+import { _ as _sfc_main$2 } from "./index.vue_vue_type_script_lang.de4367bf.js";
+import Overlay from "./Overlay.js";
+import "./index.617ba243.js";
 const baseProps = {
   show: { type: Boolean, default: false },
   initNo: { type: Number, default: 0 },
@@ -28,7 +32,7 @@ const baseProps = {
   minZoom: { type: Number, default: 1 / 3 },
   maxZoom: { type: Number, default: 3 }
 };
-const { create: create$1 } = createComponent("imagepreviewitem");
+const { create: create$1 } = createComponent("image-preview-item");
 const _sfc_main$1 = create$1({
   props: {
     ...baseProps,
@@ -50,7 +54,9 @@ const _sfc_main$1 = create$1({
     }
   },
   emits: ["close", "scale"],
-  components: {},
+  components: {
+    [Video.name]: Video
+  },
   setup(props, { emit }) {
     const state = reactive({
       scale: 1,
@@ -252,7 +258,7 @@ function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
     default: withCtx(() => [
       createElementVNode("view", {
         style: normalizeStyle(_ctx.imageStyle),
-        class: "nut-imagepreview-box",
+        class: "nut-image-preview-box",
         onTouchstart: _cache[1] || (_cache[1] = (...args) => _ctx.onTouchStart && _ctx.onTouchStart(...args)),
         onTouchmove: _cache[2] || (_cache[2] = (...args) => _ctx.onTouchMove && _ctx.onTouchMove(...args)),
         onTouchend: _cache[3] || (_cache[3] = (...args) => _ctx.onTouchEnd && _ctx.onTouchEnd(...args)),
@@ -261,7 +267,7 @@ function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
         _ctx.image && _ctx.image.src ? (openBlock(), createElementBlock("img", {
           key: 0,
           src: _ctx.image.src,
-          class: "nut-imagepreview-img",
+          class: "nut-image-preview-img",
           onLoad: _cache[0] || (_cache[0] = (...args) => _ctx.imageLoad && _ctx.imageLoad(...args))
         }, null, 40, _hoisted_1$1)) : createCommentVNode("", true),
         _ctx.video && _ctx.video.source ? (openBlock(), createBlock(_component_nut_video, {
@@ -274,8 +280,8 @@ function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
     _: 1
   }, 8, ["onClick"]);
 }
-var ImagePreviewItem = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
-const { create } = createComponent("imagepreview");
+const ImagePreviewItem = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
+const { create } = createComponent("image-preview");
 const _sfc_main = create({
   props: {
     ...baseProps,
@@ -307,7 +313,11 @@ const _sfc_main = create({
   },
   emits: ["close", "change"],
   components: {
-    ImagePreviewItem
+    ImagePreviewItem,
+    CircleClose,
+    [Popup.name]: Popup,
+    [Swiper.name]: Swiper,
+    [SwiperItem.name]: SwiperItem
   },
   setup(props, { emit }) {
     const swipeRef = ref();
@@ -318,9 +328,9 @@ const _sfc_main = create({
       rootHeight: 0
     });
     const iconClasses = computed(() => {
-      const pre = "nut-imagepreview-close";
+      const pre = "nut-image-preview-close";
       const iconn = props.closeIconPosition == "top-right" ? `${pre}-right` : `${pre}-left`;
-      return `nut-imagepreview-close-icon ${iconn}`;
+      return `nut-image-preview-close-icon ${iconn}`;
     });
     const mergeImages = computed(() => {
       if (isArray(props.videos)) {
@@ -379,20 +389,20 @@ const _sfc_main = create({
   }
 });
 const _hoisted_1 = {
-  class: "nut-imagepreview",
+  class: "nut-image-preview",
   ref: "swipeRef"
 };
 const _hoisted_2 = {
   key: 0,
-  class: "nut-imagepreview-index"
+  class: "nut-image-preview-index"
 };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_image_preview_item = resolveComponent("image-preview-item");
   const _component_nut_swiper = resolveComponent("nut-swiper");
-  const _component_nut_icon = resolveComponent("nut-icon");
+  const _component_CircleClose = resolveComponent("CircleClose");
   const _component_nut_popup = resolveComponent("nut-popup");
   return openBlock(), createBlock(_component_nut_popup, {
-    "pop-class": "nut-imagepreview-custom-pop",
+    "pop-class": "nut-image-preview-custom-pop",
     visible: _ctx.showPop,
     "onUpdate:visible": _cache[1] || (_cache[1] = ($event) => _ctx.showPop = $event),
     teleportDisable: _ctx.teleportDisable,
@@ -405,7 +415,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         _ctx.showPop ? (openBlock(), createBlock(_component_nut_swiper, {
           key: 0,
           "auto-play": _ctx.autoplay,
-          class: "nut-imagepreview-swiper",
+          class: "nut-image-preview-swiper",
           loop: _ctx.isLoop,
           "is-preventDefault": false,
           direction: "horizontal",
@@ -439,43 +449,46 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         class: normalizeClass(_ctx.iconClasses),
         onClick: _cache[0] || (_cache[0] = (...args) => _ctx.onClose && _ctx.onClose(...args))
       }, [
-        createVNode(_component_nut_icon, mergeProps({ name: _ctx.closeIcon }, _ctx.$attrs, { color: "#ffffff" }), null, 16, ["name"])
+        renderSlot(_ctx.$slots, "close-icon", {}, () => [
+          createVNode(_component_CircleClose, { color: "#ffffff" })
+        ])
       ], 2)) : createCommentVNode("", true)
     ]),
-    _: 1
+    _: 3
   }, 8, ["visible", "teleportDisable", "teleport", "onClosed"]);
 }
-var ImagePreview = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+const ImagePreview = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 class ImagePreviewOptions {
   constructor() {
-    this.show = false;
-    this.images = [];
-    this.videos = [];
-    this.contentClose = true;
-    this.initNo = 0;
-    this.paginationVisible = false;
-    this.paginationColor = "";
-    this.autoplay = 0;
-    this.isWrapTeleport = false;
-    this.showIndex = true;
-    this.closeable = false;
-    this.closeIcon = "circle-close";
-    this.closeIconPosition = "top-right";
-    this.maxZoom = 3;
-    this.minZoom = 1 / 3;
-    this.isLoop = true;
-    this.onClose = () => {
-    };
-    this.teleport = "body";
+    __publicField(this, "show", false);
+    __publicField(this, "images", []);
+    __publicField(this, "videos", []);
+    __publicField(this, "contentClose", true);
+    __publicField(this, "initNo", 0);
+    __publicField(this, "paginationVisible", false);
+    __publicField(this, "paginationColor", "");
+    __publicField(this, "autoplay", 0);
+    __publicField(this, "isWrapTeleport", false);
+    __publicField(this, "showIndex", true);
+    __publicField(this, "closeable", false);
+    __publicField(this, "closeIcon", "circle-close");
+    __publicField(this, "closeIconPosition", "top-right");
+    __publicField(this, "beforeClose");
+    __publicField(this, "maxZoom", 3);
+    __publicField(this, "minZoom", 1 / 3);
+    __publicField(this, "isLoop", true);
+    __publicField(this, "onClose", () => {
+    });
+    __publicField(this, "teleport", "body");
   }
 }
 class ImagePreviewFunction {
   constructor(_options) {
-    this.options = new ImagePreviewOptions();
+    __publicField(this, "options", new ImagePreviewOptions());
     const options = Object.assign(this.options, _options);
     const { instance, unmount } = CreateComponent(options, {
       name: "imagepreview",
-      components: [Popup, Video, Swiper, SwiperItem, _sfc_main$2, OverLay],
+      components: [Popup, Video, Swiper, SwiperItem, _sfc_main$2, Overlay],
       wrapper: () => {
         return {
           setup() {
@@ -496,4 +509,8 @@ _ImagePreview.install = (app) => {
   app.use(ImagePreview);
   app.config.globalProperties.$imagepreview = _ImagePreview;
 };
-export { ImagePreview, ImagePreviewOptions, _ImagePreview as default };
+export {
+  ImagePreview,
+  ImagePreviewOptions,
+  _ImagePreview as default
+};

package/dist/packages/_es/Indicator.js

@@ -1,11 +1,11 @@
 /*!
-* @nutui/nutui v3.3.1 Fri Dec 16 2022 17:34:28 GMT+0800 (中国标准时间)
+* @nutui/nutui v4.0.0-beta.0 Mon Dec 26 2022 00:00:21 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
 import { toRefs, computed, openBlock, createElementBlock, normalizeClass, Fragment, renderList, toDisplayString } from "vue";
-import { p as padZero, c as createComponent } from "./component.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import { p as padZero, c as createComponent } from "./component.fb9ce7ad.js";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper.bf57b04e.js";
 import "../locale/lang";
 const { componentName, create } = createComponent("indicator");
 const _sfc_main = create({
@@ -63,5 +63,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }), 128))
   ], 2);
 }
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export {
+  index as default
+};

package/dist/packages/_es/InfiniteLoading.js

@@ -1,17 +1,22 @@
 /*!
-* @nutui/nutui v3.3.1 Fri Dec 16 2022 17:34:28 GMT+0800 (中国标准时间)
+* @nutui/nutui v4.0.0-beta.0 Mon Dec 26 2022 00:00:21 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, mergeProps, toDisplayString, renderSlot, createCommentVNode } from "vue";
-import { c as createComponent, g as getScrollTopRoot } from "./component.js";
-import { u as useTouch } from "./index4.js";
-import { r as requestAniFrame } from "./raf.js";
-import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
+import { ref, reactive, computed, onMounted, onUnmounted, onActivated, onDeactivated, watch, toRefs, nextTick, resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, createVNode, toDisplayString, createCommentVNode } from "vue";
+import { c as createComponent, l as getScrollTopRoot } from "./component.fb9ce7ad.js";
+import { u as useScrollParent } from "./index.1be0d1a5.js";
+import { r as requestAniFrame } from "./raf.42b42f63.js";
+import { Loading } from "@nutui/icons-vue";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper.bf57b04e.js";
 import "../locale/lang";
-const { componentName, create, translate } = createComponent("infiniteloading");
+const { componentName, create, translate } = createComponent("infinite-loading");
 const _sfc_main = create({
   props: {
+    modelValue: {
+      type: Boolean,
+      default: false
+    },
     hasMore: {
       type: Boolean,
       default: true
@@ -20,18 +25,6 @@ const _sfc_main = create({
       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: ""
@@ -51,23 +44,18 @@ const _sfc_main = create({
     useCapture: {
       type: Boolean,
       default: false
-    },
-    isOpenRefresh: {
-      type: Boolean,
-      default: false
     }
   },
-  emits: ["scroll-change", "load-more", "refresh"],
+  emits: ["scroll-change", "load-more", "update:modelValue"],
+  components: {
+    Loading
+  },
   setup(props, { emit, slots }) {
-    const touch = useTouch();
+    const scroller = ref();
+    const scrollParent = useScrollParent(scroller);
     const state = reactive({
-      scrollEl: window,
-      scroller: null,
-      refreshTop: null,
       beforeScrollTop: 0,
-      isTouching: false,
       isInfiniting: false,
-      refreshMaxH: 0,
       y: 0,
       x: 0,
       distance: 0
@@ -78,12 +66,6 @@ const _sfc_main = create({
         [prefixCls]: true
       };
     });
-    const getStyle = computed(() => {
-      return {
-        height: state.distance < 0 ? `0px` : `${state.distance}px`,
-        transitionDuration: state.isTouching ? 0 : `0.2s`
-      };
-    });
     const calculateTopPosition = (el) => {
       return !el ? 0 : el.offsetTop + calculateTopPosition(el.offsetParent);
     };
@@ -91,14 +73,14 @@ const _sfc_main = create({
       let offsetDistance = 0;
       let resScrollTop = 0;
       let direction = "down";
-      if (props.useWindow) {
+      if (scrollParent.value == window) {
         const windowScrollTop = getScrollTopRoot();
-        if (state.scroller) {
-          offsetDistance = calculateTopPosition(state.scroller) + state.scroller.offsetHeight - windowScrollTop - window.innerHeight;
+        if (scroller.value) {
+          offsetDistance = calculateTopPosition(scroller.value) + scroller.value.offsetHeight - windowScrollTop - window.innerHeight;
         }
         resScrollTop = windowScrollTop;
       } else {
-        const { scrollHeight, clientHeight, scrollTop } = state.scrollEl;
+        const { scrollHeight, clientHeight, scrollTop } = scrollParent.value;
         offsetDistance = scrollHeight - clientHeight - scrollTop;
         resScrollTop = scrollTop;
       }
@@ -111,68 +93,24 @@ const _sfc_main = create({
       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);
+          emit("update:modelValue", true);
+          nextTick(() => emit("load-more"));
         }
       });
     };
     const scrollListener = () => {
-      state.scrollEl.addEventListener("scroll", handleScroll, props.useCapture);
-    };
-    const refreshDone = () => {
-      state.distance = 0;
-      state.isTouching = false;
-    };
-    const touchStart = (event) => {
-      touch.start(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) => {
-      touch.move(event);
-      state.distance = event.touches[0].pageY - state.y;
-      if (touch.isVertical() && 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);
-        }
-      }
-      setTimeout(() => {
-        touch.reset();
-      }, 0);
-    };
-    const getParentElement = (el) => {
-      return !!props.containerId ? document.querySelector(`#${props.containerId}`) : el && el.parentNode;
+      scrollParent.value && scrollParent.value.addEventListener("scroll", handleScroll, props.useCapture);
     };
     const removeScrollListener = () => {
-      state.scrollEl.removeEventListener("scroll", handleScroll, props.useCapture);
+      scrollParent.value && scrollParent.value.removeEventListener("scroll", handleScroll, props.useCapture);
     };
     onMounted(() => {
-      const parentElement = getParentElement(state.scroller);
-      state.scrollEl = props.useWindow ? window : parentElement;
       scrollListener();
     });
     onUnmounted(() => {
@@ -189,61 +127,55 @@ const _sfc_main = create({
       isKeepAlive.value = true;
       removeScrollListener();
     });
+    watch(
+      () => props.modelValue,
+      (val) => {
+        if (!val) {
+          state.isInfiniting = false;
+        }
+      }
+    );
     return {
       classes,
+      scroller,
       ...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 = {
+const _hoisted_1 = { class: "nut-infinite__container" };
+const _hoisted_2 = { class: "nut-infinite__bottom" };
+const _hoisted_3 = {
   key: 0,
-  class: "bottom-box"
+  class: "nut-infinite__bottom-box"
 };
-const _hoisted_6 = { class: "bottom-text" };
-const _hoisted_7 = { class: "tips" };
+const _hoisted_4 = { class: "nut-infinite__bottom-box__text" };
+const _hoisted_5 = { class: "nut-infinite__bottom-tips" };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_nut_icon = resolveComponent("nut-icon");
+  const _component_Loading = resolveComponent("Loading");
   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))
+    ref: "scroller"
   }, [
-    createElementVNode("view", {
-      class: "nut-infinite-top",
-      ref: "refreshTop",
-      style: normalizeStyle(_ctx.getStyle)
-    }, [
-      createElementVNode("view", _hoisted_1, [
-        createVNode(_component_nut_icon, mergeProps({ class: "top-img" }, _ctx.$attrs, { name: _ctx.pullIcon }), null, 16, ["name"]),
-        createElementVNode("view", _hoisted_2, toDisplayString(_ctx.pullTxt || _ctx.translate("pullTxt")), 1)
-      ])
-    ], 4),
-    createElementVNode("view", _hoisted_3, [
+    createElementVNode("view", _hoisted_1, [
       renderSlot(_ctx.$slots, "default")
     ]),
-    createElementVNode("view", _hoisted_4, [
-      _ctx.isInfiniting ? (openBlock(), createElementBlock("view", _hoisted_5, [
+    createElementVNode("view", _hoisted_2, [
+      _ctx.isInfiniting ? (openBlock(), createElementBlock("view", _hoisted_3, [
         renderSlot(_ctx.$slots, "loading", {}, () => [
-          createVNode(_component_nut_icon, mergeProps({ class: "bottom-img" }, _ctx.$attrs, { name: _ctx.loadIcon }), null, 16, ["name"]),
-          createElementVNode("view", _hoisted_6, toDisplayString(_ctx.loadTxt || _ctx.translate("loading")), 1)
+          renderSlot(_ctx.$slots, "loadIcon", {}, () => [
+            createVNode(_component_Loading, { class: "nut-icon-loading nut-infinite__bottom-box__img" })
+          ]),
+          createElementVNode("view", _hoisted_4, toDisplayString(_ctx.loadTxt || _ctx.translate("loading")), 1)
         ])
       ])) : !_ctx.hasMore ? renderSlot(_ctx.$slots, "finished", { key: 1 }, () => [
-        createElementVNode("view", _hoisted_7, toDisplayString(_ctx.loadMoreTxt || _ctx.translate("loadMoreTxt")), 1)
+        createElementVNode("view", _hoisted_5, toDisplayString(_ctx.loadMoreTxt || _ctx.translate("loadMoreTxt")), 1)
       ]) : createCommentVNode("", true)
     ])
-  ], 34);
+  ], 2);
 }
-var index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
-export { index as default };
+const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+export {
+  index as default
+};