mis-crystal-design-system 18.1.7-signal-4 → 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.
|
@@ -30,7 +30,7 @@ const _c16 = () => ({ display: "flex" });
|
|
|
30
30
|
const _c17 = () => ({ "margin-right": "4px" });
|
|
31
31
|
function TableComponent_mis_table_filter_1_Template(rf, ctx) { if (rf & 1) {
|
|
32
32
|
const _r1 = i0.ɵɵgetCurrentView();
|
|
33
|
-
i0.ɵɵelementStart(0, "mis-table-filter",
|
|
33
|
+
i0.ɵɵelementStart(0, "mis-table-filter", 13, 1);
|
|
34
34
|
i0.ɵɵlistener("filtersApplied", function TableComponent_mis_table_filter_1_Template_mis_table_filter_filtersApplied_0_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.updateAppliedFilters($event)); });
|
|
35
35
|
i0.ɵɵelementEnd();
|
|
36
36
|
} if (rf & 2) {
|
|
@@ -38,26 +38,26 @@ function TableComponent_mis_table_filter_1_Template(rf, ctx) { if (rf & 1) {
|
|
|
38
38
|
i0.ɵɵproperty("containerStyles", ctx_r1.filterContainerStyles())("filtersData", ctx_r1.filterData());
|
|
39
39
|
} }
|
|
40
40
|
function TableComponent_div_5_p_2_Template(rf, ctx) { if (rf & 1) {
|
|
41
|
-
i0.ɵɵelementStart(0, "p",
|
|
41
|
+
i0.ɵɵelementStart(0, "p", 20);
|
|
42
42
|
i0.ɵɵtext(1);
|
|
43
43
|
i0.ɵɵelementEnd();
|
|
44
44
|
} if (rf & 2) {
|
|
45
45
|
const colHeader_r4 = i0.ɵɵnextContext().$implicit;
|
|
46
46
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
47
47
|
i0.ɵɵadvance();
|
|
48
|
-
i0.ɵɵtextInterpolate2(" ", (colHeader_r4 == null ? null : colHeader_r4.data) || " ", " -
|
|
48
|
+
i0.ɵɵtextInterpolate2(" ", (colHeader_r4 == null ? null : colHeader_r4.data) || " ", " - ", ctx_r1.tableData().length, " ");
|
|
49
49
|
} }
|
|
50
50
|
function TableComponent_div_5_span_3_span_1_Template(rf, ctx) { if (rf & 1) {
|
|
51
|
-
i0.ɵɵelement(0, "span",
|
|
51
|
+
i0.ɵɵelement(0, "span", 25);
|
|
52
52
|
} }
|
|
53
53
|
function TableComponent_div_5_span_3_Template(rf, ctx) { if (rf & 1) {
|
|
54
54
|
const _r5 = i0.ɵɵgetCurrentView();
|
|
55
|
-
i0.ɵɵelementStart(0, "span",
|
|
55
|
+
i0.ɵɵelementStart(0, "span", 21);
|
|
56
56
|
i0.ɵɵlistener("click", function TableComponent_div_5_span_3_Template_span_click_0_listener($event) { i0.ɵɵrestoreView(_r5); const colHeader_r4 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(); ctx_r1.filterData.set(colHeader_r4.filters); ctx_r1.toggleFilter(colHeader_r4.data); return i0.ɵɵresetView($event.stopPropagation()); });
|
|
57
|
-
i0.ɵɵtemplate(1, TableComponent_div_5_span_3_span_1_Template, 1, 0, "span",
|
|
57
|
+
i0.ɵɵtemplate(1, TableComponent_div_5_span_3_span_1_Template, 1, 0, "span", 22);
|
|
58
58
|
i0.ɵɵnamespaceSVG();
|
|
59
|
-
i0.ɵɵelementStart(2, "svg",
|
|
60
|
-
i0.ɵɵelement(3, "path",
|
|
59
|
+
i0.ɵɵelementStart(2, "svg", 23);
|
|
60
|
+
i0.ɵɵelement(3, "path", 24);
|
|
61
61
|
i0.ɵɵelementEnd()();
|
|
62
62
|
} if (rf & 2) {
|
|
63
63
|
let tmp_5_0;
|
|
@@ -68,9 +68,9 @@ function TableComponent_div_5_span_3_Template(rf, ctx) { if (rf & 1) {
|
|
|
68
68
|
} }
|
|
69
69
|
function TableComponent_div_5_span_4_Template(rf, ctx) { if (rf & 1) {
|
|
70
70
|
const _r6 = i0.ɵɵgetCurrentView();
|
|
71
|
-
i0.ɵɵelementStart(0, "span",
|
|
71
|
+
i0.ɵɵelementStart(0, "span", 26);
|
|
72
72
|
i0.ɵɵlistener("click", function TableComponent_div_5_span_4_Template_span_click_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(2); ctx_r1.toggleCheckbox(); return i0.ɵɵresetView($event.stopPropagation()); });
|
|
73
|
-
i0.ɵɵelement(1, "mis-checkbox",
|
|
73
|
+
i0.ɵɵelement(1, "mis-checkbox", 27);
|
|
74
74
|
i0.ɵɵelementEnd();
|
|
75
75
|
} if (rf & 2) {
|
|
76
76
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
@@ -79,7 +79,7 @@ function TableComponent_div_5_span_4_Template(rf, ctx) { if (rf & 1) {
|
|
|
79
79
|
} }
|
|
80
80
|
function TableComponent_div_5_span_5_Template(rf, ctx) { if (rf & 1) {
|
|
81
81
|
const _r7 = i0.ɵɵgetCurrentView();
|
|
82
|
-
i0.ɵɵelementStart(0, "span",
|
|
82
|
+
i0.ɵɵelementStart(0, "span", 28);
|
|
83
83
|
i0.ɵɵlistener("sortChange", function TableComponent_div_5_span_5_Template_span_sortChange_0_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onSortChange($event)); });
|
|
84
84
|
i0.ɵɵelementEnd();
|
|
85
85
|
} if (rf & 2) {
|
|
@@ -89,16 +89,16 @@ function TableComponent_div_5_span_5_Template(rf, ctx) { if (rf & 1) {
|
|
|
89
89
|
} }
|
|
90
90
|
function TableComponent_div_5_6_ng_template_0_Template(rf, ctx) { }
|
|
91
91
|
function TableComponent_div_5_6_Template(rf, ctx) { if (rf & 1) {
|
|
92
|
-
i0.ɵɵtemplate(0, TableComponent_div_5_6_ng_template_0_Template, 0, 0, "ng-template",
|
|
92
|
+
i0.ɵɵtemplate(0, TableComponent_div_5_6_ng_template_0_Template, 0, 0, "ng-template", 29);
|
|
93
93
|
} if (rf & 2) {
|
|
94
94
|
const colHeader_r4 = i0.ɵɵnextContext().$implicit;
|
|
95
95
|
i0.ɵɵproperty("customComponent", colHeader_r4 == null ? null : colHeader_r4.componentRef)("data", colHeader_r4.data);
|
|
96
96
|
} }
|
|
97
97
|
function TableComponent_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
98
98
|
const _r3 = i0.ɵɵgetCurrentView();
|
|
99
|
-
i0.ɵɵelementStart(0, "div",
|
|
99
|
+
i0.ɵɵelementStart(0, "div", 14, 2);
|
|
100
100
|
i0.ɵɵlistener("click", function TableComponent_div_5_Template_div_click_0_listener() { const colHeader_r4 = i0.ɵɵrestoreView(_r3).$implicit; return i0.ɵɵresetView((colHeader_r4 == null ? null : colHeader_r4.action) ? colHeader_r4 == null ? null : colHeader_r4.action(colHeader_r4) : null); });
|
|
101
|
-
i0.ɵɵtemplate(2, TableComponent_div_5_p_2_Template, 2, 2, "p",
|
|
101
|
+
i0.ɵɵtemplate(2, TableComponent_div_5_p_2_Template, 2, 2, "p", 15)(3, TableComponent_div_5_span_3_Template, 4, 1, "span", 16)(4, TableComponent_div_5_span_4_Template, 2, 1, "span", 17)(5, TableComponent_div_5_span_5_Template, 1, 4, "span", 18)(6, TableComponent_div_5_6_Template, 1, 2, null, 19);
|
|
102
102
|
i0.ɵɵelementEnd();
|
|
103
103
|
} if (rf & 2) {
|
|
104
104
|
const colHeader_r4 = ctx.$implicit;
|
|
@@ -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
|
|
136
|
-
i0.ɵɵelementStart(0, "div",
|
|
137
|
-
i0.ɵɵ
|
|
137
|
+
function TableComponent_div_9_div_4_div_4_Template(rf, ctx) { if (rf & 1) {
|
|
138
|
+
i0.ɵɵelementStart(0, "div", 38);
|
|
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_7_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
|
-
i0.ɵɵelementStart(0, "mis-actions-cell",
|
|
163
|
-
i0.ɵɵlistener("actionClick", function
|
|
165
|
+
i0.ɵɵelementStart(0, "mis-actions-cell", 41);
|
|
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_7_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
|
-
i0.ɵɵelementStart(0, "div",
|
|
177
|
-
i0.ɵɵlistener("click", function
|
|
178
|
-
i0.ɵɵ
|
|
179
|
-
i0.ɵɵ
|
|
179
|
+
i0.ɵɵelementStart(0, "div", 34);
|
|
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,19 +195,19 @@ function TableComponent_div_7_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
|
-
i0.ɵɵelementStart(1, "div",
|
|
210
|
+
i0.ɵɵelementStart(1, "div", 43);
|
|
204
211
|
i0.ɵɵtext(2, " Loading... ");
|
|
205
212
|
i0.ɵɵelementEnd();
|
|
206
213
|
i0.ɵɵelementContainerEnd();
|
|
@@ -208,9 +215,9 @@ function TableComponent_div_7_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
|
-
i0.ɵɵelementStart(1, "div",
|
|
220
|
+
i0.ɵɵelementStart(1, "div", 43);
|
|
214
221
|
i0.ɵɵtext(2, " No Data Available... ");
|
|
215
222
|
i0.ɵɵelementEnd();
|
|
216
223
|
i0.ɵɵelementContainerEnd();
|
|
@@ -218,35 +225,40 @@ function TableComponent_div_7_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
|
|
231
|
-
i0.ɵɵelementStart(0, "div",
|
|
232
|
-
i0.ɵɵ
|
|
238
|
+
function TableComponent_div_9_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
239
|
+
i0.ɵɵelementStart(0, "div", 42);
|
|
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);
|
|
240
249
|
i0.ɵɵadvance();
|
|
241
250
|
i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading() && ctx_r1.subTableData().length > 0);
|
|
242
251
|
} }
|
|
243
|
-
function
|
|
252
|
+
function TableComponent_div_9_Template(rf, ctx) { if (rf & 1) {
|
|
244
253
|
const _r8 = i0.ɵɵgetCurrentView();
|
|
245
|
-
i0.ɵɵelementStart(0, "div",
|
|
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_7_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
|
-
i0.ɵɵelementStart(0, "span",
|
|
268
|
-
i0.ɵɵlistener("click", function
|
|
279
|
+
i0.ɵɵelementStart(0, "span", 55);
|
|
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,9 +288,9 @@ function TableComponent_div_8_ng_container_7_div_1_span_1_Template(rf, ctx) { if
|
|
|
276
288
|
i0.ɵɵadvance();
|
|
277
289
|
i0.ɵɵtextInterpolate(pageNumber_r21);
|
|
278
290
|
} }
|
|
279
|
-
function
|
|
280
|
-
i0.ɵɵelementStart(0, "span",
|
|
281
|
-
i0.ɵɵelement(2, "span",
|
|
291
|
+
function TableComponent_div_11_ng_container_9_div_1_span_2_Template(rf, ctx) { if (rf & 1) {
|
|
292
|
+
i0.ɵɵelementStart(0, "span", 56)(1, "div", 43);
|
|
293
|
+
i0.ɵɵelement(2, "span", 57)(3, "span", 57)(4, "span", 58);
|
|
282
294
|
i0.ɵɵelementEnd()();
|
|
283
295
|
} if (rf & 2) {
|
|
284
296
|
i0.ɵɵadvance();
|
|
@@ -288,9 +300,9 @@ function TableComponent_div_8_ng_container_7_div_1_span_2_Template(rf, ctx) { if
|
|
|
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_8_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",
|
|
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_8_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));
|
|
@@ -675,16 +690,19 @@ class TableComponent {
|
|
|
675
690
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.filter = _t.first);
|
|
676
691
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.table = _t.first);
|
|
677
692
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.colHeaders = _t);
|
|
678
|
-
} }, 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) {
|
|
679
694
|
i0.ɵɵelementStart(0, "div", 4);
|
|
680
695
|
i0.ɵɵtemplate(1, TableComponent_mis_table_filter_1_Template, 2, 2, "mis-table-filter", 5);
|
|
681
696
|
i0.ɵɵelementStart(2, "div", 6, 0)(4, "div", 7);
|
|
682
697
|
i0.ɵɵtemplate(5, TableComponent_div_5_Template, 7, 10, "div", 8);
|
|
683
698
|
i0.ɵɵelementEnd();
|
|
684
|
-
i0.ɵɵelementStart(6, "div", 9);
|
|
685
|
-
i0.ɵɵ
|
|
699
|
+
i0.ɵɵelementStart(6, "div", 9)(7, "div", 10);
|
|
700
|
+
i0.ɵɵtext(8, " HARDCODED TEST - This should be visible ");
|
|
701
|
+
i0.ɵɵelementEnd();
|
|
702
|
+
i0.ɵɵtemplate(9, TableComponent_div_9_Template, 6, 11, "div", 11);
|
|
686
703
|
i0.ɵɵelementEnd()();
|
|
687
|
-
i0.ɵɵ
|
|
704
|
+
i0.ɵɵtext(10, " text 11 ");
|
|
705
|
+
i0.ɵɵtemplate(11, TableComponent_div_11_Template, 13, 8, "div", 12);
|
|
688
706
|
i0.ɵɵelementEnd();
|
|
689
707
|
} if (rf & 2) {
|
|
690
708
|
let tmp_5_0;
|
|
@@ -698,15 +716,15 @@ class TableComponent {
|
|
|
698
716
|
i0.ɵɵproperty("ngStyle", ctx.getColHeadersRowStyles());
|
|
699
717
|
i0.ɵɵadvance();
|
|
700
718
|
i0.ɵɵproperty("ngForOf", (tmp_5_0 = ctx.tableConfig()) == null ? null : tmp_5_0.colHeaderConfig);
|
|
701
|
-
i0.ɵɵadvance(
|
|
719
|
+
i0.ɵɵadvance(4);
|
|
702
720
|
i0.ɵɵproperty("ngForOf", ctx.tableData());
|
|
703
|
-
i0.ɵɵadvance();
|
|
721
|
+
i0.ɵɵadvance(2);
|
|
704
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));
|
|
705
|
-
} }, 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}.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}}"] }); }
|
|
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}}"] }); }
|
|
706
724
|
}
|
|
707
725
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TableComponent, [{
|
|
708
726
|
type: Component,
|
|
709
|
-
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 || \" \" }} - 67 - {{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 <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}.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"] }]
|
|
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"] }]
|
|
710
728
|
}], () => [{ type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }], { filter: [{
|
|
711
729
|
type: ViewChild,
|
|
712
730
|
args: ["filter"]
|