mis-crystal-design-system 18.1.7-signal-3 → 18.1.7-signal-5
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.
|
@@ -114,42 +114,45 @@ function TableComponent_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
|
114
114
|
i0.ɵɵadvance();
|
|
115
115
|
i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.type) === "custom");
|
|
116
116
|
} }
|
|
117
|
-
function
|
|
117
|
+
function TableComponent_div_9_div_4_div_4_ng_container_2_Template(rf, ctx) { if (rf & 1) {
|
|
118
118
|
i0.ɵɵelementContainerStart(0);
|
|
119
|
-
i0.ɵɵ
|
|
119
|
+
i0.ɵɵtext(1, " text 6 ");
|
|
120
|
+
i0.ɵɵelement(2, "span", 40);
|
|
120
121
|
i0.ɵɵelementContainerEnd();
|
|
121
122
|
} if (rf & 2) {
|
|
122
123
|
const col_r12 = i0.ɵɵnextContext(2).$implicit;
|
|
123
|
-
i0.ɵɵadvance();
|
|
124
|
+
i0.ɵɵadvance(2);
|
|
124
125
|
i0.ɵɵproperty("innerHTML", col_r12, i0.ɵɵsanitizeHtml);
|
|
125
126
|
} }
|
|
126
|
-
function
|
|
127
|
-
i0.ɵɵ
|
|
128
|
-
i0.ɵɵ
|
|
127
|
+
function TableComponent_div_9_div_4_div_4_ng_template_3_Template(rf, ctx) { if (rf & 1) {
|
|
128
|
+
i0.ɵɵtext(0, " text 7 ");
|
|
129
|
+
i0.ɵɵelementStart(1, "span");
|
|
130
|
+
i0.ɵɵtext(2);
|
|
129
131
|
i0.ɵɵelementEnd();
|
|
130
132
|
} if (rf & 2) {
|
|
131
133
|
const col_r12 = i0.ɵɵnextContext(2).$implicit;
|
|
132
|
-
i0.ɵɵadvance();
|
|
134
|
+
i0.ɵɵadvance(2);
|
|
133
135
|
i0.ɵɵtextInterpolate(col_r12);
|
|
134
136
|
} }
|
|
135
|
-
function
|
|
137
|
+
function TableComponent_div_9_div_4_div_4_Template(rf, ctx) { if (rf & 1) {
|
|
136
138
|
i0.ɵɵelementStart(0, "div", 38);
|
|
137
|
-
i0.ɵɵ
|
|
139
|
+
i0.ɵɵtext(1, " text 5 ");
|
|
140
|
+
i0.ɵɵtemplate(2, TableComponent_div_9_div_4_div_4_ng_container_2_Template, 3, 1, "ng-container", 39)(3, TableComponent_div_9_div_4_div_4_ng_template_3_Template, 3, 1, "ng-template", null, 3, i0.ɵɵtemplateRefExtractor);
|
|
138
141
|
i0.ɵɵelementEnd();
|
|
139
142
|
} if (rf & 2) {
|
|
140
143
|
let tmp_10_0;
|
|
141
144
|
let tmp_12_0;
|
|
142
|
-
const plainText_r14 = i0.ɵɵreference(
|
|
145
|
+
const plainText_r14 = i0.ɵɵreference(4);
|
|
143
146
|
const colIndex_r13 = i0.ɵɵnextContext().index;
|
|
144
147
|
const rowIndex_r15 = i0.ɵɵnextContext().index;
|
|
145
148
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
146
149
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction2(4, _c11, ((tmp_10_0 = ctx_r1.tableConfig()) == null ? null : tmp_10_0.colConfig[colIndex_r13] == null ? null : tmp_10_0.colConfig[colIndex_r13].style == null ? null : tmp_10_0.colConfig[colIndex_r13].style.color) || "", ctx_r1.previewLines() || 3))("ngClass", i0.ɵɵpureFunction1(7, _c12, ctx_r1.collapseColIndex() == colIndex_r13 && ctx_r1.expandedMap()[rowIndex_r15]));
|
|
147
|
-
i0.ɵɵadvance();
|
|
150
|
+
i0.ɵɵadvance(2);
|
|
148
151
|
i0.ɵɵproperty("ngIf", ((tmp_12_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_12_0.type) === "html")("ngIfElse", plainText_r14);
|
|
149
152
|
} }
|
|
150
|
-
function
|
|
151
|
-
function
|
|
152
|
-
i0.ɵɵtemplate(0,
|
|
153
|
+
function TableComponent_div_9_div_4_5_ng_template_0_Template(rf, ctx) { }
|
|
154
|
+
function TableComponent_div_9_div_4_5_Template(rf, ctx) { if (rf & 1) {
|
|
155
|
+
i0.ɵɵtemplate(0, TableComponent_div_9_div_4_5_ng_template_0_Template, 0, 0, "ng-template", 29);
|
|
153
156
|
} if (rf & 2) {
|
|
154
157
|
const ctx_r15 = i0.ɵɵnextContext();
|
|
155
158
|
const col_r12 = ctx_r15.$implicit;
|
|
@@ -157,10 +160,10 @@ function TableComponent_div_9_div_2_3_Template(rf, ctx) { if (rf & 1) {
|
|
|
157
160
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
158
161
|
i0.ɵɵproperty("customComponent", ctx_r1.tableConfig().colConfig[colIndex_r13].componentRef)("data", col_r12);
|
|
159
162
|
} }
|
|
160
|
-
function
|
|
163
|
+
function TableComponent_div_9_div_4_mis_actions_cell_7_Template(rf, ctx) { if (rf & 1) {
|
|
161
164
|
const _r17 = i0.ɵɵgetCurrentView();
|
|
162
165
|
i0.ɵɵelementStart(0, "mis-actions-cell", 41);
|
|
163
|
-
i0.ɵɵlistener("actionClick", function
|
|
166
|
+
i0.ɵɵlistener("actionClick", function TableComponent_div_9_div_4_mis_actions_cell_7_Template_mis_actions_cell_actionClick_0_listener($event) { i0.ɵɵrestoreView(_r17); const rowIndex_r15 = i0.ɵɵnextContext(2).index; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onActionClick($event, rowIndex_r15)); });
|
|
164
167
|
i0.ɵɵelementEnd();
|
|
165
168
|
} if (rf & 2) {
|
|
166
169
|
let tmp_11_0;
|
|
@@ -171,12 +174,16 @@ function TableComponent_div_9_div_2_mis_actions_cell_4_Template(rf, ctx) { if (r
|
|
|
171
174
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
172
175
|
i0.ɵɵproperty("cellData", col_r12)("config", ctx_r1.tableConfig().colConfig[colIndex_r13])("ngClass", i0.ɵɵpureFunction1(3, _c13, (((tmp_11_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_11_0.actionType) === "checkbox" || ((tmp_11_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_11_0.actionType) === "row-collapse") && ctx_r1.isRowDisabled(row_r18)));
|
|
173
176
|
} }
|
|
174
|
-
function
|
|
177
|
+
function TableComponent_div_9_div_4_Template(rf, ctx) { if (rf & 1) {
|
|
175
178
|
const _r10 = i0.ɵɵgetCurrentView();
|
|
176
179
|
i0.ɵɵelementStart(0, "div", 34);
|
|
177
|
-
i0.ɵɵlistener("click", function
|
|
178
|
-
i0.ɵɵ
|
|
179
|
-
i0.ɵɵ
|
|
180
|
+
i0.ɵɵlistener("click", function TableComponent_div_9_div_4_Template_div_click_0_listener() { let tmp_9_0; const ctx_r10 = i0.ɵɵrestoreView(_r10); const col_r12 = ctx_r10.$implicit; const colIndex_r13 = ctx_r10.index; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(((tmp_9_0 = ctx_r1.tableConfig()) == null ? null : tmp_9_0.colConfig[colIndex_r13] == null ? null : tmp_9_0.colConfig[colIndex_r13].action) && ((tmp_9_0 = ctx_r1.tableConfig()) == null ? null : tmp_9_0.colConfig[colIndex_r13] == null ? null : tmp_9_0.colConfig[colIndex_r13].actionType) !== "checkbox" ? (tmp_9_0 = ctx_r1.tableConfig()) == null ? null : tmp_9_0.colConfig[colIndex_r13] == null ? null : tmp_9_0.colConfig[colIndex_r13].action(col_r12) : null); });
|
|
181
|
+
i0.ɵɵtext(1, " text 3 ");
|
|
182
|
+
i0.ɵɵelementStart(2, "div", 35);
|
|
183
|
+
i0.ɵɵtext(3, " text 4 ");
|
|
184
|
+
i0.ɵɵtemplate(4, TableComponent_div_9_div_4_div_4_Template, 5, 9, "div", 36)(5, TableComponent_div_9_div_4_5_Template, 1, 2, null, 19);
|
|
185
|
+
i0.ɵɵtext(6, " text 8 ");
|
|
186
|
+
i0.ɵɵtemplate(7, TableComponent_div_9_div_4_mis_actions_cell_7_Template, 1, 5, "mis-actions-cell", 37);
|
|
180
187
|
i0.ɵɵelementEnd()();
|
|
181
188
|
} if (rf & 2) {
|
|
182
189
|
let tmp_8_0;
|
|
@@ -188,17 +195,17 @@ function TableComponent_div_9_div_2_Template(rf, ctx) { if (rf & 1) {
|
|
|
188
195
|
const colIndex_r13 = ctx.index;
|
|
189
196
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
190
197
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(8, _c8, ((tmp_8_0 = ctx_r1.tableConfig()) == null ? null : tmp_8_0.colConfig[colIndex_r13] == null ? null : tmp_8_0.colConfig[colIndex_r13].style == null ? null : tmp_8_0.colConfig[colIndex_r13].style.width) || ((tmp_8_0 = ctx_r1.tableConfig()) == null ? null : tmp_8_0.colHeaderConfig[colIndex_r13] == null ? null : tmp_8_0.colHeaderConfig[colIndex_r13].style == null ? null : tmp_8_0.colHeaderConfig[colIndex_r13].style.width) || ""))("ngClass", i0.ɵɵpureFunction1(10, _c9, ctx_r1.tableConfig().cellHover));
|
|
191
|
-
i0.ɵɵadvance();
|
|
198
|
+
i0.ɵɵadvance(2);
|
|
192
199
|
i0.ɵɵstyleMap((tmp_10_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_10_0.style);
|
|
193
200
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction2(12, _c10, ((tmp_11_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_11_0.action) ? "pointer" : "default", ((tmp_11_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_11_0.style == null ? null : tmp_11_0.style.justifyContent) ? (tmp_11_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_11_0.style == null ? null : tmp_11_0.style.justifyContent : ((tmp_11_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_11_0.type) === "number" ? "flex-end" : "space-between"));
|
|
194
|
-
i0.ɵɵadvance();
|
|
201
|
+
i0.ɵɵadvance(2);
|
|
195
202
|
i0.ɵɵproperty("ngIf", ((tmp_12_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_12_0.type) !== "custom" && ((tmp_12_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_12_0.type) !== "actions");
|
|
196
203
|
i0.ɵɵadvance();
|
|
197
204
|
i0.ɵɵproperty("ngIf", ((tmp_13_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_13_0.type) === "custom");
|
|
198
|
-
i0.ɵɵadvance();
|
|
205
|
+
i0.ɵɵadvance(2);
|
|
199
206
|
i0.ɵɵproperty("ngIf", ((tmp_14_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_14_0.type) === "actions");
|
|
200
207
|
} }
|
|
201
|
-
function
|
|
208
|
+
function TableComponent_div_9_div_5_ng_container_2_Template(rf, ctx) { if (rf & 1) {
|
|
202
209
|
i0.ɵɵelementContainerStart(0);
|
|
203
210
|
i0.ɵɵelementStart(1, "div", 43);
|
|
204
211
|
i0.ɵɵtext(2, " Loading... ");
|
|
@@ -208,7 +215,7 @@ function TableComponent_div_9_div_3_ng_container_1_Template(rf, ctx) { if (rf &
|
|
|
208
215
|
i0.ɵɵadvance();
|
|
209
216
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(1, _c14));
|
|
210
217
|
} }
|
|
211
|
-
function
|
|
218
|
+
function TableComponent_div_9_div_5_ng_container_3_Template(rf, ctx) { if (rf & 1) {
|
|
212
219
|
i0.ɵɵelementContainerStart(0);
|
|
213
220
|
i0.ɵɵelementStart(1, "div", 43);
|
|
214
221
|
i0.ɵɵtext(2, " No Data Available... ");
|
|
@@ -218,22 +225,24 @@ function TableComponent_div_9_div_3_ng_container_2_Template(rf, ctx) { if (rf &
|
|
|
218
225
|
i0.ɵɵadvance();
|
|
219
226
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(1, _c14));
|
|
220
227
|
} }
|
|
221
|
-
function
|
|
228
|
+
function TableComponent_div_9_div_5_ng_container_4_Template(rf, ctx) { if (rf & 1) {
|
|
222
229
|
i0.ɵɵelementContainerStart(0);
|
|
223
|
-
i0.ɵɵ
|
|
230
|
+
i0.ɵɵtext(1, " text 10 ");
|
|
231
|
+
i0.ɵɵelement(2, "sub-table", 44);
|
|
224
232
|
i0.ɵɵelementContainerEnd();
|
|
225
233
|
} if (rf & 2) {
|
|
226
234
|
const ctx_r1 = i0.ɵɵnextContext(3);
|
|
227
|
-
i0.ɵɵadvance();
|
|
235
|
+
i0.ɵɵadvance(2);
|
|
228
236
|
i0.ɵɵproperty("config", ctx_r1.subTableconfig())("tableData", ctx_r1.subTableData());
|
|
229
237
|
} }
|
|
230
|
-
function
|
|
238
|
+
function TableComponent_div_9_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
231
239
|
i0.ɵɵelementStart(0, "div", 42);
|
|
232
|
-
i0.ɵɵ
|
|
240
|
+
i0.ɵɵtext(1, " text 9 ");
|
|
241
|
+
i0.ɵɵtemplate(2, TableComponent_div_9_div_5_ng_container_2_Template, 3, 2, "ng-container", 19)(3, TableComponent_div_9_div_5_ng_container_3_Template, 3, 2, "ng-container", 19)(4, TableComponent_div_9_div_5_ng_container_4_Template, 3, 2, "ng-container", 19);
|
|
233
242
|
i0.ɵɵelementEnd();
|
|
234
243
|
} if (rf & 2) {
|
|
235
244
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
236
|
-
i0.ɵɵadvance();
|
|
245
|
+
i0.ɵɵadvance(2);
|
|
237
246
|
i0.ɵɵproperty("ngIf", ctx_r1.subTableDataLoading());
|
|
238
247
|
i0.ɵɵadvance();
|
|
239
248
|
i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading() && ctx_r1.subTableData().length === 0);
|
|
@@ -242,11 +251,14 @@ function TableComponent_div_9_div_3_Template(rf, ctx) { if (rf & 1) {
|
|
|
242
251
|
} }
|
|
243
252
|
function TableComponent_div_9_Template(rf, ctx) { if (rf & 1) {
|
|
244
253
|
const _r8 = i0.ɵɵgetCurrentView();
|
|
245
|
-
i0.ɵɵelementStart(0, "div", 30)
|
|
246
|
-
i0.ɵɵ
|
|
247
|
-
i0.ɵɵ
|
|
254
|
+
i0.ɵɵelementStart(0, "div", 30);
|
|
255
|
+
i0.ɵɵtext(1, " text 1 ");
|
|
256
|
+
i0.ɵɵelementStart(2, "div", 31);
|
|
257
|
+
i0.ɵɵlistener("click", function TableComponent_div_9_Template_div_click_2_listener() { const i_r9 = i0.ɵɵrestoreView(_r8).index; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.selectRow(i_r9)); });
|
|
258
|
+
i0.ɵɵtext(3, " text 2 ");
|
|
259
|
+
i0.ɵɵtemplate(4, TableComponent_div_9_div_4_Template, 8, 15, "div", 32);
|
|
248
260
|
i0.ɵɵelementEnd();
|
|
249
|
-
i0.ɵɵtemplate(
|
|
261
|
+
i0.ɵɵtemplate(5, TableComponent_div_9_div_5_Template, 5, 3, "div", 33);
|
|
250
262
|
i0.ɵɵelementEnd();
|
|
251
263
|
} if (rf & 2) {
|
|
252
264
|
let tmp_7_0;
|
|
@@ -254,18 +266,18 @@ function TableComponent_div_9_Template(rf, ctx) { if (rf & 1) {
|
|
|
254
266
|
const row_r18 = ctx.$implicit;
|
|
255
267
|
const i_r9 = ctx.index;
|
|
256
268
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
257
|
-
i0.ɵɵadvance();
|
|
269
|
+
i0.ɵɵadvance(2);
|
|
258
270
|
i0.ɵɵclassProp("disabled-row", ctx_r1.isRowDisabled(row_r18));
|
|
259
271
|
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction2(6, _c6$1, ctx_r1.tableConfig().cellHover, ctx_r1.activeRowIndex().includes(i_r9)))("ngStyle", i0.ɵɵpureFunction1(9, _c7$1, ((tmp_7_0 = ctx_r1.tableConfig()) == null ? null : tmp_7_0.rowConfig == null ? null : tmp_7_0.rowConfig.height) ? ctx_r1.tableConfig().rowConfig.height : "44px"));
|
|
260
|
-
i0.ɵɵadvance();
|
|
272
|
+
i0.ɵɵadvance(2);
|
|
261
273
|
i0.ɵɵproperty("ngForOf", row_r18);
|
|
262
274
|
i0.ɵɵadvance();
|
|
263
275
|
i0.ɵɵproperty("ngIf", ((tmp_9_0 = ctx_r1.tableConfig()) == null ? null : tmp_9_0.canExpand) && ctx_r1.expandedIndex() === i_r9);
|
|
264
276
|
} }
|
|
265
|
-
function
|
|
277
|
+
function TableComponent_div_11_ng_container_9_div_1_span_1_Template(rf, ctx) { if (rf & 1) {
|
|
266
278
|
const _r20 = i0.ɵɵgetCurrentView();
|
|
267
279
|
i0.ɵɵelementStart(0, "span", 55);
|
|
268
|
-
i0.ɵɵlistener("click", function
|
|
280
|
+
i0.ɵɵlistener("click", function TableComponent_div_11_ng_container_9_div_1_span_1_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r20); const pageNumber_r21 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.updateSelectedPage(pageNumber_r21)); });
|
|
269
281
|
i0.ɵɵtext(1);
|
|
270
282
|
i0.ɵɵelementEnd();
|
|
271
283
|
} if (rf & 2) {
|
|
@@ -276,7 +288,7 @@ function TableComponent_div_10_ng_container_7_div_1_span_1_Template(rf, ctx) { i
|
|
|
276
288
|
i0.ɵɵadvance();
|
|
277
289
|
i0.ɵɵtextInterpolate(pageNumber_r21);
|
|
278
290
|
} }
|
|
279
|
-
function
|
|
291
|
+
function TableComponent_div_11_ng_container_9_div_1_span_2_Template(rf, ctx) { if (rf & 1) {
|
|
280
292
|
i0.ɵɵelementStart(0, "span", 56)(1, "div", 43);
|
|
281
293
|
i0.ɵɵelement(2, "span", 57)(3, "span", 57)(4, "span", 58);
|
|
282
294
|
i0.ɵɵelementEnd()();
|
|
@@ -288,9 +300,9 @@ function TableComponent_div_10_ng_container_7_div_1_span_2_Template(rf, ctx) { i
|
|
|
288
300
|
i0.ɵɵadvance();
|
|
289
301
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(5, _c17));
|
|
290
302
|
} }
|
|
291
|
-
function
|
|
303
|
+
function TableComponent_div_11_ng_container_9_div_1_Template(rf, ctx) { if (rf & 1) {
|
|
292
304
|
i0.ɵɵelementStart(0, "div");
|
|
293
|
-
i0.ɵɵtemplate(1,
|
|
305
|
+
i0.ɵɵtemplate(1, TableComponent_div_11_ng_container_9_div_1_span_1_Template, 2, 4, "span", 53)(2, TableComponent_div_11_ng_container_9_div_1_span_2_Template, 5, 6, "span", 54);
|
|
294
306
|
i0.ɵɵelementEnd();
|
|
295
307
|
} if (rf & 2) {
|
|
296
308
|
const pageNumber_r21 = ctx.$implicit;
|
|
@@ -299,33 +311,36 @@ function TableComponent_div_10_ng_container_7_div_1_Template(rf, ctx) { if (rf &
|
|
|
299
311
|
i0.ɵɵadvance();
|
|
300
312
|
i0.ɵɵproperty("ngIf", pageNumber_r21 == 0);
|
|
301
313
|
} }
|
|
302
|
-
function
|
|
314
|
+
function TableComponent_div_11_ng_container_9_Template(rf, ctx) { if (rf & 1) {
|
|
303
315
|
i0.ɵɵelementContainerStart(0);
|
|
304
|
-
i0.ɵɵtemplate(1,
|
|
316
|
+
i0.ɵɵtemplate(1, TableComponent_div_11_ng_container_9_div_1_Template, 3, 2, "div", 52);
|
|
305
317
|
i0.ɵɵelementContainerEnd();
|
|
306
318
|
} if (rf & 2) {
|
|
307
319
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
308
320
|
i0.ɵɵadvance();
|
|
309
321
|
i0.ɵɵproperty("ngForOf", ctx_r1.pages());
|
|
310
322
|
} }
|
|
311
|
-
function
|
|
323
|
+
function TableComponent_div_11_Template(rf, ctx) { if (rf & 1) {
|
|
312
324
|
const _r19 = i0.ɵɵgetCurrentView();
|
|
313
|
-
i0.ɵɵelementStart(0, "div", 45)
|
|
314
|
-
i0.ɵɵtext(
|
|
325
|
+
i0.ɵɵelementStart(0, "div", 45);
|
|
326
|
+
i0.ɵɵtext(1, " text 12 ");
|
|
327
|
+
i0.ɵɵelementStart(2, "p", 46);
|
|
328
|
+
i0.ɵɵtext(3);
|
|
315
329
|
i0.ɵɵelementEnd();
|
|
316
|
-
i0.ɵɵ
|
|
317
|
-
i0.ɵɵ
|
|
330
|
+
i0.ɵɵtext(4, " text 13 ");
|
|
331
|
+
i0.ɵɵelementStart(5, "div", 47)(6, "span", 48);
|
|
332
|
+
i0.ɵɵlistener("click", function TableComponent_div_11_Template_span_click_6_listener() { let tmp_3_0; i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(((tmp_3_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_3_0.selectedPage) > 1 && ctx_r1.updateSelectedPage(((tmp_3_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_3_0.selectedPage) - 1)); });
|
|
318
333
|
i0.ɵɵnamespaceSVG();
|
|
319
|
-
i0.ɵɵelementStart(
|
|
320
|
-
i0.ɵɵelement(
|
|
334
|
+
i0.ɵɵelementStart(7, "svg", 49);
|
|
335
|
+
i0.ɵɵelement(8, "path", 50);
|
|
321
336
|
i0.ɵɵelementEnd()();
|
|
322
|
-
i0.ɵɵtemplate(
|
|
337
|
+
i0.ɵɵtemplate(9, TableComponent_div_11_ng_container_9_Template, 2, 1, "ng-container", 19);
|
|
323
338
|
i0.ɵɵnamespaceHTML();
|
|
324
|
-
i0.ɵɵelementStart(
|
|
325
|
-
i0.ɵɵlistener("click", function
|
|
339
|
+
i0.ɵɵelementStart(10, "span", 48);
|
|
340
|
+
i0.ɵɵlistener("click", function TableComponent_div_11_Template_span_click_10_listener() { let tmp_3_0; i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(((tmp_3_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_3_0.selectedPage) < ((tmp_3_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_3_0.noOfPages) && ctx_r1.updateSelectedPage(((tmp_3_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_3_0.selectedPage) + 1)); });
|
|
326
341
|
i0.ɵɵnamespaceSVG();
|
|
327
|
-
i0.ɵɵelementStart(
|
|
328
|
-
i0.ɵɵelement(
|
|
342
|
+
i0.ɵɵelementStart(11, "svg", 49);
|
|
343
|
+
i0.ɵɵelement(12, "path", 51);
|
|
329
344
|
i0.ɵɵelementEnd()()()();
|
|
330
345
|
} if (rf & 2) {
|
|
331
346
|
let tmp_2_0;
|
|
@@ -333,9 +348,9 @@ function TableComponent_div_10_Template(rf, ctx) { if (rf & 1) {
|
|
|
333
348
|
let tmp_4_0;
|
|
334
349
|
let tmp_5_0;
|
|
335
350
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
336
|
-
i0.ɵɵadvance(
|
|
351
|
+
i0.ɵɵadvance(3);
|
|
337
352
|
i0.ɵɵtextInterpolate3(" Showing ", (((tmp_2_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_2_0.selectedPage) - 1) * ctx_r1.tableConfig().paginationConfig.rowsPerPage + 1, "-", (((tmp_2_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_2_0.selectedPage) - 1) * ctx_r1.tableConfig().paginationConfig.rowsPerPage + ctx_r1.tableLength(), " of ", ctx_r1.tableConfig().paginationConfig.totalNoOfRows, " items ");
|
|
338
|
-
i0.ɵɵadvance(
|
|
353
|
+
i0.ɵɵadvance(3);
|
|
339
354
|
i0.ɵɵclassProp("page-nav-inactive", ((tmp_3_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_3_0.selectedPage) === 1);
|
|
340
355
|
i0.ɵɵadvance(3);
|
|
341
356
|
i0.ɵɵproperty("ngIf", !((tmp_4_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_4_0.disablePageJumping));
|
|
@@ -343,8 +358,9 @@ function TableComponent_div_10_Template(rf, ctx) { if (rf & 1) {
|
|
|
343
358
|
i0.ɵɵclassProp("page-nav-inactive", ((tmp_5_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_5_0.selectedPage) === ((tmp_5_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_5_0.noOfPages));
|
|
344
359
|
} }
|
|
345
360
|
class TableComponent {
|
|
346
|
-
constructor(renderer) {
|
|
361
|
+
constructor(renderer, cdr) {
|
|
347
362
|
this.renderer = renderer;
|
|
363
|
+
this.cdr = cdr;
|
|
348
364
|
// Initialize with -1 to indicate no row is colored at the beginning
|
|
349
365
|
this.activeRowIndex = signal([]);
|
|
350
366
|
this.hasCheckboxActions = signal(false);
|
|
@@ -388,6 +404,8 @@ class TableComponent {
|
|
|
388
404
|
if (this.rowCollapseConfigIndex() !== -1) {
|
|
389
405
|
this.buildExpandedMap();
|
|
390
406
|
}
|
|
407
|
+
// Trigger change detection when input signals change
|
|
408
|
+
this.cdr.markForCheck();
|
|
391
409
|
}, { allowSignalWrites: true });
|
|
392
410
|
}
|
|
393
411
|
// Function to handle row click
|
|
@@ -662,7 +680,7 @@ class TableComponent {
|
|
|
662
680
|
});
|
|
663
681
|
}
|
|
664
682
|
}
|
|
665
|
-
static { this.ɵfac = function TableComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TableComponent)(i0.ɵɵdirectiveInject(i0.Renderer2)); }; }
|
|
683
|
+
static { this.ɵfac = function TableComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TableComponent)(i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
|
|
666
684
|
static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TableComponent, selectors: [["mis-table"]], viewQuery: function TableComponent_Query(rf, ctx) { if (rf & 1) {
|
|
667
685
|
i0.ɵɵviewQuery(_c0$3, 5);
|
|
668
686
|
i0.ɵɵviewQuery(_c1$3, 5);
|
|
@@ -672,43 +690,42 @@ class TableComponent {
|
|
|
672
690
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.filter = _t.first);
|
|
673
691
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.table = _t.first);
|
|
674
692
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.colHeaders = _t);
|
|
675
|
-
} }, inputs: { tableConfig: [1, "tableConfig"], subTableconfig: [1, "subTableconfig"], tableDataLoading: [1, "tableDataLoading"], expandedIndex: [1, "expandedIndex"], tableData: [1, "tableData"], subTableData: [1, "subTableData"], subTableDataLoading: [1, "subTableDataLoading"], currentSort: [1, "currentSort"] }, outputs: { filtersUpdated: "filtersUpdated", pageSelected: "pageSelected", sortChange: "sortChange", headerAction: "headerAction" }, features: [i0.ɵɵNgOnChangesFeature], decls:
|
|
693
|
+
} }, inputs: { tableConfig: [1, "tableConfig"], subTableconfig: [1, "subTableconfig"], tableDataLoading: [1, "tableDataLoading"], expandedIndex: [1, "expandedIndex"], tableData: [1, "tableData"], subTableData: [1, "subTableData"], subTableDataLoading: [1, "subTableDataLoading"], currentSort: [1, "currentSort"] }, outputs: { filtersUpdated: "filtersUpdated", pageSelected: "pageSelected", sortChange: "sortChange", headerAction: "headerAction" }, features: [i0.ɵɵNgOnChangesFeature], decls: 12, vars: 15, consts: [["table", ""], ["filter", ""], ["colHeaderRef", ""], ["plainText", ""], ["id", "main-container", 3, "ngStyle"], [3, "containerStyles", "filtersData", "filtersApplied", 4, "ngIf"], ["id", "table-container", 3, "ngClass"], ["id", "col-headers-container", 3, "ngStyle"], ["class", "col-header", 3, "ngStyle", "click", 4, "ngFor", "ngForOf"], ["id", "data-container"], [2, "background", "red", "color", "white", "padding", "20px", "margin", "10px"], ["class", "row-wrapper", 4, "ngFor", "ngForOf"], ["id", "pagination-container", 4, "ngIf"], [3, "filtersApplied", "containerStyles", "filtersData"], [1, "col-header", 3, "click", "ngStyle"], ["class", "col-header-text", 4, "ngIf"], ["class", "filter-icon", 3, "click", 4, "ngIf"], ["class", "checkbox-icon", 3, "click", 4, "ngIf"], ["appSortIcons", "", "class", "sort-icon", 3, "column", "activeSort", "activeSorts", "multiColumnSort", "sortChange", 4, "ngIf"], [4, "ngIf"], [1, "col-header-text"], [1, "filter-icon", 3, "click"], ["id", "filter-active", 4, "ngIf"], ["fill", "none", "height", "10", "viewBox", "0 0 13 10", "width", "13", "xmlns", "http://www.w3.org/2000/svg"], ["clip-rule", "evenodd", "d", "M4.97546 10H7.64213V8H4.97546V10ZM0.308472 0V2H12.3085V0H0.308472ZM2.30847 6H10.3085V4H2.30847V6Z", "fill", "#181F33", "fill-rule", "evenodd"], ["id", "filter-active"], [1, "checkbox-icon", 3, "click"], [3, "checked"], ["appSortIcons", "", 1, "sort-icon", 3, "sortChange", "column", "activeSort", "activeSorts", "multiColumnSort"], ["customTableCell", "", 3, "customComponent", "data"], [1, "row-wrapper"], [1, "t-row", 3, "click", "ngClass", "ngStyle"], ["class", "t-col-container", 3, "ngStyle", "ngClass", "click", 4, "ngFor", "ngForOf"], ["class", "sub-row", 4, "ngIf"], [1, "t-col-container", 3, "click", "ngStyle", "ngClass"], [1, "t-col", 3, "ngStyle"], ["class", "t-col-text", 3, "ngStyle", "ngClass", 4, "ngIf"], [3, "cellData", "config", "ngClass", "actionClick", 4, "ngIf"], [1, "t-col-text", 3, "ngStyle", "ngClass"], [4, "ngIf", "ngIfElse"], [3, "innerHTML"], [3, "actionClick", "cellData", "config", "ngClass"], [1, "sub-row"], [3, "ngStyle"], [3, "config", "tableData"], ["id", "pagination-container"], ["id", "pagination-text"], ["id", "pages-container"], [1, "page", 3, "click"], ["fill", "none", "height", "10", "viewBox", "0 0 7 10", "width", "7", "xmlns", "http://www.w3.org/2000/svg"], ["clip-rule", "evenodd", "d", "M0.857405 5.56295C0.855794 5.56139 0.854188 5.55982 0.852588 5.55824C0.695955 5.40408 0.617641 5.20203 0.617647 4.99998C0.617641 4.79793 0.695955 4.59588 0.852588 4.44172C0.854188 4.44014 0.855794 4.43858 0.857404 4.43702L5.13066 0.231231C5.44392 -0.0770771 5.9518 -0.0770771 6.26506 0.231231C6.57831 0.53954 6.57831 1.03941 6.26506 1.34772L2.5542 4.99998L6.26506 8.65225C6.57831 8.96055 6.57831 9.46042 6.26506 9.76873C5.9518 10.077 5.44392 10.077 5.13066 9.76873L0.857405 5.56295Z", "fill", "#181F33", "fill-rule", "evenodd"], ["clip-rule", "evenodd", "d", "M6.1426 5.56295C6.14421 5.56139 6.14581 5.55982 6.14741 5.55824C6.30405 5.40408 6.38236 5.20203 6.38236 4.99998C6.38236 4.79793 6.30405 4.59588 6.14741 4.44172C6.14581 4.44014 6.14421 4.43858 6.1426 4.43702L1.86934 0.231231C1.55608 -0.0770771 1.0482 -0.0770771 0.734942 0.231231C0.421688 0.53954 0.421688 1.03941 0.734942 1.34772L4.4458 4.99998L0.734941 8.65225C0.421686 8.96055 0.421686 9.46042 0.734941 9.76873C1.0482 10.077 1.55608 10.077 1.86934 9.76873L6.1426 5.56295Z", "fill", "#181F33", "fill-rule", "evenodd"], [4, "ngFor", "ngForOf"], ["class", "page page-jumping-enabled", 3, "ngClass", "click", 4, "ngIf"], ["class", "page-seperator", 4, "ngIf"], [1, "page", "page-jumping-enabled", 3, "click", "ngClass"], [1, "page-seperator"], [1, "dot", 3, "ngStyle"], [1, "dot"]], template: function TableComponent_Template(rf, ctx) { if (rf & 1) {
|
|
676
694
|
i0.ɵɵelementStart(0, "div", 4);
|
|
677
695
|
i0.ɵɵtemplate(1, TableComponent_mis_table_filter_1_Template, 2, 2, "mis-table-filter", 5);
|
|
678
696
|
i0.ɵɵelementStart(2, "div", 6, 0)(4, "div", 7);
|
|
679
697
|
i0.ɵɵtemplate(5, TableComponent_div_5_Template, 7, 10, "div", 8);
|
|
680
698
|
i0.ɵɵelementEnd();
|
|
681
699
|
i0.ɵɵelementStart(6, "div", 9)(7, "div", 10);
|
|
682
|
-
i0.ɵɵtext(8);
|
|
700
|
+
i0.ɵɵtext(8, " HARDCODED TEST - This should be visible ");
|
|
683
701
|
i0.ɵɵelementEnd();
|
|
684
|
-
i0.ɵɵtemplate(9, TableComponent_div_9_Template,
|
|
702
|
+
i0.ɵɵtemplate(9, TableComponent_div_9_Template, 6, 11, "div", 11);
|
|
685
703
|
i0.ɵɵelementEnd()();
|
|
686
|
-
i0.ɵɵ
|
|
704
|
+
i0.ɵɵtext(10, " text 11 ");
|
|
705
|
+
i0.ɵɵtemplate(11, TableComponent_div_11_Template, 13, 8, "div", 12);
|
|
687
706
|
i0.ɵɵelementEnd();
|
|
688
707
|
} if (rf & 2) {
|
|
689
708
|
let tmp_5_0;
|
|
690
|
-
let
|
|
691
|
-
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction3(
|
|
709
|
+
let tmp_7_0;
|
|
710
|
+
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction3(7, _c3$1, ctx.getContainerHeight(), ctx.getContainerWidth(), ctx.tableConfig().canScrollHorizontally ? "auto" : "unset"));
|
|
692
711
|
i0.ɵɵadvance();
|
|
693
712
|
i0.ɵɵproperty("ngIf", ctx.showFilter());
|
|
694
713
|
i0.ɵɵadvance();
|
|
695
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction3(
|
|
714
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction3(11, _c4$1, ctx.expandedIndex() < 0, !(ctx.expandedIndex() < 0), ctx.tableConfig().canScrollHorizontally));
|
|
696
715
|
i0.ɵɵadvance(2);
|
|
697
716
|
i0.ɵɵproperty("ngStyle", ctx.getColHeadersRowStyles());
|
|
698
717
|
i0.ɵɵadvance();
|
|
699
718
|
i0.ɵɵproperty("ngForOf", (tmp_5_0 = ctx.tableConfig()) == null ? null : tmp_5_0.colHeaderConfig);
|
|
700
|
-
i0.ɵɵadvance(
|
|
701
|
-
i0.ɵɵtextInterpolate3(" Debug: tableData length = ", ctx.tableData().length, ", tableConfig exists = ", !!ctx.tableConfig(), ", first row = ", ctx.tableData()[0], " ");
|
|
702
|
-
i0.ɵɵadvance();
|
|
719
|
+
i0.ɵɵadvance(4);
|
|
703
720
|
i0.ɵɵproperty("ngForOf", ctx.tableData());
|
|
704
|
-
i0.ɵɵadvance();
|
|
705
|
-
i0.ɵɵproperty("ngIf", ((
|
|
706
|
-
} }, styles: ["#main-container[_ngcontent-%COMP%]{font-family:Lato,sans-serif;position:relative}.no-scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar{width:0}.scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar{width:8px;height:8px;border-radius:15px}.scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:15px}#table-container[_ngcontent-%COMP%]{height:inherit;overflow-y:auto}#data-container[_ngcontent-%COMP%]{min-height:100px;background-color:#
|
|
721
|
+
i0.ɵɵadvance(2);
|
|
722
|
+
i0.ɵɵproperty("ngIf", ((tmp_7_0 = ctx.tableConfig()) == null ? null : tmp_7_0.paginationConfig) && (ctx.tableLength() >= ctx.tableConfig().paginationConfig.rowsPerPage || ((tmp_7_0 = ctx.tableConfig().paginationConfig) == null ? null : tmp_7_0.selectedPage) !== 1));
|
|
723
|
+
} }, styles: ["#main-container[_ngcontent-%COMP%]{font-family:Lato,sans-serif;position:relative}.no-scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar{width:0}.scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar{width:8px;height:8px;border-radius:15px}.scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:15px}#table-container[_ngcontent-%COMP%]{height:inherit;overflow-y:auto;background-color:#0000ff1a;border:2px solid blue}#data-container[_ngcontent-%COMP%]{min-height:100px;background-color:#00ff001a;border:2px solid red}.scroll-horizontally[_ngcontent-%COMP%]{height:inherit;width:fit-content;overflow-y:unset!important;overflow-x:visible}#col-headers-container[_ngcontent-%COMP%]{display:flex;align-items:center;position:sticky;background-color:var(--bg-primary, #FFFFFF);width:100%;z-index:1;min-height:44px;border-bottom:1px solid var(--border-primary, #E0E0E0);top:0;left:0;right:0}.col-header[_ngcontent-%COMP%]{padding:0 16px;display:flex;align-items:center;height:100%}.col-header-text[_ngcontent-%COMP%]{font-style:normal;font-weight:700;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.sort-icon[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center}.filter-icon[_ngcontent-%COMP%]{margin-left:8px;padding:0 8px;position:relative;cursor:pointer}#filter-active[_ngcontent-%COMP%]{height:8px;width:8px;background:var(--brand-accent, #10ADAE);border-radius:50%;position:absolute;top:4px;right:4px}.sub-row[_ngcontent-%COMP%]{height:auto;border-bottom:none}.loader[_ngcontent-%COMP%] .mat-progress-spinner circle, .mat-spinner[_ngcontent-%COMP%] circle[_ngcontent-%COMP%]{stroke:var(--brand-primary, #0937B2)}.t-row[_ngcontent-%COMP%]{display:flex;min-height:44px;background-color:var(--bg-primary, #FFFFFF);width:100%;border-bottom:1px solid var(--border-primary, #E0E0E0)}.t-row[_ngcontent-%COMP%]:hover{background-color:var(--brand-primary-hover, #F0F3FA)}.active-row[_ngcontent-%COMP%]{background-color:var(--brand-primary-active, #DAE1F3)}.t-col-container[_ngcontent-%COMP%]{padding:0 16px;overflow-wrap:anywhere;min-width:0}.t-row-hover[_ngcontent-%COMP%]:hover{background-color:#0000}.t-col-container-hover[_ngcontent-%COMP%]:hover{background-color:var(--brand-primary-active, #DAE1F3)}.t-col-container-hover[_ngcontent-%COMP%]:first-child{border-left:1px solid var(--border-primary, #E0E0E0)}.t-col-container-hover[_ngcontent-%COMP%]{border-right:1px solid var(--border-primary, #E0E0E0)}.t-col[_ngcontent-%COMP%]{display:flex;align-items:center;height:100%}.t-col-text[_ngcontent-%COMP%]{font-style:normal;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.text-ellipsis[_ngcontent-%COMP%]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}#pagination-container[_ngcontent-%COMP%]{display:flex;justify-content:flex-end;align-items:center;height:56px}#pagination-text[_ngcontent-%COMP%]{font-style:normal;font-weight:400;font-size:12px;line-height:18px;letter-spacing:.4px;color:var(--text-secondary, #6A737D);margin:0 56px 0 0}#pages-container[_ngcontent-%COMP%]{display:flex;margin-right:32px}.page[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;box-sizing:border-box;border-radius:4px;width:32px;height:32px;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-secondary, #6A737D);margin-right:8px;cursor:pointer}.page.page-jumping-enabled[_ngcontent-%COMP%]{border:1px solid var(--text-secondary, #6A737D)}.page-seperator[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;width:32px;height:32px;margin-right:8px}.dot[_ngcontent-%COMP%]{height:3px;width:3px;border-radius:50%;background:var(--text-secondary, #6A737D)}.page-active[_ngcontent-%COMP%]{color:var(--brand-primary, #0937B2);border:1px solid var(--brand-primary, #0937B2)}.sort-icon[_ngcontent-%COMP%]{display:inline-flex;align-items:center;margin-left:4px;cursor:pointer}.sort-icon[_ngcontent-%COMP%] img[_ngcontent-%COMP%]{width:16px;height:16px;transition:opacity .2s ease}.sort-icon[_ngcontent-%COMP%] img[_ngcontent-%COMP%]:hover{opacity:.8}.disabled-row[_ngcontent-%COMP%] .t-col-container[_ngcontent-%COMP%]{opacity:.4;pointer-events:none}.disabled-row[_ngcontent-%COMP%] .t-col-container[_ngcontent-%COMP%]:has(mis-actions-cell){opacity:1;pointer-events:auto}.row[_ngcontent-%COMP%]{transition:background-color .2s}.row[_ngcontent-%COMP%]:hover:not(.disabled-row), .row.selected[_ngcontent-%COMP%]:not(.disabled-row){background-color:var(--brand-primary-active, #DAE1F3)}.disabled-row[_ngcontent-%COMP%] .t-col-container[_ngcontent-%COMP%]{pointer-events:none;opacity:.4}.disabled-row[_ngcontent-%COMP%] .t-col-container[_ngcontent-%COMP%]:has(mis-actions-cell){pointer-events:auto!important;opacity:1!important;color:inherit!important}mis-actions-cell.disable-actions[_ngcontent-%COMP%]{pointer-events:none;opacity:.4;filter:grayscale(.5)}.page-nav-inactive[_ngcontent-%COMP%]{pointer-events:none;opacity:.5;cursor:default}.collapsed-cell[_ngcontent-%COMP%]{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;display:block;@supports (-webkit-line-clamp: 2){display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:var(--collapsed-lines, 2);white-space:normal!important}}"] }); }
|
|
707
724
|
}
|
|
708
725
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TableComponent, [{
|
|
709
726
|
type: Component,
|
|
710
|
-
args: [{ selector: "mis-table", template: "<div\n [ngStyle]=\"{\n height: getContainerHeight(),\n width: getContainerWidth(),\n 'overflow-x': tableConfig().canScrollHorizontally ? 'auto' : 'unset'\n }\"\n id=\"main-container\"\n>\n <mis-table-filter\n #filter\n (filtersApplied)=\"updateAppliedFilters($event)\"\n *ngIf=\"showFilter()\"\n [containerStyles]=\"filterContainerStyles()\"\n [filtersData]=\"filterData()\"\n ></mis-table-filter>\n <div\n #table\n id=\"table-container\"\n [ngClass]=\"{ 'no-scrollbar': expandedIndex() < 0, scrollbar: !(expandedIndex() < 0), 'scroll-horizontally': tableConfig().canScrollHorizontally }\"\n >\n <div\n [ngStyle]=\"getColHeadersRowStyles()\"\n id=\"col-headers-container\"\n >\n <div\n #colHeaderRef\n (click)=\"colHeader?.action ? colHeader?.action(colHeader) : null\"\n *ngFor=\"let colHeader of tableConfig()?.colHeaderConfig\"\n class=\"col-header\"\n [ngStyle]=\"{\n width: colHeader?.style?.width || '',\n cursor: colHeader.action ? 'pointer' : 'default',\n 'justify-content': colHeader?.style?.justifyContent\n ? colHeader?.style?.justifyContent\n : colHeader.type === 'number'\n ? 'flex-end'\n : 'space-between'\n }\"\n >\n <p *ngIf=\"colHeader?.type !== 'custom' && colHeader?.type !== 'checkbox'\" class=\"col-header-text\">\n {{ colHeader?.data || \" \" }} - {{tableData().length}}\n </p>\n <span\n (click)=\"filterData.set(colHeader.filters); toggleFilter(colHeader.data); $event.stopPropagation()\"\n *ngIf=\"colHeader?.type !== 'custom' && colHeader?.filters && colHeader?.filters?.length > 0\"\n class=\"filter-icon\"\n >\n <span *ngIf=\"appliedFilters()[colHeader.data]?.length > 0\" id=\"filter-active\"></span>\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 13 10\" width=\"13\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M4.97546 10H7.64213V8H4.97546V10ZM0.308472 0V2H12.3085V0H0.308472ZM2.30847 6H10.3085V4H2.30847V6Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n <span\n (click)=\"toggleCheckbox(); $event.stopPropagation()\"\n *ngIf=\"colHeader?.type === 'checkbox'\"\n class=\"checkbox-icon\"\n >\n <mis-checkbox [checked]=\"selectAllCheckbox()\"></mis-checkbox>\n </span>\n <span *ngIf=\"colHeader?.isSortable && !colHeader?.filters\" appSortIcons\n [column]=\"colHeader\"\n [activeSort]=\"currentSort()\"\n [activeSorts]=\"multiColumnSort()\"\n [multiColumnSort]=\"tableConfig().multiColumnSort\"\n (sortChange)=\"onSortChange($event)\"\n class=\"sort-icon\">\n </span>\n <ng-template *ngIf=\"colHeader?.type === 'custom'\" customTableCell [customComponent]=\"colHeader?.componentRef\" [data]=\"colHeader.data\"></ng-template>\n </div>\n </div>\n \n <div id=\"data-container\">\n <!-- Debug info -->\n <div style=\"background: yellow; padding: 10px; margin: 10px;\">\n Debug: tableData length = {{tableData().length}}, \n tableConfig exists = {{!!tableConfig()}}, \n first row = {{tableData()[0]}}\n </div>\n <div class=\"row-wrapper\" *ngFor=\"let row of tableData(); let i = index; let rowIndex = index\">\n <div\n class=\"t-row\"\n [ngClass]=\"{ 't-row-hover': tableConfig().cellHover, 'active-row': activeRowIndex().includes(i) }\"\n [ngStyle]=\"{ 'min-height': tableConfig()?.rowConfig?.height ? tableConfig().rowConfig.height : '44px' }\"\n (click)=\"selectRow(i)\"\n [class.disabled-row]=\"isRowDisabled(row)\"\n >\n <div\n (click)=\"tableConfig()?.colConfig[colIndex]?.action && tableConfig()?.colConfig[colIndex]?.actionType !== 'checkbox' ? tableConfig()?.colConfig[colIndex]?.action(col) : null\"\n *ngFor=\"let col of row; let colIndex = index\"\n [ngStyle]=\"{\n width: tableConfig()?.colConfig[colIndex]?.style?.width || tableConfig()?.colHeaderConfig[colIndex]?.style?.width || ''\n }\"\n class=\"t-col-container\"\n [ngClass]=\"{ 't-col-container-hover': tableConfig().cellHover }\"\n >\n <div\n class=\"t-col\"\n [style]=\"tableConfig().colConfig[colIndex]?.style\"\n [ngStyle]=\"{\n width: '100%',\n cursor: tableConfig().colConfig[colIndex]?.action ? 'pointer' : 'default',\n 'justify-content': tableConfig().colConfig[colIndex]?.style?.justifyContent\n ? tableConfig().colConfig[colIndex]?.style?.justifyContent\n : tableConfig().colConfig[colIndex]?.type === 'number'\n ? 'flex-end'\n : 'space-between'\n }\"\n >\n <div\n *ngIf=\"tableConfig().colConfig[colIndex]?.type !== 'custom' && tableConfig().colConfig[colIndex]?.type !== 'actions'\"\n [ngStyle]=\"{\n color: tableConfig()?.colConfig[colIndex]?.style?.color || '',\n '--collapsed-lines': previewLines() || 3\n }\"\n [ngClass]=\"{\n 'collapsed-cell': collapseColIndex() == colIndex && expandedMap()[rowIndex]\n }\"\n class=\"t-col-text\"\n >\n <!-- Render as HTML -->\n <ng-container *ngIf=\"tableConfig().colConfig[colIndex]?.type === 'html'; else plainText\">\n <span [innerHTML]=\"col\"></span>\n </ng-container>\n \n <!-- Render as plain text -->\n <ng-template #plainText>\n <span>{{ col }}</span>\n </ng-template>\n </div>\n \n <ng-template\n *ngIf=\"tableConfig().colConfig[colIndex]?.type === 'custom'\"\n [customComponent]=\"tableConfig().colConfig[colIndex].componentRef\"\n [data]=\"col\"\n customTableCell\n ></ng-template>\n <mis-actions-cell\n *ngIf=\"tableConfig().colConfig[colIndex]?.type === 'actions'\"\n [cellData]=\"col\"\n [config]=\"tableConfig().colConfig[colIndex]\"\n (actionClick)=\"onActionClick($event, rowIndex)\"\n [ngClass]=\"{\n 'disable-actions': (tableConfig().colConfig[colIndex]?.actionType === 'checkbox' || tableConfig().colConfig[colIndex]?.actionType === 'row-collapse') && isRowDisabled(row)\n }\"\n ></mis-actions-cell>\n\n </div>\n </div>\n </div>\n <div *ngIf=\"tableConfig()?.canExpand && expandedIndex() === i\" class=\"sub-row\">\n <ng-container *ngIf=\"subTableDataLoading()\">\n <div [ngStyle]=\"{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n padding: '16px'\n }\">\n Loading...\n </div>\n </ng-container>\n \n <ng-container *ngIf=\"!subTableDataLoading() && subTableData().length === 0\">\n <div [ngStyle]=\"{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n padding: '16px'\n }\">\n No Data Available...\n </div>\n </ng-container>\n \n <ng-container *ngIf=\"!subTableDataLoading() && subTableData().length > 0\">\n <sub-table [config]=\"subTableconfig()\" [tableData]=\"subTableData()\"></sub-table>\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n <div\n *ngIf=\"tableConfig()?.paginationConfig && (tableLength() >= tableConfig().paginationConfig.rowsPerPage || tableConfig().paginationConfig?.selectedPage !== 1)\"\n id=\"pagination-container\"\n >\n <p id=\"pagination-text\">\n Showing\n {{ (tableConfig().paginationConfig?.selectedPage - 1) * tableConfig().paginationConfig.rowsPerPage + 1 }}-{{\n (tableConfig().paginationConfig?.selectedPage - 1) * tableConfig().paginationConfig.rowsPerPage + tableLength()\n }}\n of {{ tableConfig().paginationConfig.totalNoOfRows }} items\n </p>\n <div id=\"pages-container\">\n <span (click)=\"tableConfig().paginationConfig?.selectedPage > 1 && updateSelectedPage(tableConfig().paginationConfig?.selectedPage - 1)\" class=\"page\" [class.page-nav-inactive]=\"tableConfig().paginationConfig?.selectedPage === 1\">\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 7 10\" width=\"7\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M0.857405 5.56295C0.855794 5.56139 0.854188 5.55982 0.852588 5.55824C0.695955 5.40408 0.617641 5.20203 0.617647 4.99998C0.617641 4.79793 0.695955 4.59588 0.852588 4.44172C0.854188 4.44014 0.855794 4.43858 0.857404 4.43702L5.13066 0.231231C5.44392 -0.0770771 5.9518 -0.0770771 6.26506 0.231231C6.57831 0.53954 6.57831 1.03941 6.26506 1.34772L2.5542 4.99998L6.26506 8.65225C6.57831 8.96055 6.57831 9.46042 6.26506 9.76873C5.9518 10.077 5.44392 10.077 5.13066 9.76873L0.857405 5.56295Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n <!-- Page numbers (only show if disablePageJumping is false) -->\n <ng-container *ngIf=\"!tableConfig().paginationConfig?.disablePageJumping\">\n <div *ngFor=\"let pageNumber of pages()\">\n <span\n (click)=\"updateSelectedPage(pageNumber)\"\n *ngIf=\"pageNumber != 0\"\n [ngClass]=\"{ 'page-active': pageNumber == tableConfig().paginationConfig?.selectedPage }\"\n class=\"page page-jumping-enabled\"\n >{{ pageNumber }}</span>\n <span *ngIf=\"pageNumber == 0\" class=\"page-seperator\">\n <div [ngStyle]=\"{ display: 'flex' }\">\n <span class=\"dot\" [ngStyle]=\"{ 'margin-right': '4px' }\"></span>\n <span class=\"dot\" [ngStyle]=\"{ 'margin-right': '4px' }\"></span>\n <span class=\"dot\"></span>\n </div> \n </span>\n </div>\n </ng-container>\n \n <span [class.page-nav-inactive]=\"tableConfig().paginationConfig?.selectedPage === tableConfig().paginationConfig?.noOfPages\"\n (click)=\"tableConfig().paginationConfig?.selectedPage < tableConfig().paginationConfig?.noOfPages && updateSelectedPage(tableConfig().paginationConfig?.selectedPage + 1)\" class=\"page\">\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 7 10\" width=\"7\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M6.1426 5.56295C6.14421 5.56139 6.14581 5.55982 6.14741 5.55824C6.30405 5.40408 6.38236 5.20203 6.38236 4.99998C6.38236 4.79793 6.30405 4.59588 6.14741 4.44172C6.14581 4.44014 6.14421 4.43858 6.1426 4.43702L1.86934 0.231231C1.55608 -0.0770771 1.0482 -0.0770771 0.734942 0.231231C0.421688 0.53954 0.421688 1.03941 0.734942 1.34772L4.4458 4.99998L0.734941 8.65225C0.421686 8.96055 0.421686 9.46042 0.734941 9.76873C1.0482 10.077 1.55608 10.077 1.86934 9.76873L6.1426 5.56295Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n </div>\n </div>\n</div>\n", styles: ["#main-container{font-family:Lato,sans-serif;position:relative}.no-scrollbar::-webkit-scrollbar{width:0}.scrollbar::-webkit-scrollbar{width:8px;height:8px;border-radius:15px}.scrollbar::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:15px}#table-container{height:inherit;overflow-y:auto}#data-container{min-height:100px;background-color:#ff00001a}.row-wrapper{border:1px solid green;margin:2px 0}.scroll-horizontally{height:inherit;width:fit-content;overflow-y:unset!important;overflow-x:visible}#col-headers-container{display:flex;align-items:center;position:sticky;background-color:var(--bg-primary, #FFFFFF);width:100%;z-index:1;min-height:44px;border-bottom:1px solid var(--border-primary, #E0E0E0);top:0;left:0;right:0}.col-header{padding:0 16px;display:flex;align-items:center;height:100%}.col-header-text{font-style:normal;font-weight:700;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.sort-icon{display:flex;justify-content:center;align-items:center}.filter-icon{margin-left:8px;padding:0 8px;position:relative;cursor:pointer}#filter-active{height:8px;width:8px;background:var(--brand-accent, #10ADAE);border-radius:50%;position:absolute;top:4px;right:4px}.sub-row{height:auto;border-bottom:none}.loader ::ng-deep .mat-progress-spinner circle,.mat-spinner circle{stroke:var(--brand-primary, #0937B2)}.t-row{display:flex;min-height:44px;background-color:var(--bg-primary, #FFFFFF);width:100%;border-bottom:1px solid var(--border-primary, #E0E0E0);border:1px solid blue}.t-row:hover{background-color:var(--brand-primary-hover, #F0F3FA)}.active-row{background-color:var(--brand-primary-active, #DAE1F3)}.t-col-container{padding:0 16px;overflow-wrap:anywhere;min-width:0}.t-row-hover:hover{background-color:#0000}.t-col-container-hover:hover{background-color:var(--brand-primary-active, #DAE1F3)}.t-col-container-hover:first-child{border-left:1px solid var(--border-primary, #E0E0E0)}.t-col-container-hover{border-right:1px solid var(--border-primary, #E0E0E0)}.t-col{display:flex;align-items:center;height:100%}.t-col-text{font-style:normal;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.text-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}#pagination-container{display:flex;justify-content:flex-end;align-items:center;height:56px}#pagination-text{font-style:normal;font-weight:400;font-size:12px;line-height:18px;letter-spacing:.4px;color:var(--text-secondary, #6A737D);margin:0 56px 0 0}#pages-container{display:flex;margin-right:32px}.page{display:flex;justify-content:center;align-items:center;box-sizing:border-box;border-radius:4px;width:32px;height:32px;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-secondary, #6A737D);margin-right:8px;cursor:pointer}.page.page-jumping-enabled{border:1px solid var(--text-secondary, #6A737D)}.page-seperator{display:flex;justify-content:center;align-items:center;width:32px;height:32px;margin-right:8px}.dot{height:3px;width:3px;border-radius:50%;background:var(--text-secondary, #6A737D)}.page-active{color:var(--brand-primary, #0937B2);border:1px solid var(--brand-primary, #0937B2)}.sort-icon{display:inline-flex;align-items:center;margin-left:4px;cursor:pointer}.sort-icon img{width:16px;height:16px;transition:opacity .2s ease}.sort-icon img:hover{opacity:.8}.disabled-row .t-col-container{opacity:.4;pointer-events:none}.disabled-row .t-col-container:has(mis-actions-cell){opacity:1;pointer-events:auto}.row{transition:background-color .2s}.row:hover:not(.disabled-row),.row.selected:not(.disabled-row){background-color:var(--brand-primary-active, #DAE1F3)}.disabled-row .t-col-container{pointer-events:none;opacity:.4}.disabled-row .t-col-container:has(mis-actions-cell){pointer-events:auto!important;opacity:1!important;color:inherit!important}mis-actions-cell.disable-actions{pointer-events:none;opacity:.4;filter:grayscale(.5)}.page-nav-inactive{pointer-events:none;opacity:.5;cursor:default}.collapsed-cell{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;display:block;@supports (-webkit-line-clamp: 2){display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:var(--collapsed-lines, 2);white-space:normal!important}}\n"] }]
|
|
711
|
-
}], () => [{ type: i0.Renderer2 }], { filter: [{
|
|
727
|
+
args: [{ selector: "mis-table", template: "<div\n [ngStyle]=\"{\n height: getContainerHeight(),\n width: getContainerWidth(),\n 'overflow-x': tableConfig().canScrollHorizontally ? 'auto' : 'unset'\n }\"\n id=\"main-container\"\n>\n <mis-table-filter\n #filter\n (filtersApplied)=\"updateAppliedFilters($event)\"\n *ngIf=\"showFilter()\"\n [containerStyles]=\"filterContainerStyles()\"\n [filtersData]=\"filterData()\"\n ></mis-table-filter>\n <div\n #table\n id=\"table-container\"\n [ngClass]=\"{ 'no-scrollbar': expandedIndex() < 0, scrollbar: !(expandedIndex() < 0), 'scroll-horizontally': tableConfig().canScrollHorizontally }\"\n >\n <div\n [ngStyle]=\"getColHeadersRowStyles()\"\n id=\"col-headers-container\"\n >\n <div\n #colHeaderRef\n (click)=\"colHeader?.action ? colHeader?.action(colHeader) : null\"\n *ngFor=\"let colHeader of tableConfig()?.colHeaderConfig\"\n class=\"col-header\"\n [ngStyle]=\"{\n width: colHeader?.style?.width || '',\n cursor: colHeader.action ? 'pointer' : 'default',\n 'justify-content': colHeader?.style?.justifyContent\n ? colHeader?.style?.justifyContent\n : colHeader.type === 'number'\n ? 'flex-end'\n : 'space-between'\n }\"\n >\n <p *ngIf=\"colHeader?.type !== 'custom' && colHeader?.type !== 'checkbox'\" class=\"col-header-text\">\n {{ colHeader?.data || \" \" }} - {{tableData().length}}\n </p>\n <span\n (click)=\"filterData.set(colHeader.filters); toggleFilter(colHeader.data); $event.stopPropagation()\"\n *ngIf=\"colHeader?.type !== 'custom' && colHeader?.filters && colHeader?.filters?.length > 0\"\n class=\"filter-icon\"\n >\n <span *ngIf=\"appliedFilters()[colHeader.data]?.length > 0\" id=\"filter-active\"></span>\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 13 10\" width=\"13\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M4.97546 10H7.64213V8H4.97546V10ZM0.308472 0V2H12.3085V0H0.308472ZM2.30847 6H10.3085V4H2.30847V6Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n <span\n (click)=\"toggleCheckbox(); $event.stopPropagation()\"\n *ngIf=\"colHeader?.type === 'checkbox'\"\n class=\"checkbox-icon\"\n >\n <mis-checkbox [checked]=\"selectAllCheckbox()\"></mis-checkbox>\n </span>\n <span *ngIf=\"colHeader?.isSortable && !colHeader?.filters\" appSortIcons\n [column]=\"colHeader\"\n [activeSort]=\"currentSort()\"\n [activeSorts]=\"multiColumnSort()\"\n [multiColumnSort]=\"tableConfig().multiColumnSort\"\n (sortChange)=\"onSortChange($event)\"\n class=\"sort-icon\">\n </span>\n <ng-template *ngIf=\"colHeader?.type === 'custom'\" customTableCell [customComponent]=\"colHeader?.componentRef\" [data]=\"colHeader.data\"></ng-template>\n </div>\n </div>\n \n <div id=\"data-container\">\n <!-- TEST: Hardcoded text -->\n <div style=\"background: red; color: white; padding: 20px; margin: 10px;\">\n HARDCODED TEST - This should be visible\n </div>\n <div class=\"row-wrapper\" *ngFor=\"let row of tableData(); let i = index; let rowIndex = index\">\n text 1\n <div\n class=\"t-row\"\n [ngClass]=\"{ 't-row-hover': tableConfig().cellHover, 'active-row': activeRowIndex().includes(i) }\"\n [ngStyle]=\"{ 'min-height': tableConfig()?.rowConfig?.height ? tableConfig().rowConfig.height : '44px' }\"\n (click)=\"selectRow(i)\"\n [class.disabled-row]=\"isRowDisabled(row)\"\n >\n text 2\n <div\n (click)=\"tableConfig()?.colConfig[colIndex]?.action && tableConfig()?.colConfig[colIndex]?.actionType !== 'checkbox' ? tableConfig()?.colConfig[colIndex]?.action(col) : null\"\n *ngFor=\"let col of row; let colIndex = index\"\n [ngStyle]=\"{\n width: tableConfig()?.colConfig[colIndex]?.style?.width || tableConfig()?.colHeaderConfig[colIndex]?.style?.width || ''\n }\"\n class=\"t-col-container\"\n [ngClass]=\"{ 't-col-container-hover': tableConfig().cellHover }\"\n >\n text 3\n <div\n class=\"t-col\"\n [style]=\"tableConfig().colConfig[colIndex]?.style\"\n [ngStyle]=\"{\n width: '100%',\n cursor: tableConfig().colConfig[colIndex]?.action ? 'pointer' : 'default',\n 'justify-content': tableConfig().colConfig[colIndex]?.style?.justifyContent\n ? tableConfig().colConfig[colIndex]?.style?.justifyContent\n : tableConfig().colConfig[colIndex]?.type === 'number'\n ? 'flex-end'\n : 'space-between'\n }\"\n >\n text 4\n <div\n *ngIf=\"tableConfig().colConfig[colIndex]?.type !== 'custom' && tableConfig().colConfig[colIndex]?.type !== 'actions'\"\n [ngStyle]=\"{\n color: tableConfig()?.colConfig[colIndex]?.style?.color || '',\n '--collapsed-lines': previewLines() || 3\n }\"\n [ngClass]=\"{\n 'collapsed-cell': collapseColIndex() == colIndex && expandedMap()[rowIndex]\n }\"\n class=\"t-col-text\"\n >\n text 5\n <!-- Render as HTML -->\n <ng-container *ngIf=\"tableConfig().colConfig[colIndex]?.type === 'html'; else plainText\">\n text 6\n <span [innerHTML]=\"col\"></span>\n </ng-container>\n \n <!-- Render as plain text -->\n <ng-template #plainText>\n text 7\n <span>{{ col }}</span>\n </ng-template>\n </div>\n \n <ng-template\n *ngIf=\"tableConfig().colConfig[colIndex]?.type === 'custom'\"\n [customComponent]=\"tableConfig().colConfig[colIndex].componentRef\"\n [data]=\"col\"\n customTableCell\n ></ng-template>\n text 8\n <mis-actions-cell\n *ngIf=\"tableConfig().colConfig[colIndex]?.type === 'actions'\"\n [cellData]=\"col\"\n [config]=\"tableConfig().colConfig[colIndex]\"\n (actionClick)=\"onActionClick($event, rowIndex)\"\n [ngClass]=\"{\n 'disable-actions': (tableConfig().colConfig[colIndex]?.actionType === 'checkbox' || tableConfig().colConfig[colIndex]?.actionType === 'row-collapse') && isRowDisabled(row)\n }\"\n ></mis-actions-cell>\n\n </div>\n </div>\n </div>\n <div *ngIf=\"tableConfig()?.canExpand && expandedIndex() === i\" class=\"sub-row\">\n text 9\n <ng-container *ngIf=\"subTableDataLoading()\">\n <div [ngStyle]=\"{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n padding: '16px'\n }\">\n Loading...\n </div>\n </ng-container>\n \n <ng-container *ngIf=\"!subTableDataLoading() && subTableData().length === 0\">\n <div [ngStyle]=\"{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n padding: '16px'\n }\">\n No Data Available...\n </div>\n </ng-container>\n \n <ng-container *ngIf=\"!subTableDataLoading() && subTableData().length > 0\">\n text 10\n <sub-table [config]=\"subTableconfig()\" [tableData]=\"subTableData()\"></sub-table>\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n text 11\n <div\n *ngIf=\"tableConfig()?.paginationConfig && (tableLength() >= tableConfig().paginationConfig.rowsPerPage || tableConfig().paginationConfig?.selectedPage !== 1)\"\n id=\"pagination-container\"\n >\n text 12\n <p id=\"pagination-text\">\n Showing\n {{ (tableConfig().paginationConfig?.selectedPage - 1) * tableConfig().paginationConfig.rowsPerPage + 1 }}-{{\n (tableConfig().paginationConfig?.selectedPage - 1) * tableConfig().paginationConfig.rowsPerPage + tableLength()\n }}\n of {{ tableConfig().paginationConfig.totalNoOfRows }} items\n </p>\n text 13\n <div id=\"pages-container\">\n <span (click)=\"tableConfig().paginationConfig?.selectedPage > 1 && updateSelectedPage(tableConfig().paginationConfig?.selectedPage - 1)\" class=\"page\" [class.page-nav-inactive]=\"tableConfig().paginationConfig?.selectedPage === 1\">\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 7 10\" width=\"7\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M0.857405 5.56295C0.855794 5.56139 0.854188 5.55982 0.852588 5.55824C0.695955 5.40408 0.617641 5.20203 0.617647 4.99998C0.617641 4.79793 0.695955 4.59588 0.852588 4.44172C0.854188 4.44014 0.855794 4.43858 0.857404 4.43702L5.13066 0.231231C5.44392 -0.0770771 5.9518 -0.0770771 6.26506 0.231231C6.57831 0.53954 6.57831 1.03941 6.26506 1.34772L2.5542 4.99998L6.26506 8.65225C6.57831 8.96055 6.57831 9.46042 6.26506 9.76873C5.9518 10.077 5.44392 10.077 5.13066 9.76873L0.857405 5.56295Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n <!-- Page numbers (only show if disablePageJumping is false) -->\n <ng-container *ngIf=\"!tableConfig().paginationConfig?.disablePageJumping\">\n <div *ngFor=\"let pageNumber of pages()\">\n <span\n (click)=\"updateSelectedPage(pageNumber)\"\n *ngIf=\"pageNumber != 0\"\n [ngClass]=\"{ 'page-active': pageNumber == tableConfig().paginationConfig?.selectedPage }\"\n class=\"page page-jumping-enabled\"\n >{{ pageNumber }}</span>\n <span *ngIf=\"pageNumber == 0\" class=\"page-seperator\">\n <div [ngStyle]=\"{ display: 'flex' }\">\n <span class=\"dot\" [ngStyle]=\"{ 'margin-right': '4px' }\"></span>\n <span class=\"dot\" [ngStyle]=\"{ 'margin-right': '4px' }\"></span>\n <span class=\"dot\"></span>\n </div> \n </span>\n </div>\n </ng-container>\n \n <span [class.page-nav-inactive]=\"tableConfig().paginationConfig?.selectedPage === tableConfig().paginationConfig?.noOfPages\"\n (click)=\"tableConfig().paginationConfig?.selectedPage < tableConfig().paginationConfig?.noOfPages && updateSelectedPage(tableConfig().paginationConfig?.selectedPage + 1)\" class=\"page\">\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 7 10\" width=\"7\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M6.1426 5.56295C6.14421 5.56139 6.14581 5.55982 6.14741 5.55824C6.30405 5.40408 6.38236 5.20203 6.38236 4.99998C6.38236 4.79793 6.30405 4.59588 6.14741 4.44172C6.14581 4.44014 6.14421 4.43858 6.1426 4.43702L1.86934 0.231231C1.55608 -0.0770771 1.0482 -0.0770771 0.734942 0.231231C0.421688 0.53954 0.421688 1.03941 0.734942 1.34772L4.4458 4.99998L0.734941 8.65225C0.421686 8.96055 0.421686 9.46042 0.734941 9.76873C1.0482 10.077 1.55608 10.077 1.86934 9.76873L6.1426 5.56295Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n </div>\n </div>\n</div>\n", styles: ["#main-container{font-family:Lato,sans-serif;position:relative}.no-scrollbar::-webkit-scrollbar{width:0}.scrollbar::-webkit-scrollbar{width:8px;height:8px;border-radius:15px}.scrollbar::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:15px}#table-container{height:inherit;overflow-y:auto;background-color:#0000ff1a;border:2px solid blue}#data-container{min-height:100px;background-color:#00ff001a;border:2px solid red}.scroll-horizontally{height:inherit;width:fit-content;overflow-y:unset!important;overflow-x:visible}#col-headers-container{display:flex;align-items:center;position:sticky;background-color:var(--bg-primary, #FFFFFF);width:100%;z-index:1;min-height:44px;border-bottom:1px solid var(--border-primary, #E0E0E0);top:0;left:0;right:0}.col-header{padding:0 16px;display:flex;align-items:center;height:100%}.col-header-text{font-style:normal;font-weight:700;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.sort-icon{display:flex;justify-content:center;align-items:center}.filter-icon{margin-left:8px;padding:0 8px;position:relative;cursor:pointer}#filter-active{height:8px;width:8px;background:var(--brand-accent, #10ADAE);border-radius:50%;position:absolute;top:4px;right:4px}.sub-row{height:auto;border-bottom:none}.loader ::ng-deep .mat-progress-spinner circle,.mat-spinner circle{stroke:var(--brand-primary, #0937B2)}.t-row{display:flex;min-height:44px;background-color:var(--bg-primary, #FFFFFF);width:100%;border-bottom:1px solid var(--border-primary, #E0E0E0)}.t-row:hover{background-color:var(--brand-primary-hover, #F0F3FA)}.active-row{background-color:var(--brand-primary-active, #DAE1F3)}.t-col-container{padding:0 16px;overflow-wrap:anywhere;min-width:0}.t-row-hover:hover{background-color:#0000}.t-col-container-hover:hover{background-color:var(--brand-primary-active, #DAE1F3)}.t-col-container-hover:first-child{border-left:1px solid var(--border-primary, #E0E0E0)}.t-col-container-hover{border-right:1px solid var(--border-primary, #E0E0E0)}.t-col{display:flex;align-items:center;height:100%}.t-col-text{font-style:normal;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.text-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}#pagination-container{display:flex;justify-content:flex-end;align-items:center;height:56px}#pagination-text{font-style:normal;font-weight:400;font-size:12px;line-height:18px;letter-spacing:.4px;color:var(--text-secondary, #6A737D);margin:0 56px 0 0}#pages-container{display:flex;margin-right:32px}.page{display:flex;justify-content:center;align-items:center;box-sizing:border-box;border-radius:4px;width:32px;height:32px;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-secondary, #6A737D);margin-right:8px;cursor:pointer}.page.page-jumping-enabled{border:1px solid var(--text-secondary, #6A737D)}.page-seperator{display:flex;justify-content:center;align-items:center;width:32px;height:32px;margin-right:8px}.dot{height:3px;width:3px;border-radius:50%;background:var(--text-secondary, #6A737D)}.page-active{color:var(--brand-primary, #0937B2);border:1px solid var(--brand-primary, #0937B2)}.sort-icon{display:inline-flex;align-items:center;margin-left:4px;cursor:pointer}.sort-icon img{width:16px;height:16px;transition:opacity .2s ease}.sort-icon img:hover{opacity:.8}.disabled-row .t-col-container{opacity:.4;pointer-events:none}.disabled-row .t-col-container:has(mis-actions-cell){opacity:1;pointer-events:auto}.row{transition:background-color .2s}.row:hover:not(.disabled-row),.row.selected:not(.disabled-row){background-color:var(--brand-primary-active, #DAE1F3)}.disabled-row .t-col-container{pointer-events:none;opacity:.4}.disabled-row .t-col-container:has(mis-actions-cell){pointer-events:auto!important;opacity:1!important;color:inherit!important}mis-actions-cell.disable-actions{pointer-events:none;opacity:.4;filter:grayscale(.5)}.page-nav-inactive{pointer-events:none;opacity:.5;cursor:default}.collapsed-cell{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;display:block;@supports (-webkit-line-clamp: 2){display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:var(--collapsed-lines, 2);white-space:normal!important}}\n"] }]
|
|
728
|
+
}], () => [{ type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }], { filter: [{
|
|
712
729
|
type: ViewChild,
|
|
713
730
|
args: ["filter"]
|
|
714
731
|
}], colHeaders: [{
|