fix(react-form): retain field and form context during Hot Module Replacement (#1641)

LeCarbonator · web-flow · commit ca7f26be064c · 2025-08-01T12:09:11.000+02:00
refactor(react-form): move context creation to module scope

this avoids HMR creating new context and breaking the connection
by accident.
diff --git a/packages/react-form/src/createFormHook.tsx b/packages/react-form/src/createFormHook.tsx
@@ -18,6 +18,10 @@ import type { FieldComponent } from './useField'
 import type { ReactFormExtendedApi } from './useForm'
 import type { AppFieldExtendedReactFieldGroupApi } from './useFieldGroup'
 
+// We should never hit the `null` case here
+const fieldContext = createContext<AnyFieldApi>(null as never)
+const formContext = createContext<AnyFormApi>(null as never)
+
 /**
  * TypeScript inferencing is weird.
  *
@@ -56,9 +60,6 @@ type UnwrapDefaultOrAny<DefaultT, T> = [DefaultT] extends [T]
   : T
 
 export function createFormHookContexts() {
-  // We should never hit the `null` case here
-  const fieldContext = createContext<AnyFieldApi>(null as never)
-
   function useFieldContext<TData>() {
     const field = useContext(fieldContext)
 
@@ -92,9 +93,6 @@ export function createFormHookContexts() {
     >
   }
 
-  // We should never hit the `null` case here
-  const formContext = createContext<AnyFormApi>(null as never)
-
   function useFormContext() {
     const form = useContext(formContext)
 
