@formality-ui/react 0.2.5 → 0.3.1

package/dist/index.js

@@ -162,12 +162,25 @@ function Form({
     return result;
   }, [providerConfig.inputs, formConfig.inputs]);
   const defaultValues = useMemo(() => {
-    return resolveAllInitialValues(config, mergedInputs, record ?? {});
+    const resolved = resolveAllInitialValues(
+      config,
+      mergedInputs,
+      record ?? {}
+    );
+    const baseline = {
+      ...record ?? {},
+      ...resolved
+    };
+    for (const fieldName of Object.keys(config)) {
+      if (!(fieldName in baseline)) baseline[fieldName] = void 0;
+    }
+    return baseline;
   }, [config, mergedInputs, record]);
   const methods = useForm({
     mode: mode ?? "onChange",
     defaultValues,
-    values: record
+    values: defaultValues
+    // was: `record as any` — see baseline comment above
   });
   const fieldRegistry = useRef(/* @__PURE__ */ new Set());
   const [registeredFields, setRegisteredFields] = useState(
@@ -195,11 +208,6 @@ function Form({
       invertedSubscriptions.current.set(target, /* @__PURE__ */ new Set());
     }
     invertedSubscriptions.current.get(target).add(subscriber);
-    if (process.env.NODE_ENV !== "production") {
-      console.warn(
-        `[Formality Subscription] "${subscriber}" added to watch "${target}"`
-      );
-    }
     const setter = watcherSetters.current.get(target);
     if (setter) {
       setter((prev) => ({ ...prev, [subscriber]: true }));
@@ -212,20 +220,7 @@ function Form({
   }, []);
   const removeSubscription = useCallback(
     (target, subscriber) => {
-      const subscribers = invertedSubscriptions.current.get(target);
-      const subscriptionExists = subscribers?.has(subscriber) ?? false;
       invertedSubscriptions.current.get(target)?.delete(subscriber);
-      if (process.env.NODE_ENV !== "production") {
-        if (subscriptionExists) {
-          console.warn(
-            `[Formality Subscription] "${subscriber}" removed from watching "${target}"`
-          );
-        } else {
-          console.warn(
-            `[Formality Subscription] WARNING: Double-cleanup attempt - "${subscriber}" was not watching "${target}"`
-          );
-        }
-      }
       const setter = watcherSetters.current.get(target);
       if (setter) {
         setter((prev) => {
@@ -333,8 +328,10 @@ function Form({
   }, [methods, config, record, defaultValues]);
   const handleSubmit = useCallback(
     async (values, overrideOnSubmit) => {
-      for (const [, isValidating] of validatingFields.current) {
-        if (isValidating) return;
+      for (const [fieldName, isValidating] of validatingFields.current) {
+        if (!isValidating) continue;
+        const subscribers = invertedSubscriptions.current.get(fieldName);
+        if (subscribers && subscribers.size > 0) return;
       }
       if (validate) {
         const errors = await validate(values);
@@ -910,20 +907,10 @@ function useSubscriptions(fieldName, subscriptions) {
     runSubscriptionsRef.current.set(currentRunId, [...subscriptions]);
     subscriptions.forEach((target) => {
       addSubscription(target, fieldName);
-      if (process.env.NODE_ENV !== "production") {
-        console.warn(
-          `[Formality Subscription] Run ${currentRunId}: "${fieldName}" subscribing to "${target}"`
-        );
-      }
     });
     return () => {
       const thisRunSubscriptions = runSubscriptionsRef.current.get(currentRunId);
       if (thisRunSubscriptions) {
-        if (process.env.NODE_ENV !== "production") {
-          console.warn(
-            `[Formality Subscription] Run ${currentRunId}: "${fieldName}" cleaning up [${thisRunSubscriptions.join(", ")}]`
-          );
-        }
         [...thisRunSubscriptions].reverse().forEach((target) => {
           removeSubscription(target, fieldName);
         });
@@ -932,13 +919,12 @@ function useSubscriptions(fieldName, subscriptions) {
     };
   }, [fieldName, subscriptions, addSubscription, removeSubscription]);
 }
-function Field({
+function useField({
   name,
   type: typeProp,
   disabled: disabledProp,
   hidden: hiddenProp,
   children,
-  shouldRegister = true,
   inputConfig: inputConfigProp,
   ...restProps
 }) {
@@ -946,8 +932,6 @@ function Field({
     config,
     formConfig,
     methods,
-    registerField,
-    unregisterField,
     registerWatcherSetter,
     unregisterWatcherSetter,
     changeField,
@@ -976,12 +960,6 @@ function Field({
     };
     return inputConfigProp ? { ...baseInputConfig, ...inputConfigProp } : baseInputConfig;
   }, [type, providerConfig.inputs, formConfig.inputs, inputConfigProp]);
-  useEffect(() => {
-    if (shouldRegister) {
-      registerField(name);
-      return () => unregisterField(name);
-    }
-  }, [name, shouldRegister, registerField, unregisterField]);
   const [watchers, setWatchers] = useState({});
   useEffect(() => {
     registerWatcherSetter(name, setWatchers);
@@ -1194,10 +1172,14 @@ function Field({
       inputConfig
     ]
   );
-  if (!isVisible) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(
+  const fieldStateRef = useRef(
+    {}
+  );
+  const formStateRef = useRef(
+    {}
+  );
+  const fieldPropsRef = useRef({});
+  const renderedField = isVisible ? /* @__PURE__ */ jsx(
     Controller,
     {
       control: methods.control,
@@ -1248,13 +1230,16 @@ function Field({
             ...stateInjection
           }
         });
+        fieldStateRef.current = fieldState;
+        formStateRef.current = formState;
+        fieldPropsRef.current = finalProps;
         const Component = inputConfig.component;
         const isHostComponent = typeof inputConfig.component === "string";
         const template = inputConfig.template ?? providerConfig.inputTemplates[type] ?? providerConfig.defaultInputTemplate;
         const TemplateComponent = template;
-        let renderedField;
+        let renderedFieldEl;
         if (TemplateComponent) {
-          renderedField = /* @__PURE__ */ jsx(
+          renderedFieldEl = /* @__PURE__ */ jsx(
             TemplateComponent,
             {
               Field: Component,
@@ -1277,27 +1262,64 @@ function Field({
               strippedHostProps[key] = value;
             }
           }
-          renderedField = createElement(inputConfig.component, {
+          renderedFieldEl = createElement(inputConfig.component, {
             ...strippedHostProps,
             ref: finalProps.forwardRef
           });
         } else {
-          renderedField = /* @__PURE__ */ jsx(Component, { ...finalProps });
+          renderedFieldEl = /* @__PURE__ */ jsx(Component, { ...finalProps });
         }
         if (typeof children === "function") {
           const result = children({
             fieldState,
-            renderedField,
+            renderedField: renderedFieldEl,
             fieldProps: finalProps,
             watchers,
             formState
           });
           return /* @__PURE__ */ jsx(Fragment, { children: result });
         }
-        return renderedField;
+        return renderedFieldEl;
       }
     }
-  );
+  ) : null;
+  return {
+    fieldState: fieldStateRef.current,
+    renderedField,
+    fieldProps: fieldPropsRef.current,
+    watchers,
+    formState: formStateRef.current
+  };
+}
+
+// src/components/Field.tsx
+function Field({
+  name,
+  type: typeProp,
+  disabled: disabledProp,
+  hidden: hiddenProp,
+  children,
+  shouldRegister = true,
+  inputConfig: inputConfigProp,
+  ...restProps
+}) {
+  const { registerField, unregisterField } = useFormContext();
+  useEffect(() => {
+    if (shouldRegister) {
+      registerField(name);
+      return () => unregisterField(name);
+    }
+  }, [name, shouldRegister, registerField, unregisterField]);
+  const { renderedField } = useField({
+    name,
+    type: typeProp,
+    disabled: disabledProp,
+    hidden: hiddenProp,
+    children,
+    inputConfig: inputConfigProp,
+    ...restProps
+  });
+  return renderedField;
 }
 function FieldGroup({ name, children }) {
   const { formConfig } = useFormContext();
@@ -1441,6 +1463,6 @@ function defineInputs(inputs) {
   return inputs;
 }
 
-export { ConfigContext, Field, FieldGroup, Form, FormContext, FormalityProvider, GroupContext, UnusedFields, defineInputs, makeDeepProxyState, makeProxyState, useConditions, useConfigContext, useFormContext, useFormState, useGroupContext, useInferredInputs, usePropsEvaluation, useSubscriptions };
+export { ConfigContext, Field, FieldGroup, Form, FormContext, FormalityProvider, GroupContext, UnusedFields, defineInputs, makeDeepProxyState, makeProxyState, useConditions, useConfigContext, useField, useFormContext, useFormState, useGroupContext, useInferredInputs, usePropsEvaluation, useSubscriptions };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map