@paragrav/rhf-utils 0.0.17 → 0.0.18

package/dist/cjs/errors/nonfield/FormNonFieldErrorMarker.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+type Props = {
+    /** Flat field name. (e.g., `address.street`) */
+    path: string;
+};
+/**
+ * Empty, hidden marker to indicate a non-field error is presented to user.
+ */
+declare const FormNonFieldErrorMarker: React.FC<Props>;
+export default FormNonFieldErrorMarker;

package/dist/cjs/errors/nonfield/FormNonFieldErrorMarker.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const FormNonFieldErrorMarker_utils_1 = require("./FormNonFieldErrorMarker.utils");
+/**
+ * Empty, hidden marker to indicate a non-field error is presented to user.
+ */
+const FormNonFieldErrorMarker = ({ path }) => {
+    const attribute = {
+        [FormNonFieldErrorMarker_utils_1.FormNonFieldErrorMarkerHtmlAttribute]: path,
+    };
+    return ((0, jsx_runtime_1.jsx)("div", { role: "alert", "aria-hidden": "true" // hide from screen readers
+        , style: { display: 'none' }, ...attribute }));
+};
+exports.default = FormNonFieldErrorMarker;

package/dist/cjs/errors/nonfield/FormNonFieldErrorMarker.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/errors/nonfield/FormNonFieldErrorMarker.spec.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const experimental_ct_react_1 = require("@playwright/experimental-ct-react");
+const FormNonFieldErrorMarker_1 = __importDefault(require("./FormNonFieldErrorMarker"));
+const FormNonFieldErrorMarker_utils_1 = require("./FormNonFieldErrorMarker.utils");
+const path = 'test';
+const querySelector = (0, FormNonFieldErrorMarker_utils_1.getFormNonFieldErrorMarkerQuerySelector)(path);
+(0, experimental_ct_react_1.test)('FormNonFieldErrorMarker can be located via query', async ({ page, mount, }) => {
+    await mount((0, jsx_runtime_1.jsx)(FormNonFieldErrorMarker_1.default, { path: path }));
+    await (0, experimental_ct_react_1.expect)(page.locator(querySelector)).toBeAttached();
+});

package/dist/cjs/errors/nonfield/FormNonFieldErrorMarker.utils.d.ts

@@ -0,0 +1,5 @@
+/**
+ * HTML data attribute for {@link FormNonFieldErrorMarker}.
+ */
+export declare const FormNonFieldErrorMarkerHtmlAttribute = "data-paragrav-rhf-utils-nonfield-error-marker-path";
+export declare const getFormNonFieldErrorMarkerQuerySelector: (path: string) => string;

package/dist/cjs/errors/nonfield/FormNonFieldErrorMarker.utils.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getFormNonFieldErrorMarkerQuerySelector = exports.FormNonFieldErrorMarkerHtmlAttribute = void 0;
+/**
+ * HTML data attribute for {@link FormNonFieldErrorMarker}.
+ */
+exports.FormNonFieldErrorMarkerHtmlAttribute = 'data-paragrav-rhf-utils-nonfield-error-marker-path';
+const getFormNonFieldErrorMarkerQuerySelector = (path) => `[role="alert"][${exports.FormNonFieldErrorMarkerHtmlAttribute}="${path}"]`;
+exports.getFormNonFieldErrorMarkerQuerySelector = getFormNonFieldErrorMarkerQuerySelector;

package/dist/cjs/errors/nonfield/utils.d.ts

@@ -0,0 +1,9 @@
+import type { FieldError, FieldErrors } from 'react-hook-form';
+/**
+ * @returns A flattened {@link FieldErrors} record. (e.g. `{ "address.street": FieldError }`)
+ */
+export declare const getNonFieldErrorRecordByFilter: (errors: FieldErrors, where?: ((path: string, flattenedErrors: Record<string, unknown>) => boolean) | undefined) => Record<string, FieldError>;
+/**
+ * @returns An array of field errors. (Not a record.)
+ */
+export declare const getNonFieldErrorListByFilter: (errors: FieldErrors, where?: ((path: string, flattenedErrors: Record<string, unknown>) => boolean) | undefined) => FieldError[];

package/dist/cjs/errors/nonfield/utils.js

@@ -0,0 +1,78 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getNonFieldErrorListByFilter = exports.getNonFieldErrorRecordByFilter = void 0;
+const flat_1 = require("flat");
+const react_hook_form_1 = require("react-hook-form");
+/**
+ * @returns A flattened {@link FieldErrors} record. (e.g. `{ "address.street": FieldError }`)
+ */
+const getNonFieldErrorRecordByFilter = (errors, where) => {
+    const keys = getNonFieldErrorPathsByFilter(errors, where);
+    const record = keys.reduce((acc, path) => {
+        acc[path] = (0, react_hook_form_1.get)(errors, path);
+        return acc;
+    }, {});
+    return record;
+};
+exports.getNonFieldErrorRecordByFilter = getNonFieldErrorRecordByFilter;
+/**
+ * @returns An array of field errors. (Not a record.)
+ */
+const getNonFieldErrorListByFilter = (errors, where) => {
+    const keys = getNonFieldErrorPathsByFilter(errors, where);
+    const fieldErrors = keys.map((key) => {
+        return (0, react_hook_form_1.get)(errors, key);
+    });
+    return fieldErrors;
+};
+exports.getNonFieldErrorListByFilter = getNonFieldErrorListByFilter;
+/**
+ * Retrieve non-field error paths from {@link FieldErrors} object.
+ *
+ * Non-field errors are those without an association to an input via {@link FieldError.ref}.
+ *
+ * These fall into one of three categories:
+ * - Root errors, which are displayed to user at bottom/top of form.
+ * - Non-field errors (e.g., array min/max validation), which are typically displayed manually to user near relevant fields.
+ *   - Orphan error occurs when a non-field error has not been displayed to user.
+ *     - This is typically caused by one of the following cases:
+ *       - 1. The input is missing.
+ *       - 3. The schema is incorrect.
+ *       - 2. The non-field error is not displayed to user with `FormErrorNonFieldMarker`.
+ *
+ * RHF uses deeply-nested object for errors, which reflects the structure of the form.
+ * And the type is quite complex. All this complicates the process of finding errors.
+ * This function automatically looks only for keys that end with `.ref`.
+ * (This makes sure we only look at the leaf nodes of the object tree.)
+ * This function also automatically removes the `.ref` suffix from the keys.
+ *
+ * @param where Filter callback.
+ * @param map Transformer callback.
+ * @returns Tuple of field errors and keys.
+ */
+const getNonFieldErrorPathsByFilter = (errors, where) => {
+    /**
+     * e.g.:
+     * ```js
+     * { root: { ref: undefined, message: 'Form is invalid.' }, email: { ref: Object, message: 'Invalid.' } }
+     * ```
+     * flattens to:
+     * ```js
+     * { 'root.ref': undefined, 'root.message': 'Form is invalid.', 'email.ref': Object, 'email.message': 'Invalid.' }
+     * ```
+     * returns (if no additional filter/map specified)
+     * ```js
+     * [ 'root', 'email' ]
+     * ```
+     */
+    const flattenedErrors = (0, flat_1.flatten)(errors);
+    const flattenedErrorObjectKeys = Object.keys(flattenedErrors);
+    // look for leaf node, which would have ref prop (e.g., `orphan_field.ref`)
+    const flattenedErrorObjectKeysEndingWithDotRef = flattenedErrorObjectKeys.filter((key) => key.match(regexEndsWithDotRef));
+    // remove `.ref` suffix to get flat field path (e.g., `name`, `address.street`)
+    const paths = flattenedErrorObjectKeysEndingWithDotRef.map((flattenedKey) => flattenedKey.replace(regexEndsWithDotRef, ''));
+    // filter via callback
+    const flattenedKeysFiltered = paths.filter((path) => where ? where(path, flattenedErrors) : true);
+    return flattenedKeysFiltered;
+};
+const regexEndsWithDotRef = /\.ref$/;

package/dist/cjs/errors/orphans/useFormOrphanErrors.d.ts

@@ -1,8 +1,3 @@
 import React from 'react';
-/**
- * Root field errors from form.
- * These are typically displayed at the bottom of the form.
- * (Root errors have to processed this way due to (potentially) recursive types.)
- */
 declare const useFormOrphanErrors: (formRef: React.RefObject<HTMLFormElement>) => Record<string, import("react-hook-form").FieldError>;
 export default useFormOrphanErrors;

package/dist/cjs/errors/orphans/useFormOrphanErrors.js

@@ -5,11 +5,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const useFormErrorsOnChange_1 = __importDefault(require("../useFormErrorsOnChange"));
 const utils_1 = require("./utils");
-/**
- * Root field errors from form.
- * These are typically displayed at the bottom of the form.
- * (Root errors have to processed this way due to (potentially) recursive types.)
- */
 const useFormOrphanErrors = (formRef) => (0, useFormErrorsOnChange_1.default)((errors) => {
     if (JSON.stringify(errors) === '{}')
         return {};

package/dist/cjs/errors/orphans/utils.d.ts

@@ -1,3 +1,15 @@
 import type { FieldErrors } from 'react-hook-form';
-export declare const getOrphanFieldErrors: (errors: FieldErrors) => Record<string, import("react-hook-form").FieldError>;
-export declare const getOrphanFieldErrorsWithMarkerCheck: (errors: FieldErrors, formElement: HTMLFormElement) => Record<string, import("react-hook-form").FieldError>;
+/**
+ * Get flat record of orphan errors -- i.e., non-field, non-root and not displayed to user using {@link FormNonFieldErrorMarker}.
+ * @param fieldErrors
+ * @param formElement Ref to form element for scoped `querySelector`.
+ * @returns
+ */
+export declare const getOrphanFieldErrorsWithMarkerCheck: (fieldErrors: FieldErrors, formElement: HTMLFormElement) => Record<string, import("react-hook-form").FieldError>;
+/**
+ * Get non-field errors that are not root errors.
+ *
+ * NOTE: This is an intermediary function used by {@link getOrphanFieldErrorsWithMarkerCheck}.
+ * It is exported for sake of testing.
+ */
+export declare const getNonFieldNonRootErrors: (errors: FieldErrors) => Record<string, import("react-hook-form").FieldError>;

package/dist/cjs/errors/orphans/utils.js

@@ -1,20 +1,27 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getOrphanFieldErrorsWithMarkerCheck = exports.getOrphanFieldErrors = void 0;
-const utils_1 = require("../roots/utils");
-const utils_2 = require("../utils");
-const FormErrorNonFieldMarker_1 = require("./FormErrorNonFieldMarker");
-const getOrphanFieldErrors = (errors) => (0, utils_2.getFieldErrorsByFilter)(errors, (path, flattenedErrors) => {
-    return (flattenedErrors[path + '.ref'] === undefined && // no ref
-        !(0, utils_1.isFormErrorPathRoot)(path) // ignore root errors, which are always orphans
-    );
-});
-exports.getOrphanFieldErrors = getOrphanFieldErrors;
-const getOrphanFieldErrorsWithMarkerCheck = (errors, formElement) => {
-    const orphanErrors = (0, exports.getOrphanFieldErrors)(errors);
-    return (0, utils_2.getFieldErrorsByFilter)(orphanErrors, 
+exports.getNonFieldNonRootErrors = exports.getOrphanFieldErrorsWithMarkerCheck = void 0;
+const FormNonFieldErrorMarker_utils_1 = require("../nonfield/FormNonFieldErrorMarker.utils");
+const utils_1 = require("../nonfield/utils");
+const utils_2 = require("../root/utils");
+/**
+ * Get flat record of orphan errors -- i.e., non-field, non-root and not displayed to user using {@link FormNonFieldErrorMarker}.
+ * @param fieldErrors
+ * @param formElement Ref to form element for scoped `querySelector`.
+ * @returns
+ */
+const getOrphanFieldErrorsWithMarkerCheck = (fieldErrors, formElement) => {
+    const nonFieldNonRootErrors = (0, exports.getNonFieldNonRootErrors)(fieldErrors);
+    return (0, utils_1.getNonFieldErrorRecordByFilter)(nonFieldNonRootErrors, (path) => 
     // if doesn't have alert, then it's an orphan
-    (path) => !formElement.querySelector(`[role="alert"][${FormErrorNonFieldMarker_1.FormErrorNonFieldMarkerHtmlAttribute}="${path}"]`));
+    !formElement.querySelector((0, FormNonFieldErrorMarker_utils_1.getFormNonFieldErrorMarkerQuerySelector)(path)));
 };
 exports.getOrphanFieldErrorsWithMarkerCheck = getOrphanFieldErrorsWithMarkerCheck;
-//
+/**
+ * Get non-field errors that are not root errors.
+ *
+ * NOTE: This is an intermediary function used by {@link getOrphanFieldErrorsWithMarkerCheck}.
+ * It is exported for sake of testing.
+ */
+const getNonFieldNonRootErrors = (errors) => (0, utils_1.getNonFieldErrorRecordByFilter)(errors, (path) => !(0, utils_2.isFormErrorPathRoot)(path));
+exports.getNonFieldNonRootErrors = getNonFieldNonRootErrors;

package/dist/cjs/errors/root/useFormRootFieldErrors.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Root field errors from form.
+ * These are typically displayed at the bottom of the form.
+ */
+declare const useFormRootFieldErrors: () => import("react-hook-form").FieldError[];
+export default useFormRootFieldErrors;

package/dist/cjs/errors/root/useFormRootFieldErrors.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const useFormErrorsOnChange_1 = __importDefault(require("../useFormErrorsOnChange"));
+const utils_1 = require("./utils");
+/**
+ * Root field errors from form.
+ * These are typically displayed at the bottom of the form.
+ */
+const useFormRootFieldErrors = () => (0, useFormErrorsOnChange_1.default)(utils_1.getRootFieldErrorList);
+exports.default = useFormRootFieldErrors;

package/dist/cjs/errors/root/utils.d.ts

@@ -0,0 +1,7 @@
+import type { FieldErrors } from 'react-hook-form';
+/**
+ * Determine if an error path is root. (e.g., `root` or `root.nested`)
+ * @param path Flat path. (e.g., 'root.nested')
+ */
+export declare const isFormErrorPathRoot: (path: string) => boolean;
+export declare const getRootFieldErrorList: (errors: FieldErrors) => import("react-hook-form").FieldError[];

package/dist/cjs/errors/root/utils.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getRootFieldErrorList = exports.isFormErrorPathRoot = void 0;
+const utils_1 = require("../nonfield/utils");
+const ROOT = 'root';
+/**
+ * Determine if an error path is root. (e.g., `root` or `root.nested`)
+ * @param path Flat path. (e.g., 'root.nested')
+ */
+const isFormErrorPathRoot = (path) => path === ROOT || path.startsWith(ROOT + '.');
+exports.isFormErrorPathRoot = isFormErrorPathRoot;
+const getRootFieldErrorList = (errors) => (0, utils_1.getNonFieldErrorListByFilter)(errors, exports.isFormErrorPathRoot);
+exports.getRootFieldErrorList = getRootFieldErrorList;

package/dist/cjs/main.d.ts

@@ -1,7 +1,8 @@
-export { default as FormErrorNonFieldMarker, FormErrorNonFieldMarkerHtmlAttribute as FormErrorNonFieldMarkerDataHtmlAttribute, } from './errors/orphans/FormErrorNonFieldMarker';
+export { default as FormNonFieldErrorMarker } from './errors/nonfield/FormNonFieldErrorMarker';
+export { FormNonFieldErrorMarkerHtmlAttribute } from './errors/nonfield/FormNonFieldErrorMarker.utils';
 export { default as useFormErrorOrphansToConsoleError } from './errors/orphans/useFormErrorOrphansToConsoleError';
 export { default as useFormOrphanErrors } from './errors/orphans/useFormOrphanErrors';
-export { default as useFormRootFieldErrors } from './errors/roots/useFormRootFieldErrors';
+export { default as useFormRootFieldErrors } from './errors/root/useFormRootFieldErrors';
 export { default as useFormErrorsEffect } from './errors/useFormErrorsEffect';
 export { default as useFormErrorsOnChange } from './errors/useFormErrorsOnChange';
 export { default as useFormRequestSubmit } from './errors/useFormRequestSubmit';

package/dist/cjs/main.js

@@ -3,15 +3,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFormRequestSubmit = exports.useFormErrorsOnChange = exports.useFormErrorsEffect = exports.useFormRootFieldErrors = exports.useFormOrphanErrors = exports.useFormErrorOrphansToConsoleError = exports.FormErrorNonFieldMarkerDataHtmlAttribute = exports.FormErrorNonFieldMarker = void 0;
-var FormErrorNonFieldMarker_1 = require("./errors/orphans/FormErrorNonFieldMarker");
-Object.defineProperty(exports, "FormErrorNonFieldMarker", { enumerable: true, get: function () { return __importDefault(FormErrorNonFieldMarker_1).default; } });
-Object.defineProperty(exports, "FormErrorNonFieldMarkerDataHtmlAttribute", { enumerable: true, get: function () { return FormErrorNonFieldMarker_1.FormErrorNonFieldMarkerHtmlAttribute; } });
+exports.useFormRequestSubmit = exports.useFormErrorsOnChange = exports.useFormErrorsEffect = exports.useFormRootFieldErrors = exports.useFormOrphanErrors = exports.useFormErrorOrphansToConsoleError = exports.FormNonFieldErrorMarkerHtmlAttribute = exports.FormNonFieldErrorMarker = void 0;
+var FormNonFieldErrorMarker_1 = require("./errors/nonfield/FormNonFieldErrorMarker");
+Object.defineProperty(exports, "FormNonFieldErrorMarker", { enumerable: true, get: function () { return __importDefault(FormNonFieldErrorMarker_1).default; } });
+var FormNonFieldErrorMarker_utils_1 = require("./errors/nonfield/FormNonFieldErrorMarker.utils");
+Object.defineProperty(exports, "FormNonFieldErrorMarkerHtmlAttribute", { enumerable: true, get: function () { return FormNonFieldErrorMarker_utils_1.FormNonFieldErrorMarkerHtmlAttribute; } });
 var useFormErrorOrphansToConsoleError_1 = require("./errors/orphans/useFormErrorOrphansToConsoleError");
 Object.defineProperty(exports, "useFormErrorOrphansToConsoleError", { enumerable: true, get: function () { return __importDefault(useFormErrorOrphansToConsoleError_1).default; } });
 var useFormOrphanErrors_1 = require("./errors/orphans/useFormOrphanErrors");
 Object.defineProperty(exports, "useFormOrphanErrors", { enumerable: true, get: function () { return __importDefault(useFormOrphanErrors_1).default; } });
-var useFormRootFieldErrors_1 = require("./errors/roots/useFormRootFieldErrors");
+var useFormRootFieldErrors_1 = require("./errors/root/useFormRootFieldErrors");
 Object.defineProperty(exports, "useFormRootFieldErrors", { enumerable: true, get: function () { return __importDefault(useFormRootFieldErrors_1).default; } });
 var useFormErrorsEffect_1 = require("./errors/useFormErrorsEffect");
 Object.defineProperty(exports, "useFormErrorsEffect", { enumerable: true, get: function () { return __importDefault(useFormErrorsEffect_1).default; } });

package/dist/esm/errors/nonfield/FormNonFieldErrorMarker.mjs

@@ -0,0 +1,19 @@
+import { jsx as t } from "react/jsx-runtime";
+import { FormNonFieldErrorMarkerHtmlAttribute as e } from "./FormNonFieldErrorMarker.utils.mjs";
+const i = ({ path: r }) => {
+  const o = {
+    [e]: r
+  };
+  return /* @__PURE__ */ t(
+    "div",
+    {
+      role: "alert",
+      "aria-hidden": "true",
+      style: { display: "none" },
+      ...o
+    }
+  );
+}, l = i;
+export {
+  l as default
+};

package/dist/esm/errors/nonfield/FormNonFieldErrorMarker.utils.mjs

@@ -0,0 +1,5 @@
+const e = "data-paragrav-rhf-utils-nonfield-error-marker-path", o = (r) => `[role="alert"][${e}="${r}"]`;
+export {
+  e as FormNonFieldErrorMarkerHtmlAttribute,
+  o as getFormNonFieldErrorMarkerQuerySelector
+};

package/dist/esm/errors/nonfield/utils.mjs

@@ -0,0 +1,14 @@
+import { flatten as f } from "../../node_modules/flat/index.mjs";
+import { get as l } from "react-hook-form";
+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) => {
+  const n = f(e);
+  return Object.keys(n).filter((o) => o.match(d)).map(
+    (o) => o.replace(d, "")
+  ).filter(
+    (o) => t ? t(o, n) : !0
+  );
+}, d = /\.ref$/;
+export {
+  g as getNonFieldErrorListByFilter,
+  F as getNonFieldErrorRecordByFilter
+};

package/dist/esm/errors/orphans/utils.mjs

@@ -1,18 +1,17 @@
-import { isFormErrorPathRoot as l } from "../roots/utils.mjs";
-import { getFieldErrorsByFilter as t } from "../utils.mjs";
-import { FormErrorNonFieldMarkerHtmlAttribute as m } from "./FormErrorNonFieldMarker.mjs";
-const n = (o) => t(o, (r, e) => e[r + ".ref"] === void 0 && // no ref
-!l(r)), p = (o, r) => {
-  const e = n(o);
-  return t(
-    e,
-    // if doesn't have alert, then it's an orphan
-    (i) => !r.querySelector(
-      `[role="alert"][${m}="${i}"]`
+import { getFormNonFieldErrorMarkerQuerySelector as i } from "../nonfield/FormNonFieldErrorMarker.utils.mjs";
+import { getNonFieldErrorRecordByFilter as e } from "../nonfield/utils.mjs";
+import { isFormErrorPathRoot as l } from "../root/utils.mjs";
+const d = (r, o) => {
+  const t = m(r);
+  return e(
+    t,
+    (n) => (
+      // if doesn't have alert, then it's an orphan
+      !o.querySelector(i(n))
     )
   );
-};
+}, m = (r) => e(r, (o) => !l(o));
 export {
-  n as getOrphanFieldErrors,
-  p as getOrphanFieldErrorsWithMarkerCheck
+  m as getNonFieldNonRootErrors,
+  d as getOrphanFieldErrorsWithMarkerCheck
 };

package/dist/esm/errors/{roots → root}/utils.mjs

@@ -1,4 +1,4 @@
-import { getFieldErrorListByFilter as t } from "../utils.mjs";
+import { getNonFieldErrorListByFilter as t } from "../nonfield/utils.mjs";
 const r = "root", i = (o) => o === r || o.startsWith(r + "."), e = (o) => t(o, i);
 export {
   e as getRootFieldErrorList,

package/dist/esm/main.mjs

@@ -1,17 +1,18 @@
-import { default as e, FormErrorNonFieldMarkerHtmlAttribute as t } from "./errors/orphans/FormErrorNonFieldMarker.mjs";
-import { default as s } from "./errors/orphans/useFormErrorOrphansToConsoleError.mjs";
+import { default as e } from "./errors/nonfield/FormNonFieldErrorMarker.mjs";
+import { FormNonFieldErrorMarkerHtmlAttribute as s } from "./errors/nonfield/FormNonFieldErrorMarker.utils.mjs";
+import { default as m } from "./errors/orphans/useFormErrorOrphansToConsoleError.mjs";
 import { default as u } from "./errors/orphans/useFormOrphanErrors.mjs";
-import { default as l } from "./errors/roots/useFormRootFieldErrors.mjs";
-import { default as d } from "./errors/useFormErrorsEffect.mjs";
-import { default as p } from "./errors/useFormErrorsOnChange.mjs";
+import { default as F } from "./errors/root/useFormRootFieldErrors.mjs";
+import { default as p } from "./errors/useFormErrorsEffect.mjs";
+import { default as x } from "./errors/useFormErrorsOnChange.mjs";
 import { default as i } from "./errors/useFormRequestSubmit.mjs";
 export {
-  e as FormErrorNonFieldMarker,
-  t as FormErrorNonFieldMarkerDataHtmlAttribute,
-  s as useFormErrorOrphansToConsoleError,
-  d as useFormErrorsEffect,
-  p as useFormErrorsOnChange,
+  e as FormNonFieldErrorMarker,
+  s as FormNonFieldErrorMarkerHtmlAttribute,
+  m as useFormErrorOrphansToConsoleError,
+  p as useFormErrorsEffect,
+  x as useFormErrorsOnChange,
   u as useFormOrphanErrors,
   i as useFormRequestSubmit,
-  l as useFormRootFieldErrors
+  F as useFormRootFieldErrors
 };

package/dist/types/errors/nonfield/FormNonFieldErrorMarker.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+type Props = {
+    /** Flat field name. (e.g., `address.street`) */
+    path: string;
+};
+/**
+ * Empty, hidden marker to indicate a non-field error is presented to user.
+ */
+declare const FormNonFieldErrorMarker: React.FC<Props>;
+export default FormNonFieldErrorMarker;

package/dist/types/errors/nonfield/FormNonFieldErrorMarker.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/errors/nonfield/FormNonFieldErrorMarker.utils.d.ts

@@ -0,0 +1,5 @@
+/**
+ * HTML data attribute for {@link FormNonFieldErrorMarker}.
+ */
+export declare const FormNonFieldErrorMarkerHtmlAttribute = "data-paragrav-rhf-utils-nonfield-error-marker-path";
+export declare const getFormNonFieldErrorMarkerQuerySelector: (path: string) => string;

package/dist/types/errors/nonfield/utils.d.ts

@@ -0,0 +1,10 @@
+import { FieldError, FieldErrors } from 'react-hook-form';
+
+/**
+ * @returns A flattened {@link FieldErrors} record. (e.g. `{ "address.street": FieldError }`)
+ */
+export declare const getNonFieldErrorRecordByFilter: (errors: FieldErrors, where?: ((path: string, flattenedErrors: Record<string, unknown>) => boolean) | undefined) => Record<string, FieldError>;
+/**
+ * @returns An array of field errors. (Not a record.)
+ */
+export declare const getNonFieldErrorListByFilter: (errors: FieldErrors, where?: ((path: string, flattenedErrors: Record<string, unknown>) => boolean) | undefined) => FieldError[];

package/dist/types/errors/orphans/useFormOrphanErrors.d.ts

@@ -1,9 +1,4 @@
 import { default as React } from 'react';
 
-/**
- * Root field errors from form.
- * These are typically displayed at the bottom of the form.
- * (Root errors have to processed this way due to (potentially) recursive types.)
- */
 declare const useFormOrphanErrors: (formRef: React.RefObject<HTMLFormElement>) => Record<string, import('react-hook-form').FieldError>;
 export default useFormOrphanErrors;

package/dist/types/errors/orphans/utils.d.ts

@@ -1,4 +1,16 @@
 import { FieldErrors } from 'react-hook-form';
 
-export declare const getOrphanFieldErrors: (errors: FieldErrors) => Record<string, import('react-hook-form').FieldError>;
-export declare const getOrphanFieldErrorsWithMarkerCheck: (errors: FieldErrors, formElement: HTMLFormElement) => Record<string, import('react-hook-form').FieldError>;
+/**
+ * Get flat record of orphan errors -- i.e., non-field, non-root and not displayed to user using {@link FormNonFieldErrorMarker}.
+ * @param fieldErrors
+ * @param formElement Ref to form element for scoped `querySelector`.
+ * @returns
+ */
+export declare const getOrphanFieldErrorsWithMarkerCheck: (fieldErrors: FieldErrors, formElement: HTMLFormElement) => Record<string, import('react-hook-form').FieldError>;
+/**
+ * Get non-field errors that are not root errors.
+ *
+ * NOTE: This is an intermediary function used by {@link getOrphanFieldErrorsWithMarkerCheck}.
+ * It is exported for sake of testing.
+ */
+export declare const getNonFieldNonRootErrors: (errors: FieldErrors) => Record<string, import('react-hook-form').FieldError>;

package/dist/types/errors/root/useFormRootFieldErrors.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Root field errors from form.
+ * These are typically displayed at the bottom of the form.
+ */
+declare const useFormRootFieldErrors: () => import('react-hook-form').FieldError[];
+export default useFormRootFieldErrors;

package/dist/types/errors/root/utils.d.ts

@@ -0,0 +1,8 @@
+import { FieldErrors } from 'react-hook-form';
+
+/**
+ * Determine if an error path is root. (e.g., `root` or `root.nested`)
+ * @param path Flat path. (e.g., 'root.nested')
+ */
+export declare const isFormErrorPathRoot: (path: string) => boolean;
+export declare const getRootFieldErrorList: (errors: FieldErrors) => import('react-hook-form').FieldError[];

package/dist/types/main.d.ts

@@ -1,7 +1,8 @@
-export { default as FormErrorNonFieldMarker, FormErrorNonFieldMarkerHtmlAttribute as FormErrorNonFieldMarkerDataHtmlAttribute, } from './errors/orphans/FormErrorNonFieldMarker';
+export { default as FormNonFieldErrorMarker } from './errors/nonfield/FormNonFieldErrorMarker';
+export { FormNonFieldErrorMarkerHtmlAttribute } from './errors/nonfield/FormNonFieldErrorMarker.utils';
 export { default as useFormErrorOrphansToConsoleError } from './errors/orphans/useFormErrorOrphansToConsoleError';
 export { default as useFormOrphanErrors } from './errors/orphans/useFormOrphanErrors';
-export { default as useFormRootFieldErrors } from './errors/roots/useFormRootFieldErrors';
+export { default as useFormRootFieldErrors } from './errors/root/useFormRootFieldErrors';
 export { default as useFormErrorsEffect } from './errors/useFormErrorsEffect';
 export { default as useFormErrorsOnChange } from './errors/useFormErrorsOnChange';
 export { default as useFormRequestSubmit } from './errors/useFormRequestSubmit';

package/package.json

@@ -2,7 +2,7 @@
   "name": "@paragrav/rhf-utils",
   "author": "paragrav.dev",
   "license": "MIT",
-  "version": "0.0.17",
+  "version": "0.0.18",
   "description": "Integration utilities for react-hook-form.",
   "type": "module",
   "files": [

package/dist/esm/errors/orphans/FormErrorNonFieldMarker.mjs

@@ -1,19 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-const o = ({ path: r }) => {
-  const t = {
-    [a]: r
-  };
-  return /* @__PURE__ */ e(
-    "div",
-    {
-      role: "alert",
-      "aria-hidden": "true",
-      style: { display: "none" },
-      ...t
-    }
-  );
-}, n = o, a = "data-paragrav-rhf-utils-marker-path";
-export {
-  a as FormErrorNonFieldMarkerHtmlAttribute,
-  n as default
-};

package/dist/esm/errors/utils.mjs

@@ -1,14 +0,0 @@
-import { flatten as f } from "../node_modules/flat/index.mjs";
-import { get as d } from "react-hook-form";
-const p = (e, t) => i(e, t).reduce((r, s) => (r[s] = d(e, s), r), {}), F = (e, t) => i(e, t).map((r) => d(e, r)), i = (e, t) => {
-  const o = f(e);
-  return Object.keys(o).filter((n) => n.match(l)).map(
-    (n) => n.replace(l, "")
-  ).filter(
-    (n) => t ? t(n, o) : !0
-  );
-}, l = /\.ref$/;
-export {
-  F as getFieldErrorListByFilter,
-  p as getFieldErrorsByFilter
-};