@paragrav/rhf-utils 0.0.85 → 0.0.87

package/dist/esm/form/Form.mjs

@@ -1,81 +1,84 @@
-import { jsxs as T, jsx as u } from "react/jsx-runtime";
+import { jsxs as S, jsx as C } from "react/jsx-runtime";
 import "react";
-import { useFormContext as _ } from "react-hook-form";
+import { useFormContext as T } from "react-hook-form";
 import v from "../devtool/LazyDevTool.mjs";
 import { FormSubmitError as E } from "../submit/error/FormSubmitError.mjs";
 import V from "../submit/error/setCtxErrorsByFormSubmitError.mjs";
-import w from "./_FormBase.mjs";
-function H({
+import w from "./_Controller.mjs";
+import z from "./_FormBase.mjs";
+function J({
   formId: B,
-  formRef: x,
+  formRef: u,
   //
   onSubmit: s,
   onSubmitError: h,
   onSubmitInvalid: F,
-  Fields: C,
+  Fields: x,
   //
   form: d,
-  options: a,
-  config: t,
+  options: r,
+  config: a,
   //
-  children: j
+  children: _
 }) {
-  const l = _(), N = async (r) => {
-    a != null && a.stopSubmitPropagation && r.stopPropagation();
+  const l = T(), j = async (t) => {
+    r != null && r.stopSubmitPropagation && t.stopPropagation();
     try {
-      await l.handleSubmit(P, F)(r);
+      await l.handleSubmit(N, F)(t);
     } catch (e) {
-      S(e, r);
+      P(e, t);
     }
-  }, P = (r, e) => s == null ? void 0 : s(
-    r,
+  }, N = (t, e) => s == null ? void 0 : s(
+    t,
     l,
     e
-  ), S = (r, e) => {
+  ), P = (t, e) => {
     var b;
-    const m = r instanceof E ? (
+    const m = t instanceof E ? (
       // consumer can manually throw FormSubmitError (e.g., manual validation)
-      r
+      t
     ) : (
       // if error is not FormSubmitError, consumer can provide global handler
-      (b = t == null ? void 0 : t.onSubmitError) == null ? void 0 : b.call(t, r)
+      (b = a == null ? void 0 : a.onSubmitError) == null ? void 0 : b.call(a, t)
     );
     m && V(l, m), h == null || h(
-      r,
+      t,
       l,
       e
     );
-  }, c = {
+  }, y = {
     formId: B,
-    formRef: x,
+    formRef: u,
     ctx: l,
-    options: a
-  }, y = (r) => {
+    options: r,
+    Controller: w
+  }, c = (t) => {
     var m;
-    const e = (m = t == null ? void 0 : t.Children) == null ? void 0 : m[r];
-    return e && /* @__PURE__ */ u(e, { ...c });
+    const e = (m = a == null ? void 0 : a.Children) == null ? void 0 : m[t];
+    return e && /* @__PURE__ */ C(e, { ...y });
   };
-  return /* @__PURE__ */ T(
-    w,
+  return /* @__PURE__ */ S(
+    z,
     {
       noValidate: !0,
       style: {
         position: "relative"
       },
+      config: a,
+      formRef: u,
       ...d,
-      className: [a == null ? void 0 : a.classNames, d == null ? void 0 : d.className].filter(Boolean).join(" "),
-      onSubmit: N,
-      formRef: x,
+      className: [r == null ? void 0 : r.classNames, d == null ? void 0 : d.className].filter(Boolean).join(" "),
+      onSubmit: j,
       children: [
-        y("top"),
-        (a == null ? void 0 : a.devTool) !== "disabled" && /* @__PURE__ */ u(v, { placement: "top-right", ...a == null ? void 0 : a.devTool }),
-        C && /* @__PURE__ */ u(C, { ...c }),
-        j,
-        y("bottom")
+        c("top"),
+        (r == null ? void 0 : r.devTool) !== "disabled" && /* @__PURE__ */ C(v, { placement: "top-right", ...r == null ? void 0 : r.devTool }),
+        x && /* @__PURE__ */ C(x, { ...y }),
+        _,
+        c("bottom")
       ]
     }
   );
 }
 export {
-  H as default
+  J as default
 };

package/dist/esm/form/_Controller.mjs

@@ -0,0 +1,9 @@
+import { jsx as t } from "react/jsx-runtime";
+import { useFormContext as n, Controller as e } from "react-hook-form";
+function f(o) {
+  const { control: r } = n();
+  return /* @__PURE__ */ t(e, { control: r, ...o });
+}
+export {
+  f as default
+};

package/dist/esm/form/_FormBase.mjs

@@ -1,14 +1,18 @@
-import { jsxs as m, jsx as n } from "react/jsx-runtime";
+import { jsxs as p, jsx as s } from "react/jsx-runtime";
 import "react";
-const f = ({
-  formRef: e,
+const l = ({
+  config: e,
+  formRef: t,
   antiCsrfToken: r,
   children: o,
-  ...t
-}) => /* @__PURE__ */ m("form", { role: "form", ...t, ref: e, children: [
-  r && /* @__PURE__ */ n("input", { type: "hidden", name: "anticsrftoken", value: r }),
-  o
-] });
+  ...m
+}) => {
+  const n = (e == null ? void 0 : e.FormComponent) ?? "form";
+  return /* @__PURE__ */ p(n, { role: "form", ...m, ref: t, children: [
+    r && /* @__PURE__ */ s("input", { type: "hidden", name: "anticsrftoken", value: r }),
+    o
+  ] });
+};
 export {
-  f as default
+  l as default
 };

package/dist/esm/form/useForm.mjs

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

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

@@ -34,4 +34,5 @@ export type ClientConfig = {
      * Handle non-{@link FormSubmitError} errors. Optionally, return {@link FormSubmitError} to merge into context errors.
      */
     onSubmitError?: (error: unknown) => FormSubmitError | undefined;
+    FormComponent?: React.FC<React.PropsWithChildren<React.HTMLAttributes<HTMLFormElement>>>;
 };

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

@@ -17,7 +17,7 @@ export type CreateRhfUtilsClient<TObjectSchema extends ObjectSchema<TObjectSchem
         NonNullable<UseFormPropsForm['onSubmit']>,
         UseFormPropsForm['onSubmitError'],
         UseFormPropsForm['onSubmitInvalid']
-    ], defaultValues: UseFormPropsForm['defaultValues'], Fields: UseFormPropsForm['Fields'], props: UseFormProps<TSchemaInput, TSchemaOutput>) => UseFormReturn<TSchemaInput, TSchemaOutput>;
+    ], defaultValues: UseFormPropsForm['defaultValues'], Fields: UseFormPropsForm['Fields'], props?: UseFormProps<TSchemaInput, TSchemaOutput>) => 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/form/_Controller.d.ts

@@ -0,0 +1,6 @@
+import { SafeFieldValues } from './SafeFieldValues';
+import { ControllerProps, FieldPath } from 'react-hook-form';
+
+export type _ControllerProps<TFieldValues extends SafeFieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<ControllerProps<TFieldValues, TName>, 'control'>;
+declare function _Controller<TFieldValues extends SafeFieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(props: _ControllerProps<TFieldValues, TName>): import("react/jsx-runtime").JSX.Element;
+export default _Controller;

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

@@ -1,8 +1,10 @@
+import { ClientConfig } from '../client/config';
 import { default as React } from 'react';
 
-export type FormBaseProps = React.PropsWithoutRef<JSX.IntrinsicElements['form']> & {
+export type FormBaseProps = React.PropsWithChildren<React.HTMLAttributes<HTMLFormElement>> & {
+    config?: ClientConfig;
     formRef: React.RefObject<HTMLFormElement>;
     antiCsrfToken?: string;
 };
-declare const _FormBase: ({ formRef, antiCsrfToken, children, ...props }: FormBaseProps) => import("react/jsx-runtime").JSX.Element;
+declare const _FormBase: ({ config, formRef, antiCsrfToken, children, ...props }: FormBaseProps) => import("react/jsx-runtime").JSX.Element;
 export default _FormBase;

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

@@ -2,6 +2,8 @@ import { UseFormOptions } from './useFormOptions';
 import { SafeFieldValues } from './SafeFieldValues';
 import { FormProvidersProps } from './FormProviders';
 import { FormProps } from './Form';
+import { default as _Controller } from './_Controller';
+import { FormSubmitError } from '../submit/error/FormSubmitError';
 import { ClientConfig } from '../client/config';
 import { SubmitErrorHandler, UseFormProps as RhfUseFormProps, UseFormReturn as RhfUseFormReturn } from 'react-hook-form';
 import { default as React } from 'react';
@@ -11,6 +13,7 @@ export type UseFormFieldsProps<TFieldValues extends SafeFieldValues = SafeFieldV
     formRef: React.RefObject<HTMLFormElement>;
     ctx: RhfUseFormReturn<TFieldValues, unknown, TTransformedValues>;
     options?: UseFormOptions;
+    Controller: typeof _Controller<TFieldValues>;
 };
 export type UseFormProps<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues> = {
     onSubmit?: (values: TTransformedValues, context: RhfUseFormReturn<TFieldValues, unknown, TTransformedValues>, event: React.BaseSyntheticEvent<SubmitEvent>) => unknown | Promise<unknown>;
@@ -27,6 +30,14 @@ export type UseFormProps<TFieldValues extends SafeFieldValues, TTransformedValue
     form?: React.PropsWithoutRef<JSX.IntrinsicElements['form']>;
     options?: UseFormOptions;
 };
+export type UseFormReturn<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues> = {
+    id: string;
+    ref: React.RefObject<HTMLFormElement>;
+    context: RhfUseFormReturn<TFieldValues, unknown, TTransformedValues>;
+    providerProps: FormProvidersProps<TFieldValues, TTransformedValues>;
+    formProps: FormProps<TFieldValues, TTransformedValues>;
+    FormSubmitError: typeof FormSubmitError<TFieldValues>;
+};
 /**
  * Core Rhf Form hook. Use `Form` in `index.ts` for most cases.
  * Use this if you need to separate form components.
@@ -36,30 +47,6 @@ export type UseFormProps<TFieldValues extends SafeFieldValues, TTransformedValue
  * see https://caniuse.com/?search=form%20attribute
  * @returns Form provider and form.
  */
-declare const useForm: <TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues>({ onSubmit, onSubmitError, onSubmitInvalid, defaultValues, Fields, config, rhf, form, options, }: UseFormProps<TFieldValues, TTransformedValues>) => {
-    readonly id: string;
-    readonly ref: React.RefObject<HTMLFormElement>;
-    readonly context: RhfUseFormReturn<TFieldValues, unknown, TTransformedValues>;
-    readonly providerProps: FormProvidersProps<TFieldValues, TTransformedValues>;
-    readonly formProps: FormProps<TFieldValues, TTransformedValues>;
-    readonly SubmitError: {
-        new (errors: Record<`root.${string}` | import('react-hook-form').Path<TFieldValues>, {
-            type?: string | undefined;
-            message: string;
-        }>, message?: string | undefined): {
-            errors: Record<`root.${string}` | import('react-hook-form').Path<TFieldValues>, {
-                type?: string | undefined;
-                message: string;
-            }>;
-            name: string;
-            message: string;
-            stack?: string | undefined;
-        };
-        captureStackTrace(targetObject: object, constructorOpt?: Function | undefined): void;
-        prepareStackTrace?: ((err: Error, stackTraces: NodeJS.CallSite[]) => any) | undefined;
-        stackTraceLimit: number;
-    };
-};
+declare const useForm: <TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues>({ onSubmit, onSubmitError, onSubmitInvalid, defaultValues, Fields, config, rhf, form, options, }: UseFormProps<TFieldValues, TTransformedValues>) => UseFormReturn<TFieldValues, TTransformedValues>;
 export default useForm;
 export type UseForm<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues> = typeof useForm<TFieldValues, TTransformedValues>;
-export type UseFormReturn<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues> = ReturnType<UseForm<TFieldValues, TTransformedValues>>;

package/package.json

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