vant 3.3.4 → 3.4.0

package/lib/vant.es.js

@@ -1,5 +1,5 @@
 import { useWindowSize, useRect, useChildren, useParent, onMountedOrActivated, getScrollParent, useEventListener, CUSTOM_FIELD_INJECTION_KEY, useCustomFieldValue, useToggle, raf, useScrollParent, usePageVisibility, doubleRaf, cancelRaf, useCountDown, useClickAway, inBrowser as inBrowser$1 } from "@vant/use";
-import { unref, ref, reactive, defineComponent, createVNode, getCurrentInstance, computed, provide, inject, onDeactivated, onBeforeUnmount, watch, Transition, withDirectives, vShow, onMounted, onActivated, Teleport, Fragment, mergeProps, nextTick, createTextVNode, createApp, onUnmounted, onBeforeUpdate, resolveDirective, h, onUpdated, watchEffect } from "vue";
+import { unref, ref, reactive, defineComponent, createVNode, getCurrentInstance, computed, provide, inject, mergeProps, onDeactivated, onBeforeUnmount, watch, Transition, withDirectives, vShow, onMounted, onActivated, Teleport, Fragment, nextTick, createTextVNode, createApp, onUnmounted, onBeforeUpdate, resolveDirective, h, onUpdated, watchEffect } from "vue";
 import { createPopper, offsetModifier } from "@vant/popperjs";
 function noop() {
 }
@@ -476,7 +476,8 @@ var badgeProps = {
   color: String,
   offset: Array,
   content: numericProp,
-  showZero: truthProp
+  showZero: truthProp,
+  position: makeStringProp("top-right")
 };
 var _Badge = defineComponent({
   name: name$1t,
@@ -534,10 +535,10 @@ var _Badge = defineComponent({
     var renderBadge = () => {
       if (hasContent() || props.dot) {
         return createVNode("div", {
-          "class": bem$1p({
+          "class": bem$1p([props.position, {
             dot: props.dot,
             fixed: !!slots.default
-          }),
+          }]),
           "style": style.value
         }, [renderContent()]);
       }
@@ -602,6 +603,7 @@ var iconProps = {
   size: numericProp,
   badge: numericProp,
   color: String,
+  badgeProps: Object,
   classPrefix: String
 };
 var _Icon = defineComponent({
@@ -623,16 +625,16 @@ var _Icon = defineComponent({
         color
       } = props;
       var isImageIcon = isImage(name2);
-      return createVNode(Badge, {
+      return createVNode(Badge, mergeProps({
         "dot": dot,
         "tag": tag,
-        "content": badge,
         "class": [classPrefix.value, isImageIcon ? "" : classPrefix.value + "-" + name2],
         "style": {
           color,
           fontSize: addUnit(size)
-        }
-      }, {
+        },
+        "content": badge
+      }, props.badgeProps), {
         default: () => [slots.default == null ? void 0 : slots.default(), isImageIcon && createVNode("img", {
           "class": bem$1n("image"),
           "src": name2
@@ -915,6 +917,7 @@ var actionBarIconProps = extend({}, routeProps, {
   color: String,
   badge: numericProp,
   iconClass: unknownProp,
+  badgeProps: Object,
   iconPrefix: String
 });
 var _ActionBarIcon = defineComponent({
@@ -933,14 +936,15 @@ var _ActionBarIcon = defineComponent({
         icon,
         color,
         iconClass,
+        badgeProps: badgeProps2,
         iconPrefix
       } = props;
       if (slots.icon) {
-        return createVNode(Badge, {
+        return createVNode(Badge, mergeProps({
           "dot": dot,
-          "content": badge,
-          "class": bem$1j("icon")
-        }, {
+          "class": bem$1j("icon"),
+          "content": badge
+        }, badgeProps2), {
           default: slots.icon
         });
       }
@@ -951,6 +955,7 @@ var _ActionBarIcon = defineComponent({
         "badge": badge,
         "color": color,
         "class": [bem$1j("icon"), iconClass],
+        "badgeProps": badgeProps2,
         "classPrefix": iconPrefix
       }, null);
     };
@@ -978,12 +983,11 @@ var popupSharedProps = {
   closeOnClickOverlay: truthProp
 };
 var popupSharedPropKeys = Object.keys(popupSharedProps);
-var MIN_DISTANCE = 10;
 function getDirection(x, y) {
-  if (x > y && x > MIN_DISTANCE) {
+  if (x > y) {
     return "horizontal";
   }
-  if (y > x && y > MIN_DISTANCE) {
+  if (y > x) {
     return "vertical";
   }
   return "";
@@ -1016,7 +1020,8 @@ function useTouch() {
     deltaY.value = touch.clientY - startY.value;
     offsetX.value = Math.abs(deltaX.value);
     offsetY.value = Math.abs(deltaY.value);
-    if (!direction.value) {
+    var LOCK_DIRECTION_DISTANCE = 10;
+    if (!direction.value || offsetX.value < LOCK_DIRECTION_DISTANCE && offsetY.value < LOCK_DIRECTION_DISTANCE) {
       direction.value = getDirection(offsetX.value, offsetY.value);
     }
   };
@@ -1280,10 +1285,11 @@ var _Popup = defineComponent({
         default: renderPopup
       });
     };
-    watch(() => props.show, (value) => {
-      if (value) {
+    watch(() => props.show, (show) => {
+      if (show && !opened) {
         open();
-      } else {
+      }
+      if (!show && opened) {
         opened = false;
         emit("close");
       }
@@ -1379,34 +1385,43 @@ var _ActionSheet = defineComponent({
         }, [slots.cancel ? slots.cancel() : props.cancelText])];
       }
     };
-    var renderOption = (item, index2) => {
+    var renderActionContent = (action, index2) => {
+      if (action.loading) {
+        return createVNode(Loading, {
+          "class": bem$1g("loading-icon")
+        }, null);
+      }
+      if (slots.action) {
+        return slots.action({
+          action,
+          index: index2
+        });
+      }
+      return [createVNode("span", {
+        "class": bem$1g("name")
+      }, [action.name]), action.subname && createVNode("div", {
+        "class": bem$1g("subname")
+      }, [action.subname])];
+    };
+    var renderAction = (action, index2) => {
       var {
-        name: name2,
         color,
-        subname,
         loading,
         callback,
         disabled,
         className
-      } = item;
-      var Content = loading ? createVNode(Loading, {
-        "class": bem$1g("loading-icon")
-      }, null) : [createVNode("span", {
-        "class": bem$1g("name")
-      }, [name2]), subname && createVNode("div", {
-        "class": bem$1g("subname")
-      }, [subname])];
+      } = action;
       var onClick = () => {
         if (disabled || loading) {
           return;
         }
         if (callback) {
-          callback(item);
+          callback(action);
         }
         if (props.closeOnClickAction) {
           updateShow(false);
         }
-        nextTick(() => emit("select", item, index2));
+        nextTick(() => emit("select", action, index2));
       };
       return createVNode("button", {
         "type": "button",
@@ -1418,7 +1433,7 @@ var _ActionSheet = defineComponent({
           disabled
         }), className],
         "onClick": onClick
-      }, [Content]);
+      }, [renderActionContent(action, index2)]);
     };
     var renderDescription = () => {
       if (props.description || slots.description) {
@@ -1435,7 +1450,7 @@ var _ActionSheet = defineComponent({
     }, pick(props, popupInheritKeys$2)), {
       default: () => [renderHeader(), renderDescription(), createVNode("div", {
         "class": bem$1g("content")
-      }, [props.actions.map(renderOption), slots.default == null ? void 0 : slots.default()]), renderCancel()]
+      }, [props.actions.map(renderAction), slots.default == null ? void 0 : slots.default()]), renderCancel()]
     });
   }
 });
@@ -1923,28 +1938,34 @@ var _Picker = defineComponent({
         option: slots.option
       });
     });
+    var renderMask = (wrapHeight) => {
+      var hasOptions = formattedColumns.value.some((item) => item[valuesKey] && item[valuesKey].length !== 0);
+      if (hasOptions) {
+        var frameStyle = {
+          height: itemHeight.value + "px"
+        };
+        var maskStyle = {
+          backgroundSize: "100% " + (wrapHeight - itemHeight.value) / 2 + "px"
+        };
+        return [createVNode("div", {
+          "class": bem$1e("mask"),
+          "style": maskStyle
+        }, null), createVNode("div", {
+          "class": [BORDER_UNSET_TOP_BOTTOM, bem$1e("frame")],
+          "style": frameStyle
+        }, null)];
+      }
+    };
     var renderColumns = () => {
       var wrapHeight = itemHeight.value * +props.visibleItemCount;
-      var frameStyle = {
-        height: itemHeight.value + "px"
-      };
       var columnsStyle = {
         height: wrapHeight + "px"
       };
-      var maskStyle = {
-        backgroundSize: "100% " + (wrapHeight - itemHeight.value) / 2 + "px"
-      };
       return createVNode("div", {
         "class": bem$1e("columns"),
         "style": columnsStyle,
         "onTouchmove": preventDefault
-      }, [renderColumnItems(), createVNode("div", {
-        "class": bem$1e("mask"),
-        "style": maskStyle
-      }, null), createVNode("div", {
-        "class": [BORDER_UNSET_TOP_BOTTOM, bem$1e("frame")],
-        "style": frameStyle
-      }, null)]);
+      }, [renderColumnItems(), renderMask(wrapHeight)]);
     };
     watch(() => props.columns, format2, {
       immediate: true
@@ -2553,6 +2574,12 @@ function mapInputType(type) {
     type
   };
 }
+function getStringLength(str) {
+  return [...str].length;
+}
+function cutString(str, maxlength) {
+  return [...str].slice(0, maxlength).join("");
+}
 var current = 0;
 function useId() {
   var vm = getCurrentInstance();
@@ -2727,12 +2754,12 @@ var _Field = defineComponent({
       var {
         maxlength
       } = props;
-      if (isDef(maxlength) && value.length > maxlength) {
+      if (isDef(maxlength) && getStringLength(value) > maxlength) {
         var modelValue = getModelValue();
-        if (modelValue && modelValue.length === +maxlength) {
+        if (modelValue && getStringLength(modelValue) === +maxlength) {
           return modelValue;
         }
-        return value.slice(0, +maxlength);
+        return cutString(value, +maxlength);
       }
       return value;
     };
@@ -2896,7 +2923,7 @@ var _Field = defineComponent({
     };
     var renderWordLimit = () => {
       if (props.showWordLimit && props.maxlength) {
-        var count = getModelValue().length;
+        var count = getStringLength(getModelValue());
         return createVNode("div", {
           "class": bem$1a("word-limit")
         }, [createVNode("span", {
@@ -4183,11 +4210,17 @@ function calcDateNum(date) {
 }
 function useRefs() {
   var refs = ref([]);
+  var cache = [];
   onBeforeUpdate(() => {
     refs.value = [];
   });
-  var setRefs = (index2) => (el) => {
-    refs.value[index2] = el;
+  var setRefs = (index2) => {
+    if (!cache[index2]) {
+      cache[index2] = (el) => {
+        refs.value[index2] = el;
+      };
+    }
+    return cache[index2];
   };
   return [refs, setRefs];
 }
@@ -4222,6 +4255,20 @@ function getTrueValue(value) {
   return parseInt(value, 10);
 }
 var getMonthEndDay = (year, month) => 32 - new Date(year, month - 1, 32).getDate();
+var proxyPickerMethods = (picker, callback) => {
+  var methods = ["setValues", "setIndexes", "setColumnIndex", "setColumnValue"];
+  return new Proxy(picker, {
+    get: (target, prop) => {
+      if (methods.includes(prop)) {
+        return function() {
+          target[prop](...arguments);
+          callback();
+        };
+      }
+      return target[prop];
+    }
+  });
+};
 var useHeight = (element) => {
   var height = ref();
   onMounted(() => nextTick(() => {
@@ -5421,16 +5468,19 @@ var TabsTitle = defineComponent({
     color: String,
     title: String,
     badge: numericProp,
+    shrink: Boolean,
     isActive: Boolean,
     disabled: Boolean,
     controls: String,
     scrollable: Boolean,
     activeColor: String,
-    renderTitle: Function,
     inactiveColor: String,
     showZeroBadge: truthProp
   },
-  setup(props) {
+  setup(props, _ref) {
+    var {
+      slots
+    } = _ref;
     var style = computed(() => {
       var style2 = {};
       var {
@@ -5463,7 +5513,7 @@ var TabsTitle = defineComponent({
         "class": bem$Y("text", {
           ellipsis: !props.scrollable
         })
-      }, [props.renderTitle ? props.renderTitle() : props.title]);
+      }, [slots.title ? slots.title() : props.title]);
       if (props.dot || isDef(props.badge) && props.badge !== "") {
         return createVNode(Badge, {
           "dot": props.dot,
@@ -5478,10 +5528,12 @@ var TabsTitle = defineComponent({
     return () => createVNode("div", {
       "id": props.id,
       "role": "tab",
-      "class": [bem$Y({
+      "class": [bem$Y([props.type, {
+        grow: props.scrollable && !props.shrink,
+        shrink: props.shrink,
         active: props.isActive,
         disabled: props.disabled
-      })],
+      }])],
       "style": style.value,
       "tabindex": props.disabled ? void 0 : props.isActive ? 0 : -1,
       "aria-selected": props.isActive,
@@ -5667,26 +5719,33 @@ var _Swipe = defineComponent({
       if (!root.value) {
         return;
       }
-      if (!isHidden(root)) {
-        var _props$width, _props$height;
-        var rect = {
-          width: root.value.offsetWidth,
-          height: root.value.offsetHeight
-        };
-        state.rect = rect;
-        state.width = +((_props$width = props.width) != null ? _props$width : rect.width);
-        state.height = +((_props$height = props.height) != null ? _props$height : rect.height);
-      }
-      if (count.value) {
-        active = Math.min(count.value - 1, active);
+      var cb = () => {
+        if (!isHidden(root)) {
+          var _props$width, _props$height;
+          var rect = {
+            width: root.value.offsetWidth,
+            height: root.value.offsetHeight
+          };
+          state.rect = rect;
+          state.width = +((_props$width = props.width) != null ? _props$width : rect.width);
+          state.height = +((_props$height = props.height) != null ? _props$height : rect.height);
+        }
+        if (count.value) {
+          active = Math.min(count.value - 1, active);
+        }
+        state.active = active;
+        state.swiping = true;
+        state.offset = getTargetOffset(active);
+        children.forEach((swipe) => {
+          swipe.setOffset(0);
+        });
+        autoplay();
+      };
+      if (isHidden(root)) {
+        nextTick().then(cb);
+      } else {
+        cb();
       }
-      state.active = active;
-      state.swiping = true;
-      state.offset = getTargetOffset(active);
-      children.forEach((swipe) => {
-        swipe.setOffset(0);
-      });
-      autoplay();
     };
     var resize = () => initialize(state.active);
     var touchStartTime;
@@ -5701,11 +5760,8 @@ var _Swipe = defineComponent({
     var onTouchMove = (event) => {
       if (props.touchable && state.swiping) {
         touch.move(event);
-        var shouldPrevent = isCorrectDirection.value || touch.offsetY.value > touch.offsetX.value === props.vertical;
-        if (shouldPrevent) {
-          preventDefault(event, props.stopPropagation);
-        }
         if (isCorrectDirection.value) {
+          preventDefault(event, props.stopPropagation);
           move({
             offset: delta.value
           });
@@ -5780,7 +5836,8 @@ var _Swipe = defineComponent({
     var renderIndicator = () => {
       if (slots.indicator) {
         return slots.indicator({
-          active: activeIndicator.value
+          active: activeIndicator.value,
+          total: count.value
         });
       }
       if (props.showIndicators && count.value > 1) {
@@ -5899,6 +5956,7 @@ var tabsProps = {
   color: String,
   border: Boolean,
   sticky: Boolean,
+  shrink: Boolean,
   active: makeNumericProp(0),
   duration: makeNumericProp(0.3),
   animated: Boolean,
@@ -5944,7 +6002,7 @@ var _Tabs = defineComponent({
       lineStyle: {},
       currentIndex: -1
     });
-    var scrollable = computed(() => children.length > props.swipeThreshold || !props.ellipsis);
+    var scrollable = computed(() => children.length > props.swipeThreshold || !props.ellipsis || props.shrink);
     var navStyle = computed(() => ({
       borderColor: props.color,
       background: props.background
@@ -6110,14 +6168,24 @@ var _Tabs = defineComponent({
       "color": props.color,
       "style": item.titleStyle,
       "class": item.titleClass,
+      "shrink": props.shrink,
       "isActive": index2 === state.currentIndex,
       "controls": item.id,
       "scrollable": scrollable.value,
-      "renderTitle": item.$slots.title,
       "activeColor": props.titleActiveColor,
       "inactiveColor": props.titleInactiveColor,
       "onClick": (event) => onClickTab(item, index2, event)
-    }, pick(item, ["dot", "badge", "title", "disabled", "showZeroBadge"])), null));
+    }, pick(item, ["dot", "badge", "title", "disabled", "showZeroBadge"])), {
+      title: item.$slots.title
+    }));
+    var renderLine = () => {
+      if (props.type === "line" && children.length) {
+        return createVNode("div", {
+          "class": bem$V("line"),
+          "style": state.lineStyle
+        }, null);
+      }
+    };
     var renderHeader = () => {
       var _slots$navLeft, _slots$navRight;
       var {
@@ -6126,23 +6194,19 @@ var _Tabs = defineComponent({
       } = props;
       return createVNode("div", {
         "ref": wrapRef,
-        "class": [bem$V("wrap", {
-          scrollable: scrollable.value
-        }), {
+        "class": [bem$V("wrap"), {
           [BORDER_TOP_BOTTOM]: type === "line" && border
         }]
       }, [createVNode("div", {
         "ref": navRef,
         "role": "tablist",
         "class": bem$V("nav", [type, {
+          shrink: props.shrink,
           complete: scrollable.value
         }]),
         "style": navStyle.value,
         "aria-orientation": "horizontal"
-      }, [(_slots$navLeft = slots["nav-left"]) == null ? void 0 : _slots$navLeft.call(slots), renderNav(), type === "line" && createVNode("div", {
-        "class": bem$V("line"),
-        "style": state.lineStyle
-      }, null), (_slots$navRight = slots["nav-right"]) == null ? void 0 : _slots$navRight.call(slots)])]);
+      }, [(_slots$navLeft = slots["nav-left"]) == null ? void 0 : _slots$navLeft.call(slots), renderNav(), renderLine(), (_slots$navRight = slots["nav-right"]) == null ? void 0 : _slots$navRight.call(slots)])]);
     };
     watch([() => props.color, windowWidth], setLine);
     watch(() => props.active, (value) => {
@@ -6577,10 +6641,10 @@ var _Cascader = defineComponent({
     var renderTabs = () => createVNode(Tabs, {
       "active": activeTab.value,
       "onUpdate:active": ($event) => activeTab.value = $event,
+      "shrink": true,
       "animated": true,
       "class": bem$S("tabs"),
       "color": props.activeColor,
-      "swipeThreshold": 0,
       "swipeable": props.swipeable,
       "onClick-tab": onClickTab
     }, {
@@ -7956,7 +8020,7 @@ var TimePicker = defineComponent({
       }
     });
     useExpose({
-      getPicker: () => picker.value
+      getPicker: () => picker.value && proxyPickerMethods(picker.value, updateInnerValue)
     });
     return () => createVNode(Picker, mergeProps({
       "ref": picker,
@@ -8199,7 +8263,7 @@ var DatePicker = defineComponent({
       }
     });
     useExpose({
-      getPicker: () => picker.value
+      getPicker: () => picker.value && proxyPickerMethods(picker.value, updateInnerValue)
     });
     return () => createVNode(Picker, mergeProps({
       "ref": picker,
@@ -9008,7 +9072,8 @@ var gridItemProps = extend({}, routeProps, {
   icon: String,
   badge: numericProp,
   iconColor: String,
-  iconPrefix: String
+  iconPrefix: String,
+  badgeProps: Object
 });
 var _GridItem = defineComponent({
   name: name$u,
@@ -9062,10 +9127,10 @@ var _GridItem = defineComponent({
     });
     var renderIcon = () => {
       if (slots.icon) {
-        return createVNode(Badge, {
+        return createVNode(Badge, mergeProps({
           "dot": props.dot,
           "content": props.badge
-        }, {
+        }, props.badgeProps), {
           default: slots.icon
         });
       }
@@ -9076,8 +9141,9 @@ var _GridItem = defineComponent({
           "size": parent.props.iconSize,
           "badge": props.badge,
           "class": bem$v("icon"),
-          "classPrefix": props.iconPrefix,
-          "color": props.iconColor
+          "color": props.iconColor,
+          "badgeProps": props.badgeProps,
+          "classPrefix": props.iconPrefix
         }, null);
       }
     };
@@ -9378,6 +9444,7 @@ var imagePreviewProps = {
   closeIcon: makeStringProp("clear"),
   transition: String,
   beforeClose: Function,
+  overlayClass: unknownProp,
   overlayStyle: Object,
   swipeDuration: makeNumericProp(300),
   startPosition: makeNumericProp(0),
@@ -9504,7 +9571,7 @@ var VanImagePreview = defineComponent({
     });
     return () => createVNode(Popup, mergeProps({
       "class": [bem$t(), props.className],
-      "overlayClass": bem$t("overlay"),
+      "overlayClass": [bem$t("overlay"), props.overlayClass],
       "onClosed": onClosed,
       "onUpdate:show": updateShow
     }, pick(props, popupProps$1)), {
@@ -9529,6 +9596,7 @@ var defaultConfig = {
   transition: void 0,
   beforeClose: void 0,
   overlayStyle: void 0,
+  overlayClass: void 0,
   startPosition: 0,
   swipeDuration: 300,
   showIndicators: false,
@@ -11144,6 +11212,7 @@ var notifyProps = extend({}, popupSharedProps, {
   type: makeStringProp("danger"),
   color: String,
   message: numericProp,
+  position: makeStringProp("top"),
   className: unknownProp,
   background: String,
   lockScroll: Boolean
@@ -11166,7 +11235,7 @@ var VanNotify = defineComponent({
         background: props.background
       },
       "overlay": false,
-      "position": "top",
+      "position": props.position,
       "duration": 0.2,
       "lockScroll": props.lockScroll,
       "onUpdate:show": updateShow
@@ -11218,6 +11287,7 @@ var getDefaultOptions = () => ({
   onClick: void 0,
   onOpened: void 0,
   duration: 3e3,
+  position: void 0,
   className: "",
   lockScroll: false,
   background: void 0
@@ -11639,7 +11709,7 @@ var _Pagination = defineComponent({
       }, [createVNode("button", {
         "type": "button",
         "disabled": disabled,
-        "onClick": () => updateModelValue(modelValue - 1)
+        "onClick": () => updateModelValue(modelValue - 1, true)
       }, [slot ? slot() : props.prevText || t$5("prev")])]);
     };
     var renderNextButton = () => {
@@ -11658,7 +11728,7 @@ var _Pagination = defineComponent({
       }, [createVNode("button", {
         "type": "button",
         "disabled": disabled,
-        "onClick": () => updateModelValue(modelValue + 1)
+        "onClick": () => updateModelValue(modelValue + 1, true)
       }, [slot ? slot() : props.nextText || t$5("next")])]);
     };
     var renderPages = () => pages.value.map((page) => createVNode("li", {
@@ -11669,7 +11739,7 @@ var _Pagination = defineComponent({
     }, [createVNode("button", {
       "type": "button",
       "aria-current": page.active || void 0,
-      "onClick": () => updateModelValue(page.number)
+      "onClick": () => updateModelValue(page.number, true)
     }, [slots.page ? slots.page(page) : page.text])]));
     return () => createVNode("nav", {
       "role": "navigation",
@@ -11850,10 +11920,24 @@ var _Popover = defineComponent({
         updateShow(false);
       }
     };
+    var renderActionContent = (action, index2) => {
+      if (slots.action) {
+        return slots.action({
+          action,
+          index: index2
+        });
+      }
+      return [action.icon && createVNode(Icon, {
+        "name": action.icon,
+        "classPrefix": props.iconPrefix,
+        "class": bem$i("action-icon")
+      }, null), createVNode("div", {
+        "class": [bem$i("action-text"), BORDER_BOTTOM]
+      }, [action.text])];
+    };
     var renderAction = (action, index2) => {
       var {
         icon,
-        text,
         color,
         disabled,
         className
@@ -11870,13 +11954,7 @@ var _Popover = defineComponent({
         "tabindex": disabled ? void 0 : 0,
         "aria-disabled": disabled || void 0,
         "onClick": () => onClickAction(action, index2)
-      }, [icon && createVNode(Icon, {
-        "name": icon,
-        "classPrefix": props.iconPrefix,
-        "class": bem$i("action-icon")
-      }, null), createVNode("div", {
-        "class": [bem$i("action-text"), BORDER_BOTTOM]
-      }, [text])]);
+      }, [renderActionContent(action, index2)]);
     };
     onMounted(updateLocation);
     onBeforeUnmount(() => {
@@ -12361,7 +12439,7 @@ var searchProps = extend({}, fieldSharedProps, {
 var _Search = defineComponent({
   name: name$e,
   props: searchProps,
-  emits: ["search", "cancel", "update:modelValue"],
+  emits: ["blur", "focus", "clear", "search", "cancel", "click-input", "click-left-icon", "click-right-icon", "update:modelValue"],
   setup(props, _ref) {
     var {
       emit,
@@ -12411,6 +12489,12 @@ var _Search = defineComponent({
       var _filedRef$value2;
       return (_filedRef$value2 = filedRef.value) == null ? void 0 : _filedRef$value2.focus();
     };
+    var onBlur = (event) => emit("blur", event);
+    var onFocus = (event) => emit("focus", event);
+    var onClear = (event) => emit("clear", event);
+    var onClickInput = (event) => emit("click-input", event);
+    var onClickLeftIcon = (event) => emit("click-left-icon", event);
+    var onClickRightIcon = (event) => emit("click-right-icon", event);
     var fieldPropNames = Object.keys(fieldSharedProps);
     var renderField = () => {
       var fieldAttrs = extend({}, attrs, pick(props, fieldPropNames), {
@@ -12422,7 +12506,13 @@ var _Search = defineComponent({
         "type": "search",
         "class": bem$e("field"),
         "border": false,
+        "onBlur": onBlur,
+        "onFocus": onFocus,
+        "onClear": onClear,
         "onKeypress": onKeypress,
+        "onClick-input": onClickInput,
+        "onClick-left-icon": onClickLeftIcon,
+        "onClick-right-icon": onClickRightIcon,
         "onUpdate:modelValue": onInput
       }, fieldAttrs), pick(slots, ["left-icon", "right-icon"]));
     };
@@ -12585,7 +12675,8 @@ var sidebarItemProps = extend({}, routeProps, {
   dot: Boolean,
   title: String,
   badge: numericProp,
-  disabled: Boolean
+  disabled: Boolean,
+  badgeProps: Object
 });
 var _SidebarItem = defineComponent({
   name: name$b,
@@ -12629,11 +12720,11 @@ var _SidebarItem = defineComponent({
         "tabindex": disabled ? void 0 : 0,
         "aria-selected": selected,
         "onClick": onClick
-      }, [createVNode(Badge, {
+      }, [createVNode(Badge, mergeProps({
         "dot": dot,
-        "content": badge,
-        "class": bem$b("text")
-      }, {
+        "class": bem$b("text"),
+        "content": badge
+      }, props.badgeProps), {
         default: () => [slots.title ? slots.title() : title]
       })]);
     };
@@ -13047,7 +13138,7 @@ var _Step = defineComponent({
           color: parentProps.activeColor
         };
       }
-      if (!getStatus()) {
+      if (getStatus() === "waiting") {
         return {
           color: parentProps.inactiveColor
         };
@@ -13492,12 +13583,14 @@ var _SwipeCell = defineComponent({
     var leftWidth = computed(() => isDef(props.leftWidth) ? +props.leftWidth : getWidthByRef(leftRef));
     var rightWidth = computed(() => isDef(props.rightWidth) ? +props.rightWidth : getWidthByRef(rightRef));
     var open = (side) => {
-      opened = true;
       state.offset = side === "left" ? leftWidth.value : -rightWidth.value;
-      emit("open", {
-        name: props.name,
-        position: side
-      });
+      if (!opened) {
+        opened = true;
+        emit("open", {
+          name: props.name,
+          position: side
+        });
+      }
     };
     var close = (position) => {
       state.offset = 0;
@@ -13694,6 +13787,7 @@ var tabbarItemProps = extend({}, routeProps, {
   icon: String,
   name: numericProp,
   badge: numericProp,
+  badgeProps: Object,
   iconPrefix: String
 });
 var _TabbarItem = defineComponent({
@@ -13779,11 +13873,11 @@ var _TabbarItem = defineComponent({
         "tabindex": 0,
         "aria-selected": active.value,
         "onClick": onClick
-      }, [createVNode(Badge, {
+      }, [createVNode(Badge, mergeProps({
         "dot": dot,
-        "content": badge,
-        "class": bem$2("icon")
-      }, {
+        "class": bem$2("icon"),
+        "content": badge
+      }, props.badgeProps), {
         default: renderIcon
       }), createVNode("div", {
         "class": bem$2("text")
@@ -14308,7 +14402,7 @@ var _Uploader = defineComponent({
   }
 });
 var Uploader = withInstall(_Uploader);
-var version = "3.3.4";
+var version = "3.4.0";
 function install(app) {
   var components = [ActionBar, ActionBarButton, ActionBarIcon, ActionSheet, AddressEdit, AddressList, Area, Badge, Button, Calendar, Card, Cascader, Cell, CellGroup, Checkbox, CheckboxGroup, Circle, Col, Collapse, CollapseItem, ConfigProvider, ContactCard, ContactEdit, ContactList, CountDown, Coupon, CouponCell, CouponList, DatetimePicker, Dialog, Divider, DropdownItem, DropdownMenu, Empty, Field, Form, Grid, GridItem, Icon, Image$1, ImagePreview, IndexAnchor, IndexBar, List, Loading, Locale, NavBar, NoticeBar, Notify, NumberKeyboard, Overlay, Pagination, PasswordInput, Picker, Popover, Popup, Progress, PullRefresh, Radio, RadioGroup, Rate, Row, Search, ShareSheet, Sidebar, SidebarItem, Skeleton, Slider, Step, Stepper, Steps, Sticky, SubmitBar, Swipe, SwipeCell, SwipeItem, Switch, Tab, Tabbar, TabbarItem, Tabs, Tag, Toast, TreeSelect, Uploader];
   components.forEach((item) => {