vant 4.7.1 → 4.7.3

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": () => {
@@ -10698,6 +10711,7 @@
       rootWidth: makeRequiredProp(Number),
       rootHeight: makeRequiredProp(Number),
       disableZoom: Boolean,
+      doubleScale: Boolean,
       closeOnClickOverlay: Boolean
     },
     emits: ["scale", "close", "longPress"],
@@ -10871,18 +10885,22 @@
         const TAP_TIME = 250;
         if (offsetX.value < TAP_OFFSET && offsetY.value < TAP_OFFSET) {
           if (deltaTime < TAP_TIME) {
-            if (doubleTapTimer) {
-              clearTimeout(doubleTapTimer);
-              doubleTapTimer = null;
-              toggleScale();
-            } else {
-              if (!props2.closeOnClickOverlay && event.target === ((_a = swipeItem.value) == null ? void 0 : _a.$el)) {
-                return;
-              }
-              doubleTapTimer = setTimeout(() => {
-                emit("close");
+            if (props2.doubleScale) {
+              if (doubleTapTimer) {
+                clearTimeout(doubleTapTimer);
                 doubleTapTimer = null;
-              }, TAP_TIME);
+                toggleScale();
+              } else {
+                if (!props2.closeOnClickOverlay && event.target === ((_a = swipeItem.value) == null ? void 0 : _a.$el)) {
+                  return;
+                }
+                doubleTapTimer = setTimeout(() => {
+                  emit("close");
+                  doubleTapTimer = null;
+                }, TAP_TIME);
+              }
+            } else {
+              emit("close");
             }
           } else if (deltaTime > LONG_PRESS_START_TIME) {
             emit("longPress");
@@ -11007,6 +11025,7 @@
     closeIcon: makeStringProp("clear"),
     transition: String,
     beforeClose: Function,
+    doubleScale: truthProp,
     overlayClass: unknownProp,
     overlayStyle: Object,
     swipeDuration: makeNumericProp(300),
@@ -11098,6 +11117,7 @@
           "rootWidth": state.rootWidth,
           "rootHeight": state.rootHeight,
           "disableZoom": state.disableZoom,
+          "doubleScale": props2.doubleScale,
           "closeOnClickOverlay": props2.closeOnClickOverlay,
           "onScale": emitScale,
           "onClose": emitClose,
@@ -11175,6 +11195,7 @@
     closeIcon: "clear",
     transition: void 0,
     beforeClose: void 0,
+    doubleScale: true,
     overlayStyle: void 0,
     overlayClass: void 0,
     startPosition: 0,
@@ -14203,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,
@@ -14471,37 +14494,37 @@
     }) {
       const canvasRef = vue.ref();
       const wrapRef = vue.ref();
-      const state = vue.reactive({
-        width: 0,
-        height: 0,
-        ctx: null,
-        ratio: inBrowser$1 ? window.devicePixelRatio : 1
+      const ctx = vue.computed(() => {
+        if (!canvasRef.value)
+          return null;
+        return canvasRef.value.getContext("2d");
       });
-      let canvasRect;
       const isRenderCanvas = inBrowser$1 ? hasCanvasSupport() : true;
+      let canvasWidth = 0;
+      let canvasHeight = 0;
+      let canvasRect;
       const touchStart = () => {
-        if (!state.ctx) {
+        if (!ctx.value) {
           return false;
         }
-        state.ctx.beginPath();
-        state.ctx.lineWidth = props2.lineWidth * state.ratio;
-        state.ctx.strokeStyle = props2.penColor;
+        ctx.value.beginPath();
+        ctx.value.lineWidth = props2.lineWidth;
+        ctx.value.strokeStyle = props2.penColor;
         canvasRect = useRect(canvasRef);
         emit("start");
       };
       const touchMove = (event) => {
-        var _a, _b;
-        if (!state.ctx) {
+        if (!ctx.value) {
           return false;
         }
         preventDefault(event);
         const touch = event.touches[0];
-        const mouseX = (touch.clientX - ((canvasRect == null ? void 0 : canvasRect.left) || 0)) * state.ratio;
-        const mouseY = (touch.clientY - ((canvasRect == null ? void 0 : canvasRect.top) || 0)) * state.ratio;
-        state.ctx.lineCap = "round";
-        state.ctx.lineJoin = "round";
-        (_a = state.ctx) == null ? void 0 : _a.lineTo(mouseX, mouseY);
-        (_b = state.ctx) == null ? void 0 : _b.stroke();
+        const mouseX = touch.clientX - ((canvasRect == null ? void 0 : canvasRect.left) || 0);
+        const mouseY = touch.clientY - ((canvasRect == null ? void 0 : canvasRect.top) || 0);
+        ctx.value.lineCap = "round";
+        ctx.value.lineJoin = "round";
+        ctx.value.lineTo(mouseX, mouseY);
+        ctx.value.stroke();
         emit("signing", event);
       };
       const touchEnd = (event) => {
@@ -14518,10 +14541,10 @@
         }
         return canvas.toDataURL() === empty.toDataURL();
       };
-      const setCanvasBgColor = (ctx) => {
-        if (ctx && props2.backgroundColor) {
-          ctx.fillStyle = props2.backgroundColor;
-          ctx.fillRect(0, 0, state.width, state.height);
+      const setCanvasBgColor = (ctx2) => {
+        if (ctx2 && props2.backgroundColor) {
+          ctx2.fillStyle = props2.backgroundColor;
+          ctx2.fillRect(0, 0, canvasWidth, canvasHeight);
         }
       };
       const submit = () => {
@@ -14541,23 +14564,35 @@
         });
       };
       const clear = () => {
-        if (state.ctx) {
-          state.ctx.clearRect(0, 0, state.width, state.height);
-          state.ctx.closePath();
-          setCanvasBgColor(state.ctx);
+        if (ctx.value) {
+          ctx.value.clearRect(0, 0, canvasWidth, canvasHeight);
+          ctx.value.closePath();
+          setCanvasBgColor(ctx.value);
         }
         emit("clear");
       };
-      vue.onMounted(() => {
+      const initialize = () => {
         var _a, _b, _c;
-        if (isRenderCanvas) {
-          state.ctx = (_a = canvasRef.value) == null ? void 0 : _a.getContext("2d");
-          state.width = (((_b = wrapRef.value) == null ? void 0 : _b.offsetWidth) || 0) * state.ratio;
-          state.height = (((_c = wrapRef.value) == null ? void 0 : _c.offsetHeight) || 0) * state.ratio;
-          vue.nextTick(() => {
-            setCanvasBgColor(state.ctx);
-          });
+        if (isRenderCanvas && canvasRef.value) {
+          const canvas = canvasRef.value;
+          const dpr = inBrowser$1 ? window.devicePixelRatio : 1;
+          canvasWidth = canvas.width = (((_a = wrapRef.value) == null ? void 0 : _a.offsetWidth) || 0) * dpr;
+          canvasHeight = canvas.height = (((_b = wrapRef.value) == null ? void 0 : _b.offsetHeight) || 0) * dpr;
+          (_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()
@@ -14566,8 +14601,6 @@
         "ref": wrapRef
       }, [isRenderCanvas ? vue.createVNode("canvas", {
         "ref": canvasRef,
-        "width": state.width,
-        "height": state.height,
         "onTouchstartPassive": touchStart,
         "onTouchmove": touchMove,
         "onTouchend": touchEnd
@@ -16516,6 +16549,7 @@
       const inputRef = vue.ref();
       const urls = [];
       const reuploadIndex = vue.ref(-1);
+      const isReuploading = vue.ref(false);
       const getDetail = (index = props2.modelValue.length) => ({
         name: props2.name,
         index
@@ -16652,8 +16686,15 @@
         emit("delete", item, getDetail(index));
       };
       const reuploadImage = (index) => {
-        chooseFile();
+        isReuploading.value = true;
         reuploadIndex.value = index;
+        vue.nextTick(() => chooseFile());
+      };
+      const onInputClick = () => {
+        if (!isReuploading.value) {
+          reuploadIndex.value = -1;
+        }
+        isReuploading.value = false;
       };
       const renderPreviewItem = (item, index) => {
         const needPickData = ["imageFit", "deletable", "reupload", "previewSize", "beforeDelete"];
@@ -16686,7 +16727,8 @@
           "capture": props2.capture,
           "multiple": props2.multiple && reuploadIndex.value === -1,
           "disabled": props2.disabled,
-          "onChange": onChange
+          "onChange": onChange,
+          "onClick": onInputClick
         }, null);
         if (slots.default) {
           return vue.withDirectives(vue.createVNode("div", {
@@ -17715,7 +17757,7 @@
       });
     }
   };
-  const version = "4.7.1";
+  const version = "4.7.3";
   function install(app) {
     const components = [
       ActionBar,