@paragrav/rhf-utils 0.0.89 → 0.0.91

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,60 +1,50 @@
-import { jsx as d } from "react/jsx-runtime";
-import f from "../form/FormWithProviders.mjs";
+import { jsx as a } from "react/jsx-runtime";
+import d from "../form/FormWithProviders.mjs";
 import l from "../form/useForm.mjs";
-const p = (s) => (r) => {
-  const n = a(
-    s,
+const v = (t) => (r) => {
+  const i = u(
+    t,
     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
-        })
-      );
-    },
-    FormWithProviders: h(s, r)
+    useForm: (e, o) => l(
+      i(e, o)
+    ),
+    FormWithProviders: F(t, r)
   };
-}, h = (s, r) => function({
-  schema: o,
-  children: t,
-  ...e
+}, F = (t, r) => function({
+  schema: e,
+  children: o,
+  ...s
 }) {
-  const i = a(s, r);
-  return /* @__PURE__ */ d(
-    f,
+  const n = u(t, r);
+  return /* @__PURE__ */ a(
+    d,
     {
-      ...i(o, e),
-      children: t
+      ...n(e, s),
+      children: o
     }
   );
-}, a = (s, r) => (n, o) => {
-  var t, e, i, u, m;
+}, u = (t, r) => function(e, o) {
+  var s, n, m, f, h;
   return {
     ...o,
     config: r,
     rhf: {
-      ...(t = r.defaultOptions) == null ? void 0 : t.rhf,
+      ...(s = r.defaultOptions) == null ? void 0 : s.rhf,
       ...o.rhf,
-      resolver: s(n)
+      resolver: t(e)
     },
     options: {
-      ...(e = r.defaultOptions) == null ? void 0 : e.form,
+      ...(n = r.defaultOptions) == null ? void 0 : n.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) ?? []
+        ...((f = (m = r.defaultOptions) == null ? void 0 : m.form) == null ? void 0 : f.classNames) ?? [],
+        ...((h = o.options) == null ? void 0 : h.classNames) ?? []
       ]
     }
   };
 };
 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 o from "../../../utils/createContext.mjs";
+const [, t, s] = o(), r = t, n = () => t().useForm;
 export {
-  n as _RhfUtilsClientForZodContextProvider,
-  r as default
+  s as _RhfUtilsClientForZodContextProvider,
+  r as default,
+  n as useRhfUtilsForm
 };

package/dist/esm/errors/nonfield/FormNonFieldErrorMarker.utils.mjs

@@ -1,6 +1,23 @@
-import o from "./FormNonFieldErrorMarkerHtmlAttribute.mjs";
-const t = (r) => `[role="alert"][${o}="${r}"]`, i = (r, e) => !!e.querySelector(t(r));
+import l from "./FormNonFieldErrorMarkerHtmlAttribute.mjs";
+const m = (r, e) => (
+  // list of selector variants
+  [
+    // equals
+    // e.g., attr="path"
+    ["", ""],
+    [
+      // @see https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors#attrvalue_4
+      "^",
+      // only match nested (avoid match 'field' with 'field1`)
+      "."
+    ]
+  ].map(
+    ([o, t]) => n(
+      l + o,
+      r + t
+    )
+  ).join(", ")
+), n = (r, e) => `[role="alert"][${r}="${e}"]`;
 export {
-  t as getFormNonFieldErrorMarkerQuerySelector,
-  i as isNonFieldErrorMarkerInDOM
+  m as getFormNonFieldErrorMarkerQuerySelector
 };

package/dist/esm/errors/nonfield/isNonFieldErrorMarkerInDOM.mjs

@@ -0,0 +1,5 @@
+import { getFormNonFieldErrorMarkerQuerySelector as o } from "./FormNonFieldErrorMarker.utils.mjs";
+const i = (r, e) => !!e.querySelector(o(r));
+export {
+  i as isNonFieldErrorMarkerInDOM
+};

package/dist/esm/errors/orphan/isOrphanFormError.mjs

@@ -1,10 +1,10 @@
 import m from "../isFieldErrorRefd.mjs";
-import { isNonFieldErrorMarkerInDOM as t } from "../nonfield/FormNonFieldErrorMarker.utils.mjs";
+import { isNonFieldErrorMarkerInDOM as t } from "../nonfield/isNonFieldErrorMarkerInDOM.mjs";
 import e from "../root/isFormErrorPathRoot.mjs";
 const d = (r, o, i) => (
   // not root path
   !e(r) && // non-field
-  !m(o) && // does not have marker
+  !m(o) && // not marked in DOM
   !t(r, i)
 );
 export {

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, useRhfUtilsForm 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 L } from "./errors/useFormErrorsEffect.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,
+  L as useFormErrorsEffect,
+  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 useRhfUtilsForm,
+  B as useRootFormFieldErrorsMemo,
+  Br as useSubmitFormOnChange
 };

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

@@ -13,11 +13,7 @@ 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: <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

@@ -4,3 +4,4 @@ export type RhfUtilsClientForZodContext = ReturnType<typeof createRhfUtilsClient
 declare const useRhfUtilsClientForZodContext: () => import('../..').CreateRhfUtilsClient<import('../createRhfUtilsClientForZod').ZodTypeFieldValues, "_input", "_output">, _RhfUtilsClientForZodContextProvider: import('react').Provider<import('../..').CreateRhfUtilsClient<import('../createRhfUtilsClientForZod').ZodTypeFieldValues, "_input", "_output"> | undefined>;
 export default useRhfUtilsClientForZodContext;
 export { _RhfUtilsClientForZodContextProvider };
+export declare const useRhfUtilsForm: () => <TSchema extends import('../createRhfUtilsClientForZod').ZodTypeFieldValues, TSchemaInput extends import('../../../exports').SafeFieldValues = TSchema["_input"], TSchemaOutput extends import('../../../exports').SafeFieldValues = TSchema["_output"], UseFormPropsForm extends import('../../../form/useForm').UseFormProps<TSchemaInput, TSchemaOutput> = import('../../../form/useForm').UseFormProps<TSchemaInput, TSchemaOutput>>(schema: TSchema, form: Omit<UseFormPropsForm, "config">) => import('../../../form/useForm').UseFormReturn<TSchemaInput, TSchemaOutput>;

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

@@ -1,2 +1,18 @@
-export declare const getFormNonFieldErrorMarkerQuerySelector: (path: string) => string;
-export declare const isNonFieldErrorMarkerInDOM: (path: string, parentElement: Pick<HTMLElement, 'querySelector'>) => boolean;
+/**
+ * Returns query selector for matching non-field error marker.
+ * By default includes nested field matching. (See `options.excludeNested`.)
+ *
+ * @returns One or more selectors in a comma-separated list.
+ */
+export declare const getFormNonFieldErrorMarkerQuerySelector: (path: string, options?: {
+    /**
+     * 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/errors/nonfield/isNonFieldErrorMarkerInDOM.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Determine if a non-field error marker is in the DOM.
+ * Note: this will also look for nested markers to accommodate field arrays
+ */
+export declare const isNonFieldErrorMarkerInDOM: (path: string, parentElement: Pick<HTMLElement, 'querySelector'>) => boolean;

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, useRhfUtilsForm, } 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.89",
+  "version": "0.0.91",
   "description": "Integration utilities for react-hook-form.",
   "type": "module",
   "sideEffects": false,