mis-crystal-design-system 14.0.75 → 17.0.1

package/{fesm2020 → fesm2022}/mis-crystal-design-system-dynamic-form.mjs

@@ -3,7 +3,7 @@ import { CommonModule } from '@angular/common';
 import * as i2 from '@angular/forms';
 import { UntypedFormArray, UntypedFormGroup, UntypedFormControl, Validators, ReactiveFormsModule, FormsModule } from '@angular/forms';
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, Input, Output, ContentChild, NgModule } from '@angular/core';
+import { EventEmitter, Component, ContentChild, Output, Input, NgModule } from '@angular/core';
 import { OverlayModule } from '@angular/cdk/overlay';
 import { ScrollingModule } from '@angular/cdk-experimental/scrolling';
 import * as i3 from 'mis-crystal-design-system/dropdown';
@@ -24,131 +24,133 @@ const _c4 = ["customSingleSelectDropdown"];
 const _c5 = ["customSingleSelectRadio"];
 const _c6 = ["customMultiSelectCheckbox"];
 const _c7 = ["customMultiSelectDropdown"];
-const _c8 = function (a0, a1) { return { $implicit: a0, control: a1 }; };
+const _c8 = (a0, a1, a2) => ({ $implicit: a0, formGroup: a1, control: a2 });
+const _c9 = (a0, a1) => ({ $implicit: a0, control: a1 });
+const _c10 = (a0, a1, a2) => ({ field: a0, control: a1, formgroup: a2 });
+const _c11 = a0 => ({ "border-bottom": a0 });
+const _c12 = a0 => ({ "border": a0 });
+const _c13 = a0 => ({ $implicit: a0 });
+const _c14 = a0 => ({ "removeable-container": a0 });
+const _c15 = a0 => ({ "checkbox-active": a0 });
+const _c16 = () => ({ "flex-basis": "100%", "height": "0" });
 function DynamicFormComponent_ng_container_2_div_2_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementContainer(1, 6);
+    i0.ɵɵelementContainer(1, 15);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const subFieldControl_r9 = ctx.$implicit;
-    const j_r10 = ctx.index;
-    const ctx_r11 = i0.ɵɵnextContext(2);
-    const i_r6 = ctx_r11.index;
-    const fieldControl_r5 = ctx_r11.$implicit;
-    const ctx_r8 = i0.ɵɵnextContext();
-    const _r1 = i0.ɵɵreference(4);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", _r1)("ngTemplateOutletContext", i0.ɵɵpureFunction2(2, _c8, ctx_r8.findSelectedSubFieldConfig(ctx_r8.formFields[i_r6] == null ? null : ctx_r8.formFields[i_r6].subFields, fieldControl_r5.controls.value.value.value, j_r10), subFieldControl_r9));
+    const subFieldControl_r1 = ctx.$implicit;
+    const j_r2 = ctx.index;
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    const fieldControl_r4 = ctx_r2.$implicit;
+    const i_r5 = ctx_r2.index;
+    const ctx_r5 = i0.ɵɵnextContext();
+    const dynamicField_r7 = i0.ɵɵreference(4);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", dynamicField_r7)("ngTemplateOutletContext", i0.ɵɵpureFunction2(2, _c9, ctx_r5.findSelectedSubFieldConfig(ctx_r5.formFields[i_r5] == null ? null : ctx_r5.formFields[i_r5].subFields, fieldControl_r4.controls.value.value.value, j_r2), subFieldControl_r1));
 } }
 function DynamicFormComponent_ng_container_2_div_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 8);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_container_2_div_2_ng_container_1_Template, 2, 5, "ng-container", 9);
+    i0.ɵɵelementStart(0, "div", 17);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_container_2_div_2_ng_container_1_Template, 2, 5, "ng-container", 18);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const fieldControl_r5 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngForOf", fieldControl_r5.controls.subFields.controls);
+    const fieldControl_r4 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngForOf", fieldControl_r4.controls.subFields.controls);
 } }
-const _c9 = function (a0, a1, a2) { return { $implicit: a0, formGroup: a1, control: a2 }; };
 function DynamicFormComponent_ng_container_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0, 5);
-    i0.ɵɵelementContainer(1, 6);
-    i0.ɵɵtemplate(2, DynamicFormComponent_ng_container_2_div_2_Template, 2, 1, "div", 7);
+    i0.ɵɵelementContainerStart(0, 14);
+    i0.ɵɵelementContainer(1, 15);
+    i0.ɵɵtemplate(2, DynamicFormComponent_ng_container_2_div_2_Template, 2, 1, "div", 16);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const fieldControl_r5 = ctx.$implicit;
-    const i_r6 = ctx.index;
-    const ctx_r0 = i0.ɵɵnextContext();
-    const _r1 = i0.ɵɵreference(4);
-    i0.ɵɵproperty("formGroupName", i_r6);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", _r1)("ngTemplateOutletContext", i0.ɵɵpureFunction3(4, _c9, ctx_r0.formFields[i_r6], fieldControl_r5, fieldControl_r5.controls.value));
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", fieldControl_r5.value && (!!(ctx_r0.formFields[i_r6] == null ? null : ctx_r0.formFields[i_r6].subFields) && (ctx_r0.formFields[i_r6] == null ? null : ctx_r0.formFields[i_r6].subFields == null ? null : ctx_r0.formFields[i_r6].subFields.length) > 0 && ctx_r0.matchParentConfig(ctx_r0.formFields[i_r6] == null ? null : ctx_r0.formFields[i_r6].subFields, fieldControl_r5.controls.value.value.value)));
+    const fieldControl_r4 = ctx.$implicit;
+    const i_r5 = ctx.index;
+    const ctx_r5 = i0.ɵɵnextContext();
+    const dynamicField_r7 = i0.ɵɵreference(4);
+    i0.ɵɵproperty("formGroupName", i_r5);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", dynamicField_r7)("ngTemplateOutletContext", i0.ɵɵpureFunction3(4, _c8, ctx_r5.formFields[i_r5], fieldControl_r4, fieldControl_r4.controls.value));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", fieldControl_r4.value && (!!(ctx_r5.formFields[i_r5] == null ? null : ctx_r5.formFields[i_r5].subFields) && (ctx_r5.formFields[i_r5] == null ? null : ctx_r5.formFields[i_r5].subFields == null ? null : ctx_r5.formFields[i_r5].subFields.length) > 0 && ctx_r5.matchParentConfig(ctx_r5.formFields[i_r5] == null ? null : ctx_r5.formFields[i_r5].subFields, fieldControl_r4.controls.value.value.value)));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_0_ng_container_1_ng_template_1_Template(rf, ctx) { }
-const _c10 = function (a0, a1, a2) { return { field: a0, control: a1, formgroup: a2 }; };
 function DynamicFormComponent_ng_template_3_ng_container_0_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_0_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 6);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_0_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 15);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r28 = i0.ɵɵnextContext(2);
-    const field_r13 = ctx_r28.$implicit;
-    const control_r14 = ctx_r28.control;
-    const formgroup_r15 = ctx_r28.formGroup;
-    const ctx_r24 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r24.customInputTextNumber)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r13, control_r14, formgroup_r15));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r5.customInputTextNumber)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r9, control_r10, formgroup_r11));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_0_ng_template_2_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
     i0.ɵɵtext(1, " *");
     i0.ɵɵelementEnd();
 } }
-const _c11 = function (a0) { return { $implicit: a0 }; };
 function DynamicFormComponent_ng_template_3_ng_container_0_ng_template_2_ng_container_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 6);
+    i0.ɵɵelementContainer(0, 15);
 } if (rf & 2) {
-    const control_r14 = i0.ɵɵnextContext(3).control;
+    const control_r10 = i0.ɵɵnextContext(3).control;
     i0.ɵɵnextContext();
-    const _r3 = i0.ɵɵreference(6);
-    i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c11, control_r14.errors));
+    const dynamicFieldErrors_r13 = i0.ɵɵreference(6);
+    i0.ɵɵproperty("ngTemplateOutlet", dynamicFieldErrors_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c13, control_r10.errors));
 } }
-const _c12 = function (a0) { return { "border-bottom": a0 }; };
-const _c13 = function (a0) { return { "border": a0 }; };
 function DynamicFormComponent_ng_template_3_ng_container_0_ng_template_2_Template(rf, ctx) { if (rf & 1) {
-    const _r34 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 13)(1, "p", 14);
+    const _r12 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 21)(1, "p", 22);
     i0.ɵɵtext(2);
-    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_0_ng_template_2_span_3_Template, 2, 0, "span", 10);
+    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_0_ng_template_2_span_3_Template, 2, 0, "span", 19);
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(4, "div", 15);
-    i0.ɵɵelementStart(5, "input", 16);
-    i0.ɵɵlistener("ngModelChange", function DynamicFormComponent_ng_template_3_ng_container_0_ng_template_2_Template_input_ngModelChange_5_listener($event) { i0.ɵɵrestoreView(_r34); const ctx_r33 = i0.ɵɵnextContext(2); const field_r13 = ctx_r33.$implicit; const formgroup_r15 = ctx_r33.formGroup; const ctx_r32 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r32.updateSubDynamicFields(field_r13, formgroup_r15, $event)); });
+    i0.ɵɵelement(4, "div", 23);
+    i0.ɵɵelementStart(5, "input", 24);
+    i0.ɵɵlistener("ngModelChange", function DynamicFormComponent_ng_template_3_ng_container_0_ng_template_2_Template_input_ngModelChange_5_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r7 = i0.ɵɵnextContext(2); const field_r9 = ctx_r7.$implicit; const formgroup_r11 = ctx_r7.formGroup; const ctx_r5 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r5.updateSubDynamicFields(field_r9, formgroup_r11, $event)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_ng_container_0_ng_template_2_ng_container_6_Template, 1, 4, "ng-container", 17);
+    i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_ng_container_0_ng_template_2_ng_container_6_Template, 1, 4, "ng-container", 25);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r35 = i0.ɵɵnextContext(2);
-    const formgroup_r15 = ctx_r35.formGroup;
-    const field_r13 = ctx_r35.$implicit;
-    const control_r14 = ctx_r35.control;
-    const ctx_r26 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(9, _c12, (formgroup_r15 == null ? null : formgroup_r15.controls == null ? null : formgroup_r15.controls.subFields == null ? null : formgroup_r15.controls.subFields.controls == null ? null : formgroup_r15.controls.subFields.controls.length) && ctx_r26.removeSepratorForSubFields ? "none" : ""));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(9, _c11, (formgroup_r11 == null ? null : formgroup_r11.controls == null ? null : formgroup_r11.controls.subFields == null ? null : formgroup_r11.controls.subFields.controls == null ? null : formgroup_r11.controls.subFields.controls.length) && ctx_r5.removeSepratorForSubFields ? "none" : ""));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", field_r13 == null ? null : field_r13.title, " ");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.validators && field_r13.validators.length > 0);
+    i0.ɵɵtextInterpolate1(" ", field_r9 == null ? null : field_r9.title, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.validators && field_r9.validators.length > 0);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("type", field_r13.fieldInputType)("formControl", control_r14)("ngStyle", i0.ɵɵpureFunction1(11, _c13, control_r14.touched && control_r14.errors ? "1px solid #B00020" : ""))("placeholder", field_r13.placeholderText ? field_r13.placeholderText : "Input Text")("min", field_r13.fieldInputType === "number" ? 0 : "");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
+    i0.ɵɵproperty("type", field_r9.fieldInputType)("formControl", control_r10)("ngStyle", i0.ɵɵpureFunction1(11, _c12, control_r10.touched && control_r10.errors ? "1px solid #B00020" : ""))("placeholder", field_r9.placeholderText ? field_r9.placeholderText : "Input Text")("min", field_r9.fieldInputType === "number" ? 0 : "");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", control_r10.touched && control_r10.errors);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_0_ng_container_1_Template, 2, 6, "ng-container", 11);
-    i0.ɵɵtemplate(2, DynamicFormComponent_ng_template_3_ng_container_0_ng_template_2_Template, 7, 13, "ng-template", null, 12, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_0_ng_container_1_Template, 2, 6, "ng-container", 20)(2, DynamicFormComponent_ng_template_3_ng_container_0_ng_template_2_Template, 7, 13, "ng-template", null, 2, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const _r25 = i0.ɵɵreference(3);
-    const ctx_r16 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r16.customInputTextNumber)("ngIfElse", _r25);
+    const defaultInputTextNumber_r14 = i0.ɵɵreference(3);
+    const ctx_r5 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r5.customInputTextNumber)("ngIfElse", defaultInputTextNumber_r14);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_1_ng_container_1_ng_template_1_Template(rf, ctx) { }
 function DynamicFormComponent_ng_template_3_ng_container_1_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_1_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 6);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_1_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 15);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r40 = i0.ɵɵnextContext(2);
-    const field_r13 = ctx_r40.$implicit;
-    const control_r14 = ctx_r40.control;
-    const formgroup_r15 = ctx_r40.formGroup;
-    const ctx_r36 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r36.customInputTextarea)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r13, control_r14, formgroup_r15));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r5.customInputTextarea)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r9, control_r10, formgroup_r11));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
@@ -156,65 +158,64 @@ function DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_span_3_
     i0.ɵɵelementEnd();
 } }
 function DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_ng_container_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 6);
+    i0.ɵɵelementContainer(0, 15);
 } if (rf & 2) {
-    const control_r14 = i0.ɵɵnextContext(3).control;
+    const control_r10 = i0.ɵɵnextContext(3).control;
     i0.ɵɵnextContext();
-    const _r3 = i0.ɵɵreference(6);
-    i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c11, control_r14.errors));
+    const dynamicFieldErrors_r13 = i0.ɵɵreference(6);
+    i0.ɵɵproperty("ngTemplateOutlet", dynamicFieldErrors_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c13, control_r10.errors));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_Template(rf, ctx) { if (rf & 1) {
-    const _r46 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 13)(1, "p", 14);
+    const _r15 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 21)(1, "p", 22);
     i0.ɵɵtext(2);
-    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_span_3_Template, 2, 0, "span", 10);
+    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_span_3_Template, 2, 0, "span", 19);
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(4, "div", 15);
-    i0.ɵɵelementStart(5, "textarea", 19);
-    i0.ɵɵlistener("ngModelChange", function DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_Template_textarea_ngModelChange_5_listener($event) { i0.ɵɵrestoreView(_r46); const ctx_r45 = i0.ɵɵnextContext(2); const field_r13 = ctx_r45.$implicit; const formgroup_r15 = ctx_r45.formGroup; const ctx_r44 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r44.updateSubDynamicFields(field_r13, formgroup_r15, $event)); });
+    i0.ɵɵelement(4, "div", 23);
+    i0.ɵɵelementStart(5, "textarea", 26);
+    i0.ɵɵlistener("ngModelChange", function DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_Template_textarea_ngModelChange_5_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r7 = i0.ɵɵnextContext(2); const field_r9 = ctx_r7.$implicit; const formgroup_r11 = ctx_r7.formGroup; const ctx_r5 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r5.updateSubDynamicFields(field_r9, formgroup_r11, $event)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_ng_container_6_Template, 1, 4, "ng-container", 17);
+    i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_ng_container_6_Template, 1, 4, "ng-container", 25);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r47 = i0.ɵɵnextContext(2);
-    const formgroup_r15 = ctx_r47.formGroup;
-    const field_r13 = ctx_r47.$implicit;
-    const control_r14 = ctx_r47.control;
-    const ctx_r38 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(7, _c12, (formgroup_r15 == null ? null : formgroup_r15.controls == null ? null : formgroup_r15.controls.subFields == null ? null : formgroup_r15.controls.subFields.controls == null ? null : formgroup_r15.controls.subFields.controls.length) && ctx_r38.removeSepratorForSubFields ? "none" : ""));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(7, _c11, (formgroup_r11 == null ? null : formgroup_r11.controls == null ? null : formgroup_r11.controls.subFields == null ? null : formgroup_r11.controls.subFields.controls == null ? null : formgroup_r11.controls.subFields.controls.length) && ctx_r5.removeSepratorForSubFields ? "none" : ""));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", field_r13.title, "");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.validators && field_r13.validators.length > 0);
+    i0.ɵɵtextInterpolate1(" ", field_r9.title, "");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.validators && field_r9.validators.length > 0);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(9, _c13, control_r14.touched && control_r14.errors ? "1px solid #B00020" : ""))("placeholder", field_r13.placeholderText ? field_r13.placeholderText : "Input Text")("formControl", control_r14);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(9, _c12, control_r10.touched && control_r10.errors ? "1px solid #B00020" : ""))("placeholder", field_r9.placeholderText ? field_r9.placeholderText : "Input Text")("formControl", control_r10);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", control_r10.touched && control_r10.errors);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_1_ng_container_1_Template, 2, 6, "ng-container", 11);
-    i0.ɵɵtemplate(2, DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_Template, 7, 11, "ng-template", null, 18, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_1_ng_container_1_Template, 2, 6, "ng-container", 20)(2, DynamicFormComponent_ng_template_3_ng_container_1_ng_template_2_Template, 7, 11, "ng-template", null, 3, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const _r37 = i0.ɵɵreference(3);
-    const ctx_r17 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r17.customInputTextarea)("ngIfElse", _r37);
+    const defaultInputTextarea_r16 = i0.ɵɵreference(3);
+    const ctx_r5 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r5.customInputTextarea)("ngIfElse", defaultInputTextarea_r16);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_2_ng_container_1_ng_template_1_Template(rf, ctx) { }
 function DynamicFormComponent_ng_template_3_ng_container_2_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_2_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 6);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_2_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 15);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r52 = i0.ɵɵnextContext(2);
-    const field_r13 = ctx_r52.$implicit;
-    const control_r14 = ctx_r52.control;
-    const formgroup_r15 = ctx_r52.formGroup;
-    const ctx_r48 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r48.customInputDate)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r13, control_r14, formgroup_r15));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r5.customInputDate)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r9, control_r10, formgroup_r11));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
@@ -222,83 +223,82 @@ function DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_s
     i0.ɵɵelementEnd();
 } }
 function DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_img_7_Template(rf, ctx) { if (rf & 1) {
-    const _r59 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "img", 28);
-    i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_img_7_Template_img_click_0_listener() { i0.ɵɵrestoreView(_r59); i0.ɵɵnextContext(); const _r55 = i0.ɵɵreference(6); return i0.ɵɵresetView(_r55.click()); });
+    const _r18 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "img", 33);
+    i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_img_7_Template_img_click_0_listener() { i0.ɵɵrestoreView(_r18); i0.ɵɵnextContext(); const dp_r19 = i0.ɵɵreference(6); return i0.ɵɵresetView(dp_r19.click()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r56 = i0.ɵɵnextContext(5);
-    i0.ɵɵproperty("src", ctx_r56.calendarIconUrl, i0.ɵɵsanitizeUrl);
+    const ctx_r5 = i0.ɵɵnextContext(5);
+    i0.ɵɵproperty("src", ctx_r5.calendarIconUrl, i0.ɵɵsanitizeUrl);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_ng_container_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 6);
+    i0.ɵɵelementContainer(0, 15);
 } if (rf & 2) {
-    const control_r14 = i0.ɵɵnextContext(4).control;
+    const control_r10 = i0.ɵɵnextContext(4).control;
     i0.ɵɵnextContext();
-    const _r3 = i0.ɵɵreference(6);
-    i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c11, control_r14.errors));
+    const dynamicFieldErrors_r13 = i0.ɵɵreference(6);
+    i0.ɵɵproperty("ngTemplateOutlet", dynamicFieldErrors_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c13, control_r10.errors));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_Template(rf, ctx) { if (rf & 1) {
-    const _r63 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 22)(1, "p", 23);
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 28)(1, "p", 29);
     i0.ɵɵtext(2);
-    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_span_3_Template, 2, 0, "span", 10);
+    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_span_3_Template, 2, 0, "span", 19);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 24)(5, "input", 25, 26);
-    i0.ɵɵlistener("dateChange", function DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_Template_input_dateChange_5_listener($event) { i0.ɵɵrestoreView(_r63); const control_r14 = i0.ɵɵnextContext(3).control; return i0.ɵɵresetView(control_r14.setValue($event)); });
+    i0.ɵɵelementStart(4, "div", 30)(5, "input", 31, 5);
+    i0.ɵɵlistener("dateChange", function DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_Template_input_dateChange_5_listener($event) { i0.ɵɵrestoreView(_r17); const control_r10 = i0.ɵɵnextContext(3).control; return i0.ɵɵresetView(control_r10.setValue($event)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(7, DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_img_7_Template, 1, 1, "img", 27);
+    i0.ɵɵtemplate(7, DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_img_7_Template, 1, 1, "img", 32);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(8, DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_ng_container_8_Template, 1, 4, "ng-container", 17);
+    i0.ɵɵtemplate(8, DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_ng_container_8_Template, 1, 4, "ng-container", 25);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r64 = i0.ɵɵnextContext(3);
-    const formgroup_r15 = ctx_r64.formGroup;
-    const field_r13 = ctx_r64.$implicit;
-    const control_r14 = ctx_r64.control;
-    const ctx_r53 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(9, _c12, (formgroup_r15 == null ? null : formgroup_r15.controls == null ? null : formgroup_r15.controls.subFields == null ? null : formgroup_r15.controls.subFields.controls == null ? null : formgroup_r15.controls.subFields.controls.length) && ctx_r53.removeSepratorForSubFields ? "none" : ""));
+    const ctx_r7 = i0.ɵɵnextContext(3);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(9, _c11, (formgroup_r11 == null ? null : formgroup_r11.controls == null ? null : formgroup_r11.controls.subFields == null ? null : formgroup_r11.controls.subFields.controls == null ? null : formgroup_r11.controls.subFields.controls.length) && ctx_r5.removeSepratorForSubFields ? "none" : ""));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", field_r13.title, " ");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.validators && field_r13.validators.length > 0);
+    i0.ɵɵtextInterpolate1(" ", field_r9.title, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.validators && field_r9.validators.length > 0);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("dpConfig", field_r13.fieldConfig)("selectedDate", control_r14.value)("offsetY", 0)("value", control_r14.value);
+    i0.ɵɵproperty("dpConfig", field_r9.fieldConfig)("selectedDate", control_r10.value)("offsetY", 0)("value", control_r10.value);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", ctx_r53.calendarIconUrl);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
+    i0.ɵɵproperty("ngIf", ctx_r5.calendarIconUrl);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", control_r10.touched && control_r10.errors);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_Template, 9, 11, "div", 21);
+    i0.ɵɵtemplate(0, DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_div_0_Template, 9, 11, "div", 27);
 } if (rf & 2) {
-    const field_r13 = i0.ɵɵnextContext(2).$implicit;
-    i0.ɵɵproperty("ngIf", field_r13.fieldType === "input" && field_r13.fieldInputType === "date");
+    const field_r9 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵproperty("ngIf", field_r9.fieldType === "input" && field_r9.fieldInputType === "date");
 } }
 function DynamicFormComponent_ng_template_3_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_2_ng_container_1_Template, 2, 6, "ng-container", 11);
-    i0.ɵɵtemplate(2, DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_Template, 1, 1, "ng-template", null, 20, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_2_ng_container_1_Template, 2, 6, "ng-container", 20)(2, DynamicFormComponent_ng_template_3_ng_container_2_ng_template_2_Template, 1, 1, "ng-template", null, 4, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const _r49 = i0.ɵɵreference(3);
-    const ctx_r18 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r18.customInputDate)("ngIfElse", _r49);
+    const defaultInputDate_r20 = i0.ɵɵreference(3);
+    const ctx_r5 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r5.customInputDate)("ngIfElse", defaultInputDate_r20);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_3_ng_container_1_ng_template_1_Template(rf, ctx) { }
 function DynamicFormComponent_ng_template_3_ng_container_3_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_3_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 6);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_3_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 15);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r70 = i0.ɵɵnextContext(2);
-    const field_r13 = ctx_r70.$implicit;
-    const control_r14 = ctx_r70.control;
-    const formgroup_r15 = ctx_r70.formGroup;
-    const ctx_r66 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r66.customBooleanToggle)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r13, control_r14, formgroup_r15));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r5.customBooleanToggle)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r9, control_r10, formgroup_r11));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
@@ -306,64 +306,63 @@ function DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_span_3_
     i0.ɵɵelementEnd();
 } }
 function DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_ng_container_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 6);
+    i0.ɵɵelementContainer(0, 15);
 } if (rf & 2) {
-    const control_r14 = i0.ɵɵnextContext(3).control;
+    const control_r10 = i0.ɵɵnextContext(3).control;
     i0.ɵɵnextContext();
-    const _r3 = i0.ɵɵreference(6);
-    i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c11, control_r14.errors));
+    const dynamicFieldErrors_r13 = i0.ɵɵreference(6);
+    i0.ɵɵproperty("ngTemplateOutlet", dynamicFieldErrors_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c13, control_r10.errors));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_Template(rf, ctx) { if (rf & 1) {
-    const _r76 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 22)(1, "p", 23);
+    const _r21 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 28)(1, "p", 29);
     i0.ɵɵtext(2);
-    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_span_3_Template, 2, 0, "span", 10);
+    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_span_3_Template, 2, 0, "span", 19);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "mis-switch", 30);
-    i0.ɵɵlistener("valueChanged", function DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_Template_mis_switch_valueChanged_4_listener($event) { i0.ɵɵrestoreView(_r76); const ctx_r75 = i0.ɵɵnextContext(2); const field_r13 = ctx_r75.$implicit; const formgroup_r15 = ctx_r75.formGroup; const ctx_r74 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r74.updateSubDynamicFields(field_r13, formgroup_r15, $event)); });
+    i0.ɵɵelementStart(4, "mis-switch", 34);
+    i0.ɵɵlistener("valueChanged", function DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_Template_mis_switch_valueChanged_4_listener($event) { i0.ɵɵrestoreView(_r21); const ctx_r7 = i0.ɵɵnextContext(2); const field_r9 = ctx_r7.$implicit; const formgroup_r11 = ctx_r7.formGroup; const ctx_r5 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r5.updateSubDynamicFields(field_r9, formgroup_r11, $event)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(5, DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_ng_container_5_Template, 1, 4, "ng-container", 17);
+    i0.ɵɵtemplate(5, DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_ng_container_5_Template, 1, 4, "ng-container", 25);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r77 = i0.ɵɵnextContext(2);
-    const formgroup_r15 = ctx_r77.formGroup;
-    const field_r13 = ctx_r77.$implicit;
-    const control_r14 = ctx_r77.control;
-    const ctx_r68 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(5, _c12, (formgroup_r15 == null ? null : formgroup_r15.controls == null ? null : formgroup_r15.controls.subFields == null ? null : formgroup_r15.controls.subFields.controls == null ? null : formgroup_r15.controls.subFields.controls.length) && ctx_r68.removeSepratorForSubFields ? "none" : ""));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(5, _c11, (formgroup_r11 == null ? null : formgroup_r11.controls == null ? null : formgroup_r11.controls.subFields == null ? null : formgroup_r11.controls.subFields.controls == null ? null : formgroup_r11.controls.subFields.controls.length) && ctx_r5.removeSepratorForSubFields ? "none" : ""));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", field_r13.title, "");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.validators && field_r13.validators.length > 0);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("control", control_r14);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
+    i0.ɵɵtextInterpolate1(" ", field_r9.title, "");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.validators && field_r9.validators.length > 0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("control", control_r10);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", control_r10.touched && control_r10.errors);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_3_ng_container_1_Template, 2, 6, "ng-container", 11);
-    i0.ɵɵtemplate(2, DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_Template, 6, 7, "ng-template", null, 29, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_3_ng_container_1_Template, 2, 6, "ng-container", 20)(2, DynamicFormComponent_ng_template_3_ng_container_3_ng_template_2_Template, 6, 7, "ng-template", null, 6, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const _r67 = i0.ɵɵreference(3);
-    const ctx_r19 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r19.customBooleanToggle)("ngIfElse", _r67);
+    const defaultBooleanToggle_r22 = i0.ɵɵreference(3);
+    const ctx_r5 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r5.customBooleanToggle)("ngIfElse", defaultBooleanToggle_r22);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_4_ng_container_1_ng_template_1_Template(rf, ctx) { }
 function DynamicFormComponent_ng_template_3_ng_container_4_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_4_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 6);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_4_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 15);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r82 = i0.ɵɵnextContext(2);
-    const field_r13 = ctx_r82.$implicit;
-    const control_r14 = ctx_r82.control;
-    const formgroup_r15 = ctx_r82.formGroup;
-    const ctx_r78 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r78.customSingleSelectDropdown)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r13, control_r14, formgroup_r15));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r5.customSingleSelectDropdown)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r9, control_r10, formgroup_r11));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
@@ -371,80 +370,78 @@ function DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_span_3_
     i0.ɵɵelementEnd();
 } }
 function DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_img_6_Template(rf, ctx) { if (rf & 1) {
-    const _r88 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "img", 35);
-    i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_img_6_Template_img_click_0_listener() { i0.ɵɵrestoreView(_r88); const field_r13 = i0.ɵɵnextContext(3).$implicit; const ctx_r86 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r86.fieldRemoved.emit(field_r13)); });
+    const _r24 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "img", 38);
+    i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_img_6_Template_img_click_0_listener() { i0.ɵɵrestoreView(_r24); const field_r9 = i0.ɵɵnextContext(3).$implicit; const ctx_r5 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r5.fieldRemoved.emit(field_r9)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r84 = i0.ɵɵnextContext(4);
-    i0.ɵɵproperty("src", ctx_r84.removeIconUrl, i0.ɵɵsanitizeUrl);
+    const ctx_r5 = i0.ɵɵnextContext(4);
+    i0.ɵɵproperty("src", ctx_r5.removeIconUrl, i0.ɵɵsanitizeUrl);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_ng_container_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 6);
+    i0.ɵɵelementContainer(0, 15);
 } if (rf & 2) {
-    const control_r14 = i0.ɵɵnextContext(3).control;
+    const control_r10 = i0.ɵɵnextContext(3).control;
     i0.ɵɵnextContext();
-    const _r3 = i0.ɵɵreference(6);
-    i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c11, control_r14.errors));
+    const dynamicFieldErrors_r13 = i0.ɵɵreference(6);
+    i0.ɵɵproperty("ngTemplateOutlet", dynamicFieldErrors_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c13, control_r10.errors));
 } }
-const _c14 = function (a0) { return { "removeable-container": a0 }; };
 function DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_Template(rf, ctx) { if (rf & 1) {
-    const _r92 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 22)(1, "p", 23);
+    const _r23 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 28)(1, "p", 29);
     i0.ɵɵtext(2);
-    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_span_3_Template, 2, 0, "span", 10);
+    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_span_3_Template, 2, 0, "span", 19);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 32)(5, "mis-dropdown", 33);
-    i0.ɵɵlistener("onChange", function DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_Template_mis_dropdown_onChange_5_listener($event) { i0.ɵɵrestoreView(_r92); const ctx_r91 = i0.ɵɵnextContext(2); const field_r13 = ctx_r91.$implicit; const control_r14 = ctx_r91.control; const formgroup_r15 = ctx_r91.formGroup; const ctx_r90 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r90.updateSelectedValueForSingleSelect(field_r13, control_r14, formgroup_r15, $event)); });
+    i0.ɵɵelementStart(4, "div", 35)(5, "mis-dropdown", 36);
+    i0.ɵɵlistener("onChange", function DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_Template_mis_dropdown_onChange_5_listener($event) { i0.ɵɵrestoreView(_r23); const ctx_r7 = i0.ɵɵnextContext(2); const field_r9 = ctx_r7.$implicit; const control_r10 = ctx_r7.control; const formgroup_r11 = ctx_r7.formGroup; const ctx_r5 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r5.updateSelectedValueForSingleSelect(field_r9, control_r10, formgroup_r11, $event)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_img_6_Template, 1, 1, "img", 34);
+    i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_img_6_Template, 1, 1, "img", 37);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(7, DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_ng_container_7_Template, 1, 4, "ng-container", 17);
+    i0.ɵɵtemplate(7, DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_ng_container_7_Template, 1, 4, "ng-container", 25);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r93 = i0.ɵɵnextContext(2);
-    const formgroup_r15 = ctx_r93.formGroup;
-    const field_r13 = ctx_r93.$implicit;
-    const control_r14 = ctx_r93.control;
-    const ctx_r80 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(10, _c12, (formgroup_r15 == null ? null : formgroup_r15.controls == null ? null : formgroup_r15.controls.subFields == null ? null : formgroup_r15.controls.subFields.controls == null ? null : formgroup_r15.controls.subFields.controls.length) && ctx_r80.removeSepratorForSubFields ? "none" : ""));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(10, _c11, (formgroup_r11 == null ? null : formgroup_r11.controls == null ? null : formgroup_r11.controls.subFields == null ? null : formgroup_r11.controls.subFields.controls == null ? null : formgroup_r11.controls.subFields.controls.length) && ctx_r5.removeSepratorForSubFields ? "none" : ""));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", field_r13.title, "");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.validators && field_r13.validators.length > 0);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(12, _c14, field_r13 == null ? null : field_r13.isRemoveable));
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("searchEnabled", false)("width", "140px")("data", field_r13.itemsList)("selectedItem", control_r14.value);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.isRemoveable && ctx_r80.removeIconUrl);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
+    i0.ɵɵtextInterpolate1(" ", field_r9.title, "");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.validators && field_r9.validators.length > 0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(12, _c14, field_r9 == null ? null : field_r9.isRemoveable));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("searchEnabled", false)("width", "140px")("data", field_r9.itemsList)("selectedItem", control_r10.value);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.isRemoveable && ctx_r5.removeIconUrl);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", control_r10.touched && control_r10.errors);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_4_ng_container_1_Template, 2, 6, "ng-container", 11);
-    i0.ɵɵtemplate(2, DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_Template, 8, 14, "ng-template", null, 31, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_4_ng_container_1_Template, 2, 6, "ng-container", 20)(2, DynamicFormComponent_ng_template_3_ng_container_4_ng_template_2_Template, 8, 14, "ng-template", null, 7, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const _r79 = i0.ɵɵreference(3);
-    const ctx_r20 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r20.customSingleSelectDropdown)("ngIfElse", _r79);
+    const defaultSingleSelectDropdown_r25 = i0.ɵɵreference(3);
+    const ctx_r5 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r5.customSingleSelectDropdown)("ngIfElse", defaultSingleSelectDropdown_r25);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_5_ng_container_1_ng_template_1_Template(rf, ctx) { }
 function DynamicFormComponent_ng_template_3_ng_container_5_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_5_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 6);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_5_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 15);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r98 = i0.ɵɵnextContext(2);
-    const field_r13 = ctx_r98.$implicit;
-    const control_r14 = ctx_r98.control;
-    const formgroup_r15 = ctx_r98.formGroup;
-    const ctx_r94 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r94.customSingleSelectRadio)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r13, control_r14, formgroup_r15));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r5.customSingleSelectRadio)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r9, control_r10, formgroup_r11));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
@@ -452,89 +449,87 @@ function DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_span_3_
     i0.ɵɵelementEnd();
 } }
 function DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_div_6_img_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "img", 41);
+    i0.ɵɵelement(0, "img", 43);
 } if (rf & 2) {
-    const ctx_r103 = i0.ɵɵnextContext(5);
-    i0.ɵɵproperty("src", ctx_r103.activeBtnIconUrl, i0.ɵɵsanitizeUrl);
+    const ctx_r5 = i0.ɵɵnextContext(5);
+    i0.ɵɵproperty("src", ctx_r5.activeBtnIconUrl, i0.ɵɵsanitizeUrl);
 } }
-const _c15 = function (a0) { return { "checkbox-active": a0 }; };
 function DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_div_6_Template(rf, ctx) { if (rf & 1) {
-    const _r106 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 39);
-    i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_div_6_Template_div_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r106); const item_r102 = restoredCtx.$implicit; const ctx_r105 = i0.ɵɵnextContext(3); const field_r13 = ctx_r105.$implicit; const control_r14 = ctx_r105.control; const formgroup_r15 = ctx_r105.formGroup; const ctx_r104 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r104.updateSelectedValueForSingleSelect(field_r13, control_r14, formgroup_r15, item_r102)); });
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_div_6_img_1_Template, 1, 1, "img", 40);
-    i0.ɵɵelementStart(2, "p", 23);
+    const _r26 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 41);
+    i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_div_6_Template_div_click_0_listener() { const item_r27 = i0.ɵɵrestoreView(_r26).$implicit; const ctx_r7 = i0.ɵɵnextContext(3); const field_r9 = ctx_r7.$implicit; const control_r10 = ctx_r7.control; const formgroup_r11 = ctx_r7.formGroup; const ctx_r5 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r5.updateSelectedValueForSingleSelect(field_r9, control_r10, formgroup_r11, item_r27)); });
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_div_6_img_1_Template, 1, 1, "img", 42);
+    i0.ɵɵelementStart(2, "p", 29);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const item_r102 = ctx.$implicit;
-    const control_r14 = i0.ɵɵnextContext(3).control;
-    const ctx_r100 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c15, item_r102.label === (control_r14.value == null ? null : control_r14.value.label)));
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", item_r102.label === (control_r14.value == null ? null : control_r14.value.label) && ctx_r100.activeBtnIconUrl);
+    const item_r27 = ctx.$implicit;
+    const control_r10 = i0.ɵɵnextContext(3).control;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c15, item_r27.label === (control_r10.value == null ? null : control_r10.value.label)));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", item_r27.label === (control_r10.value == null ? null : control_r10.value.label) && ctx_r5.activeBtnIconUrl);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(item_r102.label);
+    i0.ɵɵtextInterpolate(item_r27.label);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_ng_container_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 6);
+    i0.ɵɵelementContainer(0, 15);
 } if (rf & 2) {
-    const control_r14 = i0.ɵɵnextContext(3).control;
+    const control_r10 = i0.ɵɵnextContext(3).control;
     i0.ɵɵnextContext();
-    const _r3 = i0.ɵɵreference(6);
-    i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c11, control_r14.errors));
+    const dynamicFieldErrors_r13 = i0.ɵɵreference(6);
+    i0.ɵɵproperty("ngTemplateOutlet", dynamicFieldErrors_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c13, control_r10.errors));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 13)(1, "p", 14);
+    i0.ɵɵelementStart(0, "div", 21)(1, "p", 22);
     i0.ɵɵtext(2);
-    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_span_3_Template, 2, 0, "span", 10);
+    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_span_3_Template, 2, 0, "span", 19);
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(4, "div", 15);
-    i0.ɵɵelementStart(5, "div", 37);
-    i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_div_6_Template, 4, 5, "div", 38);
+    i0.ɵɵelement(4, "div", 23);
+    i0.ɵɵelementStart(5, "div", 39);
+    i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_div_6_Template, 4, 5, "div", 40);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(7, DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_ng_container_7_Template, 1, 4, "ng-container", 17);
+    i0.ɵɵtemplate(7, DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_ng_container_7_Template, 1, 4, "ng-container", 25);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r109 = i0.ɵɵnextContext(2);
-    const formgroup_r15 = ctx_r109.formGroup;
-    const field_r13 = ctx_r109.$implicit;
-    const control_r14 = ctx_r109.control;
-    const ctx_r96 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(5, _c12, (formgroup_r15 == null ? null : formgroup_r15.controls == null ? null : formgroup_r15.controls.subFields == null ? null : formgroup_r15.controls.subFields.controls == null ? null : formgroup_r15.controls.subFields.controls.length) && ctx_r96.removeSepratorForSubFields ? "none" : ""));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(5, _c11, (formgroup_r11 == null ? null : formgroup_r11.controls == null ? null : formgroup_r11.controls.subFields == null ? null : formgroup_r11.controls.subFields.controls == null ? null : formgroup_r11.controls.subFields.controls.length) && ctx_r5.removeSepratorForSubFields ? "none" : ""));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", field_r13.title, "");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.validators && field_r13.validators.length > 0);
+    i0.ɵɵtextInterpolate1(" ", field_r9.title, "");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.validators && field_r9.validators.length > 0);
     i0.ɵɵadvance(3);
-    i0.ɵɵproperty("ngForOf", field_r13.itemsList);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
+    i0.ɵɵproperty("ngForOf", field_r9.itemsList);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", control_r10.touched && control_r10.errors);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_5_ng_container_1_Template, 2, 6, "ng-container", 11);
-    i0.ɵɵtemplate(2, DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_Template, 8, 7, "ng-template", null, 36, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_5_ng_container_1_Template, 2, 6, "ng-container", 20)(2, DynamicFormComponent_ng_template_3_ng_container_5_ng_template_2_Template, 8, 7, "ng-template", null, 8, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const _r95 = i0.ɵɵreference(3);
-    const ctx_r21 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r21.customSingleSelectRadio)("ngIfElse", _r95);
+    const defaultSingleSelectRadio_r28 = i0.ɵɵreference(3);
+    const ctx_r5 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r5.customSingleSelectRadio)("ngIfElse", defaultSingleSelectRadio_r28);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_6_ng_container_1_ng_template_1_Template(rf, ctx) { }
 function DynamicFormComponent_ng_template_3_ng_container_6_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_6_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 6);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_6_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 15);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r114 = i0.ɵɵnextContext(2);
-    const field_r13 = ctx_r114.$implicit;
-    const control_r14 = ctx_r114.control;
-    const formgroup_r15 = ctx_r114.formGroup;
-    const ctx_r110 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r110.customMultiSelectCheckbox)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r13, control_r14, formgroup_r15));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r5.customMultiSelectCheckbox)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r9, control_r10, formgroup_r11));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
@@ -542,88 +537,87 @@ function DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_span_3_
     i0.ɵɵelementEnd();
 } }
 function DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_div_6_img_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "img", 41);
+    i0.ɵɵelement(0, "img", 43);
 } if (rf & 2) {
-    const ctx_r119 = i0.ɵɵnextContext(5);
-    i0.ɵɵproperty("src", ctx_r119.activeBtnIconUrl, i0.ɵɵsanitizeUrl);
+    const ctx_r5 = i0.ɵɵnextContext(5);
+    i0.ɵɵproperty("src", ctx_r5.activeBtnIconUrl, i0.ɵɵsanitizeUrl);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_div_6_Template(rf, ctx) { if (rf & 1) {
-    const _r122 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 39);
-    i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_div_6_Template_div_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r122); const item_r118 = restoredCtx.$implicit; const ctx_r121 = i0.ɵɵnextContext(3); const field_r13 = ctx_r121.$implicit; const control_r14 = ctx_r121.control; const formgroup_r15 = ctx_r121.formGroup; const ctx_r120 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r120.updateSelectedValueForMultiSelect(field_r13, control_r14, formgroup_r15, [item_r118])); });
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_div_6_img_1_Template, 1, 1, "img", 40);
-    i0.ɵɵelementStart(2, "p", 23);
+    const _r29 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 41);
+    i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_div_6_Template_div_click_0_listener() { const item_r30 = i0.ɵɵrestoreView(_r29).$implicit; const ctx_r7 = i0.ɵɵnextContext(3); const field_r9 = ctx_r7.$implicit; const control_r10 = ctx_r7.control; const formgroup_r11 = ctx_r7.formGroup; const ctx_r5 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r5.updateSelectedValueForMultiSelect(field_r9, control_r10, formgroup_r11, [item_r30])); });
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_div_6_img_1_Template, 1, 1, "img", 42);
+    i0.ɵɵelementStart(2, "p", 29);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const item_r118 = ctx.$implicit;
-    const control_r14 = i0.ɵɵnextContext(3).control;
-    const ctx_r116 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c15, ctx_r116.isCheckBoxSelected(item_r118.label, control_r14.value)));
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r116.isCheckBoxSelected(item_r118.label, control_r14.value) && ctx_r116.activeBtnIconUrl);
+    const item_r30 = ctx.$implicit;
+    const control_r10 = i0.ɵɵnextContext(3).control;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c15, ctx_r5.isCheckBoxSelected(item_r30.label, control_r10.value)));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r5.isCheckBoxSelected(item_r30.label, control_r10.value) && ctx_r5.activeBtnIconUrl);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(item_r118.label);
+    i0.ɵɵtextInterpolate(item_r30.label);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_ng_container_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 6);
+    i0.ɵɵelementContainer(0, 15);
 } if (rf & 2) {
-    const control_r14 = i0.ɵɵnextContext(3).control;
+    const control_r10 = i0.ɵɵnextContext(3).control;
     i0.ɵɵnextContext();
-    const _r3 = i0.ɵɵreference(6);
-    i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c11, control_r14.errors));
+    const dynamicFieldErrors_r13 = i0.ɵɵreference(6);
+    i0.ɵɵproperty("ngTemplateOutlet", dynamicFieldErrors_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c13, control_r10.errors));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 13)(1, "p", 14);
+    i0.ɵɵelementStart(0, "div", 21)(1, "p", 22);
     i0.ɵɵtext(2);
-    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_span_3_Template, 2, 0, "span", 10);
+    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_span_3_Template, 2, 0, "span", 19);
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(4, "div", 15);
-    i0.ɵɵelementStart(5, "div", 37);
-    i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_div_6_Template, 4, 5, "div", 38);
+    i0.ɵɵelement(4, "div", 23);
+    i0.ɵɵelementStart(5, "div", 39);
+    i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_div_6_Template, 4, 5, "div", 40);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(7, DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_ng_container_7_Template, 1, 4, "ng-container", 17);
+    i0.ɵɵtemplate(7, DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_ng_container_7_Template, 1, 4, "ng-container", 25);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r125 = i0.ɵɵnextContext(2);
-    const formgroup_r15 = ctx_r125.formGroup;
-    const field_r13 = ctx_r125.$implicit;
-    const control_r14 = ctx_r125.control;
-    const ctx_r112 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(5, _c12, (formgroup_r15 == null ? null : formgroup_r15.controls == null ? null : formgroup_r15.controls.subFields == null ? null : formgroup_r15.controls.subFields.controls == null ? null : formgroup_r15.controls.subFields.controls.length) && ctx_r112.removeSepratorForSubFields ? "none" : ""));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(5, _c11, (formgroup_r11 == null ? null : formgroup_r11.controls == null ? null : formgroup_r11.controls.subFields == null ? null : formgroup_r11.controls.subFields.controls == null ? null : formgroup_r11.controls.subFields.controls.length) && ctx_r5.removeSepratorForSubFields ? "none" : ""));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", field_r13.title, "");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.validators && field_r13.validators.length > 0);
+    i0.ɵɵtextInterpolate1(" ", field_r9.title, "");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.validators && field_r9.validators.length > 0);
     i0.ɵɵadvance(3);
-    i0.ɵɵproperty("ngForOf", field_r13.itemsList);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
+    i0.ɵɵproperty("ngForOf", field_r9.itemsList);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", control_r10.touched && control_r10.errors);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_6_ng_container_1_Template, 2, 6, "ng-container", 11);
-    i0.ɵɵtemplate(2, DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_Template, 8, 7, "ng-template", null, 42, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_6_ng_container_1_Template, 2, 6, "ng-container", 20)(2, DynamicFormComponent_ng_template_3_ng_container_6_ng_template_2_Template, 8, 7, "ng-template", null, 9, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const _r111 = i0.ɵɵreference(3);
-    const ctx_r22 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r22.customMultiSelectCheckbox)("ngIfElse", _r111);
+    const defaultMultiSelectCheckbox_r31 = i0.ɵɵreference(3);
+    const ctx_r5 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r5.customMultiSelectCheckbox)("ngIfElse", defaultMultiSelectCheckbox_r31);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_7_ng_container_1_ng_template_1_Template(rf, ctx) { }
 function DynamicFormComponent_ng_template_3_ng_container_7_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_7_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 6);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_7_ng_container_1_ng_template_1_Template, 0, 0, "ng-template", 15);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r130 = i0.ɵɵnextContext(2);
-    const field_r13 = ctx_r130.$implicit;
-    const control_r14 = ctx_r130.control;
-    const formgroup_r15 = ctx_r130.formGroup;
-    const ctx_r126 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r126.customMultiSelectDropdown)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r13, control_r14, formgroup_r15));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r5.customMultiSelectDropdown)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c10, field_r9, control_r10, formgroup_r11));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
@@ -631,79 +625,70 @@ function DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_span_3_
     i0.ɵɵelementEnd();
 } }
 function DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_ng_container_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 6);
+    i0.ɵɵelementContainer(0, 15);
 } if (rf & 2) {
-    const control_r14 = i0.ɵɵnextContext(3).control;
+    const control_r10 = i0.ɵɵnextContext(3).control;
     i0.ɵɵnextContext();
-    const _r3 = i0.ɵɵreference(6);
-    i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c11, control_r14.errors));
+    const dynamicFieldErrors_r13 = i0.ɵɵreference(6);
+    i0.ɵɵproperty("ngTemplateOutlet", dynamicFieldErrors_r13)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c13, control_r10.errors));
 } }
 function DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_Template(rf, ctx) { if (rf & 1) {
-    const _r136 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 22)(1, "p", 23);
+    const _r32 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 28)(1, "p", 29);
     i0.ɵɵtext(2);
-    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_span_3_Template, 2, 0, "span", 10);
+    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_span_3_Template, 2, 0, "span", 19);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(4, "mis-multi-select-dropdown", 44);
-    i0.ɵɵlistener("onChange", function DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_Template_mis_multi_select_dropdown_onChange_4_listener($event) { i0.ɵɵrestoreView(_r136); const ctx_r135 = i0.ɵɵnextContext(2); const field_r13 = ctx_r135.$implicit; const control_r14 = ctx_r135.control; const formgroup_r15 = ctx_r135.formGroup; const ctx_r134 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r134.updateSelectedValueForMultiSelect(field_r13, control_r14, formgroup_r15, $event)); });
+    i0.ɵɵlistener("onChange", function DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_Template_mis_multi_select_dropdown_onChange_4_listener($event) { i0.ɵɵrestoreView(_r32); const ctx_r7 = i0.ɵɵnextContext(2); const field_r9 = ctx_r7.$implicit; const control_r10 = ctx_r7.control; const formgroup_r11 = ctx_r7.formGroup; const ctx_r5 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r5.updateSelectedValueForMultiSelect(field_r9, control_r10, formgroup_r11, $event)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(5, DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_ng_container_5_Template, 1, 4, "ng-container", 17);
+    i0.ɵɵtemplate(5, DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_ng_container_5_Template, 1, 4, "ng-container", 25);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r137 = i0.ɵɵnextContext(2);
-    const formgroup_r15 = ctx_r137.formGroup;
-    const field_r13 = ctx_r137.$implicit;
-    const control_r14 = ctx_r137.control;
-    const ctx_r128 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(11, _c12, (formgroup_r15 == null ? null : formgroup_r15.controls == null ? null : formgroup_r15.controls.subFields == null ? null : formgroup_r15.controls.subFields.controls == null ? null : formgroup_r15.controls.subFields.controls.length) && ctx_r128.removeSepratorForSubFields ? "none" : ""));
+    const ctx_r7 = i0.ɵɵnextContext(2);
+    const field_r9 = ctx_r7.$implicit;
+    const control_r10 = ctx_r7.control;
+    const formgroup_r11 = ctx_r7.formGroup;
+    const ctx_r5 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(11, _c11, (formgroup_r11 == null ? null : formgroup_r11.controls == null ? null : formgroup_r11.controls.subFields == null ? null : formgroup_r11.controls.subFields.controls == null ? null : formgroup_r11.controls.subFields.controls.length) && ctx_r5.removeSepratorForSubFields ? "none" : ""));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", field_r13.title, "");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.validators && field_r13.validators.length > 0);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("width", "140px")("showSelectedCount", true)("dropdownListWidth", "256px")("searchEnabled", false)("hideApplyButton", true)("data", field_r13.itemsList)("selectedItems", control_r14.value);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
+    i0.ɵɵtextInterpolate1(" ", field_r9.title, "");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.validators && field_r9.validators.length > 0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("width", "140px")("showSelectedCount", true)("dropdownListWidth", "256px")("searchEnabled", false)("hideApplyButton", true)("data", field_r9.itemsList)("selectedItems", control_r10.value);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", control_r10.touched && control_r10.errors);
 } }
 function DynamicFormComponent_ng_template_3_ng_container_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_7_ng_container_1_Template, 2, 6, "ng-container", 11);
-    i0.ɵɵtemplate(2, DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_Template, 6, 13, "ng-template", null, 43, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_7_ng_container_1_Template, 2, 6, "ng-container", 20)(2, DynamicFormComponent_ng_template_3_ng_container_7_ng_template_2_Template, 6, 13, "ng-template", null, 10, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const _r127 = i0.ɵɵreference(3);
-    const ctx_r23 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r23.customMultiSelectDropdown)("ngIfElse", _r127);
+    const defaultMultiSelectDropdown_r33 = i0.ɵɵreference(3);
+    const ctx_r5 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r5.customMultiSelectDropdown)("ngIfElse", defaultMultiSelectDropdown_r33);
 } }
 function DynamicFormComponent_ng_template_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, DynamicFormComponent_ng_template_3_ng_container_0_Template, 4, 2, "ng-container", 10);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_ng_container_1_Template, 4, 2, "ng-container", 10);
-    i0.ɵɵtemplate(2, DynamicFormComponent_ng_template_3_ng_container_2_Template, 4, 2, "ng-container", 10);
-    i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_ng_container_3_Template, 4, 2, "ng-container", 10);
-    i0.ɵɵtemplate(4, DynamicFormComponent_ng_template_3_ng_container_4_Template, 4, 2, "ng-container", 10);
-    i0.ɵɵtemplate(5, DynamicFormComponent_ng_template_3_ng_container_5_Template, 4, 2, "ng-container", 10);
-    i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_ng_container_6_Template, 4, 2, "ng-container", 10);
-    i0.ɵɵtemplate(7, DynamicFormComponent_ng_template_3_ng_container_7_Template, 4, 2, "ng-container", 10);
+    i0.ɵɵtemplate(0, DynamicFormComponent_ng_template_3_ng_container_0_Template, 4, 2, "ng-container", 19)(1, DynamicFormComponent_ng_template_3_ng_container_1_Template, 4, 2, "ng-container", 19)(2, DynamicFormComponent_ng_template_3_ng_container_2_Template, 4, 2, "ng-container", 19)(3, DynamicFormComponent_ng_template_3_ng_container_3_Template, 4, 2, "ng-container", 19)(4, DynamicFormComponent_ng_template_3_ng_container_4_Template, 4, 2, "ng-container", 19)(5, DynamicFormComponent_ng_template_3_ng_container_5_Template, 4, 2, "ng-container", 19)(6, DynamicFormComponent_ng_template_3_ng_container_6_Template, 4, 2, "ng-container", 19)(7, DynamicFormComponent_ng_template_3_ng_container_7_Template, 4, 2, "ng-container", 19);
 } if (rf & 2) {
-    const field_r13 = ctx.$implicit;
-    i0.ɵɵproperty("ngIf", field_r13.fieldType === "input" && (field_r13.fieldInputType === "text" || field_r13.fieldInputType === "number"));
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.fieldType === "input" && field_r13.fieldInputType === "textarea");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.fieldType === "input" && field_r13.fieldInputType === "date");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.fieldType === "boolean" && field_r13.fieldInputType === "toggle");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.fieldType === "singleSelect" && field_r13.fieldInputType === "dropdown");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.fieldType === "singleSelect" && field_r13.fieldInputType === "radio");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.fieldType === "multiSelect" && field_r13.fieldInputType === "checkbox");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", field_r13.fieldType === "multiSelect" && field_r13.fieldInputType === "dropdown");
+    const field_r9 = ctx.$implicit;
+    i0.ɵɵproperty("ngIf", field_r9.fieldType === "input" && (field_r9.fieldInputType === "text" || field_r9.fieldInputType === "number"));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.fieldType === "input" && field_r9.fieldInputType === "textarea");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.fieldType === "input" && field_r9.fieldInputType === "date");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.fieldType === "boolean" && field_r9.fieldInputType === "toggle");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.fieldType === "singleSelect" && field_r9.fieldInputType === "dropdown");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.fieldType === "singleSelect" && field_r9.fieldInputType === "radio");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.fieldType === "multiSelect" && field_r9.fieldInputType === "checkbox");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r9.fieldType === "multiSelect" && field_r9.fieldInputType === "dropdown");
 } }
-const _c16 = function () { return { "flex-basis": "100%", "height": "0" }; };
 function DynamicFormComponent_ng_template_5_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵelementStart(1, "p", 46);
@@ -712,21 +697,21 @@ function DynamicFormComponent_ng_template_5_ng_container_1_Template(rf, ctx) { i
     i0.ɵɵelement(3, "div", 47);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const error_r140 = ctx.$implicit;
+    const error_r34 = ctx.$implicit;
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", " \u2022 \u00A0" + error_r140.value, " ");
-    i0.ɵɵadvance(1);
+    i0.ɵɵtextInterpolate1(" ", " \u2022 \u00A0" + error_r34.value, " ");
+    i0.ɵɵadvance();
     i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(2, _c16));
 } }
 function DynamicFormComponent_ng_template_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 45);
-    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_5_ng_container_1_Template, 4, 3, "ng-container", 9);
+    i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_5_ng_container_1_Template, 4, 3, "ng-container", 18);
     i0.ɵɵpipe(2, "keyvalue");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const errors_r138 = ctx.$implicit;
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngForOf", i0.ɵɵpipeBind1(2, 1, errors_r138));
+    const errors_r35 = ctx.$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngForOf", i0.ɵɵpipeBind1(2, 1, errors_r35));
 } }
 class DynamicFormComponent {
     constructor() {
@@ -972,44 +957,43 @@ class DynamicFormComponent {
         else
             return formValue;
     }
+    static { this.ɵfac = function DynamicFormComponent_Factory(t) { return new (t || DynamicFormComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DynamicFormComponent, selectors: [["mis-dynamic-form"]], contentQueries: function DynamicFormComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
+            i0.ɵɵcontentQuery(dirIndex, _c0, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c1, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c2, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c3, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c4, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c5, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c6, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c7, 5);
+        } if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customInputTextNumber = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customInputTextarea = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customInputDate = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customBooleanToggle = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customSingleSelectDropdown = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customSingleSelectRadio = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customMultiSelectCheckbox = _t.first);
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customMultiSelectDropdown = _t.first);
+        } }, inputs: { formFields: "formFields", formValues: "formValues", activeBtnIconUrl: "activeBtnIconUrl", calendarIconUrl: "calendarIconUrl", removeIconUrl: "removeIconUrl", removeSepratorForSubFields: "removeSepratorForSubFields" }, outputs: { formUpdated: "formUpdated", formValid: "formValid", formInitialized: "formInitialized", fieldRemoved: "fieldRemoved" }, decls: 7, vars: 2, consts: [["dynamicField", ""], ["dynamicFieldErrors", ""], ["defaultInputTextNumber", ""], ["defaultInputTextarea", ""], ["defaultInputDate", ""], ["dp", ""], ["defaultBooleanToggle", ""], ["defaultSingleSelectDropdown", ""], ["defaultSingleSelectRadio", ""], ["defaultMultiSelectCheckbox", ""], ["defaultMultiSelectDropdown", ""], [3, "formGroup"], ["formArrayName", "dynamicFields"], [3, "formGroupName", 4, "ngFor", "ngForOf"], [3, "formGroupName"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["class", "sub-dynamic-form", 4, "ngIf"], [1, "sub-dynamic-form"], [4, "ngFor", "ngForOf"], [4, "ngIf"], [4, "ngIf", "ngIfElse"], [1, "dynamic-field", "multi-line-field-container", 3, "ngStyle"], [1, "h7", "field-title-sm"], [2, "flex-basis", "100%"], [1, "input-field", "ip-text", 3, "ngModelChange", "type", "formControl", "ngStyle", "placeholder", "min"], [3, "ngTemplateOutlet", "ngTemplateOutletContext", 4, "ngIf"], ["type", "text", 1, "input-field", "ip-textarea", 3, "ngModelChange", "ngStyle", "placeholder", "formControl"], ["class", "dynamic-field single-line-field-container", 3, "ngStyle", 4, "ngIf"], [1, "dynamic-field", "single-line-field-container", 3, "ngStyle"], [1, "h6"], [1, "date-picker-container"], ["readonly", "", "misTzDp", "", 1, "date-picker", 3, "dateChange", "dpConfig", "selectedDate", "offsetY", "value"], ["alt", "data-picker", "class", "date-picker-icon", 3, "src", "click", 4, "ngIf"], ["alt", "data-picker", 1, "date-picker-icon", 3, "click", "src"], [3, "valueChanged", "control"], [3, "ngClass"], [3, "onChange", "searchEnabled", "width", "data", "selectedItem"], ["class", "remove-icon", 3, "src", "click", 4, "ngIf"], [1, "remove-icon", 3, "click", "src"], ["id", "checkboxes-container"], ["class", "radio-checkbox-common", 3, "ngClass", "click", 4, "ngFor", "ngForOf"], [1, "radio-checkbox-common", 3, "click", "ngClass"], ["alt", "", 3, "src", 4, "ngIf"], ["alt", "", 3, "src"], [3, "onChange", "width", "showSelectedCount", "dropdownListWidth", "searchEnabled", "hideApplyButton", "data", "selectedItems"], ["id", "error-messages-container"], [1, "h8"], [3, "ngStyle"]], template: function DynamicFormComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "form", 11);
+            i0.ɵɵelementContainerStart(1, 12);
+            i0.ɵɵtemplate(2, DynamicFormComponent_ng_container_2_Template, 3, 8, "ng-container", 13);
+            i0.ɵɵelementContainerEnd();
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_Template, 8, 8, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(5, DynamicFormComponent_ng_template_5_Template, 3, 3, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+        } if (rf & 2) {
+            i0.ɵɵproperty("formGroup", ctx.dynamicForm);
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("ngForOf", ctx.getDynamicFieldsControls().controls);
+        } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.NgStyle, i2.ɵNgNoValidate, i2.DefaultValueAccessor, i2.NgControlStatus, i2.NgControlStatusGroup, i2.FormControlDirective, i2.FormGroupDirective, i2.FormGroupName, i2.FormArrayName, i3.DropdownComponent, i4.SwitchComponent, i5.MultiSelectDropdownComponent, i6.TzDatepickerDirective, i1.KeyValuePipe], styles: ["p[_ngcontent-%COMP%]{margin:0;cursor:default}  .main-container{margin:0;max-width:100%}.sub-dynamic-form[_ngcontent-%COMP%]{padding-left:24px;border-bottom:1px solid var(--grey-seperators)}.dynamic-field[_ngcontent-%COMP%]     .container{height:32px!important}.single-line-field-container[_ngcontent-%COMP%]{display:flex;justify-content:space-between;align-items:center;padding:28px 16px;border-bottom:1px solid var(--grey-seperators)}.multi-line-field-container[_ngcontent-%COMP%]{display:flex;justify-content:flex-start;align-items:flex-start;padding:28px 16px;flex-wrap:wrap;border-bottom:1px solid var(--grey-seperators)}.field-title-sm[_ngcontent-%COMP%]{margin-bottom:8px;cursor:default}.input-field[_ngcontent-%COMP%]{width:100%;background-color:var(--grey-bg-1);border:1px solid var(--grey-seperators);border-radius:6px}.ip-text[_ngcontent-%COMP%]{height:44px;padding:8px 12px}.ip-textarea[_ngcontent-%COMP%]{max-height:94px;padding:8px}input[_ngcontent-%COMP%]:focus{outline:none}input[_ngcontent-%COMP%]::placeholder{color:var(--grey-seperators)}textarea[_ngcontent-%COMP%]:focus{outline:none}.date-picker-container[_ngcontent-%COMP%]{position:relative;width:140px}.date-picker-container[_ngcontent-%COMP%]   .date-picker[_ngcontent-%COMP%]{cursor:pointer;height:32px;width:100%;font-size:14px;border-radius:6px;padding:0 12px;border:1px solid var(--grey-seperators);inset:10px auto auto 80px;background-color:var(--text-white)}.date-picker-container[_ngcontent-%COMP%]   .date-picker[_ngcontent-%COMP%]:hover{background-color:var(--grey-hover)}.date-picker-container[_ngcontent-%COMP%]   .date-picker-icon[_ngcontent-%COMP%]{position:absolute;top:50%;right:12px;transform:translateY(-50%);cursor:pointer}form[_ngcontent-%COMP%]   .dynamic-field[_ngcontent-%COMP%]:last-child{border-bottom:none!important}#checkboxes-container[_ngcontent-%COMP%]{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}.radio-checkbox-common[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;cursor:pointer;margin-right:8px;margin-bottom:8px;background-color:var(--text-white);padding:12px 16px;border:1px solid var(--text-muted);border-radius:8px}.radio-checkbox-common[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]{color:var(--text-muted);cursor:pointer}.radio-checkbox-common[_ngcontent-%COMP%]   img[_ngcontent-%COMP%]{margin-right:8px}.checkbox-active[_ngcontent-%COMP%]{background-color:var(--pmry-500)}.checkbox-active[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]{color:var(--text-white)}#error-messages-container[_ngcontent-%COMP%]{margin-top:4px;width:100%;display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}#error-messages-container[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]{color:var(--sem-error)}.removeable-container[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center}.removeable-container[_ngcontent-%COMP%]   .remove-icon[_ngcontent-%COMP%]{cursor:pointer;margin-left:8px;max-width:24px}span[_ngcontent-%COMP%]{color:var(--sem-error)}"] }); }
 }
-DynamicFormComponent.ɵfac = function DynamicFormComponent_Factory(t) { return new (t || DynamicFormComponent)(); };
-DynamicFormComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DynamicFormComponent, selectors: [["mis-dynamic-form"]], contentQueries: function DynamicFormComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
-        i0.ɵɵcontentQuery(dirIndex, _c0, 5);
-        i0.ɵɵcontentQuery(dirIndex, _c1, 5);
-        i0.ɵɵcontentQuery(dirIndex, _c2, 5);
-        i0.ɵɵcontentQuery(dirIndex, _c3, 5);
-        i0.ɵɵcontentQuery(dirIndex, _c4, 5);
-        i0.ɵɵcontentQuery(dirIndex, _c5, 5);
-        i0.ɵɵcontentQuery(dirIndex, _c6, 5);
-        i0.ɵɵcontentQuery(dirIndex, _c7, 5);
-    } if (rf & 2) {
-        let _t;
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customInputTextNumber = _t.first);
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customInputTextarea = _t.first);
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customInputDate = _t.first);
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customBooleanToggle = _t.first);
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customSingleSelectDropdown = _t.first);
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customSingleSelectRadio = _t.first);
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customMultiSelectCheckbox = _t.first);
-        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customMultiSelectDropdown = _t.first);
-    } }, inputs: { formFields: "formFields", formValues: "formValues", activeBtnIconUrl: "activeBtnIconUrl", calendarIconUrl: "calendarIconUrl", removeIconUrl: "removeIconUrl", removeSepratorForSubFields: "removeSepratorForSubFields" }, outputs: { formUpdated: "formUpdated", formValid: "formValid", formInitialized: "formInitialized", fieldRemoved: "fieldRemoved" }, decls: 7, vars: 2, consts: [[3, "formGroup"], ["formArrayName", "dynamicFields"], [3, "formGroupName", 4, "ngFor", "ngForOf"], ["dynamicField", ""], ["dynamicFieldErrors", ""], [3, "formGroupName"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["class", "sub-dynamic-form", 4, "ngIf"], [1, "sub-dynamic-form"], [4, "ngFor", "ngForOf"], [4, "ngIf"], [4, "ngIf", "ngIfElse"], ["defaultInputTextNumber", ""], [1, "dynamic-field", "multi-line-field-container", 3, "ngStyle"], [1, "h7", "field-title-sm"], [2, "flex-basis", "100%"], [1, "input-field", "ip-text", 3, "type", "formControl", "ngStyle", "placeholder", "min", "ngModelChange"], [3, "ngTemplateOutlet", "ngTemplateOutletContext", 4, "ngIf"], ["defaultInputTextarea", ""], ["type", "text", 1, "input-field", "ip-textarea", 3, "ngStyle", "placeholder", "formControl", "ngModelChange"], ["defaultInputDate", ""], ["class", "dynamic-field single-line-field-container", 3, "ngStyle", 4, "ngIf"], [1, "dynamic-field", "single-line-field-container", 3, "ngStyle"], [1, "h6"], [1, "date-picker-container"], ["readonly", "", "misTzDp", "", 1, "date-picker", 3, "dpConfig", "selectedDate", "offsetY", "value", "dateChange"], ["dp", ""], ["alt", "data-picker", "class", "date-picker-icon", 3, "src", "click", 4, "ngIf"], ["alt", "data-picker", 1, "date-picker-icon", 3, "src", "click"], ["defaultBooleanToggle", ""], [3, "control", "valueChanged"], ["defaultSingleSelectDropdown", ""], [3, "ngClass"], [3, "searchEnabled", "width", "data", "selectedItem", "onChange"], ["class", "remove-icon", 3, "src", "click", 4, "ngIf"], [1, "remove-icon", 3, "src", "click"], ["defaultSingleSelectRadio", ""], ["id", "checkboxes-container"], ["class", "radio-checkbox-common", 3, "ngClass", "click", 4, "ngFor", "ngForOf"], [1, "radio-checkbox-common", 3, "ngClass", "click"], ["alt", "", 3, "src", 4, "ngIf"], ["alt", "", 3, "src"], ["defaultMultiSelectCheckbox", ""], ["defaultMultiSelectDropdown", ""], [3, "width", "showSelectedCount", "dropdownListWidth", "searchEnabled", "hideApplyButton", "data", "selectedItems", "onChange"], ["id", "error-messages-container"], [1, "h8"], [3, "ngStyle"]], template: function DynamicFormComponent_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵelementStart(0, "form", 0);
-        i0.ɵɵelementContainerStart(1, 1);
-        i0.ɵɵtemplate(2, DynamicFormComponent_ng_container_2_Template, 3, 8, "ng-container", 2);
-        i0.ɵɵelementContainerEnd();
-        i0.ɵɵelementEnd();
-        i0.ɵɵtemplate(3, DynamicFormComponent_ng_template_3_Template, 8, 8, "ng-template", null, 3, i0.ɵɵtemplateRefExtractor);
-        i0.ɵɵtemplate(5, DynamicFormComponent_ng_template_5_Template, 3, 3, "ng-template", null, 4, i0.ɵɵtemplateRefExtractor);
-    } if (rf & 2) {
-        i0.ɵɵproperty("formGroup", ctx.dynamicForm);
-        i0.ɵɵadvance(2);
-        i0.ɵɵproperty("ngForOf", ctx.getDynamicFieldsControls().controls);
-    } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgTemplateOutlet, i1.NgStyle, i2.ɵNgNoValidate, i2.DefaultValueAccessor, i2.NgControlStatus, i2.NgControlStatusGroup, i2.FormControlDirective, i2.FormGroupDirective, i2.FormGroupName, i2.FormArrayName, i3.DropdownComponent, i4.SwitchComponent, i5.MultiSelectDropdownComponent, i6.TzDatepickerDirective, i1.KeyValuePipe], styles: ["p[_ngcontent-%COMP%]{margin:0;cursor:default}  .main-container{margin:0;max-width:100%}.sub-dynamic-form[_ngcontent-%COMP%]{padding-left:24px;border-bottom:1px solid var(--grey-seperators)}.dynamic-field[_ngcontent-%COMP%]     .container{height:32px!important}.single-line-field-container[_ngcontent-%COMP%]{display:flex;justify-content:space-between;align-items:center;padding:28px 16px;border-bottom:1px solid var(--grey-seperators)}.multi-line-field-container[_ngcontent-%COMP%]{display:flex;justify-content:flex-start;align-items:flex-start;padding:28px 16px;flex-wrap:wrap;border-bottom:1px solid var(--grey-seperators)}.field-title-sm[_ngcontent-%COMP%]{margin-bottom:8px;cursor:default}.input-field[_ngcontent-%COMP%]{width:100%;background-color:var(--grey-bg-1);border:1px solid var(--grey-seperators);border-radius:6px}.ip-text[_ngcontent-%COMP%]{height:44px;padding:8px 12px}.ip-textarea[_ngcontent-%COMP%]{max-height:94px;padding:8px}input[_ngcontent-%COMP%]:focus{outline:none}input[_ngcontent-%COMP%]::placeholder{color:var(--grey-seperators)}textarea[_ngcontent-%COMP%]:focus{outline:none}.date-picker-container[_ngcontent-%COMP%]{position:relative;width:140px}.date-picker-container[_ngcontent-%COMP%]   .date-picker[_ngcontent-%COMP%]{cursor:pointer;height:32px;width:100%;font-size:14px;border-radius:6px;padding:0 12px;border:1px solid var(--grey-seperators);inset:10px auto auto 80px;background-color:var(--text-white)}.date-picker-container[_ngcontent-%COMP%]   .date-picker[_ngcontent-%COMP%]:hover{background-color:var(--grey-hover)}.date-picker-container[_ngcontent-%COMP%]   .date-picker-icon[_ngcontent-%COMP%]{position:absolute;top:50%;right:12px;transform:translateY(-50%);cursor:pointer}form[_ngcontent-%COMP%]   .dynamic-field[_ngcontent-%COMP%]:last-child{border-bottom:none!important}#checkboxes-container[_ngcontent-%COMP%]{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}.radio-checkbox-common[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;cursor:pointer;margin-right:8px;margin-bottom:8px;background-color:var(--text-white);padding:12px 16px;border:1px solid var(--text-muted);border-radius:8px}.radio-checkbox-common[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]{color:var(--text-muted);cursor:pointer}.radio-checkbox-common[_ngcontent-%COMP%]   img[_ngcontent-%COMP%]{margin-right:8px}.checkbox-active[_ngcontent-%COMP%]{background-color:var(--pmry-500)}.checkbox-active[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]{color:var(--text-white)}#error-messages-container[_ngcontent-%COMP%]{margin-top:4px;width:100%;display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}#error-messages-container[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]{color:var(--sem-error)}.removeable-container[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center}.removeable-container[_ngcontent-%COMP%]   .remove-icon[_ngcontent-%COMP%]{cursor:pointer;margin-left:8px;max-width:24px}span[_ngcontent-%COMP%]{color:var(--sem-error)}"] });
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DynamicFormComponent, [{
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DynamicFormComponent, [{
         type: Component,
         args: [{ selector: "mis-dynamic-form", template: "<form [formGroup]=\"dynamicForm\">\n  <ng-container formArrayName=\"dynamicFields\">\n    <ng-container [formGroupName]=\"i\" *ngFor=\"let fieldControl of getDynamicFieldsControls().controls; let i = index\">\n        <ng-container\n        [ngTemplateOutlet]=\"dynamicField\"\n        [ngTemplateOutletContext]=\"{\n          $implicit: formFields[i],\n          formGroup: fieldControl,\n          control: fieldControl.controls.value\n        }\"\n      >\n      </ng-container>\n      <div class=\"sub-dynamic-form\" *ngIf=\"fieldControl.value && (!!formFields[i]?.subFields && formFields[i]?.subFields?.length > 0 && matchParentConfig(formFields[i]?.subFields, fieldControl.controls.value.value.value))\">\n        <ng-container *ngFor=\"let subFieldControl of fieldControl.controls.subFields.controls; let j = index\">\n          <ng-container\n            [ngTemplateOutlet]=\"dynamicField\"\n            [ngTemplateOutletContext]=\"{\n              $implicit: findSelectedSubFieldConfig(formFields[i]?.subFields, fieldControl.controls.value.value.value,j),\n              control: subFieldControl\n            }\">\n          </ng-container>\n        </ng-container>\n      </div>\n    </ng-container>\n  </ng-container>\n</form>\n\n\n<ng-template #dynamicField let-field let-control=\"control\" let-formgroup=\"formGroup\">\n\n  <!-- fieldType: 'input' fieldInputType: 'text' | 'number' -->\n  <ng-container *ngIf=\"field.fieldType === 'input' && (field.fieldInputType === 'text' || field.fieldInputType === 'number')\">\n    <ng-container *ngIf=\"customInputTextNumber; else defaultInputTextNumber\">\n      <ng-template\n        [ngTemplateOutlet]=\"customInputTextNumber\"\n        [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n      ></ng-template>\n    </ng-container>\n    <ng-template #defaultInputTextNumber>\n      <div class=\"dynamic-field multi-line-field-container\"\n        [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ?  'none':''}\">\n        <p class=\"h7 field-title-sm\">\n          {{ field?.title }} <span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n        </p>\n        <div style=\"flex-basis: 100%\"></div>\n        <input class=\"input-field ip-text\" [type]=\"field.fieldInputType\" [formControl]=\"control\"\n          (ngModelChange)=\"updateSubDynamicFields(field, formgroup, $event)\" \n          [ngStyle]=\"{'border': control.touched && control.errors ? '1px solid #B00020': ''}\"\n          [placeholder]=\"field.placeholderText ? field.placeholderText : 'Input Text'\" \n          [min]=\"field.fieldInputType === 'number' ? 0 : '' \"/>\n        <ng-container *ngIf=\"control.touched && control.errors\"\n          [ngTemplateOutlet]=\"dynamicFieldErrors\" \n          [ngTemplateOutletContext]=\"{ $implicit: control.errors }\"\n        >\n        </ng-container>\n      </div>\n    </ng-template>\n  </ng-container>\n  \n  <!-- fieldType: 'input' fieldInputType: 'textarea' -->\n  <ng-container *ngIf=\"field.fieldType === 'input' && field.fieldInputType === 'textarea'\">\n    <ng-container *ngIf=\"customInputTextarea; else defaultInputTextarea\">\n      <ng-template\n      [ngTemplateOutlet]=\"customInputTextarea\"\n      [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n    ></ng-template>\n    </ng-container>\n    <ng-template #defaultInputTextarea>\n      <div class=\"dynamic-field multi-line-field-container\"\n      [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ?  'none':''}\">\n        <p class=\"h7 field-title-sm\">\n          {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n        </p>\n        <div style=\"flex-basis: 100%\"></div>\n        <textarea class=\"input-field ip-textarea\" type=\"text\"\n          [ngStyle]=\"{'border': control.touched && control.errors ? '1px solid #B00020': ''}\"\n          [placeholder]=\"field.placeholderText ? field.placeholderText : 'Input Text'\" [formControl]=\"control\" (ngModelChange)=\"updateSubDynamicFields(field, formgroup, $event)\"></textarea>\n          <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n            [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n          </ng-container>\n      </div>\n    </ng-template>\n  </ng-container>\n  \n  <!-- fieldType: 'input' fieldInputType: 'date' -->\n  <ng-container *ngIf=\"field.fieldType === 'input' && field.fieldInputType === 'date'\">\n    <ng-container *ngIf=\"customInputDate; else defaultInputDate\">\n      <ng-template\n        [ngTemplateOutlet]=\"customInputDate\"\n        [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n      ></ng-template>\n    </ng-container>\n    <ng-template #defaultInputDate>\n      <div class=\"dynamic-field single-line-field-container\"\n      [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ?  'none':''}\"\n        *ngIf=\"field.fieldType === 'input' && field.fieldInputType === 'date'\">\n        <p class=\"h6\">\n          {{ field.title }} <span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n        </p>\n        <div class=\"date-picker-container\">\n          <input class=\"date-picker\" readonly misTzDp [dpConfig]=\"field.fieldConfig\"\n            (dateChange)=\"control.setValue($event)\" [selectedDate]=\"control.value\" [offsetY]=\"0\"\n            [value]=\"control.value\" #dp />\n          <img alt=\"data-picker\" *ngIf=\"calendarIconUrl\" class=\"date-picker-icon\" [src]=\"calendarIconUrl\"\n            (click)=\"dp.click()\" />\n        </div>\n        <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n          [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n        </ng-container>\n      </div>\n    </ng-template>\n  </ng-container>\n\n  <!-- fieldType: 'boolean' fieldInputType: 'toggle' -->\n  <ng-container *ngIf=\"field.fieldType === 'boolean' && field.fieldInputType === 'toggle'\">\n    <ng-container *ngIf=\"customBooleanToggle; else defaultBooleanToggle\">\n      <ng-template\n        [ngTemplateOutlet]=\"customBooleanToggle\"\n        [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n      ></ng-template>\n    </ng-container>\n    <ng-template #defaultBooleanToggle>\n      <div class=\"dynamic-field single-line-field-container\"\n      [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ?  'none':''}\">\n        <p class=\"h6\">\n          {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n        </p>\n        <mis-switch [control]=\"control\" (valueChanged)=\"updateSubDynamicFields(field, formgroup, $event)\"></mis-switch>\n        <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n          [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n        </ng-container>\n      </div>    \n    </ng-template>\n  </ng-container>\n\n  <!-- fieldType: 'singleSelect' fieldInputType: 'dropdown' -->\n  <ng-container *ngIf=\"field.fieldType === 'singleSelect' && field.fieldInputType === 'dropdown'\">\n    <ng-container *ngIf=\"customSingleSelectDropdown; else defaultSingleSelectDropdown\">\n      <ng-template\n        [ngTemplateOutlet]=\"customSingleSelectDropdown\"\n        [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n      ></ng-template>\n    </ng-container>\n    <ng-template #defaultSingleSelectDropdown>\n      <div class=\"dynamic-field single-line-field-container\"\n        [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ?  'none':''}\">\n        <p class=\"h6\">\n          {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n        </p>\n        <div [ngClass]=\"{'removeable-container' : field?.isRemoveable}\">\n          <mis-dropdown [searchEnabled]=\"false\" [width]=\"'140px'\" [data]=\"field.itemsList\" [selectedItem]=\"control.value\"\n          (onChange)=\"updateSelectedValueForSingleSelect(field, control, formgroup, $event);\">\n          </mis-dropdown>\n          <img *ngIf=\"field.isRemoveable && removeIconUrl\" class=\"remove-icon\" [src]=\"removeIconUrl\" (click)=\"fieldRemoved.emit(field)\">\n        </div>\n        <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n          [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n        </ng-container>\n      </div>\n    </ng-template>\n  </ng-container >\n  \n\n  <!-- fieldType: 'singleSelect' fieldInputType: 'radio' -->\n  <ng-container *ngIf=\"field.fieldType === 'singleSelect' && field.fieldInputType === 'radio'\">\n    <ng-container *ngIf=\"customSingleSelectRadio; else defaultSingleSelectRadio\">\n      <ng-template\n        [ngTemplateOutlet]=\"customSingleSelectRadio\"\n        [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n      ></ng-template>\n    </ng-container>\n    <ng-template #defaultSingleSelectRadio>\n      <div class=\"dynamic-field multi-line-field-container\"\n      [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ?  'none':''}\">\n        <p class=\"h7 field-title-sm\">\n          {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n        </p>\n        <div style=\"flex-basis: 100%\"></div>\n        <div id=\"checkboxes-container\">\n          <div class=\"radio-checkbox-common\" *ngFor=\"let item of field.itemsList\"\n            [ngClass]=\"{ 'checkbox-active': item.label === control.value?.label }\"\n            (click)=\"updateSelectedValueForSingleSelect(field, control, formgroup, item);\">\n            <img *ngIf=\"(item.label === control.value?.label) && activeBtnIconUrl\" [src]=\"activeBtnIconUrl\" alt=\"\" />\n            <p class=\"h6\">{{ item.label }}</p>\n          </div>\n        </div>\n        <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n          [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n        </ng-container>\n      </div>\n    </ng-template>\n  </ng-container>\n  \n\n  <!-- fieldType: 'multiSelect' fieldInputType: 'checkbox' -->\n  <ng-container *ngIf=\"field.fieldType === 'multiSelect' && field.fieldInputType === 'checkbox'\">\n    <ng-container *ngIf=\"customMultiSelectCheckbox; else defaultMultiSelectCheckbox\">\n      <ng-template\n        [ngTemplateOutlet]=\"customMultiSelectCheckbox\"\n        [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n      ></ng-template>\n    </ng-container>\n    <ng-template #defaultMultiSelectCheckbox>\n      <div class=\"dynamic-field multi-line-field-container\"\n      [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ?  'none':''}\">\n        <p class=\"h7 field-title-sm\">\n          {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n        </p>\n        <div style=\"flex-basis: 100%\"></div>\n        <div id=\"checkboxes-container\">\n          <div class=\"radio-checkbox-common\" *ngFor=\"let item of field.itemsList\"\n            [ngClass]=\"{ 'checkbox-active': isCheckBoxSelected(item.label, control.value) }\"\n            (click)=\"updateSelectedValueForMultiSelect(field, control, formgroup, [item])\">\n            <img *ngIf=\"isCheckBoxSelected(item.label, control.value) && activeBtnIconUrl\" [src]=\"activeBtnIconUrl\"\n              alt=\"\" />\n            <p class=\"h6\">{{ item.label }}</p>\n          </div>\n        </div>\n        <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n          [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n        </ng-container>\n      </div>\n    </ng-template>\n  </ng-container>\n\n\n  <!-- fieldType: 'multiSelect' fieldInputType: 'dropdown' -->\n  <ng-container *ngIf=\"field.fieldType === 'multiSelect' && field.fieldInputType === 'dropdown'\">\n    <ng-container *ngIf=\"customMultiSelectDropdown; else defaultMultiSelectDropdown\">\n      <ng-template\n        [ngTemplateOutlet]=\"customMultiSelectDropdown\"\n        [ngTemplateOutletContext]=\"{ field: field, control: control, formgroup: formgroup }\"\n      ></ng-template>\n    </ng-container>\n    <ng-template #defaultMultiSelectDropdown>\n      <div class=\"dynamic-field single-line-field-container\"\n      [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ?  'none':''}\">\n        <p class=\"h6\">\n          {{ field.title }}<span *ngIf=\"field.validators && field.validators.length > 0\"> *</span>\n        </p>\n        <mis-multi-select-dropdown [width]=\"'140px'\" [showSelectedCount]=\"true\" [dropdownListWidth]=\"'256px'\"\n          [searchEnabled]=\"false\" [hideApplyButton]=\"true\" [data]=\"field.itemsList\"\n          [selectedItems]=\"control.value\" (onChange)=\"updateSelectedValueForMultiSelect(field, control, formgroup, $event);\"></mis-multi-select-dropdown>\n        <ng-container *ngIf=\"control.touched && control.errors\" [ngTemplateOutlet]=\"dynamicFieldErrors\"\n          [ngTemplateOutletContext]=\"{ $implicit: control.errors }\">\n        </ng-container>\n      </div>\n    </ng-template>\n  </ng-container>\n\n</ng-template>\n\n<ng-template #dynamicFieldErrors let-errors>\n  <div id=\"error-messages-container\">\n    <ng-container *ngFor=\"let error of errors | keyvalue\">\n      <p class=\"h8\">\n        {{\" \u2022 &nbsp;\" + error.value}}\n      </p>\n      <div [ngStyle]=\"{ 'flex-basis': '100%', 'height': '0' }\"></div>\n    </ng-container>\n  </div>\n</ng-template>", styles: ["p{margin:0;cursor:default}::ng-deep .main-container{margin:0;max-width:100%}.sub-dynamic-form{padding-left:24px;border-bottom:1px solid var(--grey-seperators)}.dynamic-field ::ng-deep .container{height:32px!important}.single-line-field-container{display:flex;justify-content:space-between;align-items:center;padding:28px 16px;border-bottom:1px solid var(--grey-seperators)}.multi-line-field-container{display:flex;justify-content:flex-start;align-items:flex-start;padding:28px 16px;flex-wrap:wrap;border-bottom:1px solid var(--grey-seperators)}.field-title-sm{margin-bottom:8px;cursor:default}.input-field{width:100%;background-color:var(--grey-bg-1);border:1px solid var(--grey-seperators);border-radius:6px}.ip-text{height:44px;padding:8px 12px}.ip-textarea{max-height:94px;padding:8px}input:focus{outline:none}input::placeholder{color:var(--grey-seperators)}textarea:focus{outline:none}.date-picker-container{position:relative;width:140px}.date-picker-container .date-picker{cursor:pointer;height:32px;width:100%;font-size:14px;border-radius:6px;padding:0 12px;border:1px solid var(--grey-seperators);inset:10px auto auto 80px;background-color:var(--text-white)}.date-picker-container .date-picker:hover{background-color:var(--grey-hover)}.date-picker-container .date-picker-icon{position:absolute;top:50%;right:12px;transform:translateY(-50%);cursor:pointer}form .dynamic-field:last-child{border-bottom:none!important}#checkboxes-container{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}.radio-checkbox-common{display:flex;justify-content:center;align-items:center;cursor:pointer;margin-right:8px;margin-bottom:8px;background-color:var(--text-white);padding:12px 16px;border:1px solid var(--text-muted);border-radius:8px}.radio-checkbox-common p{color:var(--text-muted);cursor:pointer}.radio-checkbox-common img{margin-right:8px}.checkbox-active{background-color:var(--pmry-500)}.checkbox-active p{color:var(--text-white)}#error-messages-container{margin-top:4px;width:100%;display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap}#error-messages-container p{color:var(--sem-error)}.removeable-container{display:flex;justify-content:center;align-items:center}.removeable-container .remove-icon{cursor:pointer;margin-left:8px;max-width:24px}span{color:var(--sem-error)}\n"] }]
-    }], function () { return []; }, { formFields: [{
+    }], () => [], { formFields: [{
             type: Input
         }], formValues: [{
             type: Input
@@ -1054,6 +1038,7 @@ DynamicFormComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Dynami
             type: ContentChild,
             args: ["customMultiSelectDropdown", { static: false }]
         }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(DynamicFormComponent, { className: "DynamicFormComponent" }); })();
 const dynamicFieldValidator = (validators) => {
     return (control) => {
         let value = control.value;
@@ -1112,19 +1097,19 @@ class DynamicFormModule {
     static forRoot() {
         return { ngModule: DynamicFormModule, providers: [] };
     }
+    static { this.ɵfac = function DynamicFormModule_Factory(t) { return new (t || DynamicFormModule)(); }; }
+    static { this.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: DynamicFormModule }); }
+    static { this.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonModule,
+            ReactiveFormsModule,
+            FormsModule,
+            OverlayModule,
+            ScrollingModule,
+            DropdownModule,
+            SwitchModule,
+            MultiSelectDropdownModule,
+            DatepickerModuleV2] }); }
 }
-DynamicFormModule.ɵfac = function DynamicFormModule_Factory(t) { return new (t || DynamicFormModule)(); };
-DynamicFormModule.ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: DynamicFormModule });
-DynamicFormModule.ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [CommonModule,
-        ReactiveFormsModule,
-        FormsModule,
-        OverlayModule,
-        ScrollingModule,
-        DropdownModule,
-        SwitchModule,
-        MultiSelectDropdownModule,
-        DatepickerModuleV2] });
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DynamicFormModule, [{
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DynamicFormModule, [{
         type: NgModule,
         args: [{
                 declarations: [DynamicFormComponent],