@homebound/form-state 2.7.0 → 2.7.1

package/dist/useFormStates.d.ts

@@ -1,18 +1,38 @@
 import { ObjectConfig, ObjectState } from "./formState";
 export declare type ObjectStateCache<T, I> = Record<string, [ObjectState<T>, I]>;
 declare type UseFormStatesOpts<T, I> = {
+    /**
+     * The config to use for each form state.
+     *
+     * Should be stable/useMemo'd.
+     */
     config: ObjectConfig<T>;
-    /** Fired for each individual `ObjectState` when it's had a value change. */
+    /**
+     * Fired for each individual `ObjectState` when it's had a value change.
+     *
+     * Does not need to be stable/useMemo'd.
+     */
     autoSave?: (state: ObjectState<T>) => Promise<void>;
     /**
      * A hook to add custom, cross-field validation rules that can be difficult to setup directly in the config DSL.
      *
+     * This will be called once-per `ObjectState` instance, and so is effectively a `useEffect` hook with
+     * a `[config, objectState]` dependency.
+     *
      * Does not need to be stable/useMemo'd.
      */
     addRules?: (state: ObjectState<T>) => void;
-    /** Given an input to `getObjectState`, returns the identity value that we'll cache that value's form state on. */
+    /**
+     * Given an input to `getObjectState`, returns the identity value that we'll cache that value's form state on.
+     *
+     * Does not need to be stable/useMemo'd.
+     */
     getId: (v: I) => string;
-    /** Maps an input to `getObjectState` to the actual form shape `T`. */
+    /**
+     * Maps an input to `getObjectState` to the actual form shape `T`.
+     *
+     * Does not need to be stable/useMemo'd.
+     */
     map?: (input: Exclude<I, null | undefined>) => T;
 };
 export declare function useFormStates<T, I>(opts: UseFormStatesOpts<T, I>): {

package/dist/useFormStates.js

@@ -6,7 +6,10 @@ const formState_1 = require("./formState");
 const utils_1 = require("./utils");
 function useFormStates(opts) {
     const { config, autoSave, getId, map, addRules } = opts;
-    const objectStateCache = react_1.useMemo(() => ({}), [config]);
+    const objectStateCache = react_1.useMemo(() => ({}), 
+    // Force resetting the cache if config changes
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [config]);
     // Keep track of ObjectStates that triggered auto-save when a save was already in progress.
     const pendingAutoSaves = react_1.useRef([]);
     // Use a ref so our memo'ized `autoSave` always see the latest value
@@ -30,28 +33,30 @@ function useFormStates(opts) {
             }
         }
     }
-    return {
-        getObjectState: (input) => {
-            const existing = objectStateCache[getId(input)];
-            let form = existing === null || existing === void 0 ? void 0 : existing[0];
-            // If it didn't exist, then add to the cache.
-            if (!form) {
-                form = formState_1.createObjectState(config, utils_1.initValue(config, map ? { map, input } : input), {
-                    maybeAutoSave: () => maybeAutoSave(form),
-                });
-                if (addRules) {
-                    addRules(form);
-                }
-                objectStateCache[getId(input)] = [form, input];
-            }
-            // If the source of truth changed, then update the existing state and return it.
-            if (existing && existing[1] !== input) {
-                form.set(utils_1.initValue(config, map ? { map, input } : input), { refreshing: true });
-                existing[1] = input;
+    const getObjectState = react_1.useCallback((input) => {
+        const existing = objectStateCache[getId(input)];
+        let form = existing === null || existing === void 0 ? void 0 : existing[0];
+        // If it didn't exist, then add to the cache.
+        if (!form) {
+            form = formState_1.createObjectState(config, utils_1.initValue(config, map ? { map, input } : input), {
+                maybeAutoSave: () => maybeAutoSave(form),
+            });
+            if (addRules) {
+                addRules(form);
             }
-            return form;
-        },
-    };
+            objectStateCache[getId(input)] = [form, input];
+        }
+        // If the source of truth changed, then update the existing state and return it.
+        if (existing && existing[1] !== input) {
+            form.set(utils_1.initValue(config, map ? { map, input } : input), { refreshing: true });
+            existing[1] = input;
+        }
+        return form;
+    }, 
+    // Allow the user to not stable-ize getId, map, addRules, and autoSave
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [objectStateCache, config]);
+    return { getObjectState };
 }
 exports.useFormStates = useFormStates;
 // If the user's autoSave hook makes some last-minute `.set` calls to sneak

package/package.json

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