@nutui/nutui 4.1.0-beta.6 → 4.1.1

package/dist/packages/_es/Uploader.js

@@ -4,7 +4,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { reactive, computed, h, resolveComponent, openBlock, createElementBlock, normalizeClass, renderSlot, createBlock, resolveDynamicComponent, createCommentVNode, Fragment, renderList, createElementVNode, toDisplayString, createVNode } from "vue";
+import { ref, watch, h, reactive, resolveComponent, openBlock, createElementBlock, renderSlot, createBlock, resolveDynamicComponent, createCommentVNode, Fragment, renderList, normalizeClass, createElementVNode, toDisplayString, createVNode } from "vue";
 import { c as createComponent } from "./component-0fbad28e.js";
 import { f as funInterceptor } from "./Interceptor-c05a39f2.js";
 import Progress from "./Progress.js";
@@ -90,7 +90,7 @@ class FileItem {
     __publicField(this, "formData", {});
   }
 }
-const { componentName, create, translate } = createComponent("uploader");
+const { create, translate } = createComponent("uploader");
 const _sfc_main = create({
   components: {
     [Progress.name]: Progress,
@@ -151,14 +151,14 @@ const _sfc_main = create({
     "file-item-click"
   ],
   setup(props, { emit }) {
-    const fileList = reactive(props.fileList);
-    let uploadQueue = [];
-    const classes = computed(() => {
-      const prefixCls = componentName;
-      return {
-        [prefixCls]: true
-      };
-    });
+    const fileList = ref(props.fileList);
+    const uploadQueue = ref([]);
+    watch(
+      () => props.fileList,
+      () => {
+        fileList.value = props.fileList;
+      }
+    );
     const renderInput = () => {
       let params = {
         class: `nut-uploader__input`,
@@ -213,7 +213,7 @@ const _sfc_main = create({
           option,
           fileItem
         });
-        emit("update:fileList", fileList);
+        emit("update:fileList", fileList.value);
       };
       uploadOption.onFailure = (responseText, option) => {
         fileItem.status = "error";
@@ -228,7 +228,7 @@ const _sfc_main = create({
       if (props.autoUpload) {
         task.upload();
       } else {
-        uploadQueue.push(
+        uploadQueue.value.push(
           new Promise((resolve) => {
             resolve(task);
           })
@@ -237,14 +237,15 @@ const _sfc_main = create({
     };
     const clearUploadQueue = (index2 = -1) => {
       if (index2 > -1) {
-        uploadQueue.splice(index2, 1);
+        uploadQueue.value.splice(index2, 1);
       } else {
-        uploadQueue = [];
-        fileList.splice(0, fileList.length);
+        uploadQueue.value = [];
+        fileList.value = [];
+        emit("update:fileList", fileList.value);
       }
     };
     const submit = () => {
-      Promise.all(uploadQueue).then((res) => {
+      Promise.all(uploadQueue.value).then((res) => {
         res.forEach((i) => i.upload());
       });
     };
@@ -266,11 +267,11 @@ const _sfc_main = create({
           const reader = new FileReader();
           reader.onload = (event) => {
             fileItem.url = event.target.result;
-            fileList.push(fileItem);
+            fileList.value.push(fileItem);
           };
           reader.readAsDataURL(file);
         } else {
-          fileList.push(fileItem);
+          fileList.value.push(fileItem);
         }
       });
     };
@@ -289,24 +290,24 @@ const _sfc_main = create({
       if (oversizes.length) {
         emit("oversize", oversizes);
       }
-      let currentFileLength = files.length + fileList.length;
+      let currentFileLength = files.length + fileList.value.length;
       if (currentFileLength > maximum) {
         files.splice(files.length - (currentFileLength - maximum));
       }
       return files;
     };
     const deleted = (file, index2) => {
-      fileList.splice(index2, 1);
+      fileList.value.splice(index2, 1);
       emit("delete", {
         file,
-        fileList,
+        fileList: fileList.value,
         index: index2
       });
     };
     const onDelete = (file, index2) => {
       clearUploadQueue(index2);
       funInterceptor(props.beforeDelete, {
-        args: [file, fileList],
+        args: [file, fileList.value],
         done: () => deleted(file, index2)
       });
     };
@@ -322,7 +323,7 @@ const _sfc_main = create({
         changeReadFile(files);
       }
       emit("change", {
-        fileList,
+        fileList: fileList.value,
         event
       });
       if (props.clearInput) {
@@ -337,7 +338,6 @@ const _sfc_main = create({
       onChange,
       onDelete,
       fileList,
-      classes,
       fileItemClick,
       clearUploadQueue,
       submit,
@@ -345,34 +345,35 @@ const _sfc_main = create({
     };
   }
 });
-const _hoisted_1 = {
+const _hoisted_1 = { class: "nut-uploader" };
+const _hoisted_2 = {
   key: 0,
   class: "nut-uploader__slot"
 };
-const _hoisted_2 = {
+const _hoisted_3 = {
   key: 0,
   class: "nut-uploader__preview-img"
 };
-const _hoisted_3 = {
+const _hoisted_4 = {
   key: 0,
   class: "nut-uploader__preview__progress"
 };
-const _hoisted_4 = { class: "nut-uploader__preview__progress__msg" };
-const _hoisted_5 = ["onClick"];
-const _hoisted_6 = ["onClick", "src"];
-const _hoisted_7 = {
+const _hoisted_5 = { class: "nut-uploader__preview__progress__msg" };
+const _hoisted_6 = ["onClick"];
+const _hoisted_7 = ["onClick", "src"];
+const _hoisted_8 = {
   key: 3,
   class: "nut-uploader__preview-img__file"
 };
-const _hoisted_8 = ["onClick"];
-const _hoisted_9 = { class: "file__name_tips" };
-const _hoisted_10 = { class: "tips" };
-const _hoisted_11 = {
+const _hoisted_9 = ["onClick"];
+const _hoisted_10 = { class: "file__name_tips" };
+const _hoisted_11 = { class: "tips" };
+const _hoisted_12 = {
   key: 1,
   class: "nut-uploader__preview-list"
 };
-const _hoisted_12 = ["onClick"];
-const _hoisted_13 = { class: "file__name_tips" };
+const _hoisted_13 = ["onClick"];
+const _hoisted_14 = { class: "file__name_tips" };
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_Failure = resolveComponent("Failure");
   const _component_Loading = resolveComponent("Loading");
@@ -380,10 +381,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_Del = resolveComponent("Del");
   const _component_nut_progress = resolveComponent("nut-progress");
   const _component_Photograph = resolveComponent("Photograph");
-  return openBlock(), createElementBlock("view", {
-    class: normalizeClass(_ctx.classes)
-  }, [
-    _ctx.$slots.default ? (openBlock(), createElementBlock("view", _hoisted_1, [
+  return openBlock(), createElementBlock("view", _hoisted_1, [
+    _ctx.$slots.default ? (openBlock(), createElementBlock("view", _hoisted_2, [
       renderSlot(_ctx.$slots, "default"),
       Number(_ctx.maximum) - _ctx.fileList.length ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.renderInput), {
         key: 0,
@@ -396,8 +395,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         class: normalizeClass(["nut-uploader__preview", [_ctx.listType]]),
         key: item.uid
       }, [
-        _ctx.listType == "picture" && !_ctx.$slots.default ? (openBlock(), createElementBlock("view", _hoisted_2, [
-          item.status != "success" ? (openBlock(), createElementBlock("view", _hoisted_3, [
+        _ctx.listType == "picture" && !_ctx.$slots.default ? (openBlock(), createElementBlock("view", _hoisted_3, [
+          item.status != "success" ? (openBlock(), createElementBlock("view", _hoisted_4, [
             item.status != "ready" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
               item.status == "error" ? (openBlock(), createBlock(_component_Failure, {
                 key: 0,
@@ -408,7 +407,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                 color: "#fff"
               }))
             ], 64)) : createCommentVNode("", true),
-            createElementVNode("view", _hoisted_4, toDisplayString(item.message), 1)
+            createElementVNode("view", _hoisted_5, toDisplayString(item.message), 1)
           ])) : createCommentVNode("", true),
           _ctx.isDeletable ? (openBlock(), createElementBlock("view", {
             key: 1,
@@ -418,35 +417,35 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
             renderSlot(_ctx.$slots, "delete-icon", {}, () => [
               createVNode(_component_Failure)
             ])
-          ], 8, _hoisted_5)) : createCommentVNode("", true),
+          ], 8, _hoisted_6)) : createCommentVNode("", true),
           ((_a = item == null ? void 0 : item.type) == null ? void 0 : _a.includes("image")) && item.url ? (openBlock(), createElementBlock("img", {
             key: 2,
             class: "nut-uploader__preview-img__c",
             onClick: ($event) => _ctx.fileItemClick(item),
             src: item.url
-          }, null, 8, _hoisted_6)) : (openBlock(), createElementBlock("view", _hoisted_7, [
+          }, null, 8, _hoisted_7)) : (openBlock(), createElementBlock("view", _hoisted_8, [
             createElementVNode("view", {
               onClick: ($event) => _ctx.fileItemClick(item),
               class: "nut-uploader__preview-img__file__name"
             }, [
-              createElementVNode("view", _hoisted_9, toDisplayString(item.name), 1)
-            ], 8, _hoisted_8)
+              createElementVNode("view", _hoisted_10, toDisplayString(item.name), 1)
+            ], 8, _hoisted_9)
           ])),
-          createElementVNode("view", _hoisted_10, toDisplayString(item.name), 1)
-        ])) : _ctx.listType == "list" ? (openBlock(), createElementBlock("view", _hoisted_11, [
+          createElementVNode("view", _hoisted_11, toDisplayString(item.name), 1)
+        ])) : _ctx.listType == "list" ? (openBlock(), createElementBlock("view", _hoisted_12, [
           createElementVNode("view", {
             onClick: ($event) => _ctx.fileItemClick(item),
             class: normalizeClass(["nut-uploader__preview-img__file__name", [item.status]])
           }, [
             createVNode(_component_Link, { class: "nut-uploader__preview-img__file__link" }),
-            createElementVNode("view", _hoisted_13, toDisplayString(item.name), 1),
+            createElementVNode("view", _hoisted_14, toDisplayString(item.name), 1),
             _ctx.isDeletable ? (openBlock(), createBlock(_component_Del, {
               key: 0,
               color: "#808080",
               class: "nut-uploader__preview-img__file__del",
               onClick: ($event) => _ctx.onDelete(item, index2)
             }, null, 8, ["onClick"])) : createCommentVNode("", true)
-          ], 10, _hoisted_12),
+          ], 10, _hoisted_13),
           item.status == "uploading" ? (openBlock(), createBlock(_component_nut_progress, {
             key: 0,
             size: "small",
@@ -466,7 +465,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       ]),
       (openBlock(), createBlock(resolveDynamicComponent(_ctx.renderInput), { onChange: _ctx.onChange }, null, 40, ["onChange"]))
     ], 2)) : createCommentVNode("", true)
-  ], 2);
+  ]);
 }
 const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {

package/dist/packages/button/index.scss

@@ -59,41 +59,48 @@
   &--default {
     color: $button-default-color;
     background: $button-default-bg-color;
+    background-origin: border-box;
     border: $button-border-width solid $button-default-border-color;
   }
 
   &--primary {
     color: $button-primary-color;
     background: $button-primary-background-color;
+    background-origin: border-box;
     border: $button-border-width solid transparent;
   }
 
   &--info {
     color: $button-info-color;
     background: $button-info-background-color;
+    background-origin: border-box;
     border: $button-border-width solid transparent;
   }
 
   &--success {
     color: $button-success-color;
     background: $button-success-background-color;
+    background-origin: border-box;
     border: $button-border-width solid transparent;
   }
 
   &--danger {
     color: $button-danger-color;
     background: $button-danger-background-color;
+    background-origin: border-box;
     border: $button-border-width solid transparent;
   }
 
   &--warning {
     color: $button-warning-color;
     background: $button-warning-background-color;
+    background-origin: border-box;
     border: $button-border-width solid transparent;
   }
 
   &--plain {
     background: $button-plain-background-color;
+    background-origin: border-box;
 
     &.nut-button--primary {
       color: $button-primary-border-color;
@@ -176,39 +183,46 @@
 .nut-button--default:not([disabled]):active {
   color: $button-default-color;
   background: $button-default-bg-color;
+  background-origin: border-box;
   border: $button-border-width solid $button-default-border-color;
 }
 .nut-button--primary:not([disabled]):active {
   color: $button-primary-color;
   background: $button-primary-background-color;
+  background-origin: border-box;
   border: $button-border-width solid transparent;
 }
 
 .nut-button--info:not([disabled]):active {
   color: $button-info-color;
   background: $button-info-background-color;
+  background-origin: border-box;
   border: $button-border-width solid transparent;
 }
 
 .nut-button--success:not([disabled]):active {
   color: $button-success-color;
   background: $button-success-background-color;
+  background-origin: border-box;
   border: $button-border-width solid transparent;
 }
 
 .nut-button--danger:not([disabled]):active {
   color: $button-danger-color;
   background: $button-danger-background-color;
+  background-origin: border-box;
   border: $button-border-width solid transparent;
 }
 
 .nut-button--warning:not([disabled]):active {
   color: $button-warning-color;
   background: $button-warning-background-color;
+  background-origin: border-box;
   border: $button-border-width solid transparent;
 }
 .nut-button--plain:not([disabled]):active {
   background: $button-plain-background-color;
+  background-origin: border-box;
 }
 .nut-button--plain {
   &.nut-button--primary:not([disabled]):active {

package/dist/packages/navbar/index.scss

@@ -33,6 +33,7 @@
     width: 100%;
   }
   &--placeholder {
+    display: block;
     width: 100%;
   }
   &--safe-area-inset-top {

package/dist/packages/progress/index.scss

@@ -2,6 +2,7 @@
   width: 100%;
   position: relative;
   display: flex;
+  align-items: center;
   .nut-progress-outer {
     flex: 1;
     background-color: $progress-outer-background-color;
@@ -22,6 +23,11 @@
       justify-content: center;
       color: #fff;
     }
+    .nut-progress-slot {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
     .nut-active {
       &:before {
         content: '';

package/dist/packages/swipe/index.scss

@@ -1,6 +1,7 @@
 .nut-swipe {
   position: relative;
   display: block;
+  cursor: grab;
   transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);
   &__left,
   &__right {

package/dist/packages/swipegroup/index.mjs

@@ -0,0 +1,4 @@
+import _SwipeGroup from '../_es/SwipeGroup.js';
+const treeshaking = (t) => t;
+const SwipeGroup = treeshaking(_SwipeGroup);
+export { SwipeGroup };

package/dist/packages/swipegroup/style.mjs

@@ -0,0 +1,2 @@
+import '../../styles/reset.css';
+import './index.scss';