@paragrav/rhf-utils 0.0.124 → 0.0.126

package/README.md

@@ -38,7 +38,7 @@ export const rhfUtilsClientConfig: RhfUtilsClientConfig = {
     },
   },
 
-  // optional (defaults to primitive HTML form)
+  // optional form component (defaults to primitive HTML form)
   FormComponent: Form.Root,
 
   // optional wrapper to inject your own hooks and components
@@ -49,7 +49,7 @@ export const rhfUtilsClientConfig: RhfUtilsClientConfig = {
       formId, //          unique id string
       formRef, //         ref
       context, //         rhf UseFormReturn
-      options, //         RhfUtilsFormOptions
+      options, //         RhfUtilsFormOptions (with any custom props)
       Controller, //      strictly-typed controller
       FormSubmitError, // strictly-typed error class
       children, //        RhfUtilsZodForm's Children instance
@@ -57,7 +57,9 @@ export const rhfUtilsClientConfig: RhfUtilsClientConfig = {
   ) => {
     // your own hooks/behaviors
     // (using custom option prop -- see "Extend RhfUtilsFormOptions" section)
-    useMyFormNavigationPrompt(!!options?.enableMyFormNavigationPrompt);
+    useMyFormNavigationPrompt({
+      enabled: !!options?.enableMyFormNavigationPrompt,
+    });
 
     return (
       <>
@@ -165,13 +167,16 @@ Currently, only `zod` is supported.
       <button type="submit">Login</button>
     </>
   )}
-  // form-specific options/overrides
+  // form-specific options/overrides (merged with defaults)
   rhf={{
     mode: 'onBlur',
   }}
   utils={{
     submitOnChange: true,
-    resetValuesOnSubmitError: true,
+    resetOnSubmitted: {
+      onSuccess: { values: 'current' },
+      onError: { values: 'defaults' },
+    },
     // custom option props
     // (see "Extend RhfUtilsFormOptions" section)
     enableMyFormNavigationPrompt: true,
@@ -242,7 +247,10 @@ type RhfUtilsFormOptions = {
   submitOnChange?: boolean;
 
   /** Reset form after submitted. */
-  resetFormOnSubmitted?: UseResetFormOnSubmittedOptions;
+  resetOnSubmitted?: {
+    onSuccess?: { values: 'defaults' | 'current' };
+    onError?: { values: 'defaults' };
+  };
 
   /** Control dev tool options. (Lazy-loaded when truthy value supplied.) */
   devTool?: true | Pick<DevtoolUIProps, 'placement' | 'styles'>;

package/dist/esm/client/index.mjs

@@ -1,52 +1,46 @@
-import { jsx as u } from "react/jsx-runtime";
-import a from "../form/FormWithProviders.mjs";
-import F from "../form/useRhfUtilsForm.mjs";
-const v = (e) => (r) => {
-  const m = d(e, r);
+import { jsx as n } from "react/jsx-runtime";
+import m from "../form/FormWithProviders.mjs";
+import l from "../form/useRhfUtilsForm.mjs";
+import { mergeRhfUtilsClientConfigDefaultsWithUseRhfUtilsFormProps as F } from "./utils.mjs";
+const p = (r) => (o) => {
+  const i = f(r, o);
   return {
-    useForm: (s, t) => {
-      const o = m(s, t);
+    useForm: (e, t) => {
+      const s = i(e, t);
       return {
-        ...F(o),
-        FormWithProviders: () => /* @__PURE__ */ u(a, { ...o })
+        ...l(s),
+        FormWithProviders: () => /* @__PURE__ */ n(m, { ...s })
       };
     },
-    FormWithProviders: P(e, r)
+    FormWithProviders: u(r, o)
   };
-}, d = (e, r) => function(s, t) {
-  var o, i, f, l, n, h;
+}, f = (r, o) => function(e, t) {
   return {
     ...t,
-    // merge global config with instance options...
-    rhf: {
-      resolver: e(s),
-      ...(o = r.defaults) == null ? void 0 : o.rhf,
-      ...t.rhf
-    },
-    utils: {
-      ...(i = r.defaults) == null ? void 0 : i.utils,
-      ...t.utils
-    },
-    form: {
-      ...(f = r.defaults) == null ? void 0 : f.form,
-      ...t.form,
-      className: [(n = (l = r.defaults) == null ? void 0 : l.form) == null ? void 0 : n.className, (h = t.form) == null ? void 0 : h.className].filter(Boolean).join(" ")
-    }
+    ...F(
+      o.defaults,
+      t,
+      {
+        rhf: {
+          resolver: r(e)
+        }
+      }
+    )
   };
-}, P = (e, r) => function({
-  schema: s,
+}, u = (r, o) => function({
+  schema: e,
   children: t,
-  ...o
+  ...s
 }) {
-  const i = d(e, r);
-  return /* @__PURE__ */ u(
-    a,
+  const h = f(r, o);
+  return /* @__PURE__ */ n(
+    m,
     {
-      ...i(s, o),
+      ...h(e, s),
       children: t
     }
   );
 };
 export {
-  v as createRhfUtilsClient
+  p as createRhfUtilsClient
 };

package/dist/esm/client/utils.mjs

@@ -0,0 +1,24 @@
+const i = (l, ...t) => t.reduce(
+  (s, e) => {
+    var f, o;
+    return {
+      rhf: {
+        ...s == null ? void 0 : s.rhf,
+        ...e.rhf
+      },
+      utils: {
+        ...s == null ? void 0 : s.utils,
+        ...e.utils
+      },
+      form: {
+        ...s == null ? void 0 : s.form,
+        ...e.form,
+        className: [(f = s == null ? void 0 : s.form) == null ? void 0 : f.className, (o = e.form) == null ? void 0 : o.className].filter(Boolean).join(" ")
+      }
+    };
+  },
+  l
+);
+export {
+  i as mergeRhfUtilsClientConfigDefaultsWithUseRhfUtilsFormProps
+};

package/dist/esm/devtool/LazyDevTool.mjs

@@ -6,8 +6,7 @@ const a = e.lazy(
     default: o.DevTool
   }))
 ), u = ({ isDevelopment: o, props: r }) => {
-  if (!o)
-    return null;
+  if (!o) return null;
   const { control: l } = n();
   return /* @__PURE__ */ t(e.Suspense, { fallback: null, children: /* @__PURE__ */ t(a, { control: l, ...r }) });
 };

package/dist/esm/errors/flat/context/useFlatFieldErrorsContextOutput.mjs

@@ -6,8 +6,7 @@ const C = (r) => {
   const l = p(), t = F();
   u.useEffect(() => {
     var o, m;
-    if (!t.hasErrors)
-      return;
+    if (!t.hasErrors) return;
     const e = (o = r == null ? void 0 : r.console) == null ? void 0 : o.call(r, t);
     e && E(
       e.message ?? a,

package/dist/esm/errors/flat/getFlatFieldErrors.mjs

@@ -9,8 +9,7 @@ const u = (t) => {
           d,
           ""
         );
-        if (r === o)
-          return e;
+        if (r === o) return e;
         const f = c(t, r, void 0);
         return f && e.push([r, f]), e;
       },

package/dist/esm/form/context/utils/RhfUtilsContextProvider.mjs

@@ -1,29 +1,29 @@
-import { jsx as F } from "react/jsx-runtime";
-import O from "../../../client/config/useRhfUtilsClientConfigContext.mjs";
-import f from "../../../errors/flat/context/useFlatFieldErrorsContextOutput.mjs";
-import h from "../../../submit/useFormOnSubmitSuccessfulAndReset.mjs";
-import i from "../../../submit/useResetFormOnSubmitted.mjs";
-import l from "../../../submit/useSubmitFormOnChange.mjs";
-import { _RhfUtilsContextProvider as d } from "./useRhfUtilsContext.mjs";
-const b = ({
-  formId: C,
-  formRef: e,
+import { jsx as f } from "react/jsx-runtime";
+import u from "../../../client/config/useRhfUtilsClientConfigContext.mjs";
+import d from "../../../errors/flat/context/useFlatFieldErrorsContextOutput.mjs";
+import i from "../../../submit/useFormOnSubmitSuccessfulAndReset.mjs";
+import x from "../../../submit/useResetFormOnSubmitted.mjs";
+import O from "../../../submit/useSubmitFormOnChange.mjs";
+import { _RhfUtilsContextProvider as h } from "./useRhfUtilsContext.mjs";
+const P = ({
+  formId: l,
+  formRef: m,
   onSubmitSuccessfulAndReset: t,
   options: r,
-  children: x
+  children: C
 }) => {
   var a;
-  const m = O();
-  return f((a = m == null ? void 0 : m.fieldErrors) == null ? void 0 : a.output), l(e, {
+  const e = u();
+  return d((a = e == null ? void 0 : e.fieldErrors) == null ? void 0 : a.output), O(m, {
     disabled: !(r != null && r.submitOnChange)
-  }), i(
-    (r == null ? void 0 : r.resetFormOnSubmitted) ?? (t && {
-      onSuccess: !!t
+  }), x(
+    (r == null ? void 0 : r.resetOnSubmitted) ?? (t && {
+      onSuccess: { values: "defaults" }
     })
-  ), h(() => {
+  ), i(() => {
     t == null || t();
-  }), /* @__PURE__ */ F(d, { value: { formId: C, formRef: e, options: r }, children: x });
+  }), /* @__PURE__ */ f(h, { value: { formId: l, formRef: m, options: r }, children: C });
 };
 export {
-  b as default
+  P as default
 };

package/dist/esm/form/utils/useFormRequestSubmit.mjs

@@ -1,6 +1,5 @@
 const u = (t) => (r) => {
-  if (!t.current)
-    throw new Error();
+  if (!t.current) throw new Error();
   e(t.current, r);
 }, e = (t, r) => {
   t.requestSubmit(r);

package/dist/esm/submit/useResetFormOnSubmitted.mjs

@@ -1,15 +1,14 @@
-import { useFormContext as m } from "react-hook-form";
-import n from "./useFormOnSubmitted.mjs";
-const S = (e) => {
-  const { reset: r, getValues: u } = m();
-  n((s) => {
-    if (!e)
-      return;
-    const t = e[s ? "onSuccess" : "onError"];
-    if (!t)
-      return;
-    const o = t === "current" ? u() : void 0;
-    r(o, {
+import { useFormContext as n } from "react-hook-form";
+import c from "./useFormOnSubmitted.mjs";
+const a = (e) => {
+  const { reset: u, getValues: s } = n();
+  c((o) => {
+    var r;
+    if (!e) return;
+    const t = (r = e[o ? "onSuccess" : "onError"]) == null ? void 0 : r.values;
+    if (!t) return;
+    const m = t === "current" ? s() : void 0;
+    u(m, {
       // keep submit stuff for tracking relevant state (e.g., `useFormOnSubmitSuccessful`)
       keepIsSubmitSuccessful: !0,
       keepIsSubmitted: !0,
@@ -19,5 +18,5 @@ const S = (e) => {
   });
 };
 export {
-  S as default
+  a as default
 };

package/dist/esm/submit/useSubmitFormOnChange.mjs

@@ -3,11 +3,9 @@ import m from "../form/utils/useFormRequestSubmit.mjs";
 const d = (t, e) => {
   const u = !(e != null && e.disabled), a = m(t);
   c.useEffect(() => {
-    if (!u)
-      return;
+    if (!u) return;
     const r = t.current;
-    if (!r)
-      throw new Error();
+    if (!r) throw new Error();
     const n = () => {
       a();
     };

package/dist/esm/utils/createContext.mjs

@@ -2,8 +2,7 @@ import r from "react";
 function i() {
   const e = r.createContext(void 0), t = () => r.useContext(e), n = () => {
     const o = t();
-    if (o === void 0)
-      throw new Error();
+    if (o === void 0) throw new Error();
     return o;
   };
   return {

package/dist/types/client/utils.d.ts

@@ -0,0 +1,47 @@
+import { SafeFieldValues } from '../form/SafeFieldValues';
+import { UseRhfUtilsFormProps } from '../form/UseRhfUtilsFormProps';
+import { RhfUtilsClientConfig } from './config/RhfUtilsClientConfig';
+
+/**
+ * Merge {@link RhfUtilsClientConfig.defaults} with array of {@link UseRhfUtilsFormProps}'s overrides.
+ */
+export declare const mergeRhfUtilsClientConfigDefaultsWithUseRhfUtilsFormProps: <TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues>(defaults: RhfUtilsClientConfig['defaults'], ...props: Pick<UseRhfUtilsFormProps<TFieldValues, TTransformedValues>, 'rhf' | 'utils' | 'form'>[]) => {
+    rhf?: Pick<Partial<{
+        mode: "onChange" | "onBlur" | "onSubmit" | "onTouched" | "all";
+        disabled: boolean;
+        reValidateMode: "onChange" | "onBlur" | "onSubmit";
+        defaultValues: ((payload?: unknown) => Promise<import('react-hook-form').FieldValues>) | {
+            [x: string]: any;
+        };
+        values: import('react-hook-form').FieldValues;
+        errors: import('react-hook-form').FieldErrors<import('react-hook-form').FieldValues>;
+        resetOptions: Partial<{
+            keepDirtyValues: boolean;
+            keepErrors: boolean;
+            keepDirty: boolean;
+            keepValues: boolean;
+            keepDefaultValues: boolean;
+            keepIsSubmitted: boolean;
+            keepIsSubmitSuccessful: boolean;
+            keepTouched: boolean;
+            keepIsValidating: boolean;
+            keepIsValid: boolean;
+            keepSubmitCount: boolean;
+        }> | undefined;
+        resolver: import('react-hook-form').Resolver<import('react-hook-form').FieldValues, any>;
+        context: any;
+        shouldFocusError: boolean;
+        shouldUnregister: boolean;
+        shouldUseNativeValidation: boolean;
+        progressive: boolean;
+        criteriaMode: import('react-hook-form').CriteriaMode;
+        delayError: number;
+    }>, "shouldUnregister" | "mode" | "reValidateMode" | "resetOptions" | "context" | "shouldFocusError" | "shouldUseNativeValidation" | "progressive" | "criteriaMode" | "delayError"> | undefined;
+    utils?: {
+        stopSubmitPropagation?: boolean | undefined;
+        submitOnChange?: boolean | undefined;
+        resetOnSubmitted?: import('../submit/useResetFormOnSubmitted').UseResetFormOnSubmittedOptions;
+        devTool?: true | Pick<import('@hookform/devtools/dist/devToolUI').DevtoolUIProps, "placement" | "styles"> | undefined;
+    } | undefined;
+    form?: Omit<Omit<import('react').DetailedHTMLProps<import('react').FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>, "ref">, "onSubmit"> | undefined;
+} | undefined;

package/dist/types/form/RhfUtilsFormOptions.d.ts

@@ -13,7 +13,7 @@ export type RhfUtilsFormOptions = {
     /** Request submit via listener on form change. */
     submitOnChange?: boolean;
     /** Reset form after submit. */
-    resetFormOnSubmitted?: UseResetFormOnSubmittedOptions;
+    resetOnSubmitted?: UseResetFormOnSubmittedOptions;
     /**
      * Control dev tool options.
      * (Lazy-loaded when truthy value supplied.

package/dist/types/submit/useResetFormOnSubmitted.d.ts

@@ -5,14 +5,18 @@
 export type UseResetFormOnSubmittedOptions = undefined | {
     /**
      * Reset values on submit successful.
-     * - `true`: reset to default values
+     * - `'defaults'`: reset to default values
      * - `'current'`: reset to current values
      */
-    onSuccess?: true | 'current';
+    onSuccess?: {
+        values: 'defaults' | 'current';
+    };
     /**
      * Reset values on submit error. (reset to default values)
      */
-    onError?: true;
+    onError?: {
+        values: 'defaults';
+    };
 };
 /**
  * Handle resetting after successful submit with no server validation errors.

package/package.json

@@ -2,7 +2,7 @@
   "name": "@paragrav/rhf-utils",
   "author": "paragrav.dev",
   "license": "MIT",
-  "version": "0.0.124",
+  "version": "0.0.126",
   "description": "Integration utilities for react-hook-form.",
   "type": "module",
   "sideEffects": false,