@abgov/jsonforms-components 2.57.4 → 2.58.0

package/index.esm.js

@@ -7,7 +7,7 @@ import styled from 'styled-components';
 import axios from 'axios';
 import get$1 from 'lodash/get';
 import { isVisible, isEnabled, deriveLabelForUISchemaElement, rankWith, isStringControl, and, optionIs, isDateControl, isNumberControl, isIntegerControl, isDateTimeControl, isTimeControl, uiTypeIs, isControl as isControl$1, isEnumControl, isBooleanControl, createDefaultValue, Paths, Resolve, toDataPath, schemaTypeIs, formatIs, getAjv, schemaMatches, or, isObjectArrayControl, isPrimitiveArrayControl, composePaths, hasType, isCategorization, isLayout } from '@jsonforms/core';
-import * as _$b from 'lodash';
+import * as _$c from 'lodash';
 import ___default, { isObject as isObject$i, isEmpty as isEmpty$1 } from 'lodash';
 import { useJsonForms, withJsonFormsControlProps, withJsonFormsEnumProps, withTranslateProps, JsonFormsDispatch, withJsonFormsAllOfProps, withJsonFormsArrayLayoutProps, withJsonFormsLayoutProps, withJsonFormsCellProps } from '@jsonforms/react';
 import dompurify from 'dompurify';
@@ -4078,16 +4078,16 @@ const ensureGoaDatePointerCursor = host => {
   sr.appendChild(style);
 };
 
-let _$a = t => t,
-  _t$b,
+let _$b = t => t,
+  _t$c,
   _t2$6;
-styled.div(_t$b || (_t$b = _$a`
+styled.div(_t$c || (_t$c = _$b`
   height: 70vh;
   overflow-y: auto;
   padding-left: var(--goa-space-2xs);
   padding-right: var(--goa-space-2xs);
 `));
-const Visible = styled.div(_t2$6 || (_t2$6 = _$a`
+const Visible = styled.div(_t2$6 || (_t2$6 = _$b`
   display: ${0};
   width: 100%;
 `), p => p.visible ? 'block' : 'none');
@@ -4213,6 +4213,15 @@ const OPTION_DEFINITIONS = defineFields$1({
   mainTitle: {
     schema: 'Main form title'
   },
+  enableEmail: {
+    schema: true
+  },
+  enablePhone: {
+    schema: true
+  },
+  emailFirst: {
+    schema: true
+  },
   noDataMessage: {
     schema: 'no data'
   },
@@ -5767,8 +5776,8 @@ const useRegisterUser = () => {
   return ctx.user;
 };
 
-let _$9 = t => t,
-  _t$a,
+let _$a = t => t,
+  _t$b,
   _t2$5,
   _t3$4,
   _t4$4,
@@ -5780,10 +5789,10 @@ let _$9 = t => t,
   _t0$2,
   _t1$2,
   _t10$2;
-const FormFieldWrapper = styled.div(_t$a || (_t$a = _$9`
+const FormFieldWrapper$1 = styled.div(_t$b || (_t$b = _$a`
   margin-bottom: var(--goa-space-l);
 `));
-const WarningIconDiv = styled.div(_t2$5 || (_t2$5 = _$9`
+const WarningIconDiv = styled.div(_t2$5 || (_t2$5 = _$a`
   display: flex;
   align-items: flex-start;
   gap: var(--goa-space-2xs);
@@ -5791,58 +5800,58 @@ const WarningIconDiv = styled.div(_t2$5 || (_t2$5 = _$9`
   color: var(--goa-form-item-error-message-color);
   margin-top: var(--goa-form-item-message-margin-top);
 `));
-const RequiredTextLabel = styled.label(_t3$4 || (_t3$4 = _$9`
+const RequiredTextLabel = styled.label(_t3$4 || (_t3$4 = _$a`
   color: var(--goa-color-greyscale-700);
   font-weight: var(--goa-font-weight-regular);
   font-size: var(--goa-font-size-2);
   line-height: var(--goa-line-height-1);
   font-style: normal;
 `));
-styled.td(_t4$4 || (_t4$4 = _$9`
+styled.td(_t4$4 || (_t4$4 = _$a`
   width: 40%;
   padding-top: var(--goa-space-s);
   padding-bottom: var(--goa-space-s);
   padding-right: var(--goa-space-m);
   vertical-align: top;
 `));
-styled.td(_t5$3 || (_t5$3 = _$9`
+styled.td(_t5$3 || (_t5$3 = _$a`
   width: 40%;
   text-align: left;
   vertical-align: top;
 `));
-const PageReviewContainer = styled.td(_t6$3 || (_t6$3 = _$9`
+const PageReviewContainer = styled.td(_t6$3 || (_t6$3 = _$a`
   padding: 12px 0px;
   border-bottom: 1px solid #ccc;
   width: 100%;
   vertical-align: top;
 `));
-const ReviewHeader = styled.div(_t7$2 || (_t7$2 = _$9`
+const ReviewHeader = styled.div(_t7$2 || (_t7$2 = _$a`
   display: flex;
   justify-content: space-between;
   align-items: center;
   width: 100%;
 `));
-const ReviewLabel = styled.div(_t8$2 || (_t8$2 = _$9`
+const ReviewLabel = styled.div(_t8$2 || (_t8$2 = _$a`
   font-weight: var(--goa-font-weight-bold);
   font-size: var(--goa-font-size-4);
   line-height: var(--goa-line-height-3);
   color: var(--goa-color-text-default);
 `));
-const ReviewValue = styled.div(_t9$2 || (_t9$2 = _$9`
+const ReviewValue = styled.div(_t9$2 || (_t9$2 = _$a`
   margin-top: var(--goa-space-m);
   color: var(--goa-color-text-default);
   font-size: var(--goa-font-size-4);
   line-height: var(--goa-line-height-3);
 `));
 //Check and unchecked are different heights otherwise
-const CheckboxWrapper = styled.div(_t0$2 || (_t0$2 = _$9`
+const CheckboxWrapper = styled.div(_t0$2 || (_t0$2 = _$a`
   min-height: 28px;
 `));
-styled.h4(_t1$2 || (_t1$2 = _$9`
+styled.h4(_t1$2 || (_t1$2 = _$a`
   margin: 0 0 0.25rem 0;
   fontsize: larger;
 `));
-styled.h4(_t10$2 || (_t10$2 = _$9`
+styled.h4(_t10$2 || (_t10$2 = _$a`
   border-bottom: 1px solid #ddd;
 `));
 
@@ -5957,7 +5966,7 @@ const pickPropertyValues = (obj, property, endWithType) => {
   Object.entries(obj).forEach(function ([key, value]) {
     if (key === property) {
       values.push(value);
-    } else if (_$b.isObject(value)) {
+    } else if (_$c.isObject(value)) {
       // if the object type is equal to end type, we are not going to continue the recursive approach
       if ((value == null ? void 0 : value.type) === endWithType) {
         if (property in value) {
@@ -5966,7 +5975,7 @@ const pickPropertyValues = (obj, property, endWithType) => {
       } else {
         values = [...values, ...pickPropertyValues(value, property, endWithType)];
       }
-    } else if (_$b.isArray(value)) {
+    } else if (_$c.isArray(value)) {
       const nextValues = value.map(function (arrayObj) {
         return pickPropertyValues(arrayObj, property, endWithType);
       });
@@ -6969,7 +6978,7 @@ const GoAInputBaseControl = props => {
     defaultRegisters: undefined,
     children: jsx(Visible, {
       visible: visible,
-      children: jsx(FormFieldWrapper, {
+      children: jsx(FormFieldWrapper$1, {
         ref: controlRef,
         className: "jsonforms-elements-wrapper",
         id: isStepperReview === true ? `review-base-${path}-element-wrapper` : `${path}-element-wrapper`,
@@ -8270,8 +8279,8 @@ const BooleanRadioControl = props => jsx(GoAInputBaseControl, Object.assign({},
 const GoABooleanRadioControlTester = rankWith(3, and(isBooleanControl, optionIs('radio', true)));
 const GoABooleanRadioControl = withJsonFormsControlProps(BooleanRadioControl);
 
-let _$8 = t => t,
-  _t$9;
+let _$9 = t => t,
+  _t$a;
 const Checkboxes = ({
   children,
   orientation,
@@ -8283,7 +8292,7 @@ const Checkboxes = ({
     children: children
   });
 };
-const CheckBoxGroupDiv = styled.div(_t$9 || (_t$9 = _$8`
+const CheckBoxGroupDiv = styled.div(_t$a || (_t$a = _$9`
   .horizontal {
     display: flex;
     flex-direction: row;
@@ -8643,8 +8652,8 @@ $$7({ target: 'Iterator', proto: true, real: true, forced: IS_PURE$1 }, {
   }
 });
 
-let _$7 = t => t,
-  _t$8,
+let _$8 = t => t,
+  _t$9,
   _t2$4,
   _t3$3,
   _t4$3,
@@ -8675,21 +8684,21 @@ let _$7 = t => t,
   _t27$1,
   _t28$1,
   _t29;
-const DeleteDialogContent = styled.div(_t$8 || (_t$8 = _$7`
+const DeleteDialogContent = styled.div(_t$9 || (_t$9 = _$8`
   margin-bottom: var(--goa-space-m);
 `));
-const MarginTop = styled.div(_t2$4 || (_t2$4 = _$7`
+const MarginTop = styled.div(_t2$4 || (_t2$4 = _$8`
   margin-top: var(--goa-space-l);
 `));
-const NonEmptyCellStyle = styled.div(_t3$3 || (_t3$3 = _$7`
+const NonEmptyCellStyle = styled.div(_t3$3 || (_t3$3 = _$8`
   goa-table thead th {
     background-color: #000:
   }
 `));
-const ToolBarHeader = styled.div(_t4$3 || (_t4$3 = _$7`
+const ToolBarHeader = styled.div(_t4$3 || (_t4$3 = _$8`
   margin-bottom: var(--goa-space-s);
 `));
-const ObjectArrayTitle = styled.h3(_t5$2 || (_t5$2 = _$7`
+const ObjectArrayTitle = styled.h3(_t5$2 || (_t5$2 = _$8`
   margin-bottom: var(--goa-space-s);
 
   span {
@@ -8697,24 +8706,24 @@ const ObjectArrayTitle = styled.h3(_t5$2 || (_t5$2 = _$7`
     font-size: var(--goa-font-size-2);
   }
 `));
-const RequiredSpan = styled.span(_t6$2 || (_t6$2 = _$7`
+const RequiredSpan = styled.span(_t6$2 || (_t6$2 = _$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 = _$7`
+const TextCenter = styled.div(_t7$1 || (_t7$1 = _$8`
   text-align: center;
 `));
-const SideMenuItem = styled.div(_t8$1 || (_t8$1 = _$7`
+const SideMenuItem = styled.div(_t8$1 || (_t8$1 = _$8`
   margin-top: 1rem;
 `));
-const RowFlex = styled.div(_t9$1 || (_t9$1 = _$7`
+const RowFlex = styled.div(_t9$1 || (_t9$1 = _$8`
   display: flex;
   margin: 1.5rem 0 1.5rem 0;
 
   align-items: flex-start;
 `));
-const RowFlexMenuMain = styled.div(_t0$1 || (_t0$1 = _$7`
+const RowFlexMenuMain = styled.div(_t0$1 || (_t0$1 = _$8`
   display: flex;
   flex-direction: column;
   align-items: stretch;
@@ -8731,7 +8740,7 @@ const RowFlexMenuMain = styled.div(_t0$1 || (_t0$1 = _$7`
     border-color: var(--goa-color-greyscale-400);
   }
 `));
-const RowFlexMenuLeft = styled.div(_t1$1 || (_t1$1 = _$7`
+const RowFlexMenuLeft = styled.div(_t1$1 || (_t1$1 = _$8`
   display: flex;
   flex-direction: row;
   align-items: stretch;
@@ -8747,12 +8756,12 @@ const RowFlexMenuLeft = styled.div(_t1$1 || (_t1$1 = _$7`
     border-color: var(--goa-color-greyscale-400);
   }
 `));
-const FlexTabs = styled.div(_t10$1 || (_t10$1 = _$7`
+const FlexTabs = styled.div(_t10$1 || (_t10$1 = _$8`
   flex-direction: column;
   flex: 1;
   overflow-y: auto !important;
 `));
-const FlexTabsWithMargin = styled.div(_t11$1 || (_t11$1 = _$7`
+const FlexTabsWithMargin = styled.div(_t11$1 || (_t11$1 = _$8`
   flex-direction: column;
   flex: 1;
   overflow-y: auto !important;
@@ -8761,64 +8770,64 @@ const FlexTabsWithMargin = styled.div(_t11$1 || (_t11$1 = _$7`
   flex-shrink: 1;
   // max-height: 500px;
 `));
-const FlexForm = styled.div(_t12$1 || (_t12$1 = _$7`
+const FlexForm = styled.div(_t12$1 || (_t12$1 = _$8`
   flex-direction: column;
   flex: 3;
   flex-shrink: 0;
   overflow-y: visible;
 `));
-const TabName = styled.div(_t13$1 || (_t13$1 = _$7`
+const TabName = styled.div(_t13$1 || (_t13$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 = _$7`
+const Trash = styled.div(_t14$1 || (_t14$1 = _$8`
   margin: 0.9rem 0.4rem 0.6rem 0.75rem;
   margin-left: auto;
 `));
-const ListContainer = styled.div(_t15$1 || (_t15$1 = _$7`
+const ListContainer = styled.div(_t15$1 || (_t15$1 = _$8`
   padding: 0 0 0 0;
 `));
-styled.div(_t16$1 || (_t16$1 = _$7`
+styled.div(_t16$1 || (_t16$1 = _$8`
   padding: 0 0 var(--goa-space-l) 0;
 `));
-const UpdateListContainer = styled.div(_t17$1 || (_t17$1 = _$7`
+const UpdateListContainer = styled.div(_t17$1 || (_t17$1 = _$8`
   width: 100%;
   border: 1px solid #dcdcdc;
   padding: var(--goa-space-xl);
 `));
-styled.div(_t18$1 || (_t18$1 = _$7`
+styled.div(_t18$1 || (_t18$1 = _$8`
   padding: 0 1.5rem 0 0;
   border: 1px solid #dcdcdc;
 `));
-const TableTHHeader = styled.th(_t19$1 || (_t19$1 = _$7`
+const TableTHHeader = styled.th(_t19$1 || (_t19$1 = _$8`
   background-color: var(--goa-color-greyscale-100) !important;
   vertical-align: top;
 `));
-const ObjectArrayWarningIconDiv = styled.div(_t20$1 || (_t20$1 = _$7`
+const ObjectArrayWarningIconDiv = styled.div(_t20$1 || (_t20$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 = _$7`
+const ListWithDetailWarningIconDiv = styled.div(_t21$1 || (_t21$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 = _$7`
+styled.label(_t22$1 || (_t22$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 = _$7`
+styled.div(_t23$1 || (_t23$1 = _$8`
   margin-top: var(--goa-space-m);
   color: var(--goa-color-interactive-error);
   font-weight: var(--goa-font-weight-regular);
@@ -8826,10 +8835,10 @@ styled.div(_t23$1 || (_t23$1 = _$7`
   line-height: var(--goa-line-height-1);
   font-style: normal;
 `));
-const HilightCellWarning = styled.div(_t24$1 || (_t24$1 = _$7`
+const HilightCellWarning = styled.div(_t24$1 || (_t24$1 = _$8`
   background-color: transparent;
 `));
-const FixTableHeaderAlignment = styled.div(_t25$1 || (_t25$1 = _$7`
+const FixTableHeaderAlignment = styled.div(_t25$1 || (_t25$1 = _$8`
   table thead th:nth-child(3) {
     text-align: center;
   }
@@ -8838,22 +8847,22 @@ const FixTableHeaderAlignment = styled.div(_t25$1 || (_t25$1 = _$7`
     text-align: center;
   }
 `));
-const ListWithDetailsReviewCellDiv = styled.div(_t26$1 || (_t26$1 = _$7`
+const ListWithDetailsReviewCellDiv = styled.div(_t26$1 || (_t26$1 = _$8`
   display: 'flex';
   flex-direction: 'column';
   text-align: 'start';
 `));
-const IconsContainer = styled.div(_t27$1 || (_t27$1 = _$7`
+const IconsContainer = styled.div(_t27$1 || (_t27$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 = _$7`
+const TableContentContainer = styled.div(_t28$1 || (_t28$1 = _$8`
   padding: var(--goa-space-l);
 `));
-const NoDataMessage = styled.div(_t29 || (_t29 = _$7`
+const NoDataMessage = styled.div(_t29 || (_t29 = _$8`
   padding: var(--goa-space-xl) var(--goa-space-l);
   color: var(--goa-color-greyscale-700);
   font: var(--goa-typography-body-m);
@@ -10206,7 +10215,7 @@ const GoAEmailInput = props => {
     visible: visible,
     children: jsx(JsonFormRegisterProvider, {
       defaultRegisters: undefined,
-      children: jsx(FormFieldWrapper, {
+      children: jsx(FormFieldWrapper$1, {
         children: jsx(GoabFormItem, {
           error: isVisited && finalErrors,
           testId: "form-email-input-wrapper",
@@ -10251,8 +10260,8 @@ const GoAEmailControl = props => jsx(GoAEmailInput, Object.assign({}, props));
 const GoAEmailControlTester = rankWith(4, and(isControl$1, schemaTypeIs('string'), formatIs('email')));
 const GoAInputEmailControl = withJsonFormsControlProps(GoAEmailControl);
 
-let _$6 = t => t,
-  _t$7;
+let _$7 = t => t,
+  _t$8;
 const renderLayoutElements = (elements, schema, path, enabled, renderers, cells) => {
   return elements.map((child, index) => jsx(JsonFormsDispatch, {
     uischema: child,
@@ -10331,14 +10340,14 @@ const ReviewLayoutRenderer = ({
     }
   }
 };
-const ReviewGrid = styled.div(_t$7 || (_t$7 = _$6`
+const ReviewGrid = styled.div(_t$8 || (_t$8 = _$7`
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(250px, calc(50% - 8px)));
   gap: 16px;
 `));
 
-let _$5 = t => t,
-  _t$6,
+let _$6 = t => t,
+  _t$7,
   _t2$3,
   _t3$2,
   _t4$2,
@@ -10368,11 +10377,11 @@ let _$5 = t => t,
   _t26,
   _t27,
   _t28;
-const ReviewItem = styled.div(_t$6 || (_t$6 = _$5`
+const ReviewItem = styled.div(_t$7 || (_t$7 = _$6`
   display: flex;
   flex-direction: column;
 `));
-const CompletionStatus = styled.div(_t2$3 || (_t2$3 = _$5`
+const CompletionStatus = styled.div(_t2$3 || (_t2$3 = _$6`
   padding: 0;
   margin: 0;
   padding-top: var(--goa-space-xl);
@@ -10380,14 +10389,14 @@ const CompletionStatus = styled.div(_t2$3 || (_t2$3 = _$5`
   display: flex;
   flex-direction: column;
 `));
-const BarTop = styled.div(_t3$2 || (_t3$2 = _$5`
+const BarTop = styled.div(_t3$2 || (_t3$2 = _$6`
   display: flex;
 
   .progress-text {
     margin-left: auto;
   }
 `));
-const Bar = styled.div(_t4$2 || (_t4$2 = _$5`
+const Bar = styled.div(_t4$2 || (_t4$2 = _$6`
   display: flex;
   flex-direction: row;
 
@@ -10417,15 +10426,15 @@ const Bar = styled.div(_t4$2 || (_t4$2 = _$5`
     box-sizing: border-box;
   }
 `));
-styled.div(_t5$1 || (_t5$1 = _$5``));
-const BadgeWrapper = styled.div(_t6$1 || (_t6$1 = _$5`
+styled.div(_t5$1 || (_t5$1 = _$6``));
+const BadgeWrapper = styled.div(_t6$1 || (_t6$1 = _$6`
   margin-left: 10px;
   margin-top: 7px;
 `));
-const CompletionTextHeader = styled.h3(_t7 || (_t7 = _$5`
+const CompletionTextHeader = styled.h3(_t7 || (_t7 = _$6`
   display: flex;
 `));
-const ReviewItemSection = styled.div(_t8 || (_t8 = _$5`
+const ReviewItemSection = styled.div(_t8 || (_t8 = _$6`
   margin-bottom: var(--goa-space-m);
   padding: var(--goa-space-xl) var(--goa-space-2xl);
   border: 1px solid var(--goa-color-greyscale-300);
@@ -10435,18 +10444,18 @@ const ReviewItemSection = styled.div(_t8 || (_t8 = _$5`
     max-width: 1600px;
   }
 `));
-const ReviewItemHeader = styled.div(_t9 || (_t9 = _$5`
+const ReviewItemHeader = styled.div(_t9 || (_t9 = _$6`
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-bottom: var(--goa-space-xl);
 `));
-const ReviewItemTitle = styled.div(_t0 || (_t0 = _$5`
+const ReviewItemTitle = styled.div(_t0 || (_t0 = _$6`
   font-size: var(--goa-space-l);
   line-height: var(--goa-space-xl);
   font-weight: 300;
 `));
-styled.div(_t1 || (_t1 = _$5`
+styled.div(_t1 || (_t1 = _$6`
   color: #0070c4;
   text-decoration: underline;
   outline: none;
@@ -10457,20 +10466,20 @@ styled.div(_t1 || (_t1 = _$5`
     background-color: #e6f7ff;
   }
 `));
-styled.div(_t10 || (_t10 = _$5`
+styled.div(_t10 || (_t10 = _$6`
   margin-left: var(--goa-space-m);
 `));
-styled.div(_t11 || (_t11 = _$5`
+styled.div(_t11 || (_t11 = _$6`
   margin-bottom: var(--goa-space-m);
 `));
-styled.div(_t12 || (_t12 = _$5`
+styled.div(_t12 || (_t12 = _$6`
   margin: var(--goa-space-s);
   width: 100%;
 `));
-styled.h3(_t13 || (_t13 = _$5`
+styled.h3(_t13 || (_t13 = _$6`
   text-transform: capitalize;
 `));
-const RightAlignmentDiv = styled.div(_t14 || (_t14 = _$5`
+const RightAlignmentDiv = styled.div(_t14 || (_t14 = _$6`
   @media screen and (max-width: 767px) {
     margin-bottom: var(--goa-space-l);
   }
@@ -10480,50 +10489,50 @@ const RightAlignmentDiv = styled.div(_t14 || (_t14 = _$5`
     margin-bottom: var(--goa-space-l);
   }
 `));
-const FormStepperSummaryH3 = styled.h3(_t15 || (_t15 = _$5`
+const FormStepperSummaryH3 = styled.h3(_t15 || (_t15 = _$6`
   flex: 1;
   margin-bottom: var(--goa-space-m);
   font-size: var(--goa-font-size-7);
   line-height: var(--goa-line-height-4);
   font-weight: var(--goa-font-weight-regular);
 `));
-const PageRenderPadding = styled.div(_t16 || (_t16 = _$5`
+const PageRenderPadding = styled.div(_t16 || (_t16 = _$6`
   margin-top: var(--goa-space-2xl);
 `));
-styled.div(_t17 || (_t17 = _$5`
+styled.div(_t17 || (_t17 = _$6`
   margin-bottom: var(--goa-space-2xl);
 `));
-const PageBorder = styled.div(_t18 || (_t18 = _$5`
+const PageBorder = styled.div(_t18 || (_t18 = _$6`
   padding: var(--goa-space-m) var(--goa-space-3xl);
 `));
-styled.div(_t19 || (_t19 = _$5`
+styled.div(_t19 || (_t19 = _$6`
   .element-style {
     max-width: 1600px;
   }
 `));
-styled.div(_t20 || (_t20 = _$5`
+styled.div(_t20 || (_t20 = _$6`
   padding: var(--goa-space-xl) var(--goa-space-2xl);
   border: 1px solid var(--goa-color-greyscale-300);
   border-radius: var(--goa-border-radius-xl);
 `));
-styled.div(_t21 || (_t21 = _$5`
+styled.div(_t21 || (_t21 = _$6`
   margin-top: var(--goa-space-xl);
   display: flex;
   justify-content: space-between;
 `));
-styled.h3(_t22 || (_t22 = _$5`
+styled.h3(_t22 || (_t22 = _$6`
   color: var(--goa-color-text-secondary) !important;
   margin-bottom: var(--goa-space-l);
 `));
-const CategoryStatus = styled.td(_t23 || (_t23 = _$5`
+const CategoryStatus = styled.td(_t23 || (_t23 = _$6`
   width: var(--goa-space-xl);
   padding-right: var(--goa-space-xl);
   align-content: center;
 `));
-const Center = styled.div(_t24 || (_t24 = _$5`
+const Center = styled.div(_t24 || (_t24 = _$6`
   padding-top: 5px;
 `));
-const PageStepperRow = styled.tr(_t25 || (_t25 = _$5`
+const PageStepperRow = styled.tr(_t25 || (_t25 = _$6`
   ${0}
 `), ({
   disabled
@@ -10548,7 +10557,7 @@ const PageStepperRow = styled.tr(_t25 || (_t25 = _$5`
             outline: 3px solid var(--goa-color-interactive-focus);
           }
         `);
-const SectionHeaderRowTr = styled.tr(_t26 || (_t26 = _$5`
+const SectionHeaderRowTr = styled.tr(_t26 || (_t26 = _$6`
   & > td {
     border: 0 !important;
     padding-top: var(--goa-space-l);
@@ -10560,7 +10569,7 @@ const SectionHeaderRowTr = styled.tr(_t26 || (_t26 = _$5`
     border-top: none !important;
   }
 `));
-const SummaryRowLink = styled.a(_t27 || (_t27 = _$5`
+const SummaryRowLink = styled.a(_t27 || (_t27 = _$6`
   position: relative;
   top: var(--goa-space-xs);
   &:focus-visible {
@@ -10569,7 +10578,7 @@ const SummaryRowLink = styled.a(_t27 || (_t27 = _$5`
   }
   padding: 0 var(--goa-space-s) var(--goa-space-xs); var(--goa-space-s);
 `));
-const SummaryTd = styled.td(_t28 || (_t28 = _$5`
+const SummaryTd = styled.td(_t28 || (_t28 = _$6`
   border: 0 !important;
   padding: 0 !important;
 `));
@@ -10863,100 +10872,494 @@ const FullNameDobReviewControl = props => {
 };
 const GoAInputBaseFullNameDobControlReview = withJsonFormsAllOfProps(FullNameDobReviewControl);
 
-var $$5 = _export;
-var iterate = iterate$a;
-var createProperty$1 = createProperty$4;
+let _$5 = t => t,
+  _t$6;
+const PhoneGrid = styled.div(_t$6 || (_t$6 = _$5`
+  display: grid;
+  grid-template-columns: 1fr 2fr;
+  gap: 0.2rem;
+  align-items: start;
+  margin-bottom: var(--goa-space-l) !important;
 
-// `Object.fromEntries` method
-// https://github.com/tc39/proposal-object-from-entries
-$$5({ target: 'Object', stat: true }, {
-  fromEntries: function fromEntries(iterable) {
-    var obj = {};
-    iterate(iterable, function (k, v) {
-      createProperty$1(obj, k, v);
-    }, { AS_ENTRIES: true });
-    return obj;
+  goa-form-item {
+    margin-right: 0 !important;
   }
+`));
+const PHONE_REGEX = /^\(?\d{3}\)?[-.\s]?\d{3}[-.\s]?\d{4}$/;
+const normalizePhoneData = value => ({
+  type: (value == null ? void 0 : value.type) || '',
+  number: (value == null ? void 0 : value.number) || ''
 });
+const PhoneNumberWithTypeControl = props => {
+  const {
+    data,
+    path,
+    handleChange,
+    enabled,
+    visible,
+    required
+  } = props;
+  const [formData, setFormData] = useState(normalizePhoneData(data));
+  const [error, setError] = useState(undefined);
+  useEffect(() => {
+    const nextData = normalizePhoneData(data);
+    setFormData(currentData => currentData.type === nextData.type && currentData.number === nextData.number ? currentData : nextData);
+  }, [data]);
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const updateFormData = updated => {
+    setFormData(updated);
+    if (updated.number && !PHONE_REGEX.test(updated.number)) {
+      setError('Enter a valid phone number (e.g., (780) 123-4567)');
+    } else {
+      setError(undefined);
+    }
+    handleChange(path, updated);
+  };
+  return jsx(Visible, {
+    visible: visible,
+    children: jsxs(PhoneGrid, {
+      children: [jsx(GoabFormItem, {
+        label: "Phone type",
+        requirement: required ? 'required' : undefined,
+        children: jsxs(GoabDropdown, {
+          name: "type",
+          value: formData.type || '',
+          disabled: !enabled,
+          onChange: detail => updateFormData(Object.assign({}, formData, {
+            type: detail.value
+          })),
+          children: [jsx(GoabDropdownItem, {
+            value: "Mobile"
+          }), jsx(GoabDropdownItem, {
+            value: "Landline"
+          })]
+        })
+      }), jsx(GoabFormItem, {
+        label: "Phone number",
+        error: error,
+        requirement: required ? 'required' : undefined,
+        children: jsx(GoabInput, {
+          type: "tel",
+          name: "number",
+          placeholder: "(000) 000-0000",
+          value: formData.number || '',
+          disabled: !enabled,
+          onChange: detail => updateFormData(Object.assign({}, formData, {
+            number: detail.value
+          }))
+        })
+      })]
+    })
+  });
+};
+const GoAPhoneNumberWithTypeControl = withJsonFormsControlProps(PhoneNumberWithTypeControl);
 
-var global$3 = global$t;
-var fails$1 = fails$x;
-var uncurryThis$7 = functionUncurryThis;
-var toString$4 = toString$m;
-var trim = stringTrim.trim;
-var whitespaces = whitespaces$3;
-
-var $parseInt$1 = global$3.parseInt;
-var Symbol$1 = global$3.Symbol;
-var ITERATOR$2 = Symbol$1 && Symbol$1.iterator;
-var hex = /^[+-]?0x/i;
-var exec$2 = uncurryThis$7(hex.exec);
-var FORCED = $parseInt$1(whitespaces + '08') !== 8 || $parseInt$1(whitespaces + '0x16') !== 22
-  // MS Edge 18- broken with boxed symbols
-  || (ITERATOR$2 && !fails$1(function () { $parseInt$1(Object(ITERATOR$2)); }));
+const PhoneNumberControl = props => {
+  const {
+    data,
+    path,
+    schema,
+    handleChange,
+    enabled,
+    visible,
+    required
+  } = props;
+  const [error, setError] = useState('');
+  const handleInputChange = (name, value) => {
+    if (value && !PHONE_REGEX.test(value)) {
+      setError('Must be a valid 10-digit phone number in format (000) 000-0000');
+    } else {
+      setError('');
+    }
+    handleChange(path, value);
+  };
+  return jsx(Visible, {
+    visible: visible,
+    children: jsx(GoabFormItem, {
+      label: (schema == null ? void 0 : schema.title) || 'Phone number',
+      requirement: required ? 'required' : undefined,
+      error: error,
+      testId: `form-item-${path}`,
+      children: jsx(GoabInput, {
+        type: "tel",
+        name: path,
+        disabled: !enabled,
+        "aria-label": "phone number input",
+        testId: `phone-input-${path}`,
+        value: data || '',
+        onChange: detail => handleInputChange(detail.name, detail.value),
+        placeholder: "(000) 000-0000",
+        width: "100%"
+      })
+    })
+  });
+};
+const GoAPhoneNumberControl = withJsonFormsControlProps(PhoneNumberControl);
 
-// `parseInt` method
-// https://tc39.es/ecma262/#sec-parseint-string-radix
-var numberParseInt = FORCED ? function parseInt(string, radix) {
-  var S = trim(toString$4(string));
-  return $parseInt$1(S, (radix >>> 0) || (exec$2(hex, S) ? 16 : 10));
-} : $parseInt$1;
+const PhoneNumberTester = rankWith(4, and(isControl$1, schemaTypeIs('string'), formatIs('phone')));
 
-var $$4 = _export;
-var $parseInt = numberParseInt;
+let _$4 = t => t,
+  _t$5,
+  _t2$2,
+  _t3$1,
+  _t4$1,
+  _t5,
+  _t6;
+const SearchBox = styled.div(_t$5 || (_t$5 = _$4`
+  position: relative;
 
-// `parseInt` method
-// https://tc39.es/ecma262/#sec-parseint-string-radix
-$$4({ global: true, forced: parseInt !== $parseInt }, {
-  parseInt: $parseInt
-});
+  .suggestions {
+    width: 100%;
+    margin-top: 3px;
+    border-top-width: 0;
+    list-style: none;
+    max-height: 15.5rem;
+    width: 100%;
+    position: absolute;
 
-const ADD_DATA_ACTION = 'jsonforms/register/add_data_action';
-const SET_DATA_ACTION = 'jsonforms/register/set_data_action';
-const INCREMENT_ACTION = 'jsonforms/register/increment_action';
-const DELETE_ACTION = 'jsonforms/register/delete_action';
-const initialState = {
-  categories: {}
-};
+    background: var(--goa-color-greyscale-white);
+    box-shadow: 0 8px 8px rgb(0 0 0 / 20%), 0 4px 4px rgb(0 0 0 / 10%);
+    z-index: 99;
+    overflow: hidden auto;
+    padding-left: 0;
+  }
+  .suggestions li {
+  }
+  .suggestion-active,
+  .suggestions li:hover {
+    background-color: var(--goa-color-interactive-default);
+    color: var(--goa-color-greyscale-white);
+    cursor: pointer;
+    font-weight: 600;
+  }
+  .input-container {
+    position: relative;
+    display: inline-block;
+    width: 100%; /* Ensures it spans the parent container */
+  }
 
-function objectListReducer(state, action) {
-  switch (action.type) {
-    case ADD_DATA_ACTION:
-      {
-        //ok so we're assuming we're already getting the updated category data
-        const {
-          categories
-        } = state;
-        const {
-          name,
-          category
-        } = action.payload;
-        const newCategories = Object.assign({}, categories);
-        if (!newCategories[name]) {
-          newCategories[name] = {
-            data: category
-          };
-        } else {
-          newCategories[name].data = category;
-        }
-        return Object.assign({}, state, {
-          categories: newCategories
-        });
-      }
-    case SET_DATA_ACTION:
-      {
-        const CategoriesStateData = action.payload;
-        return Object.assign({}, state, {
-          categories: CategoriesStateData
-        });
-      }
-    case INCREMENT_ACTION:
-      {
-        const {
-          categories
-        } = state;
-        const name = action.payload;
-        const newCategories = Object.assign({}, categories);
+  .input-container .input-spinner {
+    position: absolute;
+    top: 50%;
+    right: 8px; /* Adjust based on padding or margin of the input field */
+    transform: translateY(-50%);
+    z-index: 1; /* Ensure it appears above the input */
+    pointer-events: none; /* Prevent spinner from interfering with clicks */
+  }
+`));
+const AddressIndent = styled.div(_t2$2 || (_t2$2 = _$4`
+  margin: 0 0 var(--goa-space-m) 0;
+  text-wrap: wrap;
+  word-break: break-word;
+  border: 1px solid var(--goa-color-greyscale-300);
+  border-radius: var(--goa-border-radius-xl);
+  padding: var(--goa-space-l);
+`));
+const TextWrap = styled.p(_t3$1 || (_t3$1 = _$4`
+  text-wrap: auto;
+  word-break: break-word;
+`));
+const TextWrapDiv = styled.div(_t4$1 || (_t4$1 = _$4`
+  text-wrap: auto;
+  word-break: break-word;
+`));
+const LabelDiv = styled.div(_t5 || (_t5 = _$4`
+  font-size: var(--goa-font-size-2);
+  padding-bottom: var(--goa-space-l);
+`));
+/* istanbul ignore next */
+const ListItem = styled.li(_t6 || (_t6 = _$4`
+  background-color: ${0};
+  color: ${0};
+  font-weight: ${0};
+  padding: var(--goa-space-xs) var(--goa-space-2xs) var(--goa-space-xs) var(--goa-space-xs);
+  margin-left: 0.25rem;
+`), ({
+  selected,
+  index
+}) => selected === index ? 'var(--goa-color-interactive-default)' : '', ({
+  selected,
+  index
+}) => selected === index ? 'var(--goa-color-greyscale-white) !important' : '', ({
+  selected,
+  index
+}) => selected === index ? '600' : '');
+
+const PhoneNumberReviewControl = props => {
+  const {
+    data,
+    id,
+    required
+  } = props;
+  return jsx(GoabFormItem, {
+    label: "Phone number",
+    error: required && !data ? 'Phone number is required' : '',
+    requirement: required ? 'required' : undefined,
+    children: jsx(TextWrapDiv, {
+      children: jsx("div", {
+        "data-testid": `phone-control-${id}`,
+        children: data || ''
+      })
+    })
+  });
+};
+const GoabInputBasePhoneNumberReviewControl = withJsonFormsAllOfProps(PhoneNumberReviewControl);
+
+const isPhoneNumberWithType = createSchemaMatchTester(['number', 'type'], true);
+const PhoneNumberWithTypeTester = rankWith(4, isPhoneNumberWithType);
+
+const PhoneNumberWithTypeReviewControl = props => {
+  const {
+    data,
+    id,
+    required
+  } = props;
+  return jsxs(PhoneGrid, {
+    children: [jsx(GoabFormItem, {
+      label: "Phone number",
+      error: required && !(data != null && data.number) ? 'Phone number is required' : '',
+      requirement: required ? 'required' : undefined,
+      children: jsx(TextWrapDiv, {
+        children: jsx("div", {
+          "data-testid": `phone-number-control-${id}`,
+          children: (data == null ? void 0 : data.number) || ''
+        })
+      })
+    }), jsx(GoabFormItem, {
+      label: "Phone type",
+      error: required && !(data != null && data.type) ? 'Phone type is required' : '',
+      requirement: required ? 'required' : undefined,
+      children: jsx(TextWrapDiv, {
+        children: jsx("div", {
+          "data-testid": `phone-type-control-${id}`,
+          children: (data == null ? void 0 : data.type) || ''
+        })
+      })
+    })]
+  });
+};
+const GoabInputBasePhoneNumberWithTypeReviewControl = withJsonFormsAllOfProps(PhoneNumberWithTypeReviewControl);
+
+let _$3 = t => t,
+  _t$4;
+const FormFieldWrapper = styled.div(_t$4 || (_t$4 = _$3`
+  margin-bottom: var(--goa-space-l);
+`));
+
+const ContractInfoControl = props => {
+  var _options$enableEmail, _options$enablePhone, _options$emailFirst;
+  const {
+    data = {},
+    path,
+    handleChange,
+    enabled,
+    visible,
+    required,
+    uischema
+  } = props;
+  const handleFieldChange = (field, value) => {
+    handleChange(`${path}.${field}`, value);
+  };
+  const emailProps = Object.assign({}, props, {
+    data: data == null ? void 0 : data.email,
+    path: `${path}.email`
+  });
+  const phoneProps = Object.assign({}, props, {
+    data: data == null ? void 0 : data.phone,
+    path: `${path}.phone`
+  });
+  const {
+    options
+  } = uischema;
+  const enableEmail = (_options$enableEmail = options == null ? void 0 : options.enableEmail) != null ? _options$enableEmail : true;
+  const enablePhone = (_options$enablePhone = options == null ? void 0 : options.enablePhone) != null ? _options$enablePhone : true;
+  const emailFirst = (_options$emailFirst = options == null ? void 0 : options.emailFirst) != null ? _options$emailFirst : false;
+  if (!enableEmail && !enablePhone) {
+    throw new Error('At least one contact method must be enabled');
+  }
+  return jsxs("div", {
+    style: {
+      display: visible ? 'block' : 'none'
+    },
+    children: [enableEmail && emailFirst && jsx(GoAEmailInput, Object.assign({}, emailProps)), enablePhone && jsx(FormFieldWrapper, {
+      children: jsx(PhoneNumberControl, Object.assign({}, phoneProps))
+    }), enableEmail && !emailFirst && jsx(GoAEmailInput, Object.assign({}, emailProps)), enableEmail && enablePhone && jsx(FormFieldWrapper, {
+      children: jsx(GoabFormItem, {
+        label: "Preferred Contact Method",
+        requirement: required ? 'required' : undefined,
+        children: jsxs(GoabDropdown, {
+          testId: `preferred-contact-${path}`,
+          disabled: !enabled,
+          value: data.preferredContactMethod || '',
+          onChange: detail => handleFieldChange('preferredContactMethod', detail.value || ''),
+          width: "250px",
+          children: [jsx(GoabDropdownItem, {
+            value: "",
+            label: "Select a Contact Method"
+          }), emailFirst && jsx(GoabDropdownItem, {
+            value: "Email",
+            label: "Email"
+          }), jsx(GoabDropdownItem, {
+            value: "Phone",
+            label: "Phone"
+          }), !emailFirst && jsx(GoabDropdownItem, {
+            value: "Email",
+            label: "Email"
+          })]
+        })
+      })
+    })]
+  });
+};
+
+const ContractInfoControlReview = props => {
+  var _props$uischema, _schema$required, _options$enableEmail, _options$enablePhone, _options$emailFirst;
+  const context = useContext(JsonFormsStepperContext);
+  const stepId = (_props$uischema = props.uischema) == null || (_props$uischema = _props$uischema.options) == null ? void 0 : _props$uischema.stepId;
+  const {
+    uischema,
+    data = {},
+    id,
+    schema
+  } = props;
+  const requiredFields = (_schema$required = schema == null ? void 0 : schema.required) != null ? _schema$required : [];
+  const isMissing = value => value === undefined || value === null || value === '';
+  const renderRow = (fieldLabel, value, fieldName, testId) => jsx("tr", {
+    children: jsxs(PageReviewContainer, {
+      colSpan: 3,
+      children: [jsxs(ReviewHeader, {
+        children: [jsx(ReviewLabel, {
+          children: fieldLabel
+        }), stepId !== undefined && jsx(GoabButton, {
+          type: "tertiary",
+          size: "compact",
+          onClick: () => context == null ? void 0 : context.goToPage(stepId, uischema.scope),
+          testId: `${fieldName}-change-btn`,
+          children: "Change"
+        })]
+      }), jsxs(ReviewValue, {
+        children: [jsx("div", {
+          "data-testid": testId,
+          children: value != null ? value : ''
+        }), requiredFields.includes(fieldName) && isMissing(value) && jsx(GoabFormItem, {
+          error: `${fieldLabel} is required`,
+          label: ""
+        })]
+      })]
+    })
+  }, testId);
+  const {
+    options
+  } = uischema;
+  const enableEmail = (_options$enableEmail = options == null ? void 0 : options.enableEmail) != null ? _options$enableEmail : true;
+  const enablePhone = (_options$enablePhone = options == null ? void 0 : options.enablePhone) != null ? _options$enablePhone : true;
+  const emailFirst = (_options$emailFirst = options == null ? void 0 : options.emailFirst) != null ? _options$emailFirst : false;
+  if (!enableEmail && !enablePhone) {
+    throw new Error('At least one contact method must be enabled');
+  }
+  return jsxs(Fragment, {
+    children: [enableEmail && emailFirst && renderRow('Email', data == null ? void 0 : data.email, 'email', `email-control-${id}`), enablePhone && renderRow('Phone number', data == null ? void 0 : data.phone, 'phone', `phone-control-${id}`), enableEmail && !emailFirst && renderRow('Email', data == null ? void 0 : data.email, 'email', `email-control-${id}`), enableEmail && enablePhone && renderRow('Preferred contact method', (data == null ? void 0 : data.preferredContactMethod) || 'Email', 'preferredContactMethod', `preferred-contact-${id}`)]
+  });
+};
+const GoAContractInfoControlReview = withJsonFormsAllOfProps(ContractInfoControlReview);
+
+const isContactInformation = createSchemaMatchTester(['email', 'phone', 'preferredContactMethod']);
+const ContactInformationTester = rankWith(4, isContactInformation);
+
+var $$5 = _export;
+var iterate = iterate$a;
+var createProperty$1 = createProperty$4;
+
+// `Object.fromEntries` method
+// https://github.com/tc39/proposal-object-from-entries
+$$5({ target: 'Object', stat: true }, {
+  fromEntries: function fromEntries(iterable) {
+    var obj = {};
+    iterate(iterable, function (k, v) {
+      createProperty$1(obj, k, v);
+    }, { AS_ENTRIES: true });
+    return obj;
+  }
+});
+
+var global$3 = global$t;
+var fails$1 = fails$x;
+var uncurryThis$7 = functionUncurryThis;
+var toString$4 = toString$m;
+var trim = stringTrim.trim;
+var whitespaces = whitespaces$3;
+
+var $parseInt$1 = global$3.parseInt;
+var Symbol$1 = global$3.Symbol;
+var ITERATOR$2 = Symbol$1 && Symbol$1.iterator;
+var hex = /^[+-]?0x/i;
+var exec$2 = uncurryThis$7(hex.exec);
+var FORCED = $parseInt$1(whitespaces + '08') !== 8 || $parseInt$1(whitespaces + '0x16') !== 22
+  // MS Edge 18- broken with boxed symbols
+  || (ITERATOR$2 && !fails$1(function () { $parseInt$1(Object(ITERATOR$2)); }));
+
+// `parseInt` method
+// https://tc39.es/ecma262/#sec-parseint-string-radix
+var numberParseInt = FORCED ? function parseInt(string, radix) {
+  var S = trim(toString$4(string));
+  return $parseInt$1(S, (radix >>> 0) || (exec$2(hex, S) ? 16 : 10));
+} : $parseInt$1;
+
+var $$4 = _export;
+var $parseInt = numberParseInt;
+
+// `parseInt` method
+// https://tc39.es/ecma262/#sec-parseint-string-radix
+$$4({ global: true, forced: parseInt !== $parseInt }, {
+  parseInt: $parseInt
+});
+
+const ADD_DATA_ACTION = 'jsonforms/register/add_data_action';
+const SET_DATA_ACTION = 'jsonforms/register/set_data_action';
+const INCREMENT_ACTION = 'jsonforms/register/increment_action';
+const DELETE_ACTION = 'jsonforms/register/delete_action';
+const initialState = {
+  categories: {}
+};
+
+function objectListReducer(state, action) {
+  switch (action.type) {
+    case ADD_DATA_ACTION:
+      {
+        //ok so we're assuming we're already getting the updated category data
+        const {
+          categories
+        } = state;
+        const {
+          name,
+          category
+        } = action.payload;
+        const newCategories = Object.assign({}, categories);
+        if (!newCategories[name]) {
+          newCategories[name] = {
+            data: category
+          };
+        } else {
+          newCategories[name].data = category;
+        }
+        return Object.assign({}, state, {
+          categories: newCategories
+        });
+      }
+    case SET_DATA_ACTION:
+      {
+        const CategoriesStateData = action.payload;
+        return Object.assign({}, state, {
+          categories: CategoriesStateData
+        });
+      }
+    case INCREMENT_ACTION:
+      {
+        const {
+          categories
+        } = state;
+        const name = action.payload;
+        const newCategories = Object.assign({}, categories);
         // Assuming you want to increment the count of a category:
         if (newCategories[name]) {
           const updatedCategory = Object.assign({}, categories[name], {
@@ -11960,115 +12363,28 @@ const ListWithDetailsControl = props => {
     }
     setOpen(false);
     // eslint-disable-next-line
-  }, [setOpen, path, rowData, rowData]);
-  return jsxs(Visible, {
-    visible: visible,
-    children: [jsx(ListWithDetailControl, Object.assign({}, props, {
-      openDeleteDialog: openDeleteDialog,
-      enabled: props.enabled,
-      currentTab: currentTab,
-      setCurrentTab: setCurrentTab
-    })), jsx(DeleteDialog, {
-      open: open,
-      onCancel: deleteCancel,
-      onConfirm: deleteConfirm,
-      title: 'Delete confirmation',
-      message: `Are you sure you wish to delete ${name}`
-    })]
-  });
-};
-const GoAListWithDetailsControlRenderer = withJsonFormsArrayLayoutProps(ListWithDetailsControl);
-const GoAListWithDetailsTester = rankWith(3, and(uiTypeIs('ListWithDetail')));
-
-const isAddressLookup = createSchemaMatchTester(['addressLine2', 'municipality', 'addressLine1', 'subdivisionCode', 'postalCode']);
-const AddressLookUpTester = rankWith(4, isAddressLookup);
-
-let _$4 = t => t,
-  _t$5,
-  _t2$2,
-  _t3$1,
-  _t4$1,
-  _t5,
-  _t6;
-const SearchBox = styled.div(_t$5 || (_t$5 = _$4`
-  position: relative;
-
-  .suggestions {
-    width: 100%;
-    margin-top: 3px;
-    border-top-width: 0;
-    list-style: none;
-    max-height: 15.5rem;
-    width: 100%;
-    position: absolute;
-
-    background: var(--goa-color-greyscale-white);
-    box-shadow: 0 8px 8px rgb(0 0 0 / 20%), 0 4px 4px rgb(0 0 0 / 10%);
-    z-index: 99;
-    overflow: hidden auto;
-    padding-left: 0;
-  }
-  .suggestions li {
-  }
-  .suggestion-active,
-  .suggestions li:hover {
-    background-color: var(--goa-color-interactive-default);
-    color: var(--goa-color-greyscale-white);
-    cursor: pointer;
-    font-weight: 600;
-  }
-  .input-container {
-    position: relative;
-    display: inline-block;
-    width: 100%; /* Ensures it spans the parent container */
-  }
+  }, [setOpen, path, rowData, rowData]);
+  return jsxs(Visible, {
+    visible: visible,
+    children: [jsx(ListWithDetailControl, Object.assign({}, props, {
+      openDeleteDialog: openDeleteDialog,
+      enabled: props.enabled,
+      currentTab: currentTab,
+      setCurrentTab: setCurrentTab
+    })), jsx(DeleteDialog, {
+      open: open,
+      onCancel: deleteCancel,
+      onConfirm: deleteConfirm,
+      title: 'Delete confirmation',
+      message: `Are you sure you wish to delete ${name}`
+    })]
+  });
+};
+const GoAListWithDetailsControlRenderer = withJsonFormsArrayLayoutProps(ListWithDetailsControl);
+const GoAListWithDetailsTester = rankWith(3, and(uiTypeIs('ListWithDetail')));
 
-  .input-container .input-spinner {
-    position: absolute;
-    top: 50%;
-    right: 8px; /* Adjust based on padding or margin of the input field */
-    transform: translateY(-50%);
-    z-index: 1; /* Ensure it appears above the input */
-    pointer-events: none; /* Prevent spinner from interfering with clicks */
-  }
-`));
-const AddressIndent = styled.div(_t2$2 || (_t2$2 = _$4`
-  margin: 0 0 var(--goa-space-m) 0;
-  text-wrap: wrap;
-  word-break: break-word;
-  border: 1px solid var(--goa-color-greyscale-300);
-  border-radius: var(--goa-border-radius-xl);
-  padding: var(--goa-space-l);
-`));
-const TextWrap = styled.p(_t3$1 || (_t3$1 = _$4`
-  text-wrap: auto;
-  word-break: break-word;
-`));
-const TextWrapDiv = styled.div(_t4$1 || (_t4$1 = _$4`
-  text-wrap: auto;
-  word-break: break-word;
-`));
-const LabelDiv = styled.div(_t5 || (_t5 = _$4`
-  font-size: var(--goa-font-size-2);
-  padding-bottom: var(--goa-space-l);
-`));
-/* istanbul ignore next */
-const ListItem = styled.li(_t6 || (_t6 = _$4`
-  background-color: ${0};
-  color: ${0};
-  font-weight: ${0};
-  padding: var(--goa-space-xs) var(--goa-space-2xs) var(--goa-space-xs) var(--goa-space-xs);
-  margin-left: 0.25rem;
-`), ({
-  selected,
-  index
-}) => selected === index ? 'var(--goa-color-interactive-default)' : '', ({
-  selected,
-  index
-}) => selected === index ? 'var(--goa-color-greyscale-white) !important' : '', ({
-  selected,
-  index
-}) => selected === index ? '600' : '');
+const isAddressLookup = createSchemaMatchTester(['addressLine2', 'municipality', 'addressLine1', 'subdivisionCode', 'postalCode']);
+const AddressLookUpTester = rankWith(4, isAddressLookup);
 
 const AddressViews = ({
   data,
@@ -12500,10 +12816,10 @@ const GoAGroupReviewControlComponent = props => {
 const GoAGroupReviewLayoutTester = rankWith(1, uiTypeIs('Group'));
 const GoAGroupReviewControl = withJsonFormsLayoutProps(GoAGroupReviewControlComponent, true);
 
-let _$3 = t => t,
-  _t$4,
+let _$2 = t => t,
+  _t$3,
   _t2$1;
-const HelpContentDiv = styled.div(_t$4 || (_t$4 = _$3`
+const HelpContentDiv = styled.div(_t$3 || (_t$3 = _$2`
   .parent-label {
     font-size: 24px;
     margin-bottom: var(--goa-space-m);
@@ -12591,12 +12907,12 @@ const HelpContentDiv = styled.div(_t$4 || (_t$4 = _$3`
     text-decoration: underline;
   }
 `));
-const InvalidMarkdown = styled.div(_t2$1 || (_t2$1 = _$3`
+const InvalidMarkdown = styled.div(_t2$1 || (_t2$1 = _$2`
   color: var(--goa-color-interactive-error);
 `));
 
-let _$2 = t => t,
-  _t$3;
+let _$1 = t => t,
+  _t$2;
 const GoAContextMenuIcon = props => {
   return jsx(GoabIconButton, {
     icon: props.type,
@@ -12607,7 +12923,7 @@ const GoAContextMenuIcon = props => {
     disabled: props.disabled
   });
 };
-const GoAContextMenu = styled.div(_t$3 || (_t$3 = _$2`
+const GoAContextMenu = styled.div(_t$2 || (_t$2 = _$1`
   display: flex;
   align-items: center;
   background-color: #fff;
@@ -12986,6 +13302,9 @@ const GoABaseTableReviewRenderers$1 = [
 }, {
   tester: GoACalloutControlTester,
   renderer: CalloutReviewControl
+}, {
+  tester: ContactInformationTester,
+  renderer: withJsonFormsControlProps(ContractInfoControlReview)
 }];
 [
 // controls
@@ -13644,9 +13963,9 @@ const FormStepperPageReviewer = props => {
 };
 withAjvProps(withTranslateProps(withJsonFormsLayoutProps(FormStepperPageReviewer)));
 
-let _$1 = t => t,
-  _t$2;
-const BackButtonWrapper = styled.span(_t$2 || (_t$2 = _$1`
+let _ = t => t,
+  _t$1;
+const BackButtonWrapper = styled.span(_t$1 || (_t$1 = _`
   .back-link::before {
     content: '';
     display: inline-block;
@@ -14038,7 +14357,7 @@ const DeleteFileModal = ({
 };
 
 let _2 = t => t,
-  _t$1,
+  _t,
   _t2,
   _t3,
   _t4;
@@ -14239,7 +14558,7 @@ const FileUploader = _ref => {
     })
   });
 };
-const HelpText = styled.div(_t$1 || (_t$1 = _2`
+const HelpText = styled.div(_t || (_t = _2`
   margin-top: var(--goa-space-xs);
   font-size: var(--goa-font-size-3);
   color: var(--goa-color-text-secondary);
@@ -17248,187 +17567,6 @@ const FullNameDobControl = props => {
   });
 };
 
-let _ = t => t,
-  _t;
-const PhoneGrid = styled.div(_t || (_t = _`
-  display: grid;
-  grid-template-columns: 1fr 2fr;
-  gap: 0.2rem;
-  align-items: start;
-  margin-bottom: var(--goa-space-l) !important;
-
-  goa-form-item {
-    margin-right: 0 !important;
-  }
-`));
-const PHONE_REGEX = /^\(?\d{3}\)?[-.\s]?\d{3}[-.\s]?\d{4}$/;
-const normalizePhoneData = value => ({
-  type: (value == null ? void 0 : value.type) || '',
-  number: (value == null ? void 0 : value.number) || ''
-});
-const PhoneNumberWithTypeControl = props => {
-  const {
-    data,
-    path,
-    handleChange,
-    enabled,
-    visible,
-    required
-  } = props;
-  const [formData, setFormData] = useState(normalizePhoneData(data));
-  const [error, setError] = useState(undefined);
-  useEffect(() => {
-    const nextData = normalizePhoneData(data);
-    setFormData(currentData => currentData.type === nextData.type && currentData.number === nextData.number ? currentData : nextData);
-  }, [data]);
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  const updateFormData = updated => {
-    setFormData(updated);
-    if (updated.number && !PHONE_REGEX.test(updated.number)) {
-      setError('Enter a valid phone number (e.g., (780) 123-4567)');
-    } else {
-      setError(undefined);
-    }
-    handleChange(path, updated);
-  };
-  return jsx(Visible, {
-    visible: visible,
-    children: jsxs(PhoneGrid, {
-      children: [jsx(GoabFormItem, {
-        label: "Phone type",
-        requirement: required ? 'required' : undefined,
-        children: jsxs(GoabDropdown, {
-          name: "type",
-          value: formData.type || '',
-          disabled: !enabled,
-          onChange: detail => updateFormData(Object.assign({}, formData, {
-            type: detail.value
-          })),
-          children: [jsx(GoabDropdownItem, {
-            value: "Mobile"
-          }), jsx(GoabDropdownItem, {
-            value: "Landline"
-          })]
-        })
-      }), jsx(GoabFormItem, {
-        label: "Phone number",
-        error: error,
-        requirement: required ? 'required' : undefined,
-        children: jsx(GoabInput, {
-          type: "tel",
-          name: "number",
-          placeholder: "(000) 000-0000",
-          value: formData.number || '',
-          disabled: !enabled,
-          onChange: detail => updateFormData(Object.assign({}, formData, {
-            number: detail.value
-          }))
-        })
-      })]
-    })
-  });
-};
-const GoAPhoneNumberWithTypeControl = withJsonFormsControlProps(PhoneNumberWithTypeControl);
-
-const PhoneNumberControl = props => {
-  const {
-    data,
-    path,
-    schema,
-    handleChange,
-    enabled,
-    visible,
-    required
-  } = props;
-  const [error, setError] = useState('');
-  const handleInputChange = (name, value) => {
-    if (value && !PHONE_REGEX.test(value)) {
-      setError('Must be a valid 10-digit phone number in format (000) 000-0000');
-    } else {
-      setError('');
-    }
-    handleChange(path, value);
-  };
-  return jsx(Visible, {
-    visible: visible,
-    children: jsx(GoabFormItem, {
-      label: (schema == null ? void 0 : schema.title) || 'Phone number',
-      requirement: required ? 'required' : undefined,
-      error: error,
-      testId: `form-item-${path}`,
-      children: jsx(GoabInput, {
-        type: "tel",
-        name: path,
-        disabled: !enabled,
-        "aria-label": "phone number input",
-        testId: `phone-input-${path}`,
-        value: data || '',
-        onChange: detail => handleInputChange(detail.name, detail.value),
-        placeholder: "(000) 000-0000",
-        width: "100%"
-      })
-    })
-  });
-};
-const GoAPhoneNumberControl = withJsonFormsControlProps(PhoneNumberControl);
-
-const PhoneNumberTester = rankWith(4, and(isControl$1, schemaTypeIs('string'), formatIs('phone')));
-
-const PhoneNumberReviewControl = props => {
-  const {
-    data,
-    id,
-    required
-  } = props;
-  return jsx(GoabFormItem, {
-    label: "Phone number",
-    error: required && !data ? 'Phone number is required' : '',
-    requirement: required ? 'required' : undefined,
-    children: jsx(TextWrapDiv, {
-      children: jsx("div", {
-        "data-testid": `phone-control-${id}`,
-        children: data || ''
-      })
-    })
-  });
-};
-const GoabInputBasePhoneNumberReviewControl = withJsonFormsAllOfProps(PhoneNumberReviewControl);
-
-const isPhoneNumberWithType = createSchemaMatchTester(['number', 'type'], true);
-const PhoneNumberWithTypeTester = rankWith(4, isPhoneNumberWithType);
-
-const PhoneNumberWithTypeReviewControl = props => {
-  const {
-    data,
-    id,
-    required
-  } = props;
-  return jsxs(PhoneGrid, {
-    children: [jsx(GoabFormItem, {
-      label: "Phone number",
-      error: required && !(data != null && data.number) ? 'Phone number is required' : '',
-      requirement: required ? 'required' : undefined,
-      children: jsx(TextWrapDiv, {
-        children: jsx("div", {
-          "data-testid": `phone-number-control-${id}`,
-          children: (data == null ? void 0 : data.number) || ''
-        })
-      })
-    }), jsx(GoabFormItem, {
-      label: "Phone type",
-      error: required && !(data != null && data.type) ? 'Phone type is required' : '',
-      requirement: required ? 'required' : undefined,
-      children: jsx(TextWrapDiv, {
-        children: jsx("div", {
-          "data-testid": `phone-type-control-${id}`,
-          children: (data == null ? void 0 : data.type) || ''
-        })
-      })
-    })]
-  });
-};
-const GoabInputBasePhoneNumberWithTypeReviewControl = withJsonFormsAllOfProps(PhoneNumberWithTypeReviewControl);
-
 /**
  * Escape for use in RegExp
  */
@@ -18223,7 +18361,10 @@ const GoARenderers = [...GoABaseRenderers, {
 }, {
   tester: GoACalculationControlTester,
   renderer: GoACalculationControl
+}, {
+  tester: ContactInformationTester,
+  renderer: withJsonFormsControlProps(ContractInfoControl)
 }];
 const GoACells = [...InputCells];
 
-export { ADD_DATALIST_ACTION, ADD_NO_ANONYMOUS_ACTION, ADD_REGISTER_DATA_ACTION, ADD_REGISTER_DATA_ERROR, ADD_USER_ACTION, AddressLookUpControl, AddressLookUpControlReview, AddressLookUpTester, AddressLoopUpControlTableReview, ArrayControl, ArrayControlBase, ArrayControlReview, BooleanComponent, BooleanControl, BooleanRadioComponent, BooleanRadioControl, CategorizationPagesRendererTester, CategorizationStepperRendererTester, CheckboxGroup, ContextProviderC, ContextProviderClass, ContextProviderFactory, EnumCheckboxControl, EnumRadioControl, EnumSelect, FileUploader, FileUploaderReview, FileUploaderTester, FormPageStepper, FormPagesView, FormStepper, FormStepperControl, FormStepperPagesControl, FormStepperReviewControl, FormStepperReviewer, FormStepperView, FullNameControl, FullNameControlReview, FullNameDobControl, FullNameDobReviewControl, FullNameDobTester, FullNameReviewControl, FullNameTester, GoAArrayControlRenderer, GoAArrayControlReviewRenderer, GoAArrayControlTester, GoABaseInputReviewComponent, GoABaseRenderers, GoABaseReviewRenderers, GoABaseTableReviewRenderers, GoABooleanControl, GoABooleanControlTester, GoABooleanRadioControl, GoABooleanRadioControlTester, GoACalculationControl, GoACalculationControlTester, GoACells, GoACheckoutGroupControlTester, GoADateControl, GoADateControlTester, GoADateInput, GoADateTimeControl, GoADateTimeControlTester, GoADateTimeInput, GoAEmailControl, GoAEmailControlTester, GoAEmailInput, GoAEnumCheckboxGroupControl, GoAEnumControl, GoAEnumControlTester, GoAEnumRadioGroupControl, GoAInputBaseControl, GoAInputBaseFullNameControlReview, GoAInputBaseFullNameDobControlReview, GoAInputBaseReviewControl, GoAInputBaseTableReview, GoAInputBaseTableReviewControl, GoAInputDateControl, GoAInputDateTimeControl, GoAInputEmailControl, GoAInputIntegerControl, GoAInputNumberControl, GoAInputText, GoAInputTextControl, GoAInputTimeControl, GoAIntegerControl, GoAIntegerControlTester, GoAListWithDetailsControlRenderer, GoAListWithDetailsTester, GoANumberControl, GoANumberControlTester, GoANumberInput, GoAPhoneNumberControl, GoAPhoneNumberWithTypeControl, GoAPrimitiveArrayRenderer, GoAPrimitiveArrayTester, GoARadioGroupControlTester, GoARenderers, GoAReviewRenderers, GoATextControl, GoATextControlTester, GoATimeControl, GoATimeControlTester, GoATimeInput, GoInputBaseReview, GoabInputBasePhoneNumberReviewControl, GoabInputBasePhoneNumberWithTypeReviewControl, GoabInputInteger, InnerGoAInputText, JsonFormContext, JsonFormRegisterProvider, JsonFormsRegisterContext, ListWithDetailsControl, MultiLineText, MultiLineTextControl, MultiLineTextControlInput, MultiLineTextControlTester, OPTION_DEFINITIONS, PHONE_REGEX, PhoneGrid, PhoneNumberControl, PhoneNumberReviewControl, PhoneNumberTester, PhoneNumberWithTypeControl, PhoneNumberWithTypeReviewControl, PhoneNumberWithTypeTester, PrimitiveArrayControl, RadioGroup, USER_FIELD_DEFINITIONS, autoPopulatePropertiesMonaco, autoPopulateValue, categoriesAreValid, createDefaultAjv, enumControl, errMalformedDate, fetchRegisterConfigFromOptions$1 as fetchRegisterConfigFromOptions, formatSin, getByJsonPointer, getCategoryScopes, hasDataInScopes, hasDataValue, isAddressLookup, isFullName, isFullNameDoB, isPhoneNumberWithType, predictiveOptionsMonaco, registerReducer, resolveRefs, tryResolveRefs, useRegisterUser };
+export { ADD_DATALIST_ACTION, ADD_NO_ANONYMOUS_ACTION, ADD_REGISTER_DATA_ACTION, ADD_REGISTER_DATA_ERROR, ADD_USER_ACTION, AddressLookUpControl, AddressLookUpControlReview, AddressLookUpTester, AddressLoopUpControlTableReview, ArrayControl, ArrayControlBase, ArrayControlReview, BooleanComponent, BooleanControl, BooleanRadioComponent, BooleanRadioControl, CategorizationPagesRendererTester, CategorizationStepperRendererTester, CheckboxGroup, ContactInformationTester, ContextProviderC, ContextProviderClass, ContextProviderFactory, ContractInfoControl, ContractInfoControlReview, EnumCheckboxControl, EnumRadioControl, EnumSelect, FileUploader, FileUploaderReview, FileUploaderTester, FormPageStepper, FormPagesView, FormStepper, FormStepperControl, FormStepperPagesControl, FormStepperReviewControl, FormStepperReviewer, FormStepperView, FullNameControl, FullNameControlReview, FullNameDobControl, FullNameDobReviewControl, FullNameDobTester, FullNameReviewControl, FullNameTester, GoAArrayControlRenderer, GoAArrayControlReviewRenderer, GoAArrayControlTester, GoABaseInputReviewComponent, GoABaseRenderers, GoABaseReviewRenderers, GoABaseTableReviewRenderers, GoABooleanControl, GoABooleanControlTester, GoABooleanRadioControl, GoABooleanRadioControlTester, GoACalculationControl, GoACalculationControlTester, GoACells, GoACheckoutGroupControlTester, GoAContractInfoControlReview, GoADateControl, GoADateControlTester, GoADateInput, GoADateTimeControl, GoADateTimeControlTester, GoADateTimeInput, GoAEmailControl, GoAEmailControlTester, GoAEmailInput, GoAEnumCheckboxGroupControl, GoAEnumControl, GoAEnumControlTester, GoAEnumRadioGroupControl, GoAInputBaseControl, GoAInputBaseFullNameControlReview, GoAInputBaseFullNameDobControlReview, GoAInputBaseReviewControl, GoAInputBaseTableReview, GoAInputBaseTableReviewControl, GoAInputDateControl, GoAInputDateTimeControl, GoAInputEmailControl, GoAInputIntegerControl, GoAInputNumberControl, GoAInputText, GoAInputTextControl, GoAInputTimeControl, GoAIntegerControl, GoAIntegerControlTester, GoAListWithDetailsControlRenderer, GoAListWithDetailsTester, GoANumberControl, GoANumberControlTester, GoANumberInput, GoAPhoneNumberControl, GoAPhoneNumberWithTypeControl, GoAPrimitiveArrayRenderer, GoAPrimitiveArrayTester, GoARadioGroupControlTester, GoARenderers, GoAReviewRenderers, GoATextControl, GoATextControlTester, GoATimeControl, GoATimeControlTester, GoATimeInput, GoInputBaseReview, GoabInputBasePhoneNumberReviewControl, GoabInputBasePhoneNumberWithTypeReviewControl, GoabInputInteger, InnerGoAInputText, JsonFormContext, JsonFormRegisterProvider, JsonFormsRegisterContext, ListWithDetailsControl, MultiLineText, MultiLineTextControl, MultiLineTextControlInput, MultiLineTextControlTester, OPTION_DEFINITIONS, PHONE_REGEX, PhoneGrid, PhoneNumberControl, PhoneNumberReviewControl, PhoneNumberTester, PhoneNumberWithTypeControl, PhoneNumberWithTypeReviewControl, PhoneNumberWithTypeTester, PrimitiveArrayControl, RadioGroup, USER_FIELD_DEFINITIONS, autoPopulatePropertiesMonaco, autoPopulateValue, categoriesAreValid, createDefaultAjv, enumControl, errMalformedDate, fetchRegisterConfigFromOptions$1 as fetchRegisterConfigFromOptions, formatSin, getByJsonPointer, getCategoryScopes, hasDataInScopes, hasDataValue, isAddressLookup, isContactInformation, isFullName, isFullNameDoB, isPhoneNumberWithType, predictiveOptionsMonaco, registerReducer, resolveRefs, tryResolveRefs, useRegisterUser };