@varlet/ui 2.11.4 → 2.11.6-alpha.1686800314469

package/lib/varlet.cjs.js

@@ -415,7 +415,7 @@ function supportTouch() {
 function padStartFlex(style) {
   return style === "start" || style === "end" ? "flex-" + style : style;
 }
-function useMounted(hook) {
+function onSmartMounted(hook) {
   let isMounted = false;
   vue.onMounted(() => {
     hook();
@@ -477,7 +477,7 @@ function useEventListener(target, type, listener, options = {}) {
     remove(target);
     cleaned = true;
   };
-  useMounted(() => {
+  onSmartMounted(() => {
     add2(target);
   });
   vue.onBeforeUnmount(() => {
@@ -500,6 +500,14 @@ function useClickOutside(target, type, listener) {
   };
   useEventListener(document, type, handler);
 }
+function onSmartUnmounted(hook) {
+  vue.onUnmounted(() => {
+    hook();
+  });
+  vue.onDeactivated(() => {
+    hook();
+  });
+}
 var __rest = globalThis && globalThis.__rest || function(s, e) {
   var t = {};
   for (var p in s)
@@ -598,6 +606,10 @@ function useChildren(key) {
     bindChildren
   };
 }
+function onWindowResize(listener) {
+  useEventListener(() => window, "resize", listener, { passive: true });
+  useEventListener(() => window, "orientationchange", listener, { passive: true });
+}
 function asyncGeneratorStep$d(gen, resolve, reject, _next, _throw, key, arg) {
   try {
     var info = gen[key](arg);
@@ -2092,7 +2104,7 @@ var __sfc__$1f = vue.defineComponent({
         color: textColor
       };
     });
-    useMounted(computePadding);
+    onSmartMounted(computePadding);
     vue.onUpdated(computePadding);
     return {
       n: n$1e,
@@ -2531,7 +2543,7 @@ var __sfc__$1e = vue.defineComponent({
     var handleClick = (e) => {
       call(props2.onClick, e);
     };
-    useMounted(getScale);
+    onSmartMounted(getScale);
     vue.onUpdated(getScale);
     return {
       internalSizeValidator: internalSizeValidator$1,
@@ -3379,8 +3391,7 @@ var __sfc__$19 = vue.defineComponent({
       disabled.value = false;
     });
     vue.onActivated(addScrollerEventListener);
-    vue.onBeforeUnmount(removeScrollerEventListener);
-    vue.onDeactivated(removeScrollerEventListener);
+    onSmartUnmounted(removeScrollerEventListener);
     return {
       disabled,
       show,
@@ -3749,7 +3760,7 @@ var __sfc__$17 = vue.defineComponent({
       immediate: true,
       deep: true
     });
-    useMounted(() => {
+    onSmartMounted(() => {
       if (!slots.fab) {
         return;
       }
@@ -10109,7 +10120,7 @@ var __sfc__$R = vue.defineComponent({
     var chooseYear = (year) => {
       emit("choose-year", year);
     };
-    useMounted(() => {
+    onSmartMounted(() => {
       var activeEl = document.querySelector("." + n$Q("item--active"));
       activeEl == null ? void 0 : activeEl.scrollIntoView({
         block: "center"
@@ -10480,7 +10491,7 @@ var __sfc__$Q = vue.defineComponent({
     var forwardRef = (checkType) => {
       headerEl.value.checkDate(checkType);
     };
-    useMounted(() => {
+    onSmartMounted(() => {
       initDate();
       initHeader();
     });
@@ -11580,7 +11591,7 @@ var __sfc__$N = vue.defineComponent({
     var checkHasText = () => {
       state.withText = Boolean(slots.default) || Boolean(props2.description);
     };
-    useMounted(() => {
+    onSmartMounted(() => {
       checkHasText();
     });
     vue.onUpdated(() => {
@@ -14476,9 +14487,8 @@ var __sfc__$I = vue.defineComponent({
       resize();
     }));
     vue.onActivated(resize);
-    vue.onDeactivated(stopAutoplay);
-    vue.onUnmounted(stopAutoplay);
-    useEventListener(() => window, "resize", resize);
+    onSmartUnmounted(stopAutoplay);
+    onWindowResize(resize);
     return {
       n: n$G,
       classes: classes$z,
@@ -15274,11 +15284,10 @@ var __sfc__$F = vue.defineComponent({
       scroller !== window && scroller.removeEventListener("scroll", handleScroll);
     };
     vue.watch(() => props2.disabled, resize);
-    useMounted(addScrollListener);
-    vue.onUnmounted(removeScrollListener);
-    vue.onDeactivated(removeScrollListener);
+    onSmartMounted(addScrollListener);
+    onSmartUnmounted(removeScrollListener);
+    onWindowResize(resize);
     useEventListener(() => window, "scroll", handleScroll);
-    useEventListener(() => window, "resize", resize);
     return {
       n: n$D,
       classes: classes$x,
@@ -15691,7 +15700,7 @@ var __sfc__$D = vue.defineComponent({
         setOwnTop();
       });
     }));
-    useMounted(/* @__PURE__ */ _asyncToGenerator$5(function* () {
+    onSmartMounted(/* @__PURE__ */ _asyncToGenerator$5(function* () {
       yield setScroller();
       addScrollerListener();
     }));
@@ -16004,9 +16013,9 @@ var __sfc__$C = vue.defineComponent({
     var handleClick = (e) => {
       call(props2.onClick, e);
     };
-    useMounted(resize);
+    onWindowResize(resize);
+    onSmartMounted(resize);
     vue.onUpdated(resize);
-    useEventListener(() => window, "resize", resize);
     return {
       placeholderTextEl,
       color,
@@ -16458,7 +16467,7 @@ var __sfc__$B = vue.defineComponent({
       resetValidation
     };
     call(bindForm, inputProvider);
-    useMounted(() => {
+    onSmartMounted(() => {
       if (props2.autofocus) {
         focus();
       }
@@ -16878,15 +16887,14 @@ var __sfc__$z = vue.defineComponent({
       vue.watch(() => tabItem2.current.value, check2);
     }
     vue.watch(() => [props2.loading, props2.error, props2.finished], check2);
-    useMounted(() => {
+    onSmartMounted(() => {
       scroller = getParentScroller(listEl.value);
       scroller.addEventListener("scroll", check2);
       if (props2.immediateCheck) {
         check2();
       }
     });
-    vue.onDeactivated(removeScrollerListener);
-    vue.onUnmounted(removeScrollerListener);
+    onSmartUnmounted(removeScrollerListener);
     return {
       pack,
       listEl,
@@ -17618,10 +17626,10 @@ function __render__$v(_ctx, _cache) {
       [vue.createVNode(
         _component_var_menu,
         {
+          placement: "cover-top",
           disabled: _ctx.disabled,
           show: _ctx.menuVisible,
-          "onUpdate:show": _cache[6] || (_cache[6] = ($event) => _ctx.menuVisible = $event),
-          "offset-x": -4
+          "onUpdate:show": _cache[6] || (_cache[6] = ($event) => _ctx.menuVisible = $event)
         },
         {
           menu: vue.withCtx(() => [(vue.openBlock(true), vue.createElementBlock(
@@ -19109,7 +19117,7 @@ var __sfc__$s = vue.defineComponent({
         }, toNumber(props2.successDuration));
       }
     });
-    useMounted(setScroller);
+    onSmartMounted(setScroller);
     useEventListener(freshNode, "touchmove", touchMove);
     return {
       n: n$o,
@@ -19622,6 +19630,10 @@ var props$i = {
     type: Boolean,
     default: true
   },
+  clearable: {
+    type: Boolean,
+    default: false
+  },
   rules: {
     type: Array
   },
@@ -19735,6 +19747,7 @@ var __sfc__$p = vue.defineComponent({
       hovering
     } = useHoverOverlay();
     var currentHoveringValue = vue.ref(-1);
+    var lastScore = Number(props2.modelValue);
     var getStyle2 = (val) => {
       var {
         count,
@@ -19790,13 +19803,20 @@ var __sfc__$p = vue.defineComponent({
       };
     };
     var changeValue = (score, event) => {
-      if (props2.half) {
+      var {
+        half: half2,
+        clearable
+      } = props2;
+      if (half2) {
         var {
           offsetWidth
         } = event.target;
         if (event.offsetX <= Math.floor(offsetWidth / 2))
           score -= 0.5;
       }
+      if (lastScore === score && clearable)
+        score = 0;
+      lastScore = score;
       call(props2["onUpdate:modelValue"], score);
     };
     var validate = () => v(props2.rules, toNumber(props2.modelValue));
@@ -21634,7 +21654,7 @@ var __sfc__$e = vue.defineComponent({
       setProps(modelValue, toNumber(step2));
     });
     vue.watch(maxDistance, () => setProps());
-    useMounted(() => {
+    onSmartMounted(() => {
       if (!stepValidator() || !valueValidator())
         return;
       maxDistance.value = sliderEl.value[isVertical.value ? "offsetHeight" : "offsetWidth"];
@@ -21885,7 +21905,7 @@ var __sfc__$d = vue.defineComponent({
       clearTimeout(timer.value);
       updateAfterDuration();
     });
-    useMounted(() => {
+    onSmartMounted(() => {
       if (props2.show) {
         call(props2.onOpen);
         updateAfterDuration();
@@ -22347,11 +22367,9 @@ var STEPS_BIND_STEP_KEY = Symbol("STEPS_BIND_STEP_KEY");
 function useStep() {
   var {
     bindChildren,
-    length,
     childProviders
   } = useChildren(STEPS_BIND_STEP_KEY);
   return {
-    length,
     step: childProviders,
     bindStep: bindChildren
   };
@@ -22393,89 +22411,76 @@ function __render__$a(_ctx, _cache) {
       [vue.createElementVNode(
         "div",
         {
-          class: vue.normalizeClass(_ctx.n(_ctx.direction + "-main")),
-          ref: _ctx.getRef
+          class: vue.normalizeClass(_ctx.classes(_ctx.n(_ctx.direction + "-tag"), [_ctx.isActive || _ctx.isCurrent, _ctx.n(_ctx.direction + "-tag--active")])),
+          style: vue.normalizeStyle({
+            backgroundColor: _ctx.isActive || _ctx.isCurrent ? _ctx.activeColor : _ctx.inactiveColor
+          }),
+          onClick: _cache[0] || (_cache[0] = function() {
+            return _ctx.click && _ctx.click(...arguments);
+          })
         },
-        [vue.createElementVNode(
-          "div",
+        [_ctx.isActive ? (vue.openBlock(), vue.createBlock(
+          _component_var_icon,
           {
-            class: vue.normalizeClass(_ctx.classes(_ctx.n(_ctx.direction + "-tag"), [_ctx.isActive || _ctx.isCurrent, _ctx.n(_ctx.direction + "-tag--active")])),
-            style: vue.normalizeStyle({
-              backgroundColor: _ctx.isActive || _ctx.isCurrent ? _ctx.activeColor : _ctx.inactiveColor
-            }),
-            onClick: _cache[0] || (_cache[0] = function() {
-              return _ctx.click && _ctx.click(...arguments);
-            })
+            key: 0,
+            class: vue.normalizeClass(_ctx.n("icon")),
+            "var-step-cover": "",
+            name: _ctx.activeIcon
           },
-          [_ctx.isActive ? (vue.openBlock(), vue.createBlock(
-            _component_var_icon,
-            {
-              key: 0,
-              class: vue.normalizeClass(_ctx.n("icon")),
-              "var-step-cover": "",
-              name: _ctx.activeIcon
-            },
-            null,
-            8,
-            ["class", "name"]
-          )) : _ctx.isCurrent && _ctx.currentIcon ? (vue.openBlock(), vue.createBlock(
-            _component_var_icon,
-            {
-              key: 1,
-              class: vue.normalizeClass(_ctx.n("icon")),
-              "var-step-cover": "",
-              name: _ctx.currentIcon
-            },
-            null,
-            8,
-            ["class", "name"]
-          )) : _ctx.inactiveIcon ? (vue.openBlock(), vue.createBlock(
-            _component_var_icon,
-            {
-              key: 2,
-              class: vue.normalizeClass(_ctx.n("icon")),
-              "var-step-cover": "",
-              name: _ctx.inactiveIcon
-            },
-            null,
-            8,
-            ["class", "name"]
-          )) : (vue.openBlock(), vue.createElementBlock(
-            "span",
-            _hoisted_1$2,
-            vue.toDisplayString(_ctx.index + 1),
-            1
-            /* TEXT */
-          ))],
-          6
-          /* CLASS, STYLE */
-        ), vue.createElementVNode(
-          "div",
+          null,
+          8,
+          ["class", "name"]
+        )) : _ctx.isCurrent && _ctx.currentIcon ? (vue.openBlock(), vue.createBlock(
+          _component_var_icon,
           {
-            class: vue.normalizeClass(_ctx.classes(_ctx.n(_ctx.direction + "-content"), [_ctx.isActive || _ctx.isCurrent, _ctx.n(_ctx.direction + "-content--active")])),
-            onClick: _cache[1] || (_cache[1] = function() {
-              return _ctx.click && _ctx.click(...arguments);
-            })
+            key: 1,
+            class: vue.normalizeClass(_ctx.n("icon")),
+            "var-step-cover": "",
+            name: _ctx.currentIcon
           },
-          [vue.renderSlot(_ctx.$slots, "default")],
-          2
-          /* CLASS */
-        )],
+          null,
+          8,
+          ["class", "name"]
+        )) : _ctx.inactiveIcon ? (vue.openBlock(), vue.createBlock(
+          _component_var_icon,
+          {
+            key: 2,
+            class: vue.normalizeClass(_ctx.n("icon")),
+            "var-step-cover": "",
+            name: _ctx.inactiveIcon
+          },
+          null,
+          8,
+          ["class", "name"]
+        )) : (vue.openBlock(), vue.createElementBlock(
+          "span",
+          _hoisted_1$2,
+          vue.toDisplayString(_ctx.index + 1),
+          1
+          /* TEXT */
+        ))],
+        6
+        /* CLASS, STYLE */
+      ), vue.createElementVNode(
+        "div",
+        {
+          class: vue.normalizeClass(_ctx.classes(_ctx.n(_ctx.direction + "-content"), [_ctx.isActive || _ctx.isCurrent, _ctx.n(_ctx.direction + "-content--active")])),
+          onClick: _cache[1] || (_cache[1] = function() {
+            return _ctx.click && _ctx.click(...arguments);
+          })
+        },
+        [vue.renderSlot(_ctx.$slots, "default")],
         2
         /* CLASS */
-      ), !_ctx.isLastChild ? (vue.openBlock(), vue.createElementBlock(
+      ), vue.createElementVNode(
         "div",
         {
-          key: 0,
-          class: vue.normalizeClass(_ctx.n(_ctx.direction + "-line")),
-          style: vue.normalizeStyle({
-            margin: _ctx.lineMargin
-          })
+          class: vue.normalizeClass(_ctx.n(_ctx.direction + "-line"))
         },
         null,
-        6
-        /* CLASS, STYLE */
-      )) : vue.createCommentVNode("v-if", true)],
+        2
+        /* CLASS */
+      )],
       2
       /* CLASS */
     )],
@@ -22490,9 +22495,6 @@ var __sfc__$b = vue.defineComponent({
   },
   props: props$a,
   setup() {
-    var main2 = vue.ref(null);
-    var lineMargin = vue.ref("");
-    var isLastChild = vue.ref(false);
     var {
       index,
       steps: steps2,
@@ -22500,7 +22502,6 @@ var __sfc__$b = vue.defineComponent({
     } = useSteps();
     var {
       active,
-      length,
       activeColor,
       inactiveColor,
       direction,
@@ -22512,33 +22513,17 @@ var __sfc__$b = vue.defineComponent({
       index
     };
     var click = () => clickStep(index.value);
-    var getRef = (el) => {
-      if (direction.value === "horizontal") {
-        main2.value = el;
-      }
-    };
     bindSteps(stepProvider);
-    vue.watch(length, (newLength) => {
-      isLastChild.value = newLength - 1 === index.value;
-      if (main2.value) {
-        var margin = main2.value.offsetWidth / 2 - 14;
-        lineMargin.value = "0 -" + margin + "px";
-      }
-    });
     return {
       n: n$b,
       classes: classes$8,
-      main: main2,
       index,
       isActive,
       isCurrent,
       direction,
-      lineMargin,
       activeColor,
       inactiveColor,
-      isLastChild,
-      click,
-      getRef
+      click
     };
   }
 });
@@ -22595,7 +22580,6 @@ var __sfc__$a = vue.defineComponent({
     var inactiveColor = vue.computed(() => props2.inactiveColor);
     var direction = vue.computed(() => props2.direction);
     var {
-      length,
       bindStep
     } = useStep();
     var clickStep = (index) => {
@@ -22603,7 +22587,6 @@ var __sfc__$a = vue.defineComponent({
     };
     var stepsProvider = {
       active,
-      length,
       direction,
       activeColor,
       inactiveColor,
@@ -22864,10 +22847,7 @@ var __sfc__$8 = vue.defineComponent({
       };
     });
     var radius = vue.computed(() => {
-      var {
-        size = "5.333vw"
-      } = props2;
-      return multiplySizeUnit(size, 0.4);
+      return multiplySizeUnit(props2.size || 0, 0.4);
     });
     var switchActive = (event) => {
       var {
@@ -23516,7 +23496,7 @@ var __sfc__$4 = vue.defineComponent({
     vue.watch(() => props2.active, resize);
     vue.watch(() => props2.scrollable, resize);
     vue.onActivated(resize);
-    useEventListener(() => window, "resize", resize);
+    onWindowResize(resize);
     return {
       stickyComponent,
       indicatorWidth,
@@ -23700,7 +23680,8 @@ const badge$1 = {
   "--badge-default-color": "#555"
 };
 const button$1 = {
-  "--button-default-color": "#303030"
+  "--button-default-color": "#303030",
+  "--button-default-text-color": "#fff"
 };
 const card$1 = {
   "--card-background": "#303030",
@@ -23842,6 +23823,9 @@ const avatar$1 = {
   "--avatar-background-color": "#303030",
   "--avatar-border": "2px solid #1e1e1e"
 };
+const link$1 = {
+  "--link-default-color": "#fff"
+};
 function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function(target) {
     for (var i = 1; i < arguments.length; i++) {
@@ -23867,7 +23851,7 @@ const dark = _extends({
   "--color-danger": "#ef5350",
   "--color-disabled": "#404040",
   "--color-text-disabled": "#757575"
-}, button$1, cell$1, card$1, timePicker$1, datePicker$1, skeleton$1, tabs$1, tab$1, popup$1, dialog$1, actionSheet$1, chip$1, badge$1, uploader$1, collapse, pullRefresh$1, switchThemes, steps, pagination$1, table$1, fieldDecorator$1, select$1, radio$1, checkbox$1, divider$1, picker$1, appBar$1, bottomNavigation$1, bottomNavigationItem$1, menu$1, result$1, breadcrumb$1, paper$1, avatar$1);
+}, button$1, cell$1, card$1, timePicker$1, datePicker$1, skeleton$1, tabs$1, tab$1, popup$1, dialog$1, actionSheet$1, chip$1, badge$1, uploader$1, collapse, pullRefresh$1, switchThemes, steps, pagination$1, table$1, fieldDecorator$1, select$1, radio$1, checkbox$1, divider$1, picker$1, appBar$1, bottomNavigation$1, bottomNavigationItem$1, menu$1, result$1, breadcrumb$1, paper$1, avatar$1, link$1);
 var Themes = {
   dark
 };
@@ -25534,9 +25518,9 @@ const skeleton = "";
 const SkeletonSfc = "";
 const slider = "";
 const SliderSfc = "";
+const SnackbarSfc = "";
 const snackbar = "";
 const coreSfc = "";
-const SnackbarSfc = "";
 const space = "";
 const step = "";
 const StepSfc = "";
@@ -25561,7 +25545,7 @@ const TimePickerSfc = "";
 const TooltipSfc = "";
 const uploader = "";
 const UploaderSfc = "";
-const version = "2.11.4";
+const version = "2.11.6-alpha.1686800314469";
 function install(app) {
   ActionSheet.install && app.use(ActionSheet);
   AppBar.install && app.use(AppBar);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/ui",
-  "version": "2.11.4",
+  "version": "2.11.6-alpha.1686800314469",
   "description": "A material like components library",
   "main": "lib/varlet.cjs.js",
   "module": "es/index.mjs",
@@ -46,9 +46,9 @@
     "@popperjs/core": "^2.11.6",
     "dayjs": "^1.10.4",
     "decimal.js": "^10.2.1",
-    "@varlet/use": "2.11.4",
-    "@varlet/shared": "2.11.4",
-    "@varlet/icons": "2.11.4"
+    "@varlet/icons": "2.11.6-alpha.1686800314469",
+    "@varlet/shared": "2.11.6-alpha.1686800314469",
+    "@varlet/use": "2.11.6-alpha.1686800314469"
   },
   "devDependencies": {
     "@vue/runtime-core": "3.3.1",
@@ -63,8 +63,8 @@
     "typescript": "^4.4.4",
     "vue": "3.3.2",
     "vue-router": "4.2.0",
-    "@varlet/cli": "2.11.4",
-    "@varlet/touch-emulator": "2.11.4"
+    "@varlet/cli": "2.11.6-alpha.1686800314469",
+    "@varlet/touch-emulator": "2.11.6-alpha.1686800314469"
   },
   "browserslist": [
     "Chrome >= 54",

package/types/rate.d.ts

@@ -17,6 +17,7 @@ export interface RateProps extends BasicAttributes {
   half?: boolean
   disabled?: boolean
   readonly?: boolean
+  clearable?: boolean
   ripple?: boolean
   rules?: Array<(value: any) => any>
   onChange?: ListenerProp<(value: string | number) => void>