@cdx-ui/utils 0.2.0 → 0.2.1

package/README.md

@@ -46,13 +46,14 @@ Used internally by `@cdx-ui/components` to propagate variant props (size, color,
 
 Low-level form-field state used by the `Field` and `Input` primitives.
 
-| Export                                     | Description                                                                                                                                              |
-| ------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `useFormControlRoot(props)`                | Creates the root state object for a form field (id generation, tracks `hasFeedbackText`/`hasHelpText` for describedby assembly).                         |
-| `useFormControl(props)`                    | Merges component-level props with inherited form-control context. Assembles `aria-describedby` from feedback/help text ids.                              |
-| `useFormControlContext()`                  | Reads form-control state from the nearest provider.                                                                                                      |
-| `useReportFormControlLabelFocus(isActive)` | Reports focus/active state to the parent `FormControlContext` — used by `Input`/`Select.Trigger` to trigger `isFocused` styling on the associated label. |
-| `FormControlContext`                       | The React context object for form-control state propagation.                                                                                             |
+| Export                                                    | Description                                                                                                                                                                    |
+| --------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| `useFormControlRoot(props)`                               | Creates the root state object for a form field (id generation, tracks `hasFeedbackText`/`hasHelpText` for describedby assembly).                                               |
+| `useFormControl(props)`                                   | Merges component-level props with inherited form-control context. Assembles `aria-describedby` from feedback/help text ids.                                                    |
+| `useFormControlContext()`                                 | Reads form-control state from the nearest provider.                                                                                                                            |
+| `useReportFormControlLabelFocus(isActive)`                | Reports focus/active state to the parent `FormControlContext` — used by `Input`/`Select.Trigger` to trigger `isFocused` styling on the associated label.                       |
+| `useReportFormControlValidation(isInvalid, errorMessage)` | Reports a self-validating control's invalid state and message to the parent `Field` — used by `DatePicker` so `Field.Error` / `Field.Helper` anywhere in the field reflect it. |
+| `FormControlContext`                                      | The React context object for form-control state propagation.                                                                                                                   |
 
 ## Exported types
 
@@ -66,6 +67,7 @@ Low-level form-field state used by the `Field` and `Input` primitives.
 | `FormControlRootProps`       | form-control |
 | `FormControlRootReturn`      | form-control |
 | `FormControlState`           | form-control |
+| `FormControlValidation`      | form-control |
 | `StyleContextMap`            | style        |
 
 ## Testing

package/lib/commonjs/form-control/index.js

@@ -33,5 +33,11 @@ Object.defineProperty(exports, "useReportFormControlLabelFocus", {
     return _useFormControl.useReportFormControlLabelFocus;
   }
 });
+Object.defineProperty(exports, "useReportFormControlValidation", {
+  enumerable: true,
+  get: function () {
+    return _useFormControl.useReportFormControlValidation;
+  }
+});
 var _useFormControl = require("./useFormControl");
 //# sourceMappingURL=index.js.map

package/lib/commonjs/form-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_useFormControl","require"],"sourceRoot":"../../../src","sources":["form-control/index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,eAAA,GAAAC,OAAA","ignoreList":[]}
+{"version":3,"names":["_useFormControl","require"],"sourceRoot":"../../../src","sources":["form-control/index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,eAAA,GAAAC,OAAA","ignoreList":[]}

package/lib/commonjs/form-control/useFormControl.js

@@ -8,6 +8,7 @@ exports.useFormControl = useFormControl;
 exports.useFormControlContext = void 0;
 exports.useFormControlRoot = useFormControlRoot;
 exports.useReportFormControlLabelFocus = useReportFormControlLabelFocus;
+exports.useReportFormControlValidation = useReportFormControlValidation;
 var _react = _interopRequireDefault(require("react"));
 var _reactNative = require("react-native");
 var _accessibilityUtils = require("../common/accessibilityUtils");
@@ -22,6 +23,8 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  * minimal avoids a typed lie when a non-input bridge is registered.
  */
 
+/** Validation a child control reports to its enclosing `Field` (see `useReportFormControlValidation`). */
+
 const FormControlContext = exports.FormControlContext = /*#__PURE__*/_react.default.createContext({});
 
 /** Props for the FormControl root; known fields plus passthrough to the styled root box. */
@@ -58,6 +61,7 @@ function useFormControlRoot(props) {
    */
   const [hasHelpText, setHasHelpText] = _react.default.useState(false);
   const [isLabelFocused, setIsLabelFocused] = _react.default.useState(false);
+  const [controlValidation, setControlValidation] = _react.default.useState(undefined);
   const inputRef = _react.default.useRef(null);
   const focusInput = _react.default.useCallback(() => {
     const node = inputRef.current;
@@ -67,9 +71,11 @@ function useFormControlRoot(props) {
   }, []);
   const context = {
     isRequired: Boolean(isRequired),
-    isInvalid: Boolean(isInvalid),
+    isInvalid: Boolean(isInvalid) || Boolean(controlValidation?.isInvalid),
     isReadOnly: Boolean(isReadOnly),
     isDisabled: Boolean(isDisabled),
+    errorMessage: controlValidation?.errorMessage,
+    setControlValidation,
     hasFeedbackText,
     setHasFeedbackText,
     hasHelpText,
@@ -109,6 +115,38 @@ function useReportFormControlLabelFocus(isActive) {
   }, [isActive, setIsLabelFocused]);
 }
 
+/**
+ * Reports a control's own validation (e.g. `DatePicker` bounds) to the enclosing `Field`, so the
+ * field root, `Field.Helper`, and `Field.Error` reflect it wherever they sit inside the field.
+ * Runs in a layout effect so the invalid state and message reach the field before paint.
+ *
+ * @returns `false` outside a `Field` (nothing to report to) — the caller must provide the state itself.
+ */
+function useReportFormControlValidation(isInvalid, errorMessage) {
+  const {
+    setControlValidation
+  } = useFormControlContext();
+  _react.default.useLayoutEffect(() => {
+    if (typeof setControlValidation !== 'function') {
+      return undefined;
+    }
+    setControlValidation(prev => prev?.isInvalid === isInvalid && prev.errorMessage === errorMessage ? prev : {
+      isInvalid,
+      errorMessage
+    });
+    return undefined;
+  }, [errorMessage, isInvalid, setControlValidation]);
+  _react.default.useLayoutEffect(() => {
+    if (typeof setControlValidation !== 'function') {
+      return undefined;
+    }
+    return () => {
+      setControlValidation(undefined);
+    };
+  }, [setControlValidation]);
+  return typeof setControlValidation === 'function';
+}
+
 /**
  * Hook that merges local field props with the nearest form field context
  * and returns normalised HTML / ARIA attributes for input elements.

package/lib/commonjs/form-control/useFormControl.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_accessibilityUtils","e","__esModule","default","FormControlContext","exports","React","createContext","useFormControlRoot","props","id","idProp","name","isRequired","isInvalid","isDisabled","isReadOnly","htmlProps","reactId","useId","labelId","feedbackId","helpTextId","hasFeedbackText","setHasFeedbackText","useState","hasHelpText","setHasHelpText","isLabelFocused","setIsLabelFocused","inputRef","useRef","focusInput","useCallback","node","current","focus","context","Boolean","Platform","OS","useReportFormControlLabelFocus","isActive","useFormControlContext","useLayoutEffect","undefined","useFormControl","field","describedBy","push","ariaDescribedBy","join","cleanProps","disabled","readOnly","required","ariaAttr","useContext"],"sourceRoot":"../../../src","sources":["form-control/useFormControl.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_accessibilityUtils","e","__esModule","default","FormControlContext","exports","React","createContext","useFormControlRoot","props","id","idProp","name","isRequired","isInvalid","isDisabled","isReadOnly","htmlProps","reactId","useId","labelId","feedbackId","helpTextId","hasFeedbackText","setHasFeedbackText","useState","hasHelpText","setHasHelpText","isLabelFocused","setIsLabelFocused","controlValidation","setControlValidation","undefined","inputRef","useRef","focusInput","useCallback","node","current","focus","context","Boolean","errorMessage","Platform","OS","useReportFormControlLabelFocus","isActive","useFormControlContext","useLayoutEffect","useReportFormControlValidation","prev","useFormControl","field","describedBy","push","ariaDescribedBy","join","cleanProps","disabled","readOnly","required","ariaAttr","useContext"],"sourceRoot":"../../../src","sources":["form-control/useFormControl.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/form-control/index.js

@@ -1,4 +1,4 @@
 "use strict";
 
-export { FormControlContext, useFormControl, useFormControlContext, useFormControlRoot, useReportFormControlLabelFocus } from './useFormControl';
+export { FormControlContext, useFormControl, useFormControlContext, useFormControlRoot, useReportFormControlLabelFocus, useReportFormControlValidation } from './useFormControl';
 //# sourceMappingURL=index.js.map

package/lib/module/form-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["FormControlContext","useFormControl","useFormControlContext","useFormControlRoot","useReportFormControlLabelFocus"],"sourceRoot":"../../../src","sources":["form-control/index.ts"],"mappings":";;AAAA,SAOEA,kBAAkB,EAClBC,cAAc,EACdC,qBAAqB,EACrBC,kBAAkB,EAClBC,8BAA8B,QACzB,kBAAkB","ignoreList":[]}
+{"version":3,"names":["FormControlContext","useFormControl","useFormControlContext","useFormControlRoot","useReportFormControlLabelFocus","useReportFormControlValidation"],"sourceRoot":"../../../src","sources":["form-control/index.ts"],"mappings":";;AAAA,SAQEA,kBAAkB,EAClBC,cAAc,EACdC,qBAAqB,EACrBC,kBAAkB,EAClBC,8BAA8B,EAC9BC,8BAA8B,QACzB,kBAAkB","ignoreList":[]}

package/lib/module/form-control/useFormControl.js

@@ -14,6 +14,8 @@ import { ariaAttr } from '../common/accessibilityUtils';
  * minimal avoids a typed lie when a non-input bridge is registered.
  */
 
+/** Validation a child control reports to its enclosing `Field` (see `useReportFormControlValidation`). */
+
 export const FormControlContext = /*#__PURE__*/React.createContext({});
 
 /** Props for the FormControl root; known fields plus passthrough to the styled root box. */
@@ -50,6 +52,7 @@ export function useFormControlRoot(props) {
    */
   const [hasHelpText, setHasHelpText] = React.useState(false);
   const [isLabelFocused, setIsLabelFocused] = React.useState(false);
+  const [controlValidation, setControlValidation] = React.useState(undefined);
   const inputRef = React.useRef(null);
   const focusInput = React.useCallback(() => {
     const node = inputRef.current;
@@ -59,9 +62,11 @@ export function useFormControlRoot(props) {
   }, []);
   const context = {
     isRequired: Boolean(isRequired),
-    isInvalid: Boolean(isInvalid),
+    isInvalid: Boolean(isInvalid) || Boolean(controlValidation?.isInvalid),
     isReadOnly: Boolean(isReadOnly),
     isDisabled: Boolean(isDisabled),
+    errorMessage: controlValidation?.errorMessage,
+    setControlValidation,
     hasFeedbackText,
     setHasFeedbackText,
     hasHelpText,
@@ -101,6 +106,38 @@ export function useReportFormControlLabelFocus(isActive) {
   }, [isActive, setIsLabelFocused]);
 }
 
+/**
+ * Reports a control's own validation (e.g. `DatePicker` bounds) to the enclosing `Field`, so the
+ * field root, `Field.Helper`, and `Field.Error` reflect it wherever they sit inside the field.
+ * Runs in a layout effect so the invalid state and message reach the field before paint.
+ *
+ * @returns `false` outside a `Field` (nothing to report to) — the caller must provide the state itself.
+ */
+export function useReportFormControlValidation(isInvalid, errorMessage) {
+  const {
+    setControlValidation
+  } = useFormControlContext();
+  React.useLayoutEffect(() => {
+    if (typeof setControlValidation !== 'function') {
+      return undefined;
+    }
+    setControlValidation(prev => prev?.isInvalid === isInvalid && prev.errorMessage === errorMessage ? prev : {
+      isInvalid,
+      errorMessage
+    });
+    return undefined;
+  }, [errorMessage, isInvalid, setControlValidation]);
+  React.useLayoutEffect(() => {
+    if (typeof setControlValidation !== 'function') {
+      return undefined;
+    }
+    return () => {
+      setControlValidation(undefined);
+    };
+  }, [setControlValidation]);
+  return typeof setControlValidation === 'function';
+}
+
 /**
  * Hook that merges local field props with the nearest form field context
  * and returns normalised HTML / ARIA attributes for input elements.

package/lib/module/form-control/useFormControl.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Platform","ariaAttr","FormControlContext","createContext","useFormControlRoot","props","id","idProp","name","isRequired","isInvalid","isDisabled","isReadOnly","htmlProps","reactId","useId","labelId","feedbackId","helpTextId","hasFeedbackText","setHasFeedbackText","useState","hasHelpText","setHasHelpText","isLabelFocused","setIsLabelFocused","inputRef","useRef","focusInput","useCallback","node","current","focus","context","Boolean","OS","useReportFormControlLabelFocus","isActive","useFormControlContext","useLayoutEffect","undefined","useFormControl","field","describedBy","push","ariaDescribedBy","join","cleanProps","disabled","readOnly","required","useContext"],"sourceRoot":"../../../src","sources":["form-control/useFormControl.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,cAAc;AACvC,SAASC,QAAQ,QAAQ,8BAA8B;;AAIvD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAsCA,OAAO,MAAMC,kBAAkB,gBAAGH,KAAK,CAACI,aAAa,CAAmC,CAAC,CAAC,CAAC;;AAM3F;;AA2BA;AACA;AACA;AACA;AACA,OAAO,SAASC,kBAAkBA,CAACC,KAA2B,EAAyB;EACrF,MAAM;IAAEC,EAAE,EAAEC,MAAM;IAAEC,IAAI;IAAEC,UAAU;IAAEC,SAAS;IAAEC,UAAU;IAAEC,UAAU;IAAE,GAAGC;EAAU,CAAC,GAAGR,KAAK;EAE/F,MAAMS,OAAO,GAAGf,KAAK,CAACgB,KAAK,CAAC,CAAC;EAC7B,MAAMT,EAAE,GAAG,CAAC,OAAOC,MAAM,KAAK,QAAQ,IAAIA,MAAM,KAAK,EAAE,GAAGA,MAAM,GAAG,IAAI,KAAK,SAASO,OAAO,EAAE;EAE9F,MAAME,OAAO,GAAG,GAAGV,EAAE,QAAQ;EAC7B,MAAMW,UAAU,GAAG,GAAGX,EAAE,WAAW;EACnC,MAAMY,UAAU,GAAG,GAAGZ,EAAE,WAAW;;EAEnC;AACF;AACA;AACA;EACE,MAAM,CAACa,eAAe,EAAEC,kBAAkB,CAAC,GAAGrB,KAAK,CAACsB,QAAQ,CAAC,KAAK,CAAC;;EAEnE;AACF;AACA;AACA;EACE,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGxB,KAAK,CAACsB,QAAQ,CAAC,KAAK,CAAC;EAE3D,MAAM,CAACG,cAAc,EAAEC,iBAAiB,CAAC,GAAG1B,KAAK,CAACsB,QAAQ,CAAC,KAAK,CAAC;EAEjE,MAAMK,QAAQ,GAAG3B,KAAK,CAAC4B,MAAM,CAAmB,IAAI,CAAC;EAErD,MAAMC,UAAU,GAAG7B,KAAK,CAAC8B,WAAW,CAAC,MAAM;IACzC,MAAMC,IAAI,GAAGJ,QAAQ,CAACK,OAAO;IAC7B,IAAID,IAAI,IAAI,IAAI,IAAI,OAAOA,IAAI,CAACE,KAAK,KAAK,UAAU,EAAE;MACpDF,IAAI,CAACE,KAAK,CAAC,CAAC;IACd;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,OAA8B,GAAG;IACrCxB,UAAU,EAAEyB,OAAO,CAACzB,UAAU,CAAC;IAC/BC,SAAS,EAAEwB,OAAO,CAACxB,SAAS,CAAC;IAC7BE,UAAU,EAAEsB,OAAO,CAACtB,UAAU,CAAC;IAC/BD,UAAU,EAAEuB,OAAO,CAACvB,UAAU,CAAC;IAC/BQ,eAAe;IACfC,kBAAkB;IAClBE,WAAW;IACXC,cAAc;IACdf,IAAI;IACJF,EAAE;IACFU,OAAO;IACPC,UAAU;IACVC,UAAU;IACVL,SAAS;IACTW,cAAc;IACdC,iBAAiB;IACjB,IAAIzB,QAAQ,CAACmC,EAAE,KAAK,KAAK,GAAG;MAAET,QAAQ;MAAEE;IAAW,CAAC,GAAG,CAAC,CAAC;EAC3D,CAAC;EAED,OAAOK,OAAO;AAChB;;AAEA;AACA;AACA;AACA;AACA,OAAO,SAASG,8BAA8BA,CAACC,QAAiB,EAAE;EAChE,MAAM;IAAEZ;EAAkB,CAAC,GAAGa,qBAAqB,CAAC,CAAC;EAErDvC,KAAK,CAACwC,eAAe,CAAC,MAAM;IAC1B,IAAI,OAAOd,iBAAiB,KAAK,UAAU,EAAE;MAC3C,OAAOe,SAAS;IAClB;IACAf,iBAAiB,CAACY,QAAQ,CAAC;IAC3B,OAAO,MAAM;MACXZ,iBAAiB,CAAC,KAAK,CAAC;IAC1B,CAAC;EACH,CAAC,EAAE,CAACY,QAAQ,EAAEZ,iBAAiB,CAAC,CAAC;AACnC;;AAEA;AACA;AACA;AACA;AACA,OAAO,SAASgB,cAAcA,CAACpC,KAA4B,EAAE;EAC3D,MAAMqC,KAAK,GAAGJ,qBAAqB,CAAC,CAAC;EACrC,MAAMK,WAAqB,GAAG,EAAE;EAEhC,IAAID,KAAK,CAACvB,eAAe,IAAIuB,KAAK,CAACzB,UAAU,EAAE;IAC7C0B,WAAW,CAACC,IAAI,CAACF,KAAK,CAACzB,UAAU,CAAC;EACpC;EACA,IAAIyB,KAAK,CAACpB,WAAW,IAAIoB,KAAK,CAACxB,UAAU,EAAE;IACzCyB,WAAW,CAACC,IAAI,CAACF,KAAK,CAACxB,UAAU,CAAC;EACpC;EACA,MAAM2B,eAAe,GAAGF,WAAW,CAACG,IAAI,CAAC,GAAG,CAAC;EAE7C,MAAM;IAAEpC,SAAS;IAAEC,UAAU;IAAEC,UAAU;IAAEH,UAAU;IAAE,GAAGsC;EAAW,CAAC,GAAG1C,KAAK;EAC9E,MAAMC,EAAE,GAAGD,KAAK,CAACC,EAAE,KAAKoC,KAAK,CAACpC,EAAE,GAAG,GAAGoC,KAAK,CAACpC,EAAE,QAAQ,GAAGkC,SAAS,CAAC;EAEnE,OAAO;IACL,GAAGO,UAAU;IACbzC,EAAE;IACFE,IAAI,EAAEkC,KAAK,CAAClC,IAAI;IAChBwC,QAAQ,EAAErC,UAAU,IAAI+B,KAAK,CAAC/B,UAAU;IACxCsC,QAAQ,EAAErC,UAAU,IAAI8B,KAAK,CAAC9B,UAAU;IACxCsC,QAAQ,EAAEzC,UAAU,IAAIiC,KAAK,CAACjC,UAAU;IACxC,cAAc,EAAER,QAAQ,CAACS,SAAS,IAAIgC,KAAK,CAAChC,SAAS,CAAC;IACtD,eAAe,EAAET,QAAQ,CAACQ,UAAU,IAAIiC,KAAK,CAACjC,UAAU,CAAC;IACzD,eAAe,EAAER,QAAQ,CAACW,UAAU,IAAI8B,KAAK,CAAC9B,UAAU,CAAC;IACzD,kBAAkB,EAAEiC,eAAe,IAAIL,SAAS;IAChD,iBAAiB,EAAEE,KAAK,CAAC1B;EAC3B,CAAC;AACH;AAEA,OAAO,MAAMsB,qBAAqB,GAAGA,CAAA,KAAM;EACzC,OAAOvC,KAAK,CAACoD,UAAU,CAACjD,kBAAkB,CAAC;AAC7C,CAAC","ignoreList":[]}
+{"version":3,"names":["React","Platform","ariaAttr","FormControlContext","createContext","useFormControlRoot","props","id","idProp","name","isRequired","isInvalid","isDisabled","isReadOnly","htmlProps","reactId","useId","labelId","feedbackId","helpTextId","hasFeedbackText","setHasFeedbackText","useState","hasHelpText","setHasHelpText","isLabelFocused","setIsLabelFocused","controlValidation","setControlValidation","undefined","inputRef","useRef","focusInput","useCallback","node","current","focus","context","Boolean","errorMessage","OS","useReportFormControlLabelFocus","isActive","useFormControlContext","useLayoutEffect","useReportFormControlValidation","prev","useFormControl","field","describedBy","push","ariaDescribedBy","join","cleanProps","disabled","readOnly","required","useContext"],"sourceRoot":"../../../src","sources":["form-control/useFormControl.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,cAAc;AACvC,SAASC,QAAQ,QAAQ,8BAA8B;;AAIvD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAYA;;AAqCA,OAAO,MAAMC,kBAAkB,gBAAGH,KAAK,CAACI,aAAa,CAAmC,CAAC,CAAC,CAAC;;AAM3F;;AA8BA;AACA;AACA;AACA;AACA,OAAO,SAASC,kBAAkBA,CAACC,KAA2B,EAAyB;EACrF,MAAM;IAAEC,EAAE,EAAEC,MAAM;IAAEC,IAAI;IAAEC,UAAU;IAAEC,SAAS;IAAEC,UAAU;IAAEC,UAAU;IAAE,GAAGC;EAAU,CAAC,GAAGR,KAAK;EAE/F,MAAMS,OAAO,GAAGf,KAAK,CAACgB,KAAK,CAAC,CAAC;EAC7B,MAAMT,EAAE,GAAG,CAAC,OAAOC,MAAM,KAAK,QAAQ,IAAIA,MAAM,KAAK,EAAE,GAAGA,MAAM,GAAG,IAAI,KAAK,SAASO,OAAO,EAAE;EAE9F,MAAME,OAAO,GAAG,GAAGV,EAAE,QAAQ;EAC7B,MAAMW,UAAU,GAAG,GAAGX,EAAE,WAAW;EACnC,MAAMY,UAAU,GAAG,GAAGZ,EAAE,WAAW;;EAEnC;AACF;AACA;AACA;EACE,MAAM,CAACa,eAAe,EAAEC,kBAAkB,CAAC,GAAGrB,KAAK,CAACsB,QAAQ,CAAC,KAAK,CAAC;;EAEnE;AACF;AACA;AACA;EACE,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGxB,KAAK,CAACsB,QAAQ,CAAC,KAAK,CAAC;EAE3D,MAAM,CAACG,cAAc,EAAEC,iBAAiB,CAAC,GAAG1B,KAAK,CAACsB,QAAQ,CAAC,KAAK,CAAC;EAEjE,MAAM,CAACK,iBAAiB,EAAEC,oBAAoB,CAAC,GAAG5B,KAAK,CAACsB,QAAQ,CAE9DO,SAAS,CAAC;EAEZ,MAAMC,QAAQ,GAAG9B,KAAK,CAAC+B,MAAM,CAAmB,IAAI,CAAC;EAErD,MAAMC,UAAU,GAAGhC,KAAK,CAACiC,WAAW,CAAC,MAAM;IACzC,MAAMC,IAAI,GAAGJ,QAAQ,CAACK,OAAO;IAC7B,IAAID,IAAI,IAAI,IAAI,IAAI,OAAOA,IAAI,CAACE,KAAK,KAAK,UAAU,EAAE;MACpDF,IAAI,CAACE,KAAK,CAAC,CAAC;IACd;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,OAA8B,GAAG;IACrC3B,UAAU,EAAE4B,OAAO,CAAC5B,UAAU,CAAC;IAC/BC,SAAS,EAAE2B,OAAO,CAAC3B,SAAS,CAAC,IAAI2B,OAAO,CAACX,iBAAiB,EAAEhB,SAAS,CAAC;IACtEE,UAAU,EAAEyB,OAAO,CAACzB,UAAU,CAAC;IAC/BD,UAAU,EAAE0B,OAAO,CAAC1B,UAAU,CAAC;IAC/B2B,YAAY,EAAEZ,iBAAiB,EAAEY,YAAY;IAC7CX,oBAAoB;IACpBR,eAAe;IACfC,kBAAkB;IAClBE,WAAW;IACXC,cAAc;IACdf,IAAI;IACJF,EAAE;IACFU,OAAO;IACPC,UAAU;IACVC,UAAU;IACVL,SAAS;IACTW,cAAc;IACdC,iBAAiB;IACjB,IAAIzB,QAAQ,CAACuC,EAAE,KAAK,KAAK,GAAG;MAAEV,QAAQ;MAAEE;IAAW,CAAC,GAAG,CAAC,CAAC;EAC3D,CAAC;EAED,OAAOK,OAAO;AAChB;;AAEA;AACA;AACA;AACA;AACA,OAAO,SAASI,8BAA8BA,CAACC,QAAiB,EAAE;EAChE,MAAM;IAAEhB;EAAkB,CAAC,GAAGiB,qBAAqB,CAAC,CAAC;EAErD3C,KAAK,CAAC4C,eAAe,CAAC,MAAM;IAC1B,IAAI,OAAOlB,iBAAiB,KAAK,UAAU,EAAE;MAC3C,OAAOG,SAAS;IAClB;IACAH,iBAAiB,CAACgB,QAAQ,CAAC;IAC3B,OAAO,MAAM;MACXhB,iBAAiB,CAAC,KAAK,CAAC;IAC1B,CAAC;EACH,CAAC,EAAE,CAACgB,QAAQ,EAAEhB,iBAAiB,CAAC,CAAC;AACnC;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASmB,8BAA8BA,CAC5ClC,SAAkB,EAClB4B,YAAgC,EACvB;EACT,MAAM;IAAEX;EAAqB,CAAC,GAAGe,qBAAqB,CAAC,CAAC;EAExD3C,KAAK,CAAC4C,eAAe,CAAC,MAAM;IAC1B,IAAI,OAAOhB,oBAAoB,KAAK,UAAU,EAAE;MAC9C,OAAOC,SAAS;IAClB;IACAD,oBAAoB,CAAEkB,IAAI,IACxBA,IAAI,EAAEnC,SAAS,KAAKA,SAAS,IAAImC,IAAI,CAACP,YAAY,KAAKA,YAAY,GAC/DO,IAAI,GACJ;MAAEnC,SAAS;MAAE4B;IAAa,CAChC,CAAC;IACD,OAAOV,SAAS;EAClB,CAAC,EAAE,CAACU,YAAY,EAAE5B,SAAS,EAAEiB,oBAAoB,CAAC,CAAC;EAEnD5B,KAAK,CAAC4C,eAAe,CAAC,MAAM;IAC1B,IAAI,OAAOhB,oBAAoB,KAAK,UAAU,EAAE;MAC9C,OAAOC,SAAS;IAClB;IACA,OAAO,MAAM;MACXD,oBAAoB,CAACC,SAAS,CAAC;IACjC,CAAC;EACH,CAAC,EAAE,CAACD,oBAAoB,CAAC,CAAC;EAE1B,OAAO,OAAOA,oBAAoB,KAAK,UAAU;AACnD;;AAEA;AACA;AACA;AACA;AACA,OAAO,SAASmB,cAAcA,CAACzC,KAA4B,EAAE;EAC3D,MAAM0C,KAAK,GAAGL,qBAAqB,CAAC,CAAC;EACrC,MAAMM,WAAqB,GAAG,EAAE;EAEhC,IAAID,KAAK,CAAC5B,eAAe,IAAI4B,KAAK,CAAC9B,UAAU,EAAE;IAC7C+B,WAAW,CAACC,IAAI,CAACF,KAAK,CAAC9B,UAAU,CAAC;EACpC;EACA,IAAI8B,KAAK,CAACzB,WAAW,IAAIyB,KAAK,CAAC7B,UAAU,EAAE;IACzC8B,WAAW,CAACC,IAAI,CAACF,KAAK,CAAC7B,UAAU,CAAC;EACpC;EACA,MAAMgC,eAAe,GAAGF,WAAW,CAACG,IAAI,CAAC,GAAG,CAAC;EAE7C,MAAM;IAAEzC,SAAS;IAAEC,UAAU;IAAEC,UAAU;IAAEH,UAAU;IAAE,GAAG2C;EAAW,CAAC,GAAG/C,KAAK;EAC9E,MAAMC,EAAE,GAAGD,KAAK,CAACC,EAAE,KAAKyC,KAAK,CAACzC,EAAE,GAAG,GAAGyC,KAAK,CAACzC,EAAE,QAAQ,GAAGsB,SAAS,CAAC;EAEnE,OAAO;IACL,GAAGwB,UAAU;IACb9C,EAAE;IACFE,IAAI,EAAEuC,KAAK,CAACvC,IAAI;IAChB6C,QAAQ,EAAE1C,UAAU,IAAIoC,KAAK,CAACpC,UAAU;IACxC2C,QAAQ,EAAE1C,UAAU,IAAImC,KAAK,CAACnC,UAAU;IACxC2C,QAAQ,EAAE9C,UAAU,IAAIsC,KAAK,CAACtC,UAAU;IACxC,cAAc,EAAER,QAAQ,CAACS,SAAS,IAAIqC,KAAK,CAACrC,SAAS,CAAC;IACtD,eAAe,EAAET,QAAQ,CAACQ,UAAU,IAAIsC,KAAK,CAACtC,UAAU,CAAC;IACzD,eAAe,EAAER,QAAQ,CAACW,UAAU,IAAImC,KAAK,CAACnC,UAAU,CAAC;IACzD,kBAAkB,EAAEsC,eAAe,IAAItB,SAAS;IAChD,iBAAiB,EAAEmB,KAAK,CAAC/B;EAC3B,CAAC;AACH;AAEA,OAAO,MAAM0B,qBAAqB,GAAGA,CAAA,KAAM;EACzC,OAAO3C,KAAK,CAACyD,UAAU,CAACtD,kBAAkB,CAAC;AAC7C,CAAC","ignoreList":[]}

package/lib/typescript/form-control/index.d.ts

@@ -1,2 +1,2 @@
-export { type Focusable, type FormControlContextValue, type FormControlFieldProps, type FormControlRootProps, type FormControlRootReturn, type FormControlState, FormControlContext, useFormControl, useFormControlContext, useFormControlRoot, useReportFormControlLabelFocus, } from './useFormControl';
+export { type Focusable, type FormControlContextValue, type FormControlFieldProps, type FormControlRootProps, type FormControlRootReturn, type FormControlState, type FormControlValidation, FormControlContext, useFormControl, useFormControlContext, useFormControlRoot, useReportFormControlLabelFocus, useReportFormControlValidation, } from './useFormControl';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/form-control/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/form-control/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,qBAAqB,EAC1B,KAAK,gBAAgB,EACrB,kBAAkB,EAClB,cAAc,EACd,qBAAqB,EACrB,kBAAkB,EAClB,8BAA8B,GAC/B,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/form-control/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,qBAAqB,EAC1B,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC1B,kBAAkB,EAClB,cAAc,EACd,qBAAqB,EACrB,kBAAkB,EAClB,8BAA8B,EAC9B,8BAA8B,GAC/B,MAAM,kBAAkB,CAAC"}

package/lib/typescript/form-control/useFormControl.d.ts

@@ -18,7 +18,17 @@ export interface FormControlState {
     isDisabled: boolean;
     isReadOnly: boolean;
 }
+/** Validation a child control reports to its enclosing `Field` (see `useReportFormControlValidation`). */
+export interface FormControlValidation {
+    isInvalid: boolean;
+    /** Message `Field.Error` renders when it has no children of its own. */
+    errorMessage?: string;
+}
 export interface FormControlContextValue extends FormControlState {
+    /** Message reported by the field's control; `Field.Error` falls back to it. */
+    errorMessage?: string;
+    /** Lets a control that validates itself report into the field. Set by the field root only. */
+    setControlValidation?: React.Dispatch<React.SetStateAction<FormControlValidation | undefined>>;
     hasFeedbackText: boolean;
     hasHelpText: boolean;
     setHasFeedbackText: React.Dispatch<React.SetStateAction<boolean>>;
@@ -54,9 +64,12 @@ export type FormControlRootProps = Partial<FormControlState> & {
 } & HTMLProps;
 export interface FormControlRootReturn {
     isRequired: boolean;
+    /** `isInvalid` prop OR-ed with the validation a child control reported. */
     isInvalid: boolean;
     isReadOnly: boolean;
     isDisabled: boolean;
+    errorMessage?: string;
+    setControlValidation: React.Dispatch<React.SetStateAction<FormControlValidation | undefined>>;
     hasFeedbackText: boolean;
     setHasFeedbackText: React.Dispatch<React.SetStateAction<boolean>>;
     hasHelpText: boolean;
@@ -82,6 +95,14 @@ export declare function useFormControlRoot(props: FormControlRootProps): FormCon
  * No-ops outside a `Field` (no `setIsLabelFocused` on context).
  */
 export declare function useReportFormControlLabelFocus(isActive: boolean): void;
+/**
+ * Reports a control's own validation (e.g. `DatePicker` bounds) to the enclosing `Field`, so the
+ * field root, `Field.Helper`, and `Field.Error` reflect it wherever they sit inside the field.
+ * Runs in a layout effect so the invalid state and message reach the field before paint.
+ *
+ * @returns `false` outside a `Field` (nothing to report to) — the caller must provide the state itself.
+ */
+export declare function useReportFormControlValidation(isInvalid: boolean, errorMessage: string | undefined): boolean;
 /**
  * Hook that merges local field props with the nearest form field context
  * and returns normalised HTML / ARIA attributes for input elements.

package/lib/typescript/form-control/useFormControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useFormControl.d.ts","sourceRoot":"","sources":["../../../src/form-control/useFormControl.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"useFormControl.d.ts","sourceRoot":"","sources":["../../../src/form-control/useFormControl.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cdx-ui/utils",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "license": "MIT",
   "repository": {
     "type": "git",

package/src/form-control/index.ts

@@ -5,9 +5,11 @@ export {
   type FormControlRootProps,
   type FormControlRootReturn,
   type FormControlState,
+  type FormControlValidation,
   FormControlContext,
   useFormControl,
   useFormControlContext,
   useFormControlRoot,
   useReportFormControlLabelFocus,
+  useReportFormControlValidation,
 } from './useFormControl';

package/src/form-control/useFormControl.test.tsx

@@ -7,6 +7,7 @@ import {
   useFormControlContext,
   useFormControlRoot,
   useReportFormControlLabelFocus,
+  useReportFormControlValidation,
 } from './useFormControl';
 
 function FormControlTestProvider({
@@ -212,3 +213,52 @@ describe('useReportFormControlLabelFocus', () => {
     }).not.toThrow();
   });
 });
+
+describe('useReportFormControlValidation', () => {
+  it('ORs the reported state into the field and exposes the message', () => {
+    const { result, rerender, unmount } = renderHook(
+      ({ invalid, message }: { invalid: boolean; message?: string }) => {
+        const reported = useReportFormControlValidation(invalid, message);
+        const { isInvalid, errorMessage } = useFormControlContext();
+        return { reported, isInvalid, errorMessage };
+      },
+      {
+        wrapper: ({ children }) => <FormControlTestProvider>{children}</FormControlTestProvider>,
+        initialProps: { invalid: true, message: 'Too early' } as {
+          invalid: boolean;
+          message?: string;
+        },
+      },
+    );
+
+    expect(result.current).toEqual({ reported: true, isInvalid: true, errorMessage: 'Too early' });
+
+    rerender({ invalid: false, message: undefined });
+    expect(result.current).toEqual({ reported: true, isInvalid: false, errorMessage: undefined });
+
+    unmount();
+  });
+
+  it('keeps the field invalid when the root prop is set', () => {
+    const { result } = renderHook(
+      () => {
+        useReportFormControlValidation(false, undefined);
+        return useFormControlContext().isInvalid;
+      },
+      {
+        wrapper: ({ children }) => (
+          <FormControlTestProvider rootProps={{ id: 'email', isInvalid: true }}>
+            {children}
+          </FormControlTestProvider>
+        ),
+      },
+    );
+
+    expect(result.current).toBe(true);
+  });
+
+  it('returns false outside a field', () => {
+    const { result } = renderHook(() => useReportFormControlValidation(true, 'Too early'));
+    expect(result.current).toBe(false);
+  });
+});

package/src/form-control/useFormControl.tsx

@@ -24,7 +24,18 @@ export interface FormControlState {
   isReadOnly: boolean;
 }
 
+/** Validation a child control reports to its enclosing `Field` (see `useReportFormControlValidation`). */
+export interface FormControlValidation {
+  isInvalid: boolean;
+  /** Message `Field.Error` renders when it has no children of its own. */
+  errorMessage?: string;
+}
+
 export interface FormControlContextValue extends FormControlState {
+  /** Message reported by the field's control; `Field.Error` falls back to it. */
+  errorMessage?: string;
+  /** Lets a control that validates itself report into the field. Set by the field root only. */
+  setControlValidation?: React.Dispatch<React.SetStateAction<FormControlValidation | undefined>>;
   hasFeedbackText: boolean;
   hasHelpText: boolean;
   setHasFeedbackText: React.Dispatch<React.SetStateAction<boolean>>;
@@ -64,9 +75,12 @@ export type FormControlRootProps = Partial<FormControlState> & {
 
 export interface FormControlRootReturn {
   isRequired: boolean;
+  /** `isInvalid` prop OR-ed with the validation a child control reported. */
   isInvalid: boolean;
   isReadOnly: boolean;
   isDisabled: boolean;
+  errorMessage?: string;
+  setControlValidation: React.Dispatch<React.SetStateAction<FormControlValidation | undefined>>;
   hasFeedbackText: boolean;
   setHasFeedbackText: React.Dispatch<React.SetStateAction<boolean>>;
   hasHelpText: boolean;
@@ -111,6 +125,10 @@ export function useFormControlRoot(props: FormControlRootProps): FormControlRoot
 
   const [isLabelFocused, setIsLabelFocused] = React.useState(false);
 
+  const [controlValidation, setControlValidation] = React.useState<
+    FormControlValidation | undefined
+  >(undefined);
+
   const inputRef = React.useRef<Focusable | null>(null);
 
   const focusInput = React.useCallback(() => {
@@ -122,9 +140,11 @@ export function useFormControlRoot(props: FormControlRootProps): FormControlRoot
 
   const context: FormControlRootReturn = {
     isRequired: Boolean(isRequired),
-    isInvalid: Boolean(isInvalid),
+    isInvalid: Boolean(isInvalid) || Boolean(controlValidation?.isInvalid),
     isReadOnly: Boolean(isReadOnly),
     isDisabled: Boolean(isDisabled),
+    errorMessage: controlValidation?.errorMessage,
+    setControlValidation,
     hasFeedbackText,
     setHasFeedbackText,
     hasHelpText,
@@ -161,6 +181,43 @@ export function useReportFormControlLabelFocus(isActive: boolean) {
   }, [isActive, setIsLabelFocused]);
 }
 
+/**
+ * Reports a control's own validation (e.g. `DatePicker` bounds) to the enclosing `Field`, so the
+ * field root, `Field.Helper`, and `Field.Error` reflect it wherever they sit inside the field.
+ * Runs in a layout effect so the invalid state and message reach the field before paint.
+ *
+ * @returns `false` outside a `Field` (nothing to report to) — the caller must provide the state itself.
+ */
+export function useReportFormControlValidation(
+  isInvalid: boolean,
+  errorMessage: string | undefined,
+): boolean {
+  const { setControlValidation } = useFormControlContext();
+
+  React.useLayoutEffect(() => {
+    if (typeof setControlValidation !== 'function') {
+      return undefined;
+    }
+    setControlValidation((prev) =>
+      prev?.isInvalid === isInvalid && prev.errorMessage === errorMessage
+        ? prev
+        : { isInvalid, errorMessage },
+    );
+    return undefined;
+  }, [errorMessage, isInvalid, setControlValidation]);
+
+  React.useLayoutEffect(() => {
+    if (typeof setControlValidation !== 'function') {
+      return undefined;
+    }
+    return () => {
+      setControlValidation(undefined);
+    };
+  }, [setControlValidation]);
+
+  return typeof setControlValidation === 'function';
+}
+
 /**
  * Hook that merges local field props with the nearest form field context
  * and returns normalised HTML / ARIA attributes for input elements.