@abgov/jsonforms-components 2.43.8 → 2.44.0

package/index.esm.js

@@ -8204,8 +8204,8 @@ const GoAInputBaseTableReview = props => {
   const stepId = (_uischema$options3 = uischema.options) == null ? void 0 : _uischema$options3.stepId;
   return jsxs("tr", {
     "data-testid": `input-base-table-${label}-row`,
-    children: [labelToUpdate && jsx(PageReviewNameCol, {
-      children: jsx("strong", {
+    children: [jsx(PageReviewNameCol, {
+      children: labelToUpdate && jsx("strong", {
         children: labelToUpdate
       })
     }), jsx(PageReviewValueCol, {
@@ -8543,9 +8543,6 @@ let _$6 = t => t,
 const ReviewItem = styled.div(_t$7 || (_t$7 = _$6`
   display: flex;
   flex-direction: column;
-  div:empty {
-    display: none;
-  }
 `));
 const CompletionStatus = styled.div(_t2$4 || (_t2$4 = _$6`
   padding: 0;
@@ -9625,7 +9622,7 @@ const renderCellColumn = ({
   return null;
 };
 
-const _excluded$3 = ["label", "path", "schema", "rootSchema", "uischema", "errors", "visible", "enabled", "cells", "data", "config", "isStepperReview", "handleChange", "removeItems"];
+const _excluded$4 = ["label", "path", "schema", "rootSchema", "uischema", "errors", "visible", "enabled", "cells", "data", "config", "isStepperReview", "handleChange", "removeItems"];
 const GenerateRows$1 = (Cell, schema, rowPath, enabled, openDeleteDialog, handleChange, cells, uischema, isInReview, count, data, errors) => {
   if ((schema == null ? void 0 : schema.type) === 'object') {
     const props = {
@@ -9995,7 +9992,7 @@ const ObjectArrayControl = props => {
       config,
       isStepperReview
     } = props,
-    additionalProps = _objectWithoutPropertiesLoose(props, _excluded$3);
+    additionalProps = _objectWithoutPropertiesLoose(props, _excluded$4);
   const parsedData = data;
   const openDeleteDialog = useCallback((rowIndex, name) => {
     setOpen(true);
@@ -10310,7 +10307,7 @@ $$1({ target: 'Iterator', proto: true, real: true, forced: IS_PURE }, {
   }
 });
 
-const _excluded$2 = ["label", "path", "schema", "rootSchema", "uischema", "errors", "openDeleteDialog", "visible", "enabled", "cells", "data", "config"];
+const _excluded$3 = ["label", "path", "schema", "rootSchema", "uischema", "errors", "openDeleteDialog", "visible", "enabled", "cells", "data", "config"];
 const getItemsTitle = schema => {
   const items = schema == null ? void 0 : schema.items;
   if (items && !Array.isArray(items) && typeof items === 'object') {
@@ -11028,7 +11025,7 @@ class ListWithDetailControl extends React.Component {
         data,
         config
       } = _this$props,
-      additionalProps = _objectWithoutPropertiesLoose(_this$props, _excluded$2);
+      additionalProps = _objectWithoutPropertiesLoose(_this$props, _excluded$3);
     const controlElement = uischema;
     // eslint-disable-next-line
     const listTitle = (_ref = (_ref2 = (_ref3 = (_uischema$label = uischema == null ? void 0 : uischema.label) != null ? _uischema$label : uischema == null || (_uischema$options15 = uischema.options) == null ? void 0 : _uischema$options15.title) != null ? _ref3 : getItemsTitle(schema)) != null ? _ref2 : schema == null ? void 0 : schema.title) != null ? _ref : label;
@@ -11803,7 +11800,7 @@ const RenderLink = props => {
   });
 };
 
-const _excluded$1 = ["isParent", "showLabel"];
+const _excluded$2 = ["isParent", "showLabel"];
 const HelpContentReviewComponent = () => {
   return jsx(Fragment, {
     children: " "
@@ -11848,7 +11845,7 @@ const HelpContentComponent = _ref => {
       isParent = true,
       showLabel = true
     } = _ref,
-    props = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+    props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
   const labelClass = isParent ? 'parent-label' : 'child-label';
   const marginClass = isParent ? 'parent-margin' : 'child-margin';
   // eslint-disable-next-line
@@ -12032,8 +12029,9 @@ const TableHelpContentComponent = props => {
 };
 const TableLayoutRenderer = withJsonFormsLayoutProps(TableLayoutRendererComponent);
 const TableGroupLayoutRenderer = withJsonFormsLayoutProps(TableGroupLayoutRendererComponent);
-const TableHelpContentRenderer = withJsonFormsControlProps(TableHelpContentComponent);
+withJsonFormsControlProps(TableHelpContentComponent);
 
+const EmptyHelpContentRenderer = () => null;
 const GoABaseTableReviewRenderers$1 = [
 // controls
 {
@@ -12101,7 +12099,7 @@ const GoABaseTableReviewRenderers$1 = [
   renderer: TableGroupLayoutRenderer
 }, {
   tester: HelpContentTester,
-  renderer: TableHelpContentRenderer
+  renderer: EmptyHelpContentRenderer
 }];
 [
 // controls
@@ -12167,7 +12165,7 @@ const GoABaseTableReviewRenderers$1 = [
   renderer: TableGroupLayoutRenderer
 }, {
   tester: HelpContentTester,
-  renderer: TableHelpContentRenderer
+  renderer: EmptyHelpContentRenderer
 }];
 const FormStepperReviewer = props => {
   var _uischema$options$com, _uischema$options, _componentProps$readO;
@@ -12586,6 +12584,30 @@ const SummaryRow = ({
   });
 };
 
+const _excluded$1 = ["type"];
+const AdditionalInstructionsRow = ({
+  additionalInstructions,
+  componentProps
+}) => {
+  const validTypes = ['information', 'important', 'emergency', 'success', 'event'];
+  const calloutType = (componentProps == null ? void 0 : componentProps.type) || 'information';
+  const type = validTypes.includes(calloutType) ? calloutType : 'information';
+  const _ref = componentProps || {},
+    otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+  return jsx("tr", {
+    children: jsx("td", {
+      colSpan: 2,
+      children: jsx(GoabCallout, Object.assign({
+        type: type,
+        mt: "xl",
+        mb: "l"
+      }, otherProps, {
+        children: additionalInstructions
+      }))
+    })
+  });
+};
+
 function mergeOrphanSections(sections) {
   const result = [];
   for (const section of sections) {
@@ -12644,9 +12666,20 @@ const TaskList = ({
   title,
   subtitle,
   isValid,
-  hideSummary
+  hideSummary,
+  additionalInstructions
 }) => {
   const testid = 'table-of-contents';
+  const instructionsConfig = useMemo(() => {
+    if (!additionalInstructions) return null;
+    if (typeof additionalInstructions === 'string') {
+      return {
+        content: additionalInstructions,
+        componentProps: {}
+      };
+    }
+    return additionalInstructions;
+  }, [additionalInstructions]);
   // Merge and expand sections
   const mergedSections = useMemo(() => {
     const sections = mergeOrphanSections(getCategorySections(categories));
@@ -12691,7 +12724,10 @@ const TaskList = ({
                 onClick: onClick
               }, `cat-${category.label}-${idx}`) : null;
             })]
-          }, index)), !hideSummary ? jsx(SummaryRow, {
+          }, index)), instructionsConfig && jsx(AdditionalInstructionsRow, {
+            additionalInstructions: instructionsConfig.content,
+            componentProps: instructionsConfig.componentProps
+          }, "additional-instructions"), !hideSummary ? jsx(SummaryRow, {
             index: globalIndex,
             isValid: isValid,
             onClick: onClick
@@ -13021,7 +13057,7 @@ const FormPagesView = props => {
     goToPage(index);
   };
   if (categories.length + 1 === activeId) {
-    var _props$uischema, _props$uischema2, _props$uischema3;
+    var _props$uischema, _props$uischema2, _props$uischema3, _props$uischema4;
     const patchedCategories = categories.map(c => {
       const scopes = getCategoryScopes(c);
       const hasData = hasDataInScopes(data, scopes);
@@ -13039,7 +13075,8 @@ const FormPagesView = props => {
       title: (_props$uischema = props.uischema) == null || (_props$uischema = _props$uischema.options) == null ? void 0 : _props$uischema.title,
       subtitle: (_props$uischema2 = props.uischema) == null || (_props$uischema2 = _props$uischema2.options) == null ? void 0 : _props$uischema2.subtitle,
       isValid: completedCount === visibleCats.length,
-      hideSummary: (_props$uischema3 = props.uischema) == null || (_props$uischema3 = _props$uischema3.options) == null ? void 0 : _props$uischema3.hideSummary
+      hideSummary: (_props$uischema3 = props.uischema) == null || (_props$uischema3 = _props$uischema3.options) == null ? void 0 : _props$uischema3.hideSummary,
+      additionalInstructions: (_props$uischema4 = props.uischema) == null || (_props$uischema4 = _props$uischema4.options) == null ? void 0 : _props$uischema4.additionalInstructions
     };
     return jsx(TaskList, Object.assign({}, tocProps));
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/jsonforms-components",
-  "version": "2.43.8",
+  "version": "2.44.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/src/lib/Controls/FormStepper/TaskList/TaskList.d.ts

@@ -1,6 +1,14 @@
 import React from 'react';
 import { RankedTester } from '@jsonforms/core';
+import { GoabCalloutType } from '@abgov/ui-components-common';
 import { CategoriesState } from '../context';
+export interface AdditionalInstructionsConfig {
+    content: string;
+    componentProps?: {
+        type?: GoabCalloutType | string;
+        [key: string]: unknown;
+    };
+}
 export interface TocProps {
     categories: CategoriesState;
     onClick: (id: number) => void;
@@ -8,6 +16,7 @@ export interface TocProps {
     subtitle?: string;
     isValid: boolean;
     hideSummary: boolean;
+    additionalInstructions?: string | AdditionalInstructionsConfig;
 }
 export declare const TaskList: React.FC<TocProps>;
 export declare const TableOfContentsTester: RankedTester;

package/src/lib/Controls/FormStepper/TaskList/additionalInstructionsRow.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { GoabCalloutType } from '@abgov/ui-components-common';
+interface AdditionalInstructionsRowProps {
+    additionalInstructions: string;
+    componentProps?: {
+        type?: GoabCalloutType | string;
+        [key: string]: unknown;
+    };
+}
+export declare const AdditionalInstructionsRow: React.FC<AdditionalInstructionsRowProps>;
+export {};