snail.vue 2.0.22 → 2.0.24

package/dist/snail.vue.umd.js

@@ -143,7 +143,7 @@
   const _hoisted_1$m = ["title", "onClick"];
   const _hoisted_2$e = ["type", "checked"];
   const _hoisted_3$9 = ["textContent"];
-  const _hoisted_4$7 = ["textContent"];
+  const _hoisted_4$6 = ["textContent"];
   var _sfc_main$D = vue.defineComponent({
     ...{
       name: "Choose",
@@ -236,7 +236,7 @@
             key: 3,
             class: "item-des",
             textContent: vue.toDisplayString(node.item.description)
-          }, null, 8, _hoisted_4$7)) : vue.createCommentVNode("", true)], 14, _hoisted_1$m);
+          }, null, 8, _hoisted_4$6)) : vue.createCommentVNode("", true)], 14, _hoisted_1$m);
         }), 128))], 2);
       };
     }
@@ -352,8 +352,8 @@
   const _hoisted_3$8 = {
     class: "input-body"
   };
-  const _hoisted_4$6 = ["type", "value", "readonly", "placeholder", "title"];
-  const _hoisted_5$4 = ["title"];
+  const _hoisted_4$5 = ["type", "value", "readonly", "placeholder", "title"];
+  const _hoisted_5$3 = ["title"];
   var _sfc_main$A = vue.defineComponent({
     ...{
       name: "Input",
@@ -415,7 +415,7 @@
           title: inputModel.value,
           onChange: onValueChange,
           onClick: _cache[0] || (_cache[0] = $event => emits("click"))
-        }, null, 40, _hoisted_4$6), !!validateRef.value ? (vue.openBlock(), vue.createElementBlock("span", {
+        }, null, 40, _hoisted_4$5), !!validateRef.value ? (vue.openBlock(), vue.createElementBlock("span", {
           key: 0,
           class: "validate",
           title: validateRef.value
@@ -424,7 +424,7 @@
           button: "",
           size: 16,
           color: "red"
-        })], 8, _hoisted_5$4)) : vue.createCommentVNode("", true)])], 2);
+        })], 8, _hoisted_5$3)) : vue.createCommentVNode("", true)])], 2);
       };
     }
   });
@@ -635,11 +635,11 @@
   };
   const _hoisted_2$c = ["textContent"];
   const _hoisted_3$7 = ["inputmode", "placeholder", "title"];
-  const _hoisted_4$5 = {
+  const _hoisted_4$4 = {
     key: 1,
     class: "number-suffix"
   };
-  const _hoisted_5$3 = ["textContent"];
+  const _hoisted_5$2 = ["textContent"];
   const _hoisted_6$2 = ["title", "textContent"];
   const _hoisted_7$1 = ["title", "textContent"];
   var _sfc_main$z = vue.defineComponent({
@@ -838,10 +838,10 @@
           button: "",
           size: 20,
           rotate: 90
-        })])], 64)) : vue.createCommentVNode("", true)], 2), vue.unref(hasSuffix) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$5, [vue.createElementVNode("span", {
+        })])], 64)) : vue.createCommentVNode("", true)], 2), vue.unref(hasSuffix) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$4, [vue.createElementVNode("span", {
           class: "ellipsis",
           textContent: vue.toDisplayString(vue.unref(suffix))
-        }, null, 8, _hoisted_5$3)])) : vue.createCommentVNode("", true), vue.unref(upper) ? (vue.openBlock(), vue.createElementBlock("div", {
+        }, null, 8, _hoisted_5$2)])) : vue.createCommentVNode("", true), vue.unref(upper) ? (vue.openBlock(), vue.createElementBlock("div", {
           key: 2,
           class: "number-util ellipsis",
           title: upperTextRef.value,
@@ -1408,7 +1408,153 @@
     }
   });
 
+  function monitScroll(manager, root, options, emiter, classStyleRef) {
+    const scope = snail_core.useScope();
+    let preStatus = void 0;
+    const observer = snail_view.useObserver();
+    const timer = snail_core.useTimer();
+    const reactive = useReactive();
+    function buildClassStyle() {
+      const array = (classStyleRef.value ? [...classStyleRef.value] : []).filter(item => item == "x-bar" || item == "y-bar");
+      array.push(...manager.buildClassStyle(options));
+      classStyleRef.value = array;
+    }
+    function refreshScrollInfo() {
+      const status = Object.freeze(manager.getStatus(root));
+      const events = Object.create(null);
+      if (preStatus != void 0) {
+        preStatus.xbar != status.xbar && (events.xbar = [status.xbar]);
+        preStatus.ybar != status.ybar && (events.ybar = [status.ybar]);
+        if (preStatus.xbar == true && status.xbar == true) {
+          status.left && preStatus.left !== status.left && (events.left = []);
+          status.right && preStatus.right !== status.right && (events.right = []);
+        }
+        if (preStatus.ybar == true && status.ybar == true) {
+          status.top && preStatus.top !== status.top && (events.top = []);
+          status.bottom && preStatus.bottom !== status.bottom && (events.bottom = []);
+        }
+      }
+      preStatus = status;
+      events.xbar && emiter("xbar", ...events.xbar);
+      events.left && emiter("left");
+      events.right && emiter("right");
+      events.ybar && emiter("ybar", ...events.ybar);
+      events.top && emiter("top");
+      events.bottom && emiter("bottom");
+      {
+        const array = (classStyleRef.value ? [...classStyleRef.value] : []).filter(item => item != "x-bar" && item != "y-bar");
+        status.xbar && array.push("x-bar");
+        status.ybar && array.push("y-bar");
+        classStyleRef.value = array;
+      }
+    }
+    buildClassStyle();
+    refreshScrollInfo();
+    reactive.watcher(() => options.scroll, buildClassStyle);
+    reactive.watcher(() => options.barSize, buildClassStyle);
+    observer.onSize(root, refreshScrollInfo);
+    observer.onEvent(root, "scroll", refreshScrollInfo);
+    timer.onInterval(() => {
+      const isChange = preStatus.scrollWidth != root.scrollWidth || preStatus.scrollHeight != root.scrollHeight;
+      isChange && refreshScrollInfo();
+    }, 100);
+    scope.onDestroy(() => {
+      observer.destroyed || observer.destroy();
+      timer.destroyed || timer.destroy();
+      reactive.destroyed || reactive.destroy();
+    });
+    return scope;
+  }
+
   var _sfc_main$t = vue.defineComponent({
+    ...{
+      name: "Scroll",
+      inheritAttrs: false
+    },
+    __name: "scroll",
+    props: {
+      scroll: {},
+      barSize: {}
+    },
+    emits: ["xbar", "left", "right", "ybar", "top", "bottom"],
+    setup(__props, _ref) {
+      let {
+        expose: __expose,
+        emit: __emit
+      } = _ref;
+      const props = __props;
+      const emits = __emit;
+      const rootDom = vue.useTemplateRef("scroll-root");
+      const manager = snail_view.useScroll();
+      const classStyleRef = vue.shallowRef();
+      __expose({
+        getStatus() {
+          return manager.getStatus(rootDom.value);
+        },
+        scroll(left, top) {
+          left == void 0 || (rootDom.value.scrollLeft += left);
+          top == void 0 || (rootDom.value.scrollTop += top);
+        },
+        scrollTo(left, top) {
+          left == void 0 || (rootDom.value.scrollLeft = left);
+          top == void 0 || (rootDom.value.scrollTop = top);
+        }
+      });
+      vue.onMounted(() => monitScroll(manager, rootDom.value, props, emits, classStyleRef));
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps(_ctx.$attrs, {
+          class: ["snail-scroll", classStyleRef.value],
+          ref: "scroll-root"
+        }), [vue.renderSlot(_ctx.$slots, "default")], 16);
+      };
+    }
+  });
+
+  var _sfc_main$s = vue.defineComponent({
+    __name: "wrapper",
+    props: {
+      inPopup: {
+        type: Boolean
+      },
+      header: {},
+      content: {},
+      footer: {}
+    },
+    emits: ["cancel", "confirm"],
+    setup(__props, _ref) {
+      let {
+        emit: __emit
+      } = _ref;
+      const emits = __emit;
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          class: vue.normalizeClass(["snail-wrapper", __props.inPopup ? "in-popup" : "in-normal"])
+        }, [__props.header && __props.header.disabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$B, vue.mergeProps({
+          key: 0
+        }, __props.header || {
+          useTo: "dialog",
+          title: "对话框"
+        }, {
+          "use-to": (__props.header ? __props.header.useTo : void 0) || (__props.inPopup ? "dialog" : "page"),
+          onClose: _cache[0] || (_cache[0] = $event => emits("cancel"))
+        }), null, 16, ["use-to"])) : vue.createCommentVNode("", true), vue.createVNode(_sfc_main$t, vue.mergeProps({
+          class: "wrapper-body"
+        }, __props.content || {
+          scroll: "none"
+        }), {
+          default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "default")]),
+          _: 3
+        }, 16), __props.footer && __props.footer.disabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$C, vue.mergeProps({
+          key: 1
+        }, __props.footer || {}, {
+          onCancel: _cache[1] || (_cache[1] = $event => emits("cancel")),
+          onConfirm: _cache[2] || (_cache[2] = $event => emits("confirm"))
+        }), null, 16)) : vue.createCommentVNode("", true)], 2);
+      };
+    }
+  });
+
+  var _sfc_main$r = vue.defineComponent({
     ...{
       name: "DialogContainer",
       inheritAttrs: true
@@ -1439,6 +1585,23 @@
         closePopup,
         onBeforeClose
       });
+      let fn_onBuildData = void 0;
+      const registerBuildDataFunc = fn => {
+        snail_core.mustFunction(fn, "fn");
+        fn_onBuildData = fn;
+      };
+      async function onWrapperConfirm() {
+        if (fn_onBuildData != void 0) {
+          const rt = (await snail_core.wait(fn_onBuildData())) || {
+            success: true,
+            data: void 0
+          };
+          console.log("onBuildData result：", rt);
+          rt.success !== false && closePopup(rt.data);
+        } else {
+          closePopup();
+        }
+      }
       vue.onMounted(() => {
         onEvent(window, "keyup", event => {
           event.key === "Escape" && __props.popupStatus.value == "active" && __props.options.closeOnEscape && closePopup();
@@ -1450,10 +1613,11 @@
           style: vue.normalizeStyle({
             "z-index": __props.zIndex
           }),
-          onClick: _cache[1] || (_cache[1] = vue.withModifiers($event => {
+          onClick: _cache[3] || (_cache[3] = vue.withModifiers($event => {
             __props.options.closeOnMask && vue.unref(closePopup)();
           }, ["self"]))
-        }, [vue.createVNode(_sfc_main$u, vue.mergeProps({
+        }, [__props.options.wrapper == void 0 ? (vue.openBlock(), vue.createBlock(_sfc_main$u, vue.mergeProps({
+          key: 0,
           class: "dialog-body",
           name: __props.options.name,
           component: __props.options.component,
@@ -1463,12 +1627,32 @@
           "popup-status": __props.popupStatus.value,
           modelValue: vue.unref(model),
           "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => vue.isRef(model) ? model.value = $event : null)
-        }), null, 16, ["name", "component", "url", "props", "popup-status", "modelValue"])], 6);
+        }), null, 16, ["name", "component", "url", "props", "popup-status", "modelValue"])) : (vue.openBlock(), vue.createBlock(_sfc_main$s, vue.mergeProps({
+          key: 1,
+          class: "dialog-body",
+          "in-popup": true
+        }, __props.options.wrapper, {
+          onCancel: _cache[2] || (_cache[2] = $event => vue.unref(closePopup)()),
+          onConfirm: onWrapperConfirm
+        }), {
+          default: vue.withCtx(() => [vue.createVNode(_sfc_main$u, vue.mergeProps({
+            name: __props.options.name,
+            component: __props.options.component,
+            url: __props.options.url,
+            props: vue.unref(props)
+          }, vue.unref(dialogExtend), {
+            "popup-status": __props.popupStatus.value,
+            modelValue: vue.unref(model),
+            "onUpdate:modelValue": _cache[1] || (_cache[1] = $event => vue.isRef(model) ? model.value = $event : null),
+            "on-build-data": registerBuildDataFunc
+          }), null, 16, ["name", "component", "url", "props", "popup-status", "modelValue"])]),
+          _: 1
+        }, 16))], 6);
       };
     }
   });
 
-  var _sfc_main$s = vue.defineComponent({
+  var _sfc_main$q = vue.defineComponent({
     ...{
       name: "FollowContainer",
       inheritAttrs: true
@@ -1606,7 +1790,7 @@
     }
   });
 
-  var _sfc_main$r = vue.defineComponent({
+  var _sfc_main$p = vue.defineComponent({
     ...{
       name: "PopupContainer",
       inheritAttrs: true
@@ -1649,7 +1833,7 @@
     class: "icon"
   };
   const _hoisted_2$a = ["innerHTML"];
-  var _sfc_main$q = vue.defineComponent({
+  var _sfc_main$o = vue.defineComponent({
     ...{
       name: "ToastContainer",
       inheritAttrs: true
@@ -1711,7 +1895,7 @@
 
   function usePopup() {
     function popup(options) {
-      const scope = checkOptions(options, checkPopup) || popupInCustomContainer(_sfc_main$r, options);
+      const scope = checkOptions(options, checkPopup) || popupInCustomContainer(_sfc_main$p, options);
       return addScope2Scopes(scope);
     }
     function dialog(options) {
@@ -1732,7 +1916,7 @@
               const rt = await hook.runHookAsync("onBeforeClose", {
                 mode: "one",
                 order: "desc"
-              });
+              }, data);
               isClosing = false;
               if (rt.success != true) {
                 console.warn("run onBeforeClose failed", rt.reason, rt.ex);
@@ -1744,7 +1928,7 @@
           },
           onBeforeClose: fn => hook.register("onBeforeClose", fn)
         });
-        const descriptor = openPopup(_sfc_main$t, options, extOptions);
+        const descriptor = openPopup(_sfc_main$r, options, extOptions);
         scope = snail_core.useAsyncScope(deferred.promise);
         monitorDialog(descriptor, scope, deferred);
       }
@@ -1762,7 +1946,7 @@
           inPopup: "follow",
           target
         };
-        scope = checkOptions(options, checkFollow) || popupInCustomContainer(_sfc_main$s, options, extOptions);
+        scope = checkOptions(options, checkFollow) || popupInCustomContainer(_sfc_main$q, options, extOptions);
       }
       return addScope2Scopes(scope);
     }
@@ -1779,7 +1963,7 @@
       });
     }
     function toast(type, message, options) {
-      return popupInCustomContainer(_sfc_main$q, {
+      return popupInCustomContainer(_sfc_main$o, {
         url: "#ToastContainer",
         props: {
           ...(options || Object.create(null)),
@@ -1812,7 +1996,7 @@
         },
         ...extOptions
       });
-      const descriptor = openPopup(container || _sfc_main$r, options, extOptions);
+      const descriptor = openPopup(container || _sfc_main$p, options, extOptions);
       const scope = snail_core.useAsyncScope(deferred.promise);
       scope.onDestroy(() => destroyPopup(descriptor, deferred));
       return scope;
@@ -1952,7 +2136,7 @@
   };
   const _hoisted_2$9 = ["src"];
   const _hoisted_3$6 = ["textContent"];
-  var _sfc_main$p = vue.defineComponent({
+  var _sfc_main$n = vue.defineComponent({
     ...{
       name: "Empty",
       inheritAttrs: true
@@ -1981,7 +2165,7 @@
     key: 1,
     class: "select-status"
   };
-  var _sfc_main$o = vue.defineComponent({
+  var _sfc_main$m = vue.defineComponent({
     ...{
       name: "SelectNode",
       inheritAttrs: true
@@ -2051,7 +2235,7 @@
     }
   });
 
-  var _sfc_main$n = vue.defineComponent({
+  var _sfc_main$l = vue.defineComponent({
     ...{
       name: "Select2Popup",
       inheritAttrs: true
@@ -2229,7 +2413,7 @@
           onSearch,
           key: "select-search"
         }), null, 16)) : vue.createCommentVNode("", true), (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(itemsRef.value, item => {
-          return vue.openBlock(), vue.createBlock(_sfc_main$o, {
+          return vue.openBlock(), vue.createBlock(_sfc_main$m, {
             key: vue.unref(context).getKey(item),
             multiple: __props.multiple,
             item,
@@ -2238,7 +2422,7 @@
             onEnter: onEnterSelectNode,
             onClick: onClickSelectNode
           }, null, 8, ["multiple", "item", "context"]);
-        }), 128)), itemsRef.value.length == 0 ? (vue.openBlock(), vue.createBlock(_sfc_main$p, {
+        }), 128)), itemsRef.value.length == 0 ? (vue.openBlock(), vue.createBlock(_sfc_main$n, {
           key: 1,
           message: "无结果"
         })) : vue.createCommentVNode("", true), showClearButtonRef.value ? (vue.openBlock(), vue.createElementBlock("div", {
@@ -2256,14 +2440,14 @@
   };
   const _hoisted_2$7 = ["title", "textContent"];
   const _hoisted_3$4 = ["textContent"];
-  const _hoisted_4$4 = {
+  const _hoisted_4$3 = {
     key: 1,
     class: "placeholder"
   };
   onAppCreated((app, type) => {
-    type == "popup" && app.component("SelectPopup", _sfc_main$n);
+    type == "popup" && app.component("SelectPopup", _sfc_main$l);
   });
-  var _sfc_main$m = vue.defineComponent({
+  var _sfc_main$k = vue.defineComponent({
     ...{
       name: "Select",
       inheritAttrs: true
@@ -2409,12 +2593,12 @@
           button: "",
           size: 24,
           rotate: 90
-        })) : vue.createCommentVNode("", true)], 64)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$4, "暂无可选项"))], 2);
+        })) : vue.createCommentVNode("", true)], 64)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$3, "暂无可选项"))], 2);
       };
     }
   });
 
-  var _sfc_main$l = vue.defineComponent({
+  var _sfc_main$j = vue.defineComponent({
     ...{
       name: "Switch",
       inheritAttrs: true
@@ -2464,7 +2648,7 @@
   });
 
   const _hoisted_1$c = ["readonly", "placeholder", "rows"];
-  var _sfc_main$k = vue.defineComponent({
+  var _sfc_main$i = vue.defineComponent({
     ...{
       name: "Textarea",
       inheritAttrs: true
@@ -2531,7 +2715,7 @@
 
   const _hoisted_1$b = ["onClick"];
   const _hoisted_2$6 = ["textContent"];
-  var _sfc_main$j = vue.defineComponent({
+  var _sfc_main$h = vue.defineComponent({
     __name: "action-items",
     props: {
       mode: {},
@@ -2591,9 +2775,12 @@
   const _hoisted_2$5 = {
     class: "action-slot flex-cross-center"
   };
-  var _sfc_main$i = vue.defineComponent({
+  var _sfc_main$g = vue.defineComponent({
     __name: "action",
     props: {
+      disabled: {
+        type: Boolean
+      },
       trigger: {},
       actions: {}
     },
@@ -2618,21 +2805,23 @@
           popupScope.destroy();
           return;
         }
-        popupScope = follow(rootDom.value, {
-          component: _sfc_main$j,
-          closeOnEscape: true,
-          closeOnMask: true,
-          closeOnResize: true,
-          closeOnTarget: true,
-          followX: longPress ? ["center", "start", "end"] : ["after", "end", "start", "end", "center"],
-          followY: longPress ? ["center", "after", "before"] : ["after", "before", "center", "end", "after"],
-          props: {
-            mode: "vertical",
-            actions: props.actions
-          }
-        });
-        const code = await popupScope;
-        snail_core.isStringNotEmpty(code) && emits("trigger", code);
+        if (props.disabled != true) {
+          popupScope = follow(rootDom.value, {
+            component: _sfc_main$h,
+            closeOnEscape: true,
+            closeOnMask: true,
+            closeOnResize: true,
+            closeOnTarget: true,
+            followX: longPress ? ["center", "start", "end"] : ["after", "end", "start", "end", "center"],
+            followY: longPress ? ["center", "after", "before"] : ["after", "before", "center", "end", "after"],
+            props: {
+              mode: "vertical",
+              actions: props.actions
+            }
+          });
+          const code = await popupScope;
+          snail_core.isStringNotEmpty(code) && emits("trigger", code);
+        }
       }
       function onMouseDown() {
         if (props.trigger == "long-press" && pressStartDate == void 0) {
@@ -2666,7 +2855,7 @@
         }
       });
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [vue.createElementVNode("div", _hoisted_2$5, [vue.renderSlot(_ctx.$slots, "default")]), __props.trigger == "hover" ? (vue.openBlock(), vue.createBlock(_sfc_main$E, {
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a, [vue.createElementVNode("div", _hoisted_2$5, [vue.renderSlot(_ctx.$slots, "default")]), __props.trigger == "hover" && __props.disabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$E, {
           key: 0,
           class: "hover-tips",
           button: "",
@@ -2683,65 +2872,7 @@
     }
   });
 
-  function monitScroll(manager, root, options, emiter, classStyleRef) {
-    const scope = snail_core.useScope();
-    let preStatus = void 0;
-    const observer = snail_view.useObserver();
-    const timer = snail_core.useTimer();
-    const reactive = useReactive();
-    function buildClassStyle() {
-      const array = (classStyleRef.value ? [...classStyleRef.value] : []).filter(item => item == "x-bar" || item == "y-bar");
-      array.push(...manager.buildClassStyle(options));
-      classStyleRef.value = array;
-    }
-    function refreshScrollInfo() {
-      const status = Object.freeze(manager.getStatus(root));
-      const events = Object.create(null);
-      if (preStatus != void 0) {
-        preStatus.xbar != status.xbar && (events.xbar = [status.xbar]);
-        preStatus.ybar != status.ybar && (events.ybar = [status.ybar]);
-        if (preStatus.xbar == true && status.xbar == true) {
-          status.left && preStatus.left !== status.left && (events.left = []);
-          status.right && preStatus.right !== status.right && (events.right = []);
-        }
-        if (preStatus.ybar == true && status.ybar == true) {
-          status.top && preStatus.top !== status.top && (events.top = []);
-          status.bottom && preStatus.bottom !== status.bottom && (events.bottom = []);
-        }
-      }
-      preStatus = status;
-      events.xbar && emiter("xbar", ...events.xbar);
-      events.left && emiter("left");
-      events.right && emiter("right");
-      events.ybar && emiter("ybar", ...events.ybar);
-      events.top && emiter("top");
-      events.bottom && emiter("bottom");
-      {
-        const array = (classStyleRef.value ? [...classStyleRef.value] : []).filter(item => item != "x-bar" && item != "y-bar");
-        status.xbar && array.push("x-bar");
-        status.ybar && array.push("y-bar");
-        classStyleRef.value = array;
-      }
-    }
-    buildClassStyle();
-    refreshScrollInfo();
-    reactive.watcher(() => options.scroll, buildClassStyle);
-    reactive.watcher(() => options.barSize, buildClassStyle);
-    observer.onSize(root, refreshScrollInfo);
-    observer.onEvent(root, "scroll", refreshScrollInfo);
-    timer.onInterval(() => {
-      const isChange = preStatus.scrollWidth != root.scrollWidth || preStatus.scrollHeight != root.scrollHeight;
-      isChange && refreshScrollInfo();
-    }, 100);
-    scope.onDestroy(() => {
-      observer.destroyed || observer.destroy();
-      timer.destroyed || timer.destroy();
-      reactive.destroyed || reactive.destroy();
-    });
-    return scope;
-  }
-
-  var _sfc_main$h = vue.defineComponent({
+  var _sfc_main$f = vue.defineComponent({
     ...{
       name: "Elastic",
       inheritAttrs: false
@@ -2947,7 +3078,7 @@
     }
   });
 
-  var _sfc_main$g = vue.defineComponent({
+  var _sfc_main$e = vue.defineComponent({
     ...{
       name: "Flex",
       inheritAttrs: false
@@ -3042,20 +3173,13 @@
     }
   });
 
-  const _hoisted_1$9 = {
-    class: "fold-header"
-  };
+  const _hoisted_1$9 = ["textContent"];
   const _hoisted_2$4 = ["textContent"];
-  const _hoisted_3$3 = ["textContent"];
-  const _hoisted_4$3 = {
+  const _hoisted_3$3 = {
     key: 1,
     class: "status"
   };
-  const _hoisted_5$2 = {
-    class: "fold-body",
-    ref: "foldBody"
-  };
-  var _sfc_main$f = vue.defineComponent({
+  var _sfc_main$d = vue.defineComponent({
     ...{
       name: "Fold",
       inheritAttrs: true
@@ -3066,7 +3190,9 @@
         type: Boolean
       },
       title: {},
-      subtitle: {}
+      subtitle: {},
+      header: {},
+      body: {}
     }, {
       "status": {
         default: "expand"
@@ -3086,27 +3212,37 @@
         watcher
       } = useReactive();
       const statusModel = vue.useModel(__props, "status");
-      watcher(statusModel, updateFoldStyle);
+      const foldHeaderDom = vue.useTemplateRef("foldHeader");
       const foldBodyDom = vue.useTemplateRef("foldBody");
-      function updateFoldStyle() {
+      const slotHandle = {
+        getStatus: () => statusModel.value,
+        setStatus: value => statusModel.value = value,
+        toggle: () => (onStatusClick(), statusModel.value)
+      };
+      function updateFoldStyle(disableAnimation) {
         const isExpand = statusModel.value == "expand";
         if (foldBodyDom.value) {
-          const minHeight = 32;
+          const minHeight = foldHeaderDom.value.getBoundingClientRect().height;
           const maxHeight = minHeight + foldBodyDom.value.getBoundingClientRect().height;
-          transition(foldBodyDom.value.parentElement, {
-            from: {
-              transition: "height 0.2s ease",
-              overflow: "hidden",
-              height: `${isExpand ? minHeight : maxHeight}px`
-            },
-            to: {
-              height: `${isExpand ? maxHeight : minHeight}px`
-            },
-            end: {
-              overflow: isExpand ? "" : "hidden",
-              height: isExpand ? "" : `${minHeight}px`
-            }
-          });
+          const endStyle = {
+            overflow: isExpand ? "" : "hidden",
+            height: isExpand ? "" : `${minHeight}px`
+          };
+          if (disableAnimation === true) {
+            Object.assign(foldBodyDom.value.parentElement.style, endStyle);
+          } else {
+            transition(foldBodyDom.value.parentElement, {
+              from: {
+                transition: "height 0.2s ease",
+                overflow: "hidden",
+                height: `${isExpand ? minHeight : maxHeight}px`
+              },
+              to: {
+                height: `${isExpand ? maxHeight : minHeight}px`
+              },
+              end: endStyle
+            });
+          }
         }
       }
       function onStatusClick() {
@@ -3122,73 +3258,38 @@
         }
         vue.nextTick(() => emits("change", statusModel.value));
       }
+      vue.onMounted(() => {
+        statusModel.value != "expand" && updateFoldStyle(true);
+        watcher(statusModel, () => updateFoldStyle(false));
+      });
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
           class: vue.normalizeClass(["snail-fold", statusModel.value])
-        }, [vue.createElementVNode("div", _hoisted_1$9, [vue.renderSlot(_ctx.$slots, "header", {}, () => [vue.createElementVNode("div", {
+        }, [vue.createElementVNode("div", {
+          class: vue.normalizeClass(["fold-header", __props.header ? __props.header.class : []]),
+          ref: "foldHeader"
+        }, [vue.renderSlot(_ctx.$slots, "header", vue.normalizeProps(vue.guardReactiveProps(slotHandle)), () => [vue.createElementVNode("div", {
           class: "title ellipsis",
           textContent: vue.toDisplayString(__props.title)
-        }, null, 8, _hoisted_2$4), !!__props.subtitle ? (vue.openBlock(), vue.createElementBlock("div", {
+        }, null, 8, _hoisted_1$9), !!__props.subtitle ? (vue.openBlock(), vue.createElementBlock("div", {
           key: 0,
           class: "subtitle ellipsis",
           textContent: vue.toDisplayString(__props.subtitle)
-        }, null, 8, _hoisted_3$3)) : vue.createCommentVNode("", true), __props.disabled != true ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$3, [vue.createVNode(_sfc_main$E, {
-          custom: false,
+        }, null, 8, _hoisted_2$4)) : vue.createCommentVNode("", true), __props.disabled != true ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$3, [vue.createVNode(_sfc_main$E, {
           type: "arrow",
           button: "",
           title: statusModel.value == "expand" ? "收起" : "展开",
           rotate: statusModel.value == "expand" ? -90 : 90,
           onClick: onStatusClick
-        }, null, 8, ["title", "rotate"])])) : vue.createCommentVNode("", true)])]), vue.createElementVNode("div", _hoisted_5$2, [vue.renderSlot(_ctx.$slots, "default")], 512)], 2);
+        }, null, 8, ["title", "rotate"])])) : vue.createCommentVNode("", true)])], 2), vue.createElementVNode("div", {
+          class: vue.normalizeClass(["fold-body", __props.body ? __props.body.class : []]),
+          ref: "foldBody"
+        }, [vue.renderSlot(_ctx.$slots, "default", vue.normalizeProps(vue.guardReactiveProps(slotHandle)))], 2)], 2);
       };
     }
   });
 
-  var _sfc_main$e = vue.defineComponent({
-    ...{
-      name: "Scroll",
-      inheritAttrs: false
-    },
-    __name: "scroll",
-    props: {
-      scroll: {},
-      barSize: {}
-    },
-    emits: ["xbar", "left", "right", "ybar", "top", "bottom"],
-    setup(__props, _ref) {
-      let {
-        expose: __expose,
-        emit: __emit
-      } = _ref;
-      const props = __props;
-      const emits = __emit;
-      const rootDom = vue.useTemplateRef("scroll-root");
-      const manager = snail_view.useScroll();
-      const classStyleRef = vue.shallowRef();
-      __expose({
-        getStatus() {
-          return manager.getStatus(rootDom.value);
-        },
-        scroll(left, top) {
-          left == void 0 || (rootDom.value.scrollLeft += left);
-          top == void 0 || (rootDom.value.scrollTop += top);
-        },
-        scrollTo(left, top) {
-          left == void 0 || (rootDom.value.scrollLeft = left);
-          top == void 0 || (rootDom.value.scrollTop = top);
-        }
-      });
-      vue.onMounted(() => monitScroll(manager, rootDom.value, props, emits, classStyleRef));
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps(_ctx.$attrs, {
-          class: ["snail-scroll", classStyleRef.value],
-          ref: "scroll-root"
-        }), [vue.renderSlot(_ctx.$slots, "default")], 16);
-      };
-    }
-  });
-
-  var _sfc_main$d = vue.defineComponent({
+  var _sfc_main$c = vue.defineComponent({
     __name: "layout",
     props: {
       mode: {},
@@ -3204,34 +3305,45 @@
         const map = Object.create(null);
         map.main = {
           scrollable: props.main && props.main.scroll != void 0,
-          class: props.main && snail_core.isStringNotEmpty(props.main.class) ? `main-area ${props.main.class}` : "main-area",
+          class: buildAreaClass("main-area", props.main),
           style: void 0
         };
         if (props.mode == "vertical") {
           map.top = {
             scrollable: props.top && props.top.scroll != void 0,
-            class: props.top && snail_core.isStringNotEmpty(props.top.class) ? `top-area ${props.top.class}` : "top-area",
+            class: buildAreaClass("top-area", props.top),
             style: buildHeightStyle(props.top)
           };
           map.bottom = {
             scrollable: props.bottom && props.bottom.scroll != void 0,
-            class: props.bottom && snail_core.isStringNotEmpty(props.bottom.class) ? `bottom-area ${props.bottom.class}` : "bottom-area",
+            class: buildAreaClass("bottom-area", props.bottom),
             style: buildHeightStyle(props.bottom)
           };
         } else {
           map.left = {
             scrollable: props.left && props.left.scroll != void 0,
-            class: props.left && snail_core.isStringNotEmpty(props.left.class) ? `left-area ${props.left.class}` : "left-area",
+            class: buildAreaClass("left-area", props.left),
             style: buildWidthStyle(props.left)
           };
           map.right = {
             scrollable: props.right && props.right.scroll != void 0,
-            class: props.right && snail_core.isStringNotEmpty(props.right.class) ? `right-area ${props.right.class}` : "right-area",
+            class: buildAreaClass("right-area", props.right),
             style: buildWidthStyle(props.right)
           };
         }
         return map;
       });
+      function buildAreaClass(fixedClass, cssClass) {
+        const classArray = [fixedClass];
+        if (cssClass != void 0) {
+          if (snail_core.isArray(cssClass.class) == true) {
+            classArray.push(...cssClass.class);
+          } else if (snail_core.isStringNotEmpty(cssClass.class) == true) {
+            classArray.push(cssClass.class);
+          }
+        }
+        return classArray;
+      }
       function buildWidthStyle(style) {
         return style ? snail_view.css.buildStyle({
           minWidth: style.minWidth,
@@ -3254,7 +3366,7 @@
             key: item
           }, [areaMap.value[item] && _ctx.$slots[item] ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
             key: 0
-          }, [areaMap.value[item].scrollable ? (vue.openBlock(), vue.createBlock(_sfc_main$e, vue.mergeProps({
+          }, [areaMap.value[item].scrollable ? (vue.openBlock(), vue.createBlock(_sfc_main$t, vue.mergeProps({
             key: 0,
             class: areaMap.value[item].class,
             style: areaMap.value[item].style
@@ -3273,7 +3385,7 @@
     }
   });
 
-  var _sfc_main$c = vue.defineComponent({
+  var _sfc_main$b = vue.defineComponent({
     ...{
       name: "Sort",
       inheritAttrs: true
@@ -3377,7 +3489,7 @@
   const _hoisted_1$8 = {
     class: "table-body"
   };
-  var _sfc_main$b = vue.defineComponent({
+  var _sfc_main$a = vue.defineComponent({
     ...{
       name: "Table",
       inheritAttrs: true
@@ -3397,7 +3509,7 @@
       const hStyleRef = vue.computed(() => snail_view.css.buildStyle(props.headerStyle));
       const fStyleRef = vue.computed(() => snail_view.css.buildStyle(props.footerStyle));
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createBlock(_sfc_main$e, {
+        return vue.openBlock(), vue.createBlock(_sfc_main$t, {
           class: vue.normalizeClass(["snail-table", {
             "start-border": __props.border == true
           }]),
@@ -3417,7 +3529,7 @@
     }
   });
 
-  var _sfc_main$a = vue.defineComponent({
+  var _sfc_main$9 = vue.defineComponent({
     ...{
       name: "TableRow",
       inheritAttrs: true
@@ -3440,7 +3552,7 @@
     }
   });
 
-  var _sfc_main$9 = vue.defineComponent({
+  var _sfc_main$8 = vue.defineComponent({
     ...{
       name: "TableCol",
       inheritAttrs: true
@@ -3498,7 +3610,7 @@
     class: "snail-tree-children",
     ref: "children"
   };
-  var _sfc_main$8 = vue.defineComponent({
+  var _sfc_main$7 = vue.defineComponent({
     ...{
       name: "TreeNode",
       inheritAttrs: true
@@ -3644,7 +3756,7 @@
   const _hoisted_1$6 = {
     class: "snail-tree"
   };
-  var _sfc_main$7 = vue.defineComponent({
+  var _sfc_main$6 = vue.defineComponent({
     ...{
       name: "Tree",
       inheritAttrs: true
@@ -3682,11 +3794,11 @@
           key: 0
         }, __props.search, {
           onSearch
-        }), null, 16)) : vue.createCommentVNode("", true), vue.createVNode(_sfc_main$e, {
+        }), null, 16)) : vue.createCommentVNode("", true), vue.createVNode(_sfc_main$t, {
           scroll: "y"
         }, {
           default: vue.withCtx(() => [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.nodes || [], node => {
-            return vue.openBlock(), vue.createBlock(_sfc_main$8, {
+            return vue.openBlock(), vue.createBlock(_sfc_main$7, {
               key: vue.unref(context).getKey(node),
               node,
               parent: void 0,
@@ -3707,52 +3819,6 @@
     }
   });
 
-  var _sfc_main$6 = vue.defineComponent({
-    __name: "wrapper",
-    props: {
-      readonly: {
-        type: Boolean
-      },
-      inPopup: {
-        type: Boolean
-      },
-      header: {},
-      content: {},
-      footer: {}
-    },
-    emits: ["cancel", "confirm"],
-    setup(__props, _ref) {
-      let {
-        emit: __emit
-      } = _ref;
-      const emits = __emit;
-      return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.normalizeClass(["snail-wrapper", __props.inPopup ? "in-popup" : "in-normal"])
-        }, [__props.header && __props.header.disabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$B, vue.mergeProps({
-          key: 0
-        }, __props.header || {
-          useTo: "dialog",
-          title: "对话框"
-        }, {
-          onClose: _cache[0] || (_cache[0] = $event => emits("cancel"))
-        }), null, 16)) : vue.createCommentVNode("", true), vue.createVNode(_sfc_main$e, vue.mergeProps({
-          class: "wrapper-body"
-        }, __props.content || {
-          scroll: "none"
-        }), {
-          default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "default")]),
-          _: 3
-        }, 16), __props.footer && __props.readonly != true && __props.footer.disabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$C, vue.mergeProps({
-          key: 1
-        }, __props.footer || {}, {
-          onCancel: _cache[1] || (_cache[1] = $event => emits("cancel")),
-          onConfirm: _cache[2] || (_cache[2] = $event => emits("confirm"))
-        }), null, 16)) : vue.createCommentVNode("", true)], 2);
-      };
-    }
-  });
-
   function mount(target, options, onDestroyed) {
     snail_core.mustObject(options, "options");
     target instanceof HTMLElement || snail_core.throwError("target must be a HTMLElement");
@@ -4047,7 +4113,7 @@
       }
       vue.onMounted(rebuildItems);
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createBlock(_sfc_main$d, {
+        return vue.openBlock(), vue.createBlock(_sfc_main$c, {
           class: vue.normalizeClass(["time-picker pc", {
             "second-disabled": vue.unref(format) != "HH:mm:ss"
           }]),
@@ -4347,7 +4413,7 @@
       dateRef.value == void 0 && (dateRef.value = electDateValue());
       buildPickerItems(stepRef.value, 0);
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createBlock(_sfc_main$d, {
+        return vue.openBlock(), vue.createBlock(_sfc_main$c, {
           class: vue.normalizeClass(["date-picker pc", {
             "time-now": __props.pinned && __props.pinned.value == true
           }]),
@@ -4797,7 +4863,7 @@
   });
 
   const components = {
-    Action: _sfc_main$i,
+    Action: _sfc_main$g,
     Button: _sfc_main$F,
     Choose: _sfc_main$D,
     Footer: _sfc_main$C,
@@ -4806,27 +4872,27 @@
     Input: _sfc_main$A,
     Number: _sfc_main$z,
     Search: _sfc_main$y,
-    Select: _sfc_main$m,
-    Switch: _sfc_main$l,
-    Textarea: _sfc_main$k,
+    Select: _sfc_main$k,
+    Switch: _sfc_main$j,
+    Textarea: _sfc_main$i,
     Dynamic: _sfc_main$u,
-    Elastic: _sfc_main$h,
-    Flex: _sfc_main$g,
-    Fold: _sfc_main$f,
+    Elastic: _sfc_main$f,
+    Flex: _sfc_main$e,
+    Fold: _sfc_main$d,
     Motion: _sfc_main$w,
-    Layout: _sfc_main$d,
-    Scroll: _sfc_main$e,
-    Sort: _sfc_main$c,
-    Table: _sfc_main$b,
-    TableRow: _sfc_main$a,
-    TableCol: _sfc_main$9,
-    Tree: _sfc_main$7,
-    Wrapper: _sfc_main$6,
+    Layout: _sfc_main$c,
+    Scroll: _sfc_main$t,
+    Sort: _sfc_main$b,
+    Table: _sfc_main$a,
+    TableRow: _sfc_main$9,
+    TableCol: _sfc_main$8,
+    Tree: _sfc_main$6,
+    Wrapper: _sfc_main$s,
     FlashNumber: _sfc_main$5,
     DatePicker: _sfc_main$2,
     TimePicker: _sfc_main$1,
     DragVerify: _sfc_main,
-    Empty: _sfc_main$p,
+    Empty: _sfc_main$n,
     Loading: _sfc_main$v
   };