@atscript/vue-form 0.1.102 → 0.1.103

package/dist/{as-array-B_LjJ0oi.mjs → as-array-4rQYVD9_.mjs}

@@ -1,9 +1,9 @@
-import { a as CHANGE_HANDLER_KEY, n as useAsUnionVariant, r as useFormContext } from "./use-form-context-bAj7UoSe.mjs";
-import { t as as_field_default } from "./as-field-CDB-HIfz.mjs";
-import { t as as_collapsible_default } from "./as-collapsible-DQOxKGGj.mjs";
+import { a as CHANGE_HANDLER_KEY, n as useAsUnionVariant, r as useFormContext } from "./use-form-context-D6J1WTyG.mjs";
+import { t as as_field_default } from "./as-field-DLW-csEu.mjs";
+import { t as as_collapsible_default } from "./as-collapsible-DFTzB5Ar.mjs";
 import { t as as_variant_picker_default } from "./as-variant-picker-B3GLhKyt.mjs";
 import { t as useAsDropdown } from "./use-as-dropdown-B2Shb7wn.mjs";
-import { t as useAsOptionalAddFlow } from "./use-as-optional-add-flow-CQctXLZI.mjs";
+import { t as useAsOptionalAddFlow } from "./use-as-optional-add-flow-B_gr8sX-.mjs";
 import { t as as_array_clear_btn_default } from "./as-array-clear-btn-BY1IBwBP.mjs";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, normalizeClass, openBlock, reactive, ref, renderList, toDisplayString, unref, useTemplateRef, vShow, watch, withCtx, withDirectives } from "vue";
 import { createFormData, createFormValueResolver, getFieldMeta, isUnionField } from "@atscript/ui";

package/dist/{as-array-DAeDxzYV.cjs → as-array-C6tCzZir.cjs}

@@ -1,9 +1,9 @@
-const require_use_form_context = require("./use-form-context-Dwr8Ai1v.cjs");
-const require_as_field = require("./as-field-DGnC4dew.cjs");
-const require_as_collapsible = require("./as-collapsible-B0rlXU0x.cjs");
+const require_use_form_context = require("./use-form-context-DpGiGUvJ.cjs");
+const require_as_field = require("./as-field-BKa4D63r.cjs");
+const require_as_collapsible = require("./as-collapsible-BQ-eYR0v.cjs");
 const require_as_variant_picker = require("./as-variant-picker-JlEhh7YO.cjs");
 const require_use_as_dropdown = require("./use-as-dropdown-Bj9toVdw.cjs");
-const require_use_as_optional_add_flow = require("./use-as-optional-add-flow-C85F2VoU.cjs");
+const require_use_as_optional_add_flow = require("./use-as-optional-add-flow-BXKiK1Kb.cjs");
 const require_as_array_clear_btn = require("./as-array-clear-btn-COfRUzeb.cjs");
 let vue = require("vue");
 let _atscript_ui = require("@atscript/ui");

package/dist/as-array.cjs

@@ -1,2 +1,2 @@
-const require_as_array = require("./as-array-DAeDxzYV.cjs");
+const require_as_array = require("./as-array-C6tCzZir.cjs");
 module.exports = require_as_array.as_array_default;

package/dist/as-array.mjs

@@ -1,2 +1,2 @@
-import { t as as_array_default } from "./as-array-B_LjJ0oi.mjs";
+import { t as as_array_default } from "./as-array-4rQYVD9_.mjs";
 export { as_array_default as default };

package/dist/{as-checkbox-dN1K-rJ_.mjs → as-checkbox-C3i6ZmRk.mjs}

@@ -1,4 +1,4 @@
-import { t as as_field_shell_default } from "./as-field-shell-D0mNXfQZ.mjs";
+import { t as as_field_shell_default } from "./as-field-shell-BHYEjGcn.mjs";
 import { n as as_optional_clear_default } from "./as-variant-picker-B3GLhKyt.mjs";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeProps, normalizeClass, openBlock, ref, toDisplayString, unref, watchEffect, withCtx } from "vue";
 //#region src/composables/use-as-tri-state-checkbox.ts

package/dist/{as-checkbox-Cva4XHFW.cjs → as-checkbox-oxG8_Isu.cjs}

@@ -1,4 +1,4 @@
-const require_as_field_shell = require("./as-field-shell-zeno02I1.cjs");
+const require_as_field_shell = require("./as-field-shell-CW3DDHnq.cjs");
 const require_as_variant_picker = require("./as-variant-picker-JlEhh7YO.cjs");
 let vue = require("vue");
 //#region src/composables/use-as-tri-state-checkbox.ts

package/dist/as-checkbox.cjs

@@ -1,2 +1,2 @@
-const require_as_checkbox = require("./as-checkbox-Cva4XHFW.cjs");
+const require_as_checkbox = require("./as-checkbox-oxG8_Isu.cjs");
 module.exports = require_as_checkbox.as_checkbox_default;

package/dist/as-checkbox.mjs

@@ -1,2 +1,2 @@
-import { t as as_checkbox_default } from "./as-checkbox-dN1K-rJ_.mjs";
+import { t as as_checkbox_default } from "./as-checkbox-C3i6ZmRk.mjs";
 export { as_checkbox_default as default };

package/dist/{as-collapsible-B0rlXU0x.cjs → as-collapsible-BQ-eYR0v.cjs}

@@ -1,5 +1,5 @@
-const require_use_form_context = require("./use-form-context-Dwr8Ai1v.cjs");
-const require_use_as_nested_sections_store = require("./use-as-nested-sections-store-jdMRxjBE.cjs");
+const require_use_form_context = require("./use-form-context-DpGiGUvJ.cjs");
+const require_use_as_nested_sections_store = require("./use-as-nested-sections-store--E0Ijpt5.cjs");
 const require_focus_after_toggle = require("./focus-after-toggle-CWxiPZWi.cjs");
 let vue = require("vue");
 //#region src/components/as-collapsible.vue?vue&type=script&setup=true&lang.ts

package/dist/{as-collapsible-DQOxKGGj.mjs → as-collapsible-DFTzB5Ar.mjs}

@@ -1,5 +1,5 @@
-import { t as formatIndexedLabelParts } from "./use-form-context-bAj7UoSe.mjs";
-import { r as useAsNestedSectionsStore, t as DESCENDANT_ERROR_COUNTS_KEY } from "./use-as-nested-sections-store-lhi0z5z1.mjs";
+import { t as formatIndexedLabelParts } from "./use-form-context-D6J1WTyG.mjs";
+import { r as useAsNestedSectionsStore, t as DESCENDANT_ERROR_COUNTS_KEY } from "./use-as-nested-sections-store-DVRmG7V0.mjs";
 import { r as useAsFocusFirstAfter } from "./focus-after-toggle-Dtl3P6CS.mjs";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, inject, normalizeClass, onBeforeUnmount, onMounted, openBlock, renderSlot, resolveDynamicComponent, toDisplayString, vShow, withCtx, withDirectives } from "vue";
 //#region src/components/as-collapsible.vue?vue&type=script&setup=true&lang.ts

package/dist/as-collapsible.cjs

@@ -1,2 +1,2 @@
-const require_as_collapsible = require("./as-collapsible-B0rlXU0x.cjs");
+const require_as_collapsible = require("./as-collapsible-BQ-eYR0v.cjs");
 module.exports = require_as_collapsible.as_collapsible_default;

package/dist/as-collapsible.mjs

@@ -1,2 +1,2 @@
-import { t as as_collapsible_default } from "./as-collapsible-DQOxKGGj.mjs";
+import { t as as_collapsible_default } from "./as-collapsible-DFTzB5Ar.mjs";
 export { as_collapsible_default as default };

package/dist/{as-date-CsBBqja_.mjs → as-date-BfISLr-e.mjs}

@@ -1,4 +1,4 @@
-import { t as as_field_shell_default } from "./as-field-shell-D0mNXfQZ.mjs";
+import { t as as_field_shell_default } from "./as-field-shell-BHYEjGcn.mjs";
 import { t as as_adornment_shell_default } from "./as-adornment-shell-C4A2fnDp.mjs";
 import { n as as_date_control_default, t as useAsDate } from "./use-as-date-XLE8HBbo.mjs";
 import { computed, createBlock, createVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, unref, withCtx } from "vue";

package/dist/{as-date-Cizo8gZx.cjs → as-date-C7pJIpe-.cjs}

@@ -1,4 +1,4 @@
-const require_as_field_shell = require("./as-field-shell-zeno02I1.cjs");
+const require_as_field_shell = require("./as-field-shell-CW3DDHnq.cjs");
 const require_as_adornment_shell = require("./as-adornment-shell-DptUMWNk.cjs");
 const require_use_as_date = require("./use-as-date-DY8b1_V4.cjs");
 let vue = require("vue");

package/dist/as-date.cjs

@@ -1,2 +1,2 @@
-const require_as_date = require("./as-date-Cizo8gZx.cjs");
+const require_as_date = require("./as-date-C7pJIpe-.cjs");
 module.exports = require_as_date.as_date_default;

package/dist/as-date.mjs

@@ -1,2 +1,2 @@
-import { t as as_date_default } from "./as-date-CsBBqja_.mjs";
+import { t as as_date_default } from "./as-date-BfISLr-e.mjs";
 export { as_date_default as default };

package/dist/{as-datetime-Cjbprmxg.cjs → as-datetime-DFTI8Wcr.cjs}

@@ -1,4 +1,4 @@
-const require_as_field_shell = require("./as-field-shell-zeno02I1.cjs");
+const require_as_field_shell = require("./as-field-shell-CW3DDHnq.cjs");
 const require_as_adornment_shell = require("./as-adornment-shell-DptUMWNk.cjs");
 const require_use_as_date = require("./use-as-date-DY8b1_V4.cjs");
 let vue = require("vue");

package/dist/{as-datetime-D_Wbrj9t.mjs → as-datetime-F3In2A6l.mjs}

@@ -1,4 +1,4 @@
-import { t as as_field_shell_default } from "./as-field-shell-D0mNXfQZ.mjs";
+import { t as as_field_shell_default } from "./as-field-shell-BHYEjGcn.mjs";
 import { t as as_adornment_shell_default } from "./as-adornment-shell-C4A2fnDp.mjs";
 import { n as as_date_control_default, t as useAsDate } from "./use-as-date-XLE8HBbo.mjs";
 import { computed, createBlock, createVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, unref, withCtx } from "vue";

package/dist/as-datetime.cjs

@@ -1,2 +1,2 @@
-const require_as_datetime = require("./as-datetime-Cjbprmxg.cjs");
+const require_as_datetime = require("./as-datetime-DFTI8Wcr.cjs");
 module.exports = require_as_datetime.as_datetime_default;

package/dist/as-datetime.mjs

@@ -1,2 +1,2 @@
-import { t as as_datetime_default } from "./as-datetime-D_Wbrj9t.mjs";
+import { t as as_datetime_default } from "./as-datetime-F3In2A6l.mjs";
 export { as_datetime_default as default };

package/dist/{as-decimal-DhrdOvUQ.cjs → as-decimal-CJAHWYjW.cjs}

@@ -1,5 +1,5 @@
 const require_use_as_locale = require("./use-as-locale-C4z5stwD.cjs");
-const require_as_field_shell = require("./as-field-shell-zeno02I1.cjs");
+const require_as_field_shell = require("./as-field-shell-CW3DDHnq.cjs");
 let vue = require("vue");
 let _atscript_ui = require("@atscript/ui");
 //#region src/composables/_shape.ts

package/dist/{as-decimal-DtQuZmPA.mjs → as-decimal-DIO8bD2Y.mjs}

@@ -1,5 +1,5 @@
 import { n as useAsLocale } from "./use-as-locale-BrFdAgnU.mjs";
-import { t as as_field_shell_default } from "./as-field-shell-D0mNXfQZ.mjs";
+import { t as as_field_shell_default } from "./as-field-shell-BHYEjGcn.mjs";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, guardReactiveProps, nextTick, normalizeClass, normalizeProps, openBlock, ref, toDisplayString, unref, watch, withCtx } from "vue";
 import { enforceScale, formatDecimalForDisplay, getDecimalSeparator, getThousandsSeparator, groupInteger, joinDecimalString, parseDecimalInput, splitDecimalString } from "@atscript/ui";
 //#region src/composables/_shape.ts

package/dist/as-decimal.cjs

@@ -1,2 +1,2 @@
-const require_as_decimal = require("./as-decimal-DhrdOvUQ.cjs");
+const require_as_decimal = require("./as-decimal-CJAHWYjW.cjs");
 module.exports = require_as_decimal.as_decimal_default;

package/dist/as-decimal.mjs

@@ -1,2 +1,2 @@
-import { t as as_decimal_default } from "./as-decimal-DtQuZmPA.mjs";
+import { t as as_decimal_default } from "./as-decimal-DIO8bD2Y.mjs";
 export { as_decimal_default as default };

package/dist/{as-field-DGnC4dew.cjs → as-field-BKa4D63r.cjs}

@@ -1,4 +1,4 @@
-const require_use_form_context = require("./use-form-context-Dwr8Ai1v.cjs");
+const require_use_form_context = require("./use-form-context-DpGiGUvJ.cjs");
 const require_use_as_locale = require("./use-as-locale-C4z5stwD.cjs");
 let vue = require("vue");
 let _atscript_ui = require("@atscript/ui");

package/dist/{as-field-CDB-HIfz.mjs → as-field-DLW-csEu.mjs}

@@ -1,4 +1,4 @@
-import { a as CHANGE_HANDLER_KEY, c as ERRORS_KEY, d as FORM_STATE_KEY, f as HIDE_ROOT_TITLE_KEY, g as TYPES_KEY, h as ROOT_DATA_KEY, i as ACTION_HANDLER_KEY, l as FORM_CONTEXT_KEY, m as PATH_PREFIX_KEY, o as COMPONENTS_KEY, p as LEVEL_KEY, r as useFormContext, s as DISMISS_EXTERNAL_AT_KEY, u as FORM_DATA_KEY } from "./use-form-context-bAj7UoSe.mjs";
+import { _ as TYPES_KEY, a as CHANGE_HANDLER_KEY, c as ERRORS_KEY, f as FORM_STATE_KEY, g as ROOT_DATA_KEY, h as PATH_PREFIX_KEY, i as ACTION_HANDLER_KEY, l as FORM_CONTEXT_KEY, m as LEVEL_KEY, o as COMPONENTS_KEY, p as HIDE_ROOT_TITLE_KEY, r as useFormContext, s as DISMISS_EXTERNAL_AT_KEY, u as FORM_DATA_KEY } from "./use-form-context-D6J1WTyG.mjs";
 import { n as useAsLocale } from "./use-as-locale-BrFdAgnU.mjs";
 import { computed, createBlock, createElementBlock, defineComponent, inject, isRef, mergeProps, onUnmounted, openBlock, provide, ref, resolveDynamicComponent, toDisplayString, unref, useId, watch } from "vue";
 import { DB_AMOUNT_CURRENCY, DB_AMOUNT_CURRENCY_REF, DB_COLUMN_PRECISION, DB_UNIT, DB_UNIT_REF, EXPECT_MAX_LENGTH, META_DEFAULT, META_DESCRIPTION, META_LABEL, META_READONLY, META_REQUIRED, UI_FORM_ACTION, UI_FORM_ATTR, UI_FORM_AUTOCOMPLETE, UI_FORM_CLASSES, UI_FORM_COMPONENT, UI_FORM_DISABLED, UI_FORM_FN_CLASSES, UI_FORM_FN_DESCRIPTION, UI_FORM_FN_DISABLED, UI_FORM_FN_HIDDEN, UI_FORM_FN_HINT, UI_FORM_FN_LABEL, UI_FORM_FN_PLACEHOLDER, UI_FORM_FN_PREFIX, UI_FORM_FN_READONLY, UI_FORM_FN_STYLES, UI_FORM_FN_TITLE, UI_FORM_FN_VALUE, UI_FORM_GRID_COL_SPAN, UI_FORM_GRID_ROW_SPAN, UI_FORM_HIDDEN, UI_FORM_HINT, UI_FORM_PLACEHOLDER, UI_FORM_PREFIX, UI_FORM_PREFIX_ICON, UI_FORM_PREFIX_REF, UI_FORM_STYLES, UI_FORM_SUFFIX, UI_FORM_SUFFIX_ICON, UI_FORM_SUFFIX_REF, UI_FORM_VALIDATE, WF_ACTION_WITH_DATA, buildGridClasses, createFieldValidator, createFormData, createFormValueResolver, extractValueHelp, getByPath, getCurrencyDecimals, getCurrencyDisplayParts, getFieldMeta, isArrayField, isObjectField, isTupleField, isUnionField, resolveAttrs, resolveFieldProp, resolveFormProp, resolveGridSpec, resolveOptions, resolveSingularLabel } from "@atscript/ui";

package/dist/{as-field-shell-D0mNXfQZ.mjs → as-field-shell-BHYEjGcn.mjs}

@@ -1,4 +1,4 @@
-import { n as useAsUnionVariant, t as formatIndexedLabelParts } from "./use-form-context-bAj7UoSe.mjs";
+import { n as useAsUnionVariant, t as formatIndexedLabelParts } from "./use-form-context-D6J1WTyG.mjs";
 import { r as useAsFocusFirstAfter } from "./focus-after-toggle-Dtl3P6CS.mjs";
 import { n as as_optional_clear_default, t as as_variant_picker_default } from "./as-variant-picker-B3GLhKyt.mjs";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, ref, renderSlot, toDisplayString, unref, vShow, withDirectives, withKeys, withModifiers } from "vue";

package/dist/{as-field-shell-zeno02I1.cjs → as-field-shell-CW3DDHnq.cjs}

@@ -1,4 +1,4 @@
-const require_use_form_context = require("./use-form-context-Dwr8Ai1v.cjs");
+const require_use_form_context = require("./use-form-context-DpGiGUvJ.cjs");
 const require_focus_after_toggle = require("./focus-after-toggle-CWxiPZWi.cjs");
 const require_as_variant_picker = require("./as-variant-picker-JlEhh7YO.cjs");
 let vue = require("vue");

package/dist/as-field-shell.cjs

@@ -1,2 +1,2 @@
-const require_as_field_shell = require("./as-field-shell-zeno02I1.cjs");
+const require_as_field_shell = require("./as-field-shell-CW3DDHnq.cjs");
 module.exports = require_as_field_shell.as_field_shell_default;

package/dist/as-field-shell.mjs

@@ -1,2 +1,2 @@
-import { t as as_field_shell_default } from "./as-field-shell-D0mNXfQZ.mjs";
+import { t as as_field_shell_default } from "./as-field-shell-BHYEjGcn.mjs";
 export { as_field_shell_default as default };

package/dist/as-field.cjs

@@ -1,2 +1,2 @@
-const require_as_field = require("./as-field-DGnC4dew.cjs");
+const require_as_field = require("./as-field-BKa4D63r.cjs");
 module.exports = require_as_field.as_field_default;

package/dist/as-field.mjs

@@ -1,2 +1,2 @@
-import { t as as_field_default } from "./as-field-CDB-HIfz.mjs";
+import { t as as_field_default } from "./as-field-DLW-csEu.mjs";
 export { as_field_default as default };

package/dist/{as-form-DaAnsFVF.cjs → as-form-CrMA0HdQ.cjs}

@@ -1,10 +1,158 @@
-const require_use_form_context = require("./use-form-context-Dwr8Ai1v.cjs");
-const require_use_as_nested_sections_store = require("./use-as-nested-sections-store-jdMRxjBE.cjs");
-const require_use_as_value_help = require("./use-as-value-help-uANI3zWa.cjs");
-const require_as_field = require("./as-field-DGnC4dew.cjs");
-const require_as_iterator = require("./as-iterator-BWXIzbJF.cjs");
+const require_use_form_context = require("./use-form-context-DpGiGUvJ.cjs");
+const require_use_as_nested_sections_store = require("./use-as-nested-sections-store--E0Ijpt5.cjs");
+const require_use_as_value_help = require("./use-as-value-help-BsAriqCI.cjs");
+const require_as_field = require("./as-field-BKa4D63r.cjs");
+const require_as_iterator = require("./as-iterator-DsDKfpTh.cjs");
 let vue = require("vue");
 let _atscript_ui = require("@atscript/ui");
+//#region src/composables/use-as-form-patch.ts
+/**
+* Internal factory invoked by `useAsForm` when `trackChanges` is enabled. Owns
+* the deep-clone baseline lifecycle:
+*
+* - captures a DEEP CLONE of the wrapped form-data the moment tracking becomes
+*   active (and, if data is not yet available, when it first arrives),
+* - re-baselines on `reset()` (the form's own reset path calls `rebase()`),
+* - exposes `rebase()` so a consumer can re-baseline after a successful save.
+*
+* The clone is mandatory: `buildFormDiff` keeps LIVE references into the
+* supplied baseline, so a shared reference would be mutated by subsequent
+* edits and the diff would always come back empty.
+*
+* Reactivity: a single revert-aware `diff` computed drives `isDirty` /
+* `changes`. `buildFormDiff` reads most reactive leaves of the live container
+* (via `getByPath` + the `deepEqual` walk), so the computed auto-tracks scalar
+* edits, nested-object edits, and `$update` edits to EXISTING keyed-array items.
+* But the `$insert` branch pushes a freshly-added (not-yet-saved) keyed-array
+* element BY REFERENCE without reading its leaves, so editing such a row's
+* non-key leaves (qty/description) would NOT invalidate the computed. To close
+* that blind spot we add a single deep `watch` on the live data — created ONLY
+* when tracking is active, owned by the component scope (it disposes on unmount)
+* — that bumps `dataRev`; the `diff` computed reads `dataRev` so every leaf
+* mutation, including an inserted row's, re-evaluates it. OFF stays zero-cost:
+* `createAsFormPatch` is never called when tracking is disabled, so neither the
+* baseline nor this watcher is ever created. It recomputes only when the live
+* data (`dataRev`) or the baseline (`baselineRev`) changes, and Vue caches the
+* result between reads.
+*
+* @param def      getter for the form's `FormDef`
+* @param getData  getter for the WRAPPED form-data container `{ value }`. Before
+*                 real domain data arrives `useAsForm` yields the empty internal
+*                 fallback `{}` (no `value` key); the tracker treats that as
+*                 "no data yet" and defers the baseline until a `{ value: … }`
+*                 container appears (the fetch-then-fill flow).
+*/
+function createAsFormPatch(def, getData) {
+	let baseline;
+	const baselineRev = (0, vue.ref)(0);
+	const dataRev = (0, vue.ref)(0);
+	/**
+	* Deep-clones the current wrapped container, or returns `undefined` when no
+	* real domain data exists yet. "No data yet" = the container has no `value`
+	* key or its `value` is `undefined` (the `{}` internal fallback, or a
+	* `:form-data` ref that has not resolved). Capturing the empty fallback as the
+	* baseline would make every field read as dirty once real data replaces it,
+	* so we wait for a genuine `{ value: … }` container.
+	*/
+	function snapshot() {
+		const cur = getData();
+		if (cur.value === void 0) return void 0;
+		return deepClone((0, vue.toRaw)(cur));
+	}
+	function capture() {
+		baseline = snapshot();
+		baselineRev.value++;
+	}
+	capture();
+	if (baseline === void 0) {
+		const stop = (0, vue.watch)(() => getData().value, () => {
+			if (baseline !== void 0) return;
+			capture();
+			if (baseline !== void 0) stop();
+		});
+	}
+	(0, vue.watch)(() => getData(), () => dataRev.value++, { deep: true });
+	const diff = (0, vue.computed)(() => {
+		dataRev.value;
+		baselineRev.value;
+		if (baseline === void 0) return {
+			isDirty: false,
+			changes: []
+		};
+		const result = (0, _atscript_ui.buildFormDiff)(def(), baseline, getData());
+		return {
+			isDirty: result.isDirty,
+			changes: result.changes
+		};
+	});
+	const isDirty = (0, vue.computed)(() => diff.value.isDirty);
+	const changes = (0, vue.computed)(() => diff.value.changes);
+	function getPatch(opts) {
+		if (baseline === void 0) return {};
+		const frozen = deepClone((0, vue.toRaw)(getData()));
+		return (0, _atscript_ui.buildFormDiff)(def(), baseline, frozen, opts).patch;
+	}
+	function getChanges() {
+		if (baseline === void 0) return [];
+		const frozen = deepClone((0, vue.toRaw)(getData()));
+		return (0, _atscript_ui.buildFormDiff)(def(), baseline, frozen).changes;
+	}
+	function rebase() {
+		capture();
+	}
+	return {
+		isDirty,
+		changes,
+		getPatch,
+		getChanges,
+		rebase
+	};
+}
+/**
+* Structural deep clone of plain JSON-ish data (objects / arrays / primitives /
+* Date). Used to freeze the baseline so later edits to the live form data don't
+* mutate it. `structuredClone` would throw on Vue proxies / functions; this
+* walks own-enumerable keys and copies leaves by value.
+*/
+function deepClone(value) {
+	if (value === null || typeof value !== "object") return value;
+	if (value instanceof Date) return new Date(value.getTime());
+	if (Array.isArray(value)) {
+		const out = [];
+		for (let i = 0; i < value.length; i++) out.push(deepClone((0, vue.toRaw)(value[i])));
+		return out;
+	}
+	const src = value;
+	const out = {};
+	for (const k of Object.keys(src)) out[k] = deepClone((0, vue.toRaw)(src[k]));
+	return out;
+}
+const NOT_TRACKING_MSG = "useAsFormPatch(): change tracking is not enabled on this form. Pass `track-changes` to <AsForm> (or `trackChanges: true` to useAsForm).";
+/**
+* Reactive read-only access to the form's change-tracking handle from any
+* descendant of an `<AsForm track-changes>`. Mirrors the `useAsData` /
+* `useAsPath` injector pattern.
+*
+* THROWS when called outside a form, or inside a form that did not enable
+* `track-changes` — fail loud rather than silently report "not dirty".
+*
+* @example
+* ```vue
+* <script setup lang="ts">
+* import { useAsFormPatch } from "@atscript/vue-form";
+* const { isDirty, getPatch } = useAsFormPatch();
+* <\/script>
+* <template>
+*   <button :disabled="!isDirty" @click="save(getPatch())">Save</button>
+* </template>
+* ```
+*/
+function useAsFormPatch() {
+	const handle = (0, vue.inject)(require_use_form_context.FORM_PATCH_KEY, void 0);
+	if (!handle) throw new Error(NOT_TRACKING_MSG);
+	return handle;
+}
+//#endregion
 //#region src/composables/use-as-external-errors.ts
 /**
 * Local dismissal state for externally-supplied errors.
@@ -144,6 +292,9 @@ function useAsState(opts) {
 }
 //#endregion
 //#region src/composables/use-as-form.ts
+const EMPTY_CHANGES = Object.freeze([]);
+const EMPTY_GET_PATCH = () => ({});
+const EMPTY_GET_CHANGES = () => [];
 /**
 * Composable backing `<AsForm>`. Owns the entire form state machine —
 * data container, internal validator, external-error dismissal, action
@@ -179,6 +330,12 @@ function useAsForm(options) {
 			context: formContext.value ?? {}
 		})
 	});
+	const patch = options.trackChanges?.() ? createAsFormPatch(() => options.def(), () => data.value) : void 0;
+	if (patch) (0, vue.provide)(require_use_form_context.FORM_PATCH_KEY, patch);
+	const reset = patch ? async () => {
+		await resetState();
+		patch.rebase();
+	} : resetState;
 	(0, vue.provide)(require_use_form_context.ROOT_DATA_KEY, data);
 	(0, vue.provide)(require_use_form_context.PATH_PREFIX_KEY, (0, vue.computed)(() => ""));
 	(0, vue.provide)(require_use_form_context.TYPES_KEY, (0, vue.computed)(() => options.types()));
@@ -220,12 +377,16 @@ function useAsForm(options) {
 		loading: options.loading?.() === true,
 		submitText: submitText.value,
 		submit: onSubmit,
-		reset: resetState,
+		reset,
 		clearErrors,
 		setErrors,
 		dismissError: ext.dismissAt,
 		dismissFormError: ext.dismissForm,
-		formContext: formContext.value
+		formContext: formContext.value,
+		isDirty: patch?.isDirty.value ?? false,
+		changes: patch ? patch.changes.value : EMPTY_CHANGES,
+		getPatch: patch ? patch.getPatch : EMPTY_GET_PATCH,
+		getChanges: patch ? patch.getChanges : EMPTY_GET_CHANGES
 	}));
 	function supportsAction(def, actionId) {
 		return (0, _atscript_ui.getDeclaredFormActions)(def).some((a) => a.id === actionId);
@@ -271,7 +432,7 @@ function useAsForm(options) {
 		errors: ext.effective,
 		formError: ext.formError,
 		internalErrors,
-		reset: resetState,
+		reset,
 		clearErrors,
 		setErrors,
 		onSubmit,
@@ -284,7 +445,8 @@ function useAsForm(options) {
 		dismissError: ext.dismissAt,
 		dismissFormError: ext.dismissForm,
 		formContext,
-		handleChange
+		handleChange,
+		patch
 	};
 }
 //#endregion
@@ -352,6 +514,10 @@ var as_form_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		loading: {
 			type: Boolean,
 			required: false
+		},
+		trackChanges: {
+			type: Boolean,
+			required: false
 		}
 	},
 	emits: [
@@ -361,7 +527,7 @@ var as_form_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		"unsupported-action",
 		"change"
 	],
-	setup(__props, { emit: __emit }) {
+	setup(__props, { expose: __expose, emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
 		const form = useAsForm({
@@ -375,6 +541,7 @@ var as_form_default = /* @__PURE__ */ (0, vue.defineComponent)({
 			clientFactory: () => props.clientFactory,
 			hideRootTitle: () => props.hideRootTitle,
 			loading: () => props.loading,
+			trackChanges: () => props.trackChanges,
 			emits: {
 				submit: (data) => emit("submit", data),
 				error: (errors) => emit("error", errors),
@@ -383,6 +550,19 @@ var as_form_default = /* @__PURE__ */ (0, vue.defineComponent)({
 				change: (type, path, value, formData) => emit("change", type, path, value, formData)
 			}
 		});
+		__expose({
+			submit: form.onSubmit,
+			reset: form.reset,
+			get isDirty() {
+				return form.patch?.isDirty.value ?? false;
+			},
+			get changes() {
+				return form.patch?.changes.value ?? [];
+			},
+			getPatch: form.patch ? form.patch.getPatch : () => ({}),
+			getChanges: form.patch ? form.patch.getChanges : () => [],
+			rebase: form.patch ? form.patch.rebase : () => {}
+		});
 		return (_ctx, _cache) => {
 			return (0, vue.openBlock)(), (0, vue.createElementBlock)("form", {
 				class: "as-form",
@@ -438,6 +618,12 @@ Object.defineProperty(exports, "useAsForm", {
 		return useAsForm;
 	}
 });
+Object.defineProperty(exports, "useAsFormPatch", {
+	enumerable: true,
+	get: function() {
+		return useAsFormPatch;
+	}
+});
 Object.defineProperty(exports, "useAsState", {
 	enumerable: true,
 	get: function() {