@varlet/ui 2.8.5 → 2.8.6-alpha.1678026101378

package/lib/varlet.cjs.js

@@ -375,6 +375,88 @@ function supportTouch() {
 function padStartFlex(style) {
   return style === "start" || style === "end" ? "flex-" + style : style;
 }
+function useMounted(hook) {
+  let isMounted = false;
+  vue.onMounted(() => {
+    hook();
+    vue.nextTick(() => {
+      isMounted = true;
+    });
+  });
+  vue.onActivated(() => {
+    if (!isMounted) {
+      return;
+    }
+    hook();
+  });
+}
+function useEventListener(target, type, listener, options = {}) {
+  if (!inBrowser()) {
+    return;
+  }
+  const { passive: passive2 = false, capture = false } = options;
+  let listening = false;
+  let cleaned = false;
+  const add2 = (target2) => {
+    if (listening || cleaned) {
+      return;
+    }
+    const element = vue.unref(target2);
+    if (element) {
+      element.addEventListener(type, listener, {
+        passive: passive2,
+        capture
+      });
+      listening = true;
+    }
+  };
+  const remove = (target2) => {
+    if (!listening || cleaned) {
+      return;
+    }
+    const element = vue.unref(target2);
+    if (element) {
+      element.removeEventListener(type, listener, {
+        capture
+      });
+      listening = false;
+    }
+  };
+  let watchStopHandle;
+  if (vue.isRef(target)) {
+    watchStopHandle = vue.watch(() => target.value, (newValue, oldValue) => {
+      remove(oldValue);
+      add2(newValue);
+    });
+  }
+  const cleanup = () => {
+    watchStopHandle === null || watchStopHandle === void 0 ? void 0 : watchStopHandle();
+    remove(target);
+    cleaned = true;
+  };
+  useMounted(() => {
+    add2(target);
+  });
+  vue.onBeforeUnmount(() => {
+    remove(target);
+  });
+  vue.onDeactivated(() => {
+    remove(target);
+  });
+  return cleanup;
+}
+function useClickOutside(target, type, listener) {
+  if (!inBrowser()) {
+    return;
+  }
+  const handler = (event) => {
+    const element = vue.unref(target);
+    if (element && !element.contains(event.target)) {
+      listener(event);
+    }
+  };
+  useEventListener(document, type, handler);
+}
 var _excluded = ["collect", "clear"];
 function asyncGeneratorStep$d(gen, resolve, reject, _next, _throw, key, arg) {
   try {
@@ -624,14 +706,8 @@ function useValidation() {
   };
 }
 function useRouteListener(cb) {
-  vue.onMounted(() => {
-    window.addEventListener("hashchange", cb);
-    window.addEventListener("popstate", cb);
-  });
-  vue.onUnmounted(() => {
-    window.removeEventListener("hashchange", cb);
-    window.removeEventListener("popstate", cb);
-  });
+  useEventListener(window, "hashchange", cb);
+  useEventListener(window, "popstate", cb);
 }
 function useTeleport() {
   var disabled = vue.ref(false);
@@ -1937,7 +2013,7 @@ var __sfc__$1d = vue.defineComponent({
         color: textColor
       };
     });
-    vue.onMounted(computePadding);
+    useMounted(computePadding);
     vue.onUpdated(computePadding);
     return {
       n: n$1b,
@@ -2372,7 +2448,7 @@ var __sfc__$1c = vue.defineComponent({
     var handleClick = (e) => {
       call(props2.onClick, e);
     };
-    vue.onMounted(getScale);
+    useMounted(getScale);
     vue.onUpdated(getScale);
     return {
       internalSizeValidator: internalSizeValidator$1,
@@ -2960,7 +3036,7 @@ function __render__$17(_ctx, _cache) {
         }
       }, _ctx.$attrs, {
         onClick: _cache[0] || (_cache[0] = vue.withModifiers(function() {
-          return _ctx.click && _ctx.click(...arguments);
+          return _ctx.handleClick && _ctx.handleClick(...arguments);
         }, ["stop"]))
       }),
       [vue.renderSlot(_ctx.$slots, "default", {}, () => [vue.createVNode(_component_var_button, {
@@ -2993,28 +3069,36 @@ var __sfc__$18 = vue.defineComponent({
     var show = vue.ref(false);
     var backTopEl = vue.ref(null);
     var disabled = vue.ref(true);
-    var target;
-    var click = (event) => {
+    var scroller;
+    var handleClick = (event) => {
       call(props2.onClick, event);
-      var left2 = getScrollLeft(target);
-      scrollTo(target, {
+      var left2 = getScrollLeft(scroller);
+      scrollTo(scroller, {
         left: left2,
         duration: props2.duration,
         animation: easeInOutCubic
       });
     };
-    var scroll = () => {
-      show.value = getScrollTop(target) >= toPxNum(props2.visibilityHeight);
+    var handleScroll = throttle(() => {
+      show.value = getScrollTop(scroller) >= toPxNum(props2.visibilityHeight);
+    }, 200);
+    var setScroller = () => {
+      scroller = props2.target ? getTarget(props2.target, "BackTop") : getParentScroller(backTopEl.value);
+    };
+    var addScrollerEventListener = () => {
+      scroller.addEventListener("scroll", handleScroll);
+    };
+    var removeScrollerEventListener = () => {
+      scroller.removeEventListener("scroll", handleScroll);
     };
-    var throttleScroll = throttle(scroll, 200);
     vue.onMounted(() => {
-      target = props2.target ? getTarget(props2.target, "BackTop") : getParentScroller(backTopEl.value);
-      target.addEventListener("scroll", throttleScroll);
+      setScroller();
+      addScrollerEventListener();
       disabled.value = false;
     });
-    vue.onBeforeUnmount(() => {
-      target.removeEventListener("scroll", throttleScroll);
-    });
+    vue.onActivated(addScrollerEventListener);
+    vue.onBeforeUnmount(removeScrollerEventListener);
+    vue.onDeactivated(removeScrollerEventListener);
     return {
       disabled,
       show,
@@ -3022,7 +3106,7 @@ var __sfc__$18 = vue.defineComponent({
       toSizeUnit,
       n: n$16,
       classes: classes$V,
-      click
+      handleClick
     };
   }
 });
@@ -3427,7 +3511,7 @@ var __sfc__$16 = vue.defineComponent({
       immediate: true,
       deep: true
     });
-    vue.onMounted(() => {
+    useMounted(() => {
       if (!slots.fab) {
         return;
       }
@@ -5844,29 +5928,34 @@ var __sfc__$U = vue.defineComponent({
         autoStart
       } = props2;
       var now = performance.now();
-      if (!endTime.value)
+      if (!endTime.value) {
         endTime.value = now + toNumber(time);
+      }
       var durationTime = endTime.value - now;
-      if (durationTime < 0)
+      if (durationTime < 0) {
         durationTime = 0;
+      }
       pauseTime.value = durationTime;
       formatTime(durationTime);
       if (durationTime === 0) {
         call(onEnd);
         return;
       }
-      if (autoStart || isStart.value)
+      if (autoStart || isStart.value) {
         handle.value = requestAnimationFrame(countdown);
+      }
     };
     var start2 = () => {
-      if (isStart.value)
+      if (isStart.value) {
         return;
+      }
       isStart.value = true;
-      endTime.value = Date.now() + (pauseTime.value || toNumber(props2.time));
+      endTime.value = performance.now() + (pauseTime.value || toNumber(props2.time));
       countdown();
     };
     var pause = () => {
       isStart.value = false;
+      cancelAnimationFrame(handle.value);
     };
     var reset = () => {
       endTime.value = 0;
@@ -5874,9 +5963,12 @@ var __sfc__$U = vue.defineComponent({
       cancelAnimationFrame(handle.value);
       countdown();
     };
-    vue.watch(() => props2.time, () => reset(), {
+    vue.watch(() => props2.time, reset, {
       immediate: true
     });
+    vue.onActivated(start2);
+    vue.onDeactivated(pause);
+    vue.onUnmounted(pause);
     return {
       showTime,
       timeData,
@@ -9711,7 +9803,7 @@ var __sfc__$Q = vue.defineComponent({
     var chooseYear = (year) => {
       emit("choose-year", year);
     };
-    vue.onMounted(() => {
+    useMounted(() => {
       var activeEl = document.querySelector("." + n$O("item--active"));
       activeEl == null ? void 0 : activeEl.scrollIntoView({
         block: "center"
@@ -10079,7 +10171,7 @@ var __sfc__$P = vue.defineComponent({
     var forwardRef = (checkType) => {
       headerEl.value.checkDate(checkType);
     };
-    vue.onMounted(() => {
+    useMounted(() => {
       initDate();
       initHeader();
     });
@@ -11155,7 +11247,9 @@ var __sfc__$M = vue.defineComponent({
     var state = vue.reactive({
       withText: false
     });
-    var isInset = vue.computed(() => isBoolean(props2.inset) ? props2.inset : true);
+    var isInset = vue.computed(() => {
+      return isBoolean(props2.inset) ? props2.inset : true;
+    });
     var style = vue.computed(() => {
       var {
         inset,
@@ -11165,8 +11259,9 @@ var __sfc__$M = vue.defineComponent({
       var baseStyle = {
         margin
       };
-      if (isBoolean(inset) || inset === 0)
+      if (isBoolean(inset) || inset === 0) {
         return _extends$7({}, baseStyle);
+      }
       var _inset = toNumber(inset);
       var absInsetWithUnit = Math.abs(_inset) + (inset + "").replace(_inset + "", "");
       return vertical ? _extends$7({}, baseStyle, {
@@ -11179,7 +11274,7 @@ var __sfc__$M = vue.defineComponent({
     var checkHasText = () => {
       state.withText = Boolean(slots.default) || Boolean(props2.description);
     };
-    vue.onMounted(() => {
+    useMounted(() => {
       checkHasText();
     });
     vue.onUpdated(() => {
@@ -12521,7 +12616,6 @@ function usePopover(options) {
     zIndex
   } = useZIndex(() => show.value, 1);
   var popoverInstance = null;
-  var clickSelf = false;
   var enterPopover = false;
   var enterHost = false;
   var computeHostSize = () => {
@@ -12581,16 +12675,17 @@ function usePopover(options) {
   }();
   var handleHostClick = () => {
     open();
-    clickSelf = true;
   };
   var handlePopoverClose = () => {
-    if (clickSelf) {
-      clickSelf = false;
-      return;
-    }
     show.value = false;
     call(options["onUpdate:show"], false);
   };
+  var handleClickOutside = () => {
+    if (options.trigger !== "click") {
+      return;
+    }
+    handlePopoverClose();
+  };
   var getPosition = () => {
     computeHostSize();
     var offset2 = {
@@ -12715,6 +12810,7 @@ function usePopover(options) {
     show.value = false;
     call(options["onUpdate:show"], false);
   };
+  useClickOutside(host, "click", handleClickOutside);
   vue.watch(() => options.show, (newValue) => {
     show.value = newValue != null ? newValue : false;
   }, {
@@ -12731,22 +12827,11 @@ function usePopover(options) {
       call(options.onClose);
     }
   });
-  vue.watch(() => options.trigger, (newValue) => {
-    if (newValue === "click") {
-      document.addEventListener("click", handlePopoverClose);
-    } else {
-      document.removeEventListener("click", handlePopoverClose);
-    }
-  });
   vue.watch(() => options.disabled, close2);
   vue.onMounted(() => {
     popoverInstance = createPopper(host.value, popover.value, getPopperOptions());
-    if (options.trigger === "click") {
-      document.addEventListener("click", handlePopoverClose);
-    }
   });
   vue.onUnmounted(() => {
-    document.removeEventListener("click", handlePopoverClose);
     popoverInstance.destroy();
   });
   return {
@@ -13958,13 +14043,10 @@ var __sfc__$H = vue.defineComponent({
       initialIndex();
       resize();
     }));
-    vue.onMounted(() => {
-      window.addEventListener("resize", resize);
-    });
-    vue.onUnmounted(() => {
-      window.removeEventListener("resize", resize);
-      stopAutoplay();
-    });
+    vue.onActivated(resize);
+    vue.onDeactivated(stopAutoplay);
+    vue.onUnmounted(stopAutoplay);
+    useEventListener(window, "resize", resize);
     return {
       n: n$F,
       classes: classes$y,
@@ -14657,6 +14739,9 @@ var __sfc__$E = vue.defineComponent({
       };
     };
     var handleScroll = () => {
+      if (!scroller) {
+        return;
+      }
       var fixedParams = computeFixedParams();
       if (fixedParams) {
         call(props2.onScroll, fixedParams.offsetTop, fixedParams.isFixed);
@@ -14677,7 +14762,6 @@ var __sfc__$E = vue.defineComponent({
         yield doubleRaf();
         scroller = getParentScroller(stickyEl.value);
         scroller !== window && scroller.addEventListener("scroll", handleScroll);
-        window.addEventListener("scroll", handleScroll);
         handleScroll();
       });
       return function addScrollListener2() {
@@ -14686,13 +14770,12 @@ var __sfc__$E = vue.defineComponent({
     }();
     var removeScrollListener = () => {
       scroller !== window && scroller.removeEventListener("scroll", handleScroll);
-      window.removeEventListener("scroll", handleScroll);
     };
     vue.watch(() => props2.disabled, resize);
-    vue.onActivated(addScrollListener);
-    vue.onDeactivated(removeScrollListener);
-    vue.onMounted(addScrollListener);
+    useMounted(addScrollListener);
     vue.onUnmounted(removeScrollListener);
+    vue.onDeactivated(removeScrollListener);
+    useEventListener(window, "scroll", handleScroll);
     return {
       n: n$C,
       classes: classes$w,
@@ -14976,7 +15059,6 @@ var __sfc__$C = vue.defineComponent({
       bindIndexAnchors
     } = useIndexAnchors();
     var clickedName = vue.ref("");
-    var scroller = vue.ref(null);
     var barEl = vue.ref(null);
     var anchorNameList = vue.ref([]);
     var active = vue.ref();
@@ -14984,6 +15066,7 @@ var __sfc__$C = vue.defineComponent({
     var cssMode = vue.computed(() => props2.cssMode);
     var stickyOffsetTop = vue.computed(() => toPxNum(props2.stickyOffsetTop));
     var zIndex = vue.computed(() => props2.zIndex);
+    var scroller = null;
     var indexBarProvider = {
       active,
       sticky: sticky2,
@@ -15002,22 +15085,23 @@ var __sfc__$C = vue.defineComponent({
       }
     };
     var getOffsetTop = () => {
-      if (!("getBoundingClientRect" in scroller.value))
+      if (!("getBoundingClientRect" in scroller)) {
         return 0;
+      }
       var {
         top: parentTop
-      } = scroller.value.getBoundingClientRect();
+      } = scroller.getBoundingClientRect();
       var {
         scrollTop
-      } = scroller.value;
+      } = scroller;
       var {
         top: targetTop
       } = barEl.value.getBoundingClientRect();
       return scrollTop - parentTop + targetTop;
     };
     var handleScroll = () => {
-      var scrollTop = getScrollTop(scroller.value);
-      var scrollHeight = scroller.value === window ? document.body.scrollHeight : scroller.value.scrollHeight;
+      var scrollTop = getScrollTop(scroller);
+      var scrollHeight = scroller === window ? document.body.scrollHeight : scroller.scrollHeight;
       var offsetTop = getOffsetTop();
       indexAnchors.forEach((anchor, index) => {
         var anchorTop = anchor.ownTop.value;
@@ -15039,24 +15123,27 @@ var __sfc__$C = vue.defineComponent({
           manualCall = false,
           options
         } = _ref;
-        if (manualCall)
+        if (manualCall) {
           call(props2.onClick, anchorName);
-        if (anchorName === active.value)
+        }
+        if (anchorName === active.value) {
           return;
+        }
         var indexAnchor = indexAnchors.find((_ref3) => {
           var {
             name
           } = _ref3;
           return anchorName === name.value;
         });
-        if (!indexAnchor)
+        if (!indexAnchor) {
           return;
+        }
         var offsetTop = getOffsetTop();
         var top2 = indexAnchor.ownTop.value - stickyOffsetTop.value + offsetTop;
-        var left2 = getScrollLeft(scroller.value);
+        var left2 = getScrollLeft(scroller);
         clickedName.value = anchorName;
         emitEvent(anchorName, options);
-        yield scrollTo(scroller.value, {
+        yield scrollTo(scroller, {
           left: left2,
           top: top2,
           animation: easeInOutCubic,
@@ -15070,6 +15157,21 @@ var __sfc__$C = vue.defineComponent({
         return _ref2.apply(this, arguments);
       };
     }();
+    var setScroller = /* @__PURE__ */ function() {
+      var _ref4 = _asyncToGenerator$5(function* () {
+        yield doubleRaf();
+        scroller = getParentScroller(barEl.value);
+      });
+      return function setScroller2() {
+        return _ref4.apply(this, arguments);
+      };
+    }();
+    var addScrollerListener = () => {
+      scroller.addEventListener("scroll", handleScroll);
+    };
+    var removeScrollerListener = () => {
+      scroller.removeEventListener("scroll", handleScroll);
+    };
     var scrollTo$1 = (index, options) => {
       requestAnimationFrame(() => anchorClick({
         anchorName: index,
@@ -15078,24 +15180,22 @@ var __sfc__$C = vue.defineComponent({
     };
     vue.watch(() => length.value, /* @__PURE__ */ _asyncToGenerator$5(function* () {
       yield doubleRaf();
-      indexAnchors.forEach((_ref5) => {
+      indexAnchors.forEach((_ref6) => {
         var {
           name,
           setOwnTop
-        } = _ref5;
+        } = _ref6;
         if (name.value)
           anchorNameList.value.push(name.value);
         setOwnTop();
       });
     }));
-    vue.onMounted(/* @__PURE__ */ _asyncToGenerator$5(function* () {
-      yield doubleRaf();
-      scroller.value = getParentScroller(barEl.value);
-      scroller.value.addEventListener("scroll", handleScroll);
+    useMounted(/* @__PURE__ */ _asyncToGenerator$5(function* () {
+      yield setScroller();
+      addScrollerListener();
     }));
-    vue.onBeforeUnmount(() => {
-      call(scroller.value.removeEventListener, "scroll", handleScroll);
-    });
+    vue.onBeforeUnmount(removeScrollerListener);
+    vue.onDeactivated(removeScrollerListener);
     return {
       n: n$A,
       classes: classes$u,
@@ -15211,7 +15311,7 @@ function __render__$A(_ctx, _cache) {
     "div",
     {
       class: vue.normalizeClass(_ctx.classes(_ctx.n(), _ctx.n("$--box"), [_ctx.disabled, _ctx.n("--disabled")])),
-      onClick: _cache[10] || (_cache[10] = function() {
+      onClick: _cache[14] || (_cache[14] = function() {
         return _ctx.handleClick && _ctx.handleClick(...arguments);
       })
     },
@@ -15277,6 +15377,12 @@ function __render__$A(_ctx, _cache) {
             }),
             onTouchstart: _cache[4] || (_cache[4] = function() {
               return _ctx.handleTouchstart && _ctx.handleTouchstart(...arguments);
+            }),
+            onCompositionstart: _cache[5] || (_cache[5] = function() {
+              return _ctx.handleCompositionStart && _ctx.handleCompositionStart(...arguments);
+            }),
+            onCompositionend: _cache[6] || (_cache[6] = function() {
+              return _ctx.handleCompositionEnd && _ctx.handleCompositionEnd(...arguments);
             })
           },
           "\n        ",
@@ -15298,20 +15404,26 @@ function __render__$A(_ctx, _cache) {
               color: _ctx.textColor,
               caretColor: !_ctx.errorMessage ? _ctx.focusColor : void 0
             }),
-            onFocus: _cache[5] || (_cache[5] = function() {
+            onFocus: _cache[7] || (_cache[7] = function() {
               return _ctx.handleFocus && _ctx.handleFocus(...arguments);
             }),
-            onBlur: _cache[6] || (_cache[6] = function() {
+            onBlur: _cache[8] || (_cache[8] = function() {
               return _ctx.handleBlur && _ctx.handleBlur(...arguments);
             }),
-            onInput: _cache[7] || (_cache[7] = function() {
+            onInput: _cache[9] || (_cache[9] = function() {
               return _ctx.handleInput && _ctx.handleInput(...arguments);
             }),
-            onChange: _cache[8] || (_cache[8] = function() {
+            onChange: _cache[10] || (_cache[10] = function() {
               return _ctx.handleChange && _ctx.handleChange(...arguments);
             }),
-            onTouchstart: _cache[9] || (_cache[9] = function() {
+            onTouchstart: _cache[11] || (_cache[11] = function() {
               return _ctx.handleTouchstart && _ctx.handleTouchstart(...arguments);
+            }),
+            onCompositionstart: _cache[12] || (_cache[12] = function() {
+              return _ctx.handleCompositionStart && _ctx.handleCompositionStart(...arguments);
+            }),
+            onCompositionend: _cache[13] || (_cache[13] = function() {
+              return _ctx.handleCompositionEnd && _ctx.handleCompositionEnd(...arguments);
             })
           },
           null,
@@ -15465,7 +15577,7 @@ var __sfc__$B = vue.defineComponent({
       call(props2.onBlur, e);
       validateWithTrigger("onBlur");
     };
-    var handleInput = (e) => {
+    var updateValue = (e) => {
       var target = e.target;
       var {
         value
@@ -15475,17 +15587,34 @@ var __sfc__$B = vue.defineComponent({
       }
       value = withMaxlength(withTrim(value));
       target.value = value;
+      return value;
+    };
+    var handleCompositionStart = (e) => {
+      Object.assign(e.target, {
+        composing: true
+      });
+    };
+    var handleCompositionEnd = (e) => {
+      var target = e.target;
+      if (target.composing) {
+        target.composing = false;
+        target.dispatchEvent(new Event("input"));
+      }
+    };
+    var handleInput = (e) => {
+      var {
+        composing
+      } = e.target;
+      if (composing) {
+        return;
+      }
+      var value = updateValue(e);
       call(props2["onUpdate:modelValue"], value);
       call(props2.onInput, value, e);
       validateWithTrigger("onInput");
     };
     var handleChange = (e) => {
-      var target = e.target;
-      var {
-        value
-      } = target;
-      value = withMaxlength(withTrim(value));
-      target.value = value;
+      var value = updateValue(e);
       call(props2.onChange, value, e);
       validateWithTrigger("onChange");
     };
@@ -15555,7 +15684,7 @@ var __sfc__$B = vue.defineComponent({
       resetValidation
     };
     call(bindForm, inputProvider);
-    vue.onMounted(() => {
+    useMounted(() => {
       if (props2.autofocus) {
         focus();
       }
@@ -15580,6 +15709,8 @@ var __sfc__$B = vue.defineComponent({
       handleClear,
       handleClick,
       handleTouchstart,
+      handleCompositionStart,
+      handleCompositionEnd,
       validate,
       resetValidation,
       reset,
@@ -15907,7 +16038,7 @@ var __sfc__$z = vue.defineComponent({
         return _ref.apply(this, arguments);
       };
     }();
-    vue.onMounted(() => {
+    useMounted(() => {
       scroller = getParentScroller(listEl.value);
       props2.immediateCheck && check2();
       scroller.addEventListener("scroll", check2);
@@ -18060,6 +18191,9 @@ var __sfc__$s = vue.defineComponent({
       distance.value = -(width + width * 0.25);
       controlPosition.value = -(width + width * 0.25);
     };
+    var setScroller = () => {
+      scroller = props2.target ? getTarget(props2.target, "PullRefresh") : getParentScroller(freshNode.value);
+    };
     var reset = () => {
       setTimeout(() => {
         refreshStatus.value = "default";
@@ -18078,18 +18212,11 @@ var __sfc__$s = vue.defineComponent({
         }, toNumber(props2.successDuration));
       }
     });
-    vue.onMounted(() => {
-      var _freshNode$value;
-      scroller = props2.target ? getTarget(props2.target, "PullRefresh") : getParentScroller(freshNode.value);
+    useMounted(() => {
+      setScroller();
       setPosition();
-      (_freshNode$value = freshNode.value) == null ? void 0 : _freshNode$value.addEventListener("touchmove", touchMove, {
-        passive: false
-      });
-    });
-    vue.onBeforeUnmount(() => {
-      var _freshNode$value2;
-      (_freshNode$value2 = freshNode.value) == null ? void 0 : _freshNode$value2.removeEventListener("touchmove", touchMove);
     });
+    useEventListener(freshNode, "touchmove", touchMove);
     return {
       n: n$o,
       classes: classes$j,
@@ -20533,7 +20660,7 @@ var __sfc__$e = vue.defineComponent({
       setProps(modelValue, toNumber(step2));
     });
     vue.watch(maxWidth, () => setProps());
-    vue.onMounted(() => {
+    useMounted(() => {
       if (!stepValidator() || !valueValidator())
         return;
       maxWidth.value = sliderEl.value.offsetWidth;
@@ -20770,7 +20897,7 @@ var __sfc__$d = vue.defineComponent({
       clearTimeout(timer2.value);
       updateAfterDuration();
     });
-    vue.onMounted(() => {
+    useMounted(() => {
       if (props2.show) {
         call(props2.onOpen);
         updateAfterDuration();
@@ -22392,8 +22519,7 @@ var __sfc__$4 = vue.defineComponent({
       resize();
     }));
     vue.watch(() => props2.active, resize);
-    vue.onMounted(() => window.addEventListener("resize", resize));
-    vue.onUnmounted(() => window.removeEventListener("resize", resize));
+    useEventListener(window, "resize", resize);
     return {
       stickyComponent,
       indicatorWidth,
@@ -24375,7 +24501,7 @@ const TimePickerSfc = "";
 const TooltipSfc = "";
 const uploader = "";
 const UploaderSfc = "";
-const version = "2.8.5";
+const version = "2.8.6-alpha.1678026101378";
 function install(app) {
   ActionSheet.install && app.use(ActionSheet);
   AppBar.install && app.use(AppBar);