vant 4.7.2 → 4.7.3

package/lib/vant.es.js

@@ -1,4 +1,4 @@
-import { unref, ref, reactive, inject, watch, onMounted, nextTick, createVNode, defineComponent, getCurrentInstance, computed, onActivated, onDeactivated, onBeforeUnmount, provide, watchEffect, mergeProps, Transition, withDirectives, vShow, Teleport, Fragment, onBeforeUpdate, createTextVNode, onUnmounted, createApp, resolveDirective, withKeys, onUpdated, Comment, Text, h } from "vue";
+import { unref, ref, reactive, inject, watch, onMounted, nextTick, createVNode, defineComponent, getCurrentInstance, computed, onActivated, onDeactivated, onBeforeUnmount, provide, watchEffect, mergeProps, Transition, withDirectives, vShow, Teleport, Fragment, onBeforeUpdate, Comment, createTextVNode, onUnmounted, createApp, resolveDirective, withKeys, onUpdated, Text, h } from "vue";
 import { useWindowSize, useRect, useChildren, useParent, onMountedOrActivated, getScrollParent, useEventListener, cancelRaf, raf, useScrollParent, usePageVisibility, doubleRaf, CUSTOM_FIELD_INJECTION_KEY, useCustomFieldValue, inBrowser as inBrowser$1, useToggle, useCountDown, useClickAway } from "@vant/use";
 import { normalizeClass, stringifyStyle, normalizeStyle } from "@vue/shared";
 import { offsetModifier, createPopper } from "@vant/popperjs";
@@ -2608,6 +2608,7 @@ const tabsProps = {
   offsetTop: makeNumericProp(0),
   background: String,
   lazyRender: truthProp,
+  showHeader: truthProp,
   lineWidth: numericProp,
   lineHeight: numericProp,
   beforeChange: Function,
@@ -2909,13 +2910,13 @@ var stdin_default$1C = defineComponent({
     return () => createVNode("div", {
       "ref": root,
       "class": bem$1o([props2.type])
-    }, [props2.sticky ? createVNode(Sticky, {
+    }, [props2.showHeader ? props2.sticky ? createVNode(Sticky, {
       "container": root.value,
       "offsetTop": offsetTopPx.value,
       "onScroll": onStickyScroll
     }, {
       default: () => [renderHeader()]
-    }) : renderHeader(), createVNode(stdin_default$1D, {
+    }) : renderHeader() : null, createVNode(stdin_default$1D, {
       "ref": contentRef,
       "count": children.length,
       "inited": state.inited,
@@ -3262,8 +3263,8 @@ var stdin_default$1z = defineComponent({
     };
     const onCancel = () => emit("cancel");
     return () => {
-      var _a;
-      const childNodes = (_a = slots.default) == null ? void 0 : _a.call(slots);
+      var _a, _b;
+      const childNodes = (_b = (_a = slots.default) == null ? void 0 : _a.call(slots)) == null ? void 0 : _b.filter((node) => node.type !== Comment);
       const confirmButtonText = showNextButton() ? props2.nextStepText : props2.confirmButtonText;
       return createVNode("div", {
         "class": bem$1k()
@@ -3653,13 +3654,16 @@ const cellSharedProps = {
   center: Boolean,
   isLink: Boolean,
   border: truthProp,
-  required: Boolean,
   iconPrefix: String,
   valueClass: unknownProp,
   labelClass: unknownProp,
   titleClass: unknownProp,
   titleStyle: null,
   arrowDirection: String,
+  required: {
+    type: [Boolean, String],
+    default: null
+  },
   clickable: {
     type: Boolean,
     default: null
@@ -3740,7 +3744,7 @@ var stdin_default$1w = defineComponent({
       const clickable = (_a = props2.clickable) != null ? _a : isLink;
       const classes = {
         center,
-        required,
+        required: !!required,
         clickable,
         borderless: !border
       };
@@ -3767,6 +3771,7 @@ const formProps = {
   colon: Boolean,
   disabled: Boolean,
   readonly: Boolean,
+  required: [Boolean, String],
   showError: Boolean,
   labelWidth: numericProp,
   labelAlign: String,
@@ -4022,12 +4027,12 @@ const fieldSharedProps = {
   autocorrect: String,
   errorMessage: String,
   enterkeyhint: String,
+  clearTrigger: makeStringProp("focus"),
+  formatTrigger: makeStringProp("onChange"),
   spellcheck: {
     type: Boolean,
     default: null
   },
-  clearTrigger: makeStringProp("focus"),
-  formatTrigger: makeStringProp("onChange"),
   error: {
     type: Boolean,
     default: null
@@ -4103,6 +4108,14 @@ var stdin_default$1u = defineComponent({
       }
       return props2.modelValue;
     });
+    const showRequiredMark = computed(() => {
+      var _a;
+      const required = getProp("required");
+      if (required === "auto") {
+        return (_a = props2.rules) == null ? void 0 : _a.some((rule) => rule.required);
+      }
+      return required;
+    });
     const runRules = (rules) => rules.reduce((promise, rule) => promise.then(() => {
       if (state.status === "failed") {
         return;
@@ -4505,7 +4518,7 @@ var stdin_default$1u = defineComponent({
         "titleStyle": labelStyle.value,
         "valueClass": bem$1g("value"),
         "titleClass": [bem$1g("label", [labelAlign, {
-          required: props2.required
+          required: showRequiredMark.value
         }]), props2.labelClass],
         "arrowDirection": props2.arrowDirection
       }, {
@@ -5169,7 +5182,7 @@ var stdin_default$1q = defineComponent({
             "label": t$i("area"),
             "is-link": !disableArea,
             "modelValue": areaText.value,
-            "rules": rules.value.areaCode,
+            "rules": props2.showArea ? rules.value.areaCode : void 0,
             "placeholder": props2.areaPlaceholder || t$i("area"),
             "onFocus": () => onFocus("areaCode"),
             "onClick": () => {
@@ -12970,7 +12983,9 @@ var stdin_default$v = defineComponent({
       return createVNode(Field, mergeProps({
         "ref": fieldRef,
         "type": "search",
-        "class": bem$m("field"),
+        "class": bem$m("field", {
+          "with-message": fieldAttrs.errorMessage
+        }),
         "border": false,
         "onBlur": onBlur,
         "onFocus": onFocus,
@@ -13318,7 +13333,7 @@ var stdin_default$r = defineComponent({
       }
       emit("clear");
     };
-    onMounted(() => {
+    const initialize = () => {
       var _a, _b, _c;
       if (isRenderCanvas && canvasRef.value) {
         const canvas = canvasRef.value;
@@ -13328,6 +13343,18 @@ var stdin_default$r = defineComponent({
         (_c = ctx.value) == null ? void 0 : _c.scale(dpr, dpr);
         setCanvasBgColor(ctx.value);
       }
+    };
+    const resize = () => {
+      if (ctx.value) {
+        const data = ctx.value.getImageData(0, 0, canvasWidth, canvasHeight);
+        initialize();
+        ctx.value.putImageData(data, 0, 0);
+      }
+    };
+    watch(windowWidth, resize);
+    onMounted(initialize);
+    useExpose({
+      resize
     });
     return () => createVNode("div", {
       "class": bem$i()
@@ -16518,7 +16545,7 @@ const Lazyload = {
     });
   }
 };
-const version = "4.7.2";
+const version = "4.7.3";
 function install(app) {
   const components = [
     ActionBar,

package/lib/vant.js

@@ -3075,6 +3075,7 @@
     offsetTop: makeNumericProp(0),
     background: String,
     lazyRender: truthProp,
+    showHeader: truthProp,
     lineWidth: numericProp,
     lineHeight: numericProp,
     beforeChange: Function,
@@ -3376,13 +3377,13 @@
       return () => vue.createVNode("div", {
         "ref": root,
         "class": bem$1o([props2.type])
-      }, [props2.sticky ? vue.createVNode(Sticky, {
+      }, [props2.showHeader ? props2.sticky ? vue.createVNode(Sticky, {
         "container": root.value,
         "offsetTop": offsetTopPx.value,
         "onScroll": onStickyScroll
       }, {
         default: () => [renderHeader()]
-      }) : renderHeader(), vue.createVNode(stdin_default$1D, {
+      }) : renderHeader() : null, vue.createVNode(stdin_default$1D, {
         "ref": contentRef,
         "count": children.length,
         "inited": state.inited,
@@ -3723,8 +3724,8 @@
       };
       const onCancel = () => emit("cancel");
       return () => {
-        var _a;
-        const childNodes = (_a = slots.default) == null ? void 0 : _a.call(slots);
+        var _a, _b;
+        const childNodes = (_b = (_a = slots.default) == null ? void 0 : _a.call(slots)) == null ? void 0 : _b.filter((node) => node.type !== vue.Comment);
         const confirmButtonText = showNextButton() ? props2.nextStepText : props2.confirmButtonText;
         return vue.createVNode("div", {
           "class": bem$1k()
@@ -4114,13 +4115,16 @@
     center: Boolean,
     isLink: Boolean,
     border: truthProp,
-    required: Boolean,
     iconPrefix: String,
     valueClass: unknownProp,
     labelClass: unknownProp,
     titleClass: unknownProp,
     titleStyle: null,
     arrowDirection: String,
+    required: {
+      type: [Boolean, String],
+      default: null
+    },
     clickable: {
       type: Boolean,
       default: null
@@ -4201,7 +4205,7 @@
         const clickable = (_a = props2.clickable) != null ? _a : isLink;
         const classes = {
           center,
-          required,
+          required: !!required,
           clickable,
           borderless: !border
         };
@@ -4228,6 +4232,7 @@
     colon: Boolean,
     disabled: Boolean,
     readonly: Boolean,
+    required: [Boolean, String],
     showError: Boolean,
     labelWidth: numericProp,
     labelAlign: String,
@@ -4483,12 +4488,12 @@
     autocorrect: String,
     errorMessage: String,
     enterkeyhint: String,
+    clearTrigger: makeStringProp("focus"),
+    formatTrigger: makeStringProp("onChange"),
     spellcheck: {
       type: Boolean,
       default: null
     },
-    clearTrigger: makeStringProp("focus"),
-    formatTrigger: makeStringProp("onChange"),
     error: {
       type: Boolean,
       default: null
@@ -4564,6 +4569,14 @@
         }
         return props2.modelValue;
       });
+      const showRequiredMark = vue.computed(() => {
+        var _a;
+        const required = getProp("required");
+        if (required === "auto") {
+          return (_a = props2.rules) == null ? void 0 : _a.some((rule) => rule.required);
+        }
+        return required;
+      });
       const runRules = (rules) => rules.reduce((promise, rule) => promise.then(() => {
         if (state.status === "failed") {
           return;
@@ -4966,7 +4979,7 @@
           "titleStyle": labelStyle.value,
           "valueClass": bem$1g("value"),
           "titleClass": [bem$1g("label", [labelAlign, {
-            required: props2.required
+            required: showRequiredMark.value
           }]), props2.labelClass],
           "arrowDirection": props2.arrowDirection
         }, {
@@ -5630,7 +5643,7 @@
               "label": t$i("area"),
               "is-link": !disableArea,
               "modelValue": areaText.value,
-              "rules": rules.value.areaCode,
+              "rules": props2.showArea ? rules.value.areaCode : void 0,
               "placeholder": props2.areaPlaceholder || t$i("area"),
               "onFocus": () => onFocus("areaCode"),
               "onClick": () => {
@@ -14211,7 +14224,9 @@
         return vue.createVNode(Field, vue.mergeProps({
           "ref": fieldRef,
           "type": "search",
-          "class": bem$m("field"),
+          "class": bem$m("field", {
+            "with-message": fieldAttrs.errorMessage
+          }),
           "border": false,
           "onBlur": onBlur,
           "onFocus": onFocus,
@@ -14556,7 +14571,7 @@
         }
         emit("clear");
       };
-      vue.onMounted(() => {
+      const initialize = () => {
         var _a, _b, _c;
         if (isRenderCanvas && canvasRef.value) {
           const canvas = canvasRef.value;
@@ -14566,6 +14581,18 @@
           (_c = ctx.value) == null ? void 0 : _c.scale(dpr, dpr);
           setCanvasBgColor(ctx.value);
         }
+      };
+      const resize = () => {
+        if (ctx.value) {
+          const data = ctx.value.getImageData(0, 0, canvasWidth, canvasHeight);
+          initialize();
+          ctx.value.putImageData(data, 0, 0);
+        }
+      };
+      vue.watch(windowWidth, resize);
+      vue.onMounted(initialize);
+      useExpose({
+        resize
       });
       return () => vue.createVNode("div", {
         "class": bem$i()
@@ -17730,7 +17757,7 @@
       });
     }
   };
-  const version = "4.7.2";
+  const version = "4.7.3";
   function install(app) {
     const components = [
       ActionBar,