@paragrav/rhf-utils 0.0.18 → 0.0.20

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.
Files changed (88) hide show
  1. package/dist/cjs/errors/flattenFieldErrors.d.ts +14 -0
  2. package/dist/cjs/errors/flattenFieldErrors.js +16 -0
  3. package/dist/cjs/errors/getFlatFieldErrors.d.ts +16 -0
  4. package/dist/cjs/errors/getFlatFieldErrors.js +40 -0
  5. package/dist/cjs/errors/nonfield/FormNonFieldErrorMarker.js +7 -4
  6. package/dist/cjs/errors/nonfield/FormNonFieldErrorMarker.utils.d.ts +3 -1
  7. package/dist/cjs/errors/nonfield/FormNonFieldErrorMarker.utils.js +7 -3
  8. package/dist/cjs/errors/nonfield/utils.d.ts +15 -7
  9. package/dist/cjs/errors/nonfield/utils.js +14 -72
  10. package/dist/cjs/errors/orphan/useFormErrorsHasOnlyOrphans.d.ts +2 -0
  11. package/dist/cjs/errors/orphan/useFormErrorsHasOnlyOrphans.js +19 -0
  12. package/dist/cjs/errors/orphan/useOrphanFormErrors.d.ts +3 -0
  13. package/dist/cjs/errors/orphan/useOrphanFormErrors.js +18 -0
  14. package/dist/cjs/errors/orphan/useOrphanFormErrorsToConsoleError.d.ts +7 -0
  15. package/dist/cjs/errors/{orphans/useFormErrorOrphansToConsoleError.js → orphan/useOrphanFormErrorsToConsoleError.js} +6 -8
  16. package/dist/cjs/errors/orphan/utils.d.ts +3 -0
  17. package/dist/cjs/errors/orphan/utils.js +21 -0
  18. package/dist/cjs/errors/root/useRootFormFieldErrors.d.ts +6 -0
  19. package/dist/cjs/errors/root/{useFormRootFieldErrors.js → useRootFormFieldErrors.js} +2 -2
  20. package/dist/cjs/errors/root/utils.d.ts +5 -1
  21. package/dist/cjs/errors/root/utils.js +15 -4
  22. package/dist/cjs/errors/useFormErrorConsoleDebug.d.ts +8 -0
  23. package/dist/cjs/errors/useFormErrorConsoleDebug.js +22 -0
  24. package/dist/cjs/errors/useFormErrorsIfAny.d.ts +6 -0
  25. package/dist/cjs/errors/useFormErrorsIfAny.js +13 -0
  26. package/dist/cjs/errors/useFormFlatFieldErrors.d.ts +5 -0
  27. package/dist/cjs/errors/useFormFlatFieldErrors.js +12 -0
  28. package/dist/cjs/main.d.ts +7 -4
  29. package/dist/cjs/main.js +14 -8
  30. package/dist/cjs/utils.d.ts +1 -0
  31. package/dist/cjs/utils.js +5 -0
  32. package/dist/esm/errors/flattenFieldErrors.mjs +5 -0
  33. package/dist/esm/errors/getFlatFieldErrors.mjs +21 -0
  34. package/dist/esm/errors/nonfield/FormNonFieldErrorMarker.mjs +4 -4
  35. package/dist/esm/errors/nonfield/FormNonFieldErrorMarker.utils.mjs +4 -3
  36. package/dist/esm/errors/nonfield/utils.mjs +2 -12
  37. package/dist/esm/errors/orphan/useFormErrorsHasOnlyOrphans.mjs +10 -0
  38. package/dist/esm/errors/orphan/useOrphanFormErrors.mjs +14 -0
  39. package/dist/esm/errors/{orphans/useFormErrorOrphansToConsoleError.mjs → orphan/useOrphanFormErrorsToConsoleError.mjs} +2 -2
  40. package/dist/esm/errors/orphan/utils.mjs +20 -0
  41. package/dist/esm/errors/root/{useFormRootFieldErrors.mjs → useRootFormFieldErrors.mjs} +1 -1
  42. package/dist/esm/errors/root/utils.mjs +8 -3
  43. package/dist/esm/errors/useFormErrorConsoleDebug.mjs +8 -0
  44. package/dist/esm/errors/useFormErrorsIfAny.mjs +9 -0
  45. package/dist/esm/errors/useFormFlatFieldErrors.mjs +6 -0
  46. package/dist/esm/main.mjs +20 -14
  47. package/dist/esm/utils.mjs +4 -0
  48. package/dist/types/errors/flattenFieldErrors.d.ts +15 -0
  49. package/dist/types/errors/getFlatFieldErrors.d.ts +17 -0
  50. package/dist/types/errors/nonfield/FormNonFieldErrorMarker.utils.d.ts +3 -1
  51. package/dist/types/errors/nonfield/utils.d.ts +15 -7
  52. package/dist/types/errors/orphan/useFormErrorsHasOnlyOrphans.d.ts +2 -0
  53. package/dist/types/errors/orphan/useOrphanFormErrors.d.ts +4 -0
  54. package/dist/types/errors/orphan/useOrphanFormErrorsToConsoleError.d.ts +8 -0
  55. package/dist/types/errors/orphan/utils.d.ts +4 -0
  56. package/dist/types/errors/root/useRootFormFieldErrors.d.ts +6 -0
  57. package/dist/types/errors/root/utils.d.ts +5 -1
  58. package/dist/types/errors/useFormErrorConsoleDebug.d.ts +8 -0
  59. package/dist/types/errors/useFormErrorsIfAny.d.ts +6 -0
  60. package/dist/types/errors/useFormFlatFieldErrors.d.ts +5 -0
  61. package/dist/types/main.d.ts +7 -4
  62. package/dist/types/utils.d.ts +1 -0
  63. package/package.json +63 -14
  64. package/dist/cjs/errors/orphans/FormErrorNonFieldMarker.d.ts +0 -14
  65. package/dist/cjs/errors/orphans/FormErrorNonFieldMarker.js +0 -20
  66. package/dist/cjs/errors/orphans/useFormErrorOrphansToConsoleError.d.ts +0 -9
  67. package/dist/cjs/errors/orphans/useFormOrphanErrors.d.ts +0 -3
  68. package/dist/cjs/errors/orphans/useFormOrphanErrors.js +0 -17
  69. package/dist/cjs/errors/orphans/utils.d.ts +0 -15
  70. package/dist/cjs/errors/orphans/utils.js +0 -27
  71. package/dist/cjs/errors/root/useFormRootFieldErrors.d.ts +0 -6
  72. package/dist/cjs/errors/roots/useFormRootFieldErrors.d.ts +0 -2
  73. package/dist/cjs/errors/roots/useFormRootFieldErrors.js +0 -9
  74. package/dist/cjs/errors/roots/utils.d.ts +0 -7
  75. package/dist/cjs/errors/roots/utils.js +0 -13
  76. package/dist/cjs/errors/utils.d.ts +0 -9
  77. package/dist/cjs/errors/utils.js +0 -65
  78. package/dist/esm/errors/orphans/useFormOrphanErrors.mjs +0 -13
  79. package/dist/esm/errors/orphans/utils.mjs +0 -17
  80. package/dist/esm/node_modules/flat/index.mjs +0 -22
  81. package/dist/types/errors/orphans/FormErrorNonFieldMarker.d.ts +0 -14
  82. package/dist/types/errors/orphans/useFormErrorOrphansToConsoleError.d.ts +0 -10
  83. package/dist/types/errors/orphans/useFormOrphanErrors.d.ts +0 -4
  84. package/dist/types/errors/orphans/utils.d.ts +0 -16
  85. package/dist/types/errors/root/useFormRootFieldErrors.d.ts +0 -6
  86. package/dist/types/errors/roots/useFormRootFieldErrors.d.ts +0 -2
  87. package/dist/types/errors/roots/utils.d.ts +0 -8
  88. package/dist/types/errors/utils.d.ts +0 -10
@@ -1,6 +1,6 @@
1
1
  import { jsx as t } from "react/jsx-runtime";
2
- import { FormNonFieldErrorMarkerHtmlAttribute as e } from "./FormNonFieldErrorMarker.utils.mjs";
3
- const i = ({ path: r }) => {
2
+ import e from "./FormNonFieldErrorMarker.utils.mjs";
3
+ const a = ({ path: r }) => {
4
4
  const o = {
5
5
  [e]: r
6
6
  };
@@ -13,7 +13,7 @@ const i = ({ path: r }) => {
13
13
  ...o
14
14
  }
15
15
  );
16
- }, l = i;
16
+ }, d = a;
17
17
  export {
18
- l as default
18
+ d as default
19
19
  };
@@ -1,5 +1,6 @@
1
- const e = "data-paragrav-rhf-utils-nonfield-error-marker-path", o = (r) => `[role="alert"][${e}="${r}"]`;
1
+ const e = "data-paragrav-rhf-utils-nonfield-error-marker-path", a = e, t = (r) => `[role="alert"][${e}="${r}"]`, l = (r, o) => o.querySelector(t(r));
2
2
  export {
3
- e as FormNonFieldErrorMarkerHtmlAttribute,
4
- o as getFormNonFieldErrorMarkerQuerySelector
3
+ a as default,
4
+ t as getFormNonFieldErrorMarkerQuerySelector,
5
+ l as hasNonFieldErrorMarkerInDOM
5
6
  };
@@ -1,14 +1,4 @@
1
- import { flatten as f } from "../../node_modules/flat/index.mjs";
2
- import { get as l } from "react-hook-form";
3
- const F = (e, t) => i(e, t).reduce((r, s) => (r[s] = l(e, s), r), {}), g = (e, t) => i(e, t).map((r) => l(e, r)), i = (e, t) => {
4
- const n = f(e);
5
- return Object.keys(n).filter((o) => o.match(d)).map(
6
- (o) => o.replace(d, "")
7
- ).filter(
8
- (o) => t ? t(o, n) : !0
9
- );
10
- }, d = /\.ref$/;
1
+ const o = (r) => !r.ref;
11
2
  export {
12
- g as getNonFieldErrorListByFilter,
13
- F as getNonFieldErrorRecordByFilter
3
+ o as isNonFieldError
14
4
  };
@@ -0,0 +1,10 @@
1
+ import { isEmptyObject as e } from "../../utils.mjs";
2
+ import t from "../useFormFlatFieldErrors.mjs";
3
+ import n from "./useOrphanFormErrors.mjs";
4
+ const m = (o) => {
5
+ const r = n(o), s = t();
6
+ return [r, s].some(e) ? !1 : Object.keys(r).length === Object.keys(s).length;
7
+ }, O = m;
8
+ export {
9
+ O as default
10
+ };
@@ -0,0 +1,14 @@
1
+ import "react";
2
+ import { isEmptyObject as t } from "../../utils.mjs";
3
+ import e from "../useFormErrorsOnChange.mjs";
4
+ import { getOrphanFlatFieldErrors as n } from "./utils.mjs";
5
+ const m = (r) => e((o) => {
6
+ if (t(o))
7
+ return {};
8
+ if (!r.current)
9
+ throw new Error();
10
+ return n(o, r.current);
11
+ }), a = m;
12
+ export {
13
+ a as default
14
+ };
@@ -1,10 +1,10 @@
1
1
  import t from "react";
2
2
  import { useFormContext as n, useFormState as a } from "react-hook-form";
3
- import m from "./useFormOrphanErrors.mjs";
3
+ import m from "./useOrphanFormErrors.mjs";
4
4
  const c = (e) => {
5
5
  const { getValues: o } = n(), { errors: s } = a(), r = m(e);
6
6
  t.useEffect(() => {
7
- Object.keys(r).length && console.error("useFormErrorOrphansToConsoleError", {
7
+ Object.keys(r).length && console.error("useOrphanFormErrorsToConsoleError", {
8
8
  location: window.location,
9
9
  values: o(),
10
10
  orphans: r
@@ -0,0 +1,20 @@
1
+ import m from "../getFlatFieldErrors.mjs";
2
+ import { hasNonFieldErrorMarkerInDOM as s } from "../nonfield/FormNonFieldErrorMarker.utils.mjs";
3
+ import { isNonFieldError as l } from "../nonfield/utils.mjs";
4
+ import { isFormErrorPathRoot as n } from "../root/utils.mjs";
5
+ const d = (o, t) => {
6
+ const e = m(o);
7
+ return Object.fromEntries(
8
+ Object.entries(e).filter(
9
+ ([r, i]) => (
10
+ // not root path
11
+ !n(r) && // non-field
12
+ l(i) && // does not have marker
13
+ !s(r, t)
14
+ )
15
+ )
16
+ );
17
+ };
18
+ export {
19
+ d as getOrphanFlatFieldErrors
20
+ };
@@ -1,5 +1,5 @@
1
1
  import o from "../useFormErrorsOnChange.mjs";
2
- import { getRootFieldErrorList as r } from "./utils.mjs";
2
+ import { getRootFlatFieldErrors as r } from "./utils.mjs";
3
3
  const t = () => o(r), m = t;
4
4
  export {
5
5
  m as default
@@ -1,6 +1,11 @@
1
- import { getNonFieldErrorListByFilter as t } from "../nonfield/utils.mjs";
2
- const r = "root", i = (o) => o === r || o.startsWith(r + "."), e = (o) => t(o, i);
1
+ import s from "../getFlatFieldErrors.mjs";
2
+ const t = "root", i = (r) => r === t || r.startsWith(t + "."), n = (r) => {
3
+ const o = s(r);
4
+ return Object.fromEntries(
5
+ Object.entries(o).filter(([e]) => i(e))
6
+ );
7
+ };
3
8
  export {
4
- e as getRootFieldErrorList,
9
+ n as getRootFlatFieldErrors,
5
10
  i as isFormErrorPathRoot
6
11
  };
@@ -0,0 +1,8 @@
1
+ import e from "./useFormErrorsIfAny.mjs";
2
+ const s = (o) => {
3
+ const r = e();
4
+ o && r && console.debug("useFormErrorConsoleDebug", r);
5
+ }, n = s;
6
+ export {
7
+ n as default
8
+ };
@@ -0,0 +1,9 @@
1
+ import { useFormState as o } from "react-hook-form";
2
+ import { isEmptyObject as s } from "../utils.mjs";
3
+ const t = () => {
4
+ const { errors: r } = o();
5
+ return s(r) ? !1 : r;
6
+ }, f = t;
7
+ export {
8
+ f as default
9
+ };
@@ -0,0 +1,6 @@
1
+ import r from "./getFlatFieldErrors.mjs";
2
+ import o from "./useFormErrorsOnChange.mjs";
3
+ const s = () => o(r);
4
+ export {
5
+ s as default
6
+ };
package/dist/esm/main.mjs CHANGED
@@ -1,18 +1,24 @@
1
1
  import { default as e } from "./errors/nonfield/FormNonFieldErrorMarker.mjs";
2
- import { FormNonFieldErrorMarkerHtmlAttribute as s } from "./errors/nonfield/FormNonFieldErrorMarker.utils.mjs";
3
- import { default as m } from "./errors/orphans/useFormErrorOrphansToConsoleError.mjs";
4
- import { default as u } from "./errors/orphans/useFormOrphanErrors.mjs";
5
- import { default as F } from "./errors/root/useFormRootFieldErrors.mjs";
6
- import { default as p } from "./errors/useFormErrorsEffect.mjs";
7
- import { default as x } from "./errors/useFormErrorsOnChange.mjs";
8
- import { default as i } from "./errors/useFormRequestSubmit.mjs";
2
+ import { default as t } from "./errors/nonfield/FormNonFieldErrorMarker.utils.mjs";
3
+ import { default as f } from "./errors/orphan/useFormErrorsHasOnlyOrphans.mjs";
4
+ import { default as u } from "./errors/orphan/useOrphanFormErrors.mjs";
5
+ import { default as d } from "./errors/orphan/useOrphanFormErrorsToConsoleError.mjs";
6
+ import { default as F } from "./errors/root/useRootFormFieldErrors.mjs";
7
+ import { default as n } from "./errors/useFormErrorConsoleDebug.mjs";
8
+ import { default as i } from "./errors/useFormErrorsEffect.mjs";
9
+ import { default as h } from "./errors/useFormErrorsIfAny.mjs";
10
+ import { default as C } from "./errors/useFormErrorsOnChange.mjs";
11
+ import { default as k } from "./errors/useFormRequestSubmit.mjs";
9
12
  export {
10
13
  e as FormNonFieldErrorMarker,
11
- s as FormNonFieldErrorMarkerHtmlAttribute,
12
- m as useFormErrorOrphansToConsoleError,
13
- p as useFormErrorsEffect,
14
- x as useFormErrorsOnChange,
15
- u as useFormOrphanErrors,
16
- i as useFormRequestSubmit,
17
- F as useFormRootFieldErrors
14
+ t as FormNonFieldErrorMarkerHtmlAttribute,
15
+ n as useFormErrorConsoleDebug,
16
+ i as useFormErrorsEffect,
17
+ f as useFormErrorsHasOnlyOrphans,
18
+ h as useFormErrorsIfAny,
19
+ C as useFormErrorsOnChange,
20
+ k as useFormRequestSubmit,
21
+ u as useOrphanFormErrors,
22
+ d as useOrphanFormErrorsToConsoleError,
23
+ F as useRootFormFieldErrors
18
24
  };
@@ -0,0 +1,4 @@
1
+ const i = (t) => JSON.stringify(t) === "{}";
2
+ export {
3
+ i as isEmptyObject
4
+ };
@@ -0,0 +1,15 @@
1
+ import { FieldErrors } from 'react-hook-form';
2
+
3
+ /**
4
+ * Only flattens a {@link FieldErrors} object.
5
+ * @returns e.g.,
6
+ * ```
7
+ * {
8
+ * "address.street.type": "too_short",
9
+ * "address.street.ref.value": "123",
10
+ * "address.street.message": "Required."
11
+ * }
12
+ * ```
13
+ */
14
+ declare const flattenFieldErrors: (errors: FieldErrors) => Record<string, unknown>;
15
+ export default flattenFieldErrors;
@@ -0,0 +1,17 @@
1
+ import { FieldError, FieldErrors } from 'react-hook-form';
2
+
3
+ export type FlatFieldErrors = Record<string, FieldError>;
4
+ /**
5
+ * Get {@link FlatFieldErrors} from {@link FieldErrors}.
6
+ * This makes it easy to work with potentially deeply-nested {@link FieldErrors}.
7
+ *
8
+ * @param errors {@link FieldErrors} object.
9
+ * @returns FlatFieldErrors object.
10
+ *
11
+ * e.g.,
12
+ * ```
13
+ * [ "address.street", { "address.street": { type: "too_short", ref: { value: "123" }, message: "Required." } } ]
14
+ * ```
15
+ */
16
+ declare const getFlatFieldErrors: (errors: FieldErrors) => FlatFieldErrors;
17
+ export default getFlatFieldErrors;
@@ -1,5 +1,7 @@
1
1
  /**
2
2
  * HTML data attribute for {@link FormNonFieldErrorMarker}.
3
3
  */
4
- export declare const FormNonFieldErrorMarkerHtmlAttribute = "data-paragrav-rhf-utils-nonfield-error-marker-path";
4
+ declare const FormNonFieldErrorMarkerHtmlAttribute = "data-paragrav-rhf-utils-nonfield-error-marker-path";
5
+ export default FormNonFieldErrorMarkerHtmlAttribute;
5
6
  export declare const getFormNonFieldErrorMarkerQuerySelector: (path: string) => string;
7
+ export declare const hasNonFieldErrorMarkerInDOM: (path: string, parentElement: Pick<HTMLElement, 'querySelector'>) => Element | null;
@@ -1,10 +1,18 @@
1
- import { FieldError, FieldErrors } from 'react-hook-form';
1
+ import { FieldError } from 'react-hook-form';
2
2
 
3
3
  /**
4
- * @returns A flattened {@link FieldErrors} record. (e.g. `{ "address.street": FieldError }`)
4
+ * Determine if {@link FieldError} is a non-field error (i.e., has `ref`).
5
+ *
6
+ * A non-field error has no association to an input via {@link FieldError.ref}.
7
+ *
8
+ * These fall into one of two categories:
9
+ * - Root, which are typically displayed to user at bottom/top of form.
10
+ * - Non-root, which fall into two main sub-sets:
11
+ * - Non-orphan (displayed -- typically manually)
12
+ * - e.g., array min/max validation
13
+ * - Orphan (undisplayed), which are typically caused by one of the following cases:
14
+ * - The input is missing.
15
+ * - The schema is incorrect.
16
+ * - The error is not displayed to user with `FormErrorNonFieldMarker`.
5
17
  */
6
- export declare const getNonFieldErrorRecordByFilter: (errors: FieldErrors, where?: ((path: string, flattenedErrors: Record<string, unknown>) => boolean) | undefined) => Record<string, FieldError>;
7
- /**
8
- * @returns An array of field errors. (Not a record.)
9
- */
10
- export declare const getNonFieldErrorListByFilter: (errors: FieldErrors, where?: ((path: string, flattenedErrors: Record<string, unknown>) => boolean) | undefined) => FieldError[];
18
+ export declare const isNonFieldError: (error: FieldError) => boolean;
@@ -0,0 +1,2 @@
1
+ declare const useFormErrorsHasOnlyOrphans: (formRef: React.RefObject<HTMLFormElement>) => boolean;
2
+ export default useFormErrorsHasOnlyOrphans;
@@ -0,0 +1,4 @@
1
+ import { default as React } from 'react';
2
+
3
+ declare const useOrphanFormErrors: (formRef: React.RefObject<HTMLFormElement>) => import('../getFlatFieldErrors').FlatFieldErrors;
4
+ export default useOrphanFormErrors;
@@ -0,0 +1,8 @@
1
+ import { default as React } from 'react';
2
+
3
+ /**
4
+ * Outputs orphan errors to `console.error` all errors with `ref: undefined` that do not begin with `root(.*)`.
5
+ * Sentry (or equivalent) should capture.
6
+ */
7
+ declare const useOrphanFormErrorsToConsoleError: (formRef: React.RefObject<HTMLFormElement>) => void;
8
+ export default useOrphanFormErrorsToConsoleError;
@@ -0,0 +1,4 @@
1
+ import { FlatFieldErrors } from '../getFlatFieldErrors';
2
+ import { FieldErrors } from 'react-hook-form';
3
+
4
+ export declare const getOrphanFlatFieldErrors: (errors: FieldErrors, parentElement: Pick<HTMLElement, 'querySelector'>) => FlatFieldErrors;
@@ -0,0 +1,6 @@
1
+ /**
2
+ * Root field errors from form.
3
+ * These are typically displayed at the bottom of the form.
4
+ */
5
+ declare const useRootFormFieldErrors: () => import('../getFlatFieldErrors').FlatFieldErrors;
6
+ export default useRootFormFieldErrors;
@@ -1,3 +1,4 @@
1
+ import { FlatFieldErrors } from '../getFlatFieldErrors';
1
2
  import { FieldErrors } from 'react-hook-form';
2
3
 
3
4
  /**
@@ -5,4 +6,7 @@ import { FieldErrors } from 'react-hook-form';
5
6
  * @param path Flat path. (e.g., 'root.nested')
6
7
  */
7
8
  export declare const isFormErrorPathRoot: (path: string) => boolean;
8
- export declare const getRootFieldErrorList: (errors: FieldErrors) => import('react-hook-form').FieldError[];
9
+ /**
10
+ *
11
+ */
12
+ export declare const getRootFlatFieldErrors: (errors: FieldErrors) => FlatFieldErrors;
@@ -0,0 +1,8 @@
1
+ /**
2
+ * Output form errors to console.debug() for easier debugging for certain condition.
3
+ * (e.g., in dev/staging environments or certain users)
4
+ *
5
+ * `console.debug()` is unlikely to trigger any automated console capture reporting.
6
+ */
7
+ declare const useFormErrorConsoleDebug: (condition: boolean) => void;
8
+ export default useFormErrorConsoleDebug;
@@ -0,0 +1,6 @@
1
+ /**
2
+ * Returns errors only if there are errors.
3
+ * Allows simple typeguard without `isEmpty` dependency.
4
+ */
5
+ declare const useFormErrorsIfAny: () => false | import('react-hook-form').FieldErrors<import("react-hook-form").FieldValues>;
6
+ export default useFormErrorsIfAny;
@@ -0,0 +1,5 @@
1
+ /**
2
+ * Use {@link FieldErrors} as {@link FlatFieldErrors}.
3
+ */
4
+ declare const useFormFlatFieldErrors: () => import('./getFlatFieldErrors').FlatFieldErrors;
5
+ export default useFormFlatFieldErrors;
@@ -1,8 +1,11 @@
1
1
  export { default as FormNonFieldErrorMarker } from './errors/nonfield/FormNonFieldErrorMarker';
2
- export { FormNonFieldErrorMarkerHtmlAttribute } from './errors/nonfield/FormNonFieldErrorMarker.utils';
3
- export { default as useFormErrorOrphansToConsoleError } from './errors/orphans/useFormErrorOrphansToConsoleError';
4
- export { default as useFormOrphanErrors } from './errors/orphans/useFormOrphanErrors';
5
- export { default as useFormRootFieldErrors } from './errors/root/useFormRootFieldErrors';
2
+ export { default as FormNonFieldErrorMarkerHtmlAttribute } from './errors/nonfield/FormNonFieldErrorMarker.utils';
3
+ export { default as useFormErrorsHasOnlyOrphans } from './errors/orphan/useFormErrorsHasOnlyOrphans';
4
+ export { default as useOrphanFormErrors } from './errors/orphan/useOrphanFormErrors';
5
+ export { default as useOrphanFormErrorsToConsoleError } from './errors/orphan/useOrphanFormErrorsToConsoleError';
6
+ export { default as useRootFormFieldErrors } from './errors/root/useRootFormFieldErrors';
7
+ export { default as useFormErrorConsoleDebug } from './errors/useFormErrorConsoleDebug';
6
8
  export { default as useFormErrorsEffect } from './errors/useFormErrorsEffect';
9
+ export { default as useFormErrorsIfAny } from './errors/useFormErrorsIfAny';
7
10
  export { default as useFormErrorsOnChange } from './errors/useFormErrorsOnChange';
8
11
  export { default as useFormRequestSubmit } from './errors/useFormRequestSubmit';
@@ -0,0 +1 @@
1
+ export declare const isEmptyObject: (obj: Record<string, unknown>) => boolean;
package/package.json CHANGED
@@ -2,9 +2,10 @@
2
2
  "name": "@paragrav/rhf-utils",
3
3
  "author": "paragrav.dev",
4
4
  "license": "MIT",
5
- "version": "0.0.18",
5
+ "version": "0.0.20",
6
6
  "description": "Integration utilities for react-hook-form.",
7
7
  "type": "module",
8
+ "sideEffects": false,
8
9
  "files": [
9
10
  "dist"
10
11
  ],
@@ -12,17 +13,66 @@
12
13
  "module": "./dist/esm/main.mjs",
13
14
  "exports": {
14
15
  ".": {
15
- "require": {
16
- "types": "./dist/types/main.d.ts",
17
- "default": "./dist/cjs/main.js"
18
- },
19
- "import": {
20
- "types": "./dist/types/main.d.ts",
21
- "default": "./dist/esm/main.mjs"
22
- }
16
+ "import": "./dist/esm/main.mjs",
17
+ "require": "./dist/cjs/main.js",
18
+ "types": "./dist/types/main.d.ts"
19
+ },
20
+ "./errors/useFormErrorConsoleDebug": {
21
+ "import": "./dist/esm/errors/useFormErrorConsoleDebug.mjs",
22
+ "require": "./dist/cjs/errors/useFormErrorConsoleDebug.cjs",
23
+ "types": "./dist/types/errors/useFormErrorConsoleDebug.d.ts"
24
+ },
25
+ "./errors/useFormErrorsEffect": {
26
+ "import": "./dist/esm/errors/useFormErrorsEffect.mjs",
27
+ "require": "./dist/cjs/errors/useFormErrorsEffect.cjs",
28
+ "types": "./dist/types/errors/useFormErrorsEffect.d.ts"
29
+ },
30
+ "./errors/useFormErrorsIfAny": {
31
+ "import": "./dist/esm/errors/useFormErrorsIfAny.mjs",
32
+ "require": "./dist/cjs/errors/useFormErrorsIfAny.cjs",
33
+ "types": "./dist/types/errors/useFormErrorsIfAny.d.ts"
34
+ },
35
+ "./errors/useFormErrorsOnChange": {
36
+ "import": "./dist/esm/errors/useFormErrorsOnChange.mjs",
37
+ "require": "./dist/cjs/errors/useFormErrorsOnChange.cjs",
38
+ "types": "./dist/types/errors/useFormErrorsOnChange.d.ts"
39
+ },
40
+ "./errors/useFormRequestSubmit": {
41
+ "import": "./dist/esm/errors/useFormRequestSubmit.mjs",
42
+ "require": "./dist/cjs/errors/useFormRequestSubmit.cjs",
43
+ "types": "./dist/types/errors/useFormRequestSubmit.d.ts"
44
+ },
45
+ "./errors/FormNonFieldErrorMarker": {
46
+ "import": "./dist/esm/errors/nonfield/FormNonFieldErrorMarker.mjs",
47
+ "require": "./dist/cjs/errors/nonfield/FormNonFieldErrorMarker.cjs",
48
+ "types": "./dist/types/errors/nonfield/FormNonFieldErrorMarker.d.ts"
49
+ },
50
+ "./errors/FormNonFieldErrorMarkerHtmlAttribute": {
51
+ "import": "./dist/esm/errors/nonfield/FormNonFieldErrorMarker.utils.mjs",
52
+ "require": "./dist/cjs/errors/nonfield/FormNonFieldErrorMarker.utils.cjs",
53
+ "types": "./dist/types/errors/nonfield/FormNonFieldErrorMarker.utils.d.ts"
54
+ },
55
+ "./errors/useOrphanFormErrorsToConsoleError": {
56
+ "import": "./dist/esm/errors/orphan/useOrphanFormErrorsToConsoleError.mjs",
57
+ "require": "./dist/cjs/errors/orphan/useOrphanFormErrorsToConsoleError.cjs",
58
+ "types": "./dist/types/errors/orphan/useOrphanFormErrorsToConsoleError.d.ts"
59
+ },
60
+ "./errors/useFormErrorsHasOnlyOrphans": {
61
+ "import": "./dist/esm/errors/orphan/useFormErrorsHasOnlyOrphans.mjs",
62
+ "require": "./dist/cjs/errors/orphan/useFormErrorsHasOnlyOrphans.cjs",
63
+ "types": "./dist/types/errors/orphan/useFormErrorsHasOnlyOrphans.d.ts"
64
+ },
65
+ "./errors/useOrphanFormErrors": {
66
+ "import": "./dist/esm/errors/orphan/useOrphanFormErrors.mjs",
67
+ "require": "./dist/cjs/errors/orphan/useOrphanFormErrors.cjs",
68
+ "types": "./dist/types/errors/orphan/useOrphanFormErrors.d.ts"
69
+ },
70
+ "./errors/useRootFormFieldErrors": {
71
+ "import": "./dist/esm/errors/root/useRootFormFieldErrors.mjs",
72
+ "require": "./dist/cjs/errors/root/useRootFormFieldErrors.cjs",
73
+ "types": "./dist/types/errors/root/useRootFormFieldErrors.d.ts"
23
74
  }
24
75
  },
25
- "sideEffects": false,
26
76
  "scripts": {
27
77
  "build": "npm run validate && npm run build:cjs && npm run build:esm",
28
78
  "build:cjs": "tsc -p ./tsconfig.cjs.json",
@@ -37,10 +87,9 @@
37
87
  "tsc": "tsc",
38
88
  "validate": "npm run tsc & npm run lint & npm run test & npm run test:ct"
39
89
  },
40
- "dependencies": {
41
- "flat": "^6.0.1"
42
- },
43
90
  "peerDependencies": {
91
+ "flat": "^6",
92
+ "react": "^18",
44
93
  "react-hook-form": "^7"
45
94
  },
46
95
  "devDependencies": {
@@ -58,10 +107,10 @@
58
107
  "eslint-plugin-react": "^7.34.1",
59
108
  "eslint-plugin-react-hooks": "^4.6.0",
60
109
  "eslint-plugin-simple-import-sort": "^12.0.0",
110
+ "happy-dom": "^14.3.9",
61
111
  "husky": "^9.0.11",
62
112
  "lint-staged": "^15.2.2",
63
113
  "prettier": "^3.2.5",
64
- "react": "^18.2.0",
65
114
  "react-dom": "^18.2.0",
66
115
  "rollup": "^4.13.0",
67
116
  "typescript": "^5.4.3",
@@ -1,14 +0,0 @@
1
- /// <reference types="react" />
2
- type Props = {
3
- /** Flat field name. (e.g., `address.street`) */
4
- path: string;
5
- };
6
- /**
7
- * Empty, hidden marker to indicate a non-field error is presented to user.
8
- */
9
- declare const FormErrorNonFieldMarker: React.FC<Props>;
10
- export default FormErrorNonFieldMarker;
11
- /**
12
- * HTML data attribute for {@link FormErrorNonFieldMarker}.
13
- */
14
- export declare const FormErrorNonFieldMarkerHtmlAttribute = "data-paragrav-rhf-utils-marker-path";
@@ -1,20 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.FormErrorNonFieldMarkerHtmlAttribute = void 0;
4
- const jsx_runtime_1 = require("react/jsx-runtime");
5
- /**
6
- * Empty, hidden marker to indicate a non-field error is presented to user.
7
- */
8
- const FormErrorNonFieldMarker = ({ path }) => {
9
- const attribute = {
10
- [exports.FormErrorNonFieldMarkerHtmlAttribute]: path,
11
- };
12
- return ((0, jsx_runtime_1.jsx)("div", { role: "alert", "aria-hidden": "true" // hide from screen readers
13
- , style: { display: 'none' }, ...attribute }));
14
- };
15
- exports.default = FormErrorNonFieldMarker;
16
- // utils
17
- /**
18
- * HTML data attribute for {@link FormErrorNonFieldMarker}.
19
- */
20
- exports.FormErrorNonFieldMarkerHtmlAttribute = 'data-paragrav-rhf-utils-marker-path';
@@ -1,9 +0,0 @@
1
- import React from 'react';
2
- /**
3
- * Orphans are field errors that do not have a ref.
4
- * (Most commonly `root(.*)`, but these are filtered out. They are handled by `useFormRootFieldErrors`.)
5
- * Outputs to `console.error` all errors with `ref: undefined` that do not begin with `root(.*)`.
6
- * Sentry (or equivalent) should capture.
7
- */
8
- declare const useFormErrorOrphansToConsoleError: (formRef: React.RefObject<HTMLFormElement>) => void;
9
- export default useFormErrorOrphansToConsoleError;
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- declare const useFormOrphanErrors: (formRef: React.RefObject<HTMLFormElement>) => Record<string, import("react-hook-form").FieldError>;
3
- export default useFormOrphanErrors;
@@ -1,17 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- const useFormErrorsOnChange_1 = __importDefault(require("../useFormErrorsOnChange"));
7
- const utils_1 = require("./utils");
8
- const useFormOrphanErrors = (formRef) => (0, useFormErrorsOnChange_1.default)((errors) => {
9
- if (JSON.stringify(errors) === '{}')
10
- return {};
11
- if (!formRef.current) {
12
- console.error(errors);
13
- throw new Error('This should not happen.');
14
- }
15
- return (0, utils_1.getOrphanFieldErrorsWithMarkerCheck)(errors, formRef.current);
16
- });
17
- exports.default = useFormOrphanErrors;
@@ -1,15 +0,0 @@
1
- import type { FieldErrors } from 'react-hook-form';
2
- /**
3
- * Get flat record of orphan errors -- i.e., non-field, non-root and not displayed to user using {@link FormNonFieldErrorMarker}.
4
- * @param fieldErrors
5
- * @param formElement Ref to form element for scoped `querySelector`.
6
- * @returns
7
- */
8
- export declare const getOrphanFieldErrorsWithMarkerCheck: (fieldErrors: FieldErrors, formElement: HTMLFormElement) => Record<string, import("react-hook-form").FieldError>;
9
- /**
10
- * Get non-field errors that are not root errors.
11
- *
12
- * NOTE: This is an intermediary function used by {@link getOrphanFieldErrorsWithMarkerCheck}.
13
- * It is exported for sake of testing.
14
- */
15
- export declare const getNonFieldNonRootErrors: (errors: FieldErrors) => Record<string, import("react-hook-form").FieldError>;
@@ -1,27 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.getNonFieldNonRootErrors = exports.getOrphanFieldErrorsWithMarkerCheck = void 0;
4
- const FormNonFieldErrorMarker_utils_1 = require("../nonfield/FormNonFieldErrorMarker.utils");
5
- const utils_1 = require("../nonfield/utils");
6
- const utils_2 = require("../root/utils");
7
- /**
8
- * Get flat record of orphan errors -- i.e., non-field, non-root and not displayed to user using {@link FormNonFieldErrorMarker}.
9
- * @param fieldErrors
10
- * @param formElement Ref to form element for scoped `querySelector`.
11
- * @returns
12
- */
13
- const getOrphanFieldErrorsWithMarkerCheck = (fieldErrors, formElement) => {
14
- const nonFieldNonRootErrors = (0, exports.getNonFieldNonRootErrors)(fieldErrors);
15
- return (0, utils_1.getNonFieldErrorRecordByFilter)(nonFieldNonRootErrors, (path) =>
16
- // if doesn't have alert, then it's an orphan
17
- !formElement.querySelector((0, FormNonFieldErrorMarker_utils_1.getFormNonFieldErrorMarkerQuerySelector)(path)));
18
- };
19
- exports.getOrphanFieldErrorsWithMarkerCheck = getOrphanFieldErrorsWithMarkerCheck;
20
- /**
21
- * Get non-field errors that are not root errors.
22
- *
23
- * NOTE: This is an intermediary function used by {@link getOrphanFieldErrorsWithMarkerCheck}.
24
- * It is exported for sake of testing.
25
- */
26
- const getNonFieldNonRootErrors = (errors) => (0, utils_1.getNonFieldErrorRecordByFilter)(errors, (path) => !(0, utils_2.isFormErrorPathRoot)(path));
27
- exports.getNonFieldNonRootErrors = getNonFieldNonRootErrors;
@@ -1,6 +0,0 @@
1
- /**
2
- * Root field errors from form.
3
- * These are typically displayed at the bottom of the form.
4
- */
5
- declare const useFormRootFieldErrors: () => import("react-hook-form").FieldError[];
6
- export default useFormRootFieldErrors;
@@ -1,2 +0,0 @@
1
- declare const useFormRootFieldErrors: () => import("react-hook-form").FieldError[];
2
- export default useFormRootFieldErrors;
@@ -1,9 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- const useFormErrorsOnChange_1 = __importDefault(require("../useFormErrorsOnChange"));
7
- const utils_1 = require("./utils");
8
- const useFormRootFieldErrors = () => (0, useFormErrorsOnChange_1.default)(utils_1.getRootFieldErrorList);
9
- exports.default = useFormRootFieldErrors;