mis-crystal-design-system 18.0.18 → 18.0.19-test-1

package/fesm2022/mis-crystal-design-system-table.mjs

@@ -1,295 +1,606 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, Output, ViewChild, ViewChildren, Input, Directive, input, output, signal, HostListener, NgModule } from '@angular/core';
+import { EventEmitter, Component, Input, Output, HostListener, ViewChild, ViewChildren, Directive, input, output, signal, NgModule } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i2 from '@angular/cdk/scrolling';
-import { ScrollingModule } from '@angular/cdk/scrolling';
-import * as i2$1 from 'mis-crystal-design-system/checkbox';
+import * as i2 from 'mis-crystal-design-system/checkbox';
 import { CheckboxModule } from 'mis-crystal-design-system/checkbox';
+import * as i2$1 from '@angular/cdk/scrolling';
+import { ScrollingModule } from '@angular/cdk/scrolling';
 
-const _c0$3 = ["filter"];
-const _c1$2 = ["table"];
-const _c2$2 = ["colHeaderRef"];
-const _c3$1 = (a0, a1, a2) => ({ height: a0, width: a1, "overflow-x": a2 });
-const _c4$1 = (a0, a1, a2) => ({ "no-scrollbar": a0, scrollbar: a1, "scroll-horizontally": a2 });
-const _c5$1 = (a0, a1, a2) => ({ width: a0, cursor: a1, "justify-content": a2 });
-const _c6$1 = (a0, a1) => ({ "t-row-hover": a0, "active-row": a1 });
-const _c7$1 = a0 => ({ "min-height": a0 });
-const _c8 = a0 => ({ width: a0 });
-const _c9 = a0 => ({ "t-col-container-hover": a0 });
-const _c10 = (a0, a1) => ({ width: "100%", cursor: a0, "justify-content": a1 });
-const _c11 = a0 => ({ color: a0 });
-const _c12 = a0 => ({ "text-ellipsis": a0 });
-const _c13 = a0 => ({ "disable-actions": a0 });
-const _c14 = () => ({ display: "flex", justifyContent: "center", alignItems: "center", padding: "16px" });
-const _c15 = a0 => ({ "page-active": a0 });
-const _c16 = () => ({ display: "flex" });
-const _c17 = () => ({ "margin-right": "4px" });
-function TableComponent_mis_table_filter_1_Template(rf, ctx) { if (rf & 1) {
+const _c0$3 = a0 => ({ disabled: a0 });
+function ActionsCellComponent_div_1_div_1_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mis-table-filter", 11, 1);
-    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)); });
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("containerStyles", ctx_r1.filterContainerStyles)("filtersData", ctx_r1.filterData);
-} }
-function TableComponent_div_5_p_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 18);
-    i0.ɵɵtext(1);
+    i0.ɵɵelementStart(0, "div", 7);
+    i0.ɵɵlistener("click", function ActionsCellComponent_div_1_div_1_Template_div_click_0_listener($event) { const item_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onActionClick(item_r2, $event)); });
+    i0.ɵɵelement(1, "img", 8);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const colHeader_r4 = i0.ɵɵnextContext().$implicit;
+    const item_r2 = ctx.$implicit;
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c0$3, ctx_r2.isDisabled(item_r2)));
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", (colHeader_r4 == null ? null : colHeader_r4.data) || " ", " ");
-} }
-function TableComponent_div_5_span_3_span_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span", 23);
+    i0.ɵɵproperty("src", item_r2.icon, i0.ɵɵsanitizeUrl)("alt", item_r2.label);
 } }
-function TableComponent_div_5_span_3_Template(rf, ctx) { if (rf & 1) {
-    const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 19);
-    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 = colHeader_r4.filters; ctx_r1.toggleFilter(colHeader_r4.data); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵtemplate(1, TableComponent_div_5_span_3_span_1_Template, 1, 0, "span", 20);
-    i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(2, "svg", 21);
-    i0.ɵɵelement(3, "path", 22);
-    i0.ɵɵelementEnd()();
+function ActionsCellComponent_div_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 5);
+    i0.ɵɵtemplate(1, ActionsCellComponent_div_1_div_1_Template, 2, 5, "div", 6);
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const colHeader_r4 = i0.ɵɵnextContext().$implicit;
-    const ctx_r1 = i0.ɵɵnextContext();
+    const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", (ctx_r1.appliedFilters[colHeader_r4.data] == null ? null : ctx_r1.appliedFilters[colHeader_r4.data].length) > 0);
+    i0.ɵɵproperty("ngForOf", ctx_r2.actionItems)("ngForTrackBy", ctx_r2.trackByAction);
 } }
-function TableComponent_div_5_span_4_Template(rf, ctx) { if (rf & 1) {
-    const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 24);
-    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()); });
-    i0.ɵɵelement(1, "mis-checkbox", 25);
+function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_span_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 26);
+    i0.ɵɵelement(1, "img", 27);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
+    const item_r6 = i0.ɵɵnextContext(2).$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵproperty("checked", ctx_r1.selectAllCheckbox);
+    i0.ɵɵproperty("src", item_r6.icon, i0.ɵɵsanitizeUrl);
 } }
-function TableComponent_div_5_span_5_Template(rf, ctx) { if (rf & 1) {
-    const _r7 = i0.ɵɵgetCurrentView();
+function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_div_1_span_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 26);
-    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)); });
+    i0.ɵɵelement(1, "img", 27);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const colHeader_r4 = i0.ɵɵnextContext().$implicit;
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("column", colHeader_r4)("activeSort", ctx_r1.currentSort)("activeSorts", ctx_r1.multiColumnSort)("multiColumnSort", ctx_r1.config.multiColumnSort);
+    const child_r8 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("src", child_r8.icon, i0.ɵɵsanitizeUrl);
 } }
-function TableComponent_div_5_6_ng_template_0_Template(rf, ctx) { }
-function TableComponent_div_5_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, TableComponent_div_5_6_ng_template_0_Template, 0, 0, "ng-template", 27);
+function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_div_1_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 18);
+    i0.ɵɵlistener("click", function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_div_1_Template_div_click_0_listener($event) { const child_r8 = i0.ɵɵrestoreView(_r7).$implicit; const ctx_r2 = i0.ɵɵnextContext(6); return i0.ɵɵresetView(ctx_r2.onDropdownItemClick(child_r8, $event)); });
+    i0.ɵɵtemplate(1, ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_div_1_span_1_Template, 2, 1, "span", 20);
+    i0.ɵɵelementStart(2, "span", 21);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const colHeader_r4 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵproperty("customComponent", colHeader_r4 == null ? null : colHeader_r4.componentRef)("data", colHeader_r4.data);
+    const child_r8 = ctx.$implicit;
+    const ctx_r2 = i0.ɵɵnextContext(6);
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c0$3, ctx_r2.isDisabled(child_r8)));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", child_r8.icon);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(child_r8.label);
 } }
-function TableComponent_div_5_Template(rf, ctx) { if (rf & 1) {
-    const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 12, 2);
-    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); });
-    i0.ɵɵtemplate(2, TableComponent_div_5_p_2_Template, 2, 1, "p", 13)(3, TableComponent_div_5_span_3_Template, 4, 1, "span", 14)(4, TableComponent_div_5_span_4_Template, 2, 1, "span", 15)(5, TableComponent_div_5_span_5_Template, 1, 4, "span", 16)(6, TableComponent_div_5_6_Template, 1, 2, null, 17);
+function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 28);
+    i0.ɵɵtemplate(1, ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_div_1_Template, 4, 5, "div", 17);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const colHeader_r4 = ctx.$implicit;
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction3(6, _c5$1, (colHeader_r4 == null ? null : colHeader_r4.style == null ? null : colHeader_r4.style.width) || "", colHeader_r4.action ? "pointer" : "default", (colHeader_r4 == null ? null : colHeader_r4.style == null ? null : colHeader_r4.style.justifyContent) ? colHeader_r4 == null ? null : colHeader_r4.style == null ? null : colHeader_r4.style.justifyContent : colHeader_r4.type === "number" ? "flex-end" : "space-between"));
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.type) !== "custom" && (colHeader_r4 == null ? null : colHeader_r4.type) !== "checkbox");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.type) !== "custom" && (colHeader_r4 == null ? null : colHeader_r4.filters) && (colHeader_r4 == null ? null : colHeader_r4.filters == null ? null : colHeader_r4.filters.length) > 0);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.type) === "checkbox");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.isSortable) && !(colHeader_r4 == null ? null : colHeader_r4.filters));
+    const item_r6 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵproperty("ngClass", item_r6.submenuAlign);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.type) === "custom");
+    i0.ɵɵproperty("ngForOf", item_r6.children);
 } }
-function TableComponent_div_7_div_2_p_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 36);
-    i0.ɵɵtext(1);
+function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵtemplate(1, ActionsCellComponent_div_2_div_6_div_1_ng_container_1_span_1_Template, 2, 1, "span", 20);
+    i0.ɵɵelementStart(2, "span", 21);
+    i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "span", 22);
+    i0.ɵɵnamespaceSVG();
+    i0.ɵɵelementStart(5, "svg", 23);
+    i0.ɵɵelement(6, "path", 24);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(7, ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_Template, 2, 2, "div", 25);
+    i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const ctx_r13 = i0.ɵɵnextContext();
-    const col_r12 = ctx_r13.$implicit;
-    const i_r13 = ctx_r13.index;
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(3, _c11, (ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.color) ? ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.color : ""))("ngClass", i0.ɵɵpureFunction1(5, _c12, !!(ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.textEllipsis)));
+    const item_r6 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", col_r12, " ");
+    i0.ɵɵproperty("ngIf", item_r6.icon);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(item_r6.label);
+    i0.ɵɵadvance(4);
+    i0.ɵɵproperty("ngIf", item_r6.showSubmenu);
 } }
-function TableComponent_div_7_div_2_3_ng_template_0_Template(rf, ctx) { }
-function TableComponent_div_7_div_2_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, TableComponent_div_7_div_2_3_ng_template_0_Template, 0, 0, "ng-template", 27);
+function ActionsCellComponent_div_2_div_6_div_1_ng_template_2_span_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 26);
+    i0.ɵɵelement(1, "img", 27);
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r13 = i0.ɵɵnextContext();
-    const col_r12 = ctx_r13.$implicit;
-    const i_r13 = ctx_r13.index;
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("customComponent", ctx_r1.config.colConfig[i_r13].componentRef)("data", col_r12);
+    const item_r6 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("src", item_r6.icon, i0.ɵɵsanitizeUrl);
 } }
-function TableComponent_div_7_div_2_mis_actions_cell_4_Template(rf, ctx) { if (rf & 1) {
-    const _r15 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mis-actions-cell", 37);
-    i0.ɵɵlistener("actionClick", function TableComponent_div_7_div_2_mis_actions_cell_4_Template_mis_actions_cell_actionClick_0_listener($event) { i0.ɵɵrestoreView(_r15); const rowIndex_r16 = i0.ɵɵnextContext(2).index; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onActionClick($event, rowIndex_r16)); });
+function ActionsCellComponent_div_2_div_6_div_1_ng_template_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, ActionsCellComponent_div_2_div_6_div_1_ng_template_2_span_0_Template, 2, 1, "span", 20);
+    i0.ɵɵelementStart(1, "span", 21);
+    i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r13 = i0.ɵɵnextContext();
-    const col_r12 = ctx_r13.$implicit;
-    const i_r13 = ctx_r13.index;
-    const row_r17 = i0.ɵɵnextContext().$implicit;
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("rowData", col_r12)("config", ctx_r1.config.colConfig[i_r13])("isChecked", col_r12.isChecked)("ngClass", i0.ɵɵpureFunction1(4, _c13, (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].actionType) === "checkbox" && ctx_r1.isRowDisabled(row_r17)));
+    const item_r6 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("ngIf", item_r6.icon);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(item_r6.label);
 } }
-function TableComponent_div_7_div_2_Template(rf, ctx) { if (rf & 1) {
-    const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 32);
-    i0.ɵɵlistener("click", function TableComponent_div_7_div_2_Template_div_click_0_listener() { const ctx_r10 = i0.ɵɵrestoreView(_r10); const col_r12 = ctx_r10.$implicit; const i_r13 = ctx_r10.index; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView((ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].action) && (ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].actionType) !== "checkbox" ? ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].action(col_r12) : null); });
-    i0.ɵɵelementStart(1, "div", 33);
-    i0.ɵɵtemplate(2, TableComponent_div_7_div_2_p_2_Template, 2, 7, "p", 34)(3, TableComponent_div_7_div_2_3_Template, 1, 2, null, 17)(4, TableComponent_div_7_div_2_mis_actions_cell_4_Template, 1, 6, "mis-actions-cell", 35);
-    i0.ɵɵelementEnd()();
+function ActionsCellComponent_div_2_div_6_div_1_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 18);
+    i0.ɵɵlistener("click", function ActionsCellComponent_div_2_div_6_div_1_Template_div_click_0_listener($event) { const item_r6 = i0.ɵɵrestoreView(_r5).$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onDropdownItemClick(item_r6, $event)); });
+    i0.ɵɵtemplate(1, ActionsCellComponent_div_2_div_6_div_1_ng_container_1_Template, 8, 3, "ng-container", 19)(2, ActionsCellComponent_div_2_div_6_div_1_ng_template_2_Template, 3, 2, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const i_r13 = ctx.index;
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(8, _c8, (ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.width) || (ctx_r1.config == null ? null : ctx_r1.config.colHeaderConfig[i_r13] == null ? null : ctx_r1.config.colHeaderConfig[i_r13].style == null ? null : ctx_r1.config.colHeaderConfig[i_r13].style.width) || ""))("ngClass", i0.ɵɵpureFunction1(10, _c9, ctx_r1.config.cellHover));
-    i0.ɵɵadvance();
-    i0.ɵɵstyleMap(ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style);
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction2(12, _c10, (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].action) ? "pointer" : "default", (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.justifyContent) ? ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.justifyContent : (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].type) === "number" ? "flex-end" : "space-between"));
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].type) !== "custom" && (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].type) !== "actions");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].type) === "custom");
+    const item_r6 = ctx.$implicit;
+    const noChildren_r9 = i0.ɵɵreference(3);
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c0$3, ctx_r2.isDisabled(item_r6)));
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].type) === "actions");
+    i0.ɵɵproperty("ngIf", item_r6.children == null ? null : item_r6.children.length)("ngIfElse", noChildren_r9);
 } }
-function TableComponent_div_7_div_3_ng_container_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "div", 39);
-    i0.ɵɵtext(2, " Loading... ");
+function ActionsCellComponent_div_2_div_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 16);
+    i0.ɵɵtemplate(1, ActionsCellComponent_div_2_div_6_div_1_Template, 4, 5, "div", 17);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("ngClass", ctx_r2.menuAlign);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(1, _c14));
+    i0.ɵɵproperty("ngForOf", ctx_r2.actionItems);
 } }
-function TableComponent_div_7_div_3_ng_container_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "div", 39);
-    i0.ɵɵtext(2, " No Data Available... ");
+function ActionsCellComponent_div_2_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 9)(1, "div", 10);
+    i0.ɵɵlistener("click", function ActionsCellComponent_div_2_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.toggleDropdown($event)); });
+    i0.ɵɵnamespaceSVG();
+    i0.ɵɵelementStart(2, "svg", 11);
+    i0.ɵɵelement(3, "circle", 12)(4, "circle", 13)(5, "circle", 14);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(6, ActionsCellComponent_div_2_div_6_Template, 2, 2, "div", 15);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(1, _c14));
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(6);
+    i0.ɵɵproperty("ngIf", ctx_r2.isDropdownOpen);
 } }
-function TableComponent_div_7_div_3_ng_container_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelement(1, "sub-table", 40);
-    i0.ɵɵelementContainerEnd();
+function ActionsCellComponent_div_3_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 29)(1, "mis-checkbox", 30);
+    i0.ɵɵlistener("valueChange", function ActionsCellComponent_div_3_Template_mis_checkbox_valueChange_1_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onCheckboxChange($event)); });
+    i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
+    const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("config", ctx_r1.subTableconfig)("tableData", ctx_r1.subTableData);
+    i0.ɵɵproperty("checked", ctx_r2.isChecked)("disabled", ctx_r2.disable ? ctx_r2.disable(ctx_r2.data) : false);
 } }
-function TableComponent_div_7_div_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 38);
-    i0.ɵɵtemplate(1, TableComponent_div_7_div_3_ng_container_1_Template, 3, 2, "ng-container", 17)(2, TableComponent_div_7_div_3_ng_container_2_Template, 3, 2, "ng-container", 17)(3, TableComponent_div_7_div_3_ng_container_3_Template, 2, 2, "ng-container", 17);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.subTableDataLoading);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading && ctx_r1.subTableData.length === 0);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading && ctx_r1.subTableData.length > 0);
-} }
-function TableComponent_div_7_Template(rf, ctx) { if (rf & 1) {
-    const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 28)(1, "div", 29);
-    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)); });
-    i0.ɵɵtemplate(2, TableComponent_div_7_div_2_Template, 5, 15, "div", 30);
-    i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(3, TableComponent_div_7_div_3_Template, 4, 3, "div", 31);
+class ActionsCellComponent {
+    constructor() {
+        this.isChecked = false;
+        this.actionClick = new EventEmitter();
+        this.dropdownToggled = new EventEmitter();
+        this.isDropdownOpen = false;
+        this.actionItems = [];
+        this.actionType = "inline";
+        this.submenuAlign = "right";
+        this.menuAlign = "left";
+        this._style = {};
+        this.containerStyle = {};
+    }
+    set rowData(value) {
+        if (this.actionType === 'checkbox') {
+            // For checkbox, keep the rowData structure
+            this.data = value?.rowData ?? {};
+            this.isChecked = value?.isChecked ?? false;
+        }
+        else {
+            // For other actions (dropdown, inline), use the value directly
+            this.data = value;
+            this.isChecked = false;
+        }
+    }
+    set config(config) {
+        this.actionItems = config?.actionItems,
+            this.actionType = config.actionType,
+            this.submenuAlign = config.submenuAlign,
+            this.menuAlign = config.menuAlign;
+        this._style = config.style;
+        this.action = config.action;
+        this.disable = config.disable;
+        this.processStyle();
+    }
+    ngOnInit() { }
+    processStyle() {
+        // Remove width from style to avoid conflicts with table column width
+        const { width, ...restStyle } = this._style;
+        this.containerStyle = restStyle;
+    }
+    onActionClick(item, event) {
+        event.stopPropagation();
+        // Check permissions before executing action
+        if (this.isDisabled(item))
+            return;
+        // Execute action only if permitted
+        if (item.action) {
+            item.action(this.data);
+        }
+        this.actionClick.emit({ item, data: this.data });
+    }
+    trackByAction(index, item) {
+        return item.value;
+    }
+    isSvgFile(iconPath) {
+        if (!iconPath)
+            return false;
+        return iconPath.toLowerCase().includes(".svg") || iconPath.toLowerCase().includes("assets/icons/");
+    }
+    onDocumentClick() {
+        if (this.isDropdownOpen) {
+            this.isDropdownOpen = false;
+        }
+    }
+    // method to close dropdown
+    closeDropdown() {
+        if (this.isDropdownOpen) {
+            this.isDropdownOpen = false;
+            this.actionItems.forEach((item) => (item.showSubmenu = false));
+        }
+    }
+    toggleDropdown(event) {
+        event.stopPropagation();
+        // Emit self when opening dropdown
+        if (!this.isDropdownOpen) {
+            this.dropdownToggled.emit(this);
+        }
+        this.isDropdownOpen = !this.isDropdownOpen;
+        // Close all submenus when opening/closing main menu
+        this.actionItems.forEach((item) => (item.showSubmenu = false));
+    }
+    onDropdownItemClick(item, event) {
+        event.stopPropagation();
+        if (this.isDisabled(item))
+            return;
+        if (item?.children?.length) {
+            // Toggle submenu
+            item.showSubmenu = !item.showSubmenu;
+            // Optionally close other submenus
+            this.actionItems.forEach((i) => {
+                if (i !== item)
+                    i.showSubmenu = false;
+            });
+        }
+        else {
+            // Handle action
+            if (item.action)
+                item.action(this.data);
+            this.actionClick.emit({ item, data: this.data });
+            this.isDropdownOpen = false; // Only close if action was executed
+        }
+    }
+    onCheckboxChange(event) {
+        this.isChecked = event?.value ?? false;
+        this.actionClick.emit({
+            isChecked: this.isChecked,
+            data: this.data
+        });
+    }
+    isDisabled(item) {
+        if (typeof item.disable === "function") {
+            return item.disable(this.data);
+        }
+        return false;
+    }
+    static { this.ɵfac = function ActionsCellComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ActionsCellComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ActionsCellComponent, selectors: [["mis-actions-cell"]], hostBindings: function ActionsCellComponent_HostBindings(rf, ctx) { if (rf & 1) {
+            i0.ɵɵlistener("click", function ActionsCellComponent_click_HostBindingHandler() { return ctx.onDocumentClick(); }, false, i0.ɵɵresolveDocument);
+        } }, inputs: { rowData: "rowData", isChecked: "isChecked", config: "config" }, outputs: { actionClick: "actionClick", dropdownToggled: "dropdownToggled" }, decls: 4, vars: 4, consts: [["noChildren", ""], [1, "actions-cell-container", 3, "ngStyle"], ["class", "inline-actions", 4, "ngIf"], ["class", "dropdown-actions", 4, "ngIf"], ["class", "checkbox-actions", 4, "ngIf"], [1, "inline-actions"], ["class", "action-item", 3, "ngClass", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "action-item", 3, "click", "ngClass"], [1, "action-icon-svg", 3, "src", "alt"], [1, "dropdown-actions"], ["title", "More actions", 1, "dropdown-trigger", 3, "click"], ["width", "20", "height", "20", "viewBox", "0 0 20 20", "fill", "none"], ["cx", "10", "cy", "4", "r", "2", "fill", "#333"], ["cx", "10", "cy", "10", "r", "2", "fill", "#333"], ["cx", "10", "cy", "16", "r", "2", "fill", "#333"], ["class", "dropdown-menu", 3, "ngClass", 4, "ngIf"], [1, "dropdown-menu", 3, "ngClass"], ["class", "dropdown-menu-item", 3, "ngClass", "click", 4, "ngFor", "ngForOf"], [1, "dropdown-menu-item", 3, "click", "ngClass"], [4, "ngIf", "ngIfElse"], ["class", "dropdown-icon", 4, "ngIf"], [1, "dropdown-label"], [1, "submenu-arrow"], ["width", "20", "height", "20", "viewBox", "0 0 24 24", "fill", "none"], ["d", "M9 6L15 12L9 18", "stroke", "#0D1321", "stroke-width", "2", "stroke-linecap", "round", "stroke-linejoin", "round"], ["class", "dropdown-submenu", 3, "ngClass", 4, "ngIf"], [1, "dropdown-icon"], [3, "src"], [1, "dropdown-submenu", 3, "ngClass"], [1, "checkbox-actions"], [3, "valueChange", "checked", "disabled"]], template: function ActionsCellComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 1);
+            i0.ɵɵtemplate(1, ActionsCellComponent_div_1_Template, 2, 2, "div", 2)(2, ActionsCellComponent_div_2_Template, 7, 1, "div", 3)(3, ActionsCellComponent_div_3_Template, 2, 2, "div", 4);
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵproperty("ngStyle", ctx.containerStyle);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.actionType === "inline");
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.actionType === "dropdown");
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.actionType === "checkbox");
+        } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgStyle, i2.CheckboxComponent], styles: [".actions-cell-container[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;width:100%;height:100%;position:relative;box-sizing:border-box}.inline-actions[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;height:100%;flex-wrap:nowrap;padding:4px 0;flex-direction:row}.action-item[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;height:20px;border-radius:4px;cursor:pointer;transition:all .2s ease;background-color:transparent;border:none;outline:none;flex-shrink:0;min-height:20px}.action-item[_ngcontent-%COMP%]:hover:not(.disabled){background-color:#0000000a;transform:scale(1.05)}.action-item[_ngcontent-%COMP%]:active:not(.disabled){transform:scale(.95)}.action-item.disabled[_ngcontent-%COMP%]{opacity:.5;cursor:not-allowed}.action-item.disabled[_ngcontent-%COMP%]:hover{background-color:transparent;transform:none}.action-icon[_ngcontent-%COMP%]{font-size:16px;color:#666;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.action-icon-svg[_ngcontent-%COMP%]{width:18px;height:18px;object-fit:contain;filter:brightness(0) saturate(100%) invert(40%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(.6) contrast(1);flex-shrink:0}.action-icon-svg[_ngcontent-%COMP%]:hover{filter:brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0) contrast(1)}.dropdown-trigger[_ngcontent-%COMP%]{cursor:pointer}.dropdown-actions[_ngcontent-%COMP%]{position:relative}.dropdown-trigger[_ngcontent-%COMP%]{cursor:pointer;display:flex;align-items:center;justify-content:center}.dropdown-menu[_ngcontent-%COMP%]{position:absolute;top:100%;width:232px;background:#fff;border-radius:12px;box-shadow:0 4px 24px #0000001f;z-index:1000;padding:8px 0}.dropdown-menu.left[_ngcontent-%COMP%]{right:0!important;left:auto!important}.dropdown-menu.right[_ngcontent-%COMP%]{left:0!important;right:auto!important}.dropdown-menu-item.disabled[_ngcontent-%COMP%]{color:#aaa;cursor:not-allowed}.dropdown-menu-item[_ngcontent-%COMP%]:hover:not(.disabled), .dropdown-menu-item.has-submenu[_ngcontent-%COMP%]:hover{background:#f5f5f5}.dropdown-menu-item[_ngcontent-%COMP%]{display:flex;align-items:center;padding:10px 18px;cursor:pointer;font-size:14px;position:relative}.dropdown-menu-item[_ngcontent-%COMP%]   .dropdown-label[_ngcontent-%COMP%]{flex:1;margin-left:8px}.dropdown-menu-item[_ngcontent-%COMP%]   .submenu-arrow[_ngcontent-%COMP%]{margin-left:auto;width:16px;height:16px}.submenu-container[_ngcontent-%COMP%]{position:absolute;top:0;left:100%;margin-left:4px;background:#fff;box-shadow:0 4px 8px #0000001a;border-radius:8px;z-index:1000;white-space:nowrap}.dropdown-submenu[_ngcontent-%COMP%]{position:absolute;top:0;min-width:132px;background:#fff;border-radius:12px;box-shadow:0 4px 24px #0000001f;padding:8px 0;z-index:1001}.dropdown-submenu.right[_ngcontent-%COMP%]{left:100%;margin-left:4px}.dropdown-submenu.left[_ngcontent-%COMP%]{left:auto;right:100%;background-color:#fff;border:1px solid #ddd;z-index:9999;position:absolute;margin-right:4px}.submenu-arrow[_ngcontent-%COMP%]{display:flex;align-items:center;margin-left:auto;z-index:9999}.dropdown-icon[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center}.dropdown-menu-item.disabled[_ngcontent-%COMP%]{color:#181f33;filter:grayscale(100%) opacity(.3);cursor:not-allowed}"] }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ActionsCellComponent, [{
+        type: Component,
+        args: [{ selector: "mis-actions-cell", template: "<div class=\"actions-cell-container\" [ngStyle]=\"containerStyle\">\n  <!-- Inline Actions -->\n  <div *ngIf=\"actionType === 'inline'\" class=\"inline-actions\">\n    <div\n      *ngFor=\"let item of actionItems; trackBy: trackByAction\"\n      class=\"action-item\"\n      [ngClass]=\"{ disabled: isDisabled(item) }\"\n      (click)=\"onActionClick(item, $event)\"\n    >\n      <img [src]=\"item.icon\" [alt]=\"item.label\" class=\"action-icon-svg\" />\n    </div>\n  </div>\n\n  <!-- Dropdown Actions -->\n  <div *ngIf=\"actionType === 'dropdown'\" class=\"dropdown-actions\">\n    <div class=\"dropdown-trigger\" (click)=\"toggleDropdown($event)\" title=\"More actions\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n        <circle cx=\"10\" cy=\"4\" r=\"2\" fill=\"#333\" />\n        <circle cx=\"10\" cy=\"10\" r=\"2\" fill=\"#333\" />\n        <circle cx=\"10\" cy=\"16\" r=\"2\" fill=\"#333\" />\n      </svg>\n    </div>\n\n    <div class=\"dropdown-menu\" *ngIf=\"isDropdownOpen\" [ngClass]=\"menuAlign\">\n      <div\n        class=\"dropdown-menu-item\"\n        *ngFor=\"let item of actionItems\"\n        (click)=\"onDropdownItemClick(item, $event)\"\n        [ngClass]=\"{ disabled: isDisabled(item) }\"\n      >\n        <ng-container *ngIf=\"item.children?.length; else noChildren\">\n          <span class=\"dropdown-icon\" *ngIf=\"item.icon\">\n            <img [src]=\"item.icon\" />\n          </span>\n          <span class=\"dropdown-label\">{{ item.label }}</span>\n          <span class=\"submenu-arrow\">\n            <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\">\n              <path d=\"M9 6L15 12L9 18\" stroke=\"#0D1321\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </span>\n\n          <!-- DYNAMIC SUBMENU -->\n          <div class=\"dropdown-submenu\" [ngClass]=\"item.submenuAlign\" *ngIf=\"item.showSubmenu\">\n            <div\n              class=\"dropdown-menu-item\"\n              *ngFor=\"let child of item.children\"\n              [ngClass]=\"{ disabled: isDisabled(child) }\"\n              (click)=\"onDropdownItemClick(child, $event)\"\n            >\n              <span class=\"dropdown-icon\" *ngIf=\"child.icon\">\n                <img [src]=\"child.icon\" />\n              </span>\n              <span class=\"dropdown-label\">{{ child.label }}</span>\n            </div>\n          </div>\n        </ng-container>\n\n        <ng-template #noChildren>\n          <span class=\"dropdown-icon\" *ngIf=\"item.icon\">\n            <img [src]=\"item.icon\" />\n          </span>\n          <span class=\"dropdown-label\">{{ item.label }}</span>\n        </ng-template>\n      </div>\n    </div>\n  </div>\n\n  <!-- Checkbox Actions -->\n  <div *ngIf=\"actionType === 'checkbox'\" class=\"checkbox-actions\">\n    <mis-checkbox [checked]=\"isChecked\" (valueChange)=\"onCheckboxChange($event)\"  [disabled]=\"disable ? disable(data) : false\"\n    > </mis-checkbox>\n  </div>\n</div>\n", styles: [".actions-cell-container{display:flex;align-items:center;justify-content:center;width:100%;height:100%;position:relative;box-sizing:border-box}.inline-actions{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;height:100%;flex-wrap:nowrap;padding:4px 0;flex-direction:row}.action-item{display:flex;align-items:center;justify-content:center;height:20px;border-radius:4px;cursor:pointer;transition:all .2s ease;background-color:transparent;border:none;outline:none;flex-shrink:0;min-height:20px}.action-item:hover:not(.disabled){background-color:#0000000a;transform:scale(1.05)}.action-item:active:not(.disabled){transform:scale(.95)}.action-item.disabled{opacity:.5;cursor:not-allowed}.action-item.disabled:hover{background-color:transparent;transform:none}.action-icon{font-size:16px;color:#666;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.action-icon-svg{width:18px;height:18px;object-fit:contain;filter:brightness(0) saturate(100%) invert(40%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(.6) contrast(1);flex-shrink:0}.action-icon-svg:hover{filter:brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0) contrast(1)}.dropdown-trigger{cursor:pointer}.dropdown-actions{position:relative}.dropdown-trigger{cursor:pointer;display:flex;align-items:center;justify-content:center}.dropdown-menu{position:absolute;top:100%;width:232px;background:#fff;border-radius:12px;box-shadow:0 4px 24px #0000001f;z-index:1000;padding:8px 0}.dropdown-menu.left{right:0!important;left:auto!important}.dropdown-menu.right{left:0!important;right:auto!important}.dropdown-menu-item.disabled{color:#aaa;cursor:not-allowed}.dropdown-menu-item:hover:not(.disabled),.dropdown-menu-item.has-submenu:hover{background:#f5f5f5}.dropdown-menu-item{display:flex;align-items:center;padding:10px 18px;cursor:pointer;font-size:14px;position:relative}.dropdown-menu-item .dropdown-label{flex:1;margin-left:8px}.dropdown-menu-item .submenu-arrow{margin-left:auto;width:16px;height:16px}.submenu-container{position:absolute;top:0;left:100%;margin-left:4px;background:#fff;box-shadow:0 4px 8px #0000001a;border-radius:8px;z-index:1000;white-space:nowrap}.dropdown-submenu{position:absolute;top:0;min-width:132px;background:#fff;border-radius:12px;box-shadow:0 4px 24px #0000001f;padding:8px 0;z-index:1001}.dropdown-submenu.right{left:100%;margin-left:4px}.dropdown-submenu.left{left:auto;right:100%;background-color:#fff;border:1px solid #ddd;z-index:9999;position:absolute;margin-right:4px}.submenu-arrow{display:flex;align-items:center;margin-left:auto;z-index:9999}.dropdown-icon{display:flex;justify-content:center;align-items:center}.dropdown-menu-item.disabled{color:#181f33;filter:grayscale(100%) opacity(.3);cursor:not-allowed}\n"] }]
+    }], null, { rowData: [{
+            type: Input
+        }], isChecked: [{
+            type: Input
+        }], config: [{
+            type: Input
+        }], actionClick: [{
+            type: Output
+        }], dropdownToggled: [{
+            type: Output
+        }], onDocumentClick: [{
+            type: HostListener,
+            args: ["document:click"]
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ActionsCellComponent, { className: "ActionsCellComponent" }); })();
+
+const _c0$2 = ["filter"];
+const _c1$2 = ["table"];
+const _c2$2 = ["colHeaderRef"];
+const _c3$1 = (a0, a1, a2) => ({ height: a0, width: a1, "overflow-x": a2 });
+const _c4$1 = (a0, a1, a2) => ({ "no-scrollbar": a0, scrollbar: a1, "scroll-horizontally": a2 });
+const _c5$1 = (a0, a1, a2) => ({ width: a0, cursor: a1, "justify-content": a2 });
+const _c6$1 = (a0, a1) => ({ "t-row-hover": a0, "active-row": a1 });
+const _c7$1 = a0 => ({ "min-height": a0 });
+const _c8 = a0 => ({ width: a0 });
+const _c9 = a0 => ({ "t-col-container-hover": a0 });
+const _c10 = (a0, a1) => ({ width: "100%", cursor: a0, "justify-content": a1 });
+const _c11 = a0 => ({ color: a0 });
+const _c12 = a0 => ({ "text-ellipsis": a0 });
+const _c13 = a0 => ({ "disable-actions": a0 });
+const _c14 = () => ({ display: "flex", justifyContent: "center", alignItems: "center", padding: "16px" });
+const _c15 = a0 => ({ "page-active": a0 });
+const _c16 = () => ({ display: "flex" });
+const _c17 = () => ({ "margin-right": "4px" });
+function TableComponent_mis_table_filter_1_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mis-table-filter", 11, 1);
+    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)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const row_r17 = ctx.$implicit;
-    const i_r9 = ctx.index;
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵclassProp("disabled-row", ctx_r1.isRowDisabled(row_r17));
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction2(6, _c6$1, ctx_r1.config.cellHover, ctx_r1.activeRowIndex.includes(i_r9)))("ngStyle", i0.ɵɵpureFunction1(9, _c7$1, (ctx_r1.config == null ? null : ctx_r1.config.rowConfig == null ? null : ctx_r1.config.rowConfig.height) ? ctx_r1.config.rowConfig.height : "44px"));
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", row_r17);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", (ctx_r1.config == null ? null : ctx_r1.config.canExpand) && ctx_r1.expandedIndex === i_r9);
+    i0.ɵɵproperty("containerStyles", ctx_r1.filterContainerStyles)("filtersData", ctx_r1.filterData);
 } }
-function TableComponent_div_8_ng_container_7_div_1_span_1_Template(rf, ctx) { if (rf & 1) {
-    const _r19 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 51);
-    i0.ɵɵlistener("click", function TableComponent_div_8_ng_container_7_div_1_span_1_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r19); const pageNumber_r20 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.updateSelectedPage(pageNumber_r20)); });
+function TableComponent_div_5_p_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 18);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const pageNumber_r20 = i0.ɵɵnextContext().$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(2, _c15, pageNumber_r20 == (ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.selectedPage)));
+    const colHeader_r4 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(pageNumber_r20);
+    i0.ɵɵtextInterpolate1(" ", (colHeader_r4 == null ? null : colHeader_r4.data) || " ", " ");
 } }
-function TableComponent_div_8_ng_container_7_div_1_span_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 52)(1, "div", 39);
-    i0.ɵɵelement(2, "span", 53)(3, "span", 53)(4, "span", 54);
+function TableComponent_div_5_span_3_span_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "span", 23);
+} }
+function TableComponent_div_5_span_3_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "span", 19);
+    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 = colHeader_r4.filters; ctx_r1.toggleFilter(colHeader_r4.data); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵtemplate(1, TableComponent_div_5_span_3_span_1_Template, 1, 0, "span", 20);
+    i0.ɵɵnamespaceSVG();
+    i0.ɵɵelementStart(2, "svg", 21);
+    i0.ɵɵelement(3, "path", 22);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
+    const colHeader_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(3, _c16));
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(4, _c17));
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(5, _c17));
+    i0.ɵɵproperty("ngIf", (ctx_r1.appliedFilters[colHeader_r4.data] == null ? null : ctx_r1.appliedFilters[colHeader_r4.data].length) > 0);
 } }
-function TableComponent_div_8_ng_container_7_div_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div");
-    i0.ɵɵtemplate(1, TableComponent_div_8_ng_container_7_div_1_span_1_Template, 2, 4, "span", 49)(2, TableComponent_div_8_ng_container_7_div_1_span_2_Template, 5, 6, "span", 50);
+function TableComponent_div_5_span_4_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "span", 24);
+    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()); });
+    i0.ɵɵelement(1, "mis-checkbox", 25);
     i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const pageNumber_r20 = ctx.$implicit;
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", pageNumber_r20 != 0);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", pageNumber_r20 == 0);
-} }
-function TableComponent_div_8_ng_container_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, TableComponent_div_8_ng_container_7_div_1_Template, 3, 2, "div", 48);
-    i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r1.pages);
+    i0.ɵɵproperty("checked", ctx_r1.selectAllCheckbox);
 } }
-function TableComponent_div_8_Template(rf, ctx) { if (rf & 1) {
-    const _r18 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 41)(1, "p", 42);
-    i0.ɵɵtext(2);
+function TableComponent_div_5_span_5_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "span", 26);
+    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)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 43)(4, "span", 44);
-    i0.ɵɵlistener("click", function TableComponent_div_8_Template_span_click_4_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView((ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.selectedPage) > 1 && ctx_r1.updateSelectedPage((ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.selectedPage) - 1)); });
-    i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(5, "svg", 45);
-    i0.ɵɵelement(6, "path", 46);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(7, TableComponent_div_8_ng_container_7_Template, 2, 1, "ng-container", 17);
-    i0.ɵɵnamespaceHTML();
-    i0.ɵɵelementStart(8, "span", 44);
-    i0.ɵɵlistener("click", function TableComponent_div_8_Template_span_click_8_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView((ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.selectedPage) < (ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.noOfPages) && ctx_r1.updateSelectedPage((ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.selectedPage) + 1)); });
-    i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(9, "svg", 45);
+} if (rf & 2) {
+    const colHeader_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("column", colHeader_r4)("activeSort", ctx_r1.currentSort)("activeSorts", ctx_r1.multiColumnSort)("multiColumnSort", ctx_r1.config.multiColumnSort);
+} }
+function TableComponent_div_5_6_ng_template_0_Template(rf, ctx) { }
+function TableComponent_div_5_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, TableComponent_div_5_6_ng_template_0_Template, 0, 0, "ng-template", 27);
+} if (rf & 2) {
+    const colHeader_r4 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("customComponent", colHeader_r4 == null ? null : colHeader_r4.componentRef)("data", colHeader_r4.data);
+} }
+function TableComponent_div_5_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 12, 2);
+    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); });
+    i0.ɵɵtemplate(2, TableComponent_div_5_p_2_Template, 2, 1, "p", 13)(3, TableComponent_div_5_span_3_Template, 4, 1, "span", 14)(4, TableComponent_div_5_span_4_Template, 2, 1, "span", 15)(5, TableComponent_div_5_span_5_Template, 1, 4, "span", 16)(6, TableComponent_div_5_6_Template, 1, 2, null, 17);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const colHeader_r4 = ctx.$implicit;
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction3(6, _c5$1, (colHeader_r4 == null ? null : colHeader_r4.style == null ? null : colHeader_r4.style.width) || "", colHeader_r4.action ? "pointer" : "default", (colHeader_r4 == null ? null : colHeader_r4.style == null ? null : colHeader_r4.style.justifyContent) ? colHeader_r4 == null ? null : colHeader_r4.style == null ? null : colHeader_r4.style.justifyContent : colHeader_r4.type === "number" ? "flex-end" : "space-between"));
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.type) !== "custom" && (colHeader_r4 == null ? null : colHeader_r4.type) !== "checkbox");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.type) !== "custom" && (colHeader_r4 == null ? null : colHeader_r4.filters) && (colHeader_r4 == null ? null : colHeader_r4.filters == null ? null : colHeader_r4.filters.length) > 0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.type) === "checkbox");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.isSortable) && !(colHeader_r4 == null ? null : colHeader_r4.filters));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", (colHeader_r4 == null ? null : colHeader_r4.type) === "custom");
+} }
+function TableComponent_div_7_div_2_p_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 36);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r13 = i0.ɵɵnextContext();
+    const col_r12 = ctx_r13.$implicit;
+    const i_r13 = ctx_r13.index;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(3, _c11, (ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.color) ? ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.color : ""))("ngClass", i0.ɵɵpureFunction1(5, _c12, !!(ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.textEllipsis)));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", col_r12, " ");
+} }
+function TableComponent_div_7_div_2_3_ng_template_0_Template(rf, ctx) { }
+function TableComponent_div_7_div_2_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, TableComponent_div_7_div_2_3_ng_template_0_Template, 0, 0, "ng-template", 27);
+} if (rf & 2) {
+    const ctx_r13 = i0.ɵɵnextContext();
+    const col_r12 = ctx_r13.$implicit;
+    const i_r13 = ctx_r13.index;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("customComponent", ctx_r1.config.colConfig[i_r13].componentRef)("data", col_r12);
+} }
+function TableComponent_div_7_div_2_mis_actions_cell_4_Template(rf, ctx) { if (rf & 1) {
+    const _r15 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mis-actions-cell", 37);
+    i0.ɵɵlistener("actionClick", function TableComponent_div_7_div_2_mis_actions_cell_4_Template_mis_actions_cell_actionClick_0_listener($event) { i0.ɵɵrestoreView(_r15); const rowIndex_r16 = i0.ɵɵnextContext(2).index; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onActionClick($event, rowIndex_r16)); })("dropdownToggled", function TableComponent_div_7_div_2_mis_actions_cell_4_Template_mis_actions_cell_dropdownToggled_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.closeOtherDropdowns($event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r13 = i0.ɵɵnextContext();
+    const col_r12 = ctx_r13.$implicit;
+    const i_r13 = ctx_r13.index;
+    const row_r17 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("rowData", col_r12)("config", ctx_r1.config.colConfig[i_r13])("isChecked", col_r12.isChecked)("ngClass", i0.ɵɵpureFunction1(4, _c13, (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].actionType) === "checkbox" && ctx_r1.isRowDisabled(row_r17)));
+} }
+function TableComponent_div_7_div_2_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 32);
+    i0.ɵɵlistener("click", function TableComponent_div_7_div_2_Template_div_click_0_listener() { const ctx_r10 = i0.ɵɵrestoreView(_r10); const col_r12 = ctx_r10.$implicit; const i_r13 = ctx_r10.index; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView((ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].action) && (ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].actionType) !== "checkbox" ? ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].action(col_r12) : null); });
+    i0.ɵɵelementStart(1, "div", 33);
+    i0.ɵɵtemplate(2, TableComponent_div_7_div_2_p_2_Template, 2, 7, "p", 34)(3, TableComponent_div_7_div_2_3_Template, 1, 2, null, 17)(4, TableComponent_div_7_div_2_mis_actions_cell_4_Template, 1, 6, "mis-actions-cell", 35);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const i_r13 = ctx.index;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(8, _c8, (ctx_r1.config == null ? null : ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.width) || (ctx_r1.config == null ? null : ctx_r1.config.colHeaderConfig[i_r13] == null ? null : ctx_r1.config.colHeaderConfig[i_r13].style == null ? null : ctx_r1.config.colHeaderConfig[i_r13].style.width) || ""))("ngClass", i0.ɵɵpureFunction1(10, _c9, ctx_r1.config.cellHover));
+    i0.ɵɵadvance();
+    i0.ɵɵstyleMap(ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style);
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction2(12, _c10, (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].action) ? "pointer" : "default", (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.justifyContent) ? ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].style == null ? null : ctx_r1.config.colConfig[i_r13].style.justifyContent : (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].type) === "number" ? "flex-end" : "space-between"));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].type) !== "custom" && (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].type) !== "actions");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].type) === "custom");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", (ctx_r1.config.colConfig[i_r13] == null ? null : ctx_r1.config.colConfig[i_r13].type) === "actions");
+} }
+function TableComponent_div_7_div_3_ng_container_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵelementStart(1, "div", 39);
+    i0.ɵɵtext(2, " Loading... ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(1, _c14));
+} }
+function TableComponent_div_7_div_3_ng_container_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵelementStart(1, "div", 39);
+    i0.ɵɵtext(2, " No Data Available... ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(1, _c14));
+} }
+function TableComponent_div_7_div_3_ng_container_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵelement(1, "sub-table", 40);
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("config", ctx_r1.subTableconfig)("tableData", ctx_r1.subTableData);
+} }
+function TableComponent_div_7_div_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 38);
+    i0.ɵɵtemplate(1, TableComponent_div_7_div_3_ng_container_1_Template, 3, 2, "ng-container", 17)(2, TableComponent_div_7_div_3_ng_container_2_Template, 3, 2, "ng-container", 17)(3, TableComponent_div_7_div_3_ng_container_3_Template, 2, 2, "ng-container", 17);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r1.subTableDataLoading);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading && ctx_r1.subTableData.length === 0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", !ctx_r1.subTableDataLoading && ctx_r1.subTableData.length > 0);
+} }
+function TableComponent_div_7_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 28)(1, "div", 29);
+    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)); });
+    i0.ɵɵtemplate(2, TableComponent_div_7_div_2_Template, 5, 15, "div", 30);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(3, TableComponent_div_7_div_3_Template, 4, 3, "div", 31);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const row_r17 = ctx.$implicit;
+    const i_r9 = ctx.index;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("disabled-row", ctx_r1.isRowDisabled(row_r17));
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction2(6, _c6$1, ctx_r1.config.cellHover, ctx_r1.activeRowIndex.includes(i_r9)))("ngStyle", i0.ɵɵpureFunction1(9, _c7$1, (ctx_r1.config == null ? null : ctx_r1.config.rowConfig == null ? null : ctx_r1.config.rowConfig.height) ? ctx_r1.config.rowConfig.height : "44px"));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngForOf", row_r17);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", (ctx_r1.config == null ? null : ctx_r1.config.canExpand) && ctx_r1.expandedIndex === i_r9);
+} }
+function TableComponent_div_8_ng_container_7_div_1_span_1_Template(rf, ctx) { if (rf & 1) {
+    const _r19 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "span", 51);
+    i0.ɵɵlistener("click", function TableComponent_div_8_ng_container_7_div_1_span_1_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r19); const pageNumber_r20 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.updateSelectedPage(pageNumber_r20)); });
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const pageNumber_r20 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(2, _c15, pageNumber_r20 == (ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.selectedPage)));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(pageNumber_r20);
+} }
+function TableComponent_div_8_ng_container_7_div_1_span_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 52)(1, "div", 39);
+    i0.ɵɵelement(2, "span", 53)(3, "span", 53)(4, "span", 54);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(3, _c16));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(4, _c17));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(5, _c17));
+} }
+function TableComponent_div_8_ng_container_7_div_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div");
+    i0.ɵɵtemplate(1, TableComponent_div_8_ng_container_7_div_1_span_1_Template, 2, 4, "span", 49)(2, TableComponent_div_8_ng_container_7_div_1_span_2_Template, 5, 6, "span", 50);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const pageNumber_r20 = ctx.$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", pageNumber_r20 != 0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", pageNumber_r20 == 0);
+} }
+function TableComponent_div_8_ng_container_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵtemplate(1, TableComponent_div_8_ng_container_7_div_1_Template, 3, 2, "div", 48);
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngForOf", ctx_r1.pages);
+} }
+function TableComponent_div_8_Template(rf, ctx) { if (rf & 1) {
+    const _r18 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 41)(1, "p", 42);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 43)(4, "span", 44);
+    i0.ɵɵlistener("click", function TableComponent_div_8_Template_span_click_4_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView((ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.selectedPage) > 1 && ctx_r1.updateSelectedPage((ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.selectedPage) - 1)); });
+    i0.ɵɵnamespaceSVG();
+    i0.ɵɵelementStart(5, "svg", 45);
+    i0.ɵɵelement(6, "path", 46);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(7, TableComponent_div_8_ng_container_7_Template, 2, 1, "ng-container", 17);
+    i0.ɵɵnamespaceHTML();
+    i0.ɵɵelementStart(8, "span", 44);
+    i0.ɵɵlistener("click", function TableComponent_div_8_Template_span_click_8_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView((ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.selectedPage) < (ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.noOfPages) && ctx_r1.updateSelectedPage((ctx_r1.config.paginationConfig == null ? null : ctx_r1.config.paginationConfig.selectedPage) + 1)); });
+    i0.ɵɵnamespaceSVG();
+    i0.ɵɵelementStart(9, "svg", 45);
     i0.ɵɵelement(10, "path", 47);
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
@@ -552,41 +863,49 @@ class TableComponent {
     }
     toggleCheckbox() {
         this.selectAllCheckbox = !this.selectAllCheckbox;
-        // Find the checkbox column index (if any)
-        const checkboxColIndex = this.config.colHeaderConfig.findIndex(col => col.type === "checkbox");
-        // Only update if checkbox column exists
+        const checkboxColIndex = this.config.colConfig.findIndex(col => col.type === 'actions' && col.actionType === 'checkbox');
         if (checkboxColIndex !== -1) {
+            const checkboxConfig = this.config.colConfig[checkboxColIndex];
             this.tableData = this.tableData.map((row) => {
                 const updatedRow = [...row];
-                updatedRow[checkboxColIndex] = this.selectAllCheckbox;
+                const currentCheckbox = updatedRow[checkboxColIndex];
+                const isDisabled = checkboxConfig?.disable && checkboxConfig.disable(currentCheckbox);
+                if (!isDisabled) {
+                    updatedRow[checkboxColIndex] = {
+                        ...currentCheckbox,
+                        isChecked: this.selectAllCheckbox
+                    };
+                }
                 return updatedRow;
             });
+            this.headerAction?.emit({
+                type: "checkboxToggle",
+                payload: this.tableData
+            });
         }
-        // Call the header action callback with updated state
-        const checkboxHeader = this.config.colHeaderConfig[checkboxColIndex];
-        if (checkboxHeader?.action) {
-            checkboxHeader.action({
-                type: "checkbox",
-                isChecked: this.selectAllCheckbox,
-                tableData: this.tableData
+    }
+    closeOtherDropdowns(exceptComponent) {
+        if (this.actionCells) {
+            this.actionCells.forEach(cell => {
+                if (cell !== exceptComponent) {
+                    cell.closeDropdown();
+                }
             });
         }
-        this.headerAction?.emit({
-            type: "checkboxToggle",
-            payload: this.tableData
-        });
     }
     static { this.ɵfac = function TableComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TableComponent)(i0.ɵɵdirectiveInject(i0.Renderer2)); }; }
     static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TableComponent, selectors: [["mis-table"]], viewQuery: function TableComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$3, 5);
+            i0.ɵɵviewQuery(_c0$2, 5);
             i0.ɵɵviewQuery(_c1$2, 5);
             i0.ɵɵviewQuery(_c2$2, 5);
+            i0.ɵɵviewQuery(ActionsCellComponent, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.filter = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.table = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.colHeaders = _t);
-        } }, inputs: { config: [0, "tableConfig", "config"], subTableconfig: "subTableconfig", tableDataLoading: "tableDataLoading", expandedIndex: "expandedIndex", tableData: "tableData", subTableData: "subTableData", subTableDataLoading: "subTableDataLoading" }, outputs: { filtersUpdated: "filtersUpdated", pageSelected: "pageSelected", sortChange: "sortChange", headerAction: "headerAction" }, features: [i0.ɵɵNgOnChangesFeature], decls: 9, vars: 15, consts: [["table", ""], ["filter", ""], ["colHeaderRef", ""], ["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, "rowData", "config", "isChecked", "ngClass", "actionClick", 4, "ngIf"], [1, "t-col-text", 3, "ngStyle", "ngClass"], [3, "actionClick", "rowData", "config", "isChecked", "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) {
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.actionCells = _t);
+        } }, inputs: { config: [0, "tableConfig", "config"], subTableconfig: "subTableconfig", tableDataLoading: "tableDataLoading", expandedIndex: "expandedIndex", tableData: "tableData", subTableData: "subTableData", subTableDataLoading: "subTableDataLoading" }, outputs: { filtersUpdated: "filtersUpdated", pageSelected: "pageSelected", sortChange: "sortChange", headerAction: "headerAction" }, features: [i0.ɵɵNgOnChangesFeature], decls: 9, vars: 15, consts: [["table", ""], ["filter", ""], ["colHeaderRef", ""], ["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, "rowData", "config", "isChecked", "ngClass", "actionClick", "dropdownToggled", 4, "ngIf"], [1, "t-col-text", 3, "ngStyle", "ngClass"], [3, "actionClick", "dropdownToggled", "rowData", "config", "isChecked", "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) {
             i0.ɵɵelementStart(0, "div", 3);
             i0.ɵɵtemplate(1, TableComponent_mis_table_filter_1_Template, 2, 2, "mis-table-filter", 4);
             i0.ɵɵelementStart(2, "div", 5, 0)(4, "div", 6);
@@ -615,7 +934,7 @@ class TableComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TableComponent, [{
         type: Component,
-        args: [{ selector: "mis-table", template: "<div\n  [ngStyle]=\"{\n    height: getContainerHeight(),\n    width: getContainerWidth(),\n    'overflow-x': config.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': config.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 config?.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 = 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]=\"config.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': config.cellHover, 'active-row': activeRowIndex.includes(i) }\"\n          [ngStyle]=\"{ 'min-height': config?.rowConfig?.height ? config.rowConfig.height : '44px' }\"\n          (click)=\"selectRow(i)\"\n          [class.disabled-row]=\"isRowDisabled(row)\"\n          >\n          <div\n            (click)=\"config?.colConfig[i]?.action && config?.colConfig[i]?.actionType !== 'checkbox' ? config?.colConfig[i]?.action(col) : null\"\n            *ngFor=\"let col of row; let i = index\"\n            [ngStyle]=\"{\n              width: config?.colConfig[i]?.style?.width || config?.colHeaderConfig[i]?.style?.width || ''\n            }\"\n            class=\"t-col-container\"\n            [ngClass]=\"{ 't-col-container-hover': config.cellHover }\"\n          >\n            <div\n              class=\"t-col\"\n              [style]=\"config.colConfig[i]?.style\"\n              [ngStyle]=\"{\n                width: '100%',\n                cursor: config.colConfig[i]?.action ? 'pointer' : 'default',\n                'justify-content': config.colConfig[i]?.style?.justifyContent\n                  ? config.colConfig[i]?.style?.justifyContent\n                  : config.colConfig[i]?.type === 'number'\n                  ? 'flex-end'\n                  : 'space-between'\n              }\"\n            >\n              <p\n                *ngIf=\"config.colConfig[i]?.type !== 'custom' && config.colConfig[i]?.type !== 'actions'\"\n                [ngStyle]=\"{\n                  color: config?.colConfig[i]?.style?.color ? config?.colConfig[i]?.style?.color : ''\n                }\"\n                [ngClass]=\"{'text-ellipsis': !!config?.colConfig[i]?.style?.textEllipsis}\"\n                class=\"t-col-text\"\n              >\n                {{ col }}\n              </p>\n              <ng-template\n                *ngIf=\"config.colConfig[i]?.type === 'custom'\"\n                [customComponent]=\"config.colConfig[i].componentRef\"\n                [data]=\"col\"\n                customTableCell\n              ></ng-template>\n                <mis-actions-cell\n                  *ngIf=\"config.colConfig[i]?.type === 'actions'\"\n                  [rowData]=\"col\"\n                  [config]=\"config.colConfig[i]\"\n                  [isChecked]=\"col.isChecked\"\n                  (actionClick)=\"onActionClick($event, rowIndex)\"\n                  [ngClass]=\"{\n                    'disable-actions': config.colConfig[i]?.actionType === 'checkbox' && isRowDisabled(row)\n                  }\"\n                ></mis-actions-cell>\n\n            </div>\n          </div>\n        </div>\n        <div *ngIf=\"config?.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=\"config?.paginationConfig && (tableLength >= config.paginationConfig.rowsPerPage || config.paginationConfig?.selectedPage !== 1)\"\n    id=\"pagination-container\"\n  >\n    <p id=\"pagination-text\">\n      Showing\n      {{ (config.paginationConfig?.selectedPage - 1) * config.paginationConfig.rowsPerPage + 1 }}-{{\n        (config.paginationConfig?.selectedPage - 1) * config.paginationConfig.rowsPerPage + tableLength\n      }}\n      of {{ config.paginationConfig.totalNoOfRows }} items\n    </p>\n    <div id=\"pages-container\">\n      <span   (click)=\"config.paginationConfig?.selectedPage > 1 && updateSelectedPage(config.paginationConfig?.selectedPage - 1)\" class=\"page\" [class.page-nav-inactive]=\"config.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=\"!config.paginationConfig?.disablePageJumping\">\n          <div *ngFor=\"let pageNumber of pages\">\n            <span\n              (click)=\"updateSelectedPage(pageNumber)\"\n              *ngIf=\"pageNumber != 0\"\n              [ngClass]=\"{ 'page-active': pageNumber == config.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]=\"config.paginationConfig?.selectedPage === config.paginationConfig?.noOfPages\"\n      (click)=\"config.paginationConfig?.selectedPage < config.paginationConfig?.noOfPages && updateSelectedPage(config.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:#9aa7b4;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:#fff;width:100%;z-index:1;min-height:44px;border-bottom:1px solid #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:#16cbbc;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:#0937b2}.t-row{display:flex;min-height:44px;background-color:#fff;width:100%;border-bottom:1px solid #e0e0e0}.t-row:hover{background-color:#e7eefd}.active-row{background-color:#e6f6fd}.t-col-container{padding:0 16px;overflow-wrap:anywhere}.t-row-hover:hover{background-color:#0000}.t-col-container-hover:hover{background-color:#e6ebf7}.t-col-container-hover:first-child{border-left:1px solid #e0e0e0}.t-col-container-hover{border-right:1px solid #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:#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:#6a737d;margin-right:8px;cursor:pointer}.page.page-jumping-enabled{border:1px solid #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:#6a737d}.page-active{color:#0937b2;border:1px solid #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:#e6f5fd}.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}\n"] }]
+        args: [{ selector: "mis-table", template: "<div\n  [ngStyle]=\"{\n    height: getContainerHeight(),\n    width: getContainerWidth(),\n    'overflow-x': config.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': config.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 config?.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 = 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]=\"config.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': config.cellHover, 'active-row': activeRowIndex.includes(i) }\"\n          [ngStyle]=\"{ 'min-height': config?.rowConfig?.height ? config.rowConfig.height : '44px' }\"\n          (click)=\"selectRow(i)\"\n          [class.disabled-row]=\"isRowDisabled(row)\"\n          >\n          <div\n            (click)=\"config?.colConfig[i]?.action && config?.colConfig[i]?.actionType !== 'checkbox' ? config?.colConfig[i]?.action(col) : null\"\n            *ngFor=\"let col of row; let i = index\"\n            [ngStyle]=\"{\n              width: config?.colConfig[i]?.style?.width || config?.colHeaderConfig[i]?.style?.width || ''\n            }\"\n            class=\"t-col-container\"\n            [ngClass]=\"{ 't-col-container-hover': config.cellHover }\"\n          >\n            <div\n              class=\"t-col\"\n              [style]=\"config.colConfig[i]?.style\"\n              [ngStyle]=\"{\n                width: '100%',\n                cursor: config.colConfig[i]?.action ? 'pointer' : 'default',\n                'justify-content': config.colConfig[i]?.style?.justifyContent\n                  ? config.colConfig[i]?.style?.justifyContent\n                  : config.colConfig[i]?.type === 'number'\n                  ? 'flex-end'\n                  : 'space-between'\n              }\"\n            >\n              <p\n                *ngIf=\"config.colConfig[i]?.type !== 'custom' && config.colConfig[i]?.type !== 'actions'\"\n                [ngStyle]=\"{\n                  color: config?.colConfig[i]?.style?.color ? config?.colConfig[i]?.style?.color : ''\n                }\"\n                [ngClass]=\"{'text-ellipsis': !!config?.colConfig[i]?.style?.textEllipsis}\"\n                class=\"t-col-text\"\n              >\n                {{ col }}\n              </p>\n              <ng-template\n                *ngIf=\"config.colConfig[i]?.type === 'custom'\"\n                [customComponent]=\"config.colConfig[i].componentRef\"\n                [data]=\"col\"\n                customTableCell\n              ></ng-template>\n                <mis-actions-cell\n                  *ngIf=\"config.colConfig[i]?.type === 'actions'\"\n                  [rowData]=\"col\"\n                  [config]=\"config.colConfig[i]\"\n                  [isChecked]=\"col.isChecked\"\n                  (actionClick)=\"onActionClick($event, rowIndex)\"\n                  (dropdownToggled)=\"closeOtherDropdowns($event)\"\n                  [ngClass]=\"{\n                    'disable-actions': config.colConfig[i]?.actionType === 'checkbox' && isRowDisabled(row)\n                  }\"\n                ></mis-actions-cell>\n\n            </div>\n          </div>\n        </div>\n        <div *ngIf=\"config?.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=\"config?.paginationConfig && (tableLength >= config.paginationConfig.rowsPerPage || config.paginationConfig?.selectedPage !== 1)\"\n    id=\"pagination-container\"\n  >\n    <p id=\"pagination-text\">\n      Showing\n      {{ (config.paginationConfig?.selectedPage - 1) * config.paginationConfig.rowsPerPage + 1 }}-{{\n        (config.paginationConfig?.selectedPage - 1) * config.paginationConfig.rowsPerPage + tableLength\n      }}\n      of {{ config.paginationConfig.totalNoOfRows }} items\n    </p>\n    <div id=\"pages-container\">\n      <span   (click)=\"config.paginationConfig?.selectedPage > 1 && updateSelectedPage(config.paginationConfig?.selectedPage - 1)\" class=\"page\" [class.page-nav-inactive]=\"config.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=\"!config.paginationConfig?.disablePageJumping\">\n          <div *ngFor=\"let pageNumber of pages\">\n            <span\n              (click)=\"updateSelectedPage(pageNumber)\"\n              *ngIf=\"pageNumber != 0\"\n              [ngClass]=\"{ 'page-active': pageNumber == config.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]=\"config.paginationConfig?.selectedPage === config.paginationConfig?.noOfPages\"\n      (click)=\"config.paginationConfig?.selectedPage < config.paginationConfig?.noOfPages && updateSelectedPage(config.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:#9aa7b4;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:#fff;width:100%;z-index:1;min-height:44px;border-bottom:1px solid #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:#16cbbc;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:#0937b2}.t-row{display:flex;min-height:44px;background-color:#fff;width:100%;border-bottom:1px solid #e0e0e0}.t-row:hover{background-color:#e7eefd}.active-row{background-color:#e6f6fd}.t-col-container{padding:0 16px;overflow-wrap:anywhere}.t-row-hover:hover{background-color:#0000}.t-col-container-hover:hover{background-color:#e6ebf7}.t-col-container-hover:first-child{border-left:1px solid #e0e0e0}.t-col-container-hover{border-right:1px solid #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:#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:#6a737d;margin-right:8px;cursor:pointer}.page.page-jumping-enabled{border:1px solid #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:#6a737d}.page-active{color:#0937b2;border:1px solid #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:#e6f5fd}.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}\n"] }]
     }], () => [{ type: i0.Renderer2 }], { filtersUpdated: [{
             type: Output
         }], filter: [{
@@ -624,6 +943,9 @@ class TableComponent {
         }], colHeaders: [{
             type: ViewChildren,
             args: ["colHeaderRef"]
+        }], actionCells: [{
+            type: ViewChildren,
+            args: [ActionsCellComponent]
         }], pageSelected: [{
             type: Output
         }], config: [{
@@ -691,7 +1013,7 @@ class CustomTableCellDirective {
             type: Input
         }] }); })();
 
-const _c0$2 = ["table"];
+const _c0$1 = ["table"];
 const _c1$1 = (a0, a1) => ({ height: a0, width: a1 });
 const _c2$1 = (a0, a1, a2) => ({ height: a0, "border-top": a1, "border-bottom": a2 });
 const _c3 = (a0, a1, a2) => ({ width: a0, cursor: a1, "justify-content": a2 });
@@ -844,7 +1166,7 @@ class SubTableComponent {
     }
     static { this.ɵfac = function SubTableComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SubTableComponent)(i0.ɵɵdirectiveInject(i0.Renderer2)); }; }
     static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SubTableComponent, selectors: [["sub-table"]], viewQuery: function SubTableComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$2, 5);
+            i0.ɵɵviewQuery(_c0$1, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.table = _t.first);
@@ -863,7 +1185,7 @@ class SubTableComponent {
             i0.ɵɵproperty("minBufferPx", ctx.config.dataContainerMaxHeight || "400")("maxBufferPx", ctx.config.dataContainerMaxHeight + 200 || "600");
             i0.ɵɵadvance();
             i0.ɵɵproperty("cdkVirtualForOf", ctx.tableData);
-        } }, dependencies: [i1.NgForOf, i1.NgIf, i1.NgStyle, i2.CdkFixedSizeVirtualScroll, i2.CdkVirtualForOf, i2.CdkVirtualScrollViewport, CustomTableCellDirective], styles: ["#main-container[_ngcontent-%COMP%]{font-family:Lato,sans-serif}#table-container[_ngcontent-%COMP%]{height:inherit}#col-headers-container[_ngcontent-%COMP%]{display:flex;background-color:#fff;height:36px;border-bottom:1px solid #e0e0e0}#data-container[_ngcontent-%COMP%]{overflow:scroll;width:100%}#data-container[_ngcontent-%COMP%]::-webkit-scrollbar{width:8px}#data-container[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:#9aa7b4}.col-header[_ngcontent-%COMP%]{height:100%;width:160px;display:flex;align-items:center;padding:0 16px}.col-header-text[_ngcontent-%COMP%]{font-style:normal;font-weight:700;font-size:14px;line-height:20px;display:flex;align-items:center;letter-spacing:.25px;margin:0}.t-row[_ngcontent-%COMP%]{display:flex;align-items:center;height:36px;width:100%;border-bottom:1px solid #e0e0e0}.t-row[_ngcontent-%COMP%]:hover{background-color:#f1fdf8}.t-col-container[_ngcontent-%COMP%]{padding:0 16px;height:100%}.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;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:flex;align-items:center;letter-spacing:.2px;margin:0}"] }); }
+        } }, dependencies: [i1.NgForOf, i1.NgIf, i1.NgStyle, i2$1.CdkFixedSizeVirtualScroll, i2$1.CdkVirtualForOf, i2$1.CdkVirtualScrollViewport, CustomTableCellDirective], styles: ["#main-container[_ngcontent-%COMP%]{font-family:Lato,sans-serif}#table-container[_ngcontent-%COMP%]{height:inherit}#col-headers-container[_ngcontent-%COMP%]{display:flex;background-color:#fff;height:36px;border-bottom:1px solid #e0e0e0}#data-container[_ngcontent-%COMP%]{overflow:scroll;width:100%}#data-container[_ngcontent-%COMP%]::-webkit-scrollbar{width:8px}#data-container[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:#9aa7b4}.col-header[_ngcontent-%COMP%]{height:100%;width:160px;display:flex;align-items:center;padding:0 16px}.col-header-text[_ngcontent-%COMP%]{font-style:normal;font-weight:700;font-size:14px;line-height:20px;display:flex;align-items:center;letter-spacing:.25px;margin:0}.t-row[_ngcontent-%COMP%]{display:flex;align-items:center;height:36px;width:100%;border-bottom:1px solid #e0e0e0}.t-row[_ngcontent-%COMP%]:hover{background-color:#f1fdf8}.t-col-container[_ngcontent-%COMP%]{padding:0 16px;height:100%}.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;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:flex;align-items:center;letter-spacing:.2px;margin:0}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SubTableComponent, [{
         type: Component,
@@ -878,7 +1200,7 @@ class SubTableComponent {
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SubTableComponent, { className: "SubTableComponent" }); })();
 
-const _c0$1 = ["mainContainer"];
+const _c0 = ["mainContainer"];
 const _c1 = () => ({ "margin": "16px 0px" });
 const _c2 = () => ({ "margin-right": "8px" });
 function TableFilterComponent_div_8_Template(rf, ctx) { if (rf & 1) {
@@ -990,7 +1312,7 @@ class TableFilterComponent {
     }
     static { this.ɵfac = function TableFilterComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TableFilterComponent)(); }; }
     static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TableFilterComponent, selectors: [["mis-table-filter"]], viewQuery: function TableFilterComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$1, 5);
+            i0.ɵɵviewQuery(_c0, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.container = _t.first);
@@ -1034,7 +1356,7 @@ class TableFilterComponent {
             i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(7, _c1));
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction0(8, _c2));
-        } }, dependencies: [i1.NgForOf, i1.NgIf, i1.NgStyle, i2$1.CheckboxComponent], styles: ["#main-container[_ngcontent-%COMP%]{position:absolute;background:#fff;z-index:2;right:calc(50% - 128px);width:256px;padding:16px;font-family:Lato,sans-serif;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:8px}[_ngcontent-%COMP%]::-webkit-scrollbar{width:8px;height:8px}[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:#9aa7b4}#search-bar-container[_ngcontent-%COMP%]{width:100%;position:relative;margin-bottom:8px}input[_ngcontent-%COMP%]{width:100%;padding:12px 12px 12px 42px;border:solid 1px black;border-radius:4px;height:48px;box-shadow:none;outline:none;font-style:normal;font-weight:400;font-size:15px;line-height:20px;letter-spacing:.1px;color:#181f33}input[_ngcontent-%COMP%]:focus{border:solid 1px #0937b2}#search-icon[_ngcontent-%COMP%]{position:absolute;top:15px;left:12px}.filters-sub-container[_ngcontent-%COMP%]{max-height:144px;overflow-y:auto}.filter[_ngcontent-%COMP%]{height:36px;display:flex;justify-content:flex-start;align-items:center}.filter-text[_ngcontent-%COMP%]{font-size:14px;line-height:20px;padding-left:8px;letter-spacing:.2px;color:#181f33;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}#no-results-container[_ngcontent-%COMP%]{height:36px;display:flex;justify-content:center;align-items:center}.separator[_ngcontent-%COMP%]{border:1px solid #e0e0e0}#buttons-container[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center}button[_ngcontent-%COMP%]{width:calc(50% - 4px);border:none;box-shadow:none;outline:none;font-size:16px;line-height:24px;text-align:center;letter-spacing:.2px;padding:10px 30px;background:none;border-radius:8px}#apply-btn[_ngcontent-%COMP%]{background:#0937b2;color:#fff}#reset-btn[_ngcontent-%COMP%]{background:#fff;color:#0937b2}"] }); }
+        } }, dependencies: [i1.NgForOf, i1.NgIf, i1.NgStyle, i2.CheckboxComponent], styles: ["#main-container[_ngcontent-%COMP%]{position:absolute;background:#fff;z-index:2;right:calc(50% - 128px);width:256px;padding:16px;font-family:Lato,sans-serif;box-shadow:0 12px 24px #0000001f,0 4px 8px #0000001f;border-radius:8px}[_ngcontent-%COMP%]::-webkit-scrollbar{width:8px;height:8px}[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:#9aa7b4}#search-bar-container[_ngcontent-%COMP%]{width:100%;position:relative;margin-bottom:8px}input[_ngcontent-%COMP%]{width:100%;padding:12px 12px 12px 42px;border:solid 1px black;border-radius:4px;height:48px;box-shadow:none;outline:none;font-style:normal;font-weight:400;font-size:15px;line-height:20px;letter-spacing:.1px;color:#181f33}input[_ngcontent-%COMP%]:focus{border:solid 1px #0937b2}#search-icon[_ngcontent-%COMP%]{position:absolute;top:15px;left:12px}.filters-sub-container[_ngcontent-%COMP%]{max-height:144px;overflow-y:auto}.filter[_ngcontent-%COMP%]{height:36px;display:flex;justify-content:flex-start;align-items:center}.filter-text[_ngcontent-%COMP%]{font-size:14px;line-height:20px;padding-left:8px;letter-spacing:.2px;color:#181f33;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}#no-results-container[_ngcontent-%COMP%]{height:36px;display:flex;justify-content:center;align-items:center}.separator[_ngcontent-%COMP%]{border:1px solid #e0e0e0}#buttons-container[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center}button[_ngcontent-%COMP%]{width:calc(50% - 4px);border:none;box-shadow:none;outline:none;font-size:16px;line-height:24px;text-align:center;letter-spacing:.2px;padding:10px 30px;background:none;border-radius:8px}#apply-btn[_ngcontent-%COMP%]{background:#0937b2;color:#fff}#reset-btn[_ngcontent-%COMP%]{background:#fff;color:#0937b2}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TableFilterComponent, [{
         type: Component,
@@ -1188,294 +1510,6 @@ class SortIconsDirective {
             }]
     }], () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], null); })();
 
-const _c0 = a0 => ({ disabled: a0 });
-function ActionsCellComponent_div_1_div_1_Template(rf, ctx) { if (rf & 1) {
-    const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 7);
-    i0.ɵɵlistener("click", function ActionsCellComponent_div_1_div_1_Template_div_click_0_listener($event) { const item_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onActionClick(item_r2, $event)); });
-    i0.ɵɵelement(1, "img", 8);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const item_r2 = ctx.$implicit;
-    const ctx_r2 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c0, ctx_r2.isDisabled(item_r2)));
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("src", item_r2.icon, i0.ɵɵsanitizeUrl)("alt", item_r2.label);
-} }
-function ActionsCellComponent_div_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 5);
-    i0.ɵɵtemplate(1, ActionsCellComponent_div_1_div_1_Template, 2, 5, "div", 6);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r2.actionItems)("ngForTrackBy", ctx_r2.trackByAction);
-} }
-function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_span_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 26);
-    i0.ɵɵelement(1, "img", 27);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const item_r6 = i0.ɵɵnextContext(2).$implicit;
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("src", item_r6.icon, i0.ɵɵsanitizeUrl);
-} }
-function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_div_1_span_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 26);
-    i0.ɵɵelement(1, "img", 27);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const child_r8 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("src", child_r8.icon, i0.ɵɵsanitizeUrl);
-} }
-function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_div_1_Template(rf, ctx) { if (rf & 1) {
-    const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 18);
-    i0.ɵɵlistener("click", function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_div_1_Template_div_click_0_listener($event) { const child_r8 = i0.ɵɵrestoreView(_r7).$implicit; const ctx_r2 = i0.ɵɵnextContext(6); return i0.ɵɵresetView(ctx_r2.onDropdownItemClick(child_r8, $event)); });
-    i0.ɵɵtemplate(1, ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_div_1_span_1_Template, 2, 1, "span", 20);
-    i0.ɵɵelementStart(2, "span", 21);
-    i0.ɵɵtext(3);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const child_r8 = ctx.$implicit;
-    const ctx_r2 = i0.ɵɵnextContext(6);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c0, ctx_r2.isDisabled(child_r8)));
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", child_r8.icon);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(child_r8.label);
-} }
-function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 28);
-    i0.ɵɵtemplate(1, ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_div_1_Template, 4, 5, "div", 17);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const item_r6 = i0.ɵɵnextContext(2).$implicit;
-    i0.ɵɵproperty("ngClass", item_r6.submenuAlign);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", item_r6.children);
-} }
-function ActionsCellComponent_div_2_div_6_div_1_ng_container_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, ActionsCellComponent_div_2_div_6_div_1_ng_container_1_span_1_Template, 2, 1, "span", 20);
-    i0.ɵɵelementStart(2, "span", 21);
-    i0.ɵɵtext(3);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "span", 22);
-    i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(5, "svg", 23);
-    i0.ɵɵelement(6, "path", 24);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(7, ActionsCellComponent_div_2_div_6_div_1_ng_container_1_div_7_Template, 2, 2, "div", 25);
-    i0.ɵɵelementContainerEnd();
-} if (rf & 2) {
-    const item_r6 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", item_r6.icon);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(item_r6.label);
-    i0.ɵɵadvance(4);
-    i0.ɵɵproperty("ngIf", item_r6.showSubmenu);
-} }
-function ActionsCellComponent_div_2_div_6_div_1_ng_template_2_span_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 26);
-    i0.ɵɵelement(1, "img", 27);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const item_r6 = i0.ɵɵnextContext(2).$implicit;
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("src", item_r6.icon, i0.ɵɵsanitizeUrl);
-} }
-function ActionsCellComponent_div_2_div_6_div_1_ng_template_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, ActionsCellComponent_div_2_div_6_div_1_ng_template_2_span_0_Template, 2, 1, "span", 20);
-    i0.ɵɵelementStart(1, "span", 21);
-    i0.ɵɵtext(2);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const item_r6 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵproperty("ngIf", item_r6.icon);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(item_r6.label);
-} }
-function ActionsCellComponent_div_2_div_6_div_1_Template(rf, ctx) { if (rf & 1) {
-    const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 18);
-    i0.ɵɵlistener("click", function ActionsCellComponent_div_2_div_6_div_1_Template_div_click_0_listener($event) { const item_r6 = i0.ɵɵrestoreView(_r5).$implicit; const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.onDropdownItemClick(item_r6, $event)); });
-    i0.ɵɵtemplate(1, ActionsCellComponent_div_2_div_6_div_1_ng_container_1_Template, 8, 3, "ng-container", 19)(2, ActionsCellComponent_div_2_div_6_div_1_ng_template_2_Template, 3, 2, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const item_r6 = ctx.$implicit;
-    const noChildren_r9 = i0.ɵɵreference(3);
-    const ctx_r2 = i0.ɵɵnextContext(3);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(3, _c0, ctx_r2.isDisabled(item_r6)));
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", item_r6.children == null ? null : item_r6.children.length)("ngIfElse", noChildren_r9);
-} }
-function ActionsCellComponent_div_2_div_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 16);
-    i0.ɵɵtemplate(1, ActionsCellComponent_div_2_div_6_div_1_Template, 4, 5, "div", 17);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("ngClass", ctx_r2.menuAlign);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r2.actionItems);
-} }
-function ActionsCellComponent_div_2_Template(rf, ctx) { if (rf & 1) {
-    const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 9)(1, "div", 10);
-    i0.ɵɵlistener("click", function ActionsCellComponent_div_2_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.toggleDropdown($event)); });
-    i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(2, "svg", 11);
-    i0.ɵɵelement(3, "circle", 12)(4, "circle", 13)(5, "circle", 14);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(6, ActionsCellComponent_div_2_div_6_Template, 2, 2, "div", 15);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(6);
-    i0.ɵɵproperty("ngIf", ctx_r2.isDropdownOpen);
-} }
-function ActionsCellComponent_div_3_Template(rf, ctx) { if (rf & 1) {
-    const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 29)(1, "mis-checkbox", 30);
-    i0.ɵɵlistener("valueChange", function ActionsCellComponent_div_3_Template_mis_checkbox_valueChange_1_listener($event) { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onCheckboxChange($event)); });
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("checked", ctx_r2.isChecked);
-} }
-class ActionsCellComponent {
-    constructor() {
-        this.isChecked = false;
-        this.actionItems = [];
-        this.actionType = "inline";
-        this.submenuAlign = "right";
-        this.menuAlign = "left";
-        this.actionClick = new EventEmitter();
-        this.isDropdownOpen = false;
-        this._style = {};
-        this.containerStyle = {};
-    }
-    set rowData(value) {
-        this.data = value?.rowData ?? {};
-        this.isChecked = value?.isChecked ?? false;
-    }
-    set config(config) {
-        this.actionItems = config?.actionItems,
-            this.actionType = config.actionType,
-            this.submenuAlign = config.submenuAlign,
-            this.menuAlign = config.menuAlign;
-        this._style = config.style;
-        this.action = config.action;
-        this.processStyle();
-    }
-    ngOnInit() { }
-    processStyle() {
-        // Remove width from style to avoid conflicts with table column width
-        const { width, ...restStyle } = this._style;
-        this.containerStyle = restStyle;
-    }
-    onActionClick(item, event) {
-        event.stopPropagation();
-        // Check permissions before executing action
-        if (this.isDisabled(item))
-            return;
-        // Execute action only if permitted
-        if (item.action) {
-            item.action(this.data);
-        }
-        this.actionClick.emit({ item, data: this.data });
-    }
-    trackByAction(index, item) {
-        return item.value;
-    }
-    isSvgFile(iconPath) {
-        if (!iconPath)
-            return false;
-        return iconPath.toLowerCase().includes(".svg") || iconPath.toLowerCase().includes("assets/icons/");
-    }
-    onDocumentClick() {
-        if (this.isDropdownOpen) {
-            this.isDropdownOpen = false;
-        }
-    }
-    toggleDropdown(event) {
-        event.stopPropagation();
-        this.isDropdownOpen = !this.isDropdownOpen;
-        // Close all submenus when opening/closing main menu
-        this.actionItems.forEach((item) => (item.showSubmenu = false));
-    }
-    onDropdownItemClick(item, event) {
-        event.stopPropagation();
-        if (this.isDisabled(item))
-            return;
-        if (item?.children?.length) {
-            // Toggle submenu
-            item.showSubmenu = !item.showSubmenu;
-            // Optionally close other submenus
-            this.actionItems.forEach((i) => {
-                if (i !== item)
-                    i.showSubmenu = false;
-            });
-        }
-        else {
-            // Handle action
-            if (item.action)
-                item.action(this.data);
-            this.actionClick.emit({ item, data: this.data });
-            this.isDropdownOpen = false; // Only close if action was executed
-        }
-    }
-    onCheckboxChange(event) {
-        this.isChecked = event?.value ?? false;
-        this.actionClick.emit({
-            isChecked: this.isChecked,
-            data: this.data
-        });
-    }
-    isDisabled(item) {
-        if (typeof item.disable === "function") {
-            return item.disable(this.data);
-        }
-        return false;
-    }
-    static { this.ɵfac = function ActionsCellComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ActionsCellComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ActionsCellComponent, selectors: [["mis-actions-cell"]], hostBindings: function ActionsCellComponent_HostBindings(rf, ctx) { if (rf & 1) {
-            i0.ɵɵlistener("click", function ActionsCellComponent_click_HostBindingHandler() { return ctx.onDocumentClick(); }, false, i0.ɵɵresolveDocument);
-        } }, inputs: { rowData: "rowData", isChecked: "isChecked", config: "config" }, outputs: { actionClick: "actionClick" }, decls: 4, vars: 4, consts: [["noChildren", ""], [1, "actions-cell-container", 3, "ngStyle"], ["class", "inline-actions", 4, "ngIf"], ["class", "dropdown-actions", 4, "ngIf"], ["class", "checkbox-actions", 4, "ngIf"], [1, "inline-actions"], ["class", "action-item", 3, "ngClass", "click", 4, "ngFor", "ngForOf", "ngForTrackBy"], [1, "action-item", 3, "click", "ngClass"], [1, "action-icon-svg", 3, "src", "alt"], [1, "dropdown-actions"], ["title", "More actions", 1, "dropdown-trigger", 3, "click"], ["width", "20", "height", "20", "viewBox", "0 0 20 20", "fill", "none"], ["cx", "10", "cy", "4", "r", "2", "fill", "#333"], ["cx", "10", "cy", "10", "r", "2", "fill", "#333"], ["cx", "10", "cy", "16", "r", "2", "fill", "#333"], ["class", "dropdown-menu", 3, "ngClass", 4, "ngIf"], [1, "dropdown-menu", 3, "ngClass"], ["class", "dropdown-menu-item", 3, "ngClass", "click", 4, "ngFor", "ngForOf"], [1, "dropdown-menu-item", 3, "click", "ngClass"], [4, "ngIf", "ngIfElse"], ["class", "dropdown-icon", 4, "ngIf"], [1, "dropdown-label"], [1, "submenu-arrow"], ["width", "20", "height", "20", "viewBox", "0 0 24 24", "fill", "none"], ["d", "M9 6L15 12L9 18", "stroke", "#0D1321", "stroke-width", "2", "stroke-linecap", "round", "stroke-linejoin", "round"], ["class", "dropdown-submenu", 3, "ngClass", 4, "ngIf"], [1, "dropdown-icon"], [3, "src"], [1, "dropdown-submenu", 3, "ngClass"], [1, "checkbox-actions"], [3, "valueChange", "checked"]], template: function ActionsCellComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "div", 1);
-            i0.ɵɵtemplate(1, ActionsCellComponent_div_1_Template, 2, 2, "div", 2)(2, ActionsCellComponent_div_2_Template, 7, 1, "div", 3)(3, ActionsCellComponent_div_3_Template, 2, 1, "div", 4);
-            i0.ɵɵelementEnd();
-        } if (rf & 2) {
-            i0.ɵɵproperty("ngStyle", ctx.containerStyle);
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.actionType === "inline");
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.actionType === "dropdown");
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.actionType === "checkbox");
-        } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgStyle, i2$1.CheckboxComponent], styles: [".actions-cell-container[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;width:100%;height:100%;position:relative;box-sizing:border-box}.inline-actions[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;height:100%;flex-wrap:nowrap;padding:4px 0;flex-direction:row}.action-item[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;height:20px;border-radius:4px;cursor:pointer;transition:all .2s ease;background-color:transparent;border:none;outline:none;flex-shrink:0;min-height:20px}.action-item[_ngcontent-%COMP%]:hover:not(.disabled){background-color:#0000000a;transform:scale(1.05)}.action-item[_ngcontent-%COMP%]:active:not(.disabled){transform:scale(.95)}.action-item.disabled[_ngcontent-%COMP%]{opacity:.5;cursor:not-allowed}.action-item.disabled[_ngcontent-%COMP%]:hover{background-color:transparent;transform:none}.action-icon[_ngcontent-%COMP%]{font-size:16px;color:#666;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.action-icon-svg[_ngcontent-%COMP%]{width:18px;height:18px;object-fit:contain;filter:brightness(0) saturate(100%) invert(40%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(.6) contrast(1);flex-shrink:0}.action-icon-svg[_ngcontent-%COMP%]:hover{filter:brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0) contrast(1)}.dropdown-trigger[_ngcontent-%COMP%]{cursor:pointer}.dropdown-actions[_ngcontent-%COMP%]{position:relative}.dropdown-trigger[_ngcontent-%COMP%]{cursor:pointer;display:flex;align-items:center;justify-content:center}.dropdown-menu[_ngcontent-%COMP%]{position:absolute;top:100%;width:232px;background:#fff;border-radius:12px;box-shadow:0 4px 24px #0000001f;z-index:1000;padding:8px 0}.dropdown-menu.left[_ngcontent-%COMP%]{right:0!important;left:auto!important}.dropdown-menu.right[_ngcontent-%COMP%]{left:0!important;right:auto!important}.dropdown-menu-item.disabled[_ngcontent-%COMP%]{color:#aaa;cursor:not-allowed}.dropdown-menu-item[_ngcontent-%COMP%]:hover:not(.disabled), .dropdown-menu-item.has-submenu[_ngcontent-%COMP%]:hover{background:#f5f5f5}.dropdown-menu-item[_ngcontent-%COMP%]{display:flex;align-items:center;padding:10px 18px;cursor:pointer;font-size:14px;position:relative}.dropdown-menu-item[_ngcontent-%COMP%]   .dropdown-label[_ngcontent-%COMP%]{flex:1;margin-left:8px}.dropdown-menu-item[_ngcontent-%COMP%]   .submenu-arrow[_ngcontent-%COMP%]{margin-left:auto;width:16px;height:16px}.submenu-container[_ngcontent-%COMP%]{position:absolute;top:0;left:100%;margin-left:4px;background:#fff;box-shadow:0 4px 8px #0000001a;border-radius:8px;z-index:1000;white-space:nowrap}.dropdown-submenu[_ngcontent-%COMP%]{position:absolute;top:0;min-width:132px;background:#fff;border-radius:12px;box-shadow:0 4px 24px #0000001f;padding:8px 0;z-index:1001}.dropdown-submenu.right[_ngcontent-%COMP%]{left:100%;margin-left:4px}.dropdown-submenu.left[_ngcontent-%COMP%]{left:auto;right:100%;background-color:#fff;border:1px solid #ddd;z-index:9999;position:absolute;margin-right:4px}.submenu-arrow[_ngcontent-%COMP%]{display:flex;align-items:center;margin-left:auto;z-index:9999}.dropdown-icon[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center}.dropdown-menu-item.disabled[_ngcontent-%COMP%]{color:#181f33;filter:grayscale(100%) opacity(.3);cursor:not-allowed}"] }); }
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ActionsCellComponent, [{
-        type: Component,
-        args: [{ selector: "mis-actions-cell", template: "<div class=\"actions-cell-container\" [ngStyle]=\"containerStyle\">\n  <!-- Inline Actions -->\n  <div *ngIf=\"actionType === 'inline'\" class=\"inline-actions\">\n    <div\n      *ngFor=\"let item of actionItems; trackBy: trackByAction\"\n      class=\"action-item\"\n      [ngClass]=\"{ disabled: isDisabled(item) }\"\n      (click)=\"onActionClick(item, $event)\"\n    >\n      <img [src]=\"item.icon\" [alt]=\"item.label\" class=\"action-icon-svg\" />\n    </div>\n  </div>\n\n  <!-- Dropdown Actions -->\n  <div *ngIf=\"actionType === 'dropdown'\" class=\"dropdown-actions\">\n    <div class=\"dropdown-trigger\" (click)=\"toggleDropdown($event)\" title=\"More actions\">\n      <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n        <circle cx=\"10\" cy=\"4\" r=\"2\" fill=\"#333\" />\n        <circle cx=\"10\" cy=\"10\" r=\"2\" fill=\"#333\" />\n        <circle cx=\"10\" cy=\"16\" r=\"2\" fill=\"#333\" />\n      </svg>\n    </div>\n\n    <div class=\"dropdown-menu\" *ngIf=\"isDropdownOpen\" [ngClass]=\"menuAlign\">\n      <div\n        class=\"dropdown-menu-item\"\n        *ngFor=\"let item of actionItems\"\n        (click)=\"onDropdownItemClick(item, $event)\"\n        [ngClass]=\"{ disabled: isDisabled(item) }\"\n      >\n        <ng-container *ngIf=\"item.children?.length; else noChildren\">\n          <span class=\"dropdown-icon\" *ngIf=\"item.icon\">\n            <img [src]=\"item.icon\" />\n          </span>\n          <span class=\"dropdown-label\">{{ item.label }}</span>\n          <span class=\"submenu-arrow\">\n            <svg width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\">\n              <path d=\"M9 6L15 12L9 18\" stroke=\"#0D1321\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\n            </svg>\n          </span>\n\n          <!-- DYNAMIC SUBMENU -->\n          <div class=\"dropdown-submenu\" [ngClass]=\"item.submenuAlign\" *ngIf=\"item.showSubmenu\">\n            <div\n              class=\"dropdown-menu-item\"\n              *ngFor=\"let child of item.children\"\n              [ngClass]=\"{ disabled: isDisabled(child) }\"\n              (click)=\"onDropdownItemClick(child, $event)\"\n            >\n              <span class=\"dropdown-icon\" *ngIf=\"child.icon\">\n                <img [src]=\"child.icon\" />\n              </span>\n              <span class=\"dropdown-label\">{{ child.label }}</span>\n            </div>\n          </div>\n        </ng-container>\n\n        <ng-template #noChildren>\n          <span class=\"dropdown-icon\" *ngIf=\"item.icon\">\n            <img [src]=\"item.icon\" />\n          </span>\n          <span class=\"dropdown-label\">{{ item.label }}</span>\n        </ng-template>\n      </div>\n    </div>\n  </div>\n\n  <!-- Checkbox Actions -->\n  <div *ngIf=\"actionType === 'checkbox'\" class=\"checkbox-actions\">\n    <mis-checkbox [checked]=\"isChecked\" (valueChange)=\"onCheckboxChange($event)\"> </mis-checkbox>\n  </div>\n</div>\n", styles: [".actions-cell-container{display:flex;align-items:center;justify-content:center;width:100%;height:100%;position:relative;box-sizing:border-box}.inline-actions{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;height:100%;flex-wrap:nowrap;padding:4px 0;flex-direction:row}.action-item{display:flex;align-items:center;justify-content:center;height:20px;border-radius:4px;cursor:pointer;transition:all .2s ease;background-color:transparent;border:none;outline:none;flex-shrink:0;min-height:20px}.action-item:hover:not(.disabled){background-color:#0000000a;transform:scale(1.05)}.action-item:active:not(.disabled){transform:scale(.95)}.action-item.disabled{opacity:.5;cursor:not-allowed}.action-item.disabled:hover{background-color:transparent;transform:none}.action-icon{font-size:16px;color:#666;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.action-icon-svg{width:18px;height:18px;object-fit:contain;filter:brightness(0) saturate(100%) invert(40%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(.6) contrast(1);flex-shrink:0}.action-icon-svg:hover{filter:brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(0) contrast(1)}.dropdown-trigger{cursor:pointer}.dropdown-actions{position:relative}.dropdown-trigger{cursor:pointer;display:flex;align-items:center;justify-content:center}.dropdown-menu{position:absolute;top:100%;width:232px;background:#fff;border-radius:12px;box-shadow:0 4px 24px #0000001f;z-index:1000;padding:8px 0}.dropdown-menu.left{right:0!important;left:auto!important}.dropdown-menu.right{left:0!important;right:auto!important}.dropdown-menu-item.disabled{color:#aaa;cursor:not-allowed}.dropdown-menu-item:hover:not(.disabled),.dropdown-menu-item.has-submenu:hover{background:#f5f5f5}.dropdown-menu-item{display:flex;align-items:center;padding:10px 18px;cursor:pointer;font-size:14px;position:relative}.dropdown-menu-item .dropdown-label{flex:1;margin-left:8px}.dropdown-menu-item .submenu-arrow{margin-left:auto;width:16px;height:16px}.submenu-container{position:absolute;top:0;left:100%;margin-left:4px;background:#fff;box-shadow:0 4px 8px #0000001a;border-radius:8px;z-index:1000;white-space:nowrap}.dropdown-submenu{position:absolute;top:0;min-width:132px;background:#fff;border-radius:12px;box-shadow:0 4px 24px #0000001f;padding:8px 0;z-index:1001}.dropdown-submenu.right{left:100%;margin-left:4px}.dropdown-submenu.left{left:auto;right:100%;background-color:#fff;border:1px solid #ddd;z-index:9999;position:absolute;margin-right:4px}.submenu-arrow{display:flex;align-items:center;margin-left:auto;z-index:9999}.dropdown-icon{display:flex;justify-content:center;align-items:center}.dropdown-menu-item.disabled{color:#181f33;filter:grayscale(100%) opacity(.3);cursor:not-allowed}\n"] }]
-    }], null, { rowData: [{
-            type: Input
-        }], isChecked: [{
-            type: Input
-        }], config: [{
-            type: Input
-        }], actionClick: [{
-            type: Output
-        }], onDocumentClick: [{
-            type: HostListener,
-            args: ["document:click"]
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ActionsCellComponent, { className: "ActionsCellComponent" }); })();
-
 class TableModule {
     static forRoot() {
         return { ngModule: TableModule, providers: [] };
@@ -1517,7 +1551,7 @@ class TableModule {
         CustomTableCellDirective,
         SortIconsDirective,
         ActionsCellComponent] }); })();
-i0.ɵɵsetComponentScope(TableComponent, [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgStyle, i2$1.CheckboxComponent, SubTableComponent,
+i0.ɵɵsetComponentScope(TableComponent, [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgStyle, i2.CheckboxComponent, SubTableComponent,
     TableFilterComponent,
     CustomTableCellDirective,
     SortIconsDirective,