@abgov/jsonforms-components 2.52.4 → 2.52.6

package/index.esm.js

@@ -3054,6 +3054,7 @@ $$z({ target: 'Iterator', proto: true, real: true, forced: IS_PURE$3 }, {
 const sinTitle = 'Social insurance number';
 const invalidSin = 'Social insurance number is invalid';
 const DEFAULT_MAX_ITEMS = 50;
+const REQUIRED_PROPERTY_ERROR = 'is a required property';
 
 /**
  * Sets the first word to be capitalized so that it is sentence cased.
@@ -9374,7 +9375,7 @@ const MainTab = ({
             acc.fields[field] = prettify$1(missingFromNested) + ' is required';
           } else {
             const raw = e.message;
-            if (raw && (raw.includes('must have required property') || raw.includes('is a required property'))) {
+            if (raw && (raw.includes('must have required property') || raw.includes(REQUIRED_PROPERTY_ERROR))) {
               const m = raw.match(/'([^']+)'/);
               if (m && m[1]) acc.fields[field] = prettify$1(m[1]) + ' is required';else acc.fields[field] = raw;
             } else {
@@ -9392,7 +9393,7 @@ const MainTab = ({
             acc.row = prettify$1(missingFromNested) + ' is required';
           } else {
             const raw = e == null ? void 0 : e.message;
-            if (raw && (raw.includes('must have required property') || raw.includes('is a required property'))) {
+            if (raw && (raw.includes('must have required property') || raw.includes(REQUIRED_PROPERTY_ERROR))) {
               const m = raw.match(/'([^']+)'/);
               if (m && m[1]) acc.row = prettify$1(m[1]) + ' is required';else acc.row = raw;
             } else {
@@ -9405,7 +9406,7 @@ const MainTab = ({
     }
     if (!acc.fields[field]) {
       let msg = humanizeAjvError(e, core.schema, core.uischema);
-      if (typeof msg === 'string' && (msg.includes('must have required property') || msg.includes('is a required property'))) {
+      if (typeof msg === 'string' && (msg.includes('must have required property') || msg.includes(REQUIRED_PROPERTY_ERROR))) {
         const propertyMatch = msg.match(/'([^']+)'/);
         if (propertyMatch && propertyMatch[1]) {
           msg = prettify$1(propertyMatch[1]) + ' is required';
@@ -9757,6 +9758,24 @@ const GoAInputBaseTableReview = props => {
   }
   let reviewText = data;
   const isBoolean = typeof data === 'boolean';
+  const getArrayDisplayValues = () => {
+    var _itemSchema$oneOf;
+    if (!Array.isArray(data)) {
+      return [];
+    }
+    const itemSchema = schema == null ? void 0 : schema.items;
+    const oneOf = (_itemSchema$oneOf = itemSchema == null ? void 0 : itemSchema.oneOf) != null ? _itemSchema$oneOf : [];
+    const titleByConst = new Map();
+    oneOf.forEach(option => {
+      var _option$title;
+      if (!(option != null && option.const)) return;
+      titleByConst.set(option.const, (_option$title = option.title) != null ? _option$title : option.const);
+    });
+    return data.map(value => {
+      const raw = typeof value === 'string' ? value : String(value);
+      return titleByConst.get(raw) || raw;
+    });
+  };
   if (isBoolean) {
     var _uischema$options2, _uischema$options3;
     let checkboxLabel = '';
@@ -9776,6 +9795,18 @@ const GoAInputBaseTableReview = props => {
       }
     }
   }
+  if (Array.isArray(data) && data.length > 0) {
+    const displayValues = getArrayDisplayValues();
+    reviewText = jsx("ul", {
+      style: {
+        margin: 0,
+        paddingLeft: '1.25rem'
+      },
+      children: displayValues.map((value, index) => jsx("li", {
+        children: value
+      }, `${value}-${index}`))
+    });
+  }
   // Helper to extract errors manually from global state, bypassing "touched" filter
   const normalizePath = p => p.replace(/\[(\d+)\]/g, '.$1').replace(/^\./, '').replace(/\//g, '.');
   const findMatchingError = currentErrors => {
@@ -9849,7 +9880,7 @@ const GoAInputBaseTableReview = props => {
           children: "Change"
         })]
       }), jsxs(ReviewValue, {
-        children: [typeof reviewText === 'string' || typeof reviewText === 'number' ? jsx("div", {
+        children: [typeof reviewText === 'string' || typeof reviewText === 'number' || /*#__PURE__*/React.isValidElement(reviewText) ? jsx("div", {
           "data-testid": `review-value-${label}`,
           children: reviewText
         }) : jsx(JsonFormsDispatch, {
@@ -9859,11 +9890,9 @@ const GoAInputBaseTableReview = props => {
           enabled: enabled,
           renderers: jsonForms.renderers,
           cells: cells
-        }), activeError && jsxs(WarningIconDiv, {
-          children: [jsx(GoabIcon, {
-            type: "warning",
-            size: "small"
-          }), activeError]
+        }), activeError && jsx(GoabFormItem, {
+          error: activeError,
+          label: ""
         })]
       })]
     })
@@ -10013,7 +10042,7 @@ const GoAEmailInput = props => {
   }, [showReviewLink]);
   const splitErrors = (errors != null ? errors : '').split(/\r?\n/).map(e => e.trim()).filter(Boolean);
   const primaryLabel = (defaultSchema == null ? void 0 : defaultSchema.label) || defaultLabel;
-  const splintIndex = splitErrors.findIndex(e => e === 'is a required property');
+  const splintIndex = splitErrors.findIndex(e => e === REQUIRED_PROPERTY_ERROR);
   splitErrors[splintIndex] = `${primaryLabel} is required`;
   const finalErrors = splitErrors.join('\n');
   return jsx(Visible, {
@@ -10633,11 +10662,9 @@ const FullNameControlReview = props => {
             testId: "full-name-change-btn",
             children: "Change"
           })]
-        }), errors && jsxs(WarningIconDiv, {
-          children: [jsx(GoabIcon, {
-            type: "warning",
-            size: "small"
-          }), errors != null && errors.includes('is a required property') ? `${label} is required` : errors]
+        }), errors && jsx(GoabFormItem, {
+          error: errors != null && errors.includes(REQUIRED_PROPERTY_ERROR) ? `${label} is required` : errors,
+          label: ""
         })]
       })
     }), renderRow('First name', data == null ? void 0 : data.firstName, `firstName-control-${id}`), (data == null ? void 0 : data.middleName) && renderRow('Middle name', data == null ? void 0 : data.middleName, `middleName-control-${id}`), renderRow('Last name', data == null ? void 0 : data.lastName, `lastName-control-${id}`)]
@@ -10692,11 +10719,9 @@ const FullNameDobReviewControl = props => {
             testId: "fullname-dob-change-btn",
             children: "Change"
           })]
-        }), errors && jsxs(WarningIconDiv, {
-          children: [jsx(GoabIcon, {
-            type: "warning",
-            size: "small"
-          }), errors != null && errors.includes('is a required property') ? `${label} is required` : errors]
+        }), errors && jsx(GoabFormItem, {
+          error: errors != null && errors.includes(REQUIRED_PROPERTY_ERROR) ? `${label} is required` : errors,
+          label: ""
         })]
       })
     }), renderRow('First name', data == null ? void 0 : data.firstName, `firstName-control-${id}`), (data == null ? void 0 : data.middleName) && renderRow('Middle name', data == null ? void 0 : data.middleName, `middleName-control-${id}`), renderRow('Last name', data == null ? void 0 : data.lastName, `lastName-control-${id}`), renderRow('Date of birth', data == null ? void 0 : data.dateOfBirth, `dob-control-${id}`)]
@@ -11206,7 +11231,7 @@ const NonEmptyCellComponent = /*#__PURE__*/React.memo(function NonEmptyCellCompo
                   if (error) {
                     try {
                       humanMessage = humanizeAjvError(error, schema, uischema);
-                      if (typeof humanMessage === 'string' && (humanMessage.includes('must have required property') || humanMessage.includes('is a required property'))) {
+                      if (typeof humanMessage === 'string' && (humanMessage.includes('must have required property') || humanMessage.includes(REQUIRED_PROPERTY_ERROR))) {
                         const propertyMatch = humanMessage.match(/'([^']+)'/);
                         if (propertyMatch && propertyMatch[1]) {
                           humanMessage = prettify(propertyMatch[1]) + ' is required';
@@ -12130,7 +12155,7 @@ const AddressLoopUpControlTableReview = props => {
     } catch (err) {
       // fallback to parsing the raw message
       const raw = matched.message;
-      if (raw != null && raw.includes('must have required property') || raw != null && raw.includes('is a required property')) {
+      if (raw != null && raw.includes('must have required property') || raw != null && raw.includes(REQUIRED_PROPERTY_ERROR)) {
         const propertyMatch = raw.match(/'([^']+)'/);
         if (propertyMatch && propertyMatch[1]) {
           return prettify(propertyMatch[1]) + ' is required';
@@ -12146,12 +12171,12 @@ const AddressLoopUpControlTableReview = props => {
   // Build the target scope for the address control
   const targetScope = (uischema == null ? void 0 : uischema.scope) || (path ? `#/properties/${path}` : undefined);
   const renderRow = (label, value, propName, showButton = false) => {
-    var _error, _error2;
     let error = getError(propName);
     const required = isRequired(propName);
     if (required && !value && !error) {
       error = `${label} is required`;
     }
+    const errorMessage = error && (error.includes(REQUIRED_PROPERTY_ERROR) || error.includes('required property')) ? `${label} is required` : error;
     return jsx("tr", {
       children: jsxs(PageReviewContainer, {
         colSpan: 3,
@@ -12168,11 +12193,9 @@ const AddressLoopUpControlTableReview = props => {
             children: "Change"
           })]
         }), jsxs(ReviewValue, {
-          children: [value, error && jsxs(WarningIconDiv, {
-            children: [jsx(GoabIcon, {
-              type: "warning",
-              size: "small"
-            }), (_error = error) != null && _error.includes('is a required property') || (_error2 = error) != null && _error2.includes('required property') ? `${label} is required` : error]
+          children: [value, errorMessage && jsx(GoabFormItem, {
+            error: errorMessage,
+            label: ""
           })]
         })]
       })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/jsonforms-components",
-  "version": "2.52.4",
+  "version": "2.52.6",
   "license": "Apache-2.0",
   "description": "Government of Alberta - React renderers for JSON Forms based on the design system.",
   "repository": "https://github.com/GovAlta/adsp-monorepo",

package/renderer-catalog.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": "1.0.0",
-  "generatedAt": "2026-03-11T20:34:29.251Z",
-  "sourceCommit": "f6ef75a475c4b947ccfa5973b95b3863c853bd54",
+  "generatedAt": "2026-03-12T17:06:12.099Z",
+  "sourceCommit": "8e70c36cadefa29ed84a8d37cfaab8454a468304",
   "sourcePath": "libs/jsonforms-components/src/index.ts",
   "rendererCount": 32,
   "renderers": [

package/src/lib/common/Constants.d.ts

@@ -1,3 +1,4 @@
 export declare const sinTitle = "Social insurance number";
 export declare const invalidSin = "Social insurance number is invalid";
 export declare const DEFAULT_MAX_ITEMS = 50;
+export declare const REQUIRED_PROPERTY_ERROR = "is a required property";