notform 2.2.5 → 3.0.0

package/dist/index.js

@@ -1,162 +1,391 @@
-import { computed, createBlock, createCommentVNode, createElementBlock, createTextVNode, defineComponent, inject, markRaw, mergeProps, nextTick, normalizeProps, onMounted, onUnmounted, openBlock, provide, reactive, ref, renderSlot, resolveDynamicComponent, toDisplayString, toValue, watch, withCtx, withModifiers } from "vue";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, guardReactiveProps, inject, mergeProps, nextTick, normalizeProps, onMounted, onUnmounted, openBlock, provide, reactive, ref, renderSlot, resolveDynamicComponent, toDisplayString, toValue, unref, watch, withCtx, withModifiers } from "vue";
+import { deepKeys, deleteProperty, getProperty, parsePath, setProperty, stringifyPath } from "dot-prop";
 import { dequal } from "dequal";
-import { deepKeys, deleteProperty, getProperty, hasProperty, parsePath, setProperty } from "dot-prop";
-import { klona } from "klona/full";
-//#region src/utils/form.ts
+import { klona } from "klona";
+//#region src/utils/segments.ts
 /**
-* Normalizes a validation path segment into a standard property key.
-* @param segment The path segment to normalize.
-* @returns The normalized key.
+* Unwraps a Standard Schema path segment to a property key.
+* @internal
+* @param segment Plain key or `{ key }`.
+* @returns The underlying property key.
 */
-function normalizeSegment(segment) {
+function toPropertyKey(segment) {
 	if (typeof segment === "object" && segment !== null && "key" in segment) return segment.key;
 	return segment;
 }
 /**
-* Compares two individual path segments for equality
-* @param firstSegment The first segment to compare.
-* @param secondSegment The second segment to compare.
-* @returns True if the two segments refer to the same object key or array index.
+* Whether two path segments name the same property. `0` and `"0"` are equal.
+* @internal
+* @param segmentA First segment.
+* @param segmentB Second segment.
+* @returns `true` when both refer to the same key.
 */
-function arePathSegmentsEqual(firstSegment, secondSegment) {
-	if (typeof firstSegment === "number" || typeof secondSegment === "number") return Number(firstSegment) === Number(secondSegment);
-	return firstSegment === secondSegment;
+function areSegmentsEqual(segmentA, segmentB) {
+	const keyA = toPropertyKey(segmentA);
+	const keyB = toPropertyKey(segmentB);
+	if (typeof keyA === "number" && typeof keyB === "string") return Number.isSafeInteger(Number(keyB)) && keyA === Number(keyB);
+	if (typeof keyA === "string" && typeof keyB === "number") return Number.isSafeInteger(Number(keyA)) && Number(keyA) === keyB;
+	return keyA === keyB;
 }
 /**
-* Checks if a validation issue path matches a target field path.
-* @param issuePath The path array from the validation issue.
-* @param targetPath The normalized path to compare against.
-* @returns True if the paths are equivalent.
+* Whether `pathSegments` names the same field as `scopeSegments`, or a field
+* nested underneath it, at any depth.
+*
+* This is the general **"at-or-under"** test: `isPathWithinScope(path, scope)`
+* is `true` when `path` equals `scope` exactly, or when `path` extends
+* `scope` with one or more extra trailing segments. It underlies both
+* {@linkcode locatePathInArrayField} (which additionally requires at least one
+* extra segment, since it locates a specific item) and the recursive
+* `isValid`/`isTouched`/`isDirty`/`isValidating` aggregates on
+* `<NotArrayField>`, which allow zero extra segments too, since the array's
+* own path should count toward its own aggregate.
+* @template TPathSegment Segment type of the candidate path.
+* @template TScopeSegment Segment type of the scope path.
+* @internal
+* @param pathSegments Candidate path, already split.
+* @param scopeSegments Scope path, already split.
+* @returns `true` when `pathSegments` is `scopeSegments` or a descendant of it.
 */
-function isIssuePathEqual(issuePath, targetPath) {
-	if (!issuePath) return false;
-	if (issuePath.length !== targetPath.length) return false;
-	return issuePath.every((segment, segmentIndex) => {
-		const normalizedSegment = normalizeSegment(segment);
-		const targetSegment = targetPath[segmentIndex];
-		return arePathSegmentsEqual(normalizedSegment, targetSegment);
-	});
+function isPathWithinScope(pathSegments, scopeSegments) {
+	if (pathSegments.length < scopeSegments.length) return false;
+	return scopeSegments.every((scopeSegment, segmentIndex) => areSegmentsEqual(pathSegments[segmentIndex], scopeSegment));
 }
 //#endregion
 //#region src/utils/array-field.ts
 /**
-* Finds where a path sits inside an array field, if at all.
-* @param pathSegments The full path segments to test, e.g. the parsed segments of `"tags.1.label"`.
-* @param arrayFieldPathSegments The parsed path segments of the array field itself, e.g. the segments of `"tags"`.
-* @returns The item's index and any trailing segments, or undefined if the path isn't inside this array.
+* Locates a field path inside an array field, e.g. `users.1.email` under
+* `users`, or `users.1.addresses.0.city` under `users` — `remainingPathSegments`
+* holds whatever comes after the index, however many segments deep that is.
+* @template TPathSegment Segment type of the candidate path.
+* @template TArraySegment Segment type of the array field path.
+* @internal
+* @param pathSegments Candidate path, already split.
+* @param arrayFieldPathSegments Array field path, already split.
+* @returns Item index and leftover segments, or `undefined` when the path is not inside the array.
 */
-function getArrayItemLocation(pathSegments, arrayFieldPathSegments) {
-	if (pathSegments.length <= arrayFieldPathSegments.length) return;
-	for (const [segmentIndex, arrayFieldPathSegment] of arrayFieldPathSegments.entries()) if (!arePathSegmentsEqual(pathSegments[segmentIndex], arrayFieldPathSegment)) return;
-	const itemIndex = Number(pathSegments[arrayFieldPathSegments.length]);
-	if (Number.isNaN(itemIndex)) return;
+function locatePathInArrayField(pathSegments, arrayFieldPathSegments) {
+	if (pathSegments.length <= arrayFieldPathSegments.length || !isPathWithinScope(pathSegments, arrayFieldPathSegments)) return;
+	const itemIndexSegment = toPropertyKey(pathSegments[arrayFieldPathSegments.length]);
+	if (typeof itemIndexSegment !== "number" && typeof itemIndexSegment !== "string") return;
+	const itemIndex = Number(itemIndexSegment);
+	if (!Number.isSafeInteger(itemIndex) || itemIndex < 0) return;
 	return {
-		itemIndex,
-		remainingSegments: pathSegments.slice(arrayFieldPathSegments.length + 1)
+		index: itemIndex,
+		remainingPathSegments: pathSegments.slice(arrayFieldPathSegments.length + 1)
 	};
 }
 /**
-* Rebuilds a dot-separated path from an array field's path, an item index, and any trailing segments.
-* @param arrayFieldPath The array field's dot-separated path, e.g. `"tags"`.
-* @param itemIndex The item's index within the array.
-* @param remainingSegments Segments after the index, e.g. `['label']` for a nested field.
-* @returns The reconstructed path, e.g. `"tags.0.label"`.
-*/
-function buildArrayItemPath(arrayFieldPath, itemIndex, remainingSegments) {
-	return [
-		arrayFieldPath,
-		itemIndex,
-		...remainingSegments
-	].join(".");
-}
-/**
-* Relocates or drops `form.errors` entries that belong to an item that moved or was removed.
-* Errors on the array field itself (no index segment) are left untouched.
-* @param form The form instance whose errors should be remapped.
-* @param arrayFieldPathSegments The parsed path segments of the array field.
-* @param arrayItemIndexMap Maps each previous item index to its new index, or undefined if removed.
-*/
-function remapArrayFieldErrors(form, arrayFieldPathSegments, arrayItemIndexMap) {
-	for (let errorIndex = form.errors.length - 1; errorIndex >= 0; errorIndex--) {
-		const issue = form.errors[errorIndex];
-		if (issue.path) {
-			const itemLocation = getArrayItemLocation(issue.path.map((segment) => normalizeSegment(segment)), arrayFieldPathSegments);
-			if (itemLocation) {
-				const newItemIndex = arrayItemIndexMap(itemLocation.itemIndex);
-				if (typeof newItemIndex === "number") form.errors[errorIndex] = {
-					...issue,
-					path: [
-						...arrayFieldPathSegments,
-						newItemIndex,
-						...itemLocation.remainingSegments
-					]
-				};
-				else form.errors.splice(errorIndex, 1);
-			}
-		}
-	}
-}
-/**
-* Relocates or drops entries in a `touchedFields`/`dirtyFields` set that belong to an item that moved or was removed.
-* @param fieldPathSet The reactive set of field paths to remap.
-* @param arrayFieldPath The dot-separated path of the array field.
-* @param arrayFieldPathSegments The parsed path segments of the array field.
-* @param arrayItemIndexMap Maps each previous item index to its new index, or undefined if removed.
+* Rewrites paths in a set after an array mutation. Paths outside the array are left as-is.
+* @template TSchema The form schema.
+* @internal
+* @param paths Touched or dirty path set.
+* @param arraySegments Split array field path.
+* @param remapIndex Previous item index → next index, or `undefined` if removed.
 */
-function remapArrayFieldPathSet(fieldPathSet, arrayFieldPath, arrayFieldPathSegments, arrayItemIndexMap) {
+function remapPathSet(paths, arraySegments, remapIndex) {
 	const pathsToRemove = [];
 	const pathsToAdd = [];
-	for (const fieldPath of fieldPathSet) {
-		const itemLocation = getArrayItemLocation(parsePath(fieldPath), arrayFieldPathSegments);
-		if (itemLocation) {
-			pathsToRemove.push(fieldPath);
-			const newItemIndex = arrayItemIndexMap(itemLocation.itemIndex);
-			if (typeof newItemIndex === "number") pathsToAdd.push(buildArrayItemPath(arrayFieldPath, newItemIndex, itemLocation.remainingSegments));
-		}
+	for (const path of paths) {
+		const location = locatePathInArrayField(parsePath(path), arraySegments);
+		if (!location) continue;
+		pathsToRemove.push(path);
+		const nextIndex = remapIndex(location.index);
+		if (nextIndex === void 0) continue;
+		const nextPath = stringifyPath([
+			...arraySegments,
+			nextIndex,
+			...location.remainingPathSegments
+		], { preferDotForIndices: true });
+		pathsToAdd.push(nextPath);
 	}
-	for (const fieldPath of pathsToRemove) fieldPathSet.delete(fieldPath);
-	for (const fieldPath of pathsToAdd) fieldPathSet.add(fieldPath);
+	for (const path of pathsToRemove) paths.delete(path);
+	for (const path of pathsToAdd) paths.add(path);
 }
 /**
-* Keeps an array field's errors, touched paths, and dirty paths attached to the item they
-* describe, rather than the array slot that item happened to occupy. Call before applying
-* the mutation to `form.values`.
-* @param form The form instance whose error, touched, and dirty state should be remapped.
-* @param arrayFieldPath The dot-separated path of the array field being mutated, e.g. `"tags"`.
-* @param arrayItemIndexMap Maps each previous item index to its new index, or undefined if removed.
+* Moves touched, dirty, and error state with array items after a structural
+* mutation. Because {@linkcode locatePathInArrayField} keeps whatever follows the
+* item's index as `remainingPathSegments`, this already handles state nested
+* arbitrarily deep inside an item — a field on an object item, or an item
+* inside a nested array of its own — not just the item's own top-level path.
+*
+* Validating state is not remapped; generation tracking already drops stale results.
+* @template TSchema The form schema.
+* @internal
+* @param form Full form instance.
+* @param arrayPath Dot path of the array field.
+* @param remapIndex Previous item index → next index, or `undefined` if removed.
 */
-function remapArrayFieldState(form, arrayFieldPath, arrayItemIndexMap) {
-	const arrayFieldPathSegments = parsePath(arrayFieldPath);
-	remapArrayFieldErrors(form, arrayFieldPathSegments, arrayItemIndexMap);
-	remapArrayFieldPathSet(form.touchedFields, arrayFieldPath, arrayFieldPathSegments, arrayItemIndexMap);
-	remapArrayFieldPathSet(form.dirtyFields, arrayFieldPath, arrayFieldPathSegments, arrayItemIndexMap);
+function remapArrayFieldState(form, arrayPath, remapIndex) {
+	const arraySegments = parsePath(arrayPath);
+	remapPathSet(form.touchedFields, arraySegments, remapIndex);
+	remapPathSet(form.dirtyFields, arraySegments, remapIndex);
+	const remappedErrors = [];
+	for (const issue of form.errors) {
+		if (!issue.path) {
+			remappedErrors.push(issue);
+			continue;
+		}
+		const location = locatePathInArrayField(issue.path, arraySegments);
+		if (!location) {
+			remappedErrors.push(issue);
+			continue;
+		}
+		const nextIndex = remapIndex(location.index);
+		if (nextIndex === void 0) continue;
+		remappedErrors.push({
+			...issue,
+			path: [
+				...arraySegments,
+				nextIndex,
+				...location.remainingPathSegments
+			]
+		});
+	}
+	form.replaceErrors(remappedErrors);
 }
 //#endregion
 //#region src/utils/instance.ts
-/** The injection key for the NotForm instance. */
+/**
+* Injection key for the full {@linkcode NotFormInstance}.
+* @internal
+*/
 const NOT_FORM_INSTANCE_KEY = Symbol("notform:instance");
 /**
-* Provides the NotForm instance to the component tree.
-* @template TSchema The validation object schema.
-* @param instance The NotForm instance to provide.
+* Provides the full form instance to descendants.
+* @template TSchema The form schema.
+* @internal
+* @param instance Public API or full instance.
 */
 function provideNotFormInstance(instance) {
-	provide(NOT_FORM_INSTANCE_KEY, instance);
+	provide(NOT_FORM_INSTANCE_KEY, toNotFormInstance(instance));
+}
+function toNotFormInstance(form) {
+	return form;
 }
+//#endregion
+//#region src/composables/use-not-form-instance.ts
 /**
-* Retrieves the NotForm instance from the component tree.
+* Resolves the full form instance from `explicitInstance` or inject.
 * @template TSchema The form schema.
-* @param explicitInstance Optional explicit instance to use.
-* @returns The NotForm instance.
+* @internal
+* @param explicitInstance Optional `form` prop, preferred over inject.
+* @returns The resolved instance.
+* @throws If neither prop nor inject is available.
 */
 function useNotFormInstance(explicitInstance) {
-	const injected = inject(NOT_FORM_INSTANCE_KEY, void 0);
-	const instance = explicitInstance ?? injected;
-	if (!instance) throw new Error(`
-      [NotForm] No form instance found. 
-      Wrap with <NotForm :form="..."> or pass :form directly to the field.
-    `);
-	return instance;
+	const injectedInstance = inject(NOT_FORM_INSTANCE_KEY, void 0);
+	const resolvedInstance = toNotFormInstance(explicitInstance) ?? injectedInstance;
+	if (!resolvedInstance) throw new Error(`
+      [NotForm] No NotForm instance found.
+      Wrap with <NotForm :form="[instance]"> or pass :form="[instance]" directly to the component.
+      `);
+	return resolvedInstance;
+}
+//#endregion
+//#region src/composables/use-not-array-field.ts
+/**
+* Array-field state, stable item keys, and mutation helpers for `<NotArrayField>`.
+*
+* `itemKeys` is the only source of `item.key`. Length-only external changes
+* pad or trim keys from the end; use the mutation helpers to keep identity
+* through insert, remove, swap, and move.
+*
+* `isValid`/`isTouched`/`isDirty`/`isValidating` are recursive: they reflect
+* the array field's own path plus every path nested underneath it, at any
+* depth — an item's own value, a field inside an object item, or an item
+* inside a nested array. `errors`, by contrast, is intentionally exact: it
+* only ever reflects issues reported at the array field's own path, the same
+* way `<NotField>`'s `errors` only reflects issues at that one field's path.
+* @template TSchema The form schema.
+* @template TItemSchema Schema used only to type mutation values.
+* @internal
+* @param props Array field path, optional form, and optional item schema.
+* @returns Slot state for `<NotArrayField>`.
+*/
+function useNotArrayField(props) {
+	const form = useNotFormInstance(props.form);
+	/** Monotonic id used by {@linkcode createItemKey}. */
+	let nextItemKeyId = 0;
+	/** Stable identity per current array index; mutated in lockstep with values. */
+	const itemKeys = ref([]);
+	/** Live array at `props.path`, or `[]` when the path is missing or not an array. */
+	const arrayValue = computed(() => {
+		const value = getProperty(form.values, props.path);
+		return Array.isArray(value) ? value : [];
+	});
+	/** Slot items: current index, stored key, and index-based path. */
+	const items = computed(() => arrayValue.value.map((_, index) => ({
+		index,
+		key: itemKeys.value[index] ?? "",
+		path: `${props.path}.${index}`
+	})));
+	/** `props.path`, pre-split into segments, for the scope checks below. */
+	const arrayPathSegments = computed(() => parsePath(props.path));
+	/** Issues reported exactly at this array field's own path — never issues from items. */
+	const errors = computed(() => form.getFieldErrors(props.path));
+	/**
+	* Whether the array field's own path, or any path nested under it — an
+	* item, a field inside an object item, or an item inside a nested array —
+	* has an active issue. Unlike `errors` above, this recurses to any depth.
+	* Issues without a `path` are never attributed to a specific field, so
+	* they don't affect this — only the top-level `form.isValid` reflects them.
+	*/
+	const isValid = computed(() => {
+		return form.errors.every((issue) => issue.path === void 0 || !isPathWithinScope(issue.path, arrayPathSegments.value));
+	});
+	/** Whether the array field's own path, or any path nested under it, has been touched. */
+	const isTouched = computed(() => {
+		return [...form.touchedFields].some((touchedPath) => isPathWithinScope(parsePath(touchedPath), arrayPathSegments.value));
+	});
+	/** Whether the array field's own path, or any path nested under it, differs from the baseline. */
+	const isDirty = computed(() => {
+		return [...form.dirtyFields].some((dirtyPath) => isPathWithinScope(parsePath(dirtyPath), arrayPathSegments.value));
+	});
+	/** Whether the array field's own path, or any path nested under it, is currently validating. */
+	const isValidating = computed(() => {
+		return [...form.validatingFields].some((validatingPath) => isPathWithinScope(parsePath(validatingPath), arrayPathSegments.value));
+	});
+	/**
+	* Allocates a unique key for one array item.
+	* @returns A key that never repeats in this field instance.
+	*/
+	function createItemKey() {
+		return `notform-array-item-${nextItemKeyId++}`;
+	}
+	/**
+	* Pads or trims `itemKeys` from the end so it matches `targetLength`.
+	* @param targetLength Desired key count.
+	*/
+	function syncItemKeysToLength(targetLength) {
+		while (itemKeys.value.length < targetLength) itemKeys.value.push(createItemKey());
+		if (itemKeys.value.length > targetLength) itemKeys.value.length = targetLength;
+	}
+	/**
+	* Returns the mutable array at `props.path`, creating an empty array if needed.
+	* @returns The live array stored on the form.
+	*/
+	function getOrCreateArrayValue() {
+		const existingArray = getProperty(form.values, props.path);
+		if (Array.isArray(existingArray)) return existingArray;
+		const createdArray = [];
+		setProperty(form.values, props.path, createdArray);
+		return createdArray;
+	}
+	/**
+	* Moves one element inside `target` from `fromIndex` to `toIndex`.
+	* @template TItem Element type.
+	* @param target Array to mutate in place.
+	* @param fromIndex Index of the element to move.
+	* @param toIndex Destination index, clamped to the array bounds.
+	*/
+	function moveArrayItem(target, fromIndex, toIndex) {
+		if (fromIndex === toIndex || fromIndex < 0 || fromIndex >= target.length) return;
+		const clampedToIndex = Math.max(0, Math.min(toIndex, target.length - 1));
+		const [movedItem] = target.splice(fromIndex, 1);
+		target.splice(clampedToIndex, 0, movedItem);
+	}
+	/**
+	* Appends `value` and a new key at the end of the array.
+	* @param value Item to append.
+	*/
+	function append(value) {
+		getOrCreateArrayValue().push(value);
+		itemKeys.value.push(createItemKey());
+	}
+	/**
+	* Inserts `value` at the start and remaps later item state — at any depth
+	* underneath each item — up by one.
+	* @param value Item to prepend.
+	*/
+	function prepend(value) {
+		getOrCreateArrayValue().unshift(value);
+		itemKeys.value.unshift(createItemKey());
+		remapArrayFieldState(form, props.path, (previousIndex) => previousIndex + 1);
+	}
+	/**
+	* Inserts `value` at `index` and remaps later item state — at any depth
+	* underneath each item — up by one.
+	* @param index Insertion index.
+	* @param value Item to insert.
+	*/
+	function insert(index, value) {
+		getOrCreateArrayValue().splice(index, 0, value);
+		itemKeys.value.splice(index, 0, createItemKey());
+		remapArrayFieldState(form, props.path, (previousIndex) => previousIndex >= index ? previousIndex + 1 : previousIndex);
+	}
+	/**
+	* Removes the item at `index` and remaps later item state — at any depth
+	* underneath each item — down by one. State nested under the removed
+	* item's own path, at any depth, is discarded along with it.
+	* @param index Index to remove.
+	*/
+	function remove(index) {
+		getOrCreateArrayValue().splice(index, 1);
+		itemKeys.value.splice(index, 1);
+		remapArrayFieldState(form, props.path, (previousIndex) => {
+			if (previousIndex === index) return;
+			return previousIndex > index ? previousIndex - 1 : previousIndex;
+		});
+	}
+	/**
+	* Replaces the value at `index` without changing its key.
+	* @param index Index to update.
+	* @param value New item value.
+	*/
+	function update(index, value) {
+		getOrCreateArrayValue()[index] = value;
+	}
+	/**
+	* Swaps two items, moving keys and form state — at any depth underneath
+	* each item — with them.
+	* @param indexA First index.
+	* @param indexB Second index.
+	*/
+	function swap(indexA, indexB) {
+		const array = getOrCreateArrayValue();
+		[array[indexA], array[indexB]] = [array[indexB], array[indexA]];
+		[itemKeys.value[indexA], itemKeys.value[indexB]] = [itemKeys.value[indexB], itemKeys.value[indexA]];
+		remapArrayFieldState(form, props.path, (previousIndex) => {
+			if (previousIndex === indexA) return indexB;
+			if (previousIndex === indexB) return indexA;
+			return previousIndex;
+		});
+	}
+	/**
+	* Moves one item to `toIndex`, shifting neighbors and remapping form
+	* state — at any depth underneath each item.
+	* @param fromIndex Current index.
+	* @param toIndex Destination index.
+	*/
+	function move(fromIndex, toIndex) {
+		moveArrayItem(getOrCreateArrayValue(), fromIndex, toIndex);
+		moveArrayItem(itemKeys.value, fromIndex, toIndex);
+		remapArrayFieldState(form, props.path, (previousIndex) => {
+			if (previousIndex === fromIndex) return toIndex;
+			if (fromIndex < toIndex) return previousIndex > fromIndex && previousIndex <= toIndex ? previousIndex - 1 : previousIndex;
+			return previousIndex >= toIndex && previousIndex < fromIndex ? previousIndex + 1 : previousIndex;
+		});
+	}
+	watch(() => arrayValue.value.length, (arrayLength) => {
+		if (itemKeys.value.length === arrayLength) return;
+		syncItemKeysToLength(arrayLength);
+	}, { immediate: true });
+	return reactive({
+		append,
+		errors,
+		insert,
+		isDirty,
+		isTouched,
+		isValid,
+		isValidating,
+		items,
+		move,
+		path: computed(() => props.path),
+		prepend,
+		remove,
+		swap,
+		update
+	});
 }
 //#endregion
 //#region src/components/not-array-field.vue
@@ -164,7 +393,7 @@ var not_array_field_default = /* @__PURE__ */ defineComponent({
 	__name: "not-array-field",
 	props: {
 		path: {
-			type: String,
+			type: [String, Object],
 			required: true
 		},
 		itemSchema: {
@@ -172,357 +401,137 @@ var not_array_field_default = /* @__PURE__ */ defineComponent({
 			required: false
 		},
 		form: {
-			type: null,
-			required: false
-		},
-		validateOn: {
 			type: Object,
 			required: false
 		}
 	},
 	setup(__props) {
-		const props = __props;
-		const form = useNotFormInstance(props.form);
-		const isValidating = ref(false);
-		const validatingCount = ref(0);
-		/** Counter to ensure absolute uniqueness for generated keys. */
-		const keyCounter = ref(0);
-		/** Stable keys per item that survive reorders, removals, and inserts. */
-		const itemKeys = ref((() => {
-			const initial = getProperty(form.values, props.path);
-			const length = Array.isArray(initial) ? initial.length : 0;
-			return Array.from({ length }, () => `${props.path}-${keyCounter.value++}`);
-		})());
-		const validateOn = computed(() => ({
-			onChange: props.validateOn?.onChange ?? form.validateOn.onChange,
-			onMount: props.validateOn?.onMount ?? form.validateOn.onMount
-		}));
-		const array = computed(() => {
-			const value = getProperty(form.values, props.path);
-			return Array.isArray(value) ? value : [];
-		});
-		const items = computed(() => {
-			return array.value.map((_, index) => ({
-				index,
-				key: itemKeys.value[index] ?? `${props.path}-fallback-${index}`,
-				path: `${props.path}.${index}`
-			}));
-		});
-		const errors = computed(() => form.getFieldErrors(props.path));
-		const isValid = computed(() => errors.value.length === 0);
-		const isTouched = computed(() => {
-			return form.touchedFields.has(props.path) || [...form.touchedFields].some((path) => path.startsWith(`${props.path}.`));
-		});
-		const isDirty = computed(() => {
-			return form.dirtyFields.has(props.path) || [...form.dirtyFields].some((path) => path.startsWith(`${props.path}.`));
-		});
-		/**
-		* Starts a local field validation execution.
-		*/
-		function beginValidation() {
-			validatingCount.value++;
-			isValidating.value = true;
-		}
-		/**
-		* Ends a local field validation execution.
-		*/
-		function endValidation() {
-			validatingCount.value--;
-			if (validatingCount.value === 0) isValidating.value = false;
-		}
-		/**
-		* Generates a unique key string using the field path and counter.
-		* @returns A unique key string.
-		*/
-		function generateKey() {
-			return `${props.path}-${keyCounter.value++}`;
-		}
-		/**
-		* Re-aligns itemKeys with current array length.
-		*
-		* Used mostly after external resets.
-		*/
-		function syncKeys() {
-			const arrayLength = array.value.length;
-			if (itemKeys.value.length > arrayLength) itemKeys.value.length = arrayLength;
-			else while (itemKeys.value.length < arrayLength) itemKeys.value.push(generateKey());
-		}
-		/**
-		* Applies an array update, syncs form dirty/touched state, and triggers validation.
-		* @param updater Function that modifies the array.
-		*/
-		function mutate(updater) {
-			const current = [...array.value];
-			updater(current);
-			setProperty(form.values, props.path, current);
-			form.touchField(props.path);
-			if (dequal(current, getProperty(form.initialValues, props.path))) form.dirtyFields.delete(props.path);
-			else form.dirtyField(props.path);
-			if (validateOn.value.onChange) validate();
-		}
-		/**
-		* Validates the array field.
-		* @returns A promise that resolves to the validation result.
-		*/
-		async function validate() {
-			beginValidation();
-			try {
-				return await form.validateField(props.path);
-			} finally {
-				endValidation();
-			}
-		}
-		/**
-		* Appends an item to the array.
-		* @param value The value to append.
-		*/
-		function append(value) {
-			itemKeys.value.push(generateKey());
-			mutate((current) => {
-				current.push(value);
-			});
-		}
-		/**
-		* Prepends an item to the array.
-		* @param value The value to prepend.
-		*/
-		function prepend(value) {
-			itemKeys.value.unshift(generateKey());
-			remapArrayFieldState(form, props.path, (previousIndex) => previousIndex + 1);
-			mutate((current) => {
-				current.unshift(value);
-			});
-		}
-		/**
-		* Removes an item from the array.
-		* @param index The item index to remove.
-		*/
-		function remove(index) {
-			itemKeys.value.splice(index, 1);
-			remapArrayFieldState(form, props.path, (previousIndex) => {
-				if (previousIndex === index) return;
-				return previousIndex > index ? previousIndex - 1 : previousIndex;
-			});
-			mutate((current) => current.splice(index, 1));
-		}
-		/**
-		* Inserts an item at a specific index.
-		* @param index The insertion index.
-		* @param value The value to insert.
-		*/
-		function insert(index, value) {
-			itemKeys.value.splice(index, 0, generateKey());
-			remapArrayFieldState(form, props.path, (previousIndex) => {
-				if (previousIndex >= index) return previousIndex + 1;
-				return previousIndex;
-			});
-			mutate((current) => current.splice(index, 0, value));
-		}
-		/**
-		* Updates an item at a specific index.
-		* @param index The item index to update.
-		* @param value The new item value.
-		*/
-		function update(index, value) {
-			mutate((current) => {
-				current[index] = value;
-			});
-		}
-		/**
-		* Swaps two items in the array.
-		* @param indexA The first item index.
-		* @param indexB The second item index.
-		*/
-		function swap(indexA, indexB) {
-			const temporaryKey = itemKeys.value[indexA];
-			itemKeys.value[indexA] = itemKeys.value[indexB];
-			itemKeys.value[indexB] = temporaryKey;
-			remapArrayFieldState(form, props.path, (previousIndex) => {
-				if (previousIndex === indexA) return indexB;
-				if (previousIndex === indexB) return indexA;
-				return previousIndex;
-			});
-			mutate((current) => {
-				const temporaryValue = current[indexA];
-				current[indexA] = current[indexB];
-				current[indexB] = temporaryValue;
-			});
-		}
-		/**
-		* Moves an item from one index to another.
-		* @param from The source index.
-		* @param to The destination index.
-		*/
-		function move(from, to) {
-			const [movedItemKey] = itemKeys.value.splice(from, 1);
-			itemKeys.value.splice(to, 0, movedItemKey);
-			remapArrayFieldState(form, props.path, (previousIndex) => {
-				if (previousIndex === from) return to;
-				if (from < to) {
-					if (previousIndex > from && previousIndex <= to) return previousIndex - 1;
-					return previousIndex;
-				}
-				if (previousIndex >= to && previousIndex < from) return previousIndex + 1;
-				return previousIndex;
-			});
-			mutate((current) => {
-				const [movedItem] = current.splice(from, 1);
-				current.splice(to, 0, movedItem);
-			});
-		}
-		onMounted(async () => {
-			await nextTick();
-			if (validateOn.value.onMount) validate();
-		});
-		watch(() => array.value.length, syncKeys);
+		const arrayField = useNotArrayField(__props);
 		return (_ctx, _cache) => {
-			return renderSlot(_ctx.$slots, "default", {
-				append,
-				errors: errors.value,
-				insert,
-				isDirty: isDirty.value,
-				isTouched: isTouched.value,
-				isValid: isValid.value,
-				isValidating: isValidating.value,
-				items: items.value,
-				move,
-				path: __props.path,
-				prepend,
-				remove,
-				swap,
-				update,
-				validate
-			});
+			return renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(arrayField))));
 		};
 	}
 });
 //#endregion
+//#region src/composables/use-not-field.ts
+/**
+* Field state, validation, and mutation helpers for `<NotField>`.
+* @template TSchema The form schema.
+* @internal
+* @param props Path and optional form and validation triggers.
+* @returns Slot state for `<NotField>`.
+*/
+function useNotField(props) {
+	const form = useNotFormInstance(props.form);
+	const errors = computed(() => form.getFieldErrors(props.path));
+	const isValid = computed(() => errors.value.length === 0);
+	const isTouched = computed(() => form.touchedFields.has(props.path));
+	const isDirty = computed(() => form.dirtyFields.has(props.path));
+	const isValidating = computed(() => form.validatingFields.has(props.path));
+	const validateOn = computed(() => ({
+		onBlur: true,
+		onChange: true,
+		...props.validateOn
+	}));
+	let debounceTimer;
+	/** Clears a pending debounce timer. */
+	function clearDebounce() {
+		if (debounceTimer === void 0) return;
+		clearTimeout(debounceTimer);
+		debounceTimer = void 0;
+	}
+	/** Runs field validation immediately, or after `debounce` ms. */
+	function scheduleValidation() {
+		if (!props.debounce) {
+			form.validateField(props.path);
+			return;
+		}
+		clearDebounce();
+		debounceTimer = setTimeout(() => {
+			form.validateField(props.path);
+		}, props.debounce);
+	}
+	/** Marks touched and validates on blur when enabled. */
+	function onBlur() {
+		clearDebounce();
+		form.markFieldAsTouched(props.path);
+		if (validateOn.value?.onBlur) form.validateField(props.path);
+	}
+	/** Syncs dirty and, in eager mode, revalidates on input while invalid. */
+	function onInput() {
+		form.syncDirtyState(props.path);
+		if (!validateOn.value?.onInput) return;
+		if (props.validationMode === "eager" && !isValid.value) scheduleValidation();
+	}
+	/** Syncs dirty and, in eager mode, revalidates on change while invalid. */
+	function onChange() {
+		form.syncDirtyState(props.path);
+		if (!validateOn.value?.onChange) return;
+		if (props.validationMode === "eager" && !isValid.value) scheduleValidation();
+	}
+	/**
+	* Validates on mount when `validateOn.onMount` is set. This is the only
+	* trigger not exposed through `events` below, since there's no DOM event
+	* to bind — it runs on its own via the `onMounted` hook further down.
+	*/
+	function onMount() {
+		if (validateOn.value?.onMount) form.validateField(props.path);
+	}
+	const events = {
+		onBlur,
+		onChange,
+		onInput
+	};
+	onMounted(async () => {
+		await nextTick();
+		onMount();
+	});
+	onUnmounted(() => {
+		clearDebounce();
+	});
+	return reactive({
+		errors,
+		events,
+		isDirty,
+		isTouched,
+		isValid,
+		isValidating,
+		path: computed(() => props.path)
+	});
+}
+//#endregion
 //#region src/components/not-field.vue
 var not_field_default = /* @__PURE__ */ defineComponent({
 	__name: "not-field",
 	props: {
 		path: {
-			type: String,
+			type: [String, Object],
 			required: true
 		},
 		form: {
-			type: null,
+			type: Object,
 			required: false
 		},
 		validateOn: {
 			type: Object,
-			required: false
+			required: false,
+			default: void 0
+		},
+		validationMode: {
+			type: String,
+			required: false,
+			default: "eager"
 		},
 		debounce: {
 			type: Number,
-			required: false
+			required: false,
+			default: void 0
 		}
 	},
 	setup(__props) {
-		const props = __props;
-		const form = useNotFormInstance(props.form);
-		const isValidating = ref(false);
-		const validatingCount = ref(0);
-		/** Timer handle for the current pending debounced validation. */
-		const debounceTimer = ref();
-		/** Merges per-field overrides with the form-wide validation config. */
-		const validateOn = computed(() => ({
-			...form.validateOn,
-			...props.validateOn
-		}));
-		const value = computed(() => getProperty(form.values, props.path));
-		const errors = computed(() => form.getFieldErrors(props.path));
-		const isValid = computed(() => errors.value.length === 0);
-		const isTouched = computed(() => form.touchedFields.has(props.path));
-		const isDirty = computed(() => form.dirtyFields.has(props.path));
-		/** Starts a local field validation execution. */
-		function beginValidation() {
-			validatingCount.value++;
-			isValidating.value = true;
-		}
-		/** Ends a local field validation execution. */
-		function endValidation() {
-			validatingCount.value--;
-			if (validatingCount.value === 0) isValidating.value = false;
-		}
-		/** Cancels pending debounced validation on blur/unmount to prevent rogue execution. */
-		function clearDebounce() {
-			if (debounceTimer.value === void 0) return;
-			clearTimeout(debounceTimer.value);
-			debounceTimer.value = void 0;
-		}
-		/** Compares current value against baseline to sync dirty state tracking. */
-		function updateDirty() {
-			if (dequal(value.value, getProperty(form.initialValues, props.path))) form.dirtyFields.delete(props.path);
-			else form.dirtyField(props.path);
-		}
-		/** Replaces pending debounced validation with a new timer, or runs immediately when no debounce is configured. */
-		function scheduleValidation() {
-			if (!props.debounce) {
-				validate();
-				return;
-			}
-			clearDebounce();
-			debounceTimer.value = setTimeout(validate, props.debounce);
-		}
-		/**
-		* Validates the field and returns the validation result.
-		* @returns A promise that resolves to the validation result.
-		*/
-		async function validate() {
-			beginValidation();
-			try {
-				return await form.validateField(props.path);
-			} finally {
-				endValidation();
-			}
-		}
-		/** Handles the blur event for the field. */
-		function onBlur() {
-			clearDebounce();
-			form.touchField(props.path);
-			if (validateOn.value.onBlur) validate();
-		}
-		/** Handles the input event for the field. */
-		function onInput() {
-			updateDirty();
-			if (!validateOn.value.onInput) return;
-			if (form.validationMode === "eager" && !isValid.value) scheduleValidation();
-		}
-		/** Handles the change event for the field. */
-		function onChange() {
-			updateDirty();
-			if (!validateOn.value.onChange) return;
-			if (form.validationMode === "eager" && !isValid.value) scheduleValidation();
-		}
-		/** Handles the focus event for the field. */
-		function onFocus() {
-			if (validateOn.value.onFocus) scheduleValidation();
-		}
-		onMounted(async () => {
-			await nextTick();
-			if (validateOn.value.onMount) validate();
-		});
-		onUnmounted(() => {
-			clearDebounce();
-		});
+		const field = useNotField(__props);
 		return (_ctx, _cache) => {
-			return renderSlot(_ctx.$slots, "default", {
-				errors: errors.value,
-				isValid: isValid.value,
-				isTouched: isTouched.value,
-				isDirty: isDirty.value,
-				isValidating: isValidating.value,
-				validate,
-				events: {
-					onBlur,
-					onChange,
-					onFocus,
-					onInput
-				},
-				path: __props.path,
-				value: value.value
-			});
+			return renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(field))));
 		};
 	}
 });
@@ -531,13 +540,13 @@ var not_field_default = /* @__PURE__ */ defineComponent({
 var not_form_default = /* @__PURE__ */ defineComponent({
 	__name: "not-form",
 	props: { form: {
-		type: null,
+		type: Object,
 		required: true
 	} },
 	setup(__props) {
 		provideNotFormInstance(__props.form);
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("form", { onReset: _cache[0] || (_cache[0] = withModifiers(() => {}, ["prevent"])) }, [renderSlot(_ctx.$slots, "default")], 32);
+			return openBlock(), createElementBlock(Fragment, null, [createCommentVNode("\n    Reset is always prevented here, regardless of what (if anything) the\n    consumer binds to @reset, since a native reset would otherwise clear\n    every input before `values` has a chance to react to it.\n\n    Submit is NOT prevented here. `form.submit()` calls `event.preventDefault()`\n    itself when it runs, which only happens if the consumer binds @submit to it\n    (e.g. `@submit=\"form.submit\"`) — see the NotForm docs for why this matters.\n  "), createElementVNode("form", { onReset: _cache[0] || (_cache[0] = withModifiers(() => {}, ["prevent"])) }, [renderSlot(_ctx.$slots, "default")], 32)], 2112);
 		};
 	}
 });
@@ -553,18 +562,18 @@ var not_message_default = /* @__PURE__ */ defineComponent({
 			default: "span"
 		},
 		path: {
-			type: String,
+			type: [String, Object],
 			required: true
 		},
 		form: {
-			type: null,
+			type: Object,
 			required: false
 		}
 	},
 	setup(__props) {
 		const props = __props;
 		const form = useNotFormInstance(props.form);
-		const message = computed(() => form.errorsMap.value[props.path]);
+		const message = computed(() => form.getFieldErrors(props.path)[0]?.message);
 		return (_ctx, _cache) => {
 			return message.value ? (openBlock(), createBlock(resolveDynamicComponent(__props.as), normalizeProps(mergeProps({ key: 0 }, _ctx.$attrs)), {
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default", { message: message.value }, () => [createTextVNode(toDisplayString(message.value), 1)])]),
@@ -574,296 +583,362 @@ var not_message_default = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
-//#region src/composables/use-not-form.ts
+//#region src/utils/issues.ts
 /**
-* Creates a reactive NotFormInstance for managing form state and validation.
-* @template TSchema The standard schema type.
-* @param config Configuration object.
-* @returns A reactive NotFormInstance.
+* Whether two issue paths point at the same field after segment normalization.
+* @internal
+* @param issuePathA First path.
+* @param issuePathB Second path.
+* @returns `true` when both paths are defined, same length, and equal segment-wise.
 */
-function useNotForm(config) {
-	let initialValues = klona(config.initialValues ?? {});
-	let initialErrors = klona(config.initialErrors ?? []);
-	const validateOn = {
-		onBlur: config.validateOn?.onBlur ?? true,
-		onChange: config.validateOn?.onChange ?? true,
-		onFocus: config.validateOn?.onFocus ?? false,
-		onInput: config.validateOn?.onInput ?? true,
-		onMount: config.validateOn?.onMount ?? false
-	};
-	const validationMode = config.validationMode || "eager";
+function areIssuePathsEqual(issuePathA, issuePathB) {
+	if (!issuePathA || !issuePathB) return false;
+	if (issuePathA.length !== issuePathB.length) return false;
+	return issuePathA.every((segment, segmentIndex) => areSegmentsEqual(segment, issuePathB[segmentIndex]));
+}
+//#endregion
+//#region src/factories/create-not-form-instance.ts
+/**
+* Builds the full reactive form instance used by `useNotForm` and field components.
+* @template TSchema The form schema.
+* @internal
+* @param config Schema, initial values/errors, and submit handler.
+* @returns Assembled {@linkcode NotFormInstance}.
+*/
+function createNotFormInstance(config) {
+	/** Baseline values for reset. */
+	const initialValues = klona(config.initialValues ?? {});
+	/** Live field values. */
 	const values = reactive(klona(initialValues));
+	/** Baseline issues for reset. */
+	const initialErrors = klona(config.initialErrors ?? []);
+	/** Current validation issues. */
 	const errors = reactive([...initialErrors]);
+	/** Paths the user has interacted with. */
 	const touchedFields = reactive(/* @__PURE__ */ new Set());
+	const isTouched = computed(() => touchedFields.size > 0);
+	/** Paths whose value differs from the baseline. */
 	const dirtyFields = reactive(/* @__PURE__ */ new Set());
-	const isSubmitting = ref(false);
-	const isValid = computed(() => errors.length === 0);
 	const isDirty = computed(() => dirtyFields.size > 0);
-	const isTouched = computed(() => touchedFields.size > 0);
-	const errorsMap = computed(() => {
-		const result = {};
-		for (const issue of errors) {
-			if (!issue.path) continue;
-			const path = issue.path.map((element) => normalizeSegment(element)).join(".");
-			if (path && !Object.hasOwn(result, path)) result[path] = issue.message;
-		}
-		return result;
-	});
-	/** Whether one or more validation operations are currently running. */
-	const isValidating = ref(false);
-	/** Number of validation operations currently in progress. */
-	const validatingCount = ref(0);
-	/** Identifier of the latest validation cycle. */
-	let validationCycle = 0;
-	/** Identifier of the latest validation cycle for each field. */
-	const fieldValidationCycles = /* @__PURE__ */ new Map();
+	/** Paths with an in-flight validation. */
+	const validatingFields = reactive(/* @__PURE__ */ new Set());
+	const isValid = computed(() => errors.length === 0);
+	const isValidating = computed(() => validatingFields.size > 0);
+	const isSubmitting = ref(false);
+	/**
+	* Bumped by validate, submit, and reset. Older in-flight runs are discarded:
+	* each still resolves with its own result, but only the run matching the
+	* current generation when it finishes gets to write to `errors`.
+	*/
+	let generation = 0;
+	/** Latest per-field validation cycle id, used to drop stale field results. */
+	const fieldValidationCycleMap = /* @__PURE__ */ new Map();
+	/** Active validation count per path so overlapping runs do not clear too early. */
+	const validatingFieldCounts = /* @__PURE__ */ new Map();
 	/**
-	* Starts a validation operation.
-	* @returns The identifier of the new validation cycle.
+	* Runs the current schema against `values`. Resolves `config.schema`
+	* first via `toValue`, so a ref or a getter function works the same as
+	* passing the schema directly.
+	* @returns Standard Schema result.
 	*/
-	function beginValidation() {
-		validatingCount.value++;
-		isValidating.value = true;
-		return ++validationCycle;
+	function executeSchemaValidation() {
+		return toValue(config.schema)["~standard"].validate(values);
 	}
 	/**
-	* Starts a validation operation for a specific field path.
-	* @param path The field path to start validation for.
-	* @returns The identifier of the new validation cycle.
+	* Sets a field value and syncs its dirty flag. Does not validate.
+	* @template TPath Field path.
+	* @param path Dot path.
+	* @param value Value to assign.
 	*/
-	function beginFieldValidation(path) {
-		validatingCount.value++;
-		isValidating.value = true;
-		const key = String(path);
-		const cycle = (fieldValidationCycles.get(key) ?? 0) + 1;
-		fieldValidationCycles.set(key, cycle);
-		return cycle;
+	function setValue(path, value) {
+		setProperty(values, path, value);
+		syncDirtyState(path);
 	}
 	/**
-	* Checks if the validation cycle for a specific field path is current.
-	* @param path The field path to check.
-	* @param cycle The validation cycle identifier.
-	* @returns Whether the cycle is still current.
+	* Upserts an issue at the same path, or appends it.
+	* @param error Issue to set.
 	*/
-	function isCurrentFieldValidation(path, cycle) {
-		return fieldValidationCycles.get(String(path)) === cycle;
+	function setError(error) {
+		const existingIndex = errors.findIndex((existing) => areIssuePathsEqual(existing.path, error.path));
+		if (existingIndex === -1) errors.push(error);
+		else errors[existingIndex] = error;
 	}
-	/** Marks a validation operation as finished. */
-	function endValidation() {
-		validatingCount.value--;
-		if (validatingCount.value === 0) isValidating.value = false;
+	/**
+	* Replaces the entire error list.
+	* @internal
+	* @param nextErrors Replacement issues.
+	*/
+	function replaceErrors(nextErrors) {
+		errors.splice(0, errors.length, ...nextErrors);
 	}
 	/**
-	* Checks whether a validation cycle is still the latest cycle.
-	* @param cycle The validation cycle identifier.
-	* @returns Whether the cycle is still current.
+	* Removes every issue.
+	* @internal
 	*/
-	function isCurrentValidation(cycle) {
-		return cycle === validationCycle;
+	function clearErrors() {
+		errors.length = 0;
 	}
 	/**
-	* Resolves and executes the standard schema validation.
-	* @returns The validation result containing either `value` or `issues`.
+	* Issues whose path exactly equals `path` — see the same note on
+	* {@linkcode NotFormInstance.getFieldErrors}.
+	* @param path Dot path.
+	* @returns Matching issues.
 	*/
-	function runSchema() {
-		return toValue(config.schema)["~standard"].validate(values);
+	function getFieldErrors(path) {
+		const targetPath = parsePath(path);
+		return errors.filter((error) => areIssuePathsEqual(error.path, targetPath));
 	}
-	/** Iterates through deeply nested keys to mark all as touched. */
-	function touchAllFields() {
-		for (const path of deepKeys(values)) touchedFields.add(path);
+	/**
+	* Forces a field dirty.
+	* @internal
+	* @param path Dot path.
+	*/
+	function markFieldAsDirty(path) {
+		dirtyFields.add(path);
+	}
+	/**
+	* Forces every current leaf field dirty. Only paths present in `values`
+	* right now are affected — see the note on
+	* {@linkcode NotFormInstance.markAllFieldsAsTouched}.
+	* @internal
+	*/
+	function markAllFieldsAsDirty() {
+		for (const path of deepKeys(values)) dirtyFields.add(path);
 	}
 	/**
-	* Removes a specific field path from the dirty tracking set.
-	* @param path The field path to mark as clean.
+	* Clears dirty state for one field.
+	* @internal
+	* @param path Dot path.
 	*/
-	function unDirtyField(path) {
+	function unmarkFieldAsDirty(path) {
 		dirtyFields.delete(path);
 	}
-	/** Iterates through deeply nested keys to mark all as dirty. */
-	function dirtyAllFields() {
-		for (const path of deepKeys(values)) dirtyFields.add(path);
+	/**
+	* Clears dirty state for all fields.
+	* @internal
+	*/
+	function unmarkAllFieldsAsDirty() {
+		dirtyFields.clear();
 	}
 	/**
-	* Marks a specific field path as touched.
-	* @param path The field path to mark as touched.
+	* Sets dirty from a deep compare against the baseline.
+	* @internal
+	* @param path Dot path.
 	*/
-	function touchField(path) {
-		touchedFields.add(path);
+	function syncDirtyState(path) {
+		const currentValue = getProperty(values, path);
+		const baselineValue = getProperty(initialValues, path);
+		if (dequal(currentValue, baselineValue)) unmarkFieldAsDirty(path);
+		else markFieldAsDirty(path);
 	}
 	/**
-	* Marks a specific field path as dirty.
-	* @param path The field path to mark as dirty.
+	* Recalculates dirty state for every current leaf path.
+	* @internal
 	*/
-	function dirtyField(path) {
-		dirtyFields.add(path);
+	function syncAllDirtyStates() {
+		for (const path of deepKeys(values)) syncDirtyState(path);
 	}
 	/**
-	* Sets a value at the specified path and updates dirty tracking based on comparison with initial values.
-	* @param path The field path to set the value at.
-	* @param value The value to set.
+	* Marks a field as touched.
+	* @internal
+	* @param path Dot path.
 	*/
-	function setValue(path, value) {
-		setProperty(values, path, value);
-		if (dequal(value, getProperty(initialValues, path))) unDirtyField(path);
-		else dirtyField(path);
+	function markFieldAsTouched(path) {
+		touchedFields.add(path);
 	}
 	/**
-	* Sets or updates an error issue in the errors array, replacing any existing issue for the same path.
-	* @param newIssue The issue to set.
+	* Marks every current leaf field as touched. Only paths present in
+	* `values` right now are affected — see the note on
+	* {@linkcode NotFormInstance.markAllFieldsAsTouched}.
+	* @internal
 	*/
-	function setError(newIssue) {
-		const newPath = newIssue.path?.map((element) => normalizeSegment(element)).join(".");
-		const existingIndex = errors.findIndex((error) => {
-			return error.path?.map((element) => normalizeSegment(element)).join(".") === newPath;
-		});
-		if (existingIndex === -1) errors.push(newIssue);
-		else errors[existingIndex] = newIssue;
+	function markAllFieldsAsTouched() {
+		for (const path of deepKeys(values)) touchedFields.add(path);
 	}
 	/**
-	* Sets multiple error issues in the errors array, replacing all existing issues.
-	* @param newIssues The array of issues to set.
+	* Clears touched state for one field.
+	* @internal
+	* @param path Dot path.
 	*/
-	function setErrors(newIssues) {
-		errors.splice(0, errors.length, ...newIssues);
+	function unmarkFieldAsTouched(path) {
+		touchedFields.delete(path);
 	}
-	/** Clears all error issues from the errors array. */
-	function clearErrors() {
-		errors.length = 0;
+	/**
+	* Clears touched state for all fields.
+	* @internal
+	*/
+	function unmarkAllFieldsAsTouched() {
+		touchedFields.clear();
 	}
 	/**
-	* Retrieves all error issues associated with a specific field path.
-	* @param path The field path to retrieve errors for.
-	* @returns An array of error issues associated with the field path.
+	* Increments the in-flight validation count for each path.
+	* @internal
+	* @param paths Field paths.
 	*/
-	function getFieldErrors(path) {
-		const pathSegments = parsePath(path);
-		return errors.filter((error) => isIssuePathEqual(error.path, pathSegments));
+	function markFieldsAsValidating(paths) {
+		for (const path of paths) {
+			validatingFieldCounts.set(path, (validatingFieldCounts.get(path) ?? 0) + 1);
+			validatingFields.add(path);
+		}
 	}
 	/**
-	* Validates the entire form against the schema, updating errors and returning the result.
-	*
-	* Only the latest validation cycle is allowed to mutate form validation state.
-	* @returns An object containing either `value` or `issues` based on validation outcome.
+	* Decrements in-flight counts and clears a path when the count hits zero.
+	* @internal
+	* @param paths Field paths.
+	*/
+	function unmarkFieldsAsValidating(paths) {
+		for (const path of paths) {
+			const nextCount = (validatingFieldCounts.get(path) ?? 0) - 1;
+			if (nextCount <= 0) {
+				validatingFieldCounts.delete(path);
+				validatingFields.delete(path);
+			} else validatingFieldCounts.set(path, nextCount);
+		}
+	}
+	/**
+	* Validates the whole form, replacing all errors. Bumps `generation`; see
+	* {@linkcode NotFormInstance.validate} for the concurrency guarantee this gives.
+	* @returns Standard Schema result.
 	*/
 	async function validate() {
-		const cycle = beginValidation();
+		const cycle = ++generation;
+		const paths = [...deepKeys(values)];
+		markFieldsAsValidating(paths);
 		try {
-			const result = await runSchema();
-			if (!isCurrentValidation(cycle)) return result;
+			const result = await executeSchemaValidation();
+			if (cycle !== generation) return result;
 			if (result.issues) {
 				const issues = [...result.issues];
-				setErrors(issues);
+				replaceErrors(issues);
 				return { issues };
 			}
 			clearErrors();
 			return { value: result.value };
 		} finally {
-			endValidation();
+			unmarkFieldsAsValidating(paths);
 		}
 	}
 	/**
-	* Validates a specific field against the schema, updating errors and returning the result.
+	* Validates the form and writes issues only for `path`. `path` can be any
+	* granularity — see {@linkcode NotFormInstance.validateField}.
 	*
-	* Only the latest validation cycle is allowed to mutate form validation state.
-	* @param path The field path to validate.
-	* @returns An object containing either `value` or `issues` based on validation outcome.
+	* Dropped if a newer call for the same path or a newer whole-form generation starts.
+	* @param path Dot path.
+	* @returns Standard Schema result.
 	*/
 	async function validateField(path) {
-		const cycle = beginFieldValidation(path);
+		const cycle = (fieldValidationCycleMap.get(path) ?? 0) + 1;
+		fieldValidationCycleMap.set(path, cycle);
+		const startGeneration = generation;
+		markFieldsAsValidating([path]);
 		try {
-			const result = await runSchema();
-			if (!isCurrentFieldValidation(path, cycle)) return result;
-			const pathSegments = parsePath(path);
-			const staleIndices = [];
-			for (const [index, error] of errors.entries()) if (isIssuePathEqual(error.path, pathSegments)) staleIndices.push(index);
-			for (let index = staleIndices.length - 1; index >= 0; index--) errors.splice(staleIndices[index], 1);
-			if (result?.issues) {
-				const fieldIssues = result.issues.filter((issue) => isIssuePathEqual(issue.path, pathSegments));
-				if (fieldIssues.length > 0) {
-					errors.push(...fieldIssues);
-					return { issues: fieldIssues };
-				}
-				return { value: getProperty(values, path) };
-			}
-			return { value: getProperty(result.value, path) };
+			const result = await executeSchemaValidation();
+			if (generation !== startGeneration || fieldValidationCycleMap.get(path) !== cycle) return result;
+			const targetPath = parsePath(path);
+			for (let errorIndex = errors.length - 1; errorIndex >= 0; errorIndex--) if (areIssuePathsEqual(errors[errorIndex].path, targetPath)) errors.splice(errorIndex, 1);
+			const fieldIssues = (result.issues ?? []).filter((issue) => areIssuePathsEqual(issue.path, targetPath));
+			errors.push(...fieldIssues);
+			if (fieldIssues.length > 0) return { issues: fieldIssues };
+			return { value: getProperty(values, path) };
 		} finally {
-			endValidation();
+			unmarkFieldsAsValidating([path]);
 		}
 	}
 	/**
-	* Submits the form, validating it and executing the submit handler if provided.
-	*
-	* Duplicate submissions are ignored while a submission is already in progress.
-	* @param event The submit event.
+	* Touches all fields, validates, then runs `onSubmit` when valid.
+	* @param event Optional submit event. `event.preventDefault()` is called
+	* immediately if `event` is given, before checking whether a submission
+	* is already in flight or whether validation passes.
 	*/
 	async function submit(event) {
-		event.preventDefault();
+		event?.preventDefault();
 		if (isSubmitting.value) return;
+		markAllFieldsAsTouched();
+		syncAllDirtyStates();
+		const cycle = ++generation;
+		const paths = [...deepKeys(values)];
+		markFieldsAsValidating(paths);
 		isSubmitting.value = true;
-		const cycle = beginValidation();
 		try {
-			touchAllFields();
-			dirtyAllFields();
-			const result = await runSchema();
-			if (!isCurrentValidation(cycle)) return;
+			const result = await executeSchemaValidation();
+			if (cycle !== generation) return;
 			if (result.issues) {
-				setErrors([...result.issues]);
+				replaceErrors([...result.issues]);
 				return;
 			}
 			clearErrors();
-			if (config.onSubmit) await config.onSubmit(result.value);
+			await config.onSubmit?.(result.value);
 		} finally {
-			endValidation();
+			unmarkFieldsAsValidating(paths);
 			isSubmitting.value = false;
 		}
 	}
 	/**
-	* Resets the form to its initial state.
-	* @param newValues The new values to reset the form with.
-	* @param newErrors The new errors to reset the form with.
+	* Restores values and errors to the baseline. Optional arguments become
+	* the new baseline and fully replace the previous one — see
+	* {@linkcode NotFormInstance.reset} for the "replace, not merge" detail.
+	* @param nextValues New baseline values.
+	* @param nextErrors New baseline issues.
 	*/
-	function reset(newValues, newErrors) {
-		validationCycle++;
-		if (newValues) initialValues = klona(newValues);
-		if (newErrors) initialErrors = klona(newErrors);
-		const freshValues = klona(initialValues);
-		for (const key of Object.keys(values)) if (!hasProperty(freshValues, key)) deleteProperty(values, key);
-		for (const key of Object.keys(freshValues)) setProperty(values, key, getProperty(freshValues, key));
-		errors.splice(0, errors.length, ...klona(initialErrors));
-		touchedFields.clear();
-		dirtyFields.clear();
+	function reset(nextValues, nextErrors) {
+		generation++;
+		fieldValidationCycleMap.clear();
+		validatingFieldCounts.clear();
+		validatingFields.clear();
+		if (nextValues) {
+			const freshValues = klona(nextValues);
+			for (const key of Object.keys(initialValues)) deleteProperty(initialValues, key);
+			Object.assign(initialValues, freshValues);
+		}
+		if (nextErrors) initialErrors.splice(0, initialErrors.length, ...klona(nextErrors));
+		for (const key of Object.keys(values)) deleteProperty(values, key);
+		Object.assign(values, klona(initialValues));
+		replaceErrors(klona(initialErrors));
+		unmarkAllFieldsAsTouched();
+		unmarkAllFieldsAsDirty();
 	}
-	return markRaw({
-		get initialErrors() {
-			return initialErrors;
-		},
-		get initialValues() {
-			return initialValues;
-		},
-		validateOn,
-		validationMode,
-		setValue,
-		values,
-		isTouched,
-		touchedFields,
-		touchField,
-		dirtyField,
-		dirtyFields,
-		isDirty,
+	return reactive({
 		clearErrors,
+		dirtyFields,
 		errors,
-		errorsMap,
 		getFieldErrors,
-		setError,
-		setErrors,
+		isDirty,
+		isSubmitting,
+		isTouched,
 		isValid,
 		isValidating,
+		markAllFieldsAsDirty,
+		markAllFieldsAsTouched,
+		markFieldAsDirty,
+		markFieldAsTouched,
+		replaceErrors,
+		reset,
+		setError,
+		setValue,
+		submit,
+		syncAllDirtyStates,
+		syncDirtyState,
+		touchedFields,
+		unmarkAllFieldsAsDirty,
+		unmarkAllFieldsAsTouched,
+		unmarkFieldAsDirty,
+		unmarkFieldAsTouched,
 		validate,
 		validateField,
-		isSubmitting,
-		submit,
-		reset
+		validatingFields,
+		values
 	});
 }
 //#endregion
+//#region src/composables/use-not-form.ts
+/**
+* Creates a form instance and returns the public {@linkcode NotFormAPI}.
+* @template TSchema The form schema.
+* @param config Schema, initial values/errors, and submit handler.
+* @returns Public form API. Child components still inject the full instance via `<NotForm>`.
+*/
+function useNotForm(config) {
+	return createNotFormInstance(config);
+}
+//#endregion
 export { not_array_field_default as NotArrayField, not_field_default as NotField, not_form_default as NotForm, not_message_default as NotMessage, useNotForm };