@westpac/ui 1.5.0 → 1.6.0

package/dist/components/input-group/input-group.component.d.ts

@@ -1,2 +1,2 @@
 import { type InputGroupProps } from './input-group.types.js';
-export declare function InputGroup({ label, hideLabel, size, hint, errorMessage, supportingText, instanceId, after, before, children, tag: Tag, className, width, id: propID, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, 'aria-label': ariaLabel, ...props }: InputGroupProps): import("react/jsx-runtime").JSX.Element;
+export declare function InputGroup({ label, hideLabel, size, hint, errorMessage, errorTitle, supportingText, instanceId, after, before, children, tag: Tag, className, width, id: propID, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, 'aria-label': ariaLabel, ...props }: InputGroupProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/input-group/input-group.component.js

@@ -6,7 +6,7 @@ import { ErrorMessage, Hint, Label } from '../index.js';
 import { InputGroupSupportingText } from './components/index.js';
 import { InputGroupAddOn } from './components/input-group-add-ons/input-group-add-ons.component.js';
 import { styles as inputGroupStyles } from './input-group.styles.js';
-export function InputGroup({ label, hideLabel, size = 'medium', hint, errorMessage, supportingText, instanceId, after, before, children, tag: Tag = 'div', className, width = 'full', id: propID, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, 'aria-label': ariaLabel, ...props }) {
+export function InputGroup({ label, hideLabel, size = 'medium', hint, errorMessage, errorTitle, supportingText, instanceId, after, before, children, tag: Tag = 'div', className, width = 'full', id: propID, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, 'aria-label': ariaLabel, ...props }) {
     const _id = useId();
     const id = useMemo(()=>instanceId || `gel-field-${_id}`, [
         _id,
@@ -124,6 +124,7 @@ export function InputGroup({ label, hideLabel, size = 'medium', hint, errorMessa
         id: `${id}-hint`
     }, hint), errorMessage && React.createElement(ErrorMessage, {
         id: `${id}-error`,
+        errorTitle: errorTitle,
         message: errorMessage
     }), React.createElement("div", {
         className: styles.input()

package/dist/components/input-group/input-group.types.d.ts

@@ -37,6 +37,10 @@ export type InputGroupProps = {
      * Error message text
      */
     errorMessage?: string | string[];
+    /**
+     * Error title
+     */
+    errorTitle?: string;
     /**
      * Visually hide label
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@westpac/ui",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "license": "MIT",
   "sideEffects": false,
   "type": "module",
@@ -253,9 +253,9 @@
     "typescript": "^5.5.4",
     "vite": "^7.1.12",
     "vitest": "^3.2.4",
-    "@westpac/style-config": "~1.0.2",
     "@westpac/eslint-config": "~1.1.0",
     "@westpac/test-config": "~0.0.0",
+    "@westpac/style-config": "~1.0.2",
     "@westpac/ts-config": "~0.0.0"
   },
   "dependencies": {

package/src/components/input-group/input-group.component.tsx

@@ -26,6 +26,7 @@ export function InputGroup({
   size = 'medium',
   hint,
   errorMessage,
+  errorTitle,
   supportingText,
   instanceId,
   after,
@@ -135,7 +136,7 @@ export function InputGroup({
         </Label>
       )}
       {hint && <Hint id={`${id}-hint`}>{hint}</Hint>}
-      {errorMessage && <ErrorMessage id={`${id}-error`} message={errorMessage} />}
+      {errorMessage && <ErrorMessage id={`${id}-error`} errorTitle={errorTitle} message={errorMessage} />}
       <div className={styles.input()}>
         {before && (
           <InputGroupAddOn position="before" size={resolvedSize} inset={beforeInset} icon={beforeIcon} id={id}>

package/src/components/input-group/input-group.types.ts

@@ -34,6 +34,10 @@ export type InputGroupProps = {
    * Error message text
    */
   errorMessage?: string | string[];
+  /**
+   * Error title
+   */
+  errorTitle?: string;
   /**
    * Visually hide label
    */