@varlet/ui 2.12.2 → 2.12.4-alpha.1689047623608

package/lib/varlet.cjs.js

@@ -1753,7 +1753,7 @@ var {
   n: n$1f,
   classes: classes$12
 } = createNamespace("action-sheet");
-var _hoisted_1$s = ["onClick"];
+var _hoisted_1$t = ["onClick"];
 function __render__$1f(_ctx, _cache) {
   var _component_var_icon = vue.resolveComponent("var-icon");
   var _component_var_popup = vue.resolveComponent("var-popup");
@@ -1816,7 +1816,7 @@ function __render__$1f(_ctx, _cache) {
             vue.toDisplayString(action.name),
             3
             /* TEXT, CLASS */
-          )], 14, _hoisted_1$s)), [[_directive_ripple, {
+          )], 14, _hoisted_1$t)), [[_directive_ripple, {
             disabled: action.disabled
           }]]);
         }),
@@ -2424,8 +2424,8 @@ var {
   n: n$1d,
   classes: classes$10
 } = createNamespace("avatar");
-var _hoisted_1$r = ["src", "lazy-loading", "lazy-error"];
-var _hoisted_2$e = ["src"];
+var _hoisted_1$s = ["src", "lazy-loading", "lazy-error"];
+var _hoisted_2$f = ["src"];
 function __render__$1d(_ctx, _cache) {
   var _directive_lazy = vue.resolveDirective("lazy");
   return vue.openBlock(), vue.createElementBlock(
@@ -2460,7 +2460,7 @@ function __render__$1d(_ctx, _cache) {
         onLoad: _cache[0] || (_cache[0] = function() {
           return _ctx.handleLoad && _ctx.handleLoad(...arguments);
         })
-      }, null, 46, _hoisted_1$r)), [[_directive_lazy, _ctx.src]]) : (vue.openBlock(), vue.createElementBlock("img", {
+      }, null, 46, _hoisted_1$s)), [[_directive_lazy, _ctx.src]]) : (vue.openBlock(), vue.createElementBlock("img", {
         key: 1,
         class: vue.normalizeClass(_ctx.n("image")),
         src: _ctx.src,
@@ -2473,7 +2473,7 @@ function __render__$1d(_ctx, _cache) {
         onError: _cache[2] || (_cache[2] = function() {
           return _ctx.handleError && _ctx.handleError(...arguments);
         })
-      }, null, 46, _hoisted_2$e))],
+      }, null, 46, _hoisted_2$f))],
       64
       /* STABLE_FRAGMENT */
     )) : (vue.openBlock(), vue.createElementBlock(
@@ -2611,7 +2611,7 @@ AvatarGroup.install = function(app) {
   app.component(AvatarGroup.name, AvatarGroup);
 };
 var _AvatarGroupComponent = AvatarGroup;
-function typeValidator$a(type) {
+function typeValidator$b(type) {
   return ["circle", "wave", "cube", "rect", "disappear"].includes(type);
 }
 function sizeValidator$5(size) {
@@ -2621,7 +2621,7 @@ var props$14 = {
   type: {
     type: String,
     default: "circle",
-    validator: typeValidator$a
+    validator: typeValidator$b
   },
   radius: {
     type: [String, Number]
@@ -2646,8 +2646,8 @@ var {
   n: n$1b,
   classes: classes$_
 } = createNamespace("loading");
-var _withScopeId$6 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-var _hoisted_1$q = /* @__PURE__ */ _withScopeId$6(() => /* @__PURE__ */ vue.createElementVNode(
+var _withScopeId$7 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
+var _hoisted_1$r = /* @__PURE__ */ _withScopeId$7(() => /* @__PURE__ */ vue.createElementVNode(
   "svg",
   {
     viewBox: "25 25 50 50"
@@ -2661,7 +2661,7 @@ var _hoisted_1$q = /* @__PURE__ */ _withScopeId$6(() => /* @__PURE__ */ vue.crea
   -1
   /* HOISTED */
 ));
-var _hoisted_2$d = [_hoisted_1$q];
+var _hoisted_2$e = [_hoisted_1$r];
 function __render__$1b(_ctx, _cache) {
   return vue.openBlock(), vue.createElementBlock(
     "div",
@@ -2708,7 +2708,7 @@ function __render__$1b(_ctx, _cache) {
               color: _ctx.color
             })
           },
-          _hoisted_2$d,
+          _hoisted_2$e,
           6
           /* CLASS, STYLE */
         )],
@@ -3004,7 +3004,7 @@ function _extends$i() {
   };
   return _extends$i.apply(this, arguments);
 }
-function typeValidator$9(type) {
+function typeValidator$a(type) {
   return ["default", "primary", "info", "success", "warning", "danger"].includes(type);
 }
 function sizeValidator$4(size) {
@@ -3016,7 +3016,7 @@ function nativeTypeValidator(nativeType) {
 var props$12 = {
   type: {
     type: String,
-    validator: typeValidator$9
+    validator: typeValidator$a
   },
   nativeType: {
     type: String,
@@ -3109,7 +3109,7 @@ var {
   n: n$19,
   classes: classes$Y
 } = createNamespace("button");
-var _hoisted_1$p = ["type", "disabled"];
+var _hoisted_1$q = ["type", "disabled"];
 function __render__$19(_ctx, _cache) {
   var _component_var_loading = vue.resolveComponent("var-loading");
   var _component_var_hover_overlay = vue.resolveComponent("var-hover-overlay");
@@ -3147,7 +3147,7 @@ function __render__$19(_ctx, _cache) {
     /* CLASS */
   ), vue.createVNode(_component_var_hover_overlay, {
     hovering: _ctx.hovering
-  }, null, 8, ["hovering"])], 46, _hoisted_1$p)), [[_directive_ripple, {
+  }, null, 8, ["hovering"])], 46, _hoisted_1$q)), [[_directive_ripple, {
     disabled: _ctx.disabled || !_ctx.ripple
   }], [_directive_hover, _ctx.handleHovering, "desktop"]]);
 }
@@ -3373,7 +3373,7 @@ BackTop.install = function(app) {
   app.component(BackTop.name, BackTop);
 };
 var _BackTopComponent = BackTop;
-function typeValidator$8(type) {
+function typeValidator$9(type) {
   return ["default", "primary", "info", "success", "warning", "danger"].includes(type);
 }
 function positionValidator$2(position) {
@@ -3383,7 +3383,7 @@ var props$10 = {
   type: {
     type: String,
     default: "default",
-    validator: typeValidator$8
+    validator: typeValidator$9
   },
   position: {
     type: String,
@@ -4035,7 +4035,7 @@ Breadcrumbs.install = function(app) {
   app.component(Breadcrumbs.name, Breadcrumbs);
 };
 var _BreadcrumbsComponent = Breadcrumbs;
-function typeValidator$7(type) {
+function typeValidator$8(type) {
   return ["default", "primary", "info", "success", "warning", "danger"].includes(type);
 }
 function sizeValidator$3(size) {
@@ -4048,7 +4048,7 @@ var props$X = {
   type: {
     type: String,
     default: "default",
-    validator: typeValidator$7
+    validator: typeValidator$8
   },
   size: {
     type: String,
@@ -4210,7 +4210,7 @@ var {
   classes: classes$R
 } = createNamespace("card");
 var RIPPLE_DELAY = 500;
-var _hoisted_1$o = ["src", "alt"];
+var _hoisted_1$p = ["src", "alt"];
 function __render__$11(_ctx, _cache) {
   var _component_var_icon = vue.resolveComponent("var-icon");
   var _component_var_button = vue.resolveComponent("var-button");
@@ -4252,7 +4252,7 @@ function __render__$11(_ctx, _cache) {
         }),
         src: _ctx.src,
         alt: _ctx.alt
-      }, null, 14, _hoisted_1$o)) : vue.createCommentVNode("v-if", true)]), vue.createElementVNode(
+      }, null, 14, _hoisted_1$p)) : vue.createCommentVNode("v-if", true)]), vue.createElementVNode(
         "div",
         {
           class: vue.normalizeClass(_ctx.n("container"))
@@ -4657,17 +4657,17 @@ var props$U = {
 var {
   n: n$$
 } = createNamespace("form-details");
-var _hoisted_1$n = {
+var _hoisted_1$o = {
   key: 0
 };
-var _hoisted_2$c = {
+var _hoisted_2$d = {
   key: 0
 };
 function __render__$$(_ctx, _cache) {
   return vue.openBlock(), vue.createBlock(vue.Transition, {
     name: _ctx.n()
   }, {
-    default: vue.withCtx(() => [_ctx.errorMessage || _ctx.extraMessage ? (vue.openBlock(), vue.createElementBlock(
+    default: vue.withCtx(() => [_ctx.errorMessage || _ctx.extraMessage || _ctx.$slots["extra-message"] ? (vue.openBlock(), vue.createElementBlock(
       "div",
       {
         key: 0,
@@ -4683,7 +4683,7 @@ function __render__$$(_ctx, _cache) {
         }, {
           default: vue.withCtx(() => [_ctx.errorMessage ? (vue.openBlock(), vue.createElementBlock(
             "div",
-            _hoisted_1$n,
+            _hoisted_1$o,
             vue.toDisplayString(_ctx.errorMessage),
             1
             /* TEXT */
@@ -4701,15 +4701,15 @@ function __render__$$(_ctx, _cache) {
         [vue.createVNode(vue.Transition, {
           name: _ctx.n("message")
         }, {
-          default: vue.withCtx(() => [_ctx.extraMessage ? (vue.openBlock(), vue.createElementBlock(
+          default: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "extra-message", {}, () => [_ctx.extraMessage ? (vue.openBlock(), vue.createElementBlock(
             "div",
-            _hoisted_2$c,
+            _hoisted_2$d,
             vue.toDisplayString(_ctx.extraMessage),
             1
             /* TEXT */
-          )) : vue.createCommentVNode("v-if", true)]),
-          _: 1
-          /* STABLE */
+          )) : vue.createCommentVNode("v-if", true)])]),
+          _: 3
+          /* FORWARDED */
         }, 8, ["name"])],
         2
         /* CLASS */
@@ -4717,8 +4717,8 @@ function __render__$$(_ctx, _cache) {
       2
       /* CLASS */
     )) : vue.createCommentVNode("v-if", true)]),
-    _: 1
-    /* STABLE */
+    _: 3
+    /* FORWARDED */
   }, 8, ["name"]);
 }
 var __sfc__$10 = vue.defineComponent({
@@ -5251,7 +5251,7 @@ CheckboxGroup.install = function(app) {
   app.component(CheckboxGroup.name, CheckboxGroup);
 };
 var _CheckboxGroupComponent = CheckboxGroup;
-function typeValidator$6(type) {
+function typeValidator$7(type) {
   return ["default", "primary", "info", "success", "warning", "danger"].includes(type);
 }
 function sizeValidator$2(size) {
@@ -5261,7 +5261,7 @@ var props$R = {
   type: {
     type: String,
     default: "default",
-    validator: typeValidator$6
+    validator: typeValidator$7
   },
   size: {
     type: String,
@@ -8536,7 +8536,7 @@ var {
 } = createNamespace("counter");
 var SPEED = 100;
 var DELAY = 600;
-var _hoisted_1$m = ["inputmode", "readonly", "disabled"];
+var _hoisted_1$n = ["inputmode", "readonly", "disabled"];
 function __render__$T(_ctx, _cache) {
   var _component_var_icon = vue.resolveComponent("var-icon");
   var _component_var_button = vue.resolveComponent("var-button");
@@ -8586,7 +8586,7 @@ function __render__$T(_ctx, _cache) {
         onChange: _cache[1] || (_cache[1] = function() {
           return _ctx.handleChange && _ctx.handleChange(...arguments);
         })
-      }, null, 46, _hoisted_1$m), [[vue.vModelText, _ctx.inputValue]]), vue.createVNode(_component_var_button, {
+      }, null, 46, _hoisted_1$n), [[vue.vModelText, _ctx.inputValue]]), vue.createVNode(_component_var_button, {
         class: vue.normalizeClass(_ctx.classes(_ctx.n("increment-button"), [!_ctx.incrementButton, _ctx.n("--hidden")], [_ctx.disabled || _ctx.formDisabled, _ctx.n("--not-allowed")])),
         style: vue.normalizeStyle({
           width: _ctx.toSizeUnit(_ctx.buttonSize),
@@ -9288,7 +9288,7 @@ const isSameOrAfter = function(o, c) {
     return this.isSame(that, units) || this.isAfter(that, units);
   };
 };
-function typeValidator$5(type) {
+function typeValidator$6(type) {
   return ["date", "month"].includes(type);
 }
 var MONTH_LIST = [{
@@ -9338,7 +9338,7 @@ var props$L = {
   type: {
     type: String,
     default: "date",
-    validator: typeValidator$5
+    validator: typeValidator$6
   },
   allowedDates: {
     type: Function
@@ -9811,7 +9811,7 @@ var {
   n: n$Q,
   classes: classes$I
 } = createNamespace("year-picker");
-var _hoisted_1$l = ["onClick"];
+var _hoisted_1$m = ["onClick"];
 function __render__$Q(_ctx, _cache) {
   return vue.openBlock(), vue.createElementBlock(
     "ul",
@@ -9829,7 +9829,7 @@ function __render__$Q(_ctx, _cache) {
             color: year === _ctx.toNumber(_ctx.preview) ? _ctx.componentProps.color : ""
           }),
           onClick: ($event) => _ctx.chooseYear(year)
-        }, vue.toDisplayString(year), 15, _hoisted_1$l);
+        }, vue.toDisplayString(year), 15, _hoisted_1$m);
       }),
       128
       /* KEYED_FRAGMENT */
@@ -12876,14 +12876,14 @@ function triggerValidator$2(trigger) {
 function placementValidator$1(alignment) {
   return ["top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "right", "right-start", "right-end", "left", "left-start", "left-end"].includes(alignment);
 }
-function typeValidator$4(type) {
+function typeValidator$5(type) {
   return ["default", "primary", "info", "success", "warning", "danger"].includes(type);
 }
 var props$I = {
   type: {
     type: String,
     default: "default",
-    validator: typeValidator$4
+    validator: typeValidator$5
   },
   color: {
     type: String
@@ -13095,7 +13095,7 @@ var {
   n: n$K,
   classes: classes$C
 } = createNamespace("ellipsis");
-var _hoisted_1$k = {
+var _hoisted_1$l = {
   key: 0
 };
 function __render__$K(_ctx, _cache) {
@@ -13108,7 +13108,7 @@ function __render__$K(_ctx, _cache) {
         var _ctx$tooltip;
         return [(_ctx$tooltip = _ctx.tooltip) != null && _ctx$tooltip.content ? (vue.openBlock(), vue.createElementBlock(
           "span",
-          _hoisted_1$k,
+          _hoisted_1$l,
           vue.toDisplayString(_ctx.tooltip.content),
           1
           /* TEXT */
@@ -13210,7 +13210,7 @@ var props$G = {
   type: {
     type: String,
     default: "primary",
-    validator: typeValidator$9
+    validator: typeValidator$a
   },
   position: {
     type: String,
@@ -13619,8 +13619,8 @@ var {
   n: n$H,
   classes: classes$A
 } = createNamespace("image");
-var _hoisted_1$j = ["alt", "title", "lazy-loading", "lazy-error"];
-var _hoisted_2$b = ["alt", "title", "src"];
+var _hoisted_1$k = ["alt", "title", "lazy-loading", "lazy-error"];
+var _hoisted_2$c = ["alt", "title", "src"];
 function __render__$I(_ctx, _cache) {
   var _directive_lazy = vue.resolveDirective("lazy");
   var _directive_ripple = vue.resolveDirective("ripple");
@@ -13650,7 +13650,7 @@ function __render__$I(_ctx, _cache) {
       onClick: _cache[1] || (_cache[1] = function() {
         return _ctx.handleClick && _ctx.handleClick(...arguments);
       })
-    }, null, 46, _hoisted_1$j)), [[_directive_lazy, _ctx.src]]) : vue.createCommentVNode("v-if", true), !_ctx.lazy && !_ctx.showErrorSlot ? (vue.openBlock(), vue.createElementBlock("img", {
+    }, null, 46, _hoisted_1$k)), [[_directive_lazy, _ctx.src]]) : vue.createCommentVNode("v-if", true), !_ctx.lazy && !_ctx.showErrorSlot ? (vue.openBlock(), vue.createElementBlock("img", {
       key: 1,
       class: vue.normalizeClass(_ctx.n("image")),
       alt: _ctx.alt,
@@ -13668,7 +13668,7 @@ function __render__$I(_ctx, _cache) {
       onClick: _cache[4] || (_cache[4] = function() {
         return _ctx.handleClick && _ctx.handleClick(...arguments);
       })
-    }, null, 46, _hoisted_2$b)) : vue.createCommentVNode("v-if", true), _ctx.showErrorSlot ? vue.renderSlot(_ctx.$slots, "error", {
+    }, null, 46, _hoisted_2$c)) : vue.createCommentVNode("v-if", true), _ctx.showErrorSlot ? vue.renderSlot(_ctx.$slots, "error", {
       key: 2
     }) : vue.createCommentVNode("v-if", true)],
     6
@@ -13811,7 +13811,7 @@ var {
   n: n$G,
   classes: classes$z
 } = createNamespace("swipe");
-var _hoisted_1$i = ["onClick"];
+var _hoisted_1$j = ["onClick"];
 function __render__$H(_ctx, _cache) {
   return vue.openBlock(), vue.createElementBlock(
     "div",
@@ -13862,7 +13862,7 @@ function __render__$H(_ctx, _cache) {
             }),
             key: l,
             onClick: ($event) => _ctx.to(idx)
-          }, null, 14, _hoisted_1$i);
+          }, null, 14, _hoisted_1$j);
         }),
         128
         /* KEYED_FRAGMENT */
@@ -14343,8 +14343,8 @@ var EVENT_DELAY = 200;
 var TAP_DELAY = 350;
 var ANIMATION_DURATION = 200;
 var LONG_PRESS_DELAY = 500;
-var _hoisted_1$h = ["onTouchstart"];
-var _hoisted_2$a = ["src", "alt"];
+var _hoisted_1$i = ["onTouchstart"];
+var _hoisted_2$b = ["src", "alt"];
 function __render__$F(_ctx, _cache) {
   var _component_var_swipe_item = vue.resolveComponent("var-swipe-item");
   var _component_var_swipe = vue.resolveComponent("var-swipe");
@@ -14405,7 +14405,7 @@ function __render__$F(_ctx, _cache) {
               class: vue.normalizeClass(_ctx.classes(_ctx.n("image"), [_ctx.isPreventDefault, _ctx.n("--prevent")])),
               src: image2,
               alt: image2
-            }, null, 10, _hoisted_2$a)], 46, _hoisted_1$h)]),
+            }, null, 10, _hoisted_2$b)], 46, _hoisted_1$i)]),
             _: 2
             /* DYNAMIC */
           }, 1032, ["class"]);
@@ -15192,7 +15192,7 @@ var {
   n: n$B,
   classes: classes$v
 } = createNamespace("index-bar");
-var _hoisted_1$g = ["onClick"];
+var _hoisted_1$h = ["onClick"];
 function __render__$C(_ctx, _cache) {
   return vue.openBlock(), vue.createElementBlock(
     "div",
@@ -15223,7 +15223,7 @@ function __render__$C(_ctx, _cache) {
               anchorName,
               manualCall: true
             })
-          }, vue.toDisplayString(anchorName), 15, _hoisted_1$g);
+          }, vue.toDisplayString(anchorName), 15, _hoisted_1$h);
         }),
         128
         /* KEYED_FRAGMENT */
@@ -15489,7 +15489,7 @@ var {
   n: n$A,
   classes: classes$u
 } = createNamespace("field-decorator");
-var _hoisted_1$f = ["for"];
+var _hoisted_1$g = ["for"];
 function __render__$B(_ctx, _cache) {
   var _component_var_icon = vue.resolveComponent("var-icon");
   return vue.openBlock(), vue.createElementBlock(
@@ -15539,7 +15539,7 @@ function __render__$B(_ctx, _cache) {
         vue.toDisplayString(_ctx.placeholder),
         1
         /* TEXT */
-      )], 14, _hoisted_1$f)) : vue.createCommentVNode("v-if", true), vue.createElementVNode(
+      )], 14, _hoisted_1$g)) : vue.createCommentVNode("v-if", true), vue.createElementVNode(
         "div",
         {
           class: vue.normalizeClass(_ctx.classes(_ctx.n("icon"), [!_ctx.hint, _ctx.n("--icon-non-hint")]))
@@ -15708,7 +15708,7 @@ function _extends$5() {
   };
   return _extends$5.apply(this, arguments);
 }
-function typeValidator$3(type) {
+function typeValidator$4(type) {
   return ["text", "password", "number", "tel", "email"].includes(type);
 }
 var props$x = _extends$5({
@@ -15722,7 +15722,7 @@ var props$x = _extends$5({
   type: {
     type: String,
     default: "text",
-    validator: typeValidator$3
+    validator: typeValidator$4
   },
   textarea: {
     type: Boolean,
@@ -15768,8 +15768,8 @@ var {
   n: n$z,
   classes: classes$t
 } = createNamespace("input");
-var _hoisted_1$e = ["placeholder", "enterkeyhint"];
-var _hoisted_2$9 = ["id", "disabled", "type", "value", "placeholder", "maxlength", "rows", "enterkeyhint", "inputmode"];
+var _hoisted_1$f = ["placeholder", "enterkeyhint"];
+var _hoisted_2$a = ["id", "disabled", "type", "value", "placeholder", "maxlength", "rows", "enterkeyhint", "inputmode"];
 var _hoisted_3$8 = ["id", "disabled", "type", "value", "placeholder", "maxlength", "enterkeyhint", "inputmode"];
 function __render__$A(_ctx, _cache) {
   var _component_var_field_decorator = vue.resolveComponent("var-field-decorator");
@@ -15809,13 +15809,14 @@ function __render__$A(_ctx, _cache) {
         "append-icon": vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "append-icon")]),
         default: vue.withCtx(() => [_ctx.normalizedType === "password" ? (vue.openBlock(), vue.createElementBlock("input", {
           key: 0,
+          tabindex: "-1",
           class: vue.normalizeClass(_ctx.n("autocomplete")),
           placeholder: !_ctx.hint ? _ctx.placeholder : void 0,
           style: vue.normalizeStyle({
             "--input-placeholder-color": _ctx.placeholderColor
           }),
           enterkeyhint: _ctx.enterkeyhint
-        }, null, 14, _hoisted_1$e)) : vue.createCommentVNode("v-if", true), _ctx.textarea ? (vue.openBlock(), vue.createElementBlock("textarea", {
+        }, null, 14, _hoisted_1$f)) : vue.createCommentVNode("v-if", true), _ctx.textarea ? (vue.openBlock(), vue.createElementBlock("textarea", {
           key: 1,
           class: vue.normalizeClass(_ctx.classes(_ctx.n("input"), _ctx.n("--textarea"), [_ctx.formDisabled || _ctx.disabled, _ctx.n("--disabled")], [_ctx.errorMessage, _ctx.n("--error")], [_ctx.errorMessage, _ctx.n("--caret-error")])),
           ref: "el",
@@ -15856,7 +15857,7 @@ function __render__$A(_ctx, _cache) {
           onCompositionend: _cache[6] || (_cache[6] = function() {
             return _ctx.handleCompositionEnd && _ctx.handleCompositionEnd(...arguments);
           })
-        }, "\n      ", 46, _hoisted_2$9)) : (vue.openBlock(), vue.createElementBlock("input", {
+        }, "\n      ", 46, _hoisted_2$a)) : (vue.openBlock(), vue.createElementBlock("input", {
           key: 2,
           class: vue.normalizeClass(_ctx.classes(_ctx.n("input"), [_ctx.formDisabled || _ctx.disabled, _ctx.n("--disabled")], [_ctx.errorMessage, _ctx.n("--error")], [_ctx.errorMessage, _ctx.n("--caret-error")])),
           ref: "el",
@@ -15910,7 +15911,14 @@ function __render__$A(_ctx, _cache) {
       "extra-message": _ctx.maxlengthText,
       onMousedown: _cache[14] || (_cache[14] = vue.withModifiers(() => {
       }, ["stop"]))
-    }, null, 8, ["error-message", "extra-message"])],
+    }, vue.createSlots({
+      _: 2
+      /* DYNAMIC */
+    }, [_ctx.$slots["extra-message"] ? {
+      name: "extra-message",
+      fn: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "extra-message")]),
+      key: "0"
+    } : void 0]), 1032, ["error-message", "extra-message"])],
     34
     /* CLASS, HYDRATE_EVENTS */
   );
@@ -16149,7 +16157,7 @@ Input.install = function(app) {
   app.component(Input.name, Input);
 };
 var _InputComponent = Input;
-function typeValidator$2(type) {
+function typeValidator$3(type) {
   return ["default", "primary", "info", "success", "warning", "danger"].includes(type);
 }
 function underlineValidator(status) {
@@ -16159,7 +16167,7 @@ var props$w = {
   type: {
     type: String,
     default: "default",
-    validator: typeValidator$2
+    validator: typeValidator$3
   },
   href: {
     type: String
@@ -17132,7 +17140,7 @@ var {
   n: n$s,
   classes: classes$n
 } = createNamespace("pagination");
-var _hoisted_1$d = ["item-mode", "onClick"];
+var _hoisted_1$e = ["item-mode", "onClick"];
 function __render__$v(_ctx, _cache) {
   var _component_var_icon = vue.resolveComponent("var-icon");
   var _component_var_input = vue.resolveComponent("var-input");
@@ -17201,7 +17209,7 @@ function __render__$v(_ctx, _cache) {
           vue.toDisplayString(item),
           1
           /* TEXT */
-        )], 10, _hoisted_1$d)), [[_directive_ripple, {
+        )], 10, _hoisted_1$e)), [[_directive_ripple, {
           disabled: _ctx.disabled
         }]]);
       }),
@@ -17656,8 +17664,8 @@ var MOMENTUM_ALLOW_DISTANCE = 15;
 var TRANSITION_DURATION = 200;
 var MOMENTUM_TRANSITION_DURATION = 1e3;
 var sid$1 = 0;
-var _hoisted_1$c = ["onTouchstartPassive", "onTouchmove", "onTouchend"];
-var _hoisted_2$8 = ["onTransitionend"];
+var _hoisted_1$d = ["onTouchstartPassive", "onTouchmove", "onTouchend"];
+var _hoisted_2$9 = ["onTransitionend"];
 var _hoisted_3$7 = ["onClick"];
 function __render__$t(_ctx, _cache) {
   var _component_var_button = vue.resolveComponent("var-button");
@@ -17782,7 +17790,7 @@ function __render__$t(_ctx, _cache) {
                 }),
                 128
                 /* KEYED_FRAGMENT */
-              ))], 46, _hoisted_2$8)], 42, _hoisted_1$c);
+              ))], 46, _hoisted_2$9)], 42, _hoisted_1$d);
             }),
             128
             /* KEYED_FRAGMENT */
@@ -18167,6 +18175,9 @@ var _PickerComponent = VarPicker;
 function modeValidator(mode) {
   return ["linear", "circle"].includes(mode);
 }
+function typeValidator$2(type) {
+  return ["default", "primary", "info", "success", "warning", "danger"].includes(type);
+}
 var props$m = {
   mode: {
     type: String,
@@ -18209,16 +18220,24 @@ var props$m = {
   track: {
     type: Boolean,
     default: true
+  },
+  indeterminate: {
+    type: Boolean,
+    default: false
+  },
+  type: {
+    type: String,
+    default: "primary",
+    validator: typeValidator$2
   }
 };
 var {
   n: n$p,
   classes: classes$k
 } = createNamespace("progress");
-var ONE_HUNDRED = 100;
-var _hoisted_1$b = ["viewBox"];
-var _hoisted_2$7 = ["cx", "cy", "r", "stroke-width"];
-var _hoisted_3$6 = ["cx", "cy", "r", "stroke-width"];
+var _hoisted_1$c = ["viewBox"];
+var _hoisted_2$8 = ["r", "stroke-width", "stroke-dasharray"];
+var _hoisted_3$6 = ["r", "stroke-width", "stroke-dasharray", "stroke-dashoffset"];
 function __render__$s(_ctx, _cache) {
   return vue.openBlock(), vue.createElementBlock(
     "div",
@@ -18251,10 +18270,42 @@ function __render__$s(_ctx, _cache) {
           null,
           6
           /* CLASS, STYLE */
-        )) : vue.createCommentVNode("v-if", true), vue.createElementVNode(
+        )) : vue.createCommentVNode("v-if", true), _ctx.indeterminate ? (vue.openBlock(), vue.createElementBlock(
+          "div",
+          {
+            key: 1,
+            class: vue.normalizeClass(_ctx.classes([_ctx.indeterminate, _ctx.n("linear-indeterminate")]))
+          },
+          [vue.createElementVNode(
+            "div",
+            {
+              class: vue.normalizeClass(_ctx.classes(_ctx.n("linear--" + _ctx.type))),
+              style: vue.normalizeStyle({
+                background: _ctx.color
+              })
+            },
+            null,
+            6
+            /* CLASS, STYLE */
+          ), vue.createElementVNode(
+            "div",
+            {
+              class: vue.normalizeClass(_ctx.classes(_ctx.n("linear--" + _ctx.type))),
+              style: vue.normalizeStyle({
+                background: _ctx.color
+              })
+            },
+            null,
+            6
+            /* CLASS, STYLE */
+          )],
+          2
+          /* CLASS */
+        )) : (vue.openBlock(), vue.createElementBlock(
           "div",
           {
-            class: vue.normalizeClass(_ctx.classes(_ctx.n("linear-certain"), [_ctx.ripple, _ctx.n("linear-ripple")])),
+            key: 2,
+            class: vue.normalizeClass(_ctx.classes(_ctx.n("linear-certain"), _ctx.n("linear--" + _ctx.type), [_ctx.ripple, _ctx.n("linear-ripple")])),
             style: vue.normalizeStyle({
               background: _ctx.color,
               width: _ctx.linearProps.width
@@ -18263,7 +18314,7 @@ function __render__$s(_ctx, _cache) {
           null,
           6
           /* CLASS, STYLE */
-        )],
+        ))],
         6
         /* CLASS, STYLE */
       ), _ctx.label ? (vue.openBlock(), vue.createElementBlock(
@@ -18286,7 +18337,7 @@ function __render__$s(_ctx, _cache) {
       "div",
       {
         key: 1,
-        class: vue.normalizeClass(_ctx.n("circle")),
+        class: vue.normalizeClass(_ctx.classes(_ctx.n("circle"), [_ctx.indeterminate, _ctx.n("circle-indeterminate")])),
         style: vue.normalizeStyle({
           width: _ctx.toSizeUnit(_ctx.size),
           height: _ctx.toSizeUnit(_ctx.size)
@@ -18301,27 +18352,28 @@ function __render__$s(_ctx, _cache) {
       }, [_ctx.track ? (vue.openBlock(), vue.createElementBlock("circle", {
         key: 0,
         class: vue.normalizeClass(_ctx.n("circle-background")),
-        cx: _ctx.multiplySizeUnit(_ctx.size, 0.5),
-        cy: _ctx.multiplySizeUnit(_ctx.size, 0.5),
-        r: _ctx.circleProps.radius,
+        cx: "50%",
+        cy: "50%",
+        r: _ctx.RADIUS,
         fill: "transparent",
-        "stroke-width": _ctx.toSizeUnit(_ctx.lineWidth),
+        "stroke-width": _ctx.circleProps.strokeWidth,
+        "stroke-dasharray": _ctx.CIRCUMFERENCE,
         style: vue.normalizeStyle({
-          strokeDasharray: _ctx.circleProps.perimeter,
           stroke: _ctx.trackColor
         })
-      }, null, 14, _hoisted_2$7)) : vue.createCommentVNode("v-if", true), vue.createElementVNode("circle", {
-        class: vue.normalizeClass(_ctx.n("circle-certain")),
-        cx: _ctx.multiplySizeUnit(_ctx.size, 0.5),
-        cy: _ctx.multiplySizeUnit(_ctx.size, 0.5),
-        r: _ctx.circleProps.radius,
+      }, null, 14, _hoisted_2$8)) : vue.createCommentVNode("v-if", true), vue.createElementVNode("circle", {
+        class: vue.normalizeClass(_ctx.classes(_ctx.n("circle-certain"), _ctx.n("circle--" + _ctx.type), [_ctx.indeterminate, _ctx.n("circle-overlay")])),
+        cx: "50%",
+        cy: "50%",
+        r: _ctx.RADIUS,
         fill: "transparent",
-        "stroke-width": _ctx.toSizeUnit(_ctx.lineWidth),
+        "stroke-width": _ctx.circleProps.strokeWidth,
+        "stroke-dasharray": _ctx.CIRCUMFERENCE,
+        "stroke-dashoffset": _ctx.circleProps.strokeOffset,
         style: vue.normalizeStyle({
-          strokeDasharray: _ctx.circleProps.strokeDasharray,
           stroke: _ctx.color
         })
-      }, null, 14, _hoisted_3$6)], 14, _hoisted_1$b)), _ctx.label ? (vue.openBlock(), vue.createElementBlock(
+      }, null, 14, _hoisted_3$6)], 14, _hoisted_1$c)), _ctx.label ? (vue.openBlock(), vue.createElementBlock(
         "div",
         {
           key: 0,
@@ -18346,6 +18398,9 @@ var __sfc__$t = vue.defineComponent({
   name: "VarProgress",
   props: props$m,
   setup(props2) {
+    var ONE_HUNDRED = 100;
+    var RADIUS = 20;
+    var CIRCUMFERENCE = 2 * Math.PI * RADIUS;
     var linearProps = vue.computed(() => {
       var value = toNumber(props2.value);
       var width = value > ONE_HUNDRED ? ONE_HUNDRED : value;
@@ -18361,16 +18416,15 @@ var __sfc__$t = vue.defineComponent({
         lineWidth,
         value
       } = props2;
-      var viewBox = "0 0 " + toPxNum(size) + " " + toPxNum(size);
+      var diameter = RADIUS / (1 - toPxNum(lineWidth) / toPxNum(size)) * 2;
+      var viewBox = "0 0 " + diameter + " " + diameter;
       var roundValue = toNumber(value) > ONE_HUNDRED ? ONE_HUNDRED : Math.round(toNumber(value));
-      var radius = (toPxNum(size) - toPxNum(lineWidth)) / 2;
-      var perimeter = 2 * Math.PI * radius;
-      var strokeDasharray = roundValue / ONE_HUNDRED * perimeter + ", " + perimeter;
+      var strokeOffset = "" + (ONE_HUNDRED - roundValue) / ONE_HUNDRED * CIRCUMFERENCE;
+      var strokeWidth = toPxNum(lineWidth) / toPxNum(size) * diameter;
       return {
+        strokeWidth,
         viewBox,
-        radius,
-        strokeDasharray,
-        perimeter,
+        strokeOffset,
         roundValue: roundValue + "%"
       };
     });
@@ -18378,8 +18432,9 @@ var __sfc__$t = vue.defineComponent({
       n: n$p,
       classes: classes$k,
       toSizeUnit,
-      multiplySizeUnit,
       linearProps,
+      CIRCUMFERENCE,
+      RADIUS,
       circleProps
     };
   }
@@ -18560,7 +18615,7 @@ var __sfc__$s = vue.defineComponent({
       eventTargetScroller = getParentScroller(event.target);
     };
     var touchMove = (event) => {
-      if (!isTouchable.value) {
+      if (!isTouchable.value || !eventTargetScroller) {
         return;
       }
       if (eventTargetScroller !== scroller && getScrollTop(eventTargetScroller) > 0) {
@@ -18580,7 +18635,7 @@ var __sfc__$s = vue.defineComponent({
         refreshStatus.value = "pulling";
         startPosition.value = event.touches[0].clientY;
       }
-      if (isReachTop && distance.value > controlPosition.value) {
+      if (isReachTop && isNumber(distance.value) && distance.value > controlPosition.value) {
         lockEvent("add");
       }
       var moveDistance = (event.touches[0].clientY - startPosition.value) / 2 + controlPosition.value;
@@ -18593,7 +18648,7 @@ var __sfc__$s = vue.defineComponent({
           return;
         }
         isEnd.value = true;
-        if (distance.value >= maxDistance.value * 0.2) {
+        if (toNumber(distance.value) >= maxDistance.value * 0.2) {
           yield startIconTransition("refresh");
           refreshStatus.value = "loading";
           distance.value = maxDistance.value * 0.3;
@@ -19134,7 +19189,7 @@ var props$i = {
 var {
   n: n$l
 } = createNamespace("rate");
-var _hoisted_1$a = ["onClick"];
+var _hoisted_1$b = ["onClick"];
 function __render__$o(_ctx, _cache) {
   var _component_var_icon = vue.resolveComponent("var-icon");
   var _component_var_hover_overlay = vue.resolveComponent("var-hover-overlay");
@@ -19171,7 +19226,7 @@ function __render__$o(_ctx, _cache) {
             })
           }, null, 8, ["class", "namespace", "name", "style"]), vue.createVNode(_component_var_hover_overlay, {
             hovering: _ctx.hovering && value === _ctx.currentHoveringValue && !_ctx.disabled && !_ctx.formDisabled
-          }, null, 8, ["hovering"])], 14, _hoisted_1$a)), [[_directive_ripple, {
+          }, null, 8, ["hovering"])], 14, _hoisted_1$b)), [[_directive_ripple, {
             disabled: _ctx.formReadonly || _ctx.readonly || _ctx.formDisabled || _ctx.disabled || !_ctx.ripple
           }], [_directive_hover, _ctx.createHoverHandler(value), "desktop"]]);
         }),
@@ -19364,12 +19419,12 @@ var props$h = {
     default: true
   }
 };
-var _withScopeId$5 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-var _hoisted_1$9 = {
+var _withScopeId$6 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
+var _hoisted_1$a = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "2 3.6 20 20"
 };
-var _hoisted_2$6 = /* @__PURE__ */ _withScopeId$5(() => /* @__PURE__ */ vue.createElementVNode(
+var _hoisted_2$7 = /* @__PURE__ */ _withScopeId$6(() => /* @__PURE__ */ vue.createElementVNode(
   "path",
   {
     d: "M11,9H13V7H11M11,20H13V11H11V20Z"
@@ -19378,19 +19433,19 @@ var _hoisted_2$6 = /* @__PURE__ */ _withScopeId$5(() => /* @__PURE__ */ vue.crea
   -1
   /* HOISTED */
 ));
-var _hoisted_3$5 = [_hoisted_2$6];
+var _hoisted_3$5 = [_hoisted_2$7];
 function __render__$n(_ctx, _cache) {
-  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$9, _hoisted_3$5);
+  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$a, _hoisted_3$5);
 }
 var __sfc__$o = vue.defineComponent({});
 __sfc__$o.render = __render__$n;
 const Info = __sfc__$o;
-var _withScopeId$4 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-var _hoisted_1$8 = {
+var _withScopeId$5 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
+var _hoisted_1$9 = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "2 2 20 20"
 };
-var _hoisted_2$5 = /* @__PURE__ */ _withScopeId$4(() => /* @__PURE__ */ vue.createElementVNode(
+var _hoisted_2$6 = /* @__PURE__ */ _withScopeId$5(() => /* @__PURE__ */ vue.createElementVNode(
   "path",
   {
     d: "M19,3V5H19V19M17,8.4L13.4,12L17,15.6L15.6,17L12,13.4L8.4,17L7,15.6L10.6,12L7,8.4L8.4,7L12,10.6L15.6,7L17,8.4Z"
@@ -19399,19 +19454,19 @@ var _hoisted_2$5 = /* @__PURE__ */ _withScopeId$4(() => /* @__PURE__ */ vue.crea
   -1
   /* HOISTED */
 ));
-var _hoisted_3$4 = [_hoisted_2$5];
+var _hoisted_3$4 = [_hoisted_2$6];
 function __render__$m(_ctx, _cache) {
-  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$8, _hoisted_3$4);
+  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$9, _hoisted_3$4);
 }
 var __sfc__$n = vue.defineComponent({});
 __sfc__$n.render = __render__$m;
 const Error$1 = __sfc__$n;
-var _withScopeId$3 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-var _hoisted_1$7 = {
+var _withScopeId$4 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
+var _hoisted_1$8 = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "-6 -4 35 35"
 };
-var _hoisted_2$4 = /* @__PURE__ */ _withScopeId$3(() => /* @__PURE__ */ vue.createElementVNode(
+var _hoisted_2$5 = /* @__PURE__ */ _withScopeId$4(() => /* @__PURE__ */ vue.createElementVNode(
   "path",
   {
     d: "M10,21H14A2,2 0 0,1 12,23A2,2 0 0,1 10,21M21,19V20H3V19L5,17V11C5,7.9 7.03,5.17 10,4.29C10,4.19 10,4.1 10,4A2,2 0 0,1 12,2A2,2 0 0,1 14,4C14,4.1 14,4.19 14,4.29C16.97,5.17 19,7.9 19,11V17L21,19M17,11A5,5 0 0,0 12,6A5,5 0 0,0 7,11V18H17V11M19.75,3.19L18.33,4.61M1,11"
@@ -19420,9 +19475,9 @@ var _hoisted_2$4 = /* @__PURE__ */ _withScopeId$3(() => /* @__PURE__ */ vue.crea
   -1
   /* HOISTED */
 ));
-var _hoisted_3$3 = [_hoisted_2$4];
+var _hoisted_3$3 = [_hoisted_2$5];
 function __render__$l(_ctx, _cache) {
-  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$7, _hoisted_3$3);
+  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$8, _hoisted_3$3);
 }
 var __sfc__$m = vue.defineComponent({});
 __sfc__$m.render = __render__$l;
@@ -19524,12 +19579,12 @@ var __sfc__$l = vue.defineComponent({
 });
 __sfc__$l.render = __render__$k;
 const Success = __sfc__$l;
-var _withScopeId$2 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-var _hoisted_1$6 = {
+var _withScopeId$3 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
+var _hoisted_1$7 = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "-3 -3 30 30"
 };
-var _hoisted_2$3 = /* @__PURE__ */ _withScopeId$2(() => /* @__PURE__ */ vue.createElementVNode(
+var _hoisted_2$4 = /* @__PURE__ */ _withScopeId$3(() => /* @__PURE__ */ vue.createElementVNode(
   "path",
   {
     d: "M10,19H13V22H10V19M12,2C17.35,2.22 19.68,7.62 16.5,11.67C15.67,12.67 14.33,13.33 13.67,14.17C13,15 13,16 13,17H10C10,15.33 10,13.92 10.67,12.92C11.33,11.92 12.67,11.33 13.5,10.67C15.92,8.43 15.32,5.26 12,5A3,3 0 0,0 9,8H6A6,6 0 0,1 12,2Z"
@@ -19538,18 +19593,18 @@ var _hoisted_2$3 = /* @__PURE__ */ _withScopeId$2(() => /* @__PURE__ */ vue.crea
   -1
   /* HOISTED */
 ));
-var _hoisted_3$2 = [_hoisted_2$3];
+var _hoisted_3$2 = [_hoisted_2$4];
 function __render__$j(_ctx, _cache) {
-  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$6, _hoisted_3$2);
+  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$7, _hoisted_3$2);
 }
 var __sfc__$k = vue.defineComponent({});
 __sfc__$k.render = __render__$j;
 const Question = __sfc__$k;
-var _withScopeId$1 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
-var _hoisted_1$5 = {
+var _withScopeId$2 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
+var _hoisted_1$6 = {
   viewBox: "-4 -4 32 32"
 };
-var _hoisted_2$2 = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ vue.createElementVNode(
+var _hoisted_2$3 = /* @__PURE__ */ _withScopeId$2(() => /* @__PURE__ */ vue.createElementVNode(
   "path",
   {
     fill: "currentColor",
@@ -19559,9 +19614,9 @@ var _hoisted_2$2 = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ vue.crea
   -1
   /* HOISTED */
 ));
-var _hoisted_3$1 = [_hoisted_2$2];
+var _hoisted_3$1 = [_hoisted_2$3];
 function __render__$i(_ctx, _cache) {
-  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$5, _hoisted_3$1);
+  return vue.openBlock(), vue.createElementBlock("svg", _hoisted_1$6, _hoisted_3$1);
 }
 var __sfc__$j = vue.defineComponent({});
 __sfc__$j.render = __render__$i;
@@ -19829,7 +19884,7 @@ var {
   n: n$h,
   classes: classes$d
 } = createNamespace("select");
-var _hoisted_1$4 = {
+var _hoisted_1$5 = {
   key: 1
 };
 function __render__$f(_ctx, _cache) {
@@ -19962,7 +20017,7 @@ function __render__$f(_ctx, _cache) {
                 /* STABLE_FRAGMENT */
               )) : (vue.openBlock(), vue.createElementBlock(
                 "span",
-                _hoisted_1$4,
+                _hoisted_1$5,
                 vue.toDisplayString(_ctx.label),
                 1
                 /* TEXT */
@@ -20616,7 +20671,7 @@ var {
   n: n$f,
   classes: classes$b
 } = createNamespace("slider");
-var _hoisted_1$3 = ["onTouchstart"];
+var _hoisted_1$4 = ["onTouchstart"];
 function __render__$d(_ctx, _cache) {
   var _component_var_hover_overlay = vue.resolveComponent("var-hover-overlay");
   var _component_var_form_details = vue.resolveComponent("var-form-details");
@@ -20720,7 +20775,7 @@ function __render__$d(_ctx, _cache) {
             )],
             6
             /* CLASS, STYLE */
-          )])], 46, _hoisted_1$3);
+          )])], 46, _hoisted_1$4);
         }),
         128
         /* KEYED_FRAGMENT */
@@ -21780,7 +21835,7 @@ var {
   n: n$b,
   classes: classes$8
 } = createNamespace("step");
-var _hoisted_1$2 = {
+var _hoisted_1$3 = {
   key: 3
 };
 function __render__$a(_ctx, _cache) {
@@ -21823,7 +21878,7 @@ function __render__$a(_ctx, _cache) {
           name: _ctx.inactiveIcon
         }, null, 8, ["class", "name"])) : (vue.openBlock(), vue.createElementBlock(
           "span",
-          _hoisted_1$2,
+          _hoisted_1$3,
           vue.toDisplayString(_ctx.index + 1),
           1
           /* TEXT */
@@ -21877,7 +21932,7 @@ var __sfc__$b = vue.defineComponent({
       clickStep
     } = steps2;
     var isCurrent = vue.computed(() => active.value === index.value);
-    var isActive = vue.computed(() => index.value !== -1 && active.value > index.value);
+    var isActive = vue.computed(() => index.value !== -1 && toNumber(active.value) > index.value);
     var stepProvider = {
       index
     };
@@ -22068,8 +22123,23 @@ var {
   n: n$8,
   classes: classes$7
 } = createNamespace("switch");
+var _withScopeId$1 = (n2) => (vue.pushScopeId(""), n2 = n2(), vue.popScopeId(), n2);
+var _hoisted_1$2 = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ vue.createElementVNode(
+  "svg",
+  {
+    viewBox: "25 25 50 50"
+  },
+  [/* @__PURE__ */ vue.createElementVNode("circle", {
+    cx: "50",
+    cy: "50",
+    r: "20",
+    fill: "none"
+  })],
+  -1
+  /* HOISTED */
+));
+var _hoisted_2$2 = [_hoisted_1$2];
 function __render__$8(_ctx, _cache) {
-  var _component_var_loading = vue.resolveComponent("var-loading");
   var _component_var_hover_overlay = vue.resolveComponent("var-hover-overlay");
   var _component_var_form_details = vue.resolveComponent("var-form-details");
   var _directive_ripple = vue.resolveDirective("ripple");
@@ -22109,11 +22179,20 @@ function __render__$8(_ctx, _cache) {
             style: vue.normalizeStyle(_ctx.styleComputed.handle),
             class: vue.normalizeClass(_ctx.classes(_ctx.n("handle"), _ctx.n("$-elevation--2"), [_ctx.modelValue === _ctx.activeValue, _ctx.n("handle--active")], [_ctx.errorMessage, _ctx.n("handle--error")]))
           },
-          [_ctx.loading ? (vue.openBlock(), vue.createBlock(_component_var_loading, {
-            key: 0,
-            radius: _ctx.radius,
-            color: "currentColor"
-          }, null, 8, ["radius"])) : vue.createCommentVNode("v-if", true)],
+          [_ctx.loading ? (vue.openBlock(), vue.createElementBlock(
+            "span",
+            {
+              key: 0,
+              class: vue.normalizeClass(_ctx.n("loading")),
+              style: vue.normalizeStyle({
+                width: _ctx.multiplySizeUnit(_ctx.radius, 2),
+                height: _ctx.multiplySizeUnit(_ctx.radius, 2)
+              })
+            },
+            _hoisted_2$2,
+            6
+            /* CLASS, STYLE */
+          )) : vue.createCommentVNode("v-if", true)],
           6
           /* CLASS, STYLE */
         ), vue.createVNode(_component_var_hover_overlay, {
@@ -22136,7 +22215,6 @@ function __render__$8(_ctx, _cache) {
 var __sfc__$8 = vue.defineComponent({
   name: "VarSwitch",
   components: {
-    VarLoading: Loading,
     VarFormDetails: FormDetails,
     VarHoverOverlay: HoverOverlay
   },
@@ -22197,7 +22275,7 @@ var __sfc__$8 = vue.defineComponent({
         }
       };
     });
-    var radius = vue.computed(() => multiplySizeUnit(props2.size || 0, 0.4));
+    var radius = vue.computed(() => multiplySizeUnit(props2.size, 0.4));
     var switchActive = (event) => {
       var {
         onClick,
@@ -22236,6 +22314,7 @@ var __sfc__$8 = vue.defineComponent({
     return {
       n: n$8,
       classes: classes$7,
+      multiplySizeUnit,
       switchActive,
       hovering,
       hover,
@@ -24327,7 +24406,14 @@ function __render__(_ctx, _cache) {
     ), vue.createVNode(_component_var_form_details, {
       "error-message": _ctx.errorMessage,
       "extra-message": _ctx.maxlengthText
-    }, null, 8, ["error-message", "extra-message"]), vue.createVNode(_component_var_popup, {
+    }, vue.createSlots({
+      _: 2
+      /* DYNAMIC */
+    }, [_ctx.$slots["extra-message"] ? {
+      name: "extra-message",
+      fn: vue.withCtx(() => [vue.renderSlot(_ctx.$slots, "extra-message")]),
+      key: "0"
+    } : void 0]), 1032, ["error-message", "extra-message"]), vue.createVNode(_component_var_popup, {
       class: vue.normalizeClass(_ctx.n("preview")),
       "var-uploader-cover": "",
       position: "center",
@@ -24797,7 +24883,7 @@ const TimePickerSfc = "";
 const TooltipSfc = "";
 const uploader = "";
 const UploaderSfc = "";
-const version = "2.12.2";
+const version = "2.12.4-alpha.1689047623608";
 function install(app) {
   ActionSheet.install && app.use(ActionSheet);
   AppBar.install && app.use(AppBar);