@homebound/form-state 2.26.6 → 2.26.8

package/dist/fields/fragmentField.d.ts

@@ -1,4 +1,4 @@
 export interface FragmentField<V> {
     value: V;
 }
-export declare function newFragmentField<T, K extends keyof T>(parentInstance: T, key: K): FragmentField<T[K]>;
+export declare function newFragmentField<T extends object, K extends keyof T & string>(parentInstance: T, key: K): FragmentField<T[K]>;

package/dist/fields/fragmentField.js

@@ -12,7 +12,33 @@ function newFragmentField(parentInstance, key) {
     let value = parentInstance[key];
     delete parentInstance[key];
     const obj = {
+        key,
+        _isIdKey: false,
+        _isDeleteKey: false,
+        _isReadOnlyKey: false,
+        touched: false,
+        valid: true,
+        readOnly: true,
+        required: false,
+        loading: false,
+        dirty: false,
+        focused: false,
+        originalValue: undefined,
+        changedValue: undefined,
+        errors: [],
+        rules: [],
+        isNewEntity: false,
+        focus: () => { },
+        blur: () => { },
+        maybeAutoSave: () => { },
+        commitChanges: () => { },
+        revertChanges: () => { },
         get value() {
+            // Watch for our parentInstance changing
+            if (key in parentInstance) {
+                value = parentInstance[key];
+                delete parentInstance[key];
+            }
             _tick.value > 0 || (0, utils_1.fail)();
             return value;
         },
@@ -20,6 +46,12 @@ function newFragmentField(parentInstance, key) {
             value = v;
             _tick.value++;
         },
+        set() {
+            throw new Error("FragmentField is read-only");
+        },
+        adapt() {
+            throw new Error("FragmentField is read-only");
+        },
     };
     return (0, mobx_1.makeAutoObservable)(obj, { value: false });
 }

package/dist/fields/objectField.js

@@ -129,7 +129,10 @@ function newObjectState(config, parentState, parentInstance, parentListState, in
             this._loading = loading;
         },
         get valid() {
-            return getFields(this).every((f) => f.valid);
+            return getFields(this).every((f) => {
+                console.log(`Looking at ${f.key} valid=${f.valid}`);
+                return f.valid;
+            });
         },
         get errors() {
             return getFields(this).flatMap((f) => f.errors.map((e) => `${f.key}: ${e}`));

package/dist/formState.test.js

@@ -1671,6 +1671,10 @@ describe("formState", () => {
         }
       `);
         });
+        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

package/dist/useFormState.test.js

@@ -7,6 +7,7 @@ const mobx_1 = require("mobx");
 const mobx_react_1 = require("mobx-react");
 const react_2 = require("react");
 const FormStateApp_1 = require("./FormStateApp");
+const objectField_1 = require("./fields/objectField");
 const rules_1 = require("./rules");
 const useFormState_1 = require("./useFormState");
 describe("useFormState", () => {
@@ -109,6 +110,25 @@ describe("useFormState", () => {
         (0, rtl_utils_1.click)(r.change);
         expect(r.firstName).toHaveTextContent("0");
     });
+    it("can init with fragments", async () => {
+        // Given a component
+        function TestComponent() {
+            var _a, _b, _c, _d;
+            // And we have query data that may or may not be defined
+            const form = (0, useFormState_1.useFormState)({
+                config: authorWithBookFragments,
+                init: {
+                    input: {},
+                    map: () => ({ firstName: "a1", books: [{ id: "b:1", data: (0, objectField_1.fragment)({ misc: "data" }) }] }),
+                },
+            });
+            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { "data-testid": "fieldValue", children: form.books.rows[0].data.value.misc }), (0, jsx_runtime_1.jsx)("div", { "data-testid": "rowValue", children: (_b = (_a = form.books.rows[0].value.data) === null || _a === void 0 ? void 0 : _a.misc) !== null && _b !== void 0 ? _b : "unset" }), (0, jsx_runtime_1.jsx)("div", { "data-testid": "listValue", children: (_d = (_c = form.books.value[0].data) === null || _c === void 0 ? void 0 : _c.misc) !== null && _d !== void 0 ? _d : "unset" })] }));
+        }
+        const r = await (0, rtl_utils_1.render)((0, jsx_runtime_1.jsx)(TestComponent, {}));
+        expect(r.fieldValue).toHaveTextContent("data");
+        expect(r.rowValue).toHaveTextContent("unset");
+        expect(r.listValue).toHaveTextContent("unset");
+    });
     it("keeps local changed values when a query refreshes", async () => {
         // Given a component
         function TestComponent() {
@@ -567,7 +587,7 @@ describe("useFormState", () => {
             });
             return (0, jsx_runtime_1.jsx)("button", { "data-testid": "set", onClick: () => form.firstName.set("f2") });
         }
-        const r = await (0, rtl_utils_1.render)((0, jsx_runtime_1.jsx)(TestComponent, {}));
+        await (0, rtl_utils_1.render)((0, jsx_runtime_1.jsx)(TestComponent, {}));
         // When we change a field, and try to commit, it blows up
         // await expect(clickAndWait(r.set)).rejects.toThrow(
         //   "When using autoSave, you should not manually call commitChanges",
@@ -620,6 +640,17 @@ const authorWithAddressAndBooksConfig = {
         },
     },
 };
+const authorWithBookFragments = {
+    id: { type: "value" },
+    firstName: { type: "value" },
+    books: {
+        type: "list",
+        config: {
+            id: { type: "value" },
+            data: { type: "fragment" },
+        },
+    },
+};
 /** Emulates a user focusing and then blurring a field. */
 function focusAndBlur(state) {
     state.focus();

package/dist/utils.js

@@ -85,6 +85,9 @@ function pickFields(formConfig, instance) {
         else if (keyConfig.type === "value") {
             return [key, value];
         }
+        else if (keyConfig.type === "fragment") {
+            return [key, value];
+        }
         else {
             return assertNever(keyConfig);
         }

package/package.json

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