@homebound/form-state 2.9.0 → 2.10.1

package/dist/index.js

@@ -1,9 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormStates = exports.useFormState = exports.required = exports.createObjectState = void 0;
-var formState_1 = require("./formState");
-Object.defineProperty(exports, "createObjectState", { enumerable: true, get: function () { return formState_1.createObjectState; } });
-Object.defineProperty(exports, "required", { enumerable: true, get: function () { return formState_1.required; } });
+var objectField_1 = require("./fields/objectField");
+Object.defineProperty(exports, "createObjectState", { enumerable: true, get: function () { return objectField_1.createObjectState; } });
+var rules_1 = require("./rules");
+Object.defineProperty(exports, "required", { enumerable: true, get: function () { return rules_1.required; } });
 var useFormState_1 = require("./useFormState");
 Object.defineProperty(exports, "useFormState", { enumerable: true, get: function () { return useFormState_1.useFormState; } });
 var useFormStates_1 = require("./useFormStates");

package/dist/rules.d.ts

@@ -0,0 +1,14 @@
+import { ObjectState } from "./fields/objectField";
+declare type IfAny<T, Y, N> = 0 extends 1 & T ? Y : N;
+/** A validation rule, given the value and name, return the error string if valid, or undefined if valid. */
+export declare type Rule<T, V> = (opts: {
+    value: V;
+    key: string;
+    originalValue: V;
+    object: IfAny<T, any, ObjectState<T>>;
+}) => string | undefined;
+/** A rule that validates `value` is not `undefined`, `null`, or empty string. */
+export declare const required: <V>({ value: v }: {
+    value: V;
+}) => string | undefined;
+export {};

package/dist/rules.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.required = void 0;
+const mobx_1 = require("mobx");
+/** A rule that validates `value` is not `undefined`, `null`, or empty string. */
+// We pre-emptively make this a mobx action so that it's identity doesn't change when proxied
+// and breaks our ability to do `rules.some(r => r === required)`.
+exports.required = mobx_1.action(({ value: v }) => {
+    const isEmptyString = typeof v === "string" ? v.trim() === "" : false;
+    return v !== undefined && v !== null && !isEmptyString ? undefined : "Required";
+});

package/dist/useFormState.d.ts

@@ -1,4 +1,5 @@
-import { ObjectConfig, ObjectState } from "./formState";
+import { ObjectConfig } from "./config";
+import { ObjectState } from "./fields/objectField";
 export declare type UseFormStateOpts<T, I> = {
     /** The form configuration, should be a module-level const or useMemo'd. */
     config: ObjectConfig<T>;

package/dist/useFormState.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormState = void 0;
 const is_plain_object_1 = require("is-plain-object");
 const react_1 = require("react");
-const formState_1 = require("./formState");
+const objectField_1 = require("./fields/objectField");
 const utils_1 = require("./utils");
 // If the user's autoSave hook makes some last-minute `.set` calls to sneak
 // in some business logic right before their GraphQL mutation call, ignore it
@@ -60,7 +60,7 @@ function useFormState(opts) {
             }
         }
         const value = firstRunRef.current ? firstInitValue : utils_1.initValue(config, init);
-        const form = formState_1.createObjectState(config, value, { maybeAutoSave });
+        const form = objectField_1.createObjectState(config, value, { maybeAutoSave });
         form.readOnly = readOnly;
         // The identity of `addRules` is not stable, but assume that it is for better UX.
         (addRules || (() => { }))(form);

package/dist/useFormState.test.js

@@ -7,7 +7,7 @@ const mobx_1 = require("mobx");
 const mobx_react_1 = require("mobx-react");
 const react_2 = require("react");
 const FormStateApp_1 = require("./FormStateApp");
-const formState_1 = require("./formState");
+const rules_1 = require("./rules");
 const useFormState_1 = require("./useFormState");
 describe("useFormState", () => {
     it("calls init.map if init.input is defined", async () => {
@@ -468,7 +468,7 @@ const authorWithBooksConfig = {
         type: "list",
         config: {
             id: { type: "value" },
-            title: { type: "value", rules: [formState_1.required] },
+            title: { type: "value", rules: [rules_1.required] },
             classification: { type: "value" },
         },
     },
@@ -481,7 +481,7 @@ const authorWithAddressAndBooksConfig = {
         type: "object",
         config: {
             id: { type: "value" },
-            street: { type: "value", rules: [formState_1.required] },
+            street: { type: "value", rules: [rules_1.required] },
             city: { type: "value" },
         },
     },
@@ -489,7 +489,7 @@ const authorWithAddressAndBooksConfig = {
         type: "list",
         config: {
             id: { type: "value" },
-            title: { type: "value", rules: [formState_1.required] },
+            title: { type: "value", rules: [rules_1.required] },
             classification: { type: "value" },
         },
     },

package/dist/useFormStates.d.ts

@@ -1,4 +1,5 @@
-import { ObjectConfig, ObjectState } from "./formState";
+import { ObjectConfig } from "./config";
+import { ObjectState } from "./fields/objectField";
 export declare type ObjectStateCache<T, I> = Record<string, [ObjectState<T>, I]>;
 declare type UseFormStatesOpts<T, I> = {
     /**
@@ -34,8 +35,15 @@ declare type UseFormStatesOpts<T, I> = {
      * Does not need to be stable/useMemo'd.
      */
     map?: (input: Exclude<I, null | undefined>) => T;
+    /**
+     * Sets all `ObjectState`s to readOnly.
+     */
+    readOnly?: boolean;
 };
-export declare function useFormStates<T, I = T>(opts: UseFormStatesOpts<T, I>): {
-    getFormState: (input: I) => ObjectState<T>;
+declare type UseFormStatesHook<T, I> = {
+    getFormState: (input: I, opts?: {
+        readOnly?: boolean;
+    }) => ObjectState<T>;
 };
+export declare function useFormStates<T, I = T>(opts: UseFormStatesOpts<T, I>): UseFormStatesHook<T, I>;
 export {};

package/dist/useFormStates.js

@@ -2,50 +2,54 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormStates = void 0;
 const react_1 = require("react");
-const formState_1 = require("./formState");
+const objectField_1 = require("./fields/objectField");
 const utils_1 = require("./utils");
 function useFormStates(opts) {
-    const { config, autoSave, getId, map, addRules } = opts;
+    const { config, autoSave, getId, map, addRules, readOnly = false } = opts;
     const objectStateCache = react_1.useMemo(() => ({}), 
     // Force resetting the cache if config changes
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [config]);
     // Keep track of ObjectStates that triggered auto-save when a save was already in progress.
-    const pendingAutoSaves = react_1.useRef([]);
+    const pendingAutoSaves = react_1.useRef(new Set());
     // Use a ref so our memo'ized `autoSave` always see the latest value
     const autoSaveRef = react_1.useRef(autoSave);
     autoSaveRef.current = autoSave;
-    async function maybeAutoSave(form) {
-        if (isAutoSaving && !pendingAutoSaves.current.includes(form)) {
-            pendingAutoSaves.current.push(form);
-        }
-        // Don't use canSave() because we don't want to set touched for all the fields
-        if (autoSaveRef.current && form.dirty && form.valid && !isAutoSaving) {
-            try {
-                isAutoSaving = true;
-                // See if we have any reactions that want to run (i.e. added by addRules hooks)
-                await new Promise((resolve) => setTimeout(resolve, 0));
-                // If a reaction re-queued our form during the ^ wait, remove it
-                let i = -1;
-                while ((i = pendingAutoSaves.current.indexOf(form)) !== -1) {
-                    pendingAutoSaves.current.splice(i, 1);
+    // Use a ref b/c we're memod
+    const readOnlyRef = react_1.useRef(readOnly);
+    readOnlyRef.current = readOnly;
+    const getFormState = react_1.useCallback((input, opts = {}) => {
+        const existing = objectStateCache[getId(input)];
+        let form = existing === null || existing === void 0 ? void 0 : existing[0];
+        async function maybeAutoSave(form) {
+            // Don't use canSave() because we don't want to set touched for all the fields
+            if (autoSaveRef.current && form.dirty && form.valid) {
+                const { current: pending } = pendingAutoSaves;
+                if (isAutoSaving) {
+                    pending.add(form);
+                    return;
                 }
-                await autoSaveRef.current(form);
-            }
-            finally {
-                isAutoSaving = false;
-                if (pendingAutoSaves.current.length > 0) {
-                    await maybeAutoSave(pendingAutoSaves.current.shift());
+                try {
+                    isAutoSaving = true;
+                    // See if we have any reactions that want to run (i.e. added by addRules hooks)
+                    await new Promise((resolve) => setTimeout(resolve, 0));
+                    // If a reaction re-queued our form during the ^ wait, remove it
+                    pending.delete(form);
+                    await autoSaveRef.current(form);
+                }
+                finally {
+                    isAutoSaving = false;
+                    if (pending.size > 0) {
+                        const first = pending.values().next().value;
+                        pending.delete(first);
+                        await maybeAutoSave(first);
+                    }
                 }
             }
         }
-    }
-    const getFormState = react_1.useCallback((input) => {
-        const existing = objectStateCache[getId(input)];
-        let form = existing === null || existing === void 0 ? void 0 : existing[0];
         // If it didn't exist, then add to the cache.
         if (!form) {
-            form = formState_1.createObjectState(config, utils_1.initValue(config, map ? { map, input } : input), {
+            form = objectField_1.createObjectState(config, utils_1.initValue(config, map ? { map, input } : input), {
                 maybeAutoSave: () => maybeAutoSave(form),
             });
             if (addRules) {
@@ -58,6 +62,7 @@ function useFormStates(opts) {
             form.set(utils_1.initValue(config, map ? { map, input } : input), { refreshing: true });
             existing[1] = input;
         }
+        form.readOnly = readOnlyRef.current || !!opts.readOnly;
         return form;
     }, 
     // Allow the user to not stable-ize getId, map, addRules, and autoSave

package/dist/useFormStates.test.js

@@ -4,8 +4,8 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const rtl_utils_1 = require("@homebound/rtl-utils");
 const mobx_1 = require("mobx");
 const react_1 = require("react");
-const formState_1 = require("./formState");
 const FormStateApp_1 = require("./FormStateApp");
+const rules_1 = require("./rules");
 const useFormStates_1 = require("./useFormStates");
 describe("useFormStates", () => {
     it("can lazily create form states", async () => {
@@ -114,7 +114,7 @@ describe("useFormStates", () => {
         const originalConfig = { id: { type: "value" }, firstName: { type: "value" } };
         const updatedConfig = {
             id: { type: "value" },
-            firstName: { type: "value", rules: [formState_1.required] },
+            firstName: { type: "value", rules: [rules_1.required] },
         };
         function TestComponent() {
             const [config, setConfig] = react_1.useState(originalConfig);
@@ -148,7 +148,7 @@ describe("useFormStates", () => {
                     jsx_runtime_1.jsx(ChildComponent, { os: getFormState({ id: "a:1", firstName: "Brandon" }) }, void 0)] }, void 0));
         }
         // When we render
-        const r = await rtl_utils_1.render(jsx_runtime_1.jsx(TestComponent, {}, void 0));
+        await rtl_utils_1.render(jsx_runtime_1.jsx(TestComponent, {}, void 0));
         // Then addRules was only called once
         expect(addRules).toHaveBeenCalledTimes(1);
     });
@@ -156,18 +156,12 @@ describe("useFormStates", () => {
         // Given a user wants to use auto save
         const autoSave = jest.fn();
         function TestComponent() {
-            const config = {
-                id: { type: "value" },
-                firstName: { type: "value" },
-                lastName: { type: "value" },
-            };
             const { getFormState } = useFormStates_1.useFormStates({
                 config,
                 getId: (o) => o.id,
                 addRules(fs) {
                     // And they have a reactive true that calculates last name
                     mobx_1.reaction(() => fs.firstName.value, (curr) => {
-                        console.log({ curr });
                         fs.lastName.set(curr);
                     });
                 },
@@ -185,7 +179,51 @@ describe("useFormStates", () => {
         expect(autoSave).toHaveBeenCalledTimes(1);
         expect(autoSave).toHaveBeenCalledWith({ id: "a:1", firstName: "first", lastName: "first" });
     });
+    it("can set readOnly via the hook opt", async () => {
+        // Given a test component
+        function TestComponent({ readOnly }) {
+            const { getFormState } = useFormStates_1.useFormStates({
+                config,
+                getId: (o) => o.id,
+                // And it passes readOnly directly to useFormStates
+                readOnly,
+            });
+            return jsx_runtime_1.jsx(ChildComponent, { os: getFormState({ id: "a:1", firstName: "Brandon" }) }, void 0);
+        }
+        // When we render
+        const r = await rtl_utils_1.render(jsx_runtime_1.jsx(TestComponent, { readOnly: true }, void 0));
+        // Then it's read only
+        expect(r.firstName()).toHaveAttribute("data-readonly", "true");
+        // And when we rerender
+        await r.rerender(jsx_runtime_1.jsx(TestComponent, { readOnly: false }, void 0));
+        // Then it's not read only
+        expect(r.firstName()).toHaveAttribute("data-readonly", "false");
+    });
+    it("can set readOnly via the getFormState function", async () => {
+        // Given a test component
+        function TestComponent({ readOnly }) {
+            const { getFormState } = useFormStates_1.useFormStates({
+                config,
+                getId: (o) => o.id,
+            });
+            // And it passes readOnly directly to getFormState
+            return jsx_runtime_1.jsx(ChildComponent, { os: getFormState({ id: "a:1", firstName: "Brandon" }, { readOnly }) }, void 0);
+        }
+        // When we render
+        const r = await rtl_utils_1.render(jsx_runtime_1.jsx(TestComponent, { readOnly: true }, void 0));
+        // Then it's read only
+        expect(r.firstName()).toHaveAttribute("data-readonly", "true");
+        // And when we rerender
+        await r.rerender(jsx_runtime_1.jsx(TestComponent, { readOnly: false }, void 0));
+        // Then it's not read only
+        expect(r.firstName()).toHaveAttribute("data-readonly", "false");
+    });
 });
+const config = {
+    id: { type: "value" },
+    firstName: { type: "value" },
+    lastName: { type: "value" },
+};
 function ChildComponent({ os }) {
-    return jsx_runtime_1.jsx("div", Object.assign({ "data-testid": "firstName" }, { children: os.firstName.value }), void 0);
+    return (jsx_runtime_1.jsx("div", Object.assign({ "data-testid": "firstName", "data-readonly": os.firstName.readOnly }, { children: os.firstName.value }), void 0));
 }

package/dist/utils.d.ts

@@ -1,4 +1,12 @@
-import { ObjectConfig } from "./formState";
+import { ObjectConfig } from "./config";
+export declare type Builtin = Date | Function | Uint8Array | string | number | boolean;
+export declare type Primitive = undefined | null | boolean | string | number | Function | Date | {
+    toJSON(): any;
+};
+/** Makes the keys in `T` required while keeping the values undefined. */
+export declare type DeepRequired<T> = T extends Primitive ? T : {
+    [P in keyof Required<T>]: T[P] extends Array<infer U> ? Array<DeepRequired<U>> : T[P] extends ReadonlyArray<infer U2> ? ReadonlyArray<DeepRequired<U2>> : DeepRequired<T[P]>;
+};
 export declare function fail(message?: string): never;
 export declare function assertNever(x: never): never;
 /** Introspects the `init` prop to see if has a `map` function/etc. and returns the form value. */
@@ -15,3 +23,18 @@ export declare function initValue<T>(config: ObjectConfig<T>, init: any): T;
 export declare function pickFields<T, I>(formConfig: ObjectConfig<T>, instance: I): {
     [K in keyof T]: K extends keyof I ? I[K] : never;
 };
+export declare function isNotUndefined<T>(value: T | undefined): value is T;
+export declare function isEmpty(value: any): boolean;
+/**
+ * An equals that does deep-ish equality.
+ *
+ * We only do non-identity equals for:
+ *
+ * - "plain" objects that have no custom prototype/i.e. are object literals
+ * - objects that implement `toJSON`
+ *
+ */
+export declare function areEqual<T>(a?: T, b?: T): boolean;
+export declare function hasToJSON(o?: unknown): o is {
+    toJSON(): void;
+};

package/dist/utils.js

@@ -1,6 +1,10 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.pickFields = exports.initValue = exports.assertNever = exports.fail = void 0;
+exports.hasToJSON = exports.areEqual = exports.isEmpty = exports.isNotUndefined = exports.pickFields = exports.initValue = exports.assertNever = exports.fail = void 0;
+const fast_deep_equal_1 = __importDefault(require("fast-deep-equal"));
 const is_plain_object_1 = require("is-plain-object");
 const mobx_1 = require("mobx");
 function fail(message) {
@@ -68,3 +72,39 @@ function pickFields(formConfig, instance) {
     }));
 }
 exports.pickFields = pickFields;
+function isNotUndefined(value) {
+    return value !== undefined;
+}
+exports.isNotUndefined = isNotUndefined;
+function isEmpty(value) {
+    return value === undefined || value === null || value === "";
+}
+exports.isEmpty = isEmpty;
+/**
+ * An equals that does deep-ish equality.
+ *
+ * We only do non-identity equals for:
+ *
+ * - "plain" objects that have no custom prototype/i.e. are object literals
+ * - objects that implement `toJSON`
+ *
+ */
+function areEqual(a, b) {
+    if (is_plain_object_1.isPlainObject(a)) {
+        return fast_deep_equal_1.default(mobx_1.toJS(a), mobx_1.toJS(b));
+    }
+    if (hasToJSON(a) || hasToJSON(b)) {
+        const a1 = hasToJSON(a) ? a.toJSON() : a;
+        const b1 = hasToJSON(b) ? b.toJSON() : b;
+        return fast_deep_equal_1.default(a1, b1);
+    }
+    if (a && b && a instanceof Array && b instanceof Array) {
+        return fast_deep_equal_1.default(a, b);
+    }
+    return a === b;
+}
+exports.areEqual = areEqual;
+function hasToJSON(o) {
+    return !!(o && typeof o === "object" && "toJSON" in o);
+}
+exports.hasToJSON = hasToJSON;

package/dist/utils.test.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const mobx_1 = require("mobx");
-const formState_1 = require("./formState");
+const rules_1 = require("./rules");
 const utils_1 = require("./utils");
 describe("utils", () => {
     describe("pickFields", () => {
@@ -82,7 +82,7 @@ const authorWithAddressConfig = {
     address: {
         type: "object",
         config: {
-            street: { type: "value", rules: [formState_1.required] },
+            street: { type: "value", rules: [rules_1.required] },
             city: { type: "value" },
         },
     },
@@ -95,7 +95,7 @@ const authorWithBooksConfig = {
         type: "list",
         config: {
             id: { type: "value" },
-            title: { type: "value", rules: [formState_1.required] },
+            title: { type: "value", rules: [rules_1.required] },
             classification: { type: "value" },
         },
     },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homebound/form-state",
-  "version": "2.9.0",
+  "version": "2.10.1",
   "author": "Homebound",
   "license": "MIT",
   "main": "dist/index.js",

package/dist/formState.d.ts

@@ -1,192 +0,0 @@
-/**
- * Wraps a given input/on-the-wire type `T` for editing in a form.
- *
- * We basically mimic every field in `T` (i.e. `firstName`, `lastName`, etc.) but decorate them
- * with form-specific state like `touched`, `dirty`, `errors`, etc.
- *
- * The intent is that, after ensuring all fields are `valid`/etc., callers can take the
- * result of this `objectState.value` (or `objectState.originalValue` for the non-proxy version) and
- * have exactly the on-the-wire type `T` that they need to submit to the backend, without doing the
- * manual mapping of "data that was in the form controls" into "data that the backend wants".
- *
- * Note that this can be hierarchical by having by having a field of `ListFieldState` that
- * themselves each wrap an `ObjectState`, i.e.:
- *
- * ```
- * ObjectState for author
- *   - firstName: FieldState
- *   - lastName: FieldState
- *   - rows: ListFieldState
- *     - [0]: ObjectState for book 1
- *       - title: FieldState
- *     - [1]: ObjectState for book 2
- *       - title: FieldState
- * ```
- */
-export declare type ObjectState<T, P = any> = FieldStates<T> & FieldState<P, T> & {
-    /** Sets the state of fields in `state`. */
-    set(state: Partial<T>, opts?: SetOpts): void;
-    /** Returns whether the object can be saved, i.e. is valid, but also as a side-effect marks touched. */
-    canSave(): boolean;
-};
-export declare type Builtin = Date | Function | Uint8Array | string | number | boolean;
-/** For a given input type `T`, decorate each field into the "field state" type that holds our form-relevant state, i.e. valid/touched/etc. */
-declare type FieldStates<T> = {
-    [K in keyof T]-?: T[K] extends Array<infer U> | null | undefined ? [U] extends [Builtin] ? FieldState<T, T[K]> : ListFieldState<T, U> : T[K] extends Builtin | null | undefined ? FieldState<T, T[K]> : ObjectState<T[K], T>;
-};
-declare type IfAny<T, Y, N> = 0 extends 1 & T ? Y : N;
-/** A validation rule, given the value and name, return the error string if valid, or undefined if valid. */
-export declare type Rule<T, V> = (opts: {
-    value: V;
-    key: string;
-    originalValue: V;
-    object: IfAny<T, any, ObjectState<T>>;
-}) => string | undefined;
-/** A rule that validates `value` is not `undefined`, `null`, or empty string. */
-export declare const required: <V>({ value: v }: {
-    value: V;
-}) => string | undefined;
-/**
- * Form state for a primitive field in the form, i.e. its value but also touched/validation/etc. state.
- *
- * This API also provides hooks for form elements to call into, i.e. `blur()` and `set(...)` that will
- * update the field state and re-render, i.e. when including in an `ObjectState`-typed literal that is
- * an mobx `useLocalObservable`/observable.
- *
- * Note that `V` will always have `null | undefined` added to it by `FieldStates`, b/c most form fields
- * i.e. text boxes, can always be cleared out/deleted.
- */
-export interface FieldState<T, V> {
-    readonly key: string;
-    value: V;
-    readonly originalValue: V;
-    touched: boolean;
-    readOnly: boolean;
-    readonly required: boolean;
-    readonly dirty: boolean;
-    readonly valid: boolean;
-    readonly isNewEntity: boolean;
-    rules: Rule<T, V>[];
-    readonly errors: string[];
-    /** Returns a subset of V with only the changed values. Currently not observable. */
-    readonly changedValue: V;
-    /** Focuses the field. Disables changes from `ObjectState.set` calls. */
-    focus(): void;
-    /** Blur marks the field as touched and triggers an auto-save. */
-    blur(): void;
-    /** Triggers an auto-save; the caller (i.e. useFormState) should still dirty & valid check. */
-    maybeAutoSave(): void;
-    set(value: V, opts?: SetOpts): void;
-    /** Reverts back to the original value and resets dirty/touched. */
-    reset(): void;
-    /** Accepts the current changed value (if any) as the original and resets dirty/touched. */
-    save(): void;
-}
-/** Public options for our `set` command. */
-export interface SetOpts {
-    /** Whether this `set` should trigger an auto-save; defaults to true. */
-    autoSave?: boolean;
-}
-/** Internal `.set` opts for conditionally that form-state internally percolates. */
-interface InternalSetOpts extends SetOpts {
-    /** `resetting` is the code calling `.reset()` to revert to original values. */
-    resetting?: boolean;
-    /** `refreshing` is when `useFormState` sees a new value. */
-    refreshing?: boolean;
-}
-export interface FieldStateInternal<T, V> extends FieldState<T, V> {
-    set(value: V, opts?: InternalSetOpts): void;
-    _isIdKey: boolean;
-    _isDeleteKey: boolean;
-    _isReadOnlyKey: boolean;
-    _focused: boolean;
-}
-export declare type ObjectStateInternal<T, P = any> = ObjectState<T, P> & {
-    set(value: P, opts?: InternalSetOpts): void;
-};
-/** Form state for list of children, i.e. `U` is a `Book` in a form with a `books: Book[]`. */
-export interface ListFieldState<T, U> extends Omit<FieldState<T, U[]>, "originalValue"> {
-    readonly rows: ReadonlyArray<ObjectState<U>>;
-    add(value: U, index?: number): void;
-    remove(indexOrValue: number | U): void;
-}
-/**
- * Config rules for each field in `T` that we're editing in a form.
- *
- * Basically every field is either a value/primitive or a list, and this `ObjectConfig` lets
- * the caller define field-specific behavior, i.e. validation rules.
- */
-export declare type ObjectConfig<T> = {
-    [P in keyof OmitIf<T, Function>]: T[P] extends Array<infer U> | null | undefined ? U extends Builtin ? ValueFieldConfig<T, T[P]> : ListFieldConfig<T, U> : ValueFieldConfig<T, T[P]> | ObjectFieldConfig<T[P]>;
-};
-declare type OmitIf<Base, Condition> = Pick<Base, {
-    [Key in keyof Base]: Base[Key] extends Condition ? never : Key;
-}[keyof Base]>;
-/** Field configuration for primitive values, i.e. strings/numbers/Dates/user-defined types. */
-export declare type ValueFieldConfig<T, V> = {
-    type: "value";
-    rules?: Rule<T, V | null | undefined>[];
-    /**
-     * If true, marks this field as the id, which will be used for things like "always include in changedValue".
-     *
-     * Defaults to true for fields named `id`.
-     */
-    isIdKey?: boolean;
-    /** If true, and this value is used on an entity in a list, the entity won't count towards the list validity. */
-    isDeleteKey?: boolean;
-    /** If true, the entity that contains this value will be treated as read only. */
-    isReadOnlyKey?: boolean;
-    /**
-     * Marks a field as being backed by a mobx class computed field.
-     *
-     * Note that it might still be settable (some computed have setters), but we do
-     * exclude from the `reset` operation, i.e. we assume resetting other non-computed fields
-     * will effectively reset this field as well.
-     */
-    computed?: boolean;
-    /** Marks a field as being initiallyread-only, i.e. `field.readOnly = true/false` can change this default. */
-    readOnly?: boolean;
-};
-/** Field configuration for list values, i.e. `U` is `Book` in a form with `books: Book[]`. */
-export declare type ListFieldConfig<T, U> = {
-    type: "list";
-    /** Rules that can run on the full list of children. */
-    rules?: Rule<T, readonly ObjectState<U>[]>[];
-    /** Config for each child's form state, i.e. each book. */
-    config: ObjectConfig<U>;
-    /**
-     * What the server-side update behavior is for this collection.
-     *
-     * When exhaustive, we include all rows in `changedValue` so that we
-     * don't orhan unchanged rows.
-     *
-     * When incremental, we only include changed rows in `changedValue`.
-     *
-     * Defaults to `exhaustive` b/c that is the safest and also Joist's
-     * default behavior.
-     */
-    update?: "exhaustive" | "incremental";
-};
-export declare type ObjectFieldConfig<U> = {
-    type: "object";
-    /** Config for the child's form state, i.e. each book. */
-    config: ObjectConfig<U>;
-};
-/**
- * Creates a new `ObjectState` for a given form object `T` given config rules in `config`.
- *
- * The returned `ObjectState` can be used in a mobx `useLocalObservable` to driven an
- * interactive form that tracks the current valid/touched/etc. state of both each
- * individual fields as well as the top-level form/object itself.
- */
-export declare function createObjectState<T>(config: ObjectConfig<T>, instance: T, opts?: {
-    maybeAutoSave?: () => void;
-}): ObjectState<T>;
-declare type Primitive = undefined | null | boolean | string | number | Function | Date | {
-    toJSON(): any;
-};
-/** Makes the keys in `T` required while keeping the values undefined. */
-export declare type DeepRequired<T> = T extends Primitive ? T : {
-    [P in keyof Required<T>]: T[P] extends Array<infer U> ? Array<DeepRequired<U>> : T[P] extends ReadonlyArray<infer U2> ? ReadonlyArray<DeepRequired<U2>> : DeepRequired<T[P]>;
-};
-export {};