@atscript/vue-form 0.1.102 → 0.1.104

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

@@ -1,10 +1,182 @@
-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-vktmRs-V.cjs");
+const require_as_iterator = require("./as-iterator-Bd-bKTMY.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). The SAME
+*                  container reference is also the write target for
+*                  `rebaseOnto` — mutating its `.value` preserves the bound
+*                  `:form-data` identity so the deep watch fires once.
+* @param onRebased optional callback fired AFTER `rebaseOnto` rewrites the live
+*                  data, so the host can force-remount the field subtree (e.g.
+*                  bump a key) when a union variant changed — the variant picker
+*                  detects its index once at setup and won't re-detect on a
+*                  data swap. No-op for `rebase()` (which doesn't move data).
+*/
+function createAsFormPatch(def, getData, onRebased) {
+	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 (0, _atscript_ui.deepClone)(cur, vue.toRaw);
+	}
+	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);
+	const dirtyPaths = (0, vue.computed)(() => (0, _atscript_ui.collectDirtyPaths)(changes.value));
+	function getPatch(opts) {
+		if (baseline === void 0) return {};
+		const frozen = (0, _atscript_ui.deepClone)(getData(), vue.toRaw);
+		return (0, _atscript_ui.buildFormDiff)(def(), baseline, frozen, opts).patch;
+	}
+	function getChanges() {
+		if (baseline === void 0) return [];
+		const frozen = (0, _atscript_ui.deepClone)(getData(), vue.toRaw);
+		return (0, _atscript_ui.buildFormDiff)(def(), baseline, frozen).changes;
+	}
+	function isDirtyPath(path) {
+		return dirtyPaths.value.has(path);
+	}
+	function rebase() {
+		capture();
+	}
+	/**
+	* 3-way rebase onto a fresh upstream snapshot (see
+	* {@link AsFormPatchHandle.rebaseOnto}). One reactive write, then an explicit
+	* re-baseline to the upstream snapshot.
+	*/
+	function rebaseOnto(upstream, opts) {
+		const u = (0, _atscript_ui.deepClone)(upstream, vue.toRaw);
+		if (baseline === void 0) {
+			const before = (0, _atscript_ui.deepClone)(getData(), vue.toRaw);
+			(0, _atscript_ui.setByPath)(getData(), "", u.value);
+			if ((0, _atscript_ui.unionVariantChanged)(def(), before, u)) onRebased?.();
+			capture();
+			return {
+				conflicts: [],
+				reapplied: []
+			};
+		}
+		const current = (0, _atscript_ui.deepClone)(getData(), vue.toRaw);
+		const { next, conflicts, reapplied } = (0, _atscript_ui.buildFormRebase)(def(), baseline, current, u, opts);
+		const variantMoved = (0, _atscript_ui.unionVariantChanged)(def(), current, next);
+		(0, _atscript_ui.setByPath)(getData(), "", next.value);
+		baseline = u;
+		baselineRev.value++;
+		if (variantMoved) onRebased?.();
+		return {
+			conflicts,
+			reapplied
+		};
+	}
+	return {
+		isDirty,
+		changes,
+		getPatch,
+		getChanges,
+		isDirtyPath,
+		rebase,
+		rebaseOnto
+	};
+}
+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 +316,10 @@ function useAsState(opts) {
 }
 //#endregion
 //#region src/composables/use-as-form.ts
+const EMPTY_CHANGES = Object.freeze([]);
+const EMPTY_GET_PATCH = () => ({});
+const EMPTY_GET_CHANGES = () => [];
+const EMPTY_IS_DIRTY_PATH = () => false;
 /**
 * Composable backing `<AsForm>`. Owns the entire form state machine —
 * data container, internal validator, external-error dismissal, action
@@ -179,6 +355,15 @@ function useAsForm(options) {
 			context: formContext.value ?? {}
 		})
 	});
+	const remountKey = (0, vue.ref)(0);
+	const patch = options.trackChanges?.() ? createAsFormPatch(() => options.def(), () => data.value, () => {
+		remountKey.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 +405,17 @@ 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,
+		isDirtyPath: patch ? patch.isDirtyPath : EMPTY_IS_DIRTY_PATH
 	}));
 	function supportsAction(def, actionId) {
 		return (0, _atscript_ui.getDeclaredFormActions)(def).some((a) => a.id === actionId);
@@ -271,7 +461,7 @@ function useAsForm(options) {
 		errors: ext.effective,
 		formError: ext.formError,
 		internalErrors,
-		reset: resetState,
+		reset,
 		clearErrors,
 		setErrors,
 		onSubmit,
@@ -284,7 +474,9 @@ function useAsForm(options) {
 		dismissError: ext.dismissAt,
 		dismissFormError: ext.dismissForm,
 		formContext,
-		handleChange
+		handleChange,
+		patch,
+		remountKey
 	};
 }
 //#endregion
@@ -352,6 +544,10 @@ var as_form_default = /* @__PURE__ */ (0, vue.defineComponent)({
 		loading: {
 			type: Boolean,
 			required: false
+		},
+		trackChanges: {
+			type: Boolean,
+			required: false
 		}
 	},
 	emits: [
@@ -361,7 +557,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 +571,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 +580,24 @@ 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 : () => [],
+			isDirtyPath: form.patch ? form.patch.isDirtyPath : () => false,
+			rebase: form.patch ? form.patch.rebase : () => {},
+			rebaseOnto: form.patch ? form.patch.rebaseOnto : () => ({
+				conflicts: [],
+				reapplied: []
+			})
+		});
 		return (_ctx, _cache) => {
 			return (0, vue.openBlock)(), (0, vue.createElementBlock)("form", {
 				class: "as-form",
@@ -391,7 +606,10 @@ var as_form_default = /* @__PURE__ */ (0, vue.defineComponent)({
 			}, [
 				(0, vue.renderSlot)(_ctx.$slots, "form.header", (0, vue.normalizeProps)((0, vue.guardReactiveProps)((0, vue.unref)(form).slotProps.value))),
 				(0, vue.renderSlot)(_ctx.$slots, "form.before", (0, vue.normalizeProps)((0, vue.guardReactiveProps)((0, vue.unref)(form).slotProps.value))),
-				(0, vue.createVNode)(require_as_field.as_field_default, { field: __props.def.rootField }, null, 8, ["field"]),
+				((0, vue.openBlock)(), (0, vue.createBlock)(require_as_field.as_field_default, {
+					key: (0, vue.unref)(form).remountKey.value,
+					field: __props.def.rootField
+				}, null, 8, ["field"])),
 				(0, vue.renderSlot)(_ctx.$slots, "form.after", (0, vue.normalizeProps)((0, vue.guardReactiveProps)((0, vue.unref)(form).slotProps.value))),
 				(0, vue.unref)(form).formError.value ? (0, vue.renderSlot)(_ctx.$slots, "form.error", (0, vue.mergeProps)({ key: 0 }, (0, vue.unref)(form).slotProps.value, {
 					message: (0, vue.unref)(form).formError.value,
@@ -438,6 +656,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() {

package/dist/{as-form-8YNdb-49.mjs → as-form-me0zA-52.mjs}

@@ -1,10 +1,182 @@
-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, s as DISMISS_EXTERNAL_AT_KEY, u as FORM_DATA_KEY } from "./use-form-context-bAj7UoSe.mjs";
-import { n as provideAsNestedSectionsStore, r as useAsNestedSectionsStore, t as DESCENDANT_ERROR_COUNTS_KEY } from "./use-as-nested-sections-store-lhi0z5z1.mjs";
-import { t as CLIENT_FACTORY_KEY } from "./use-as-value-help-CBykDEjZ.mjs";
-import { t as as_field_default } from "./as-field-CDB-HIfz.mjs";
-import { t as as_iterator_default } from "./as-iterator---gxkT-L.mjs";
-import { computed, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, guardReactiveProps, mergeProps, nextTick, normalizeProps, openBlock, provide, reactive, ref, renderSlot, toDisplayString, toRaw, toValue, unref, watch, watchEffect, withModifiers } from "vue";
-import { META_DESCRIPTION, META_LABEL, UI_FORM_FN_DESCRIPTION, UI_FORM_FN_SUBMIT_DISABLED, UI_FORM_FN_SUBMIT_TEXT, UI_FORM_FN_TITLE, UI_FORM_SUBMIT_TEXT, buildDescendantErrorCounts, getDeclaredFormActions, getFormValidator, iteratePathAncestors, mergeErrorMaps, resolveFormProp } from "@atscript/ui";
+import { _ as TYPES_KEY, a as CHANGE_HANDLER_KEY, c as ERRORS_KEY, d as FORM_PATCH_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, o as COMPONENTS_KEY, p as HIDE_ROOT_TITLE_KEY, s as DISMISS_EXTERNAL_AT_KEY, u as FORM_DATA_KEY } from "./use-form-context-D6J1WTyG.mjs";
+import { n as provideAsNestedSectionsStore, r as useAsNestedSectionsStore, t as DESCENDANT_ERROR_COUNTS_KEY } from "./use-as-nested-sections-store-DVRmG7V0.mjs";
+import { t as CLIENT_FACTORY_KEY } from "./use-as-value-help-DrISSxCz.mjs";
+import { t as as_field_default } from "./as-field-5rz47opo.mjs";
+import { t as as_iterator_default } from "./as-iterator-BjIF-O-J.mjs";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, guardReactiveProps, inject, mergeProps, nextTick, normalizeProps, openBlock, provide, reactive, ref, renderSlot, toDisplayString, toRaw, toValue, unref, watch, watchEffect, withModifiers } from "vue";
+import { META_DESCRIPTION, META_LABEL, UI_FORM_FN_DESCRIPTION, UI_FORM_FN_SUBMIT_DISABLED, UI_FORM_FN_SUBMIT_TEXT, UI_FORM_FN_TITLE, UI_FORM_SUBMIT_TEXT, buildDescendantErrorCounts, buildFormDiff, buildFormRebase, collectDirtyPaths, deepClone, getDeclaredFormActions, getFormValidator, iteratePathAncestors, mergeErrorMaps, resolveFormProp, setByPath, unionVariantChanged } from "@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). The SAME
+*                  container reference is also the write target for
+*                  `rebaseOnto` — mutating its `.value` preserves the bound
+*                  `:form-data` identity so the deep watch fires once.
+* @param onRebased optional callback fired AFTER `rebaseOnto` rewrites the live
+*                  data, so the host can force-remount the field subtree (e.g.
+*                  bump a key) when a union variant changed — the variant picker
+*                  detects its index once at setup and won't re-detect on a
+*                  data swap. No-op for `rebase()` (which doesn't move data).
+*/
+function createAsFormPatch(def, getData, onRebased) {
+	let baseline;
+	const baselineRev = ref(0);
+	const dataRev = 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(cur, toRaw);
+	}
+	function capture() {
+		baseline = snapshot();
+		baselineRev.value++;
+	}
+	capture();
+	if (baseline === void 0) {
+		const stop = watch(() => getData().value, () => {
+			if (baseline !== void 0) return;
+			capture();
+			if (baseline !== void 0) stop();
+		});
+	}
+	watch(() => getData(), () => dataRev.value++, { deep: true });
+	const diff = computed(() => {
+		dataRev.value;
+		baselineRev.value;
+		if (baseline === void 0) return {
+			isDirty: false,
+			changes: []
+		};
+		const result = buildFormDiff(def(), baseline, getData());
+		return {
+			isDirty: result.isDirty,
+			changes: result.changes
+		};
+	});
+	const isDirty = computed(() => diff.value.isDirty);
+	const changes = computed(() => diff.value.changes);
+	const dirtyPaths = computed(() => collectDirtyPaths(changes.value));
+	function getPatch(opts) {
+		if (baseline === void 0) return {};
+		const frozen = deepClone(getData(), toRaw);
+		return buildFormDiff(def(), baseline, frozen, opts).patch;
+	}
+	function getChanges() {
+		if (baseline === void 0) return [];
+		const frozen = deepClone(getData(), toRaw);
+		return buildFormDiff(def(), baseline, frozen).changes;
+	}
+	function isDirtyPath(path) {
+		return dirtyPaths.value.has(path);
+	}
+	function rebase() {
+		capture();
+	}
+	/**
+	* 3-way rebase onto a fresh upstream snapshot (see
+	* {@link AsFormPatchHandle.rebaseOnto}). One reactive write, then an explicit
+	* re-baseline to the upstream snapshot.
+	*/
+	function rebaseOnto(upstream, opts) {
+		const u = deepClone(upstream, toRaw);
+		if (baseline === void 0) {
+			const before = deepClone(getData(), toRaw);
+			setByPath(getData(), "", u.value);
+			if (unionVariantChanged(def(), before, u)) onRebased?.();
+			capture();
+			return {
+				conflicts: [],
+				reapplied: []
+			};
+		}
+		const current = deepClone(getData(), toRaw);
+		const { next, conflicts, reapplied } = buildFormRebase(def(), baseline, current, u, opts);
+		const variantMoved = unionVariantChanged(def(), current, next);
+		setByPath(getData(), "", next.value);
+		baseline = u;
+		baselineRev.value++;
+		if (variantMoved) onRebased?.();
+		return {
+			conflicts,
+			reapplied
+		};
+	}
+	return {
+		isDirty,
+		changes,
+		getPatch,
+		getChanges,
+		isDirtyPath,
+		rebase,
+		rebaseOnto
+	};
+}
+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 = inject(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 +316,10 @@ function useAsState(opts) {
 }
 //#endregion
 //#region src/composables/use-as-form.ts
+const EMPTY_CHANGES = Object.freeze([]);
+const EMPTY_GET_PATCH = () => ({});
+const EMPTY_GET_CHANGES = () => [];
+const EMPTY_IS_DIRTY_PATH = () => false;
 /**
 * Composable backing `<AsForm>`. Owns the entire form state machine —
 * data container, internal validator, external-error dismissal, action
@@ -179,6 +355,15 @@ function useAsForm(options) {
 			context: formContext.value ?? {}
 		})
 	});
+	const remountKey = ref(0);
+	const patch = options.trackChanges?.() ? createAsFormPatch(() => options.def(), () => data.value, () => {
+		remountKey.value++;
+	}) : void 0;
+	if (patch) provide(FORM_PATCH_KEY, patch);
+	const reset = patch ? async () => {
+		await resetState();
+		patch.rebase();
+	} : resetState;
 	provide(ROOT_DATA_KEY, data);
 	provide(PATH_PREFIX_KEY, computed(() => ""));
 	provide(TYPES_KEY, computed(() => options.types()));
@@ -220,12 +405,17 @@ 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,
+		isDirtyPath: patch ? patch.isDirtyPath : EMPTY_IS_DIRTY_PATH
 	}));
 	function supportsAction(def, actionId) {
 		return getDeclaredFormActions(def).some((a) => a.id === actionId);
@@ -271,7 +461,7 @@ function useAsForm(options) {
 		errors: ext.effective,
 		formError: ext.formError,
 		internalErrors,
-		reset: resetState,
+		reset,
 		clearErrors,
 		setErrors,
 		onSubmit,
@@ -284,7 +474,9 @@ function useAsForm(options) {
 		dismissError: ext.dismissAt,
 		dismissFormError: ext.dismissForm,
 		formContext,
-		handleChange
+		handleChange,
+		patch,
+		remountKey
 	};
 }
 //#endregion
@@ -352,6 +544,10 @@ var as_form_default = /* @__PURE__ */ defineComponent({
 		loading: {
 			type: Boolean,
 			required: false
+		},
+		trackChanges: {
+			type: Boolean,
+			required: false
 		}
 	},
 	emits: [
@@ -361,7 +557,7 @@ var as_form_default = /* @__PURE__ */ 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 +571,7 @@ var as_form_default = /* @__PURE__ */ 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 +580,24 @@ var as_form_default = /* @__PURE__ */ 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 : () => [],
+			isDirtyPath: form.patch ? form.patch.isDirtyPath : () => false,
+			rebase: form.patch ? form.patch.rebase : () => {},
+			rebaseOnto: form.patch ? form.patch.rebaseOnto : () => ({
+				conflicts: [],
+				reapplied: []
+			})
+		});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("form", {
 				class: "as-form",
@@ -391,7 +606,10 @@ var as_form_default = /* @__PURE__ */ defineComponent({
 			}, [
 				renderSlot(_ctx.$slots, "form.header", normalizeProps(guardReactiveProps(unref(form).slotProps.value))),
 				renderSlot(_ctx.$slots, "form.before", normalizeProps(guardReactiveProps(unref(form).slotProps.value))),
-				createVNode(as_field_default, { field: __props.def.rootField }, null, 8, ["field"]),
+				(openBlock(), createBlock(as_field_default, {
+					key: unref(form).remountKey.value,
+					field: __props.def.rootField
+				}, null, 8, ["field"])),
 				renderSlot(_ctx.$slots, "form.after", normalizeProps(guardReactiveProps(unref(form).slotProps.value))),
 				unref(form).formError.value ? renderSlot(_ctx.$slots, "form.error", mergeProps({ key: 0 }, unref(form).slotProps.value, {
 					message: unref(form).formError.value,
@@ -420,4 +638,4 @@ var as_form_default = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
-export { useAsExternalErrors as i, useAsForm as n, useAsState as r, as_form_default as t };
+export { useAsFormPatch as a, useAsExternalErrors as i, useAsForm as n, useAsState as r, as_form_default as t };

package/dist/as-form.cjs

@@ -1,2 +1,2 @@
-const require_as_form = require("./as-form-DaAnsFVF.cjs");
+const require_as_form = require("./as-form-B4DKpAVk.cjs");
 module.exports = require_as_form.as_form_default;

package/dist/as-form.d.cts

@@ -1,2 +1,2 @@
-import { n as _default, t as Props } from "./as-form.vue-5FyX_1CQ.cjs";
+import { n as _default, t as Props } from "./as-form.vue-D5d1Y2ff.cjs";
 export { Props, _default as default };

package/dist/as-form.d.mts

@@ -1,2 +1,2 @@
-import { n as _default, t as Props } from "./as-form.vue-ZykHT4gZ.mjs";
+import { n as _default, t as Props } from "./as-form.vue-DH3phgWP.mjs";
 export { Props, _default as default };

package/dist/as-form.mjs

@@ -1,2 +1,2 @@
-import { t as as_form_default } from "./as-form-8YNdb-49.mjs";
+import { t as as_form_default } from "./as-form-me0zA-52.mjs";
 export { as_form_default as default };