@abgov/jsonforms-components 2.67.12 → 2.68.0

package/index.esm.js

@@ -8905,7 +8905,8 @@ let _$8 = t => t,
   _t26$1,
   _t27$1,
   _t28$1,
-  _t29;
+  _t29,
+  _t30;
 const DeleteDialogContent = styled.div(_t$9 || (_t$9 = _$8`
   margin-bottom: var(--goa-space-m);
 `));
@@ -8920,7 +8921,14 @@ const NonEmptyCellStyle = styled.div(_t3$3 || (_t3$3 = _$8`
 const ToolBarHeader = styled.div(_t4$3 || (_t4$3 = _$8`
   margin-bottom: var(--goa-space-s);
 `));
-const ObjectArrayTitle = styled.h3(_t5$2 || (_t5$2 = _$8`
+const ReviewItemFrame = styled.div(_t5$2 || (_t5$2 = _$8`
+  border: 1px solid var(--goa-color-greyscale-200);
+  border-radius: var(--goa-border-radius-m);
+  padding: var(--goa-space-m) var(--goa-space-l);
+  margin-bottom: var(--goa-space-l);
+  background-color: var(--goa-color-greyscale-white);
+`));
+const ObjectArrayTitle = styled.h3(_t6$2 || (_t6$2 = _$8`
   margin-bottom: var(--goa-space-s);
 
   span {
@@ -8928,24 +8936,24 @@ const ObjectArrayTitle = styled.h3(_t5$2 || (_t5$2 = _$8`
     font-size: var(--goa-font-size-2);
   }
 `));
-const RequiredSpan = styled.span(_t6$2 || (_t6$2 = _$8`
+const RequiredSpan = styled.span(_t7$1 || (_t7$1 = _$8`
   color: #666666;
   font-weight: var(--goa-font-weight-regular);
   font-size: var(--goa-font-size-2);
 `));
-const TextCenter = styled.div(_t7$1 || (_t7$1 = _$8`
+const TextCenter = styled.div(_t8$1 || (_t8$1 = _$8`
   text-align: center;
 `));
-const SideMenuItem = styled.div(_t8$1 || (_t8$1 = _$8`
+const SideMenuItem = styled.div(_t9$1 || (_t9$1 = _$8`
   margin-top: 1rem;
 `));
-const RowFlex = styled.div(_t9$1 || (_t9$1 = _$8`
+const RowFlex = styled.div(_t0$1 || (_t0$1 = _$8`
   display: flex;
   margin: 1.5rem 0 1.5rem 0;
 
   align-items: flex-start;
 `));
-const RowFlexMenuMain = styled.div(_t0$1 || (_t0$1 = _$8`
+const RowFlexMenuMain = styled.div(_t1$1 || (_t1$1 = _$8`
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -8962,7 +8970,7 @@ const RowFlexMenuMain = styled.div(_t0$1 || (_t0$1 = _$8`
     border-color: var(--goa-color-greyscale-400);
   }
 `));
-const RowFlexMenuLeft = styled.div(_t1$1 || (_t1$1 = _$8`
+const RowFlexMenuLeft = styled.div(_t10$1 || (_t10$1 = _$8`
   display: flex;
   flex-direction: row;
   align-items: stretch;
@@ -8978,12 +8986,12 @@ const RowFlexMenuLeft = styled.div(_t1$1 || (_t1$1 = _$8`
     border-color: var(--goa-color-greyscale-400);
   }
 `));
-const FlexTabs = styled.div(_t10$1 || (_t10$1 = _$8`
+const FlexTabs = styled.div(_t11$1 || (_t11$1 = _$8`
   flex-direction: column;
   flex: 1;
   overflow-y: auto !important;
 `));
-const FlexTabsWithMargin = styled.div(_t11$1 || (_t11$1 = _$8`
+const FlexTabsWithMargin = styled.div(_t12$1 || (_t12$1 = _$8`
   flex-direction: column;
   flex: 1;
   overflow-y: auto !important;
@@ -8992,64 +9000,64 @@ const FlexTabsWithMargin = styled.div(_t11$1 || (_t11$1 = _$8`
   flex-shrink: 1;
   // max-height: 500px;
 `));
-const FlexForm = styled.div(_t12$1 || (_t12$1 = _$8`
+const FlexForm = styled.div(_t13$1 || (_t13$1 = _$8`
   flex-direction: column;
   flex: 3;
   flex-shrink: 0;
   overflow-y: visible;
 `));
-const TabName = styled.div(_t13$1 || (_t13$1 = _$8`
+const TabName = styled.div(_t14$1 || (_t14$1 = _$8`
   margin: 1rem 0 1rem 1rem;
   font-weight: 400;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 `));
-const Trash = styled.div(_t14$1 || (_t14$1 = _$8`
+const Trash = styled.div(_t15$1 || (_t15$1 = _$8`
   margin: 0.9rem 0.4rem 0.6rem 0.75rem;
   margin-left: auto;
 `));
-const ListContainer = styled.div(_t15$1 || (_t15$1 = _$8`
+const ListContainer = styled.div(_t16$1 || (_t16$1 = _$8`
   padding: 0 0 0 0;
 `));
-styled.div(_t16$1 || (_t16$1 = _$8`
+styled.div(_t17$1 || (_t17$1 = _$8`
   padding: 0 0 var(--goa-space-l) 0;
 `));
-const UpdateListContainer = styled.div(_t17$1 || (_t17$1 = _$8`
+const UpdateListContainer = styled.div(_t18$1 || (_t18$1 = _$8`
   width: 100%;
   border: 1px solid #dcdcdc;
   padding: var(--goa-space-xl);
 `));
-styled.div(_t18$1 || (_t18$1 = _$8`
+styled.div(_t19$1 || (_t19$1 = _$8`
   padding: 0 1.5rem 0 0;
   border: 1px solid #dcdcdc;
 `));
-styled.th(_t19$1 || (_t19$1 = _$8`
+styled.th(_t20$1 || (_t20$1 = _$8`
   background-color: var(--goa-color-greyscale-100) !important;
   vertical-align: top;
 `));
-const ObjectArrayWarningIconDiv = styled.div(_t20$1 || (_t20$1 = _$8`
+const ObjectArrayWarningIconDiv = styled.div(_t21$1 || (_t21$1 = _$8`
   display: inline-flex;
   align-items: flex-start;
   gap: 0.25rem;
   font-size: var(--goa-font-size-2);
   color: var(--goa-color-interactive-error);
 `));
-const ListWithDetailWarningIconDiv = styled.div(_t21$1 || (_t21$1 = _$8`
+const ListWithDetailWarningIconDiv = styled.div(_t22$1 || (_t22$1 = _$8`
   display: inline-flex;
   align-items: flex-start;
   gap: 0.25rem;
   font-size: var(--goa-font-size-3);
   color: var(--goa-color-interactive-error);
 `));
-styled.label(_t22$1 || (_t22$1 = _$8`
+styled.label(_t23$1 || (_t23$1 = _$8`
   color: var(--goa-color-interactive-error);
   font-weight: var(--goa-font-weight-regular);
   font-size: var(--goa-font-size-3);
   line-height: var(--goa-line-height-1);
   font-style: normal;
 `));
-styled.div(_t23$1 || (_t23$1 = _$8`
+styled.div(_t24$1 || (_t24$1 = _$8`
   margin-top: var(--goa-space-m);
   color: var(--goa-color-interactive-error);
   font-weight: var(--goa-font-weight-regular);
@@ -9057,10 +9065,10 @@ styled.div(_t23$1 || (_t23$1 = _$8`
   line-height: var(--goa-line-height-1);
   font-style: normal;
 `));
-const HilightCellWarning = styled.div(_t24$1 || (_t24$1 = _$8`
+const HilightCellWarning = styled.div(_t25$1 || (_t25$1 = _$8`
   background-color: transparent;
 `));
-const FixTableHeaderAlignment = styled.div(_t25$1 || (_t25$1 = _$8`
+const FixTableHeaderAlignment = styled.div(_t26$1 || (_t26$1 = _$8`
   table thead th:nth-child(3) {
     text-align: center;
   }
@@ -9069,22 +9077,22 @@ const FixTableHeaderAlignment = styled.div(_t25$1 || (_t25$1 = _$8`
     text-align: center;
   }
 `));
-const ListWithDetailsReviewCellDiv = styled.div(_t26$1 || (_t26$1 = _$8`
+const ListWithDetailsReviewCellDiv = styled.div(_t27$1 || (_t27$1 = _$8`
   display: 'flex';
   flex-direction: 'column';
   text-align: 'start';
 `));
-const IconsContainer = styled.div(_t27$1 || (_t27$1 = _$8`
+const IconsContainer = styled.div(_t28$1 || (_t28$1 = _$8`
   display: flex;
   align-items: center;
   justify-content: flex-end;
   gap: var(--goa-space-xs);
   padding-bottom: var(--goa-space-xs);
 `));
-const TableContentContainer = styled.div(_t28$1 || (_t28$1 = _$8`
+const TableContentContainer = styled.div(_t29 || (_t29 = _$8`
   padding: var(--goa-space-l);
 `));
-const NoDataMessage = styled.div(_t29 || (_t29 = _$8`
+const NoDataMessage = styled.div(_t30 || (_t30 = _$8`
   padding: var(--goa-space-xl) var(--goa-space-l);
   color: var(--goa-color-greyscale-700);
   font: var(--goa-typography-body-m);
@@ -12288,10 +12296,7 @@ const NonEmptyCellComponent = /*#__PURE__*/React.memo(function NonEmptyCellCompo
           });
           const hasRowErrors = (errors || []).some(e => e.instancePath.includes(`/${props.rowPath.replace(/\./g, '/')}/${i}`));
           if (!hasAnyValue && !hasRowErrors) return null;
-          return jsx("div", {
-            style: {
-              marginBottom: '1.5rem'
-            },
+          return jsx(ReviewItemFrame, {
             "data-testid": `${rowPath}.objectList-${key}`,
             children: Object.entries(tableKeys).map(([key, label]) => {
               var _required$includes, _properties$key;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/jsonforms-components",
-  "version": "2.67.12",
+  "version": "2.68.0",
   "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-07-02T19:40:00.849Z",
-  "sourceCommit": "9a25ace569731b5d27d06b04612ba2368fc791dd",
+  "generatedAt": "2026-07-09T17:56:36.899Z",
+  "sourceCommit": "14da8d8d672299c489c33a8a1cfc98b795abd682",
   "sourcePath": "libs/jsonforms-components/src/index.ts",
   "rendererCount": 33,
   "renderers": [

package/src/lib/Controls/ObjectArray/styled-components.d.ts

@@ -2,6 +2,7 @@ export declare const DeleteDialogContent: import("styled-components/dist/types")
 export declare const MarginTop: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
 export declare const NonEmptyCellStyle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
 export declare const ToolBarHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
+export declare const ReviewItemFrame: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;
 export declare const ObjectArrayTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>>> & string;
 export declare const RequiredSpan: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>> & string;
 export declare const TextCenter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>> & string;