mis-crystal-design-system 18.1.7-signal-1 → 18.1.7-signal-3
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.
- package/esm2022/slider/slider.component.mjs +2 -2
- package/esm2022/table/table.component.mjs +104 -98
- package/fesm2022/mis-crystal-design-system-slider.mjs +2 -2
- package/fesm2022/mis-crystal-design-system-slider.mjs.map +1 -1
- package/fesm2022/mis-crystal-design-system-table.mjs +103 -97
- package/fesm2022/mis-crystal-design-system-table.mjs.map +1 -1
- package/package.json +12 -12
|
@@ -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,37 +38,39 @@ 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
|
+
const ctx_r1 = i0.ɵɵnextContext();
|
|
46
47
|
i0.ɵɵadvance();
|
|
47
|
-
i0.ɵɵ
|
|
48
|
+
i0.ɵɵtextInterpolate2(" ", (colHeader_r4 == null ? null : colHeader_r4.data) || " ", " - ", ctx_r1.tableData().length, " ");
|
|
48
49
|
} }
|
|
49
50
|
function TableComponent_div_5_span_3_span_1_Template(rf, ctx) { if (rf & 1) {
|
|
50
|
-
i0.ɵɵelement(0, "span",
|
|
51
|
+
i0.ɵɵelement(0, "span", 25);
|
|
51
52
|
} }
|
|
52
53
|
function TableComponent_div_5_span_3_Template(rf, ctx) { if (rf & 1) {
|
|
53
54
|
const _r5 = i0.ɵɵgetCurrentView();
|
|
54
|
-
i0.ɵɵelementStart(0, "span",
|
|
55
|
+
i0.ɵɵelementStart(0, "span", 21);
|
|
55
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()); });
|
|
56
|
-
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);
|
|
57
58
|
i0.ɵɵnamespaceSVG();
|
|
58
|
-
i0.ɵɵelementStart(2, "svg",
|
|
59
|
-
i0.ɵɵelement(3, "path",
|
|
59
|
+
i0.ɵɵelementStart(2, "svg", 23);
|
|
60
|
+
i0.ɵɵelement(3, "path", 24);
|
|
60
61
|
i0.ɵɵelementEnd()();
|
|
61
62
|
} if (rf & 2) {
|
|
63
|
+
let tmp_5_0;
|
|
62
64
|
const colHeader_r4 = i0.ɵɵnextContext().$implicit;
|
|
63
65
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
64
66
|
i0.ɵɵadvance();
|
|
65
|
-
i0.ɵɵproperty("ngIf", (ctx_r1.appliedFilters[colHeader_r4.data] == null ? null :
|
|
67
|
+
i0.ɵɵproperty("ngIf", ((tmp_5_0 = ctx_r1.appliedFilters()[colHeader_r4.data]) == null ? null : tmp_5_0.length) > 0);
|
|
66
68
|
} }
|
|
67
69
|
function TableComponent_div_5_span_4_Template(rf, ctx) { if (rf & 1) {
|
|
68
70
|
const _r6 = i0.ɵɵgetCurrentView();
|
|
69
|
-
i0.ɵɵelementStart(0, "span",
|
|
71
|
+
i0.ɵɵelementStart(0, "span", 26);
|
|
70
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()); });
|
|
71
|
-
i0.ɵɵelement(1, "mis-checkbox",
|
|
73
|
+
i0.ɵɵelement(1, "mis-checkbox", 27);
|
|
72
74
|
i0.ɵɵelementEnd();
|
|
73
75
|
} if (rf & 2) {
|
|
74
76
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
@@ -77,7 +79,7 @@ function TableComponent_div_5_span_4_Template(rf, ctx) { if (rf & 1) {
|
|
|
77
79
|
} }
|
|
78
80
|
function TableComponent_div_5_span_5_Template(rf, ctx) { if (rf & 1) {
|
|
79
81
|
const _r7 = i0.ɵɵgetCurrentView();
|
|
80
|
-
i0.ɵɵelementStart(0, "span",
|
|
82
|
+
i0.ɵɵelementStart(0, "span", 28);
|
|
81
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)); });
|
|
82
84
|
i0.ɵɵelementEnd();
|
|
83
85
|
} if (rf & 2) {
|
|
@@ -87,16 +89,16 @@ function TableComponent_div_5_span_5_Template(rf, ctx) { if (rf & 1) {
|
|
|
87
89
|
} }
|
|
88
90
|
function TableComponent_div_5_6_ng_template_0_Template(rf, ctx) { }
|
|
89
91
|
function TableComponent_div_5_6_Template(rf, ctx) { if (rf & 1) {
|
|
90
|
-
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);
|
|
91
93
|
} if (rf & 2) {
|
|
92
94
|
const colHeader_r4 = i0.ɵɵnextContext().$implicit;
|
|
93
95
|
i0.ɵɵproperty("customComponent", colHeader_r4 == null ? null : colHeader_r4.componentRef)("data", colHeader_r4.data);
|
|
94
96
|
} }
|
|
95
97
|
function TableComponent_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
96
98
|
const _r3 = i0.ɵɵgetCurrentView();
|
|
97
|
-
i0.ɵɵelementStart(0, "div",
|
|
99
|
+
i0.ɵɵelementStart(0, "div", 14, 2);
|
|
98
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); });
|
|
99
|
-
i0.ɵɵtemplate(2, TableComponent_div_5_p_2_Template, 2,
|
|
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);
|
|
100
102
|
i0.ɵɵelementEnd();
|
|
101
103
|
} if (rf & 2) {
|
|
102
104
|
const colHeader_r4 = ctx.$implicit;
|
|
@@ -112,16 +114,16 @@ function TableComponent_div_5_Template(rf, ctx) { if (rf & 1) {
|
|
|
112
114
|
i0.ɵɵadvance();
|
|
113
115
|
i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.type) === "custom");
|
|
114
116
|
} }
|
|
115
|
-
function
|
|
117
|
+
function TableComponent_div_9_div_2_div_2_ng_container_1_Template(rf, ctx) { if (rf & 1) {
|
|
116
118
|
i0.ɵɵelementContainerStart(0);
|
|
117
|
-
i0.ɵɵelement(1, "span",
|
|
119
|
+
i0.ɵɵelement(1, "span", 40);
|
|
118
120
|
i0.ɵɵelementContainerEnd();
|
|
119
121
|
} if (rf & 2) {
|
|
120
122
|
const col_r12 = i0.ɵɵnextContext(2).$implicit;
|
|
121
123
|
i0.ɵɵadvance();
|
|
122
124
|
i0.ɵɵproperty("innerHTML", col_r12, i0.ɵɵsanitizeHtml);
|
|
123
125
|
} }
|
|
124
|
-
function
|
|
126
|
+
function TableComponent_div_9_div_2_div_2_ng_template_2_Template(rf, ctx) { if (rf & 1) {
|
|
125
127
|
i0.ɵɵelementStart(0, "span");
|
|
126
128
|
i0.ɵɵtext(1);
|
|
127
129
|
i0.ɵɵelementEnd();
|
|
@@ -130,51 +132,51 @@ function TableComponent_div_7_div_2_div_2_ng_template_2_Template(rf, ctx) { if (
|
|
|
130
132
|
i0.ɵɵadvance();
|
|
131
133
|
i0.ɵɵtextInterpolate(col_r12);
|
|
132
134
|
} }
|
|
133
|
-
function
|
|
134
|
-
i0.ɵɵelementStart(0, "div",
|
|
135
|
-
i0.ɵɵtemplate(1,
|
|
135
|
+
function TableComponent_div_9_div_2_div_2_Template(rf, ctx) { if (rf & 1) {
|
|
136
|
+
i0.ɵɵelementStart(0, "div", 38);
|
|
137
|
+
i0.ɵɵtemplate(1, TableComponent_div_9_div_2_div_2_ng_container_1_Template, 2, 1, "ng-container", 39)(2, TableComponent_div_9_div_2_div_2_ng_template_2_Template, 2, 1, "ng-template", null, 3, i0.ɵɵtemplateRefExtractor);
|
|
136
138
|
i0.ɵɵelementEnd();
|
|
137
139
|
} if (rf & 2) {
|
|
138
140
|
let tmp_10_0;
|
|
139
141
|
let tmp_12_0;
|
|
140
142
|
const plainText_r14 = i0.ɵɵreference(3);
|
|
141
|
-
const
|
|
143
|
+
const colIndex_r13 = i0.ɵɵnextContext().index;
|
|
142
144
|
const rowIndex_r15 = i0.ɵɵnextContext().index;
|
|
143
145
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
144
|
-
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction2(4, _c11, ((tmp_10_0 = ctx_r1.tableConfig()) == null ? null : tmp_10_0.colConfig[
|
|
146
|
+
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]));
|
|
145
147
|
i0.ɵɵadvance();
|
|
146
|
-
i0.ɵɵproperty("ngIf", ((tmp_12_0 = ctx_r1.tableConfig().colConfig[
|
|
148
|
+
i0.ɵɵproperty("ngIf", ((tmp_12_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_12_0.type) === "html")("ngIfElse", plainText_r14);
|
|
147
149
|
} }
|
|
148
|
-
function
|
|
149
|
-
function
|
|
150
|
-
i0.ɵɵtemplate(0,
|
|
150
|
+
function TableComponent_div_9_div_2_3_ng_template_0_Template(rf, ctx) { }
|
|
151
|
+
function TableComponent_div_9_div_2_3_Template(rf, ctx) { if (rf & 1) {
|
|
152
|
+
i0.ɵɵtemplate(0, TableComponent_div_9_div_2_3_ng_template_0_Template, 0, 0, "ng-template", 29);
|
|
151
153
|
} if (rf & 2) {
|
|
152
154
|
const ctx_r15 = i0.ɵɵnextContext();
|
|
153
155
|
const col_r12 = ctx_r15.$implicit;
|
|
154
|
-
const
|
|
156
|
+
const colIndex_r13 = ctx_r15.index;
|
|
155
157
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
156
|
-
i0.ɵɵproperty("customComponent", ctx_r1.tableConfig().colConfig[
|
|
158
|
+
i0.ɵɵproperty("customComponent", ctx_r1.tableConfig().colConfig[colIndex_r13].componentRef)("data", col_r12);
|
|
157
159
|
} }
|
|
158
|
-
function
|
|
160
|
+
function TableComponent_div_9_div_2_mis_actions_cell_4_Template(rf, ctx) { if (rf & 1) {
|
|
159
161
|
const _r17 = i0.ɵɵgetCurrentView();
|
|
160
|
-
i0.ɵɵelementStart(0, "mis-actions-cell",
|
|
161
|
-
i0.ɵɵlistener("actionClick", function
|
|
162
|
+
i0.ɵɵelementStart(0, "mis-actions-cell", 41);
|
|
163
|
+
i0.ɵɵlistener("actionClick", function TableComponent_div_9_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)); });
|
|
162
164
|
i0.ɵɵelementEnd();
|
|
163
165
|
} if (rf & 2) {
|
|
164
166
|
let tmp_11_0;
|
|
165
167
|
const ctx_r15 = i0.ɵɵnextContext();
|
|
166
168
|
const col_r12 = ctx_r15.$implicit;
|
|
167
|
-
const
|
|
169
|
+
const colIndex_r13 = ctx_r15.index;
|
|
168
170
|
const row_r18 = i0.ɵɵnextContext().$implicit;
|
|
169
171
|
const ctx_r1 = i0.ɵɵnextContext();
|
|
170
|
-
i0.ɵɵproperty("cellData", col_r12)("config", ctx_r1.tableConfig().colConfig[
|
|
172
|
+
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)));
|
|
171
173
|
} }
|
|
172
|
-
function
|
|
174
|
+
function TableComponent_div_9_div_2_Template(rf, ctx) { if (rf & 1) {
|
|
173
175
|
const _r10 = i0.ɵɵgetCurrentView();
|
|
174
|
-
i0.ɵɵelementStart(0, "div",
|
|
175
|
-
i0.ɵɵlistener("click", function
|
|
176
|
-
i0.ɵɵelementStart(1, "div",
|
|
177
|
-
i0.ɵɵtemplate(2,
|
|
176
|
+
i0.ɵɵelementStart(0, "div", 34);
|
|
177
|
+
i0.ɵɵlistener("click", function TableComponent_div_9_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); });
|
|
178
|
+
i0.ɵɵelementStart(1, "div", 35);
|
|
179
|
+
i0.ɵɵtemplate(2, TableComponent_div_9_div_2_div_2_Template, 4, 9, "div", 36)(3, TableComponent_div_9_div_2_3_Template, 1, 2, null, 19)(4, TableComponent_div_9_div_2_mis_actions_cell_4_Template, 1, 5, "mis-actions-cell", 37);
|
|
178
180
|
i0.ɵɵelementEnd()();
|
|
179
181
|
} if (rf & 2) {
|
|
180
182
|
let tmp_8_0;
|
|
@@ -183,22 +185,22 @@ function TableComponent_div_7_div_2_Template(rf, ctx) { if (rf & 1) {
|
|
|
183
185
|
let tmp_12_0;
|
|
184
186
|
let tmp_13_0;
|
|
185
187
|
let tmp_14_0;
|
|
186
|
-
const
|
|
188
|
+
const colIndex_r13 = ctx.index;
|
|
187
189
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
188
|
-
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(8, _c8, ((tmp_8_0 = ctx_r1.tableConfig()) == null ? null : tmp_8_0.colConfig[
|
|
190
|
+
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));
|
|
189
191
|
i0.ɵɵadvance();
|
|
190
|
-
i0.ɵɵstyleMap((tmp_10_0 = ctx_r1.tableConfig().colConfig[
|
|
191
|
-
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction2(12, _c10, ((tmp_11_0 = ctx_r1.tableConfig().colConfig[
|
|
192
|
+
i0.ɵɵstyleMap((tmp_10_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_10_0.style);
|
|
193
|
+
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"));
|
|
192
194
|
i0.ɵɵadvance();
|
|
193
|
-
i0.ɵɵproperty("ngIf", ((tmp_12_0 = ctx_r1.tableConfig().colConfig[
|
|
195
|
+
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");
|
|
194
196
|
i0.ɵɵadvance();
|
|
195
|
-
i0.ɵɵproperty("ngIf", ((tmp_13_0 = ctx_r1.tableConfig().colConfig[
|
|
197
|
+
i0.ɵɵproperty("ngIf", ((tmp_13_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_13_0.type) === "custom");
|
|
196
198
|
i0.ɵɵadvance();
|
|
197
|
-
i0.ɵɵproperty("ngIf", ((tmp_14_0 = ctx_r1.tableConfig().colConfig[
|
|
199
|
+
i0.ɵɵproperty("ngIf", ((tmp_14_0 = ctx_r1.tableConfig().colConfig[colIndex_r13]) == null ? null : tmp_14_0.type) === "actions");
|
|
198
200
|
} }
|
|
199
|
-
function
|
|
201
|
+
function TableComponent_div_9_div_3_ng_container_1_Template(rf, ctx) { if (rf & 1) {
|
|
200
202
|
i0.ɵɵelementContainerStart(0);
|
|
201
|
-
i0.ɵɵelementStart(1, "div",
|
|
203
|
+
i0.ɵɵelementStart(1, "div", 43);
|
|
202
204
|
i0.ɵɵtext(2, " Loading... ");
|
|
203
205
|
i0.ɵɵelementEnd();
|
|
204
206
|
i0.ɵɵelementContainerEnd();
|
|
@@ -206,9 +208,9 @@ function TableComponent_div_7_div_3_ng_container_1_Template(rf, ctx) { if (rf &
|
|
|
206
208
|
i0.ɵɵadvance();
|
|
207
209
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(1, _c14));
|
|
208
210
|
} }
|
|
209
|
-
function
|
|
211
|
+
function TableComponent_div_9_div_3_ng_container_2_Template(rf, ctx) { if (rf & 1) {
|
|
210
212
|
i0.ɵɵelementContainerStart(0);
|
|
211
|
-
i0.ɵɵelementStart(1, "div",
|
|
213
|
+
i0.ɵɵelementStart(1, "div", 43);
|
|
212
214
|
i0.ɵɵtext(2, " No Data Available... ");
|
|
213
215
|
i0.ɵɵelementEnd();
|
|
214
216
|
i0.ɵɵelementContainerEnd();
|
|
@@ -216,35 +218,35 @@ function TableComponent_div_7_div_3_ng_container_2_Template(rf, ctx) { if (rf &
|
|
|
216
218
|
i0.ɵɵadvance();
|
|
217
219
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(1, _c14));
|
|
218
220
|
} }
|
|
219
|
-
function
|
|
221
|
+
function TableComponent_div_9_div_3_ng_container_3_Template(rf, ctx) { if (rf & 1) {
|
|
220
222
|
i0.ɵɵelementContainerStart(0);
|
|
221
|
-
i0.ɵɵelement(1, "sub-table",
|
|
223
|
+
i0.ɵɵelement(1, "sub-table", 44);
|
|
222
224
|
i0.ɵɵelementContainerEnd();
|
|
223
225
|
} if (rf & 2) {
|
|
224
226
|
const ctx_r1 = i0.ɵɵnextContext(3);
|
|
225
227
|
i0.ɵɵadvance();
|
|
226
|
-
i0.ɵɵproperty("config", ctx_r1.subTableconfig)("tableData", ctx_r1.subTableData);
|
|
228
|
+
i0.ɵɵproperty("config", ctx_r1.subTableconfig())("tableData", ctx_r1.subTableData());
|
|
227
229
|
} }
|
|
228
|
-
function
|
|
229
|
-
i0.ɵɵelementStart(0, "div",
|
|
230
|
-
i0.ɵɵtemplate(1,
|
|
230
|
+
function TableComponent_div_9_div_3_Template(rf, ctx) { if (rf & 1) {
|
|
231
|
+
i0.ɵɵelementStart(0, "div", 42);
|
|
232
|
+
i0.ɵɵtemplate(1, TableComponent_div_9_div_3_ng_container_1_Template, 3, 2, "ng-container", 19)(2, TableComponent_div_9_div_3_ng_container_2_Template, 3, 2, "ng-container", 19)(3, TableComponent_div_9_div_3_ng_container_3_Template, 2, 2, "ng-container", 19);
|
|
231
233
|
i0.ɵɵelementEnd();
|
|
232
234
|
} if (rf & 2) {
|
|
233
235
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
234
236
|
i0.ɵɵadvance();
|
|
235
|
-
i0.ɵɵproperty("ngIf", ctx_r1.subTableDataLoading);
|
|
237
|
+
i0.ɵɵproperty("ngIf", ctx_r1.subTableDataLoading());
|
|
236
238
|
i0.ɵɵadvance();
|
|
237
|
-
i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading && ctx_r1.subTableData.length === 0);
|
|
239
|
+
i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading() && ctx_r1.subTableData().length === 0);
|
|
238
240
|
i0.ɵɵadvance();
|
|
239
|
-
i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading && ctx_r1.subTableData.length > 0);
|
|
241
|
+
i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading() && ctx_r1.subTableData().length > 0);
|
|
240
242
|
} }
|
|
241
|
-
function
|
|
243
|
+
function TableComponent_div_9_Template(rf, ctx) { if (rf & 1) {
|
|
242
244
|
const _r8 = i0.ɵɵgetCurrentView();
|
|
243
|
-
i0.ɵɵelementStart(0, "div",
|
|
244
|
-
i0.ɵɵlistener("click", function
|
|
245
|
-
i0.ɵɵtemplate(2,
|
|
245
|
+
i0.ɵɵelementStart(0, "div", 30)(1, "div", 31);
|
|
246
|
+
i0.ɵɵlistener("click", function TableComponent_div_9_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)); });
|
|
247
|
+
i0.ɵɵtemplate(2, TableComponent_div_9_div_2_Template, 5, 15, "div", 32);
|
|
246
248
|
i0.ɵɵelementEnd();
|
|
247
|
-
i0.ɵɵtemplate(3,
|
|
249
|
+
i0.ɵɵtemplate(3, TableComponent_div_9_div_3_Template, 4, 3, "div", 33);
|
|
248
250
|
i0.ɵɵelementEnd();
|
|
249
251
|
} if (rf & 2) {
|
|
250
252
|
let tmp_7_0;
|
|
@@ -258,12 +260,12 @@ function TableComponent_div_7_Template(rf, ctx) { if (rf & 1) {
|
|
|
258
260
|
i0.ɵɵadvance();
|
|
259
261
|
i0.ɵɵproperty("ngForOf", row_r18);
|
|
260
262
|
i0.ɵɵadvance();
|
|
261
|
-
i0.ɵɵproperty("ngIf", ((tmp_9_0 = ctx_r1.tableConfig()) == null ? null : tmp_9_0.canExpand) && ctx_r1.expandedIndex === i_r9);
|
|
263
|
+
i0.ɵɵproperty("ngIf", ((tmp_9_0 = ctx_r1.tableConfig()) == null ? null : tmp_9_0.canExpand) && ctx_r1.expandedIndex() === i_r9);
|
|
262
264
|
} }
|
|
263
|
-
function
|
|
265
|
+
function TableComponent_div_10_ng_container_7_div_1_span_1_Template(rf, ctx) { if (rf & 1) {
|
|
264
266
|
const _r20 = i0.ɵɵgetCurrentView();
|
|
265
|
-
i0.ɵɵelementStart(0, "span",
|
|
266
|
-
i0.ɵɵlistener("click", function
|
|
267
|
+
i0.ɵɵelementStart(0, "span", 55);
|
|
268
|
+
i0.ɵɵlistener("click", function TableComponent_div_10_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)); });
|
|
267
269
|
i0.ɵɵtext(1);
|
|
268
270
|
i0.ɵɵelementEnd();
|
|
269
271
|
} if (rf & 2) {
|
|
@@ -274,9 +276,9 @@ function TableComponent_div_8_ng_container_7_div_1_span_1_Template(rf, ctx) { if
|
|
|
274
276
|
i0.ɵɵadvance();
|
|
275
277
|
i0.ɵɵtextInterpolate(pageNumber_r21);
|
|
276
278
|
} }
|
|
277
|
-
function
|
|
278
|
-
i0.ɵɵelementStart(0, "span",
|
|
279
|
-
i0.ɵɵelement(2, "span",
|
|
279
|
+
function TableComponent_div_10_ng_container_7_div_1_span_2_Template(rf, ctx) { if (rf & 1) {
|
|
280
|
+
i0.ɵɵelementStart(0, "span", 56)(1, "div", 43);
|
|
281
|
+
i0.ɵɵelement(2, "span", 57)(3, "span", 57)(4, "span", 58);
|
|
280
282
|
i0.ɵɵelementEnd()();
|
|
281
283
|
} if (rf & 2) {
|
|
282
284
|
i0.ɵɵadvance();
|
|
@@ -286,9 +288,9 @@ function TableComponent_div_8_ng_container_7_div_1_span_2_Template(rf, ctx) { if
|
|
|
286
288
|
i0.ɵɵadvance();
|
|
287
289
|
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(5, _c17));
|
|
288
290
|
} }
|
|
289
|
-
function
|
|
291
|
+
function TableComponent_div_10_ng_container_7_div_1_Template(rf, ctx) { if (rf & 1) {
|
|
290
292
|
i0.ɵɵelementStart(0, "div");
|
|
291
|
-
i0.ɵɵtemplate(1,
|
|
293
|
+
i0.ɵɵtemplate(1, TableComponent_div_10_ng_container_7_div_1_span_1_Template, 2, 4, "span", 53)(2, TableComponent_div_10_ng_container_7_div_1_span_2_Template, 5, 6, "span", 54);
|
|
292
294
|
i0.ɵɵelementEnd();
|
|
293
295
|
} if (rf & 2) {
|
|
294
296
|
const pageNumber_r21 = ctx.$implicit;
|
|
@@ -297,33 +299,33 @@ function TableComponent_div_8_ng_container_7_div_1_Template(rf, ctx) { if (rf &
|
|
|
297
299
|
i0.ɵɵadvance();
|
|
298
300
|
i0.ɵɵproperty("ngIf", pageNumber_r21 == 0);
|
|
299
301
|
} }
|
|
300
|
-
function
|
|
302
|
+
function TableComponent_div_10_ng_container_7_Template(rf, ctx) { if (rf & 1) {
|
|
301
303
|
i0.ɵɵelementContainerStart(0);
|
|
302
|
-
i0.ɵɵtemplate(1,
|
|
304
|
+
i0.ɵɵtemplate(1, TableComponent_div_10_ng_container_7_div_1_Template, 3, 2, "div", 52);
|
|
303
305
|
i0.ɵɵelementContainerEnd();
|
|
304
306
|
} if (rf & 2) {
|
|
305
307
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
306
308
|
i0.ɵɵadvance();
|
|
307
309
|
i0.ɵɵproperty("ngForOf", ctx_r1.pages());
|
|
308
310
|
} }
|
|
309
|
-
function
|
|
311
|
+
function TableComponent_div_10_Template(rf, ctx) { if (rf & 1) {
|
|
310
312
|
const _r19 = i0.ɵɵgetCurrentView();
|
|
311
|
-
i0.ɵɵelementStart(0, "div",
|
|
313
|
+
i0.ɵɵelementStart(0, "div", 45)(1, "p", 46);
|
|
312
314
|
i0.ɵɵtext(2);
|
|
313
315
|
i0.ɵɵelementEnd();
|
|
314
|
-
i0.ɵɵelementStart(3, "div",
|
|
315
|
-
i0.ɵɵlistener("click", function
|
|
316
|
+
i0.ɵɵelementStart(3, "div", 47)(4, "span", 48);
|
|
317
|
+
i0.ɵɵlistener("click", function TableComponent_div_10_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)); });
|
|
316
318
|
i0.ɵɵnamespaceSVG();
|
|
317
|
-
i0.ɵɵelementStart(5, "svg",
|
|
318
|
-
i0.ɵɵelement(6, "path",
|
|
319
|
+
i0.ɵɵelementStart(5, "svg", 49);
|
|
320
|
+
i0.ɵɵelement(6, "path", 50);
|
|
319
321
|
i0.ɵɵelementEnd()();
|
|
320
|
-
i0.ɵɵtemplate(7,
|
|
322
|
+
i0.ɵɵtemplate(7, TableComponent_div_10_ng_container_7_Template, 2, 1, "ng-container", 19);
|
|
321
323
|
i0.ɵɵnamespaceHTML();
|
|
322
|
-
i0.ɵɵelementStart(8, "span",
|
|
323
|
-
i0.ɵɵlistener("click", function
|
|
324
|
+
i0.ɵɵelementStart(8, "span", 48);
|
|
325
|
+
i0.ɵɵlistener("click", function TableComponent_div_10_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)); });
|
|
324
326
|
i0.ɵɵnamespaceSVG();
|
|
325
|
-
i0.ɵɵelementStart(9, "svg",
|
|
326
|
-
i0.ɵɵelement(10, "path",
|
|
327
|
+
i0.ɵɵelementStart(9, "svg", 49);
|
|
328
|
+
i0.ɵɵelement(10, "path", 51);
|
|
327
329
|
i0.ɵɵelementEnd()()()();
|
|
328
330
|
} if (rf & 2) {
|
|
329
331
|
let tmp_2_0;
|
|
@@ -670,38 +672,42 @@ class TableComponent {
|
|
|
670
672
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.filter = _t.first);
|
|
671
673
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.table = _t.first);
|
|
672
674
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.colHeaders = _t);
|
|
673
|
-
} }, 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:
|
|
675
|
+
} }, inputs: { tableConfig: [1, "tableConfig"], subTableconfig: [1, "subTableconfig"], tableDataLoading: [1, "tableDataLoading"], expandedIndex: [1, "expandedIndex"], tableData: [1, "tableData"], subTableData: [1, "subTableData"], subTableDataLoading: [1, "subTableDataLoading"], currentSort: [1, "currentSort"] }, outputs: { filtersUpdated: "filtersUpdated", pageSelected: "pageSelected", sortChange: "sortChange", headerAction: "headerAction" }, features: [i0.ɵɵNgOnChangesFeature], decls: 11, vars: 18, 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", "yellow", "padding", "10px", "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) {
|
|
674
676
|
i0.ɵɵelementStart(0, "div", 4);
|
|
675
677
|
i0.ɵɵtemplate(1, TableComponent_mis_table_filter_1_Template, 2, 2, "mis-table-filter", 5);
|
|
676
678
|
i0.ɵɵelementStart(2, "div", 6, 0)(4, "div", 7);
|
|
677
679
|
i0.ɵɵtemplate(5, TableComponent_div_5_Template, 7, 10, "div", 8);
|
|
678
680
|
i0.ɵɵelementEnd();
|
|
679
|
-
i0.ɵɵelementStart(6, "div", 9);
|
|
680
|
-
i0.ɵɵ
|
|
681
|
+
i0.ɵɵelementStart(6, "div", 9)(7, "div", 10);
|
|
682
|
+
i0.ɵɵtext(8);
|
|
683
|
+
i0.ɵɵelementEnd();
|
|
684
|
+
i0.ɵɵtemplate(9, TableComponent_div_9_Template, 4, 11, "div", 11);
|
|
681
685
|
i0.ɵɵelementEnd()();
|
|
682
|
-
i0.ɵɵtemplate(
|
|
686
|
+
i0.ɵɵtemplate(10, TableComponent_div_10_Template, 11, 8, "div", 12);
|
|
683
687
|
i0.ɵɵelementEnd();
|
|
684
688
|
} if (rf & 2) {
|
|
685
689
|
let tmp_5_0;
|
|
686
|
-
let
|
|
687
|
-
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction3(
|
|
690
|
+
let tmp_8_0;
|
|
691
|
+
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction3(10, _c3$1, ctx.getContainerHeight(), ctx.getContainerWidth(), ctx.tableConfig().canScrollHorizontally ? "auto" : "unset"));
|
|
688
692
|
i0.ɵɵadvance();
|
|
689
693
|
i0.ɵɵproperty("ngIf", ctx.showFilter());
|
|
690
694
|
i0.ɵɵadvance();
|
|
691
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction3(
|
|
695
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction3(14, _c4$1, ctx.expandedIndex() < 0, !(ctx.expandedIndex() < 0), ctx.tableConfig().canScrollHorizontally));
|
|
692
696
|
i0.ɵɵadvance(2);
|
|
693
697
|
i0.ɵɵproperty("ngStyle", ctx.getColHeadersRowStyles());
|
|
694
698
|
i0.ɵɵadvance();
|
|
695
699
|
i0.ɵɵproperty("ngForOf", (tmp_5_0 = ctx.tableConfig()) == null ? null : tmp_5_0.colHeaderConfig);
|
|
696
|
-
i0.ɵɵadvance(
|
|
700
|
+
i0.ɵɵadvance(3);
|
|
701
|
+
i0.ɵɵtextInterpolate3(" Debug: tableData length = ", ctx.tableData().length, ", tableConfig exists = ", !!ctx.tableConfig(), ", first row = ", ctx.tableData()[0], " ");
|
|
702
|
+
i0.ɵɵadvance();
|
|
697
703
|
i0.ɵɵproperty("ngForOf", ctx.tableData());
|
|
698
704
|
i0.ɵɵadvance();
|
|
699
|
-
i0.ɵɵproperty("ngIf", ((
|
|
700
|
-
} }, 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
|
|
705
|
+
i0.ɵɵproperty("ngIf", ((tmp_8_0 = ctx.tableConfig()) == null ? null : tmp_8_0.paginationConfig) && (ctx.tableLength() >= ctx.tableConfig().paginationConfig.rowsPerPage || ((tmp_8_0 = ctx.tableConfig().paginationConfig) == null ? null : tmp_8_0.selectedPage) !== 1));
|
|
706
|
+
} }, styles: ["#main-container[_ngcontent-%COMP%]{font-family:Lato,sans-serif;position:relative}.no-scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar{width:0}.scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar{width:8px;height:8px;border-radius:15px}.scrollbar[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:15px}#table-container[_ngcontent-%COMP%]{height:inherit;overflow-y:auto}#data-container[_ngcontent-%COMP%]{min-height:100px;background-color:#ff00001a}.row-wrapper[_ngcontent-%COMP%]{border:1px solid green;margin:2px 0}.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);border:1px solid blue}.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}}"] }); }
|
|
701
707
|
}
|
|
702
708
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TableComponent, [{
|
|
703
709
|
type: Component,
|
|
704
|
-
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 <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[i]?.action && tableConfig()?.colConfig[i]?.actionType !== 'checkbox' ? tableConfig()?.colConfig[i]?.action(col) : null\"\n *ngFor=\"let col of row; let i = index\"\n [ngStyle]=\"{\n width: tableConfig()?.colConfig[i]?.style?.width || tableConfig()?.colHeaderConfig[i]?.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[i]?.style\"\n [ngStyle]=\"{\n width: '100%',\n cursor: tableConfig().colConfig[i]?.action ? 'pointer' : 'default',\n 'justify-content': tableConfig().colConfig[i]?.style?.justifyContent\n ? tableConfig().colConfig[i]?.style?.justifyContent\n : tableConfig().colConfig[i]?.type === 'number'\n ? 'flex-end'\n : 'space-between'\n }\"\n >\n <div\n *ngIf=\"tableConfig().colConfig[i]?.type !== 'custom' && tableConfig().colConfig[i]?.type !== 'actions'\"\n [ngStyle]=\"{\n color: tableConfig()?.colConfig[i]?.style?.color || '',\n '--collapsed-lines': previewLines || 3\n }\"\n [ngClass]=\"{\n 'collapsed-cell': collapseColIndex == i && expandedMap[rowIndex]\n }\"\n class=\"t-col-text\"\n >\n <!-- Render as HTML -->\n <ng-container *ngIf=\"tableConfig().colConfig[i]?.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\n \n <ng-template\n *ngIf=\"tableConfig().colConfig[i]?.type === 'custom'\"\n [customComponent]=\"tableConfig().colConfig[i].componentRef\"\n [data]=\"col\"\n customTableCell\n ></ng-template>\n <mis-actions-cell\n *ngIf=\"tableConfig().colConfig[i]?.type === 'actions'\"\n [cellData]=\"col\"\n [config]=\"tableConfig().colConfig[i]\"\n (actionClick)=\"onActionClick($event, rowIndex)\"\n [ngClass]=\"{\n 'disable-actions': (tableConfig().colConfig[i]?.actionType === 'checkbox' || tableConfig().colConfig[i]?.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){.collapsed-cell{display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:var(--collapsed-lines, 2);white-space:normal!important}}\n"] }]
|
|
710
|
+
args: [{ selector: "mis-table", template: "<div\n [ngStyle]=\"{\n height: getContainerHeight(),\n width: getContainerWidth(),\n 'overflow-x': tableConfig().canScrollHorizontally ? 'auto' : 'unset'\n }\"\n id=\"main-container\"\n>\n <mis-table-filter\n #filter\n (filtersApplied)=\"updateAppliedFilters($event)\"\n *ngIf=\"showFilter()\"\n [containerStyles]=\"filterContainerStyles()\"\n [filtersData]=\"filterData()\"\n ></mis-table-filter>\n <div\n #table\n id=\"table-container\"\n [ngClass]=\"{ 'no-scrollbar': expandedIndex() < 0, scrollbar: !(expandedIndex() < 0), 'scroll-horizontally': tableConfig().canScrollHorizontally }\"\n >\n <div\n [ngStyle]=\"getColHeadersRowStyles()\"\n id=\"col-headers-container\"\n >\n <div\n #colHeaderRef\n (click)=\"colHeader?.action ? colHeader?.action(colHeader) : null\"\n *ngFor=\"let colHeader of tableConfig()?.colHeaderConfig\"\n class=\"col-header\"\n [ngStyle]=\"{\n width: colHeader?.style?.width || '',\n cursor: colHeader.action ? 'pointer' : 'default',\n 'justify-content': colHeader?.style?.justifyContent\n ? colHeader?.style?.justifyContent\n : colHeader.type === 'number'\n ? 'flex-end'\n : 'space-between'\n }\"\n >\n <p *ngIf=\"colHeader?.type !== 'custom' && colHeader?.type !== 'checkbox'\" class=\"col-header-text\">\n {{ colHeader?.data || \" \" }} - {{tableData().length}}\n </p>\n <span\n (click)=\"filterData.set(colHeader.filters); toggleFilter(colHeader.data); $event.stopPropagation()\"\n *ngIf=\"colHeader?.type !== 'custom' && colHeader?.filters && colHeader?.filters?.length > 0\"\n class=\"filter-icon\"\n >\n <span *ngIf=\"appliedFilters()[colHeader.data]?.length > 0\" id=\"filter-active\"></span>\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 13 10\" width=\"13\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M4.97546 10H7.64213V8H4.97546V10ZM0.308472 0V2H12.3085V0H0.308472ZM2.30847 6H10.3085V4H2.30847V6Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n <span\n (click)=\"toggleCheckbox(); $event.stopPropagation()\"\n *ngIf=\"colHeader?.type === 'checkbox'\"\n class=\"checkbox-icon\"\n >\n <mis-checkbox [checked]=\"selectAllCheckbox()\"></mis-checkbox>\n </span>\n <span *ngIf=\"colHeader?.isSortable && !colHeader?.filters\" appSortIcons\n [column]=\"colHeader\"\n [activeSort]=\"currentSort()\"\n [activeSorts]=\"multiColumnSort()\"\n [multiColumnSort]=\"tableConfig().multiColumnSort\"\n (sortChange)=\"onSortChange($event)\"\n class=\"sort-icon\">\n </span>\n <ng-template *ngIf=\"colHeader?.type === 'custom'\" customTableCell [customComponent]=\"colHeader?.componentRef\" [data]=\"colHeader.data\"></ng-template>\n </div>\n </div>\n \n <div id=\"data-container\">\n <!-- Debug info -->\n <div style=\"background: yellow; padding: 10px; margin: 10px;\">\n Debug: tableData length = {{tableData().length}}, \n tableConfig exists = {{!!tableConfig()}}, \n first row = {{tableData()[0]}}\n </div>\n <div class=\"row-wrapper\" *ngFor=\"let row of tableData(); let i = index; let rowIndex = index\">\n <div\n class=\"t-row\"\n [ngClass]=\"{ 't-row-hover': tableConfig().cellHover, 'active-row': activeRowIndex().includes(i) }\"\n [ngStyle]=\"{ 'min-height': tableConfig()?.rowConfig?.height ? tableConfig().rowConfig.height : '44px' }\"\n (click)=\"selectRow(i)\"\n [class.disabled-row]=\"isRowDisabled(row)\"\n >\n <div\n (click)=\"tableConfig()?.colConfig[colIndex]?.action && tableConfig()?.colConfig[colIndex]?.actionType !== 'checkbox' ? tableConfig()?.colConfig[colIndex]?.action(col) : null\"\n *ngFor=\"let col of row; let colIndex = index\"\n [ngStyle]=\"{\n width: tableConfig()?.colConfig[colIndex]?.style?.width || tableConfig()?.colHeaderConfig[colIndex]?.style?.width || ''\n }\"\n class=\"t-col-container\"\n [ngClass]=\"{ 't-col-container-hover': tableConfig().cellHover }\"\n >\n <div\n class=\"t-col\"\n [style]=\"tableConfig().colConfig[colIndex]?.style\"\n [ngStyle]=\"{\n width: '100%',\n cursor: tableConfig().colConfig[colIndex]?.action ? 'pointer' : 'default',\n 'justify-content': tableConfig().colConfig[colIndex]?.style?.justifyContent\n ? tableConfig().colConfig[colIndex]?.style?.justifyContent\n : tableConfig().colConfig[colIndex]?.type === 'number'\n ? 'flex-end'\n : 'space-between'\n }\"\n >\n <div\n *ngIf=\"tableConfig().colConfig[colIndex]?.type !== 'custom' && tableConfig().colConfig[colIndex]?.type !== 'actions'\"\n [ngStyle]=\"{\n color: tableConfig()?.colConfig[colIndex]?.style?.color || '',\n '--collapsed-lines': previewLines() || 3\n }\"\n [ngClass]=\"{\n 'collapsed-cell': collapseColIndex() == colIndex && expandedMap()[rowIndex]\n }\"\n class=\"t-col-text\"\n >\n <!-- Render as HTML -->\n <ng-container *ngIf=\"tableConfig().colConfig[colIndex]?.type === 'html'; else plainText\">\n <span [innerHTML]=\"col\"></span>\n </ng-container>\n \n <!-- Render as plain text -->\n <ng-template #plainText>\n <span>{{ col }}</span>\n </ng-template>\n </div>\n \n <ng-template\n *ngIf=\"tableConfig().colConfig[colIndex]?.type === 'custom'\"\n [customComponent]=\"tableConfig().colConfig[colIndex].componentRef\"\n [data]=\"col\"\n customTableCell\n ></ng-template>\n <mis-actions-cell\n *ngIf=\"tableConfig().colConfig[colIndex]?.type === 'actions'\"\n [cellData]=\"col\"\n [config]=\"tableConfig().colConfig[colIndex]\"\n (actionClick)=\"onActionClick($event, rowIndex)\"\n [ngClass]=\"{\n 'disable-actions': (tableConfig().colConfig[colIndex]?.actionType === 'checkbox' || tableConfig().colConfig[colIndex]?.actionType === 'row-collapse') && isRowDisabled(row)\n }\"\n ></mis-actions-cell>\n\n </div>\n </div>\n </div>\n <div *ngIf=\"tableConfig()?.canExpand && expandedIndex() === i\" class=\"sub-row\">\n <ng-container *ngIf=\"subTableDataLoading()\">\n <div [ngStyle]=\"{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n padding: '16px'\n }\">\n Loading...\n </div>\n </ng-container>\n \n <ng-container *ngIf=\"!subTableDataLoading() && subTableData().length === 0\">\n <div [ngStyle]=\"{\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n padding: '16px'\n }\">\n No Data Available...\n </div>\n </ng-container>\n \n <ng-container *ngIf=\"!subTableDataLoading() && subTableData().length > 0\">\n <sub-table [config]=\"subTableconfig()\" [tableData]=\"subTableData()\"></sub-table>\n </ng-container>\n </div>\n </div>\n </div>\n </div>\n <div\n *ngIf=\"tableConfig()?.paginationConfig && (tableLength() >= tableConfig().paginationConfig.rowsPerPage || tableConfig().paginationConfig?.selectedPage !== 1)\"\n id=\"pagination-container\"\n >\n <p id=\"pagination-text\">\n Showing\n {{ (tableConfig().paginationConfig?.selectedPage - 1) * tableConfig().paginationConfig.rowsPerPage + 1 }}-{{\n (tableConfig().paginationConfig?.selectedPage - 1) * tableConfig().paginationConfig.rowsPerPage + tableLength()\n }}\n of {{ tableConfig().paginationConfig.totalNoOfRows }} items\n </p>\n <div id=\"pages-container\">\n <span (click)=\"tableConfig().paginationConfig?.selectedPage > 1 && updateSelectedPage(tableConfig().paginationConfig?.selectedPage - 1)\" class=\"page\" [class.page-nav-inactive]=\"tableConfig().paginationConfig?.selectedPage === 1\">\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 7 10\" width=\"7\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M0.857405 5.56295C0.855794 5.56139 0.854188 5.55982 0.852588 5.55824C0.695955 5.40408 0.617641 5.20203 0.617647 4.99998C0.617641 4.79793 0.695955 4.59588 0.852588 4.44172C0.854188 4.44014 0.855794 4.43858 0.857404 4.43702L5.13066 0.231231C5.44392 -0.0770771 5.9518 -0.0770771 6.26506 0.231231C6.57831 0.53954 6.57831 1.03941 6.26506 1.34772L2.5542 4.99998L6.26506 8.65225C6.57831 8.96055 6.57831 9.46042 6.26506 9.76873C5.9518 10.077 5.44392 10.077 5.13066 9.76873L0.857405 5.56295Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n <!-- Page numbers (only show if disablePageJumping is false) -->\n <ng-container *ngIf=\"!tableConfig().paginationConfig?.disablePageJumping\">\n <div *ngFor=\"let pageNumber of pages()\">\n <span\n (click)=\"updateSelectedPage(pageNumber)\"\n *ngIf=\"pageNumber != 0\"\n [ngClass]=\"{ 'page-active': pageNumber == tableConfig().paginationConfig?.selectedPage }\"\n class=\"page page-jumping-enabled\"\n >{{ pageNumber }}</span>\n <span *ngIf=\"pageNumber == 0\" class=\"page-seperator\">\n <div [ngStyle]=\"{ display: 'flex' }\">\n <span class=\"dot\" [ngStyle]=\"{ 'margin-right': '4px' }\"></span>\n <span class=\"dot\" [ngStyle]=\"{ 'margin-right': '4px' }\"></span>\n <span class=\"dot\"></span>\n </div> \n </span>\n </div>\n </ng-container>\n \n <span [class.page-nav-inactive]=\"tableConfig().paginationConfig?.selectedPage === tableConfig().paginationConfig?.noOfPages\"\n (click)=\"tableConfig().paginationConfig?.selectedPage < tableConfig().paginationConfig?.noOfPages && updateSelectedPage(tableConfig().paginationConfig?.selectedPage + 1)\" class=\"page\">\n <svg fill=\"none\" height=\"10\" viewBox=\"0 0 7 10\" width=\"7\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n clip-rule=\"evenodd\"\n d=\"M6.1426 5.56295C6.14421 5.56139 6.14581 5.55982 6.14741 5.55824C6.30405 5.40408 6.38236 5.20203 6.38236 4.99998C6.38236 4.79793 6.30405 4.59588 6.14741 4.44172C6.14581 4.44014 6.14421 4.43858 6.1426 4.43702L1.86934 0.231231C1.55608 -0.0770771 1.0482 -0.0770771 0.734942 0.231231C0.421688 0.53954 0.421688 1.03941 0.734942 1.34772L4.4458 4.99998L0.734941 8.65225C0.421686 8.96055 0.421686 9.46042 0.734941 9.76873C1.0482 10.077 1.55608 10.077 1.86934 9.76873L6.1426 5.56295Z\"\n fill=\"#181F33\"\n fill-rule=\"evenodd\"\n />\n </svg>\n </span>\n </div>\n </div>\n</div>\n", styles: ["#main-container{font-family:Lato,sans-serif;position:relative}.no-scrollbar::-webkit-scrollbar{width:0}.scrollbar::-webkit-scrollbar{width:8px;height:8px;border-radius:15px}.scrollbar::-webkit-scrollbar-thumb{background:var(--text-tertiary, #929DAB);border-radius:15px}#table-container{height:inherit;overflow-y:auto}#data-container{min-height:100px;background-color:#ff00001a}.row-wrapper{border:1px solid green;margin:2px 0}.scroll-horizontally{height:inherit;width:fit-content;overflow-y:unset!important;overflow-x:visible}#col-headers-container{display:flex;align-items:center;position:sticky;background-color:var(--bg-primary, #FFFFFF);width:100%;z-index:1;min-height:44px;border-bottom:1px solid var(--border-primary, #E0E0E0);top:0;left:0;right:0}.col-header{padding:0 16px;display:flex;align-items:center;height:100%}.col-header-text{font-style:normal;font-weight:700;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.sort-icon{display:flex;justify-content:center;align-items:center}.filter-icon{margin-left:8px;padding:0 8px;position:relative;cursor:pointer}#filter-active{height:8px;width:8px;background:var(--brand-accent, #10ADAE);border-radius:50%;position:absolute;top:4px;right:4px}.sub-row{height:auto;border-bottom:none}.loader ::ng-deep .mat-progress-spinner circle,.mat-spinner circle{stroke:var(--brand-primary, #0937B2)}.t-row{display:flex;min-height:44px;background-color:var(--bg-primary, #FFFFFF);width:100%;border-bottom:1px solid var(--border-primary, #E0E0E0);border:1px solid blue}.t-row:hover{background-color:var(--brand-primary-hover, #F0F3FA)}.active-row{background-color:var(--brand-primary-active, #DAE1F3)}.t-col-container{padding:0 16px;overflow-wrap:anywhere;min-width:0}.t-row-hover:hover{background-color:#0000}.t-col-container-hover:hover{background-color:var(--brand-primary-active, #DAE1F3)}.t-col-container-hover:first-child{border-left:1px solid var(--border-primary, #E0E0E0)}.t-col-container-hover{border-right:1px solid var(--border-primary, #E0E0E0)}.t-col{display:flex;align-items:center;height:100%}.t-col-text{font-style:normal;font-weight:400;font-size:14px;line-height:20px;display:flex;align-items:center;letter-spacing:.2px;margin:0}.text-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}#pagination-container{display:flex;justify-content:flex-end;align-items:center;height:56px}#pagination-text{font-style:normal;font-weight:400;font-size:12px;line-height:18px;letter-spacing:.4px;color:var(--text-secondary, #6A737D);margin:0 56px 0 0}#pages-container{display:flex;margin-right:32px}.page{display:flex;justify-content:center;align-items:center;box-sizing:border-box;border-radius:4px;width:32px;height:32px;font-size:14px;line-height:20px;letter-spacing:.2px;color:var(--text-secondary, #6A737D);margin-right:8px;cursor:pointer}.page.page-jumping-enabled{border:1px solid var(--text-secondary, #6A737D)}.page-seperator{display:flex;justify-content:center;align-items:center;width:32px;height:32px;margin-right:8px}.dot{height:3px;width:3px;border-radius:50%;background:var(--text-secondary, #6A737D)}.page-active{color:var(--brand-primary, #0937B2);border:1px solid var(--brand-primary, #0937B2)}.sort-icon{display:inline-flex;align-items:center;margin-left:4px;cursor:pointer}.sort-icon img{width:16px;height:16px;transition:opacity .2s ease}.sort-icon img:hover{opacity:.8}.disabled-row .t-col-container{opacity:.4;pointer-events:none}.disabled-row .t-col-container:has(mis-actions-cell){opacity:1;pointer-events:auto}.row{transition:background-color .2s}.row:hover:not(.disabled-row),.row.selected:not(.disabled-row){background-color:var(--brand-primary-active, #DAE1F3)}.disabled-row .t-col-container{pointer-events:none;opacity:.4}.disabled-row .t-col-container:has(mis-actions-cell){pointer-events:auto!important;opacity:1!important;color:inherit!important}mis-actions-cell.disable-actions{pointer-events:none;opacity:.4;filter:grayscale(.5)}.page-nav-inactive{pointer-events:none;opacity:.5;cursor:default}.collapsed-cell{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;display:block;@supports (-webkit-line-clamp: 2){display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:var(--collapsed-lines, 2);white-space:normal!important}}\n"] }]
|
|
705
711
|
}], () => [{ type: i0.Renderer2 }], { filter: [{
|
|
706
712
|
type: ViewChild,
|
|
707
713
|
args: ["filter"]
|