mis-crystal-design-system 18.1.7-signal-5 → 18.1.7-signal-7
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", 12, 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,25 @@ 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", 19);
|
|
42
42
|
i0.ɵɵtext(1);
|
|
43
43
|
i0.ɵɵelementEnd();
|
|
44
44
|
} if (rf & 2) {
|
|
45
45
|
const colHeader_r4 = i0.ɵɵnextContext().$implicit;
|
|
46
|
-
const ctx_r1 = i0.ɵɵnextContext();
|
|
47
46
|
i0.ɵɵadvance();
|
|
48
|
-
i0.ɵɵ
|
|
47
|
+
i0.ɵɵtextInterpolate1(" ", (colHeader_r4 == null ? null : colHeader_r4.data) || " ", " ");
|
|
49
48
|
} }
|
|
50
49
|
function TableComponent_div_5_span_3_span_1_Template(rf, ctx) { if (rf & 1) {
|
|
51
|
-
i0.ɵɵelement(0, "span",
|
|
50
|
+
i0.ɵɵelement(0, "span", 24);
|
|
52
51
|
} }
|
|
53
52
|
function TableComponent_div_5_span_3_Template(rf, ctx) { if (rf & 1) {
|
|
54
53
|
const _r5 = i0.ɵɵgetCurrentView();
|
|
55
|
-
i0.ɵɵelementStart(0, "span",
|
|
54
|
+
i0.ɵɵelementStart(0, "span", 20);
|
|
56
55
|
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",
|
|
56
|
+
i0.ɵɵtemplate(1, TableComponent_div_5_span_3_span_1_Template, 1, 0, "span", 21);
|
|
58
57
|
i0.ɵɵnamespaceSVG();
|
|
59
|
-
i0.ɵɵelementStart(2, "svg",
|
|
60
|
-
i0.ɵɵelement(3, "path",
|
|
58
|
+
i0.ɵɵelementStart(2, "svg", 22);
|
|
59
|
+
i0.ɵɵelement(3, "path", 23);
|
|
61
60
|
i0.ɵɵelementEnd()();
|
|
62
61
|
} if (rf & 2) {
|
|
63
62
|
let tmp_5_0;
|
|
@@ -68,9 +67,9 @@ function TableComponent_div_5_span_3_Template(rf, ctx) { if (rf & 1) {
|
|
|
68
67
|
} }
|
|
69
68
|
function TableComponent_div_5_span_4_Template(rf, ctx) { if (rf & 1) {
|
|
70
69
|
const _r6 = i0.ɵɵgetCurrentView();
|
|
71
|
-
i0.ɵɵelementStart(0, "span",
|
|
70
|
+
i0.ɵɵelementStart(0, "span", 25);
|
|
72
71
|
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",
|
|
72
|
+
i0.ɵɵelement(1, "mis-checkbox", 26);
|
|
74
73
|
i0.ɵɵelementEnd();
|
|
75
74
|
} if (rf & 2) {
|
|
76
75
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
@@ -79,7 +78,7 @@ function TableComponent_div_5_span_4_Template(rf, ctx) { if (rf & 1) {
|
|
|
79
78
|
} }
|
|
80
79
|
function TableComponent_div_5_span_5_Template(rf, ctx) { if (rf & 1) {
|
|
81
80
|
const _r7 = i0.ɵɵgetCurrentView();
|
|
82
|
-
i0.ɵɵelementStart(0, "span",
|
|
81
|
+
i0.ɵɵelementStart(0, "span", 27);
|
|
83
82
|
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
83
|
i0.ɵɵelementEnd();
|
|
85
84
|
} if (rf & 2) {
|
|
@@ -89,16 +88,16 @@ function TableComponent_div_5_span_5_Template(rf, ctx) { if (rf & 1) {
|
|
|
89
88
|
} }
|
|
90
89
|
function TableComponent_div_5_6_ng_template_0_Template(rf, ctx) { }
|
|
91
90
|
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",
|
|
91
|
+
i0.ɵɵtemplate(0, TableComponent_div_5_6_ng_template_0_Template, 0, 0, "ng-template", 28);
|
|
93
92
|
} if (rf & 2) {
|
|
94
93
|
const colHeader_r4 = i0.ɵɵnextContext().$implicit;
|
|
95
94
|
i0.ɵɵproperty("customComponent", colHeader_r4 == null ? null : colHeader_r4.componentRef)("data", colHeader_r4.data);
|
|
96
95
|
} }
|
|
97
96
|
function TableComponent_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
98
97
|
const _r3 = i0.ɵɵgetCurrentView();
|
|
99
|
-
i0.ɵɵelementStart(0, "div",
|
|
98
|
+
i0.ɵɵelementStart(0, "div", 13, 2);
|
|
100
99
|
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,
|
|
100
|
+
i0.ɵɵtemplate(2, TableComponent_div_5_p_2_Template, 2, 1, "p", 14)(3, TableComponent_div_5_span_3_Template, 4, 1, "span", 15)(4, TableComponent_div_5_span_4_Template, 2, 1, "span", 16)(5, TableComponent_div_5_span_5_Template, 1, 4, "span", 17)(6, TableComponent_div_5_6_Template, 1, 2, null, 18);
|
|
102
101
|
i0.ɵɵelementEnd();
|
|
103
102
|
} if (rf & 2) {
|
|
104
103
|
const colHeader_r4 = ctx.$implicit;
|
|
@@ -114,45 +113,42 @@ function TableComponent_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
|
114
113
|
i0.ɵɵadvance();
|
|
115
114
|
i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.type) === "custom");
|
|
116
115
|
} }
|
|
117
|
-
function
|
|
116
|
+
function TableComponent_div_7_div_2_div_2_ng_container_1_Template(rf, ctx) { if (rf & 1) {
|
|
118
117
|
i0.ɵɵelementContainerStart(0);
|
|
119
|
-
i0.ɵɵ
|
|
120
|
-
i0.ɵɵelement(2, "span", 40);
|
|
118
|
+
i0.ɵɵelement(1, "span", 39);
|
|
121
119
|
i0.ɵɵelementContainerEnd();
|
|
122
120
|
} if (rf & 2) {
|
|
123
121
|
const col_r12 = i0.ɵɵnextContext(2).$implicit;
|
|
124
|
-
i0.ɵɵadvance(
|
|
122
|
+
i0.ɵɵadvance();
|
|
125
123
|
i0.ɵɵproperty("innerHTML", col_r12, i0.ɵɵsanitizeHtml);
|
|
126
124
|
} }
|
|
127
|
-
function
|
|
128
|
-
i0.ɵɵ
|
|
129
|
-
i0.ɵɵ
|
|
130
|
-
i0.ɵɵtext(2);
|
|
125
|
+
function TableComponent_div_7_div_2_div_2_ng_template_2_Template(rf, ctx) { if (rf & 1) {
|
|
126
|
+
i0.ɵɵelementStart(0, "span");
|
|
127
|
+
i0.ɵɵtext(1);
|
|
131
128
|
i0.ɵɵelementEnd();
|
|
132
129
|
} if (rf & 2) {
|
|
133
130
|
const col_r12 = i0.ɵɵnextContext(2).$implicit;
|
|
134
|
-
i0.ɵɵadvance(
|
|
131
|
+
i0.ɵɵadvance();
|
|
135
132
|
i0.ɵɵtextInterpolate(col_r12);
|
|
136
133
|
} }
|
|
137
|
-
function
|
|
138
|
-
i0.ɵɵelementStart(0, "div",
|
|
139
|
-
i0.ɵɵ
|
|
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);
|
|
134
|
+
function TableComponent_div_7_div_2_div_2_Template(rf, ctx) { if (rf & 1) {
|
|
135
|
+
i0.ɵɵelementStart(0, "div", 37);
|
|
136
|
+
i0.ɵɵtemplate(1, TableComponent_div_7_div_2_div_2_ng_container_1_Template, 2, 1, "ng-container", 38)(2, TableComponent_div_7_div_2_div_2_ng_template_2_Template, 2, 1, "ng-template", null, 3, i0.ɵɵtemplateRefExtractor);
|
|
141
137
|
i0.ɵɵelementEnd();
|
|
142
138
|
} if (rf & 2) {
|
|
143
139
|
let tmp_10_0;
|
|
144
140
|
let tmp_12_0;
|
|
145
|
-
const plainText_r14 = i0.ɵɵreference(
|
|
141
|
+
const plainText_r14 = i0.ɵɵreference(3);
|
|
146
142
|
const colIndex_r13 = i0.ɵɵnextContext().index;
|
|
147
143
|
const rowIndex_r15 = i0.ɵɵnextContext().index;
|
|
148
144
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
149
145
|
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]));
|
|
150
|
-
i0.ɵɵadvance(
|
|
146
|
+
i0.ɵɵadvance();
|
|
151
147
|
i0.ɵɵproperty("ngIf", ((tmp_12_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_12_0.type) === "html")("ngIfElse", plainText_r14);
|
|
152
148
|
} }
|
|
153
|
-
function
|
|
154
|
-
function
|
|
155
|
-
i0.ɵɵtemplate(0,
|
|
149
|
+
function TableComponent_div_7_div_2_3_ng_template_0_Template(rf, ctx) { }
|
|
150
|
+
function TableComponent_div_7_div_2_3_Template(rf, ctx) { if (rf & 1) {
|
|
151
|
+
i0.ɵɵtemplate(0, TableComponent_div_7_div_2_3_ng_template_0_Template, 0, 0, "ng-template", 28);
|
|
156
152
|
} if (rf & 2) {
|
|
157
153
|
const ctx_r15 = i0.ɵɵnextContext();
|
|
158
154
|
const col_r12 = ctx_r15.$implicit;
|
|
@@ -160,10 +156,10 @@ function TableComponent_div_9_div_4_5_Template(rf, ctx) { if (rf & 1) {
|
|
|
160
156
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
161
157
|
i0.ɵɵproperty("customComponent", ctx_r1.tableConfig().colConfig[colIndex_r13].componentRef)("data", col_r12);
|
|
162
158
|
} }
|
|
163
|
-
function
|
|
159
|
+
function TableComponent_div_7_div_2_mis_actions_cell_4_Template(rf, ctx) { if (rf & 1) {
|
|
164
160
|
const _r17 = i0.ɵɵgetCurrentView();
|
|
165
|
-
i0.ɵɵelementStart(0, "mis-actions-cell",
|
|
166
|
-
i0.ɵɵlistener("actionClick", function
|
|
161
|
+
i0.ɵɵelementStart(0, "mis-actions-cell", 40);
|
|
162
|
+
i0.ɵɵlistener("actionClick", function TableComponent_div_7_div_2_mis_actions_cell_4_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)); });
|
|
167
163
|
i0.ɵɵelementEnd();
|
|
168
164
|
} if (rf & 2) {
|
|
169
165
|
let tmp_11_0;
|
|
@@ -174,16 +170,12 @@ function TableComponent_div_9_div_4_mis_actions_cell_7_Template(rf, ctx) { if (r
|
|
|
174
170
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
175
171
|
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)));
|
|
176
172
|
} }
|
|
177
|
-
function
|
|
173
|
+
function TableComponent_div_7_div_2_Template(rf, ctx) { if (rf & 1) {
|
|
178
174
|
const _r10 = i0.ɵɵgetCurrentView();
|
|
179
|
-
i0.ɵɵelementStart(0, "div",
|
|
180
|
-
i0.ɵɵlistener("click", function
|
|
181
|
-
i0.ɵɵ
|
|
182
|
-
i0.ɵɵ
|
|
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);
|
|
175
|
+
i0.ɵɵelementStart(0, "div", 33);
|
|
176
|
+
i0.ɵɵlistener("click", function TableComponent_div_7_div_2_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); });
|
|
177
|
+
i0.ɵɵelementStart(1, "div", 34);
|
|
178
|
+
i0.ɵɵtemplate(2, TableComponent_div_7_div_2_div_2_Template, 4, 9, "div", 35)(3, TableComponent_div_7_div_2_3_Template, 1, 2, null, 18)(4, TableComponent_div_7_div_2_mis_actions_cell_4_Template, 1, 5, "mis-actions-cell", 36);
|
|
187
179
|
i0.ɵɵelementEnd()();
|
|
188
180
|
} if (rf & 2) {
|
|
189
181
|
let tmp_8_0;
|
|
@@ -195,19 +187,19 @@ function TableComponent_div_9_div_4_Template(rf, ctx) { if (rf & 1) {
|
|
|
195
187
|
const colIndex_r13 = ctx.index;
|
|
196
188
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
197
189
|
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));
|
|
198
|
-
i0.ɵɵadvance(
|
|
190
|
+
i0.ɵɵadvance();
|
|
199
191
|
i0.ɵɵstyleMap((tmp_10_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_10_0.style);
|
|
200
192
|
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"));
|
|
201
|
-
i0.ɵɵadvance(
|
|
193
|
+
i0.ɵɵadvance();
|
|
202
194
|
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");
|
|
203
195
|
i0.ɵɵadvance();
|
|
204
196
|
i0.ɵɵproperty("ngIf", ((tmp_13_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_13_0.type) === "custom");
|
|
205
|
-
i0.ɵɵadvance(
|
|
197
|
+
i0.ɵɵadvance();
|
|
206
198
|
i0.ɵɵproperty("ngIf", ((tmp_14_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_14_0.type) === "actions");
|
|
207
199
|
} }
|
|
208
|
-
function
|
|
200
|
+
function TableComponent_div_7_div_3_ng_container_1_Template(rf, ctx) { if (rf & 1) {
|
|
209
201
|
i0.ɵɵelementContainerStart(0);
|
|
210
|
-
i0.ɵɵelementStart(1, "div",
|
|
202
|
+
i0.ɵɵelementStart(1, "div", 42);
|
|
211
203
|
i0.ɵɵtext(2, " Loading... ");
|
|
212
204
|
i0.ɵɵelementEnd();
|
|
213
205
|
i0.ɵɵelementContainerEnd();
|
|
@@ -215,9 +207,9 @@ function TableComponent_div_9_div_5_ng_container_2_Template(rf, ctx) { if (rf &
|
|
|
215
207
|
i0.ɵɵadvance();
|
|
216
208
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(1, _c14));
|
|
217
209
|
} }
|
|
218
|
-
function
|
|
210
|
+
function TableComponent_div_7_div_3_ng_container_2_Template(rf, ctx) { if (rf & 1) {
|
|
219
211
|
i0.ɵɵelementContainerStart(0);
|
|
220
|
-
i0.ɵɵelementStart(1, "div",
|
|
212
|
+
i0.ɵɵelementStart(1, "div", 42);
|
|
221
213
|
i0.ɵɵtext(2, " No Data Available... ");
|
|
222
214
|
i0.ɵɵelementEnd();
|
|
223
215
|
i0.ɵɵelementContainerEnd();
|
|
@@ -225,40 +217,35 @@ function TableComponent_div_9_div_5_ng_container_3_Template(rf, ctx) { if (rf &
|
|
|
225
217
|
i0.ɵɵadvance();
|
|
226
218
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(1, _c14));
|
|
227
219
|
} }
|
|
228
|
-
function
|
|
220
|
+
function TableComponent_div_7_div_3_ng_container_3_Template(rf, ctx) { if (rf & 1) {
|
|
229
221
|
i0.ɵɵelementContainerStart(0);
|
|
230
|
-
i0.ɵɵ
|
|
231
|
-
i0.ɵɵelement(2, "sub-table", 44);
|
|
222
|
+
i0.ɵɵelement(1, "sub-table", 43);
|
|
232
223
|
i0.ɵɵelementContainerEnd();
|
|
233
224
|
} if (rf & 2) {
|
|
234
225
|
const ctx_r1 = i0.ɵɵnextContext(3);
|
|
235
|
-
i0.ɵɵadvance(
|
|
226
|
+
i0.ɵɵadvance();
|
|
236
227
|
i0.ɵɵproperty("config", ctx_r1.subTableconfig())("tableData", ctx_r1.subTableData());
|
|
237
228
|
} }
|
|
238
|
-
function
|
|
239
|
-
i0.ɵɵelementStart(0, "div",
|
|
240
|
-
i0.ɵɵ
|
|
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);
|
|
229
|
+
function TableComponent_div_7_div_3_Template(rf, ctx) { if (rf & 1) {
|
|
230
|
+
i0.ɵɵelementStart(0, "div", 41);
|
|
231
|
+
i0.ɵɵtemplate(1, TableComponent_div_7_div_3_ng_container_1_Template, 3, 2, "ng-container", 18)(2, TableComponent_div_7_div_3_ng_container_2_Template, 3, 2, "ng-container", 18)(3, TableComponent_div_7_div_3_ng_container_3_Template, 2, 2, "ng-container", 18);
|
|
242
232
|
i0.ɵɵelementEnd();
|
|
243
233
|
} if (rf & 2) {
|
|
244
234
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
245
|
-
i0.ɵɵadvance(
|
|
235
|
+
i0.ɵɵadvance();
|
|
246
236
|
i0.ɵɵproperty("ngIf", ctx_r1.subTableDataLoading());
|
|
247
237
|
i0.ɵɵadvance();
|
|
248
238
|
i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading() && ctx_r1.subTableData().length === 0);
|
|
249
239
|
i0.ɵɵadvance();
|
|
250
240
|
i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading() && ctx_r1.subTableData().length > 0);
|
|
251
241
|
} }
|
|
252
|
-
function
|
|
242
|
+
function TableComponent_div_7_Template(rf, ctx) { if (rf & 1) {
|
|
253
243
|
const _r8 = i0.ɵɵgetCurrentView();
|
|
254
|
-
i0.ɵɵelementStart(0, "div", 30);
|
|
255
|
-
i0.ɵɵ
|
|
256
|
-
i0.ɵɵ
|
|
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);
|
|
244
|
+
i0.ɵɵelementStart(0, "div", 29)(1, "div", 30);
|
|
245
|
+
i0.ɵɵlistener("click", function TableComponent_div_7_Template_div_click_1_listener() { const i_r9 = i0.ɵɵrestoreView(_r8).index; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.selectRow(i_r9)); });
|
|
246
|
+
i0.ɵɵtemplate(2, TableComponent_div_7_div_2_Template, 5, 15, "div", 31);
|
|
260
247
|
i0.ɵɵelementEnd();
|
|
261
|
-
i0.ɵɵtemplate(
|
|
248
|
+
i0.ɵɵtemplate(3, TableComponent_div_7_div_3_Template, 4, 3, "div", 32);
|
|
262
249
|
i0.ɵɵelementEnd();
|
|
263
250
|
} if (rf & 2) {
|
|
264
251
|
let tmp_7_0;
|
|
@@ -266,18 +253,18 @@ function TableComponent_div_9_Template(rf, ctx) { if (rf & 1) {
|
|
|
266
253
|
const row_r18 = ctx.$implicit;
|
|
267
254
|
const i_r9 = ctx.index;
|
|
268
255
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
269
|
-
i0.ɵɵadvance(
|
|
256
|
+
i0.ɵɵadvance();
|
|
270
257
|
i0.ɵɵclassProp("disabled-row", ctx_r1.isRowDisabled(row_r18));
|
|
271
258
|
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"));
|
|
272
|
-
i0.ɵɵadvance(
|
|
259
|
+
i0.ɵɵadvance();
|
|
273
260
|
i0.ɵɵproperty("ngForOf", row_r18);
|
|
274
261
|
i0.ɵɵadvance();
|
|
275
262
|
i0.ɵɵproperty("ngIf", ((tmp_9_0 = ctx_r1.tableConfig()) == null ? null : tmp_9_0.canExpand) && ctx_r1.expandedIndex() === i_r9);
|
|
276
263
|
} }
|
|
277
|
-
function
|
|
264
|
+
function TableComponent_div_8_ng_container_7_div_1_span_1_Template(rf, ctx) { if (rf & 1) {
|
|
278
265
|
const _r20 = i0.ɵɵgetCurrentView();
|
|
279
|
-
i0.ɵɵelementStart(0, "span",
|
|
280
|
-
i0.ɵɵlistener("click", function
|
|
266
|
+
i0.ɵɵelementStart(0, "span", 54);
|
|
267
|
+
i0.ɵɵlistener("click", function TableComponent_div_8_ng_container_7_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)); });
|
|
281
268
|
i0.ɵɵtext(1);
|
|
282
269
|
i0.ɵɵelementEnd();
|
|
283
270
|
} if (rf & 2) {
|
|
@@ -288,9 +275,9 @@ function TableComponent_div_11_ng_container_9_div_1_span_1_Template(rf, ctx) { i
|
|
|
288
275
|
i0.ɵɵadvance();
|
|
289
276
|
i0.ɵɵtextInterpolate(pageNumber_r21);
|
|
290
277
|
} }
|
|
291
|
-
function
|
|
292
|
-
i0.ɵɵelementStart(0, "span",
|
|
293
|
-
i0.ɵɵelement(2, "span",
|
|
278
|
+
function TableComponent_div_8_ng_container_7_div_1_span_2_Template(rf, ctx) { if (rf & 1) {
|
|
279
|
+
i0.ɵɵelementStart(0, "span", 55)(1, "div", 42);
|
|
280
|
+
i0.ɵɵelement(2, "span", 56)(3, "span", 56)(4, "span", 57);
|
|
294
281
|
i0.ɵɵelementEnd()();
|
|
295
282
|
} if (rf & 2) {
|
|
296
283
|
i0.ɵɵadvance();
|
|
@@ -300,9 +287,9 @@ function TableComponent_div_11_ng_container_9_div_1_span_2_Template(rf, ctx) { i
|
|
|
300
287
|
i0.ɵɵadvance();
|
|
301
288
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(5, _c17));
|
|
302
289
|
} }
|
|
303
|
-
function
|
|
290
|
+
function TableComponent_div_8_ng_container_7_div_1_Template(rf, ctx) { if (rf & 1) {
|
|
304
291
|
i0.ɵɵelementStart(0, "div");
|
|
305
|
-
i0.ɵɵtemplate(1,
|
|
292
|
+
i0.ɵɵtemplate(1, TableComponent_div_8_ng_container_7_div_1_span_1_Template, 2, 4, "span", 52)(2, TableComponent_div_8_ng_container_7_div_1_span_2_Template, 5, 6, "span", 53);
|
|
306
293
|
i0.ɵɵelementEnd();
|
|
307
294
|
} if (rf & 2) {
|
|
308
295
|
const pageNumber_r21 = ctx.$implicit;
|
|
@@ -311,36 +298,33 @@ function TableComponent_div_11_ng_container_9_div_1_Template(rf, ctx) { if (rf &
|
|
|
311
298
|
i0.ɵɵadvance();
|
|
312
299
|
i0.ɵɵproperty("ngIf", pageNumber_r21 == 0);
|
|
313
300
|
} }
|
|
314
|
-
function
|
|
301
|
+
function TableComponent_div_8_ng_container_7_Template(rf, ctx) { if (rf & 1) {
|
|
315
302
|
i0.ɵɵelementContainerStart(0);
|
|
316
|
-
i0.ɵɵtemplate(1,
|
|
303
|
+
i0.ɵɵtemplate(1, TableComponent_div_8_ng_container_7_div_1_Template, 3, 2, "div", 51);
|
|
317
304
|
i0.ɵɵelementContainerEnd();
|
|
318
305
|
} if (rf & 2) {
|
|
319
306
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
320
307
|
i0.ɵɵadvance();
|
|
321
308
|
i0.ɵɵproperty("ngForOf", ctx_r1.pages());
|
|
322
309
|
} }
|
|
323
|
-
function
|
|
310
|
+
function TableComponent_div_8_Template(rf, ctx) { if (rf & 1) {
|
|
324
311
|
const _r19 = i0.ɵɵgetCurrentView();
|
|
325
|
-
i0.ɵɵelementStart(0, "div", 45);
|
|
326
|
-
i0.ɵɵtext(
|
|
327
|
-
i0.ɵɵelementStart(2, "p", 46);
|
|
328
|
-
i0.ɵɵtext(3);
|
|
312
|
+
i0.ɵɵelementStart(0, "div", 44)(1, "p", 45);
|
|
313
|
+
i0.ɵɵtext(2);
|
|
329
314
|
i0.ɵɵelementEnd();
|
|
330
|
-
i0.ɵɵ
|
|
331
|
-
i0.ɵɵ
|
|
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)); });
|
|
315
|
+
i0.ɵɵelementStart(3, "div", 46)(4, "span", 47);
|
|
316
|
+
i0.ɵɵlistener("click", function TableComponent_div_8_Template_span_click_4_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)); });
|
|
333
317
|
i0.ɵɵnamespaceSVG();
|
|
334
|
-
i0.ɵɵelementStart(
|
|
335
|
-
i0.ɵɵelement(
|
|
318
|
+
i0.ɵɵelementStart(5, "svg", 48);
|
|
319
|
+
i0.ɵɵelement(6, "path", 49);
|
|
336
320
|
i0.ɵɵelementEnd()();
|
|
337
|
-
i0.ɵɵtemplate(
|
|
321
|
+
i0.ɵɵtemplate(7, TableComponent_div_8_ng_container_7_Template, 2, 1, "ng-container", 18);
|
|
338
322
|
i0.ɵɵnamespaceHTML();
|
|
339
|
-
i0.ɵɵelementStart(
|
|
340
|
-
i0.ɵɵlistener("click", function
|
|
323
|
+
i0.ɵɵelementStart(8, "span", 47);
|
|
324
|
+
i0.ɵɵlistener("click", function TableComponent_div_8_Template_span_click_8_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)); });
|
|
341
325
|
i0.ɵɵnamespaceSVG();
|
|
342
|
-
i0.ɵɵelementStart(
|
|
343
|
-
i0.ɵɵelement(
|
|
326
|
+
i0.ɵɵelementStart(9, "svg", 48);
|
|
327
|
+
i0.ɵɵelement(10, "path", 50);
|
|
344
328
|
i0.ɵɵelementEnd()()()();
|
|
345
329
|
} if (rf & 2) {
|
|
346
330
|
let tmp_2_0;
|
|
@@ -348,9 +332,9 @@ function TableComponent_div_11_Template(rf, ctx) { if (rf & 1) {
|
|
|
348
332
|
let tmp_4_0;
|
|
349
333
|
let tmp_5_0;
|
|
350
334
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
351
|
-
i0.ɵɵadvance(
|
|
335
|
+
i0.ɵɵadvance(2);
|
|
352
336
|
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 ");
|
|
353
|
-
i0.ɵɵadvance(
|
|
337
|
+
i0.ɵɵadvance(2);
|
|
354
338
|
i0.ɵɵclassProp("page-nav-inactive", ((tmp_3_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_3_0.selectedPage) === 1);
|
|
355
339
|
i0.ɵɵadvance(3);
|
|
356
340
|
i0.ɵɵproperty("ngIf", !((tmp_4_0 = ctx_r1.tableConfig().paginationConfig) == null ? null : tmp_4_0.disablePageJumping));
|
|
@@ -358,9 +342,8 @@ function TableComponent_div_11_Template(rf, ctx) { if (rf & 1) {
|
|
|
358
342
|
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));
|
|
359
343
|
} }
|
|
360
344
|
class TableComponent {
|
|
361
|
-
constructor(renderer
|
|
345
|
+
constructor(renderer) {
|
|
362
346
|
this.renderer = renderer;
|
|
363
|
-
this.cdr = cdr;
|
|
364
347
|
// Initialize with -1 to indicate no row is colored at the beginning
|
|
365
348
|
this.activeRowIndex = signal([]);
|
|
366
349
|
this.hasCheckboxActions = signal(false);
|
|
@@ -405,7 +388,7 @@ class TableComponent {
|
|
|
405
388
|
this.buildExpandedMap();
|
|
406
389
|
}
|
|
407
390
|
// Trigger change detection when input signals change
|
|
408
|
-
this.cdr.markForCheck();
|
|
391
|
+
// this.cdr.markForCheck();
|
|
409
392
|
}, { allowSignalWrites: true });
|
|
410
393
|
}
|
|
411
394
|
// Function to handle row click
|
|
@@ -457,8 +440,16 @@ class TableComponent {
|
|
|
457
440
|
}
|
|
458
441
|
ngAfterViewInit() {
|
|
459
442
|
if (this.tableConfig().paginationConfig) {
|
|
460
|
-
let height =
|
|
461
|
-
|
|
443
|
+
let height = this.tableConfig().height;
|
|
444
|
+
// Handle percentage values - don't subtract 56px for percentages
|
|
445
|
+
if (typeof height === 'string' && height.includes('%')) {
|
|
446
|
+
this.renderer.setStyle(this.table.nativeElement, "height", height);
|
|
447
|
+
}
|
|
448
|
+
else {
|
|
449
|
+
// Handle pixel values - subtract 56px for pagination
|
|
450
|
+
let pixelHeight = parseInt(height.toString().replace('px', '')) || 0;
|
|
451
|
+
this.renderer.setStyle(this.table.nativeElement, "height", pixelHeight - 56 + "px");
|
|
452
|
+
}
|
|
462
453
|
}
|
|
463
454
|
}
|
|
464
455
|
ngOnChanges() {
|
|
@@ -680,7 +671,7 @@ class TableComponent {
|
|
|
680
671
|
});
|
|
681
672
|
}
|
|
682
673
|
}
|
|
683
|
-
static { this.ɵfac = function TableComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TableComponent)(i0.ɵɵdirectiveInject(i0.Renderer2)
|
|
674
|
+
static { this.ɵfac = function TableComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TableComponent)(i0.ɵɵdirectiveInject(i0.Renderer2)); }; }
|
|
684
675
|
static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TableComponent, selectors: [["mis-table"]], viewQuery: function TableComponent_Query(rf, ctx) { if (rf & 1) {
|
|
685
676
|
i0.ɵɵviewQuery(_c0$3, 5);
|
|
686
677
|
i0.ɵɵviewQuery(_c1$3, 5);
|
|
@@ -690,19 +681,16 @@ class TableComponent {
|
|
|
690
681
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.filter = _t.first);
|
|
691
682
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.table = _t.first);
|
|
692
683
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.colHeaders = _t);
|
|
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:
|
|
684
|
+
} }, 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: 9, 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"], ["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) {
|
|
694
685
|
i0.ɵɵelementStart(0, "div", 4);
|
|
695
686
|
i0.ɵɵtemplate(1, TableComponent_mis_table_filter_1_Template, 2, 2, "mis-table-filter", 5);
|
|
696
687
|
i0.ɵɵelementStart(2, "div", 6, 0)(4, "div", 7);
|
|
697
688
|
i0.ɵɵtemplate(5, TableComponent_div_5_Template, 7, 10, "div", 8);
|
|
698
689
|
i0.ɵɵelementEnd();
|
|
699
|
-
i0.ɵɵelementStart(6, "div", 9)
|
|
700
|
-
i0.ɵɵ
|
|
701
|
-
i0.ɵɵelementEnd();
|
|
702
|
-
i0.ɵɵtemplate(9, TableComponent_div_9_Template, 6, 11, "div", 11);
|
|
690
|
+
i0.ɵɵelementStart(6, "div", 9);
|
|
691
|
+
i0.ɵɵtemplate(7, TableComponent_div_7_Template, 4, 11, "div", 10);
|
|
703
692
|
i0.ɵɵelementEnd()();
|
|
704
|
-
i0.ɵɵ
|
|
705
|
-
i0.ɵɵtemplate(11, TableComponent_div_11_Template, 13, 8, "div", 12);
|
|
693
|
+
i0.ɵɵtemplate(8, TableComponent_div_8_Template, 11, 8, "div", 11);
|
|
706
694
|
i0.ɵɵelementEnd();
|
|
707
695
|
} if (rf & 2) {
|
|
708
696
|
let tmp_5_0;
|
|
@@ -716,16 +704,16 @@ class TableComponent {
|
|
|
716
704
|
i0.ɵɵproperty("ngStyle", ctx.getColHeadersRowStyles());
|
|
717
705
|
i0.ɵɵadvance();
|
|
718
706
|
i0.ɵɵproperty("ngForOf", (tmp_5_0 = ctx.tableConfig()) == null ? null : tmp_5_0.colHeaderConfig);
|
|
719
|
-
i0.ɵɵadvance(4);
|
|
720
|
-
i0.ɵɵproperty("ngForOf", ctx.tableData());
|
|
721
707
|
i0.ɵɵadvance(2);
|
|
708
|
+
i0.ɵɵproperty("ngForOf", ctx.tableData());
|
|
709
|
+
i0.ɵɵadvance();
|
|
722
710
|
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
711
|
} }, 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}}"] }); }
|
|
724
712
|
}
|
|
725
713
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TableComponent, [{
|
|
726
714
|
type: Component,
|
|
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 }
|
|
715
|
+
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 || \" \" }}\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;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"] }]
|
|
716
|
+
}], () => [{ type: i0.Renderer2 }], { filter: [{
|
|
729
717
|
type: ViewChild,
|
|
730
718
|
args: ["filter"]
|
|
731
719
|
}], colHeaders: [{
|