snail.vue 2.0.15 → 2.0.16

package/dist/snail.vue.d.ts

@@ -1677,16 +1677,32 @@ type NumberEvents = ChangeEvents<number> & {
  */
 type IconOptions = TitleOptions & {
     /**
-     * 图标类型
+     * 是否为自定义图标
+     * - 为true时，外部通过插槽自己绘制图标
+     * - 为false时，使用`type`值绘制对应的内置图标
+     * - 默认false
      */
-    type: IconType;
+    custom?: boolean;
     /**
-     * 图形伸展
-     * - svg.viewBox 属性
-     * - 为空则默认“0 0 1024 1024”
+     * 内置的图标类型
+     * - `custom`为false时生效
      */
-    viewBox?: string;
+    type?: IconType;
     /**
+     * 是否是按钮图标
+     * - true时，鼠标移入时 cursor:pointer;
+     */
+    button?: boolean;
+    /**
+     * 图标大小
+     * - 可指定对象，如 { width: 24, height: 24 }，则图标大小为 24 * 24
+     * - 可指定数字，如 24，则图标大小为 24 * 24
+     * - 默认 24
+     */
+    size?: number | {
+        width?: number;
+        height?: number;
+    }; /**
      * 图标颜色
      */
     color?: string;
@@ -1694,35 +1710,18 @@ type IconOptions = TitleOptions & {
      * 鼠标移入时的图标颜色
      */
     hoverColor?: string;
-    /**
-     * 图标大小：默认24
-     */
-    size?: number;
-    /**
-     * 轮廓描边颜色
-     * - 配合 strokeWidth 使用，完成图标加粗效果等
-     * @see https://developer.mozilla.org/zh-CN/docs/Web/SVG/Reference/Attribute/stroke
-     */
-    stroke?: string;
-    /**
-     * 轮廓宽度
-     * - 配合 stroke 使用，完成图标加粗效果等
-     * @see https://developer.mozilla.org/zh-CN/docs/Web/SVG/Reference/Attribute/stroke-width
-     */
-    strokeWidth?: number;
-    /**
-     * 图标绘制路径
-     * - 等效 svg-path的d属性
-     * - 仅在type为 custom 时生效
-     * - 若为数组，则表示多条绘制路径
-     */
-    draw?: string | string[];
     /**
      * 旋转角度
      * - 默认0
      * - 通过：transform: rotate(1.06); 实现
      */
     rotate?: number;
+    /**
+     * 图形伸展
+     * - svg.viewBox 属性
+     * - 为空则默认“0 0 1024 1024”
+     */
+    viewBox?: string;
 };
 /**
  * 图标类型
@@ -1744,9 +1743,8 @@ type IconOptions = TitleOptions & {
  * - - plus         加号
  * - - subtract     减号
  * - - grip         紧握图标，垂直方向，一般用于拖动句柄
- * - - custom       自定义图标：此时IconOptions.draw属性传入绘制路径
  */
-type IconType = "success" | "error" | "warn" | "close" | "trash" | "download" | "print" | "edit" | "arrow" | "datepicker" | "timepicker" | "plus" | "subtract" | "grip" | "custom";
+type IconType = "success" | "error" | "warn" | "close" | "trash" | "download" | "print" | "edit" | "arrow" | "datepicker" | "timepicker" | "plus" | "subtract" | "grip";
 
 /**
  * 检查选项 数据结构
@@ -2042,12 +2040,11 @@ declare function triggerAppCreated(app: App, type?: AppType): App;
  */
 
 /**
- * 基于类型获取Svg图标绘制路径
+ * 获取内置图标绘制路径
  * @param iconType 图标类型
- * @param draw 绘制路径；自定义时生效
  * @returns 图标路径
  */
-declare function getSvgDraw(iconType: IconType, draw: string[] | string): string[];
+declare function getBuiltinIcon(iconType: IconType): string[];
 
 /**
  * 动态加载组件 组件配置选项
@@ -2682,7 +2679,23 @@ declare const components: {
             default?: (props: {}) => any;
         };
     });
-    Icon: vue.DefineComponent<IconOptions, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<IconOptions> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
+    Icon: {
+        new (...args: any[]): vue.CreateComponentPublicInstanceWithMixins<Readonly<IconOptions> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, vue.PublicProps, {}, true, {}, {}, vue.GlobalComponents, vue.GlobalDirectives, string, {}, any, vue.ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<IconOptions> & Readonly<{}>, {}, {}, {}, {}, {}>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & vue.ComponentOptionsBase<Readonly<IconOptions> & Readonly<{}>, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, {}, {}, string, {}, vue.GlobalComponents, vue.GlobalDirectives, string, vue.ComponentProvideOptions> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new () => {
+        $slots: {
+            default?: (props: {}) => any;
+        };
+    });
     Input: vue.DefineComponent<ReadonlyOptions & PlaceholderOptions & TitleOptions & {
         type?: "text" | "number" | "password";
         required?: boolean;
@@ -3264,5 +3277,5 @@ declare const components: {
     });
 };
 
-export { MOTION, components, getSvgDraw, mount, onAppCreated, triggerAppCreated, usePicker, usePopup, useReactive, useTreeContext };
+export { MOTION, components, getBuiltinIcon, mount, onAppCreated, triggerAppCreated, usePicker, usePopup, useReactive, useTreeContext };
 export type { ButtonOptions, ChangeEvents, ChooseEvents, ChooseItem, ChooseOptions, ClickEvents, CloseEvents, ComponentBindOptions, ComponentOptions, ConfirmAreaOptions, ConfirmOptions, DatePickerDayItem, DatePickerMonthItem, DatePickerOptions, DatePickerYearItem, DatetimeDisabledOptions, DatetimePickerEvents, DeleteEvents, DialogHandle, DialogOptions, DisabledOptions, DragVerifyInfo, DragVerifyOptions, EmitterType, EmptyOptions, EventsType, FoldEvents, FoldOptions, FoldStatus, FollowElectResult, FollowExtend, FollowHandle, FollowOptions, FollowPositionOptions, FollowStrategy, FollowStrategyOptions, FooterEvents, FooterOptions, HeaderEvents, HeaderOptions, INumberFormatter, IPickerManager, IPopupManager, IReactiveManager, ISelectContext, ITreeBaseContext, IconOptions, IconType, InputEvents, InputOptions, LayoutAraeOptions, LayoutAreaItem, LayoutOptions, LoadingOptions, MessageOptions, MotionEffectOptions, MotionOptions, MoveEvents, NumberBaseOptions, NumberEvents, NumberFormatResult, NumberOptions, PickerExtend, PickerPopupOptions, PlaceholderOptions, PopupDescriptor, PopupHandle, PopupOptions, PopupStatus, PopupStatusOptions, PropsType, ReactiveVar, ReadonlyOptions, ScrollEvents, ScrollOptions, ScrollStatus, SearchEvents, SearchOptions, SelectBaseEvents, SelectBaseOptions, SelectEvents, SelectItem, SelectNodeEvents, SelectNodeOptions, SelectOptions, SelectPopupEvents, SelectPopupExtend, SelectPopupOptions, SelectSlotOptions, SlotsType, SortEvent, SortEvents, SortGroupHook, SortGroupOptions, SortOptions, SwitchEvents, SwitchOptions, TableColOptions, TableOptions, TableRowOptions, TextareaEvents, TextareaOptions, TimePickerHourItem, TimePickerMinuteItem, TimePickerOptions, TimePickerSecondItem, TitleOptions, ToastOptions, TreeEvents, TreeNode, TreeNodeEvents, TreeNodeExtend, TreeNodeModel, TreeNodeOptions, TreeNodeRenderOptions, TreeNodeSlotOptions, TreeOptions, TreeSearchResult, ValueOptions, WrapperEvents, WrapperOptions };

package/dist/snail.vue.js

@@ -1,6 +1,6 @@
 //@ sourceURL=/snail.vue.js
-import { defineComponent, createElementBlock, openBlock, normalizeClass, renderSlot, createTextVNode, shallowRef, normalizeStyle, unref, createElementVNode, toDisplayString, Fragment, renderList, mergeModels, useModel, computed, createCommentVNode, createBlock, nextTick, useTemplateRef, createVNode, watch, withDirectives, isRef, vModelText, createApp, resolveDynamicComponent, TransitionGroup, Transition, mergeProps, withCtx, normalizeProps, guardReactiveProps, ref, onErrorCaptured, createSlots, onMounted, withModifiers, getCurrentInstance, resolveComponent, onBeforeUnmount, getCurrentScope, onScopeDispose } from 'vue';
-import { throwError, isArrayNotEmpty, isStringNotEmpty, correctString, useKey, isArray, mountScope, useScopes, throwIfFalse, isPromise, wait, isObject, isNumberNotNaN, hasAny, mustFunction, useScope, removeFromArray, mustObject, hasOwnProperty, correctNumber, isString, script, delay, useTimer, defer, useAsyncScope, useHook, newId, throwIfTrue, isFunction, getTimeNumber, getDateValue, parseDate, formatDateValue, getDateByValue, parseTimeValue, getTimeValue, padStart, formatTimeValue, parseDateValue, correctDateFormat, isValidTime, getFromArray, onMountScope } from 'snail.core';
+import { defineComponent, createElementBlock, openBlock, normalizeClass, renderSlot, createTextVNode, shallowRef, computed, mergeProps, unref, createElementVNode, toDisplayString, Fragment, renderList, mergeModels, useModel, normalizeStyle, createCommentVNode, createBlock, nextTick, useTemplateRef, createVNode, watch, withDirectives, isRef, vModelText, withCtx, createApp, resolveDynamicComponent, TransitionGroup, Transition, normalizeProps, guardReactiveProps, ref, onErrorCaptured, createSlots, onMounted, withModifiers, getCurrentInstance, resolveComponent, onBeforeUnmount, onActivated, vShow, getCurrentScope, onScopeDispose } from 'vue';
+import { throwError, isObject, correctNumber, correctString, useKey, isArray, mountScope, useScopes, throwIfFalse, isPromise, wait, isNumberNotNaN, isStringNotEmpty, hasAny, mustFunction, useScope, removeFromArray, mustObject, isArrayNotEmpty, hasOwnProperty, isString, script, delay, useTimer, defer, useAsyncScope, useHook, newId, throwIfTrue, isFunction, getTimeNumber, getDateValue, parseDate, formatDateValue, getDateByValue, parseTimeValue, getTimeValue, padStart, formatTimeValue, parseDateValue, correctDateFormat, isValidTime, getFromArray, onMountScope } from 'snail.core';
 import { css, link, useObserver, useAnimation } from 'snail.view';
 
 const _hoisted_1$l = ["title"];
@@ -25,7 +25,7 @@ var _sfc_main$A = defineComponent({
   }
 });
 
-function getSvgDraw(iconType, draw) {
+function getBuiltinIcon(iconType) {
   switch (iconType) {
     case "success":
       return ["M 102.272 613.285 a 48.9258 48.9258 0 0 1 -1.34967 -62.8444 l 26.0656 -31.2113 a 50.6129 50.6129 0 0 1 62.6756 -11.2192 l 199.583 121.218 c 19.4859 11.8097 49.0102 8.26677 65.9655 -8.01371 l 540.714 -519.625 a 40.3216 40.3216 0 0 1 57.9518 1.6871 l 37.9597 43.3583 a 47.5762 47.5762 0 0 1 -0.843545 62.4226 L 452.766 920.675 a 38.4658 38.4658 0 0 1 -56.8553 1.18097 L 102.272 613.285 Z"];
@@ -55,8 +55,6 @@ function getSvgDraw(iconType, draw) {
       return ["M768 554.666667H256c-25.6 0-42.666667-17.066667-42.666667-42.666667s17.066667-42.666667 42.666667-42.666667h512c25.6 0 42.666667 17.066667 42.666667 42.666667s-17.066667 42.666667-42.666667 42.666667z"];
     case "grip":
       return ["M 384 256 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 384 426.667 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 384 597.333 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 384 768 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 640 256 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 640 426.667 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 640 597.333 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 640 768 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z"];
-    case "custom":
-      return isArrayNotEmpty(draw) ? draw : isStringNotEmpty(draw) ? [draw] : throwError("options.draw must be a non-empty string or string array");
     default:
       {
         throwError(`not support icon type: ${iconType}.`);
@@ -65,48 +63,73 @@ function getSvgDraw(iconType, draw) {
   }
 }
 
-const _hoisted_1$k = ["viewBox", "width", "height"];
+const _hoisted_1$k = ["viewBox"];
 const _hoisted_2$c = ["textContent"];
-const _hoisted_3$a = ["fill", "stroke", "stroke-width", "d"];
+const _hoisted_3$a = ["d"];
 var _sfc_main$z = defineComponent({
-  ...{
-    name: "Icon",
-    inheritAttrs: true
-  },
   __name: "icon",
   props: {
     title: {},
+    custom: {
+      type: Boolean
+    },
     type: {},
-    viewBox: {},
+    button: {
+      type: Boolean
+    },
+    size: {},
     color: {},
     hoverColor: {},
-    size: {},
-    stroke: {},
-    strokeWidth: {},
-    draw: {},
-    rotate: {}
+    rotate: {},
+    viewBox: {}
   },
   setup(__props) {
+    const props = __props;
     const isMouseEnterRef = shallowRef(false);
+    const sizeRef = computed(() => {
+      if (isObject(props.size) == true) {
+        return {
+          width: correctNumber(props.size.width, 24),
+          height: correctNumber(props.size.height, 24)
+        };
+      } else {
+        const number = correctNumber(props.size, 24);
+        return {
+          width: number,
+          height: number
+        };
+      }
+    });
+    const styleRef = computed(() => {
+      const style = Object.create(null);
+      let fill = isMouseEnterRef.value ? correctString(props.hoverColor, props.color, true) : void 0;
+      fill == void 0 && (fill = correctString(props.color, void 0, true));
+      fill && (style.fill = fill);
+      const rotate = correctNumber(props.rotate, 0);
+      rotate != 0 && (style.transform = `rotate(${rotate}deg)`);
+      return style;
+    });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("svg", {
-        class: normalizeClass(["snail-icon", __props.type]),
-        viewBox: unref(correctString)(__props.viewBox, "0 0 1024 1024", false),
-        style: normalizeStyle(__props.rotate ? `transform: rotate(${__props.rotate}deg);` : ""),
-        width: __props.size || 24,
-        height: __props.size || 24,
+      return openBlock(), createElementBlock("svg", mergeProps({
+        class: ["snail-icon", __props.type, {
+          button: __props.button
+        }],
+        viewBox: unref(correctString)(__props.viewBox, "0 0 1024 1024", false)
+      }, sizeRef.value, {
+        style: styleRef.value,
         onMouseenter: _cache[0] || (_cache[0] = $event => isMouseEnterRef.value = true),
         onMouseleave: _cache[1] || (_cache[1] = $event => isMouseEnterRef.value = false)
-      }, [createElementVNode("title", {
+      }), [createElementVNode("title", {
         textContent: toDisplayString(__props.title || "")
-      }, null, 8, _hoisted_2$c), (openBlock(true), createElementBlock(Fragment, null, renderList(unref(getSvgDraw)(__props.type, __props.draw), d => {
+      }, null, 8, _hoisted_2$c), __props.custom == true ? renderSlot(_ctx.$slots, "default", {
+        key: 0
+      }) : (openBlock(true), createElementBlock(Fragment, {
+        key: 1
+      }, renderList(unref(getBuiltinIcon)(__props.type), d => {
         return openBlock(), createElementBlock("path", {
-          fill: isMouseEnterRef.value ? __props.hoverColor || __props.color : __props.color,
-          stroke: __props.stroke,
-          "stroke-width": __props.strokeWidth,
           d
         }, null, 8, _hoisted_3$a);
-      }), 256))], 46, _hoisted_1$k);
+      }), 256))], 16, _hoisted_1$k);
     };
   }
 });
@@ -307,10 +330,11 @@ var _sfc_main$w = defineComponent({
         class: normalizeClass(["header-title", __props.titleAlign])
       }, null, 10, _hoisted_1$i)) : createCommentVNode("", true), renderSlot(_ctx.$slots, "default"), __props.closeDisabled != true ? (openBlock(), createBlock(_sfc_main$z, {
         key: 1,
+        class: "close-icon",
         type: "close",
+        button: "",
         size: 22,
         color: __props.useTo == "page" ? "#2e3033" : "#464953",
-        class: "close-icon",
         onClick: _cache[0] || (_cache[0] = $event => emits("close"))
       }, null, 8, ["color"])) : createCommentVNode("", true)], 2);
     };
@@ -395,6 +419,7 @@ var _sfc_main$v = defineComponent({
         title: validateRef.value
       }, [createVNode(_sfc_main$z, {
         type: "error",
+        button: "",
         size: 16,
         color: "red"
       })], 8, _hoisted_5$4)) : createCommentVNode("", true)])], 2);
@@ -784,12 +809,14 @@ var _sfc_main$u = defineComponent({
         onClick: _cache[4] || (_cache[4] = $event => onStepClick(false))
       }, [createVNode(_sfc_main$z, {
         type: "subtract",
+        button: "",
         size: 20
       })]), createElementVNode("div", {
         class: "controls default plus",
         onClick: _cache[5] || (_cache[5] = $event => onStepClick(true))
       }, [createVNode(_sfc_main$z, {
         type: "plus",
+        button: "",
         size: 20
       })])], 64)) : unref(controls) == "right" ? (openBlock(), createElementBlock(Fragment, {
         key: 1
@@ -798,6 +825,7 @@ var _sfc_main$u = defineComponent({
         onClick: _cache[6] || (_cache[6] = $event => onStepClick(true))
       }, [createVNode(_sfc_main$z, {
         type: "arrow",
+        button: "",
         size: 20,
         rotate: 270
       })]), createElementVNode("div", {
@@ -805,6 +833,7 @@ var _sfc_main$u = defineComponent({
         onClick: _cache[7] || (_cache[7] = $event => onStepClick(false))
       }, [createVNode(_sfc_main$z, {
         type: "arrow",
+        button: "",
         size: 20,
         rotate: 90
       })])], 64)) : createCommentVNode("", true)], 2), unref(hasSuffix) ? (openBlock(), createElementBlock("div", _hoisted_4$5, [createElementVNode("span", {
@@ -826,7 +855,6 @@ var _sfc_main$u = defineComponent({
 });
 
 const _hoisted_1$f = ["placeholder", "readonly"];
-const searchIon = "M 860.16 824.32 l -163.84 -163.84 c 102.4 -120.32 97.28 -302.08 -17.92 -414.72 c -120.32 -120.32 -314.88 -120.32 -435.2 0 c -120.32 120.32 -120.32 314.88 0 435.2 c 112.64 112.64 294.4 120.32 414.72 17.92 l 163.84 163.84 c 10.24 10.24 25.6 10.24 35.84 0 c 12.8 -12.8 12.8 -28.16 2.56 -38.4 Z M 281.6 642.56 C 181.76 542.72 181.76 381.44 281.6 281.6 c 99.84 -99.84 261.12 -99.84 360.96 0 c 99.84 99.84 99.84 261.12 0 360.96 c -99.84 102.4 -261.12 102.4 -360.96 0 Z";
 var _sfc_main$t = defineComponent({
   ...{
     name: "Search",
@@ -876,11 +904,15 @@ var _sfc_main$t = defineComponent({
         trim: true
       }]]), createElementVNode("div", null, [createVNode(_sfc_main$z, {
         class: "search-button",
-        type: "custom",
-        draw: searchIon,
-        size: 24,
+        custom: "",
+        button: "",
         color: "#707070",
         onClick: _cache[2] || (_cache[2] = $event => onSearch(void 0))
+      }, {
+        default: withCtx(() => [...(_cache[3] || (_cache[3] = [createElementVNode("path", {
+          d: "M 860.16 824.32 l -163.84 -163.84 c 102.4 -120.32 97.28 -302.08 -17.92 -414.72 c -120.32 -120.32 -314.88 -120.32 -435.2 0 c -120.32 120.32 -120.32 314.88 0 435.2 c 112.64 112.64 294.4 120.32 414.72 17.92 l 163.84 163.84 c 10.24 10.24 25.6 10.24 35.84 0 c 12.8 -12.8 12.8 -28.16 2.56 -38.4 Z M 281.6 642.56 C 181.76 542.72 181.76 381.44 281.6 281.6 c 99.84 -99.84 261.12 -99.84 360.96 0 c 99.84 99.84 99.84 261.12 0 360.96 c -99.84 102.4 -261.12 102.4 -360.96 0 Z"
+        }, null, -1)]))]),
+        _: 1
       })])], 2);
     };
   }
@@ -1638,7 +1670,6 @@ var _sfc_main$l = defineComponent({
       closePopup
     } = __props.extOptions;
     const duration = props.duration > 0 ? props.duration : 1500;
-    const closeFillRef = ref("#707070");
     var destroyTimer;
     function onMouseEvent(isLeave) {
       destroyTimer && destroyTimer.destroy();
@@ -1651,22 +1682,22 @@ var _sfc_main$l = defineComponent({
         style: normalizeStyle({
           "z-index": __props.zIndex
         }),
-        onMouseenter: _cache[3] || (_cache[3] = $event => onMouseEvent(false)),
-        onMouseleave: _cache[4] || (_cache[4] = $event => onMouseEvent(true))
+        onMouseenter: _cache[1] || (_cache[1] = $event => onMouseEvent(false)),
+        onMouseleave: _cache[2] || (_cache[2] = $event => onMouseEvent(true))
       }, [unref(props).closeDisabled != true ? (openBlock(), createBlock(_sfc_main$z, {
         key: 0,
         class: "close-icon",
         type: "close",
-        fill: closeFillRef.value,
+        button: "",
         size: 20,
-        onMouseenter: _cache[0] || (_cache[0] = $event => closeFillRef.value = "red"),
-        onMouseleave: _cache[1] || (_cache[1] = $event => closeFillRef.value = "#707070"),
-        onClick: _cache[2] || (_cache[2] = $event => {
+        color: "#707070",
+        "hover-color": "red",
+        onClick: _cache[0] || (_cache[0] = $event => {
           unref(closePopup)();
         })
-      }, null, 8, ["fill"])) : createCommentVNode("", true), unref(props).type ? (openBlock(), createElementBlock("div", _hoisted_1$d, [createVNode(_sfc_main$z, {
+      })) : createCommentVNode("", true), unref(props).type ? (openBlock(), createElementBlock("div", _hoisted_1$d, [createVNode(_sfc_main$z, {
         type: unref(props).type,
-        fill: "#707070",
+        color: "#707070",
         size: 20
       }, null, 8, ["type"])])) : createCommentVNode("", true), createElementVNode("div", {
         class: "message",
@@ -1910,9 +1941,6 @@ function useSelectContext(items, selectsRef, separator) {
   return Object.freeze(context);
 }
 
-function getTwoArrowIconDraw() {
-  return "M759.467 533.333L469.333 243.2l29.867-29.867 320 320-320 320-29.867-29.866 290.134-290.134z m-298.667 0L170.667 243.2l29.866-29.867 320 320-320 320-29.866-29.866L460.8 533.333z";
-}
 function getNoDataBase64Image() {
   return "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoyREREODhFQ0M5M0UxMUU5ODlFREVENzc4Njk0RjQ2MiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoyREREODhFREM5M0UxMUU5ODlFREVENzc4Njk0RjQ2MiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjJEREQ4OEVBQzkzRTExRTk4OUVERUQ3Nzg2OTRGNDYyIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjJEREQ4OEVCQzkzRTExRTk4OUVERUQ3Nzg2OTRGNDYyIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8++keGxAAAA5lJREFUeNrsmktoE0EYx3eSTdpsk2abvnwcFBVp8QFqVPDgQaGgIogIoictelKKVhARBA8q+KAVrFqooh4qXgRfiHpTEHqw9iCKXqQHSVstpqlt0yabrP9p52K1yW72GTMf/JhZMrM7/3l+37REVVWhlMwjlJhxwVwwF8wFc8FcMBfsnIlGKg98TxRa9RbYAFYXUnl+XbjoRpiKXVXMU9qns3xK76CC/YC4QfA1MAg26aiTZGlQQ9la8AZ0g3VuENwLqsArsFVnXW+e30PgKVgGnoA+Nwi+Cw6DAHgGdmqoMwJoXJrJUcYPHoGN4C3Yl6e8rWv4Nmhma/kh2J6n/HW2JsdylLkKtoAPYAeYcPxYmmX32AjcAVHwPEfZFxreR2fAJ9Z5CbMaSYzceMxxDtN198vKo8Vt57ClYh0d4f/OtTTgOjpquaa8WEhldISM5DRYWYCXZdTS4DVoR9tSegdI9y6Nl1KBL5k/7JRto99HW/ZAtGralJ7DTtCPEUKUmqqKPlH0rtXgMZk2utms2jk0PEqPqt3gEOiybJdGjy5BcobmI7LUC7HrbRQ7HaR4PORoOBRoY+f0RbSp3spjqQNIPtEb8/vEqFMnixTwH0T6gPnwbZYIRk/uZWtHqApLQzaP7GyL1kSCPUinqIuKtjWZKhgvpFt1O82X+cXPXq9njdNHD2ZZC/aRTvZ4A20sN3OEz7IgXJDDkls8laV11aEBpHGaB62mCEbPNSA5QvNYO+88hDS6xcHABtbq9XiusMdTYJ4ZI3yBORdKZTBQ6zKnqq62OiQh7WdByzmjgqlzsWs6BAqW9xAiLHJdMECEY36f9zJ7pLt3oxHH4/j0O4kwWREoW8BuKvSYxG4utFoWjOoVHZErlg/+GP2I7ApwkgnXHy1h/VLntNJA76sROfgFI9CgoXh8OD72OJ3OHDA46Am4m3KhU7rSyJfRl2QiOaXVE3oPsU0mzPKw3RcAf5iiZEPaOkf9KsxcyVq7s1vu7SsZEQ5/LO81ydhk3I5Q05Y/tcQTExKLY/+9U2XV++PJVLMtZ7cdH0mlFfnnyPgIpm3s758y3Qj3NiNfY8sxlmeXNt2NhC/ej0grllXVdHIyVY/RbTD7G9iliZkXAIZsKqUspjjmjgolZlwwF1xigr8VoaYBI4I7ilBwl5Hw8JIwcx3aAha6XCj9t4ub4HzBjgfftLhgLpgL5oK5YC6YC+aCuWDt9luAAQC2EPxjL8cUkwAAAABJRU5ErkJggg==";
 }
@@ -1998,12 +2026,12 @@ var _sfc_main$j = defineComponent({
         textContent: toDisplayString(__props.item.text)
       }, null, 8, _hoisted_2$5), __props.item.type == "group" ? (openBlock(), createBlock(_sfc_main$z, {
         key: 0,
-        type: "arrow",
-        color: "#8a9099"
+        type: "arrow"
       })) : __props.multiple == true ? (openBlock(), createElementBlock("div", _hoisted_3$5, [createVNode(_sfc_main$z, {
         type: "success",
-        color: "white",
-        size: 12
+        button: "",
+        size: 12,
+        color: "white"
       })])) : createCommentVNode("", true)], 42, _hoisted_1$b)) : createCommentVNode("", true), showRef.value ? (openBlock(true), createElementBlock(Fragment, {
         key: 1
       }, renderList(unref(showChildrenRef), child => {
@@ -2376,11 +2404,9 @@ var _sfc_main$h = defineComponent({
       }, null, 8, _hoisted_3$4)), __props.readonly != true ? (openBlock(), createBlock(_sfc_main$z, {
         key: 2,
         type: "arrow",
+        button: "",
         size: 24,
-        color: "#8a9099",
-        style: {
-          "transform": "rotate(90deg)"
-        }
+        rotate: 90
       })) : createCommentVNode("", true)], 64)) : (openBlock(), createElementBlock("div", _hoisted_4$4, "暂无可选项"))], 2);
     };
   }
@@ -2592,10 +2618,13 @@ var _sfc_main$e = defineComponent({
         class: "subtitle ellipsis",
         textContent: toDisplayString(__props.subtitle)
       }, null, 8, _hoisted_3$3)) : createCommentVNode("", true), __props.disabled != true ? (openBlock(), createElementBlock("div", _hoisted_4$3, [createVNode(_sfc_main$z, {
+        custom: false,
         type: "arrow",
+        button: "",
         title: statusModel.value == "expand" ? "收起" : "展开",
+        rotate: statusModel.value == "expand" ? -90 : 90,
         onClick: onStatusClick
-      }, null, 8, ["title"])])) : createCommentVNode("", true)])]), createElementVNode("div", _hoisted_5$2, [renderSlot(_ctx.$slots, "default")], 512)], 2);
+      }, null, 8, ["title", "rotate"])])) : createCommentVNode("", true)])]), createElementVNode("div", _hoisted_5$2, [renderSlot(_ctx.$slots, "default")], 512)], 2);
     };
   }
 });
@@ -3042,8 +3071,7 @@ const _hoisted_3$2 = {
   class: "node-slot ellipsis"
 };
 const _hoisted_4$2 = {
-  key: 1,
-  class: "snail-tree-children hidden",
+  class: "snail-tree-children",
   ref: "children"
 };
 var _sfc_main$7 = defineComponent({
@@ -3071,10 +3099,6 @@ var _sfc_main$7 = defineComponent({
     const {
       transition
     } = useAnimation();
-    const {
-      watcher
-    } = useReactive();
-    const treeNodeDom = useTemplateRef("tree-node");
     const isHoveredRef = shallowRef(false);
     const showRef = computed(() => __props.context.isShow(__props.node, true));
     const showChildrenRef = computed(() => __props.context.isShowChildren(__props.node, true));
@@ -3131,28 +3155,22 @@ var _sfc_main$7 = defineComponent({
       parents = __props.parent ? [__props.parent, ...parents] : parents;
       emits("click", child, parents);
     }
-    watcher(isHoveredRef, newValue => {
-      treeNodeDom.value.classList.remove("hovered");
-      newValue && treeNodeDom.value.classList.add("hovered");
-    });
-    watcher(() => __props.context.isActived(__props.node), newValue => {
-      if (treeNodeDom.value) {
-        treeNodeDom.value.classList.remove("actived");
-        newValue && treeNodeDom.value.classList.add("actived");
-      }
-    });
-    onMounted(() => {
+    onMounted(async () => {
+      await nextTick();
       if (childrenDom.value) {
         __props.options.expandLevel != void 0 && __props.options.expandLevel < nextLevel && toggleFold();
-        childrenDom.value && childrenDom.value.classList.remove("hidden");
         nodeEmitsDisabled = false;
       }
     });
+    onActivated(() => {});
     return (_ctx, _cache) => {
       const _component_TreeNode = resolveComponent("TreeNode", true);
-      return openBlock(), createElementBlock(Fragment, null, [showRef.value ? (openBlock(), createElementBlock("div", {
-        key: 0,
-        class: normalizeClass(["snail-tree-node", __props.node.clickable ? "clickable" : "", `level-${__props.level}`]),
+      return openBlock(), createElementBlock(Fragment, null, [withDirectives(createElementVNode("div", {
+        class: normalizeClass(["snail-tree-node", `level-${__props.level}`, {
+          clickable: __props.node.clickable,
+          hovered: isHoveredRef.value,
+          actived: __props.context.isActived(__props.node)
+        }]),
         ref: "tree-node",
         onMouseenter: _cache[0] || (_cache[0] = $event => isHoveredRef.value = true),
         onMouseleave: _cache[1] || (_cache[1] = $event => isHoveredRef.value = false),
@@ -3162,21 +3180,24 @@ var _sfc_main$7 = defineComponent({
         key: 0
       }, unref(slotOptions)))) : (openBlock(), createElementBlock(Fragment, {
         key: 1
-      }, [_cache[4] || (_cache[4] = createElementVNode("div", {
+      }, [_cache[5] || (_cache[5] = createElementVNode("div", {
         class: "indent"
       }, null, -1)), __props.options.foldDisabled != true ? (openBlock(), createElementBlock("div", _hoisted_1$6, [showChildrenRef.value ? (openBlock(), createBlock(_sfc_main$z, {
         key: 0,
         class: normalizeClass(statusRef.value),
-        type: "custom",
-        size: 24,
-        color: "#8a8099",
-        draw: "M 298.667 426.667 l 213.333 256 l 213.333 -256 Z",
+        custom: "",
+        button: "",
         onClick: toggleFold
-      }, null, 8, ["class"])) : createCommentVNode("", true)])) : createCommentVNode("", true), createElementVNode("div", {
+      }, {
+        default: withCtx(() => [...(_cache[4] || (_cache[4] = [createElementVNode("path", {
+          d: "M 298.667 426.667 l 213.333 256 l 213.333 -256 Z"
+        }, null, -1)]))]),
+        _: 1
+      }, 8, ["class"])) : createCommentVNode("", true)])) : createCommentVNode("", true), createElementVNode("div", {
         class: "node-text ellipsis",
         title: __props.node.text,
         textContent: toDisplayString(__props.node.text)
-      }, null, 8, _hoisted_2$2), createElementVNode("div", _hoisted_3$2, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(slotOptions))))])], 64))], 34)) : createCommentVNode("", true), showRef.value && showChildrenRef.value ? (openBlock(), createElementBlock("div", _hoisted_4$2, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.node.children, child => {
+      }, null, 8, _hoisted_2$2), createElementVNode("div", _hoisted_3$2, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(slotOptions))))])], 64))], 34), [[vShow, showRef.value]]), withDirectives(createElementVNode("div", _hoisted_4$2, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.node.children, child => {
         return openBlock(), createBlock(_component_TreeNode, {
           key: __props.context.getKey(child),
           node: child,
@@ -3191,7 +3212,7 @@ var _sfc_main$7 = defineComponent({
           }, slotProps))]),
           _: 3
         }, 8, ["node", "parent", "options", "context"]);
-      }), 128))], 512)) : createCommentVNode("", true)], 64);
+      }), 128))], 512), [[vShow, showRef.value && showChildrenRef.value]])], 64);
     };
   }
 });
@@ -3870,6 +3891,7 @@ var _sfc_main$3 = defineComponent({
       }, createSlots({
         top: withCtx(() => [createVNode(_sfc_main$z, {
           type: "arrow",
+          button: "",
           rotate: 180,
           size: 26,
           onClick: _cache[0] || (_cache[0] = $event => buildPickerItems(stepRef.value, -1))
@@ -3889,6 +3911,7 @@ var _sfc_main$3 = defineComponent({
           onClick: _cache[2] || (_cache[2] = $event => onSwitchStepClick("month"))
         }, null, 8, _hoisted_3)) : createCommentVNode("", true)], 64))], 2), createVNode(_sfc_main$z, {
           type: "arrow",
+          button: "",
           size: 26,
           onClick: _cache[3] || (_cache[3] = $event => buildPickerItems(stepRef.value, 1))
         })]),
@@ -4101,9 +4124,10 @@ var _sfc_main$2 = defineComponent({
       }, null, 512), [[vModelText, valueRef.value]]), __props.readonly != true ? (openBlock(), createBlock(_sfc_main$z, {
         key: 0,
         type: "datepicker",
+        button: "",
+        size: 16,
         color: "#aeb6c2",
-        "hover-color": "#279bf1",
-        size: 16
+        "hover-color": "#279bf1"
       })) : createCommentVNode("", true)], 10, _hoisted_1$2);
     };
   }
@@ -4186,9 +4210,10 @@ var _sfc_main$1 = defineComponent({
       }, null, 512), [[vModelText, valueRef.value]]), __props.readonly != true ? (openBlock(), createBlock(_sfc_main$z, {
         key: 0,
         type: "timepicker",
+        button: "",
+        size: 20,
         color: "#aeb6c2",
-        "hover-color": "#279bf1",
-        size: 20
+        "hover-color": "#279bf1"
       })) : createCommentVNode("", true)], 10, _hoisted_1$1);
     };
   }
@@ -4223,7 +4248,6 @@ var _sfc_main = defineComponent({
       endX: 0,
       distance: 0
     });
-    const towArrowIcon = getTwoArrowIconDraw();
     function getMaxDistance() {
       return dragHandleDom.value.parentElement.getBoundingClientRect().width - dragHandleDom.value.getBoundingClientRect().width;
     }
@@ -4286,11 +4310,18 @@ var _sfc_main = defineComponent({
         color: "white"
       })) : (openBlock(), createBlock(_sfc_main$z, {
         key: 1,
-        type: "custom",
+        custom: "",
         size: 20,
-        color: "#948D8D",
-        draw: unref(towArrowIcon)
-      }, null, 8, ["draw"]))], 36)], 2);
+        color: "#948d8d",
+        style: {
+          "cursor": "move"
+        }
+      }, {
+        default: withCtx(() => [...(_cache[0] || (_cache[0] = [createElementVNode("path", {
+          d: "M759.467 533.333L469.333 243.2l29.867-29.867 320 320-320 320-29.867-29.866 290.134-290.134z m-298.667 0L170.667 243.2l29.866-29.867 320 320-320 320-29.866-29.866L460.8 533.333z"
+        }, null, -1)]))]),
+        _: 1
+      }))], 36)], 2);
     };
   }
 });
@@ -4329,4 +4360,4 @@ onMountScope(scope => {
   getCurrentScope() && onScopeDispose(scope.destroy);
 });
 
-export { MOTION, components, getSvgDraw, mount, onAppCreated, triggerAppCreated, usePicker, usePopup, useReactive, useTreeContext };
+export { MOTION, components, getBuiltinIcon, mount, onAppCreated, triggerAppCreated, usePicker, usePopup, useReactive, useTreeContext };

package/dist/snail.vue.umd.js

@@ -27,7 +27,7 @@
     }
   });
 
-  function getSvgDraw(iconType, draw) {
+  function getBuiltinIcon(iconType) {
     switch (iconType) {
       case "success":
         return ["M 102.272 613.285 a 48.9258 48.9258 0 0 1 -1.34967 -62.8444 l 26.0656 -31.2113 a 50.6129 50.6129 0 0 1 62.6756 -11.2192 l 199.583 121.218 c 19.4859 11.8097 49.0102 8.26677 65.9655 -8.01371 l 540.714 -519.625 a 40.3216 40.3216 0 0 1 57.9518 1.6871 l 37.9597 43.3583 a 47.5762 47.5762 0 0 1 -0.843545 62.4226 L 452.766 920.675 a 38.4658 38.4658 0 0 1 -56.8553 1.18097 L 102.272 613.285 Z"];
@@ -57,8 +57,6 @@
         return ["M768 554.666667H256c-25.6 0-42.666667-17.066667-42.666667-42.666667s17.066667-42.666667 42.666667-42.666667h512c25.6 0 42.666667 17.066667 42.666667 42.666667s-17.066667 42.666667-42.666667 42.666667z"];
       case "grip":
         return ["M 384 256 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 384 426.667 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 384 597.333 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 384 768 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 640 256 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 640 426.667 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 640 597.333 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z", "M 640 768 m -42.6667 0 a 42.6667 42.6667 0 1 0 85.3333 0 a 42.6667 42.6667 0 1 0 -85.3333 0 Z"];
-      case "custom":
-        return snail_core.isArrayNotEmpty(draw) ? draw : snail_core.isStringNotEmpty(draw) ? [draw] : snail_core.throwError("options.draw must be a non-empty string or string array");
       default:
         {
           snail_core.throwError(`not support icon type: ${iconType}.`);
@@ -67,48 +65,73 @@
     }
   }
 
-  const _hoisted_1$k = ["viewBox", "width", "height"];
+  const _hoisted_1$k = ["viewBox"];
   const _hoisted_2$c = ["textContent"];
-  const _hoisted_3$a = ["fill", "stroke", "stroke-width", "d"];
+  const _hoisted_3$a = ["d"];
   var _sfc_main$z = vue.defineComponent({
-    ...{
-      name: "Icon",
-      inheritAttrs: true
-    },
     __name: "icon",
     props: {
       title: {},
+      custom: {
+        type: Boolean
+      },
       type: {},
-      viewBox: {},
+      button: {
+        type: Boolean
+      },
+      size: {},
       color: {},
       hoverColor: {},
-      size: {},
-      stroke: {},
-      strokeWidth: {},
-      draw: {},
-      rotate: {}
+      rotate: {},
+      viewBox: {}
     },
     setup(__props) {
+      const props = __props;
       const isMouseEnterRef = vue.shallowRef(false);
+      const sizeRef = vue.computed(() => {
+        if (snail_core.isObject(props.size) == true) {
+          return {
+            width: snail_core.correctNumber(props.size.width, 24),
+            height: snail_core.correctNumber(props.size.height, 24)
+          };
+        } else {
+          const number = snail_core.correctNumber(props.size, 24);
+          return {
+            width: number,
+            height: number
+          };
+        }
+      });
+      const styleRef = vue.computed(() => {
+        const style = Object.create(null);
+        let fill = isMouseEnterRef.value ? snail_core.correctString(props.hoverColor, props.color, true) : void 0;
+        fill == void 0 && (fill = snail_core.correctString(props.color, void 0, true));
+        fill && (style.fill = fill);
+        const rotate = snail_core.correctNumber(props.rotate, 0);
+        rotate != 0 && (style.transform = `rotate(${rotate}deg)`);
+        return style;
+      });
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("svg", {
-          class: vue.normalizeClass(["snail-icon", __props.type]),
-          viewBox: vue.unref(snail_core.correctString)(__props.viewBox, "0 0 1024 1024", false),
-          style: vue.normalizeStyle(__props.rotate ? `transform: rotate(${__props.rotate}deg);` : ""),
-          width: __props.size || 24,
-          height: __props.size || 24,
+        return vue.openBlock(), vue.createElementBlock("svg", vue.mergeProps({
+          class: ["snail-icon", __props.type, {
+            button: __props.button
+          }],
+          viewBox: vue.unref(snail_core.correctString)(__props.viewBox, "0 0 1024 1024", false)
+        }, sizeRef.value, {
+          style: styleRef.value,
           onMouseenter: _cache[0] || (_cache[0] = $event => isMouseEnterRef.value = true),
           onMouseleave: _cache[1] || (_cache[1] = $event => isMouseEnterRef.value = false)
-        }, [vue.createElementVNode("title", {
+        }), [vue.createElementVNode("title", {
           textContent: vue.toDisplayString(__props.title || "")
-        }, null, 8, _hoisted_2$c), (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(getSvgDraw)(__props.type, __props.draw), d => {
+        }, null, 8, _hoisted_2$c), __props.custom == true ? vue.renderSlot(_ctx.$slots, "default", {
+          key: 0
+        }) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, {
+          key: 1
+        }, vue.renderList(vue.unref(getBuiltinIcon)(__props.type), d => {
           return vue.openBlock(), vue.createElementBlock("path", {
-            fill: isMouseEnterRef.value ? __props.hoverColor || __props.color : __props.color,
-            stroke: __props.stroke,
-            "stroke-width": __props.strokeWidth,
             d
           }, null, 8, _hoisted_3$a);
-        }), 256))], 46, _hoisted_1$k);
+        }), 256))], 16, _hoisted_1$k);
       };
     }
   });
@@ -309,10 +332,11 @@
           class: vue.normalizeClass(["header-title", __props.titleAlign])
         }, null, 10, _hoisted_1$i)) : vue.createCommentVNode("", true), vue.renderSlot(_ctx.$slots, "default"), __props.closeDisabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$z, {
           key: 1,
+          class: "close-icon",
           type: "close",
+          button: "",
           size: 22,
           color: __props.useTo == "page" ? "#2e3033" : "#464953",
-          class: "close-icon",
           onClick: _cache[0] || (_cache[0] = $event => emits("close"))
         }, null, 8, ["color"])) : vue.createCommentVNode("", true)], 2);
       };
@@ -397,6 +421,7 @@
           title: validateRef.value
         }, [vue.createVNode(_sfc_main$z, {
           type: "error",
+          button: "",
           size: 16,
           color: "red"
         })], 8, _hoisted_5$4)) : vue.createCommentVNode("", true)])], 2);
@@ -786,12 +811,14 @@
           onClick: _cache[4] || (_cache[4] = $event => onStepClick(false))
         }, [vue.createVNode(_sfc_main$z, {
           type: "subtract",
+          button: "",
           size: 20
         })]), vue.createElementVNode("div", {
           class: "controls default plus",
           onClick: _cache[5] || (_cache[5] = $event => onStepClick(true))
         }, [vue.createVNode(_sfc_main$z, {
           type: "plus",
+          button: "",
           size: 20
         })])], 64)) : vue.unref(controls) == "right" ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
           key: 1
@@ -800,6 +827,7 @@
           onClick: _cache[6] || (_cache[6] = $event => onStepClick(true))
         }, [vue.createVNode(_sfc_main$z, {
           type: "arrow",
+          button: "",
           size: 20,
           rotate: 270
         })]), vue.createElementVNode("div", {
@@ -807,6 +835,7 @@
           onClick: _cache[7] || (_cache[7] = $event => onStepClick(false))
         }, [vue.createVNode(_sfc_main$z, {
           type: "arrow",
+          button: "",
           size: 20,
           rotate: 90
         })])], 64)) : vue.createCommentVNode("", true)], 2), vue.unref(hasSuffix) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$5, [vue.createElementVNode("span", {
@@ -828,7 +857,6 @@
   });
 
   const _hoisted_1$f = ["placeholder", "readonly"];
-  const searchIon = "M 860.16 824.32 l -163.84 -163.84 c 102.4 -120.32 97.28 -302.08 -17.92 -414.72 c -120.32 -120.32 -314.88 -120.32 -435.2 0 c -120.32 120.32 -120.32 314.88 0 435.2 c 112.64 112.64 294.4 120.32 414.72 17.92 l 163.84 163.84 c 10.24 10.24 25.6 10.24 35.84 0 c 12.8 -12.8 12.8 -28.16 2.56 -38.4 Z M 281.6 642.56 C 181.76 542.72 181.76 381.44 281.6 281.6 c 99.84 -99.84 261.12 -99.84 360.96 0 c 99.84 99.84 99.84 261.12 0 360.96 c -99.84 102.4 -261.12 102.4 -360.96 0 Z";
   var _sfc_main$t = vue.defineComponent({
     ...{
       name: "Search",
@@ -878,11 +906,15 @@
           trim: true
         }]]), vue.createElementVNode("div", null, [vue.createVNode(_sfc_main$z, {
           class: "search-button",
-          type: "custom",
-          draw: searchIon,
-          size: 24,
+          custom: "",
+          button: "",
           color: "#707070",
           onClick: _cache[2] || (_cache[2] = $event => onSearch(void 0))
+        }, {
+          default: vue.withCtx(() => [...(_cache[3] || (_cache[3] = [vue.createElementVNode("path", {
+            d: "M 860.16 824.32 l -163.84 -163.84 c 102.4 -120.32 97.28 -302.08 -17.92 -414.72 c -120.32 -120.32 -314.88 -120.32 -435.2 0 c -120.32 120.32 -120.32 314.88 0 435.2 c 112.64 112.64 294.4 120.32 414.72 17.92 l 163.84 163.84 c 10.24 10.24 25.6 10.24 35.84 0 c 12.8 -12.8 12.8 -28.16 2.56 -38.4 Z M 281.6 642.56 C 181.76 542.72 181.76 381.44 281.6 281.6 c 99.84 -99.84 261.12 -99.84 360.96 0 c 99.84 99.84 99.84 261.12 0 360.96 c -99.84 102.4 -261.12 102.4 -360.96 0 Z"
+          }, null, -1)]))]),
+          _: 1
         })])], 2);
       };
     }
@@ -1640,7 +1672,6 @@
         closePopup
       } = __props.extOptions;
       const duration = props.duration > 0 ? props.duration : 1500;
-      const closeFillRef = vue.ref("#707070");
       var destroyTimer;
       function onMouseEvent(isLeave) {
         destroyTimer && destroyTimer.destroy();
@@ -1653,22 +1684,22 @@
           style: vue.normalizeStyle({
             "z-index": __props.zIndex
           }),
-          onMouseenter: _cache[3] || (_cache[3] = $event => onMouseEvent(false)),
-          onMouseleave: _cache[4] || (_cache[4] = $event => onMouseEvent(true))
+          onMouseenter: _cache[1] || (_cache[1] = $event => onMouseEvent(false)),
+          onMouseleave: _cache[2] || (_cache[2] = $event => onMouseEvent(true))
         }, [vue.unref(props).closeDisabled != true ? (vue.openBlock(), vue.createBlock(_sfc_main$z, {
           key: 0,
           class: "close-icon",
           type: "close",
-          fill: closeFillRef.value,
+          button: "",
           size: 20,
-          onMouseenter: _cache[0] || (_cache[0] = $event => closeFillRef.value = "red"),
-          onMouseleave: _cache[1] || (_cache[1] = $event => closeFillRef.value = "#707070"),
-          onClick: _cache[2] || (_cache[2] = $event => {
+          color: "#707070",
+          "hover-color": "red",
+          onClick: _cache[0] || (_cache[0] = $event => {
             vue.unref(closePopup)();
           })
-        }, null, 8, ["fill"])) : vue.createCommentVNode("", true), vue.unref(props).type ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$d, [vue.createVNode(_sfc_main$z, {
+        })) : vue.createCommentVNode("", true), vue.unref(props).type ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$d, [vue.createVNode(_sfc_main$z, {
           type: vue.unref(props).type,
-          fill: "#707070",
+          color: "#707070",
           size: 20
         }, null, 8, ["type"])])) : vue.createCommentVNode("", true), vue.createElementVNode("div", {
           class: "message",
@@ -1912,9 +1943,6 @@
     return Object.freeze(context);
   }
 
-  function getTwoArrowIconDraw() {
-    return "M759.467 533.333L469.333 243.2l29.867-29.867 320 320-320 320-29.867-29.866 290.134-290.134z m-298.667 0L170.667 243.2l29.866-29.867 320 320-320 320-29.866-29.866L460.8 533.333z";
-  }
   function getNoDataBase64Image() {
     return "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoyREREODhFQ0M5M0UxMUU5ODlFREVENzc4Njk0RjQ2MiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoyREREODhFREM5M0UxMUU5ODlFREVENzc4Njk0RjQ2MiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjJEREQ4OEVBQzkzRTExRTk4OUVERUQ3Nzg2OTRGNDYyIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjJEREQ4OEVCQzkzRTExRTk4OUVERUQ3Nzg2OTRGNDYyIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8++keGxAAAA5lJREFUeNrsmktoE0EYx3eSTdpsk2abvnwcFBVp8QFqVPDgQaGgIogIoictelKKVhARBA8q+KAVrFqooh4qXgRfiHpTEHqw9iCKXqQHSVstpqlt0yabrP9p52K1yW72GTMf/JhZMrM7/3l+37REVVWhlMwjlJhxwVwwF8wFc8FcMBfsnIlGKg98TxRa9RbYAFYXUnl+XbjoRpiKXVXMU9qns3xK76CC/YC4QfA1MAg26aiTZGlQQ9la8AZ0g3VuENwLqsArsFVnXW+e30PgKVgGnoA+Nwi+Cw6DAHgGdmqoMwJoXJrJUcYPHoGN4C3Yl6e8rWv4Nmhma/kh2J6n/HW2JsdylLkKtoAPYAeYcPxYmmX32AjcAVHwPEfZFxreR2fAJ9Z5CbMaSYzceMxxDtN198vKo8Vt57ClYh0d4f/OtTTgOjpquaa8WEhldISM5DRYWYCXZdTS4DVoR9tSegdI9y6Nl1KBL5k/7JRto99HW/ZAtGralJ7DTtCPEUKUmqqKPlH0rtXgMZk2utms2jk0PEqPqt3gEOiybJdGjy5BcobmI7LUC7HrbRQ7HaR4PORoOBRoY+f0RbSp3spjqQNIPtEb8/vEqFMnixTwH0T6gPnwbZYIRk/uZWtHqApLQzaP7GyL1kSCPUinqIuKtjWZKhgvpFt1O82X+cXPXq9njdNHD2ZZC/aRTvZ4A20sN3OEz7IgXJDDkls8laV11aEBpHGaB62mCEbPNSA5QvNYO+88hDS6xcHABtbq9XiusMdTYJ4ZI3yBORdKZTBQ6zKnqq62OiQh7WdByzmjgqlzsWs6BAqW9xAiLHJdMECEY36f9zJ7pLt3oxHH4/j0O4kwWREoW8BuKvSYxG4utFoWjOoVHZErlg/+GP2I7ApwkgnXHy1h/VLntNJA76sROfgFI9CgoXh8OD72OJ3OHDA46Am4m3KhU7rSyJfRl2QiOaXVE3oPsU0mzPKw3RcAf5iiZEPaOkf9KsxcyVq7s1vu7SsZEQ5/LO81ydhk3I5Q05Y/tcQTExKLY/+9U2XV++PJVLMtZ7cdH0mlFfnnyPgIpm3s758y3Qj3NiNfY8sxlmeXNt2NhC/ej0grllXVdHIyVY/RbTD7G9iliZkXAIZsKqUspjjmjgolZlwwF1xigr8VoaYBI4I7ilBwl5Hw8JIwcx3aAha6XCj9t4ub4HzBjgfftLhgLpgL5oK5YC6YC+aCuWDt9luAAQC2EPxjL8cUkwAAAABJRU5ErkJggg==";
   }
@@ -2000,12 +2028,12 @@
           textContent: vue.toDisplayString(__props.item.text)
         }, null, 8, _hoisted_2$5), __props.item.type == "group" ? (vue.openBlock(), vue.createBlock(_sfc_main$z, {
           key: 0,
-          type: "arrow",
-          color: "#8a9099"
+          type: "arrow"
         })) : __props.multiple == true ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$5, [vue.createVNode(_sfc_main$z, {
           type: "success",
-          color: "white",
-          size: 12
+          button: "",
+          size: 12,
+          color: "white"
         })])) : vue.createCommentVNode("", true)], 42, _hoisted_1$b)) : vue.createCommentVNode("", true), showRef.value ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, {
           key: 1
         }, vue.renderList(vue.unref(showChildrenRef), child => {
@@ -2378,11 +2406,9 @@
         }, null, 8, _hoisted_3$4)), __props.readonly != true ? (vue.openBlock(), vue.createBlock(_sfc_main$z, {
           key: 2,
           type: "arrow",
+          button: "",
           size: 24,
-          color: "#8a9099",
-          style: {
-            "transform": "rotate(90deg)"
-          }
+          rotate: 90
         })) : vue.createCommentVNode("", true)], 64)) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$4, "暂无可选项"))], 2);
       };
     }
@@ -2594,10 +2620,13 @@
           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$z, {
+          custom: false,
           type: "arrow",
+          button: "",
           title: statusModel.value == "expand" ? "收起" : "展开",
+          rotate: statusModel.value == "expand" ? -90 : 90,
           onClick: onStatusClick
-        }, null, 8, ["title"])])) : vue.createCommentVNode("", true)])]), vue.createElementVNode("div", _hoisted_5$2, [vue.renderSlot(_ctx.$slots, "default")], 512)], 2);
+        }, null, 8, ["title", "rotate"])])) : vue.createCommentVNode("", true)])]), vue.createElementVNode("div", _hoisted_5$2, [vue.renderSlot(_ctx.$slots, "default")], 512)], 2);
       };
     }
   });
@@ -3044,8 +3073,7 @@
     class: "node-slot ellipsis"
   };
   const _hoisted_4$2 = {
-    key: 1,
-    class: "snail-tree-children hidden",
+    class: "snail-tree-children",
     ref: "children"
   };
   var _sfc_main$7 = vue.defineComponent({
@@ -3073,10 +3101,6 @@
       const {
         transition
       } = snail_view.useAnimation();
-      const {
-        watcher
-      } = useReactive();
-      const treeNodeDom = vue.useTemplateRef("tree-node");
       const isHoveredRef = vue.shallowRef(false);
       const showRef = vue.computed(() => __props.context.isShow(__props.node, true));
       const showChildrenRef = vue.computed(() => __props.context.isShowChildren(__props.node, true));
@@ -3133,28 +3157,22 @@
         parents = __props.parent ? [__props.parent, ...parents] : parents;
         emits("click", child, parents);
       }
-      watcher(isHoveredRef, newValue => {
-        treeNodeDom.value.classList.remove("hovered");
-        newValue && treeNodeDom.value.classList.add("hovered");
-      });
-      watcher(() => __props.context.isActived(__props.node), newValue => {
-        if (treeNodeDom.value) {
-          treeNodeDom.value.classList.remove("actived");
-          newValue && treeNodeDom.value.classList.add("actived");
-        }
-      });
-      vue.onMounted(() => {
+      vue.onMounted(async () => {
+        await vue.nextTick();
         if (childrenDom.value) {
           __props.options.expandLevel != void 0 && __props.options.expandLevel < nextLevel && toggleFold();
-          childrenDom.value && childrenDom.value.classList.remove("hidden");
           nodeEmitsDisabled = false;
         }
       });
+      vue.onActivated(() => {});
       return (_ctx, _cache) => {
         const _component_TreeNode = vue.resolveComponent("TreeNode", true);
-        return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [showRef.value ? (vue.openBlock(), vue.createElementBlock("div", {
-          key: 0,
-          class: vue.normalizeClass(["snail-tree-node", __props.node.clickable ? "clickable" : "", `level-${__props.level}`]),
+        return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [vue.withDirectives(vue.createElementVNode("div", {
+          class: vue.normalizeClass(["snail-tree-node", `level-${__props.level}`, {
+            clickable: __props.node.clickable,
+            hovered: isHoveredRef.value,
+            actived: __props.context.isActived(__props.node)
+          }]),
           ref: "tree-node",
           onMouseenter: _cache[0] || (_cache[0] = $event => isHoveredRef.value = true),
           onMouseleave: _cache[1] || (_cache[1] = $event => isHoveredRef.value = false),
@@ -3164,21 +3182,24 @@
           key: 0
         }, vue.unref(slotOptions)))) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, {
           key: 1
-        }, [_cache[4] || (_cache[4] = vue.createElementVNode("div", {
+        }, [_cache[5] || (_cache[5] = vue.createElementVNode("div", {
           class: "indent"
         }, null, -1)), __props.options.foldDisabled != true ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [showChildrenRef.value ? (vue.openBlock(), vue.createBlock(_sfc_main$z, {
           key: 0,
           class: vue.normalizeClass(statusRef.value),
-          type: "custom",
-          size: 24,
-          color: "#8a8099",
-          draw: "M 298.667 426.667 l 213.333 256 l 213.333 -256 Z",
+          custom: "",
+          button: "",
           onClick: toggleFold
-        }, null, 8, ["class"])) : vue.createCommentVNode("", true)])) : vue.createCommentVNode("", true), vue.createElementVNode("div", {
+        }, {
+          default: vue.withCtx(() => [...(_cache[4] || (_cache[4] = [vue.createElementVNode("path", {
+            d: "M 298.667 426.667 l 213.333 256 l 213.333 -256 Z"
+          }, null, -1)]))]),
+          _: 1
+        }, 8, ["class"])) : vue.createCommentVNode("", true)])) : vue.createCommentVNode("", true), vue.createElementVNode("div", {
           class: "node-text ellipsis",
           title: __props.node.text,
           textContent: vue.toDisplayString(__props.node.text)
-        }, null, 8, _hoisted_2$2), vue.createElementVNode("div", _hoisted_3$2, [vue.renderSlot(_ctx.$slots, "default", vue.normalizeProps(vue.guardReactiveProps(vue.unref(slotOptions))))])], 64))], 34)) : vue.createCommentVNode("", true), showRef.value && showChildrenRef.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$2, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.node.children, child => {
+        }, null, 8, _hoisted_2$2), vue.createElementVNode("div", _hoisted_3$2, [vue.renderSlot(_ctx.$slots, "default", vue.normalizeProps(vue.guardReactiveProps(vue.unref(slotOptions))))])], 64))], 34), [[vue.vShow, showRef.value]]), vue.withDirectives(vue.createElementVNode("div", _hoisted_4$2, [(vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.node.children, child => {
           return vue.openBlock(), vue.createBlock(_component_TreeNode, {
             key: __props.context.getKey(child),
             node: child,
@@ -3193,7 +3214,7 @@
             }, slotProps))]),
             _: 3
           }, 8, ["node", "parent", "options", "context"]);
-        }), 128))], 512)) : vue.createCommentVNode("", true)], 64);
+        }), 128))], 512), [[vue.vShow, showRef.value && showChildrenRef.value]])], 64);
       };
     }
   });
@@ -3872,6 +3893,7 @@
         }, vue.createSlots({
           top: vue.withCtx(() => [vue.createVNode(_sfc_main$z, {
             type: "arrow",
+            button: "",
             rotate: 180,
             size: 26,
             onClick: _cache[0] || (_cache[0] = $event => buildPickerItems(stepRef.value, -1))
@@ -3891,6 +3913,7 @@
             onClick: _cache[2] || (_cache[2] = $event => onSwitchStepClick("month"))
           }, null, 8, _hoisted_3)) : vue.createCommentVNode("", true)], 64))], 2), vue.createVNode(_sfc_main$z, {
             type: "arrow",
+            button: "",
             size: 26,
             onClick: _cache[3] || (_cache[3] = $event => buildPickerItems(stepRef.value, 1))
           })]),
@@ -4103,9 +4126,10 @@
         }, null, 512), [[vue.vModelText, valueRef.value]]), __props.readonly != true ? (vue.openBlock(), vue.createBlock(_sfc_main$z, {
           key: 0,
           type: "datepicker",
+          button: "",
+          size: 16,
           color: "#aeb6c2",
-          "hover-color": "#279bf1",
-          size: 16
+          "hover-color": "#279bf1"
         })) : vue.createCommentVNode("", true)], 10, _hoisted_1$2);
       };
     }
@@ -4188,9 +4212,10 @@
         }, null, 512), [[vue.vModelText, valueRef.value]]), __props.readonly != true ? (vue.openBlock(), vue.createBlock(_sfc_main$z, {
           key: 0,
           type: "timepicker",
+          button: "",
+          size: 20,
           color: "#aeb6c2",
-          "hover-color": "#279bf1",
-          size: 20
+          "hover-color": "#279bf1"
         })) : vue.createCommentVNode("", true)], 10, _hoisted_1$1);
       };
     }
@@ -4225,7 +4250,6 @@
         endX: 0,
         distance: 0
       });
-      const towArrowIcon = getTwoArrowIconDraw();
       function getMaxDistance() {
         return dragHandleDom.value.parentElement.getBoundingClientRect().width - dragHandleDom.value.getBoundingClientRect().width;
       }
@@ -4288,11 +4312,18 @@
           color: "white"
         })) : (vue.openBlock(), vue.createBlock(_sfc_main$z, {
           key: 1,
-          type: "custom",
+          custom: "",
           size: 20,
-          color: "#948D8D",
-          draw: vue.unref(towArrowIcon)
-        }, null, 8, ["draw"]))], 36)], 2);
+          color: "#948d8d",
+          style: {
+            "cursor": "move"
+          }
+        }, {
+          default: vue.withCtx(() => [...(_cache[0] || (_cache[0] = [vue.createElementVNode("path", {
+            d: "M759.467 533.333L469.333 243.2l29.867-29.867 320 320-320 320-29.867-29.866 290.134-290.134z m-298.667 0L170.667 243.2l29.866-29.867 320 320-320 320-29.866-29.866L460.8 533.333z"
+          }, null, -1)]))]),
+          _: 1
+        }))], 36)], 2);
       };
     }
   });
@@ -4333,7 +4364,7 @@
 
   exports.MOTION = MOTION;
   exports.components = components;
-  exports.getSvgDraw = getSvgDraw;
+  exports.getBuiltinIcon = getBuiltinIcon;
   exports.mount = mount;
   exports.onAppCreated = onAppCreated;
   exports.triggerAppCreated = triggerAppCreated;

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

@@ -7,68 +7,68 @@
 /* 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}.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\icon.vue 	 index:0 */
-.snail-icon{cursor:pointer;opacity:1}
+.snail-icon{fill:#8a8099;opacity:1;transition:all .2s linear}.snail-icon.button{cursor:pointer}
 /* src:base\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:base\select.vue 	 index:0 */
-.snail-select{align-items:center;border:1px solid #dddfed;border-radius:4px;color:#2e3033;display:flex;height:32px;width:100%}.snail-select:not(.readonly){background-color:#fff}.snail-select:not(.readonly,.empty){cursor:pointer}.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.placeholder{flex:1;padding:0 10px 0 6px}.snail-select>svg.snail-icon{flex-shrink:0;margin-right:4px}.snail-select>div.no-items{flex:1;padding:0 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\number.vue 	 index:0 */
+.snail-number{align-content:baseline;display:flex;flex-wrap:wrap;min-height:32px;overflow-x:hidden;position:relative;width:100%}.snail-number>.number-prefix,.snail-number>.number-suffix{align-items:center;background-color:#f5f7fa;border:1px solid #dddfed;color:#555;display:flex;flex-shrink:0;max-width:100px;padding:0 10px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.snail-number>.number-prefix{border-bottom-left-radius:4px;border-right:none;border-top-left-radius:4px}.snail-number>.number-suffix{border-bottom-right-radius:4px;border-left:none;border-top-right-radius:4px}.snail-number>.input-panel{flex:1;min-width:10px;overflow:hidden;position:relative}.snail-number>.input-panel>input{height:32px;width:100%}.snail-number>.input-panel>.controls{align-items:center;background-color:#f5f7fa;cursor:pointer;display:flex;justify-content:center;position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:30px}.snail-number>.input-panel>.controls>svg.snail-icon:hover{fill:#3292ea}.snail-number>.input-panel>.controls.default{height:calc(100% - 2px);top:1px}.snail-number>.input-panel>.controls.default.subtract{border-bottom-left-radius:4px;border-right:1px solid #dddfed;border-top-left-radius:4px;left:1px}.snail-number>.input-panel>.controls.default.plus{border-bottom-right-radius:4px;border-left:1px solid #dddfed;border-top-right-radius:4px;right:1px}.snail-number>.input-panel>.controls.right{border-left:1px solid #dddfed;height:calc(50% - 1px);right:1px}.snail-number>.input-panel>.controls.right.plus{border-top-right-radius:4px;top:1px}.snail-number>.input-panel>.controls.right.subtract{border-bottom-right-radius:4px;border-top:1px solid #dddfed;top:50%}.snail-number>.input-panel.default>input{padding-left:40px;padding-right:40px}.snail-number>.input-panel.right>input{padding-right:40px}.snail-number.has-prefix>.input-panel>input{border-bottom-left-radius:0;border-top-left-radius:0}.snail-number.has-suffix>.input-panel>input{border-bottom-right-radius:0;border-top-right-radius:0}.snail-number>.number-util{color:#aaa;flex-shrink:0;font-size:12px;line-height:20px;width:100%}
+/* src:base\select.vue 	 index:0 */
+.snail-select{align-items:center;border:1px solid #dddfed;border-radius:4px;color:#2e3033;display:flex;height:32px;width:100%}.snail-select:not(.readonly){background-color:#fff}.snail-select:not(.readonly,.empty){cursor:pointer}.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.placeholder{flex:1;padding:0 10px 0 6px}.snail-select>svg.snail-icon{flex-shrink:0;margin-right:4px}.snail-select>div.no-items{flex:1;padding:0 8px}
 /* 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:base\number.vue 	 index:0 */
-.snail-number{align-content:baseline;display:flex;flex-wrap:wrap;min-height:32px;overflow-x:hidden;position:relative;width:100%}.snail-number>.number-prefix,.snail-number>.number-suffix{align-items:center;background-color:#f5f7fa;border:1px solid #dddfed;color:#555;display:flex;flex-shrink:0;max-width:100px;padding:0 10px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.snail-number>.number-prefix{border-bottom-left-radius:4px;border-right:none;border-top-left-radius:4px}.snail-number>.number-suffix{border-bottom-right-radius:4px;border-left:none;border-top-right-radius:4px}.snail-number>.input-panel{flex:1;min-width:10px;overflow:hidden;position:relative}.snail-number>.input-panel>input{height:32px;width:100%}.snail-number>.input-panel>.controls{align-items:center;background-color:#f5f7fa;cursor:pointer;display:flex;justify-content:center;position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:30px}.snail-number>.input-panel>.controls>svg.snail-icon{fill:#8a9099}.snail-number>.input-panel>.controls>svg.snail-icon:hover{fill:#3292ea}.snail-number>.input-panel>.controls.default{height:calc(100% - 2px);top:1px}.snail-number>.input-panel>.controls.default.subtract{border-bottom-left-radius:4px;border-right:1px solid #dddfed;border-top-left-radius:4px;left:1px}.snail-number>.input-panel>.controls.default.plus{border-bottom-right-radius:4px;border-left:1px solid #dddfed;border-top-right-radius:4px;right:1px}.snail-number>.input-panel>.controls.right{border-left:1px solid #dddfed;height:calc(50% - 1px);right:1px}.snail-number>.input-panel>.controls.right.plus{border-top-right-radius:4px;top:1px}.snail-number>.input-panel>.controls.right.subtract{border-bottom-right-radius:4px;border-top:1px solid #dddfed;top:50%}.snail-number>.input-panel.default>input{padding-left:40px;padding-right:40px}.snail-number>.input-panel.right>input{padding-right:40px}.snail-number.has-prefix>.input-panel>input{border-bottom-left-radius:0;border-top-left-radius:0}.snail-number.has-suffix>.input-panel>input{border-bottom-right-radius:0;border-top-right-radius:0}.snail-number>.number-util{color:#aaa;flex-shrink:0;font-size:12px;line-height:20px;width:100%}
 /* src:base\textarea.vue 	 index:0 */
 textarea.snail-textarea{font-size:14px;line-height:1.5em;overflow-x:hidden;overflow-y:auto;resize:none;width:100%}
 /* 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>.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)}
+.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>.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-body{padding-left:20px}
+/* src:container\layout.vue 	 index:0 */
+.snail-layout{display:flex;flex-wrap:nowrap}.snail-layout,.snail-layout>div:not(.snail-scroll){overflow:hidden}.snail-layout>div.main-area{flex:1}.snail-layout.horizontal>div.left-area,.snail-layout.horizontal>div.right-area{flex-shrink:0;width:-moz-fit-content;width:fit-content}.snail-layout.vertical{flex-direction:column}.snail-layout.vertical>div.bottom-area,.snail-layout.vertical>div.top-area{flex-shrink:0;height:-moz-fit-content;height:fit-content}
 /* src:container\motion.vue 	 index:0 */
 
 /* src:container\scroll.vue 	 index:0 */
 .snail-scroll{--scroll-overflow:hidden;overflow:var(--scroll-overflow,hidden)}.snail-scroll::-webkit-scrollbar{height:var(--scroll-bar-size,10px);width:var(--scroll-bar-size,10px)}
 /* 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\layout.vue 	 index:0 */
-.snail-layout{display:flex;flex-wrap:nowrap}.snail-layout,.snail-layout>div:not(.snail-scroll){overflow:hidden}.snail-layout>div.main-area{flex:1}.snail-layout.horizontal>div.left-area,.snail-layout.horizontal>div.right-area{flex-shrink:0;width:-moz-fit-content;width:fit-content}.snail-layout.vertical{flex-direction:column}.snail-layout.vertical>div.bottom-area,.snail-layout.vertical>div.top-area{flex-shrink:0;height:-moz-fit-content;height:fit-content}
-/* 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\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\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: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:picker\date-picker.vue 	 index:0 */
+.snail-datepicker{height:32px;position:relative}.snail-datepicker>input:not(.readonly){cursor:pointer;padding-right:30px!important}.snail-datepicker>svg{position:absolute;right:8px;top:50%;transform:translateY(-50%)}
 /* src:picker\time-picker.vue 	 index:0 */
 .snail-timepicker{height:32px;position:relative}.snail-timepicker>input:not(.readonly){cursor:pointer;padding-right:34px!important}.snail-timepicker>svg{position:absolute;right:8px;top:50%;transform:translateY(-50%)}
 /* 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\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-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;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:picker\date-picker.vue 	 index:0 */
-.snail-datepicker{height:32px;position:relative}.snail-datepicker>input:not(.readonly){cursor:pointer;padding-right:30px!important}.snail-datepicker>svg{position:absolute;right:8px;top:50%;transform:translateY(-50%)}
+/* 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)}}
 /* src:picker\components\time-pc.vue 	 index:0 */
 .snail-layout.time-picker.pc{background-color:#fff;border:1px solid rgba(0,0,0,.12);border-radius:4px;box-shadow:0 0 3px rgba(0,0,0,.12);height:240px!important;overflow:hidden!important;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:210px!important}.snail-layout.time-picker.pc>.main-area{display:flex;flex-wrap:nowrap;justify-content:space-between;margin:10px;overflow:hidden}.snail-layout.time-picker.pc>.main-area>.tz-item{border:1px solid #eee;border-left:none;flex-shrink:0;overflow:hidden auto;width:30%}.snail-layout.time-picker.pc>.main-area>.tz-item>.tzi-number{align-items:center;border-left:1px solid #eee;cursor:pointer;display:flex;height:24px;justify-content:center}.snail-layout.time-picker.pc>.main-area>.tz-item>.tzi-number:hover{background-color:#f4f4f4}.snail-layout.time-picker.pc>.main-area>.tz-item>.tzi-number.active{background-color:#58a4fd;border-color:#58a4fd;color:#fff!important}.snail-layout.time-picker.pc>.main-area>.tz-item>.tzi-number.active.disabled{opacity:.6}.snail-layout.time-picker.pc>.main-area>.tz-item>.tzi-number.disabled{color:#ddd;cursor:not-allowed}.snail-layout.time-picker.pc>.main-area>.tz-item::-webkit-scrollbar{width:4px}.snail-layout.time-picker.pc>.main-area>.tz-item::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.6);border:none;border-radius:0}.snail-layout.time-picker.pc>.main-area>.tz-item::-webkit-scrollbar-track{background:rgba(0,0,0,.1);border-radius:0}.snail-layout.time-picker.pc>.bottom-area{align-items:center;border-top:1px solid #eee;display:flex;height:30px;justify-content:flex-end;padding-right:10px}.snail-layout.time-picker.pc>.bottom-area>.snail-button{color:#999;font-size:12px;margin-left:4px}.snail-layout.time-picker.pc>.bottom-area>.snail-button:hover,.snail-layout.time-picker.pc>.bottom-area>.snail-button:last-child{color:#58a4fd}.snail-layout.time-picker.pc>.bottom-area>.snail-button.disabled{cursor:not-allowed;opacity:.6}.snail-layout.time-picker.pc.second-disabled{width:180px}.snail-layout.time-picker.pc.second-disabled>.main-area>.tz-item{width:46%}
 /* src:picker\components\date-pc.vue 	 index:0 */
 .snail-layout.date-picker.pc{background-color:#fff;border:1px solid rgba(0,0,0,.12);border-radius:4px;box-shadow:0 0 3px rgba(0,0,0,.12);height:300px!important;overflow:hidden!important;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:280px!important}.snail-layout.date-picker.pc.time-now:after{background-color:gray;content:"";height:100%;left:0;opacity:.6;position:absolute;top:0;width:100%}.snail-layout.date-picker.pc>.top-area{align-items:center;border-bottom:1px solid #eee;display:flex;flex-wrap:nowrap;padding:0 4px}.snail-layout.date-picker.pc>.top-area>svg{fill:#8a9099;flex-shrink:0}.snail-layout.date-picker.pc>.top-area>svg:hover{fill:#58a4fd}.snail-layout.date-picker.pc>.top-area>div.header-content{align-items:center;display:flex;flex:1;justify-content:center}.snail-layout.date-picker.pc>.top-area>div.header-content>div{align-items:center;display:flex;font-size:16px;height:100%}.snail-layout.date-picker.pc>.top-area>div.header-content>div:nth-child(2){margin-left:8px}.snail-layout.date-picker.pc>.top-area>div.header-content:not(.year)>div:hover{color:#58a4fd;cursor:pointer}.snail-layout.date-picker.pc>.main-area{display:flex;flex-wrap:wrap;justify-content:space-between}.snail-layout.date-picker.pc>.main-area>div{align-items:center;display:flex;flex-shrink:0;font-size:13px;justify-content:center;position:relative}.snail-layout.date-picker.pc>.main-area>div>span{align-items:center;display:flex;height:28px;justify-content:center}.snail-layout.date-picker.pc>.main-area>div>span:hover{background:#f4f4f4;cursor:pointer}.snail-layout.date-picker.pc>.main-area>div.active>span{background-color:#58a4fd;color:#fff!important}.snail-layout.date-picker.pc>.main-area>div.active.disabled{opacity:.6}.snail-layout.date-picker.pc>.main-area>div.disabled>span{color:#aaa;cursor:not-allowed}.snail-layout.date-picker.pc>.main-area>div.day-item{height:30px;width:36px}.snail-layout.date-picker.pc>.main-area>div.day-item.week{font-weight:bold}.snail-layout.date-picker.pc>.main-area>div.day-item.active>span,.snail-layout.date-picker.pc>.main-area>div.day-item:hover>span{border-radius:100%;width:28px}.snail-layout.date-picker.pc>.main-area>div.day-item:not(.now-month)>span{color:#aaa}.snail-layout.date-picker.pc>.main-area>div.month-item,.snail-layout.date-picker.pc>.main-area>div.year-item{width:30%}.snail-layout.date-picker.pc>.main-area>div.month-item.active>span,.snail-layout.date-picker.pc>.main-area>div.month-item:hover>span,.snail-layout.date-picker.pc>.main-area>div.year-item.active>span,.snail-layout.date-picker.pc>.main-area>div.year-item:hover>span{border-radius:15px;padding:0 8px;width:-moz-fit-content;width:fit-content}.snail-layout.date-picker.pc>.bottom-area{align-items:center;border-top:1px solid #eee;display:flex;height:30px;justify-content:flex-end;padding-right:10px}.snail-layout.date-picker.pc>.bottom-area>.time-area{color:#58a4fd;cursor:pointer;font-size:12px;margin-left:10px;margin-right:auto}.snail-layout.date-picker.pc>.bottom-area>.snail-button{color:#999;font-size:12px;margin-left:4px}.snail-layout.date-picker.pc>.bottom-area>.snail-button:hover,.snail-layout.date-picker.pc>.bottom-area>.snail-button:last-child{color:#58a4fd}.snail-layout.date-picker.pc>.bottom-area>.snail-button.disabled{cursor:not-allowed;opacity:.6}
 /* src:popup\components\confirm-container.vue 	 index:0 */
 .snail-confirm{background-color:#fff;border-radius:4px;color:#2e2f33;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\follow-container.vue 	 index:0 */
-.snail-follow{background-color:#fff;max-height:100%;max-width:100%;position:fixed;transition-duration:.1s;transition-property:left,top;transition-timing-function:ease}.snail-follow.initial{top:100%;transition:none}
 /* src:popup\components\dialog-container.vue 	 index:0 */
 .snail-dialog{align-items:center;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%}.snail-dialog:before{background-color:rgba(24,27,33,.45);content:"";height:100%;opacity:1;position:absolute;transition:opacity .4s ease-in-out;width:100%}.snail-dialog>.dialog-body{background-color:#fff;border-radius:4px;box-shadow:0 0 15px rgba(0,0,0,.3);position:relative}.snail-dialog.unactive:before{opacity:0}.snail-dialog.unactive>.dialog-body{box-shadow:0 0 4px rgba(0,0,0,.3)}
 /* src:popup\components\popup-container.vue 	 index:0 */
 .snail-popup{left:0;position:fixed;top:0}
+/* src:popup\components\follow-container.vue 	 index:0 */
+.snail-follow{background-color:#fff;max-height:100%;max-width:100%;position:fixed;transition-duration:.1s;transition-property:left,top;transition-timing-function:ease}.snail-follow.initial{top:100%;transition:none}
 /* src:popup\components\toast-container.vue 	 index:0 */
 .snail-toast{background:rgba(0,0,0,.7);border-radius:10px;color:#fff;display:flex;left:50%;max-height:200px;max-width:400px;min-width:200px;overflow:hidden;padding:20px 35px 20px 15px;position:fixed;top:50%;transform:translate(-50%,-50%)}.snail-toast>svg.close-icon{position:absolute;right:10px;top:12px}.snail-toast>div.icon{align-items:center;align-self:center;background:hsla(0,0%,100%,.15);border-radius:50%;display:flex;height:26px;justify-content:center;margin-right:6px;width:26px}.snail-toast>div.icon>svg{background:#fff;border-radius:50%;cursor:none!important;padding:2px}.snail-toast>div.message{flex:1;line-height:24px;overflow:hidden;word-break:break-all}
-/* src:base\components\select-popup.vue 	 index:0 */
-.snail-select-popup{background:#fff;border:1px solid #dddfed;border-radius:4px;box-shadow:0 1px 5px 1px #dddfed;display:flex;flex-direction:column;max-height:90%;min-height:32px;overflow:auto}.snail-select-popup>div.snail-search{margin:12px}.snail-select-popup>div.clear-all{align-items:center;background-color:#fff;border-top:1px solid #dddfed;bottom:0;color:#8a9099;cursor:pointer;display:flex;flex-shrink:0;height:32px;padding:0 12px;position:sticky!important;z-index:1}.snail-select-popup>div.clear-all:hover{color:#ff4c4c}.snail-select-popup.child-popup{max-width:250px;min-width:200px;padding-bottom:6px;padding-top:6px}.snail-select-popup.child-popup.placeholder{justify-content:center;padding:0 12px;width:100px!important}
 /* src:container\components\tree-node.vue 	 index:0 */
 .snail-tree-node{align-items:center;display:flex;flex-wrap:nowrap;height:40px;width:100%}.snail-tree-node:hover{background-color:#f8f9fa}.snail-tree-node>.indent,.snail-tree-node>.node-slot,.snail-tree-node>.snail-icon{flex-shrink:0}.snail-tree-node>.node-fold{align-items:center;display:flex;height:100%;justify-content:center;width:24px}.snail-tree-node>.node-fold>.snail-icon{transition:transform .1s ease-in}.snail-tree-node>.node-fold>.snail-icon.fold{transform:rotate(-90deg)}.snail-tree-node>.node-text{color:#2e3033;flex:1;min-width:30px}.snail-tree-node.clickable{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.snail-tree-children{width:100%}.snail-tree-children.hidden{display:none;height:0;overflow:hidden}.snail-tree-node.level-1>.indent{padding-left:4px}.snail-tree-node.level-2>.indent{padding-left:24px}.snail-tree-node.level-3>.indent{padding-left:48px}.snail-tree-node.level-4>.indent{padding-left:72px}.snail-tree-node.level-5>.indent{padding-left:96px}.snail-tree-node.level-6>.indent{padding-left:120px}.snail-tree-node.level-7>.indent{padding-left:144px}.snail-tree-node.level-8>.indent{padding-left:168px}.snail-tree-node.level-9>.indent{padding-left:192px}.snail-tree-node.level-10>.indent{padding-left:216px}
+/* src:base\components\select-popup.vue 	 index:0 */
+.snail-select-popup{background:#fff;border:1px solid #dddfed;border-radius:4px;box-shadow:0 1px 5px 1px #dddfed;display:flex;flex-direction:column;max-height:90%;min-height:32px;overflow:auto}.snail-select-popup>div.snail-search{margin:12px}.snail-select-popup>div.clear-all{align-items:center;background-color:#fff;border-top:1px solid #dddfed;bottom:0;color:#8a9099;cursor:pointer;display:flex;flex-shrink:0;height:32px;padding:0 12px;position:sticky!important;z-index:1}.snail-select-popup>div.clear-all:hover{color:#ff4c4c}.snail-select-popup.child-popup{max-width:250px;min-width:200px;padding-bottom:6px;padding-top:6px}.snail-select-popup.child-popup.placeholder{justify-content:center;padding:0 12px;width:100px!important}
 /* src:base\components\select-node.vue 	 index:0 */
-.snail-select-popup>div.select-node{align-items:center;display:flex;flex-shrink:0;flex-wrap:nowrap;height:32px;padding-left:12px}.snail-select-popup>div.select-node:hover{background:#f8f9fa}.snail-select-popup>div.select-node.clickable{cursor:pointer}.snail-select-popup>div.select-node.group{color:#8a9099}.snail-select-popup>div.select-node.item{color:#2e3033;padding-right:10px}.snail-select-popup>div.select-node.selected{color:#4c9aff!important}.snail-select-popup>div.select-node>div.item-text{flex:1}.snail-select-popup>div.select-node>svg.snail-icon{cursor:default;display:none}.snail-select-popup>div.select-node>div.select-status{background:#fff;border:1px solid #8a9099;flex-shrink:0;height:14px;margin-left:4px;width:14px}.snail-select-popup>div.select-node>div.select-status>svg{display:none}.snail-select-popup>div.select-node.selected>div.select-status{background-color:#5ca3ff;border:1px solid #5ca3ff}.snail-select-popup>div.select-node.selected>div.select-status>svg{display:block}.snail-select-popup>div.select-node.child{color:#2e3033;padding-left:24px}.snail-select-popup>div.select-node.child>svg.snail-icon{display:initial}
+.snail-select-popup>div.select-node{align-items:center;display:flex;flex-shrink:0;flex-wrap:nowrap;height:32px;padding-left:12px}.snail-select-popup>div.select-node:hover{background:#f8f9fa}.snail-select-popup>div.select-node.clickable{cursor:pointer}.snail-select-popup>div.select-node.group{color:#8a9099}.snail-select-popup>div.select-node.item{color:#2e3033;padding-right:10px}.snail-select-popup>div.select-node.selected{color:#4c9aff!important}.snail-select-popup>div.select-node>div.item-text{flex:1}.snail-select-popup>div.select-node>svg.snail-icon{display:none}.snail-select-popup>div.select-node>div.select-status{background:#fff;border:1px solid #8a9099;flex-shrink:0;height:14px;margin-left:4px;width:14px}.snail-select-popup>div.select-node>div.select-status>svg{display:none}.snail-select-popup>div.select-node.selected>div.select-status{background-color:#5ca3ff;border:1px solid #5ca3ff}.snail-select-popup>div.select-node.selected>div.select-status>svg{display:block}.snail-select-popup>div.select-node.child{color:#2e3033;padding-left:24px}.snail-select-popup>div.select-node.child>svg.snail-icon{display:initial}

package/package.json

@@ -3,7 +3,7 @@
   "description": "依赖【snail】，基于vue封装常用UI组件",
   "author": "snail_dev@163.com",
   "license": "MIT",
-  "version": "2.0.15",
+  "version": "2.0.16",
   "type": "module",
   "main": "dist/snail.vue.js",
   "module": "dist/snail.vue.js",
@@ -14,7 +14,7 @@
   },
   "dependencies": {
     "vue": "^3.5.14",
-    "snail.core": ">=2.0.26",
+    "snail.core": ">=2.0.28",
     "snail.view": ">=2.0.4",
     "sortablejs": ">=1.15.6"
   },