@paragrav/rhf-utils 0.60.0 → 0.62.0

package/dist/esm/index.mjs

@@ -1,23 +1,23 @@
-import { jsx as c, jsxs as X } from "react/jsx-runtime";
+import { jsx as c, jsxs as L } from "react/jsx-runtime";
 import u from "react";
-import { c as L, u as v, g as Y, i as D, _ as tt } from "./getFlatFieldErrors.mjs";
-import { Controller as rt, useFormContext as b, useFormState as I, useWatch as et, useForm as ot, FormProvider as st } from "react-hook-form";
-import { zodResolver as nt } from "@hookform/resolvers/zod";
-const B = u.createContext(void 0), er = ({
+import { F as Y, c as B, u as v, g as tt, i as D, _ as rt, a as et } from "./FormRelaySetter.mjs";
+import { Controller as ot, useFormContext as b, useFormState as k, useWatch as st, useForm as nt, FormProvider as it } from "react-hook-form";
+import { zodResolver as ct } from "@hookform/resolvers/zod";
+const M = u.createContext(void 0), nr = ({
   config: t,
   children: r
 }) => {
   const [e] = u.useState(t ?? {});
-  return /* @__PURE__ */ c(B.Provider, { value: e, children: r });
+  return /* @__PURE__ */ c(M.Provider, { value: e, children: /* @__PURE__ */ c(Y, { children: r }) });
 }, {
-  Provider: it,
-  useRequired: M
-} = L(), or = () => {
-  const t = M();
+  Provider: ut,
+  useRequired: N
+} = B(), ir = () => {
+  const t = N();
   return u.useMemo(() => !t.hasErrors || !t.hasOrphans ? !1 : Object.keys(t.orphans).length === Object.keys(t.all).length, [t]);
-}, N = "data-rhfutils-nonfield-error-marker-path", sr = ({ path: t }) => {
+}, q = "data-rhfutils-nonfield-error-marker-path", cr = ({ path: t }) => {
   const r = {
-    [N]: t
+    [q]: t
   };
   return /* @__PURE__ */ c(
     "div",
@@ -28,13 +28,13 @@ const B = u.createContext(void 0), er = ({
       ...r
     }
   );
-}, ut = (t) => u.useCallback(
+}, lt = (t) => u.useCallback(
   (r) => {
     if (!t.current) throw new Error();
-    ct(t.current, r);
+    at(t.current, r);
   },
   [t]
-), ct = (t, r) => {
+), at = (t, r) => {
   t.requestSubmit(r);
 };
 class E extends Error {
@@ -43,32 +43,32 @@ class E extends Error {
   }
 }
 const {
-  Provider: lt,
-  useRequired: q
-} = L(), nr = () => q().current, at = u.lazy(
+  Provider: mt,
+  useRequired: H
+} = B(), ur = () => H().current, dt = u.lazy(
   () => import("@hookform/devtools").then((t) => ({
     default: t.DevTool
   }))
-), mt = ({ config: t }) => {
+), ft = ({ config: t }) => {
   const [r] = u.useState(t);
   if (!r) return null;
   const e = typeof r == "object" ? r : void 0;
-  return /* @__PURE__ */ c(u.Suspense, { children: /* @__PURE__ */ c(at, { ...e }) });
-}, ft = () => {
+  return /* @__PURE__ */ c(u.Suspense, { children: /* @__PURE__ */ c(dt, { ...e }) });
+}, ht = () => {
   const t = v();
-  return /* @__PURE__ */ c(mt, { config: t.options.devTool });
-}, H = (t) => /* @__PURE__ */ c(rt, { ...t }), R = () => {
-  const t = u.useContext(B);
+  return /* @__PURE__ */ c(ft, { config: t.options.devTool });
+}, z = (t) => /* @__PURE__ */ c(ot, { ...t }), R = () => {
+  const t = u.useContext(M);
   if (t === void 0) throw new Error();
   return t;
-}, dt = () => {
+}, Ft = () => {
   const t = v(), r = b();
   return {
     utils: t,
     rhf: r,
     FormSubmitError: E
   };
-}, ht = (t, r, e) => {
+}, bt = (t, r, e) => {
   const o = r?.();
   return async () => {
     if (!(!t || await Promise.resolve(
@@ -76,29 +76,29 @@ const {
     ) === !1))
       return Promise.resolve(t());
   };
-}, Ft = (t) => {
-  const { useCanFormBeCancelled: r } = R(), e = dt();
-  return ht(
+}, St = (t) => {
+  const { useCanFormBeCancelled: r } = R(), e = Ft();
+  return bt(
     t,
     r,
     e
   );
-}, bt = ({
+}, pt = ({
   onCancel: t,
   Children: r
 }) => {
-  const e = b(), o = v(), s = Ft(t);
+  const e = b(), o = v(), s = St(t);
   return /* @__PURE__ */ c(
     r,
     {
       ...o,
       rhf: e,
       onCancel: s,
-      Controller: H,
+      Controller: z,
       FormSubmitError: E
     }
   );
-}, St = (t, r) => {
+}, Et = (t, r) => {
   Object.entries(r).forEach(([e, o]) => {
     t.setError(e, {
       type: "FormSubmitFieldError",
@@ -106,23 +106,25 @@ const {
       ...o
     });
   });
-}, pt = (t, r, e) => ({
+}, vt = ({
+  children: t
+}) => t, Rt = (t, r, e) => ({
   ...t,
   ...r,
   className: [t?.className, r?.className, e?.className].filter(Boolean).join(" ").trim() || void 0
   // replace empty string with undefined
-}), Et = (t, r, e) => {
+}), Ct = (t, r, e) => {
   const o = R();
   return {
     id: r,
-    ...pt(
+    ...Rt(
       o.defaults?.form,
       t,
       e
     )
   };
-}, vt = (t) => {
-  const r = q();
+}, gt = (t) => {
+  const r = H();
   return async function(e) {
     try {
       return r.reset(), await t(e);
@@ -130,23 +132,23 @@ const {
       throw r.set(o, e), o;
     }
   };
-}, Rt = ({
+}, Ot = ({
   onValid: t,
   onInvalid: r,
   onError: e,
   onFinally: o
 }) => {
-  const s = b(), { options: n, lastSubmitStateRef: i } = v(), a = s.handleSubmit(t, r), m = vt(a);
-  return (l) => {
-    i.current = "submitting", n.stopSubmitPropagation && l.stopPropagation(), Promise.resolve(m(l)).then(() => {
+  const s = b(), { options: n, lastSubmitStateRef: i } = v(), l = s.handleSubmit(t, r), m = gt(l);
+  return (a) => {
+    i.current = "submitting", n.stopSubmitPropagation && a.stopPropagation(), Promise.resolve(m(a)).then(() => {
       i.current = "success";
     }).catch((h) => {
-      i.current = "error", e(h, l);
+      i.current = "error", e(h, a);
     }).finally(() => {
       o?.();
     });
   };
-}, Ct = ({
+}, Pt = ({
   getApiData: t,
   // handlers
   onSubmitInvalid: r,
@@ -155,34 +157,34 @@ const {
   onSubmit: s,
   onSubmitSuccess: n,
   onSubmitError: i,
-  onSubmitFinally: a,
+  onSubmitFinally: l,
   // other
   form: m,
-  className: l,
+  className: a,
   //
   children: h
 }) => {
-  const f = b(), d = v(), S = R(), P = Et(
+  const d = b(), f = v(), S = R(), P = Ct(
     m,
-    d.formId,
+    f.formId,
     {
-      className: l
+      className: a
     }
-  ), y = S.FormComponent ?? "form", x = async (F, U) => {
-    const p = f.getValues(), G = t?.(F), C = { input: p, output: F, api: G }, g = {
-      utils: d,
-      rhf: f,
+  ), y = async (F, w) => {
+    const p = d.getValues(), K = t?.(F), C = { input: p, output: F, api: K }, g = {
+      utils: f,
+      rhf: d,
       FormSubmitError: E
-    }, O = U;
-    e && await gt(e, C, g, O), await Promise.resolve(o?.(C, g, O));
-    const K = await Promise.resolve(
+    }, O = w;
+    e && await yt(e, C, g, O), await Promise.resolve(o?.(C, g, O));
+    const X = await Promise.resolve(
       s?.(C, g, O)
     );
-    d.lastSubmitStateRef.current = "success", await Promise.resolve(
-      n?.(K, C, g, O)
+    f.lastSubmitStateRef.current = "success", await Promise.resolve(
+      n?.(X, C, g, O)
     );
   };
-  function W(F, U) {
+  function x(F, w) {
     const p = F instanceof E ? (
       // consumer can manually throw FormSubmitError (e.g., manual validation)
       F.errors
@@ -190,54 +192,47 @@ const {
       // if error is not FormSubmitError, consumer can provide global handler
       S.onSubmitErrorUnknown?.(F)
     );
-    p && St(f, p), i?.(
+    p && Et(d, p), i?.(
       F,
       {
-        utils: d,
+        utils: f,
         errors: p,
-        rhf: f
+        rhf: d
       },
-      U
+      w
       // `as` required due to conditional generic
     );
   }
-  const V = Rt({
-    onValid: x,
+  const U = Ot({
+    onValid: y,
     onInvalid: r,
-    onError: W,
-    onFinally: a
-  }), _ = {
-    ...P,
-    id: d.formId,
-    onSubmit: V
-  };
-  if (!S.FormComponent)
-    return /* @__PURE__ */ c("form", { ref: d.formRef, ..._, children: h });
-  const $ = {
-    ...d,
-    formProps: _,
-    rhf: f,
-    Controller: H,
+    onError: x,
+    onFinally: l
+  }), W = {
+    ...f,
+    rhf: d,
+    Controller: z,
     FormSubmitError: E
-  };
+  }, _ = S.FormComponent ?? "form", G = S.FormChildren ?? vt;
   return /* @__PURE__ */ c(
-    y,
+    _,
     {
-      ref: d.formRef,
-      id: d.formId,
-      ...$,
-      children: h
+      ...P,
+      id: f.formId,
+      ref: f.formRef,
+      onSubmit: U,
+      children: /* @__PURE__ */ c(G, { ...W, children: h })
     }
   );
-}, gt = async (t, r, e, o) => {
+}, yt = async (t, r, e, o) => {
   const n = (await Promise.resolve(
     t(r, e, o)
-  )).filter(([, , i]) => !i).map(([i, a]) => [i, { message: a }]);
+  )).filter(({ valid: i }) => !i).map(({ field: i, message: l }) => [i, { message: l }]);
   if (n.length)
     throw new e.FormSubmitError(
       Object.fromEntries(n)
     );
-}, z = ({
+}, A = ({
   getApiData: t,
   // handlers
   onCancel: r,
@@ -246,15 +241,15 @@ const {
   onBeforeSubmit: s,
   onSubmit: n,
   onSubmitSuccess: i,
-  onSubmitError: a,
+  onSubmitError: l,
   onSubmitFinally: m,
   //
-  Children: l,
+  Children: a,
   // attrs
   form: h,
-  className: f
-}) => /* @__PURE__ */ X(
-  Ct,
+  className: d
+}) => /* @__PURE__ */ L(
+  Pt,
   {
     getApiData: t,
     onSubmitInvalid: e,
@@ -262,33 +257,33 @@ const {
     onBeforeSubmit: s,
     onSubmit: n,
     onSubmitSuccess: i,
-    onSubmitError: a,
+    onSubmitError: l,
     onSubmitFinally: m,
     form: h,
-    className: f,
+    className: d,
     children: [
-      /* @__PURE__ */ c(ft, {}),
+      /* @__PURE__ */ c(ht, {}),
       /* @__PURE__ */ c(
-        bt,
+        pt,
         {
           onCancel: r,
-          Children: l
+          Children: a
         }
       )
     ]
   }
-), ir = (t) => /* @__PURE__ */ c(z, { ...t }), k = (t) => (r) => (
+), lr = (t) => /* @__PURE__ */ c(A, { ...t }), V = (t) => (r) => (
   // re-create object from entries
   Object.fromEntries(
     // break down to entries
     Object.entries(r).filter(t)
   )
-), A = (t) => !!t.ref, Ot = ([
+), Z = (t) => !!t.ref, xt = ([
   ,
   t
-]) => A(t), Pt = k(
-  Ot
-), yt = (t, r) => (
+]) => Z(t), Ut = V(
+  xt
+), wt = (t, r) => (
   // list of selector variants
   [
     // equals
@@ -301,49 +296,49 @@ const {
       "."
     ]
   ].map(
-    ([e, o]) => xt(
-      N + e,
+    ([e, o]) => It(
+      q + e,
       t + o
     )
   ).join(", ")
-), xt = (t, r) => `[role="alert"][${t}="${r}"]`, Ut = (t, r) => !!r.querySelector(
-  yt(t)
-), T = "root", Z = (t) => t === T || t.startsWith(T + "."), wt = (t, r, e) => (
+), It = (t, r) => `[role="alert"][${t}="${r}"]`, kt = (t, r) => !!r.querySelector(
+  wt(t)
+), T = "root", J = (t) => t === T || t.startsWith(T + "."), Vt = (t, r, e) => (
   // non-field
-  !A(r) && // non-root
-  !Z(t) && // not marked in DOM
-  !Ut(t, e)
-), It = (t) => ([r, e]) => wt(r, e, t), kt = (t, r) => k(
-  It(r)
-)(t), Wt = ([t]) => Z(t), Vt = k(
-  Wt
-), _t = ({
+  !Z(r) && // non-root
+  !J(t) && // not marked in DOM
+  !kt(t, e)
+), Wt = (t) => ([r, e]) => Vt(r, e, t), _t = (t, r) => V(
+  Wt(r)
+)(t), Dt = ([t]) => J(t), Tt = V(
+  Dt
+), jt = ({
   formRef: t,
   children: r
 }) => {
-  const { errors: e } = I(), o = Y(e), s = (
+  const { errors: e } = k(), o = tt(e), s = (
     // eslint-disable-next-line react-hooks/refs
-    t.current ? kt(
+    t.current ? _t(
       o,
       // eslint-disable-next-line react-hooks/refs
       t.current
     ) : {}
   ), n = {
     all: o,
-    fields: Pt(o),
-    roots: Vt(o),
+    fields: Ut(o),
+    roots: Tt(o),
     orphans: s,
     // computed
     hasErrors: !D(e),
     hasOrphans: !D(s)
   };
-  return /* @__PURE__ */ c(it, { value: n, children: r });
-}, Dt = ({
+  return /* @__PURE__ */ c(ut, { value: n, children: r });
+}, Lt = ({
   children: t
 }) => {
   const [r, e] = u.useState(void 0);
   return /* @__PURE__ */ c(
-    lt,
+    mt,
     {
       value: {
         current: r,
@@ -357,14 +352,14 @@ const {
       children: t
     }
   );
-}, Tt = (t, r, e, o = "debug") => {
+}, Bt = (t, r, e, o = "debug") => {
   console[o](t, { values: r, errors: e });
-}, jt = (t) => {
-  const r = b(), e = M();
+}, Mt = (t) => {
+  const r = b(), e = N();
   u.useEffect(() => {
     if (!e.hasErrors) return;
     const o = t?.console?.(e);
-    o && Tt(
+    o && Bt(
       o.message ?? j,
       r.getValues(),
       e,
@@ -374,21 +369,21 @@ const {
     if (s)
       throw new Error(typeof s == "string" ? s : j);
   }, [e]);
-}, j = "Form errors", Lt = (t) => {
+}, j = "Form errors", Nt = (t) => {
   const r = u.useRef(!1);
   return u.useEffect(() => {
     t && (r.current = !0);
   }, [t]), [r, () => {
     r.current = !1;
   }];
-}, Bt = (t, r) => {
-  const { isSubmitSuccessful: e, isSubmitting: o } = I(), [s, n] = Lt(o);
+}, qt = (t, r) => {
+  const { isSubmitSuccessful: e, isSubmitting: o } = k(), [s, n] = Nt(o);
   u.useEffect(() => {
     t && (o || s.current && (n(), t(e)));
   }, [o]);
-}, Mt = (t) => {
+}, Ht = (t) => {
   const { getValues: r, reset: e } = b();
-  Bt((o) => {
+  qt((o) => {
     if (!t) return;
     const s = t[o ? "success" : "error"]?.values;
     if (!s) return;
@@ -415,12 +410,12 @@ const {
       keepErrors: !0
     });
   });
-}, Nt = () => {
-  const t = u.useRef(w);
-  return u.useEffect(() => (t.current && (t.current = !w), () => {
-    t.current = w;
+}, zt = () => {
+  const t = u.useRef(I);
+  return u.useEffect(() => (t.current && (t.current = !I), () => {
+    t.current = I;
   }), []), t;
-}, w = !0, qt = ({
+}, I = !0, At = ({
   onChange: t,
   delay: r
 }) => {
@@ -441,8 +436,8 @@ const {
       timer: setTimeout(o, r)
     };
   }];
-}, Ht = (t, r) => {
-  const e = ut(t), [o] = qt({
+}, Zt = (t, r) => {
+  const e = lt(t), [o] = At({
     delay: r?.debounce ?? 0,
     // on change value after debounce
     onChange: () => {
@@ -450,14 +445,14 @@ const {
     }
   });
   return o;
-}, zt = (t, r) => {
-  const e = Ht(t, {
+}, Jt = (t, r) => {
+  const e = Zt(t, {
     debounce: r?.debounce
-  }), o = et(), { isValid: s, isDirty: n, isValidating: i, isSubmitting: a } = I(), m = u.useMemo(() => JSON.stringify(o), [o]), l = Nt();
+  }), o = st(), { isValid: s, isDirty: n, isValidating: i, isSubmitting: l } = k(), m = u.useMemo(() => JSON.stringify(o), [o]), a = zt();
   u.useEffect(
     // on form values/state change, call callback
     () => {
-      l.current || i || a || s && n && e(o);
+      a.current || i || l || s && n && e(o);
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [s, n, m, i]
@@ -466,7 +461,7 @@ const {
     // - isSubmitting not included bc would create infinite loop of submits after first submission
     //   - expect form to block changes while submitting to avoid changes that get swallowed
   );
-}, At = ({
+}, Qt = ({
   formId: t,
   formRef: r,
   options: e,
@@ -474,13 +469,13 @@ const {
   children: o
 }) => {
   const [s] = u.useState(e), n = R();
-  jt(n.fieldErrors?.output), (s.submitOnWatch ? zt : void 0)?.(
+  Mt(n.fieldErrors?.output), (s.submitOnWatch ? Jt : void 0)?.(
     r,
     s.submitOnWatch
-  ), Mt(s.resetOnSubmitted);
+  ), Ht(s.resetOnSubmitted);
   const i = u.useRef(null);
   return /* @__PURE__ */ c(
-    tt,
+    rt,
     {
       value: {
         formId: t,
@@ -491,7 +486,7 @@ const {
       children: o
     }
   );
-}, Zt = (t, r) => ({
+}, $t = (t, r) => ({
   ...t,
   ...r,
   // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- false positive
@@ -501,104 +496,110 @@ const {
       ...r?.resetOnSubmitted
     }
   }
-}), Jt = (t, r) => u.useMemo(
-  () => Zt(t.defaults?.options, r),
+}), Gt = (t, r) => u.useMemo(
+  () => $t(t.defaults?.options, r),
   // eslint-disable-next-line react-hooks/exhaustive-deps
   [JSON.stringify(r)]
-), Qt = (t, r) => ({
+), Kt = (t, r) => ({
   ...t,
   ...r
-}), $t = (t, r, e, o) => ot({
-  ...Qt(r.defaults?.rhf, t),
+}), Xt = (t, r, e, o) => nt({
+  ...Kt(r.defaults?.rhf, t),
   resolver: o,
   defaultValues: e
 });
-function J({
+function Q({
   formId: t,
   rhf: r,
   resolver: e,
   defaultValues: o,
   options: s,
+  relay: n,
   //
-  children: n
+  children: i
 }) {
-  const i = R(), a = u.useId(), m = t || a, l = u.useRef(null), h = $t(
+  const l = R(), m = u.useId(), a = t || m, h = u.useRef(null), d = Xt(
     r,
-    i,
+    l,
     o,
     e
-  ), f = Jt(i, s);
-  return /* @__PURE__ */ c(st, { ...h, children: /* @__PURE__ */ c(_t, { formRef: l, children: /* @__PURE__ */ c(
-    At,
+  ), f = Gt(l, s);
+  return /* @__PURE__ */ c(it, { ...d, children: /* @__PURE__ */ c(jt, { formRef: h, children: /* @__PURE__ */ L(
+    Qt,
     {
-      formId: m,
-      formRef: l,
+      formId: a,
+      formRef: h,
       options: f,
-      children: /* @__PURE__ */ c(Dt, { children: n })
+      children: [
+        /* @__PURE__ */ c(et, { options: n }),
+        /* @__PURE__ */ c(Lt, { children: i })
+      ]
     }
   ) }) });
 }
-const Q = (t) => nt(t), ur = ({
+const $ = (t) => ct(t), ar = ({
   schema: t,
   children: r,
   ...e
-}) => /* @__PURE__ */ c(J, { ...e, resolver: Q(t), children: r });
-function Gt({
+}) => /* @__PURE__ */ c(Q, { ...e, resolver: $(t), children: r });
+function Yt({
   getApiData: t,
   // provider
   resolver: r,
   rhf: e,
   defaultValues: o,
   options: s,
+  relay: n,
   // form
-  onCancel: n,
-  onSubmitInvalid: i,
-  onBeforeSubmitInvariants: a,
-  onBeforeSubmit: m,
-  onSubmit: l,
-  onSubmitSuccess: h,
+  onCancel: i,
+  onSubmitInvalid: l,
+  onBeforeSubmitInvariants: m,
+  onBeforeSubmit: a,
+  onSubmit: h,
+  onSubmitSuccess: d,
   onSubmitError: f,
-  onSubmitFinally: d,
-  Children: S,
-  form: P,
-  formId: y,
-  className: x
+  onSubmitFinally: S,
+  Children: P,
+  form: y,
+  formId: x,
+  className: U
 }) {
-  return /* @__PURE__ */ c(J, { ...{
-    formId: y,
+  return /* @__PURE__ */ c(Q, { ...{
+    formId: x,
     resolver: r,
     rhf: e,
     defaultValues: o,
-    options: s
-  }, children: /* @__PURE__ */ c(z, { ...{
+    options: s,
+    relay: n
+  }, children: /* @__PURE__ */ c(A, { ...{
     getApiData: t,
-    onCancel: n,
-    onSubmitInvalid: i,
-    onBeforeSubmitInvariants: a,
-    onBeforeSubmit: m,
-    onSubmit: l,
-    onSubmitSuccess: h,
+    onCancel: i,
+    onSubmitInvalid: l,
+    onBeforeSubmitInvariants: m,
+    onBeforeSubmit: a,
+    onSubmit: h,
+    onSubmitSuccess: d,
     onSubmitError: f,
-    onSubmitFinally: d,
-    Children: S,
-    form: P,
-    className: x
+    onSubmitFinally: S,
+    Children: P,
+    form: y,
+    className: U
   } }) });
 }
-const cr = ({
+const mr = ({
   schema: t,
   ...r
-}) => /* @__PURE__ */ c(Gt, { ...r, resolver: Q(t) });
+}) => /* @__PURE__ */ c(Yt, { ...r, resolver: $(t) });
 export {
   E as FormSubmitError,
-  er as RhfUtilsClientConfigProvider,
-  sr as RhfUtilsNonFieldErrorMarker,
-  ir as RhfUtilsZodForm,
-  ur as RhfUtilsZodFormProviders,
-  cr as RhfUtilsZodFormWithProviders,
-  M as useFlatFieldErrorsContext,
-  or as useFlatFieldErrorsContextHasOnlyOrphans,
-  ut as useFormRequestSubmit,
-  nr as useLastSubmitError,
+  nr as RhfUtilsClientConfigProvider,
+  cr as RhfUtilsNonFieldErrorMarker,
+  lr as RhfUtilsZodForm,
+  ar as RhfUtilsZodFormProviders,
+  mr as RhfUtilsZodFormWithProviders,
+  N as useFlatFieldErrorsContext,
+  ir as useFlatFieldErrorsContextHasOnlyOrphans,
+  lt as useFormRequestSubmit,
+  ur as useLastSubmitError,
   v as useRhfUtilsContext
 };