@formality-ui/react 0.3.1 → 0.4.0

package/dist/index.d.cts

@@ -133,6 +133,15 @@ interface ReactInputConfig<TValue = unknown> extends Omit<InputConfig<TValue>, "
  *
  * The generic `V` defaults to `FieldValues`; pass your form's values type for
  * slightly tighter checking on path-based rules.
+ *
+ * The §6.4 field-level override fields (`defaultValue`, `debounce`,
+ * `parser`, `formatter`, `valueField`, `getSubmitField`) are inherited
+ * from core `FieldConfig` unchanged. They override their `InputConfig`
+ * counterparts when `!== undefined`, using the single
+ * `resolveFieldOverType` rule (§6.4.0). The field-level
+ * `parser`/`formatter` stay `string | ((value: unknown) => unknown)` —
+ * NOT generified over `TValue` (per-field `TValue` is a future
+ * enhancement, §3.2.1).
  */
 interface ReactFieldConfig<V extends FieldValues = FieldValues> extends Omit<FieldConfig, "rules"> {
     /** react-hook-form register options forwarded to the field's Controller. */

package/dist/index.d.ts

@@ -133,6 +133,15 @@ interface ReactInputConfig<TValue = unknown> extends Omit<InputConfig<TValue>, "
  *
  * The generic `V` defaults to `FieldValues`; pass your form's values type for
  * slightly tighter checking on path-based rules.
+ *
+ * The §6.4 field-level override fields (`defaultValue`, `debounce`,
+ * `parser`, `formatter`, `valueField`, `getSubmitField`) are inherited
+ * from core `FieldConfig` unchanged. They override their `InputConfig`
+ * counterparts when `!== undefined`, using the single
+ * `resolveFieldOverType` rule (§6.4.0). The field-level
+ * `parser`/`formatter` stay `string | ((value: unknown) => unknown)` —
+ * NOT generified over `TValue` (per-field `TValue` is a future
+ * enhancement, §3.2.1).
  */
 interface ReactFieldConfig<V extends FieldValues = FieldValues> extends Omit<FieldConfig, "rules"> {
     /** react-hook-form register options forwarded to the field's Controller. */

package/dist/index.js

@@ -2,7 +2,7 @@ import { createContext, useContext, useMemo, useRef, useState, useCallback, useE
 import { jsx, Fragment } from 'react/jsx-runtime';
 import { useForm, FormProvider, useWatch, Controller, useFormContext as useFormContext$1 } from 'react-hook-form';
 import { debounce } from 'lodash-es';
-import { resolveAllInitialValues, buildFormContext, evaluateDescriptor, resolveFormTitle, transformFieldName, extractValueField, inferFieldsFromDescriptor, inferFieldsFromConditions, evaluateConditions, buildFieldContext, resolveInputConfig, resolveLabel, runValidator, resolveErrorMessage, parse, format, mergeFieldProps, sortFieldsByOrder } from '@formality-ui/core';
+import { resolveAllInitialValues, resolveFieldOverType, buildFormContext, evaluateDescriptor, resolveFormTitle, transformFieldName, extractValueField, inferFieldsFromDescriptor, inferFieldsFromConditions, evaluateConditions, buildFieldContext, resolveInputConfig, resolveLabel, runValidator, resolveErrorMessage, parse, format, mergeFieldProps, sortFieldsByOrder } from '@formality-ui/core';
 
 // src/context/ConfigContext.ts
 var defaultConfigContext = {
@@ -277,7 +277,11 @@ function Form({
         for (const field of affected) {
           pendingAffectedFields.current.add(field);
         }
-        const fieldDebounce = inputConfig?.debounce;
+        const fieldConfig = config[name];
+        const fieldDebounce = resolveFieldOverType(
+          fieldConfig?.debounce,
+          inputConfig?.debounce
+        );
         if (fieldDebounce === false) {
           executeAutoSaveRef.current?.();
         } else if (typeof fieldDebounce === "number") {
@@ -287,7 +291,7 @@ function Form({
         }
       }
     },
-    [autoSave, getAffectedFields]
+    [autoSave, getAffectedFields, config]
   );
   const setFieldValidating = useCallback(
     (name, isValidating) => {
@@ -591,13 +595,17 @@ function transformValuesForSubmit(values, config, inputs) {
     const fieldConfig = config[name];
     const type = fieldConfig?.type ?? "textField";
     const inputConfig = inputs[type];
-    if (inputConfig) {
-      const submitName = transformFieldName(name, inputConfig.getSubmitField);
-      const submitValue = extractValueField(value, inputConfig.valueField);
-      result[submitName] = submitValue;
-    } else {
-      result[name] = value;
-    }
+    const effectiveGetSubmitField = resolveFieldOverType(
+      fieldConfig?.getSubmitField,
+      inputConfig?.getSubmitField
+    );
+    const effectiveValueField = resolveFieldOverType(
+      fieldConfig?.valueField,
+      inputConfig?.valueField
+    );
+    const submitName = transformFieldName(name, effectiveGetSubmitField);
+    const submitValue = extractValueField(value, effectiveValueField);
+    result[submitName] = submitValue;
   }
   return result;
 }
@@ -1074,8 +1082,22 @@ function useField({
     groupContext.state.isVisible
   ]);
   const label = useMemo(() => {
-    return resolveLabel(name, fieldConfig, fieldSelectProps, restProps);
-  }, [name, fieldConfig, fieldSelectProps, restProps]);
+    return resolveLabel(
+      name,
+      fieldConfig,
+      fieldSelectProps,
+      restProps,
+      providerSelectProps,
+      formSelectProps
+    );
+  }, [
+    name,
+    fieldConfig,
+    fieldSelectProps,
+    restProps,
+    providerSelectProps,
+    formSelectProps
+  ]);
   const passSubscriptionsEnabled = fieldConfig.passSubscriptions === true;
   const provideStateEnabled = fieldConfig.provideState === true;
   const subscribedWatchNames = useMemo(
@@ -1154,23 +1176,25 @@ function useField({
     name,
     setFieldValidating
   ]);
+  const effectiveParser = useMemo(
+    () => resolveFieldOverType(fieldConfig.parser, inputConfig.parser),
+    [fieldConfig.parser, inputConfig.parser]
+  );
+  const effectiveFormatter = useMemo(
+    () => resolveFieldOverType(fieldConfig.formatter, inputConfig.formatter),
+    [fieldConfig.formatter, inputConfig.formatter]
+  );
   const handleChange = useCallback(
     (onChange) => (newValue) => {
       const parsedValue = parse(
         newValue,
-        inputConfig.parser,
+        effectiveParser,
         providerConfig.parsers
       );
       onChange(parsedValue);
       changeField(name, parsedValue, inputConfig);
     },
-    [
-      inputConfig.parser,
-      providerConfig.parsers,
-      changeField,
-      name,
-      inputConfig
-    ]
+    [effectiveParser, providerConfig.parsers, changeField, name, inputConfig]
   );
   const fieldStateRef = useRef(
     {}
@@ -1188,7 +1212,7 @@ function useField({
       render: ({ field, fieldState, formState }) => {
         const formattedValue = format(
           field.value,
-          inputConfig.formatter,
+          effectiveFormatter,
           providerConfig.formatters
         );
         const stateInjection = {};