@reusa/ngx-reusa-app-lib 0.0.1300 → 0.0.1301

package/fesm2022/reusa-ngx-reusa-app-lib.mjs

@@ -11589,7 +11589,7 @@ function DynamicFormQuestionComponent_div_6_app_address_8_Template(rf, ctx) { if
     i0.ɵɵelement(0, "app-address", 38, 39);
 } if (rf & 2) {
     const ctx_r43 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("formControlName", ctx_r43.question.name)("fromPopup", false)("countyRequired", ctx_r43.question.countyRequired)("inputId", ctx_r43.question.name)("componentData", ctx_r43.question.componentData)("diffMailAddress", (ctx_r43.form == null ? null : ctx_r43.form.controls["diffMailingAddress"] == null ? null : ctx_r43.form.controls["diffMailingAddress"].value) === "Y" || (ctx_r43.form == null ? null : ctx_r43.form.controls["diffmailaddress"] == null ? null : ctx_r43.form.controls["diffmailaddress"].value) === "Y" ? true : false)("enableAddressValidation", ctx_r43.isAddressValidationEnabled);
+    i0.ɵɵproperty("formControlName", ctx_r43.question.name)("fromPopup", false)("countyRequired", ctx_r43.question.countyRequired)("questionaireForm", ctx_r43.questionaireForm)("inputId", ctx_r43.question.name)("componentData", ctx_r43.question.componentData)("diffMailAddress", (ctx_r43.form == null ? null : ctx_r43.form.controls["diffMailingAddress"] == null ? null : ctx_r43.form.controls["diffMailingAddress"].value) === "Y" || (ctx_r43.form == null ? null : ctx_r43.form.controls["diffmailaddress"] == null ? null : ctx_r43.form.controls["diffmailaddress"].value) === "Y" ? true : false)("enableAddressValidation", ctx_r43.isAddressValidationEnabled);
 } }
 function DynamicFormQuestionComponent_div_6_app_job_title_9_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "app-job-title", 40);
@@ -11719,7 +11719,7 @@ function DynamicFormQuestionComponent_div_6_app_wage_calculator_28_Template(rf,
 } }
 function DynamicFormQuestionComponent_div_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div");
-    i0.ɵɵtemplate(1, DynamicFormQuestionComponent_div_6_app_employer_grid_1_Template, 1, 3, "app-employer-grid", 19)(2, DynamicFormQuestionComponent_div_6_app_offline_employer_grid_2_Template, 1, 3, "app-offline-employer-grid", 19)(3, DynamicFormQuestionComponent_div_6_app_legal_disclaimar_3_Template, 1, 3, "app-legal-disclaimar", 20)(4, DynamicFormQuestionComponent_div_6_app_offline_legal_disclaimar_4_Template, 1, 3, "app-offline-legal-disclaimar", 20)(5, DynamicFormQuestionComponent_div_6_money_expect_5_Template, 1, 1, "money-expect", 21)(6, DynamicFormQuestionComponent_div_6_app_captcha_6_Template, 1, 1, "app-captcha", 22)(7, DynamicFormQuestionComponent_div_6_app_file_uploader_7_Template, 1, 1, "app-file-uploader", 22)(8, DynamicFormQuestionComponent_div_6_app_address_8_Template, 2, 7, "app-address", 23)(9, DynamicFormQuestionComponent_div_6_app_job_title_9_Template, 1, 2, "app-job-title", 24)(10, DynamicFormQuestionComponent_div_6_app_bank_details_10_Template, 2, 1, "app-bank-details", 22)(11, DynamicFormQuestionComponent_div_6_app_offline_bank_details_11_Template, 2, 1, "app-offline-bank-details", 22)(12, DynamicFormQuestionComponent_div_6_app_requalify_lift_previous_issues_12_Template, 1, 4, "app-requalify-lift-previous-issues", 25)(13, DynamicFormQuestionComponent_div_6_app_dependent_grid_13_Template, 1, 1, "app-dependent-grid", 22)(14, DynamicFormQuestionComponent_div_6_app_weekly_cert_employer_grid_14_Template, 2, 3, "app-weekly-cert-employer-grid", 26)(15, DynamicFormQuestionComponent_div_6_app_search_employer_15_Template, 1, 1, "app-search-employer", 27)(16, DynamicFormQuestionComponent_div_6_app_add_participant_16_Template, 1, 2, "app-add-participant", 28)(17, DynamicFormQuestionComponent_div_6_app_add_payment_17_Template, 1, 2, "app-add-payment", 29)(18, DynamicFormQuestionComponent_div_6_app_link_18_Template, 1, 5, "app-link", 30)(19, DynamicFormQuestionComponent_div_6_app_sign_ssn_19_Template, 1, 3, "app-sign-ssn", 31)(20, DynamicFormQuestionComponent_div_6_app_employer_pay_grid_20_Template, 1, 1, "app-employer-pay-grid", 22)(21, DynamicFormQuestionComponent_div_6_app_sms_21_Template, 1, 3, "app-sms", 32)(22, DynamicFormQuestionComponent_div_6_app_farm_usage_22_Template, 1, 1, "app-farm-usage", 22)(23, DynamicFormQuestionComponent_div_6_app_wage_grid_23_Template, 1, 1, "app-wage-grid", 22)(24, DynamicFormQuestionComponent_div_6_app_gross_earnings_24_Template, 1, 1, "app-gross-earnings", 22)(25, DynamicFormQuestionComponent_div_6_app_scrollable_text_25_Template, 1, 2, "app-scrollable-text", 33)(26, DynamicFormQuestionComponent_div_6_app_employer_info_26_Template, 1, 1, "app-employer-info", 22)(27, DynamicFormQuestionComponent_div_6_app_idme_27_Template, 1, 1, "app-idme", 22)(28, DynamicFormQuestionComponent_div_6_app_wage_calculator_28_Template, 1, 1, "app-wage-calculator", 22);
+    i0.ɵɵtemplate(1, DynamicFormQuestionComponent_div_6_app_employer_grid_1_Template, 1, 3, "app-employer-grid", 19)(2, DynamicFormQuestionComponent_div_6_app_offline_employer_grid_2_Template, 1, 3, "app-offline-employer-grid", 19)(3, DynamicFormQuestionComponent_div_6_app_legal_disclaimar_3_Template, 1, 3, "app-legal-disclaimar", 20)(4, DynamicFormQuestionComponent_div_6_app_offline_legal_disclaimar_4_Template, 1, 3, "app-offline-legal-disclaimar", 20)(5, DynamicFormQuestionComponent_div_6_money_expect_5_Template, 1, 1, "money-expect", 21)(6, DynamicFormQuestionComponent_div_6_app_captcha_6_Template, 1, 1, "app-captcha", 22)(7, DynamicFormQuestionComponent_div_6_app_file_uploader_7_Template, 1, 1, "app-file-uploader", 22)(8, DynamicFormQuestionComponent_div_6_app_address_8_Template, 2, 8, "app-address", 23)(9, DynamicFormQuestionComponent_div_6_app_job_title_9_Template, 1, 2, "app-job-title", 24)(10, DynamicFormQuestionComponent_div_6_app_bank_details_10_Template, 2, 1, "app-bank-details", 22)(11, DynamicFormQuestionComponent_div_6_app_offline_bank_details_11_Template, 2, 1, "app-offline-bank-details", 22)(12, DynamicFormQuestionComponent_div_6_app_requalify_lift_previous_issues_12_Template, 1, 4, "app-requalify-lift-previous-issues", 25)(13, DynamicFormQuestionComponent_div_6_app_dependent_grid_13_Template, 1, 1, "app-dependent-grid", 22)(14, DynamicFormQuestionComponent_div_6_app_weekly_cert_employer_grid_14_Template, 2, 3, "app-weekly-cert-employer-grid", 26)(15, DynamicFormQuestionComponent_div_6_app_search_employer_15_Template, 1, 1, "app-search-employer", 27)(16, DynamicFormQuestionComponent_div_6_app_add_participant_16_Template, 1, 2, "app-add-participant", 28)(17, DynamicFormQuestionComponent_div_6_app_add_payment_17_Template, 1, 2, "app-add-payment", 29)(18, DynamicFormQuestionComponent_div_6_app_link_18_Template, 1, 5, "app-link", 30)(19, DynamicFormQuestionComponent_div_6_app_sign_ssn_19_Template, 1, 3, "app-sign-ssn", 31)(20, DynamicFormQuestionComponent_div_6_app_employer_pay_grid_20_Template, 1, 1, "app-employer-pay-grid", 22)(21, DynamicFormQuestionComponent_div_6_app_sms_21_Template, 1, 3, "app-sms", 32)(22, DynamicFormQuestionComponent_div_6_app_farm_usage_22_Template, 1, 1, "app-farm-usage", 22)(23, DynamicFormQuestionComponent_div_6_app_wage_grid_23_Template, 1, 1, "app-wage-grid", 22)(24, DynamicFormQuestionComponent_div_6_app_gross_earnings_24_Template, 1, 1, "app-gross-earnings", 22)(25, DynamicFormQuestionComponent_div_6_app_scrollable_text_25_Template, 1, 2, "app-scrollable-text", 33)(26, DynamicFormQuestionComponent_div_6_app_employer_info_26_Template, 1, 1, "app-employer-info", 22)(27, DynamicFormQuestionComponent_div_6_app_idme_27_Template, 1, 1, "app-idme", 22)(28, DynamicFormQuestionComponent_div_6_app_wage_calculator_28_Template, 1, 1, "app-wage-calculator", 22);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r5 = i0.ɵɵnextContext();
@@ -12793,7 +12793,6 @@ class DynamicFormQuestionComponent {
         }
     }
     ngOnInit() {
-        //   this.logger.debug('is DynamicFormQuestionComponent ngOnInit called', this.question)
         this.filterResult = this.question.choices;
         this.setMinMaxDate();
         this.setMinMaxValue();
@@ -13548,7 +13547,7 @@ class DynamicFormQuestionComponent {
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.wcEmployerGrid = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.jobTitle = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.addresses = _t);
-        } }, inputs: { question: "question", form: "form", indexNumber: "indexNumber", forScreenQuestionnaire: "forScreenQuestionnaire", dynamicParam: "dynamicParam", potentialIssueId: "potentialIssueId" }, outputs: { onDynamicParamUpdate: "onDynamicParamUpdate" }, decls: 28, vars: 29, consts: [[3, "formGroup", "id"], ["appendTo", "body", "closeOnEscape", "false", 3, "visible", "position", "modal", "breakpoints", "style", "baseZIndex", "draggable", "resizable", "visibleChange", 4, "ngIf"], ["class", "form-label", 3, "ngStyle", 4, "ngIf"], [4, "ngIf"], ["style", "display: flex;", 4, "ngIf"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["class", "responsive", 4, "ngSwitchCase"], [3, "ngStyle", 4, "ngIf"], ["appendTo", "body", "closeOnEscape", "false", 3, "visible", "position", "modal", "breakpoints", "baseZIndex", "draggable", "resizable", "visibleChange"], [1, "heading", "ion-padding-left"], [3, "innerHTML"], ["pTemplate", "footer"], ["shape", "round", "size", "small", "type", "submit", "fill", "outline", 3, "click", 4, "ngIf"], ["shape", "round", "size", "small", "type", "submit", "fill", "solid", 3, "click", 4, "ngIf"], ["shape", "round", "size", "small", "type", "submit", "fill", "outline", 3, "click"], ["shape", "round", "size", "small", "type", "submit", "fill", "solid", 3, "click"], [1, "form-label", 3, "ngStyle"], [3, "innerHtml"], [3, "formControlName", "form", "dynamicParam", "modelDisplay", 4, "ngIf"], [3, "componentData", "question", "form", "accepted", 4, "ngIf"], [3, "componentData", 4, "ngIf"], [3, "formControlName", 4, "ngIf"], [3, "formControlName", "fromPopup", "countyRequired", "inputId", "componentData", "diffMailAddress", "enableAddressValidation", 4, "ngIf"], [3, "formControlName", "isRequired", 4, "ngIf"], [3, "formControlName", "componentData", "form", "question", 4, "ngIf"], [3, "form", "dynamicParam", "formControlName", 4, "ngIf"], ["empType", "REG", 3, "formControlName", "onFound", "onEmpty", 4, "ngIf"], [3, "formControlName", "dynamicParam", 4, "ngIf"], [3, "potentialIssueId", "formControlName", 4, "ngIf"], [3, "isRequired", "formControlName", "text", "uri", "externalUrl", 4, "ngIf"], [3, "isRequired", "formControlName", "inputId", 4, "ngIf"], [3, "formControlName", "question", "form", "accepted", 4, "ngIf"], [3, "componentData", "formControlName", 4, "ngIf"], [3, "formControlName", "form", "dynamicParam", "modelDisplay"], [3, "componentData", "question", "form", "accepted"], [3, "componentData"], [3, "formControlName"], [3, "formControlName", "fromPopup", "countyRequired", "inputId", "componentData", "diffMailAddress", "enableAddressValidation"], ["address", ""], [3, "formControlName", "isRequired"], ["bankdtls", ""], [3, "formControlName", "componentData", "form", "question"], [3, "form", "dynamicParam", "formControlName"], ["wcEmployerGrid", ""], ["empType", "REG", 3, "formControlName", "onFound", "onEmpty"], [3, "formControlName", "dynamicParam"], [3, "potentialIssueId", "formControlName"], [3, "isRequired", "formControlName", "text", "uri", "externalUrl"], [3, "isRequired", "formControlName", "inputId"], [3, "formControlName", "question", "form", "accepted"], [3, "componentData", "formControlName"], [2, "display", "flex"], [1, "heading", 2, "color", "var(--ion-color-medium-gray)", "padding-top", "20px", 3, "innerHTML"], ["style", "flex-grow: 1;", "style", "padding-left: 8px; padding-top:13px", 4, "ngIf"], [2, "padding-left", "8px", "padding-top", "13px"], [3, "overlayText"], [1, "container", 2, "display", "flex"], ["style", "flex-grow: 1;", "style", "padding-left: 8px; padding-top:3px", 4, "ngIf"], [3, "ngStyle"], ["yearRange", "1901:2099", "dateFormat", "mm/dd/yy", "appendTo", "body", "dataType", "string", "placeholder", "mm/dd/yyyy", 3, "formControlName", "inputId", "monthNavigator", "yearNavigator", "showIcon", "minDate", "maxDate", "showOnFocus", "iconAriaLabel", "onBlur", "onSelect", "onInput"], ["mask", "999-99-9999", "placeholder", "999-99-9999", 3, "inputId", "formControlName", "type", "onComplete", "onFocus", "onBlur"], ["mask", "9999", "placeholder", "9999", 3, "inputId", "formControlName", "type", "onComplete", "onFocus", "onBlur"], ["mask", "99-99999-9-99", "placeholder", "99-99999-9-99", 3, "inputId", "formControlName", "value", "onComplete"], ["mode", "decimal", "locale", "en-US", 3, "inputId", "formControlName", "minFractionDigits", "ariaLabel"], ["type", "text", "pInputText", "", 3, "maxLength", "placeholder", "id", "formControlName", 4, "ngIf"], ["type", "text", "pInputText", "", 3, "placeholder", "id", "formControlName", 4, "ngIf"], ["type", "text", "pInputText", "", 3, "id", "formControlName", "placeholder", 4, "ngIf"], ["type", "text", "pInputText", "", 3, "maxLength", "placeholder", "id", "formControlName"], ["type", "text", "pInputText", "", 3, "placeholder", "id", "formControlName"], ["type", "text", "pInputText", "", 3, "id", "formControlName", "placeholder"], ["type", "text", "pInputText", "", 3, "maxLength", "id", "formControlName", "placeholder", 4, "ngIf"], ["type", "text", "pInputText", "", 3, "maxLength", "id", "formControlName", "placeholder"], ["mask", "999-999-9999", 3, "inputId", "formControlName", "placeholder", "onBlur", 4, "ngIf"], ["mask", "999-999-9999", 3, "inputId", "formControlName", "placeholder", "onBlur"], ["weakLabel", "Weak password", "mediumLabel", "Weak password", "strongLabel", "Strong password", "strongRegex", "^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[_@*$!#.]+.*[_@*$!#.])(?=.{14,})", 3, "inputId", "formControlName", "toggleMask", "maxLength", "ariaLabel"], [1, "mt-1", 2, "font-size", "small"], [2, "line-height", "1.25"], [2, "margin-left", "-25px", "font-size", "small"], ["style", "margin-left: -25px; font-size: small;", 4, "ngIf"], [3, "allowedFileType", "formControlName", "maxSizeInMB", "multiple", "noOfFilesToUpload"], ["type", "text", "pInputText", "", 3, "id", "formControlName", "placeholder", "blur"], [2, "padding-left", "8px", "padding-top", "3px"], ["style", "display: flex; align-items: center;", 3, "ngStyle", 4, "ngIf"], [2, "display", "flex", "align-items", "center", 3, "ngStyle"], ["autoResize", "true", 3, "id", "formControlName", "maxLength", "rows", "cols", "placeholder"], ["style", "flex-grow: 1;", "style", "padding-left: 3px; padding-top:3px", 4, "ngIf"], [2, "padding-left", "3px", "padding-top", "3px"], ["autoResize", "true", 3, "id", "formControlName", "rows", "cols", "placeholder"], ["appendTo", "body", "field", "text", "minLength", "1", 3, "formControlName", "suggestions", "dropdown", "forceSelection", "completeOnFocus", "completeMethod", "onSelect", 4, "ngIf"], ["optionLabel", "text", "appendTo", "body", 3, "options", "formControlName", "autoDisplayFirst", "inputId", "ariaLabel", "placeholder", "onChange", "onClick"], ["appendTo", "body", "field", "text", "minLength", "1", 3, "formControlName", "suggestions", "dropdown", "forceSelection", "completeOnFocus", "completeMethod", "onSelect"], ["pTemplate", "item"], ["unselectable", "true", "optionLabel", "text", "optionValue", "value", 3, "options", "formControlName", "onOptionClick"], ["mode", "decimal", 3, "formControlName", "inputId", "useGrouping", "min", "max", "size", "maxlength", "ariaLabel", "placeholder", "required"], ["mode", "decimal", 3, "formControlName", "inputId", "useGrouping", "minFractionDigits", "maxFractionDigits", "min", "max", "size", "maxlength", "ariaLabel", "placeholder", "required"], ["mode", "currency", "currency", "USD", 3, "formControlName", "inputId", "useGrouping", "minFractionDigits", "maxFractionDigits", "min", "max", "size", "maxlength", "ariaLabel", "placeholder", "required"], [1, "formgroup-inline", 3, "ngStyle"], ["styleClass", "app-p-checkbox", 3, "name", "value", "label", "formControl", "inputId", 4, "ngFor", "ngForOf"], ["styleClass", "app-p-checkbox", 3, "name", "value", "label", "formControl", "inputId"], ["unselectable", "true", "optionLabel", "text", "optionValue", "value", 3, "options", "formControlName", "multiple"], [1, "field-checkbox"], ["binary", "true", "inputId", "binary", 3, "formControlName"], ["for", "binary"], ["style", "flex-grow: 1;", "style", "padding-left: 8px; padding-top: 3px", 4, "ngIf"], ["type", "hidden", 3, "formControlName"], ["style", "flex-grow: 1;", "style", "padding-left: 2px", 4, "ngIf"], [2, "padding-left", "2px"], [3, "displayText", "overlayText", "displayAsLabel"], [3, "displayText", "formControlName", "overlayText", "labelWithLink"], [3, "displayText", "formControlName", "labelWithPopup", "labelWithLink"], [1, "responsive"], [4, "ngFor", "ngForOf"], ["class", "col-fit-content", 3, "sizeXl", "sizeLg", "sizeMd", "offsetMd", 4, "ngIf"], [1, "col-fit-content", 3, "sizeXl", "sizeLg", "sizeMd", "offsetMd"], [3, "question", "form", "forScreenQuestionnaire"], [3, "sizeXl", "sizeLg", "sizeMd", "offsetMd", 4, "ngIf"], [3, "sizeXl", "sizeLg", "sizeMd", "offsetMd"], ["class", "p-error", 4, "ngIf"], [1, "p-error"]], template: function DynamicFormQuestionComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { question: "question", form: "form", indexNumber: "indexNumber", forScreenQuestionnaire: "forScreenQuestionnaire", dynamicParam: "dynamicParam", potentialIssueId: "potentialIssueId", questionaireForm: "questionaireForm" }, outputs: { onDynamicParamUpdate: "onDynamicParamUpdate" }, decls: 28, vars: 29, consts: [[3, "formGroup", "id"], ["appendTo", "body", "closeOnEscape", "false", 3, "visible", "position", "modal", "breakpoints", "style", "baseZIndex", "draggable", "resizable", "visibleChange", 4, "ngIf"], ["class", "form-label", 3, "ngStyle", 4, "ngIf"], [4, "ngIf"], ["style", "display: flex;", 4, "ngIf"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["class", "responsive", 4, "ngSwitchCase"], [3, "ngStyle", 4, "ngIf"], ["appendTo", "body", "closeOnEscape", "false", 3, "visible", "position", "modal", "breakpoints", "baseZIndex", "draggable", "resizable", "visibleChange"], [1, "heading", "ion-padding-left"], [3, "innerHTML"], ["pTemplate", "footer"], ["shape", "round", "size", "small", "type", "submit", "fill", "outline", 3, "click", 4, "ngIf"], ["shape", "round", "size", "small", "type", "submit", "fill", "solid", 3, "click", 4, "ngIf"], ["shape", "round", "size", "small", "type", "submit", "fill", "outline", 3, "click"], ["shape", "round", "size", "small", "type", "submit", "fill", "solid", 3, "click"], [1, "form-label", 3, "ngStyle"], [3, "innerHtml"], [3, "formControlName", "form", "dynamicParam", "modelDisplay", 4, "ngIf"], [3, "componentData", "question", "form", "accepted", 4, "ngIf"], [3, "componentData", 4, "ngIf"], [3, "formControlName", 4, "ngIf"], [3, "formControlName", "fromPopup", "countyRequired", "questionaireForm", "inputId", "componentData", "diffMailAddress", "enableAddressValidation", 4, "ngIf"], [3, "formControlName", "isRequired", 4, "ngIf"], [3, "formControlName", "componentData", "form", "question", 4, "ngIf"], [3, "form", "dynamicParam", "formControlName", 4, "ngIf"], ["empType", "REG", 3, "formControlName", "onFound", "onEmpty", 4, "ngIf"], [3, "formControlName", "dynamicParam", 4, "ngIf"], [3, "potentialIssueId", "formControlName", 4, "ngIf"], [3, "isRequired", "formControlName", "text", "uri", "externalUrl", 4, "ngIf"], [3, "isRequired", "formControlName", "inputId", 4, "ngIf"], [3, "formControlName", "question", "form", "accepted", 4, "ngIf"], [3, "componentData", "formControlName", 4, "ngIf"], [3, "formControlName", "form", "dynamicParam", "modelDisplay"], [3, "componentData", "question", "form", "accepted"], [3, "componentData"], [3, "formControlName"], [3, "formControlName", "fromPopup", "countyRequired", "questionaireForm", "inputId", "componentData", "diffMailAddress", "enableAddressValidation"], ["address", ""], [3, "formControlName", "isRequired"], ["bankdtls", ""], [3, "formControlName", "componentData", "form", "question"], [3, "form", "dynamicParam", "formControlName"], ["wcEmployerGrid", ""], ["empType", "REG", 3, "formControlName", "onFound", "onEmpty"], [3, "formControlName", "dynamicParam"], [3, "potentialIssueId", "formControlName"], [3, "isRequired", "formControlName", "text", "uri", "externalUrl"], [3, "isRequired", "formControlName", "inputId"], [3, "formControlName", "question", "form", "accepted"], [3, "componentData", "formControlName"], [2, "display", "flex"], [1, "heading", 2, "color", "var(--ion-color-medium-gray)", "padding-top", "20px", 3, "innerHTML"], ["style", "flex-grow: 1;", "style", "padding-left: 8px; padding-top:13px", 4, "ngIf"], [2, "padding-left", "8px", "padding-top", "13px"], [3, "overlayText"], [1, "container", 2, "display", "flex"], ["style", "flex-grow: 1;", "style", "padding-left: 8px; padding-top:3px", 4, "ngIf"], [3, "ngStyle"], ["yearRange", "1901:2099", "dateFormat", "mm/dd/yy", "appendTo", "body", "dataType", "string", "placeholder", "mm/dd/yyyy", 3, "formControlName", "inputId", "monthNavigator", "yearNavigator", "showIcon", "minDate", "maxDate", "showOnFocus", "iconAriaLabel", "onBlur", "onSelect", "onInput"], ["mask", "999-99-9999", "placeholder", "999-99-9999", 3, "inputId", "formControlName", "type", "onComplete", "onFocus", "onBlur"], ["mask", "9999", "placeholder", "9999", 3, "inputId", "formControlName", "type", "onComplete", "onFocus", "onBlur"], ["mask", "99-99999-9-99", "placeholder", "99-99999-9-99", 3, "inputId", "formControlName", "value", "onComplete"], ["mode", "decimal", "locale", "en-US", 3, "inputId", "formControlName", "minFractionDigits", "ariaLabel"], ["type", "text", "pInputText", "", 3, "maxLength", "placeholder", "id", "formControlName", 4, "ngIf"], ["type", "text", "pInputText", "", 3, "placeholder", "id", "formControlName", 4, "ngIf"], ["type", "text", "pInputText", "", 3, "id", "formControlName", "placeholder", 4, "ngIf"], ["type", "text", "pInputText", "", 3, "maxLength", "placeholder", "id", "formControlName"], ["type", "text", "pInputText", "", 3, "placeholder", "id", "formControlName"], ["type", "text", "pInputText", "", 3, "id", "formControlName", "placeholder"], ["type", "text", "pInputText", "", 3, "maxLength", "id", "formControlName", "placeholder", 4, "ngIf"], ["type", "text", "pInputText", "", 3, "maxLength", "id", "formControlName", "placeholder"], ["mask", "999-999-9999", 3, "inputId", "formControlName", "placeholder", "onBlur", 4, "ngIf"], ["mask", "999-999-9999", 3, "inputId", "formControlName", "placeholder", "onBlur"], ["weakLabel", "Weak password", "mediumLabel", "Weak password", "strongLabel", "Strong password", "strongRegex", "^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[_@*$!#.]+.*[_@*$!#.])(?=.{14,})", 3, "inputId", "formControlName", "toggleMask", "maxLength", "ariaLabel"], [1, "mt-1", 2, "font-size", "small"], [2, "line-height", "1.25"], [2, "margin-left", "-25px", "font-size", "small"], ["style", "margin-left: -25px; font-size: small;", 4, "ngIf"], [3, "allowedFileType", "formControlName", "maxSizeInMB", "multiple", "noOfFilesToUpload"], ["type", "text", "pInputText", "", 3, "id", "formControlName", "placeholder", "blur"], [2, "padding-left", "8px", "padding-top", "3px"], ["style", "display: flex; align-items: center;", 3, "ngStyle", 4, "ngIf"], [2, "display", "flex", "align-items", "center", 3, "ngStyle"], ["autoResize", "true", 3, "id", "formControlName", "maxLength", "rows", "cols", "placeholder"], ["style", "flex-grow: 1;", "style", "padding-left: 3px; padding-top:3px", 4, "ngIf"], [2, "padding-left", "3px", "padding-top", "3px"], ["autoResize", "true", 3, "id", "formControlName", "rows", "cols", "placeholder"], ["appendTo", "body", "field", "text", "minLength", "1", 3, "formControlName", "suggestions", "dropdown", "forceSelection", "completeOnFocus", "completeMethod", "onSelect", 4, "ngIf"], ["optionLabel", "text", "appendTo", "body", 3, "options", "formControlName", "autoDisplayFirst", "inputId", "ariaLabel", "placeholder", "onChange", "onClick"], ["appendTo", "body", "field", "text", "minLength", "1", 3, "formControlName", "suggestions", "dropdown", "forceSelection", "completeOnFocus", "completeMethod", "onSelect"], ["pTemplate", "item"], ["unselectable", "true", "optionLabel", "text", "optionValue", "value", 3, "options", "formControlName", "onOptionClick"], ["mode", "decimal", 3, "formControlName", "inputId", "useGrouping", "min", "max", "size", "maxlength", "ariaLabel", "placeholder", "required"], ["mode", "decimal", 3, "formControlName", "inputId", "useGrouping", "minFractionDigits", "maxFractionDigits", "min", "max", "size", "maxlength", "ariaLabel", "placeholder", "required"], ["mode", "currency", "currency", "USD", 3, "formControlName", "inputId", "useGrouping", "minFractionDigits", "maxFractionDigits", "min", "max", "size", "maxlength", "ariaLabel", "placeholder", "required"], [1, "formgroup-inline", 3, "ngStyle"], ["styleClass", "app-p-checkbox", 3, "name", "value", "label", "formControl", "inputId", 4, "ngFor", "ngForOf"], ["styleClass", "app-p-checkbox", 3, "name", "value", "label", "formControl", "inputId"], ["unselectable", "true", "optionLabel", "text", "optionValue", "value", 3, "options", "formControlName", "multiple"], [1, "field-checkbox"], ["binary", "true", "inputId", "binary", 3, "formControlName"], ["for", "binary"], ["style", "flex-grow: 1;", "style", "padding-left: 8px; padding-top: 3px", 4, "ngIf"], ["type", "hidden", 3, "formControlName"], ["style", "flex-grow: 1;", "style", "padding-left: 2px", 4, "ngIf"], [2, "padding-left", "2px"], [3, "displayText", "overlayText", "displayAsLabel"], [3, "displayText", "formControlName", "overlayText", "labelWithLink"], [3, "displayText", "formControlName", "labelWithPopup", "labelWithLink"], [1, "responsive"], [4, "ngFor", "ngForOf"], ["class", "col-fit-content", 3, "sizeXl", "sizeLg", "sizeMd", "offsetMd", 4, "ngIf"], [1, "col-fit-content", 3, "sizeXl", "sizeLg", "sizeMd", "offsetMd"], [3, "question", "form", "forScreenQuestionnaire"], [3, "sizeXl", "sizeLg", "sizeMd", "offsetMd", 4, "ngIf"], [3, "sizeXl", "sizeLg", "sizeMd", "offsetMd"], ["class", "p-error", 4, "ngIf"], [1, "p-error"]], template: function DynamicFormQuestionComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵtemplate(1, DynamicFormQuestionComponent_p_dialog_1_Template, 5, 14, "p-dialog", 1)(2, DynamicFormQuestionComponent_div_2_Template, 2, 2, "div", 2)(3, DynamicFormQuestionComponent_div_3_Template, 4, 7, "div", 2)(4, DynamicFormQuestionComponent_div_4_Template, 4, 7, "div", 2)(5, DynamicFormQuestionComponent_div_5_Template, 4, 7, "div", 2)(6, DynamicFormQuestionComponent_div_6_Template, 29, 28, "div", 3)(7, DynamicFormQuestionComponent_div_7_Template, 4, 7, "div", 2)(8, DynamicFormQuestionComponent_div_8_Template, 5, 7, "div", 4);
             i0.ɵɵelementStart(9, "div", 5);
@@ -13616,7 +13615,7 @@ class DynamicFormQuestionComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DynamicFormQuestionComponent, [{
         type: Component,
-        args: [{ selector: 'app-question', changeDetection: ChangeDetectionStrategy.Default, animations: [rowExpansionTrigger], template: "<div [formGroup]=\"form\" [id]=\"'question-div-' + question.name\">\r\n  <p-dialog *ngIf=\"displayPosition\" [(visible)]=\"displayPosition\" [position]=\"position\"\r\n    [modal]=\"true\" [breakpoints]=\"{'1200px': '660px', '992px': '660px', '768px': '660px', '576px': '100vw'}\" [style]=\"{width: '45vw'}\"\r\n    [baseZIndex]=\"5000\" [draggable]=\"false\" [resizable]=\"false\" appendTo=\"body\" closeOnEscape=\"false\" [attr.aria-label]=\"question.title\">\r\n\r\n    <h4 class=\"heading ion-padding-left\">\r\n      {{popUpHeader}}\r\n    </h4>\r\n    <div [innerHTML]=\"sanitizer.bypassSecurityTrustHtml(popUpText)\"></div>\r\n    <ng-template pTemplate=\"footer\">\r\n      <ion-button shape=\"round\" *ngIf=\"popUpNoActionLabel\" size=\"small\" type=\"submit\" fill=\"outline\" (click)=\"reject()\">\r\n        {{popUpNoActionLabel}}\r\n      </ion-button>\r\n\r\n      <ion-button shape=\"round\" *ngIf=\"popUpYesActionLabel\" size=\"small\" type=\"submit\" fill=\"solid\" (click)=\"accept()\">\r\n        {{popUpYesActionLabel}}\r\n      </ion-button>\r\n\r\n    </ng-template>\r\n  </p-dialog>\r\n  <div [ngStyle]=\"setStyle(question.indent)\" *ngIf=\"!forScreenQuestionnaire\" class=\"form-label\">\r\n    <label [attr.for]=\"question.name\" *ngIf=\"question.indent===1 && question.type!='html' && question.type!='hidden' && question.type!='label'\">\r\n      <span [innerHtml]=\"question.title | dynamicTranslate:dynamicParam | trustHtml\"></span>\r\n    </label>\r\n  </div>\r\n\r\n  <div [ngStyle]=\"setStyle(question.indent)\" class=\"form-label\"\r\n    *ngIf=\"forScreenQuestionnaire && question.indent===1 && question.type!='html' && question.type!='hidden' && question.description && question.type!='simplecheckbox' && question.type!='label' && question.type!='label-with-overlay'\">\r\n    <span [innerHtml]=\"question.title | dynamicTranslate:dynamicParam | trustHtml\"></span>\r\n  </div>\r\n\r\n  <div [ngStyle]=\"setStyle(question.indent)\" class=\"form-label\"\r\n    *ngIf=\"forScreenQuestionnaire && question.customTag && (question.customTag!='component' || (question.customTag=='component' && showLabelForCustomComponent())) && question.indent===1 && question.type!='html' && question.type!='hidden' && !question.description && question.type!='label' && question.type!='simplecheckbox'\">\r\n    <span [innerHtml]=\"question.title | dynamicTranslate:dynamicParam | trustHtml\"></span>\r\n  </div>\r\n\r\n  <div [ngStyle]=\"setStyle(question.indent)\" class=\"form-label\"\r\n    *ngIf=\"forScreenQuestionnaire && !question.customTag  && question.indent===1 && question.type!='html' && question.type!='hidden' && !question.description && question.type!='simplecheckbox' && question.type!='label' && question.type!='label-with-overlay'\">\r\n    <span [innerHtml]=\"question.title | dynamicTranslate:dynamicParam | trustHtml\"></span>\r\n  </div>\r\n\r\n  <div *ngIf=\"question.customTag && question.customTag==='component' && question.type!='html' && !question.description\">\r\n    <app-employer-grid [formControlName]=\"question.name\" [form]=\"form\" [dynamicParam]=\"dynamicParam\"\r\n      *ngIf=\"question.componentName==='app-employer-grid'\" (modelDisplay)=\"onModelDisplay($event)\"></app-employer-grid>\r\n\r\n    <app-offline-employer-grid [formControlName]=\"question.name\" [form]=\"form\" [dynamicParam]=\"dynamicParam\"\r\n     *ngIf=\"question.componentName==='app-offline-employer-grid'\" (modelDisplay)=\"onModelDisplay($event)\"></app-offline-employer-grid>\r\n\r\n    <app-legal-disclaimar *ngIf=\"question.componentName==='app-legal-disclaimar'\"\r\n      [componentData]=\"question.componentData\" (accepted)=\"onAccepted($event)\" [question]=\"question\" [form]=\"form\">\r\n    </app-legal-disclaimar>\r\n\r\n    <app-offline-legal-disclaimar *ngIf=\"question.componentName==='app-offline-legal-disclaimar'\"\r\n    [componentData]=\"question.componentData\" (accepted)=\"onAccepted($event)\" [question]=\"question\" [form]=\"form\">\r\n    </app-offline-legal-disclaimar>\r\n\r\n    <money-expect *ngIf=\"question.componentName==='money-expect'\" [componentData]=\"question.componentData\" ></money-expect>\r\n    <app-captcha [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-captcha'\"></app-captcha>\r\n\r\n    <app-file-uploader [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-file-uploader'\">\r\n    </app-file-uploader>\r\n    <app-address [formControlName]=\"question.name\" [fromPopup]=\"false\" [countyRequired]=\"question.countyRequired\"\r\n      *ngIf=\"question.componentName==='app-address'\" #address [inputId]=\"question.name\" [componentData]=\"question.componentData\"\r\n      [diffMailAddress]=\"(form?.controls['diffMailingAddress']?.value === 'Y') || (form?.controls['diffmailaddress']?.value === 'Y')? true : false\"\r\n      [enableAddressValidation]=\"isAddressValidationEnabled\"> </app-address>\r\n   <!-- <app-address-suggestion *ngIf=\"showAddressSuggestion\"></app-address-suggestion> -->\r\n    <app-job-title [formControlName]=\"question.name\" [isRequired]=\"question.isRequired\"\r\n      *ngIf=\"question.componentName==='app-job-title'\" > </app-job-title>  \r\n    \r\n    <app-bank-details [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-bank-details'\" #bankdtls>\r\n    </app-bank-details>\r\n\r\n    <app-offline-bank-details [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-offline-bank-details'\" #bankdtls>\r\n    </app-offline-bank-details>\r\n\r\n    <app-requalify-lift-previous-issues *ngIf=\"question.componentName==='app-requalify-lift-previous-issues'\"\r\n    [formControlName]=\"question.name\" [componentData]=\"question.componentData\" [form]=\"form\" [question]=\"question\">\r\n    </app-requalify-lift-previous-issues> \r\n    <app-dependent-grid [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-dependent-grid'\"></app-dependent-grid>\r\n    <app-weekly-cert-employer-grid #wcEmployerGrid [form]=\"form\" [dynamicParam]=\"dynamicParam\" [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-weekly-cert-employer-grid'\"></app-weekly-cert-employer-grid>\r\n    <app-search-employer [formControlName]=\"question.name\" empType=\"REG\" (onFound)=\"setEmployer($event)\" \r\n    (onEmpty)=\"resetEmployer()\" *ngIf=\"question.componentName==='app-search-employer'\"></app-search-employer>\r\n    <app-add-participant [formControlName]=\"question.name\" [dynamicParam]=\"dynamicParam\" *ngIf=\"question.componentName==='app-add-participant'\"> </app-add-participant>\r\n    <app-add-payment [potentialIssueId]=\"potentialIssueId\" [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-add-payment'\"></app-add-payment>\r\n    <app-link [isRequired]=\"question.isRequired\" [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-link'\" [text]=\"linkComponentData?.text\" [uri]=\"linkComponentData?.uri\" [externalUrl]=\"linkComponentData?.externalUrl\"></app-link>\r\n    <app-sign-ssn [isRequired]=\"question.isRequired\" [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-sign-ssn'\" [inputId]=\"question.name\"></app-sign-ssn>\r\n    <app-employer-pay-grid [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-employer-pay-grid'\"></app-employer-pay-grid>\r\n    <app-sms [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-sms'\" [question]=\"question\" [form]=\"form\"\r\n     (accepted)=\"onAcceptedOtp($event)\"></app-sms>\r\n    <app-farm-usage [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-farm-usage'\"></app-farm-usage>\r\n    <app-wage-grid [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-wage-grid'\"></app-wage-grid>\r\n    <app-gross-earnings [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-gross-earnings'\"></app-gross-earnings>\r\n    <app-scrollable-text [componentData]=\"question.componentData\" [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-scrollable-text'\"></app-scrollable-text>\r\n    <app-employer-info [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-employer-info'\"></app-employer-info>\r\n    <app-idme [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-idme'\"></app-idme>\r\n    <app-wage-calculator [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-wage-calculator'\"></app-wage-calculator>\r\n  </div>\r\n\r\n  <div *ngIf=\"question.indent!=1 && question.type!='html' && question.type!='label' && question.type!='hidden'\" class=\"form-label\" [ngStyle]=\"setStyle(question.indent)\">\r\n    <span [innerHtml]=\"question.title | dynamicTranslate:dynamicParam | trustHtml\"></span>\r\n  </div>\r\n\r\n  <div *ngIf=\"question.type==='html'\" style=\"display: flex;\">\r\n    <div  [innerHTML]=\"question.html | dynamicTranslate:dynamicParam | trustHtml\"\r\n      style=\"color:var(--ion-color-medium-gray); padding-top: 20px;\" class=\"heading\">\r\n    </div>\r\n    <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:13px\">\r\n      <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n    </div>\r\n  </div>\r\n  \r\n  <div [ngSwitch]=\"question.type\">\r\n    <ng-container *ngSwitchCase=\"'text'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div *ngIf=\"question.inputType && question.inputType==='date'\">\r\n          <div [ngStyle]=\"setStyle(question.indent)\">\r\n            <p-calendar [formControlName]=\"question.name\" [inputId]=\"question.name\" [monthNavigator]=\"true\"\r\n              [yearNavigator]=\"true\" yearRange=\"1901:2099\" [showIcon]=\"true\" [minDate]=\"showMinDate ? minDate : null\"\r\n              [maxDate]=\"showMaxDate ? maxDate : null\" dateFormat=\"mm/dd/yy\" appendTo=\"body\" dataType=\"string\"\r\n              (onBlur)=\"validate(question)\" (onSelect)=\"validate(question)\" placeholder=\"mm/dd/yyyy\" [showOnFocus]=\"false\" \r\n              (onInput)=\"dateInput($event)\" [iconAriaLabel]=\"question.title\">\r\n            </p-calendar>\r\n          </div>\r\n        </div>\r\n\r\n        <div\r\n          *ngIf=\"question.inputType && question.inputType==='text' && question.customTag && question.customTag==='ssn'\"\r\n          [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputMask mask=\"999-99-9999\" [inputId]=\"question.name\" [formControlName]=\"question.name\"\r\n            placeholder=\"999-99-9999\" (onComplete)=\"validate(question)\" (onFocus)=\"unmask($event)\" (onBlur)=\"mask($event)\" [type]=\"type\" [attr.aria-label]=\"question.title\">\r\n          </p-inputMask>\r\n        </div>\r\n\r\n        <div\r\n        *ngIf=\"question.inputType && question.inputType==='text' && question.customTag && question.customTag==='custommask'\"\r\n        [ngStyle]=\"setStyle(question.indent)\">\r\n        <p-inputMask mask=\"9999\" [inputId]=\"question.name\" [formControlName]=\"question.name\"\r\n          placeholder=\"9999\" (onComplete)=\"validate(question)\" (onFocus)=\"unmask($event)\" (onBlur)=\"mask($event)\" [type]=\"type\" [attr.aria-label]=\"question.title\">\r\n        </p-inputMask>\r\n      </div>\r\n\r\n        <div\r\n          *ngIf=\"question.inputType && question.inputType==='text' && question.customTag && question.customTag==='ean'\"\r\n          [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputMask mask=\"99-99999-9-99\" [inputId]=\"question.name\" [formControlName]=\"question.name\"\r\n            placeholder=\"99-99999-9-99\" [value]=\"81-00586-0-01\" (onComplete)=\"validate(question)\">\r\n          </p-inputMask>\r\n        </div>\r\n\r\n        <div\r\n          *ngIf=\"question.inputType && question.inputType==='text' && question.customTag && question.customTag==='dueamt'\"\r\n          [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputNumber [inputId]=\"question.name\" [formControlName]=\"question.name\" mode=\"decimal\" locale=\"en-US\"\r\n            [minFractionDigits]=\"2\" [ariaLabel]=\"question.title\"></p-inputNumber>\r\n        </div>\r\n\r\n\r\n\r\n        <div\r\n          *ngIf=\"question.inputType && question.inputType==='text' && (!question.customTag  ||  question.customTag==='Optional') && !question.isRequired\"\r\n           [ngStyle]=\"setStyle(question.indent)\">\r\n          <input type=\"text\" *ngIf=\"question.size && question.maxLength\"\r\n            [maxLength]=\"question.maxLength\" [placeholder]=\"(question.placeholder || question.placeholder === '') ? question.placeholder:'Optional'\" [id]=\"question.name\" pInputText\r\n            [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\"/>\r\n          <input type=\"text\" *ngIf=\"question.size && !question.maxLength\"  [placeholder]=\" (question.placeholder || question.placeholder === '') ? question.placeholder:'Optional'\"\r\n            [id]=\"question.name\" pInputText [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\"/>\r\n          <input type=\"text\" *ngIf=\"!question.size && question.maxLength\" [maxLength]=\"question.maxLength\"\r\n          [placeholder]=\"(question.placeholder || question.placeholder === '') ? question.placeholder:'Optional'\" [id]=\"question.name\" pInputText [formControlName]=\"question.name\" />\r\n          <input type=\"text\" *ngIf=\"!question.size && !question.maxLength\" [id]=\"question.name\" pInputText\r\n            [formControlName]=\"question.name\" [placeholder]=\"(question.placeholder || question.placeholder === '') ? question.placeholder:'Optional'\" [attr.aria-label]=\"question.title\"/>\r\n        </div>\r\n        \r\n\r\n        <!--User Name-->\r\n        <div *ngIf=\"question.inputType && question.inputType==='text' && !question.customTag && question.isRequired\"\r\n          [ngStyle]=\"setStyle(question.indent)\">\r\n          <input type=\"text\" *ngIf=\"question.size && question.maxLength\" \r\n            [maxLength]=\"question.maxLength\" [id]=\"question.name\" pInputText [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" \r\n            [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n          <input type=\"text\" *ngIf=\"question.size && !question.maxLength\"  [id]=\"question.name\"\r\n            pInputText [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n          <input type=\"text\" *ngIf=\"!question.size && question.maxLength\" [maxLength]=\"question.maxLength\"\r\n            [id]=\"question.name\" pInputText [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n          <input type=\"text\" *ngIf=\"!question.size && !question.maxLength\" [id]=\"question.name\" pInputText\r\n            [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n        </div>\r\n\r\n        <div *ngIf=\"!question.inputType && question.customTag &&  !question.customTag.includes('phone')\"\r\n          [ngStyle]=\"{'padding-left.px': question.indent*10}\" [ngStyle]=\"setStyle(question.indent)\">\r\n          <input type=\"text\" [id]=\"question.name\" pInputText [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n        </div>\r\n\r\n\r\n        <div *ngIf=\"question.customTag && question.customTag.includes('phone')\">\r\n          <p-inputMask mask=\"999-999-9999\" [inputId]=\"question.name\" [formControlName]=\"question.name\" \r\n            [placeholder]=\"question.isRequired ? '999-999-9999' : 'Optional'\"\r\n            *ngIf=\"question.inputType && question.inputType==='text'\" (onBlur)=\"checkForValueChange($event)\" [attr.aria-label]=\"question.title\">\r\n          </p-inputMask>\r\n        </div>\r\n\r\n        <div *ngIf=\"question.customTag && question.customTag.includes('password')\">\r\n          <p-password [inputId]=\"question.name\" [formControlName]=\"question.name\" [toggleMask]=\"true\" [maxLength]=\"question.maxLength\" weakLabel=\"Weak password\" \r\n          mediumLabel=\"Weak password\" strongLabel=\"Strong password\" strongRegex=\"^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[_@*$!#.]+.*[_@*$!#.])(?=.{14,})\" [ariaLabel]=\"question.title\">\r\n            \r\n          <ng-template pTemplate=\"footer\">\r\n              <p-divider></p-divider>\r\n              <p class=\"mt-1\" style=\"font-size: small;\">Password must include at least</p>\r\n              <ul style=\"line-height: 1.25\">\r\n                  <li style=\"margin-left: -25px; font-size: small;\">1 lowercase letter</li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\">1 uppercase letter</li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\">1 number</li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\" *ngIf=\"!isSameSymbolPolicyForClaimantAndAgency\">1 of the following characters <b>_ &#64; * $ ! # .</b></li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\" *ngIf=\"isSameSymbolPolicyForClaimantAndAgency\">2 of the following characters <b>_ &#64; * $ ! # .</b></li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\" *ngIf=\"!isNewPasswordPolicyEnabledForClaimant\">8 characters</li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\" *ngIf=\"isNewPasswordPolicyEnabledForClaimant\">14 characters</li>\r\n              </ul>\r\n              <p-divider></p-divider>\r\n              <p class=\"mt-1\" style=\"font-size: small;\">Suggestion</p>\r\n              <ul style=\"line-height: 1.25\">\r\n                <li style=\"margin-left: -25px; font-size: small;\">Don't use your name, email or phone</li>\r\n                <li style=\"margin-left: -25px; font-size: small;\">Don't use your kid, partner or pet name.</li>\r\n              </ul>\r\n          </ng-template>\r\n          </p-password>\r\n        </div>\r\n\r\n        <div *ngIf=\"question.customTag && question.customTag.includes('fileupload')\">\r\n          <app-file-uploader [allowedFileType]=\"question.allowedFileType\" [formControlName]=\"question.name\"\r\n            [maxSizeInMB]=\"question.sizeInMB\" [multiple]=\"question.multiple\" [noOfFilesToUpload]=\"question.noOFFiles\" [attr.aria-label]=\"question.title\">\r\n          </app-file-uploader>\r\n        </div>\r\n\r\n        <!--Email Address-->\r\n        <div\r\n          *ngIf=\"question.inputType  && question.inputType==='text'\r\n                  && question.customTag  && (question.customTag!='ssn' && question.customTag!='Optional' && question.customTag!='fileupload'  \r\n                  && question.customTag!='phone'  && question.customTag!='ean'  && question.customTag!='dueamt' && question.customTag!='password'\r\n                  && question.customTag!='custommask')\">\r\n          <div [ngStyle]=\"setStyle(question.indent)\">\r\n            <input type=\"text\" [id]=\"question.name\" [attr.aria-label]=\"question.title\" pInputText [formControlName]=\"question.name\" \r\n            (blur)=\"checkForValueChange($event)\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n          </div>\r\n        </div>\r\n\r\n        <div *ngIf=\"!question.inputType && !question.customTag\" [ngStyle]=\"setStyle(question.indent)\">\r\n          <input type=\"text\" [id]=\"question.name\" *ngIf=\"question.size\"  pInputText\r\n            [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n          <input type=\"text\" [id]=\"question.name\" *ngIf=\"!question.size\" pInputText [formControlName]=\"question.name\" \r\n          [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n        </div>\r\n        <!-- </ion-col>\r\n      <ion-col size=\"1\" *ngIf=\"question.description\" style=\"padding-top: 12px\">\r\n        <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n      </ion-col>\r\n      </ion-row> -->\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'comment'\">\r\n      <div [ngStyle]=\"setStyle(question.indent)\" *ngIf=\"question.maxLength\" style=\"display: flex; align-items: center;\">\r\n        <textarea [id]=\"question.name\" autoResize=\"true\" [formControlName]=\"question.name\"\r\n          [maxLength]=\"question.maxLength\" [rows]=\"3\" [cols]=\"35\" [attr.aria-label]=\"question.title\"\r\n          [placeholder]=\"question.placeholder ? question.placeholder : ''\"></textarea>\r\n          <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 3px; padding-top:3px\">\r\n            <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n          </div>\r\n      </div>\r\n\r\n      <div [ngStyle]=\"setStyle(question.indent)\" *ngIf=\"!question.maxLength\" style=\"display: flex; align-items: center;\">\r\n        <textarea [id]=\"question.name\" autoResize=\"true\" [formControlName]=\"question.name\" [rows]=\"3\"\r\n          [cols]=\"35\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"></textarea>\r\n          <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 3px; padding-top:3px\">\r\n            <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n          </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n\r\n    <ng-container *ngSwitchCase=\"'dropdown'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-autoComplete *ngIf=\"false\" [formControlName]=\"question.name\" [suggestions]=\"filterResult\" appendTo=\"body\"\r\n            (completeMethod)=\"filterValue($event,question)\" field=\"text\" [dropdown]=\"true\" minLength=\"1\"\r\n            [forceSelection]=\"true\" (onSelect)=\"onSelect($event,question.name)\" [completeOnFocus]=\"true\">\r\n            <ng-template let-value pTemplate=\"item\">\r\n              <div>\r\n                <div>{{value.text}}</div>\r\n              </div>\r\n            </ng-template>\r\n          </p-autoComplete>\r\n          <app-dropdown [options]=\"filterResult\" [formControlName]=\"question.name\" optionLabel=\"text\" appendTo=\"body\"\r\n          (onChange)=\"onSelect($event,question.name)\" [autoDisplayFirst]=\"false\" (onClick)=\"filterValue($event,question)\" [inputId]=\"question.name\"\r\n          [ariaLabel]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"></app-dropdown>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'radiogroup' \">\r\n\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-selectButton unselectable=\"true\" [options]=\"question.choices\" [formControlName]=\"question.name\" optionLabel=\"text\"\r\n            optionValue=\"value\" (onOptionClick)=\"onRadioOptionClick($event,question)\"></p-selectButton>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n\r\n\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'number'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputNumber formControlName=\"{{question.name}}\" mode=\"decimal\" [inputId]=\"question.name\" [useGrouping]=\"false\"\r\n          [min]=\"minValue\" [max]=\"maxValue\"\r\n          [size]=\"question.size ? question.size : null\" [maxlength]=\"question.maxLength ? question.maxLength : null\" [ariaLabel]=\"question.title\"\r\n          [placeholder]=\"question.placeholder ? question.placeholder : ''\" [required]=\"question.isRequired\"></p-inputNumber>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'decimal'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputNumber formControlName=\"{{question.name}}\" mode=\"decimal\" [inputId]=\"question.name\" [useGrouping]=\"false\" \r\n          [minFractionDigits]=\"2\" [maxFractionDigits]=\"2\" [min]=\"minValue\" \r\n          [max]=\"maxValue\" [size]=\"question.size ? question.size : null\"  [maxlength]=\"question.maxLength ? question.maxLength : null\" [ariaLabel]=\"question.title\"\r\n          [placeholder]=\"question.placeholder ? question.placeholder : ''\" [required]=\"question.isRequired\"></p-inputNumber>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'currency'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputNumber formControlName=\"{{question.name}}\" mode=\"currency\" [inputId]=\"question.name\" [useGrouping]=\"false\" \r\n          [minFractionDigits]=\"2\" [maxFractionDigits]=\"2\" currency=\"USD\" [min]=\"minValue\" \r\n          [max]=\"maxValue\" [size]=\"question.size ? question.size : null\"  [maxlength]=\"question.maxLength ? question.maxLength : null\" \r\n          [ariaLabel]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\" [required]=\"question.isRequired\"></p-inputNumber>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'checkbox'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\" class=\"formgroup-inline\">\r\n            <p-checkbox [name]=\"question.name + '-group'\" [value]=\"choice.value\" \r\n              [label]=\"choice.text\" *ngFor=\"let choice of question.choices\" [formControl]=\"form.controls[question.name]\"\r\n              styleClass=\"app-p-checkbox\" [inputId]=\"question.name + '-' + choice.value\" [attr.aria-label]=\"question.title\"></p-checkbox>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'multicheckbox'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n            <p-checkbox [name]=\"question.name + '-group'\" [value]=\"choice.value\" \r\n              [label]=\"choice.text\" *ngFor=\"let choice of question.choices\" [formControl]=\"form.controls[question.name]\"\r\n              styleClass=\"app-p-checkbox\" [inputId]=\"question.name + '-' + choice.value\" [attr.aria-label]=\"question.title\"></p-checkbox>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'singleselectcheckbox'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-selectButton unselectable=\"true\" [options]=\"question.choices\" [formControlName]=\"question.name\" [multiple]=false\r\n            optionLabel=\"text\" optionValue=\"value\" [attr.aria-label]=\"question.title\"></p-selectButton>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'simplecheckbox'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div class=\"field-checkbox\">\r\n          <p-checkbox binary=\"true\" inputId=\"binary\" [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\"></p-checkbox>\r\n          <label for=\"binary\">{{question.title}}</label>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top: 3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'displaytextaslabel'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <label>{{getText(form.controls[question.name].value)}}</label>\r\n        <input type=\"hidden\" [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\"/>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 2px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'label'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <label>{{question.title}}</label>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 2px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngSwitchCase=\"'label-with-overlay'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <app-overlay-info [displayText]=\"question.title\"  [overlayText]=\"question.description | dynamicTranslate:dynamicParam\" [displayAsLabel]=\"true\"></app-overlay-info>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngSwitchCase=\"'label-with-link'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <app-overlay-info [displayText]=\"question.title\" [formControlName]=\"question.name\" [overlayText]=\"question.description | dynamicTranslate:dynamicParam\" [labelWithLink]=\"true\"></app-overlay-info>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngSwitchCase=\"'label-with-popup'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <app-overlay-info [displayText]=\"question.title\" [formControlName]=\"question.name\" [labelWithPopup]=\"question.description | dynamicTranslate:dynamicParam\" [labelWithLink]=\"true\"></app-overlay-info>\r\n      </div>\r\n    </ng-container>\r\n    \r\n    <ng-container class=\"responsive\" *ngSwitchCase=\"'panel'\">\r\n      <ion-row>\r\n        <ion-col>\r\n          <ion-row>\r\n            <ng-container *ngFor=\"let element of question.elements\">\r\n              <ion-col *ngIf=\"element.colElement==='COL1' && visibleIf(element.visibleIf,element.name)\"\r\n                [sizeXl]=\"element.sizeXL\" [sizeLg]=\"element.sizeLG\" [sizeMd]=\"element.sizeMD\"\r\n                [offsetMd]=\"element.offSetMD\" class=\"col-fit-content\">\r\n                <app-question [question]=\"element\" [form]=\"form\" [forScreenQuestionnaire]=\"forScreenQuestionnaire\">\r\n                </app-question>\r\n              </ion-col>\r\n            </ng-container>\r\n          </ion-row>\r\n        </ion-col>\r\n        <ion-col>\r\n          <ion-row>\r\n            <ng-container *ngFor=\"let element of question.elements\">\r\n              <ion-col *ngIf=\"element.colElement==='COL2' && visibleIf(element.visibleIf,element.name)\"\r\n                [sizeXl]=\"element.sizeXL\" [sizeLg]=\"element.sizeLG\" [sizeMd]=\"element.sizeMD\"\r\n                [offsetMd]=\"element.offSetMD\">\r\n                <app-question [question]=\"element\" [form]=\"form\" [forScreenQuestionnaire]=\"forScreenQuestionnaire\">\r\n                </app-question>\r\n              </ion-col>\r\n            </ng-container>\r\n          </ion-row>\r\n        </ion-col>\r\n      </ion-row>\r\n    </ng-container>\r\n  </div>\r\n  <div [ngStyle]=\"setStyle(question.indent)\" *ngIf=\"question.type!='panel'\">\r\n    <small class=\"p-error\" *ngIf=\"isValid!=''\" [@rowExpansionTrigger]=\"'active'\">{{isValid | dynamicTranslate:dynamicParam}}</small>\r\n  </div>\r\n</div>", styles: [".form-label{display:inline-block;margin-bottom:6px;margin-top:16px}.p-checkbox-label{line-height:1.5;text-align:justify;margin-left:1rem}.p-checkbox{padding:6px 0;width:-webkit-fill-available}.p-dropdown{display:inline-flex;min-width:185px}.p-calendar .p-inputtext{max-width:134px}:host ::ng-deep .p-dropdown{display:inline-flex;min-width:110px}:host ::ng-deep .p-calendar .p-inputtext{max-width:134px!important}.col-fit-content{max-width:-moz-fit-content;max-width:fit-content}\n"] }]
+        args: [{ selector: 'app-question', changeDetection: ChangeDetectionStrategy.Default, animations: [rowExpansionTrigger], template: "<div [formGroup]=\"form\" [id]=\"'question-div-' + question.name\">\r\n  <p-dialog *ngIf=\"displayPosition\" [(visible)]=\"displayPosition\" [position]=\"position\"\r\n    [modal]=\"true\" [breakpoints]=\"{'1200px': '660px', '992px': '660px', '768px': '660px', '576px': '100vw'}\" [style]=\"{width: '45vw'}\"\r\n    [baseZIndex]=\"5000\" [draggable]=\"false\" [resizable]=\"false\" appendTo=\"body\" closeOnEscape=\"false\" [attr.aria-label]=\"question.title\">\r\n\r\n    <h4 class=\"heading ion-padding-left\">\r\n      {{popUpHeader}}\r\n    </h4>\r\n    <div [innerHTML]=\"sanitizer.bypassSecurityTrustHtml(popUpText)\"></div>\r\n    <ng-template pTemplate=\"footer\">\r\n      <ion-button shape=\"round\" *ngIf=\"popUpNoActionLabel\" size=\"small\" type=\"submit\" fill=\"outline\" (click)=\"reject()\">\r\n        {{popUpNoActionLabel}}\r\n      </ion-button>\r\n\r\n      <ion-button shape=\"round\" *ngIf=\"popUpYesActionLabel\" size=\"small\" type=\"submit\" fill=\"solid\" (click)=\"accept()\">\r\n        {{popUpYesActionLabel}}\r\n      </ion-button>\r\n\r\n    </ng-template>\r\n  </p-dialog>\r\n  <div [ngStyle]=\"setStyle(question.indent)\" *ngIf=\"!forScreenQuestionnaire\" class=\"form-label\">\r\n    <label [attr.for]=\"question.name\" *ngIf=\"question.indent===1 && question.type!='html' && question.type!='hidden' && question.type!='label'\">\r\n      <span [innerHtml]=\"question.title | dynamicTranslate:dynamicParam | trustHtml\"></span>\r\n    </label>\r\n  </div>\r\n\r\n  <div [ngStyle]=\"setStyle(question.indent)\" class=\"form-label\"\r\n    *ngIf=\"forScreenQuestionnaire && question.indent===1 && question.type!='html' && question.type!='hidden' && question.description && question.type!='simplecheckbox' && question.type!='label' && question.type!='label-with-overlay'\">\r\n    <span [innerHtml]=\"question.title | dynamicTranslate:dynamicParam | trustHtml\"></span>\r\n  </div>\r\n\r\n  <div [ngStyle]=\"setStyle(question.indent)\" class=\"form-label\"\r\n    *ngIf=\"forScreenQuestionnaire && question.customTag && (question.customTag!='component' || (question.customTag=='component' && showLabelForCustomComponent())) && question.indent===1 && question.type!='html' && question.type!='hidden' && !question.description && question.type!='label' && question.type!='simplecheckbox'\">\r\n    <span [innerHtml]=\"question.title | dynamicTranslate:dynamicParam | trustHtml\"></span>\r\n  </div>\r\n\r\n  <div [ngStyle]=\"setStyle(question.indent)\" class=\"form-label\"\r\n    *ngIf=\"forScreenQuestionnaire && !question.customTag  && question.indent===1 && question.type!='html' && question.type!='hidden' && !question.description && question.type!='simplecheckbox' && question.type!='label' && question.type!='label-with-overlay'\">\r\n    <span [innerHtml]=\"question.title | dynamicTranslate:dynamicParam | trustHtml\"></span>\r\n  </div>\r\n\r\n  <div *ngIf=\"question.customTag && question.customTag==='component' && question.type!='html' && !question.description\">\r\n    <app-employer-grid [formControlName]=\"question.name\" [form]=\"form\" [dynamicParam]=\"dynamicParam\"\r\n      *ngIf=\"question.componentName==='app-employer-grid'\" (modelDisplay)=\"onModelDisplay($event)\"></app-employer-grid>\r\n\r\n    <app-offline-employer-grid [formControlName]=\"question.name\" [form]=\"form\" [dynamicParam]=\"dynamicParam\"\r\n     *ngIf=\"question.componentName==='app-offline-employer-grid'\" (modelDisplay)=\"onModelDisplay($event)\"></app-offline-employer-grid>\r\n\r\n    <app-legal-disclaimar *ngIf=\"question.componentName==='app-legal-disclaimar'\"\r\n      [componentData]=\"question.componentData\" (accepted)=\"onAccepted($event)\" [question]=\"question\" [form]=\"form\">\r\n    </app-legal-disclaimar>\r\n\r\n    <app-offline-legal-disclaimar *ngIf=\"question.componentName==='app-offline-legal-disclaimar'\"\r\n    [componentData]=\"question.componentData\" (accepted)=\"onAccepted($event)\" [question]=\"question\" [form]=\"form\">\r\n    </app-offline-legal-disclaimar>\r\n\r\n    <money-expect *ngIf=\"question.componentName==='money-expect'\" [componentData]=\"question.componentData\" ></money-expect>\r\n    <app-captcha [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-captcha'\"></app-captcha>\r\n\r\n    <app-file-uploader [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-file-uploader'\">\r\n    </app-file-uploader>\r\n    <app-address [formControlName]=\"question.name\" [fromPopup]=\"false\" [countyRequired]=\"question.countyRequired\" [questionaireForm]=\"questionaireForm\"\r\n      *ngIf=\"question.componentName==='app-address'\" #address [inputId]=\"question.name\" [componentData]=\"question.componentData\"\r\n      [diffMailAddress]=\"(form?.controls['diffMailingAddress']?.value === 'Y') || (form?.controls['diffmailaddress']?.value === 'Y')? true : false\"\r\n      [enableAddressValidation]=\"isAddressValidationEnabled\" > </app-address>\r\n   <!-- <app-address-suggestion *ngIf=\"showAddressSuggestion\"></app-address-suggestion> -->\r\n    <app-job-title [formControlName]=\"question.name\" [isRequired]=\"question.isRequired\"\r\n      *ngIf=\"question.componentName==='app-job-title'\" > </app-job-title>  \r\n    \r\n    <app-bank-details [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-bank-details'\" #bankdtls>\r\n    </app-bank-details>\r\n\r\n    <app-offline-bank-details [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-offline-bank-details'\" #bankdtls>\r\n    </app-offline-bank-details>\r\n\r\n    <app-requalify-lift-previous-issues *ngIf=\"question.componentName==='app-requalify-lift-previous-issues'\"\r\n    [formControlName]=\"question.name\" [componentData]=\"question.componentData\" [form]=\"form\" [question]=\"question\">\r\n    </app-requalify-lift-previous-issues> \r\n    <app-dependent-grid [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-dependent-grid'\"></app-dependent-grid>\r\n    <app-weekly-cert-employer-grid #wcEmployerGrid [form]=\"form\" [dynamicParam]=\"dynamicParam\" [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-weekly-cert-employer-grid'\"></app-weekly-cert-employer-grid>\r\n    <app-search-employer [formControlName]=\"question.name\" empType=\"REG\" (onFound)=\"setEmployer($event)\" \r\n    (onEmpty)=\"resetEmployer()\" *ngIf=\"question.componentName==='app-search-employer'\"></app-search-employer>\r\n    <app-add-participant [formControlName]=\"question.name\" [dynamicParam]=\"dynamicParam\" *ngIf=\"question.componentName==='app-add-participant'\"> </app-add-participant>\r\n    <app-add-payment [potentialIssueId]=\"potentialIssueId\" [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-add-payment'\"></app-add-payment>\r\n    <app-link [isRequired]=\"question.isRequired\" [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-link'\" [text]=\"linkComponentData?.text\" [uri]=\"linkComponentData?.uri\" [externalUrl]=\"linkComponentData?.externalUrl\"></app-link>\r\n    <app-sign-ssn [isRequired]=\"question.isRequired\" [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-sign-ssn'\" [inputId]=\"question.name\"></app-sign-ssn>\r\n    <app-employer-pay-grid [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-employer-pay-grid'\"></app-employer-pay-grid>\r\n    <app-sms [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-sms'\" [question]=\"question\" [form]=\"form\"\r\n     (accepted)=\"onAcceptedOtp($event)\"></app-sms>\r\n    <app-farm-usage [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-farm-usage'\"></app-farm-usage>\r\n    <app-wage-grid [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-wage-grid'\"></app-wage-grid>\r\n    <app-gross-earnings [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-gross-earnings'\"></app-gross-earnings>\r\n    <app-scrollable-text [componentData]=\"question.componentData\" [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-scrollable-text'\"></app-scrollable-text>\r\n    <app-employer-info [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-employer-info'\"></app-employer-info>\r\n    <app-idme [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-idme'\"></app-idme>\r\n    <app-wage-calculator [formControlName]=\"question.name\" *ngIf=\"question.componentName==='app-wage-calculator'\"></app-wage-calculator>\r\n  </div>\r\n\r\n  <div *ngIf=\"question.indent!=1 && question.type!='html' && question.type!='label' && question.type!='hidden'\" class=\"form-label\" [ngStyle]=\"setStyle(question.indent)\">\r\n    <span [innerHtml]=\"question.title | dynamicTranslate:dynamicParam | trustHtml\"></span>\r\n  </div>\r\n\r\n  <div *ngIf=\"question.type==='html'\" style=\"display: flex;\">\r\n    <div  [innerHTML]=\"question.html | dynamicTranslate:dynamicParam | trustHtml\"\r\n      style=\"color:var(--ion-color-medium-gray); padding-top: 20px;\" class=\"heading\">\r\n    </div>\r\n    <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:13px\">\r\n      <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n    </div>\r\n  </div>\r\n  \r\n  <div [ngSwitch]=\"question.type\">\r\n    <ng-container *ngSwitchCase=\"'text'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div *ngIf=\"question.inputType && question.inputType==='date'\">\r\n          <div [ngStyle]=\"setStyle(question.indent)\">\r\n            <p-calendar [formControlName]=\"question.name\" [inputId]=\"question.name\" [monthNavigator]=\"true\"\r\n              [yearNavigator]=\"true\" yearRange=\"1901:2099\" [showIcon]=\"true\" [minDate]=\"showMinDate ? minDate : null\"\r\n              [maxDate]=\"showMaxDate ? maxDate : null\" dateFormat=\"mm/dd/yy\" appendTo=\"body\" dataType=\"string\"\r\n              (onBlur)=\"validate(question)\" (onSelect)=\"validate(question)\" placeholder=\"mm/dd/yyyy\" [showOnFocus]=\"false\" \r\n              (onInput)=\"dateInput($event)\" [iconAriaLabel]=\"question.title\">\r\n            </p-calendar>\r\n          </div>\r\n        </div>\r\n\r\n        <div\r\n          *ngIf=\"question.inputType && question.inputType==='text' && question.customTag && question.customTag==='ssn'\"\r\n          [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputMask mask=\"999-99-9999\" [inputId]=\"question.name\" [formControlName]=\"question.name\"\r\n            placeholder=\"999-99-9999\" (onComplete)=\"validate(question)\" (onFocus)=\"unmask($event)\" (onBlur)=\"mask($event)\" [type]=\"type\" [attr.aria-label]=\"question.title\">\r\n          </p-inputMask>\r\n        </div>\r\n\r\n        <div\r\n        *ngIf=\"question.inputType && question.inputType==='text' && question.customTag && question.customTag==='custommask'\"\r\n        [ngStyle]=\"setStyle(question.indent)\">\r\n        <p-inputMask mask=\"9999\" [inputId]=\"question.name\" [formControlName]=\"question.name\"\r\n          placeholder=\"9999\" (onComplete)=\"validate(question)\" (onFocus)=\"unmask($event)\" (onBlur)=\"mask($event)\" [type]=\"type\" [attr.aria-label]=\"question.title\">\r\n        </p-inputMask>\r\n      </div>\r\n\r\n        <div\r\n          *ngIf=\"question.inputType && question.inputType==='text' && question.customTag && question.customTag==='ean'\"\r\n          [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputMask mask=\"99-99999-9-99\" [inputId]=\"question.name\" [formControlName]=\"question.name\"\r\n            placeholder=\"99-99999-9-99\" [value]=\"81-00586-0-01\" (onComplete)=\"validate(question)\">\r\n          </p-inputMask>\r\n        </div>\r\n\r\n        <div\r\n          *ngIf=\"question.inputType && question.inputType==='text' && question.customTag && question.customTag==='dueamt'\"\r\n          [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputNumber [inputId]=\"question.name\" [formControlName]=\"question.name\" mode=\"decimal\" locale=\"en-US\"\r\n            [minFractionDigits]=\"2\" [ariaLabel]=\"question.title\"></p-inputNumber>\r\n        </div>\r\n\r\n\r\n\r\n        <div\r\n          *ngIf=\"question.inputType && question.inputType==='text' && (!question.customTag  ||  question.customTag==='Optional') && !question.isRequired\"\r\n           [ngStyle]=\"setStyle(question.indent)\">\r\n          <input type=\"text\" *ngIf=\"question.size && question.maxLength\"\r\n            [maxLength]=\"question.maxLength\" [placeholder]=\"(question.placeholder || question.placeholder === '') ? question.placeholder:'Optional'\" [id]=\"question.name\" pInputText\r\n            [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\"/>\r\n          <input type=\"text\" *ngIf=\"question.size && !question.maxLength\"  [placeholder]=\" (question.placeholder || question.placeholder === '') ? question.placeholder:'Optional'\"\r\n            [id]=\"question.name\" pInputText [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\"/>\r\n          <input type=\"text\" *ngIf=\"!question.size && question.maxLength\" [maxLength]=\"question.maxLength\"\r\n          [placeholder]=\"(question.placeholder || question.placeholder === '') ? question.placeholder:'Optional'\" [id]=\"question.name\" pInputText [formControlName]=\"question.name\" />\r\n          <input type=\"text\" *ngIf=\"!question.size && !question.maxLength\" [id]=\"question.name\" pInputText\r\n            [formControlName]=\"question.name\" [placeholder]=\"(question.placeholder || question.placeholder === '') ? question.placeholder:'Optional'\" [attr.aria-label]=\"question.title\"/>\r\n        </div>\r\n        \r\n\r\n        <!--User Name-->\r\n        <div *ngIf=\"question.inputType && question.inputType==='text' && !question.customTag && question.isRequired\"\r\n          [ngStyle]=\"setStyle(question.indent)\">\r\n          <input type=\"text\" *ngIf=\"question.size && question.maxLength\" \r\n            [maxLength]=\"question.maxLength\" [id]=\"question.name\" pInputText [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" \r\n            [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n          <input type=\"text\" *ngIf=\"question.size && !question.maxLength\"  [id]=\"question.name\"\r\n            pInputText [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n          <input type=\"text\" *ngIf=\"!question.size && question.maxLength\" [maxLength]=\"question.maxLength\"\r\n            [id]=\"question.name\" pInputText [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n          <input type=\"text\" *ngIf=\"!question.size && !question.maxLength\" [id]=\"question.name\" pInputText\r\n            [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n        </div>\r\n\r\n        <div *ngIf=\"!question.inputType && question.customTag &&  !question.customTag.includes('phone')\"\r\n          [ngStyle]=\"{'padding-left.px': question.indent*10}\" [ngStyle]=\"setStyle(question.indent)\">\r\n          <input type=\"text\" [id]=\"question.name\" pInputText [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n        </div>\r\n\r\n\r\n        <div *ngIf=\"question.customTag && question.customTag.includes('phone')\">\r\n          <p-inputMask mask=\"999-999-9999\" [inputId]=\"question.name\" [formControlName]=\"question.name\" \r\n            [placeholder]=\"question.isRequired ? '999-999-9999' : 'Optional'\"\r\n            *ngIf=\"question.inputType && question.inputType==='text'\" (onBlur)=\"checkForValueChange($event)\" [attr.aria-label]=\"question.title\">\r\n          </p-inputMask>\r\n        </div>\r\n\r\n        <div *ngIf=\"question.customTag && question.customTag.includes('password')\">\r\n          <p-password [inputId]=\"question.name\" [formControlName]=\"question.name\" [toggleMask]=\"true\" [maxLength]=\"question.maxLength\" weakLabel=\"Weak password\" \r\n          mediumLabel=\"Weak password\" strongLabel=\"Strong password\" strongRegex=\"^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[_@*$!#.]+.*[_@*$!#.])(?=.{14,})\" [ariaLabel]=\"question.title\">\r\n            \r\n          <ng-template pTemplate=\"footer\">\r\n              <p-divider></p-divider>\r\n              <p class=\"mt-1\" style=\"font-size: small;\">Password must include at least</p>\r\n              <ul style=\"line-height: 1.25\">\r\n                  <li style=\"margin-left: -25px; font-size: small;\">1 lowercase letter</li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\">1 uppercase letter</li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\">1 number</li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\" *ngIf=\"!isSameSymbolPolicyForClaimantAndAgency\">1 of the following characters <b>_ &#64; * $ ! # .</b></li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\" *ngIf=\"isSameSymbolPolicyForClaimantAndAgency\">2 of the following characters <b>_ &#64; * $ ! # .</b></li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\" *ngIf=\"!isNewPasswordPolicyEnabledForClaimant\">8 characters</li>\r\n                  <li style=\"margin-left: -25px; font-size: small;\" *ngIf=\"isNewPasswordPolicyEnabledForClaimant\">14 characters</li>\r\n              </ul>\r\n              <p-divider></p-divider>\r\n              <p class=\"mt-1\" style=\"font-size: small;\">Suggestion</p>\r\n              <ul style=\"line-height: 1.25\">\r\n                <li style=\"margin-left: -25px; font-size: small;\">Don't use your name, email or phone</li>\r\n                <li style=\"margin-left: -25px; font-size: small;\">Don't use your kid, partner or pet name.</li>\r\n              </ul>\r\n          </ng-template>\r\n          </p-password>\r\n        </div>\r\n\r\n        <div *ngIf=\"question.customTag && question.customTag.includes('fileupload')\">\r\n          <app-file-uploader [allowedFileType]=\"question.allowedFileType\" [formControlName]=\"question.name\"\r\n            [maxSizeInMB]=\"question.sizeInMB\" [multiple]=\"question.multiple\" [noOfFilesToUpload]=\"question.noOFFiles\" [attr.aria-label]=\"question.title\">\r\n          </app-file-uploader>\r\n        </div>\r\n\r\n        <!--Email Address-->\r\n        <div\r\n          *ngIf=\"question.inputType  && question.inputType==='text'\r\n                  && question.customTag  && (question.customTag!='ssn' && question.customTag!='Optional' && question.customTag!='fileupload'  \r\n                  && question.customTag!='phone'  && question.customTag!='ean'  && question.customTag!='dueamt' && question.customTag!='password'\r\n                  && question.customTag!='custommask')\">\r\n          <div [ngStyle]=\"setStyle(question.indent)\">\r\n            <input type=\"text\" [id]=\"question.name\" [attr.aria-label]=\"question.title\" pInputText [formControlName]=\"question.name\" \r\n            (blur)=\"checkForValueChange($event)\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n          </div>\r\n        </div>\r\n\r\n        <div *ngIf=\"!question.inputType && !question.customTag\" [ngStyle]=\"setStyle(question.indent)\">\r\n          <input type=\"text\" [id]=\"question.name\" *ngIf=\"question.size\"  pInputText\r\n            [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n          <input type=\"text\" [id]=\"question.name\" *ngIf=\"!question.size\" pInputText [formControlName]=\"question.name\" \r\n          [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"/>\r\n        </div>\r\n        <!-- </ion-col>\r\n      <ion-col size=\"1\" *ngIf=\"question.description\" style=\"padding-top: 12px\">\r\n        <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n      </ion-col>\r\n      </ion-row> -->\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'comment'\">\r\n      <div [ngStyle]=\"setStyle(question.indent)\" *ngIf=\"question.maxLength\" style=\"display: flex; align-items: center;\">\r\n        <textarea [id]=\"question.name\" autoResize=\"true\" [formControlName]=\"question.name\"\r\n          [maxLength]=\"question.maxLength\" [rows]=\"3\" [cols]=\"35\" [attr.aria-label]=\"question.title\"\r\n          [placeholder]=\"question.placeholder ? question.placeholder : ''\"></textarea>\r\n          <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 3px; padding-top:3px\">\r\n            <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n          </div>\r\n      </div>\r\n\r\n      <div [ngStyle]=\"setStyle(question.indent)\" *ngIf=\"!question.maxLength\" style=\"display: flex; align-items: center;\">\r\n        <textarea [id]=\"question.name\" autoResize=\"true\" [formControlName]=\"question.name\" [rows]=\"3\"\r\n          [cols]=\"35\" [attr.aria-label]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"></textarea>\r\n          <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 3px; padding-top:3px\">\r\n            <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n          </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n\r\n    <ng-container *ngSwitchCase=\"'dropdown'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-autoComplete *ngIf=\"false\" [formControlName]=\"question.name\" [suggestions]=\"filterResult\" appendTo=\"body\"\r\n            (completeMethod)=\"filterValue($event,question)\" field=\"text\" [dropdown]=\"true\" minLength=\"1\"\r\n            [forceSelection]=\"true\" (onSelect)=\"onSelect($event,question.name)\" [completeOnFocus]=\"true\">\r\n            <ng-template let-value pTemplate=\"item\">\r\n              <div>\r\n                <div>{{value.text}}</div>\r\n              </div>\r\n            </ng-template>\r\n          </p-autoComplete>\r\n          <app-dropdown [options]=\"filterResult\" [formControlName]=\"question.name\" optionLabel=\"text\" appendTo=\"body\"\r\n          (onChange)=\"onSelect($event,question.name)\" [autoDisplayFirst]=\"false\" (onClick)=\"filterValue($event,question)\" [inputId]=\"question.name\"\r\n          [ariaLabel]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\"></app-dropdown>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'radiogroup' \">\r\n\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-selectButton unselectable=\"true\" [options]=\"question.choices\" [formControlName]=\"question.name\" optionLabel=\"text\"\r\n            optionValue=\"value\" (onOptionClick)=\"onRadioOptionClick($event,question)\"></p-selectButton>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n\r\n\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'number'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputNumber formControlName=\"{{question.name}}\" mode=\"decimal\" [inputId]=\"question.name\" [useGrouping]=\"false\"\r\n          [min]=\"minValue\" [max]=\"maxValue\"\r\n          [size]=\"question.size ? question.size : null\" [maxlength]=\"question.maxLength ? question.maxLength : null\" [ariaLabel]=\"question.title\"\r\n          [placeholder]=\"question.placeholder ? question.placeholder : ''\" [required]=\"question.isRequired\"></p-inputNumber>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'decimal'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputNumber formControlName=\"{{question.name}}\" mode=\"decimal\" [inputId]=\"question.name\" [useGrouping]=\"false\" \r\n          [minFractionDigits]=\"2\" [maxFractionDigits]=\"2\" [min]=\"minValue\" \r\n          [max]=\"maxValue\" [size]=\"question.size ? question.size : null\"  [maxlength]=\"question.maxLength ? question.maxLength : null\" [ariaLabel]=\"question.title\"\r\n          [placeholder]=\"question.placeholder ? question.placeholder : ''\" [required]=\"question.isRequired\"></p-inputNumber>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'currency'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-inputNumber formControlName=\"{{question.name}}\" mode=\"currency\" [inputId]=\"question.name\" [useGrouping]=\"false\" \r\n          [minFractionDigits]=\"2\" [maxFractionDigits]=\"2\" currency=\"USD\" [min]=\"minValue\" \r\n          [max]=\"maxValue\" [size]=\"question.size ? question.size : null\"  [maxlength]=\"question.maxLength ? question.maxLength : null\" \r\n          [ariaLabel]=\"question.title\" [placeholder]=\"question.placeholder ? question.placeholder : ''\" [required]=\"question.isRequired\"></p-inputNumber>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'checkbox'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\" class=\"formgroup-inline\">\r\n            <p-checkbox [name]=\"question.name + '-group'\" [value]=\"choice.value\" \r\n              [label]=\"choice.text\" *ngFor=\"let choice of question.choices\" [formControl]=\"form.controls[question.name]\"\r\n              styleClass=\"app-p-checkbox\" [inputId]=\"question.name + '-' + choice.value\" [attr.aria-label]=\"question.title\"></p-checkbox>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'multicheckbox'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n            <p-checkbox [name]=\"question.name + '-group'\" [value]=\"choice.value\" \r\n              [label]=\"choice.text\" *ngFor=\"let choice of question.choices\" [formControl]=\"form.controls[question.name]\"\r\n              styleClass=\"app-p-checkbox\" [inputId]=\"question.name + '-' + choice.value\" [attr.aria-label]=\"question.title\"></p-checkbox>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'singleselectcheckbox'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div [ngStyle]=\"setStyle(question.indent)\">\r\n          <p-selectButton unselectable=\"true\" [options]=\"question.choices\" [formControlName]=\"question.name\" [multiple]=false\r\n            optionLabel=\"text\" optionValue=\"value\" [attr.aria-label]=\"question.title\"></p-selectButton>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top:3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'simplecheckbox'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <div class=\"field-checkbox\">\r\n          <p-checkbox binary=\"true\" inputId=\"binary\" [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\"></p-checkbox>\r\n          <label for=\"binary\">{{question.title}}</label>\r\n        </div>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 8px; padding-top: 3px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'displaytextaslabel'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <label>{{getText(form.controls[question.name].value)}}</label>\r\n        <input type=\"hidden\" [formControlName]=\"question.name\" [attr.aria-label]=\"question.title\"/>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 2px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n\r\n    <ng-container *ngSwitchCase=\"'label'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <label>{{question.title}}</label>\r\n        <div style=\"flex-grow: 1;\" *ngIf=\"question.description\" style=\"padding-left: 2px\">\r\n          <app-overlay-info [overlayText]=\"question.description | dynamicTranslate:dynamicParam\"></app-overlay-info>\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngSwitchCase=\"'label-with-overlay'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <app-overlay-info [displayText]=\"question.title\"  [overlayText]=\"question.description | dynamicTranslate:dynamicParam\" [displayAsLabel]=\"true\"></app-overlay-info>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngSwitchCase=\"'label-with-link'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <app-overlay-info [displayText]=\"question.title\" [formControlName]=\"question.name\" [overlayText]=\"question.description | dynamicTranslate:dynamicParam\" [labelWithLink]=\"true\"></app-overlay-info>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngSwitchCase=\"'label-with-popup'\">\r\n      <div class=\"container\" style=\"display: flex;\">\r\n        <app-overlay-info [displayText]=\"question.title\" [formControlName]=\"question.name\" [labelWithPopup]=\"question.description | dynamicTranslate:dynamicParam\" [labelWithLink]=\"true\"></app-overlay-info>\r\n      </div>\r\n    </ng-container>\r\n    \r\n    <ng-container class=\"responsive\" *ngSwitchCase=\"'panel'\">\r\n      <ion-row>\r\n        <ion-col>\r\n          <ion-row>\r\n            <ng-container *ngFor=\"let element of question.elements\">\r\n              <ion-col *ngIf=\"element.colElement==='COL1' && visibleIf(element.visibleIf,element.name)\"\r\n                [sizeXl]=\"element.sizeXL\" [sizeLg]=\"element.sizeLG\" [sizeMd]=\"element.sizeMD\"\r\n                [offsetMd]=\"element.offSetMD\" class=\"col-fit-content\">\r\n                <app-question [question]=\"element\" [form]=\"form\" [forScreenQuestionnaire]=\"forScreenQuestionnaire\">\r\n                </app-question>\r\n              </ion-col>\r\n            </ng-container>\r\n          </ion-row>\r\n        </ion-col>\r\n        <ion-col>\r\n          <ion-row>\r\n            <ng-container *ngFor=\"let element of question.elements\">\r\n              <ion-col *ngIf=\"element.colElement==='COL2' && visibleIf(element.visibleIf,element.name)\"\r\n                [sizeXl]=\"element.sizeXL\" [sizeLg]=\"element.sizeLG\" [sizeMd]=\"element.sizeMD\"\r\n                [offsetMd]=\"element.offSetMD\">\r\n                <app-question [question]=\"element\" [form]=\"form\" [forScreenQuestionnaire]=\"forScreenQuestionnaire\">\r\n                </app-question>\r\n              </ion-col>\r\n            </ng-container>\r\n          </ion-row>\r\n        </ion-col>\r\n      </ion-row>\r\n    </ng-container>\r\n  </div>\r\n  <div [ngStyle]=\"setStyle(question.indent)\" *ngIf=\"question.type!='panel'\">\r\n    <small class=\"p-error\" *ngIf=\"isValid!=''\" [@rowExpansionTrigger]=\"'active'\">{{isValid | dynamicTranslate:dynamicParam}}</small>\r\n  </div>\r\n</div>", styles: [".form-label{display:inline-block;margin-bottom:6px;margin-top:16px}.p-checkbox-label{line-height:1.5;text-align:justify;margin-left:1rem}.p-checkbox{padding:6px 0;width:-webkit-fill-available}.p-dropdown{display:inline-flex;min-width:185px}.p-calendar .p-inputtext{max-width:134px}:host ::ng-deep .p-dropdown{display:inline-flex;min-width:110px}:host ::ng-deep .p-calendar .p-inputtext{max-width:134px!important}.col-fit-content{max-width:-moz-fit-content;max-width:fit-content}\n"] }]
     }], () => [{ type: QuestionControlService }, { type: QuestionService }, { type: i3$1.TranslateService }, { type: ValidationService }, { type: UtilService }, { type: i4.NavController }, { type: LoggerService }, { type: i6$1.DomSanitizer }, { type: LoginService }, { type: AddressValidationService }, { type: i4.ModalController }], { question: [{
             type: Input
         }], form: [{
@@ -13629,6 +13628,8 @@ class DynamicFormQuestionComponent {
             type: Input
         }], potentialIssueId: [{
             type: Input
+        }], questionaireForm: [{
+            type: Input
         }], onDynamicParamUpdate: [{
             type: Output
         }], bankdtls: [{
@@ -14473,14 +14474,16 @@ function DynamicFormComponent_div_2_ng_container_9_ng_container_1_ng_container_3
 } if (rf & 2) {
     const panelElement_r15 = i0.ɵɵnextContext().$implicit;
     const element_r8 = i0.ɵɵnextContext(2).$implicit;
-    const ctx_r16 = i0.ɵɵnextContext(2);
+    i0.ɵɵnextContext();
+    const _r3 = i0.ɵɵreference(3);
+    const ctx_r16 = i0.ɵɵnextContext();
     i0.ɵɵproperty("sizeXl", panelElement_r15.sizeXL ? panelElement_r15.sizeXL : 3)("sizeLg", panelElement_r15.sizeLG ? panelElement_r15.sizeLG : 3)("sizeSm", panelElement_r15.sizeSM ? panelElement_r15.sizeSM : 12)("sizeXs", panelElement_r15.sizeXS ? panelElement_r15.sizeXS : 12)("sizeMd", panelElement_r15.sizeMD ? panelElement_r15.sizeMD : 4)("ngClass", ctx_r16.shouldFitContent(element_r8.elements) ? "col-fit-content" : "");
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("potentialIssueId", ctx_r16.potentialIssueId)("question", panelElement_r15)("form", ctx_r16.formGroupArray[ctx_r16.activeIndex])("forScreenQuestionnaire", ctx_r16.forScreenQuestionnaire)("dynamicParam", ctx_r16.dynamicParam);
+    i0.ɵɵproperty("potentialIssueId", ctx_r16.potentialIssueId)("question", panelElement_r15)("form", ctx_r16.formGroupArray[ctx_r16.activeIndex])("questionaireForm", _r3)("forScreenQuestionnaire", ctx_r16.forScreenQuestionnaire)("dynamicParam", ctx_r16.dynamicParam);
 } }
 function DynamicFormComponent_div_2_ng_container_9_ng_container_1_ng_container_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_div_2_ng_container_9_ng_container_1_ng_container_3_ion_col_1_Template, 2, 11, "ion-col", 16);
+    i0.ɵɵtemplate(1, DynamicFormComponent_div_2_ng_container_9_ng_container_1_ng_container_3_ion_col_1_Template, 2, 12, "ion-col", 16);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const panelElement_r15 = ctx.$implicit;
@@ -14506,21 +14509,23 @@ function DynamicFormComponent_div_2_ng_container_9_ng_container_1_Template(rf, c
 function DynamicFormComponent_div_2_ng_container_9_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     const _r23 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "ion-row")(2, "ion-col", 19)(3, "app-question", 18);
+    i0.ɵɵelementStart(1, "ion-row")(2, "ion-col", 19)(3, "app-question", 20);
     i0.ɵɵlistener("onDynamicParamUpdate", function DynamicFormComponent_div_2_ng_container_9_ng_container_2_Template_app_question_onDynamicParamUpdate_3_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r22 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r22.updateDynamicParam($event)); });
     i0.ɵɵelementEnd()()();
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const element_r8 = i0.ɵɵnextContext().$implicit;
-    const ctx_r11 = i0.ɵɵnextContext(2);
+    i0.ɵɵnextContext();
+    const _r3 = i0.ɵɵreference(3);
+    const ctx_r11 = i0.ɵɵnextContext();
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("sizeLg", element_r8.sizeLG > 0 ? element_r8.sizeLG : "")("sizeSm", element_r8.sizeSM)("sizeXs", element_r8.sizeXS)("sizeXl", element_r8.sizeXL > 0 ? element_r8.sizeXL : "")("sizeMd", element_r8.sizeMD > 0 ? element_r8.sizeMD : "");
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("potentialIssueId", ctx_r11.potentialIssueId)("question", element_r8)("form", ctx_r11.formGroupArray[ctx_r11.activeIndex])("forScreenQuestionnaire", ctx_r11.forScreenQuestionnaire)("dynamicParam", ctx_r11.dynamicParam);
+    i0.ɵɵproperty("potentialIssueId", ctx_r11.potentialIssueId)("question", element_r8)("form", ctx_r11.formGroupArray[ctx_r11.activeIndex])("forScreenQuestionnaire", ctx_r11.forScreenQuestionnaire)("dynamicParam", ctx_r11.dynamicParam)("questionaireForm", _r3);
 } }
 function DynamicFormComponent_div_2_ng_container_9_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_div_2_ng_container_9_ng_container_1_Template, 4, 2, "ng-container", 2)(2, DynamicFormComponent_div_2_ng_container_9_ng_container_2_Template, 4, 10, "ng-container", 2);
+    i0.ɵɵtemplate(1, DynamicFormComponent_div_2_ng_container_9_ng_container_1_Template, 4, 2, "ng-container", 2)(2, DynamicFormComponent_div_2_ng_container_9_ng_container_2_Template, 4, 11, "ng-container", 2);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const element_r8 = ctx.$implicit;
@@ -14531,8 +14536,8 @@ function DynamicFormComponent_div_2_ng_container_9_Template(rf, ctx) { if (rf &
     i0.ɵɵproperty("ngIf", element_r8.type != "panel" && element_r8.type != "hidden" && ctx_r5.visibleIf(element_r8.visibleIf, element_r8.name, ctx_r5.formGroupArray[ctx_r5.activeIndex], element_r8));
 } }
 function DynamicFormComponent_div_2_ng_container_12_ng_container_1_ng_container_2_ion_col_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "ion-col", 21)(1, "div");
-    i0.ɵɵelement(2, "panel-app", 22);
+    i0.ɵɵelementStart(0, "ion-col", 22)(1, "div");
+    i0.ɵɵelement(2, "panel-app", 23);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const panelElement_r29 = i0.ɵɵnextContext().$implicit;
@@ -14543,7 +14548,7 @@ function DynamicFormComponent_div_2_ng_container_12_ng_container_1_ng_container_
 } }
 function DynamicFormComponent_div_2_ng_container_12_ng_container_1_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_div_2_ng_container_12_ng_container_1_ng_container_2_ion_col_1_Template, 3, 8, "ion-col", 20);
+    i0.ɵɵtemplate(1, DynamicFormComponent_div_2_ng_container_12_ng_container_1_ng_container_2_ion_col_1_Template, 3, 8, "ion-col", 21);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const panelElement_r29 = ctx.$implicit;
@@ -14574,33 +14579,33 @@ function DynamicFormComponent_div_2_ng_container_12_Template(rf, ctx) { if (rf &
 } }
 function DynamicFormComponent_div_2_ion_footer_13_div_1_Template(rf, ctx) { if (rf & 1) {
     const _r38 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 25)(1, "div", 26)(2, "div", 27)(3, "ion-button", 28);
+    i0.ɵɵelementStart(0, "div", 26)(1, "div", 27)(2, "div", 28)(3, "ion-button", 29);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_1_Template_ion_button_click_3_listener() { i0.ɵɵrestoreView(_r38); const ctx_r37 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r37.cancelAction()); });
     i0.ɵɵtext(4, " Cancel ");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div", 29)(6, "ion-button", 30);
+    i0.ɵɵelementStart(5, "div", 30)(6, "ion-button", 31);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_1_Template_ion_button_click_6_listener() { i0.ɵɵrestoreView(_r38); const ctx_r39 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r39.complete()); });
     i0.ɵɵtext(7, " Next ");
     i0.ɵɵelementEnd()()()();
 } }
 function DynamicFormComponent_div_2_ion_footer_13_div_2_Template(rf, ctx) { if (rf & 1) {
     const _r41 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 25)(1, "div", 26)(2, "div", 27)(3, "ion-button", 28);
+    i0.ɵɵelementStart(0, "div", 26)(1, "div", 27)(2, "div", 28)(3, "ion-button", 29);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_2_Template_ion_button_click_3_listener() { i0.ɵɵrestoreView(_r41); const ctx_r40 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r40.cancelAction()); });
     i0.ɵɵtext(4, " Cancel ");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div", 29)(6, "ion-button", 30);
+    i0.ɵɵelementStart(5, "div", 30)(6, "ion-button", 31);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_2_Template_ion_button_click_6_listener() { i0.ɵɵrestoreView(_r41); const ctx_r42 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r42.complete()); });
     i0.ɵɵtext(7, " Done ");
     i0.ɵɵelementEnd()()()();
 } }
 function DynamicFormComponent_div_2_ion_footer_13_ion_grid_3_Template(rf, ctx) { if (rf & 1) {
     const _r44 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "ion-grid")(1, "ion-row")(2, "ion-col", 31)(3, "ion-button", 28);
+    i0.ɵɵelementStart(0, "ion-grid")(1, "ion-row")(2, "ion-col", 32)(3, "ion-button", 29);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_ion_grid_3_Template_ion_button_click_3_listener() { i0.ɵɵrestoreView(_r44); const ctx_r43 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r43.cancelPopUp()); });
     i0.ɵɵtext(4, " Cancel ");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "ion-col", 32)(6, "ion-button", 30);
+    i0.ɵɵelementStart(5, "ion-col", 33)(6, "ion-button", 31);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_ion_grid_3_Template_ion_button_click_6_listener() { i0.ɵɵrestoreView(_r44); const ctx_r45 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r45.complete()); });
     i0.ɵɵtext(7, " Add ");
     i0.ɵɵelementEnd()()()();
@@ -14614,61 +14619,61 @@ function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_ng_template_2
 } }
 function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_3_Template(rf, ctx) { if (rf & 1) {
     const _r58 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div")(1, "button", 38);
+    i0.ɵɵelementStart(0, "div")(1, "button", 39);
     i0.ɵɵtext(2, "Back");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "button", 39);
+    i0.ɵɵelementStart(3, "button", 40);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_3_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r58); const ctx_r57 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r57.nextPage(ctx_r57.activeIndex)); });
     i0.ɵɵtext(4, "Next");
     i0.ɵɵelementEnd()();
 } }
 function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_4_Template(rf, ctx) { if (rf & 1) {
     const _r60 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div")(1, "button", 40);
+    i0.ɵɵelementStart(0, "div")(1, "button", 41);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_4_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r60); const ctx_r59 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r59.cancelAction()); });
     i0.ɵɵtext(2, "Back");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "button", 41);
+    i0.ɵɵelementStart(3, "button", 42);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_4_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r60); const ctx_r61 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r61.complete()); });
     i0.ɵɵtext(4, "Next");
     i0.ɵɵelementEnd()();
 } }
 function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_5_Template(rf, ctx) { if (rf & 1) {
     const _r63 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div")(1, "button", 40);
+    i0.ɵɵelementStart(0, "div")(1, "button", 41);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_5_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r63); const ctx_r62 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r62.prevPage(ctx_r62.activeIndex)); });
     i0.ɵɵtext(2, "Back");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "button", 41);
+    i0.ɵɵelementStart(3, "button", 42);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_5_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r63); const ctx_r64 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r64.complete()); });
     i0.ɵɵtext(4, "Done");
     i0.ɵɵelementEnd()();
 } }
 function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_6_Template(rf, ctx) { if (rf & 1) {
     const _r66 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div")(1, "button", 42);
+    i0.ɵɵelementStart(0, "div")(1, "button", 43);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_6_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r66); const ctx_r65 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r65.prevPage(ctx_r65.activeIndex)); });
     i0.ɵɵtext(2, "Back");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "button", 39);
+    i0.ɵɵelementStart(3, "button", 40);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_6_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r66); const ctx_r67 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r67.nextPage(ctx_r67.activeIndex)); });
     i0.ɵɵtext(4, "Next");
     i0.ɵɵelementEnd()();
 } }
 function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_7_Template(rf, ctx) { if (rf & 1) {
     const _r69 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div")(1, "button", 42);
+    i0.ɵɵelementStart(0, "div")(1, "button", 43);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_7_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r69); const ctx_r68 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r68.cancelAction()); });
     i0.ɵɵtext(2, "Back");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "button", 39);
+    i0.ɵɵelementStart(3, "button", 40);
     i0.ɵɵlistener("click", function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_7_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r69); const ctx_r70 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r70.nextPage(ctx_r70.activeIndex)); });
     i0.ɵɵtext(4, "Next");
     i0.ɵɵelementEnd()();
 } }
 function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "mat-step", 36)(1, "div");
-    i0.ɵɵtemplate(2, DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_ng_template_2_Template, 1, 1, "ng-template", 37);
+    i0.ɵɵelementStart(0, "mat-step", 37)(1, "div");
+    i0.ɵɵtemplate(2, DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_ng_template_2_Template, 1, 1, "ng-template", 38);
     i0.ɵɵelementEnd();
     i0.ɵɵtemplate(3, DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_3_Template, 5, 0, "div", 2)(4, DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_4_Template, 5, 0, "div", 2)(5, DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_5_Template, 5, 0, "div", 2)(6, DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_6_Template, 5, 0, "div", 2)(7, DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_div_7_Template, 5, 0, "div", 2);
     i0.ɵɵelementEnd();
@@ -14689,9 +14694,9 @@ function DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_Template(rf,
 } }
 function DynamicFormComponent_div_2_ion_footer_13_div_4_Template(rf, ctx) { if (rf & 1) {
     const _r72 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div")(1, "mat-horizontal-stepper", 33, 34);
+    i0.ɵɵelementStart(0, "div")(1, "mat-horizontal-stepper", 34, 35);
     i0.ɵɵlistener("selectionChange", function DynamicFormComponent_div_2_ion_footer_13_div_4_Template_mat_horizontal_stepper_selectionChange_1_listener($event) { i0.ɵɵrestoreView(_r72); const ctx_r71 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r71.stepChanged($event)); });
-    i0.ɵɵtemplate(3, DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_Template, 8, 7, "mat-step", 35);
+    i0.ɵɵtemplate(3, DynamicFormComponent_div_2_ion_footer_13_div_4_mat_step_3_Template, 8, 7, "mat-step", 36);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r36 = i0.ɵɵnextContext(3);
@@ -14701,8 +14706,8 @@ function DynamicFormComponent_div_2_ion_footer_13_div_4_Template(rf, ctx) { if (
     i0.ɵɵproperty("ngForOf", ctx_r36.questions[0].pages);
 } }
 function DynamicFormComponent_div_2_ion_footer_13_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "ion-footer", 23);
-    i0.ɵɵtemplate(1, DynamicFormComponent_div_2_ion_footer_13_div_1_Template, 8, 0, "div", 24)(2, DynamicFormComponent_div_2_ion_footer_13_div_2_Template, 8, 0, "div", 24)(3, DynamicFormComponent_div_2_ion_footer_13_ion_grid_3_Template, 8, 0, "ion-grid", 2)(4, DynamicFormComponent_div_2_ion_footer_13_div_4_Template, 4, 2, "div", 2);
+    i0.ɵɵelementStart(0, "ion-footer", 24);
+    i0.ɵɵtemplate(1, DynamicFormComponent_div_2_ion_footer_13_div_1_Template, 8, 0, "div", 25)(2, DynamicFormComponent_div_2_ion_footer_13_div_2_Template, 8, 0, "div", 25)(3, DynamicFormComponent_div_2_ion_footer_13_ion_grid_3_Template, 8, 0, "ion-grid", 2)(4, DynamicFormComponent_div_2_ion_footer_13_div_4_Template, 4, 2, "div", 2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r7 = i0.ɵɵnextContext(2);
@@ -14749,7 +14754,7 @@ function DynamicFormComponent_div_2_Template(rf, ctx) { if (rf & 1) {
 } }
 function DynamicFormComponent_app_mfa_3_Template(rf, ctx) { if (rf & 1) {
     const _r77 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "app-mfa", 43, 44);
+    i0.ɵɵelementStart(0, "app-mfa", 44, 45);
     i0.ɵɵlistener("success", function DynamicFormComponent_app_mfa_3_Template_app_mfa_success_0_listener($event) { i0.ɵɵrestoreView(_r77); const ctx_r76 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r76.saveScreenQuestionnaire($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -15613,7 +15618,7 @@ class DynamicFormComponent extends BasePage {
                         showError: true,
                         displayDefaultIndicatorType: false
                     }
-                }]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 4, vars: 3, consts: [[3, "blocked"], ["name", "crescent"], [4, "ngIf"], [3, "user", "data", "requestCode", "mfaError", "hideButtons", "success", 4, "ngIf"], ["formMainDiv", ""], ["focusInvalidInput", "", 3, "formGroup", "ngClass", "ngSubmit"], ["questionnaireForm", "ngForm"], ["size", "12", 1, "ion-padding-end", 2, "padding-left", "0px", 3, "sizeXs", "sizeSm", "sizeMd", "sizeLg", "sizeXl", "offsetXs", "offsetSm", "offsetMd", "offsetLg", "offsetXl"], [1, "p-formgrid", 2, "padding-left", "8px"], [4, "ngFor", "ngForOf"], ["size", "12", "sizeSm", "12", "sizeXs", "12", 1, "ion-padding-start", 2, "padding-left", "0px", 3, "sizeMd", "sizeLg", "sizeXl", "offsetXl", "offsetLg"], [3, "ngClass", 4, "ngIf"], ["size", "12", 3, "sizeXs", "sizeSm", "sizeMd", "sizeLg", "sizeXl", "offsetXs", "offsetSm", "offsetMd", "offsetLg", "offsetXl"], [1, "p-formgrid"], [3, "innerHtml", "ngClass"], [1, "heading", 2, "padding-left", "0px"], ["size", "12", "style", "padding-left: 0px; max-width: fit-content;", 3, "sizeXl", "sizeLg", "sizeSm", "sizeXs", "sizeMd", "ngClass", 4, "ngIf"], ["size", "12", 2, "padding-left", "0px", "max-width", "fit-content", 3, "sizeXl", "sizeLg", "sizeSm", "sizeXs", "sizeMd", "ngClass"], [3, "potentialIssueId", "question", "form", "forScreenQuestionnaire", "dynamicParam", "onDynamicParamUpdate"], [2, "padding-left", "0px", 3, "sizeLg", "sizeSm", "sizeXs", "sizeXl", "sizeMd"], ["style", "padding-left: 0px;", 3, "sizeSm", "sizeXs", "sizeLg", "sizeXl", "sizeMd", 4, "ngIf"], [2, "padding-left", "0px", 3, "sizeSm", "sizeXs", "sizeLg", "sizeXl", "sizeMd"], [3, "question", "form", "forScreenQuestionnaire"], [3, "ngClass"], ["style", "text-align: right; background: white; margin-left: -5px;", 4, "ngIf"], [2, "text-align", "right", "background", "white", "margin-left", "-5px"], [1, "grid", "p-nogutter", 2, "height", "60px"], [1, "col-6", "ion-text-left", 2, "padding", "8px"], ["shape", "round", "fill", "outline", "type", "submit", 1, "button", 3, "click"], [1, "col-6", "ion-text-right", 2, "padding", "8px"], ["shape", "round", "fill", "solid", "type", "submit", 3, "click"], [1, "ion-text-left", "ion-padding-start"], [1, "ion-text-right", "ion-padding-end"], ["linear", "", "aria-busy", "true", 2, "text-align", "-webkit-center", 3, "selectedIndex", "selectionChange"], ["matHorizontalStepper", ""], [3, "stepControl", "completed", 4, "ngFor", "ngForOf"], [3, "stepControl", "completed"], ["matStepLabel", ""], ["editable", "false", "disabled", "", "mat-button", "", "matStepperPrevious", "", 1, "reverse"], ["mat-button", "", 1, "forward", 3, "click"], ["mat-button", "", "matStepperPrevious", "", 1, "reverse", 3, "click"], ["mat-button", "", "matStepperNext", "", 1, "forward", 3, "click"], ["editable", "false", "mat-button", "", "matStepperPrevious", "", 1, "reverse", 3, "click"], [3, "user", "data", "requestCode", "mfaError", "hideButtons", "success"], ["mfa", ""]], template: function DynamicFormComponent_Template(rf, ctx) { if (rf & 1) {
+                }]), i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 4, vars: 3, consts: [[3, "blocked"], ["name", "crescent"], [4, "ngIf"], [3, "user", "data", "requestCode", "mfaError", "hideButtons", "success", 4, "ngIf"], ["formMainDiv", ""], ["focusInvalidInput", "", 3, "formGroup", "ngClass", "ngSubmit"], ["questionnaireForm", "ngForm"], ["size", "12", 1, "ion-padding-end", 2, "padding-left", "0px", 3, "sizeXs", "sizeSm", "sizeMd", "sizeLg", "sizeXl", "offsetXs", "offsetSm", "offsetMd", "offsetLg", "offsetXl"], [1, "p-formgrid", 2, "padding-left", "8px"], [4, "ngFor", "ngForOf"], ["size", "12", "sizeSm", "12", "sizeXs", "12", 1, "ion-padding-start", 2, "padding-left", "0px", 3, "sizeMd", "sizeLg", "sizeXl", "offsetXl", "offsetLg"], [3, "ngClass", 4, "ngIf"], ["size", "12", 3, "sizeXs", "sizeSm", "sizeMd", "sizeLg", "sizeXl", "offsetXs", "offsetSm", "offsetMd", "offsetLg", "offsetXl"], [1, "p-formgrid"], [3, "innerHtml", "ngClass"], [1, "heading", 2, "padding-left", "0px"], ["size", "12", "style", "padding-left: 0px; max-width: fit-content;", 3, "sizeXl", "sizeLg", "sizeSm", "sizeXs", "sizeMd", "ngClass", 4, "ngIf"], ["size", "12", 2, "padding-left", "0px", "max-width", "fit-content", 3, "sizeXl", "sizeLg", "sizeSm", "sizeXs", "sizeMd", "ngClass"], [3, "potentialIssueId", "question", "form", "questionaireForm", "forScreenQuestionnaire", "dynamicParam", "onDynamicParamUpdate"], [2, "padding-left", "0px", 3, "sizeLg", "sizeSm", "sizeXs", "sizeXl", "sizeMd"], [3, "potentialIssueId", "question", "form", "forScreenQuestionnaire", "dynamicParam", "questionaireForm", "onDynamicParamUpdate"], ["style", "padding-left: 0px;", 3, "sizeSm", "sizeXs", "sizeLg", "sizeXl", "sizeMd", 4, "ngIf"], [2, "padding-left", "0px", 3, "sizeSm", "sizeXs", "sizeLg", "sizeXl", "sizeMd"], [3, "question", "form", "forScreenQuestionnaire"], [3, "ngClass"], ["style", "text-align: right; background: white; margin-left: -5px;", 4, "ngIf"], [2, "text-align", "right", "background", "white", "margin-left", "-5px"], [1, "grid", "p-nogutter", 2, "height", "60px"], [1, "col-6", "ion-text-left", 2, "padding", "8px"], ["shape", "round", "fill", "outline", "type", "submit", 1, "button", 3, "click"], [1, "col-6", "ion-text-right", 2, "padding", "8px"], ["shape", "round", "fill", "solid", "type", "submit", 3, "click"], [1, "ion-text-left", "ion-padding-start"], [1, "ion-text-right", "ion-padding-end"], ["linear", "", "aria-busy", "true", 2, "text-align", "-webkit-center", 3, "selectedIndex", "selectionChange"], ["matHorizontalStepper", ""], [3, "stepControl", "completed", 4, "ngFor", "ngForOf"], [3, "stepControl", "completed"], ["matStepLabel", ""], ["editable", "false", "disabled", "", "mat-button", "", "matStepperPrevious", "", 1, "reverse"], ["mat-button", "", 1, "forward", 3, "click"], ["mat-button", "", "matStepperPrevious", "", 1, "reverse", 3, "click"], ["mat-button", "", "matStepperNext", "", 1, "forward", 3, "click"], ["editable", "false", "mat-button", "", "matStepperPrevious", "", 1, "reverse", 3, "click"], [3, "user", "data", "requestCode", "mfaError", "hideButtons", "success"], ["mfa", ""]], template: function DynamicFormComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "p-blockUI", 0);
             i0.ɵɵelement(1, "ion-spinner", 1);
             i0.ɵɵelementEnd();
@@ -15634,7 +15639,7 @@ class DynamicFormComponent extends BasePage {
                             showError: true,
                             displayDefaultIndicatorType: false
                         }
-                    }], template: "<p-blockUI [blocked]=\"blockUi\">\r\n  <ion-spinner name=\"crescent\"></ion-spinner>\r\n</p-blockUI>\r\n<div *ngIf=\"questions && questions[0] && !showMfa\" #formMainDiv>\r\n  <form focusInvalidInput [formGroup]=\"formGroupArray[activeIndex]\" [ngClass]=\"multiMode ? 'qe-form-multiple' : 'qe-form'\" (ngSubmit)=\"onSubmit()\" #questionnaireForm=\"ngForm\">\r\n    <ion-grid>\r\n      <ion-row *ngIf=\"questions[0].pages[activeIndex].name\">\r\n        <ion-col size=\"12\" [sizeXs]=\"sizeXs\" [sizeSm]=\"sizeSm\" [sizeMd]=\"sizeMd\" [sizeLg]=\"sizeLg\" [sizeXl]=\"sizeXl\"\r\n          [offsetXs]=\"offsetXs\" [offsetSm]=\"offsetSm\" [offsetMd]=\"offsetMd\" [offsetLg]=\"offsetLg\" [offsetXl]=\"offsetXl\">\r\n          <div class=\"p-formgrid\">\r\n            <div [innerHtml]=\"(questionNumber ? questionNumber + ' ' : '') + questions[0].pages[activeIndex].name | dynamicTranslate:dynamicParam | trustHtml\" [ngClass]=\"multiMode ? 'fb-heading-followup' : 'fb-heading'\">\r\n            </div>\r\n          </div>\r\n        </ion-col>\r\n      </ion-row>\r\n      <ion-row>\r\n        <ion-col style=\"padding-left: 0px;\" class=\"ion-padding-end\" size=\"12\" [sizeXs]=\"sizeXs\" [sizeSm]=\"sizeSm\"\r\n          [sizeMd]=\"sizeMd\" [sizeLg]=\"sizeLg\" [sizeXl]=\"sizeXl\" [offsetXs]=\"offsetXs\" [offsetSm]=\"offsetSm\"\r\n          [offsetMd]=\"offsetMd\" [offsetLg]=\"offsetLg\" [offsetXl]=\"offsetXl\">\r\n          <div class=\"p-formgrid\" style=\"padding-left: 8px;\">\r\n            <ng-container *ngFor=\"let element of questions[0].pages[activeIndex].elements; let i = index\">\r\n              <ng-container *ngIf=\"element.type==='panel'\">\r\n\r\n                <ion-row *ngIf=\"visibleIf(element.visibleIf,'',formGroupArray[activeIndex],element)\">\r\n                  <!-- <ion-col style=\"padding-left: 0px;\"> -->\r\n                  <div style=\"padding-left: 0px;\" class=\"heading\">\r\n                    {{element.title}}\r\n                  </div>\r\n                  <!-- </ion-col> -->\r\n                </ion-row>\r\n                <ion-row>\r\n                  <ng-container *ngFor=\"let panelElement of element.elements\">\r\n                    <ion-col size=\"12\" [sizeXl]=\"panelElement.sizeXL ? panelElement.sizeXL : 3\" style=\"padding-left: 0px; max-width: fit-content;\"\r\n                      [sizeLg]=\"panelElement.sizeLG ? panelElement.sizeLG : 3\" [sizeSm]=\"panelElement.sizeSM ? panelElement.sizeSM : 12\"\r\n                      [sizeXs]=\"panelElement.sizeXS ? panelElement.sizeXS : 12\" [sizeMd]=\"panelElement.sizeMD ? panelElement.sizeMD : 4\"\r\n                      *ngIf=\"panelElement.colElement==='COL1' && visibleIf(panelElement.visibleIf,panelElement.name,formGroupArray[activeIndex],panelElement)\"\r\n                      [ngClass]=\"shouldFitContent(element.elements) ? 'col-fit-content' : ''\">\r\n\r\n                      <app-question [potentialIssueId]=\"potentialIssueId\" [question]=\"panelElement\" [form]=\"formGroupArray[activeIndex]\"\r\n                        [forScreenQuestionnaire]=\"forScreenQuestionnaire\" (onDynamicParamUpdate)=\"updateDynamicParam($event)\" [dynamicParam]=\"dynamicParam\">\r\n                      </app-question>\r\n\r\n                    </ion-col>\r\n                    <!-- <ion-col size=\"1\" *ngIf=\"panelElement.description\" style=\"padding-top: 28px\">\r\n                            <app-overlay-info [overlayText]=\"panelElement.description\"></app-overlay-info>\r\n                          </ion-col> -->\r\n                  </ng-container>\r\n                </ion-row>\r\n                <!-- </ion-col>\r\n                  </ion-row> -->\r\n\r\n              </ng-container>\r\n              <ng-container\r\n                *ngIf=\"element.type!='panel' && element.type!='hidden' && visibleIf(element.visibleIf,element.name,formGroupArray[activeIndex],element)\">\r\n                <ion-row>\r\n                  <ion-col [sizeLg]=\"element.sizeLG>0?element.sizeLG:''\" [sizeSm]=\"element.sizeSM\"\r\n                    [sizeXs]=\"element.sizeXS\" [sizeXl]=\"element.sizeXL>0 ?element.sizeXL:''\"\r\n                    [sizeMd]=\"element.sizeMD>0 ?element.sizeMD:''\" style=\"padding-left: 0px;\">\r\n                    <!-- <div class=\"field\"> -->\r\n                    <app-question [potentialIssueId]=\"potentialIssueId\" [question]=\"element\" [form]=\"formGroupArray[activeIndex]\"\r\n                      [forScreenQuestionnaire]=\"forScreenQuestionnaire\" [dynamicParam]=\"dynamicParam\" \r\n                      (onDynamicParamUpdate)=\"updateDynamicParam($event)\" >\r\n                    </app-question>\r\n                    <!-- </div> -->\r\n                  </ion-col>\r\n                  <!-- <ion-col size=\"1\" *ngIf=\"element.description\" style=\"padding-top: 35px\">\r\n                      <app-overlay-info [overlayText]=\"element.description\"></app-overlay-info>\r\n                    </ion-col> -->\r\n                </ion-row>\r\n              </ng-container>\r\n            </ng-container>\r\n          </div>\r\n        </ion-col>\r\n        <ion-col class=\"ion-padding-start\" size=\"12\" sizeSm=\"12\" sizeXs=\"12\" [sizeMd]=\"pageType==='POPUP'?6:12\"\r\n          [sizeLg]=\"pageType==='POPUP'?6:10\" [sizeXl]=\"pageType==='POPUP'?5:10\" style=\"padding-left: 0px;\"\r\n          [offsetXl]=\"pageType==='POPUP'?0:1\" [offsetLg]=\"pageType==='POPUP'?0:1\">\r\n          <div class=\"p-formgrid\" style=\"padding-left: 8px;\">\r\n            <ng-container *ngFor=\"let element of questions[0].pages[activeIndex].elements; let i = index\">\r\n              <ng-container *ngIf=\" visibleIf(element.visibleIf,'',formGroupArray[activeIndex],element)\">\r\n                <ion-row>\r\n                  <ng-container *ngFor=\"let panelElement of element.elements\">\r\n                    <ion-col [sizeSm]=\"panelElement.sizeSM\" [sizeXs]=\"panelElement.sizeXS\"\r\n                      [sizeLg]=\"panelElement.sizeLG>0?panelElement.sizeLG:''\"\r\n                      [sizeXl]=\"panelElement.sizeXL>0 ?panelElement.sizeXL:''\" style=\"padding-left: 0px;\"\r\n                      [sizeMd]=\"panelElement.sizeMD>0?panelElement.sizeMD:''\" *ngIf=\"panelElement.colElement==='COL2' &&\r\n                    visibleIf(panelElement.visibleIf,panelElement.name,formGroupArray[activeIndex],panelElement)\">\r\n                      <div>\r\n                        <panel-app [question]=\"panelElement\" [form]=\"formGroupArray[activeIndex]\"\r\n                          [forScreenQuestionnaire]=\"forScreenQuestionnaire\">\r\n                        </panel-app>\r\n                      </div>\r\n                    </ion-col>\r\n                  </ng-container>\r\n                </ion-row>\r\n              </ng-container>\r\n            </ng-container>\r\n          </div>\r\n        </ion-col>\r\n      </ion-row>\r\n    </ion-grid>\r\n\r\n    <ion-footer *ngIf=\"!hideFooter\"\r\n      [ngClass]=\"'footer-fixed'\">\r\n      <div style=\"text-align: right; background: white; margin-left: -5px;\"\r\n        *ngIf=\"hideStep && pageType!='POPUP' && pageType!='SCREEN'\">\r\n        <div class=\"grid p-nogutter\" style=\"height: 60px;\">\r\n          <div class=\"col-6 ion-text-left\" style=\"padding: 8px;\">\r\n            <ion-button shape=\"round\" fill=\"outline\" class=\"button\" (click)=\"cancelAction()\" type=\"submit\">\r\n              Cancel\r\n            </ion-button>\r\n          </div>\r\n          <div class=\"col-6 ion-text-right\" style=\"padding: 8px;\">\r\n            <ion-button shape=\"round\" (click)=\"complete()\" fill=\"solid\" type=\"submit\">\r\n              Next\r\n            </ion-button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div style=\"text-align: right; background: white; margin-left: -5px;\"\r\n        *ngIf=\"hideStep && pageType=='SCREEN' && questions[0].isFirstPageSubmit\">\r\n        <div class=\"grid p-nogutter\" style=\"height: 60px;\">\r\n          <div class=\"col-6 ion-text-left\" style=\"padding: 8px;\">\r\n            <ion-button shape=\"round\" fill=\"outline\" class=\"button\" (click)=\"cancelAction()\" type=\"submit\">\r\n              Cancel\r\n            </ion-button>\r\n          </div>\r\n          <div class=\"col-6 ion-text-right\" style=\"padding: 8px;\">\r\n            <ion-button shape=\"round\" (click)=\"complete()\" fill=\"solid\" type=\"submit\">\r\n              Done\r\n            </ion-button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <ion-grid *ngIf=\"hideStep && pageType==='POPUP'\">\r\n        <ion-row>\r\n          <ion-col class=\"ion-text-left ion-padding-start\">\r\n            <ion-button shape=\"round\" fill=\"outline\" class=\"button\" (click)=\"cancelPopUp()\" type=\"submit\">\r\n              Cancel\r\n            </ion-button>\r\n          </ion-col>\r\n          <ion-col class=\"ion-text-right ion-padding-end\">\r\n            <ion-button shape=\"round\" (click)=\"complete()\" fill=\"solid\" type=\"submit\">\r\n              Add\r\n            </ion-button>\r\n          </ion-col>\r\n        </ion-row>\r\n      </ion-grid>\r\n\r\n\r\n\r\n\r\n      <div *ngIf=\"!hideStep\">\r\n        <mat-horizontal-stepper linear #matHorizontalStepper [selectedIndex]=\"questions[0].stepCounter\"\r\n          (selectionChange)=\"stepChanged($event);\" style=\"text-align: -webkit-center;\" aria-busy=\"true\">\r\n          <mat-step *ngFor=\"let element of  questions[0].pages;  let i = index;\" [stepControl]=\"formGroupArray[i]\"\r\n            [completed]=\"  i < activeIndex \">\r\n\r\n            <div>\r\n              <ng-template matStepLabel>{{questions[0].pages[i].navigationTitle}}</ng-template>\r\n            </div>\r\n\r\n            <div *ngIf=\"!questions[0].isFirstPageSubmit && !isLast && isFirst && !isEnableBackButton\">\r\n              <button class=\"reverse\" editable=\"false\" disabled mat-button matStepperPrevious>Back</button>\r\n              <button class=\"forward\" mat-button (click)=\"nextPage(activeIndex)\">Next</button>\r\n            </div>\r\n\r\n            <div *ngIf=\"questions[0].isFirstPageSubmit\">\r\n              <button class=\"reverse\" (click)=\"cancelAction()\" mat-button matStepperPrevious>Back</button>\r\n              <button class=\"forward\" mat-button matStepperNext (click)=\"complete()\">Next</button>\r\n            </div>\r\n\r\n            <div *ngIf=\"!questions[0].isFirstPageSubmit && isLast && !isFirst\">\r\n              <button class=\"reverse\" mat-button matStepperPrevious (click)=\"prevPage(activeIndex)\">Back</button>\r\n              <button class=\"forward\" mat-button matStepperNext (click)=\"complete()\">Done</button>\r\n            </div>\r\n\r\n            <div *ngIf=\"!questions[0].isFirstPageSubmit && !isLast && !isFirst\">\r\n              <button class=\"reverse\" editable=\"false\" mat-button matStepperPrevious \r\n              (click)=\"prevPage(activeIndex)\">Back</button>\r\n              <button class=\"forward\" mat-button (click)=\"nextPage(activeIndex)\">Next</button>\r\n            </div>\r\n\r\n            <div *ngIf=\"isEnableBackButton && !questions[0].isFirstPageSubmit && !isLast && isFirst\">\r\n              <button class=\"reverse\" editable=\"false\" mat-button matStepperPrevious \r\n              (click)=\"cancelAction()\">Back</button>\r\n              <button class=\"forward\" mat-button (click)=\"nextPage(activeIndex)\">Next</button>\r\n            </div>\r\n\r\n\r\n          </mat-step>\r\n\r\n        </mat-horizontal-stepper>\r\n\r\n      </div>\r\n\r\n    </ion-footer>\r\n  </form>\r\n\r\n\r\n\r\n\r\n  <!-- <div *ngIf=\"payLoad\" class=\"form-row\">\r\n      <strong>Saved the following values</strong><br>{{payLoad}}\r\n    </div>  -->\r\n\r\n\r\n</div>\r\n\r\n<app-mfa #mfa [user]=\"ls.getUser()\" *ngIf=\"showMfa\" (success)=\"saveScreenQuestionnaire($event)\" [data]=\"mfaData\" [requestCode]=\"true\" \r\n         [mfaError]=\"mfaError\" [hideButtons]=\"true\"></app-mfa>", styles: [":host ::ng-deep .flex-container.ng-star-inserted{display:inline-flex!important}:host ::ng-deep .p-fluid .p-buttonset{display:initial!important}:host ::ng-deep form{margin-left:0}:host ::ng-deep .p-fluid .p-calendar{display:inline-flex!important;width:60%!important}:host ::ng-deep .p-fluid .p-calendar .p-inputtext{width:100%!important}:host ::ng-deep .p-fluid .p-autocomplete{display:inline-flex!important}.pageTitle{font-weight:600;position:absolute;right:48%}@media (max-width: 280px){:host ::ng-deep span.start{font-size:18px;top:46px;position:relative}:host ::ng-deep .mat-stepper-horizontal-line{display:none}:host ::ng-deep .mat-horizontal-stepper-header{padding:0 28px!important}:host ::ng-deep .mat-horizontal-stepper-header-container{left:46px!important}:host ::ng-deep .mat-step-label{display:none!important}}@media (max-width: 576px){:host ::ng-deep span.p-steps-title.ng-star-inserted{display:none!important}:host ::ng-deep .p-steps.p-steps-item.p-menuitem-link.p-steps-title{display:none!important}:host ::ng-deep .backinc{position:absolute;left:25px}:host ::ng-deep .mat-step-label{display:none!important}:host ::ng-deep .mat-step-label.mat-step-label-active{display:none!important;position:absolute;bottom:0;right:0}}@media (max-width: 576px) and (min-width: 576px){.pageTitle{display:none!important}.backinc{position:absolute;left:125px}}@media (max-width: 415px){:host ::ng-deep .mat-horizontal-stepper-header-container{width:60%!important;left:46px!important}:host ::ng-deep .reverse{left:5px!important}:host ::ng-deep .forward{right:5px!important}}:host ::ng-deep .mat-stepper-horizontal,:host ::ng-deep .mat-stepper-vertical{height:70px}:host ::ng-deep .mat-horizontal-stepper-header{padding:0 40px}:host ::ng-deep .mat-step-label{min-width:120px;bottom:5px}:host ::ng-deep .mat-step-header .mat-step-label.mat-step-label-active{bottom:5px}:host ::ng-deep .mat-step-header:hover:hover{background-color:#fff!important}:host ::ng-deep .mat-horizontal-stepper-header{pointer-events:none!important}:host ::ng-deep .mat-step-header .mat-step-icon{background-color:#bdcad2;color:#bdcad2}:host ::ng-deep .mat-step-header .mat-step-icon-selected{color:#fff;background-color:var(--ion-color-primary)}:host ::ng-deep .mat-step-header .mat-step-label.mat-step-label-selected{color:var(--ion-color-primary)}:host ::ng-deep mat-icon.mat-icon.notranslate.material-icons.mat-icon-no-color.ng-star-inserted{color:var(--ion-color-primary)!important;font-weight:700}:host ::ng-deep .mat-step-header .mat-step-icon-selected mat-icon.mat-icon.notranslate.material-icons.mat-icon-no-color.ng-star-inserted{color:#fff!important;font-weight:700}:host ::ng-deep button{background-color:var(--ion-color-primary);color:#fff}:host ::ng-deep .reverse{background-color:#fff;border:1px solid var(--ion-color-primary);border-radius:30px;color:var(--ion-color-primary)!important;position:absolute;bottom:15px;left:40px;cursor:pointer}:host ::ng-deep .mat-horizontal-stepper-header-container{width:50%;position:sticky;left:100px}:host ::ng-deep .forward{position:absolute;right:40px;bottom:15px;border-radius:30px;cursor:pointer}:host ::ng-deep .reset{position:absolute;right:50px;bottom:40px;border-radius:30px}:host ::ng-deep .placeholder{visibility:hidden}:host ::ng-deep .ui-state-complete .ui-steps-number{background-color:green!important}:host ::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-number{background-color:var(--ion-color-primary)!important;background-size:20px;color:var(--ion-color-primary)!important}:host ::ng-deep .p-steps .p-steps-item .p-menuitem-link .p-steps-number{color:var(--ion-color-grey);background-size:15px;font-size:.857rem;min-width:1.714rem;height:1.714rem;line-height:1.714rem}:host ::ng-deep div.p-formgrid.p-grid.ng-star-inserted{flex-wrap:wrap!important}:host ::ng-deep .p-steps .p-steps-item.p-menuitem-link .p-steps-number{background-color:var(--ion-color-primary-shade)}:host ::ng-deep ion-footer{bottom:0}:host ::ng-deep .second{right:45%}:host ::ng-deep .mat-button.mat-primary[disabled],:host ::ng-deep .mat-button.mat-accent[disabled],:host ::ng-deep .mat-button.mat-warn[disabled],:host ::ng-deep .mat-button[disabled][disabled],:host ::ng-deep .mat-icon-button.mat-primary[disabled],:host ::ng-deep .mat-icon-button.mat-accent[disabled],:host ::ng-deep .mat-icon-button.mat-warn[disabled],:host ::ng-deep .mat-icon-button[disabled][disabled],:host ::ng-deep .mat-stroked-button.mat-primary[disabled],:host ::ng-deep .mat-stroked-button.mat-accent[disabled],:host ::ng-deep .mat-stroked-button.mat-warn[disabled],:host ::ng-deep .mat-stroked-button[disabled][disabled]{border:1px solid lightgray}:host ::ng-deep h1,:host ::ng-deep h2,:host ::ng-deep h3,:host ::ng-deep h4,:host ::ng-deep h5,:host ::ng-deep h6{margin-top:0!important;margin-bottom:0!important}.footer-fixed{position:fixed!important}.footer-sticky{position:sticky}@media (max-width: 768px){.footer-fixed{position:sticky}}.fb-heading{font-family:var(--app-font-light);color:var(--ion-color-medium-gray);font-size:36px}.fb-heading-followup{font-family:var(--app-font-light);color:var(--ion-color-medium-gray);font-size:24px}.qe-form{margin-bottom:96px}.qe-form-multiple{margin-bottom:8px}\n"] }]
+                    }], template: "<p-blockUI [blocked]=\"blockUi\">\r\n  <ion-spinner name=\"crescent\"></ion-spinner>\r\n</p-blockUI>\r\n<div *ngIf=\"questions && questions[0] && !showMfa\" #formMainDiv>\r\n  <form focusInvalidInput [formGroup]=\"formGroupArray[activeIndex]\" [ngClass]=\"multiMode ? 'qe-form-multiple' : 'qe-form'\" (ngSubmit)=\"onSubmit()\" #questionnaireForm=\"ngForm\">\r\n    <ion-grid>\r\n      <ion-row *ngIf=\"questions[0].pages[activeIndex].name\">\r\n        <ion-col size=\"12\" [sizeXs]=\"sizeXs\" [sizeSm]=\"sizeSm\" [sizeMd]=\"sizeMd\" [sizeLg]=\"sizeLg\" [sizeXl]=\"sizeXl\"\r\n          [offsetXs]=\"offsetXs\" [offsetSm]=\"offsetSm\" [offsetMd]=\"offsetMd\" [offsetLg]=\"offsetLg\" [offsetXl]=\"offsetXl\">\r\n          <div class=\"p-formgrid\">\r\n            <div [innerHtml]=\"(questionNumber ? questionNumber + ' ' : '') + questions[0].pages[activeIndex].name | dynamicTranslate:dynamicParam | trustHtml\" [ngClass]=\"multiMode ? 'fb-heading-followup' : 'fb-heading'\">\r\n            </div>\r\n          </div>\r\n        </ion-col>\r\n      </ion-row>\r\n      <ion-row>\r\n        <ion-col style=\"padding-left: 0px;\" class=\"ion-padding-end\" size=\"12\" [sizeXs]=\"sizeXs\" [sizeSm]=\"sizeSm\"\r\n          [sizeMd]=\"sizeMd\" [sizeLg]=\"sizeLg\" [sizeXl]=\"sizeXl\" [offsetXs]=\"offsetXs\" [offsetSm]=\"offsetSm\"\r\n          [offsetMd]=\"offsetMd\" [offsetLg]=\"offsetLg\" [offsetXl]=\"offsetXl\">\r\n          <div class=\"p-formgrid\" style=\"padding-left: 8px;\">\r\n            <ng-container *ngFor=\"let element of questions[0].pages[activeIndex].elements; let i = index\">\r\n              <ng-container *ngIf=\"element.type==='panel'\">\r\n\r\n                <ion-row *ngIf=\"visibleIf(element.visibleIf,'',formGroupArray[activeIndex],element)\">\r\n                  <!-- <ion-col style=\"padding-left: 0px;\"> -->\r\n                  <div style=\"padding-left: 0px;\" class=\"heading\">\r\n                    {{element.title}}\r\n                  </div>\r\n                  <!-- </ion-col> -->\r\n                </ion-row>\r\n                <ion-row>\r\n                  <ng-container *ngFor=\"let panelElement of element.elements\">\r\n                    <ion-col size=\"12\" [sizeXl]=\"panelElement.sizeXL ? panelElement.sizeXL : 3\" style=\"padding-left: 0px; max-width: fit-content;\"\r\n                      [sizeLg]=\"panelElement.sizeLG ? panelElement.sizeLG : 3\" [sizeSm]=\"panelElement.sizeSM ? panelElement.sizeSM : 12\"\r\n                      [sizeXs]=\"panelElement.sizeXS ? panelElement.sizeXS : 12\" [sizeMd]=\"panelElement.sizeMD ? panelElement.sizeMD : 4\"\r\n                      *ngIf=\"panelElement.colElement==='COL1' && visibleIf(panelElement.visibleIf,panelElement.name,formGroupArray[activeIndex],panelElement)\"\r\n                      [ngClass]=\"shouldFitContent(element.elements) ? 'col-fit-content' : ''\">\r\n\r\n                      <app-question [potentialIssueId]=\"potentialIssueId\" [question]=\"panelElement\" [form]=\"formGroupArray[activeIndex]\" [questionaireForm]=\"questionnaireForm\"\r\n                        [forScreenQuestionnaire]=\"forScreenQuestionnaire\" (onDynamicParamUpdate)=\"updateDynamicParam($event)\" [dynamicParam]=\"dynamicParam\">\r\n                      </app-question>\r\n\r\n                    </ion-col>\r\n                    <!-- <ion-col size=\"1\" *ngIf=\"panelElement.description\" style=\"padding-top: 28px\">\r\n                            <app-overlay-info [overlayText]=\"panelElement.description\"></app-overlay-info>\r\n                          </ion-col> -->\r\n                  </ng-container>\r\n                </ion-row>\r\n                <!-- </ion-col>\r\n                  </ion-row> -->\r\n\r\n              </ng-container>\r\n              <ng-container\r\n                *ngIf=\"element.type!='panel' && element.type!='hidden' && visibleIf(element.visibleIf,element.name,formGroupArray[activeIndex],element)\">\r\n                <ion-row>\r\n                  <ion-col [sizeLg]=\"element.sizeLG>0?element.sizeLG:''\" [sizeSm]=\"element.sizeSM\"\r\n                    [sizeXs]=\"element.sizeXS\" [sizeXl]=\"element.sizeXL>0 ?element.sizeXL:''\"\r\n                    [sizeMd]=\"element.sizeMD>0 ?element.sizeMD:''\" style=\"padding-left: 0px;\">\r\n                    <!-- <div class=\"field\"> -->\r\n                    <app-question [potentialIssueId]=\"potentialIssueId\" [question]=\"element\" [form]=\"formGroupArray[activeIndex]\"\r\n                      [forScreenQuestionnaire]=\"forScreenQuestionnaire\" [dynamicParam]=\"dynamicParam\" [questionaireForm]=\"questionnaireForm\"\r\n                      (onDynamicParamUpdate)=\"updateDynamicParam($event)\" >\r\n                    </app-question>\r\n                    <!-- </div> -->\r\n                  </ion-col>\r\n                  <!-- <ion-col size=\"1\" *ngIf=\"element.description\" style=\"padding-top: 35px\">\r\n                      <app-overlay-info [overlayText]=\"element.description\"></app-overlay-info>\r\n                    </ion-col> -->\r\n                </ion-row>\r\n              </ng-container>\r\n            </ng-container>\r\n          </div>\r\n        </ion-col>\r\n        <ion-col class=\"ion-padding-start\" size=\"12\" sizeSm=\"12\" sizeXs=\"12\" [sizeMd]=\"pageType==='POPUP'?6:12\"\r\n          [sizeLg]=\"pageType==='POPUP'?6:10\" [sizeXl]=\"pageType==='POPUP'?5:10\" style=\"padding-left: 0px;\"\r\n          [offsetXl]=\"pageType==='POPUP'?0:1\" [offsetLg]=\"pageType==='POPUP'?0:1\">\r\n          <div class=\"p-formgrid\" style=\"padding-left: 8px;\">\r\n            <ng-container *ngFor=\"let element of questions[0].pages[activeIndex].elements; let i = index\">\r\n              <ng-container *ngIf=\" visibleIf(element.visibleIf,'',formGroupArray[activeIndex],element)\">\r\n                <ion-row>\r\n                  <ng-container *ngFor=\"let panelElement of element.elements\">\r\n                    <ion-col [sizeSm]=\"panelElement.sizeSM\" [sizeXs]=\"panelElement.sizeXS\"\r\n                      [sizeLg]=\"panelElement.sizeLG>0?panelElement.sizeLG:''\"\r\n                      [sizeXl]=\"panelElement.sizeXL>0 ?panelElement.sizeXL:''\" style=\"padding-left: 0px;\"\r\n                      [sizeMd]=\"panelElement.sizeMD>0?panelElement.sizeMD:''\" *ngIf=\"panelElement.colElement==='COL2' &&\r\n                    visibleIf(panelElement.visibleIf,panelElement.name,formGroupArray[activeIndex],panelElement)\">\r\n                      <div>\r\n                        <panel-app [question]=\"panelElement\" [form]=\"formGroupArray[activeIndex]\"\r\n                          [forScreenQuestionnaire]=\"forScreenQuestionnaire\">\r\n                        </panel-app>\r\n                      </div>\r\n                    </ion-col>\r\n                  </ng-container>\r\n                </ion-row>\r\n              </ng-container>\r\n            </ng-container>\r\n          </div>\r\n        </ion-col>\r\n      </ion-row>\r\n    </ion-grid>\r\n\r\n    <ion-footer *ngIf=\"!hideFooter\"\r\n      [ngClass]=\"'footer-fixed'\">\r\n      <div style=\"text-align: right; background: white; margin-left: -5px;\"\r\n        *ngIf=\"hideStep && pageType!='POPUP' && pageType!='SCREEN'\">\r\n        <div class=\"grid p-nogutter\" style=\"height: 60px;\">\r\n          <div class=\"col-6 ion-text-left\" style=\"padding: 8px;\">\r\n            <ion-button shape=\"round\" fill=\"outline\" class=\"button\" (click)=\"cancelAction()\" type=\"submit\">\r\n              Cancel\r\n            </ion-button>\r\n          </div>\r\n          <div class=\"col-6 ion-text-right\" style=\"padding: 8px;\">\r\n            <ion-button shape=\"round\" (click)=\"complete()\" fill=\"solid\" type=\"submit\">\r\n              Next\r\n            </ion-button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div style=\"text-align: right; background: white; margin-left: -5px;\"\r\n        *ngIf=\"hideStep && pageType=='SCREEN' && questions[0].isFirstPageSubmit\">\r\n        <div class=\"grid p-nogutter\" style=\"height: 60px;\">\r\n          <div class=\"col-6 ion-text-left\" style=\"padding: 8px;\">\r\n            <ion-button shape=\"round\" fill=\"outline\" class=\"button\" (click)=\"cancelAction()\" type=\"submit\">\r\n              Cancel\r\n            </ion-button>\r\n          </div>\r\n          <div class=\"col-6 ion-text-right\" style=\"padding: 8px;\">\r\n            <ion-button shape=\"round\" (click)=\"complete()\" fill=\"solid\" type=\"submit\">\r\n              Done\r\n            </ion-button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <ion-grid *ngIf=\"hideStep && pageType==='POPUP'\">\r\n        <ion-row>\r\n          <ion-col class=\"ion-text-left ion-padding-start\">\r\n            <ion-button shape=\"round\" fill=\"outline\" class=\"button\" (click)=\"cancelPopUp()\" type=\"submit\">\r\n              Cancel\r\n            </ion-button>\r\n          </ion-col>\r\n          <ion-col class=\"ion-text-right ion-padding-end\">\r\n            <ion-button shape=\"round\" (click)=\"complete()\" fill=\"solid\" type=\"submit\">\r\n              Add\r\n            </ion-button>\r\n          </ion-col>\r\n        </ion-row>\r\n      </ion-grid>\r\n\r\n\r\n\r\n\r\n      <div *ngIf=\"!hideStep\">\r\n        <mat-horizontal-stepper linear #matHorizontalStepper [selectedIndex]=\"questions[0].stepCounter\"\r\n          (selectionChange)=\"stepChanged($event);\" style=\"text-align: -webkit-center;\" aria-busy=\"true\">\r\n          <mat-step *ngFor=\"let element of  questions[0].pages;  let i = index;\" [stepControl]=\"formGroupArray[i]\"\r\n            [completed]=\"  i < activeIndex \">\r\n\r\n            <div>\r\n              <ng-template matStepLabel>{{questions[0].pages[i].navigationTitle}}</ng-template>\r\n            </div>\r\n\r\n            <div *ngIf=\"!questions[0].isFirstPageSubmit && !isLast && isFirst && !isEnableBackButton\">\r\n              <button class=\"reverse\" editable=\"false\" disabled mat-button matStepperPrevious>Back</button>\r\n              <button class=\"forward\" mat-button (click)=\"nextPage(activeIndex)\">Next</button>\r\n            </div>\r\n\r\n            <div *ngIf=\"questions[0].isFirstPageSubmit\">\r\n              <button class=\"reverse\" (click)=\"cancelAction()\" mat-button matStepperPrevious>Back</button>\r\n              <button class=\"forward\" mat-button matStepperNext (click)=\"complete()\">Next</button>\r\n            </div>\r\n\r\n            <div *ngIf=\"!questions[0].isFirstPageSubmit && isLast && !isFirst\">\r\n              <button class=\"reverse\" mat-button matStepperPrevious (click)=\"prevPage(activeIndex)\">Back</button>\r\n              <button class=\"forward\" mat-button matStepperNext (click)=\"complete()\">Done</button>\r\n            </div>\r\n\r\n            <div *ngIf=\"!questions[0].isFirstPageSubmit && !isLast && !isFirst\">\r\n              <button class=\"reverse\" editable=\"false\" mat-button matStepperPrevious \r\n              (click)=\"prevPage(activeIndex)\">Back</button>\r\n              <button class=\"forward\" mat-button (click)=\"nextPage(activeIndex)\">Next</button>\r\n            </div>\r\n\r\n            <div *ngIf=\"isEnableBackButton && !questions[0].isFirstPageSubmit && !isLast && isFirst\">\r\n              <button class=\"reverse\" editable=\"false\" mat-button matStepperPrevious \r\n              (click)=\"cancelAction()\">Back</button>\r\n              <button class=\"forward\" mat-button (click)=\"nextPage(activeIndex)\">Next</button>\r\n            </div>\r\n\r\n\r\n          </mat-step>\r\n\r\n        </mat-horizontal-stepper>\r\n\r\n      </div>\r\n\r\n    </ion-footer>\r\n  </form>\r\n\r\n\r\n\r\n\r\n  <!-- <div *ngIf=\"payLoad\" class=\"form-row\">\r\n      <strong>Saved the following values</strong><br>{{payLoad}}\r\n    </div>  -->\r\n\r\n\r\n</div>\r\n\r\n<app-mfa #mfa [user]=\"ls.getUser()\" *ngIf=\"showMfa\" (success)=\"saveScreenQuestionnaire($event)\" [data]=\"mfaData\" [requestCode]=\"true\" \r\n         [mfaError]=\"mfaError\" [hideButtons]=\"true\"></app-mfa>", styles: [":host ::ng-deep .flex-container.ng-star-inserted{display:inline-flex!important}:host ::ng-deep .p-fluid .p-buttonset{display:initial!important}:host ::ng-deep form{margin-left:0}:host ::ng-deep .p-fluid .p-calendar{display:inline-flex!important;width:60%!important}:host ::ng-deep .p-fluid .p-calendar .p-inputtext{width:100%!important}:host ::ng-deep .p-fluid .p-autocomplete{display:inline-flex!important}.pageTitle{font-weight:600;position:absolute;right:48%}@media (max-width: 280px){:host ::ng-deep span.start{font-size:18px;top:46px;position:relative}:host ::ng-deep .mat-stepper-horizontal-line{display:none}:host ::ng-deep .mat-horizontal-stepper-header{padding:0 28px!important}:host ::ng-deep .mat-horizontal-stepper-header-container{left:46px!important}:host ::ng-deep .mat-step-label{display:none!important}}@media (max-width: 576px){:host ::ng-deep span.p-steps-title.ng-star-inserted{display:none!important}:host ::ng-deep .p-steps.p-steps-item.p-menuitem-link.p-steps-title{display:none!important}:host ::ng-deep .backinc{position:absolute;left:25px}:host ::ng-deep .mat-step-label{display:none!important}:host ::ng-deep .mat-step-label.mat-step-label-active{display:none!important;position:absolute;bottom:0;right:0}}@media (max-width: 576px) and (min-width: 576px){.pageTitle{display:none!important}.backinc{position:absolute;left:125px}}@media (max-width: 415px){:host ::ng-deep .mat-horizontal-stepper-header-container{width:60%!important;left:46px!important}:host ::ng-deep .reverse{left:5px!important}:host ::ng-deep .forward{right:5px!important}}:host ::ng-deep .mat-stepper-horizontal,:host ::ng-deep .mat-stepper-vertical{height:70px}:host ::ng-deep .mat-horizontal-stepper-header{padding:0 40px}:host ::ng-deep .mat-step-label{min-width:120px;bottom:5px}:host ::ng-deep .mat-step-header .mat-step-label.mat-step-label-active{bottom:5px}:host ::ng-deep .mat-step-header:hover:hover{background-color:#fff!important}:host ::ng-deep .mat-horizontal-stepper-header{pointer-events:none!important}:host ::ng-deep .mat-step-header .mat-step-icon{background-color:#bdcad2;color:#bdcad2}:host ::ng-deep .mat-step-header .mat-step-icon-selected{color:#fff;background-color:var(--ion-color-primary)}:host ::ng-deep .mat-step-header .mat-step-label.mat-step-label-selected{color:var(--ion-color-primary)}:host ::ng-deep mat-icon.mat-icon.notranslate.material-icons.mat-icon-no-color.ng-star-inserted{color:var(--ion-color-primary)!important;font-weight:700}:host ::ng-deep .mat-step-header .mat-step-icon-selected mat-icon.mat-icon.notranslate.material-icons.mat-icon-no-color.ng-star-inserted{color:#fff!important;font-weight:700}:host ::ng-deep button{background-color:var(--ion-color-primary);color:#fff}:host ::ng-deep .reverse{background-color:#fff;border:1px solid var(--ion-color-primary);border-radius:30px;color:var(--ion-color-primary)!important;position:absolute;bottom:15px;left:40px;cursor:pointer}:host ::ng-deep .mat-horizontal-stepper-header-container{width:50%;position:sticky;left:100px}:host ::ng-deep .forward{position:absolute;right:40px;bottom:15px;border-radius:30px;cursor:pointer}:host ::ng-deep .reset{position:absolute;right:50px;bottom:40px;border-radius:30px}:host ::ng-deep .placeholder{visibility:hidden}:host ::ng-deep .ui-state-complete .ui-steps-number{background-color:green!important}:host ::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-number{background-color:var(--ion-color-primary)!important;background-size:20px;color:var(--ion-color-primary)!important}:host ::ng-deep .p-steps .p-steps-item .p-menuitem-link .p-steps-number{color:var(--ion-color-grey);background-size:15px;font-size:.857rem;min-width:1.714rem;height:1.714rem;line-height:1.714rem}:host ::ng-deep div.p-formgrid.p-grid.ng-star-inserted{flex-wrap:wrap!important}:host ::ng-deep .p-steps .p-steps-item.p-menuitem-link .p-steps-number{background-color:var(--ion-color-primary-shade)}:host ::ng-deep ion-footer{bottom:0}:host ::ng-deep .second{right:45%}:host ::ng-deep .mat-button.mat-primary[disabled],:host ::ng-deep .mat-button.mat-accent[disabled],:host ::ng-deep .mat-button.mat-warn[disabled],:host ::ng-deep .mat-button[disabled][disabled],:host ::ng-deep .mat-icon-button.mat-primary[disabled],:host ::ng-deep .mat-icon-button.mat-accent[disabled],:host ::ng-deep .mat-icon-button.mat-warn[disabled],:host ::ng-deep .mat-icon-button[disabled][disabled],:host ::ng-deep .mat-stroked-button.mat-primary[disabled],:host ::ng-deep .mat-stroked-button.mat-accent[disabled],:host ::ng-deep .mat-stroked-button.mat-warn[disabled],:host ::ng-deep .mat-stroked-button[disabled][disabled]{border:1px solid lightgray}:host ::ng-deep h1,:host ::ng-deep h2,:host ::ng-deep h3,:host ::ng-deep h4,:host ::ng-deep h5,:host ::ng-deep h6{margin-top:0!important;margin-bottom:0!important}.footer-fixed{position:fixed!important}.footer-sticky{position:sticky}@media (max-width: 768px){.footer-fixed{position:sticky}}.fb-heading{font-family:var(--app-font-light);color:var(--ion-color-medium-gray);font-size:36px}.fb-heading-followup{font-family:var(--app-font-light);color:var(--ion-color-medium-gray);font-size:24px}.qe-form{margin-bottom:96px}.qe-form-multiple{margin-bottom:8px}\n"] }]
     }], () => [{ type: QuestionService }, { type: QuestionnaireService }, { type: i4.NavController }, { type: QuestionControlService }, { type: UtilService }, { type: i3$1.TranslateService }, { type: LoggerService }, { type: ValidationService }, { type: i0.ElementRef }, { type: i3.ActivatedRoute }, { type: i1$3.Storage }, { type: LoginService }, { type: CaptchaService }], { mfa: [{
             type: ViewChild,
             args: ['mfa']
@@ -31088,10 +31093,13 @@ function AddressComponent_ion_col_58_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵproperty("field", ctx_r4.neighbourFlag)("form", _r0)("errDef", i0.ɵɵpureFunction0(13, _c2$j));
 } }
 function AddressComponent_app_address_suggestion_59_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "app-address-suggestion", 23, 24);
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "app-address-suggestion", 23, 24);
+    i0.ɵɵlistener("checkFormIsBlur", function AddressComponent_app_address_suggestion_59_Template_app_address_suggestion_checkFormIsBlur_0_listener() { i0.ɵɵrestoreView(_r8); const ctx_r7 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r7.checkFormBlurr()); });
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r5 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("form", ctx_r5.addressForm)("formName", ctx_r5.inputId)("diffMailAddressFlag", ctx_r5.diffMailAddress)("formblur", ctx_r5.formBlur);
+    i0.ɵɵproperty("form", ctx_r5.addressForm)("formName", ctx_r5.inputId)("diffMailAddressFlag", ctx_r5.diffMailAddress)("formBlur", ctx_r5.checkFormBlurr())("questionaireForm", ctx_r5.questionaireForm)("standaloneAddressForm", ctx_r5.standaloneAddressForm);
 } }
 const _c3$f = () => ({ required: "required", invalidLength: "Zip code should be of 5 or 9 digits.", invalidNumber: "Zip code should only have numbers.", invalidZipCode: "please enter a valid zip code" });
 class AddressComponent {
@@ -31196,6 +31204,16 @@ class AddressComponent {
         this.country.setValue({ value: "US", text: "United States" });
         this.formBlur = this.checkFormBlurr();
     }
+    ngOnChanges(change) {
+        if (change['diffMailAddress']) {
+            if (change['diffMailAddress'].currentValue === false && (this.inputId === 'resAddress' || this.inputId === 'resAdress')) {
+                this.diffMailAddress = false;
+                if (this.checkFormBlurr() && this.addressForm?.valid) {
+                    this.addressSuggestion.getValidateAddress(true);
+                }
+            }
+        }
+    }
     setFieldBlur(field) {
         this.addressFieldFocusStatus[field] = false;
     }
@@ -31218,6 +31236,7 @@ class AddressComponent {
                 fieldBlur = false;
             }
         }
+        this.formBlur = fieldBlur;
         return fieldBlur;
     }
     validAddress(address) {
@@ -31474,7 +31493,7 @@ class AddressComponent {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.addressFormDirective = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.addressSuggestion = _t.first);
-        } }, inputs: { countyRequired: "countyRequired", fromPopup: "fromPopup", inputId: "inputId", componentData: "componentData", showSuggestion: "showSuggestion", diffMailAddress: "diffMailAddress", enableAddressValidation: "enableAddressValidation" }, outputs: { address: "address" }, features: [i0.ɵɵProvidersFeature([{
+        } }, inputs: { countyRequired: "countyRequired", fromPopup: "fromPopup", inputId: "inputId", componentData: "componentData", showSuggestion: "showSuggestion", diffMailAddress: "diffMailAddress", enableAddressValidation: "enableAddressValidation", questionaireForm: "questionaireForm", standaloneAddressForm: "standaloneAddressForm" }, outputs: { address: "address" }, features: [i0.ɵɵProvidersFeature([{
                     provide: NG_VALUE_ACCESSOR,
                     useExisting: AddressComponent,
                     multi: true
@@ -31484,7 +31503,7 @@ class AddressComponent {
                     multi: true,
                     useExisting: AddressComponent
                 }
-            ])], decls: 60, vars: 79, consts: [[2, "margin-bottom", "0px", "margin-left", "0px", 3, "formGroup"], ["addressFormDirective", "ngForm"], [1, "p-formgrid", 3, "id"], [3, "ngClass"], [1, "field"], [3, "for"], ["optionLabel", "text", "appendTo", "body", 3, "options", "formControl", "autoDisplayFirst", "inputId"], [3, "field", "form", "errDef"], ["type", "input", "pInputText", "", "minlength", "5", "maxlength", "9", "appStripInvisibleChars", "", 3, "id", "formControl", "blur", "focus"], [2, "padding-right", "0px", 3, "ngClass"], [1, "field", "p-fluid"], ["type", "input", "pInputText", "", "maxlength", "40", "appStripInvisibleChars", "", 3, "id", "formControl", "blur", "focus"], ["type", "input", "pInputText", "", "placeholder", "Optional", "maxlength", "40", "appStripInvisibleChars", "", 3, "id", "formControl", "blur", "focus"], [2, "padding-bottom", "0px", 3, "ngClass"], [1, "field", 2, "margin-bottom", "0px"], ["type", "input", "pInputText", "", "maxlength", "30", "appStripInvisibleChars", "", 3, "id", "formControl", "blur", "focus"], ["size", "12", "style", "padding-bottom: 0px;", 3, "ngClass", 4, "ngIf"], [2, "padding-top", "4px"], ["style", "padding-top: 0px;", 3, "ngClass", 4, "ngIf"], [3, "form", "formName", "diffMailAddressFlag", "formblur", 4, "ngIf"], ["size", "12", 2, "padding-bottom", "0px", 3, "ngClass"], [2, "padding-top", "0px", 3, "ngClass"], ["unselectable", "true", "optionLabel", "text", "optionValue", "value", "appendTo", "body", 3, "inputId", "options", "formControl"], [3, "form", "formName", "diffMailAddressFlag", "formblur"], ["addressSuggestion", ""]], template: function AddressComponent_Template(rf, ctx) { if (rf & 1) {
+            ]), i0.ɵɵNgOnChangesFeature], decls: 60, vars: 79, consts: [[2, "margin-bottom", "0px", "margin-left", "0px", 3, "formGroup"], ["addressFormDirective", "ngForm"], [1, "p-formgrid", 3, "id"], [3, "ngClass"], [1, "field"], [3, "for"], ["optionLabel", "text", "appendTo", "body", 3, "options", "formControl", "autoDisplayFirst", "inputId"], [3, "field", "form", "errDef"], ["type", "input", "pInputText", "", "minlength", "5", "maxlength", "9", "appStripInvisibleChars", "", 3, "id", "formControl", "blur", "focus"], [2, "padding-right", "0px", 3, "ngClass"], [1, "field", "p-fluid"], ["type", "input", "pInputText", "", "maxlength", "40", "appStripInvisibleChars", "", 3, "id", "formControl", "blur", "focus"], ["type", "input", "pInputText", "", "placeholder", "Optional", "maxlength", "40", "appStripInvisibleChars", "", 3, "id", "formControl", "blur", "focus"], [2, "padding-bottom", "0px", 3, "ngClass"], [1, "field", 2, "margin-bottom", "0px"], ["type", "input", "pInputText", "", "maxlength", "30", "appStripInvisibleChars", "", 3, "id", "formControl", "blur", "focus"], ["size", "12", "style", "padding-bottom: 0px;", 3, "ngClass", 4, "ngIf"], [2, "padding-top", "4px"], ["style", "padding-top: 0px;", 3, "ngClass", 4, "ngIf"], [3, "form", "formName", "diffMailAddressFlag", "formBlur", "questionaireForm", "standaloneAddressForm", "checkFormIsBlur", 4, "ngIf"], ["size", "12", 2, "padding-bottom", "0px", 3, "ngClass"], [2, "padding-top", "0px", 3, "ngClass"], ["unselectable", "true", "optionLabel", "text", "optionValue", "value", "appendTo", "body", 3, "inputId", "options", "formControl"], [3, "form", "formName", "diffMailAddressFlag", "formBlur", "questionaireForm", "standaloneAddressForm", "checkFormIsBlur"], ["addressSuggestion", ""]], template: function AddressComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "form", 0, 1)(2, "div", 2)(3, "ion-row")(4, "ion-col", 3)(5, "div", 4)(6, "label", 5);
             i0.ɵɵtext(7);
             i0.ɵɵpipe(8, "translate");
@@ -31535,7 +31554,7 @@ class AddressComponent {
             i0.ɵɵelementStart(56, "ion-row", 17);
             i0.ɵɵtemplate(57, AddressComponent_ion_col_57_Template, 8, 14, "ion-col", 18)(58, AddressComponent_ion_col_58_Template, 8, 14, "ion-col", 18);
             i0.ɵɵelementEnd()()();
-            i0.ɵɵtemplate(59, AddressComponent_app_address_suggestion_59_Template, 2, 4, "app-address-suggestion", 19);
+            i0.ɵɵtemplate(59, AddressComponent_app_address_suggestion_59_Template, 2, 6, "app-address-suggestion", 19);
         } if (rf & 2) {
             const _r0 = i0.ɵɵreference(1);
             i0.ɵɵproperty("formGroup", ctx.addressForm);
@@ -31609,7 +31628,7 @@ class AddressComponent {
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.showNeighbourQuestion === true && ctx.forState === "MS");
             i0.ɵɵadvance(1);
-            i0.ɵɵproperty("ngIf", ctx.enableAddressValidation && ctx.addressForm.valid);
+            i0.ɵɵproperty("ngIf", ctx.enableAddressValidation && ctx.addressForm.valid && ((ctx.inputId === "resAddress" || ctx.inputId === "resAdress") && ctx.diffMailAddress === false || ctx.inputId === "mailAddress" && ctx.diffMailAddress === true || ctx.standaloneAddressForm === true));
         } }, styles: [".col[_ngcontent-%COMP%]{padding-top:0;padding-bottom:0}.form-lbl[_ngcontent-%COMP%]{padding-bottom:6px}.inline-flex[_ngcontent-%COMP%]{display:inline-flex}ion-col[_ngcontent-%COMP%]{padding-left:0}.app-col[_ngcontent-%COMP%]{margin-left:27px;padding-right:0}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AddressComponent, [{
@@ -31624,7 +31643,7 @@ class AddressComponent {
                         multi: true,
                         useExisting: AddressComponent
                     }
-                ], template: "<form [formGroup]=\"addressForm\" #addressFormDirective=\"ngForm\" style=\"margin-bottom: 0px; margin-left: 0px;\">\r\n  <!-- <div [formGroup]=\"addressForm\"  #addressFormDirective=\"ngForm\" > -->\r\n\r\n  <div class=\"p-formgrid\" [id]=\"inputId ? inputId : 'address-div'\">\r\n    <ion-row>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" >\r\n          <div class=\"field\">\r\n            <label [for]=\"inputId ? inputId + '-country' : 'country'\">{{'Country' | translate}}</label><br />\r\n            <app-dropdown [options]=\"countryOptions\" [formControl]=\"country\" optionLabel=\"text\" appendTo=\"body\"\r\n            [autoDisplayFirst]=\"false\" [inputId]=\"inputId ? inputId + '-country' : 'country'\" ></app-dropdown>\r\n            <app-error [class]=\"'app-grid'\" [field]='country' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                                        required: 'required'\r\n                                      }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col app-col' : 'col col-fit-content'\" >\r\n          <div class=\"field\">\r\n            <label [for]=\"inputId ? inputId + '-zip' : 'zip'\">{{'Zip code' | translate}}</label><br />\r\n            <input [id]=\"inputId ? inputId + '-zip' : 'zip'\" type=\"input\" pInputText [formControl]=\"zip\" minlength=\"5\" maxlength=\"9\" appStripInvisibleChars\r\n              (blur)=\"getAddressData($event); setFieldBlur('zip')\" (focus)=\"setFieldFocus('zip')\" /><br />\r\n            <app-error [class]=\"'app-grid'\" [field]='zip' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                required: 'required',\r\n                invalidLength: 'Zip code should be of 5 or 9 digits.',\r\n                invalidNumber: 'Zip code should only have numbers.',\r\n                invalidZipCode: 'please enter a valid zip code',\r\n              }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n    </ion-row>\r\n  \r\n\r\n    <ion-row>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" style=\"padding-right: 0px;\">\r\n        <div class=\"field p-fluid\">\r\n          <label [for]=\"inputId ? inputId + '-streetAddress' : 'streetAddress'\">{{'Street Address' | translate}}</label><br />\r\n          <input [id]=\"inputId ? inputId + '-streetAddress' : 'streetAddress'\" type=\"input\" pInputText \r\n          [formControl]=\"streetAddress\" maxlength=\"40\" (blur)=\"getAddressSuggestion(); setFieldBlur('streetAddress')\" (focus)=\"setFieldFocus('streetAddress')\" appStripInvisibleChars/><br />\r\n          <app-error [class]=\"'app-grid'\" [field]='streetAddress' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n            required: 'required'\r\n          }\"></app-error>\r\n        </div>\r\n      </ion-col>\r\n    </ion-row>\r\n\r\n    <ion-row>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\"  style=\"padding-right: 0px;\">\r\n          <div class=\"field p-fluid\">\r\n            <input [id]=\"inputId ? inputId + '-optionalAddress' : 'optionalAddress'\" type=\"input\" pInputText \r\n            [formControl]=\"optionalAddress\" placeholder=\"Optional\" (blur)=\"getAddressSuggestion();setFieldBlur('optionalAddress')\" (focus)=\"setFieldFocus('optionalAddress')\"\r\n            maxlength=\"40\" appStripInvisibleChars/>\r\n          </div>\r\n      </ion-col>\r\n    </ion-row>\r\n\r\n\r\n    <ion-row>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\"  style=\"padding-bottom: 0px;\">\r\n          <div class=\"field\" style=\"margin-bottom: 0px;\">\r\n            <label [for]=\"inputId ? inputId + '-city' : 'city'\">{{'City' | translate}}</label><br />\r\n            <input [id]=\"inputId ? inputId + '-city' : 'city'\" type=\"input\" pInputText [formControl]=\"city\" \r\n            maxlength=\"30\" (blur)=\"getAddressSuggestion(); setFieldBlur('city')\" (focus)=\"setFieldFocus('city')\" appStripInvisibleChars/><br />\r\n            <app-error [class]=\"'app-grid'\" [field]='city' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n              required: 'required'\r\n            }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col app-col' : 'col col-fit-content'\"  style=\"padding-bottom: 0px;\">\r\n          <div class=\"field\" style=\"margin-bottom: 0px;\">\r\n            <label [for]=\"inputId ? inputId + '-state' : 'state'\">{{'State' | translate}}</label><br />\r\n            <app-dropdown [options]=\"stateOptions\" [formControl]=\"state\" optionLabel=\"text\" appendTo=\"body\"\r\n            [autoDisplayFirst]=\"false\" [inputId]=\"inputId ? inputId + '-state' : 'state'\"></app-dropdown><br />\r\n          <app-error [class]=\"'app-grid'\" [field]='state' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n            required: 'required'\r\n          }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" *ngIf=\"state.value && (state.value.value==='MS' && forState==='MS' \r\n        || (state.value.value==='CT'  && forState==='MS'))  && countyRequired===true\" size=\"12\"style=\"padding-bottom: 0px;\">\r\n          <div class=\"field\" style=\"margin-bottom: 0px;\">\r\n            <label [for]=\"inputId ? inputId + '-county' : 'county'\">{{'County' | translate}}</label><br />\r\n            <app-dropdown [options]=\"countyOptions\" [formControl]=\"county\" optionLabel=\"text\" appendTo=\"body\"\r\n              [autoDisplayFirst]=\"false\" [inputId]=\"inputId ? inputId + '-county' : 'county'\"></app-dropdown><br/>\r\n            <app-error [class]=\"'app-grid'\" [field]='county' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                required: 'required'\r\n              }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" *ngIf=\"state.value && state.value.value==='ME' && forState==='ME' && countyRequired===true\" size=\"12\"  style=\"padding-bottom: 0px;\">\r\n          <div class=\"field\" style=\"margin-bottom: 0px;\">\r\n            <label [for]=\"inputId ? inputId + '-town' : 'town'\">{{'Town' | translate}}</label><br />\r\n            <app-dropdown [options]=\"townOptions\" [formControl]=\"town\" optionLabel=\"text\" appendTo=\"body\"\r\n              [autoDisplayFirst]=\"false\" [inputId]=\"inputId ? inputId + '-town' : 'town'\"></app-dropdown><br/>\r\n            <app-error [class]=\"'app-grid'\" [field]='town' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                required: 'required'\r\n              }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row style=\"padding-top: 4px;\">\r\n        <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" style=\"padding-top: 0px;\"\r\n              *ngIf=\"showNeighbourQuestion===true && forState==='ME'\" >\r\n          <div class=\"field\">\r\n          <label [for]=\"inputId ? inputId + '-neighbourFlag' : 'neighbourFlag'\">{{'Are you continuing to look for work in Maine?' | translate}}</label><br />\r\n            <p-selectButton [inputId]=\"inputId ? inputId + '-neighbourFlag' : 'neighbourFlag'\" unselectable=\"true\" [options]=\"yesNoOptions\"\r\n              [formControl]=\"neighbourFlag\" optionLabel=\"text\" optionValue=\"value\" appendTo=\"body\"></p-selectButton>\r\n              <app-error [class]=\"'app-grid'\" [field]='neighbourFlag' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                required: 'required'\r\n              }\"></app-error>\r\n          </div>\r\n        </ion-col>\r\n        <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" style=\"padding-top: 0px;\"\r\n              *ngIf=\"showNeighbourQuestion===true && forState==='MS'\" >\r\n          <div class=\"field\">\r\n          <label [for]=\"inputId ? inputId + '-neighbourFlag' : 'neighbourFlag'\">{{'Do you normally work in Mississippi?' | translate}}</label><br />\r\n            <p-selectButton [inputId]=\"inputId ? inputId + '-neighbourFlag' : 'neighbourFlag'\" unselectable=\"true\" [options]=\"yesNoOptions\"\r\n              [formControl]=\"neighbourFlag\" optionLabel=\"text\" optionValue=\"value\" appendTo=\"body\"></p-selectButton>\r\n              <app-error [class]=\"'app-grid'\" [field]='neighbourFlag' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                required: 'required'\r\n              }\"></app-error>\r\n          </div>\r\n        </ion-col>\r\n    </ion-row>\r\n  </div>\r\n  <!-- </div> -->\r\n</form>\r\n<app-address-suggestion #addressSuggestion *ngIf=\"(enableAddressValidation) && addressForm.valid\" \r\n[form]=\"addressForm\" [formName]=\"inputId\" [diffMailAddressFlag]=\"diffMailAddress\" [formblur]=\"formBlur\"></app-address-suggestion>\r\n", styles: [".col{padding-top:0;padding-bottom:0}.form-lbl{padding-bottom:6px}.inline-flex{display:inline-flex}ion-col{padding-left:0}.app-col{margin-left:27px;padding-right:0}\n"] }]
+                ], template: "<form [formGroup]=\"addressForm\" #addressFormDirective=\"ngForm\" style=\"margin-bottom: 0px; margin-left: 0px;\">\r\n  <!-- <div [formGroup]=\"addressForm\"  #addressFormDirective=\"ngForm\" > -->\r\n\r\n  <div class=\"p-formgrid\" [id]=\"inputId ? inputId : 'address-div'\">\r\n    <ion-row>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" >\r\n          <div class=\"field\">\r\n            <label [for]=\"inputId ? inputId + '-country' : 'country'\">{{'Country' | translate}}</label><br />\r\n            <app-dropdown [options]=\"countryOptions\" [formControl]=\"country\" optionLabel=\"text\" appendTo=\"body\"\r\n            [autoDisplayFirst]=\"false\" [inputId]=\"inputId ? inputId + '-country' : 'country'\" ></app-dropdown>\r\n            <app-error [class]=\"'app-grid'\" [field]='country' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                                        required: 'required'\r\n                                      }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col app-col' : 'col col-fit-content'\" >\r\n          <div class=\"field\">\r\n            <label [for]=\"inputId ? inputId + '-zip' : 'zip'\">{{'Zip code' | translate}}</label><br />\r\n            <input [id]=\"inputId ? inputId + '-zip' : 'zip'\" type=\"input\" pInputText [formControl]=\"zip\" minlength=\"5\" maxlength=\"9\" appStripInvisibleChars\r\n              (blur)=\"getAddressData($event); setFieldBlur('zip')\" (focus)=\"setFieldFocus('zip')\" /><br />\r\n            <app-error [class]=\"'app-grid'\" [field]='zip' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                required: 'required',\r\n                invalidLength: 'Zip code should be of 5 or 9 digits.',\r\n                invalidNumber: 'Zip code should only have numbers.',\r\n                invalidZipCode: 'please enter a valid zip code',\r\n              }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n    </ion-row>\r\n  \r\n\r\n    <ion-row>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" style=\"padding-right: 0px;\">\r\n        <div class=\"field p-fluid\">\r\n          <label [for]=\"inputId ? inputId + '-streetAddress' : 'streetAddress'\">{{'Street Address' | translate}}</label><br />\r\n          <input [id]=\"inputId ? inputId + '-streetAddress' : 'streetAddress'\" type=\"input\" pInputText \r\n          [formControl]=\"streetAddress\" maxlength=\"40\" (blur)=\"getAddressSuggestion(); setFieldBlur('streetAddress')\" (focus)=\"setFieldFocus('streetAddress')\" appStripInvisibleChars/><br />\r\n          <app-error [class]=\"'app-grid'\" [field]='streetAddress' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n            required: 'required'\r\n          }\"></app-error>\r\n        </div>\r\n      </ion-col>\r\n    </ion-row>\r\n\r\n    <ion-row>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\"  style=\"padding-right: 0px;\">\r\n          <div class=\"field p-fluid\">\r\n            <input [id]=\"inputId ? inputId + '-optionalAddress' : 'optionalAddress'\" type=\"input\" pInputText \r\n            [formControl]=\"optionalAddress\" placeholder=\"Optional\" (blur)=\"getAddressSuggestion();setFieldBlur('optionalAddress')\" (focus)=\"setFieldFocus('optionalAddress')\"\r\n            maxlength=\"40\" appStripInvisibleChars/>\r\n          </div>\r\n      </ion-col>\r\n    </ion-row>\r\n\r\n\r\n    <ion-row>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\"  style=\"padding-bottom: 0px;\">\r\n          <div class=\"field\" style=\"margin-bottom: 0px;\">\r\n            <label [for]=\"inputId ? inputId + '-city' : 'city'\">{{'City' | translate}}</label><br />\r\n            <input [id]=\"inputId ? inputId + '-city' : 'city'\" type=\"input\" pInputText [formControl]=\"city\" \r\n            maxlength=\"30\" (blur)=\"getAddressSuggestion(); setFieldBlur('city')\" (focus)=\"setFieldFocus('city')\" appStripInvisibleChars/><br />\r\n            <app-error [class]=\"'app-grid'\" [field]='city' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n              required: 'required'\r\n            }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col app-col' : 'col col-fit-content'\"  style=\"padding-bottom: 0px;\">\r\n          <div class=\"field\" style=\"margin-bottom: 0px;\">\r\n            <label [for]=\"inputId ? inputId + '-state' : 'state'\">{{'State' | translate}}</label><br />\r\n            <app-dropdown [options]=\"stateOptions\" [formControl]=\"state\" optionLabel=\"text\" appendTo=\"body\"\r\n            [autoDisplayFirst]=\"false\" [inputId]=\"inputId ? inputId + '-state' : 'state'\"></app-dropdown><br />\r\n          <app-error [class]=\"'app-grid'\" [field]='state' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n            required: 'required'\r\n          }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" *ngIf=\"state.value && (state.value.value==='MS' && forState==='MS' \r\n        || (state.value.value==='CT'  && forState==='MS'))  && countyRequired===true\" size=\"12\"style=\"padding-bottom: 0px;\">\r\n          <div class=\"field\" style=\"margin-bottom: 0px;\">\r\n            <label [for]=\"inputId ? inputId + '-county' : 'county'\">{{'County' | translate}}</label><br />\r\n            <app-dropdown [options]=\"countyOptions\" [formControl]=\"county\" optionLabel=\"text\" appendTo=\"body\"\r\n              [autoDisplayFirst]=\"false\" [inputId]=\"inputId ? inputId + '-county' : 'county'\"></app-dropdown><br/>\r\n            <app-error [class]=\"'app-grid'\" [field]='county' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                required: 'required'\r\n              }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n      <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" *ngIf=\"state.value && state.value.value==='ME' && forState==='ME' && countyRequired===true\" size=\"12\"  style=\"padding-bottom: 0px;\">\r\n          <div class=\"field\" style=\"margin-bottom: 0px;\">\r\n            <label [for]=\"inputId ? inputId + '-town' : 'town'\">{{'Town' | translate}}</label><br />\r\n            <app-dropdown [options]=\"townOptions\" [formControl]=\"town\" optionLabel=\"text\" appendTo=\"body\"\r\n              [autoDisplayFirst]=\"false\" [inputId]=\"inputId ? inputId + '-town' : 'town'\"></app-dropdown><br/>\r\n            <app-error [class]=\"'app-grid'\" [field]='town' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                required: 'required'\r\n              }\"></app-error>\r\n          </div>\r\n      </ion-col>\r\n    </ion-row>\r\n    <ion-row style=\"padding-top: 4px;\">\r\n        <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" style=\"padding-top: 0px;\"\r\n              *ngIf=\"showNeighbourQuestion===true && forState==='ME'\" >\r\n          <div class=\"field\">\r\n          <label [for]=\"inputId ? inputId + '-neighbourFlag' : 'neighbourFlag'\">{{'Are you continuing to look for work in Maine?' | translate}}</label><br />\r\n            <p-selectButton [inputId]=\"inputId ? inputId + '-neighbourFlag' : 'neighbourFlag'\" unselectable=\"true\" [options]=\"yesNoOptions\"\r\n              [formControl]=\"neighbourFlag\" optionLabel=\"text\" optionValue=\"value\" appendTo=\"body\"></p-selectButton>\r\n              <app-error [class]=\"'app-grid'\" [field]='neighbourFlag' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                required: 'required'\r\n              }\"></app-error>\r\n          </div>\r\n        </ion-col>\r\n        <ion-col [ngClass]=\"fromPopup ? 'col' : 'col col-fit-content'\" style=\"padding-top: 0px;\"\r\n              *ngIf=\"showNeighbourQuestion===true && forState==='MS'\" >\r\n          <div class=\"field\">\r\n          <label [for]=\"inputId ? inputId + '-neighbourFlag' : 'neighbourFlag'\">{{'Do you normally work in Mississippi?' | translate}}</label><br />\r\n            <p-selectButton [inputId]=\"inputId ? inputId + '-neighbourFlag' : 'neighbourFlag'\" unselectable=\"true\" [options]=\"yesNoOptions\"\r\n              [formControl]=\"neighbourFlag\" optionLabel=\"text\" optionValue=\"value\" appendTo=\"body\"></p-selectButton>\r\n              <app-error [class]=\"'app-grid'\" [field]='neighbourFlag' [form]=\"addressFormDirective\" [errDef]=\"{ \r\n                required: 'required'\r\n              }\"></app-error>\r\n          </div>\r\n        </ion-col>\r\n    </ion-row>\r\n  </div>\r\n  <!-- </div> -->\r\n</form>\r\n<app-address-suggestion #addressSuggestion *ngIf=\"(enableAddressValidation) && this.addressForm.valid  && (((inputId==='resAddress' || inputId==='resAdress') && diffMailAddress=== false) || (inputId==='mailAddress' && diffMailAddress=== true) || (standaloneAddressForm === true))\"\r\n[form]=\"addressForm\" [formName]=\"inputId\" [diffMailAddressFlag]=\"diffMailAddress\" [formBlur]=\"checkFormBlurr()\" (checkFormIsBlur)=\"checkFormBlurr()\" [questionaireForm]=\"questionaireForm\" [standaloneAddressForm]=\"standaloneAddressForm\"></app-address-suggestion>\r\n", styles: [".col{padding-top:0;padding-bottom:0}.form-lbl{padding-bottom:6px}.inline-flex{display:inline-flex}ion-col{padding-left:0}.app-col{margin-left:27px;padding-right:0}\n"] }]
     }], () => [{ type: i1$4.UntypedFormBuilder }, { type: UtilService }, { type: QuestionnaireService }, { type: LoggerService }, { type: DmsService }], { addressFormDirective: [{
             type: ViewChild,
             args: ['addressFormDirective', { static: false }]
@@ -31647,6 +31666,10 @@ class AddressComponent {
             type: Input
         }], enableAddressValidation: [{
             type: Input
+        }], questionaireForm: [{
+            type: Input
+        }], standaloneAddressForm: [{
+            type: Input
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AddressComponent, { className: "AddressComponent", filePath: "lib\\components\\address\\address.component.ts", lineNumber: 29 }); })();
 class AddressFieldFocusStatus {
@@ -35679,18 +35702,20 @@ function AddParticipantComponent_form_6_div_16_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const ctx_r16 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 14, "add.participant.lawyer.name"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 17, "add.participant.lawyer.name"));
     i0.ɵɵadvance(2);
     i0.ɵɵpropertyInterpolate("placeholder", (ctx_r16.role.value == null ? null : ctx_r16.role.value.value) == "ATNY" ? "Attorney Name" : "Representatative Name");
     i0.ɵɵadvance(1);
     i0.ɵɵclassMap("app-grid");
-    i0.ɵɵproperty("field", ctx_r16.name)("form", ctx_r16.userForm)("errDef", i0.ɵɵpureFunction0(18, _c5$5));
+    i0.ɵɵproperty("field", ctx_r16.name)("form", ctx_r16.userForm)("errDef", i0.ɵɵpureFunction0(21, _c5$5));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(10, 16, "add.participant.lawyer.phone"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(10, 19, "add.participant.lawyer.phone"));
     i0.ɵɵadvance(3);
     i0.ɵɵclassMap("app-grid block mb-2");
-    i0.ɵɵproperty("field", ctx_r16.phone)("form", ctx_r16.userForm)("errDef", i0.ɵɵpureFunction0(19, _c5$5));
-    i0.ɵɵadvance(5);
+    i0.ɵɵproperty("field", ctx_r16.phone)("form", ctx_r16.userForm)("errDef", i0.ɵɵpureFunction0(22, _c5$5));
+    i0.ɵɵadvance(3);
+    i0.ɵɵproperty("enableAddressValidation", ctx_r16.isAddressValidationEnabled)("inputId", "address")("standaloneAddressForm", true);
+    i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", !ctx_r16.util.isState("ME"));
 } }
 function AddParticipantComponent_form_6_div_17_Template(rf, ctx) { if (rf & 1) {
@@ -35749,7 +35774,7 @@ function AddParticipantComponent_form_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(14, "p-selectButton", 17);
     i0.ɵɵtemplate(15, AddParticipantComponent_form_6_span_15_Template, 3, 3, "span", 18);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(16, AddParticipantComponent_form_6_div_16_Template, 23, 20, "div", 19)(17, AddParticipantComponent_form_6_div_17_Template, 18, 18, "div", 20);
+    i0.ɵɵtemplate(16, AddParticipantComponent_form_6_div_16_Template, 23, 23, "div", 19)(17, AddParticipantComponent_form_6_div_17_Template, 18, 18, "div", 20);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r4 = i0.ɵɵnextContext();
@@ -35780,6 +35805,7 @@ class AddParticipantComponent {
         this.visible = false;
         this.indexToEdit = null;
         this.roles = [];
+        this.isAddressValidationEnabled = LibConstants.isAddressValidationEnabled == 'true';
         this.participantList = [];
         this.userForm = this.fb.group({
             name: new FormControl(null, Validators.required),
@@ -35963,7 +35989,7 @@ class AddParticipantComponent {
                     provide: NG_VALUE_ACCESSOR,
                     useExisting: AddParticipantComponent,
                     multi: true
-                }])], decls: 7, vars: 3, consts: [[3, "rowHover", "value"], ["dt", ""], ["pTemplate", "header"], ["pTemplate", "body"], ["pTemplate", "footer"], [1, "align"], ["style", "margin-left:16px", 3, "formGroup", "ngSubmit", 4, "ngIf"], ["fill", "outline", "size", "small", 1, "action-button", 3, "click"], [1, "action-icon", 3, "icon"], [3, "innerHtml"], [1, "col-offset-4", "action-button"], ["fill", "outline", "size", "small", "shape", "square", 1, "action-button", 3, "click"], [2, "margin-left", "16px", 3, "formGroup", "ngSubmit"], ["participantForm", "ngForm"], [1, "field-grid"], [1, "heading"], [2, "padding-left", "0px"], ["optionLabel", "name", "formControlName", "role", "required", "", "optionDisabled", "disabledRole", 3, "options"], ["class", "help-block", 4, "ngIf"], ["class", "formgrid grid", "style", "margin-top:10px", 4, "ngIf"], ["class", "formgrid grid", 4, "ngIf"], [1, "help-block"], [1, "formgrid", "grid", 2, "margin-top", "10px"], [1, "field", "col-4", "md:col-2"], [2, "margin", "4px"], ["type", "text", "pInputText", "", "formControlName", "name", 1, "text-base", "text-color", "surface-overlay", "p-2", "border-1", "border-solid", "surface-border", "border-round", "appearance-none", "outline-none", "focus:border-primary", "w-full", 3, "placeholder"], [3, "field", "form", "errDef"], [1, "field", "col-4", "md:col-9"], [1, "block", "mb-2"], ["mask", "999-999-9999", "placeholder", "999-999-9999", "formControlName", "phone", "unmask", "true"], [1, "field", "col-4", "md:col-9", "field-grid"], ["formControlName", "address"], ["participantAddress", ""], ["class", "field col-4 md:col-9 field-grid", 4, "ngIf"], ["fill", "outline", "shape", "round", 1, "col-offset-3", 3, "click"], ["fill", "outline", "shape", "round", "type", "submit", 1, "col-offset-1", 3, "click"], [2, "padding", "10px 0 0 2px"], [1, "formgrid", "grid"], [2, "margin", "10px 0px"], ["type", "text", "pInputText", "", "formControlName", "name", "placeholder", "Witness Name", 1, "text-base", "text-color", "surface-overlay", "p-2", "border-1", "border-solid", "surface-border", "border-round", "appearance-none", "outline-none", "focus:border-primary", "w-full"], [1, "field", "col-4", "md:col-9", 2, "padding-top", "12px"], [1, "field", "col-12", "md:col-9", 2, "margin-top", "20px"], ["type", "submit", "fill", "outline", "shape", "round", 1, "col-offset-1", 3, "click"]], template: function AddParticipantComponent_Template(rf, ctx) { if (rf & 1) {
+                }])], decls: 7, vars: 3, consts: [[3, "rowHover", "value"], ["dt", ""], ["pTemplate", "header"], ["pTemplate", "body"], ["pTemplate", "footer"], [1, "align"], ["style", "margin-left:16px", 3, "formGroup", "ngSubmit", 4, "ngIf"], ["fill", "outline", "size", "small", 1, "action-button", 3, "click"], [1, "action-icon", 3, "icon"], [3, "innerHtml"], [1, "col-offset-4", "action-button"], ["fill", "outline", "size", "small", "shape", "square", 1, "action-button", 3, "click"], [2, "margin-left", "16px", 3, "formGroup", "ngSubmit"], ["participantForm", "ngForm"], [1, "field-grid"], [1, "heading"], [2, "padding-left", "0px"], ["optionLabel", "name", "formControlName", "role", "required", "", "optionDisabled", "disabledRole", 3, "options"], ["class", "help-block", 4, "ngIf"], ["class", "formgrid grid", "style", "margin-top:10px", 4, "ngIf"], ["class", "formgrid grid", 4, "ngIf"], [1, "help-block"], [1, "formgrid", "grid", 2, "margin-top", "10px"], [1, "field", "col-4", "md:col-2"], [2, "margin", "4px"], ["type", "text", "pInputText", "", "formControlName", "name", 1, "text-base", "text-color", "surface-overlay", "p-2", "border-1", "border-solid", "surface-border", "border-round", "appearance-none", "outline-none", "focus:border-primary", "w-full", 3, "placeholder"], [3, "field", "form", "errDef"], [1, "field", "col-4", "md:col-9"], [1, "block", "mb-2"], ["mask", "999-999-9999", "placeholder", "999-999-9999", "formControlName", "phone", "unmask", "true"], [1, "field", "col-4", "md:col-9", "field-grid"], ["formControlName", "address", 3, "enableAddressValidation", "inputId", "standaloneAddressForm"], ["participantAddress", ""], ["class", "field col-4 md:col-9 field-grid", 4, "ngIf"], ["fill", "outline", "shape", "round", 1, "col-offset-3", 3, "click"], ["fill", "outline", "shape", "round", "type", "submit", 1, "col-offset-1", 3, "click"], [2, "padding", "10px 0 0 2px"], [1, "formgrid", "grid"], [2, "margin", "10px 0px"], ["type", "text", "pInputText", "", "formControlName", "name", "placeholder", "Witness Name", 1, "text-base", "text-color", "surface-overlay", "p-2", "border-1", "border-solid", "surface-border", "border-round", "appearance-none", "outline-none", "focus:border-primary", "w-full"], [1, "field", "col-4", "md:col-9", 2, "padding-top", "12px"], [1, "field", "col-12", "md:col-9", 2, "margin-top", "20px"], ["type", "submit", "fill", "outline", "shape", "round", 1, "col-offset-1", 3, "click"]], template: function AddParticipantComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "p-table", 0, 1);
             i0.ɵɵtemplate(2, AddParticipantComponent_ng_template_2_Template, 11, 9, "ng-template", 2)(3, AddParticipantComponent_ng_template_3_Template, 15, 7, "ng-template", 3)(4, AddParticipantComponent_ng_template_4_Template, 9, 5, "ng-template", 4);
             i0.ɵɵelementEnd();
@@ -35982,7 +36008,7 @@ class AddParticipantComponent {
                         provide: NG_VALUE_ACCESSOR,
                         useExisting: AddParticipantComponent,
                         multi: true
-                    }], template: "<p-table #dt [rowHover]=\"true\" [value]=\"participantList\" >\r\n  <ng-template pTemplate=\"header\" let-columns >\r\n    <tr >\r\n      <th> {{\"add.participant.header.participantRole\"|translate}}</th>\r\n      <th>{{\"add.participant.header.name\"|translate}}</th>\r\n      <th> {{\"add.participant.header.phone\"|translate}}</th>\r\n      <th></th>\r\n    </tr>\r\n  </ng-template>\r\n  <ng-template pTemplate=\"body\" let-participant let-rowIndex=\"rowIndex\">\r\n    <tr >\r\n\r\n      <td ><span>{{participant.role.name}}</span></td>\r\n      <td><span>{{participant.name}}</span></td>\r\n      <td><span>{{participant.phone}}</span></td>\r\n      <td>\r\n        <ion-button fill=\"outline\" (click)=\"editItem(participant)\"  size=\"small\" class=\"action-button\">\r\n          <fa-icon [icon]=\"['fal', 'edit']\" class=\"action-icon\"></fa-icon>\r\n        </ion-button>\r\n        <ion-button (click)=\"removeItem(participant)\" fill=\"outline\"  size=\"small\" class=\"action-button\">\r\n          <fa-icon [icon]=\"['fal', 'trash-alt']\" class=\"action-icon\"></fa-icon>\r\n        </ion-button>\r\n      </td>\r\n    </tr>\r\n  </ng-template>\r\n  <ng-template pTemplate=\"footer\" let-columns>\r\n    <tr>\r\n      <td><span [innerHtml]=\"'add.participant.footer.addElement'|translate\"></span></td>\r\n      <td></td>\r\n      <td></td>\r\n      <td class=\"col-offset-4 action-button\">\r\n        <ion-button (click)=\"addRole()\" fill=\"outline\" size=\"small\" shape=\"square\" class=\"action-button\">\r\n          <fa-icon [icon]=\"['fal', 'plus']\" class=\"action-icon\"></fa-icon>\r\n        </ion-button>\r\n      </td>\r\n    </tr>\r\n  </ng-template>\r\n</p-table>\r\n<div class=\"align\">\r\n<form [formGroup]=\"userForm\" *ngIf=\"visible\" (ngSubmit)=\"onSubmit()\" #participantForm=\"ngForm\" style=\"margin-left:16px\">\r\n  <div class=\"field-grid\">\r\n    <br>\r\n    <h1 class=\"heading\">{{\"add.participant.header.heading\"|translate}}</h1>\r\n    <br>\r\n  </div>\r\n  <div class=\"field-grid\"><label> {{isAppealLevelSecond =='N' ? (\"add.participant.header.question\"|translate) : (\"add.participant.header.appealLevel2Question\"|translate)}}</label></div>\r\n  \r\n  <div style=\"padding-left: 0px;\">\r\n    <p-selectButton [options]=\"roles\" optionLabel=\"name\" formControlName=\"role\" required optionDisabled=\"disabledRole\"\r\n      [class.has-error]=\"role.dirty && role.invalid\">\r\n    </p-selectButton>\r\n    <span class=\"help-block\" *ngIf=\"role.dirty && role.invalid\">{{\"induction.required\"| translate}}</span>\r\n  </div>\r\n  <div class=\"formgrid grid\" *ngIf=\"role.value?.value =='ATNY' || role.value?.value=='RPRT'\" style=\"margin-top:10px\">\r\n    <div class=\"field col-4 md:col-2\"><label style=\"margin:4px\">{{\"add.participant.lawyer.name\"|translate}}</label>\r\n      <input type=\"text\" pInputText formControlName=\"name\" placeholder=\"{{role.value?.value =='ATNY' ? 'Attorney Name' : 'Representatative Name'}}\"\r\n        class=\"text-base text-color surface-overlay p-2 border-1 border-solid surface-border border-round appearance-none outline-none focus:border-primary w-full\"/>\r\n      <app-error [class]=\"'app-grid'\" [field]='name' [form]=\"userForm\" [errDef]=\"{ \r\n          required: 'Required.'}\">\r\n      </app-error>\r\n    </div>\r\n\r\n    <div class=\"field col-4 md:col-9\"><span\r\n        class=\"block mb-2\">{{\"add.participant.lawyer.phone\"|translate}}</span>\r\n      <p-inputMask mask=\"999-999-9999\" placeholder=\"999-999-9999\" formControlName=\"phone\" unmask=\"true\"></p-inputMask>\r\n      <app-error [class]=\"'app-grid block mb-2'\" [field]='phone' [form]=\"userForm\" [errDef]=\"{ \r\n        required: 'Required.'}\">\r\n      </app-error>\r\n    </div>\r\n    <br />\r\n\r\n    <div class=\"field col-4 md:col-9 field-grid\">\r\n      <app-address #participantAddress formControlName=\"address\"></app-address>\r\n      <div *ngIf=\"!util.isState('ME')\" class=\"field col-4 md:col-9 field-grid\"><label style=\"padding: 10px 0 0 2px\">{{\"add.participant.footer.declaration\"|translate}}</label></div>\r\n    </div>\r\n    <div class=\"field col-4 md:col-9\">\r\n      <ion-button (click)=\"close()\" fill=\"outline\" shape=\"round\" class=\"col-offset-3\">Clear</ion-button>\r\n      <ion-button (click)=\"onSubmit()\" fill=\"outline\" shape=\"round\" type=\"submit\" class=\"col-offset-1\">Save</ion-button>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"formgrid grid\" *ngIf=\"role.value?.value =='WITN'\">\r\n    <div class=\"field col-4 md:col-2\"><label style=\"margin:10px 0px\">{{\"add.participant.observer.name\"|translate}}</label>\r\n      <input type=\"text\" pInputText formControlName=\"name\" placeholder=\"Witness Name\"\r\n        class=\"text-base text-color surface-overlay p-2 border-1 border-solid surface-border border-round appearance-none outline-none focus:border-primary w-full\">\r\n      <app-error [class]=\"'app-grid'\" [field]='name' [form]=\"userForm\" [errDef]=\"{ \r\n          required: 'Required.'}\">\r\n      </app-error>\r\n    </div>\r\n\r\n    <div class=\"field col-4 md:col-9\" style=\"padding-top:12px\">\r\n      <span class=\"block mb-2\">{{\"add.participant.observer.phone\"|translate}}</span>\r\n      <p-inputMask mask=\"999-999-9999\" placeholder=\"999-999-9999\" formControlName=\"phone\" unmask=\"true\"></p-inputMask>\r\n      <app-error [class]=\"'app-grid block mb-2'\" [field]='phone' [form]=\"userForm\" [errDef]=\"{ \r\n        required: 'Required.'}\">\r\n      </app-error>\r\n    </div>\r\n    <div class=\"field col-12 md:col-9\" style=\"margin-top: 20px;\">\r\n      <ion-button (click)=\"close()\" fill=\"outline\" shape=\"round\" class=\"col-offset-3\">Clear</ion-button>\r\n\r\n      <ion-button (click)=\"onSubmit()\" type=\"submit\" fill=\"outline\" shape=\"round\" class=\"col-offset-1\">Save</ion-button>\r\n    </div>\r\n  </div>\r\n</form>\r\n</div>", styles: [".help-block{color:red}p-table{margin:0 -16px}.align{margin:0 -16px}:host ::ng-deep p-selectbutton.ng-dirty.ng-invalid>.p-selectbutton>.p-button{border:1px solid red!important;color:red!important}:host ::ng-deep .p-selectbutton .p-button{margin-top:15px!important}:host ::ng-deep .p-datatable.app-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable.app-datatable .p-datatable-tfoot>tr>td{padding-left:17px!important}:host ::ng-deep th{width:300px;font-weight:700!important}\n"] }]
+                    }], template: "<p-table #dt [rowHover]=\"true\" [value]=\"participantList\" >\r\n  <ng-template pTemplate=\"header\" let-columns >\r\n    <tr >\r\n      <th> {{\"add.participant.header.participantRole\"|translate}}</th>\r\n      <th>{{\"add.participant.header.name\"|translate}}</th>\r\n      <th> {{\"add.participant.header.phone\"|translate}}</th>\r\n      <th></th>\r\n    </tr>\r\n  </ng-template>\r\n  <ng-template pTemplate=\"body\" let-participant let-rowIndex=\"rowIndex\">\r\n    <tr >\r\n\r\n      <td ><span>{{participant.role.name}}</span></td>\r\n      <td><span>{{participant.name}}</span></td>\r\n      <td><span>{{participant.phone}}</span></td>\r\n      <td>\r\n        <ion-button fill=\"outline\" (click)=\"editItem(participant)\"  size=\"small\" class=\"action-button\">\r\n          <fa-icon [icon]=\"['fal', 'edit']\" class=\"action-icon\"></fa-icon>\r\n        </ion-button>\r\n        <ion-button (click)=\"removeItem(participant)\" fill=\"outline\"  size=\"small\" class=\"action-button\">\r\n          <fa-icon [icon]=\"['fal', 'trash-alt']\" class=\"action-icon\"></fa-icon>\r\n        </ion-button>\r\n      </td>\r\n    </tr>\r\n  </ng-template>\r\n  <ng-template pTemplate=\"footer\" let-columns>\r\n    <tr>\r\n      <td><span [innerHtml]=\"'add.participant.footer.addElement'|translate\"></span></td>\r\n      <td></td>\r\n      <td></td>\r\n      <td class=\"col-offset-4 action-button\">\r\n        <ion-button (click)=\"addRole()\" fill=\"outline\" size=\"small\" shape=\"square\" class=\"action-button\">\r\n          <fa-icon [icon]=\"['fal', 'plus']\" class=\"action-icon\"></fa-icon>\r\n        </ion-button>\r\n      </td>\r\n    </tr>\r\n  </ng-template>\r\n</p-table>\r\n<div class=\"align\">\r\n<form [formGroup]=\"userForm\" *ngIf=\"visible\" (ngSubmit)=\"onSubmit()\" #participantForm=\"ngForm\" style=\"margin-left:16px\">\r\n  <div class=\"field-grid\">\r\n    <br>\r\n    <h1 class=\"heading\">{{\"add.participant.header.heading\"|translate}}</h1>\r\n    <br>\r\n  </div>\r\n  <div class=\"field-grid\"><label> {{isAppealLevelSecond =='N' ? (\"add.participant.header.question\"|translate) : (\"add.participant.header.appealLevel2Question\"|translate)}}</label></div>\r\n  \r\n  <div style=\"padding-left: 0px;\">\r\n    <p-selectButton [options]=\"roles\" optionLabel=\"name\" formControlName=\"role\" required optionDisabled=\"disabledRole\"\r\n      [class.has-error]=\"role.dirty && role.invalid\">\r\n    </p-selectButton>\r\n    <span class=\"help-block\" *ngIf=\"role.dirty && role.invalid\">{{\"induction.required\"| translate}}</span>\r\n  </div>\r\n  <div class=\"formgrid grid\" *ngIf=\"role.value?.value =='ATNY' || role.value?.value=='RPRT'\" style=\"margin-top:10px\">\r\n    <div class=\"field col-4 md:col-2\"><label style=\"margin:4px\">{{\"add.participant.lawyer.name\"|translate}}</label>\r\n      <input type=\"text\" pInputText formControlName=\"name\" placeholder=\"{{role.value?.value =='ATNY' ? 'Attorney Name' : 'Representatative Name'}}\"\r\n        class=\"text-base text-color surface-overlay p-2 border-1 border-solid surface-border border-round appearance-none outline-none focus:border-primary w-full\"/>\r\n      <app-error [class]=\"'app-grid'\" [field]='name' [form]=\"userForm\" [errDef]=\"{ \r\n          required: 'Required.'}\">\r\n      </app-error>\r\n    </div>\r\n\r\n    <div class=\"field col-4 md:col-9\"><span\r\n        class=\"block mb-2\">{{\"add.participant.lawyer.phone\"|translate}}</span>\r\n      <p-inputMask mask=\"999-999-9999\" placeholder=\"999-999-9999\" formControlName=\"phone\" unmask=\"true\"></p-inputMask>\r\n      <app-error [class]=\"'app-grid block mb-2'\" [field]='phone' [form]=\"userForm\" [errDef]=\"{ \r\n        required: 'Required.'}\">\r\n      </app-error>\r\n    </div>\r\n    <br />\r\n\r\n    <div class=\"field col-4 md:col-9 field-grid\">\r\n      <app-address #participantAddress [enableAddressValidation]=\"isAddressValidationEnabled\" [inputId]=\"'address'\" [standaloneAddressForm]=\"true\" formControlName=\"address\"></app-address>\r\n      <div *ngIf=\"!util.isState('ME')\" class=\"field col-4 md:col-9 field-grid\"><label style=\"padding: 10px 0 0 2px\">{{\"add.participant.footer.declaration\"|translate}}</label></div>\r\n    </div>\r\n    <div class=\"field col-4 md:col-9\">\r\n      <ion-button (click)=\"close()\" fill=\"outline\" shape=\"round\" class=\"col-offset-3\">Clear</ion-button>\r\n      <ion-button (click)=\"onSubmit()\" fill=\"outline\" shape=\"round\" type=\"submit\" class=\"col-offset-1\">Save</ion-button>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"formgrid grid\" *ngIf=\"role.value?.value =='WITN'\">\r\n    <div class=\"field col-4 md:col-2\"><label style=\"margin:10px 0px\">{{\"add.participant.observer.name\"|translate}}</label>\r\n      <input type=\"text\" pInputText formControlName=\"name\" placeholder=\"Witness Name\"\r\n        class=\"text-base text-color surface-overlay p-2 border-1 border-solid surface-border border-round appearance-none outline-none focus:border-primary w-full\">\r\n      <app-error [class]=\"'app-grid'\" [field]='name' [form]=\"userForm\" [errDef]=\"{ \r\n          required: 'Required.'}\">\r\n      </app-error>\r\n    </div>\r\n\r\n    <div class=\"field col-4 md:col-9\" style=\"padding-top:12px\">\r\n      <span class=\"block mb-2\">{{\"add.participant.observer.phone\"|translate}}</span>\r\n      <p-inputMask mask=\"999-999-9999\" placeholder=\"999-999-9999\" formControlName=\"phone\" unmask=\"true\"></p-inputMask>\r\n      <app-error [class]=\"'app-grid block mb-2'\" [field]='phone' [form]=\"userForm\" [errDef]=\"{ \r\n        required: 'Required.'}\">\r\n      </app-error>\r\n    </div>\r\n    <div class=\"field col-12 md:col-9\" style=\"margin-top: 20px;\">\r\n      <ion-button (click)=\"close()\" fill=\"outline\" shape=\"round\" class=\"col-offset-3\">Clear</ion-button>\r\n\r\n      <ion-button (click)=\"onSubmit()\" type=\"submit\" fill=\"outline\" shape=\"round\" class=\"col-offset-1\">Save</ion-button>\r\n    </div>\r\n  </div>\r\n</form>\r\n</div>", styles: [".help-block{color:red}p-table{margin:0 -16px}.align{margin:0 -16px}:host ::ng-deep p-selectbutton.ng-dirty.ng-invalid>.p-selectbutton>.p-button{border:1px solid red!important;color:red!important}:host ::ng-deep .p-selectbutton .p-button{margin-top:15px!important}:host ::ng-deep .p-datatable.app-datatable .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable.app-datatable .p-datatable-tfoot>tr>td{padding-left:17px!important}:host ::ng-deep th{width:300px;font-weight:700!important}\n"] }]
     }], () => [{ type: i1$4.FormBuilder }, { type: UtilService }, { type: ValidationService }, { type: AppealService }], { participantAddress: [{
             type: ViewChild,
             args: ['participantAddress', { static: false }]
@@ -35992,7 +36018,7 @@ class AddParticipantComponent {
         }], dynamicParam: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AddParticipantComponent, { className: "AddParticipantComponent", filePath: "lib\\components\\add-participant\\add-participant.component.ts", lineNumber: 21 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AddParticipantComponent, { className: "AddParticipantComponent", filePath: "lib\\components\\add-participant\\add-participant.component.ts", lineNumber: 22 }); })();
 
 const _c0$n = a1 => ["far", a1];
 function DashboardCardComponent_ion_card_content_4_p_scrollPanel_1_ion_row_1_fa_icon_2_Template(rf, ctx) { if (rf & 1) {
@@ -42071,6 +42097,7 @@ class ProofOfAnythingComponent {
     }
     ngOnInit() {
         console.log(this.uploadTypeId);
+        console.log(this.data);
         this.clm.validateUpload(this.uploadTypeId).subscribe(res => {
             console.log(res);
             if (res === true) {
@@ -42130,6 +42157,9 @@ class ProofOfAnythingComponent {
         this.presentToast(msg, 'danger', position ? position : 'bottom');
     }
     saveDocs() {
+        if (this.data != null) {
+            this.fileObjectsArray.data = this.data;
+        }
         this.clm.clmuploadFile(this.fileObjectsArray).subscribe(res => {
             console.log("documents uploaded successfully");
             this.successDtls = "Documents uploaded successfully";
@@ -42174,7 +42204,7 @@ class ProofOfAnythingComponent {
         }
     }
     static { this.ɵfac = function ProofOfAnythingComponent_Factory(t) { return new (t || ProofOfAnythingComponent)(i0.ɵɵdirectiveInject(LoggerService), i0.ɵɵdirectiveInject(ClaimantService), i0.ɵɵdirectiveInject(i4.ToastController), i0.ɵɵdirectiveInject(i6$1.DomSanitizer), i0.ɵɵdirectiveInject(UtilService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ProofOfAnythingComponent, selectors: [["app-proof-of-anything"]], inputs: { uploadTypeId: "uploadTypeId", employerDataModel: "employerDataModel" }, outputs: { cancel: "cancel", success: "success" }, decls: 4, vars: 10, consts: [["appendTo", "body", "position", "top", 3, "visible", "modal", "breakpoints"], ["class", "ion-text-center ion-padding-top", 4, "ngIf"], [4, "ngIf"], [1, "ion-text-center", "ion-padding-top"], ["name", "alert-circle-outline", 2, "font-size", "60px", "color", "var(--ion-color-danger)"], [1, "ion-text-center", "ion-padding", 2, "color", "var(--ion-color-danger)", "font-size", "larger", 3, "innerHTML"], [1, "pb-4"], [1, "ion-text-left", "heading"], [3, "innerHTML"], [1, "field"], [1, "label-text", 3, "innerHTML"], ["multiple", "true", "proofOfAnything", "true", 3, "selectedDocumentType", "docUploadModel", "docType", "allowedFileType", "iconInfo", "employerDataModel", "files", "upload", "uploadEmployerFile", "docForm", 4, "ngIf"], ["style", "color: var(--ion-color-green)", 4, "ngIf"], ["class", "ion-text-center", 4, "ngIf"], [1, "ion-padding"], [1, "ion-text-right"], ["shape", "round", "type", "button", "color", "primary", "fill", "outline", 2, "margin-right", "3rem", 3, "click"], ["shape", "round", "fill", "solid", "type", "submit", 3, "click"], ["multiple", "true", "proofOfAnything", "true", 3, "selectedDocumentType", "docUploadModel", "docType", "allowedFileType", "iconInfo", "employerDataModel", "files", "upload", "uploadEmployerFile", "docForm"], [2, "color", "var(--ion-color-green)"], [1, "ion-text-center"], ["name", "dots"]], template: function ProofOfAnythingComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ProofOfAnythingComponent, selectors: [["app-proof-of-anything"]], inputs: { uploadTypeId: "uploadTypeId", employerDataModel: "employerDataModel", data: "data" }, outputs: { cancel: "cancel", success: "success" }, decls: 4, vars: 10, consts: [["appendTo", "body", "position", "top", 3, "visible", "modal", "breakpoints"], ["class", "ion-text-center ion-padding-top", 4, "ngIf"], [4, "ngIf"], [1, "ion-text-center", "ion-padding-top"], ["name", "alert-circle-outline", 2, "font-size", "60px", "color", "var(--ion-color-danger)"], [1, "ion-text-center", "ion-padding", 2, "color", "var(--ion-color-danger)", "font-size", "larger", 3, "innerHTML"], [1, "pb-4"], [1, "ion-text-left", "heading"], [3, "innerHTML"], [1, "field"], [1, "label-text", 3, "innerHTML"], ["multiple", "true", "proofOfAnything", "true", 3, "selectedDocumentType", "docUploadModel", "docType", "allowedFileType", "iconInfo", "employerDataModel", "files", "upload", "uploadEmployerFile", "docForm", 4, "ngIf"], ["style", "color: var(--ion-color-green)", 4, "ngIf"], ["class", "ion-text-center", 4, "ngIf"], [1, "ion-padding"], [1, "ion-text-right"], ["shape", "round", "type", "button", "color", "primary", "fill", "outline", 2, "margin-right", "3rem", 3, "click"], ["shape", "round", "fill", "solid", "type", "submit", 3, "click"], ["multiple", "true", "proofOfAnything", "true", 3, "selectedDocumentType", "docUploadModel", "docType", "allowedFileType", "iconInfo", "employerDataModel", "files", "upload", "uploadEmployerFile", "docForm"], [2, "color", "var(--ion-color-green)"], [1, "ion-text-center"], ["name", "dots"]], template: function ProofOfAnythingComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "p-dialog", 0);
             i0.ɵɵtemplate(1, ProofOfAnythingComponent_div_1_Template, 3, 1, "div", 1)(2, ProofOfAnythingComponent_ion_grid_2_Template, 21, 6, "ion-grid", 2)(3, ProofOfAnythingComponent_ion_grid_3_Template, 5, 0, "ion-grid", 2);
             i0.ɵɵelementEnd();
@@ -42196,6 +42226,8 @@ class ProofOfAnythingComponent {
             type: Input
         }], employerDataModel: [{
             type: Input
+        }], data: [{
+            type: Input
         }], cancel: [{
             type: Output
         }], success: [{
@@ -43061,19 +43093,22 @@ class AddressSuggestionComponent {
     constructor(addrSvc) {
         this.addrSvc = addrSvc;
         this.choices = [];
-        this.formBlur = true;
-        // @Output() lastValidAddress = new EventEmitter<any>();
+        this.checkFormIsBlur = new EventEmitter();
         this.picked = null;
         this.showInlineError = false;
         this.msuaCount = 0;
         this.aunrCount = 0;
     }
     ngOnInit() {
-        if (this.formBlur) {
+        this.checkFormIsBlur.emit();
+        if (this.formBlur && this.form.valid) {
             this.getValidateAddress(true);
         }
     }
     getValidateAddress(initialValidation) {
+        let checkIfValidateCorrectAddress = (((this.formName === 'resAddress' || this.formName === 'resAdress') && this.diffMailAddressFlag === false) || (this.formName === 'mailAddress' && this.diffMailAddressFlag === true) || (this.standaloneAddressForm === true));
+        if (!checkIfValidateCorrectAddress)
+            return;
         if (!initialValidation && this.form.pristine === true)
             return;
         if (this.msuaCount >= 2) {
@@ -43090,14 +43125,24 @@ class AddressSuggestionComponent {
             this.setIsAddressValideController(res.isAddressValidated);
             if (this.isAddressValid === '1') {
                 this.lastValidAddress = res.lastValidatedAddress;
+                this.setIsAddressValideController('1');
+            }
+            else if (this.isAddressValid === '0') {
+                this.setIsAddressValideController('0');
             }
             if (res.lastValidateResult === "MUSA") {
                 this.msuaCount += 1;
                 this.aunrCount = 0;
+                this.setIsAddressValideController('0');
             }
             if (res.lastValidateResult === "AUNR") {
                 this.aunrCount += 1;
                 this.msuaCount = 0;
+                this.setIsAddressValideController('0');
+            }
+            console.log("THIS IS validate result", res.lastValidateResult);
+            if (res.lastValidateResult === "NREC") {
+                this.setIsAddressValideController('1');
             }
             if (res.showPopup === true) {
                 this.setIsAddressValideController('1');
@@ -43157,8 +43202,8 @@ class AddressSuggestionComponent {
     }
     setIsAddressValideController(flag) {
         this.isAddressValid = flag;
-        if (this.form.controls['hidIsAddressValidated']) {
-            this.form.controls['hidIsAddressValidated'].setValue(this.isAddressValid);
+        if (this.questionaireForm?.form?.controls['hidIsAddressValidated']) {
+            this.questionaireForm.form.controls['hidIsAddressValidated'].setValue(this.isAddressValid);
         }
     }
     mapAddress(sel, isOrigin) {
@@ -43186,17 +43231,17 @@ class AddressSuggestionComponent {
         }
     }
     static { this.ɵfac = function AddressSuggestionComponent_Factory(t) { return new (t || AddressSuggestionComponent)(i0.ɵɵdirectiveInject(AddressValidationService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AddressSuggestionComponent, selectors: [["app-address-suggestion"]], inputs: { original: "original", choices: "choices", form: "form", formName: "formName", diffMailAddressFlag: "diffMailAddressFlag", formBlur: "formBlur" }, decls: 2, vars: 2, consts: [["styleClass", "red-header", 3, "activeIndex", "onOpen", "onClose", 4, "ngIf"], ["class", "error-banner", 4, "ngIf"], ["styleClass", "red-header", 3, "activeIndex", "onOpen", "onClose"], ["pTemplate", "header"], ["pTemplate", "content"], [3, "ngModel", "ngModelChange", "ionChange"], [1, "label-heading"], ["slot", "start", 3, "value"], ["lines", "none"], [4, "ngFor", "ngForOf"], [1, "error-banner"], ["name", "alert-circle-outline", 2, "color", "var(--ion-color-danger)", "font-size", "18px", "margin-right", "8px"]], template: function AddressSuggestionComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AddressSuggestionComponent, selectors: [["app-address-suggestion"]], inputs: { original: "original", choices: "choices", form: "form", formName: "formName", diffMailAddressFlag: "diffMailAddressFlag", formBlur: "formBlur", standaloneAddressForm: "standaloneAddressForm", questionaireForm: "questionaireForm" }, outputs: { checkFormIsBlur: "checkFormIsBlur" }, decls: 2, vars: 2, consts: [["styleClass", "red-header", 3, "activeIndex", "onOpen", "onClose", 4, "ngIf"], ["class", "error-banner", 4, "ngIf"], ["styleClass", "red-header", 3, "activeIndex", "onOpen", "onClose"], ["pTemplate", "header"], ["pTemplate", "content"], [3, "ngModel", "ngModelChange", "ionChange"], [1, "label-heading"], ["slot", "start", 3, "value"], ["lines", "none"], [4, "ngFor", "ngForOf"], [1, "error-banner"], ["name", "alert-circle-outline", 2, "color", "var(--ion-color-danger)", "font-size", "18px", "margin-right", "8px"]], template: function AddressSuggestionComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, AddressSuggestionComponent_p_accordion_0_Template, 4, 1, "p-accordion", 0)(1, AddressSuggestionComponent_div_1_Template, 4, 1, "div", 1);
         } if (rf & 2) {
-            i0.ɵɵproperty("ngIf", ctx.showAccordion && ctx.form.valid && ((ctx.formName === "resAddress" || ctx.formName === "resAdress") && ctx.diffMailAddressFlag === false || ctx.formName === "mailAddress" && ctx.diffMailAddressFlag === true));
+            i0.ɵɵproperty("ngIf", ctx.showAccordion && ctx.form.valid);
             i0.ɵɵadvance(1);
             i0.ɵɵproperty("ngIf", ctx.showInlineError && !ctx.showAccordion && ctx.msuaCount < 2 && ctx.aunrCount < 2);
         } }, dependencies: [i4.IonIcon, i4.IonItem, i4.IonLabel, i4.IonRadio, i4.IonRadioGroup, i4.RadioValueAccessor, i4.SelectValueAccessor, i5$1.NgForOf, i5$1.NgIf, i6.PrimeTemplate, i1$4.NgControlStatus, i1$4.NgModel, i13.Accordion, i13.AccordionTab], styles: ["[_nghost-%COMP%]     .red-header .p-accordion-header-link{color:var(--ion-color-danger)}.error-banner[_ngcontent-%COMP%]{display:flex;align-items:center;background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb;border-radius:4px;padding:8px 12px;margin-bottom:10px;font-size:14px}.hide-element[_ngcontent-%COMP%]{visibility:hidden}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AddressSuggestionComponent, [{
         type: Component,
-        args: [{ selector: 'app-address-suggestion', template: "<p-accordion *ngIf=\"showAccordion && (form.valid) && (((formName==='resAddress' || formName==='resAdress') && diffMailAddressFlag=== false) || (formName==='mailAddress' && diffMailAddressFlag=== true))\" (onOpen)=\"tabOpen()\" (onClose)=\"tabClose()\" [activeIndex]=\"addressSelected\" styleClass=\"red-header\">\r\n    <p-accordionTab >\r\n        \r\n        <ng-template pTemplate=\"header\" >\r\n            Address Validation\r\n        </ng-template>\r\n        <ng-template pTemplate=\"content\">\r\n            <div *ngIf=\"showInlineError\" class=\"error-banner\">\r\n                <ion-icon name=\"alert-circle-outline\" style=\"color: var(--ion-color-danger); font-size: 18px; margin-right: 8px;\"></ion-icon>\r\n                <span>{{ errorText }}</span>\r\n            </div>\r\n            <p>The U.S. Postal Service has recommended changes to your address. Select the address you want to use:</p>\r\n            <ion-radio-group [(ngModel)]=\"picked\" (ionChange)=\"selectionChanged($event)\">\r\n                <div class=\"label-heading\">You Entered:</div>\r\n                <ion-item>\r\n                    <ion-radio slot=\"start\" [value]=\"original\"></ion-radio>\r\n                    <ion-label>\r\n                            {{ original.line1 }}, {{ original.line2 }}<br />\r\n                            {{ original.city }}, {{ original.state }}, {{ original.zipCode }} {{ original.country }}\r\n                    </ion-label>\r\n                </ion-item>\r\n                <ion-item lines=\"none\">\r\n                    <ion-label>\r\n                        <strong class=\"label-heading\">USPS Recommendations:</strong><br />\r\n                    </ion-label>\r\n                </ion-item>\r\n                <ion-item *ngFor=\"let c of choices\">\r\n                    <ion-label>\r\n                            {{ c.deliveryLine1 }} {{ c.deliveryLine2 }}<br />\r\n                            {{ c.cityName }}, {{ c.stateAbbrevation }}, {{ c.zipCode }} {{ c.country }}\r\n                    </ion-label>\r\n                    <ion-radio slot=\"start\" [value]=\"c\"></ion-radio>\r\n                </ion-item>\r\n            </ion-radio-group>\r\n        </ng-template>\r\n      </p-accordionTab>\r\n</p-accordion>\r\n<div *ngIf=\"showInlineError && !showAccordion && msuaCount < 2 && aunrCount < 2\" class=\"error-banner\">\r\n    <ion-icon name=\"alert-circle-outline\" style=\"color: var(--ion-color-danger); font-size: 18px; margin-right: 8px;\"></ion-icon>\r\n    <span>{{ errorText }}</span>\r\n</div>", styles: [":host ::ng-deep .red-header .p-accordion-header-link{color:var(--ion-color-danger)}.error-banner{display:flex;align-items:center;background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb;border-radius:4px;padding:8px 12px;margin-bottom:10px;font-size:14px}.hide-element{visibility:hidden}\n"] }]
+        args: [{ selector: 'app-address-suggestion', template: "<p-accordion *ngIf=\"showAccordion && (form.valid)\" (onOpen)=\"tabOpen()\" (onClose)=\"tabClose()\" [activeIndex]=\"addressSelected\" styleClass=\"red-header\">\r\n    <p-accordionTab >\r\n        \r\n        <ng-template pTemplate=\"header\" >\r\n            Address Validation\r\n        </ng-template>\r\n        <ng-template pTemplate=\"content\">\r\n            <div *ngIf=\"showInlineError\" class=\"error-banner\">\r\n                <ion-icon name=\"alert-circle-outline\" style=\"color: var(--ion-color-danger); font-size: 18px; margin-right: 8px;\"></ion-icon>\r\n                <span>{{ errorText }}</span>\r\n            </div>\r\n            <p>The U.S. Postal Service has recommended changes to your address. Select the address you want to use:</p>\r\n            <ion-radio-group [(ngModel)]=\"picked\" (ionChange)=\"selectionChanged($event)\">\r\n                <div class=\"label-heading\">You Entered:</div>\r\n                <ion-item>\r\n                    <ion-radio slot=\"start\" [value]=\"original\"></ion-radio>\r\n                    <ion-label>\r\n                            {{ original.line1 }}, {{ original.line2 }}<br />\r\n                            {{ original.city }}, {{ original.state }}, {{ original.zipCode }} {{ original.country }}\r\n                    </ion-label>\r\n                </ion-item>\r\n                <ion-item lines=\"none\">\r\n                    <ion-label>\r\n                        <strong class=\"label-heading\">USPS Recommendations:</strong><br />\r\n                    </ion-label>\r\n                </ion-item>\r\n                <ion-item *ngFor=\"let c of choices\">\r\n                    <ion-label>\r\n                            {{ c.deliveryLine1 }} {{ c.deliveryLine2 }}<br />\r\n                            {{ c.cityName }}, {{ c.stateAbbrevation }}, {{ c.zipCode }} {{ c.country }}\r\n                    </ion-label>\r\n                    <ion-radio slot=\"start\" [value]=\"c\"></ion-radio>\r\n                </ion-item>\r\n            </ion-radio-group>\r\n        </ng-template>\r\n      </p-accordionTab>\r\n</p-accordion>\r\n<div *ngIf=\"showInlineError && !showAccordion && msuaCount < 2 && aunrCount < 2\" class=\"error-banner\">\r\n    <ion-icon name=\"alert-circle-outline\" style=\"color: var(--ion-color-danger); font-size: 18px; margin-right: 8px;\"></ion-icon>\r\n    <span>{{ errorText }}</span>\r\n</div>", styles: [":host ::ng-deep .red-header .p-accordion-header-link{color:var(--ion-color-danger)}.error-banner{display:flex;align-items:center;background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb;border-radius:4px;padding:8px 12px;margin-bottom:10px;font-size:14px}.hide-element{visibility:hidden}\n"] }]
     }], () => [{ type: AddressValidationService }], { original: [{
             type: Input
         }], choices: [{
@@ -43209,6 +43254,12 @@ class AddressSuggestionComponent {
             type: Input
         }], formBlur: [{
             type: Input
+        }], standaloneAddressForm: [{
+            type: Input
+        }], questionaireForm: [{
+            type: Input
+        }], checkFormIsBlur: [{
+            type: Output
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AddressSuggestionComponent, { className: "AddressSuggestionComponent", filePath: "lib\\components\\address-suggestion\\address-suggestion.component.ts", lineNumber: 15 }); })();
 
@@ -43659,7 +43710,7 @@ function HistoryPageComponent_app_proof_of_anything_1_Template(rf, ctx) { if (rf
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("uploadTypeId", ctx_r1.uploadTypeId)("employerDataModel", ctx_r1.employerDataModel);
+    i0.ɵɵproperty("uploadTypeId", ctx_r1.uploadTypeId)("employerDataModel", ctx_r1.employerDataModel)("data", ctx_r1.dataModel);
 } }
 function HistoryPageComponent_app_dashboard_help_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "app-dashboard-help", 14);
@@ -44038,11 +44089,14 @@ class HistoryPageComponent {
                 this.isOpenQe = true;
             }
             else if (historyModel.button && historyModel.button.dialog == 'uploadPopupInCp') {
-                this.logger.debug(this.selectedModel.data);
+                console.log(this.selectedModel.data);
                 this.uploadTypeId = this.selectedModel.data.uploadTypeId;
                 if (this.selectedModel.data?.employerData != null) {
                     this.employerDataModel = JSON.parse(this.selectedModel.data?.employerData);
                 }
+                if (this.selectedModel.data != null) {
+                    this.dataModel = this.selectedModel.data;
+                }
                 this.showUploadPopup = true;
             }
             else if (historyModel.button && historyModel.button.dialog == 'uploadPopup') {
@@ -44133,8 +44187,8 @@ class HistoryPageComponent {
         this.showUploadPopup = false;
     }
     static { this.ɵfac = function HistoryPageComponent_Factory(t) { return new (t || HistoryPageComponent)(i0.ɵɵdirectiveInject(EventService), i0.ɵɵdirectiveInject(HelpService), i0.ɵɵdirectiveInject(UtilService), i0.ɵɵdirectiveInject(i4.NavController), i0.ɵɵdirectiveInject(LoginService), i0.ɵɵdirectiveInject(i3$1.TranslateService), i0.ɵɵdirectiveInject(LoggerService), i0.ɵɵdirectiveInject(i3.ActivatedRoute)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: HistoryPageComponent, selectors: [["app-history-page"]], decls: 21, vars: 9, consts: [[3, "qeQueryModels", "modelCancel", "onComplete", 4, "ngIf"], [3, "uploadTypeId", "employerDataModel", "cancel", "success", 4, "ngIf"], [3, "activeIndex", 4, "ngIf"], ["size", "12", "sizeXl", "8", "sizeLg", "8", "sizeMd", "10", "offsetXl", "2", "offsetLg", "2", "offsetMd", "1"], ["size", "3"], ["class", "ion-text-left field", 4, "ngIf"], ["size", "9"], ["class", "ion-text-right field", 4, "ngIf"], [3, "value", 4, "ngIf"], ["class", "ion-text-center", 4, "ngIf"], ["class", "ion-padding-top ion-text-center app-accordian-body", 4, "ngIf"], ["style", "padding-left: 5%;", 4, "ngIf"], [3, "qeQueryModels", "modelCancel", "onComplete"], [3, "uploadTypeId", "employerDataModel", "cancel", "success"], [3, "activeIndex"], [1, "ion-text-left", "field"], ["for", "timeline", "id", "lblTimeline"], ["optionLabel", "desc", 3, "options", "ngModel", "ariaLabelledBy", "ngModelChange", "onChange"], ["pTemplate", ""], ["tooltipPosition", "bottom", "tabindex", "0", "role", "note", 3, "pTooltip"], [4, "ngIf"], [3, "icon", 4, "ngIf"], [3, "icon"], [1, "ion-text-right", "field"], ["optionLabel", "icon", 3, "options", "ngModel", "ngModelChange", "onChange"], [3, "value"], ["pTemplate", "marker"], ["pTemplate", "content"], [1, "custom-marker", 3, "icon"], [1, "app-accordian-heading", 2, "margin-top", "0px", "font-weight", "bold"], ["expandIcon", "pi pi-fw pi-chevron-up", "collapseIcon", "pi pi-fw pi-chevron-up"], [3, "selected", 4, "ngFor", "ngForOf"], [3, "selected"], ["pTemplate", "header"], [2, "width", "-webkit-fill-available"], ["size", "12", "sizeXl", "3", "sizeLg", "3", "sizeMd", "3", 1, "ion-text-left"], [1, "app-accordian-heading"], ["size", "11", "sizeXl", "8", "sizeLg", "8", "sizeMd", "8", 1, "app-text-align"], ["size", "1", 1, "ion-text-center"], [3, "color", 4, "ngIf"], [1, "app-accordian-body", 3, "innerHtml"], [1, "ion-text-right"], ["fill", "outline", "shape", "round", 1, "small-button", 3, "click"], [1, "ion-text-center"], ["name", "dots"], [1, "ion-padding-top", "ion-text-center", "app-accordian-body"], [1, "large-icon", 3, "icon"], [2, "padding-left", "5%"], [1, "horizontal-align"], [1, "app-accordian-body"], ["aria-label", "view old records", "fill", "outline", "size", "small", 1, "action-button", 3, "click"], [1, "external-link-icon", 3, "icon"]], template: function HistoryPageComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵtemplate(0, HistoryPageComponent_app_multi_questionnaire_0_Template, 1, 1, "app-multi-questionnaire", 0)(1, HistoryPageComponent_app_proof_of_anything_1_Template, 1, 2, "app-proof-of-anything", 1)(2, HistoryPageComponent_app_dashboard_help_2_Template, 1, 1, "app-dashboard-help", 2);
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: HistoryPageComponent, selectors: [["app-history-page"]], decls: 21, vars: 9, consts: [[3, "qeQueryModels", "modelCancel", "onComplete", 4, "ngIf"], [3, "uploadTypeId", "employerDataModel", "data", "cancel", "success", 4, "ngIf"], [3, "activeIndex", 4, "ngIf"], ["size", "12", "sizeXl", "8", "sizeLg", "8", "sizeMd", "10", "offsetXl", "2", "offsetLg", "2", "offsetMd", "1"], ["size", "3"], ["class", "ion-text-left field", 4, "ngIf"], ["size", "9"], ["class", "ion-text-right field", 4, "ngIf"], [3, "value", 4, "ngIf"], ["class", "ion-text-center", 4, "ngIf"], ["class", "ion-padding-top ion-text-center app-accordian-body", 4, "ngIf"], ["style", "padding-left: 5%;", 4, "ngIf"], [3, "qeQueryModels", "modelCancel", "onComplete"], [3, "uploadTypeId", "employerDataModel", "data", "cancel", "success"], [3, "activeIndex"], [1, "ion-text-left", "field"], ["for", "timeline", "id", "lblTimeline"], ["optionLabel", "desc", 3, "options", "ngModel", "ariaLabelledBy", "ngModelChange", "onChange"], ["pTemplate", ""], ["tooltipPosition", "bottom", "tabindex", "0", "role", "note", 3, "pTooltip"], [4, "ngIf"], [3, "icon", 4, "ngIf"], [3, "icon"], [1, "ion-text-right", "field"], ["optionLabel", "icon", 3, "options", "ngModel", "ngModelChange", "onChange"], [3, "value"], ["pTemplate", "marker"], ["pTemplate", "content"], [1, "custom-marker", 3, "icon"], [1, "app-accordian-heading", 2, "margin-top", "0px", "font-weight", "bold"], ["expandIcon", "pi pi-fw pi-chevron-up", "collapseIcon", "pi pi-fw pi-chevron-up"], [3, "selected", 4, "ngFor", "ngForOf"], [3, "selected"], ["pTemplate", "header"], [2, "width", "-webkit-fill-available"], ["size", "12", "sizeXl", "3", "sizeLg", "3", "sizeMd", "3", 1, "ion-text-left"], [1, "app-accordian-heading"], ["size", "11", "sizeXl", "8", "sizeLg", "8", "sizeMd", "8", 1, "app-text-align"], ["size", "1", 1, "ion-text-center"], [3, "color", 4, "ngIf"], [1, "app-accordian-body", 3, "innerHtml"], [1, "ion-text-right"], ["fill", "outline", "shape", "round", 1, "small-button", 3, "click"], [1, "ion-text-center"], ["name", "dots"], [1, "ion-padding-top", "ion-text-center", "app-accordian-body"], [1, "large-icon", 3, "icon"], [2, "padding-left", "5%"], [1, "horizontal-align"], [1, "app-accordian-body"], ["aria-label", "view old records", "fill", "outline", "size", "small", 1, "action-button", 3, "click"], [1, "external-link-icon", 3, "icon"]], template: function HistoryPageComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵtemplate(0, HistoryPageComponent_app_multi_questionnaire_0_Template, 1, 1, "app-multi-questionnaire", 0)(1, HistoryPageComponent_app_proof_of_anything_1_Template, 1, 3, "app-proof-of-anything", 1)(2, HistoryPageComponent_app_dashboard_help_2_Template, 1, 1, "app-dashboard-help", 2);
             i0.ɵɵelementStart(3, "ion-grid")(4, "ion-row")(5, "ion-col", 3)(6, "h1");
             i0.ɵɵtext(7, "Your unemployment history");
             i0.ɵɵelementEnd()()();
@@ -44170,7 +44224,7 @@ class HistoryPageComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(HistoryPageComponent, [{
         type: Component,
-        args: [{ selector: 'app-history-page', animations: [rowExpansionTrigger], template: "<app-multi-questionnaire [qeQueryModels]=\"qeQueryModels\" *ngIf=\"isOpenQe\" (modelCancel)=\"closeQe()\"\r\n  (onComplete)=\"quSuccess()\"></app-multi-questionnaire>\r\n<app-proof-of-anything *ngIf=\"showUploadPopup\" [uploadTypeId]=\"uploadTypeId\" [employerDataModel]=\"employerDataModel\"\r\n  (cancel)=\"closeUploadPopup()\" (success)=\"uploadPopupDone()\"></app-proof-of-anything>\r\n<app-dashboard-help *ngIf=\"hs.isShowing()\" [activeIndex]=\"0\"></app-dashboard-help>\r\n<ion-grid>\r\n  <ion-row>\r\n    <ion-col size=\"12\" sizeXl=\"8\" sizeLg=\"8\" sizeMd=\"10\" offsetXl=\"2\" offsetLg=\"2\" offsetMd=\"1\">\r\n      <h1>Your unemployment history</h1>\r\n    </ion-col>\r\n  </ion-row>\r\n  <ion-row>\r\n    <ion-col size=\"12\" sizeXl=\"8\" sizeLg=\"8\" sizeMd=\"10\" offsetXl=\"2\" offsetLg=\"2\" offsetMd=\"1\">\r\n\r\n      <ion-row>\r\n        <ion-col size=\"3\">\r\n          <div class=\"ion-text-left field\" *ngIf=\"histories\">\r\n            <label for=\"timeline\" id=\"lblTimeline\">{{time?.desc}}</label><br />\r\n            <p-selectButton [options]=\"timeOption\" [(ngModel)]=\"time\" optionLabel=\"desc\"\r\n              (onChange)=\"handleChange($event)\" [ariaLabelledBy]=\"'lblTimeline'\">\r\n              <ng-template let-item pTemplate>\r\n                <div [pTooltip]=\"item.desc\" tooltipPosition=\"bottom\" tabindex=\"0\" [attr.aria-label]=\"item.desc\"\r\n                  role=\"note\">\r\n                  <span *ngIf=\"!item.icon\">{{item.desc}}</span>\r\n                  <fa-icon [icon]=\"['far', item.icon]\" *ngIf=\"item.icon\"></fa-icon>\r\n                </div>\r\n              </ng-template>\r\n            </p-selectButton>\r\n          </div>\r\n        </ion-col>\r\n        <ion-col size=\"9\">\r\n          <div class=\"ion-text-right field\" *ngIf=\"histories\">\r\n            <label>{{filter?.desc}}</label><br />\r\n            <p-selectButton [options]=\"filterOptions\" [(ngModel)]=\"filter\" optionLabel=\"icon\"\r\n              (onChange)=\"handleChange($event)\">\r\n              <ng-template let-item pTemplate>\r\n                <div [pTooltip]=\"item.desc\" tooltipPosition=\"bottom\" tabindex=\"0\" [attr.aria-label]=\"item.desc\"\r\n                  role=\"note\">\r\n                  <span *ngIf=\"!item.icon\">{{item.altDesc}}</span>\r\n                  <fa-icon [icon]=\"['far', item.icon]\" *ngIf=\"item.icon\"></fa-icon>\r\n                </div>\r\n              </ng-template>\r\n            </p-selectButton>\r\n          </div>\r\n        </ion-col>\r\n      </ion-row>\r\n\r\n      <br />\r\n      <p-timeline [value]=\"filteredHistories\" *ngIf=\"(filteredHistories && filteredHistories.length > 0)\">\r\n        <ng-template pTemplate=\"marker\" let-hist>\r\n          <span [style.color]=\"hist.color\">\r\n            <fa-icon [icon]=\"['far', hist.icon]\" class=\"custom-marker\"></fa-icon>\r\n          </span>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"content\" let-hist>\r\n          <h1 class=\"app-accordian-heading\" style=\"margin-top: 0px; font-weight: bold;\">{{hist.year}}</h1>\r\n          <p-accordion expandIcon=\"pi pi-fw pi-chevron-up\" collapseIcon=\"pi pi-fw pi-chevron-up\">\r\n            <p-accordionTab *ngFor=\"let history of hist.history; let i = index\" [selected]=\"isValueSelected(history,i)\">\r\n              <ng-template pTemplate=\"header\">\r\n                <ion-row style=\"width: -webkit-fill-available;\">\r\n                  <ion-col class=\"ion-text-left\" size=\"12\" sizeXl=\"3\" sizeLg=\"3\" sizeMd=\"3\">\r\n                    <span class=\"app-accordian-heading\" [style.color]=\"history.color\">{{history.eventDate}}</span>\r\n                  </ion-col>\r\n                  <ion-col class=\"app-text-align\" size=\"11\" sizeXl=\"8\" sizeLg=\"8\" sizeMd=\"8\">\r\n                    <span class=\"app-accordian-heading\" [style.color]=\"history.color\">\r\n                      {{history.title}}\r\n                    </span>\r\n                  </ion-col>\r\n                  <ion-col size=\"1\" class=\"ion-text-center\">\r\n                    <span [style.color]=\"history.color\" *ngIf=\"getIcon(history)\">\r\n                      <fa-icon [icon]=\"getIcon(history)\" class=\"custom-marker\"></fa-icon>\r\n                    </span>\r\n                  </ion-col>\r\n                </ion-row>\r\n              </ng-template>\r\n              <ng-template pTemplate=\"content\">\r\n                <span class=\"app-accordian-body\" [innerHtml]=\"history.desc\"></span>\r\n                <div *ngIf=\"history.button != null\">\r\n                  <br /><br />\r\n                  <div class=\"ion-text-right\">\r\n                    <ion-button [attr.aria-label]=\"'go to' + history.button.buttonText\" fill=\"outline\"\r\n                      style=\"--color: {{history.button.color}}; --border-color: {{history.button.color}}; --border-width: 2px\"\r\n                      shape=\"round\" class=\"small-button\" (click)=\"open(history)\">{{history.button.buttonText}}\r\n                    </ion-button>\r\n                  </div>\r\n                </div>\r\n              </ng-template>\r\n            </p-accordionTab>\r\n          </p-accordion>\r\n          <br />\r\n        </ng-template>\r\n      </p-timeline>\r\n\r\n      <div class=\"ion-text-center\" *ngIf=\"isLoading\">\r\n        <ion-spinner name=\"dots\"></ion-spinner>\r\n      </div>\r\n\r\n      <div class=\"ion-padding-top ion-text-center app-accordian-body\"\r\n        *ngIf=\"(!filteredHistories || filteredHistories.length < 1) && !isLoading\">\r\n        <fa-icon [icon]=\"['far', filterIcon]\" class=\"large-icon\"></fa-icon>\r\n        <p>{{'No history present.' | translate}}</p>\r\n      </div>\r\n\r\n      <div style=\"padding-left: 5%;\" *ngIf=\"!isLoading && showOlderRecordsLink\">\r\n        <div class=\"horizontal-align\">\r\n          <span class=\"app-accordian-body\">\r\n            <strong>{{ 'To view prior unemployment history click here' | translate }}</strong>\r\n          </span>\r\n          <ion-button aria-label=\"view old records\" (click)=\"openOldRecords()\" fill=\"outline\" size=\"small\"\r\n            class=\"action-button\">\r\n            <fa-icon [icon]=\"['fas', 'external-link-alt']\" class=\"external-link-icon\"></fa-icon>\r\n          </ion-button>\r\n        </div>\r\n      </div>\r\n      <br />\r\n\r\n    </ion-col>\r\n  </ion-row>\r\n</ion-grid>", styles: [".app-accordian-heading{font-size:26px;color:var(--ion-color-medium-gray);font-family:var(--app-font-light)}.app-accordian-body{font-size:20px;color:#707070;font:normal normal normal 20px/27px var(--app-font-regular)}.horizontal-align{display:flex;align-items:center;gap:5px}.app-text-align{text-align:right}.large-icon{font-size:xx-large}.custom-marker{font-size:x-large}@media screen and (max-width: 576px){.app-text-align{text-align:left}}@media screen and (max-width: 50rem){.app-text-align{text-align:left}}@media screen and (max-width: 50rem){:is() .p-button{display:inline-block;font-size:20px;min-width:3rem}}@media only screen and (max-width: 576px){:is() .p-timeline .p-timeline-event{display:flex!important;flex-direction:column!important;align-items:flex-start!important}:is() .p-timeline .p-timeline-event-separator{margin:.5rem 0!important;width:100%!important}:is() .p-timeline .p-timeline-event-content{width:100%!important;padding-left:0!important;padding-right:0!important}}:host ::ng-deep .app-accordian-body table td[style*=\"display:flex\"]{flex-wrap:wrap!important;white-space:normal!important}:host ::ng-deep .app-accordian-body table td[style*=\"display:flex\"]>span{min-width:0!important;margin:.25em 0!important}:host ::ng-deep .app-accordian-body table td span{overflow-wrap:break-word!important}\n"] }]
+        args: [{ selector: 'app-history-page', animations: [rowExpansionTrigger], template: "<app-multi-questionnaire [qeQueryModels]=\"qeQueryModels\" *ngIf=\"isOpenQe\" (modelCancel)=\"closeQe()\"\r\n  (onComplete)=\"quSuccess()\"></app-multi-questionnaire>\r\n<app-proof-of-anything *ngIf=\"showUploadPopup\" [uploadTypeId]=\"uploadTypeId\" [employerDataModel]=\"employerDataModel\"\r\n  [data]=\"dataModel\" (cancel)=\"closeUploadPopup()\" (success)=\"uploadPopupDone()\"></app-proof-of-anything>\r\n<app-dashboard-help *ngIf=\"hs.isShowing()\" [activeIndex]=\"0\"></app-dashboard-help>\r\n<ion-grid>\r\n  <ion-row>\r\n    <ion-col size=\"12\" sizeXl=\"8\" sizeLg=\"8\" sizeMd=\"10\" offsetXl=\"2\" offsetLg=\"2\" offsetMd=\"1\">\r\n      <h1>Your unemployment history</h1>\r\n    </ion-col>\r\n  </ion-row>\r\n  <ion-row>\r\n    <ion-col size=\"12\" sizeXl=\"8\" sizeLg=\"8\" sizeMd=\"10\" offsetXl=\"2\" offsetLg=\"2\" offsetMd=\"1\">\r\n\r\n      <ion-row>\r\n        <ion-col size=\"3\">\r\n          <div class=\"ion-text-left field\" *ngIf=\"histories\">\r\n            <label for=\"timeline\" id=\"lblTimeline\">{{time?.desc}}</label><br />\r\n            <p-selectButton [options]=\"timeOption\" [(ngModel)]=\"time\" optionLabel=\"desc\"\r\n              (onChange)=\"handleChange($event)\" [ariaLabelledBy]=\"'lblTimeline'\">\r\n              <ng-template let-item pTemplate>\r\n                <div [pTooltip]=\"item.desc\" tooltipPosition=\"bottom\" tabindex=\"0\" [attr.aria-label]=\"item.desc\"\r\n                  role=\"note\">\r\n                  <span *ngIf=\"!item.icon\">{{item.desc}}</span>\r\n                  <fa-icon [icon]=\"['far', item.icon]\" *ngIf=\"item.icon\"></fa-icon>\r\n                </div>\r\n              </ng-template>\r\n            </p-selectButton>\r\n          </div>\r\n        </ion-col>\r\n        <ion-col size=\"9\">\r\n          <div class=\"ion-text-right field\" *ngIf=\"histories\">\r\n            <label>{{filter?.desc}}</label><br />\r\n            <p-selectButton [options]=\"filterOptions\" [(ngModel)]=\"filter\" optionLabel=\"icon\"\r\n              (onChange)=\"handleChange($event)\">\r\n              <ng-template let-item pTemplate>\r\n                <div [pTooltip]=\"item.desc\" tooltipPosition=\"bottom\" tabindex=\"0\" [attr.aria-label]=\"item.desc\"\r\n                  role=\"note\">\r\n                  <span *ngIf=\"!item.icon\">{{item.altDesc}}</span>\r\n                  <fa-icon [icon]=\"['far', item.icon]\" *ngIf=\"item.icon\"></fa-icon>\r\n                </div>\r\n              </ng-template>\r\n            </p-selectButton>\r\n          </div>\r\n        </ion-col>\r\n      </ion-row>\r\n\r\n      <br />\r\n      <p-timeline [value]=\"filteredHistories\" *ngIf=\"(filteredHistories && filteredHistories.length > 0)\">\r\n        <ng-template pTemplate=\"marker\" let-hist>\r\n          <span [style.color]=\"hist.color\">\r\n            <fa-icon [icon]=\"['far', hist.icon]\" class=\"custom-marker\"></fa-icon>\r\n          </span>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"content\" let-hist>\r\n          <h1 class=\"app-accordian-heading\" style=\"margin-top: 0px; font-weight: bold;\">{{hist.year}}</h1>\r\n          <p-accordion expandIcon=\"pi pi-fw pi-chevron-up\" collapseIcon=\"pi pi-fw pi-chevron-up\">\r\n            <p-accordionTab *ngFor=\"let history of hist.history; let i = index\" [selected]=\"isValueSelected(history,i)\">\r\n              <ng-template pTemplate=\"header\">\r\n                <ion-row style=\"width: -webkit-fill-available;\">\r\n                  <ion-col class=\"ion-text-left\" size=\"12\" sizeXl=\"3\" sizeLg=\"3\" sizeMd=\"3\">\r\n                    <span class=\"app-accordian-heading\" [style.color]=\"history.color\">{{history.eventDate}}</span>\r\n                  </ion-col>\r\n                  <ion-col class=\"app-text-align\" size=\"11\" sizeXl=\"8\" sizeLg=\"8\" sizeMd=\"8\">\r\n                    <span class=\"app-accordian-heading\" [style.color]=\"history.color\">\r\n                      {{history.title}}\r\n                    </span>\r\n                  </ion-col>\r\n                  <ion-col size=\"1\" class=\"ion-text-center\">\r\n                    <span [style.color]=\"history.color\" *ngIf=\"getIcon(history)\">\r\n                      <fa-icon [icon]=\"getIcon(history)\" class=\"custom-marker\"></fa-icon>\r\n                    </span>\r\n                  </ion-col>\r\n                </ion-row>\r\n              </ng-template>\r\n              <ng-template pTemplate=\"content\">\r\n                <span class=\"app-accordian-body\" [innerHtml]=\"history.desc\"></span>\r\n                <div *ngIf=\"history.button != null\">\r\n                  <br /><br />\r\n                  <div class=\"ion-text-right\">\r\n                    <ion-button [attr.aria-label]=\"'go to' + history.button.buttonText\" fill=\"outline\"\r\n                      style=\"--color: {{history.button.color}}; --border-color: {{history.button.color}}; --border-width: 2px\"\r\n                      shape=\"round\" class=\"small-button\" (click)=\"open(history)\">{{history.button.buttonText}}\r\n                    </ion-button>\r\n                  </div>\r\n                </div>\r\n              </ng-template>\r\n            </p-accordionTab>\r\n          </p-accordion>\r\n          <br />\r\n        </ng-template>\r\n      </p-timeline>\r\n\r\n      <div class=\"ion-text-center\" *ngIf=\"isLoading\">\r\n        <ion-spinner name=\"dots\"></ion-spinner>\r\n      </div>\r\n\r\n      <div class=\"ion-padding-top ion-text-center app-accordian-body\"\r\n        *ngIf=\"(!filteredHistories || filteredHistories.length < 1) && !isLoading\">\r\n        <fa-icon [icon]=\"['far', filterIcon]\" class=\"large-icon\"></fa-icon>\r\n        <p>{{'No history present.' | translate}}</p>\r\n      </div>\r\n\r\n      <div style=\"padding-left: 5%;\" *ngIf=\"!isLoading && showOlderRecordsLink\">\r\n        <div class=\"horizontal-align\">\r\n          <span class=\"app-accordian-body\">\r\n            <strong>{{ 'To view prior unemployment history click here' | translate }}</strong>\r\n          </span>\r\n          <ion-button aria-label=\"view old records\" (click)=\"openOldRecords()\" fill=\"outline\" size=\"small\"\r\n            class=\"action-button\">\r\n            <fa-icon [icon]=\"['fas', 'external-link-alt']\" class=\"external-link-icon\"></fa-icon>\r\n          </ion-button>\r\n        </div>\r\n      </div>\r\n      <br />\r\n\r\n    </ion-col>\r\n  </ion-row>\r\n</ion-grid>", styles: [".app-accordian-heading{font-size:26px;color:var(--ion-color-medium-gray);font-family:var(--app-font-light)}.app-accordian-body{font-size:20px;color:#707070;font:normal normal normal 20px/27px var(--app-font-regular)}.horizontal-align{display:flex;align-items:center;gap:5px}.app-text-align{text-align:right}.large-icon{font-size:xx-large}.custom-marker{font-size:x-large}@media screen and (max-width: 576px){.app-text-align{text-align:left}}@media screen and (max-width: 50rem){.app-text-align{text-align:left}}@media screen and (max-width: 50rem){:is() .p-button{display:inline-block;font-size:20px;min-width:3rem}}@media only screen and (max-width: 576px){:is() .p-timeline .p-timeline-event{display:flex!important;flex-direction:column!important;align-items:flex-start!important}:is() .p-timeline .p-timeline-event-separator{margin:.5rem 0!important;width:100%!important}:is() .p-timeline .p-timeline-event-content{width:100%!important;padding-left:0!important;padding-right:0!important}}:host ::ng-deep .app-accordian-body table td[style*=\"display:flex\"]{flex-wrap:wrap!important;white-space:normal!important}:host ::ng-deep .app-accordian-body table td[style*=\"display:flex\"]>span{min-width:0!important;margin:.25em 0!important}:host ::ng-deep .app-accordian-body table td span{overflow-wrap:break-word!important}\n"] }]
     }], () => [{ type: EventService }, { type: HelpService }, { type: UtilService }, { type: i4.NavController }, { type: LoginService }, { type: i3$1.TranslateService }, { type: LoggerService }, { type: i3.ActivatedRoute }], null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(HistoryPageComponent, { className: "HistoryPageComponent", filePath: "lib\\components\\history-page\\history-page.component.ts", lineNumber: 28 }); })();
 class KeyValueModel {