@paragrav/rhf-utils 0.0.90 → 0.0.92

package/README.md

@@ -0,0 +1,65 @@
+# README
+
+## Install
+
+```sh
+npm install @paragrav/rhf-utils  # npm
+pnpm install @paragrav/rhf-utils # pnpm
+yarn add @paragrav/rhf-utils     # yarn
+```
+
+## Config
+
+To configure, create a file like `src/integrations/paragrav-rhf-utils/config.tsx` with desired config:
+
+```ts
+const config: ClientConfig = {
+  defaultOptions: {
+    form: {
+      devTool: {
+        placement: 'top-right',
+      },
+    },
+  },
+
+  FormComponent: Form.Root,
+
+  onSubmitError: (error) => {
+    if (!(error instanceof TRPCClientError)) throw error;
+
+
+    const errors = trcpClientErrorToRhfErrorTransformer.parse(error);
+
+    return new FormSubmitError(errors);
+  },
+
+  Children: {
+    top: function Top({ options }) {
+      // navigation blocker
+      useFormRouterBlocker(!!options?.prompter);
+
+      return null;
+    },
+    bottom: () => (
+      <>
+        // global error list
+        <RootErrorsListFromFlatFieldErrorsContext />
+      </>
+    ),
+  },
+};
+```
+
+## Provider
+
+And add our context provider to your stack:
+
+```tsx
+<RhfUtilsClientForZodContextProvider config={config}>
+  {children}
+</RhfUtilsClientForZodContextProvider>
+```
+
+## Usage
+
+Coming soon.

package/dist/esm/client/index.mjs

@@ -1,42 +1,25 @@
-import { jsx as d } from "react/jsx-runtime";
-import f from "../form/FormWithProviders.mjs";
-import l from "../form/useForm.mjs";
-const p = (s) => (r) => {
-  const n = a(
+import { jsx as h } from "react/jsx-runtime";
+import F from "../form/FormWithProviders.mjs";
+import a from "../form/useForm.mjs";
+const v = (s) => (r) => {
+  const i = d(
     s,
     r
   );
   return {
-    useForm: (o, t, e, i, u) => {
-      const m = Array.isArray(t) ? t : [t, void 0, void 0];
-      return l(
-        n(o, {
-          onSubmit: m[0],
-          onSubmitError: m[1],
-          onSubmitInvalid: m[2],
-          defaultValues: e,
-          Fields: i,
-          ...u
-        })
-      );
+    useForm: (n, o) => {
+      const t = i(n, o);
+      return {
+        ...a(t),
+        FormWithProviders: ({
+          children: e
+        }) => /* @__PURE__ */ h(F, { ...t, children: e })
+      };
     },
-    FormWithProviders: h(s, r)
+    FormWithProviders: l(s, r)
   };
-}, h = (s, r) => function({
-  schema: o,
-  children: t,
-  ...e
-}) {
-  const i = a(s, r);
-  return /* @__PURE__ */ d(
-    f,
-    {
-      ...i(o, e),
-      children: t
-    }
-  );
-}, a = (s, r) => (n, o) => {
-  var t, e, i, u, m;
+}, d = (s, r) => function(n, o) {
+  var t, e, m, u, f;
   return {
     ...o,
     config: r,
@@ -49,12 +32,25 @@ const p = (s) => (r) => {
       ...(e = r.defaultOptions) == null ? void 0 : e.form,
       ...o.options,
       classNames: [
-        ...((u = (i = r.defaultOptions) == null ? void 0 : i.form) == null ? void 0 : u.classNames) ?? [],
-        ...((m = o.options) == null ? void 0 : m.classNames) ?? []
+        ...((u = (m = r.defaultOptions) == null ? void 0 : m.form) == null ? void 0 : u.classNames) ?? [],
+        ...((f = o.options) == null ? void 0 : f.classNames) ?? []
       ]
     }
   };
+}, l = (s, r) => function({
+  schema: n,
+  children: o,
+  ...t
+}) {
+  const e = d(s, r);
+  return /* @__PURE__ */ h(
+    F,
+    {
+      ...e(n, t),
+      children: o
+    }
+  );
 };
 export {
-  p as createRhfUtilsClient
+  v as createRhfUtilsClient
 };

package/dist/esm/client/zod/context/useRhfUtilsClientForZodContext.mjs

@@ -1,6 +1,7 @@
-import t from "../../../utils/createContext.mjs";
-const [, o, n] = t(), r = o;
+import s from "../../../utils/createContext.mjs";
+const [, t, n] = s(), i = t, l = (o, e) => t().useForm(o, e);
 export {
   n as _RhfUtilsClientForZodContextProvider,
-  r as default
+  i as default,
+  l as useRhfUtilsZodForm
 };

package/dist/esm/exports.mjs

@@ -1,88 +1,89 @@
 import { default as e } from "./client/zod/context/RhfUtilsClientForZodContextProvider.mjs";
-import { default as s } from "./client/zod/context/useRhfUtilsClientForZodContext.mjs";
-import { default as u } from "./client/zod/createRhfUtilsClientForZod.mjs";
-import { default as m } from "./devtool/LazyDevTool.mjs";
-import { default as d } from "./errors/flat/context/FlatFieldErrorsContextProvider.mjs";
-import { default as x } from "./errors/flat/context/useFlatFieldErrorsContext.mjs";
-import { default as i } from "./errors/flat/FlatFieldErrorsList.mjs";
-import { default as E } from "./errors/message/FormErrorMessage.mjs";
-import { default as h } from "./errors/message/FormErrorMessageByPath.mjs";
-import { default as S } from "./errors/nonfield/FormNonFieldErrorMarker.mjs";
-import { default as P } from "./errors/nonfield/FormNonFieldErrorMarkerHtmlAttribute.mjs";
+import { default as s, useRhfUtilsZodForm as a } from "./client/zod/context/useRhfUtilsClientForZodContext.mjs";
+import { default as f } from "./client/zod/createRhfUtilsClientForZod.mjs";
+import { default as l } from "./devtool/LazyDevTool.mjs";
+import { default as p } from "./errors/flat/context/FlatFieldErrorsContextProvider.mjs";
+import { default as F } from "./errors/flat/context/useFlatFieldErrorsContext.mjs";
+import { default as n } from "./errors/flat/FlatFieldErrorsList.mjs";
+import { default as C } from "./errors/message/FormErrorMessage.mjs";
+import { default as c } from "./errors/message/FormErrorMessageByPath.mjs";
+import { default as b } from "./errors/nonfield/FormNonFieldErrorMarker.mjs";
+import { default as R } from "./errors/nonfield/FormNonFieldErrorMarkerHtmlAttribute.mjs";
 import { default as M } from "./errors/orphan/useFormHasOnlyOrphanFieldErrorsMemo.mjs";
-import { default as R } from "./errors/orphan/useOrphanFormErrorsMemo.mjs";
-import { default as v } from "./errors/orphan/useOrphanFormErrorsToConsole.mjs";
-import { default as T } from "./errors/root/RootErrorsListFromFlatFieldErrorsContext.mjs";
-import { default as k } from "./errors/root/useRootFormFieldErrorsMemo.mjs";
+import { default as G } from "./errors/orphan/useOrphanFormErrorsMemo.mjs";
+import { default as I } from "./errors/orphan/useOrphanFormErrorsToConsole.mjs";
+import { default as g } from "./errors/root/RootErrorsListFromFlatFieldErrorsContext.mjs";
+import { default as B } from "./errors/root/useRootFormFieldErrorsMemo.mjs";
 import { default as A } from "./errors/useFormErrorConsoleDebug.mjs";
 import { default as D } from "./errors/useFormErrorsEffect.mjs";
-import { default as Z } from "./errors/useFormErrorsIfAny.mjs";
-import { default as N } from "./errors/useFormErrorsTransformMemo.mjs";
-import { default as z } from "./errors/useFormRequestSubmit.mjs";
-import { default as j } from "./form/Form.mjs";
-import { default as J } from "./form/FormProviders.mjs";
-import { default as Q } from "./form/FormWithProviders.mjs";
-import { default as X } from "./form/useForm.mjs";
-import { default as _ } from "./form/context/utils/FormUtilsContextProvider.mjs";
-import { default as rr } from "./form/context/utils/useFormUtilsContext.mjs";
-import { default as er } from "./form/context/group/FormGroupContextProvider.mjs";
-import { default as sr } from "./form/context/group/useFormGroupChildIsMountedTracker.mjs";
-import { default as ur } from "./form/context/group/useFormGroupChildIsSubmittingTracker.mjs";
-import { default as mr } from "./form/context/group/useFormGroupChildTracker.mjs";
-import { default as dr } from "./form/context/group/useFormGroupIsAnyBusy.mjs";
-import { default as xr } from "./form/context/group/useFormGroupIsChildBusy.mjs";
-import { default as ir } from "./form/context/group/useFormGroupIsParentBusy.mjs";
-import { default as Er } from "./form/context/group/useFormGroupParentTracker.mjs";
-import { default as hr } from "./form/context/group/useFormOrParentIsBusy.mjs";
-import { default as Sr } from "./form/utils/getSubmitterButtonData.mjs";
-import { FormSubmitError as Pr } from "./submit/error/FormSubmitError.mjs";
+import { default as H } from "./errors/useFormErrorsIfAny.mjs";
+import { default as q } from "./errors/useFormErrorsTransformMemo.mjs";
+import { default as W } from "./errors/useFormRequestSubmit.mjs";
+import { default as w } from "./form/Form.mjs";
+import { default as K } from "./form/FormProviders.mjs";
+import { default as V } from "./form/FormWithProviders.mjs";
+import { default as Y } from "./form/useForm.mjs";
+import { default as $ } from "./form/context/utils/FormUtilsContextProvider.mjs";
+import { default as or } from "./form/context/utils/useFormUtilsContext.mjs";
+import { default as tr } from "./form/context/group/FormGroupContextProvider.mjs";
+import { default as ar } from "./form/context/group/useFormGroupChildIsMountedTracker.mjs";
+import { default as fr } from "./form/context/group/useFormGroupChildIsSubmittingTracker.mjs";
+import { default as lr } from "./form/context/group/useFormGroupChildTracker.mjs";
+import { default as pr } from "./form/context/group/useFormGroupIsAnyBusy.mjs";
+import { default as Fr } from "./form/context/group/useFormGroupIsChildBusy.mjs";
+import { default as nr } from "./form/context/group/useFormGroupIsParentBusy.mjs";
+import { default as Cr } from "./form/context/group/useFormGroupParentTracker.mjs";
+import { default as cr } from "./form/context/group/useFormOrParentIsBusy.mjs";
+import { default as br } from "./form/utils/getSubmitterButtonData.mjs";
+import { FormSubmitError as Rr } from "./submit/error/FormSubmitError.mjs";
 import { default as Mr } from "./submit/useFormOnSubmitSuccessful.mjs";
-import { default as Rr } from "./submit/useFormOnSubmitSuccessfulAndReset.mjs";
-import { default as vr } from "./submit/useResetFormOnSubmitError.mjs";
-import { default as Tr } from "./submit/useResetFormOnSubmitSuccessful.mjs";
-import { default as kr } from "./submit/useSubmitFormOnChange.mjs";
+import { default as Gr } from "./submit/useFormOnSubmitSuccessfulAndReset.mjs";
+import { default as Ir } from "./submit/useResetFormOnSubmitError.mjs";
+import { default as gr } from "./submit/useResetFormOnSubmitSuccessful.mjs";
+import { default as Br } from "./submit/useSubmitFormOnChange.mjs";
 export {
-  d as FlatFieldErrorsContextProvider,
-  i as FlatFieldErrorsList,
-  j as Form,
-  E as FormErrorMessage,
-  h as FormErrorMessageByPath,
-  er as FormGroupContextProvider,
-  S as FormNonFieldErrorMarker,
-  P as FormNonFieldErrorMarkerHtmlAttribute,
-  J as FormProviders,
-  Pr as FormSubmitError,
-  _ as FormUtilsContextProvider,
-  Q as FormWithProviders,
-  m as LazyDevTool,
+  p as FlatFieldErrorsContextProvider,
+  n as FlatFieldErrorsList,
+  w as Form,
+  C as FormErrorMessage,
+  c as FormErrorMessageByPath,
+  tr as FormGroupContextProvider,
+  b as FormNonFieldErrorMarker,
+  R as FormNonFieldErrorMarkerHtmlAttribute,
+  K as FormProviders,
+  Rr as FormSubmitError,
+  $ as FormUtilsContextProvider,
+  V as FormWithProviders,
+  l as LazyDevTool,
   e as RhfUtilsClientForZodContextProvider,
-  T as RootErrorsListFromFlatFieldErrorsContext,
-  u as createRhfUtilsClientForZod,
-  Sr as getSubmitterButtonData,
-  x as useFlatFieldErrorsContext,
-  X as useForm,
+  g as RootErrorsListFromFlatFieldErrorsContext,
+  f as createRhfUtilsClientForZod,
+  br as getSubmitterButtonData,
+  F as useFlatFieldErrorsContext,
+  Y as useForm,
   A as useFormErrorConsoleDebug,
   D as useFormErrorsEffect,
-  Z as useFormErrorsIfAny,
-  N as useFormErrorsTransformMemo,
-  sr as useFormGroupChildIsMountedTracker,
-  ur as useFormGroupChildIsSubmittingTracker,
-  mr as useFormGroupChildTracker,
-  dr as useFormGroupIsAnyBusy,
-  xr as useFormGroupIsChildBusy,
-  ir as useFormGroupIsParentBusy,
-  Er as useFormGroupParentTracker,
+  H as useFormErrorsIfAny,
+  q as useFormErrorsTransformMemo,
+  ar as useFormGroupChildIsMountedTracker,
+  fr as useFormGroupChildIsSubmittingTracker,
+  lr as useFormGroupChildTracker,
+  pr as useFormGroupIsAnyBusy,
+  Fr as useFormGroupIsChildBusy,
+  nr as useFormGroupIsParentBusy,
+  Cr as useFormGroupParentTracker,
   M as useFormHasOnlyOrphanFieldErrorsMemo,
   Mr as useFormOnSubmitSuccessful,
-  Rr as useFormOnSubmitSuccessfulAndReset,
-  hr as useFormOrParentIsBusy,
-  z as useFormRequestSubmit,
-  rr as useFormUtilsContext,
-  R as useOrphanFormErrorsMemo,
-  v as useOrphanFormErrorsToConsole,
-  Tr as useResetFormAfterSubmitSuccessful,
-  vr as useResetFormOnSubmitError,
+  Gr as useFormOnSubmitSuccessfulAndReset,
+  cr as useFormOrParentIsBusy,
+  W as useFormRequestSubmit,
+  or as useFormUtilsContext,
+  G as useOrphanFormErrorsMemo,
+  I as useOrphanFormErrorsToConsole,
+  gr as useResetFormAfterSubmitSuccessful,
+  Ir as useResetFormOnSubmitError,
   s as useRhfUtilsClientForZodContext,
-  k as useRootFormFieldErrorsMemo,
-  kr as useSubmitFormOnChange
+  a as useRhfUtilsZodForm,
+  B as useRootFormFieldErrorsMemo,
+  Br as useSubmitFormOnChange
 };

package/dist/esm/form/useForm.mjs

@@ -1,44 +1,44 @@
 import m from "react";
 import { useForm as F } from "react-hook-form";
 import { FormSubmitError as a } from "../submit/error/FormSubmitError.mjs";
-const I = ({
+const P = ({
   onSubmit: t,
   onSubmitError: e,
   onSubmitInvalid: f,
-  defaultValues: p,
-  Fields: n,
+  defaultValues: n,
+  Fields: p,
   config: u,
   rhf: c,
   form: i,
   options: d
 }) => {
-  const r = m.useId(), s = F({
+  const o = m.useId(), s = F({
     ...c,
-    defaultValues: p
-  }), o = m.useRef(null);
+    defaultValues: n
+  }), r = m.useRef(null);
   return {
-    id: r,
-    ref: o,
+    id: o,
+    ref: r,
     context: s,
     providerProps: {
-      formId: r,
-      formRef: o,
+      formId: o,
+      formRef: r,
       rhfForm: s,
       options: d
     },
     formProps: {
-      Fields: n,
+      Fields: p,
       onSubmit: t,
       onSubmitError: e,
       onSubmitInvalid: f,
-      formId: r,
-      formRef: o,
+      formId: o,
+      formRef: r,
       config: u,
       form: i
     },
     FormSubmitError: a
   };
-};
+}, $ = P;
 export {
-  I as default
+  $ as default
 };

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

@@ -13,11 +13,9 @@ export type ObjectSchema<TInputKey extends string, TOutputKey extends string> =
     [key in TOutputKey]: SafeFieldValues;
 };
 export type CreateRhfUtilsClient<TObjectSchema extends ObjectSchema<TObjectSchemaInputKey, TObjectSchemaOutputKey>, TObjectSchemaInputKey extends string, TObjectSchemaOutputKey extends string> = {
-    useForm: <TSchema extends TObjectSchema, TSchemaInput extends SafeFieldValues = TSchema[TObjectSchemaInputKey], TSchemaOutput extends SafeFieldValues = TSchema[TObjectSchemaOutputKey], UseFormPropsForm extends UseFormProps<TSchemaInput, TSchemaOutput> = UseFormProps<TSchemaInput, TSchemaOutput>>(schema: TSchema, handlers: NonNullable<UseFormPropsForm['onSubmit']> | [
-        NonNullable<UseFormPropsForm['onSubmit']>,
-        UseFormPropsForm['onSubmitError'],
-        UseFormPropsForm['onSubmitInvalid']
-    ], defaultValues: UseFormPropsForm['defaultValues'], Fields: UseFormPropsForm['Fields'], props?: UseFormProps<TSchemaInput, TSchemaOutput>) => UseFormReturn<TSchemaInput, TSchemaOutput>;
+    useForm: <TSchema extends TObjectSchema, TSchemaInput extends SafeFieldValues = TSchema[TObjectSchemaInputKey], TSchemaOutput extends SafeFieldValues = TSchema[TObjectSchemaOutputKey], UseFormPropsForm extends UseFormProps<TSchemaInput, TSchemaOutput> = UseFormProps<TSchemaInput, TSchemaOutput>>(schema: TSchema, form: Omit<UseFormPropsForm, 'config'>) => UseFormReturn<TSchemaInput, TSchemaOutput> & {
+        FormWithProviders: React.FC<React.PropsWithChildren>;
+    };
     FormWithProviders: <TSchema extends TObjectSchema, TSchemaInput extends SafeFieldValues = TSchema[TObjectSchemaInputKey], TSchemaOutput extends SafeFieldValues = TSchema[TObjectSchemaOutputKey]>(props: {
         schema: TSchema;
     } & FormWithProvidersProps<TSchemaInput, TSchemaOutput>) => JSX.Element;

package/dist/types/client/zod/context/useRhfUtilsClientForZodContext.d.ts

@@ -1,6 +1,12 @@
-import { default as createRhfUtilsClientForZod } from '../createRhfUtilsClientForZod';
+import { UseFormProps } from '../../../form/useForm';
+import { default as createRhfUtilsClientForZod, ZodTypeFieldValues } from '../createRhfUtilsClientForZod';
 
 export type RhfUtilsClientForZodContext = ReturnType<typeof createRhfUtilsClientForZod>;
-declare const useRhfUtilsClientForZodContext: () => import('../..').CreateRhfUtilsClient<import('../createRhfUtilsClientForZod').ZodTypeFieldValues, "_input", "_output">, _RhfUtilsClientForZodContextProvider: import('react').Provider<import('../..').CreateRhfUtilsClient<import('../createRhfUtilsClientForZod').ZodTypeFieldValues, "_input", "_output"> | undefined>;
+declare const useRhfUtilsClientForZodContext: () => import('../..').CreateRhfUtilsClient<ZodTypeFieldValues, "_input", "_output">, _RhfUtilsClientForZodContextProvider: import('react').Provider<import('../..').CreateRhfUtilsClient<ZodTypeFieldValues, "_input", "_output"> | undefined>;
 export default useRhfUtilsClientForZodContext;
 export { _RhfUtilsClientForZodContextProvider };
+export declare const useRhfUtilsZodForm: <TSchema extends ZodTypeFieldValues>(schema: TSchema, form: Omit<UseFormProps<TSchema['_input'], TSchema['_output']>, 'config'>) => import('../../../form/useForm').UseFormReturn<TSchema["_input"], TSchema["_output"]> & {
+    FormWithProviders: import('react').FC<{
+        children?: import('react').ReactNode;
+    }>;
+};

package/dist/types/errors/nonfield/FormNonFieldErrorMarker.utils.d.ts

@@ -9,8 +9,10 @@ export declare const getFormNonFieldErrorMarkerQuerySelector: (path: string, opt
      * Do not look for match as nested field.
      *
      * By default this is enabled to facilitate looking for fields that may be nested inside objects.
+     * This is only a problem when a front-end field is nested more deeply than back-end.
      * For example, field arrays require objects as items, so actual field may be `field.value`.
      * This should be safe, as fields are by definition leaf nodes, so will not have nested fields.
+     * (If this check should need to be more precise in the future, it may be ideal to distinguish between client/server errors or paths.)
      */
     excludeNested?: boolean;
 }) => string;

package/dist/types/exports.d.ts

@@ -1,7 +1,7 @@
 export type { Register } from './register';
 export type { ClientConfig } from './client/config';
 export { default as RhfUtilsClientForZodContextProvider } from './client/zod/context/RhfUtilsClientForZodContextProvider';
-export { default as useRhfUtilsClientForZodContext } from './client/zod/context/useRhfUtilsClientForZodContext';
+export { default as useRhfUtilsClientForZodContext, useRhfUtilsZodForm, } from './client/zod/context/useRhfUtilsClientForZodContext';
 export { default as createRhfUtilsClientForZod } from './client/zod/createRhfUtilsClientForZod';
 export { default as LazyDevTool } from './devtool/LazyDevTool';
 export { default as FlatFieldErrorsContextProvider } from './errors/flat/context/FlatFieldErrorsContextProvider';

package/package.json

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