@homebound/form-state 2.33.0 → 3.0.0

package/dist/formState.test.js

@@ -1,2109 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ObservableObject = void 0;
-const mobx_1 = require("mobx");
-const configBuilders_1 = require("./configBuilders");
-const objectField_1 = require("./fields/objectField");
-const formStateDomain_1 = require("./formStateDomain");
-const rules_1 = require("./rules");
-describe("formState", () => {
-    it("can create a simple object", () => {
-        const a = (0, objectField_1.createObjectState)({ title: { type: "value", rules: [rules_1.required] } }, {});
-        expect(a.valid).toBeFalsy();
-    });
-    it("can validate a simple input", () => {
-        const a = (0, objectField_1.createObjectState)({ title: { type: "value", rules: [rules_1.required] } }, { title: "b1" });
-        let numErrors = 0;
-        (0, mobx_1.autorun)(() => {
-            numErrors = a.title.errors.length;
-        });
-        expect(a.valid).toBeTruthy();
-        expect(numErrors).toEqual(0);
-        a.title.value = null;
-        expect(a.title.valid).toBeFalsy();
-        expect(numErrors).toEqual(1);
-        expect(a.title.errors).toEqual(["Required"]);
-        expect(a.errors).toEqual(["title: Required"]);
-    });
-    it("can tell what is required", () => {
-        const a = (0, objectField_1.createObjectState)({
-            title: { type: "value", rules: [rules_1.required] },
-            isPublished: { type: "value" },
-        }, {});
-        expect(a.title.required).toBeTruthy();
-        expect(a.isPublished.required).toBeFalsy();
-    });
-    it("trims whitespace within the required rule", () => {
-        const a = (0, objectField_1.createObjectState)({ title: { type: "value", rules: [rules_1.required] } }, { title: "initial valid title" });
-        let numErrors = 0;
-        (0, mobx_1.autorun)(() => {
-            numErrors = a.title.errors.length;
-        });
-        expect(a.valid).toBeTruthy();
-        expect(numErrors).toEqual(0);
-        // When a value contains only whitespace
-        a.title.value = "  ";
-        expect(a.title.valid).toBeFalsy();
-        expect(numErrors).toEqual(1);
-        expect(a.title.errors).toEqual(["Required"]);
-        expect(a.errors).toEqual(["title: Required"]);
-    });
-    it("can set values", () => {
-        const a = (0, objectField_1.createObjectState)({ title: { type: "value" } }, { title: "b1" });
-        expect(a.title.value).toEqual("b1");
-    });
-    it("can read values", () => {
-        const a = (0, objectField_1.createObjectState)({ title: { type: "value" } }, { title: "b1" });
-        expect(a.value.title).toEqual("b1");
-        expect(a.title.value).toEqual("b1");
-    });
-    it("can set dates", () => {
-        const a = (0, objectField_1.createObjectState)({
-            birthday: {
-                type: "value",
-                rules: [({ value }) => ((value === null || value === void 0 ? void 0 : value.getTime()) === formStateDomain_1.jan2.getTime() ? "cannot be born on jan2" : undefined)],
-            },
-        }, { birthday: formStateDomain_1.jan1 });
-        expect(a.birthday.value).toEqual(formStateDomain_1.jan1);
-        a.birthday.set(formStateDomain_1.jan2);
-        expect(a.birthday.errors).toEqual(["cannot be born on jan2"]);
-    });
-    it("can set nested values", () => {
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            books: [{ title: "b1" }],
-        });
-        expect(a1.books.rows[0].title.value).toEqual("b1");
-    });
-    it("can set nested values 2", () => {
-        const a = createAuthorWithAddressInputState({ address: { city: "b1" } });
-        expect(a.address.city.value).toEqual("b1");
-    });
-    it("can adapt values", () => {
-        // Given an author where `delete` is normally a boolean
-        const a = (0, objectField_1.createObjectState)({
-            delete: { type: "value" },
-        }, { delete: true });
-        const boolField = a.delete;
-        // But we adapt it to a string
-        const stringField = a.delete.adapt({
-            toValue: (b) => String(b),
-            fromValue: (s) => Boolean(s),
-        });
-        // Then we can read it as a string
-        expect(stringField.value).toEqual("true");
-        // And we can set it as a string
-        stringField.value = "";
-        expect(boolField.value).toBe(false);
-        // And the originalValue is maintained
-        expect(boolField.originalValue).toBe(true);
-        expect(stringField.originalValue).toBe("true");
-        // As well as the dirty.
-        expect(boolField.dirty).toBe(true);
-        expect(stringField.dirty).toBe(true);
-        // And reverting works
-        stringField.revertChanges();
-        expect(boolField.dirty).toBe(false);
-        expect(stringField.dirty).toBe(false);
-        expect(boolField.value).toBe(true);
-        expect(stringField.value).toBe("true");
-    });
-    it("maintains object identity", () => {
-        const a1 = { firstName: "a1" };
-        const state = createAuthorInputState(a1);
-        state.firstName.set("a2");
-        expect(state.value === a1).toEqual(true);
-        expect(state.originalValue !== a1).toEqual(true);
-        expect(a1.firstName).toEqual("a2");
-    });
-    it("maintains object identity of lists", () => {
-        var _a;
-        const b1 = { title: "t1" };
-        const a1 = { firstName: "a1", books: [b1] };
-        const state = createAuthorInputState(a1);
-        const b2 = { title: "t2" };
-        state.books.add(b2);
-        expect(state.value.books === a1.books).toEqual(true);
-        expect(state.books.value.length).toEqual(2);
-        expect((_a = a1.books) === null || _a === void 0 ? void 0 : _a.length).toEqual(2);
-        expect(state.books.rows[0].value === b1).toEqual(true);
-        expect(state.books.rows[1].value === b2).toEqual(true);
-        expect(a1.books[1] === b2).toEqual(true);
-    });
-    it("can add items anywhere within a list", () => {
-        const b1 = { title: "t1" };
-        const a1 = { firstName: "a1", books: [b1] };
-        const state = createAuthorInputState(a1);
-        let numBooks;
-        let ticks = 0;
-        (0, mobx_1.autorun)(() => {
-            numBooks = state.books.rows.length;
-            ticks++;
-        });
-        const b2 = { title: "t2" };
-        state.books.add(b2, 0);
-        expect(state.books.rows[0].value === b2).toEqual(true);
-        expect(state.books.rows[1].value === b1).toEqual(true);
-        expect(ticks).toEqual(2);
-        const b3 = { title: "t3" };
-        state.books.add(b3, 1);
-        expect(state.books.rows[0].value === b2).toEqual(true);
-        expect(state.books.rows[1].value === b3).toEqual(true);
-        expect(state.books.rows[2].value === b1).toEqual(true);
-        expect(ticks).toEqual(3);
-    });
-    it("list value can refresh on undefined", () => {
-        // Given a list field that is currently []
-        const a1 = { firstName: "a1", books: [] };
-        const state = createAuthorInputState(a1);
-        // When we refresh it with undefined
-        state.set({ books: undefined }, { refreshing: true });
-        // Then it doesn't blow up, and stays []
-        expect(state.books.value).toEqual([]);
-        expect(state.value).toEqual({ firstName: "a1", books: [] });
-        // And it's not considered changed
-        expect(state.books.dirty).toBe(false);
-        expect(state.books.originalValue).toEqual([]);
-    });
-    it("list value can refresh and not drop new children w/id", () => {
-        // Given a list field that is currently []
-        const a1 = { firstName: "a1", books: [] };
-        const state = createAuthorInputState(a1);
-        // And we add a new child on the client-side
-        state.books.add({ id: "b:1", title: "b1" });
-        // When we refresh it with the original list undefined
-        state.set({ books: [] }, { refreshing: true });
-        // Then it keeps the new child (and it somehow already has the id set)
-        expect(state.books.value).toEqual([{ id: "b:1", title: "b1" }]);
-        // And it's still considered changed
-        expect(state.books.dirty).toBe(true);
-        expect(state.books.originalValue).toEqual([]);
-        // And later when we refresh with the value acked from the server
-        state.set({ books: [{ id: "b:1", title: "b1", isPublished: true }] }, { refreshing: true });
-        // Then we have only 1 value
-        expect(state.books.value).toEqual([{ id: "b:1", title: "b1", isPublished: true }]);
-        // And we're not longer dirty
-        expect(state.books.dirty).toBe(false);
-    });
-    it("list value can refresh and not drop new children w/o an id", () => {
-        // Given a list field that is currently []
-        const a1 = { firstName: "a1", books: [] };
-        const state = createAuthorInputState(a1);
-        // And we add a new child on the client-side (and it doesn't have an id)
-        state.books.add({ title: "b1" });
-        // When we refresh it with the original list undefined
-        state.set({ books: [] }, { refreshing: true });
-        // Then it keeps the new child
-        expect(state.books.value).toEqual([{ title: "b1" }]);
-        // And it's still considered changed
-        expect(state.books.dirty).toBe(true);
-        expect(state.books.originalValue).toEqual([]);
-        // And later when we refresh with the value acked from the server
-        state.set({ books: [{ id: "b:1", title: "b1" }] }, { refreshing: true });
-        // Then we have only 1 value
-        expect(state.books.value).toEqual([{ id: "b:1", title: "b1" }]);
-        // And we're not longer dirty
-        expect(state.books.dirty).toBe(false);
-    });
-    it("list value can refresh and not drop new children that are just data", () => {
-        const config = configBuilders_1.f.config({
-            firstName: configBuilders_1.f.value(),
-            tags: configBuilders_1.f.list({ combo: configBuilders_1.f.value() }),
-        });
-        const state = (0, objectField_1.createObjectState)(config, { firstName: "a1", tags: [] });
-        // And we add a new child on the client-side (and it doesn't have an id)
-        state.tags.add({ combo: ["b1", "b2"] });
-        // When we refresh it with the original list undefined
-        state.set({ tags: [] }, { refreshing: true });
-        // Then it keeps the new child
-        expect(state.tags.value).toEqual([{ combo: ["b1", "b2"] }]);
-        // And it's still considered changed
-        expect(state.tags.dirty).toBe(true);
-        expect(state.tags.originalValue).toEqual([]);
-        // And we add an additional child
-        state.tags.add({ combo: ["c1", "c2"] });
-        // And a refresh brings back the 1st child acked from the server
-        state.set({ tags: [{ combo: ["b1", "b2"] }] }, { refreshing: true });
-        // Then we still have 2 children
-        expect(state.tags.value).toEqual([{ combo: ["b1", "b2"] }, { combo: ["c1", "c2"] }]);
-        // And we're still dirty
-        expect(state.tags.dirty).toBe(true);
-        // When the server finally acks both children
-        state.set({ tags: [{ combo: ["b1", "b2"] }, { combo: ["c1", "c2"] }] }, { refreshing: true });
-        // Then we're finally clean
-        expect(state.tags.dirty).toBe(false);
-    });
-    it("list value can refresh and drop children that were deleted", () => {
-        // Given a list field that is currently populated
-        const a1 = {
-            id: "a:1",
-            firstName: "a1",
-            books: [
-                { id: "b:1", title: "b1", op: "include" },
-                { id: "b:2", title: "b2", op: "include" },
-            ],
-        };
-        // And incremental deletion is enabled
-        const config = configBuilders_1.f.config({
-            id: configBuilders_1.f.value(),
-            books: configBuilders_1.f.list({ id: configBuilders_1.f.value(), title: configBuilders_1.f.value(), op: configBuilders_1.f.value() }),
-        });
-        const state = (0, objectField_1.createObjectState)(config, a1);
-        // When we delete the 1st book
-        state.books.rows[0].op.set("delete");
-        // When we refresh it only the 2nd book
-        state.set({ books: [{ id: "b:2", title: "b2" }] }, { refreshing: true });
-        // Then we only have 1 book
-        expect(state.books.value).toEqual([{ id: "b:2", title: "b2", op: "include" }]);
-        // And we're not dirty
-        expect(state.books.dirty).toBe(false);
-    });
-    it("list value can refresh and merge children that were added", () => {
-        // Given a list field that is currently populated with 1 child
-        const a1 = { id: "a:1", books: [{ id: "b:1", title: "b1" }] };
-        const state = createAuthorInputState(a1);
-        // When we add a new book
-        state.books.add({ title: "b2" });
-        // When we refresh it with both books, and the 2nd book now has its id assigned
-        state.set({
-            books: [
-                { id: "b:1", title: "b1" },
-                { id: "b:2", title: "b2" },
-            ],
-        }, { refreshing: true });
-        // Then wes till have two books
-        expect(state.books.value).toEqual([
-            { id: "b:1", title: "b1" },
-            { id: "b:2", title: "b2" },
-        ]);
-        // And we're not dirty
-        expect(state.books.dirty).toBe(false);
-    });
-    it("list value can refresh and merge grand children that were added", () => {
-        // Given a list field that is currently populated with 1 child w/1 grandchild
-        const a1 = {
-            id: "a:1",
-            books: [{ id: "b:1", title: "b1", reviews: [{ id: "r:1", rating: 5 }] }],
-        };
-        const config = configBuilders_1.f.config({
-            id: configBuilders_1.f.value(),
-            books: configBuilders_1.f.list({
-                id: configBuilders_1.f.value(),
-                title: configBuilders_1.f.value().req(),
-                reviews: configBuilders_1.f.list({ id: configBuilders_1.f.value(), rating: configBuilders_1.f.value().req() }),
-            }),
-        });
-        const state = (0, objectField_1.createObjectState)(config, a1);
-        // When we add a new book with two ratings
-        state.books.add({ title: "b2", reviews: [{ rating: 4 }, { rating: 3 }] });
-        // When we refresh but only the 1st review grandchild existed when we auto-saved
-        state.set({
-            books: [
-                { id: "b:1", title: "b1" },
-                {
-                    id: "b:2",
-                    title: "b2",
-                    reviews: [{ id: "r:2", rating: 4 }],
-                },
-            ],
-        }, { refreshing: true });
-        // Then we still have two books
-        expect(state.books.value).toEqual([
-            {
-                id: "b:1",
-                title: "b1",
-                reviews: [{ id: "r:1", rating: 5 }],
-            },
-            {
-                id: "b:2",
-                title: "b2",
-                // And we stitched together the ack-d 1st review (now with an id assigned) and the 2nd WIP review
-                reviews: [{ id: "r:2", rating: 4 }, { rating: 3 }],
-            },
-        ]);
-        // And we're still dirty
-        expect(state.books.dirty).toBe(true);
-        expect(state.books.rows[0].dirty).toBe(false);
-        expect(state.books.rows[1].dirty).toBe(true);
-        expect(state.books.rows[1].reviews.rows[0].dirty).toBe(false);
-        expect(state.books.rows[1].reviews.rows[1].dirty).toBe(false);
-        expect(state.books.rows[1].reviews.dirty).toBe(true);
-        // Until the 2nd auto-save completes
-        state.set({
-            books: [
-                { id: "b:1", title: "b1" },
-                {
-                    id: "b:2",
-                    title: "b2",
-                    reviews: [
-                        { id: "r:2", rating: 4 },
-                        { id: "r:3", rating: 3 },
-                    ],
-                },
-            ],
-        }, { refreshing: true });
-        // Then we stitch together the 2nd review as well
-        expect(state.books.value).toMatchObject([
-            { id: "b:1" },
-            { id: "b:2", reviews: [{ id: "r:2" }, { id: "r:3", rating: 3 }] },
-        ]);
-        // And we're no longer dirty
-        expect(state.books.dirty).toBe(false);
-    });
-    it("list value can observe changes", () => {
-        const b1 = { title: "t1" };
-        const a1 = { firstName: "a1", books: [b1] };
-        const state = createAuthorInputState(a1);
-        let books;
-        let ticks = 0;
-        (0, mobx_1.autorun)(() => {
-            books = state.books.value;
-            ticks++;
-        });
-        state.books.add({ title: "t2" }, 0);
-        expect(ticks).toEqual(2);
-    });
-    it("list originalValue can observe changes", () => {
-        const b1 = { title: "t1" };
-        const a1 = { firstName: "a1", books: [b1] };
-        const state = createAuthorInputState(a1);
-        let books;
-        let ticks = 0;
-        (0, mobx_1.autorun)(() => {
-            books = state.books.originalValue;
-            ticks++;
-        });
-        state.books.add({ title: "t2" }, 0);
-        expect(ticks).toEqual(1);
-        state.commitChanges();
-        expect(ticks).toEqual(2);
-    });
-    it("state originalValue can observe changes", () => {
-        const a1 = { firstName: "a1", books: [] };
-        const state = createAuthorInputState(a1);
-        let ticks = 0;
-        (0, mobx_1.autorun)(() => {
-            noop(state.originalValue);
-            ticks++;
-        });
-        state.books.add({ title: "t2" }, 0);
-        expect(ticks).toEqual(1);
-        state.commitChanges();
-        expect(ticks).toEqual(2);
-    });
-    it("maintains unknown fields", () => {
-        // Given the form is not directly editing id fields
-        const config = {
-            firstName: { type: "value" },
-            books: { type: "list", config: { title: { type: "value" } } },
-        };
-        // And we initially have ids in the input
-        const a1 = { id: "1", firstName: "a1", books: [{ id: "2", title: "t1" }] };
-        const state = (0, objectField_1.createObjectState)(config, a1);
-        // And we edit a few things
-        state.firstName.set("a2");
-        state.books.add({ title: "t2" });
-        // When we get back the originalValue
-        // Then it has the ids and the new values
-        expect(state.value).toMatchObject({
-            id: "1",
-            books: [{ id: "2", title: "t1" }, { title: "t2" }],
-        });
-    });
-    it("list field valid is based on nested fields", () => {
-        // Given an author that is initially valid
-        const a1 = createAuthorInputState({ firstName: "a1", books: [] });
-        expect(a1.valid).toBeTruthy();
-        let lastValid = undefined;
-        let ticks = 0;
-        (0, mobx_1.autorun)(() => {
-            lastValid = a1.valid;
-            ticks++;
-        });
-        // When an empty book is added
-        a1.set({ firstName: "a1", books: [{}] });
-        // Then it's title is invalid
-        expect(a1.books.rows.length).toEqual(1);
-        expect(a1.books.rows[0].title.valid).toBeFalsy();
-        expect(a1.books.rows[0].title.errors).toEqual(["Required"]);
-        // And the books collection itself is invalid
-        expect(a1.books.valid).toBeFalsy();
-        // But we don't currently show the error here b/c it's not an error on the collection itself;
-        // we could have like an `a1.books.allErrors` property instead.
-        expect(a1.books.errors).toEqual([]);
-        // And the author itself is also invalid
-        expect(a1.valid).toBeFalsy();
-        expect(lastValid).toBeFalsy();
-        expect(ticks).toEqual(2);
-        // And when it becomes valid
-        a1.books.rows[0].title.value = "b1";
-        // Then everything is reactively valid
-        expect(lastValid).toBeTruthy();
-        expect(ticks).toEqual(3);
-    });
-    it("can add nested values", () => {
-        // Given we already have a book
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            books: [{ title: "b1" }],
-        });
-        expect(a1.books.rows[0].title.value).toEqual("b1");
-        // When another book is added
-        a1.books.add({ title: "b2" });
-        expect(a1.books.touched).toEqual(true);
-        // Then both books are visible
-        expect(a1.books.rows[0].title.value).toEqual("b1");
-        expect(a1.books.rows[1].title.value).toEqual("b2");
-    });
-    it("can access nested values", () => {
-        // Given we have two books
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            books: [{ title: "b1" }, { title: "b2" }],
-        });
-        // We can see what each book looks like
-        expect(a1.books.value[0].title).toEqual("b1");
-        expect(a1.books.value[1].title).toEqual("b2");
-    });
-    it("can remove nested values", () => {
-        // Given we have two books
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            books: [{ title: "b1" }, { title: "b2" }],
-        });
-        expect(a1.books.rows[0].title.value).toEqual("b1");
-        // When we remove the 1st book
-        a1.books.remove(0);
-        // Then only the 2nd book is left
-        expect(a1.books.rows.length).toEqual(1);
-        expect(a1.books.rows[0].title.value).toEqual("b2");
-    });
-    it("can remove non-first nested values", () => {
-        // Given we have two books
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            books: [{ title: "b1" }, { title: "b2" }],
-        });
-        expect(a1.books.rows[0].title.value).toEqual("b1");
-        // When we remove the 2nd book
-        a1.books.remove(1);
-        // Then only the 1st book is left
-        expect(a1.books.rows.length).toEqual(1);
-        expect(a1.books.rows[0].title.value).toEqual("b1");
-    });
-    it("can remove added nested values", () => {
-        // Given we have a a single book
-        const a1 = createAuthorInputState({ books: [{ title: "b1" }] });
-        // And we push a new one
-        a1.books.add({ title: "b2" });
-        // When we remove the 2nd book by the row's reference value
-        a1.books.remove(a1.books.rows[1].value);
-        // Then only the 1st book is left
-        expect(a1.books.rows.length).toEqual(1);
-    });
-    it("can remove non-first nested values by identity", () => {
-        // Given we have two books
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            books: [{ title: "b1" }, { title: "b2" }],
-        });
-        expect(a1.books.rows[0].title.value).toEqual("b1");
-        // When we remove the 2nd book
-        a1.books.remove(a1.books.value[1]);
-        // Then only the 1st book is left
-        expect(a1.books.rows.length).toEqual(1);
-        expect(a1.books.rows[0].title.value).toEqual("b1");
-    });
-    it("can validate the nested collection directly", () => {
-        // Given we already have a book
-        const a1 = createAuthorInputState({ firstName: "a1", books: [] });
-        let ticks = 0;
-        let numErrors = 0;
-        (0, mobx_1.autorun)(() => {
-            numErrors = a1.books.errors.length;
-            ticks++;
-        });
-        expect(ticks).toEqual(1);
-        expect(numErrors).toEqual(0);
-        a1.books.rules.push(({ value: b }) => (b.length === 0 ? "Empty" : undefined));
-        expect(a1.books.valid).toBeFalsy();
-        expect(a1.books.errors).toEqual(["Empty"]);
-        expect(ticks).toEqual(2);
-        expect(numErrors).toEqual(1);
-        a1.books.add({});
-        expect(ticks).toEqual(3);
-        expect(numErrors).toEqual(0);
-    });
-    it("can validate across fields", () => {
-        const a = (0, objectField_1.createObjectState)({
-            firstName: { type: "value", rules: [] },
-            lastName: { type: "value" },
-        }, {});
-        a.lastName.rules.push(() => {
-            return a.firstName.value === a.lastName.value ? "Last name cannot be first name" : undefined;
-        });
-        a.firstName.value = "b1";
-        expect(a.firstName.valid).toBeTruthy();
-        expect(a.lastName.valid).toBeTruthy();
-        a.lastName.value = "b1";
-        expect(a.firstName.valid).toBeTruthy();
-        expect(a.lastName.errors).toEqual(["Last name cannot be first name"]);
-    });
-    it("passes sanitized values to validation rules", () => {
-        // Given a field with a validation rule
-        const rule = jest.fn().mockReturnValue("Required");
-        const a = (0, objectField_1.createObjectState)({ firstName: { type: "value", rules: [rule] } }, {});
-        expect(rule).toHaveBeenCalledTimes(0);
-        // When the field is set to empty string
-        a.firstName.value = "";
-        expect(a.firstName.errors).toEqual(["Required"]);
-        expect(rule).toHaveBeenCalledTimes(1);
-        // Then the validation rule was passed undefined
-        expect(rule).toHaveBeenCalledWith({
-            value: undefined,
-            originalValue: undefined,
-            key: "firstName",
-            object: expect.anything(),
-        });
-    });
-    it("passes trimmed values to validation rules on maybeAutoSave", () => {
-        // Given we have a required rule
-        const rule = jest.fn().mockReturnValue("Required");
-        const a = (0, objectField_1.createObjectState)({ firstName: { type: "value", rules: [rule] } }, {});
-        expect(rule).toHaveBeenCalledTimes(0);
-        // When the user initially sets an empty string value
-        a.firstName.focus();
-        a.firstName.value = "   ";
-        expect(a.firstName.errors).toEqual(["Required"]);
-        // Then initially the rule is called with the empty string
-        expect(rule).toHaveBeenCalledTimes(1);
-        expect(rule).toHaveBeenCalledWith({
-            value: "   ",
-            originalValue: undefined,
-            key: "firstName",
-            object: expect.anything(),
-        });
-        // But then when the field maybeAutoSaves (i.e. via blur)
-        a.firstName.maybeAutoSave();
-        expect(a.firstName.errors).toEqual(["Required"]);
-        // Then the rule is called with the undefined
-        expect(rule).toHaveBeenCalledTimes(2);
-        expect(rule).toHaveBeenCalledWith({
-            value: undefined,
-            originalValue: undefined,
-            key: "firstName",
-            object: expect.anything(),
-        });
-    });
-    it("simple value changes trigger observers", () => {
-        const a = (0, objectField_1.createObjectState)({
-            title: { type: "value", rules: [rules_1.required] },
-        }, { title: "t2" });
-        let lastTitle = undefined;
-        let ticks = 0;
-        (0, mobx_1.autorun)(() => {
-            lastTitle = a.title.value;
-            ticks++;
-        });
-        expect(ticks).toEqual(1);
-        expect(lastTitle).toEqual("t2");
-    });
-    it("knows value fields are dirty", () => {
-        const a1 = createAuthorInputState({ firstName: "a1" });
-        expect(a1.firstName.dirty).toBeFalsy();
-        a1.firstName.set("a2");
-        expect(a1.firstName.dirty).toBeTruthy();
-        a1.firstName.set("a1");
-        expect(a1.firstName.dirty).toBeFalsy();
-    });
-    it("knows value fields are dirty even if rendered before the initial set", () => {
-        const a1 = createAuthorInputState({ firstName: "a1" });
-        expect(a1.firstName.dirty).toBeFalsy();
-        a1.firstName.set("a2");
-        expect(a1.firstName.dirty).toBeTruthy();
-        a1.firstName.set("a1");
-        expect(a1.firstName.dirty).toBeFalsy();
-    });
-    it("knows nested value fields are dirty", () => {
-        const a1 = createAuthorInputState({ books: [{ title: "t1" }] });
-        expect(a1.books.rows[0].title.dirty).toBeFalsy();
-        a1.books.rows[0].title.set("t2");
-        expect(a1.books.rows[0].title.dirty).toBeTruthy();
-        a1.books.rows[0].title.set("t1");
-        expect(a1.books.rows[0].title.dirty).toBeFalsy();
-    });
-    it("knows list fields are dirty", () => {
-        const a1 = createAuthorInputState({ books: [] });
-        expect(a1.books.dirty).toBeFalsy();
-        a1.books.add({ title: "t2" });
-        expect(a1.books.dirty).toBeTruthy();
-        a1.books.remove(0);
-        expect(a1.dirty).toBeFalsy();
-    });
-    it("can ignore isLocalOnly fields as not dirty", () => {
-        // Given we have an `isPublished` field that is marked as local only
-        const config = {
-            id: { type: "value" },
-            books: {
-                type: "list",
-                config: {
-                    id: { type: "value" },
-                    isPublished: { type: "value", isLocalOnly: true },
-                },
-            },
-        };
-        // And it starts out true
-        const a1 = (0, objectField_1.createObjectState)(config, {
-            id: "a:1",
-            books: [{ id: "b:1", isPublished: true }],
-        });
-        // When we change the value to false
-        a1.books.rows[0].isPublished.value = false;
-        // Then the field itself is dirty
-        expect(a1.books.rows[0].isPublished.dirty).toBe(true);
-        // But object is not
-        expect(a1.dirty).toBe(false);
-        expect(a1.books.dirty).toBe(false);
-        // And we don't include it in changedValue
-        expect(a1.changedValue).toEqual({ id: "a:1" });
-    });
-    it("handles list fields with duplicate ids", () => {
-        // Given an author that incorrectly has duplicate books
-        const a1 = createAuthorInputState({
-            books: [
-                { id: "b:1", title: "b1" },
-                { id: "b:1", title: "b2" },
-            ],
-        });
-        // Then it didn't blow up
-        expect(a1.books.dirty).toBeFalsy();
-        // And the 1st book won
-        expect(a1.books.rows[0].title.value).toBe("b1");
-        expect(a1.books.rows[1].title.value).toBe("b1");
-    });
-    it("calls maybeAutoSave when adding or removing to a list", () => {
-        const maybeAutoSave = jest.fn();
-        const a1 = createAuthorInputState({ books: [] }, maybeAutoSave);
-        expect(a1.books.dirty).toBeFalsy();
-        a1.books.add({ title: "t2" });
-        expect(a1.books.dirty).toBeTruthy();
-        a1.books.remove(0);
-        expect(a1.dirty).toBeFalsy();
-        expect(maybeAutoSave).toBeCalledTimes(2);
-    });
-    it("calls maybeAutoSave when programmatically setting a value", () => {
-        const maybeAutoSave = jest.fn();
-        // Given an author listening for blur
-        const a1 = createAuthorInputState({ books: [{}] }, maybeAutoSave);
-        // When we programmatically set a field that isn't focused
-        a1.firstName.value = "first";
-        // Then we call maybeAutoSave
-        expect(maybeAutoSave).toBeCalledTimes(1);
-        // And when we set a nested value
-        a1.books.rows[0].title.value = "title";
-        // Then we called maybeAutoSave again
-        expect(maybeAutoSave).toBeCalledTimes(2);
-    });
-    it("can skip maybeAutoSave when programmatically setting a value", () => {
-        const maybeAutoSave = jest.fn();
-        // Given an author listening for blur
-        const a1 = createAuthorInputState({ books: [{}] }, maybeAutoSave);
-        // When we programmatically set a field that isn't focused
-        a1.set({ firstName: "first" }, { autoSave: false });
-        // Then we don't call maybeAutoSave
-        expect(maybeAutoSave).toBeCalledTimes(0);
-    });
-    it("defers calling maybeAutoSave when setting a focused value", () => {
-        const maybeAutoSave = jest.fn();
-        // Given an author listening for blur
-        const a1 = createAuthorInputState({ books: [{}] }, maybeAutoSave);
-        // And the field is focused
-        a1.firstName.focus();
-        // When we we set the field
-        a1.firstName.value = "first";
-        // Then we don't call maybeAutoSave
-        expect(maybeAutoSave).toBeCalledTimes(0);
-    });
-    it("skips maybeAutoSave when refreshing", () => {
-        const maybeAutoSave = jest.fn();
-        // Given an author listening for blur
-        const a1 = createAuthorInputState({ books: [{}] }, maybeAutoSave);
-        // When we programmatically set a field that isn't focused
-        a1.set({ firstName: "first" }, { refreshing: true });
-        // Then we don't call maybeAutoSave
-        expect(maybeAutoSave).toBeCalledTimes(0);
-    });
-    it("skips maybeAutoSave when resetting", () => {
-        const maybeAutoSave = jest.fn();
-        // Given an author listening for blur
-        const a1 = createAuthorInputState({ books: [{}] }, maybeAutoSave);
-        // And we called maybeAutoSave once
-        a1.set({ firstName: "first" });
-        expect(maybeAutoSave).toBeCalledTimes(1);
-        // When we reset
-        a1.revertChanges();
-        // We don't call blur again
-        expect(maybeAutoSave).toBeCalledTimes(1);
-    });
-    it("skips maybeAutoSave when not dirty", () => {
-        const maybeAutoSave = jest.fn();
-        // Given an author listening for blur
-        const a1 = createAuthorInputState({ firstName: "first", books: [{}] }, maybeAutoSave);
-        // When we programmatically set a field to it's existing valued
-        a1.firstName.value = "first";
-        // Then we don't call maybeAutoSave
-        expect(maybeAutoSave).toBeCalledTimes(0);
-    });
-    it("knows list of primitives are dirty", () => {
-        const a1 = (0, objectField_1.createObjectState)({ favoriteColors: { type: "value" } }, {});
-        expect(a1.favoriteColors.dirty).toBeFalsy();
-        a1.favoriteColors.set([formStateDomain_1.Color.Blue]);
-        expect(a1.dirty).toBeTruthy();
-        a1.favoriteColors.set(undefined);
-        expect(a1.dirty).toBeFalsy();
-        // Because we were originally undefined, setting as `[]` coerces to `undefined`
-        a1.favoriteColors.set([]);
-        expect(a1.dirty).toBeFalsy();
-    });
-    it("knows list of primitives are dirty with initialized as empty list", () => {
-        const a1 = (0, objectField_1.createObjectState)({ favoriteColors: { type: "value" } }, { favoriteColors: [] });
-        expect(a1.favoriteColors.dirty).toBeFalsy();
-        a1.favoriteColors.set([formStateDomain_1.Color.Blue]);
-        expect(a1.dirty).toBeTruthy();
-        a1.favoriteColors.set([]);
-        expect(a1.dirty).toBeFalsy();
-        // Because we were originally undefined, setting as `[]` coerces to `undefined`
-        a1.favoriteColors.set([]);
-        expect(a1.dirty).toBeFalsy();
-    });
-    it("can evaluate arrays to be equal even if order of options are different from original when strictOrder = false", () => {
-        // Given an array field value where we define `strictOrder` as false
-        const a1 = (0, objectField_1.createObjectState)({ favoriteColors: { type: "value", strictOrder: false } }, { favoriteColors: [formStateDomain_1.Color.Red, formStateDomain_1.Color.Blue] });
-        expect(a1.favoriteColors.dirty).toBeFalsy();
-        // When changing the order of the values
-        a1.favoriteColors.set([formStateDomain_1.Color.Blue, formStateDomain_1.Color.Red]);
-        // Then expect the field to not be dirty
-        expect(a1.dirty).toBeFalsy();
-    });
-    it("evaluates arrays to be equal based on order by default", () => {
-        // Given an array field value
-        const a1 = (0, objectField_1.createObjectState)({ favoriteColors: { type: "value" } }, { favoriteColors: [formStateDomain_1.Color.Red, formStateDomain_1.Color.Blue] });
-        expect(a1.favoriteColors.dirty).toBeFalsy();
-        // When we change the order of the values
-        a1.favoriteColors.set([formStateDomain_1.Color.Blue, formStateDomain_1.Color.Red]);
-        // Then the field should be dirty
-        expect(a1.dirty).toBeTruthy();
-    });
-    it("knows originally unset fields are dirty", () => {
-        // Given firstName is purposefully not set when originally initialized
-        const a1 = createAuthorInputState({});
-        expect(a1.firstName.dirty).toBeFalsy();
-        // When it is set
-        a1.firstName.value = "a1";
-        // Then it's dirty
-        expect(a1.firstName.dirty).toBeTruthy();
-        // And when it's set back to empty
-        a1.firstName.value = undefined;
-        // Then it's no longer dirty
-        expect(a1.firstName.dirty).toBeFalsy();
-    });
-    it("knows strings set to empty string should be undefined", () => {
-        const a1 = createAuthorInputState({ firstName: undefined });
-        a1.firstName.value = "";
-        expect(a1.firstName.value).toBeUndefined();
-    });
-    it("knows object fields are dirty", () => {
-        const a1 = createAuthorInputState({ firstName: "a1" });
-        expect(a1.dirty).toBeFalsy();
-        a1.firstName.set("a2");
-        expect(a1.dirty).toBeTruthy();
-        a1.firstName.set("a1");
-        expect(a1.dirty).toBeFalsy();
-    });
-    it("realizes object fields set to null aren't actually dirty", () => {
-        // Given we started off with a `object: undefined`
-        const a1 = createAuthorWithAddressInputState({ address: undefined });
-        expect(a1.address.dirty).toBe(false);
-        expect(a1.address.value).toEqual({});
-        // And it's later set to null, i.e. from a mutation returning `{ address: null }`
-        a1.set({ firstName: "a1", address: null });
-        // Then we convert it to `{}` to potentially hold data
-        expect(a1.address.value).toEqual({});
-        // But we don't consider the address dirty
-        expect(a1.address.dirty).toBe(false);
-        expect(a1.changedValue).toEqual({ firstName: "a1" });
-    });
-    it("knows an object's field of type object is dirty", () => {
-        const a1 = createAuthorInputState({
-            books: [{ title: "b1", classification: formStateDomain_1.dd100 }],
-        });
-        expect(a1.dirty).toBeFalsy();
-        a1.books.rows[0].set({ classification: formStateDomain_1.dd200 });
-        expect(a1.dirty).toBeTruthy();
-        a1.books.rows[0].set({ classification: formStateDomain_1.dd100 });
-        expect(a1.dirty).toBeFalsy();
-    });
-    it("resets values", () => {
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            lastName: "aL1",
-            books: [
-                { title: "b1", classification: formStateDomain_1.dd100 },
-                { title: "b2", classification: formStateDomain_1.dd100 },
-            ],
-        });
-        expect(a1.dirty).toBeFalsy();
-        a1.firstName.set("a2");
-        a1.firstName.touched = true;
-        a1.lastName.set("aL2");
-        a1.books.rows[0].set({ title: "b2" });
-        a1.books.rows[1].set({ title: "bb2" });
-        a1.books.add({ title: "b3" });
-        expect(a1.books.touched).toEqual(true);
-        expect(a1.dirty).toBeTruthy();
-        a1.revertChanges();
-        expect(a1.firstName.value).toBe("a1");
-        expect(a1.firstName.touched).toBeFalsy();
-        expect(a1.lastName.value).toBe("aL1");
-        expect(a1.books.rows.length).toBe(2);
-        expect(a1.books.touched).toBe(false);
-        expect(a1.books.rows[0].title.value).toBe("b1");
-        expect(a1.books.rows[0].title.dirty).toBe(false);
-        expect(a1.books.rows[0].title.touched).toBe(false);
-        expect(a1.books.rows[1].title.value).toBe("b2");
-        expect(a1.dirty).toBeFalsy();
-        expect(a1.touched).toBeFalsy();
-    });
-    it("resets values even if read only", () => {
-        // Given a form state
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            lastName: "aL1",
-            books: [
-                { id: "b:1", title: "b1", classification: formStateDomain_1.dd100 },
-                { id: "b:2", title: "b2", classification: formStateDomain_1.dd100 },
-            ],
-        });
-        // And some values have been changed
-        expect(a1.dirty).toBeFalsy();
-        a1.firstName.set("a2");
-        a1.firstName.touched = true;
-        a1.lastName.set("aL2");
-        a1.books.rows[0].set({ title: "b2" });
-        a1.books.rows[1].set({ title: "bb2" });
-        a1.books.add({ title: "b3" });
-        expect(a1.books.touched).toEqual(true);
-        expect(a1.dirty).toBeTruthy();
-        // And the "readOnly=true" operation has "beat" the reset operation
-        a1.readOnly = true;
-        // When we reset
-        a1.revertChanges();
-        // Then it still works
-        expect(a1.firstName.value).toBe("a1");
-        expect(a1.firstName.touched).toBeFalsy();
-        expect(a1.lastName.value).toBe("aL1");
-        expect(a1.books.rows.length).toBe(2);
-        expect(a1.books.touched).toBe(false);
-        expect(a1.books.rows[0].title.value).toBe("b1");
-        expect(a1.books.rows[0].title.dirty).toBe(false);
-        expect(a1.books.rows[0].title.touched).toBe(false);
-        expect(a1.books.rows[1].title.value).toBe("b2");
-        expect(a1.dirty).toBeFalsy();
-        expect(a1.touched).toBeFalsy();
-    });
-    it("saves values into _originalState", () => {
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            lastName: "aL1",
-            books: [{ title: "b1", classification: formStateDomain_1.dd100 }],
-        });
-        expect(a1.dirty).toBeFalsy();
-        // Now dirty things up.
-        a1.firstName.set("a2");
-        a1.lastName.set("aL2");
-        a1.books.rows[0].set({ title: "b2" });
-        a1.books.add({ title: "bb2" });
-        // Set book 2 to an different value. Ensures our save can traverse all rows
-        a1.books.rows[1].set({ title: "bb3" });
-        // verify ValueFieldState is dirty, then save, then no longer dirty.
-        expect(a1.firstName.dirty).toBeTruthy();
-        a1.firstName.commitChanges();
-        expect(a1.firstName.dirty).toBeFalsy();
-        // verify ListFieldState is dirty, then save, then no longer dirty.
-        expect(a1.books.dirty).toBeTruthy();
-        a1.books.commitChanges();
-        expect(a1.books.dirty).toBeFalsy();
-        // Verify the remaining form is still dirty
-        expect(a1.dirty).toBeTruthy();
-        a1.commitChanges();
-        // Verify after save the whole form is no longer dirty.
-        expect(a1.dirty).toBeFalsy();
-    });
-    it("can touch everything at once", () => {
-        const a1 = createAuthorInputState({ firstName: "a1", books: [{ title: "b1" }] });
-        expect(a1.firstName.touched).toBeFalsy();
-        expect(a1.books.touched).toBeFalsy();
-        expect(a1.books.rows[0].title.touched).toBeFalsy();
-        expect(a1.touched).toBeFalsy();
-        a1.touched = true;
-        expect(a1.firstName.touched).toBeTruthy();
-        expect(a1.books.touched).toBeTruthy();
-        expect(a1.books.rows[0].title.touched).toBeTruthy();
-        expect(a1.touched).toBeTruthy();
-    });
-    it("remembers deleted values as null", () => {
-        // Given a property that is initially set
-        const a1 = createAuthorInputState({ firstName: "asdf" });
-        // When it's set to an empty/undefined value
-        a1.firstName.value = "";
-        // Then we keep it as null
-        expect(a1.firstName.value).toBeNull();
-        expect(a1.originalValue.firstName).toBe("asdf");
-        expect(a1.firstName.dirty).toBeTruthy();
-        // And when the server acks as null
-        a1.set({ firstName: undefined }, { refreshing: true });
-        // Then it's no longer dirty
-        expect(a1.firstName.dirty).toBe(false);
-        expect(a1.firstName.originalValue).toBe(undefined);
-        expect(a1.firstName.value).toBe(undefined);
-        expect(a1.changedValue).toEqual({});
-    });
-    it("initializes null values to be undefined", () => {
-        // Given a property that is initially set to null
-        const a1 = createAuthorInputState({ firstName: null });
-        // Then expect it to be set to undefined
-        expect(a1.firstName.value).toBeUndefined();
-    });
-    it("can keep initially undefined values as null", () => {
-        // Given a property that is initially set
-        const a1 = createAuthorInputState({ firstName: "foo" });
-        // When we set it to null
-        a1.firstName.value = null;
-        // Then that isn't lost
-        expect(a1.firstName.value).toBeNull();
-        expect(a1.value.firstName).toBeNull();
-    });
-    it("can map properties to other types", () => {
-        const a1 = (0, objectField_1.createObjectState)({
-            person: { type: "value" },
-        }, { person: { firstName: "a1", lastName: "b1" } });
-        a1.person.set({ firstName: "a2", lastName: "b2" });
-        const inputWithPerson = a1.value;
-        const { firstName, lastName } = inputWithPerson.person;
-        const input = { ...inputWithPerson, firstName, lastName };
-        expect(input.firstName).toEqual("a2");
-        expect(input.lastName).toEqual("b2");
-    });
-    it("has readonly", () => {
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            lastName: "aL1",
-            books: [{ title: "b1", classification: formStateDomain_1.dd100 }],
-        });
-        const fields = [a1, a1.firstName, a1.books, a1.books.rows[0].title, a1.books.rows[0].classification];
-        fields.forEach((f) => expect(f.readOnly).toBeFalsy());
-        a1.readOnly = true;
-        fields.forEach((f) => expect(f.readOnly).toBeTruthy());
-        fields.forEach((f) => {
-            expect(() => f.set(null)).toThrow("is currently readOnly");
-        });
-    });
-    it("maintain field readOnly state when form is readOnly", () => {
-        // Given a formState
-        const formState = (0, objectField_1.createObjectState)({ title: { type: "value", rules: [rules_1.required], readOnly: true } }, {});
-        // Then expect form
-        expect(formState.title.readOnly).toBeTruthy();
-    });
-    it("has an object-level readOnly=true override field-level readOnly=false", () => {
-        // Given a top-level object
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            lastName: "aL1",
-            books: [{ title: "b1", classification: formStateDomain_1.dd100 }],
-        });
-        // And it is read-only
-        a1.readOnly = true;
-        // Then its fields are read-only
-        const fields = [a1, a1.firstName, a1.books, a1.books.rows[0].title, a1.books.rows[0].classification];
-        fields.forEach((f) => expect(f.readOnly).toBeTruthy());
-        // And even if a specific field tries to _not_ be read-only,
-        // i.e. due to a more granular business rule that happens to
-        // be allowed right now
-        a1.firstName.readOnly = false;
-        // Then the field-level rule is ignored, and it's still treated as read-only
-        expect(a1.firstName.readOnly).toBeTruthy();
-    });
-    it("has an field-level readOnly=true override object-level readOnly=false", () => {
-        // Given a top-level object
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            lastName: "aL1",
-            books: [{ title: "b1", classification: formStateDomain_1.dd100 }],
-        });
-        // And the top-level form is explicitly set to read-only=false
-        a1.readOnly = false;
-        // Then its fields are not read-only
-        const fields = [a1, a1.firstName, a1.books, a1.books.rows[0].title, a1.books.rows[0].classification];
-        fields.forEach((f) => expect(f.readOnly).toBeFalsy());
-        // But when one of the fields opts in to readOnly
-        a1.firstName.readOnly = true;
-        // Then the field-level rule is respected
-        expect(a1.firstName.readOnly).toBeTruthy();
-    });
-    it("has an object-level loading=true override field-level loading=false", () => {
-        // Given a top-level object
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            lastName: "aL1",
-            books: [{ title: "b1", classification: formStateDomain_1.dd100 }],
-        });
-        // And it is loading
-        a1.loading = true;
-        // Then its fields are read-only
-        const fields = [a1, a1.firstName, a1.books, a1.books.rows[0].title, a1.books.rows[0].classification];
-        fields.forEach((f) => expect(f.loading).toBeTruthy());
-        // And even if a specific field tries to _not_ be loading
-        a1.firstName.loading = false;
-        // Then the field-level value is ignored, and it's still treated as loading
-        expect(a1.firstName.loading).toBeTruthy();
-    });
-    it("has an field-level loading=true override object-level loading=false", () => {
-        // Given a top-level object
-        const a1 = createAuthorInputState({
-            firstName: "a1",
-            lastName: "aL1",
-            books: [{ title: "b1", classification: formStateDomain_1.dd100 }],
-        });
-        // And the top-level form is explicitly set to loading=false
-        a1.loading = false;
-        // Then its fields are not loading
-        const fields = [a1, a1.firstName, a1.books, a1.books.rows[0].title, a1.books.rows[0].classification];
-        fields.forEach((f) => expect(f.loading).toBeFalsy());
-        // But when one of the fields opts in to loading
-        a1.firstName.loading = true;
-        // Then the field-level loading is respected
-        expect(a1.firstName.loading).toBeTruthy();
-    });
-    it("canSave returns dirty and touches", () => {
-        const a1 = (0, objectField_1.createObjectState)({
-            firstName: { type: "value", rules: [rules_1.required] },
-        }, {});
-        expect(a1.firstName.touched).toBeFalsy();
-        expect(a1.canSave()).toBeFalsy();
-        expect(a1.firstName.touched).toBeTruthy();
-    });
-    it("uses toJSON if available for dirty checks", () => {
-        const a1 = (0, objectField_1.createObjectState)({
-            birthday: { type: "value" },
-        }, { birthday: new formStateDomain_1.DateOnly(formStateDomain_1.jan1) });
-        a1.birthday.set(new formStateDomain_1.DateOnly(formStateDomain_1.jan1));
-        expect(a1.birthday.dirty).toBeFalsy();
-    });
-    it("can create a nested object", () => {
-        const a = createAuthorWithAddressInputState({});
-        expect(a.valid).toBeFalsy();
-    });
-    it("can validate a nested input", () => {
-        const a = createAuthorWithAddressInputState({ address: { street: "b1" } });
-        expect(a.valid).toBeTruthy();
-    });
-    it("can validate a list input", () => {
-        const a = (0, objectField_1.createObjectState)({
-            books: {
-                type: "list",
-                config: { title: { type: "value", rules: [rules_1.required] } },
-                rules: [({ value }) => (value.find((b) => b.title.value === "t1") ? "Cannot have t1" : undefined)],
-            },
-        }, {});
-        let lastErrors = "";
-        (0, mobx_1.autorun)(() => {
-            lastErrors = a.books.errors.join(", ");
-        });
-        a.books.add({ title: "t1" });
-        expect(lastErrors).toEqual("Cannot have t1");
-        a.books.rows[0].title.value = "t2";
-        expect(lastErrors).toEqual("");
-    });
-    it("can ignore a deleted list entry", () => {
-        const a = (0, objectField_1.createObjectState)({
-            books: {
-                type: "list",
-                config: {
-                    title: { type: "value", rules: [rules_1.required] },
-                    delete: { type: "value", isDeleteKey: true },
-                },
-            },
-        }, {});
-        // Given we have a known-bad list entry
-        a.books.add({ title: null, delete: false });
-        // And are initially invalid
-        expect(a.books.valid).toBeFalsy();
-        // When the list entry is deleted
-        a.books.rows[0].delete.value = true;
-        // Then we're valid
-        expect(a.books.valid).toBeTruthy();
-    });
-    it("can treat a list entry as read-only", () => {
-        const a = (0, objectField_1.createObjectState)({
-            books: {
-                type: "list",
-                config: {
-                    title: { type: "value", rules: [rules_1.required] },
-                    isPublished: { type: "value", isReadOnlyKey: true },
-                },
-            },
-        }, {});
-        // Given we have a published book
-        a.books.add({ title: null, isPublished: true });
-        // And an unpublished book
-        a.books.add({ title: null, isPublished: false });
-        // And we currently depend on the form.readOnly being invoked
-        a.readOnly = false;
-        // Then the 1st one is read only
-        expect(a.books.rows[0].readOnly).toBeTruthy();
-        expect(a.books.rows[0].title.readOnly).toBeTruthy();
-        // And the 2nd one is not
-        expect(a.books.rows[1].readOnly).toBeFalsy();
-        expect(a.books.rows[1].title.readOnly).toBeFalsy();
-        // And reset does not blow up
-        a.revertChanges();
-    });
-    it("can set nested values when original null", () => {
-        const a = createAuthorWithAddressInputState({ address: null });
-        a.address.city.value = "b1";
-        expect(a.address.city.value).toEqual("b1");
-        expect(a.address.value).toMatchInlineSnapshot(`
-      {
-        "city": "b1",
-      }
-    `);
-        expect(a.value).toMatchInlineSnapshot(`
-      {
-        "address": {
-          "city": "b1",
-        },
-      }
-    `);
-    });
-    it("can wrap an existing list observable", () => {
-        // Given an array observable that is already created
-        const b1 = { title: "b1" };
-        const books = (0, mobx_1.observable)([b1]);
-        // When we create a form state around it
-        const formState = createAuthorInputState({ books });
-        // Then the initial book was copied over
-        let lastLength = 0;
-        (0, mobx_1.autorun)(() => {
-            lastLength = formState.books.rows.length;
-        });
-        expect(lastLength).toEqual(1);
-        // And when we add a new book to the original observable
-        books.push({ title: "b2" });
-        // Then the formState saw it
-        expect(lastLength).toEqual(2);
-    });
-    it("can reset observable objects with computeds", () => {
-        const formState = (0, objectField_1.createObjectState)({
-            firstName: { type: "value" },
-            lastName: { type: "value" },
-            fullName: { type: "value" },
-        }, new ObservableObject());
-        expect(formState.firstName.value).toEqual("first");
-        expect(formState.fullName.value).toEqual("first last");
-        expect(formState.fullName.dirty).toEqual(false);
-        formState.firstName.value = "change";
-        expect(formState.fullName.value).toEqual("change last");
-        expect(formState.fullName.dirty).toEqual(true);
-        formState.revertChanges();
-        expect(formState.firstName.value).toEqual("first");
-    });
-    it("can observe observable objects being mutated directly", () => {
-        // Given a mobx class with a computed
-        const instance = new ObservableObject();
-        const formState = (0, objectField_1.createObjectState)(authorWithFullName, instance);
-        expect(formState.firstName.value).toEqual("first");
-        expect(formState.fullName.value).toEqual("first last");
-        // And we hook up reactivity to the computed
-        let numCalcs = 0;
-        (0, mobx_1.autorun)(() => {
-            numCalcs++;
-            noop(formState.fullName.value);
-        });
-        // When the underlying mobx class is directly changed
-        instance.firstName = "change";
-        // Then our form-state computed re-run
-        expect(numCalcs).toBe(2);
-        expect(formState.fullName.value).toEqual("change last");
-        // And when the underlying mobx class has a field unset
-        instance.firstName = undefined;
-        // Then our form-state computed re-runs again
-        expect(numCalcs).toBe(3);
-        expect(formState.fullName.value).toEqual("undefined last");
-        // And knows the field should be sent as null
-        expect(formState.changedValue).toEqual({ firstName: null });
-    });
-    it("can set computeds that have setters", () => {
-        const formState = (0, objectField_1.createObjectState)({
-            firstName: { type: "value" },
-            lastName: { type: "value" },
-            fullName: { type: "value", computed: true },
-        }, new ObservableObject());
-        formState.fullName.value = "Bob Smith";
-        expect(formState.firstName.value).toEqual("Bob");
-        formState.fullName.set("Fred Smith");
-        expect(formState.firstName.value).toEqual("Fred");
-        formState.revertChanges();
-        expect(formState.firstName.value).toEqual("first");
-    });
-    it("can mark fields as read only", () => {
-        const formState = (0, objectField_1.createObjectState)({
-            firstName: { type: "value" },
-            lastName: { type: "value" },
-            fullName: { type: "value", readOnly: true },
-        }, new ObservableObject());
-        expect(formState.fullName.value).toEqual("first last");
-        expect(formState.fullName.readOnly).toEqual(true);
-        formState.firstName.value = "change";
-        expect(formState.fullName.value).toEqual("change last");
-        formState.revertChanges();
-        expect(formState.firstName.value).toEqual("first");
-    });
-    it("can return only changed primitive fields", () => {
-        // Given an author
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, {
-            id: "a:1",
-            firstName: "f",
-            lastName: "l",
-            books: [{ title: "t1" }],
-        });
-        // And initially nothing is changed
-        expect(formState.changedValue).toEqual({ id: "a:1" });
-        // When we change the last name
-        formState.lastName.value = "l2";
-        // Then only the id (for updates) and last name are in changed value
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            lastName: "l2",
-        });
-    });
-    it("can return only changed object fields", () => {
-        // Given an author with an address object
-        const formState = (0, objectField_1.createObjectState)(authorWithAddressConfig, {
-            id: "a:1",
-            firstName: "f",
-            address: { city: "c1", street: "s1" },
-        });
-        // And initially nothing is changed
-        expect(formState.changedValue).toEqual({ id: "a:1" });
-        // When we change the sub object
-        formState.address.street.value = "s2";
-        // Then we get the author id (for update) and only what changed in the address
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            address: { street: "s2" },
-        });
-    });
-    it("changedValue skips empty nested fields", () => {
-        // Given a new author with an address object
-        const formState = (0, objectField_1.createObjectState)(authorWithAddressConfig, {
-            firstName: "f",
-            // And nothing is in the address
-            address: {},
-        });
-        // Then we don't include an empty address in the output,
-        // because this might trigger creating a throw-away entity
-        expect(formState.changedValue).toEqual({ firstName: "f" });
-    });
-    it("changedValue includes initialized-and-unchanged list fields", () => {
-        // Given a new author that is initialized with a new book
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, {
-            books: [{ title: "t1" }],
-        });
-        // Then changedValue realizes that even though `books` is not changed, it should be included
-        expect(formState.books.dirty).toBe(false);
-        expect(formState.changedValue).toEqual({ books: [{ title: "t1" }] });
-    });
-    it("changedValue skips initialized-and-unchanged list fields that are empty", () => {
-        // Given a new author that is initialized with no books
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, {
-            books: [],
-        });
-        // Then changedValue doesn't include the books
-        expect(formState.changedValue).toEqual({});
-    });
-    it("changedValue includes new entity nested fields", () => {
-        // Given a new author with an address FK
-        const formState = (0, objectField_1.createObjectState)(authorWithAddressFkConfig, {
-            firstName: "f",
-            address: { id: "add:1" },
-        });
-        // Then changedValue includes the reference to the FK
-        expect(formState.changedValue).toEqual({
-            firstName: "f",
-            address: { id: "add:1" },
-        });
-    });
-    it("changedValue includes new entity nested fields with multiple keys", () => {
-        // Given a new author with an address FK
-        const formState = (0, objectField_1.createObjectState)(authorWithAddressFkConfig, { firstName: "f" });
-        formState.address.set({ id: "add:1", street: "Main St" });
-        // Then changedValue includes the reference to the FK
-        expect(formState.changedValue).toEqual({
-            firstName: "f",
-            address: { id: "add:1", street: "Main St" },
-        });
-    });
-    it("changedValue includes deleted nested fields", () => {
-        var _a;
-        // Given a new author with an address FK
-        const formState = (0, objectField_1.createObjectState)(configBuilders_1.f.config({
-            id: configBuilders_1.f.value(),
-            firstName: configBuilders_1.f.value(),
-            // And address is a reference
-            address: configBuilders_1.f.reference(),
-        }), { id: "a:1", firstName: "f", address: { id: "add:1" } });
-        // When the address is unset
-        formState.address.set(undefined);
-        // Then the field is dirty and will be removed in changedValue
-        expect(formState.address.dirty).toBe(true);
-        expect(formState.dirty).toBe(true);
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            address: { id: null },
-        });
-        // So that we can do a binding like
-        const addressId = (_a = formState.changedValue.address) === null || _a === void 0 ? void 0 : _a.id;
-        expect(addressId).toBeNull();
-        // And when we're restored to the same value
-        formState.address.set({ id: "add:1" });
-        // Then it's back to not being dirty
-        expect(formState.address.dirty).toBe(false);
-        expect(formState.dirty).toBe(false);
-        // And when we're changed to a different address
-        formState.address.set({ id: "add:2" });
-        // Then we're dirty again
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            address: { id: "add:2" },
-        });
-    });
-    it("changedValue includes deleted nested fields with a name", () => {
-        // Given a new author with an address FK
-        const formState = (0, objectField_1.createObjectState)(configBuilders_1.f.config({
-            id: configBuilders_1.f.value(),
-            firstName: configBuilders_1.f.value(),
-            address: configBuilders_1.f.reference({ street: configBuilders_1.f.value() }),
-        }), { id: "a:1", firstName: "f", address: { id: "add:1", street: "Main St" } });
-        // Initially both id and street can be bound to the UI
-        expect(formState.address.id.value).toBe("add:1");
-        expect(formState.address.street.value).toBe("Main St");
-        // When the address is unset
-        formState.address.set(undefined);
-        // Then the field is dirty and will be removed in changedValue
-        expect(formState.address.dirty).toBe(true);
-        // And our changedValue only includes the id
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            address: { id: null },
-        });
-        // And when we're changed to a new address
-        formState.address.set({ id: "add:2", street: "Side St" });
-        // Then we see oly the id come back in changedValue
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            address: { id: "add:2" },
-        });
-    });
-    it("changedValue skips effectively empty nested fields", () => {
-        // Given a new author with an address object
-        const formState = (0, objectField_1.createObjectState)(authorWithAddressConfig, {
-            firstName: "f",
-            // And only undefined keys are in the address
-            address: { city: undefined },
-        });
-        // Then we don't include an empty address in the output,
-        // because this might trigger creating a throw-away entity
-        expect(formState.changedValue).toEqual({ firstName: "f" });
-    });
-    it("changedValue skips computeds", () => {
-        // Given a new author that calls full name
-        const formState = (0, objectField_1.createObjectState)(authorWithFullName, new ObservableObject());
-        expect(formState.fullName.value).toEqual("first last");
-        // When the firstName changes
-        formState.firstName.value = "First";
-        // Then the fullName changes
-        expect(formState.fullName.value).toBe("First last");
-        expect(formState.fullName.dirty).toBe(true);
-        // And we don't include it in the changedValue
-        expect(formState.changedValue).toEqual({ firstName: "First" });
-    });
-    it("can return only changed and exhaustive list fields", () => {
-        // Given an author with some books
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, {
-            id: "a:1",
-            firstName: "f",
-            books: [
-                { id: "b:1", title: "t1" },
-                { id: "b:2", title: "t2" },
-            ],
-        });
-        // And initially nothing is changed
-        expect(formState.changedValue).toEqual({ id: "a:1" });
-        // When we change the 1st book
-        formState.books.rows[0].title.value = "t1b";
-        // Then we get the author id (for updates) and both books b/c `author.books = [...]` is
-        // assumed to be an exhaustive set and we don't want to orphan the 2nd book.
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            books: [{ id: "b:1", title: "t1b" }, { id: "b:2" }],
-        });
-        // And add a 3rd new book
-        formState.books.add({ title: "t3" });
-        // Then we get the author id (for updates) and all 3 books
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            books: [{ id: "b:1", title: "t1b" }, { id: "b:2" }, { title: "t3" }],
-        });
-        // And we can still get the original value
-        expect(formState.originalValue).toEqual({
-            id: "a:1",
-            firstName: "f",
-            books: [
-                { id: "b:1", title: "t1" },
-                { id: "b:2", title: "t2" },
-            ],
-        });
-        // And the books.originalValue as well
-        expect(formState.books.originalValue).toEqual([
-            { id: "b:1", title: "t1" },
-            { id: "b:2", title: "t2" },
-        ]);
-        // And when we commit changes
-        formState.commitChanges();
-        // Then our originalValue reflects the commit
-        expect(formState.originalValue).toEqual({
-            id: "a:1",
-            firstName: "f",
-            books: [
-                { id: "b:1", title: "t1b" },
-                { id: "b:2", title: "t2" },
-                { id: undefined, title: "t3" },
-            ],
-        });
-        // And the books.originalValue as well
-        expect(formState.books.originalValue).toEqual([
-            { id: "b:1", title: "t1b" },
-            { id: "b:2", title: "t2" },
-            { title: "t3" },
-        ]);
-    });
-    it("can return only changed but incremental list fields", () => {
-        // Given an author
-        const formState = (0, objectField_1.createObjectState)({
-            id: { type: "value" },
-            // And the books collection is marked as incremental (i.e. line items)
-            books: {
-                type: "list",
-                update: "incremental",
-                config: {
-                    id: { type: "value" },
-                    title: { type: "value", rules: [rules_1.required] },
-                },
-            },
-        }, {
-            id: "a:1",
-            firstName: "f",
-            books: [
-                { id: "b:1", title: "t1" },
-                { id: "b:2", title: "t2" },
-            ],
-        });
-        // And initially nothing is changed
-        expect(formState.changedValue).toEqual({ id: "a:1" });
-        // When we change the 1st book
-        formState.books.rows[0].title.value = "t1b";
-        // Then only the 1st book is included
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            books: [{ id: "b:1", title: "t1b" }],
-        });
-    });
-    it("can return only changed but deep exhaustive list fields", () => {
-        // Given an author
-        const formState = (0, objectField_1.createObjectState)({
-            id: { type: "value" },
-            // And the books collection is marked as deep-exhaustive
-            books: {
-                type: "list",
-                update: "deep-exhaustive",
-                config: {
-                    id: { type: "value" },
-                    title: { type: "value", rules: [rules_1.required] },
-                },
-            },
-        }, {
-            id: "a:1",
-            firstName: "f",
-            books: [
-                { id: "b:1", title: "t1" },
-                { id: "b:2", title: "t2" },
-            ],
-        });
-        // And initially nothing is changed
-        expect(formState.changedValue).toEqual({ id: "a:1" });
-        // When we change the 1st book
-        formState.books.rows[0].title.value = "t1b";
-        // Then we see all books & all attributes
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            books: [
-                { id: "b:1", title: "t1b" },
-                { id: "b:2", title: "t2" },
-            ],
-        });
-    });
-    it("uses the op key as a hint to use incremental list behavior", () => {
-        // Given an author
-        const formState = (0, objectField_1.createObjectState)({
-            id: { type: "value" },
-            // And the books collection is not explicitly marked as incremental
-            books: {
-                type: "list",
-                config: {
-                    id: { type: "value" },
-                    title: { type: "value", rules: [rules_1.required] },
-                    // But it does have an op key
-                    op: { type: "value" },
-                },
-            },
-        }, {
-            id: "a:1",
-            firstName: "f",
-            books: [
-                // And the books start out as included
-                { id: "b:1", title: "t1", op: "include" },
-                { id: "b:2", title: "t2", op: "include" },
-            ],
-        });
-        // And initially nothing is changed
-        expect(formState.changedValue).toEqual({ id: "a:1" });
-        // When we delete the 1st book
-        formState.books.rows[0].op.value = "delete";
-        // Then only the 1st book is included
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            books: [{ id: "b:1", op: "delete" }],
-        });
-    });
-    it("defaults the incremental op key to included when not set", () => {
-        // Given an author
-        const formState = (0, objectField_1.createObjectState)({
-            id: { type: "value" },
-            // And the books collection is not explicitly marked as incremental
-            books: {
-                type: "list",
-                config: {
-                    id: { type: "value" },
-                    title: { type: "value", rules: [rules_1.required] },
-                    // But it does have an op key
-                    op: { type: "value" },
-                },
-            },
-        }, {
-            id: "a:1",
-            firstName: "f",
-            books: [
-                // And no op keys are initially set
-                { id: "b:1", title: "t1" },
-                { id: "b:2", title: "t2" },
-            ],
-        });
-        // And initially nothing is changed
-        expect(formState.changedValue).toEqual({ id: "a:1" });
-        // When we delete the 1st book
-        formState.books.rows[0].op.value = "delete";
-        // And add a 3rd book
-        formState.books.add({ title: "t3" });
-        // Then the 3rd book doesn't have an explicit op yet
-        expect(formState.books.rows[2].op.value).toBeUndefined();
-        // But when we create changedValue
-        expect(formState.changedValue).toEqual({
-            id: "a:1",
-            books: [
-                // Then the deleted book is included
-                { id: "b:1", op: "delete" },
-                // And the 3rd book is included w/the `op: include` flag added
-                { title: "t3", op: "include" },
-            ],
-        });
-    });
-    it("can observe value changes", () => {
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, { firstName: "f" });
-        let ticks = 0;
-        (0, mobx_1.reaction)(() => formState.value, () => ticks++, { equals: () => false });
-        expect(ticks).toEqual(0);
-        formState.firstName.value = "f";
-        expect(ticks).toEqual(0);
-        formState.firstName.value = "f2";
-        expect(ticks).toEqual(1);
-    });
-    it("can observe value changes on lists", () => {
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, { books: [{ title: "b1" }] });
-        let ticks = 0;
-        (0, mobx_1.reaction)(() => formState.books.value, () => ticks++, { equals: () => false });
-        expect(ticks).toEqual(0);
-        formState.books.rows[0].title.value = "b1";
-        expect(ticks).toEqual(0);
-        formState.books.rows[0].title.value = "b1...";
-        expect(ticks).toEqual(1);
-        formState.books.add({ title: "b2" });
-        expect(ticks).toEqual(2);
-    });
-    it("keeps WIP changes for changed field", () => {
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, { firstName: "f", lastName: "l" });
-        // Given first name is focused
-        formState.firstName.focus();
-        // And they have wip edits
-        formState.firstName.set("ff");
-        // When a mutation result sets both firstName and lastName
-        formState.set({ firstName: "f2", lastName: "l2" }, { refreshing: true });
-        // Then we don't overwrite the user's WIP work
-        expect(formState.firstName.value).toEqual("ff");
-        expect(formState.lastName.value).toEqual("l2");
-        // But the user can still actively type a value
-        formState.firstName.set("fff");
-        expect(formState.firstName.value).toEqual("fff");
-    });
-    it("accepts server result if we have no further changes", () => {
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, { id: "a:1", firstName: "f" });
-        // Given first name has wip edits
-        formState.firstName.set("ff");
-        // When a mutation result sets both firstName and lastName
-        formState.set({ firstName: "f2" }, { refreshing: true });
-        // Then we don't overwrite the user's WIP work
-        expect(formState.firstName.value).toEqual("ff");
-        // But if we call changedValue, insinuating we're sending the value off to the server
-        expect(formState.changedValue).toEqual({ id: "a:1", firstName: "ff" });
-        // And now the server acks something different
-        formState.set({ firstName: "FF" }, { refreshing: true });
-        // Then we accept the value
-        expect(formState.firstName.value).toEqual("FF");
-        expect(formState.firstName.dirty).toEqual(false);
-    });
-    it("ignores cache refresh of our original value", () => {
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, { id: "a:1", firstName: "f" });
-        // Given first name has wip edits
-        formState.firstName.set("ff");
-        // And we've called changedValue to put it on the wire
-        expect(formState.changedValue).toEqual({ id: "a:1", firstName: "ff" });
-        // But then a cache refresh fires with our original `f`
-        formState.set({ firstName: "f" }, { refreshing: true });
-        // Then we keep our WIP value
-        expect(formState.firstName.value).toEqual("ff");
-        expect(formState.firstName.dirty).toEqual(true);
-    });
-    it("rejects server result if we have further changes", () => {
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, { id: "a:1", firstName: "f" });
-        // Given first name has wip edits
-        formState.firstName.set("ff");
-        // And we call changedValue, insinuating we're sending the value off to the server
-        expect(formState.changedValue).toEqual({ id: "a:1", firstName: "ff" });
-        // And the user changes the name yet again
-        formState.firstName.set("fff");
-        // And now the server acks something different
-        formState.set({ firstName: "FF" }, { refreshing: true });
-        // Then we keep the "post-changedValue" value
-        expect(formState.firstName.value).toEqual("fff");
-        expect(formState.firstName.dirty).toEqual(true);
-    });
-    it("does update a focused, unchanged field", () => {
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, { firstName: "f", lastName: "l" });
-        // Given first name is focused, but has not changed
-        formState.firstName.focus();
-        // When a mutation result sets both firstName and lastName
-        formState.set({ firstName: "f2", lastName: "l2" }, { refreshing: true });
-        // Then we do update the value
-        expect(formState.firstName.value).toEqual("f2");
-    });
-    it("trims string values on blur", () => {
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, { firstName: "f", lastName: "l" });
-        // Given the user is typing with spaces
-        formState.firstName.focus();
-        formState.firstName.set("f ");
-        // And we initially keep the space
-        expect(formState.firstName.value).toEqual("f ");
-        // When the field is blurred
-        formState.firstName.blur();
-        // Then we trim it
-        expect(formState.firstName.value).toEqual("f");
-    });
-    it("trims string values on maybeAutoSave", () => {
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, { firstName: "f", lastName: "l" });
-        // Given the user is typing with spaces
-        formState.firstName.focus();
-        formState.firstName.set("f ");
-        // And we initially keep the space
-        expect(formState.firstName.value).toEqual("f ");
-        // When the user hits Enter (which will call maybeAutoSave)
-        formState.firstName.maybeAutoSave();
-        // Then we trim it
-        expect(formState.firstName.value).toEqual("f");
-        // And the field is considered touched
-        expect(formState.firstName.touched).toEqual(true);
-    });
-    it("trims empty values to undefined on blur", () => {
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, { firstName: "f", lastName: "l" });
-        // Given the user is typing with only spaces
-        formState.firstName.focus();
-        formState.firstName.set(" ");
-        // And we initially keep the space
-        expect(formState.firstName.value).toEqual(" ");
-        // When the field is blurred
-        formState.firstName.blur();
-        // Then we trim it to null (b/c the firstName was originally set)
-        expect(formState.firstName.value).toEqual(null);
-    });
-    it("reproduces the type modifier weirdness", () => {
-        const fn = () => { };
-        // @ts-expect-error
-        const anyCallback = fn;
-    });
-    it("can work with both required inputs and optional fields", () => {
-        // And we drop it in a form.
-        const form = (0, objectField_1.createObjectState)({
-            id: { type: "value" },
-            firstName: { type: "value" },
-        }, { id: "a:1" });
-        // id should not accept null/undefined
-        // @ts-expect-error
-        form.id.set(undefined);
-        // A BoundField typically has `string | undefined | null` so works on firstName
-        let field1;
-        field1 = form.firstName;
-        // But not on id
-        // @ts-expect-error
-        field1 = form.id;
-        // And same thing with any as the object type
-        let field2;
-        field2 = form.firstName;
-        // @ts-expect-error
-        field2 = form.id;
-    });
-    it("can have child object states passed in as field states", () => {
-        // Given an author
-        const a = (0, objectField_1.createObjectState)({
-            id: { type: "value" },
-            // And address is modeled as a value object
-            address: { type: "value" },
-        }, {});
-        // And a bound field that wants a FieldState<any, Address> (even though technically `ObjectState`
-        // turns this into a nested `ObjectState` (instead of "just a `FieldState`"), because it can't
-        // "see" the `{ type: value }`, until we pass the config as a generic to `ObjectState`.
-        let field;
-        // Then we can assign the value
-        field = a.address;
-        // And treat it as a value object
-        a.address.set({ street: "123", city: "nyc" });
-        expect(a.value).toEqual({ address: { street: "123", city: "nyc" } });
-    });
-    it("can have child object states with cycles", () => {
-        // Given an author with an address child
-        // And two addresses that are basically identical and both have cycles
-        const address1 = { city: "city2" };
-        address1.someCycle = address1;
-        const address2 = { city: "city2" };
-        address2.someCycle = address2;
-        const a = (0, objectField_1.createObjectState)({
-            id: { type: "value" },
-            address: { type: "value" },
-        }, { address: address1 });
-        // When we change the address
-        a.address.set(address2);
-        // Then it doesn't error on dirty checks
-        expect(a.address.dirty).toBe(false);
-    });
-    it("provides isNewEntity", () => {
-        // Given an author without an id
-        const formState = (0, objectField_1.createObjectState)(authorWithAddressConfig, {
-            firstName: "f",
-            address: { city: "c1", street: "s1" },
-        });
-        // Then their fields know the entity is new
-        expect(formState.firstName.isNewEntity).toBeTruthy();
-        expect(formState.address.city.isNewEntity).toBeTruthy();
-        // When we have an id
-        formState.id.set("1");
-        // Then their fields know the entity is not new
-        expect(formState.firstName.isNewEntity).toBeFalsy();
-        expect(formState.address.city.isNewEntity).toBeFalsy();
-    });
-    it("isNewEntity is false if there is no id field", () => {
-        // Given an author without an id field defined
-        const formState = (0, objectField_1.createObjectState)({
-            firstName: { type: "value" },
-            address: { type: "object", config: { street: { type: "value" } } },
-        }, {});
-        // Then their fields don't think the entity is new
-        expect(formState.firstName.isNewEntity).toBeFalsy();
-        expect(formState.address.street.isNewEntity).toBeFalsy();
-    });
-    it("provides isNewEntity for lists", () => {
-        // Given an author & books without an id
-        const formState = (0, objectField_1.createObjectState)(authorWithBooksConfig, {
-            books: [{ title: "t1" }, { title: "t2" }],
-        });
-        // Then both books know they are new
-        expect(formState.books.rows[0].title.isNewEntity).toBeTruthy();
-        expect(formState.books.rows[1].title.isNewEntity).toBeTruthy();
-        expect(formState.books.rows[0].isNewEntity).toBeTruthy();
-        expect(formState.books.rows[1].isNewEntity).toBeTruthy();
-        expect(formState.books.isNewEntity).toBeTruthy();
-        // And when the author is not new, only it changes
-        formState.id.set("1");
-        expect(formState.books.rows[0].title.isNewEntity).toBeTruthy();
-        expect(formState.books.rows[1].title.isNewEntity).toBeTruthy();
-        expect(formState.books.rows[0].isNewEntity).toBeTruthy();
-        expect(formState.books.rows[1].isNewEntity).toBeTruthy();
-        expect(formState.books.isNewEntity).toBeFalsy();
-        // And when the 1st book is not new, only it changes
-        formState.books.rows[0].id.set("2");
-        expect(formState.books.rows[0].title.isNewEntity).toBeFalsy();
-        expect(formState.books.rows[1].title.isNewEntity).toBeTruthy();
-        expect(formState.books.rows[0].isNewEntity).toBeFalsy();
-        expect(formState.books.rows[1].isNewEntity).toBeTruthy();
-        expect(formState.books.isNewEntity).toBeFalsy();
-    });
-    it("can properly evaluate dirty lists after calling 'save'", () => {
-        // Given an empty list state
-        const a1 = createAuthorInputState({ books: [] });
-        expect(a1.books.dirty).toBeFalsy();
-        // When adding a book
-        a1.books.add({ title: "t2" });
-        // Then the list state is dirty
-        expect(a1.books.dirty).toBeTruthy();
-        // When saving the form state
-        a1.commitChanges();
-        // Then the list is no longer dirty
-        expect(a1.books.dirty).toBeFalsy();
-        // When adding a new book
-        a1.books.add({ title: "t3" });
-        // The list is again dirty
-        expect(a1.books.dirty).toBeTruthy();
-    });
-    it("can properly evaluate dirty lists when order changes", () => {
-        // Given a list state in a specific order
-        const a = createAuthorInputState({ books: [{ title: "t1" }, { title: "t2" }] });
-        expect(a.books.dirty).toBeFalsy();
-        // When changing that order
-        const book1 = a.books.rows[0].value;
-        a.books.remove(book1);
-        a.books.add(book1);
-        // Then the list state is considered dirty.
-        expect(a.books.dirty).toBeTruthy();
-        // When putting the books back in the original order
-        a.books.remove(book1);
-        a.books.add(book1, 0);
-        // Then the list state is no longer dirty
-        expect(a.books.dirty).toBeFalsy();
-    });
-    it("can optionally ignore the order of list state rows when determining dirty state", () => {
-        // Given a list state in a specific order, and the `strictOrder` option set to `false`
-        const a = (0, objectField_1.createObjectState)({
-            books: {
-                type: "list",
-                strictOrder: false,
-                config: {
-                    title: { type: "value", rules: [rules_1.required] },
-                },
-            },
-        }, { books: [{ title: "t1" }, { title: "t2" }] });
-        expect(a.books.dirty).toBeFalsy();
-        // When changing that order
-        const book1 = a.books.rows[0].value;
-        a.books.remove(book1);
-        a.books.add(book1);
-        // Then the list state is still not considered dirty.
-        expect(a.books.dirty).toBeFalsy();
-    });
-    describe("fragments", () => {
-        it("ignores changes within fragments", () => {
-            const a = (0, objectField_1.createObjectState)({ title: { type: "value" }, data: { type: "fragment" } }, { title: "b1", data: (0, objectField_1.fragment)({ foo: "1" }) });
-            let numCalcs = 0;
-            (0, mobx_1.autorun)(() => {
-                numCalcs++;
-                noop(a.value);
-            });
-            expect(a.data.value).toEqual({ foo: "1" });
-            expect((0, mobx_1.isObservable)(a.data.value)).toBe(false);
-            expect(numCalcs).toEqual(1);
-            a.data.value = { foo: "2" };
-            expect(numCalcs).toEqual(2);
-            a.data.value.foo = "3";
-            expect(numCalcs).toEqual(2);
-        });
-        it("ignores fragments in changedValue", () => {
-            const a = (0, objectField_1.createObjectState)({ title: { type: "value" }, data: { type: "fragment" } }, { title: "b1", data: (0, objectField_1.fragment)({ foo: "1" }) });
-            a.title.value = "b2";
-            a.data.value = (0, objectField_1.fragment)({ foo: "2" });
-            expect(a.changedValue).toMatchInlineSnapshot(`
-        {
-          "title": "b2",
-        }
-      `);
-        });
-        it("ignores fragments in value", () => {
-            const a = (0, objectField_1.createObjectState)({ title: { type: "value" }, data: { type: "fragment" } }, { title: "b1", data: (0, objectField_1.fragment)({ foo: "1" }) });
-            expect(a.value).toMatchInlineSnapshot(`
-        {
-          "title": "b1",
-        }
-      `);
-        });
-        it("accepts new values in set", () => {
-            const a = (0, objectField_1.createObjectState)({ title: { type: "value" }, data: { type: "fragment" } }, { title: "b1", data: (0, objectField_1.fragment)({ foo: "1" }) });
-            let numCalcs = 0;
-            (0, mobx_1.autorun)(() => {
-                numCalcs++;
-                noop(a.value);
-            });
-            a.set({ data: (0, objectField_1.fragment)({ foo: "2" }) });
-            expect(numCalcs).toBe(2);
-        });
-        it("are always considered valid", () => {
-            const a = (0, objectField_1.createObjectState)({ data: { type: "fragment" } }, { data: (0, objectField_1.fragment)({ foo: "1" }) });
-            expect(a.valid).toBe(true);
-        });
-    });
-    it("sets id key correctly", () => {
-        // Given an author
-        const a = (0, objectField_1.createObjectState)({
-            id: { type: "value" },
-            otherId: { type: "value", isIdKey: true },
-        }, {});
-        expect(a.id._isIdKey).toBe(false);
-        expect(a.otherId._isIdKey).toBe(true);
-    });
-    it("uses id key to recognize same entities", () => {
-        // With b1 having an id
-        const b1 = (0, objectField_1.createObjectState)({ id: { type: "value" } }, { id: "b:1" });
-        expect(b1.isSameEntity({ id: "b:1" })).toBe(true);
-        expect(b1.isSameEntity({ id: "b:2" })).toBe(false);
-        expect(b1.isSameEntity({ id: undefined })).toBe(false);
-        expect(b1.isSameEntity({})).toBe(false);
-        // With b2 having no id
-        const b2 = (0, objectField_1.createObjectState)({ id: { type: "value" } }, {});
-        expect(b2.isSameEntity({ id: "b:1" })).toBe(false);
-        expect(b2.isSameEntity({ id: undefined })).toBe(false);
-        expect(b2.isSameEntity({})).toBe(false);
-        // With b3 having no id key
-        const b3 = (0, objectField_1.createObjectState)({ title: { type: "value" } }, { title: "b3" });
-        expect(b3.isSameEntity({ title: "b3" })).toBe(false);
-        // With b4 having a different id key
-        const b4 = (0, objectField_1.createObjectState)({ title: { type: "value", isIdKey: true } }, { title: "b4" });
-        expect(b4.isSameEntity({ title: "b4" })).toBe(true);
-    });
-});
-class ObservableObject {
-    constructor() {
-        this.firstName = "first";
-        this.lastName = "last";
-        this.age = undefined;
-        (0, mobx_1.makeAutoObservable)(this);
-    }
-    get fullName() {
-        return `${this.firstName} ${this.lastName}`;
-    }
-    set fullName(fullName) {
-        const parts = fullName.split(" ");
-        this.firstName = parts[0];
-        this.lastName = parts[1];
-    }
-    toInput() {
-        return { firstName: this.firstName };
-    }
-}
-exports.ObservableObject = ObservableObject;
-const authorWithBooksConfig = configBuilders_1.f.config({
-    id: configBuilders_1.f.value(),
-    firstName: configBuilders_1.f.value(),
-    lastName: configBuilders_1.f.value(),
-    books: configBuilders_1.f.list({
-        id: configBuilders_1.f.value(),
-        title: configBuilders_1.f.value().req(),
-        classification: configBuilders_1.f.value(),
-        isPublished: configBuilders_1.f.value(),
-    }),
-});
-function createAuthorInputState(input, maybeAutoSave) {
-    return (0, objectField_1.createObjectState)(authorWithBooksConfig, input, { maybeAutoSave });
-}
-const authorWithFullName = {
-    firstName: { type: "value" },
-    lastName: { type: "value" },
-    fullName: { type: "value", computed: true },
-};
-const authorWithAddressConfig = {
-    id: { type: "value" },
-    firstName: { type: "value" },
-    lastName: { type: "value" },
-    address: {
-        type: "object",
-        config: {
-            street: { type: "value", rules: [rules_1.required] },
-            city: { type: "value" },
-        },
-    },
-};
-const authorWithAddressFkConfig = {
-    id: { type: "value" },
-    firstName: { type: "value" },
-    lastName: { type: "value" },
-    address: {
-        type: "object",
-        config: {
-            id: { type: "value" },
-            street: { type: "value", rules: [rules_1.required] },
-            city: { type: "value" },
-        },
-    },
-};
-const authorWithAddressAndBooksConfig = configBuilders_1.f.config({
-    id: configBuilders_1.f.value(),
-    firstName: configBuilders_1.f.value(),
-    lastName: configBuilders_1.f.value(),
-    address: configBuilders_1.f.object({
-        id: configBuilders_1.f.value(),
-        street: configBuilders_1.f.value().rules([rules_1.required]),
-        city: configBuilders_1.f.value(),
-    }),
-    books: configBuilders_1.f.list({
-        id: configBuilders_1.f.value(),
-        title: configBuilders_1.f.value(),
-        classification: configBuilders_1.f.value(),
-    }),
-});
-// const authorWithAddressAndBooksConfig: ObjectConfig<AuthorInput> = {
-//   id: { type: "value" },
-//   firstName: { type: "value" },
-//   lastName: { type: "value" },
-//   address: {
-//     type: "object",
-//     config: {
-//       id: { type: "value" },
-//       street: { type: "value", rules: [required] },
-//       city: { type: "value" },
-//     },
-//   },
-//   books: {
-//     type: "list",
-//     config: {
-//       id: { type: "value" },
-//       title: { type: "value", rules: [required] },
-//       classification: { type: "value" },
-//     },
-//   },
-// };
-function createAuthorWithAddressInputState(input) {
-    return (0, objectField_1.createObjectState)(authorWithAddressConfig, input);
-}
-function noop(t) { }