mis-crystal-design-system 14.0.48 → 14.0.50

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/async-search-dropdown/async-dropdown.component.d.ts +1 -1
  2. package/dynamic-form/dynamic-form.component.d.ts +1 -1
  3. package/esm2020/async-search-dropdown/async-dropdown.component.mjs +8 -5
  4. package/esm2020/dynamic-form/dynamic-form.component.mjs +164 -155
  5. package/fesm2015/mis-crystal-design-system-async-search-dropdown.mjs +7 -4
  6. package/fesm2015/mis-crystal-design-system-async-search-dropdown.mjs.map +1 -1
  7. package/fesm2015/mis-crystal-design-system-dynamic-form.mjs +163 -154
  8. package/fesm2015/mis-crystal-design-system-dynamic-form.mjs.map +1 -1
  9. package/fesm2020/mis-crystal-design-system-async-search-dropdown.mjs +7 -4
  10. package/fesm2020/mis-crystal-design-system-async-search-dropdown.mjs.map +1 -1
  11. package/fesm2020/mis-crystal-design-system-dynamic-form.mjs +163 -154
  12. package/fesm2020/mis-crystal-design-system-dynamic-form.mjs.map +1 -1
  13. package/package.json +1 -1
package/fesm2015/mis-crystal-design-system-dynamic-form.mjs CHANGED
@@ -25,13 +25,14 @@ function DynamicFormComponent_ng_container_2_div_2_ng_container_1_Template(rf, c
25
25
  }
26
26
  if (rf & 2) {
27
27
  const subFieldControl_r9 = ctx.$implicit;
28
- const ctx_r10 = i0.ɵɵnextContext(2);
29
- const i_r6 = ctx_r10.index;
30
- const fieldControl_r5 = ctx_r10.$implicit;
28
+ const j_r10 = ctx.index;
29
+ const ctx_r11 = i0.ɵɵnextContext(2);
30
+ const i_r6 = ctx_r11.index;
31
+ const fieldControl_r5 = ctx_r11.$implicit;
31
32
  const ctx_r8 = i0.ɵɵnextContext();
32
33
  const _r1 = i0.ɵɵreference(4);
33
34
  i0.ɵɵadvance(1);
34
- i0.ɵɵproperty("ngTemplateOutlet", _r1)("ngTemplateOutletContext", i0.ɵɵpureFunction2(2, _c0, ctx_r8.formFields[i_r6].subFields[ctx_r8.findSelectedIndex(ctx_r8.formFields[i_r6] == null ? null : ctx_r8.formFields[i_r6].subFields, fieldControl_r5.controls.value.value.value)], subFieldControl_r9));
35
+ i0.ɵɵproperty("ngTemplateOutlet", _r1)("ngTemplateOutletContext", i0.ɵɵpureFunction2(2, _c0, 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));
35
36
  }
36
37
  }
37
38
  function DynamicFormComponent_ng_container_2_div_2_Template(rf, ctx) {
@@ -72,40 +73,40 @@ function DynamicFormComponent_ng_template_3_div_0_ng_container_5_Template(rf, ct
72
73
  i0.ɵɵelementContainer(0, 6);
73
74
  }
74
75
  if (rf & 2) {
75
- const control_r13 = i0.ɵɵnextContext(2).control;
76
+ const control_r14 = i0.ɵɵnextContext(2).control;
76
77
  i0.ɵɵnextContext();
77
78
  const _r3 = i0.ɵɵreference(6);
78
- i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r13.errors));
79
+ i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r14.errors));
79
80
  }
80
81
  }
81
82
  const _c3 = function (a0) { return { "border-bottom": a0 }; };
82
83
  const _c4 = function (a0) { return { "border": a0 }; };
83
84
  function DynamicFormComponent_ng_template_3_div_0_Template(rf, ctx) {
84
85
  if (rf & 1) {
85
- const _r27 = i0.ɵɵgetCurrentView();
86
+ const _r28 = i0.ɵɵgetCurrentView();
86
87
  i0.ɵɵelementStart(0, "div", 12)(1, "p", 13);
87
88
  i0.ɵɵtext(2);
88
89
  i0.ɵɵelementEnd();
89
90
  i0.ɵɵelement(3, "div", 14);
90
91
  i0.ɵɵelementStart(4, "input", 15);
91
- i0.ɵɵlistener("ngModelChange", function DynamicFormComponent_ng_template_3_div_0_Template_input_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r27); const ctx_r26 = i0.ɵɵnextContext(); const field_r12 = ctx_r26.$implicit; const formgroup_r14 = ctx_r26.formGroup; const ctx_r25 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r25.updateSubDynamicFields(field_r12, formgroup_r14, $event)); });
92
+ i0.ɵɵlistener("ngModelChange", function DynamicFormComponent_ng_template_3_div_0_Template_input_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r28); const ctx_r27 = i0.ɵɵnextContext(); const field_r13 = ctx_r27.$implicit; const formgroup_r15 = ctx_r27.formGroup; const ctx_r26 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r26.updateSubDynamicFields(field_r13, formgroup_r15, $event)); });
92
93
  i0.ɵɵelementEnd();
93
94
  i0.ɵɵtemplate(5, DynamicFormComponent_ng_template_3_div_0_ng_container_5_Template, 1, 4, "ng-container", 16);
94
95
  i0.ɵɵelementEnd();
95
96
  }
96
97
  if (rf & 2) {
97
- const ctx_r28 = i0.ɵɵnextContext();
98
- const formgroup_r14 = ctx_r28.formGroup;
99
- const field_r12 = ctx_r28.$implicit;
100
- const control_r13 = ctx_r28.control;
101
- const ctx_r15 = i0.ɵɵnextContext();
102
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(8, _c3, (formgroup_r14 == null ? null : formgroup_r14.controls == null ? null : formgroup_r14.controls.subFields == null ? null : formgroup_r14.controls.subFields.controls == null ? null : formgroup_r14.controls.subFields.controls.length) && ctx_r15.removeSepratorForSubFields ? "none" : ""));
98
+ const ctx_r29 = i0.ɵɵnextContext();
99
+ const formgroup_r15 = ctx_r29.formGroup;
100
+ const field_r13 = ctx_r29.$implicit;
101
+ const control_r14 = ctx_r29.control;
102
+ const ctx_r16 = i0.ɵɵnextContext();
103
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(8, _c3, (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_r16.removeSepratorForSubFields ? "none" : ""));
103
104
  i0.ɵɵadvance(2);
104
- i0.ɵɵtextInterpolate1(" ", field_r12.title, " ");
105
+ i0.ɵɵtextInterpolate1(" ", field_r13.title, " ");
105
106
  i0.ɵɵadvance(2);
106
- i0.ɵɵproperty("type", field_r12.fieldInputType)("formControl", control_r13)("ngStyle", i0.ɵɵpureFunction1(10, _c4, control_r13.touched && control_r13.errors ? "1px solid #B00020" : ""))("placeholder", field_r12.placeholderText ? field_r12.placeholderText : "Input Text")("min", field_r12.fieldInputType === "number" ? 0 : "");
107
+ i0.ɵɵproperty("type", field_r13.fieldInputType)("formControl", control_r14)("ngStyle", i0.ɵɵpureFunction1(10, _c4, control_r14.touched && control_r14.errors ? "1px solid #B00020" : ""))("placeholder", field_r13.placeholderText ? field_r13.placeholderText : "Input Text")("min", field_r13.fieldInputType === "number" ? 0 : "");
107
108
  i0.ɵɵadvance(1);
108
- i0.ɵɵproperty("ngIf", control_r13.touched && control_r13.errors);
109
+ i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
109
110
  }
110
111
  }
111
112
  function DynamicFormComponent_ng_template_3_div_1_ng_container_5_Template(rf, ctx) {
@@ -113,50 +114,50 @@ function DynamicFormComponent_ng_template_3_div_1_ng_container_5_Template(rf, ct
113
114
  i0.ɵɵelementContainer(0, 6);
114
115
  }
115
116
  if (rf & 2) {
116
- const control_r13 = i0.ɵɵnextContext(2).control;
117
+ const control_r14 = i0.ɵɵnextContext(2).control;
117
118
  i0.ɵɵnextContext();
118
119
  const _r3 = i0.ɵɵreference(6);
119
- i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r13.errors));
120
+ i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r14.errors));
120
121
  }
121
122
  }
122
123
  function DynamicFormComponent_ng_template_3_div_1_Template(rf, ctx) {
123
124
  if (rf & 1) {
124
- const _r33 = i0.ɵɵgetCurrentView();
125
+ const _r34 = i0.ɵɵgetCurrentView();
125
126
  i0.ɵɵelementStart(0, "div", 12)(1, "p", 13);
126
127
  i0.ɵɵtext(2);
127
128
  i0.ɵɵelementEnd();
128
129
  i0.ɵɵelement(3, "div", 14);
129
130
  i0.ɵɵelementStart(4, "textarea", 17);
130
- i0.ɵɵlistener("ngModelChange", function DynamicFormComponent_ng_template_3_div_1_Template_textarea_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r33); const ctx_r32 = i0.ɵɵnextContext(); const field_r12 = ctx_r32.$implicit; const formgroup_r14 = ctx_r32.formGroup; const ctx_r31 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r31.updateSubDynamicFields(field_r12, formgroup_r14, $event)); });
131
+ i0.ɵɵlistener("ngModelChange", function DynamicFormComponent_ng_template_3_div_1_Template_textarea_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r34); const ctx_r33 = i0.ɵɵnextContext(); 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)); });
131
132
  i0.ɵɵelementEnd();
132
133
  i0.ɵɵtemplate(5, DynamicFormComponent_ng_template_3_div_1_ng_container_5_Template, 1, 4, "ng-container", 16);
133
134
  i0.ɵɵelementEnd();
134
135
  }
135
136
  if (rf & 2) {
136
- const ctx_r34 = i0.ɵɵnextContext();
137
- const formgroup_r14 = ctx_r34.formGroup;
138
- const field_r12 = ctx_r34.$implicit;
139
- const control_r13 = ctx_r34.control;
140
- const ctx_r16 = i0.ɵɵnextContext();
141
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(6, _c3, (formgroup_r14 == null ? null : formgroup_r14.controls == null ? null : formgroup_r14.controls.subFields == null ? null : formgroup_r14.controls.subFields.controls == null ? null : formgroup_r14.controls.subFields.controls.length) && ctx_r16.removeSepratorForSubFields ? "none" : ""));
137
+ const ctx_r35 = i0.ɵɵnextContext();
138
+ const formgroup_r15 = ctx_r35.formGroup;
139
+ const field_r13 = ctx_r35.$implicit;
140
+ const control_r14 = ctx_r35.control;
141
+ const ctx_r17 = i0.ɵɵnextContext();
142
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(6, _c3, (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_r17.removeSepratorForSubFields ? "none" : ""));
142
143
  i0.ɵɵadvance(2);
143
- i0.ɵɵtextInterpolate1(" ", field_r12.title, " ");
144
+ i0.ɵɵtextInterpolate1(" ", field_r13.title, " ");
144
145
  i0.ɵɵadvance(2);
145
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(8, _c4, control_r13.touched && control_r13.errors ? "1px solid #B00020" : ""))("placeholder", field_r12.placeholderText ? field_r12.placeholderText : "Input Text")("formControl", control_r13);
146
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(8, _c4, control_r14.touched && control_r14.errors ? "1px solid #B00020" : ""))("placeholder", field_r13.placeholderText ? field_r13.placeholderText : "Input Text")("formControl", control_r14);
146
147
  i0.ɵɵadvance(1);
147
- i0.ɵɵproperty("ngIf", control_r13.touched && control_r13.errors);
148
+ i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
148
149
  }
149
150
  }
150
151
  function DynamicFormComponent_ng_template_3_div_2_img_6_Template(rf, ctx) {
151
152
  if (rf & 1) {
152
- const _r39 = i0.ɵɵgetCurrentView();
153
+ const _r40 = i0.ɵɵgetCurrentView();
153
154
  i0.ɵɵelementStart(0, "img", 24);
154
- i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_div_2_img_6_Template_img_click_0_listener() { i0.ɵɵrestoreView(_r39); i0.ɵɵnextContext(); const _r35 = i0.ɵɵreference(5); return i0.ɵɵresetView(_r35.click()); });
155
+ i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_div_2_img_6_Template_img_click_0_listener() { i0.ɵɵrestoreView(_r40); i0.ɵɵnextContext(); const _r36 = i0.ɵɵreference(5); return i0.ɵɵresetView(_r36.click()); });
155
156
  i0.ɵɵelementEnd();
156
157
  }
157
158
  if (rf & 2) {
158
- const ctx_r36 = i0.ɵɵnextContext(3);
159
- i0.ɵɵproperty("src", ctx_r36.calendarIconUrl, i0.ɵɵsanitizeUrl);
159
+ const ctx_r37 = i0.ɵɵnextContext(3);
160
+ i0.ɵɵproperty("src", ctx_r37.calendarIconUrl, i0.ɵɵsanitizeUrl);
160
161
  }
161
162
  }
162
163
  function DynamicFormComponent_ng_template_3_div_2_ng_container_7_Template(rf, ctx) {
@@ -164,20 +165,20 @@ function DynamicFormComponent_ng_template_3_div_2_ng_container_7_Template(rf, ct
164
165
  i0.ɵɵelementContainer(0, 6);
165
166
  }
166
167
  if (rf & 2) {
167
- const control_r13 = i0.ɵɵnextContext(2).control;
168
+ const control_r14 = i0.ɵɵnextContext(2).control;
168
169
  i0.ɵɵnextContext();
169
170
  const _r3 = i0.ɵɵreference(6);
170
- i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r13.errors));
171
+ i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r14.errors));
171
172
  }
172
173
  }
173
174
  function DynamicFormComponent_ng_template_3_div_2_Template(rf, ctx) {
174
175
  if (rf & 1) {
175
- const _r43 = i0.ɵɵgetCurrentView();
176
+ const _r44 = i0.ɵɵgetCurrentView();
176
177
  i0.ɵɵelementStart(0, "div", 18)(1, "p", 19);
177
178
  i0.ɵɵtext(2);
178
179
  i0.ɵɵelementEnd();
179
180
  i0.ɵɵelementStart(3, "div", 20)(4, "input", 21, 22);
180
- i0.ɵɵlistener("dateChange", function DynamicFormComponent_ng_template_3_div_2_Template_input_dateChange_4_listener($event) { i0.ɵɵrestoreView(_r43); const control_r13 = i0.ɵɵnextContext().control; return i0.ɵɵresetView(control_r13.setValue($event)); });
181
+ i0.ɵɵlistener("dateChange", function DynamicFormComponent_ng_template_3_div_2_Template_input_dateChange_4_listener($event) { i0.ɵɵrestoreView(_r44); const control_r14 = i0.ɵɵnextContext().control; return i0.ɵɵresetView(control_r14.setValue($event)); });
181
182
  i0.ɵɵelementEnd();
182
183
  i0.ɵɵtemplate(6, DynamicFormComponent_ng_template_3_div_2_img_6_Template, 1, 1, "img", 23);
183
184
  i0.ɵɵelementEnd();
@@ -185,20 +186,20 @@ function DynamicFormComponent_ng_template_3_div_2_Template(rf, ctx) {
185
186
  i0.ɵɵelementEnd();
186
187
  }
187
188
  if (rf & 2) {
188
- const ctx_r44 = i0.ɵɵnextContext();
189
- const formgroup_r14 = ctx_r44.formGroup;
190
- const field_r12 = ctx_r44.$implicit;
191
- const control_r13 = ctx_r44.control;
192
- const ctx_r17 = i0.ɵɵnextContext();
193
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(8, _c3, (formgroup_r14 == null ? null : formgroup_r14.controls == null ? null : formgroup_r14.controls.subFields == null ? null : formgroup_r14.controls.subFields.controls == null ? null : formgroup_r14.controls.subFields.controls.length) && ctx_r17.removeSepratorForSubFields ? "none" : ""));
189
+ const ctx_r45 = i0.ɵɵnextContext();
190
+ const formgroup_r15 = ctx_r45.formGroup;
191
+ const field_r13 = ctx_r45.$implicit;
192
+ const control_r14 = ctx_r45.control;
193
+ const ctx_r18 = i0.ɵɵnextContext();
194
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(8, _c3, (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_r18.removeSepratorForSubFields ? "none" : ""));
194
195
  i0.ɵɵadvance(2);
195
- i0.ɵɵtextInterpolate1(" ", field_r12.title, " ");
196
+ i0.ɵɵtextInterpolate1(" ", field_r13.title, " ");
196
197
  i0.ɵɵadvance(2);
197
- i0.ɵɵproperty("dpConfig", field_r12.fieldConfig)("selectedDate", control_r13.value)("offsetY", 0)("value", control_r13.value);
198
+ i0.ɵɵproperty("dpConfig", field_r13.fieldConfig)("selectedDate", control_r14.value)("offsetY", 0)("value", control_r14.value);
198
199
  i0.ɵɵadvance(2);
199
- i0.ɵɵproperty("ngIf", ctx_r17.calendarIconUrl);
200
+ i0.ɵɵproperty("ngIf", ctx_r18.calendarIconUrl);
200
201
  i0.ɵɵadvance(1);
201
- i0.ɵɵproperty("ngIf", control_r13.touched && control_r13.errors);
202
+ i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
202
203
  }
203
204
  }
204
205
  function DynamicFormComponent_ng_template_3_div_3_ng_container_4_Template(rf, ctx) {
@@ -206,49 +207,49 @@ function DynamicFormComponent_ng_template_3_div_3_ng_container_4_Template(rf, ct
206
207
  i0.ɵɵelementContainer(0, 6);
207
208
  }
208
209
  if (rf & 2) {
209
- const control_r13 = i0.ɵɵnextContext(2).control;
210
+ const control_r14 = i0.ɵɵnextContext(2).control;
210
211
  i0.ɵɵnextContext();
211
212
  const _r3 = i0.ɵɵreference(6);
212
- i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r13.errors));
213
+ i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r14.errors));
213
214
  }
214
215
  }
215
216
  function DynamicFormComponent_ng_template_3_div_3_Template(rf, ctx) {
216
217
  if (rf & 1) {
217
- const _r49 = i0.ɵɵgetCurrentView();
218
+ const _r50 = i0.ɵɵgetCurrentView();
218
219
  i0.ɵɵelementStart(0, "div", 18)(1, "p", 19);
219
220
  i0.ɵɵtext(2);
220
221
  i0.ɵɵelementEnd();
221
222
  i0.ɵɵelementStart(3, "mis-switch", 25);
222
- i0.ɵɵlistener("valueChanged", function DynamicFormComponent_ng_template_3_div_3_Template_mis_switch_valueChanged_3_listener($event) { i0.ɵɵrestoreView(_r49); const ctx_r48 = i0.ɵɵnextContext(); const field_r12 = ctx_r48.$implicit; const formgroup_r14 = ctx_r48.formGroup; const ctx_r47 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r47.updateSubDynamicFields(field_r12, formgroup_r14, $event)); });
223
+ i0.ɵɵlistener("valueChanged", function DynamicFormComponent_ng_template_3_div_3_Template_mis_switch_valueChanged_3_listener($event) { i0.ɵɵrestoreView(_r50); const ctx_r49 = i0.ɵɵnextContext(); const field_r13 = ctx_r49.$implicit; const formgroup_r15 = ctx_r49.formGroup; const ctx_r48 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r48.updateSubDynamicFields(field_r13, formgroup_r15, $event)); });
223
224
  i0.ɵɵelementEnd();
224
225
  i0.ɵɵtemplate(4, DynamicFormComponent_ng_template_3_div_3_ng_container_4_Template, 1, 4, "ng-container", 16);
225
226
  i0.ɵɵelementEnd();
226
227
  }
227
228
  if (rf & 2) {
228
- const ctx_r50 = i0.ɵɵnextContext();
229
- const formgroup_r14 = ctx_r50.formGroup;
230
- const field_r12 = ctx_r50.$implicit;
231
- const control_r13 = ctx_r50.control;
232
- const ctx_r18 = i0.ɵɵnextContext();
233
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(4, _c3, (formgroup_r14 == null ? null : formgroup_r14.controls == null ? null : formgroup_r14.controls.subFields == null ? null : formgroup_r14.controls.subFields.controls == null ? null : formgroup_r14.controls.subFields.controls.length) && ctx_r18.removeSepratorForSubFields ? "none" : ""));
229
+ const ctx_r51 = i0.ɵɵnextContext();
230
+ const formgroup_r15 = ctx_r51.formGroup;
231
+ const field_r13 = ctx_r51.$implicit;
232
+ const control_r14 = ctx_r51.control;
233
+ const ctx_r19 = i0.ɵɵnextContext();
234
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(4, _c3, (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_r19.removeSepratorForSubFields ? "none" : ""));
234
235
  i0.ɵɵadvance(2);
235
- i0.ɵɵtextInterpolate1(" ", field_r12.title, " ");
236
+ i0.ɵɵtextInterpolate1(" ", field_r13.title, " ");
236
237
  i0.ɵɵadvance(1);
237
- i0.ɵɵproperty("control", control_r13);
238
+ i0.ɵɵproperty("control", control_r14);
238
239
  i0.ɵɵadvance(1);
239
- i0.ɵɵproperty("ngIf", control_r13.touched && control_r13.errors);
240
+ i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
240
241
  }
241
242
  }
242
243
  function DynamicFormComponent_ng_template_3_div_4_img_5_Template(rf, ctx) {
243
244
  if (rf & 1) {
244
- const _r55 = i0.ɵɵgetCurrentView();
245
+ const _r56 = i0.ɵɵgetCurrentView();
245
246
  i0.ɵɵelementStart(0, "img", 29);
246
- i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_div_4_img_5_Template_img_click_0_listener() { i0.ɵɵrestoreView(_r55); const field_r12 = i0.ɵɵnextContext(2).$implicit; const ctx_r53 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r53.fieldRemoved.emit(field_r12)); });
247
+ i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_div_4_img_5_Template_img_click_0_listener() { i0.ɵɵrestoreView(_r56); const field_r13 = i0.ɵɵnextContext(2).$implicit; const ctx_r54 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r54.fieldRemoved.emit(field_r13)); });
247
248
  i0.ɵɵelementEnd();
248
249
  }
249
250
  if (rf & 2) {
250
- const ctx_r51 = i0.ɵɵnextContext(3);
251
- i0.ɵɵproperty("src", ctx_r51.removeIconUrl, i0.ɵɵsanitizeUrl);
251
+ const ctx_r52 = i0.ɵɵnextContext(3);
252
+ i0.ɵɵproperty("src", ctx_r52.removeIconUrl, i0.ɵɵsanitizeUrl);
252
253
  }
253
254
  }
254
255
  function DynamicFormComponent_ng_template_3_div_4_ng_container_6_Template(rf, ctx) {
@@ -256,21 +257,21 @@ function DynamicFormComponent_ng_template_3_div_4_ng_container_6_Template(rf, ct
256
257
  i0.ɵɵelementContainer(0, 6);
257
258
  }
258
259
  if (rf & 2) {
259
- const control_r13 = i0.ɵɵnextContext(2).control;
260
+ const control_r14 = i0.ɵɵnextContext(2).control;
260
261
  i0.ɵɵnextContext();
261
262
  const _r3 = i0.ɵɵreference(6);
262
- i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r13.errors));
263
+ i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r14.errors));
263
264
  }
264
265
  }
265
266
  const _c5 = function (a0) { return { "removeable-container": a0 }; };
266
267
  function DynamicFormComponent_ng_template_3_div_4_Template(rf, ctx) {
267
268
  if (rf & 1) {
268
- const _r59 = i0.ɵɵgetCurrentView();
269
+ const _r60 = i0.ɵɵgetCurrentView();
269
270
  i0.ɵɵelementStart(0, "div", 18)(1, "p", 19);
270
271
  i0.ɵɵtext(2);
271
272
  i0.ɵɵelementEnd();
272
273
  i0.ɵɵelementStart(3, "div", 26)(4, "mis-dropdown", 27);
273
- i0.ɵɵlistener("onChange", function DynamicFormComponent_ng_template_3_div_4_Template_mis_dropdown_onChange_4_listener($event) { i0.ɵɵrestoreView(_r59); const ctx_r58 = i0.ɵɵnextContext(); const field_r12 = ctx_r58.$implicit; const control_r13 = ctx_r58.control; const formgroup_r14 = ctx_r58.formGroup; const ctx_r57 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r57.updateSelectedValueForSingleSelect(field_r12, control_r13, formgroup_r14, $event)); });
274
+ i0.ɵɵlistener("onChange", function DynamicFormComponent_ng_template_3_div_4_Template_mis_dropdown_onChange_4_listener($event) { i0.ɵɵrestoreView(_r60); const ctx_r59 = i0.ɵɵnextContext(); const field_r13 = ctx_r59.$implicit; const control_r14 = ctx_r59.control; const formgroup_r15 = ctx_r59.formGroup; const ctx_r58 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r58.updateSelectedValueForSingleSelect(field_r13, control_r14, formgroup_r15, $event)); });
274
275
  i0.ɵɵelementEnd();
275
276
  i0.ɵɵtemplate(5, DynamicFormComponent_ng_template_3_div_4_img_5_Template, 1, 1, "img", 28);
276
277
  i0.ɵɵelementEnd();
@@ -278,22 +279,22 @@ function DynamicFormComponent_ng_template_3_div_4_Template(rf, ctx) {
278
279
  i0.ɵɵelementEnd();
279
280
  }
280
281
  if (rf & 2) {
281
- const ctx_r60 = i0.ɵɵnextContext();
282
- const formgroup_r14 = ctx_r60.formGroup;
283
- const field_r12 = ctx_r60.$implicit;
284
- const control_r13 = ctx_r60.control;
285
- const ctx_r19 = i0.ɵɵnextContext();
286
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(9, _c3, (formgroup_r14 == null ? null : formgroup_r14.controls == null ? null : formgroup_r14.controls.subFields == null ? null : formgroup_r14.controls.subFields.controls == null ? null : formgroup_r14.controls.subFields.controls.length) && ctx_r19.removeSepratorForSubFields ? "none" : ""));
282
+ const ctx_r61 = i0.ɵɵnextContext();
283
+ const formgroup_r15 = ctx_r61.formGroup;
284
+ const field_r13 = ctx_r61.$implicit;
285
+ const control_r14 = ctx_r61.control;
286
+ const ctx_r20 = i0.ɵɵnextContext();
287
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(9, _c3, (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_r20.removeSepratorForSubFields ? "none" : ""));
287
288
  i0.ɵɵadvance(2);
288
- i0.ɵɵtextInterpolate1(" ", field_r12.title, " ");
289
+ i0.ɵɵtextInterpolate1(" ", field_r13.title, " ");
289
290
  i0.ɵɵadvance(1);
290
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(11, _c5, field_r12 == null ? null : field_r12.isRemoveable));
291
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(11, _c5, field_r13 == null ? null : field_r13.isRemoveable));
291
292
  i0.ɵɵadvance(1);
292
- i0.ɵɵproperty("searchEnabled", false)("width", "140px")("data", field_r12.itemsList)("selectedItem", control_r13.value);
293
+ i0.ɵɵproperty("searchEnabled", false)("width", "140px")("data", field_r13.itemsList)("selectedItem", control_r14.value);
293
294
  i0.ɵɵadvance(1);
294
- i0.ɵɵproperty("ngIf", field_r12.isRemoveable && ctx_r19.removeIconUrl);
295
+ i0.ɵɵproperty("ngIf", field_r13.isRemoveable && ctx_r20.removeIconUrl);
295
296
  i0.ɵɵadvance(1);
296
- i0.ɵɵproperty("ngIf", control_r13.touched && control_r13.errors);
297
+ i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
297
298
  }
298
299
  }
299
300
  function DynamicFormComponent_ng_template_3_div_5_div_5_img_1_Template(rf, ctx) {
@@ -301,30 +302,30 @@ function DynamicFormComponent_ng_template_3_div_5_div_5_img_1_Template(rf, ctx)
301
302
  i0.ɵɵelement(0, "img", 34);
302
303
  }
303
304
  if (rf & 2) {
304
- const ctx_r64 = i0.ɵɵnextContext(4);
305
- i0.ɵɵproperty("src", ctx_r64.activeBtnIconUrl, i0.ɵɵsanitizeUrl);
305
+ const ctx_r65 = i0.ɵɵnextContext(4);
306
+ i0.ɵɵproperty("src", ctx_r65.activeBtnIconUrl, i0.ɵɵsanitizeUrl);
306
307
  }
307
308
  }
308
309
  const _c6 = function (a0) { return { "checkbox-active": a0 }; };
309
310
  function DynamicFormComponent_ng_template_3_div_5_div_5_Template(rf, ctx) {
310
311
  if (rf & 1) {
311
- const _r67 = i0.ɵɵgetCurrentView();
312
+ const _r68 = i0.ɵɵgetCurrentView();
312
313
  i0.ɵɵelementStart(0, "div", 32);
313
- i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_div_5_div_5_Template_div_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r67); const item_r63 = restoredCtx.$implicit; const ctx_r66 = i0.ɵɵnextContext(2); const field_r12 = ctx_r66.$implicit; const control_r13 = ctx_r66.control; const formgroup_r14 = ctx_r66.formGroup; const ctx_r65 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r65.updateSelectedValueForSingleSelect(field_r12, control_r13, formgroup_r14, item_r63)); });
314
+ i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_div_5_div_5_Template_div_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r68); const item_r64 = restoredCtx.$implicit; const ctx_r67 = i0.ɵɵnextContext(2); const field_r13 = ctx_r67.$implicit; const control_r14 = ctx_r67.control; const formgroup_r15 = ctx_r67.formGroup; const ctx_r66 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r66.updateSelectedValueForSingleSelect(field_r13, control_r14, formgroup_r15, item_r64)); });
314
315
  i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_div_5_div_5_img_1_Template, 1, 1, "img", 33);
315
316
  i0.ɵɵelementStart(2, "p", 19);
316
317
  i0.ɵɵtext(3);
317
318
  i0.ɵɵelementEnd()();
318
319
  }
319
320
  if (rf & 2) {
320
- const item_r63 = ctx.$implicit;
321
- const control_r13 = i0.ɵɵnextContext(2).control;
322
- const ctx_r61 = i0.ɵɵnextContext();
323
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c6, item_r63.label === (control_r13.value == null ? null : control_r13.value.label)));
321
+ const item_r64 = ctx.$implicit;
322
+ const control_r14 = i0.ɵɵnextContext(2).control;
323
+ const ctx_r62 = i0.ɵɵnextContext();
324
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c6, item_r64.label === (control_r14.value == null ? null : control_r14.value.label)));
324
325
  i0.ɵɵadvance(1);
325
- i0.ɵɵproperty("ngIf", item_r63.label === (control_r13.value == null ? null : control_r13.value.label) && ctx_r61.activeBtnIconUrl);
326
+ i0.ɵɵproperty("ngIf", item_r64.label === (control_r14.value == null ? null : control_r14.value.label) && ctx_r62.activeBtnIconUrl);
326
327
  i0.ɵɵadvance(2);
327
- i0.ɵɵtextInterpolate(item_r63.label);
328
+ i0.ɵɵtextInterpolate(item_r64.label);
328
329
  }
329
330
  }
330
331
  function DynamicFormComponent_ng_template_3_div_5_ng_container_6_Template(rf, ctx) {
@@ -332,10 +333,10 @@ function DynamicFormComponent_ng_template_3_div_5_ng_container_6_Template(rf, ct
332
333
  i0.ɵɵelementContainer(0, 6);
333
334
  }
334
335
  if (rf & 2) {
335
- const control_r13 = i0.ɵɵnextContext(2).control;
336
+ const control_r14 = i0.ɵɵnextContext(2).control;
336
337
  i0.ɵɵnextContext();
337
338
  const _r3 = i0.ɵɵreference(6);
338
- i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r13.errors));
339
+ i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r14.errors));
339
340
  }
340
341
  }
341
342
  function DynamicFormComponent_ng_template_3_div_5_Template(rf, ctx) {
@@ -351,18 +352,18 @@ function DynamicFormComponent_ng_template_3_div_5_Template(rf, ctx) {
351
352
  i0.ɵɵelementEnd();
352
353
  }
353
354
  if (rf & 2) {
354
- const ctx_r70 = i0.ɵɵnextContext();
355
- const formgroup_r14 = ctx_r70.formGroup;
356
- const field_r12 = ctx_r70.$implicit;
357
- const control_r13 = ctx_r70.control;
358
- const ctx_r20 = i0.ɵɵnextContext();
359
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(4, _c3, (formgroup_r14 == null ? null : formgroup_r14.controls == null ? null : formgroup_r14.controls.subFields == null ? null : formgroup_r14.controls.subFields.controls == null ? null : formgroup_r14.controls.subFields.controls.length) && ctx_r20.removeSepratorForSubFields ? "none" : ""));
355
+ const ctx_r71 = i0.ɵɵnextContext();
356
+ const formgroup_r15 = ctx_r71.formGroup;
357
+ const field_r13 = ctx_r71.$implicit;
358
+ const control_r14 = ctx_r71.control;
359
+ const ctx_r21 = i0.ɵɵnextContext();
360
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(4, _c3, (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_r21.removeSepratorForSubFields ? "none" : ""));
360
361
  i0.ɵɵadvance(2);
361
- i0.ɵɵtextInterpolate1(" ", field_r12.title, " ");
362
+ i0.ɵɵtextInterpolate1(" ", field_r13.title, " ");
362
363
  i0.ɵɵadvance(3);
363
- i0.ɵɵproperty("ngForOf", field_r12.itemsList);
364
+ i0.ɵɵproperty("ngForOf", field_r13.itemsList);
364
365
  i0.ɵɵadvance(1);
365
- i0.ɵɵproperty("ngIf", control_r13.touched && control_r13.errors);
366
+ i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
366
367
  }
367
368
  }
368
369
  function DynamicFormComponent_ng_template_3_div_6_div_5_img_1_Template(rf, ctx) {
@@ -370,29 +371,29 @@ function DynamicFormComponent_ng_template_3_div_6_div_5_img_1_Template(rf, ctx)
370
371
  i0.ɵɵelement(0, "img", 34);
371
372
  }
372
373
  if (rf & 2) {
373
- const ctx_r74 = i0.ɵɵnextContext(4);
374
- i0.ɵɵproperty("src", ctx_r74.activeBtnIconUrl, i0.ɵɵsanitizeUrl);
374
+ const ctx_r75 = i0.ɵɵnextContext(4);
375
+ i0.ɵɵproperty("src", ctx_r75.activeBtnIconUrl, i0.ɵɵsanitizeUrl);
375
376
  }
376
377
  }
377
378
  function DynamicFormComponent_ng_template_3_div_6_div_5_Template(rf, ctx) {
378
379
  if (rf & 1) {
379
- const _r77 = i0.ɵɵgetCurrentView();
380
+ const _r78 = i0.ɵɵgetCurrentView();
380
381
  i0.ɵɵelementStart(0, "div", 32);
381
- i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_div_6_div_5_Template_div_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r77); const item_r73 = restoredCtx.$implicit; const ctx_r76 = i0.ɵɵnextContext(2); const field_r12 = ctx_r76.$implicit; const control_r13 = ctx_r76.control; const formgroup_r14 = ctx_r76.formGroup; const ctx_r75 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r75.updateSelectedValueForMultiSelect(field_r12, control_r13, formgroup_r14, [item_r73])); });
382
+ i0.ɵɵlistener("click", function DynamicFormComponent_ng_template_3_div_6_div_5_Template_div_click_0_listener() { const restoredCtx = i0.ɵɵrestoreView(_r78); const item_r74 = restoredCtx.$implicit; const ctx_r77 = i0.ɵɵnextContext(2); const field_r13 = ctx_r77.$implicit; const control_r14 = ctx_r77.control; const formgroup_r15 = ctx_r77.formGroup; const ctx_r76 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r76.updateSelectedValueForMultiSelect(field_r13, control_r14, formgroup_r15, [item_r74])); });
382
383
  i0.ɵɵtemplate(1, DynamicFormComponent_ng_template_3_div_6_div_5_img_1_Template, 1, 1, "img", 33);
383
384
  i0.ɵɵelementStart(2, "p", 19);
384
385
  i0.ɵɵtext(3);
385
386
  i0.ɵɵelementEnd()();
386
387
  }
387
388
  if (rf & 2) {
388
- const item_r73 = ctx.$implicit;
389
- const control_r13 = i0.ɵɵnextContext(2).control;
390
- const ctx_r71 = i0.ɵɵnextContext();
391
- i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c6, ctx_r71.isCheckBoxSelected(item_r73.label, control_r13.value)));
389
+ const item_r74 = ctx.$implicit;
390
+ const control_r14 = i0.ɵɵnextContext(2).control;
391
+ const ctx_r72 = i0.ɵɵnextContext();
392
+ i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c6, ctx_r72.isCheckBoxSelected(item_r74.label, control_r14.value)));
392
393
  i0.ɵɵadvance(1);
393
- i0.ɵɵproperty("ngIf", ctx_r71.isCheckBoxSelected(item_r73.label, control_r13.value) && ctx_r71.activeBtnIconUrl);
394
+ i0.ɵɵproperty("ngIf", ctx_r72.isCheckBoxSelected(item_r74.label, control_r14.value) && ctx_r72.activeBtnIconUrl);
394
395
  i0.ɵɵadvance(2);
395
- i0.ɵɵtextInterpolate(item_r73.label);
396
+ i0.ɵɵtextInterpolate(item_r74.label);
396
397
  }
397
398
  }
398
399
  function DynamicFormComponent_ng_template_3_div_6_ng_container_6_Template(rf, ctx) {
@@ -400,10 +401,10 @@ function DynamicFormComponent_ng_template_3_div_6_ng_container_6_Template(rf, ct
400
401
  i0.ɵɵelementContainer(0, 6);
401
402
  }
402
403
  if (rf & 2) {
403
- const control_r13 = i0.ɵɵnextContext(2).control;
404
+ const control_r14 = i0.ɵɵnextContext(2).control;
404
405
  i0.ɵɵnextContext();
405
406
  const _r3 = i0.ɵɵreference(6);
406
- i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r13.errors));
407
+ i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r14.errors));
407
408
  }
408
409
  }
409
410
  function DynamicFormComponent_ng_template_3_div_6_Template(rf, ctx) {
@@ -419,18 +420,18 @@ function DynamicFormComponent_ng_template_3_div_6_Template(rf, ctx) {
419
420
  i0.ɵɵelementEnd();
420
421
  }
421
422
  if (rf & 2) {
422
- const ctx_r80 = i0.ɵɵnextContext();
423
- const formgroup_r14 = ctx_r80.formGroup;
424
- const field_r12 = ctx_r80.$implicit;
425
- const control_r13 = ctx_r80.control;
426
- const ctx_r21 = i0.ɵɵnextContext();
427
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(4, _c3, (formgroup_r14 == null ? null : formgroup_r14.controls == null ? null : formgroup_r14.controls.subFields == null ? null : formgroup_r14.controls.subFields.controls == null ? null : formgroup_r14.controls.subFields.controls.length) && ctx_r21.removeSepratorForSubFields ? "none" : ""));
423
+ const ctx_r81 = i0.ɵɵnextContext();
424
+ const formgroup_r15 = ctx_r81.formGroup;
425
+ const field_r13 = ctx_r81.$implicit;
426
+ const control_r14 = ctx_r81.control;
427
+ const ctx_r22 = i0.ɵɵnextContext();
428
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(4, _c3, (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_r22.removeSepratorForSubFields ? "none" : ""));
428
429
  i0.ɵɵadvance(2);
429
- i0.ɵɵtextInterpolate1(" ", field_r12.title, " ");
430
+ i0.ɵɵtextInterpolate1(" ", field_r13.title, " ");
430
431
  i0.ɵɵadvance(3);
431
- i0.ɵɵproperty("ngForOf", field_r12.itemsList);
432
+ i0.ɵɵproperty("ngForOf", field_r13.itemsList);
432
433
  i0.ɵɵadvance(1);
433
- i0.ɵɵproperty("ngIf", control_r13.touched && control_r13.errors);
434
+ i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
434
435
  }
435
436
  }
436
437
  function DynamicFormComponent_ng_template_3_div_7_ng_container_4_Template(rf, ctx) {
@@ -438,37 +439,37 @@ function DynamicFormComponent_ng_template_3_div_7_ng_container_4_Template(rf, ct
438
439
  i0.ɵɵelementContainer(0, 6);
439
440
  }
440
441
  if (rf & 2) {
441
- const control_r13 = i0.ɵɵnextContext(2).control;
442
+ const control_r14 = i0.ɵɵnextContext(2).control;
442
443
  i0.ɵɵnextContext();
443
444
  const _r3 = i0.ɵɵreference(6);
444
- i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r13.errors));
445
+ i0.ɵɵproperty("ngTemplateOutlet", _r3)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c2, control_r14.errors));
445
446
  }
446
447
  }
447
448
  function DynamicFormComponent_ng_template_3_div_7_Template(rf, ctx) {
448
449
  if (rf & 1) {
449
- const _r85 = i0.ɵɵgetCurrentView();
450
+ const _r86 = i0.ɵɵgetCurrentView();
450
451
  i0.ɵɵelementStart(0, "div", 18)(1, "p", 19);
451
452
  i0.ɵɵtext(2);
452
453
  i0.ɵɵelementEnd();
453
454
  i0.ɵɵelementStart(3, "mis-multi-select-dropdown", 35);
454
- i0.ɵɵlistener("onChange", function DynamicFormComponent_ng_template_3_div_7_Template_mis_multi_select_dropdown_onChange_3_listener($event) { i0.ɵɵrestoreView(_r85); const ctx_r84 = i0.ɵɵnextContext(); const field_r12 = ctx_r84.$implicit; const control_r13 = ctx_r84.control; const formgroup_r14 = ctx_r84.formGroup; const ctx_r83 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r83.updateSelectedValueForMultiSelect(field_r12, control_r13, formgroup_r14, $event)); });
455
+ i0.ɵɵlistener("onChange", function DynamicFormComponent_ng_template_3_div_7_Template_mis_multi_select_dropdown_onChange_3_listener($event) { i0.ɵɵrestoreView(_r86); const ctx_r85 = i0.ɵɵnextContext(); const field_r13 = ctx_r85.$implicit; const control_r14 = ctx_r85.control; const formgroup_r15 = ctx_r85.formGroup; const ctx_r84 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r84.updateSelectedValueForMultiSelect(field_r13, control_r14, formgroup_r15, $event)); });
455
456
  i0.ɵɵelementEnd();
456
457
  i0.ɵɵtemplate(4, DynamicFormComponent_ng_template_3_div_7_ng_container_4_Template, 1, 4, "ng-container", 16);
457
458
  i0.ɵɵelementEnd();
458
459
  }
459
460
  if (rf & 2) {
460
- const ctx_r86 = i0.ɵɵnextContext();
461
- const formgroup_r14 = ctx_r86.formGroup;
462
- const field_r12 = ctx_r86.$implicit;
463
- const control_r13 = ctx_r86.control;
464
- const ctx_r22 = i0.ɵɵnextContext();
465
- i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(10, _c3, (formgroup_r14 == null ? null : formgroup_r14.controls == null ? null : formgroup_r14.controls.subFields == null ? null : formgroup_r14.controls.subFields.controls == null ? null : formgroup_r14.controls.subFields.controls.length) && ctx_r22.removeSepratorForSubFields ? "none" : ""));
461
+ const ctx_r87 = i0.ɵɵnextContext();
462
+ const formgroup_r15 = ctx_r87.formGroup;
463
+ const field_r13 = ctx_r87.$implicit;
464
+ const control_r14 = ctx_r87.control;
465
+ const ctx_r23 = i0.ɵɵnextContext();
466
+ i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(10, _c3, (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_r23.removeSepratorForSubFields ? "none" : ""));
466
467
  i0.ɵɵadvance(2);
467
- i0.ɵɵtextInterpolate1(" ", field_r12.title, " ");
468
+ i0.ɵɵtextInterpolate1(" ", field_r13.title, " ");
468
469
  i0.ɵɵadvance(1);
469
- i0.ɵɵproperty("width", "140px")("showSelectedCount", true)("dropdownListWidth", "256px")("searchEnabled", false)("hideApplyButton", true)("data", field_r12.itemsList)("selectedItems", control_r13.value);
470
+ i0.ɵɵproperty("width", "140px")("showSelectedCount", true)("dropdownListWidth", "256px")("searchEnabled", false)("hideApplyButton", true)("data", field_r13.itemsList)("selectedItems", control_r14.value);
470
471
  i0.ɵɵadvance(1);
471
- i0.ɵɵproperty("ngIf", control_r13.touched && control_r13.errors);
472
+ i0.ɵɵproperty("ngIf", control_r14.touched && control_r14.errors);
472
473
  }
473
474
  }
474
475
  function DynamicFormComponent_ng_template_3_Template(rf, ctx) {
@@ -483,22 +484,22 @@ function DynamicFormComponent_ng_template_3_Template(rf, ctx) {
483
484
  i0.ɵɵtemplate(7, DynamicFormComponent_ng_template_3_div_7_Template, 5, 12, "div", 11);
484
485
  }
485
486
  if (rf & 2) {
486
- const field_r12 = ctx.$implicit;
487
- i0.ɵɵproperty("ngIf", field_r12.fieldType === "input" && (field_r12.fieldInputType === "text" || field_r12.fieldInputType === "number"));
487
+ const field_r13 = ctx.$implicit;
488
+ i0.ɵɵproperty("ngIf", field_r13.fieldType === "input" && (field_r13.fieldInputType === "text" || field_r13.fieldInputType === "number"));
488
489
  i0.ɵɵadvance(1);
489
- i0.ɵɵproperty("ngIf", field_r12.fieldType === "input" && field_r12.fieldInputType === "textarea");
490
+ i0.ɵɵproperty("ngIf", field_r13.fieldType === "input" && field_r13.fieldInputType === "textarea");
490
491
  i0.ɵɵadvance(1);
491
- i0.ɵɵproperty("ngIf", field_r12.fieldType === "input" && field_r12.fieldInputType === "date");
492
+ i0.ɵɵproperty("ngIf", field_r13.fieldType === "input" && field_r13.fieldInputType === "date");
492
493
  i0.ɵɵadvance(1);
493
- i0.ɵɵproperty("ngIf", field_r12.fieldType === "boolean" && field_r12.fieldInputType === "toggle");
494
+ i0.ɵɵproperty("ngIf", field_r13.fieldType === "boolean" && field_r13.fieldInputType === "toggle");
494
495
  i0.ɵɵadvance(1);
495
- i0.ɵɵproperty("ngIf", field_r12.fieldType === "singleSelect" && field_r12.fieldInputType === "dropdown");
496
+ i0.ɵɵproperty("ngIf", field_r13.fieldType === "singleSelect" && field_r13.fieldInputType === "dropdown");
496
497
  i0.ɵɵadvance(1);
497
- i0.ɵɵproperty("ngIf", field_r12.fieldType === "singleSelect" && field_r12.fieldInputType === "radio");
498
+ i0.ɵɵproperty("ngIf", field_r13.fieldType === "singleSelect" && field_r13.fieldInputType === "radio");
498
499
  i0.ɵɵadvance(1);
499
- i0.ɵɵproperty("ngIf", field_r12.fieldType === "multiSelect" && field_r12.fieldInputType === "checkbox");
500
+ i0.ɵɵproperty("ngIf", field_r13.fieldType === "multiSelect" && field_r13.fieldInputType === "checkbox");
500
501
  i0.ɵɵadvance(1);
501
- i0.ɵɵproperty("ngIf", field_r12.fieldType === "multiSelect" && field_r12.fieldInputType === "dropdown");
502
+ i0.ɵɵproperty("ngIf", field_r13.fieldType === "multiSelect" && field_r13.fieldInputType === "dropdown");
502
503
  }
503
504
  }
504
505
  function DynamicFormComponent_ng_template_5_ng_container_1_Template(rf, ctx) {
@@ -511,9 +512,9 @@ function DynamicFormComponent_ng_template_5_ng_container_1_Template(rf, ctx) {
511
512
  i0.ɵɵelementContainerEnd();
512
513
  }
513
514
  if (rf & 2) {
514
- const error_r89 = ctx.$implicit;
515
+ const error_r90 = ctx.$implicit;
515
516
  i0.ɵɵadvance(2);
516
- i0.ɵɵtextInterpolate1(" ", " \u2022 \u00A0" + error_r89.value, " ");
517
+ i0.ɵɵtextInterpolate1(" ", " \u2022 \u00A0" + error_r90.value, " ");
517
518
  }
518
519
  }
519
520
  function DynamicFormComponent_ng_template_5_Template(rf, ctx) {
@@ -524,9 +525,9 @@ function DynamicFormComponent_ng_template_5_Template(rf, ctx) {
524
525
  i0.ɵɵelementEnd();
525
526
  }
526
527
  if (rf & 2) {
527
- const errors_r87 = ctx.$implicit;
528
+ const errors_r88 = ctx.$implicit;
528
529
  i0.ɵɵadvance(1);
529
- i0.ɵɵproperty("ngForOf", i0.ɵɵpipeBind1(2, 1, errors_r87));
530
+ i0.ɵɵproperty("ngForOf", i0.ɵɵpipeBind1(2, 1, errors_r88));
530
531
  }
531
532
  }
532
533
  class DynamicFormComponent {
@@ -591,8 +592,11 @@ class DynamicFormComponent {
591
592
  if (((_a = fieldValue.subFields) === null || _a === void 0 ? void 0 : _a.length) > 0) {
592
593
  let formattedSubFieldsValues = {};
593
594
  fieldValue.subFields.forEach((subFieldValue, subIndex) => {
594
- let subFormField = this.formFields[index].subFields[subIndex];
595
- formattedSubFieldsValues[subFormField.configName] = this.mapFormFieldToFormValue(subFormField, subFieldValue);
595
+ this.formFields[index].subFields.filter(item => {
596
+ return item.parentConfigValue === formattedValue;
597
+ }).forEach(subFormField => {
598
+ formattedSubFieldsValues[subFormField.configName] = this.mapFormFieldToFormValue(subFormField, subFieldValue);
599
+ });
596
600
  });
597
601
  dynamicFieldsValue[this.formFields[index].configName] = {
598
602
  value: formattedValue,
@@ -660,9 +664,14 @@ class DynamicFormComponent {
660
664
  isCheckBoxSelected(value, selectedValues) {
661
665
  return selectedValues.findIndex(item => item.label === value) > -1;
662
666
  }
663
- findSelectedIndex(subfields, value) {
664
- const selectedIndex = subfields.findIndex(item => item.parentConfigValue === value);
665
- return selectedIndex !== -1 ? selectedIndex : 0;
667
+ findSelectedSubFieldConfig(subfields, value, subFieldIndex) {
668
+ try {
669
+ const selectedSubFieldConfig = subfields.filter(item => item.parentConfigValue === value)[subFieldIndex];
670
+ return selectedSubFieldConfig;
671
+ }
672
+ catch (e) {
673
+ throw new Error('Subfield index not found');
674
+ }
666
675
  }
667
676
  matchParentConfig(subfields, value) {
668
677
  if (!subfields || subfields.length === 0) {
@@ -788,7 +797,7 @@ DynamicFormComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Dynami
788
797
  (function () {
789
798
  (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DynamicFormComponent, [{
790
799
  type: Component,
791
- 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;\">\n <ng-container\n [ngTemplateOutlet]=\"dynamicField\"\n [ngTemplateOutletContext]=\"{\n $implicit: formFields[i].subFields[findSelectedIndex(formFields[i]?.subFields, fieldControl.controls.value.value.value)],\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 <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'input' && (field.fieldInputType === 'text' || field.fieldInputType === 'number')\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}\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\n <!-- fieldType: 'input' fieldInputType: 'textarea' -->\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'input' && field.fieldInputType === 'textarea'\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}\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\n <!-- fieldType: 'input' fieldInputType: 'date' -->\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 }}\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\n <!-- fieldType: 'boolean' fieldInputType: 'toggle' -->\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'boolean' && field.fieldInputType === 'toggle'\">\n <p class=\"h6\">\n {{ field.title }}\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\n <!-- fieldType: 'singleSelect' fieldInputType: 'dropdown' -->\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'singleSelect' && field.fieldInputType === 'dropdown'\">\n <p class=\"h6\">\n {{ field.title }}\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\n <!-- fieldType: 'singleSelect' fieldInputType: 'radio' -->\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'singleSelect' && field.fieldInputType === 'radio'\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}\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\n <!-- fieldType: 'multiSelect' fieldInputType: 'checkbox' -->\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'multiSelect' && field.fieldInputType === 'checkbox'\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}\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\n <!-- fieldType: 'multiSelect' fieldInputType: 'dropdown' -->\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'multiSelect' && field.fieldInputType === 'dropdown'\">\n <p class=\"h6\">\n {{ field.title }}\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\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 style=\"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}\n"] }]
800
+ 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 <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'input' && (field.fieldInputType === 'text' || field.fieldInputType === 'number')\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}\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\n <!-- fieldType: 'input' fieldInputType: 'textarea' -->\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'input' && field.fieldInputType === 'textarea'\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}\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\n <!-- fieldType: 'input' fieldInputType: 'date' -->\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 }}\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\n <!-- fieldType: 'boolean' fieldInputType: 'toggle' -->\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'boolean' && field.fieldInputType === 'toggle'\">\n <p class=\"h6\">\n {{ field.title }}\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\n <!-- fieldType: 'singleSelect' fieldInputType: 'dropdown' -->\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'singleSelect' && field.fieldInputType === 'dropdown'\">\n <p class=\"h6\">\n {{ field.title }}\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\n <!-- fieldType: 'singleSelect' fieldInputType: 'radio' -->\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'singleSelect' && field.fieldInputType === 'radio'\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}\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\n <!-- fieldType: 'multiSelect' fieldInputType: 'checkbox' -->\n <div class=\"dynamic-field multi-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'multiSelect' && field.fieldInputType === 'checkbox'\">\n <p class=\"h7 field-title-sm\">\n {{ field.title }}\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\n <!-- fieldType: 'multiSelect' fieldInputType: 'dropdown' -->\n <div class=\"dynamic-field single-line-field-container\"\n [ngStyle]=\"{'border-bottom': (formgroup?.controls?.subFields?.controls?.length && removeSepratorForSubFields) ? 'none':''}\"\n *ngIf=\"field.fieldType === 'multiSelect' && field.fieldInputType === 'dropdown'\">\n <p class=\"h6\">\n {{ field.title }}\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\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 style=\"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}\n"] }]
792
801
  }], function () { return []; }, { formFields: [{
793
802
  type: Input
794
803
  }], formValues: [{