@homebound/form-state 2.25.2 → 2.26.0

package/dist/useFormState.d.ts

@@ -9,6 +9,7 @@ export type InputAndMap<T, I> = {
     input: I;
     map?: (input: Exclude<I, null | undefined>) => T;
     ifUndefined?: T;
+    onlyOnce?: boolean;
 };
 export type QueryAndMap<T, I> = {
     query: Query<I>;

package/dist/useFormState.js

@@ -25,7 +25,13 @@ function useFormState(opts) {
     const [firstInitValue] = (0, react_1.useState)(() => (0, utils_1.initValue)(config, init));
     const isWrappingMobxProxy = !(0, is_plain_object_1.isPlainObject)(firstInitValue);
     // If they're using init.input, useMemo on it (and it might be an array), otherwise allow the identity of init be unstable
-    const dep = (0, utils_1.isInput)(init) ? makeArray(init.input) : (0, utils_1.isQuery)(init) ? [init.query.data, init.query.loading] : [];
+    const dep = (0, utils_1.isInput)(init)
+        ? init.onlyOnce
+            ? []
+            : makeArray(init.input)
+        : (0, utils_1.isQuery)(init)
+            ? [init.query.data, init.query.loading]
+            : [];
     const form = (0, react_1.useMemo)(() => {
         function maybeAutoSave() {
             if (isAutoSaving === "in-flight") {

package/dist/useFormState.test.js

@@ -92,6 +92,23 @@ describe("useFormState", () => {
         const r = await (0, rtl_utils_1.render)((0, jsx_runtime_1.jsx)(TestComponent, {}));
         expect(r.baseElement.textContent).toEqual("");
     });
+    it("uses init.onlyOnce to not react to identity changes", async () => {
+        const config = { firstName: { type: "value" } };
+        const TestComponent = (0, mobx_react_1.observer)(() => {
+            // And we have an `init` value that is dynamic, so we can observe whether init reruns
+            const renderCount = (0, react_2.useRef)(0).current++;
+            const form = (0, useFormState_1.useFormState)({
+                config,
+                init: { input: { firstName: `${renderCount}` }, onlyOnce: true },
+            });
+            const [, setTick] = (0, react_2.useState)(0);
+            return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("button", { "data-testid": "change", onClick: () => setTick(1) }), (0, jsx_runtime_1.jsx)("div", { "data-testid": "firstName", children: form.firstName.value })] }));
+        });
+        const r = await (0, rtl_utils_1.render)((0, jsx_runtime_1.jsx)(TestComponent, {}));
+        expect(r.firstName).toHaveTextContent("0");
+        (0, rtl_utils_1.click)(r.change);
+        expect(r.firstName).toHaveTextContent("0");
+    });
     it("keeps local changed values when a query refreshes", async () => {
         // Given a component
         function TestComponent() {

package/package.json

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