@paragrav/rhf-utils 0.0.112 → 0.0.113
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +16 -10
- package/dist/esm/src/client/zod/context/RhfUtilsZodForm.mjs +12 -0
- package/dist/esm/src/client/zod/context/useRhfUtilsClientForZodContext.mjs +3 -3
- package/dist/esm/src/devtool/LazyDevTool.mjs +4 -4
- package/dist/esm/src/errors/flat/FlatFieldErrorsList.mjs +8 -8
- package/dist/esm/src/errors/flat/getFlatFieldErrors.mjs +12 -9
- package/dist/esm/src/errors/message/FormErrorMessage.mjs +4 -4
- package/dist/esm/src/errors/nonfield/FormNonFieldErrorMarkerHtmlAttribute.mjs +2 -2
- package/dist/esm/src/exports.mjs +44 -66
- package/dist/esm/src/form/Form.mjs +21 -20
- package/dist/esm/src/form/RhfUtilsFormProviders.mjs +1 -1
- package/dist/esm/src/form/context/utils/RhfUtilsContextProvider.mjs +27 -0
- package/dist/esm/src/form/context/utils/useRhfUtilsContext.mjs +6 -0
- package/dist/esm/src/form/context/utils/useRhfUtilsContextRequestSubmit.mjs +9 -0
- package/dist/esm/src/form/useRhfUtilsForm.mjs +21 -21
- package/dist/esm/src/submit/useFormOnSubmitSuccessful.mjs +8 -8
- package/dist/esm/src/submit/useSubmitFormOnChange.mjs +1 -1
- package/dist/esm/src/utils/isEmptyObject.mjs +2 -2
- package/dist/types/client/zod/RhfUtilsUseFormChildrenZodProps.d.ts +2 -1
- package/dist/types/client/zod/consts.d.ts +4 -0
- package/dist/types/client/zod/context/RhfUtilsZodForm.d.ts +9 -0
- package/dist/types/client/zod/context/useRhfUtilsZodForm.d.ts +2 -1
- package/dist/types/errors/flat/getFlatFieldErrors.d.ts +3 -2
- package/dist/types/errors/orphan/useOrphanFormErrorsMemo.d.ts +5 -0
- package/dist/types/exports.d.ts +4 -15
- package/dist/types/form/UseRhfUtilsFormChildrenProps.d.ts +7 -0
- package/dist/types/form/UseRhfUtilsFormReturn.d.ts +5 -0
- package/dist/types/form/context/utils/RhfUtilsContextProvider.d.ts +11 -0
- package/dist/types/form/context/utils/useRhfUtilsContext.d.ts +14 -0
- package/dist/types/form/context/utils/useRhfUtilsContextRequestSubmit.d.ts +5 -0
- package/dist/types/form/utils/getSubmitterButtonData.d.ts +1 -1
- package/dist/types/form/utils/useFormRequestSubmit.d.ts +6 -0
- package/package.json +1 -1
- package/dist/esm/src/client/zod/RhfUtilsZodForm.mjs +0 -12
- package/dist/esm/src/errors/flat/useFormFlatFieldErrorsMemo.mjs +0 -6
- package/dist/esm/src/errors/orphan/getOrphansFromFieldErrors.mjs +0 -6
- package/dist/esm/src/errors/orphan/useFormHasOnlyOrphanFieldErrorsMemo.mjs +0 -10
- package/dist/esm/src/errors/orphan/useOrphanFormErrorsMemo.mjs +0 -14
- package/dist/esm/src/errors/root/getRootsFromFieldErrors.mjs +0 -6
- package/dist/esm/src/errors/root/useRootFormFieldErrorsMemo.mjs +0 -6
- package/dist/esm/src/errors/useFormErrorsEffect.mjs +0 -11
- package/dist/esm/src/errors/useFormErrorsIfAny.mjs +0 -9
- package/dist/esm/src/form/context/utils/FormUtilsContextProvider.mjs +0 -35
- package/dist/esm/src/form/context/utils/useFormUtilsContext.mjs +0 -6
- /package/dist/esm/src/{errors → form/utils}/useFormRequestSubmit.mjs +0 -0
package/README.md
CHANGED
|
@@ -49,11 +49,12 @@ export const rhfUtilsClientConfig: RhfUtilsClientConfig = {
|
|
|
49
49
|
top: (
|
|
50
50
|
// UseRhfUtilsFormChildrenProps
|
|
51
51
|
{
|
|
52
|
-
formId, //
|
|
53
|
-
formRef, //
|
|
54
|
-
context, //
|
|
55
|
-
options, //
|
|
56
|
-
Controller, //
|
|
52
|
+
formId, // unique id string
|
|
53
|
+
formRef, // ref
|
|
54
|
+
context, // rhf UseFormReturn
|
|
55
|
+
options, // RhfUtilsFormOptions
|
|
56
|
+
Controller, // strongly-typed controller
|
|
57
|
+
FormSubmitError, // strongly-typed error class
|
|
57
58
|
},
|
|
58
59
|
) => {
|
|
59
60
|
// navigation blocker (using custom option)
|
|
@@ -120,11 +121,12 @@ Currently, only `zod` is supported.
|
|
|
120
121
|
// fields
|
|
121
122
|
Children={({
|
|
122
123
|
// UseRhfUtilsFormChildrenProps
|
|
123
|
-
formId, //
|
|
124
|
-
formRef, //
|
|
125
|
-
context, //
|
|
126
|
-
options, //
|
|
127
|
-
Controller, //
|
|
124
|
+
formId, // unique id string
|
|
125
|
+
formRef, // ref
|
|
126
|
+
context, // rhf UseFormReturn
|
|
127
|
+
options, // RhfUtilsFormOptions
|
|
128
|
+
Controller, // strongly-typed controller
|
|
129
|
+
FormSubmitError, // strongly-typed error class
|
|
128
130
|
}) => (
|
|
129
131
|
<>
|
|
130
132
|
<Controller
|
|
@@ -184,6 +186,10 @@ type RhfUtilsFormOptions = {
|
|
|
184
186
|
};
|
|
185
187
|
```
|
|
186
188
|
|
|
189
|
+
If you need access to options deeper in component structure, use `useRhfUtilsContext` to receive `RhfUtilsContext` object, which includes `formId`, `formRef`, and `options` settings.
|
|
190
|
+
|
|
191
|
+
Use `useRhfUtilsContextRequestSubmit` to get `requestSubmit` fn for current form ref in context. This is useful when you need to trigger form submission programatically.
|
|
192
|
+
|
|
187
193
|
## Extend `RhfUtilsFormOptions`
|
|
188
194
|
|
|
189
195
|
Extend `RhfUtilsFormOptions` with custom options, which get passed to `Children` component in `options` prop.
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import e from "./useRhfUtilsClientForZodContext.mjs";
|
|
3
|
+
function m({
|
|
4
|
+
schema: o,
|
|
5
|
+
...t
|
|
6
|
+
}) {
|
|
7
|
+
const { FormWithProviders: r } = e();
|
|
8
|
+
return /* @__PURE__ */ i(r, { schema: o, ...t });
|
|
9
|
+
}
|
|
10
|
+
export {
|
|
11
|
+
m as default
|
|
12
|
+
};
|
|
@@ -5,12 +5,12 @@ const a = e.lazy(
|
|
|
5
5
|
() => import("@hookform/devtools").then((o) => ({
|
|
6
6
|
default: o.DevTool
|
|
7
7
|
}))
|
|
8
|
-
),
|
|
8
|
+
), u = ({ isDevelopment: o, props: r }) => {
|
|
9
9
|
if (!o)
|
|
10
10
|
return null;
|
|
11
|
-
const { control:
|
|
12
|
-
return /* @__PURE__ */ t(e.Suspense, { fallback: null, children: /* @__PURE__ */ t(a, { control:
|
|
13
|
-
}
|
|
11
|
+
const { control: l } = n();
|
|
12
|
+
return /* @__PURE__ */ t(e.Suspense, { fallback: null, children: /* @__PURE__ */ t(a, { control: l, ...r }) });
|
|
13
|
+
};
|
|
14
14
|
export {
|
|
15
15
|
u as default
|
|
16
16
|
};
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
2
2
|
import l from "../../utils/isEmptyObject.mjs";
|
|
3
|
-
const
|
|
4
|
-
if (
|
|
5
|
-
return /* @__PURE__ */
|
|
3
|
+
const o = ({ errors: e }) => {
|
|
4
|
+
if (e && !l(e))
|
|
5
|
+
return /* @__PURE__ */ t("ul", { children: Object.values(e).map((i, r) => /* @__PURE__ */ t(
|
|
6
6
|
"li",
|
|
7
7
|
{
|
|
8
8
|
role: "alert",
|
|
9
9
|
"aria-live": "polite",
|
|
10
|
-
children:
|
|
10
|
+
children: i.message
|
|
11
11
|
},
|
|
12
|
-
|
|
12
|
+
r
|
|
13
13
|
)) });
|
|
14
|
-
}
|
|
14
|
+
};
|
|
15
15
|
export {
|
|
16
|
-
|
|
16
|
+
o as default
|
|
17
17
|
};
|
|
@@ -1,15 +1,18 @@
|
|
|
1
|
-
import { get as
|
|
1
|
+
import { get as c } from "react-hook-form";
|
|
2
2
|
import n from "./flattenFieldErrors.mjs";
|
|
3
|
-
const
|
|
4
|
-
const
|
|
3
|
+
const u = (t) => {
|
|
4
|
+
const s = n(t), a = Object.keys(s);
|
|
5
5
|
return Object.fromEntries(
|
|
6
|
-
|
|
6
|
+
a.reduce(
|
|
7
7
|
(e, o) => {
|
|
8
|
-
const r = o.replace(
|
|
8
|
+
const r = o.replace(
|
|
9
|
+
d,
|
|
10
|
+
""
|
|
11
|
+
);
|
|
9
12
|
if (r === o)
|
|
10
13
|
return e;
|
|
11
|
-
const
|
|
12
|
-
return
|
|
14
|
+
const f = c(t, r, void 0);
|
|
15
|
+
return f && e.push([r, f]), e;
|
|
13
16
|
},
|
|
14
17
|
[]
|
|
15
18
|
// entries
|
|
@@ -17,6 +20,6 @@ const p = (t) => {
|
|
|
17
20
|
);
|
|
18
21
|
}, d = /\.(?:type|message)\b$/;
|
|
19
22
|
export {
|
|
20
|
-
|
|
21
|
-
d as
|
|
23
|
+
u as default,
|
|
24
|
+
d as regexMaybeFieldErrorLeafNodeSuffix
|
|
22
25
|
};
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as o } from "react/jsx-runtime";
|
|
2
2
|
import "react";
|
|
3
|
-
const
|
|
3
|
+
const i = ({ message: r, className: e }) => /* @__PURE__ */ o(
|
|
4
4
|
"p",
|
|
5
5
|
{
|
|
6
6
|
role: "alert",
|
|
7
7
|
"aria-live": "polite",
|
|
8
|
-
className:
|
|
8
|
+
className: e,
|
|
9
9
|
children: r
|
|
10
10
|
}
|
|
11
|
-
)
|
|
11
|
+
);
|
|
12
12
|
export {
|
|
13
13
|
i as default
|
|
14
14
|
};
|
package/dist/esm/src/exports.mjs
CHANGED
|
@@ -1,70 +1,48 @@
|
|
|
1
1
|
import { default as e } from "./client/zod/context/RhfUtilsClientForZodContextProvider.mjs";
|
|
2
|
-
import { default as s } from "./client/zod/context/
|
|
3
|
-
import { default as
|
|
4
|
-
import { default as
|
|
5
|
-
import { default as d } from "./
|
|
6
|
-
import { default as x } from "./errors/
|
|
7
|
-
import { default as
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import { default as
|
|
11
|
-
import { default as
|
|
12
|
-
import { default as T } from "./
|
|
13
|
-
import { default as
|
|
14
|
-
import { default as
|
|
15
|
-
import { default as
|
|
16
|
-
import {
|
|
17
|
-
import {
|
|
18
|
-
import { default as
|
|
19
|
-
import { default as
|
|
20
|
-
import { default as
|
|
21
|
-
import { default as
|
|
22
|
-
import { default as
|
|
23
|
-
import {
|
|
24
|
-
import { default as Q } from "./form/context/group/useFormGroupChildIsMountedTracker.mjs";
|
|
25
|
-
import { default as X } from "./form/context/group/useFormGroupChildIsSubmittingTracker.mjs";
|
|
26
|
-
import { default as _ } from "./form/context/group/useFormGroupChildTracker.mjs";
|
|
27
|
-
import { default as rr } from "./form/context/group/useFormGroupIsAnyBusy.mjs";
|
|
28
|
-
import { default as er } from "./form/context/group/useFormGroupIsChildBusy.mjs";
|
|
29
|
-
import { default as sr } from "./form/context/group/useFormGroupIsParentBusy.mjs";
|
|
30
|
-
import { default as fr } from "./form/context/group/useFormGroupParentTracker.mjs";
|
|
31
|
-
import { default as ur } from "./form/context/group/useFormOrParentIsBusy.mjs";
|
|
32
|
-
import { default as dr } from "./form/utils/getSubmitterButtonData.mjs";
|
|
33
|
-
import { FormSubmitError as xr } from "./submit/error/FormSubmitError.mjs";
|
|
34
|
-
import { default as ir } from "./submit/useFormOnSubmitSuccessful.mjs";
|
|
2
|
+
import { default as s } from "./client/zod/context/RhfUtilsZodForm.mjs";
|
|
3
|
+
import { default as u } from "./client/zod/context/useRhfUtilsZodForm.mjs";
|
|
4
|
+
import { default as m } from "./errors/flat/context/useFlatFieldErrorsContext.mjs";
|
|
5
|
+
import { default as d } from "./errors/message/FormErrorMessageByPath.mjs";
|
|
6
|
+
import { default as x } from "./errors/nonfield/FormNonFieldErrorMarker.mjs";
|
|
7
|
+
import { default as F } from "./errors/root/RootErrorsListFromFlatFieldErrorsContext.mjs";
|
|
8
|
+
import { getOnSubmitTrpcClientErrorHandler as C } from "./errors/trpc/getOnSubmitTrpcClientErrorHandler.mjs";
|
|
9
|
+
import { trpcClientErrorToFormSubmitErrorsSchemaTransformer as E } from "./errors/trpc/trpcClientErrorToFormSubmitErrorsSchemaTransformer.mjs";
|
|
10
|
+
import { default as R } from "./form/context/utils/useRhfUtilsContext.mjs";
|
|
11
|
+
import { default as b } from "./form/context/utils/useRhfUtilsContextRequestSubmit.mjs";
|
|
12
|
+
import { default as T } from "./form/context/group/FormGroupContextProvider.mjs";
|
|
13
|
+
import { default as B } from "./form/context/group/useFormGroupChildIsMountedTracker.mjs";
|
|
14
|
+
import { default as P } from "./form/context/group/useFormGroupChildIsSubmittingTracker.mjs";
|
|
15
|
+
import { default as U } from "./form/context/group/useFormGroupChildTracker.mjs";
|
|
16
|
+
import { default as M } from "./form/context/group/useFormGroupIsAnyBusy.mjs";
|
|
17
|
+
import { default as q } from "./form/context/group/useFormGroupIsChildBusy.mjs";
|
|
18
|
+
import { default as O } from "./form/context/group/useFormGroupIsParentBusy.mjs";
|
|
19
|
+
import { default as D } from "./form/context/group/useFormGroupParentTracker.mjs";
|
|
20
|
+
import { default as L } from "./form/context/group/useFormOrParentIsBusy.mjs";
|
|
21
|
+
import { default as j } from "./form/utils/getSubmitterButtonData.mjs";
|
|
22
|
+
import { default as z } from "./form/utils/useFormRequestSubmit.mjs";
|
|
23
|
+
import { FormSubmitError as K } from "./submit/error/FormSubmitError.mjs";
|
|
35
24
|
export {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
y as FormNonFieldErrorMarker,
|
|
41
|
-
M as FormNonFieldErrorMarkerHtmlAttribute,
|
|
42
|
-
xr as FormSubmitError,
|
|
43
|
-
N as FormWithProviders,
|
|
44
|
-
d as LazyDevTool,
|
|
25
|
+
d as FormErrorMessageByPath,
|
|
26
|
+
T as FormGroupContextProvider,
|
|
27
|
+
x as FormNonFieldErrorMarker,
|
|
28
|
+
K as FormSubmitError,
|
|
45
29
|
e as RhfUtilsClientForZodContextProvider,
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
q as useFormUtilsContext,
|
|
65
|
-
I as useOrphanFormErrorsMemo,
|
|
66
|
-
s as useRhfUtilsClientForZodContext,
|
|
67
|
-
W as useRhfUtilsForm,
|
|
68
|
-
f as useRhfUtilsZodForm,
|
|
69
|
-
B as useRootFormFieldErrorsMemo
|
|
30
|
+
s as RhfUtilsZodForm,
|
|
31
|
+
F as RootErrorsListFromFlatFieldErrorsContext,
|
|
32
|
+
C as getOnSubmitTrpcClientErrorHandler,
|
|
33
|
+
j as getSubmitterButtonData,
|
|
34
|
+
E as trpcClientErrorToFormSubmitErrorsSchemaTransformer,
|
|
35
|
+
m as useFlatFieldErrorsContext,
|
|
36
|
+
B as useFormGroupChildIsMountedTracker,
|
|
37
|
+
P as useFormGroupChildIsSubmittingTracker,
|
|
38
|
+
U as useFormGroupChildTracker,
|
|
39
|
+
M as useFormGroupIsAnyBusy,
|
|
40
|
+
q as useFormGroupIsChildBusy,
|
|
41
|
+
O as useFormGroupIsParentBusy,
|
|
42
|
+
D as useFormGroupParentTracker,
|
|
43
|
+
L as useFormOrParentIsBusy,
|
|
44
|
+
z as useFormRequestSubmit,
|
|
45
|
+
R as useRhfUtilsContext,
|
|
46
|
+
b as useRhfUtilsContextRequestSubmit,
|
|
47
|
+
u as useRhfUtilsZodForm
|
|
70
48
|
};
|
|
@@ -1,40 +1,40 @@
|
|
|
1
|
-
import { jsxs as
|
|
1
|
+
import { jsxs as B, jsx as d } from "react/jsx-runtime";
|
|
2
2
|
import "react";
|
|
3
|
-
import { useFormContext as
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import { FormSubmitError as
|
|
3
|
+
import { useFormContext as T } from "react-hook-form";
|
|
4
|
+
import _ from "../client/config/useRhfUtilsClientConfigContext.mjs";
|
|
5
|
+
import D from "../devtool/LazyDevTool.mjs";
|
|
6
|
+
import { FormSubmitError as x } from "../submit/error/FormSubmitError.mjs";
|
|
7
7
|
import N from "../submit/error/setCtxErrorsByFormSubmitErrors.mjs";
|
|
8
8
|
import P from "./_Controller.mjs";
|
|
9
9
|
import S from "./_FormBase.mjs";
|
|
10
10
|
function A({
|
|
11
|
-
formId:
|
|
11
|
+
formId: y,
|
|
12
12
|
formRef: c,
|
|
13
13
|
//
|
|
14
14
|
onSubmit: p,
|
|
15
15
|
onSubmitError: s,
|
|
16
|
-
onSubmitInvalid:
|
|
16
|
+
onSubmitInvalid: f,
|
|
17
17
|
Children: l,
|
|
18
18
|
//
|
|
19
19
|
form: m,
|
|
20
20
|
utils: o,
|
|
21
21
|
//
|
|
22
|
-
children:
|
|
22
|
+
children: v
|
|
23
23
|
}) {
|
|
24
|
-
const a =
|
|
24
|
+
const a = T(), t = _(), b = async (e) => {
|
|
25
25
|
o != null && o.stopSubmitPropagation && e.stopPropagation();
|
|
26
26
|
try {
|
|
27
|
-
await a.handleSubmit(
|
|
27
|
+
await a.handleSubmit(F, f)(e);
|
|
28
28
|
} catch (r) {
|
|
29
|
-
|
|
29
|
+
j(r, e);
|
|
30
30
|
}
|
|
31
|
-
},
|
|
31
|
+
}, F = (e, r) => p == null ? void 0 : p(
|
|
32
32
|
e,
|
|
33
33
|
a,
|
|
34
34
|
r
|
|
35
|
-
),
|
|
35
|
+
), j = (e, r) => {
|
|
36
36
|
var h;
|
|
37
|
-
const n = e instanceof
|
|
37
|
+
const n = e instanceof x ? (
|
|
38
38
|
// consumer can manually throw FormSubmitError (e.g., manual validation)
|
|
39
39
|
e.errors
|
|
40
40
|
) : (
|
|
@@ -47,17 +47,18 @@ function A({
|
|
|
47
47
|
r
|
|
48
48
|
);
|
|
49
49
|
}, i = {
|
|
50
|
-
formId:
|
|
50
|
+
formId: y,
|
|
51
51
|
formRef: c,
|
|
52
52
|
context: a,
|
|
53
53
|
utils: o,
|
|
54
|
-
Controller: P
|
|
54
|
+
Controller: P,
|
|
55
|
+
FormSubmitError: x
|
|
55
56
|
}, C = (e) => {
|
|
56
57
|
var n;
|
|
57
58
|
const r = (n = t == null ? void 0 : t.Children) == null ? void 0 : n[e];
|
|
58
59
|
return r && /* @__PURE__ */ d(r, { ...i });
|
|
59
60
|
};
|
|
60
|
-
return /* @__PURE__ */
|
|
61
|
+
return /* @__PURE__ */ B(
|
|
61
62
|
S,
|
|
62
63
|
{
|
|
63
64
|
noValidate: !0,
|
|
@@ -68,18 +69,18 @@ function A({
|
|
|
68
69
|
formRef: c,
|
|
69
70
|
...m,
|
|
70
71
|
className: [o == null ? void 0 : o.classNames, m == null ? void 0 : m.className].filter(Boolean).join(" "),
|
|
71
|
-
onSubmit:
|
|
72
|
+
onSubmit: b,
|
|
72
73
|
children: [
|
|
73
74
|
C("top"),
|
|
74
75
|
(o == null ? void 0 : o.devTool) && /* @__PURE__ */ d(
|
|
75
|
-
|
|
76
|
+
D,
|
|
76
77
|
{
|
|
77
78
|
isDevelopment: t == null ? void 0 : t.isDevelopment,
|
|
78
79
|
props: typeof o.devTool == "object" ? o.devTool : void 0
|
|
79
80
|
}
|
|
80
81
|
),
|
|
81
82
|
l && /* @__PURE__ */ d(l, { ...i }),
|
|
82
|
-
|
|
83
|
+
v,
|
|
83
84
|
C("bottom")
|
|
84
85
|
]
|
|
85
86
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as r } from "react/jsx-runtime";
|
|
2
2
|
import { FormProvider as d } from "react-hook-form";
|
|
3
3
|
import n from "../errors/flat/context/FlatFieldErrorsContextProvider.mjs";
|
|
4
|
-
import l from "./context/utils/
|
|
4
|
+
import l from "./context/utils/RhfUtilsContextProvider.mjs";
|
|
5
5
|
function v({
|
|
6
6
|
formId: t,
|
|
7
7
|
formRef: o,
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { jsx as f } from "react/jsx-runtime";
|
|
2
|
+
import t from "../../../errors/flat/useFlatFieldErrorsOutput.mjs";
|
|
3
|
+
import l from "../../../submit/useFormOnSubmitSuccessfulAndReset.mjs";
|
|
4
|
+
import F from "../../../submit/useResetFormOnSubmitError.mjs";
|
|
5
|
+
import O from "../../../submit/useResetFormOnSubmitSuccessful.mjs";
|
|
6
|
+
import b from "../../../submit/useSubmitFormOnChange.mjs";
|
|
7
|
+
import { _RhfUtilsContextProvider as d } from "./useRhfUtilsContext.mjs";
|
|
8
|
+
function P({
|
|
9
|
+
formId: u,
|
|
10
|
+
formRef: e,
|
|
11
|
+
onSubmitSuccessfulAndReset: m,
|
|
12
|
+
options: r,
|
|
13
|
+
children: a
|
|
14
|
+
}) {
|
|
15
|
+
return t(), b(e, {
|
|
16
|
+
disabled: !(r != null && r.submitOnChange)
|
|
17
|
+
}), F({
|
|
18
|
+
disabled: !(r != null && r.resetValuesOnSubmitError)
|
|
19
|
+
}), O(
|
|
20
|
+
(r == null ? void 0 : r.resetFormAfterSubmitSuccessful) || !!m
|
|
21
|
+
), l(() => {
|
|
22
|
+
m == null || m();
|
|
23
|
+
}), /* @__PURE__ */ f(d, { value: { formId: u, formRef: e, options: r }, children: a });
|
|
24
|
+
}
|
|
25
|
+
export {
|
|
26
|
+
P as default
|
|
27
|
+
};
|
|
@@ -1,43 +1,43 @@
|
|
|
1
|
-
import
|
|
1
|
+
import s from "react";
|
|
2
2
|
import { useForm as d } from "react-hook-form";
|
|
3
3
|
import { FormSubmitError as F } from "../submit/error/FormSubmitError.mjs";
|
|
4
|
-
const
|
|
4
|
+
const v = ({
|
|
5
5
|
onSubmit: e,
|
|
6
6
|
onSubmitError: f,
|
|
7
|
-
onSubmitInvalid:
|
|
8
|
-
defaultValues:
|
|
7
|
+
onSubmitInvalid: p,
|
|
8
|
+
defaultValues: n,
|
|
9
9
|
Children: c,
|
|
10
10
|
rhf: i,
|
|
11
11
|
form: u,
|
|
12
|
-
utils:
|
|
12
|
+
utils: t
|
|
13
13
|
}) => {
|
|
14
|
-
const
|
|
14
|
+
const r = s.useId(), m = d({
|
|
15
15
|
...i,
|
|
16
|
-
defaultValues:
|
|
17
|
-
}),
|
|
16
|
+
defaultValues: n
|
|
17
|
+
}), o = s.useRef(null);
|
|
18
18
|
return {
|
|
19
|
-
id:
|
|
20
|
-
ref:
|
|
21
|
-
context:
|
|
19
|
+
id: r,
|
|
20
|
+
ref: o,
|
|
21
|
+
context: m,
|
|
22
22
|
providerProps: {
|
|
23
|
-
formId:
|
|
24
|
-
formRef:
|
|
25
|
-
rhfForm:
|
|
26
|
-
utils:
|
|
23
|
+
formId: r,
|
|
24
|
+
formRef: o,
|
|
25
|
+
rhfForm: m,
|
|
26
|
+
utils: t
|
|
27
27
|
},
|
|
28
28
|
formProps: {
|
|
29
29
|
Children: c,
|
|
30
30
|
onSubmit: e,
|
|
31
31
|
onSubmitError: f,
|
|
32
|
-
onSubmitInvalid:
|
|
33
|
-
formId:
|
|
34
|
-
formRef:
|
|
32
|
+
onSubmitInvalid: p,
|
|
33
|
+
formId: r,
|
|
34
|
+
formRef: o,
|
|
35
35
|
form: u,
|
|
36
|
-
utils:
|
|
36
|
+
utils: t
|
|
37
37
|
},
|
|
38
38
|
FormSubmitError: F
|
|
39
39
|
};
|
|
40
|
-
}
|
|
40
|
+
};
|
|
41
41
|
export {
|
|
42
|
-
|
|
42
|
+
v as default
|
|
43
43
|
};
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { useFormState as
|
|
3
|
-
const
|
|
4
|
-
const { isSubmitSuccessful:
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
}, [
|
|
8
|
-
}
|
|
1
|
+
import s from "react";
|
|
2
|
+
import { useFormState as u } from "react-hook-form";
|
|
3
|
+
const r = (t) => {
|
|
4
|
+
const { isSubmitSuccessful: e } = u();
|
|
5
|
+
s.useEffect(() => {
|
|
6
|
+
t && e && t();
|
|
7
|
+
}, [t, e]);
|
|
8
|
+
};
|
|
9
9
|
export {
|
|
10
10
|
r as default
|
|
11
11
|
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { UseRhfUtilsFormChildrenProps } from '../../form/UseRhfUtilsFormChildrenProps';
|
|
2
|
+
import { zodTypeInput, zodTypeOutput } from './consts';
|
|
2
3
|
import { ZodTypeFieldValues } from './ZodTypeFieldValues';
|
|
3
4
|
|
|
4
|
-
export type RhfUtilsUseFormChildrenZodProps<TSchema extends ZodTypeFieldValues> = UseRhfUtilsFormChildrenProps<TSchema[
|
|
5
|
+
export type RhfUtilsUseFormChildrenZodProps<TSchema extends ZodTypeFieldValues> = UseRhfUtilsFormChildrenProps<TSchema[typeof zodTypeInput], TSchema[typeof zodTypeOutput]>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { UseRhfUtilsFormProps } from '../../../form/UseRhfUtilsFormProps';
|
|
2
|
+
import { zodTypeInput, zodTypeOutput } from '../consts';
|
|
3
|
+
import { ZodTypeFieldValues } from '../ZodTypeFieldValues';
|
|
4
|
+
|
|
5
|
+
type Props<TSchema extends ZodTypeFieldValues> = {
|
|
6
|
+
schema: TSchema;
|
|
7
|
+
} & Omit<UseRhfUtilsFormProps<TSchema[typeof zodTypeInput], TSchema[typeof zodTypeOutput]>, 'config'>;
|
|
8
|
+
declare function RhfUtilsZodForm<TSchema extends ZodTypeFieldValues>({ schema, ...props }: Props<TSchema>): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export default RhfUtilsZodForm;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { UseRhfUtilsFormProps } from '../../../form/UseRhfUtilsFormProps';
|
|
2
|
+
import { zodTypeInput, zodTypeOutput } from '../consts';
|
|
2
3
|
import { ZodTypeFieldValues } from '../ZodTypeFieldValues';
|
|
3
4
|
|
|
4
|
-
declare const useRhfUtilsZodForm: <TSchema extends ZodTypeFieldValues>(schema: TSchema, form: Omit<UseRhfUtilsFormProps<TSchema[
|
|
5
|
+
declare const useRhfUtilsZodForm: <TSchema extends ZodTypeFieldValues>(schema: TSchema, form: Omit<UseRhfUtilsFormProps<TSchema[typeof zodTypeInput], TSchema[typeof zodTypeOutput]>, 'config'>) => import('../../../form/UseRhfUtilsFormReturn').UseRhfUtilsFormReturn<TSchema["_input"], TSchema["_output"]> & {
|
|
5
6
|
FormWithProviders: import('react').FC<{
|
|
6
7
|
children?: import('react').ReactNode;
|
|
7
8
|
}>;
|
|
@@ -6,7 +6,8 @@ import { FlatFieldErrors } from './types';
|
|
|
6
6
|
* This makes it easy to work with potentially deeply-nested {@link FieldErrors}.
|
|
7
7
|
*
|
|
8
8
|
* @param errors {@link FieldErrors} object.
|
|
9
|
-
*
|
|
9
|
+
*
|
|
10
|
+
* @returns `FlatFieldErrors` object.
|
|
10
11
|
*
|
|
11
12
|
* @example
|
|
12
13
|
* ```
|
|
@@ -28,4 +29,4 @@ export default getFlatFieldErrors;
|
|
|
28
29
|
*
|
|
29
30
|
* iow: dot [?: non-capturing]("type" | "message")[\b word boundary][$ end of string]
|
|
30
31
|
*/
|
|
31
|
-
export declare const
|
|
32
|
+
export declare const regexMaybeFieldErrorLeafNodeSuffix: RegExp;
|
|
@@ -1,4 +1,9 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
|
|
3
|
+
/**
|
|
4
|
+
* Get {@link FlatFieldErrors} of only orphans.
|
|
5
|
+
* @param formRef Parent DOM element to look for non-field error markers.
|
|
6
|
+
* @returns Memoized {@link FlatFieldErrors} of only orphans.
|
|
7
|
+
*/
|
|
3
8
|
declare const useOrphanFormErrorsMemo: (formRef: React.RefObject<HTMLFormElement>) => import('../flat/types').FlatFieldErrors;
|
|
4
9
|
export default useOrphanFormErrorsMemo;
|
package/dist/types/exports.d.ts
CHANGED
|
@@ -1,32 +1,21 @@
|
|
|
1
1
|
export type { Register } from './register';
|
|
2
2
|
export type { RhfUtilsClientConfig } from './client/config/RhfUtilsClientConfig';
|
|
3
3
|
export { default as RhfUtilsClientForZodContextProvider } from './client/zod/context/RhfUtilsClientForZodContextProvider';
|
|
4
|
-
export { default as
|
|
4
|
+
export { default as RhfUtilsZodForm } from './client/zod/context/RhfUtilsZodForm';
|
|
5
5
|
export { default as useRhfUtilsZodForm } from './client/zod/context/useRhfUtilsZodForm';
|
|
6
6
|
export type { RhfUtilsUseFormChildrenZodFC } from './client/zod/RhfUtilsUseFormChildrenZodFC';
|
|
7
7
|
export type { RhfUtilsUseFormChildrenZodProps } from './client/zod/RhfUtilsUseFormChildrenZodProps';
|
|
8
|
-
export { default as RhfUtilsZodForm } from './client/zod/RhfUtilsZodForm';
|
|
9
|
-
export { default as LazyDevTool } from './devtool/LazyDevTool';
|
|
10
8
|
export { default as useFlatFieldErrorsContext } from './errors/flat/context/useFlatFieldErrorsContext';
|
|
11
|
-
export { default as FlatFieldErrorsList } from './errors/flat/FlatFieldErrorsList';
|
|
12
|
-
export { default as FormErrorMessage } from './errors/message/FormErrorMessage';
|
|
13
9
|
export { default as FormErrorMessageByPath } from './errors/message/FormErrorMessageByPath';
|
|
14
10
|
export { default as FormNonFieldErrorMarker } from './errors/nonfield/FormNonFieldErrorMarker';
|
|
15
|
-
export { default as FormNonFieldErrorMarkerHtmlAttribute } from './errors/nonfield/FormNonFieldErrorMarkerHtmlAttribute';
|
|
16
|
-
export { default as useFormHasOnlyOrphanFieldErrorsMemo } from './errors/orphan/useFormHasOnlyOrphanFieldErrorsMemo';
|
|
17
|
-
export { default as useOrphanFormErrorsMemo } from './errors/orphan/useOrphanFormErrorsMemo';
|
|
18
11
|
export { default as RootErrorsListFromFlatFieldErrorsContext } from './errors/root/RootErrorsListFromFlatFieldErrorsContext';
|
|
19
|
-
export { default as useRootFormFieldErrorsMemo } from './errors/root/useRootFormFieldErrorsMemo';
|
|
20
12
|
export { getOnSubmitTrpcClientErrorHandler } from './errors/trpc/getOnSubmitTrpcClientErrorHandler';
|
|
21
13
|
export { trpcClientErrorToFormSubmitErrorsSchemaTransformer } from './errors/trpc/trpcClientErrorToFormSubmitErrorsSchemaTransformer';
|
|
22
|
-
export { default as useFormErrorsEffect } from './errors/useFormErrorsEffect';
|
|
23
|
-
export { default as useFormErrorsIfAny } from './errors/useFormErrorsIfAny';
|
|
24
|
-
export { default as FormWithProviders } from './form/FormWithProviders';
|
|
25
14
|
export type { RhfUtilsFormOptions } from './form/RhfUtilsFormOptions';
|
|
26
15
|
export type { SafeFieldValues } from './form/SafeFieldValues';
|
|
27
|
-
export { default as useRhfUtilsForm } from './form/useRhfUtilsForm';
|
|
28
16
|
export type { UseRhfUtilsFormChildrenProps } from './form/UseRhfUtilsFormChildrenProps';
|
|
29
|
-
export { default as
|
|
17
|
+
export { default as useRhfUtilsContext } from './form/context/utils/useRhfUtilsContext';
|
|
18
|
+
export { default as useRhfUtilsContextRequestSubmit } from './form/context/utils/useRhfUtilsContextRequestSubmit';
|
|
30
19
|
export { default as FormGroupContextProvider } from './form/context/group/FormGroupContextProvider';
|
|
31
20
|
export { default as useFormGroupChildIsMountedTracker } from './form/context/group/useFormGroupChildIsMountedTracker';
|
|
32
21
|
export { default as useFormGroupChildIsSubmittingTracker } from './form/context/group/useFormGroupChildIsSubmittingTracker';
|
|
@@ -37,5 +26,5 @@ export { default as useFormGroupIsParentBusy } from './form/context/group/useFor
|
|
|
37
26
|
export { default as useFormGroupParentTracker } from './form/context/group/useFormGroupParentTracker';
|
|
38
27
|
export { default as useFormOrParentIsBusy } from './form/context/group/useFormOrParentIsBusy';
|
|
39
28
|
export { default as getSubmitterButtonData } from './form/utils/getSubmitterButtonData';
|
|
29
|
+
export { default as useFormRequestSubmit } from './form/utils/useFormRequestSubmit';
|
|
40
30
|
export { FormSubmitError } from './submit/error/FormSubmitError';
|
|
41
|
-
export { default as useFormOnSubmitSuccessful } from './submit/useFormOnSubmitSuccessful';
|
|
@@ -1,13 +1,20 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
import { UseFormReturn } from 'react-hook-form';
|
|
3
|
+
import { FormSubmitError } from '../submit/error/FormSubmitError';
|
|
3
4
|
import { default as _Controller } from './_Controller';
|
|
4
5
|
import { RhfUtilsFormOptions } from './RhfUtilsFormOptions';
|
|
5
6
|
import { SafeFieldValues } from './SafeFieldValues';
|
|
6
7
|
|
|
8
|
+
/**
|
|
9
|
+
* Component props for `Children`.
|
|
10
|
+
*
|
|
11
|
+
* Consider keeping shape in line with `UseRhfUtilsFormReturn`.
|
|
12
|
+
*/
|
|
7
13
|
export type UseRhfUtilsFormChildrenProps<TFieldValues extends SafeFieldValues = SafeFieldValues, TTransformedValues extends SafeFieldValues = SafeFieldValues> = {
|
|
8
14
|
formId: string;
|
|
9
15
|
formRef: React.RefObject<HTMLFormElement>;
|
|
10
16
|
context: UseFormReturn<TFieldValues, unknown, TTransformedValues>;
|
|
11
17
|
utils?: RhfUtilsFormOptions;
|
|
12
18
|
Controller: typeof _Controller<TFieldValues>;
|
|
19
|
+
FormSubmitError: typeof FormSubmitError<TFieldValues>;
|
|
13
20
|
};
|
|
@@ -5,6 +5,11 @@ import { FormProps } from './Form';
|
|
|
5
5
|
import { RhfUtilsFormProvidersProps } from './RhfUtilsFormProviders';
|
|
6
6
|
import { SafeFieldValues } from './SafeFieldValues';
|
|
7
7
|
|
|
8
|
+
/**
|
|
9
|
+
* Return type for `useRhfUtilsForm`.
|
|
10
|
+
*
|
|
11
|
+
* Consider keeping shape in line with `UseRhfUtilsFormChildrenProps`.
|
|
12
|
+
*/
|
|
8
13
|
export type UseRhfUtilsFormReturn<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues> = {
|
|
9
14
|
id: string;
|
|
10
15
|
ref: React.RefObject<HTMLFormElement>;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { RhfUtilsFormOptions } from '../../RhfUtilsFormOptions';
|
|
2
|
+
|
|
3
|
+
type Props = React.PropsWithChildren<{
|
|
4
|
+
formId: string;
|
|
5
|
+
formRef: React.RefObject<HTMLFormElement>;
|
|
6
|
+
/** Callback after successful submit, and form reset. */
|
|
7
|
+
onSubmitSuccessfulAndReset?: () => void;
|
|
8
|
+
options?: RhfUtilsFormOptions;
|
|
9
|
+
}>;
|
|
10
|
+
declare function RhfUtilsContextProvider({ formId, formRef, onSubmitSuccessfulAndReset, options, children, }: Props): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export default RhfUtilsContextProvider;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { RhfUtilsFormOptions } from '../../RhfUtilsFormOptions';
|
|
2
|
+
|
|
3
|
+
export type RhfUtilsContext = {
|
|
4
|
+
formId: string;
|
|
5
|
+
formRef: React.RefObject<HTMLFormElement>;
|
|
6
|
+
options: RhfUtilsFormOptions | undefined;
|
|
7
|
+
};
|
|
8
|
+
declare const _RhfUtilsContextProvider: import('react').Provider<RhfUtilsContext | undefined>;
|
|
9
|
+
/**
|
|
10
|
+
* Use utils from the current form context.
|
|
11
|
+
*/
|
|
12
|
+
declare const useRhfUtilsContext: () => RhfUtilsContext;
|
|
13
|
+
export default useRhfUtilsContext;
|
|
14
|
+
export { _RhfUtilsContextProvider };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
|
-
* Get [name, value] of button/input that submitted form.
|
|
4
|
+
* Get [name, value] tuple of button/input that submitted form.
|
|
5
5
|
* Useful when determining user intent
|
|
6
6
|
*/
|
|
7
7
|
declare const getSubmitterButtonData: (event: React.BaseSyntheticEvent) => [
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Get callback to trigger submit manually on form.
|
|
3
|
+
* @link https://developer.mozilla.org/docs/Web/API/HTMLFormElement/requestSubmit
|
|
4
|
+
*/
|
|
5
|
+
declare const useFormRequestSubmit: (ref: React.RefObject<HTMLFormElement>) => HTMLFormElement['requestSubmit'];
|
|
6
|
+
export default useFormRequestSubmit;
|
package/package.json
CHANGED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
-
import i from "./context/useRhfUtilsClientForZodContext.mjs";
|
|
3
|
-
function f({
|
|
4
|
-
schema: o,
|
|
5
|
-
...t
|
|
6
|
-
}) {
|
|
7
|
-
const r = i();
|
|
8
|
-
return /* @__PURE__ */ e(r.FormWithProviders, { schema: o, ...t });
|
|
9
|
-
}
|
|
10
|
-
export {
|
|
11
|
-
f as default
|
|
12
|
-
};
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import s from "../../utils/isEmptyObject.mjs";
|
|
2
|
-
import t from "../flat/useFormFlatFieldErrorsMemo.mjs";
|
|
3
|
-
import m from "./useOrphanFormErrorsMemo.mjs";
|
|
4
|
-
const n = (o) => {
|
|
5
|
-
const e = t(), r = m(o);
|
|
6
|
-
return s(r) ? !1 : Object.keys(e).length !== Object.keys(r).length;
|
|
7
|
-
}, i = n;
|
|
8
|
-
export {
|
|
9
|
-
i as default
|
|
10
|
-
};
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import "react";
|
|
2
|
-
import t from "../../utils/isEmptyObject.mjs";
|
|
3
|
-
import m from "../useFormErrorsTransformMemo.mjs";
|
|
4
|
-
import e from "./getOrphansFromFieldErrors.mjs";
|
|
5
|
-
const s = (r) => m((o) => {
|
|
6
|
-
if (t(o))
|
|
7
|
-
return {};
|
|
8
|
-
if (!r.current)
|
|
9
|
-
throw new Error();
|
|
10
|
-
return e(o, r.current);
|
|
11
|
-
}), a = s;
|
|
12
|
-
export {
|
|
13
|
-
a as default
|
|
14
|
-
};
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import { jsx as a } from "react/jsx-runtime";
|
|
2
|
-
import l from "../../../errors/flat/useFlatFieldErrorsOutput.mjs";
|
|
3
|
-
import b from "../../../errors/useFormRequestSubmit.mjs";
|
|
4
|
-
import f from "../../../submit/useFormOnSubmitSuccessfulAndReset.mjs";
|
|
5
|
-
import O from "../../../submit/useResetFormOnSubmitError.mjs";
|
|
6
|
-
import i from "../../../submit/useResetFormOnSubmitSuccessful.mjs";
|
|
7
|
-
import d from "../../../submit/useSubmitFormOnChange.mjs";
|
|
8
|
-
import { _FormUtilsContextProvider as x } from "./useFormUtilsContext.mjs";
|
|
9
|
-
function j({
|
|
10
|
-
formId: t,
|
|
11
|
-
formRef: e,
|
|
12
|
-
onSubmitSuccessfulAndReset: m,
|
|
13
|
-
options: r,
|
|
14
|
-
children: u
|
|
15
|
-
}) {
|
|
16
|
-
const F = b(e);
|
|
17
|
-
return l(), d(e, {
|
|
18
|
-
disabled: !(r != null && r.submitOnChange)
|
|
19
|
-
}), O({
|
|
20
|
-
disabled: !(r != null && r.resetValuesOnSubmitError)
|
|
21
|
-
}), i(
|
|
22
|
-
(r == null ? void 0 : r.resetFormAfterSubmitSuccessful) || !!m
|
|
23
|
-
), f(() => {
|
|
24
|
-
m == null || m();
|
|
25
|
-
}), /* @__PURE__ */ a(
|
|
26
|
-
x,
|
|
27
|
-
{
|
|
28
|
-
value: { formId: t, formRef: e, requestSubmit: F, options: r },
|
|
29
|
-
children: u
|
|
30
|
-
}
|
|
31
|
-
);
|
|
32
|
-
}
|
|
33
|
-
export {
|
|
34
|
-
j as default
|
|
35
|
-
};
|
|
File without changes
|