@verbb/formie-browser 1.0.12 → 1.0.13

package/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 ## Unreleased
 
+## 1.0.13 - 2026-07-09
+
+### Fixed
+- Fix Signature field canvas height preserving the stored PNG aspect ratio when restoring values or resizing, so signatures are not vertically stretched.
+- Fix Date/Time calendar fields not using an existing input value as the Flatpickr default date on init.
+- Fix false unload warnings after front-end form init by resetting dirty state once captcha/token hydration and field modules have settled.
+
 ## 1.0.12 - 2026-07-02
 
 ### Added

package/dist/chunks/{calculations-DERi2xaC.js → calculations-Dv3hYb8_.js}

@@ -2,7 +2,7 @@ import { t as e } from "./debug-BV0DvdHx.js";
 import { r as t, t as n } from "./field-references.keys-58ZSTrCW.js";
 import { n as r, r as i } from "./field-references.resolver-CHwn0G0L.js";
 import { r as a, t as o } from "./shared-Bx9s0i0P.js";
-import { c as s, i as c, r as l, s as u, t as d } from "./dist-BdUy8m_p.js";
+import { c as s, i as c, r as l, s as u, t as d } from "./dist-D6i-VNgM.js";
 //#region src/js/utils/field-references.row-scope.ts
 var f = new Set([
 	"first",

package/dist/chunks/{conditions-65kBcFWW.js → conditions-CPH1snCx.js}

@@ -1,7 +1,7 @@
 import { t as e } from "./debug-BV0DvdHx.js";
 import { t } from "./field-references.keys-58ZSTrCW.js";
 import { n } from "./shared-Bx9s0i0P.js";
-import { a as r, o as i } from "./dist-BdUy8m_p.js";
+import { a as r, o as i } from "./dist-D6i-VNgM.js";
 //#region src/js/modules/fields/conditions/config.ts
 var a = "[data-formie-conditions]";
 function o(e) {

package/dist/chunks/{date-picker-5CA_-zGb.js → date-picker-F9BUBDSW.js}

@@ -5269,6 +5269,9 @@ function H(e, t) {
 		s.mode = "range";
 		let e = i instanceof HTMLInputElement && i.value ? V(i.value) : null, t = o instanceof HTMLInputElement && o.value ? V(o.value) : null;
 		e && (s.defaultDate = t ? [e, t] : [e]);
+	} else if (e.value) {
+		let t = V(e.value);
+		t && (s.defaultDate = t);
 	}
 	let l = {
 		...s,

package/dist/chunks/{dist-BdUy8m_p.js → dist-D6i-VNgM.js}

@@ -1,4 +1,4 @@
-//#region ../formie-core/dist/index.js
+//#region node_modules/@verbb/formie-core/dist/index.js
 var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescriptor, r = Object.getOwnPropertyNames, i = Object.getPrototypeOf, a = Object.prototype.hasOwnProperty, o = (e, t) => () => (t || (e((t = { exports: {} }).exports, t), e = null), t.exports), s = (e, i, o, s) => {
 	if (i && typeof i == "object" || typeof i == "function") for (var c = r(i), l = 0, u = c.length, d; l < u; l++) d = c[l], !a.call(e, d) && d !== o && t(e, d, {
 		get: ((e) => i[e]).bind(null, d),

package/dist/chunks/{password-validation-T0vDQPCr.js → password-validation-D06uH9va.js}

@@ -1,5 +1,5 @@
 import { c as e, i as t, l as n } from "./shared-Bx9s0i0P.js";
-import { n as r } from "./dist-BdUy8m_p.js";
+import { n as r } from "./dist-D6i-VNgM.js";
 //#region src/js/modules/fields/password-validation.ts
 var i = "input[data-formie-password-input]", a = [
 	"passwordMinLength",

package/dist/chunks/{signature-xz4QO7CR.js → signature-IOhuicje.js}

@@ -386,7 +386,7 @@ var s = class e extends a {
 			a.setAttribute("r", s.toString()), a.setAttribute("cx", e.x.toString()), a.setAttribute("cy", e.y.toString()), a.setAttribute("fill", t), o.appendChild(a);
 		}), o.outerHTML;
 	}
-}, c = "@layer formie-theme{[data-formie-field-type=signature] .formie-field-control{transition:border-color .15s,box-shadow .15s,background-color .15s;position:relative}[data-formie-field-type=signature] .formie-field-control:focus-within .formie-signature-canvas{border-color:var(--formie-focus-ring-border-color);box-shadow:var(--formie-shadow-focus)}.formie-field-has-error[data-formie-field-type=signature] .formie-signature-canvas{border-color:var(--formie-color-danger)}.formie-field-has-error[data-formie-field-type=signature] .formie-field-control:focus-within .formie-signature-canvas{box-shadow:var(--formie-shadow-danger-focus)}[data-formie-field-type=signature] .formie-signature-canvas{width:var(--formie-signature-width);height:var(--formie-signature-height);border:var(--formie-signature-border);background:var(--formie-signature-background);border-radius:var(--formie-signature-border-radius);touch-action:none;transition:border-color .15s,box-shadow .15s,background-color .15s;display:block}[data-formie-field-type=signature] .formie-signature-remove-button{top:var(--formie-signature-remove-button-top);right:var(--formie-signature-remove-button-right);transform:var(--formie-signature-remove-button-transform);font-size:0;line-height:0;position:absolute}[data-formie-field-type=signature] .formie-signature-pad{position:relative}[data-formie-field-type=signature] .formie-signature-message{padding:var(--formie-space-3);border:var(--formie-signature-border);border-radius:var(--formie-signature-border-radius);background:var(--formie-signature-background);color:var(--formie-color-text-muted);font-size:var(--formie-font-size-sm);line-height:var(--formie-line-height-base);margin:0}[data-formie-field-type=signature].formie-signature-has-message .formie-signature-canvas{display:none}}", l = "input[data-formie-signature-input]", u = "canvas[data-formie-signature-canvas]", d = "[data-formie-signature-clear]", f = "[data-formie-signature-message]", p = "signature", m = 20, h = 100, g = [
+}, c = "@layer formie-theme{[data-formie-field-type=signature] .formie-field-control{transition:border-color .15s,box-shadow .15s,background-color .15s;position:relative}[data-formie-field-type=signature] .formie-field-control:focus-within .formie-signature-canvas{border-color:var(--formie-focus-ring-border-color);box-shadow:var(--formie-shadow-focus)}.formie-field-has-error[data-formie-field-type=signature] .formie-signature-canvas{border-color:var(--formie-color-danger)}.formie-field-has-error[data-formie-field-type=signature] .formie-field-control:focus-within .formie-signature-canvas{box-shadow:var(--formie-shadow-danger-focus)}[data-formie-field-type=signature] .formie-signature-canvas{width:var(--formie-signature-width);min-height:var(--formie-signature-height);border:var(--formie-signature-border);background:var(--formie-signature-background);border-radius:var(--formie-signature-border-radius);touch-action:none;height:auto;transition:border-color .15s,box-shadow .15s,background-color .15s;display:block}[data-formie-field-type=signature] .formie-signature-remove-button{top:var(--formie-signature-remove-button-top);right:var(--formie-signature-remove-button-right);transform:var(--formie-signature-remove-button-transform);font-size:0;line-height:0;position:absolute}[data-formie-field-type=signature] .formie-signature-pad{position:relative}[data-formie-field-type=signature] .formie-signature-message{padding:var(--formie-space-3);border:var(--formie-signature-border);border-radius:var(--formie-signature-border-radius);background:var(--formie-signature-background);color:var(--formie-color-text-muted);font-size:var(--formie-font-size-sm);line-height:var(--formie-line-height-base);margin:0}[data-formie-field-type=signature].formie-signature-has-message .formie-signature-canvas{display:none}}", l = "input[data-formie-signature-input]", u = "canvas[data-formie-signature-canvas]", d = "[data-formie-signature-clear]", f = "[data-formie-signature-message]", p = "signature", m = 20, h = 100, g = [
 	"hidden",
 	"data-formie-conditionally-hidden",
 	"data-formie-page-hidden",
@@ -436,85 +436,107 @@ function C(e, t) {
 		r && r.drawImage(n, 0, 0, e.width / t, e.height / t);
 	};
 }
-async function w(e, t, n) {
-	if (n) try {
-		await e.fromDataURL(n);
-	} catch {
-		C(t, n);
+function w(e) {
+	return new Promise((t) => {
+		let n = new Image();
+		n.onload = () => {
+			t({
+				width: n.naturalWidth,
+				height: n.naturalHeight
+			});
+		}, n.onerror = () => t(null), n.src = e;
+	});
+}
+async function T(e, t) {
+	let n = await w(t);
+	if (!n?.width || !n?.height) return;
+	let { width: r } = _(e);
+	if (!(r > 0)) return;
+	let i = Math.max(1, Math.round(r * (n.height / n.width)));
+	e.style.height = `${i}px`;
+}
+async function E(e, t, n) {
+	if (n) {
+		await T(t, n);
+		try {
+			await e.fromDataURL(n);
+		} catch {
+			C(t, n);
+		}
 	}
 }
-function T(e, t, r, i, a, o) {
+function D(e, t, r, i, a, o) {
 	let c = b(t);
 	if (!v()) return x(t, i, c.noCanvas), () => {};
-	let l = parseFloat(o.penWeight || "2") || 2, u = i.parentElement instanceof HTMLElement ? i.parentElement : t, d = 0, f = null, y = !1, C = !1, T = new s(i, {
+	let l = parseFloat(o.penWeight || "2") || 2, u = i.parentElement instanceof HTMLElement ? i.parentElement : t, d = 0, f = null, y = !1, C = !1, w = new s(i, {
 		backgroundColor: o.backgroundColor || "rgba(255, 255, 255, 0)",
 		penColor: o.penColor || "#000000",
 		dotSize: l,
 		minWidth: l,
 		maxWidth: l
-	}), E = () => {
+	}), D = () => {
 		f !== null && (window.clearTimeout(f), f = null);
-	}, D = () => {
-		y || (y = !0, C = !1, x(t, i, null), n(t, p, "init", { signature: T }));
 	}, O = () => {
+		y || (y = !0, C = !1, x(t, i, null), n(t, p, "init", { signature: w }));
+	}, k = () => {
 		y || C || (C = !0, x(t, i, c.initFailed));
-	}, k = async () => {
-		let { width: e, height: t } = _(i);
-		if (!(e > 0) || !(t > 0)) return !1;
-		let n = Math.max(window.devicePixelRatio || 1, 1), a = i.getContext("2d");
-		if (!a) return !1;
-		let o = r.value || (T.isEmpty() ? "" : T.toDataURL());
-		return i.width = e * n, i.height = t * n, a.setTransform(1, 0, 0, 1, 0, 0), a.scale(n, n), T.clear(), await w(T, i, o), D(), !0;
-	}, A = () => {
+	}, A = async () => {
+		let e = r.value || (w.isEmpty() ? "" : w.toDataURL());
+		e && await T(i, e);
+		let { width: t, height: n } = _(i);
+		if (!(t > 0) || !(n > 0)) return !1;
+		let a = Math.max(window.devicePixelRatio || 1, 1), o = i.getContext("2d");
+		return o ? (i.width = t * a, i.height = n * a, o.setTransform(1, 0, 0, 1, 0, 0), o.scale(a, a), w.clear(), await E(w, i, e), O(), !0) : !1;
+	}, j = () => {
 		if (!(y || C)) {
 			if (d >= m) {
-				O();
+				k();
 				return;
 			}
-			E(), f = window.setTimeout(() => {
-				f = null, d += 1, j();
+			D(), f = window.setTimeout(() => {
+				f = null, d += 1, M();
 			}, h);
 		}
-	}, j = async () => {
-		if (!await k()) {
-			A();
+	}, M = async () => {
+		if (!await A()) {
+			j();
 			return;
 		}
-		E(), d = 0;
-	}, M = (e = 0) => {
+		D(), d = 0;
+	}, N = (e = 0) => {
 		window.setTimeout(() => {
 			window.requestAnimationFrame(() => {
-				j();
+				M();
 			});
 		}, e);
-	}, N = () => {
-		S(t) && !y && (C = !1), M();
 	}, P = () => {
-		N();
+		S(t) && !y && (C = !1), N();
 	}, F = () => {
-		S(t) && (d = 0, C = !1, M(100));
+		P();
 	}, I = () => {
-		S(t) && (d = 0, C = !1, N());
-	}, L = typeof ResizeObserver > "u" ? null : new ResizeObserver(() => {
-		N();
-	}), R = new MutationObserver(() => {
-		I();
-	}), z = (e) => {
+		S(t) && (d = 0, C = !1, N(100));
+	}, L = () => {
+		S(t) && (d = 0, C = !1, P());
+	}, R = typeof ResizeObserver > "u" ? null : new ResizeObserver(() => {
+		P();
+	}), z = new MutationObserver(() => {
+		L();
+	}), B = (e) => {
 		let t = r.value !== e;
 		r.value = e, t && (r.dispatchEvent(new Event("input", { bubbles: !0 })), r.dispatchEvent(new Event("change", { bubbles: !0 })));
-	}, B = () => {
-		z(T.isEmpty() ? "" : T.toDataURL());
 	}, V = () => {
-		T.clear(), z("");
+		B(w.isEmpty() ? "" : w.toDataURL());
+	}, H = () => {
+		w.clear(), B("");
 	};
-	return T.addEventListener("endStroke", B), window.addEventListener("resize", P), e.addEventListener("formie:page:navigate:after", F), L?.observe(u), R.observe(t, {
+	return w.addEventListener("endStroke", V), window.addEventListener("resize", F), e.addEventListener("formie:page:navigate:after", I), R?.observe(u), z.observe(t, {
 		attributes: !0,
 		attributeFilter: [...g]
-	}), M(), a && a.addEventListener("click", V), () => {
-		E(), T.removeEventListener("endStroke", B), window.removeEventListener("resize", P), e.removeEventListener("formie:page:navigate:after", F), L?.disconnect(), R.disconnect(), a && a.removeEventListener("click", V), T.clear();
+	}), N(), a && a.addEventListener("click", H), () => {
+		D(), w.removeEventListener("endStroke", V), window.removeEventListener("resize", F), e.removeEventListener("formie:page:navigate:after", I), R?.disconnect(), z.disconnect(), a && a.removeEventListener("click", H), w.clear();
 	};
 }
-var E = {
+var O = {
 	id: p,
 	kind: "field",
 	match: (e) => !!e.target.querySelector(u),
@@ -523,7 +545,7 @@ var E = {
 		if (!r) return;
 		let i = t(e).map((e) => {
 			let t = e.querySelector(l), i = e.querySelector(u), a = e.querySelector(d);
-			return !(t instanceof HTMLInputElement) || !(i instanceof HTMLCanvasElement) ? () => {} : T(r, e, t, i, a instanceof HTMLElement ? a : null, n);
+			return !(t instanceof HTMLInputElement) || !(i instanceof HTMLCanvasElement) ? () => {} : D(r, e, t, i, a instanceof HTMLElement ? a : null, n);
 		});
 		return await e.emit("formie:module:signature:init", { count: i.length }), { destroy: () => {
 			i.forEach((e) => {
@@ -533,4 +555,4 @@ var E = {
 	}
 };
 //#endregion
-export { E as signatureModule };
+export { O as signatureModule };

package/dist/chunks/{text-limit-Bn18WrPU.js → text-limit-BGaY0jhI.js}

@@ -1,7 +1,7 @@
 import { i as e } from "./i18n-BY1ds1BL.js";
 import { t } from "./styles-BfoIZwJp.js";
 import { c as n, i as r, l as i } from "./shared-Bx9s0i0P.js";
-import { n as a } from "./dist-BdUy8m_p.js";
+import { n as a } from "./dist-D6i-VNgM.js";
 //#region src/css/theme/fields/_text-limit.css?inline
 var o = "@layer formie-theme{.formie-limit-number{font-weight:var(--formie-font-weight-semibold);color:var(--formie-color-text)}.formie-limit-number-error{color:var(--formie-color-danger)}}", s = "input[data-formie-single-line-text-input], textarea[data-formie-multi-line-text-input]", c = [
 	"textMinCharacterLimit",

package/dist/css/theme/fields/_signature.css

@@ -20,7 +20,8 @@
     [data-formie-field-type="signature"] .formie-signature-canvas {
         display: block;
         width: var(--formie-signature-width);
-        height: var(--formie-signature-height);
+        min-height: var(--formie-signature-height);
+        height: auto;
         border: var(--formie-signature-border);
         background: var(--formie-signature-background);
         border-radius: var(--formie-signature-border-radius);

package/dist/index.js

@@ -1382,30 +1382,30 @@ var L = class {
 	snaptcha: () => import("./chunks/snaptcha-DKx98oon.js").then((e) => e.snaptchaModule),
 	turnstile: () => import("./chunks/turnstile-DJakPzQD.js").then((e) => e.turnstileModule)
 }, Xt = {
-	calculations: () => import("./chunks/calculations-DERi2xaC.js").then((e) => e.calculationsModule),
+	calculations: () => import("./chunks/calculations-Dv3hYb8_.js").then((e) => e.calculationsModule),
 	"checkbox-radio": () => import("./chunks/checkbox-radio-BY2aTCOG.js").then((e) => e.checkboxRadioModule),
 	combobox: () => import("./chunks/combobox-C0EuExSI.js").then((e) => e.comboboxModule),
-	conditions: () => import("./chunks/conditions-65kBcFWW.js").then((e) => e.conditionsModule),
+	conditions: () => import("./chunks/conditions-CPH1snCx.js").then((e) => e.conditionsModule),
 	"custom-google-maps": () => import("./chunks/custom-google-maps-BsaSirEZ.js").then((e) => e.customGoogleMapsModule),
 	"custom-link": () => import("./chunks/custom-link-CJ1-FjEM.js").then((e) => e.customLinkModule),
 	"custom-maps": () => import("./chunks/custom-maps-DYW_pBid.js").then((e) => e.customMapsModule),
-	"date-picker": () => import("./chunks/date-picker-5CA_-zGb.js").then((e) => e.datePickerModule),
+	"date-picker": () => import("./chunks/date-picker-F9BUBDSW.js").then((e) => e.datePickerModule),
 	"file-upload": () => import("./chunks/file-upload-rqfZNqlH.js").then((e) => e.fileUploadModule),
 	"upload-manager": () => import("./chunks/upload-manager-W-QDgxKD.js").then((e) => e.uploadManagerModule),
 	hidden: () => import("./chunks/hidden-D7_Ch-QN.js").then((e) => e.hiddenModule),
 	"phone-country": () => import("./chunks/phone-country-D3ayr60L.js").then((e) => e.phoneCountryModule),
-	"password-validation": () => import("./chunks/password-validation-T0vDQPCr.js").then((e) => e.passwordValidationModule),
+	"password-validation": () => import("./chunks/password-validation-D06uH9va.js").then((e) => e.passwordValidationModule),
 	"address-country": () => import("./chunks/address-country-Rx6GQTND.js").then((e) => e.addressCountryModule),
 	"address-state": () => import("./chunks/address-state-BwE01m2_.js").then((e) => e.addressStateModule),
 	repeater: () => import("./chunks/repeater-BVnPUqTj.js").then((e) => e.repeaterModule),
 	"rich-text": () => import("./chunks/rich-text-Bg_--4TG.js").then((e) => e.richTextModule),
-	signature: () => import("./chunks/signature-xz4QO7CR.js").then((e) => e.signatureModule),
+	signature: () => import("./chunks/signature-IOhuicje.js").then((e) => e.signatureModule),
 	summary: () => import("./chunks/summary-Dks0gXS3.js").then((e) => e.summaryModule),
 	"survey-likert": () => import("./chunks/survey-likert-DkE6bR7B.js").then((e) => e.surveyLikertModule),
 	"survey-rank": () => import("./chunks/survey-rank-DN6x4IZM.js").then((e) => e.surveyRankModule),
 	"survey-rating": () => import("./chunks/survey-rating-BnsNL9U5.js").then((e) => e.surveyRatingModule),
 	table: () => import("./chunks/table-CAjCJHrL.js").then((e) => e.tableModule),
-	"text-limit": () => import("./chunks/text-limit-Bn18WrPU.js").then((e) => e.textLimitModule)
+	"text-limit": () => import("./chunks/text-limit-BGaY0jhI.js").then((e) => e.textLimitModule)
 }, Zt = {
 	bpoint: () => import("./chunks/bpoint-Dlq34XH1.js").then((e) => e.bpointModule),
 	eway: () => import("./chunks/eway-D9_m8ooj.js").then((e) => e.ewayModule),
@@ -2231,7 +2231,9 @@ function sr() {
 			instance: D,
 			options: g,
 			unbinds: d
-		})), b && (ar(r, b, m, l, T, d), T && (d.push(_(b, T, r)), d.push(bn(b))), await or(r, m, b)), i.forEach((e) => {
+		})), b && (ar(r, b, m, l, T, d), T && (d.push(_(b, T, r)), d.push(bn(b))), await or(r, m, b), b.dispatchEvent(new CustomEvent("formie:state:reset")), window.setTimeout(() => {
+			b.dispatchEvent(new CustomEvent("formie:state:reset"));
+		}, 350)), i.forEach((e) => {
 			let t = l.on(`formie:stage:${e}:before`, async (t) => {
 				h(r, `formie:stage:${e}:before`, t);
 			}), n = l.on(`formie:stage:${e}:before`, async (e) => {

package/dist/js/core/create-formie-client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create-formie-client.d.ts","sourceRoot":"","sources":["../../../src/js/core/create-formie-client.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACR,YAAY,EAGf,MAAM,mBAAmB,CAAC;AA81B3B,wBAAgB,kBAAkB,IAAI,YAAY,CAysBjD"}
+{"version":3,"file":"create-formie-client.d.ts","sourceRoot":"","sources":["../../../src/js/core/create-formie-client.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACR,YAAY,EAGf,MAAM,mBAAmB,CAAC;AA81B3B,wBAAgB,kBAAkB,IAAI,YAAY,CAgtBjD"}

package/dist/js/modules/fields/date-picker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../../../src/js/modules/fields/date-picker.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAgUjE,eAAO,MAAM,gBAAgB,EAAE,sBAwC9B,CAAC"}
+{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../../../src/js/modules/fields/date-picker.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAsUjE,eAAO,MAAM,gBAAgB,EAAE,sBAwC9B,CAAC"}

package/dist/js/modules/fields/signature.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"signature.d.ts","sourceRoot":"","sources":["../../../../src/js/modules/fields/signature.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAmVjE,eAAO,MAAM,eAAe,EAAE,sBA2C7B,CAAC"}
+{"version":3,"file":"signature.d.ts","sourceRoot":"","sources":["../../../../src/js/modules/fields/signature.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAyXjE,eAAO,MAAM,eAAe,EAAE,sBA2C7B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@verbb/formie-browser",
-  "version": "1.0.12",
+  "version": "1.0.13",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -70,7 +70,7 @@
     "@placekit/autocomplete-js": "^2.2.1",
     "@uppy/core": "^5.2.0",
     "@uppy/xhr-upload": "^5.2.0",
-    "@verbb/formie-core": "1.0.12",
+    "@verbb/formie-core": "1.0.13",
     "expression-language": "^2.5.4",
     "flatpickr": "^4.6.13",
     "friendly-challenge": "^0.9.19",

package/src/css/theme/fields/_signature.css

@@ -20,7 +20,8 @@
     [data-formie-field-type="signature"] .formie-signature-canvas {
         display: block;
         width: var(--formie-signature-width);
-        height: var(--formie-signature-height);
+        min-height: var(--formie-signature-height);
+        height: auto;
         border: var(--formie-signature-border);
         background: var(--formie-signature-background);
         border-radius: var(--formie-signature-border-radius);

package/src/js/core/create-formie-client.ts

@@ -1192,6 +1192,13 @@ export function createFormieClient(): FormieClient {
             }
 
             await refreshTokensIfNeeded(target, normalizedOptions, form);
+
+            // Recapture after captcha/token hydration and field-module init settle so
+            // programmatic post-mount value changes do not leave a false dirty state.
+            form.dispatchEvent(new CustomEvent('formie:state:reset'));
+            window.setTimeout(() => {
+                form.dispatchEvent(new CustomEvent('formie:state:reset'));
+            }, 350);
         }
 
         stageNames.forEach((stageName) => {

package/src/js/modules/fields/date-picker.ts

@@ -285,6 +285,12 @@ function initDatePicker(input: FlatpickrInput, options: DatePickerOptions): () =
         if (startDate) {
             defaultOptions.defaultDate = endDate ? [startDate, endDate] : [startDate];
         }
+    } else if (input.value) {
+        const defaultDate = parseSubmissionDate(input.value);
+
+        if (defaultDate) {
+            defaultOptions.defaultDate = defaultDate;
+        }
     }
 
     const mergedOptions = {

package/src/js/modules/fields/signature.ts

@@ -111,11 +111,45 @@ function drawValueOnCanvas(canvas: HTMLCanvasElement, value: string): void {
     };
 }
 
+function getImageDimensions(dataUrl: string): Promise<{ width: number; height: number } | null> {
+    return new Promise((resolve) => {
+        const image = new Image();
+        image.onload = () => {
+            resolve({
+                width: image.naturalWidth,
+                height: image.naturalHeight,
+            });
+        };
+        image.onerror = () => resolve(null);
+        image.src = dataUrl;
+    });
+}
+
+async function syncCanvasHeightToSignatureValue(canvas: HTMLCanvasElement, value: string): Promise<void> {
+    const dimensions = await getImageDimensions(value);
+
+    if (!dimensions?.width || !dimensions?.height) {
+        return;
+    }
+
+    const { width: containerWidth } = getCanvasSize(canvas);
+
+    if (!(containerWidth > 0)) {
+        return;
+    }
+
+    // Match the stored PNG aspect ratio so restored signatures are not vertically stretched.
+    const aspectHeight = Math.max(1, Math.round(containerWidth * (dimensions.height / dimensions.width)));
+    canvas.style.height = `${aspectHeight}px`;
+}
+
 async function restoreSignatureValue(signaturePad: SignaturePad, canvas: HTMLCanvasElement, value: string): Promise<void> {
     if (!value) {
         return;
     }
 
+    await syncCanvasHeightToSignatureValue(canvas, value);
+
     try {
         await signaturePad.fromDataURL(value);
     } catch {
@@ -184,6 +218,12 @@ function initSignatureField(
     };
 
     const resizeCanvas = async(): Promise<boolean> => {
+        const existingValue = input.value || (signaturePad.isEmpty() ? '' : signaturePad.toDataURL());
+
+        if (existingValue) {
+            await syncCanvasHeightToSignatureValue(canvas, existingValue);
+        }
+
         const { width, height } = getCanvasSize(canvas);
 
         if (!(width > 0) || !(height > 0)) {
@@ -196,8 +236,6 @@ function initSignatureField(
             return false;
         }
 
-        const existingValue = input.value || (signaturePad.isEmpty() ? '' : signaturePad.toDataURL());
-
         canvas.width = width * ratio;
         canvas.height = height * ratio;
         context.setTransform(1, 0, 0, 1, 0, 0);