@paragrav/rhf-utils 0.0.56 → 0.0.58

package/dist/esm/config/index.mjs

@@ -1,14 +1,21 @@
-let o;
-const n = (t) => {
-  o = t;
-}, e = (t) => ({
-  ...o,
-  options: {
-    ...o == null ? void 0 : o.options,
-    ...t
-  }
-});
+let s;
+const t = (e) => {
+  s = e;
+}, l = (e) => {
+  var a;
+  return {
+    ...s,
+    options: {
+      ...s == null ? void 0 : s.options,
+      ...e,
+      classNames: [
+        ...((a = s == null ? void 0 : s.options) == null ? void 0 : a.classNames) ?? [],
+        ...(e == null ? void 0 : e.classNames) ?? []
+      ]
+    }
+  };
+};
 export {
-  e as _getConfig,
-  n as setConfig
+  l as _getConfig,
+  t as setConfig
 };

package/dist/esm/form/useForm.mjs

@@ -1,25 +1,28 @@
-import n from "react";
-import { useForm as p } from "react-hook-form";
-import u from "../submit/useSubmitFormOnChange.mjs";
-import { _getConfig as c } from "../config/index.mjs";
-const f = ({
+import { zodResolver as f } from "../node_modules/@hookform/resolvers/zod/dist/zod.mjs";
+import i from "react";
+import { useForm as u } from "react-hook-form";
+import c from "../submit/useSubmitFormOnChange.mjs";
+import { _getConfig as d } from "../config/index.mjs";
+const a = ({
+  schema: t,
   rhf: m,
   form: o,
-  utils: i
+  utils: p
 }) => {
-  const t = c(o == null ? void 0 : o.options), s = n.useId(), e = p({
-    ...t.rhf,
+  const e = d(o == null ? void 0 : o.options), s = i.useId(), n = u({
+    resolver: t ? f(t) : void 0,
+    ...e.rhf,
     ...m
-  }), r = n.useRef(null);
-  return u(r, { disabled: !t.options.submitOnChange }), {
+  }), r = i.useRef(null);
+  return c(r, { disabled: !e.options.submitOnChange }), {
     id: s,
     ref: r,
-    context: e,
+    context: n,
     providerProps: {
       formId: s,
       formRef: r,
-      rhfForm: e,
-      utils: i
+      rhfForm: n,
+      utils: p
     },
     formProps: {
       formId: s,
@@ -27,7 +30,7 @@ const f = ({
       form: o
     }
   };
-}, P = f;
+}, h = a;
 export {
-  P as default
+  h as default
 };

package/dist/esm/node_modules/@hookform/resolvers/zod/dist/zod.mjs

@@ -0,0 +1,49 @@
+import { appendErrors as v } from "react-hook-form";
+import { validateFieldsNatively as d, toNestErrors as h } from "@hookform/resolvers";
+var m = function(i, u) {
+  for (var o = {}; i.length; ) {
+    var r = i[0], c = r.code, n = r.message, e = r.path.join(".");
+    if (!o[e])
+      if ("unionErrors" in r) {
+        var s = r.unionErrors[0].errors[0];
+        o[e] = { message: s.message, type: s.code };
+      } else
+        o[e] = { message: n, type: c };
+    if ("unionErrors" in r && r.unionErrors.forEach(function(f) {
+      return f.errors.forEach(function(l) {
+        return i.push(l);
+      });
+    }), u) {
+      var t = o[e].types, a = t && t[r.code];
+      o[e] = v(e, u, o, c, a ? [].concat(a, r.message) : r.message);
+    }
+    i.shift();
+  }
+  return o;
+}, E = function(i, u, o) {
+  return o === void 0 && (o = {}), function(r, c, n) {
+    try {
+      return Promise.resolve(function(e, s) {
+        try {
+          var t = Promise.resolve(i[o.mode === "sync" ? "parse" : "parseAsync"](r, u)).then(function(a) {
+            return n.shouldUseNativeValidation && d({}, n), { errors: {}, values: o.raw ? r : a };
+          });
+        } catch (a) {
+          return s(a);
+        }
+        return t && t.then ? t.then(void 0, s) : t;
+      }(0, function(e) {
+        if (function(s) {
+          return s.errors != null;
+        }(e))
+          return { values: {}, errors: h(m(e.errors, !n.shouldUseNativeValidation && n.criteriaMode === "all"), n) };
+        throw e;
+      }));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+};
+export {
+  E as zodResolver
+};

package/dist/types/src/config/index.d.ts

@@ -1,20 +1,36 @@
 import { FormSubmitError } from '../submit/error/FormSubmitError';
-import { UseFormOptions } from '../form/useForm';
-import { FieldValues, UseFormProps, UseFormStateReturn } from 'react-hook-form';
+import { UseFormFieldsProps, UseFormOptions } from '../form/useForm';
+import { UseFormProps } from 'react-hook-form';
 
 type Config = {
     rhf?: Pick<UseFormProps, 'mode' | 'reValidateMode' | 'resetOptions' | 'context' | 'shouldFocusError' | 'shouldUnregister' | 'shouldUseNativeValidation' | 'progressive' | 'criteriaMode' | 'delayError'>;
+    /**
+     * Default global options settings.
+     *
+     * Extend this type to inject custom options/functionality via `Children` component.
+     */
     options?: UseFormOptions;
+    /**
+     * Component injected at the top of the form.
+     *
+     * e.g., block navigation on dirty form.
+     */
+    ChildrenFirst?: React.FC<UseFormFieldsProps>;
+    /**
+     * Component injected at the bottom of the form.
+     *
+     * e.g., root errors list.
+     */
+    ChildrenLast?: React.FC<UseFormFieldsProps>;
     /**
      * Handle non-{@link FormSubmitError} errors. Optionally, return {@link FormSubmitError} to merge into context errors.
      */
     onSubmitError?: (error: unknown) => FormSubmitError | undefined;
-    Prompter?: React.FC<UseFormStateReturn<FieldValues>>;
 };
 export declare const setConfig: (config: Config) => void;
 export declare const _getConfig: (options?: UseFormOptions) => {
     options: {
-        hideRootErrorsList?: boolean | undefined;
+        classNames: string[];
         submitOnChange?: boolean | undefined;
         resetValuesOnSubmitError?: boolean | undefined;
         stopSubmitPropagation?: boolean | undefined;
@@ -26,9 +42,9 @@ export declare const _getConfig: (options?: UseFormOptions) => {
         reValidateMode: "onBlur" | "onChange" | "onSubmit";
         defaultValues: {
             [x: string]: any;
-        } | ((payload?: unknown) => Promise<FieldValues>);
-        values: FieldValues;
-        errors: import('react-hook-form').FieldErrors<FieldValues>;
+        } | ((payload?: unknown) => Promise<import('react-hook-form').FieldValues>);
+        values: import('react-hook-form').FieldValues;
+        errors: import('react-hook-form').FieldErrors<import('react-hook-form').FieldValues>;
         resetOptions: Partial<{
             keepDirtyValues: boolean;
             keepErrors: boolean;
@@ -42,7 +58,7 @@ export declare const _getConfig: (options?: UseFormOptions) => {
             keepIsValid: boolean;
             keepSubmitCount: boolean;
         }> | undefined;
-        resolver: import('react-hook-form').Resolver<FieldValues, any>;
+        resolver: import('react-hook-form').Resolver<import('react-hook-form').FieldValues, any>;
         context: any;
         shouldFocusError: boolean;
         shouldUnregister: boolean;
@@ -51,7 +67,8 @@ export declare const _getConfig: (options?: UseFormOptions) => {
         criteriaMode: import('react-hook-form').CriteriaMode;
         delayError: number;
     }>, "mode" | "reValidateMode" | "resetOptions" | "context" | "shouldFocusError" | "shouldUnregister" | "shouldUseNativeValidation" | "progressive" | "criteriaMode" | "delayError"> | undefined;
+    ChildrenFirst?: import('react').FC<UseFormFieldsProps> | undefined;
+    ChildrenLast?: import('react').FC<UseFormFieldsProps> | undefined;
     onSubmitError?: ((error: unknown) => FormSubmitError | undefined) | undefined;
-    Prompter?: import('react').FC<UseFormStateReturn<FieldValues>> | undefined;
 };
 export {};

package/dist/types/src/exports.d.ts

@@ -15,6 +15,7 @@ export { default as useFormErrorsEffect } from './errors/useFormErrorsEffect';
 export { default as useFormErrorsIfAny } from './errors/useFormErrorsIfAny';
 export { default as useFormErrorsMemo } from './errors/useFormErrorsMemo';
 export { default as useFormRequestSubmit } from './errors/useFormRequestSubmit';
+export type { UseFormFieldsProps, UseFormOptions } from './form/useForm';
 export { default as useForm } from './form/useForm';
 export { default as FormUtilsContextProvider } from './form/context/utils/FormUtilsContextProvider';
 export { default as useFormUtilsContext } from './form/context/utils/useFormUtilsContext';

package/dist/types/src/form/FormWithProviders.d.ts

@@ -1,5 +1,6 @@
 import { UseFormProps } from './useForm';
 import { z } from 'zod';
+import { FieldValues } from 'react-hook-form';
 
 /**
  * Form providers (with utils) with immediate descendent {@link Form}.
@@ -8,5 +9,5 @@ import { z } from 'zod';
  * Use {@link useForm} if you need to specific nesting hierarchy.
  * (e.g., wrapping `<tr>` with provider and nesting `<form>` within `<td>` to appease HTML rules.)
  */
-declare function FormWithProviders<TSchema extends z.SomeZodObject, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>>({ children, ...props }: React.PropsWithChildren<UseFormProps<TSchema, TFieldValues, TTransformedValues>>): import("react/jsx-runtime").JSX.Element;
+declare function FormWithProviders<TSchema extends z.ZodObject<FieldValues>, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>>({ children, ...props }: React.PropsWithChildren<UseFormProps<TSchema, TFieldValues, TTransformedValues>>): import("react/jsx-runtime").JSX.Element;
 export default FormWithProviders;

package/dist/types/src/form/_Form.d.ts

@@ -1,10 +1,11 @@
 import { UseFormProps } from './useForm';
 import { z } from 'zod';
+import { FieldValues } from 'react-hook-form';
 import { default as React } from 'react';
 
-export type _FormProps<TSchema extends z.SomeZodObject, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>> = React.PropsWithChildren<Pick<UseFormProps<TSchema, TFieldValues, TTransformedValues>, 'form'> & {
+export type _FormProps<TSchema extends z.ZodObject<FieldValues>, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>> = React.PropsWithChildren<Pick<UseFormProps<TSchema, TFieldValues, TTransformedValues>, 'form'> & {
     formId: string;
     formRef: React.RefObject<HTMLFormElement>;
 }>;
-declare function _Form<TSchema extends z.SomeZodObject, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>>({ formId, formRef, form, children, }: _FormProps<TSchema, TFieldValues, TTransformedValues>): import("react/jsx-runtime").JSX.Element;
+declare function _Form<TSchema extends z.ZodObject<FieldValues>, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>>({ formId, formRef, form, children, }: _FormProps<TSchema, TFieldValues, TTransformedValues>): import("react/jsx-runtime").JSX.Element;
 export default _Form;

package/dist/types/src/form/_FormProviders.d.ts

@@ -1,12 +1,12 @@
 import { FormUtilsContextProviderProps } from './context/utils/FormUtilsContextProvider';
 import { z } from 'zod';
-import { UseFormReturn } from 'react-hook-form';
+import { FieldValues, UseFormReturn } from 'react-hook-form';
 
-export type _FormProvidersProps<TSchema extends z.SomeZodObject, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>> = React.PropsWithChildren<{
+export type _FormProvidersProps<TSchema extends z.ZodObject<FieldValues>, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>> = React.PropsWithChildren<{
     formId: string;
     formRef: React.RefObject<HTMLFormElement>;
     rhfForm: UseFormReturn<TFieldValues, unknown, TTransformedValues>;
     utils?: FormUtilsContextProviderProps;
 }>;
-declare function _FormProviders<TSchema extends z.SomeZodObject, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>>({ formId, formRef, rhfForm, utils, children, }: _FormProvidersProps<TSchema, TFieldValues, TTransformedValues>): import("react/jsx-runtime").JSX.Element;
+declare function _FormProviders<TSchema extends z.ZodObject<FieldValues>, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>>({ formId, formRef, rhfForm, utils, children, }: _FormProvidersProps<TSchema, TFieldValues, TTransformedValues>): import("react/jsx-runtime").JSX.Element;
 export default _FormProviders;

package/dist/types/src/form/useForm.d.ts

@@ -2,33 +2,35 @@ import { FormUtilsContextProviderProps } from './context/utils/FormUtilsContextP
 import { _FormProvidersProps } from './_FormProviders';
 import { _FormProps } from './_Form';
 import { z } from 'zod';
-import { SubmitErrorHandler, UseFormProps as RhfUseFormProps, UseFormReturn } from 'react-hook-form';
+import { FieldValues, SubmitErrorHandler, UseFormProps as RhfUseFormProps, UseFormReturn } from 'react-hook-form';
 import { default as React } from 'react';
 import { DevtoolUIProps } from '@hookform/devtools/dist/devToolUI';
 
 export type UseFormOptions = {
-    /**  */
-    hideRootErrorsList?: boolean;
+    /** Control visibility of certain items via your own classes and styles. */
+    classNames?: string[];
     /** Request submit via listener on form change. */
     submitOnChange?: boolean;
     /** Reset form values if submit throw errors. Use case: optimistic UI toggle form that submits on each change */
     resetValuesOnSubmitError?: boolean;
+    /** Stop propagation of submit event. Useful for portals. */
     stopSubmitPropagation?: boolean;
+    /** Control dev tool options. */
     devTool?: DevtoolUIProps | 'disabled';
 };
-export type UseFormFieldProps<TSchema extends z.SomeZodObject, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>> = {
+export type UseFormFieldsProps<TFieldValues extends FieldValues = FieldValues, TTransformedValues extends FieldValues = FieldValues> = {
     formId: string;
     formRef: React.RefObject<HTMLFormElement>;
     ctx: UseFormReturn<TFieldValues, unknown, TTransformedValues>;
     options?: UseFormOptions;
 };
-export type UseFormProps<TSchema extends z.SomeZodObject, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>> = {
+export type UseFormProps<TSchema extends z.ZodObject<FieldValues>, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>> = {
     schema?: TSchema;
     /** {@link RhfUseFormProps} props for RHF's {@link useRhfForm}. */
     rhf?: RhfUseFormProps<TFieldValues>;
     /** {@link FormProps} props for Form. */
     form?: {
-        Fields?: React.FC<UseFormFieldProps<TSchema, TFieldValues, TTransformedValues>>;
+        Fields?: React.FC<UseFormFieldsProps<TFieldValues, TTransformedValues>>;
         onSubmit?: (values: TTransformedValues, context: UseFormReturn<TFieldValues, unknown, TTransformedValues>, event: React.BaseSyntheticEvent<SubmitEvent>) => unknown | Promise<unknown>;
         /** Submit error handler. (Only for errors not of instance `FormError`, which are handled internally.) */
         onSubmitError?: (error: unknown, context: UseFormReturn<TFieldValues, unknown, TTransformedValues>, event: React.BaseSyntheticEvent<SubmitEvent>) => void;
@@ -48,7 +50,11 @@ export type UseFormProps<TSchema extends z.SomeZodObject, TFieldValues extends z
  * see https://caniuse.com/?search=form%20attribute
  * @returns Form provider and form.
  */
-declare const useForm: <TSchema extends z.SomeZodObject, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>>({ rhf, form, utils, }: UseFormProps<TSchema, TFieldValues, TTransformedValues>) => {
+declare const useForm: <TSchema extends z.ZodObject<FieldValues, z.UnknownKeysParam, z.ZodTypeAny, {
+    [x: string]: any;
+}, {
+    [x: string]: any;
+}>, TFieldValues extends z.input<TSchema>, TTransformedValues extends z.output<TSchema>>({ schema, rhf, form, utils, }: UseFormProps<TSchema, TFieldValues, TTransformedValues>) => {
     readonly id: string;
     readonly ref: React.RefObject<HTMLFormElement>;
     readonly context: UseFormReturn<TFieldValues, unknown, TTransformedValues>;

package/package.json

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