@paragrav/rhf-utils 0.0.70 → 0.0.72
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/dist/esm/client/index.mjs +22 -24
- package/dist/esm/client/zod/context/RhfUtilsClientForZodContextProvider .mjs +14 -0
- package/dist/esm/client/zod/context/{index.mjs → useRhfUtilsClientForZodContext.mjs} +2 -2
- package/dist/esm/client/zod/{createZodRhfUtilsClient.mjs → createRhfUtilsClientForZod.mjs} +2 -2
- package/dist/esm/exports.mjs +6 -6
- package/dist/esm/form/_Form.mjs +51 -58
- package/dist/esm/form/_FormProviders.mjs +18 -9
- package/dist/esm/form/context/utils/FormUtilsContextProvider.mjs +38 -24
- package/dist/esm/form/useForm.mjs +18 -21
- package/dist/esm/submit/useResetFormOnSubmitError.mjs +2 -2
- package/dist/esm/submit/useResetFormOnSubmitSuccessful.mjs +17 -11
- package/dist/types/client/config.d.ts +0 -2
- package/dist/types/client/zod/context/RhfUtilsClientForZodContextProvider .d.ts +8 -0
- package/dist/types/client/zod/context/useRhfUtilsClientForZodContext.d.ts +6 -0
- package/dist/types/client/zod/createRhfUtilsClientForZod.d.ts +6 -0
- package/dist/types/exports.d.ts +3 -3
- package/dist/types/form/_Form.d.ts +2 -2
- package/dist/types/form/_FormProviders.d.ts +4 -3
- package/dist/types/form/context/utils/FormUtilsContextProvider.d.ts +6 -11
- package/dist/types/form/context/utils/useFormUtilsContext.d.ts +4 -1
- package/dist/types/form/useForm.d.ts +2 -4
- package/dist/types/form/useFormOptions.d.ts +8 -1
- package/dist/types/submit/useResetFormOnSubmitSuccessful.d.ts +8 -4
- package/package.json +13 -11
- package/dist/esm/client/zod/context/provider.mjs +0 -11
|
@@ -1,32 +1,32 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
const
|
|
5
|
-
const e =
|
|
1
|
+
import { jsx as h } from "react/jsx-runtime";
|
|
2
|
+
import l from "../form/FormWithProviders.mjs";
|
|
3
|
+
import d from "../form/useForm.mjs";
|
|
4
|
+
const v = (t) => (r) => {
|
|
5
|
+
const e = a(
|
|
6
6
|
t,
|
|
7
7
|
r
|
|
8
8
|
);
|
|
9
9
|
return {
|
|
10
|
-
useForm: (o, s) =>
|
|
10
|
+
useForm: (o, s) => d(
|
|
11
11
|
e(o, s)
|
|
12
12
|
),
|
|
13
|
-
FormWithProviders:
|
|
13
|
+
FormWithProviders: u(t, r)
|
|
14
14
|
};
|
|
15
|
-
},
|
|
15
|
+
}, u = (t, r) => function({
|
|
16
16
|
schema: o,
|
|
17
17
|
children: s,
|
|
18
18
|
...m
|
|
19
19
|
}) {
|
|
20
|
-
const i =
|
|
21
|
-
return /* @__PURE__ */
|
|
22
|
-
|
|
20
|
+
const i = a(t, r);
|
|
21
|
+
return /* @__PURE__ */ h(
|
|
22
|
+
l,
|
|
23
23
|
{
|
|
24
24
|
...i(o, m),
|
|
25
25
|
children: s
|
|
26
26
|
}
|
|
27
27
|
);
|
|
28
|
-
},
|
|
29
|
-
var s, m, i, n, f
|
|
28
|
+
}, a = (t, r) => (e, o) => {
|
|
29
|
+
var s, m, i, n, f;
|
|
30
30
|
return {
|
|
31
31
|
...o,
|
|
32
32
|
config: r,
|
|
@@ -35,19 +35,17 @@ const p = (t) => (r) => {
|
|
|
35
35
|
...o.rhf,
|
|
36
36
|
resolver: t(e)
|
|
37
37
|
},
|
|
38
|
-
form:
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
]
|
|
47
|
-
}
|
|
38
|
+
form: o.form,
|
|
39
|
+
options: {
|
|
40
|
+
...(m = r.defaultOptions) == null ? void 0 : m.form,
|
|
41
|
+
...o.options,
|
|
42
|
+
classNames: [
|
|
43
|
+
...((n = (i = r.defaultOptions) == null ? void 0 : i.form) == null ? void 0 : n.classNames) ?? [],
|
|
44
|
+
...((f = o.options) == null ? void 0 : f.classNames) ?? []
|
|
45
|
+
]
|
|
48
46
|
}
|
|
49
47
|
};
|
|
50
48
|
};
|
|
51
49
|
export {
|
|
52
|
-
|
|
50
|
+
v as createRhfUtilsClient
|
|
53
51
|
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import i from "react";
|
|
3
|
+
import n from "../createRhfUtilsClientForZod.mjs";
|
|
4
|
+
import { _RhfUtilsClientForZodContextProvider as l } from "./useRhfUtilsClientForZodContext.mjs";
|
|
5
|
+
const s = ({
|
|
6
|
+
config: t,
|
|
7
|
+
children: o
|
|
8
|
+
}) => {
|
|
9
|
+
const [r] = i.useState(() => n(t));
|
|
10
|
+
return /* @__PURE__ */ e(l, { value: r, children: o });
|
|
11
|
+
}, a = s;
|
|
12
|
+
export {
|
|
13
|
+
a as default
|
|
14
|
+
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { zodResolver as t } from "@hookform/resolvers/zod";
|
|
2
2
|
import "zod";
|
|
3
|
-
import { createRhfUtilsClient as
|
|
4
|
-
const
|
|
3
|
+
import { createRhfUtilsClient as o } from "../index.mjs";
|
|
4
|
+
const e = o(t), s = e;
|
|
5
5
|
export {
|
|
6
6
|
s as default
|
|
7
7
|
};
|
package/dist/esm/exports.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { default as e } from "./client/zod/context/
|
|
2
|
-
import { default as s } from "./client/zod/context/
|
|
3
|
-
import { default as u } from "./client/zod/
|
|
1
|
+
import { default as e } from "./client/zod/context/RhfUtilsClientForZodContextProvider .mjs";
|
|
2
|
+
import { default as s } from "./client/zod/context/useRhfUtilsClientForZodContext.mjs";
|
|
3
|
+
import { default as u } from "./client/zod/createRhfUtilsClientForZod.mjs";
|
|
4
4
|
import { default as m } from "./devtool/LazyDevTool.mjs";
|
|
5
5
|
import { default as d } from "./errors/flat/context/FlatFieldErrorsContextProvider.mjs";
|
|
6
6
|
import { default as x } from "./errors/flat/context/useFlatFieldErrorsContext.mjs";
|
|
@@ -48,8 +48,8 @@ export {
|
|
|
48
48
|
ir as FormSubmitError,
|
|
49
49
|
w as FormUtilsContextProvider,
|
|
50
50
|
m as LazyDevTool,
|
|
51
|
-
|
|
52
|
-
u as
|
|
51
|
+
e as RhfUtilsClientForZodContextProvider,
|
|
52
|
+
u as createRhfUtilsClientForZod,
|
|
53
53
|
xr as getSubmitterButtonData,
|
|
54
54
|
x as useFlatFieldErrorsContext,
|
|
55
55
|
z as useForm,
|
|
@@ -74,7 +74,7 @@ export {
|
|
|
74
74
|
I as useOrphanFormErrorsToConsole,
|
|
75
75
|
yr as useResetFormAfterSubmitSuccessful,
|
|
76
76
|
Sr as useResetFormOnSubmitError,
|
|
77
|
-
|
|
77
|
+
s as useRhfUtilsClientForZodContext,
|
|
78
78
|
g as useRootFormFieldErrorsMemo,
|
|
79
79
|
Or as useSubmitFormOnChange
|
|
80
80
|
};
|
package/dist/esm/form/_Form.mjs
CHANGED
|
@@ -1,90 +1,83 @@
|
|
|
1
|
-
import { jsxs as B, jsx as
|
|
1
|
+
import { jsxs as B, jsx as b } from "react/jsx-runtime";
|
|
2
2
|
import "react";
|
|
3
|
-
import { useFormContext as
|
|
4
|
-
import
|
|
5
|
-
import { FormSubmitError as
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
formRef: l,
|
|
3
|
+
import { useFormContext as j } from "react-hook-form";
|
|
4
|
+
import v from "../devtool/LazyDevTool.mjs";
|
|
5
|
+
import { FormSubmitError as N } from "../submit/error/FormSubmitError.mjs";
|
|
6
|
+
import P from "../submit/error/setCtxErrorsByFormSubmitError.mjs";
|
|
7
|
+
import T from "./_FormBase.mjs";
|
|
8
|
+
function L({
|
|
9
|
+
formId: E,
|
|
10
|
+
formRef: r,
|
|
12
11
|
form: t,
|
|
13
|
-
|
|
14
|
-
|
|
12
|
+
options: a,
|
|
13
|
+
config: l,
|
|
14
|
+
children: F
|
|
15
15
|
}) {
|
|
16
|
-
var
|
|
17
|
-
const
|
|
18
|
-
|
|
19
|
-
disabled: !((b = t == null ? void 0 : t.options) != null && b.resetValuesOnSubmitError)
|
|
20
|
-
});
|
|
21
|
-
const y = async (s) => {
|
|
22
|
-
var e;
|
|
23
|
-
(e = t == null ? void 0 : t.options) != null && e.stopSubmitPropagation && s.stopPropagation();
|
|
16
|
+
var h;
|
|
17
|
+
const s = j(), c = async (e) => {
|
|
18
|
+
a != null && a.stopSubmitPropagation && e.stopPropagation();
|
|
24
19
|
try {
|
|
25
|
-
await
|
|
26
|
-
|
|
20
|
+
await s.handleSubmit(
|
|
21
|
+
y,
|
|
27
22
|
t == null ? void 0 : t.onSubmitInvalid
|
|
28
|
-
)(
|
|
29
|
-
} catch (
|
|
30
|
-
|
|
23
|
+
)(e);
|
|
24
|
+
} catch (u) {
|
|
25
|
+
n(u, e);
|
|
31
26
|
}
|
|
32
|
-
},
|
|
33
|
-
var
|
|
34
|
-
return (
|
|
27
|
+
}, y = (e, u) => {
|
|
28
|
+
var d;
|
|
29
|
+
return (d = t == null ? void 0 : t.onSubmit) == null ? void 0 : d.call(
|
|
35
30
|
t,
|
|
31
|
+
e,
|
|
36
32
|
s,
|
|
37
|
-
|
|
38
|
-
e
|
|
33
|
+
u
|
|
39
34
|
);
|
|
40
|
-
},
|
|
35
|
+
}, n = (e, u) => {
|
|
41
36
|
var x, C;
|
|
42
|
-
const
|
|
37
|
+
const d = e instanceof N ? (
|
|
43
38
|
// consumer can manually throw FormSubmitError (e.g., manual validation)
|
|
44
|
-
|
|
39
|
+
e
|
|
45
40
|
) : (
|
|
46
41
|
// if error is not FormSubmitError, consumer can provide global handler
|
|
47
|
-
(x =
|
|
42
|
+
(x = l == null ? void 0 : l.onSubmitError) == null ? void 0 : x.call(l, e)
|
|
48
43
|
);
|
|
49
|
-
|
|
44
|
+
d && P(s, d), (C = t == null ? void 0 : t.onSubmitError) == null || C.call(
|
|
50
45
|
t,
|
|
46
|
+
e,
|
|
51
47
|
s,
|
|
52
|
-
|
|
53
|
-
e
|
|
48
|
+
u
|
|
54
49
|
);
|
|
55
|
-
},
|
|
56
|
-
formId:
|
|
57
|
-
formRef:
|
|
58
|
-
ctx:
|
|
59
|
-
options:
|
|
60
|
-
},
|
|
61
|
-
var
|
|
62
|
-
const
|
|
63
|
-
return
|
|
50
|
+
}, S = {
|
|
51
|
+
formId: E,
|
|
52
|
+
formRef: r,
|
|
53
|
+
ctx: s,
|
|
54
|
+
options: a
|
|
55
|
+
}, i = (e) => {
|
|
56
|
+
var d;
|
|
57
|
+
const u = (d = l == null ? void 0 : l.Children) == null ? void 0 : d[e];
|
|
58
|
+
return u && /* @__PURE__ */ b(u, { ...S });
|
|
64
59
|
};
|
|
65
60
|
return /* @__PURE__ */ B(
|
|
66
|
-
|
|
61
|
+
T,
|
|
67
62
|
{
|
|
68
63
|
noValidate: !0,
|
|
69
64
|
style: {
|
|
70
65
|
position: "relative"
|
|
71
66
|
},
|
|
72
67
|
...t == null ? void 0 : t.props,
|
|
73
|
-
className: [
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
onSubmit: y,
|
|
77
|
-
formRef: l,
|
|
68
|
+
className: [a == null ? void 0 : a.classNames, (h = t == null ? void 0 : t.props) == null ? void 0 : h.className].filter(Boolean).join(" "),
|
|
69
|
+
onSubmit: c,
|
|
70
|
+
formRef: r,
|
|
78
71
|
children: [
|
|
79
|
-
|
|
80
|
-
(
|
|
81
|
-
(t == null ? void 0 : t.Fields) && /* @__PURE__ */
|
|
82
|
-
|
|
83
|
-
|
|
72
|
+
i("top"),
|
|
73
|
+
(a == null ? void 0 : a.devTool) !== "disabled" && /* @__PURE__ */ b(v, { placement: "top-right", ...a == null ? void 0 : a.devTool }),
|
|
74
|
+
(t == null ? void 0 : t.Fields) && /* @__PURE__ */ b(t.Fields, { ...S }),
|
|
75
|
+
F,
|
|
76
|
+
i("bottom")
|
|
84
77
|
]
|
|
85
78
|
}
|
|
86
79
|
);
|
|
87
80
|
}
|
|
88
81
|
export {
|
|
89
|
-
|
|
82
|
+
L as default
|
|
90
83
|
};
|
|
@@ -1,15 +1,24 @@
|
|
|
1
1
|
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
-
import { FormProvider as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
function
|
|
2
|
+
import { FormProvider as d } from "react-hook-form";
|
|
3
|
+
import n from "../errors/flat/context/FlatFieldErrorsContextProvider.mjs";
|
|
4
|
+
import l from "./context/utils/FormUtilsContextProvider.mjs";
|
|
5
|
+
function v({
|
|
6
|
+
formId: t,
|
|
6
7
|
formRef: o,
|
|
7
|
-
rhfForm:
|
|
8
|
-
|
|
9
|
-
children:
|
|
8
|
+
rhfForm: i,
|
|
9
|
+
options: e,
|
|
10
|
+
children: m
|
|
10
11
|
}) {
|
|
11
|
-
return /* @__PURE__ */ r(
|
|
12
|
+
return /* @__PURE__ */ r(d, { ...i, children: /* @__PURE__ */ r(n, { formRef: o, children: /* @__PURE__ */ r(
|
|
13
|
+
l,
|
|
14
|
+
{
|
|
15
|
+
formId: t,
|
|
16
|
+
formRef: o,
|
|
17
|
+
options: e,
|
|
18
|
+
children: m
|
|
19
|
+
}
|
|
20
|
+
) }) });
|
|
12
21
|
}
|
|
13
22
|
export {
|
|
14
|
-
|
|
23
|
+
v as default
|
|
15
24
|
};
|
|
@@ -1,28 +1,42 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { isDevelopment as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
children: e
|
|
1
|
+
import { jsx as l } from "react/jsx-runtime";
|
|
2
|
+
import { isDevelopment as t } from "../../../env-conditions/production.mjs";
|
|
3
|
+
import b from "../../../errors/orphan/useOrphanFormErrorsToConsole.mjs";
|
|
4
|
+
import C from "../../../errors/useFormErrorConsoleDebug.mjs";
|
|
5
|
+
import O from "../../../errors/useFormRequestSubmit.mjs";
|
|
6
|
+
import f from "../../../submit/useFormOnSubmitSuccessfulAndReset.mjs";
|
|
7
|
+
import E from "../../../submit/useResetFormOnSubmitError.mjs";
|
|
8
|
+
import d from "../../../submit/useResetFormOnSubmitSuccessful.mjs";
|
|
9
|
+
import h from "../../../submit/useSubmitFormOnChange.mjs";
|
|
10
|
+
import { _FormUtilsContextProvider as o } from "./useFormUtilsContext.mjs";
|
|
11
|
+
function s({
|
|
12
|
+
formId: u,
|
|
13
|
+
formRef: m,
|
|
14
|
+
onSubmitSuccessfulAndReset: e,
|
|
15
|
+
options: r,
|
|
16
|
+
children: a
|
|
18
17
|
}) {
|
|
19
|
-
const
|
|
20
|
-
return
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
18
|
+
const F = O(m);
|
|
19
|
+
return C(
|
|
20
|
+
t
|
|
21
|
+
), b(
|
|
22
|
+
m,
|
|
23
|
+
!(r != null && r.disableOrphanFormErrorsToConsole)
|
|
24
|
+
), h(m, {
|
|
25
|
+
disabled: !(r != null && r.submitOnChange)
|
|
26
|
+
}), E({
|
|
27
|
+
disabled: !(r != null && r.resetValuesOnSubmitError)
|
|
28
|
+
}), d(
|
|
29
|
+
(r == null ? void 0 : r.resetFormAfterSubmitSuccessful) || !!e
|
|
30
|
+
), f(() => {
|
|
31
|
+
e == null || e();
|
|
32
|
+
}), /* @__PURE__ */ l(
|
|
33
|
+
o,
|
|
34
|
+
{
|
|
35
|
+
value: { formId: u, formRef: m, requestSubmit: F, options: r },
|
|
36
|
+
children: a
|
|
37
|
+
}
|
|
38
|
+
);
|
|
25
39
|
}
|
|
26
40
|
export {
|
|
27
|
-
|
|
41
|
+
s as default
|
|
28
42
|
};
|
|
@@ -1,33 +1,30 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { useForm as
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
utils: u
|
|
1
|
+
import e from "react";
|
|
2
|
+
import { useForm as p } from "react-hook-form";
|
|
3
|
+
const a = ({
|
|
4
|
+
config: t,
|
|
5
|
+
rhf: m,
|
|
6
|
+
form: f,
|
|
7
|
+
options: n
|
|
9
8
|
}) => {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
disabled: !((t = o == null ? void 0 : o.options) != null && t.submitOnChange)
|
|
14
|
-
}), {
|
|
15
|
-
id: s,
|
|
9
|
+
const o = e.useId(), s = p(m), r = e.useRef(null);
|
|
10
|
+
return {
|
|
11
|
+
id: o,
|
|
16
12
|
ref: r,
|
|
17
|
-
context:
|
|
13
|
+
context: s,
|
|
18
14
|
providerProps: {
|
|
15
|
+
formId: o,
|
|
19
16
|
formRef: r,
|
|
20
|
-
rhfForm:
|
|
21
|
-
|
|
17
|
+
rhfForm: s,
|
|
18
|
+
options: n
|
|
22
19
|
},
|
|
23
20
|
formProps: {
|
|
24
|
-
formId:
|
|
21
|
+
formId: o,
|
|
25
22
|
formRef: r,
|
|
26
|
-
config:
|
|
27
|
-
form:
|
|
23
|
+
config: t,
|
|
24
|
+
form: f
|
|
28
25
|
}
|
|
29
26
|
};
|
|
30
27
|
};
|
|
31
28
|
export {
|
|
32
|
-
|
|
29
|
+
a as default
|
|
33
30
|
};
|
|
@@ -1,14 +1,20 @@
|
|
|
1
|
-
import { useFormContext as
|
|
2
|
-
import
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
import { useFormContext as c } from "react-hook-form";
|
|
2
|
+
import m from "./useFormOnSubmitSuccessful.mjs";
|
|
3
|
+
const a = (e) => {
|
|
4
|
+
const { reset: u, getValues: t } = c();
|
|
5
|
+
m(() => {
|
|
6
|
+
if (!e)
|
|
7
|
+
return;
|
|
8
|
+
const s = e === !0 || e.values === void 0 ? void 0 : e.values.resetToCurrentValues ? t() : e.values, r = e === !0 ? (
|
|
9
|
+
// default
|
|
10
|
+
void 0
|
|
11
|
+
) : (
|
|
12
|
+
// custom settings
|
|
13
|
+
e.state
|
|
14
|
+
);
|
|
15
|
+
u(s, r);
|
|
10
16
|
});
|
|
11
|
-
},
|
|
17
|
+
}, o = a;
|
|
12
18
|
export {
|
|
13
|
-
|
|
19
|
+
o as default
|
|
14
20
|
};
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { FormSubmitError } from '../submit/error/FormSubmitError';
|
|
2
2
|
import { UseFormOptions } from '../form/useFormOptions';
|
|
3
3
|
import { UseFormFieldsProps } from '../form/useForm';
|
|
4
|
-
import { FormUtilsOptions } from '../form/context/utils/FormUtilsContextProvider';
|
|
5
4
|
import { _FormSlots } from '../form/_Form';
|
|
6
5
|
import { UseFormProps } from 'react-hook-form';
|
|
7
6
|
|
|
@@ -22,7 +21,6 @@ export type ClientConfig = {
|
|
|
22
21
|
* Extend this type to inject custom options/functionality via `Children` component.
|
|
23
22
|
*/
|
|
24
23
|
form?: UseFormOptions;
|
|
25
|
-
utils?: FormUtilsOptions;
|
|
26
24
|
};
|
|
27
25
|
/**
|
|
28
26
|
* Components injected by slot across all forms.
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { ClientConfig } from '../../config';
|
|
2
|
+
import { default as React } from 'react';
|
|
3
|
+
|
|
4
|
+
type Props = React.PropsWithChildren<{
|
|
5
|
+
config: ClientConfig;
|
|
6
|
+
}>;
|
|
7
|
+
declare const RhfUtilsClientForZodContextProvider: React.FC<Props>;
|
|
8
|
+
export default RhfUtilsClientForZodContextProvider;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { default as createRhfUtilsClientForZod } from '../createRhfUtilsClientForZod';
|
|
2
|
+
|
|
3
|
+
export type RhfUtilsClientForZodContext = ReturnType<typeof createRhfUtilsClientForZod>;
|
|
4
|
+
declare const useRhfUtilsClientForZodContext: () => import('../..').CreateRhfUtilsClient<import('../createRhfUtilsClientForZod').ZodTypeFieldValues, "_input", "_output">, _RhfUtilsClientForZodContextProvider: import('react').Provider<import('../..').CreateRhfUtilsClient<import('../createRhfUtilsClientForZod').ZodTypeFieldValues, "_input", "_output"> | undefined>;
|
|
5
|
+
export default useRhfUtilsClientForZodContext;
|
|
6
|
+
export { _RhfUtilsClientForZodContextProvider };
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { SafeFieldValues } from '../../form/SafeFieldValues';
|
|
2
|
+
import { z } from 'zod';
|
|
3
|
+
|
|
4
|
+
export type ZodTypeFieldValues = z.ZodType<SafeFieldValues>;
|
|
5
|
+
declare const createRhfUtilsClientForZod: (config: import('../config').ClientConfig) => import('..').CreateRhfUtilsClient<ZodTypeFieldValues, "_input", "_output">;
|
|
6
|
+
export default createRhfUtilsClientForZod;
|
package/dist/types/exports.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export type { ClientConfig } from './client/config';
|
|
2
|
-
export { default as
|
|
3
|
-
export { default as
|
|
4
|
-
export { default as
|
|
2
|
+
export { default as RhfUtilsClientForZodContextProvider } from './client/zod/context/RhfUtilsClientForZodContextProvider ';
|
|
3
|
+
export { default as useRhfUtilsClientForZodContext } from './client/zod/context/useRhfUtilsClientForZodContext';
|
|
4
|
+
export { default as createRhfUtilsClientForZod } from './client/zod/createRhfUtilsClientForZod';
|
|
5
5
|
export { default as LazyDevTool } from './devtool/LazyDevTool';
|
|
6
6
|
export { default as FlatFieldErrorsContextProvider } from './errors/flat/context/FlatFieldErrorsContextProvider';
|
|
7
7
|
export { default as useFlatFieldErrorsContext } from './errors/flat/context/useFlatFieldErrorsContext';
|
|
@@ -3,9 +3,9 @@ import { SafeFieldValues } from './SafeFieldValues';
|
|
|
3
3
|
import { default as React } from 'react';
|
|
4
4
|
|
|
5
5
|
export type _FormSlots = 'top' | 'bottom';
|
|
6
|
-
export type _FormProps<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues> = React.PropsWithChildren<Pick<UseFormProps<TFieldValues, TTransformedValues>, 'form' | 'config'> & {
|
|
6
|
+
export type _FormProps<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues> = React.PropsWithChildren<Pick<UseFormProps<TFieldValues, TTransformedValues>, 'form' | 'options' | 'config'> & {
|
|
7
7
|
formId: string;
|
|
8
8
|
formRef: React.RefObject<HTMLFormElement>;
|
|
9
9
|
}>;
|
|
10
|
-
declare function _Form<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues>({ formId, formRef, form, config, children, }: _FormProps<TFieldValues, TTransformedValues>): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
declare function _Form<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues>({ formId, formRef, form, options, config, children, }: _FormProps<TFieldValues, TTransformedValues>): import("react/jsx-runtime").JSX.Element;
|
|
11
11
|
export default _Form;
|
|
@@ -1,11 +1,12 @@
|
|
|
1
|
+
import { UseFormOptions } from './useFormOptions';
|
|
1
2
|
import { SafeFieldValues } from './SafeFieldValues';
|
|
2
|
-
import { FormUtilsOptions } from './context/utils/FormUtilsContextProvider';
|
|
3
3
|
import { UseFormReturn } from 'react-hook-form';
|
|
4
4
|
|
|
5
5
|
export type _FormProvidersProps<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues> = React.PropsWithChildren<{
|
|
6
|
+
formId: string;
|
|
6
7
|
formRef: React.RefObject<HTMLFormElement>;
|
|
7
8
|
rhfForm: UseFormReturn<TFieldValues, unknown, TTransformedValues>;
|
|
8
|
-
|
|
9
|
+
options?: UseFormOptions;
|
|
9
10
|
}>;
|
|
10
|
-
declare function _FormProviders<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues>({ formRef, rhfForm,
|
|
11
|
+
declare function _FormProviders<TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues>({ formId, formRef, rhfForm, options, children, }: _FormProvidersProps<TFieldValues, TTransformedValues>): import("react/jsx-runtime").JSX.Element;
|
|
11
12
|
export default _FormProviders;
|
|
@@ -1,16 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
/** Disable `console.debug` of field errors in dev. */
|
|
4
|
-
disableFormErrorConsoleDebug?: boolean;
|
|
5
|
-
/** Disable `console.error` of orphan field errors. */
|
|
6
|
-
disableOrphanFormErrorsToConsole?: boolean;
|
|
7
|
-
/** Reset form after successful submit. */
|
|
8
|
-
resetFormAfterSubmitSuccessful?: boolean;
|
|
9
|
-
};
|
|
1
|
+
import { UseFormOptions } from '../../useFormOptions';
|
|
2
|
+
|
|
10
3
|
type Props = React.PropsWithChildren<{
|
|
4
|
+
formId: string;
|
|
11
5
|
formRef: React.RefObject<HTMLFormElement>;
|
|
12
6
|
/** Callback after successful submit, and form reset. */
|
|
13
7
|
onSubmitSuccessfulAndReset?: () => void;
|
|
14
|
-
|
|
15
|
-
|
|
8
|
+
options?: UseFormOptions;
|
|
9
|
+
}>;
|
|
10
|
+
declare function FormUtilsContextProvider({ formId, formRef, onSubmitSuccessfulAndReset, options, children, }: Props): import("react/jsx-runtime").JSX.Element;
|
|
16
11
|
export default FormUtilsContextProvider;
|
|
@@ -1,6 +1,9 @@
|
|
|
1
|
-
|
|
1
|
+
import { UseFormOptions } from '../../useFormOptions';
|
|
2
|
+
|
|
2
3
|
export type FormUtilsContext = {
|
|
4
|
+
formId: string;
|
|
3
5
|
formRef: React.RefObject<HTMLFormElement>;
|
|
6
|
+
options: UseFormOptions | undefined;
|
|
4
7
|
/** Callback to trigger submit manually -- e.g., on change. */
|
|
5
8
|
requestSubmit: HTMLFormElement['requestSubmit'];
|
|
6
9
|
};
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { UseFormOptions } from './useFormOptions';
|
|
2
2
|
import { SafeFieldValues } from './SafeFieldValues';
|
|
3
|
-
import { FormUtilsOptions } from './context/utils/FormUtilsContextProvider';
|
|
4
3
|
import { _FormProvidersProps } from './_FormProviders';
|
|
5
4
|
import { _FormProps } from './_Form';
|
|
6
5
|
import { ClientConfig } from '../client/config';
|
|
@@ -25,10 +24,9 @@ export type UseFormProps<TFieldValues extends SafeFieldValues, TTransformedValue
|
|
|
25
24
|
onSubmitError?: (error: unknown, context: RhfUseFormReturn<TFieldValues, unknown, TTransformedValues>, event: React.BaseSyntheticEvent<SubmitEvent>) => void;
|
|
26
25
|
/** Submit handler when form is invalid. */
|
|
27
26
|
onSubmitInvalid?: SubmitErrorHandler<TFieldValues>;
|
|
28
|
-
options?: UseFormOptions;
|
|
29
27
|
props?: React.PropsWithoutRef<JSX.IntrinsicElements['form']>;
|
|
30
28
|
};
|
|
31
|
-
|
|
29
|
+
options?: UseFormOptions;
|
|
32
30
|
};
|
|
33
31
|
/**
|
|
34
32
|
* Core Rhf Form hook. Use `Form` in `index.ts` for most cases.
|
|
@@ -39,7 +37,7 @@ export type UseFormProps<TFieldValues extends SafeFieldValues, TTransformedValue
|
|
|
39
37
|
* see https://caniuse.com/?search=form%20attribute
|
|
40
38
|
* @returns Form provider and form.
|
|
41
39
|
*/
|
|
42
|
-
declare const useForm: <TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues>({ config, rhf, form,
|
|
40
|
+
declare const useForm: <TFieldValues extends SafeFieldValues, TTransformedValues extends SafeFieldValues>({ config, rhf, form, options, }: UseFormProps<TFieldValues, TTransformedValues>) => {
|
|
43
41
|
readonly id: string;
|
|
44
42
|
readonly ref: React.RefObject<HTMLFormElement>;
|
|
45
43
|
readonly context: RhfUseFormReturn<TFieldValues, unknown, TTransformedValues>;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
+
import { default as useResetFormAfterSubmitSuccessful } from '../submit/useResetFormOnSubmitSuccessful';
|
|
1
2
|
import { DevtoolUIProps } from '@hookform/devtools/dist/devToolUI';
|
|
2
3
|
|
|
3
4
|
export type UseFormOptions = {
|
|
4
|
-
/** Control visibility of certain items via your own classes and styles. */
|
|
5
|
+
/** Control visibility of certain items via your own classes and styles. (Defaults merged with individual class names.) */
|
|
5
6
|
classNames?: string[];
|
|
6
7
|
/** Request submit via listener on form change. */
|
|
7
8
|
submitOnChange?: boolean;
|
|
@@ -9,6 +10,12 @@ export type UseFormOptions = {
|
|
|
9
10
|
resetValuesOnSubmitError?: boolean;
|
|
10
11
|
/** Stop propagation of submit event. Useful for portals. */
|
|
11
12
|
stopSubmitPropagation?: boolean;
|
|
13
|
+
/** Disable `console.debug` of field errors in dev. */
|
|
14
|
+
disableFormErrorConsoleDebug?: boolean;
|
|
15
|
+
/** Disable `console.error` of orphan field errors. */
|
|
16
|
+
disableOrphanFormErrorsToConsole?: boolean;
|
|
17
|
+
/** Reset form after successful submit. */
|
|
18
|
+
resetFormAfterSubmitSuccessful?: Parameters<typeof useResetFormAfterSubmitSuccessful>[0];
|
|
12
19
|
/** Control dev tool options. */
|
|
13
20
|
devTool?: DevtoolUIProps | 'disabled';
|
|
14
21
|
};
|
|
@@ -1,12 +1,16 @@
|
|
|
1
|
+
import { SafeFieldValues } from '../form/SafeFieldValues';
|
|
1
2
|
import { KeepStateOptions } from 'react-hook-form';
|
|
2
3
|
|
|
3
|
-
type Options = {
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
type Options = false | undefined | true | {
|
|
5
|
+
values?: undefined | SafeFieldValues | {
|
|
6
|
+
resetToCurrentValues: true;
|
|
7
|
+
};
|
|
8
|
+
state?: KeepStateOptions;
|
|
9
|
+
};
|
|
6
10
|
/**
|
|
7
11
|
* Handle resetting after successful submit with no server validation errors.
|
|
8
12
|
* See `Rules` section: https://react-hook-form.com/api/useform/reset/
|
|
9
13
|
* Specifically: "- It's recommended to reset inside useEffect after submission."
|
|
10
14
|
*/
|
|
11
|
-
declare const useResetFormAfterSubmitSuccessful: (
|
|
15
|
+
declare const useResetFormAfterSubmitSuccessful: (options: Options) => void;
|
|
12
16
|
export default useResetFormAfterSubmitSuccessful;
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@paragrav/rhf-utils",
|
|
3
3
|
"author": "paragrav.dev",
|
|
4
4
|
"license": "MIT",
|
|
5
|
-
"version": "0.0.
|
|
5
|
+
"version": "0.0.72",
|
|
6
6
|
"description": "Integration utilities for react-hook-form.",
|
|
7
7
|
"type": "module",
|
|
8
8
|
"sideEffects": false,
|
|
@@ -21,17 +21,17 @@
|
|
|
21
21
|
"default": "./dist/esm/exports.mjs",
|
|
22
22
|
"types": "./dist/types/exports.d.ts"
|
|
23
23
|
},
|
|
24
|
-
"./
|
|
25
|
-
"default": "./dist/esm/client/zod/
|
|
26
|
-
"types": "./dist/types/client/zod/
|
|
24
|
+
"./client/zod/createRhfUtilsClientForZod": {
|
|
25
|
+
"default": "./dist/esm/client/zod/createRhfUtilsClientForZod.mjs",
|
|
26
|
+
"types": "./dist/types/client/zod/createRhfUtilsClientForZod.d.ts"
|
|
27
27
|
},
|
|
28
|
-
"./
|
|
29
|
-
"default": "./dist/esm/client/zod/
|
|
30
|
-
"types": "./dist/types/client/zod/
|
|
28
|
+
"./client/zod/useRhfUtilsClientForZodContext": {
|
|
29
|
+
"default": "./dist/esm/client/zod/useRhfUtilsClientForZodContext.mjs",
|
|
30
|
+
"types": "./dist/types/client/zod/useRhfUtilsClientForZodContext.d.ts"
|
|
31
31
|
},
|
|
32
|
-
"./
|
|
33
|
-
"default": "./dist/esm/client/zod/
|
|
34
|
-
"types": "./dist/types/client/zod/
|
|
32
|
+
"./client/zod/RhfUtilsClientForZodContextProvider": {
|
|
33
|
+
"default": "./dist/esm/client/zod/RhfUtilsClientForZodContextProvider.mjs",
|
|
34
|
+
"types": "./dist/types/client/zod/RhfUtilsClientForZodContextProvider.d.ts"
|
|
35
35
|
},
|
|
36
36
|
"./LazyDevTool": {
|
|
37
37
|
"default": "./dist/esm/devtool/LazyDevTool.mjs",
|
|
@@ -202,7 +202,8 @@
|
|
|
202
202
|
},
|
|
203
203
|
"devDependencies": {
|
|
204
204
|
"@hookform/resolvers": "^3.3.4",
|
|
205
|
-
"@playwright/experimental-ct-react": "^1.
|
|
205
|
+
"@playwright/experimental-ct-react": "^1.43.1",
|
|
206
|
+
"@playwright/test": "^1.43.1",
|
|
206
207
|
"@rollup/plugin-typescript": "^11.1.6",
|
|
207
208
|
"@types/node": "^20.12.7",
|
|
208
209
|
"@types/react": "^18.2.69",
|
|
@@ -213,6 +214,7 @@
|
|
|
213
214
|
"cross-env": "^7.0.3",
|
|
214
215
|
"eslint": "^8.57.0",
|
|
215
216
|
"eslint-config-prettier": "^9.1.0",
|
|
217
|
+
"eslint-import-resolver-typescript": "^3.6.1",
|
|
216
218
|
"eslint-plugin-import": "^2.29.1",
|
|
217
219
|
"eslint-plugin-react": "^7.34.1",
|
|
218
220
|
"eslint-plugin-react-hooks": "^4.6.0",
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { jsx as e } from "react/jsx-runtime";
|
|
2
|
-
import i from "react";
|
|
3
|
-
import s from "../createZodRhfUtilsClient.mjs";
|
|
4
|
-
import { _RhfUtilsContextProvider as f } from "./index.mjs";
|
|
5
|
-
const n = ({ config: t, children: o }) => {
|
|
6
|
-
const [r] = i.useState(() => s(t));
|
|
7
|
-
return /* @__PURE__ */ e(f, { value: r, children: o });
|
|
8
|
-
}, c = n;
|
|
9
|
-
export {
|
|
10
|
-
c as default
|
|
11
|
-
};
|