@rebasepro/forms 0.23.0 → 0.24.1-canary.g56af4a4

package/dist/Formex.d.ts

@@ -5,3 +5,25 @@ export declare const Formex: <T = any>({ value, children }: {
     value: FormexController<T>;
     children: React.ReactNode;
 }) => React.JSX.Element;
+/**
+ * A slice of the enclosing form's controller. The caller re-renders when the
+ * slice changes — judged by `isEqual` — and not on every change to the form,
+ * which is what {@link useFormex} does.
+ *
+ * `selector` and `isEqual` are keys: pass stable functions (module-level, or
+ * `useCallback`), or the slice is recomputed on every render.
+ *
+ * @internal Exported for `@rebasepro/cms`'s field bindings, so a keystroke in a
+ * record form re-renders the field it went into and not every field. Not part
+ * of the supported API; use {@link useFormex}.
+ */
+export declare function useFormexSelector<S, T = any>(selector: (controller: FormexController<T>) => S, isEqual?: (a: S, b: S) => boolean): S;
+/**
+ * The enclosing form's controller as it is now, read without subscribing to
+ * it: for event handlers and effects of a component that renders from
+ * {@link useFormexSelector}. The function itself never changes.
+ *
+ * @internal Exported for `@rebasepro/cms`'s field bindings. Use
+ * {@link useFormex}.
+ */
+export declare function useFormexGetter<T = any>(): () => FormexController<T>;

package/dist/index.d.ts

@@ -3,3 +3,4 @@ export * from "./Formex.js";
 export * from "./types.js";
 export * from "./utils.js";
 export * from "./useCreateFormex.js";
+export * from "./rebase.js";

package/dist/index.es.js

@@ -1,20 +1,94 @@
 import * as React$1 from "react";
-import React, { useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import React, { useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
 import { jsx } from "react/jsx-runtime";
 import { deepEqual } from "fast-equals";
 //#region src/Formex.tsx
 var FormexContext = React.createContext(null);
+var FormexStoreContext = React.createContext(null);
+function createFormexStore(controller) {
+	const listeners = /* @__PURE__ */ new Set();
+	const store = {
+		controller,
+		listeners,
+		subscribe: (listener) => {
+			listeners.add(listener);
+			return () => {
+				listeners.delete(listener);
+			};
+		},
+		getController: () => store.controller
+	};
+	return store;
+}
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
 var useFormex = () => {
 	const ctx = useContext(FormexContext);
 	if (!ctx) throw new Error("useFormex must be used within a Formex provider");
 	return ctx;
 };
 var Formex = ({ value, children }) => {
+	const [store] = useState(() => createFormexStore(value));
+	store.controller = value;
+	useIsomorphicLayoutEffect(() => {
+		for (const listener of Array.from(store.listeners)) listener();
+	}, [store, value]);
 	return /* @__PURE__ */ jsx(FormexContext.Provider, {
 		value,
-		children
+		children: /* @__PURE__ */ jsx(FormexStoreContext.Provider, {
+			value: store,
+			children
+		})
 	});
 };
+function useFormexStore() {
+	const store = useContext(FormexStoreContext);
+	if (!store) throw new Error("useFormex must be used within a Formex provider");
+	return store;
+}
+/**
+* A slice of the enclosing form's controller. The caller re-renders when the
+* slice changes — judged by `isEqual` — and not on every change to the form,
+* which is what {@link useFormex} does.
+*
+* `selector` and `isEqual` are keys: pass stable functions (module-level, or
+* `useCallback`), or the slice is recomputed on every render.
+*
+* @internal Exported for `@rebasepro/cms`'s field bindings, so a keystroke in a
+* record form re-renders the field it went into and not every field. Not part
+* of the supported API; use {@link useFormex}.
+*/
+function useFormexSelector(selector, isEqual = Object.is) {
+	const store = useFormexStore();
+	const getSelection = useMemo(() => {
+		let memo;
+		return () => {
+			const controller = store.controller;
+			if (memo && memo.controller === controller) return memo.selection;
+			const selection = selector(controller);
+			memo = {
+				controller,
+				selection: memo && isEqual(memo.selection, selection) ? memo.selection : selection
+			};
+			return memo.selection;
+		};
+	}, [
+		store,
+		selector,
+		isEqual
+	]);
+	return useSyncExternalStore(store.subscribe, getSelection, getSelection);
+}
+/**
+* The enclosing form's controller as it is now, read without subscribing to
+* it: for event handlers and effects of a component that renders from
+* {@link useFormexSelector}. The function itself never changes.
+*
+* @internal Exported for `@rebasepro/cms`'s field bindings. Use
+* {@link useFormex}.
+*/
+function useFormexGetter() {
+	return useFormexStore().getController;
+}
 //#endregion
 //#region src/utils.ts
 /** @private is the value an empty array? */
@@ -146,8 +220,76 @@ var getFieldProps = (nameOrOptions, formex) => {
 	return field;
 };
 //#endregion
+//#region src/rebase.ts
+/**
+* Only plain objects are merged key by key. Arrays, dates and class instances
+* (a reference, a geopoint, a vector) are values: an edit to one replaces it
+* whole, so two edits to one are a conflict rather than something to splice.
+*/
+function isPlainObject(value) {
+	if (value === null || typeof value !== "object") return false;
+	const proto = Object.getPrototypeOf(value);
+	return proto === Object.prototype || proto === null;
+}
+function merge(previous, next, current, path, conflicts) {
+	if (deepEqual(current, previous)) return next;
+	if (deepEqual(next, previous)) return current;
+	if (deepEqual(current, next)) return current;
+	if (isPlainObject(previous) && isPlainObject(next) && isPlainObject(current)) {
+		const merged = {};
+		const keys = /* @__PURE__ */ new Set([
+			...Object.keys(previous),
+			...Object.keys(next),
+			...Object.keys(current)
+		]);
+		for (const key of keys) {
+			const value = merge(previous[key], next[key], current[key], [...path, key], conflicts);
+			if (value === void 0 && !(key in current) && !(key in next)) continue;
+			merged[key] = value;
+		}
+		return merged;
+	}
+	conflicts.push(path.join("."));
+	return current;
+}
+/**
+* Rebase an edit onto a baseline that moved under it — a three-way merge of
+* the form's values against the old and new baselines.
+*
+* - a field the edit left alone takes the new baseline's value;
+* - a field the edit changed keeps the edit;
+* - a field both changed keeps the edit and is listed in `conflicts`, by its
+*   dotted path.
+*
+* Plain objects are merged field by field, so an edit to `seo.slug` and a
+* change to `seo.description` elsewhere both survive. Arrays and other values
+* are compared whole.
+*
+* @group Form
+*/
+function rebaseEdits(previousBaseline, nextBaseline, current) {
+	const conflicts = [];
+	return {
+		values: merge(previousBaseline, nextBaseline, current, [], conflicts),
+		conflicts
+	};
+}
+//#endregion
 //#region src/useCreateFormex.tsx
-function useCreateFormex({ initialValues, initialModifiedValues, initialErrors, initialDirty, initialTouched, validation, validateOnChange = false, validateOnInitialRender = false, onSubmit, onReset, onValuesChangeDeferred, debugId }) {
+/**
+* How many steps {@link FormexController.undo} can go back. Every edit pushes a
+* snapshot of the whole values, so an unbounded history grew by one copy per
+* keystroke for as long as the form stayed open — 43.5 MB after 10,000
+* keystrokes inside a 500-item array — and every re-baseline re-merged all of
+* it. The oldest steps are dropped past this.
+*/
+var FORMEX_MAX_UNDO_STEPS = 200;
+/** The history with at most {@link FORMEX_MAX_UNDO_STEPS} steps behind its last entry. */
+function capHistory(history) {
+	const excess = history.length - 201;
+	return excess > 0 ? history.slice(excess) : history;
+}
+function useCreateFormex({ initialValues, initialModifiedValues, initialErrors, initialDirty, initialTouched, validation, validateOnChange = false, validateOnInitialRender = false, onSubmit, beforeSubmit, onReset, onValuesChangeDeferred, onBaselineConflict, debugId }) {
 	const startValues = initialModifiedValues ?? initialValues;
 	const initialValuesRef = useRef(initialValues);
 	const valuesRef = useRef(startValues);
@@ -164,6 +306,18 @@ function useCreateFormex({ initialValues, initialModifiedValues, initialErrors,
 	const [version, setVersion] = useState(0);
 	const onValuesChangeRef = useRef(onValuesChangeDeferred);
 	onValuesChangeRef.current = onValuesChangeDeferred;
+	const onBaselineConflictRef = useRef(onBaselineConflict);
+	onBaselineConflictRef.current = onBaselineConflict;
+	const validationRef = useRef(validation);
+	validationRef.current = validation;
+	const onSubmitRef = useRef(onSubmit);
+	onSubmitRef.current = onSubmit;
+	const beforeSubmitRef = useRef(beforeSubmit);
+	beforeSubmitRef.current = beforeSubmit;
+	const onResetRef = useRef(onReset);
+	onResetRef.current = onReset;
+	const initialTouchedRef = useRef(initialTouched);
+	initialTouchedRef.current = initialTouched;
 	const debounceTimeoutRef = useRef(void 0);
 	const callDebouncedOnValuesChange = useCallback((values) => {
 		if (onValuesChangeRef.current) {
@@ -181,8 +335,8 @@ function useCreateFormex({ initialValues, initialModifiedValues, initialErrors,
 	const pushHistory = useCallback((entry) => {
 		const newHistory = historyRef.current.slice(0, historyIndexRef.current + 1);
 		newHistory.push(entry);
-		historyRef.current = newHistory;
-		historyIndexRef.current = newHistory.length - 1;
+		historyRef.current = capHistory(newHistory);
+		historyIndexRef.current = historyRef.current.length - 1;
 	}, []);
 	useEffect(() => {
 		if (validateOnInitialRender) validate();
@@ -196,16 +350,17 @@ function useCreateFormex({ initialValues, initialModifiedValues, initialErrors,
 	}, [callDebouncedOnValuesChange, pushHistory]);
 	const validate = useCallback(async () => {
 		setIsValidating(true);
-		const validationErrors = await validation?.(valuesRef.current);
+		const validationErrors = await validationRef.current?.(valuesRef.current);
 		setErrors(validationErrors ?? {});
 		setIsValidating(false);
 		return validationErrors;
-	}, [validation]);
+	}, []);
 	const setFieldValue = useCallback((key, value, shouldValidate) => {
 		const newValues = setIn(valuesRef.current, key, value);
 		valuesRef.current = newValues;
 		setValuesInner(newValues);
 		if (!deepEqual(getIn(initialValuesRef.current, key), value)) setDirty(true);
+		else setDirty(!deepEqual(initialValuesRef.current, newValues));
 		if (shouldValidate) validate();
 		pushHistory({ values: newValues });
 		callDebouncedOnValuesChange(newValues);
@@ -252,21 +407,22 @@ function useCreateFormex({ initialValues, initialModifiedValues, initialErrors,
 		e?.stopPropagation();
 		setIsSubmitting(true);
 		setSubmitCount((prev) => prev + 1);
-		const validationErrors = await validation?.(valuesRef.current);
+		await beforeSubmitRef.current?.();
+		const validationErrors = await validationRef.current?.(valuesRef.current);
 		if (validationErrors && Object.keys(validationErrors).length > 0) setErrors(validationErrors);
 		else {
 			setErrors({});
-			await onSubmit?.(valuesRef.current, controllerRef.current);
+			await onSubmitRef.current?.(valuesRef.current, controllerRef.current);
 		}
 		setIsSubmitting(false);
 		setVersion((prev) => prev + 1);
-	}, [onSubmit, validation]);
+	}, []);
 	const resetForm = useCallback((props) => {
 		const { submitCount: submitCountProp, values: valuesProp, errors: errorsProp, touched: touchedProp, undoable } = props ?? {};
 		const priorValues = valuesRef.current;
 		const priorTouched = touchedRef.current;
 		const nextValues = valuesProp ?? initialValuesRef.current;
-		const nextTouched = touchedProp ?? initialTouched ?? {};
+		const nextTouched = touchedProp ?? initialTouchedRef.current ?? {};
 		valuesRef.current = nextValues;
 		initialValuesRef.current = nextValues;
 		setValuesInner(nextValues);
@@ -275,7 +431,7 @@ function useCreateFormex({ initialValues, initialModifiedValues, initialErrors,
 		setDirty(false);
 		setSubmitCount(submitCountProp ?? 0);
 		setVersion((prev) => prev + 1);
-		onReset?.(controllerRef.current);
+		onResetRef.current?.(controllerRef.current);
 		if (undoable) {
 			const kept = historyRef.current.slice(0, historyIndexRef.current + 1);
 			kept[kept.length - 1] = {
@@ -287,13 +443,13 @@ function useCreateFormex({ initialValues, initialModifiedValues, initialErrors,
 				touched: nextTouched,
 				boundary: true
 			});
-			historyRef.current = kept;
-			historyIndexRef.current = kept.length - 1;
+			historyRef.current = capHistory(kept);
+			historyIndexRef.current = historyRef.current.length - 1;
 		} else {
 			historyRef.current = [{ values: nextValues }];
 			historyIndexRef.current = 0;
 		}
-	}, [onReset, initialTouched]);
+	}, []);
 	/**
 	* The `initialValues` prop moved: the record this form edits finished
 	* loading, or was replaced. That is a **re-baseline**, not a reset.
@@ -310,15 +466,30 @@ function useCreateFormex({ initialValues, initialModifiedValues, initialErrors,
 	* - it overwrote `values`, so anything typed while the record was still
 	*   loading was thrown away without a word.
 	*
-	* So: move the baseline, leave the edit alone, and re-judge one against
-	* the other. Only an untouched form follows the baseline to its new value.
+	* So: move the baseline, and rebase the edit onto it. Leaving the edit
+	* alone *whole* was the next bug: it kept the old value of every field the
+	* user never touched, and save — which writes the difference from the live
+	* record — wrote those old values back, silently reverting whatever someone
+	* else had just changed. So a field the edit left alone follows the new
+	* baseline, a field it changed keeps the edit, and a field both changed
+	* keeps the edit and is reported through `onBaselineConflict`.
 	*/
 	useEffect(() => {
 		if (deepEqual(initialValuesRef.current, initialValues)) return;
-		const modified = !deepEqual(initialValuesRef.current, valuesRef.current);
+		const previousBaseline = initialValuesRef.current;
+		const modified = !deepEqual(previousBaseline, valuesRef.current);
 		initialValuesRef.current = initialValues;
-		if (modified) setDirty(!deepEqual(initialValues, valuesRef.current));
-		else {
+		if (modified) {
+			const { values: rebased, conflicts } = rebaseEdits(previousBaseline, initialValues, valuesRef.current);
+			valuesRef.current = rebased;
+			setValuesInner(rebased);
+			historyRef.current = historyRef.current.map((entry) => ({
+				...entry,
+				values: rebaseEdits(previousBaseline, initialValues, entry.values).values
+			}));
+			setDirty(!deepEqual(initialValues, rebased));
+			if (conflicts.length > 0) onBaselineConflictRef.current?.(conflicts, controllerRef.current);
+		} else {
 			valuesRef.current = initialValues;
 			setValuesInner(initialValues);
 			historyRef.current = [{ values: initialValues }];
@@ -402,6 +573,6 @@ function useCreateFormex({ initialValues, initialModifiedValues, initialErrors,
 	return controller;
 }
 //#endregion
-export { Field, Formex, clone, getIn, isEmptyArray, isFunction, isInteger, isNaN, isObject, pathTraversesPrototype, setIn, useCreateFormex, useFormex };
+export { FORMEX_MAX_UNDO_STEPS, Field, Formex, clone, getIn, isEmptyArray, isFunction, isInteger, isNaN, isObject, pathTraversesPrototype, rebaseEdits, setIn, useCreateFormex, useFormex, useFormexGetter, useFormexSelector };
 
 //# sourceMappingURL=index.es.js.map

package/dist/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","names":[],"sources":["../src/Formex.tsx","../src/utils.ts","../src/Field.tsx","../src/useCreateFormex.tsx"],"sourcesContent":["import React, { useContext } from \"react\";\nimport { FormexController } from \"./types\";\n\n\nconst FormexContext = React.createContext<FormexController<any> | null>(null);\n\nexport const useFormex = <T = any>() => {\n    const ctx = useContext(FormexContext);\n    if (!ctx) throw new Error(\"useFormex must be used within a Formex provider\");\n    return ctx as FormexController<T>;\n};\n\nexport const Formex = <T = any>({ value, children }: { value: FormexController<T>, children: React.ReactNode }) => {\n    return <FormexContext.Provider value={value}>{children}</FormexContext.Provider>;\n};\n","/** @private is the value an empty array? */\nexport const isEmptyArray = (value?: unknown) =>\n    Array.isArray(value) && value.length === 0;\n\n/** @private is the given object a Function? */\n\nexport const isFunction = (obj: unknown): obj is Function =>\n    typeof obj === \"function\";\n\n/** @private is the given object an Object? */\nexport const isObject = (obj: unknown): obj is Record<string, unknown> =>\n    obj !== null && typeof obj === \"object\";\n\n/** @private is the given object an integer? */\nexport const isInteger = (obj: unknown): boolean =>\n    String(Math.floor(Number(obj))) === obj;\n\n/** @private is the given object a NaN? */\n\nexport const isNaN = (obj: unknown): boolean => obj !== obj;\n\n/**\n * Deeply get a value from an object via its path.\n */\nexport function getIn(\n    obj: unknown,\n    key: string | string[],\n    def?: unknown,\n    p = 0\n): unknown {\n    // The read counterpart. `getIn(values, \"constructor.prototype\")` handing\n    // back `Object.prototype` is how a polluted value gets read back out, and\n    // how a form comes to render one.\n    if (pathTraversesPrototype(key)) return def;\n\n    const path = toPath(key);\n    let current: unknown = obj;\n    while (current && p < path.length) {\n        current = (current as Record<string, unknown>)[path[p++]];\n    }\n\n    // check if path is not in the end\n    if (p !== path.length && !current) {\n        return def;\n    }\n\n    return current === undefined ? def : current;\n}\n\nexport function setIn(obj: unknown, path: string, value: unknown): unknown {\n    // Refused rather than sanitised: there is no legitimate reading of a form\n    // field whose path names the prototype chain, and silently rewriting the\n    // path would write the value somewhere the caller did not ask for.\n    // Returning the original object is what every other no-op in this function\n    // does.\n    if (pathTraversesPrototype(path)) return obj;\n\n    const res = clone(obj) as Record<string, unknown>; // this keeps inheritance when obj is a class\n    let resVal: Record<string, unknown> = res;\n    let i = 0;\n    const pathArray = toPath(path);\n\n    for (; i < pathArray.length - 1; i++) {\n        const currentPath: string = pathArray[i];\n        const currentObj = getIn(obj, pathArray.slice(0, i + 1));\n\n        if (currentObj && (isObject(currentObj) || Array.isArray(currentObj))) {\n            resVal = resVal[currentPath] = clone(currentObj) as Record<string, unknown>;\n        } else {\n            const nextPath: string = pathArray[i + 1];\n            resVal = resVal[currentPath] =\n                (isInteger(nextPath) && Number(nextPath) >= 0 ? [] : {}) as Record<string, unknown>;\n        }\n    }\n\n    // Return original object if new value is the same as current\n    if ((i === 0 ? (obj as Record<string, unknown>) : resVal)[pathArray[i]] === value) {\n        return obj;\n    }\n\n    if (value === undefined) {\n        delete resVal[pathArray[i]];\n    } else {\n        resVal[pathArray[i]] = value;\n    }\n\n    // If the path array has a single element, the loop did not run.\n    // Deleting on `resVal` had no effect in this scenario, so we delete on the result instead.\n    if (i === 0 && value === undefined) {\n        delete res[pathArray[i]];\n    }\n\n    return res;\n}\n\nexport function clone(value: unknown): unknown {\n    if (Array.isArray(value)) {\n        return [...value];\n    } else if (typeof value === \"object\" && value !== null) {\n        // Preserve class instances (EntityReference, GeoPoint, etc.) - don't spread them\n        if (Object.getPrototypeOf(value) !== Object.prototype) {\n            return value;\n        }\n        return { ...(value as Record<string, unknown>) };\n    } else {\n        return value; // This is for primitive types which do not need cloning.\n    }\n}\n\n/**\n * Segments that reach the prototype chain rather than a property of the object.\n *\n * `res[\"__proto__\"] = x` is a setter for the object's prototype, not an own\n * property, so a path of `__proto__.polluted` wrote straight onto\n * `Object.prototype` and gave every object in the process a `polluted`\n * property. `constructor.prototype.x` arrived by a second route, and\n * `__proto__.0` did it to arrays.\n *\n * These are paths, and a path here is a property key — which for a map property\n * or a column mapped out of an imported CSV is data, not code.\n */\nconst UNSAFE_PATH_SEGMENTS = new Set([\"__proto__\", \"constructor\", \"prototype\"]);\n\n/** Whether any segment of this path would traverse the prototype chain. */\nexport function pathTraversesPrototype(path: string | string[]): boolean {\n    return toPath(path).some(segment => UNSAFE_PATH_SEGMENTS.has(segment));\n}\n\nfunction toPath(value: string | string[]) {\n    if (Array.isArray(value)) return value; // Already in path array form.\n    // Replace brackets with dots, remove leading/trailing dots, then split by dot.\n    return value.replace(/\\[(\\d+)]/g, \".$1\").replace(/^\\./, \"\").replace(/\\.$/, \"\").split(\".\");\n}\n","import * as React from \"react\";\nimport { useFormex } from \"./Formex\";\nimport { getIn, isFunction, isObject } from \"./utils\";\nimport { FormexController } from \"./types\";\n\nexport interface FieldInputProps<Value> {\n    /** Value of the field */\n    value: Value;\n    /** Name of the field */\n    name: string;\n    /** Multiple select? */\n    multiple?: boolean;\n    /** Is the field checked? */\n    checked?: boolean;\n    /** Change event handler */\n    onChange: (event: React.SyntheticEvent) => void,\n    /** Blur event handler */\n    onBlur: (event: React.FocusEvent) => void,\n}\n\nexport interface FormexFieldProps<Value = any, FormValues extends object = object> {\n    field: FieldInputProps<Value>;\n    form: FormexController<FormValues>;\n}\n\nexport interface FieldConfig<Value, C extends React.ElementType | undefined = undefined> {\n\n    /**\n     * Component to render. Can either be a string e.g. 'select', 'input', or 'textarea', or a component.\n     */\n    as?:\n        | C\n        | string\n        | React.ForwardRefExoticComponent<Record<string, unknown>>;\n\n    /**\n     * Children render function <Field name>{props => ...}</Field>)\n     */\n    children?: ((props: FormexFieldProps<Value>) => React.ReactNode) | React.ReactNode;\n\n    /**\n     * Validate a single field value independently\n     */\n    // validate?: FieldValidator;\n\n    /**\n     * Used for 'select' and related input types.\n     */\n    multiple?: boolean;\n\n    /**\n     * Field name\n     */\n    name: string;\n\n    /** HTML input type */\n    type?: string;\n\n    /** Field value */\n    value?: unknown;\n\n    /** Inner ref */\n    innerRef?: (instance: unknown) => void;\n\n}\n\nexport type FieldProps<T, C extends React.ElementType | undefined> = {\n    as?: C;\n} & (C extends React.ElementType ? (React.ComponentProps<C> & FieldConfig<T, C>) : FieldConfig<T, C>);\n\nexport function Field<T, C extends React.ElementType | undefined = undefined>({\n                                                                                  validate,\n                                                                                  name,\n                                                                                  children,\n                                                                                  as: is, // `as` is reserved in typescript lol\n                                                                                  // component,\n                                                                                  className,\n                                                                                  ...props\n                                                                              }: FieldProps<T, C>) {\n    const formex = useFormex();\n\n    const field = getFieldProps({ name,\n...props }, formex);\n\n    if (isFunction(children)) {\n        return children({ field,\nform: formex });\n    }\n\n    // if (component) {\n    //     if (typeof component === \"string\") {\n    //         const { innerRef, ...rest } = props;\n    //         return React.createElement(\n    //             component,\n    //             { ref: innerRef, ...field, ...rest, className },\n    //             children\n    //         );\n    //     }\n    //     return React.createElement(\n    //         component,\n    //         { field, form: formex, ...props, className },\n    //         children\n    //     );\n    // }\n\n    // default to input here so we can check for both `as` and `children` above\n    const asElement = is || \"input\";\n\n    if (typeof asElement === \"string\") {\n        const { innerRef, ...rest } = props;\n        return React.createElement(\n            asElement,\n            { ref: innerRef,\n...field,\n...rest,\nclassName },\n            children\n        );\n    }\n\n    return React.createElement(asElement, { ...field,\n...props,\nclassName }, children);\n}\n\nconst getFieldProps = (nameOrOptions: string | FieldConfig<unknown>, formex: FormexController<object>): FieldInputProps<unknown> => {\n    const name: string = typeof nameOrOptions === \"string\"\n        ? nameOrOptions\n        : nameOrOptions.name;\n    const valueState = getIn(formex.values as Record<string, unknown>, name);\n\n    const field: FieldInputProps<unknown> = {\n        name: name as string,\n        value: valueState,\n        onChange: formex.handleChange,\n        onBlur: formex.handleBlur\n    };\n    if (typeof nameOrOptions !== \"string\") {\n        const {\n            type,\n            value: valueProp, // value is special for checkboxes\n            as: is,\n            multiple\n        } = nameOrOptions as FieldConfig<unknown>;\n\n        if (type === \"checkbox\") {\n            if (valueProp === undefined) {\n                field.checked = !!valueState;\n            } else {\n                field.checked = !!(\n                    Array.isArray(valueState) && ~valueState.indexOf(valueProp)\n                );\n                field.value = valueProp;\n            }\n        } else if (type === \"radio\") {\n            field.checked = valueState === valueProp;\n            field.value = valueProp;\n        } else if (is === \"select\" && multiple) {\n            field.value = field.value || [];\n            field.multiple = true;\n        }\n    }\n    return field;\n};\n","import React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { getIn, setIn } from \"./utils\";\nimport { deepEqual as equal } from \"fast-equals\";\n\nimport { FormexController, FormexResetProps } from \"./types\";\n\n/**\n * One step of the form's undo history.\n *\n * `touched` and `boundary` are set only on the pair of entries an undoable\n * reset writes — the state it replaced and the state it produced. A reset\n * clears the touched map and bumps `version`, so a step across that pair has to\n * put both back. Ordinary edits leave both unset on purpose: undoing a\n * keystroke should not re-seed every field in the form.\n */\ntype FormexHistoryEntry<T> = {\n    values: T;\n    touched?: Record<string, boolean>;\n    boundary?: boolean;\n};\n\nexport function useCreateFormex<T = any>({\n    initialValues,\n    initialModifiedValues,\n    initialErrors,\n    initialDirty,\n    initialTouched,\n    validation,\n    validateOnChange = false,\n    validateOnInitialRender = false,\n    onSubmit,\n    onReset,\n    onValuesChangeDeferred,\n    debugId\n}: {\n    /**\n     * The **baseline**: what the values are stored as. Everything the form\n     * calls \"dirty\" is a difference from this, so it has to be the stored\n     * record and nothing else. To open a form already carrying an edit, pass\n     * that edit as {@link initialModifiedValues} — folding it into\n     * `initialValues` instead makes the baseline agree with the edit, and then\n     * nothing can tell that the edit is unsaved.\n     */\n    initialValues: T;\n    /**\n     * What the form should *show* on its first render, when that is not the\n     * baseline — an edit handed over from somewhere else, a draft restored\n     * from a cache. Dirty is computed from the difference.\n     */\n    initialModifiedValues?: T;\n    initialErrors?: Record<string, string>;\n    /**\n     * Force the starting dirty state. Only for callers that know the form\n     * opens modified but cannot supply the modified values; prefer\n     * {@link initialModifiedValues}, which lets it be derived.\n     */\n    initialDirty?: boolean;\n    initialTouched?: Record<string, boolean>;\n    validateOnChange?: boolean;\n    validateOnInitialRender?: boolean;\n    validation?: (\n        values: T\n    ) =>\n        | Record<string, string>\n        | Promise<Record<string, string>>\n        | undefined\n        | void;\n    onValuesChangeDeferred?: (values: T, controller: FormexController<T>) => void;\n    onSubmit?: (values: T, controller: FormexController<T>) => void | Promise<void>;\n    onReset?: (controller: FormexController<T>) => void | Promise<void>;\n    debugId?: string;\n}): FormexController<T> {\n    // The baseline and the current values start apart when the form opens\n    // already carrying an edit. Keeping them separate is what lets the dirty\n    // flag be *derived* rather than asserted, and what lets the baseline be\n    // replaced later without touching what the user is looking at.\n    const startValues = initialModifiedValues ?? initialValues;\n\n    const initialValuesRef = useRef<T>(initialValues);\n    const valuesRef = useRef<T>(startValues);\n    const debugIdRef = useRef<string | undefined>(debugId);\n\n    const [values, setValuesInner] = useState<T>(startValues);\n    const [touchedState, setTouchedState] = useState<Record<string, boolean>>(initialTouched ?? {});\n    // Read by `resetForm`, which needs the map as it stands at the moment it is\n    // about to clear it. Assigned during render rather than from an effect, so\n    // an event handler can never read one render's worth of stale state.\n    const touchedRef = useRef<Record<string, boolean>>(touchedState);\n    touchedRef.current = touchedState;\n    const [errors, setErrors] = useState<Record<string, string>>(initialErrors ?? {});\n    const [dirty, setDirty] = useState(initialDirty ?? !equal(initialValues, startValues));\n    const [submitCount, setSubmitCount] = useState(0);\n    const [isSubmitting, setIsSubmitting] = useState(false);\n    const [isValidating, setIsValidating] = useState(false);\n    const [version, setVersion] = useState(0);\n\n    const onValuesChangeRef = useRef(onValuesChangeDeferred);\n    onValuesChangeRef.current = onValuesChangeDeferred;\n    const debounceTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n\n    const callDebouncedOnValuesChange = useCallback((values: T) => {\n        if (onValuesChangeRef.current) {\n            if (debounceTimeoutRef.current) {\n                clearTimeout(debounceTimeoutRef.current);\n            }\n            debounceTimeoutRef.current = setTimeout(() => {\n                onValuesChangeRef.current?.(values, controllerRef.current);\n            }, 300);\n        }\n    }, []);\n\n    // Replace state for history with refs\n    const historyRef = useRef<FormexHistoryEntry<T>[]>([{ values: startValues }]);\n    const historyIndexRef = useRef<number>(0);\n\n    /**\n     * Record a new state, dropping anything that had been undone past it.\n     */\n    const pushHistory = useCallback((entry: FormexHistoryEntry<T>) => {\n        const newHistory = historyRef.current.slice(0, historyIndexRef.current + 1);\n        newHistory.push(entry);\n        historyRef.current = newHistory;\n        historyIndexRef.current = newHistory.length - 1;\n    }, []);\n\n    useEffect(() => {\n        if (validateOnInitialRender) {\n            validate();\n        }\n    }, []);\n\n    const setValues = useCallback((newValues: T) => {\n        valuesRef.current = newValues;\n        setValuesInner(newValues);\n        setDirty(!equal(initialValuesRef.current, newValues));\n        pushHistory({ values: newValues });\n        callDebouncedOnValuesChange(newValues);\n    }, [callDebouncedOnValuesChange, pushHistory]);\n\n    const validate = useCallback(async () => {\n        setIsValidating(true);\n        const validationErrors = await validation?.(valuesRef.current);\n        setErrors(validationErrors ?? {});\n        setIsValidating(false);\n        return validationErrors;\n    }, [validation]);\n\n    const setFieldValue = useCallback(\n        (key: string, value: unknown, shouldValidate?: boolean) => {\n            const newValues = setIn(valuesRef.current as Record<string, unknown>, key, value) as T;\n            valuesRef.current = newValues;\n            setValuesInner(newValues);\n            if (!equal(getIn(initialValuesRef.current as Record<string, unknown>, key), value)) {\n                setDirty(true);\n            }\n            if (shouldValidate) {\n                validate();\n            }\n            pushHistory({ values: newValues });\n            callDebouncedOnValuesChange(newValues);\n        },\n        [validate, callDebouncedOnValuesChange, pushHistory]\n    );\n\n    const setFieldError = useCallback((key: string, error: string | undefined) => {\n        setErrors((prevErrors: Record<string, string>) => {\n            const newErrors = { ...prevErrors };\n            if (error) {\n                newErrors[key] = error;\n            } else {\n                delete newErrors[key];\n            }\n            return newErrors;\n        });\n    }, []);\n\n    const setFieldTouched = useCallback(\n        (key: string, touched: boolean, shouldValidate?: boolean) => {\n            setTouchedState((prev: Record<string, boolean>) => ({\n                ...prev,\n                [key]: touched\n            }));\n            if (shouldValidate) {\n                validate();\n            }\n        },\n        [validate]\n    );\n\n    const handleChange = useCallback(\n        (event: React.SyntheticEvent) => {\n            const target = event.target as HTMLInputElement;\n            let value;\n            if (target.type === \"checkbox\") {\n                value = target.checked;\n            } else if (target.type === \"number\") {\n                value = target.valueAsNumber;\n            } else {\n                value = target.value;\n            }\n            const name = target.name;\n            setFieldValue(name, value, validateOnChange);\n            setFieldTouched(name, true);\n        },\n        [setFieldValue, setFieldTouched, validateOnChange]\n    );\n\n    const handleBlur = useCallback((event: React.FocusEvent) => {\n        const target = event.target as HTMLInputElement;\n        const name = target.name;\n        setFieldTouched(name, true);\n    }, [setFieldTouched]);\n\n    const submit = useCallback(\n        async (e?: React.FormEvent<HTMLFormElement>) => {\n            e?.preventDefault();\n            e?.stopPropagation();\n            setIsSubmitting(true);\n            setSubmitCount((prev: number) => prev + 1);\n            const validationErrors = await validation?.(valuesRef.current);\n            if (validationErrors && Object.keys(validationErrors).length > 0) {\n                setErrors(validationErrors);\n            } else {\n                setErrors({});\n                await onSubmit?.(valuesRef.current, controllerRef.current);\n            }\n            setIsSubmitting(false);\n            setVersion((prev: number) => prev + 1);\n        },\n        [onSubmit, validation]\n    );\n\n    const resetForm = useCallback((props?: FormexResetProps<T>) => {\n        const {\n            submitCount: submitCountProp,\n            values: valuesProp,\n            errors: errorsProp,\n            touched: touchedProp,\n            undoable\n        } = props ?? {};\n        const priorValues = valuesRef.current;\n        const priorTouched = touchedRef.current;\n        const nextValues = valuesProp ?? initialValuesRef.current;\n        const nextTouched = touchedProp ?? initialTouched ?? {};\n        valuesRef.current = nextValues;\n        initialValuesRef.current = nextValues;\n        setValuesInner(nextValues);\n        setErrors(errorsProp ?? {});\n        setTouchedState(nextTouched);\n        setDirty(false);\n        setSubmitCount(submitCountProp ?? 0);\n        setVersion((prev: number) => prev + 1);\n        onReset?.(controllerRef.current);\n        if (undoable) {\n            // Keep what the user typed one step behind them. The entry stepped\n            // back into carries the touched map as well as the values: without\n            // it the values return but every field reads untouched, and a draft\n            // backup — which is extracted *through* the touched map — would come\n            // back empty.\n            const kept = historyRef.current.slice(0, historyIndexRef.current + 1);\n            kept[kept.length - 1] = { values: priorValues, touched: priorTouched };\n            kept.push({ values: nextValues, touched: nextTouched, boundary: true });\n            historyRef.current = kept;\n            historyIndexRef.current = kept.length - 1;\n        } else {\n            historyRef.current = [{ values: nextValues }];\n            historyIndexRef.current = 0;\n        }\n    }, [onReset, initialTouched]);\n\n    /**\n     * The `initialValues` prop moved: the record this form edits finished\n     * loading, or was replaced. That is a **re-baseline**, not a reset.\n     *\n     * It used to call `resetForm({ values: initialValues })`, which is a reset\n     * in both of the ways that matter, and both were wrong here:\n     *\n     * - it fired `onReset`, which callers reasonably read as \"the user\n     *   discarded their changes\". The admin clears the cache that seeds an\n     *   in-flight edit handed over from the side panel there, so a record's own\n     *   data arriving deleted the edit the form had just been opened with, and\n     *   the form then re-seeded itself from the server — an expanded record\n     *   silently lost whatever had been typed into it.\n     * - it overwrote `values`, so anything typed while the record was still\n     *   loading was thrown away without a word.\n     *\n     * So: move the baseline, leave the edit alone, and re-judge one against\n     * the other. Only an untouched form follows the baseline to its new value.\n     */\n    useEffect(() => {\n        if (equal(initialValuesRef.current, initialValues)) return;\n\n        const modified = !equal(initialValuesRef.current, valuesRef.current);\n        initialValuesRef.current = initialValues;\n\n        if (modified) {\n            setDirty(!equal(initialValues, valuesRef.current));\n        } else {\n            valuesRef.current = initialValues;\n            setValuesInner(initialValues);\n            historyRef.current = [{ values: initialValues }];\n            historyIndexRef.current = 0;\n            setDirty(false);\n        }\n        // Containers that read `values` off the controller key on `version`;\n        // a re-seed changes what they are holding just as a reset does.\n        setVersion((prev: number) => prev + 1);\n    }, [initialValues]);\n\n    const stepHistory = useCallback((newIndex: number) => {\n        const from = historyRef.current[historyIndexRef.current];\n        const entry = historyRef.current[newIndex];\n        const newValues = entry.values;\n        setValuesInner(newValues);\n        valuesRef.current = newValues;\n        historyIndexRef.current = newIndex;\n        setDirty(!equal(initialValuesRef.current, newValues));\n        if (entry.touched) {\n            setTouchedState(entry.touched);\n        }\n        // Stepping across a reset. The reset told everything reading `values`\n        // off the controller to re-read itself, so the way back has to say so\n        // too — otherwise a cleared markdown editor stays cleared while the\n        // value behind it is already back. Ordinary steps skip this.\n        if (from?.boundary || entry.boundary) {\n            setVersion((prev: number) => prev + 1);\n        }\n        callDebouncedOnValuesChange(newValues);\n    }, [callDebouncedOnValuesChange]);\n\n    const undo = useCallback(() => {\n        if (historyIndexRef.current > 0) {\n            stepHistory(historyIndexRef.current - 1);\n        }\n    }, [stepHistory]);\n\n    const redo = useCallback(() => {\n        if (historyIndexRef.current < historyRef.current.length - 1) {\n            stepHistory(historyIndexRef.current + 1);\n        }\n    }, [stepHistory]);\n\n    const controllerRef = useRef<FormexController<T>>({} as FormexController<T>);\n\n    const controller = useMemo<FormexController<T>>(\n        () => ({\n            values,\n            initialValues: initialValuesRef.current,\n            handleChange,\n            isSubmitting,\n            setSubmitting: setIsSubmitting,\n            setValues,\n            setFieldValue,\n            errors,\n            setFieldError,\n            touched: touchedState,\n            setFieldTouched,\n            setTouched: setTouchedState,\n            dirty,\n            setDirty,\n            handleSubmit: submit,\n            submitCount,\n            setSubmitCount,\n            handleBlur,\n            validate,\n            isValidating,\n            resetForm,\n            version,\n            debugId: debugIdRef.current,\n            undo,\n            redo,\n            canUndo: historyIndexRef.current > 0,\n            canRedo: historyIndexRef.current < historyRef.current.length - 1\n        }),\n        [\n            values,\n            errors,\n            touchedState,\n            dirty,\n            isSubmitting,\n            submitCount,\n            isValidating,\n            version,\n            handleChange,\n            handleBlur,\n            setValues,\n            setFieldValue,\n            setFieldTouched,\n            setTouchedState,\n            setFieldError,\n            validate,\n            submit,\n            resetForm,\n            undo,\n            redo\n        ]\n    );\n\n    useEffect(() => {\n        controllerRef.current = controller;\n    }, [controller]);\n\n    return controller;\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.es.js","names":[],"sources":["../src/Formex.tsx","../src/utils.ts","../src/Field.tsx","../src/rebase.ts","../src/useCreateFormex.tsx"],"sourcesContent":["import React, { useContext, useEffect, useLayoutEffect, useMemo, useState, useSyncExternalStore } from \"react\";\nimport { FormexController } from \"./types\";\n\n\nconst FormexContext = React.createContext<FormexController<any> | null>(null);\n\n/**\n * The controller a {@link Formex} provides, held where a component can read it\n * without subscribing to every change of it — which is what reading the\n * context does. See {@link useFormexSelector}.\n */\ntype FormexStore = {\n    controller: FormexController<any>;\n    readonly listeners: Set<() => void>;\n    readonly subscribe: (listener: () => void) => () => void;\n    readonly getController: () => FormexController<any>;\n};\n\nconst FormexStoreContext = React.createContext<FormexStore | null>(null);\n\nfunction createFormexStore(controller: FormexController<any>): FormexStore {\n    const listeners = new Set<() => void>();\n    const store: FormexStore = {\n        controller,\n        listeners,\n        subscribe: (listener) => {\n            listeners.add(listener);\n            return () => {\n                listeners.delete(listener);\n            };\n        },\n        getController: () => store.controller\n    };\n    return store;\n}\n\nconst useIsomorphicLayoutEffect = typeof window !== \"undefined\" ? useLayoutEffect : useEffect;\n\nexport const useFormex = <T = any>() => {\n    const ctx = useContext(FormexContext);\n    if (!ctx) throw new Error(\"useFormex must be used within a Formex provider\");\n    return ctx as FormexController<T>;\n};\n\nexport const Formex = <T = any>({ value, children }: { value: FormexController<T>, children: React.ReactNode }) => {\n    const [store] = useState(() => createFormexStore(value));\n    // During render rather than in an effect: a component this same render\n    // reaches — an array item mounting, a field whose props changed — has to\n    // read the controller it is being rendered with, not the one before it.\n    store.controller = value;\n    useIsomorphicLayoutEffect(() => {\n        // Before paint, so a field that subscribed to its own slice of the form\n        // shows a change in the same frame as everything that read the context.\n        for (const listener of Array.from(store.listeners)) listener();\n    }, [store, value]);\n    return <FormexContext.Provider value={value}>\n        <FormexStoreContext.Provider value={store}>{children}</FormexStoreContext.Provider>\n    </FormexContext.Provider>;\n};\n\nfunction useFormexStore(): FormexStore {\n    const store = useContext(FormexStoreContext);\n    if (!store) throw new Error(\"useFormex must be used within a Formex provider\");\n    return store;\n}\n\n/**\n * A slice of the enclosing form's controller. The caller re-renders when the\n * slice changes — judged by `isEqual` — and not on every change to the form,\n * which is what {@link useFormex} does.\n *\n * `selector` and `isEqual` are keys: pass stable functions (module-level, or\n * `useCallback`), or the slice is recomputed on every render.\n *\n * @internal Exported for `@rebasepro/cms`'s field bindings, so a keystroke in a\n * record form re-renders the field it went into and not every field. Not part\n * of the supported API; use {@link useFormex}.\n */\nexport function useFormexSelector<S, T = any>(\n    selector: (controller: FormexController<T>) => S,\n    isEqual: (a: S, b: S) => boolean = Object.is\n): S {\n    const store = useFormexStore();\n    const getSelection = useMemo(() => {\n        // Recomputed once per controller, and handed back unchanged while it is\n        // equal to the last one: `useSyncExternalStore` re-renders on identity.\n        let memo: { controller: FormexController<any>, selection: S } | undefined;\n        return () => {\n            const controller = store.controller;\n            if (memo && memo.controller === controller) return memo.selection;\n            const selection = selector(controller as FormexController<T>);\n            memo = { controller, selection: memo && isEqual(memo.selection, selection) ? memo.selection : selection };\n            return memo.selection;\n        };\n    }, [store, selector, isEqual]);\n    return useSyncExternalStore(store.subscribe, getSelection, getSelection);\n}\n\n/**\n * The enclosing form's controller as it is now, read without subscribing to\n * it: for event handlers and effects of a component that renders from\n * {@link useFormexSelector}. The function itself never changes.\n *\n * @internal Exported for `@rebasepro/cms`'s field bindings. Use\n * {@link useFormex}.\n */\nexport function useFormexGetter<T = any>(): () => FormexController<T> {\n    return useFormexStore().getController as () => FormexController<T>;\n}\n","/** @private is the value an empty array? */\nexport const isEmptyArray = (value?: unknown) =>\n    Array.isArray(value) && value.length === 0;\n\n/** @private is the given object a Function? */\n\nexport const isFunction = (obj: unknown): obj is Function =>\n    typeof obj === \"function\";\n\n/** @private is the given object an Object? */\nexport const isObject = (obj: unknown): obj is Record<string, unknown> =>\n    obj !== null && typeof obj === \"object\";\n\n/** @private is the given object an integer? */\nexport const isInteger = (obj: unknown): boolean =>\n    String(Math.floor(Number(obj))) === obj;\n\n/** @private is the given object a NaN? */\n\nexport const isNaN = (obj: unknown): boolean => obj !== obj;\n\n/**\n * Deeply get a value from an object via its path.\n */\nexport function getIn(\n    obj: unknown,\n    key: string | string[],\n    def?: unknown,\n    p = 0\n): unknown {\n    // The read counterpart. `getIn(values, \"constructor.prototype\")` handing\n    // back `Object.prototype` is how a polluted value gets read back out, and\n    // how a form comes to render one.\n    if (pathTraversesPrototype(key)) return def;\n\n    const path = toPath(key);\n    let current: unknown = obj;\n    while (current && p < path.length) {\n        current = (current as Record<string, unknown>)[path[p++]];\n    }\n\n    // check if path is not in the end\n    if (p !== path.length && !current) {\n        return def;\n    }\n\n    return current === undefined ? def : current;\n}\n\nexport function setIn(obj: unknown, path: string, value: unknown): unknown {\n    // Refused rather than sanitised: there is no legitimate reading of a form\n    // field whose path names the prototype chain, and silently rewriting the\n    // path would write the value somewhere the caller did not ask for.\n    // Returning the original object is what every other no-op in this function\n    // does.\n    if (pathTraversesPrototype(path)) return obj;\n\n    const res = clone(obj) as Record<string, unknown>; // this keeps inheritance when obj is a class\n    let resVal: Record<string, unknown> = res;\n    let i = 0;\n    const pathArray = toPath(path);\n\n    for (; i < pathArray.length - 1; i++) {\n        const currentPath: string = pathArray[i];\n        const currentObj = getIn(obj, pathArray.slice(0, i + 1));\n\n        if (currentObj && (isObject(currentObj) || Array.isArray(currentObj))) {\n            resVal = resVal[currentPath] = clone(currentObj) as Record<string, unknown>;\n        } else {\n            const nextPath: string = pathArray[i + 1];\n            resVal = resVal[currentPath] =\n                (isInteger(nextPath) && Number(nextPath) >= 0 ? [] : {}) as Record<string, unknown>;\n        }\n    }\n\n    // Return original object if new value is the same as current\n    if ((i === 0 ? (obj as Record<string, unknown>) : resVal)[pathArray[i]] === value) {\n        return obj;\n    }\n\n    if (value === undefined) {\n        delete resVal[pathArray[i]];\n    } else {\n        resVal[pathArray[i]] = value;\n    }\n\n    // If the path array has a single element, the loop did not run.\n    // Deleting on `resVal` had no effect in this scenario, so we delete on the result instead.\n    if (i === 0 && value === undefined) {\n        delete res[pathArray[i]];\n    }\n\n    return res;\n}\n\nexport function clone(value: unknown): unknown {\n    if (Array.isArray(value)) {\n        return [...value];\n    } else if (typeof value === \"object\" && value !== null) {\n        // Preserve class instances (EntityReference, GeoPoint, etc.) - don't spread them\n        if (Object.getPrototypeOf(value) !== Object.prototype) {\n            return value;\n        }\n        return { ...(value as Record<string, unknown>) };\n    } else {\n        return value; // This is for primitive types which do not need cloning.\n    }\n}\n\n/**\n * Segments that reach the prototype chain rather than a property of the object.\n *\n * `res[\"__proto__\"] = x` is a setter for the object's prototype, not an own\n * property, so a path of `__proto__.polluted` wrote straight onto\n * `Object.prototype` and gave every object in the process a `polluted`\n * property. `constructor.prototype.x` arrived by a second route, and\n * `__proto__.0` did it to arrays.\n *\n * These are paths, and a path here is a property key — which for a map property\n * or a column mapped out of an imported CSV is data, not code.\n */\nconst UNSAFE_PATH_SEGMENTS = new Set([\"__proto__\", \"constructor\", \"prototype\"]);\n\n/** Whether any segment of this path would traverse the prototype chain. */\nexport function pathTraversesPrototype(path: string | string[]): boolean {\n    return toPath(path).some(segment => UNSAFE_PATH_SEGMENTS.has(segment));\n}\n\nfunction toPath(value: string | string[]) {\n    if (Array.isArray(value)) return value; // Already in path array form.\n    // Replace brackets with dots, remove leading/trailing dots, then split by dot.\n    return value.replace(/\\[(\\d+)]/g, \".$1\").replace(/^\\./, \"\").replace(/\\.$/, \"\").split(\".\");\n}\n","import * as React from \"react\";\nimport { useFormex } from \"./Formex\";\nimport { getIn, isFunction, isObject } from \"./utils\";\nimport { FormexController } from \"./types\";\n\nexport interface FieldInputProps<Value> {\n    /** Value of the field */\n    value: Value;\n    /** Name of the field */\n    name: string;\n    /** Multiple select? */\n    multiple?: boolean;\n    /** Is the field checked? */\n    checked?: boolean;\n    /** Change event handler */\n    onChange: (event: React.SyntheticEvent) => void,\n    /** Blur event handler */\n    onBlur: (event: React.FocusEvent) => void,\n}\n\nexport interface FormexFieldProps<Value = any, FormValues extends object = object> {\n    field: FieldInputProps<Value>;\n    form: FormexController<FormValues>;\n}\n\nexport interface FieldConfig<Value, C extends React.ElementType | undefined = undefined> {\n\n    /**\n     * Component to render. Can either be a string e.g. 'select', 'input', or 'textarea', or a component.\n     */\n    as?:\n        | C\n        | string\n        | React.ForwardRefExoticComponent<Record<string, unknown>>;\n\n    /**\n     * Children render function <Field name>{props => ...}</Field>)\n     */\n    children?: ((props: FormexFieldProps<Value>) => React.ReactNode) | React.ReactNode;\n\n    /**\n     * Validate a single field value independently\n     */\n    // validate?: FieldValidator;\n\n    /**\n     * Used for 'select' and related input types.\n     */\n    multiple?: boolean;\n\n    /**\n     * Field name\n     */\n    name: string;\n\n    /** HTML input type */\n    type?: string;\n\n    /** Field value */\n    value?: unknown;\n\n    /** Inner ref */\n    innerRef?: (instance: unknown) => void;\n\n}\n\nexport type FieldProps<T, C extends React.ElementType | undefined> = {\n    as?: C;\n} & (C extends React.ElementType ? (React.ComponentProps<C> & FieldConfig<T, C>) : FieldConfig<T, C>);\n\nexport function Field<T, C extends React.ElementType | undefined = undefined>({\n                                                                                  validate,\n                                                                                  name,\n                                                                                  children,\n                                                                                  as: is, // `as` is reserved in typescript lol\n                                                                                  // component,\n                                                                                  className,\n                                                                                  ...props\n                                                                              }: FieldProps<T, C>) {\n    const formex = useFormex();\n\n    const field = getFieldProps({ name,\n...props }, formex);\n\n    if (isFunction(children)) {\n        return children({ field,\nform: formex });\n    }\n\n    // if (component) {\n    //     if (typeof component === \"string\") {\n    //         const { innerRef, ...rest } = props;\n    //         return React.createElement(\n    //             component,\n    //             { ref: innerRef, ...field, ...rest, className },\n    //             children\n    //         );\n    //     }\n    //     return React.createElement(\n    //         component,\n    //         { field, form: formex, ...props, className },\n    //         children\n    //     );\n    // }\n\n    // default to input here so we can check for both `as` and `children` above\n    const asElement = is || \"input\";\n\n    if (typeof asElement === \"string\") {\n        const { innerRef, ...rest } = props;\n        return React.createElement(\n            asElement,\n            { ref: innerRef,\n...field,\n...rest,\nclassName },\n            children\n        );\n    }\n\n    return React.createElement(asElement, { ...field,\n...props,\nclassName }, children);\n}\n\nconst getFieldProps = (nameOrOptions: string | FieldConfig<unknown>, formex: FormexController<object>): FieldInputProps<unknown> => {\n    const name: string = typeof nameOrOptions === \"string\"\n        ? nameOrOptions\n        : nameOrOptions.name;\n    const valueState = getIn(formex.values as Record<string, unknown>, name);\n\n    const field: FieldInputProps<unknown> = {\n        name: name as string,\n        value: valueState,\n        onChange: formex.handleChange,\n        onBlur: formex.handleBlur\n    };\n    if (typeof nameOrOptions !== \"string\") {\n        const {\n            type,\n            value: valueProp, // value is special for checkboxes\n            as: is,\n            multiple\n        } = nameOrOptions as FieldConfig<unknown>;\n\n        if (type === \"checkbox\") {\n            if (valueProp === undefined) {\n                field.checked = !!valueState;\n            } else {\n                field.checked = !!(\n                    Array.isArray(valueState) && ~valueState.indexOf(valueProp)\n                );\n                field.value = valueProp;\n            }\n        } else if (type === \"radio\") {\n            field.checked = valueState === valueProp;\n            field.value = valueProp;\n        } else if (is === \"select\" && multiple) {\n            field.value = field.value || [];\n            field.multiple = true;\n        }\n    }\n    return field;\n};\n","import { deepEqual as equal } from \"fast-equals\";\n\n/**\n * Only plain objects are merged key by key. Arrays, dates and class instances\n * (a reference, a geopoint, a vector) are values: an edit to one replaces it\n * whole, so two edits to one are a conflict rather than something to splice.\n */\nfunction isPlainObject(value: unknown): value is Record<string, unknown> {\n    if (value === null || typeof value !== \"object\") return false;\n    const proto = Object.getPrototypeOf(value);\n    return proto === Object.prototype || proto === null;\n}\n\nfunction merge(\n    previous: unknown,\n    next: unknown,\n    current: unknown,\n    path: string[],\n    conflicts: string[]\n): unknown {\n    // Not edited here: follow the new baseline.\n    if (equal(current, previous)) return next;\n    // Not changed there: keep the edit.\n    if (equal(next, previous)) return current;\n    // Both sides arrived at the same value.\n    if (equal(current, next)) return current;\n\n    if (isPlainObject(previous) && isPlainObject(next) && isPlainObject(current)) {\n        const merged: Record<string, unknown> = {};\n        const keys = new Set([...Object.keys(previous), ...Object.keys(next), ...Object.keys(current)]);\n        for (const key of keys) {\n            const value = merge(previous[key], next[key], current[key], [...path, key], conflicts);\n            if (value === undefined && !(key in current) && !(key in next)) continue;\n            merged[key] = value;\n        }\n        return merged;\n    }\n\n    // Both sides changed it, differently. The edit is what the user is looking\n    // at, so it stays; the caller is told so it can say so.\n    conflicts.push(path.join(\".\"));\n    return current;\n}\n\n/**\n * Rebase an edit onto a baseline that moved under it — a three-way merge of\n * the form's values against the old and new baselines.\n *\n * - a field the edit left alone takes the new baseline's value;\n * - a field the edit changed keeps the edit;\n * - a field both changed keeps the edit and is listed in `conflicts`, by its\n *   dotted path.\n *\n * Plain objects are merged field by field, so an edit to `seo.slug` and a\n * change to `seo.description` elsewhere both survive. Arrays and other values\n * are compared whole.\n *\n * @group Form\n */\nexport function rebaseEdits<T>(previousBaseline: T, nextBaseline: T, current: T): { values: T; conflicts: string[] } {\n    const conflicts: string[] = [];\n    const values = merge(previousBaseline, nextBaseline, current, [], conflicts) as T;\n    return { values, conflicts };\n}\n","import React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { getIn, setIn } from \"./utils\";\nimport { deepEqual as equal } from \"fast-equals\";\n\nimport { FormexController, FormexResetProps } from \"./types\";\nimport { rebaseEdits } from \"./rebase\";\n\n/**\n * One step of the form's undo history.\n *\n * `touched` and `boundary` are set only on the pair of entries an undoable\n * reset writes — the state it replaced and the state it produced. A reset\n * clears the touched map and bumps `version`, so a step across that pair has to\n * put both back. Ordinary edits leave both unset on purpose: undoing a\n * keystroke should not re-seed every field in the form.\n */\ntype FormexHistoryEntry<T> = {\n    values: T;\n    touched?: Record<string, boolean>;\n    boundary?: boolean;\n};\n\n/**\n * How many steps {@link FormexController.undo} can go back. Every edit pushes a\n * snapshot of the whole values, so an unbounded history grew by one copy per\n * keystroke for as long as the form stayed open — 43.5 MB after 10,000\n * keystrokes inside a 500-item array — and every re-baseline re-merged all of\n * it. The oldest steps are dropped past this.\n */\nexport const FORMEX_MAX_UNDO_STEPS = 200;\n\n/** The history with at most {@link FORMEX_MAX_UNDO_STEPS} steps behind its last entry. */\nfunction capHistory<E>(history: E[]): E[] {\n    const excess = history.length - (FORMEX_MAX_UNDO_STEPS + 1);\n    return excess > 0 ? history.slice(excess) : history;\n}\n\nexport function useCreateFormex<T = any>({\n    initialValues,\n    initialModifiedValues,\n    initialErrors,\n    initialDirty,\n    initialTouched,\n    validation,\n    validateOnChange = false,\n    validateOnInitialRender = false,\n    onSubmit,\n    beforeSubmit,\n    onReset,\n    onValuesChangeDeferred,\n    onBaselineConflict,\n    debugId\n}: {\n    /**\n     * The **baseline**: what the values are stored as. Everything the form\n     * calls \"dirty\" is a difference from this, so it has to be the stored\n     * record and nothing else. To open a form already carrying an edit, pass\n     * that edit as {@link initialModifiedValues} — folding it into\n     * `initialValues` instead makes the baseline agree with the edit, and then\n     * nothing can tell that the edit is unsaved.\n     */\n    initialValues: T;\n    /**\n     * What the form should *show* on its first render, when that is not the\n     * baseline — an edit handed over from somewhere else, a draft restored\n     * from a cache. Dirty is computed from the difference.\n     */\n    initialModifiedValues?: T;\n    initialErrors?: Record<string, string>;\n    /**\n     * Force the starting dirty state. Only for callers that know the form\n     * opens modified but cannot supply the modified values; prefer\n     * {@link initialModifiedValues}, which lets it be derived.\n     */\n    initialDirty?: boolean;\n    initialTouched?: Record<string, boolean>;\n    validateOnChange?: boolean;\n    validateOnInitialRender?: boolean;\n    validation?: (\n        values: T\n    ) =>\n        | Record<string, string>\n        | Promise<Record<string, string>>\n        | undefined\n        | void;\n    onValuesChangeDeferred?: (values: T, controller: FormexController<T>) => void;\n    onSubmit?: (values: T, controller: FormexController<T>) => void | Promise<void>;\n    /**\n     * Awaited at the start of a submit, before the values are read — so\n     * validation and `onSubmit` both see what it left. The record form waits\n     * here for a file upload in progress, whose path lands in the values\n     * only when it finishes.\n     */\n    beforeSubmit?: () => void | Promise<void>;\n    onReset?: (controller: FormexController<T>) => void | Promise<void>;\n    /**\n     * The baseline moved while the form was edited, and some fields were\n     * changed on both sides. Called with their dotted paths. The form keeps\n     * the user's value for those (see the re-baseline below); this is the\n     * chance to tell them that saving will replace someone else's change.\n     */\n    onBaselineConflict?: (paths: string[], controller: FormexController<T>) => void;\n    debugId?: string;\n}): FormexController<T> {\n    // The baseline and the current values start apart when the form opens\n    // already carrying an edit. Keeping them separate is what lets the dirty\n    // flag be *derived* rather than asserted, and what lets the baseline be\n    // replaced later without touching what the user is looking at.\n    const startValues = initialModifiedValues ?? initialValues;\n\n    const initialValuesRef = useRef<T>(initialValues);\n    const valuesRef = useRef<T>(startValues);\n    const debugIdRef = useRef<string | undefined>(debugId);\n\n    const [values, setValuesInner] = useState<T>(startValues);\n    const [touchedState, setTouchedState] = useState<Record<string, boolean>>(initialTouched ?? {});\n    // Read by `resetForm`, which needs the map as it stands at the moment it is\n    // about to clear it. Assigned during render rather than from an effect, so\n    // an event handler can never read one render's worth of stale state.\n    const touchedRef = useRef<Record<string, boolean>>(touchedState);\n    touchedRef.current = touchedState;\n    const [errors, setErrors] = useState<Record<string, string>>(initialErrors ?? {});\n    const [dirty, setDirty] = useState(initialDirty ?? !equal(initialValues, startValues));\n    const [submitCount, setSubmitCount] = useState(0);\n    const [isSubmitting, setIsSubmitting] = useState(false);\n    const [isValidating, setIsValidating] = useState(false);\n    const [version, setVersion] = useState(0);\n\n    // Every callback the caller hands in is read through a ref, so the\n    // controller's own functions never change identity. A caller passing\n    // inline functions — `EntityForm` does — used to give the controller a new\n    // identity on *every* render, and every field reading it re-rendered with\n    // it. The controller now changes with its state, and only with its state.\n    const onValuesChangeRef = useRef(onValuesChangeDeferred);\n    onValuesChangeRef.current = onValuesChangeDeferred;\n    const onBaselineConflictRef = useRef(onBaselineConflict);\n    onBaselineConflictRef.current = onBaselineConflict;\n    const validationRef = useRef(validation);\n    validationRef.current = validation;\n    const onSubmitRef = useRef(onSubmit);\n    onSubmitRef.current = onSubmit;\n    const beforeSubmitRef = useRef(beforeSubmit);\n    beforeSubmitRef.current = beforeSubmit;\n    const onResetRef = useRef(onReset);\n    onResetRef.current = onReset;\n    const initialTouchedRef = useRef(initialTouched);\n    initialTouchedRef.current = initialTouched;\n    const debounceTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n\n    const callDebouncedOnValuesChange = useCallback((values: T) => {\n        if (onValuesChangeRef.current) {\n            if (debounceTimeoutRef.current) {\n                clearTimeout(debounceTimeoutRef.current);\n            }\n            debounceTimeoutRef.current = setTimeout(() => {\n                onValuesChangeRef.current?.(values, controllerRef.current);\n            }, 300);\n        }\n    }, []);\n\n    // Replace state for history with refs\n    const historyRef = useRef<FormexHistoryEntry<T>[]>([{ values: startValues }]);\n    const historyIndexRef = useRef<number>(0);\n\n    /**\n     * Record a new state, dropping anything that had been undone past it.\n     */\n    const pushHistory = useCallback((entry: FormexHistoryEntry<T>) => {\n        const newHistory = historyRef.current.slice(0, historyIndexRef.current + 1);\n        newHistory.push(entry);\n        historyRef.current = capHistory(newHistory);\n        historyIndexRef.current = historyRef.current.length - 1;\n    }, []);\n\n    useEffect(() => {\n        if (validateOnInitialRender) {\n            validate();\n        }\n    }, []);\n\n    const setValues = useCallback((newValues: T) => {\n        valuesRef.current = newValues;\n        setValuesInner(newValues);\n        setDirty(!equal(initialValuesRef.current, newValues));\n        pushHistory({ values: newValues });\n        callDebouncedOnValuesChange(newValues);\n    }, [callDebouncedOnValuesChange, pushHistory]);\n\n    const validate = useCallback(async () => {\n        setIsValidating(true);\n        const validationErrors = await validationRef.current?.(valuesRef.current);\n        setErrors(validationErrors ?? {});\n        setIsValidating(false);\n        return validationErrors;\n    }, []);\n\n    const setFieldValue = useCallback(\n        (key: string, value: unknown, shouldValidate?: boolean) => {\n            const newValues = setIn(valuesRef.current as Record<string, unknown>, key, value) as T;\n            valuesRef.current = newValues;\n            setValuesInner(newValues);\n            if (!equal(getIn(initialValuesRef.current as Record<string, unknown>, key), value)) {\n                setDirty(true);\n            } else {\n                // Typed back to its stored value: the form is clean again\n                // unless another field still differs. The whole comparison\n                // runs only here, not on every keystroke.\n                setDirty(!equal(initialValuesRef.current, newValues));\n            }\n            if (shouldValidate) {\n                validate();\n            }\n            pushHistory({ values: newValues });\n            callDebouncedOnValuesChange(newValues);\n        },\n        [validate, callDebouncedOnValuesChange, pushHistory]\n    );\n\n    const setFieldError = useCallback((key: string, error: string | undefined) => {\n        setErrors((prevErrors: Record<string, string>) => {\n            const newErrors = { ...prevErrors };\n            if (error) {\n                newErrors[key] = error;\n            } else {\n                delete newErrors[key];\n            }\n            return newErrors;\n        });\n    }, []);\n\n    const setFieldTouched = useCallback(\n        (key: string, touched: boolean, shouldValidate?: boolean) => {\n            setTouchedState((prev: Record<string, boolean>) => ({\n                ...prev,\n                [key]: touched\n            }));\n            if (shouldValidate) {\n                validate();\n            }\n        },\n        [validate]\n    );\n\n    const handleChange = useCallback(\n        (event: React.SyntheticEvent) => {\n            const target = event.target as HTMLInputElement;\n            let value;\n            if (target.type === \"checkbox\") {\n                value = target.checked;\n            } else if (target.type === \"number\") {\n                value = target.valueAsNumber;\n            } else {\n                value = target.value;\n            }\n            const name = target.name;\n            setFieldValue(name, value, validateOnChange);\n            setFieldTouched(name, true);\n        },\n        [setFieldValue, setFieldTouched, validateOnChange]\n    );\n\n    const handleBlur = useCallback((event: React.FocusEvent) => {\n        const target = event.target as HTMLInputElement;\n        const name = target.name;\n        setFieldTouched(name, true);\n    }, [setFieldTouched]);\n\n    const submit = useCallback(\n        async (e?: React.FormEvent<HTMLFormElement>) => {\n            e?.preventDefault();\n            e?.stopPropagation();\n            setIsSubmitting(true);\n            setSubmitCount((prev: number) => prev + 1);\n            await beforeSubmitRef.current?.();\n            const validationErrors = await validationRef.current?.(valuesRef.current);\n            if (validationErrors && Object.keys(validationErrors).length > 0) {\n                setErrors(validationErrors);\n            } else {\n                setErrors({});\n                await onSubmitRef.current?.(valuesRef.current, controllerRef.current);\n            }\n            setIsSubmitting(false);\n            setVersion((prev: number) => prev + 1);\n        },\n        []\n    );\n\n    const resetForm = useCallback((props?: FormexResetProps<T>) => {\n        const {\n            submitCount: submitCountProp,\n            values: valuesProp,\n            errors: errorsProp,\n            touched: touchedProp,\n            undoable\n        } = props ?? {};\n        const priorValues = valuesRef.current;\n        const priorTouched = touchedRef.current;\n        const nextValues = valuesProp ?? initialValuesRef.current;\n        const nextTouched = touchedProp ?? initialTouchedRef.current ?? {};\n        valuesRef.current = nextValues;\n        initialValuesRef.current = nextValues;\n        setValuesInner(nextValues);\n        setErrors(errorsProp ?? {});\n        setTouchedState(nextTouched);\n        setDirty(false);\n        setSubmitCount(submitCountProp ?? 0);\n        setVersion((prev: number) => prev + 1);\n        onResetRef.current?.(controllerRef.current);\n        if (undoable) {\n            // Keep what the user typed one step behind them. The entry stepped\n            // back into carries the touched map as well as the values: without\n            // it the values return but every field reads untouched, and a draft\n            // backup — which is extracted *through* the touched map — would come\n            // back empty.\n            const kept = historyRef.current.slice(0, historyIndexRef.current + 1);\n            kept[kept.length - 1] = { values: priorValues, touched: priorTouched };\n            kept.push({ values: nextValues, touched: nextTouched, boundary: true });\n            // Capped like any push; the pair just written is the newest, so it\n            // is never what goes.\n            historyRef.current = capHistory(kept);\n            historyIndexRef.current = historyRef.current.length - 1;\n        } else {\n            historyRef.current = [{ values: nextValues }];\n            historyIndexRef.current = 0;\n        }\n    }, []);\n\n    /**\n     * The `initialValues` prop moved: the record this form edits finished\n     * loading, or was replaced. That is a **re-baseline**, not a reset.\n     *\n     * It used to call `resetForm({ values: initialValues })`, which is a reset\n     * in both of the ways that matter, and both were wrong here:\n     *\n     * - it fired `onReset`, which callers reasonably read as \"the user\n     *   discarded their changes\". The admin clears the cache that seeds an\n     *   in-flight edit handed over from the side panel there, so a record's own\n     *   data arriving deleted the edit the form had just been opened with, and\n     *   the form then re-seeded itself from the server — an expanded record\n     *   silently lost whatever had been typed into it.\n     * - it overwrote `values`, so anything typed while the record was still\n     *   loading was thrown away without a word.\n     *\n     * So: move the baseline, and rebase the edit onto it. Leaving the edit\n     * alone *whole* was the next bug: it kept the old value of every field the\n     * user never touched, and save — which writes the difference from the live\n     * record — wrote those old values back, silently reverting whatever someone\n     * else had just changed. So a field the edit left alone follows the new\n     * baseline, a field it changed keeps the edit, and a field both changed\n     * keeps the edit and is reported through `onBaselineConflict`.\n     */\n    useEffect(() => {\n        if (equal(initialValuesRef.current, initialValues)) return;\n\n        const previousBaseline = initialValuesRef.current;\n        const modified = !equal(previousBaseline, valuesRef.current);\n        initialValuesRef.current = initialValues;\n\n        if (modified) {\n            const { values: rebased, conflicts } = rebaseEdits(previousBaseline, initialValues, valuesRef.current);\n            valuesRef.current = rebased;\n            setValuesInner(rebased);\n            // Undo must not step back into a stale copy of an untouched field\n            // either, so the history is rebased the same way.\n            historyRef.current = historyRef.current.map((entry) => ({\n                ...entry,\n                values: rebaseEdits(previousBaseline, initialValues, entry.values).values\n            }));\n            setDirty(!equal(initialValues, rebased));\n            if (conflicts.length > 0) {\n                onBaselineConflictRef.current?.(conflicts, controllerRef.current);\n            }\n        } else {\n            valuesRef.current = initialValues;\n            setValuesInner(initialValues);\n            historyRef.current = [{ values: initialValues }];\n            historyIndexRef.current = 0;\n            setDirty(false);\n        }\n        // Containers that read `values` off the controller key on `version`;\n        // a re-seed changes what they are holding just as a reset does.\n        setVersion((prev: number) => prev + 1);\n    }, [initialValues]);\n\n    const stepHistory = useCallback((newIndex: number) => {\n        const from = historyRef.current[historyIndexRef.current];\n        const entry = historyRef.current[newIndex];\n        const newValues = entry.values;\n        setValuesInner(newValues);\n        valuesRef.current = newValues;\n        historyIndexRef.current = newIndex;\n        setDirty(!equal(initialValuesRef.current, newValues));\n        if (entry.touched) {\n            setTouchedState(entry.touched);\n        }\n        // Stepping across a reset. The reset told everything reading `values`\n        // off the controller to re-read itself, so the way back has to say so\n        // too — otherwise a cleared markdown editor stays cleared while the\n        // value behind it is already back. Ordinary steps skip this.\n        if (from?.boundary || entry.boundary) {\n            setVersion((prev: number) => prev + 1);\n        }\n        callDebouncedOnValuesChange(newValues);\n    }, [callDebouncedOnValuesChange]);\n\n    const undo = useCallback(() => {\n        if (historyIndexRef.current > 0) {\n            stepHistory(historyIndexRef.current - 1);\n        }\n    }, [stepHistory]);\n\n    const redo = useCallback(() => {\n        if (historyIndexRef.current < historyRef.current.length - 1) {\n            stepHistory(historyIndexRef.current + 1);\n        }\n    }, [stepHistory]);\n\n    const controllerRef = useRef<FormexController<T>>({} as FormexController<T>);\n\n    const controller = useMemo<FormexController<T>>(\n        () => ({\n            values,\n            initialValues: initialValuesRef.current,\n            handleChange,\n            isSubmitting,\n            setSubmitting: setIsSubmitting,\n            setValues,\n            setFieldValue,\n            errors,\n            setFieldError,\n            touched: touchedState,\n            setFieldTouched,\n            setTouched: setTouchedState,\n            dirty,\n            setDirty,\n            handleSubmit: submit,\n            submitCount,\n            setSubmitCount,\n            handleBlur,\n            validate,\n            isValidating,\n            resetForm,\n            version,\n            debugId: debugIdRef.current,\n            undo,\n            redo,\n            canUndo: historyIndexRef.current > 0,\n            canRedo: historyIndexRef.current < historyRef.current.length - 1\n        }),\n        [\n            values,\n            errors,\n            touchedState,\n            dirty,\n            isSubmitting,\n            submitCount,\n            isValidating,\n            version,\n            handleChange,\n            handleBlur,\n            setValues,\n            setFieldValue,\n            setFieldTouched,\n            setTouchedState,\n            setFieldError,\n            validate,\n            submit,\n            resetForm,\n            undo,\n            redo\n        ]\n    );\n\n    useEffect(() => {\n        controllerRef.current = controller;\n    }, [controller]);\n\n    return controller;\n}\n"],"mappings":"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"}

package/dist/rebase.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Rebase an edit onto a baseline that moved under it — a three-way merge of
+ * the form's values against the old and new baselines.
+ *
+ * - a field the edit left alone takes the new baseline's value;
+ * - a field the edit changed keeps the edit;
+ * - a field both changed keeps the edit and is listed in `conflicts`, by its
+ *   dotted path.
+ *
+ * Plain objects are merged field by field, so an edit to `seo.slug` and a
+ * change to `seo.description` elsewhere both survive. Arrays and other values
+ * are compared whole.
+ *
+ * @group Form
+ */
+export declare function rebaseEdits<T>(previousBaseline: T, nextBaseline: T, current: T): {
+    values: T;
+    conflicts: string[];
+};

package/dist/useCreateFormex.d.ts

@@ -1,5 +1,13 @@
 import { FormexController } from "./types.js";
-export declare function useCreateFormex<T = any>({ initialValues, initialModifiedValues, initialErrors, initialDirty, initialTouched, validation, validateOnChange, validateOnInitialRender, onSubmit, onReset, onValuesChangeDeferred, debugId }: {
+/**
+ * How many steps {@link FormexController.undo} can go back. Every edit pushes a
+ * snapshot of the whole values, so an unbounded history grew by one copy per
+ * keystroke for as long as the form stayed open — 43.5 MB after 10,000
+ * keystrokes inside a 500-item array — and every re-baseline re-merged all of
+ * it. The oldest steps are dropped past this.
+ */
+export declare const FORMEX_MAX_UNDO_STEPS = 200;
+export declare function useCreateFormex<T = any>({ initialValues, initialModifiedValues, initialErrors, initialDirty, initialTouched, validation, validateOnChange, validateOnInitialRender, onSubmit, beforeSubmit, onReset, onValuesChangeDeferred, onBaselineConflict, debugId }: {
     /**
      * The **baseline**: what the values are stored as. Everything the form
      * calls "dirty" is a difference from this, so it has to be the stored
@@ -28,6 +36,20 @@ export declare function useCreateFormex<T = any>({ initialValues, initialModifie
     validation?: (values: T) => Record<string, string> | Promise<Record<string, string>> | undefined | void;
     onValuesChangeDeferred?: (values: T, controller: FormexController<T>) => void;
     onSubmit?: (values: T, controller: FormexController<T>) => void | Promise<void>;
+    /**
+     * Awaited at the start of a submit, before the values are read — so
+     * validation and `onSubmit` both see what it left. The record form waits
+     * here for a file upload in progress, whose path lands in the values
+     * only when it finishes.
+     */
+    beforeSubmit?: () => void | Promise<void>;
     onReset?: (controller: FormexController<T>) => void | Promise<void>;
+    /**
+     * The baseline moved while the form was edited, and some fields were
+     * changed on both sides. Called with their dotted paths. The form keeps
+     * the user's value for those (see the re-baseline below); this is the
+     * chance to tell them that saving will replace someone else's change.
+     */
+    onBaselineConflict?: (paths: string[], controller: FormexController<T>) => void;
     debugId?: string;
 }): FormexController<T>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rebasepro/forms",
-  "version": "0.23.0",
+  "version": "0.24.1-canary.g56af4a4",
   "description": "Schema-driven form components for Rebase collections.",
   "keywords": [
     "rebase",