npm - snail.vue - Versions diffs - 1.0.50 → 1.0.52 - Mend

snail.vue 1.0.50 → 1.0.52

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/README.md +91 -0
package/dist/snail.vue.d.ts +1 -1
package/dist/snail.vue.js +56 -60
package/dist/snail.vue.umd.js +56 -60
package/dist/styles/snail.vue.vue.css +15 -15
package/package.json +1 -1

package/README.md ADDED Viewed

@@ -0,0 +1,91 @@
+# 1. **概述**
+**snail.vue 基于 vue 3.x，实现一些常用功能模块，通过 MIT 协议开放使用：**
+1. **基于 vue 封装常用组件（如表单、列表、树、弹窗、容器、提示等组件），并不断补充**
+2. **提供基于 vue 的通用数据结构和事件模型**
+3. **对 vue 的部分功能做了再次封装，简化使用和生命周期管理**
+# 2. **环境搭建**
+## 2.1. **依赖安装**
+1. **安装 npm 包**
+2. **注册依赖组件**
+3. **打包输出**
+## 2.2. **动态注册**
+# 3. **使用说明**
+## 3.1. **base 基础组件**
+**封装基础 vue 组件，如 Button、Select、Header、Icon、Search、Switch 等等**
+**详细说明：**[https://www.yuque.com/snail-devx/js/mhieowa8ddbdhgu8](https://www.yuque.com/snail-devx/js/mhieowa8ddbdhgu8)
+| **组件**                                                               | **简介**                                                                             |
+| ---------------------------------------------------------------------- | ------------------------------------------------------------------------------------ |
+| [Button](https://www.yuque.com/snail-devx/js/mhieowa8ddbdhgu8#s1zYq)   | **按钮组件；集成 type、size 属性，封装大小和类型，简化使用**                         |
+| [Choose](https://www.yuque.com/snail-devx/js/mhieowa8ddbdhgu8#gCenb)   | **选择组件；集成 radio、checkbook 常用功能，支持选项组；支持美化和原生两种渲染模式** |
+| [Icon](https://www.yuque.com/snail-devx/js/mhieowa8ddbdhgu8#xf4og)     | **图标组件；使用 svg 进行图标绘，内置常用图标类型；并支持自定义图标绘制路径**        |
+| [Search](https://www.yuque.com/snail-devx/js/mhieowa8ddbdhgu8#VoyjZ)   | **搜索组件；封装搜索输入框、搜索按钮；支持自动完成等功能**                           |
+| [Select](https://www.yuque.com/snail-devx/js/mhieowa8ddbdhgu8#NPAQL)   | **选项菜单组件；对原生 select 的扩充，支持多级选项，支持单选和多选等**               |
+| [Switch](https://www.yuque.com/snail-devx/js/mhieowa8ddbdhgu8#sOSDT)   | **开关组件；支持只读、v-model 绑定操纵**                                             |
+| [Reactive](https://www.yuque.com/snail-devx/js/mhieowa8ddbdhgu8#LzpHK) | **响应式模块，非 vue 组件；对 vue 响应时做了封装，集成常用生命周期管理**             |
+| [Footer](https://www.yuque.com/snail-devx/js/mhieowa8ddbdhgu8#Mk0Pf)   | **尾部组件；和 Header 配套，封装确定、取消按钮；不常用**                             |
+| [Header](https://www.yuque.com/snail-devx/js/mhieowa8ddbdhgu8#jQkjV)   | **头部组件；封装标题、关闭按钮，用于 page 和 dialog 模式；支持插槽**                 |
+## 3.2. **container 容器组件**
+**实现对子组件的动态加载，如列表、树、滚动容器，折叠面板，动态组件等等；**
+**详细说明：**[https://www.yuque.com/snail-devx/js/kaynh9t44gbl6fxc](https://www.yuque.com/snail-devx/js/kaynh9t44gbl6fxc)
+| **组件**                                                              | **简介**                                                                                                                  |
+| --------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- |
+| [dynamic](https://www.yuque.com/snail-devx/js/kaynh9t44gbl6fxc#NNGJt) | **动态组件；vue 的 Component 组件扩展，支持 url、name、object 方式加载异步组件，并支持 event、props、model、slot 等绑定** |
+| [fold](https://www.yuque.com/snail-devx/js/kaynh9t44gbl6fxc#sJOfO)    | **折叠面板组件；通过 slot 加载实际内容，封装折叠 title 实现面板展开、收起功能**                                           |
+| [layout](https://www.yuque.com/snail-devx/js/kaynh9t44gbl6fxc#lGmps)  | **布局组件；实现上中下、左中右布局，通过 slot 指定每块内容**                                                              |
+| [scroll](https://www.yuque.com/snail-devx/js/kaynh9t44gbl6fxc#IcwVh)  | **滚动组件；实现滚动条状态、事件封装，并通过 class、event 等方式对外，通过 slot 加载实际内容**                            |
+| [sort](https://www.yuque.com/snail-devx/js/kaynh9t44gbl6fxc#dKA7E)    | **排序组件；集成 sortable.js 库，实现再次封装，暴露常见属性**                                                             |
+| [table](https://www.yuque.com/snail-devx/js/kaynh9t44gbl6fxc#UViu6)   | **表格组件；封装表头、内容区域，基于 TableCol、TableRow 子组件对外做自定义渲染**                                          |
+| [tree](https://www.yuque.com/snail-devx/js/kaynh9t44gbl6fxc#tKdSd)    | **树组件；基于 nodes 渲染树，支持节点自定义，集成节点事件和本地搜索**                                                     |
+| [wrapper](https://www.yuque.com/snail-devx/js/kaynh9t44gbl6fxc#gita6) | **包裹层组件；作为常用组件的包裹层，自动实现组件在 page 和 popup 中展现，让内容组件关注核心逻辑即可**                     |
+## 3.3. **form 表单组件**
+**封装表单专属组件，如 input、文件上传等**
+**详细说明：**[https://www.yuque.com/snail-devx/js/wl1q8db0qms764eg](https://www.yuque.com/snail-devx/js/wl1q8db0qms764eg)
+| **组件**                                                            | **简介**                                        |
+| ------------------------------------------------------------------- | ----------------------------------------------- |
+| [input](https://www.yuque.com/snail-devx/js/wl1q8db0qms764eg#lw7O6) | **输入框组件，对原生 input 做美化，支持标题等** |
+## 3.4. **popup 弹窗组件**
+**基于 IPopupManager 实现弹窗管理，自动管理弹窗层级、弹窗生命周期；提供基础 popup 弹窗方法；并扩展 dialog、follow、toast、confirm 弹窗方法**
+**详细说明：**[https://www.yuque.com/snail-devx/js/byho94c6ms40kdb2](https://www.yuque.com/snail-devx/js/byho94c6ms40kdb2)
+| **弹窗方法**                                                           | **简介**                                                                               |
+| ---------------------------------------------------------------------- | -------------------------------------------------------------------------------------- |
+| [usePopup](https://www.yuque.com/snail-devx/js/byho94c6ms40kdb2#MF7uV) | **弹窗管理器接口实现接口，后续 popup、dialog 等弹窗的具体实现**                        |
+| [popup](https://www.yuque.com/snail-devx/js/byho94c6ms40kdb2#gppwu)    | **通用弹窗方法；管理弹窗生成周期，自动分配弹层，实现属性、事件绑定**                   |
+| [dialog](https://www.yuque.com/snail-devx/js/byho94c6ms40kdb2#YZ42j)   | **模态弹窗；利用 popup 实现弹窗遮罩，支持关闭前拦截**                                  |
+| [follow](https://www.yuque.com/snail-devx/js/byho94c6ms40kdb2#lMTk5)   | **跟随弹窗；弹窗自动跟随指定 target 元素，实现高度、宽度跟随、位置跟随、位置智能感知** |
+| [toast](https://www.yuque.com/snail-devx/js/byho94c6ms40kdb2#FWNH1)    | **消息提示弹窗；模拟 Android 的 Toast 弹窗提示消息**                                   |
+| [confirm](https://www.yuque.com/snail-devx/js/byho94c6ms40kdb2#wohc0)  | **确认弹窗；模拟实现原生 confirm 弹窗**                                                |
+## 3.5. **prompt 提示组件**
+**封装一些提示性质的通用组件，如数据加载状态、无数据提醒等等**
+**详细说明：**[https://www.yuque.com/snail-devx/js/kp0nznuu61qs8zgw](https://www.yuque.com/snail-devx/js/kp0nznuu61qs8zgw)
+| **组件**                                                                  | **简介**                                               |
+| ------------------------------------------------------------------------- | ------------------------------------------------------ |
+| [drag-verify](https://www.yuque.com/snail-devx/js/kp0nznuu61qs8zgw#YN3YF) | **拖拽验证组件；拖动滑块验证，给出验证提示和结果信息** |
+| [empty](https://www.yuque.com/snail-devx/js/kp0nznuu61qs8zgw#qZsqi)       | **空组件；用于提示无数据、无搜索结果等空状态**         |
+| [loading](https://www.yuque.com/snail-devx/js/kp0nznuu61qs8zgw#IuBmQ)     | **加载组件；用于在数据加载过程中进行加载提示**         |

package/dist/snail.vue.d.ts CHANGED Viewed

@@ -1094,7 +1094,7 @@ type ChooseEvents<T> = {
 /**
  * 按钮配置选项
  */
-type ButtonOptions = {
+type ButtonOptions = TitleOptions & {
     /**
      * 按钮尺寸
      * - max    ： 120 X 40

package/dist/snail.vue.js CHANGED Viewed

@@ -3,6 +3,7 @@ import { defineComponent, createElementBlock, openBlock, normalizeClass, renderS
 import { throwError, isArrayNotEmpty, isStringNotEmpty, isArray, newId, mustFunction, useScope, removeFromArray, mustObject, throwIfFalse, isObject, isNumberNotNaN, mountScope, useScopes, isPromise, wait, script, delay, useTimer, defer, useAsyncScope, useHook, hasAny, throwIfTrue, isFunction, onMountScope } from 'snail.core';
 import { link, css, useObserver, useAnimation } from 'snail.view';
+const _hoisted_1$g = ["title"];
 var _sfc_main$t = defineComponent({
   ...{
     name: "Button",
@@ -10,15 +11,16 @@ var _sfc_main$t = defineComponent({
   },
   __name: "button",
   props: {
+    title: {},
     size: {},
     type: {}
   },
   setup(__props) {
-    const props = __props;
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["snail-button", [props.size, props.type]])
-      }, [renderSlot(_ctx.$slots, "default", {}, () => [_cache[0] || (_cache[0] = createTextVNode("按钮"))])], 2);
+        class: normalizeClass(["snail-button", [_ctx.size, _ctx.type]]),
+        title: _ctx.title
+      }, [renderSlot(_ctx.$slots, "default", {}, () => [_cache[0] || (_cache[0] = createTextVNode("按钮"))])], 10, _hoisted_1$g);
     };
   }
 });
@@ -167,25 +169,25 @@ var _sfc_main$r = defineComponent({
     }
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["snail-choose", props.readonly ? "readonly" : ""])
+        class: normalizeClass(["snail-choose", _ctx.readonly ? "readonly" : ""])
       }, [(openBlock(true), createElementBlock(Fragment, null, renderList(chooseItemsRef.value, (item, index) => {
         return openBlock(), createElementBlock("div", {
           key: item.key,
           class: normalizeClass(["choose-item", item.checked ? "checked" : ""]),
-          style: normalizeStyle(unref(css).buildStyle(props.itemStyle)),
+          style: normalizeStyle(unref(css).buildStyle(_ctx.itemStyle)),
           onClick: $event => onItemClick(item)
         }, [unref(mode) == "native" ? (openBlock(), createElementBlock("input", {
           key: 0,
-          type: props.type,
+          type: _ctx.type,
           checked: item.checked
         }, null, 8, _hoisted_2$9)) : unref(mode) == "beautiful" ? (openBlock(), createElementBlock("div", {
           key: 1,
-          class: normalizeClass(["item-beautiful", [props.type, item.checked ? "item-checked" : "item-unchecked"]])
+          class: normalizeClass(["item-beautiful", [_ctx.type, item.checked ? "item-checked" : "item-unchecked"]])
         }, [item.checked ? (openBlock(), createBlock(_sfc_main$s, {
           key: 0,
           type: "success",
           size: 12,
-          color: props.readonly ? "#8a9099" : "white"
+          color: _ctx.readonly ? "#8a9099" : "white"
         }, null, 8, ["color"])) : createCommentVNode("", true)], 2)) : createCommentVNode("", true), item.text ? (openBlock(), createElementBlock("span", {
           key: 2,
           class: "item-text",
@@ -225,25 +227,24 @@ var _sfc_main$q = defineComponent({
     let {
       emit: __emit
     } = _ref;
-    const props = __props;
     const emits = __emit;
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("footer", {
         class: normalizeClass(["snail-footer", {
-          "start-divider": props.divider
-        }, props.align || "right"])
-      }, [renderSlot(_ctx.$slots, "default", {}, () => [props.cancelDisabled != true ? (openBlock(), createBlock(_sfc_main$t, {
+          "start-divider": _ctx.divider
+        }, _ctx.align || "right"])
+      }, [renderSlot(_ctx.$slots, "default", {}, () => [_ctx.cancelDisabled != true ? (openBlock(), createBlock(_sfc_main$t, {
         key: 0,
         size: "max",
         type: "default",
         onClick: _cache[0] || (_cache[0] = $event => emits("cancel")),
-        textContent: toDisplayString(props.cancelName || "取消")
-      }, null, 8, ["textContent"])) : createCommentVNode("", true), props.confirmDisabled != true ? (openBlock(), createBlock(_sfc_main$t, {
+        textContent: toDisplayString(_ctx.cancelName || "取消")
+      }, null, 8, ["textContent"])) : createCommentVNode("", true), _ctx.confirmDisabled != true ? (openBlock(), createBlock(_sfc_main$t, {
         key: 1,
         size: "max",
         type: "primary",
         onClick: _cache[1] || (_cache[1] = $event => emits("confirm")),
-        textContent: toDisplayString(props.confirmName || "确定")
+        textContent: toDisplayString(_ctx.confirmName || "确定")
       }, null, 8, ["textContent"])) : createCommentVNode("", true)])], 2);
     };
   }
@@ -341,11 +342,11 @@ var _sfc_main$o = defineComponent({
     }
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["snail-search", props.readonly ? "readonly" : ""])
+        class: normalizeClass(["snail-search", _ctx.readonly ? "readonly" : ""])
       }, [withDirectives(createElementVNode("input", {
         type: "search",
-        placeholder: props.placeholder,
-        readonly: props.readonly == true,
+        placeholder: _ctx.placeholder,
+        readonly: _ctx.readonly,
         "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => textModel.value = $event),
         onKeyup: _cache[1] || (_cache[1] = $event => onSearch($event))
       }, null, 40, _hoisted_1$c), [[vModelText, textModel.value, void 0, {
@@ -601,23 +602,22 @@ var _sfc_main$n = defineComponent({
     }
   },
   setup(__props) {
-    const props = __props;
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$b, [createVNode(_sfc_main$p, {
         "use-to": "dialog",
-        title: props.title || "提示",
-        onClose: _cache[0] || (_cache[0] = $event => props.closePopup(false))
+        title: _ctx.title || "提示",
+        onClose: _cache[0] || (_cache[0] = $event => _ctx.closePopup(false))
       }, null, 8, ["title"]), createElementVNode("div", {
         class: "confirm-body",
-        innerHTML: props.message || "请确认？"
+        innerHTML: _ctx.message || "请确认？"
       }, null, 8, _hoisted_2$8), createVNode(_sfc_main$q, {
         align: "right",
-        "cancel-name": props.cancelName,
-        "cancel-disabled": props.cancelDisabled,
-        "confirm-name": props.confirmName,
-        "confirm-disabled": props.confirmDisabled,
-        onCancel: _cache[1] || (_cache[1] = $event => props.closePopup(false)),
-        onConfirm: _cache[2] || (_cache[2] = $event => props.closePopup(true))
+        "cancel-name": _ctx.cancelName,
+        "cancel-disabled": _ctx.cancelDisabled,
+        "confirm-name": _ctx.confirmName,
+        "confirm-disabled": _ctx.confirmDisabled,
+        onCancel: _cache[1] || (_cache[1] = $event => _ctx.closePopup(false)),
+        onConfirm: _cache[2] || (_cache[2] = $event => _ctx.closePopup(true))
       }, null, 8, ["cancel-name", "cancel-disabled", "confirm-name", "confirm-disabled"])]);
     };
   }
@@ -1326,14 +1326,13 @@ var _sfc_main$g = defineComponent({
     imageUrl: {}
   },
   setup(__props) {
-    const props = __props;
     const defaultImageBase64 = getNoDataBase64Image();
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1$9, [createElementVNode("img", {
-        src: props.imageUrl || unref(defaultImageBase64)
+        src: _ctx.imageUrl || unref(defaultImageBase64)
       }, null, 8, _hoisted_2$6), renderSlot(_ctx.$slots, "default", {}, () => [createElementVNode("div", {
         class: "message",
-        textContent: toDisplayString(props.message || "无数据")
+        textContent: toDisplayString(_ctx.message || "无数据")
       }, null, 8, _hoisted_3$5)])]);
     };
   }
@@ -1752,11 +1751,11 @@ var _sfc_main$d = defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["snail-select", {
-          "readonly": props.readonly
+          "readonly": _ctx.readonly
         }]),
         onClick: _cache[0] || (_cache[0] = $event => onClick()),
         ref: "select"
-      }, [props.items && props.items.length > 0 ? (openBlock(), createElementBlock(Fragment, {
+      }, [_ctx.items && _ctx.items.length > 0 ? (openBlock(), createElementBlock(Fragment, {
         key: 0
       }, [selectedItemsRef.value.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_1$7, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(slotOptions))), () => [createElementVNode("div", {
         class: "select-text",
@@ -1765,7 +1764,7 @@ var _sfc_main$d = defineComponent({
       }, null, 8, _hoisted_2$4)])])) : (openBlock(), createElementBlock("div", {
         key: 1,
         class: "select-result text-tips",
-        textContent: toDisplayString(props.readonly ? "" : props.placeholder || "请选择")
+        textContent: toDisplayString(_ctx.readonly ? "" : _ctx.placeholder || "请选择")
       }, null, 8, _hoisted_3$3)), createVNode(_sfc_main$s, {
         type: "arrow",
         size: 24,
@@ -1814,7 +1813,7 @@ var _sfc_main$c = defineComponent({
     }
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["snail-switch", [switchModel.value ? "on" : "off", props.readonly ? "readonly" : ""]]),
+        class: normalizeClass(["snail-switch", [switchModel.value ? "on" : "off", _ctx.readonly ? "readonly" : ""]]),
         onClick: onSwitchChange
       }, _cache[0] || (_cache[0] = [createElementVNode("div", {
         class: "on"
@@ -1863,7 +1862,6 @@ var _sfc_main$b = defineComponent({
     let {
       emit: __emit
     } = _ref;
-    const props = __props;
     const emits = __emit;
     const {
       transition
@@ -1913,12 +1911,12 @@ var _sfc_main$b = defineComponent({
         class: normalizeClass(["snail-fold", statusModel.value])
       }, [createElementVNode("div", _hoisted_1$6, [renderSlot(_ctx.$slots, "header", {}, () => [createElementVNode("div", {
         class: "title",
-        textContent: toDisplayString(props.title)
-      }, null, 8, _hoisted_2$3), !!props.subtitle ? (openBlock(), createElementBlock("div", {
+        textContent: toDisplayString(_ctx.title)
+      }, null, 8, _hoisted_2$3), !!_ctx.subtitle ? (openBlock(), createElementBlock("div", {
         key: 0,
         class: "subtitle",
-        textContent: toDisplayString(props.subtitle)
-      }, null, 8, _hoisted_3$2)) : createCommentVNode("", true), props.disabled != true ? (openBlock(), createElementBlock("div", _hoisted_4$2, [createVNode(_sfc_main$s, {
+        textContent: toDisplayString(_ctx.subtitle)
+      }, null, 8, _hoisted_3$2)) : createCommentVNode("", true), _ctx.disabled != true ? (openBlock(), createElementBlock("div", _hoisted_4$2, [createVNode(_sfc_main$s, {
         type: "arrow",
         title: statusModel.value == "expand" ? "收起" : "展开",
         onClick: onStatusClick
@@ -2059,13 +2057,12 @@ var _sfc_main$9 = defineComponent({
     scroll: {}
   },
   setup(__props) {
-    const props = __props;
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["snail-layout", props.mode])
+        class: normalizeClass(["snail-layout", _ctx.mode])
       }, [_ctx.$slots.start ? (openBlock(), createElementBlock("div", _hoisted_1$5, [renderSlot(_ctx.$slots, "start")])) : createCommentVNode("", true), createVNode(_sfc_main$a, mergeProps({
         class: "layout-body"
-      }, props.scroll), {
+      }, _ctx.scroll), {
         default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
         _: 3
       }, 16), _ctx.$slots.end ? (openBlock(), createElementBlock("div", _hoisted_2$2, [renderSlot(_ctx.$slots, "end")])) : createCommentVNode("", true)], 2);
@@ -2181,10 +2178,10 @@ var _sfc_main$7 = defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createBlock(_sfc_main$a, {
         class: normalizeClass(["snail-table", {
-          "start-border": props.border == true
+          "start-border": _ctx.border == true
         }]),
-        "scroll-x": props.scrollX,
-        "scroll-y": props.scrollY
+        "scroll-x": _ctx.scrollX,
+        "scroll-y": _ctx.scrollY
       }, {
         default: withCtx(() => [createElementVNode("div", {
           class: "table-header",
@@ -2261,7 +2258,7 @@ var _sfc_main$5 = defineComponent({
     const styleRef = computed(() => css.buildStyle(props));
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["table-col", props.textAlign]),
+        class: normalizeClass(["table-col", _ctx.textAlign]),
         style: normalizeStyle(styleRef.value)
       }, [renderSlot(_ctx.$slots, "default")], 6);
     };
@@ -2466,20 +2463,20 @@ var _sfc_main$3 = defineComponent({
       emits("click", node, parents);
     }
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1$2, [props.search ? (openBlock(), createBlock(_sfc_main$o, mergeProps({
+      return openBlock(), createElementBlock("div", _hoisted_1$2, [_ctx.search ? (openBlock(), createBlock(_sfc_main$o, mergeProps({
         key: 0
-      }, props.search, {
+      }, _ctx.search, {
         onSearch
       }), null, 16)) : createCommentVNode("", true), createVNode(_sfc_main$a, {
         "scroll-y": true
       }, {
-        default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(props.nodes || [], node => {
+        default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.nodes || [], node => {
           return openBlock(), createBlock(_sfc_main$4, {
             key: unref(context).getKey(node),
             node,
             parent: void 0,
             level: 1,
-            options: props.nodeOptions,
+            options: _ctx.nodeOptions,
             context: unref(context),
             onClick: onTreeNodeClick
           }, {
@@ -2513,11 +2510,10 @@ var _sfc_main$2 = defineComponent({
     let {
       emit: __emit
     } = _ref;
-    const props = __props;
     const emits = __emit;
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["snail-wrapper", props.inPopup ? "in-popup" : "in-normal"])
+        class: normalizeClass(["snail-wrapper", _ctx.inPopup ? "in-popup" : "in-normal"])
       }, [_ctx.header && _ctx.header.disabled != true ? (openBlock(), createBlock(_sfc_main$p, mergeProps({
         key: 0
       }, _ctx.header || {
@@ -2609,21 +2605,21 @@ var _sfc_main$1 = defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         class: normalizeClass(["snail-input", {
-          "readonly": props.readonly
+          "readonly": _ctx.readonly
         }])
-      }, [!!props.title ? (openBlock(), createElementBlock("div", {
+      }, [!!_ctx.title ? (openBlock(), createElementBlock("div", {
         key: 0,
         class: "input-title",
         style: normalizeStyle(titleStyleRef.value)
       }, [createElementVNode("span", {
         class: "text",
-        textContent: toDisplayString(props.title)
-      }, null, 8, _hoisted_1$1), props.readonly != true && props.required == true ? (openBlock(), createElementBlock("span", _hoisted_2)) : createCommentVNode("", true)], 4)) : createCommentVNode("", true), createElementVNode("div", _hoisted_3, [createElementVNode("input", {
+        textContent: toDisplayString(_ctx.title)
+      }, null, 8, _hoisted_1$1), _ctx.readonly != true && _ctx.required == true ? (openBlock(), createElementBlock("span", _hoisted_2)) : createCommentVNode("", true)], 4)) : createCommentVNode("", true), createElementVNode("div", _hoisted_3, [createElementVNode("input", {
         ref: "input-el",
-        type: props.type || "text",
+        type: _ctx.type || "text",
         value: inputModel.value,
-        readonly: props.readonly == true,
-        placeholder: props.placeholder,
+        readonly: _ctx.readonly == true,
+        placeholder: _ctx.placeholder,
         title: inputModel.value,
         onChange: onValueChange,
         onClick: _cache[0] || (_cache[0] = $event => emits("click"))

package/dist/snail.vue.umd.js CHANGED Viewed

@@ -5,6 +5,7 @@
   (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.SnailVue = global.SnailVue || {}, global.Vue, global.Snail, global.SnailView));
 })(this, (function (exports, vue, snail_core, snail_view) { 'use strict';
+  const _hoisted_1$g = ["title"];
   var _sfc_main$t = vue.defineComponent({
     ...{
       name: "Button",
@@ -12,15 +13,16 @@
     },
     __name: "button",
     props: {
+      title: {},
       size: {},
       type: {}
     },
     setup(__props) {
-      const props = __props;
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.normalizeClass(["snail-button", [props.size, props.type]])
-        }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [_cache[0] || (_cache[0] = vue.createTextVNode("按钮"))])], 2);
+          class: vue.normalizeClass(["snail-button", [_ctx.size, _ctx.type]]),
+          title: _ctx.title
+        }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [_cache[0] || (_cache[0] = vue.createTextVNode("按钮"))])], 10, _hoisted_1$g);
       };
     }
   });
@@ -169,25 +171,25 @@
       }
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.normalizeClass(["snail-choose", props.readonly ? "readonly" : ""])
+          class: vue.normalizeClass(["snail-choose", _ctx.readonly ? "readonly" : ""])
         }, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(chooseItemsRef.value, (item, index) => {
           return vue.openBlock(), vue.createElementBlock("div", {
             key: item.key,
             class: vue.normalizeClass(["choose-item", item.checked ? "checked" : ""]),
-            style: vue.normalizeStyle(vue.unref(snail_view.css).buildStyle(props.itemStyle)),
+            style: vue.normalizeStyle(vue.unref(snail_view.css).buildStyle(_ctx.itemStyle)),
             onClick: $event => onItemClick(item)
           }, [vue.unref(mode) == "native" ? (vue.openBlock(), vue.createElementBlock("input", {
             key: 0,
-            type: props.type,
+            type: _ctx.type,
             checked: item.checked
           }, null, 8, _hoisted_2$9)) : vue.unref(mode) == "beautiful" ? (vue.openBlock(), vue.createElementBlock("div", {
             key: 1,
-            class: vue.normalizeClass(["item-beautiful", [props.type, item.checked ? "item-checked" : "item-unchecked"]])
+            class: vue.normalizeClass(["item-beautiful", [_ctx.type, item.checked ? "item-checked" : "item-unchecked"]])
           }, [item.checked ? (vue.openBlock(), vue.createBlock(_sfc_main$s, {
             key: 0,
             type: "success",
             size: 12,
-            color: props.readonly ? "#8a9099" : "white"
+            color: _ctx.readonly ? "#8a9099" : "white"
           }, null, 8, ["color"])) : vue.createCommentVNode("", true)], 2)) : vue.createCommentVNode("", true), item.text ? (vue.openBlock(), vue.createElementBlock("span", {
             key: 2,
             class: "item-text",
@@ -227,25 +229,24 @@
       let {
         emit: __emit
       } = _ref;
-      const props = __props;
       const emits = __emit;
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("footer", {
           class: vue.normalizeClass(["snail-footer", {
-            "start-divider": props.divider
-          }, props.align || "right"])
-        }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [props.cancelDisabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$t, {
+            "start-divider": _ctx.divider
+          }, _ctx.align || "right"])
+        }, [vue.renderSlot(_ctx.$slots, "default", {}, () => [_ctx.cancelDisabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$t, {
           key: 0,
           size: "max",
           type: "default",
           onClick: _cache[0] || (_cache[0] = $event => emits("cancel")),
-          textContent: vue.toDisplayString(props.cancelName || "取消")
-        }, null, 8, ["textContent"])) : vue.createCommentVNode("", true), props.confirmDisabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$t, {
+          textContent: vue.toDisplayString(_ctx.cancelName || "取消")
+        }, null, 8, ["textContent"])) : vue.createCommentVNode("", true), _ctx.confirmDisabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$t, {
           key: 1,
           size: "max",
           type: "primary",
           onClick: _cache[1] || (_cache[1] = $event => emits("confirm")),
-          textContent: vue.toDisplayString(props.confirmName || "确定")
+          textContent: vue.toDisplayString(_ctx.confirmName || "确定")
         }, null, 8, ["textContent"])) : vue.createCommentVNode("", true)])], 2);
       };
     }
@@ -343,11 +344,11 @@
       }
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.normalizeClass(["snail-search", props.readonly ? "readonly" : ""])
+          class: vue.normalizeClass(["snail-search", _ctx.readonly ? "readonly" : ""])
         }, [vue.withDirectives(vue.createElementVNode("input", {
           type: "search",
-          placeholder: props.placeholder,
-          readonly: props.readonly == true,
+          placeholder: _ctx.placeholder,
+          readonly: _ctx.readonly,
           "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => textModel.value = $event),
           onKeyup: _cache[1] || (_cache[1] = $event => onSearch($event))
         }, null, 40, _hoisted_1$c), [[vue.vModelText, textModel.value, void 0, {
@@ -603,23 +604,22 @@
       }
     },
     setup(__props) {
-      const props = __props;
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [vue.createVNode(_sfc_main$p, {
           "use-to": "dialog",
-          title: props.title || "提示",
-          onClose: _cache[0] || (_cache[0] = $event => props.closePopup(false))
+          title: _ctx.title || "提示",
+          onClose: _cache[0] || (_cache[0] = $event => _ctx.closePopup(false))
         }, null, 8, ["title"]), vue.createElementVNode("div", {
           class: "confirm-body",
-          innerHTML: props.message || "请确认？"
+          innerHTML: _ctx.message || "请确认？"
         }, null, 8, _hoisted_2$8), vue.createVNode(_sfc_main$q, {
           align: "right",
-          "cancel-name": props.cancelName,
-          "cancel-disabled": props.cancelDisabled,
-          "confirm-name": props.confirmName,
-          "confirm-disabled": props.confirmDisabled,
-          onCancel: _cache[1] || (_cache[1] = $event => props.closePopup(false)),
-          onConfirm: _cache[2] || (_cache[2] = $event => props.closePopup(true))
+          "cancel-name": _ctx.cancelName,
+          "cancel-disabled": _ctx.cancelDisabled,
+          "confirm-name": _ctx.confirmName,
+          "confirm-disabled": _ctx.confirmDisabled,
+          onCancel: _cache[1] || (_cache[1] = $event => _ctx.closePopup(false)),
+          onConfirm: _cache[2] || (_cache[2] = $event => _ctx.closePopup(true))
         }, null, 8, ["cancel-name", "cancel-disabled", "confirm-name", "confirm-disabled"])]);
       };
     }
@@ -1328,14 +1328,13 @@
       imageUrl: {}
     },
     setup(__props) {
-      const props = __props;
       const defaultImageBase64 = getNoDataBase64Image();
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$9, [vue.createElementVNode("img", {
-          src: props.imageUrl || vue.unref(defaultImageBase64)
+          src: _ctx.imageUrl || vue.unref(defaultImageBase64)
         }, null, 8, _hoisted_2$6), vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createElementVNode("div", {
           class: "message",
-          textContent: vue.toDisplayString(props.message || "无数据")
+          textContent: vue.toDisplayString(_ctx.message || "无数据")
         }, null, 8, _hoisted_3$5)])]);
       };
     }
@@ -1754,11 +1753,11 @@
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
           class: vue.normalizeClass(["snail-select", {
-            "readonly": props.readonly
+            "readonly": _ctx.readonly
           }]),
           onClick: _cache[0] || (_cache[0] = $event => onClick()),
           ref: "select"
-        }, [props.items && props.items.length > 0 ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
+        }, [_ctx.items && _ctx.items.length > 0 ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
           key: 0
         }, [selectedItemsRef.value.length > 0 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$7, [vue.renderSlot(_ctx.$slots, "default", vue.normalizeProps(vue.guardReactiveProps(vue.unref(slotOptions))), () => [vue.createElementVNode("div", {
           class: "select-text",
@@ -1767,7 +1766,7 @@
         }, null, 8, _hoisted_2$4)])])) : (vue.openBlock(), vue.createElementBlock("div", {
           key: 1,
           class: "select-result text-tips",
-          textContent: vue.toDisplayString(props.readonly ? "" : props.placeholder || "请选择")
+          textContent: vue.toDisplayString(_ctx.readonly ? "" : _ctx.placeholder || "请选择")
         }, null, 8, _hoisted_3$3)), vue.createVNode(_sfc_main$s, {
           type: "arrow",
           size: 24,
@@ -1816,7 +1815,7 @@
       }
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.normalizeClass(["snail-switch", [switchModel.value ? "on" : "off", props.readonly ? "readonly" : ""]]),
+          class: vue.normalizeClass(["snail-switch", [switchModel.value ? "on" : "off", _ctx.readonly ? "readonly" : ""]]),
           onClick: onSwitchChange
         }, _cache[0] || (_cache[0] = [vue.createElementVNode("div", {
           class: "on"
@@ -1865,7 +1864,6 @@
       let {
         emit: __emit
       } = _ref;
-      const props = __props;
       const emits = __emit;
       const {
         transition
@@ -1915,12 +1913,12 @@
           class: vue.normalizeClass(["snail-fold", statusModel.value])
         }, [vue.createElementVNode("div", _hoisted_1$6, [vue.renderSlot(_ctx.$slots, "header", {}, () => [vue.createElementVNode("div", {
           class: "title",
-          textContent: vue.toDisplayString(props.title)
-        }, null, 8, _hoisted_2$3), !!props.subtitle ? (vue.openBlock(), vue.createElementBlock("div", {
+          textContent: vue.toDisplayString(_ctx.title)
+        }, null, 8, _hoisted_2$3), !!_ctx.subtitle ? (vue.openBlock(), vue.createElementBlock("div", {
           key: 0,
           class: "subtitle",
-          textContent: vue.toDisplayString(props.subtitle)
-        }, null, 8, _hoisted_3$2)) : vue.createCommentVNode("", true), props.disabled != true ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$2, [vue.createVNode(_sfc_main$s, {
+          textContent: vue.toDisplayString(_ctx.subtitle)
+        }, null, 8, _hoisted_3$2)) : vue.createCommentVNode("", true), _ctx.disabled != true ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$2, [vue.createVNode(_sfc_main$s, {
           type: "arrow",
           title: statusModel.value == "expand" ? "收起" : "展开",
           onClick: onStatusClick
@@ -2061,13 +2059,12 @@
       scroll: {}
     },
     setup(__props) {
-      const props = __props;
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.normalizeClass(["snail-layout", props.mode])
+          class: vue.normalizeClass(["snail-layout", _ctx.mode])
         }, [_ctx.$slots.start ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [vue.renderSlot(_ctx.$slots, "start")])) : vue.createCommentVNode("", true), vue.createVNode(_sfc_main$a, vue.mergeProps({
           class: "layout-body"
-        }, props.scroll), {
+        }, _ctx.scroll), {
           default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "default")]),
           _: 3
         }, 16), _ctx.$slots.end ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$2, [vue.renderSlot(_ctx.$slots, "end")])) : vue.createCommentVNode("", true)], 2);
@@ -2183,10 +2180,10 @@
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createBlock(_sfc_main$a, {
           class: vue.normalizeClass(["snail-table", {
-            "start-border": props.border == true
+            "start-border": _ctx.border == true
           }]),
-          "scroll-x": props.scrollX,
-          "scroll-y": props.scrollY
+          "scroll-x": _ctx.scrollX,
+          "scroll-y": _ctx.scrollY
         }, {
           default: vue.withCtx(() => [vue.createElementVNode("div", {
             class: "table-header",
@@ -2263,7 +2260,7 @@
       const styleRef = vue.computed(() => snail_view.css.buildStyle(props));
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.normalizeClass(["table-col", props.textAlign]),
+          class: vue.normalizeClass(["table-col", _ctx.textAlign]),
           style: vue.normalizeStyle(styleRef.value)
         }, [vue.renderSlot(_ctx.$slots, "default")], 6);
       };
@@ -2468,20 +2465,20 @@
         emits("click", node, parents);
       }
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [props.search ? (vue.openBlock(), vue.createBlock(_sfc_main$o, vue.mergeProps({
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2, [_ctx.search ? (vue.openBlock(), vue.createBlock(_sfc_main$o, vue.mergeProps({
           key: 0
-        }, props.search, {
+        }, _ctx.search, {
           onSearch
         }), null, 16)) : vue.createCommentVNode("", true), vue.createVNode(_sfc_main$a, {
           "scroll-y": true
         }, {
-          default: vue.withCtx(() => [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(props.nodes || [], node => {
+          default: vue.withCtx(() => [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.nodes || [], node => {
             return vue.openBlock(), vue.createBlock(_sfc_main$4, {
               key: vue.unref(context).getKey(node),
               node,
               parent: void 0,
               level: 1,
-              options: props.nodeOptions,
+              options: _ctx.nodeOptions,
               context: vue.unref(context),
               onClick: onTreeNodeClick
             }, {
@@ -2515,11 +2512,10 @@
       let {
         emit: __emit
       } = _ref;
-      const props = __props;
       const emits = __emit;
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.normalizeClass(["snail-wrapper", props.inPopup ? "in-popup" : "in-normal"])
+          class: vue.normalizeClass(["snail-wrapper", _ctx.inPopup ? "in-popup" : "in-normal"])
         }, [_ctx.header && _ctx.header.disabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$p, vue.mergeProps({
           key: 0
         }, _ctx.header || {
@@ -2611,21 +2607,21 @@
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
           class: vue.normalizeClass(["snail-input", {
-            "readonly": props.readonly
+            "readonly": _ctx.readonly
           }])
-        }, [!!props.title ? (vue.openBlock(), vue.createElementBlock("div", {
+        }, [!!_ctx.title ? (vue.openBlock(), vue.createElementBlock("div", {
           key: 0,
           class: "input-title",
           style: vue.normalizeStyle(titleStyleRef.value)
         }, [vue.createElementVNode("span", {
           class: "text",
-          textContent: vue.toDisplayString(props.title)
-        }, null, 8, _hoisted_1$1), props.readonly != true && props.required == true ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2)) : vue.createCommentVNode("", true)], 4)) : vue.createCommentVNode("", true), vue.createElementVNode("div", _hoisted_3, [vue.createElementVNode("input", {
+          textContent: vue.toDisplayString(_ctx.title)
+        }, null, 8, _hoisted_1$1), _ctx.readonly != true && _ctx.required == true ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2)) : vue.createCommentVNode("", true)], 4)) : vue.createCommentVNode("", true), vue.createElementVNode("div", _hoisted_3, [vue.createElementVNode("input", {
           ref: "input-el",
-          type: props.type || "text",
+          type: _ctx.type || "text",
           value: inputModel.value,
-          readonly: props.readonly == true,
-          placeholder: props.placeholder,
+          readonly: _ctx.readonly == true,
+          placeholder: _ctx.placeholder,
           title: inputModel.value,
           onChange: onValueChange,
           onClick: _cache[0] || (_cache[0] = $event => emits("click"))

package/dist/styles/snail.vue.vue.css CHANGED Viewed

@@ -1,47 +1,47 @@
 /* src:base\button.vue 	 index:0 */
-.snail-button{align-items:center;border-radius:2px;cursor:pointer;display:flex;display:inline-flex;justify-content:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.snail-button.max{height:40px;width:120px}.snail-button.middle{height:32px;width:90px}.snail-button.normal{height:28px;width:54px}.snail-button.small{height:20px;width:30px}.snail-button.primary{background-color:#5ca3ff;color:#fff}.snail-button.default{background-color:#fff;border:1px solid #dddfed;color:#2e2f33}.snail-button.link{color:#4c9aff}
+.snail-button{align-items:center;border-radius:2px;cursor:pointer;display:flex;display:inline-flex;justify-content:center;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}.snail-button.max{height:40px;width:120px}.snail-button.middle{height:32px;width:90px}.snail-button.normal{height:28px;width:54px}.snail-button.small{height:20px;width:30px}.snail-button.primary{background-color:#5ca3ff;color:#fff}.snail-button.default{background-color:#fff;border:1px solid #dddfed;color:#2e2f33}.snail-button.link{color:#4c9aff}
 /* src:base\choose.vue 	 index:0 */
 .snail-choose{align-items:center;display:flex;flex-wrap:wrap;overflow-x:hidden}.snail-choose>div.choose-item{align-items:center;cursor:pointer;display:flex;flex-shrink:0;margin:0 8px;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.snail-choose>div.choose-item:first-child{margin-left:0}.snail-choose>div.choose-item:after{content:"";height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%}.snail-choose>div.choose-item>input::checkmark{background-color:#2196f3;border-color:#2196f3}.snail-choose>div.choose-item>div.item-beautiful{align-items:center;display:flex;flex-shrink:0;justify-content:center;overflow:hidden}.snail-choose>div.choose-item>div.item-beautiful.radio{border-radius:50%;height:16px;width:16px}.snail-choose>div.choose-item>div.item-beautiful.checkbox{height:14px;width:14px}.snail-choose>div.choose-item>div.item-beautiful.item-unchecked{border:1px solid #8a9099}.snail-choose>div.choose-item>div.item-beautiful.item-checked{background-color:#4c9aff;border:1px solid #4c9aff}.snail-choose>div.choose-item>span{margin-left:4px}.snail-choose>div.choose-item>span.item-des{color:#8a9099}.snail-choose.readonly>div.choose-item{cursor:auto}.snail-choose.readonly>div.choose-item>div.item-beautiful.item-unchecked{opacity:.5}.snail-choose.readonly>div.choose-item>div.item-beautiful.item-checked{background-color:#d5d7db;border-color:#d5d7db}
+/* src:base\header.vue 	 index:0 */
+.snail-header{align-items:center;background-color:#fff;display:flex;flex-shrink:0;position:relative;width:100%}.snail-header>.header-title{color:#2e3033;flex:1;line-height:48px;overflow:hidden;padding:0 30px;text-overflow:ellipsis;white-space:nowrap;width:100%}.snail-header>.header-title.left{text-align:left}.snail-header>.header-title.center{text-align:center}.snail-header>.header-title.right{text-align:right}.snail-header.start-divider{border-bottom:1px solid #dddfed}.snail-header.page{height:48px}.snail-header.page>.header-title{font-size:16px;font-weight:bold}.snail-header.page>.close-icon{margin-right:18px}.snail-header.dialog{height:64px;padding-top:16px}.snail-header.dialog>.header-title{font-size:20px}.snail-header.dialog>.close-icon{position:absolute;right:8px;top:8px}
 /* src:base\footer.vue 	 index:0 */
 .snail-footer{align-items:center;background-color:#fff;display:flex;flex-shrink:0;height:72px;padding:0 40px;width:100%}.snail-footer>.snail-button:nth-child(n+2){margin-left:20px}.snail-footer.start-divider{border-top:1px solid #dddfed}.snail-footer.left{justify-content:flex-start}.snail-footer.center{justify-content:center}.snail-footer.right{justify-content:flex-end}
-/* src:base\search.vue 	 index:0 */
-.snail-search{align-items:center;background:#fff;display:flex;flex-shrink:0;height:34px}.snail-search>input{border-radius:0!important;flex:1;height:100%}.snail-search>div{align-items:center;border:1px solid #dddfed;border-left:none;display:flex;flex-shrink:0;height:100%;justify-content:center;width:34px}
 /* src:base\icon.vue 	 index:0 */
 .snail-icon{cursor:pointer;opacity:1}
-/* src:base\header.vue 	 index:0 */
-.snail-header{align-items:center;background-color:#fff;display:flex;flex-shrink:0;position:relative;width:100%}.snail-header>.header-title{color:#2e3033;flex:1;line-height:48px;overflow:hidden;padding:0 30px;text-overflow:ellipsis;white-space:nowrap;width:100%}.snail-header>.header-title.left{text-align:left}.snail-header>.header-title.center{text-align:center}.snail-header>.header-title.right{text-align:right}.snail-header.start-divider{border-bottom:1px solid #dddfed}.snail-header.page{height:48px}.snail-header.page>.header-title{font-size:16px;font-weight:bold}.snail-header.page>.close-icon{margin-right:18px}.snail-header.dialog{height:64px;padding-top:16px}.snail-header.dialog>.header-title{font-size:20px}.snail-header.dialog>.close-icon{position:absolute;right:8px;top:8px}
+/* src:base\search.vue 	 index:0 */
+.snail-search{align-items:center;background:#fff;display:flex;flex-shrink:0;height:34px}.snail-search>input{border-radius:0!important;flex:1;height:100%}.snail-search>div{align-items:center;border:1px solid #dddfed;border-left:none;display:flex;flex-shrink:0;height:100%;justify-content:center;width:34px}
 /* src:base\select.vue 	 index:0 */
 .snail-select{align-items:center;background-color:#fff;border:1px solid #dddfed;border-radius:4px;color:#2e3033;cursor:pointer;display:flex;height:32px;width:100%}.snail-select>div.select-result{align-items:center;display:flex;flex:1;flex-wrap:nowrap;height:30px;overflow:hidden;padding:0 10px 0 6px}.snail-select>div.select-result>div.select-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.snail-select>svg.snail-icon{flex-shrink:0;margin-right:4px}.snail-select>div.no-items{align-items:center;cursor:text;display:flex;height:100%;padding:0 8px;width:100%}.snail-select.readonly{cursor:auto}.snail-select.readonly>svg.snail-icon{display:none}
-/* src:container\dynamic.vue 	 index:0 */
-.snail-dynamic-error{color:red}.snail-dynamic-error>span{color:gray}
 /* src:base\switch.vue 	 index:0 */
 .snail-switch{border-radius:10px 10px 10px 10px;cursor:pointer;height:20px!important;overflow:hidden;position:relative;width:36px!important}.snail-switch>div{height:100%;width:100%}.snail-switch>div.on{background-color:#5ca3ff}.snail-switch>div.off{background-color:#c4c8cc;position:absolute;transition:left .2s ease}.snail-switch>div.status{background:#fff;border-radius:10px 10px 10px 10px;height:16px;position:absolute;top:2px;transition:left .2s ease;width:16px}.snail-switch.on>div.off{left:100%;top:0}.snail-switch.on>div.status{left:calc(100% - 18px)}.snail-switch.off>div.off{left:0;top:0}.snail-switch.off>div.status{left:2px}.snail-switch.readonly{cursor:not-allowed}
+/* src:container\dynamic.vue 	 index:0 */
+.snail-dynamic-error{color:red}.snail-dynamic-error>span{color:gray}
 /* src:container\fold.vue 	 index:0 */
 .snail-fold{flex-shrink:0}.snail-fold>div.fold-header{align-items:center;display:flex;height:32px;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none}.snail-fold>div.fold-header:before{background-color:#2c97fb;content:"";height:18px;left:0;position:absolute;top:7px;width:4px}.snail-fold>div.fold-header>.subtitle,.snail-fold>div.fold-header>.title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.snail-fold>div.fold-header>.title{color:#2e3033;font-weight:bold;padding-left:20px}.snail-fold>div.fold-header>.subtitle{color:#8a9099;font-size:13px}.snail-fold>div.fold-header>div.status{align-items:flex-end;display:flex;flex:1;justify-content:flex-end}.snail-fold>div.fold-header>div.status>svg.snail-icon{transition:transform .2s ease}.snail-fold>div.fold-body{padding-left:20px}.snail-fold.expand>div.fold-header>div.status>svg.snail-icon{transform:rotate(-90deg)}.snail-fold.fold>div.fold-header>div.status>svg.snail-icon{transform:rotate(90deg)}
-/* src:container\scroll.vue 	 index:0 */
-.snail-scroll{overflow:hidden}.snail-scroll.scroll-x{overflow-x:auto}.snail-scroll.scroll-y{overflow-y:auto}
 /* src:container\layout.vue 	 index:0 */
 .snail-layout{display:flex;height:100%;overflow:hidden;width:100%}.snail-layout>.layout-end,.snail-layout>.layout-start{flex-shrink:0}.snail-layout>.layout-body{flex:1}.snail-layout.horizontal{flex-direction:row}.snail-layout.horizontal>div{height:100%}.snail-layout.horizontal>.layout-end,.snail-layout.horizontal>.layout-start{width:-moz-fit-content;width:fit-content}.snail-layout.vertical{flex-direction:column}.snail-layout.vertical>div{width:100%}.snail-layout.vertical>.layout-end,.snail-layout.vertical>.layout-start{height:-moz-fit-content;height:fit-content}
 /* src:container\table.vue 	 index:0 */
 .snail-table{display:flex;flex-direction:column}.snail-table>div.table-footer,.snail-table>div.table-header{align-items:center;display:flex;flex-shrink:0;width:100%}.snail-table>div.table-header{background-color:#fff;position:sticky!important;top:0;z-index:1}.snail-table>div.table-body{flex:1;width:100%}.snail-table.start-border>div.table-body>.table-row>.table-col:nth-child(n+2),.snail-table.start-border>div.table-footer>.table-col:nth-child(n+2),.snail-table.start-border>div.table-header>.table-col:nth-child(n+2){border-left:none!important}.snail-table.start-border>div.table-body>.table-row>.table-col,.snail-table.start-border>div.table-footer>.table-col{border-top:none!important}
+/* src:container\scroll.vue 	 index:0 */
+.snail-scroll{overflow:hidden}.snail-scroll.scroll-x{overflow-x:auto}.snail-scroll.scroll-y{overflow-y:auto}
+/* src:container\components\table-col.vue 	 index:0 */
+.table-col{align-items:center;display:flex;height:100%;white-space:nowrap}.table-col.left{justify-content:flex-start}.table-col.center{justify-content:center}.table-col.right{justify-content:flex-end}
 /* src:container\sort.vue 	 index:0 */
 .snail-sort-drag{background:#fff;border:1px solid #4c9aff;border-radius:4px;cursor:move}.snail-sort-ghost{border:1px dashed #4c9aff;border-radius:4px}
 /* src:container\components\table-row.vue 	 index:0 */
 .table-row{align-items:center;display:flex}
 /* src:container\tree.vue 	 index:0 */
 .snail-tree{background-color:#fff;display:flex;flex-direction:column}.snail-tree .snail-search{flex-shrink:0;margin:12px}.snail-tree .snail-scroll{flex:1}
-/* src:container\components\table-col.vue 	 index:0 */
-.table-col{align-items:center;display:flex;height:100%;white-space:nowrap}.table-col.left{justify-content:flex-start}.table-col.center{justify-content:center}.table-col.right{justify-content:flex-end}
 /* src:container\wrapper.vue 	 index:0 */
 .snail-wrapper{background-color:#fff;display:flex;flex-direction:column}.snail-wrapper>.snail-scroll{flex:1}.snail-wrapper.in-normal{flex:1;height:100%;overflow:hidden;width:100%}.snail-wrapper.in-popup{height:80%;min-width:800px;overflow:hidden;width:60%}
 /* src:form\input.vue 	 index:0 */
 .snail-input{display:inline-flex;min-height:34px}.snail-input>.input-title{flex-shrink:0;padding-top:6px}.snail-input>.input-title>span.text{color:#2e3033}.snail-input>.input-title>span.required{color:#f74b4b;margin-left:2px}.snail-input>.input-body{align-self:start;display:flex;flex:1;height:32px}.snail-input>.input-body>input{flex:1}.snail-input>.input-body>span{background-color:red;flex-shrink:0}
-/* src:prompt\loading.vue 	 index:0 */
-.snail-loading{height:100%;left:0;position:absolute;top:0;width:100%;z-index:10000}.snail-loading.show-mask{background-color:rgba(0,0,0,.15)}.snail-loading:after,.snail-loading:before{animation:snail-loading-stretch 1s ease-in-out infinite;border-radius:50%;content:"";display:block;display:inline-block;height:10px;left:50%;margin-left:-18px;margin-top:-6px;position:absolute;top:50%;width:10px}.snail-loading:before{background-color:#279bf1}.snail-loading:after{animation-delay:-.5s;background:#64d214;margin-left:0;margin-right:-18px}@keyframes snail-loading-stretch{0%,to{transform:scale(1)}50%{transform:scale(2)}}.snail-loading-enter-active,.snail-loading-leave-active{transition:opacity .3s ease-in-out}.snail-loading-enter-from,.snail-loading-leave-to{opacity:0}
-/* src:prompt\empty.vue 	 index:0 */
-.snail-empty{align-items:center;display:flex;flex-direction:column;height:100%;justify-content:center;min-height:150px;width:100%}.snail-empty>img{height:60px;width:60px}.snail-empty>div.message{color:#babdc2;font-weight:400;padding:0 10px 10px}
 /* src:prompt\drag-verify.vue 	 index:0 */
 .snail-drag-verify{background:#f8f9fa;border:1px solid #dddfed;border-radius:8px;height:40px;overflow:hidden;position:relative;width:100%}.snail-drag-verify>div{height:100%;width:100%}.snail-drag-verify>.drag-progress{background-color:#0c6;transition:width .5s ease-in-out}.snail-drag-verify>.drag-handle,.snail-drag-verify>.verify-message{left:0;position:absolute;top:0;transition:left .5s ease-in-out}.snail-drag-verify>.verify-message{background-image:-webkit-linear-gradient(left,#666,#666 45%,#fff 50%,#666 55%,#666);-webkit-text-fill-color:transparent;align-items:center;animation:snail-drag-verify 2s linear infinite;-webkit-background-clip:text;background-clip:text;background-size:200% 100%;color:#7e848c;display:flex;font-size:12px;font-weight:400;justify-content:center;-webkit-user-select:none;-moz-user-select:none;user-select:none}.snail-drag-verify>.drag-handle{align-items:center;background-color:#fff;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQBAMAAADt3eJSAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAnUExURQAAAGBQUGBaWmJZWWJYWGNYWGNZWWJYWGJZWWBYWGNYWGNZWWRYWIqwlb0AAAANdFJOUwAQMMDQoFBgcCCw4ECQ8pPMAAAAP0lEQVQI12NgwATTGBgawAwRBYZwMIPRiYErAcxSFmA0AjN4HBikBcCsUgYmQxQGE0wKphhIQrSzwAyEW4EOACHhB32zIad6AAAAAElFTkSuQmCC);background-position:50%;background-repeat:no-repeat;border-right:1px solid #dddfed;cursor:move;display:flex;justify-content:center;width:40px}.snail-drag-verify.dragging>.drag-handle,.snail-drag-verify.dragging>.drag-progress{transition:none!important}.snail-drag-verify.success>.verify-message{-webkit-text-fill-color:#fff;color:#fff}.snail-drag-verify.success>.drag-handle>svg{background:#76c61d;border-radius:50%;padding:4px}@keyframes snail-drag-verify{0%{background-position:0 0}to{background-position:-200% 0}}
+/* src:prompt\empty.vue 	 index:0 */
+.snail-empty{align-items:center;display:flex;flex-direction:column;height:100%;justify-content:center;min-height:150px;width:100%}.snail-empty>img{height:60px;width:60px}.snail-empty>div.message{color:#babdc2;font-weight:400;padding:0 10px 10px}
+/* src:prompt\loading.vue 	 index:0 */
+.snail-loading{height:100%;left:0;position:absolute;top:0;width:100%;z-index:10000}.snail-loading.show-mask{background-color:rgba(0,0,0,.15)}.snail-loading:after,.snail-loading:before{animation:snail-loading-stretch 1s ease-in-out infinite;border-radius:50%;content:"";display:block;display:inline-block;height:10px;left:50%;margin-left:-18px;margin-top:-6px;position:absolute;top:50%;width:10px}.snail-loading:before{background-color:#279bf1}.snail-loading:after{animation-delay:-.5s;background:#64d214;margin-left:0;margin-right:-18px}@keyframes snail-loading-stretch{0%,to{transform:scale(1)}50%{transform:scale(2)}}.snail-loading-enter-active,.snail-loading-leave-active{transition:opacity .3s ease-in-out}.snail-loading-enter-from,.snail-loading-leave-to{opacity:0}
 /* src:popup\components\confirm-container.vue 	 index:0 */
 .snail-confirm{background-color:#fff;border-radius:4px;color:#2e2f33;display:flex;flex-direction:column;max-height:350px;max-width:548px;min-width:348px}.snail-confirm>div.confirm-body{flex:1;margin:20px 40px;overflow:auto;word-wrap:break-word}
 /* src:popup\components\dialog-container.vue 	 index:0 */

package/package.json CHANGED Viewed

@@ -3,7 +3,7 @@
   "description": "依赖【snail】，基于vue封装常用UI组件",
   "author": "snail_dev@163.com",
   "license": "MIT",
-  "version": "1.0.50",
+  "version": "1.0.52",
   "type": "module",
   "main": "dist/snail.vue.js",
   "module": "dist/snail.vue.js",