@varlet/ui 2.21.0 → 2.21.1-alpha.1705566892480

package/lib/varlet.cjs.js

@@ -1846,7 +1846,7 @@ var stdin_default$3o = {
   useLocale
 };
 const { name: name$1e, n: n$1l, classes: classes$17 } = createNamespace("action-sheet");
-const _hoisted_1$u = ["onClick"];
+const _hoisted_1$v = ["onClick"];
 function __render__$1l(_ctx, _cache) {
   const _component_var_icon = vue.resolveComponent("var-icon");
   const _component_var_popup = vue.resolveComponent("var-popup");
@@ -1920,7 +1920,7 @@ function __render__$1l(_ctx, _cache) {
                     3
                     /* TEXT, CLASS */
                   )
-                ], 14, _hoisted_1$u)), [
+                ], 14, _hoisted_1$v)), [
                   [_directive_ripple, { disabled: action.disabled }]
                 ]);
               }),
@@ -2500,7 +2500,7 @@ const props$1c = {
 };
 const isInternalSize$1 = (size) => ["mini", "small", "normal", "large"].includes(size);
 const { name: name$1c, n: n$1j, classes: classes$15 } = createNamespace("avatar");
-const _hoisted_1$t = ["src", "alt", "lazy-loading", "lazy-error"];
+const _hoisted_1$u = ["src", "alt", "lazy-loading", "lazy-error"];
 const _hoisted_2$g = ["src", "alt"];
 function __render__$1j(_ctx, _cache) {
   const _directive_lazy = vue.resolveDirective("lazy");
@@ -2540,7 +2540,7 @@ function __render__$1j(_ctx, _cache) {
             "lazy-loading": _ctx.loading,
             "lazy-error": _ctx.error,
             onLoad: _cache[0] || (_cache[0] = (...args) => _ctx.handleLoad && _ctx.handleLoad(...args))
-          }, null, 46, _hoisted_1$t)), [
+          }, null, 46, _hoisted_1$u)), [
             [_directive_lazy, _ctx.src]
           ]) : (vue.openBlock(), vue.createElementBlock("img", {
             key: 1,
@@ -2693,7 +2693,7 @@ const props$1a = {
 };
 const { name: name$1a, n: n$1h, classes: classes$13 } = createNamespace("loading");
 const _withScopeId$7 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-const _hoisted_1$s = /* @__PURE__ */ _withScopeId$7(() => /* @__PURE__ */ vue.createElementVNode(
+const _hoisted_1$t = /* @__PURE__ */ _withScopeId$7(() => /* @__PURE__ */ vue.createElementVNode(
   "svg",
   { viewBox: "25 25 50 50" },
   [
@@ -2708,7 +2708,7 @@ const _hoisted_1$s = /* @__PURE__ */ _withScopeId$7(() => /* @__PURE__ */ vue.cr
   /* HOISTED */
 ));
 const _hoisted_2$f = [
-  _hoisted_1$s
+  _hoisted_1$t
 ];
 function __render__$1h(_ctx, _cache) {
   return vue.openBlock(), vue.createElementBlock(
@@ -3108,7 +3108,7 @@ function useButtonGroup() {
   };
 }
 const { name: name$18, n: n$1f, classes: classes$11 } = createNamespace("button");
-const _hoisted_1$r = ["type", "disabled"];
+const _hoisted_1$s = ["type", "disabled"];
 function __render__$1f(_ctx, _cache) {
   const _component_var_loading = vue.resolveComponent("var-loading");
   const _component_var_hover_overlay = vue.resolveComponent("var-hover-overlay");
@@ -3161,7 +3161,7 @@ function __render__$1f(_ctx, _cache) {
     vue.createVNode(_component_var_hover_overlay, {
       hovering: _ctx.disabled || _ctx.loading || _ctx.pending ? false : _ctx.hovering
     }, null, 8, ["hovering"])
-  ], 46, _hoisted_1$r)), [
+  ], 46, _hoisted_1$s)), [
     [_directive_ripple, { disabled: _ctx.disabled || !_ctx.ripple || _ctx.loading || _ctx.pending }],
     [_directive_hover, _ctx.handleHovering, "desktop"]
   ]);
@@ -3406,7 +3406,7 @@ var __spreadValues$l = (a, b) => {
   return a;
 };
 const { name: name$16, n: n$1d, classes: classes$$ } = createNamespace("badge");
-const _hoisted_1$q = { key: 0 };
+const _hoisted_1$r = { key: 0 };
 function __render__$1d(_ctx, _cache) {
   const _component_var_icon = vue.resolveComponent("var-icon");
   return vue.openBlock(), vue.createElementBlock(
@@ -3444,7 +3444,7 @@ function __render__$1d(_ctx, _cache) {
               vue.renderSlot(_ctx.$slots, "value", {}, () => [
                 !_ctx.icon && !_ctx.dot ? (vue.openBlock(), vue.createElementBlock(
                   "span",
-                  _hoisted_1$q,
+                  _hoisted_1$r,
                   vue.toDisplayString(_ctx.value),
                   1
                   /* TEXT */
@@ -4106,7 +4106,7 @@ var __async$e = (__this, __arguments, generator) => {
 };
 const { name: name$10, n: n$17, classes: classes$W } = createNamespace("card");
 const RIPPLE_DELAY = 500;
-const _hoisted_1$p = ["src", "alt"];
+const _hoisted_1$q = ["src", "alt"];
 function __render__$17(_ctx, _cache) {
   const _component_var_icon = vue.resolveComponent("var-icon");
   const _component_var_button = vue.resolveComponent("var-button");
@@ -4151,7 +4151,7 @@ function __render__$17(_ctx, _cache) {
               }),
               src: _ctx.src,
               alt: _ctx.alt
-            }, null, 14, _hoisted_1$p)) : vue.createCommentVNode("v-if", true)
+            }, null, 14, _hoisted_1$q)) : vue.createCommentVNode("v-if", true)
           ]),
           vue.createElementVNode(
             "div",
@@ -4566,7 +4566,7 @@ const props$_ = {
   }
 };
 const { name: name$_, n: n$15 } = createNamespace("form-details");
-const _hoisted_1$o = { key: 0 };
+const _hoisted_1$p = { key: 0 };
 const _hoisted_2$e = { key: 0 };
 function __render__$15(_ctx, _cache) {
   return vue.openBlock(), vue.createBlock(vue.Transition, {
@@ -4592,7 +4592,7 @@ function __render__$15(_ctx, _cache) {
                 default: vue.withCtx(() => [
                   _ctx.errorMessage ? (vue.openBlock(), vue.createElementBlock(
                     "div",
-                    _hoisted_1$o,
+                    _hoisted_1$p,
                     vue.toDisplayString(_ctx.errorMessage),
                     1
                     /* TEXT */
@@ -8367,7 +8367,7 @@ const props$R = {
 const SPEED = 100;
 const DELAY = 600;
 const { name: name$R, n: n$Y, classes: classes$P } = createNamespace("counter");
-const _hoisted_1$n = ["inputmode", "readonly", "disabled"];
+const _hoisted_1$o = ["inputmode", "readonly", "disabled"];
 function __render__$Y(_ctx, _cache) {
   const _component_var_icon = vue.resolveComponent("var-icon");
   const _component_var_button = vue.resolveComponent("var-button");
@@ -8427,7 +8427,7 @@ function __render__$Y(_ctx, _cache) {
             disabled: _ctx.disabled || _ctx.formDisabled || _ctx.disableInput,
             "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.inputValue = $event),
             onChange: _cache[1] || (_cache[1] = (...args) => _ctx.handleChange && _ctx.handleChange(...args))
-          }, null, 46, _hoisted_1$n), [
+          }, null, 46, _hoisted_1$o), [
             [vue.vModelText, _ctx.inputValue]
           ]),
           vue.createVNode(_component_var_button, {
@@ -13551,7 +13551,7 @@ var __spreadValues$a = (a, b) => {
   return a;
 };
 const { name: name$K, n: n$N, classes: classes$F } = createNamespace("ellipsis");
-const _hoisted_1$m = { key: 0 };
+const _hoisted_1$n = { key: 0 };
 function __render__$N(_ctx, _cache) {
   const _component_var_tooltip = vue.resolveComponent("var-tooltip");
   return vue.openBlock(), vue.createBlock(
@@ -13564,7 +13564,7 @@ function __render__$N(_ctx, _cache) {
           return [
             ((_a = _ctx.tooltipProps) == null ? void 0 : _a.content) ? (vue.openBlock(), vue.createElementBlock(
               "span",
-              _hoisted_1$m,
+              _hoisted_1$n,
               vue.toDisplayString(_ctx.tooltipProps.content),
               1
               /* TEXT */
@@ -13878,7 +13878,7 @@ const props$I = {
   onClear: defineListenerProp()
 };
 const { name: name$I, n: n$L, classes: classes$D } = createNamespace("field-decorator");
-const _hoisted_1$l = ["for"];
+const _hoisted_1$m = ["for"];
 function __render__$M(_ctx, _cache) {
   const _component_var_icon = vue.resolveComponent("var-icon");
   return vue.openBlock(), vue.createElementBlock(
@@ -13952,7 +13952,7 @@ function __render__$M(_ctx, _cache) {
               1
               /* TEXT */
             )
-          ], 14, _hoisted_1$l)) : vue.createCommentVNode("v-if", true),
+          ], 14, _hoisted_1$m)) : vue.createCommentVNode("v-if", true),
           vue.createElementVNode(
             "div",
             {
@@ -14472,7 +14472,7 @@ const props$F = {
   onError: defineListenerProp()
 };
 const { name: name$F, n: n$I, classes: classes$B } = createNamespace("image");
-const _hoisted_1$k = ["alt", "title", "lazy-loading", "lazy-error"];
+const _hoisted_1$l = ["alt", "title", "lazy-loading", "lazy-error"];
 const _hoisted_2$d = ["alt", "title", "src"];
 function __render__$J(_ctx, _cache) {
   var _a;
@@ -14499,7 +14499,7 @@ function __render__$J(_ctx, _cache) {
         style: vue.normalizeStyle({ objectFit: _ctx.fit }),
         onLoad: _cache[0] || (_cache[0] = (...args) => _ctx.handleLoad && _ctx.handleLoad(...args)),
         onClick: _cache[1] || (_cache[1] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
-      }, null, 46, _hoisted_1$k)), [
+      }, null, 46, _hoisted_1$l)), [
         [_directive_lazy, (_a = _ctx.src) != null ? _a : ""]
       ]) : vue.createCommentVNode("v-if", true),
       !_ctx.lazy && !_ctx.showErrorSlot ? (vue.openBlock(), vue.createElementBlock("img", {
@@ -14638,7 +14638,7 @@ var __async$7 = (__this, __arguments, generator) => {
 const SWIPE_DELAY = 250;
 const SWIPE_OFFSET = 20;
 const { name: name$E, n: n$H, classes: classes$A } = createNamespace("swipe");
-const _hoisted_1$j = ["onClick"];
+const _hoisted_1$k = ["onClick"];
 function __render__$I(_ctx, _cache) {
   const _component_var_icon = vue.resolveComponent("var-icon");
   const _component_var_button = vue.resolveComponent("var-button");
@@ -14784,7 +14784,7 @@ function __render__$I(_ctx, _cache) {
                   style: vue.normalizeStyle({ background: _ctx.indicatorColor }),
                   key: l,
                   onClick: ($event) => _ctx.to(idx)
-                }, null, 14, _hoisted_1$j);
+                }, null, 14, _hoisted_1$k);
               }),
               128
               /* KEYED_FRAGMENT */
@@ -15223,7 +15223,7 @@ const TAP_DELAY = 350;
 const ANIMATION_DURATION = 200;
 const LONG_PRESS_DELAY = 500;
 const BASE_RATIO = 1;
-const _hoisted_1$i = ["onTouchstart"];
+const _hoisted_1$j = ["onTouchstart"];
 const _hoisted_2$c = ["src", "alt"];
 function __render__$G(_ctx, _cache) {
   const _component_var_swipe_item = vue.resolveComponent("var-swipe-item");
@@ -15284,7 +15284,7 @@ function __render__$G(_ctx, _cache) {
                       src: image,
                       alt: image
                     }, null, 10, _hoisted_2$c)
-                  ], 46, _hoisted_1$i)
+                  ], 46, _hoisted_1$j)
                 ]),
                 _: 2
                 /* DYNAMIC */
@@ -15783,7 +15783,7 @@ var __async$6 = (__this, __arguments, generator) => {
   });
 };
 const { name: name$A, n: n$D, classes: classes$x } = createNamespace("index-bar");
-const _hoisted_1$h = ["onClick"];
+const _hoisted_1$i = ["onClick"];
 function __render__$E(_ctx, _cache) {
   return vue.openBlock(), vue.createElementBlock(
     "div",
@@ -15809,7 +15809,15 @@ function __render__$E(_ctx, _cache) {
                 class: vue.normalizeClass(_ctx.classes(_ctx.n("anchor-item"), [_ctx.active === anchorName, _ctx.n("anchor-item--active")])),
                 style: vue.normalizeStyle({ color: _ctx.active === anchorName && _ctx.highlightColor ? _ctx.highlightColor : void 0 }),
                 onClick: ($event) => _ctx.anchorClick({ anchorName, manualCall: true })
-              }, vue.toDisplayString(anchorName), 15, _hoisted_1$h);
+              }, [
+                vue.renderSlot(_ctx.$slots, "anchor-name", { anchorName }, () => [
+                  vue.createTextVNode(
+                    vue.toDisplayString(anchorName),
+                    1
+                    /* TEXT */
+                  )
+                ])
+              ], 14, _hoisted_1$i);
             }),
             128
             /* KEYED_FRAGMENT */
@@ -16027,7 +16035,7 @@ const props$A = __spreadValues$7({
   "onClick"
 ]));
 const { name: name$z, n: n$C, classes: classes$w } = createNamespace("input");
-const _hoisted_1$g = ["placeholder", "enterkeyhint"];
+const _hoisted_1$h = ["placeholder", "enterkeyhint"];
 const _hoisted_2$b = ["id", "disabled", "readonly", "type", "value", "placeholder", "maxlength", "rows", "enterkeyhint", "inputmode"];
 const _hoisted_3$9 = ["id", "disabled", "readonly", "type", "value", "placeholder", "maxlength", "enterkeyhint", "inputmode"];
 function __render__$D(_ctx, _cache) {
@@ -16080,7 +16088,7 @@ function __render__$D(_ctx, _cache) {
                 "--input-placeholder-color": _ctx.placeholderColor
               }),
               enterkeyhint: _ctx.enterkeyhint
-            }, null, 14, _hoisted_1$g)) : vue.createCommentVNode("v-if", true),
+            }, null, 14, _hoisted_1$h)) : vue.createCommentVNode("v-if", true),
             _ctx.textarea ? (vue.openBlock(), vue.createElementBlock("textarea", {
               key: 1,
               class: vue.normalizeClass(
@@ -17632,7 +17640,7 @@ const props$q = {
   "onUpdate:size": defineListenerProp()
 };
 const { name: name$q, n: n$t, classes: classes$o } = createNamespace("pagination");
-const _hoisted_1$f = ["item-mode", "onClick"];
+const _hoisted_1$g = ["item-mode", "onClick"];
 function __render__$w(_ctx, _cache) {
   const _component_var_icon = vue.resolveComponent("var-icon");
   const _component_var_input = vue.resolveComponent("var-input");
@@ -17727,7 +17735,7 @@ function __render__$w(_ctx, _cache) {
               1
               /* TEXT */
             )
-          ], 10, _hoisted_1$f)), [
+          ], 10, _hoisted_1$g)), [
             [_directive_ripple, { disabled: _ctx.disabled }]
           ]);
         }),
@@ -18195,7 +18203,7 @@ const MOMENTUM_ALLOW_DISTANCE = 15;
 const TRANSITION_DURATION = 200;
 const MOMENTUM_TRANSITION_DURATION = 1e3;
 let sid$1 = 0;
-const _hoisted_1$e = ["onTouchstartPassive", "onTouchmove", "onTouchend"];
+const _hoisted_1$f = ["onTouchstartPassive", "onTouchmove", "onTouchend"];
 const _hoisted_2$a = ["onTransitionend"];
 const _hoisted_3$8 = ["onClick"];
 function __render__$u(_ctx, _cache) {
@@ -18351,7 +18359,7 @@ function __render__$u(_ctx, _cache) {
                           /* KEYED_FRAGMENT */
                         ))
                       ], 46, _hoisted_2$a)
-                    ], 42, _hoisted_1$e);
+                    ], 42, _hoisted_1$f);
                   }),
                   128
                   /* KEYED_FRAGMENT */
@@ -18412,18 +18420,9 @@ const __sfc__$v = vue.defineComponent({
     const columnHeight = vue.computed(() => optionCount.value * optionHeight.value);
     const { prevY, moveY, dragging, startTouch, moveTouch, endTouch } = useTouch();
     let prevIndexes = [];
-    buildScrollColumns();
-    vue.watch(() => props2.columns, buildScrollColumns, { deep: true });
-    vue.watch(
-      () => modelValue.value,
-      () => {
-        if (props2.cascade && props2.modelValue.length) {
-          buildScrollColumns();
-        } else {
-          updateScrollColumnsIndex();
-        }
-      }
-    );
+    initScrollColumns();
+    vue.watch(() => props2.columns, initScrollColumns, { deep: true });
+    vue.watch(() => modelValue.value, initScrollColumns);
     function getOptionKey(key) {
       const keyMap = {
         text: props2.textKey,
@@ -18440,7 +18439,7 @@ const __sfc__$v = vue.defineComponent({
       prevIndexes = [...indexes];
     }
     function normalizeNormalMode(columns) {
-      return columns.map((column) => {
+      return columns.map((column, idx) => {
         const scrollColumn = {
           id: sid$1++,
           prevY: 0,
@@ -18454,6 +18453,9 @@ const __sfc__$v = vue.defineComponent({
           scrollEl: null,
           scrolling: false
         };
+        const value = modelValue.value[idx];
+        const index = scrollColumn.column.findIndex((option) => value === getValue(option));
+        scrollColumn.index = index === -1 ? 0 : index;
         scrollTo2(scrollColumn);
         return scrollColumn;
       });
@@ -18463,7 +18465,7 @@ const __sfc__$v = vue.defineComponent({
       createChildren(scrollColumns2, column);
       return scrollColumns2;
     }
-    function createChildren(scrollColumns2, children) {
+    function createChildren(scrollColumns2, children, syncModelValue = true) {
       var _a;
       if (children.length) {
         const scrollColumn = {
@@ -18480,31 +18482,30 @@ const __sfc__$v = vue.defineComponent({
           scrolling: false
         };
         scrollColumns2.push(scrollColumn);
-        if (props2.modelValue.length) {
-          const index = children.findIndex((option) => modelValue.value[scrollColumns2.length - 1] === getValue(option));
+        if (syncModelValue) {
+          const value = modelValue.value[scrollColumns2.length - 1];
+          const index = children.findIndex((option) => value === getValue(option));
           scrollColumn.index = index === -1 ? 0 : index;
         }
         scrollTo2(scrollColumn);
-        createChildren(scrollColumns2, (_a = scrollColumn.column[scrollColumn.index][getOptionKey("children")]) != null ? _a : []);
+        createChildren(
+          scrollColumns2,
+          (_a = scrollColumn.column[scrollColumn.index][getOptionKey("children")]) != null ? _a : [],
+          syncModelValue
+        );
       }
     }
     function rebuildChildren(scrollColumn) {
       var _a;
       scrollColumns.value.splice(scrollColumns.value.indexOf(scrollColumn) + 1);
-      createChildren(scrollColumns.value, (_a = scrollColumn.column[scrollColumn.index][getOptionKey("children")]) != null ? _a : []);
+      createChildren(
+        scrollColumns.value,
+        (_a = scrollColumn.column[scrollColumn.index][getOptionKey("children")]) != null ? _a : [],
+        false
+      );
     }
-    function buildScrollColumns() {
+    function initScrollColumns() {
       scrollColumns.value = props2.cascade ? normalizeCascadeMode(props2.columns) : normalizeNormalMode(props2.columns);
-      if (!props2.cascade) {
-        updateScrollColumnsIndex();
-      }
-    }
-    function updateScrollColumnsIndex() {
-      scrollColumns.value.forEach((scrollColumn, idx) => {
-        const index = scrollColumn.column.findIndex((option) => modelValue.value[idx] === getValue(option));
-        scrollColumn.index = index === -1 ? 0 : index;
-        scrollTo2(scrollColumn);
-      });
       const { indexes } = getPicked();
       setPrevIndexes(indexes);
     }
@@ -18593,23 +18594,23 @@ const __sfc__$v = vue.defineComponent({
       scrollTo2(scrollColumn, shouldMomentum ? MOMENTUM_TRANSITION_DURATION : TRANSITION_DURATION);
       scrollColumn.scrolling = scrollColumn.translate !== oldTranslate;
       if (!scrollColumn.scrolling) {
-        change(scrollColumn);
+        handleScrollColumnChange(scrollColumn);
       }
     }
     function handleTransitionend(scrollColumn) {
       scrollColumn.scrolling = false;
-      change(scrollColumn);
+      handleScrollColumnChange(scrollColumn);
     }
     function isSamePicked() {
       const { indexes } = getPicked();
       return indexes.every((index, idx) => index === prevIndexes[idx]);
     }
-    function change(scrollColumn) {
-      const { cascade, onChange } = props2;
+    function handleScrollColumnChange(scrollColumn) {
+      const { onChange, cascade } = props2;
       if (isSamePicked()) {
         return;
       }
-      if (cascade && !props2.modelValue.length) {
+      if (cascade) {
         rebuildChildren(scrollColumn);
       }
       const hasScrolling = scrollColumns.value.some((scrollColumn2) => scrollColumn2.scrolling);
@@ -18790,7 +18791,7 @@ const ONE_HUNDRED = 100;
 const RADIUS = 20;
 const CIRCUMFERENCE = 2 * Math.PI * RADIUS;
 const { name: name$n, n: n$q, classes: classes$l } = createNamespace("progress");
-const _hoisted_1$d = ["viewBox"];
+const _hoisted_1$e = ["viewBox"];
 const _hoisted_2$9 = { key: 0 };
 const _hoisted_3$7 = ["id"];
 const _hoisted_4$2 = ["offset", "stop-color"];
@@ -18943,7 +18944,7 @@ function __render__$t(_ctx, _cache) {
                 transformOrigin: "50% 50%"
               })
             }, null, 14, _hoisted_6)
-          ], 10, _hoisted_1$d)),
+          ], 10, _hoisted_1$e)),
           _ctx.label ? (vue.openBlock(), vue.createElementBlock(
             "div",
             {
@@ -19654,7 +19655,7 @@ const props$j = {
   "onUpdate:modelValue": defineListenerProp()
 };
 const { name: name$j, n: n$m } = createNamespace("rate");
-const _hoisted_1$c = ["onClick"];
+const _hoisted_1$d = ["onClick"];
 function __render__$p(_ctx, _cache) {
   const _component_var_icon = vue.resolveComponent("var-icon");
   const _component_var_hover_overlay = vue.resolveComponent("var-hover-overlay");
@@ -19694,7 +19695,7 @@ function __render__$p(_ctx, _cache) {
                 vue.createVNode(_component_var_hover_overlay, {
                   hovering: _ctx.hovering && value === _ctx.currentHoveringValue && !_ctx.disabled && !_ctx.formDisabled
                 }, null, 8, ["hovering"])
-              ], 14, _hoisted_1$c)), [
+              ], 14, _hoisted_1$d)), [
                 [_directive_ripple, { disabled: _ctx.formReadonly || _ctx.readonly || _ctx.formDisabled || _ctx.disabled || !_ctx.ripple }],
                 [_directive_hover, _ctx.createHoverHandler(value), "desktop"]
               ]);
@@ -19846,7 +19847,7 @@ withPropsDefaultsSetter(stdin_default$1r, props$j);
 const _RateComponent = stdin_default$1r;
 var stdin_default$1q = stdin_default$1r;
 const _withScopeId$6 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-const _hoisted_1$b = {
+const _hoisted_1$c = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "2 3.6 20 20"
 };
@@ -19861,13 +19862,13 @@ const _hoisted_3$6 = [
   _hoisted_2$8
 ];
 function __render__$o(_ctx, _cache) {
-  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$b, [..._hoisted_3$6]);
+  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$c, [..._hoisted_3$6]);
 }
 const __sfc__$p = vue.defineComponent({});
 __sfc__$p.render = __render__$o;
 var stdin_default$1p = __sfc__$p;
 const _withScopeId$5 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-const _hoisted_1$a = {
+const _hoisted_1$b = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "2 2 20 20"
 };
@@ -19882,13 +19883,13 @@ const _hoisted_3$5 = [
   _hoisted_2$7
 ];
 function __render__$n(_ctx, _cache) {
-  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$a, [..._hoisted_3$5]);
+  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$b, [..._hoisted_3$5]);
 }
 const __sfc__$o = vue.defineComponent({});
 __sfc__$o.render = __render__$n;
 var stdin_default$1o = __sfc__$o;
 const _withScopeId$4 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-const _hoisted_1$9 = {
+const _hoisted_1$a = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "-6 -4 35 35"
 };
@@ -19903,7 +19904,7 @@ const _hoisted_3$4 = [
   _hoisted_2$6
 ];
 function __render__$m(_ctx, _cache) {
-  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$9, [..._hoisted_3$4]);
+  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$a, [..._hoisted_3$4]);
 }
 const __sfc__$n = vue.defineComponent({});
 __sfc__$n.render = __render__$m;
@@ -20006,7 +20007,7 @@ const __sfc__$m = vue.defineComponent({
 __sfc__$m.render = __render__$l;
 var stdin_default$1m = __sfc__$m;
 const _withScopeId$3 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-const _hoisted_1$8 = {
+const _hoisted_1$9 = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "-3 -3 30 30"
 };
@@ -20021,13 +20022,13 @@ const _hoisted_3$3 = [
   _hoisted_2$5
 ];
 function __render__$k(_ctx, _cache) {
-  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$8, [..._hoisted_3$3]);
+  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$9, [..._hoisted_3$3]);
 }
 const __sfc__$l = vue.defineComponent({});
 __sfc__$l.render = __render__$k;
 var stdin_default$1l = __sfc__$l;
 const _withScopeId$2 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-const _hoisted_1$7 = { viewBox: "-4 -4 32 32" };
+const _hoisted_1$8 = { viewBox: "-4 -4 32 32" };
 const _hoisted_2$4 = /* @__PURE__ */ _withScopeId$2(() => /* @__PURE__ */ vue.createElementVNode(
   "path",
   {
@@ -20042,7 +20043,7 @@ const _hoisted_3$2 = [
   _hoisted_2$4
 ];
 function __render__$j(_ctx, _cache) {
-  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$7, [..._hoisted_3$2]);
+  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$8, [..._hoisted_3$2]);
 }
 const __sfc__$k = vue.defineComponent({});
 __sfc__$k.render = __render__$j;
@@ -20309,7 +20310,7 @@ const props$g = __spreadValues$4({
   "onClick"
 ]));
 const { name: name$g, n: n$i, classes: classes$e } = createNamespace("select");
-const _hoisted_1$6 = { key: 1 };
+const _hoisted_1$7 = { key: 1 };
 function __render__$g(_ctx, _cache) {
   const _component_var_chip = vue.resolveComponent("var-chip");
   const _component_var_icon = vue.resolveComponent("var-icon");
@@ -20456,7 +20457,7 @@ function __render__$g(_ctx, _cache) {
                             /* STABLE_FRAGMENT */
                           )) : (vue.openBlock(), vue.createElementBlock(
                             "span",
-                            _hoisted_1$6,
+                            _hoisted_1$7,
                             vue.toDisplayString(_ctx.label),
                             1
                             /* TEXT */
@@ -20975,7 +20976,7 @@ const props$e = {
   "onUpdate:modelValue": defineListenerProp()
 };
 const { name: name$e, n: n$g, classes: classes$c } = createNamespace("slider");
-const _hoisted_1$5 = ["onTouchstart"];
+const _hoisted_1$6 = ["onTouchstart"];
 function __render__$e(_ctx, _cache) {
   const _component_var_hover_overlay = vue.resolveComponent("var-hover-overlay");
   const _component_var_form_details = vue.resolveComponent("var-form-details");
@@ -21102,7 +21103,7 @@ function __render__$e(_ctx, _cache) {
                     /* CLASS, STYLE */
                   )
                 ])
-              ], 46, _hoisted_1$5);
+              ], 46, _hoisted_1$6);
             }),
             128
             /* KEYED_FRAGMENT */
@@ -21475,9 +21476,7 @@ const props$d = {
     type: String,
     default: "top"
   },
-  content: {
-    type: [String, Function, Object]
-  },
+  content: [String, Function, Object],
   contentClass: String,
   duration: {
     type: Number,
@@ -21512,6 +21511,7 @@ const ICON_TYPE_DICT = {
   error: "error",
   loading: ""
 };
+const _hoisted_1$5 = { key: 0 };
 function __render__$d(_ctx, _cache) {
   const _component_var_icon = vue.resolveComponent("var-icon");
   const _component_var_loading = vue.resolveComponent("var-loading");
@@ -21554,32 +21554,24 @@ function __render__$d(_ctx, _cache) {
             2
             /* CLASS */
           ),
-          vue.createElementVNode(
-            "div",
-            {
-              class: vue.normalizeClass([_ctx.n("icon")])
-            },
-            [
-              _ctx.iconName ? (vue.openBlock(), vue.createBlock(_component_var_icon, {
-                key: 0,
-                name: _ctx.iconName
-              }, null, 8, ["name"])) : vue.createCommentVNode("v-if", true),
-              _ctx.type === "loading" ? (vue.openBlock(), vue.createBlock(_component_var_loading, {
-                key: 1,
-                type: _ctx.loadingType,
-                size: _ctx.loadingSize,
-                color: _ctx.loadingColor,
-                radius: _ctx.loadingRadius
-              }, null, 8, ["type", "size", "color", "radius"])) : vue.createCommentVNode("v-if", true),
-              vue.renderSlot(_ctx.$slots, "icon")
-            ],
-            2
-            /* CLASS */
-          ),
+          _ctx.iconName || _ctx.type === "loading" || _ctx.$slots.icon ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
+            _ctx.iconName ? (vue.openBlock(), vue.createBlock(_component_var_icon, {
+              key: 0,
+              name: _ctx.iconName
+            }, null, 8, ["name"])) : vue.createCommentVNode("v-if", true),
+            _ctx.type === "loading" ? (vue.openBlock(), vue.createBlock(_component_var_loading, {
+              key: 1,
+              type: _ctx.loadingType,
+              size: _ctx.loadingSize,
+              color: _ctx.loadingColor,
+              radius: _ctx.loadingRadius
+            }, null, 8, ["type", "size", "color", "radius"])) : vue.createCommentVNode("v-if", true),
+            vue.renderSlot(_ctx.$slots, "icon")
+          ])) : vue.createCommentVNode("v-if", true),
           _ctx.$slots.action ? (vue.openBlock(), vue.createElementBlock(
             "div",
             {
-              key: 0,
+              key: 1,
               class: vue.normalizeClass(_ctx.n("action"))
             },
             [
@@ -21613,24 +21605,25 @@ const __sfc__$e = vue.defineComponent({
       () => props2.show,
       () => props2.lockScroll
     );
-    const isForbidClick = vue.computed(() => props2.type === "loading" || props2.forbidClick);
-    const iconName = vue.computed(() => {
-      if (!props2.type)
-        return "";
-      return ICON_TYPE_DICT[props2.type];
+    const isForbidClick = vue.computed(() => {
+      const { type, forbidClick } = props2;
+      return type === "loading" || forbidClick;
     });
-    const updateAfterDuration = () => {
+    const iconName = vue.computed(() => !props2.type ? "" : ICON_TYPE_DICT[props2.type]);
+    function updateAfterDuration() {
       timer.value = setTimeout(() => {
-        props2.type !== "loading" && call(props2["onUpdate:show"], false);
+        if (props2.type !== "loading") {
+          call(props2["onUpdate:show"], false);
+        }
       }, props2.duration);
-    };
+    }
     vue.watch(
       () => props2.show,
       (show) => {
         if (show) {
           call(props2.onOpen);
           updateAfterDuration();
-        } else if (show === false) {
+        } else {
           clearTimeout(timer.value);
           call(props2.onClose);
         }
@@ -21651,11 +21644,11 @@ const __sfc__$e = vue.defineComponent({
     });
     return {
       SNACKBAR_TYPE,
-      n: n$f,
-      classes: classes$b,
       zIndex,
       iconName,
-      isForbidClick
+      isForbidClick,
+      n: n$f,
+      classes: classes$b
     };
   }
 });
@@ -21676,25 +21669,28 @@ function __render__$c(_ctx, _cache) {
       default: vue.withCtx(() => [
         vue.createVNode(_component_var_snackbar_core, vue.mergeProps(_ctx.$props, {
           class: _ctx.n("transition")
-        }), {
-          icon: vue.withCtx(() => [
-            vue.renderSlot(_ctx.$slots, "icon")
-          ]),
-          action: vue.withCtx(() => [
-            vue.renderSlot(_ctx.$slots, "action")
-          ]),
+        }), vue.createSlots({
           default: vue.withCtx(() => [
-            vue.renderSlot(_ctx.$slots, "default", {}, () => [
-              vue.createTextVNode(
-                vue.toDisplayString(_ctx.content),
-                1
-                /* TEXT */
-              )
-            ])
+            vue.renderSlot(_ctx.$slots, "default")
           ]),
-          _: 3
-          /* FORWARDED */
-        }, 16, ["class"])
+          _: 2
+          /* DYNAMIC */
+        }, [
+          _ctx.$slots.icon ? {
+            name: "icon",
+            fn: vue.withCtx(() => [
+              vue.renderSlot(_ctx.$slots, "icon")
+            ]),
+            key: "0"
+          } : void 0,
+          _ctx.$slots.action ? {
+            name: "action",
+            fn: vue.withCtx(() => [
+              vue.renderSlot(_ctx.$slots, "action")
+            ]),
+            key: "1"
+          } : void 0
+        ]), 1040, ["class"])
       ]),
       _: 3
       /* FORWARDED */
@@ -25037,7 +25033,7 @@ withInstall(stdin_default$1);
 withPropsDefaultsSetter(stdin_default$1, props);
 const _WatermarkComponent = stdin_default$1;
 var stdin_default = stdin_default$1;
-const version = "2.21.0";
+const version = "2.21.1-alpha.1705566892480";
 function install(app) {
   stdin_default$3m.install && app.use(stdin_default$3m);
   stdin_default$3k.install && app.use(stdin_default$3k);