@wavemaker/app-ng-runtime 11.8.0-next.139432 → 11.8.0-next.141156

app-ng-runtime/components/data/table/bundles/index.umd.js

@@ -60,7 +60,7 @@
             ['gridfirstrowselect', i4.PROP_BOOLEAN],
             ['iconclass', i4.PROP_STRING],
             ['insertmessage', { value: 'Record added successfully', ...i4.PROP_STRING }],
-            ['isdynamictable', i4.PROP_BOOLEAN], // internal property to determine dynamic table
+            ['isdynamictable', i4.PROP_BOOLEAN],
             ['isrowexpansionenabled', i4.PROP_BOOLEAN],
             ['loadingdatamsg', { value: 'Loading...', ...i4.PROP_STRING }],
             ['loadingicon', { value: 'fa fa-circle-o-notch fa-spin', ...i4.PROP_STRING }],
@@ -109,40 +109,39 @@
     const _c14 = ["rowExpansionActionView"];
     const _c15 = ["dynamicTable"];
     const _c16 = ["wmTable", ""];
-    const _c17 = a0 => ({ btn: a0 });
-    const _c18 = (a0, a1) => ({ "btn-sm": a0, "disabled-new": a1 });
     function TableComponent_div_0_i_3_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelement(0, "i");
     } if (rf & 2) {
-        const ctx_r0 = i0__namespace.ɵɵnextContext(2);
-        i0__namespace.ɵɵclassMapInterpolate1("app-icon panel-icon ", ctx_r0.iconclass, "");
+        const ctx_r15 = i0__namespace.ɵɵnextContext(2);
+        i0__namespace.ɵɵclassMapInterpolate1("app-icon panel-icon ", ctx_r15.iconclass, "");
     } }
+    const _c17 = function (a0) { return { btn: a0 }; };
     function TableComponent_div_0_div_7_ng_container_1_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelementContainer(0, 29);
     } if (rf & 2) {
-        const btn_r2 = ctx.$implicit;
-        const index_r3 = ctx.index;
-        const ctx_r0 = i0__namespace.ɵɵnextContext(3);
-        const buttonRef_r4 = i0__namespace.ɵɵreference(8);
-        const anchorRef_r5 = i0__namespace.ɵɵreference(10);
-        i0__namespace.ɵɵproperty("ngTemplateOutlet", btn_r2.widgetType === "button" ? buttonRef_r4 : anchorRef_r5)("ngTemplateOutletContext", i0__namespace.ɵɵpureFunction1(3, _c17, btn_r2))("ngTemplateOutletInjector", ctx_r0.createCustomInjector("actions_header_" + index_r3, i0__namespace.ɵɵpureFunction1(5, _c17, btn_r2)));
+        const btn_r19 = ctx.$implicit;
+        i0__namespace.ɵɵnextContext(3);
+        const _r3 = i0__namespace.ɵɵreference(8);
+        const _r5 = i0__namespace.ɵɵreference(10);
+        i0__namespace.ɵɵproperty("ngTemplateOutlet", btn_r19.widgetType === "button" ? _r3 : _r5)("ngTemplateOutletContext", i0__namespace.ɵɵpureFunction1(2, _c17, btn_r19));
     } }
     function TableComponent_div_0_div_7_div_2_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelement(0, "div", 30);
     } if (rf & 2) {
-        const ctx_r0 = i0__namespace.ɵɵnextContext(3);
-        i0__namespace.ɵɵattributeInterpolate1("name", "", ctx_r0.name, "-export");
+        const ctx_r18 = i0__namespace.ɵɵnextContext(3);
+        i0__namespace.ɵɵattributeInterpolate1("name", "", ctx_r18.name, "-export");
     } }
     function TableComponent_div_0_div_7_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelementStart(0, "div", 26);
-        i0__namespace.ɵɵtemplate(1, TableComponent_div_0_div_7_ng_container_1_Template, 1, 7, "ng-container", 27)(2, TableComponent_div_0_div_7_div_2_Template, 1, 2, "div", 28);
+        i0__namespace.ɵɵtemplate(1, TableComponent_div_0_div_7_ng_container_1_Template, 1, 4, "ng-container", 27);
+        i0__namespace.ɵɵtemplate(2, TableComponent_div_0_div_7_div_2_Template, 1, 1, "div", 28);
         i0__namespace.ɵɵelementEnd();
     } if (rf & 2) {
-        const ctx_r0 = i0__namespace.ɵɵnextContext(2);
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵproperty("ngForOf", ctx_r0._actions.header);
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵproperty("ngIf", ctx_r0.exportOptions.length);
+        const ctx_r16 = i0__namespace.ɵɵnextContext(2);
+        i0__namespace.ɵɵadvance(1);
+        i0__namespace.ɵɵproperty("ngForOf", ctx_r16._actions.header);
+        i0__namespace.ɵɵadvance(1);
+        i0__namespace.ɵɵproperty("ngIf", ctx_r16.exportOptions.length);
     } }
     function TableComponent_div_0_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelementStart(0, "div", 19)(1, "h3", 20)(2, "div", 21);
@@ -159,50 +158,50 @@
         i0__namespace.ɵɵproperty("ngIf", ctx_r0.iconclass);
         i0__namespace.ɵɵadvance(2);
         i0__namespace.ɵɵproperty("innerHTML", ctx_r0.title, i0__namespace.ɵɵsanitizeHtml);
-        i0__namespace.ɵɵadvance();
+        i0__namespace.ɵɵadvance(1);
         i0__namespace.ɵɵproperty("innerHTML", ctx_r0.subheading, i0__namespace.ɵɵsanitizeHtml);
-        i0__namespace.ɵɵadvance();
+        i0__namespace.ɵɵadvance(1);
         i0__namespace.ɵɵproperty("ngIf", ctx_r0.exportOptions.length || ctx_r0._actions.header.length);
     } }
     function TableComponent_div_6_ng_container_1_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelementContainer(0, 29);
     } if (rf & 2) {
-        const btn_r6 = ctx.$implicit;
-        const index_r7 = ctx.index;
-        const ctx_r0 = i0__namespace.ɵɵnextContext(2);
-        const buttonRef_r4 = i0__namespace.ɵɵreference(8);
-        const anchorRef_r5 = i0__namespace.ɵɵreference(10);
-        i0__namespace.ɵɵproperty("ngTemplateOutlet", btn_r6.widgetType === "button" ? buttonRef_r4 : anchorRef_r5)("ngTemplateOutletContext", i0__namespace.ɵɵpureFunction1(3, _c17, btn_r6))("ngTemplateOutletInjector", ctx_r0.createCustomInjector("actions_footer_" + index_r7, i0__namespace.ɵɵpureFunction1(5, _c17, btn_r6)));
+        const btn_r21 = ctx.$implicit;
+        i0__namespace.ɵɵnextContext(2);
+        const _r3 = i0__namespace.ɵɵreference(8);
+        const _r5 = i0__namespace.ɵɵreference(10);
+        i0__namespace.ɵɵproperty("ngTemplateOutlet", btn_r21.widgetType === "button" ? _r3 : _r5)("ngTemplateOutletContext", i0__namespace.ɵɵpureFunction1(2, _c17, btn_r21));
     } }
     function TableComponent_div_6_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelementStart(0, "div", 31);
-        i0__namespace.ɵɵtemplate(1, TableComponent_div_6_ng_container_1_Template, 1, 7, "ng-container", 27);
+        i0__namespace.ɵɵtemplate(1, TableComponent_div_6_ng_container_1_Template, 1, 4, "ng-container", 27);
         i0__namespace.ɵɵelementEnd();
     } if (rf & 2) {
-        const ctx_r0 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵadvance();
-        i0__namespace.ɵɵproperty("ngForOf", ctx_r0._actions.footer);
+        const ctx_r2 = i0__namespace.ɵɵnextContext();
+        i0__namespace.ɵɵadvance(1);
+        i0__namespace.ɵɵproperty("ngForOf", ctx_r2._actions.footer);
     } }
+    const _c18 = function (a0, a1) { return { "btn-sm": a0, "disabled-new": a1 }; };
     function TableComponent_ng_template_7_Template(rf, ctx) { if (rf & 1) {
-        const _r8 = i0__namespace.ɵɵgetCurrentView();
+        const _r24 = i0__namespace.ɵɵgetCurrentView();
         i0__namespace.ɵɵelementStart(0, "button", 32);
-        i0__namespace.ɵɵlistener("click", function TableComponent_ng_template_7_Template_button_click_0_listener($event) { const btn_r9 = i0__namespace.ɵɵrestoreView(_r8).btn; const ctx_r0 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r0.invokeActionEvent($event, btn_r9.action)); });
+        i0__namespace.ɵɵlistener("click", function TableComponent_ng_template_7_Template_button_click_0_listener($event) { const restoredCtx = i0__namespace.ɵɵrestoreView(_r24); const btn_r22 = restoredCtx.btn; const ctx_r23 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r23.invokeActionEvent($event, btn_r22.action)); });
         i0__namespace.ɵɵelementEnd();
     } if (rf & 2) {
-        const btn_r9 = ctx.btn;
-        const ctx_r0 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction2(2, _c18, ctx_r0.spacing === "condensed", btn_r9.key === "addNewRow" && (ctx_r0.isGridEditMode || ctx_r0.isLoading)));
-        i0__namespace.ɵɵattribute("aria-label", btn_r9.displayName);
+        const btn_r22 = ctx.btn;
+        const ctx_r4 = i0__namespace.ɵɵnextContext();
+        i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction2(2, _c18, ctx_r4.spacing === "condensed", btn_r22.key === "addNewRow" && (ctx_r4.isGridEditMode || ctx_r4.isLoading)));
+        i0__namespace.ɵɵattribute("aria-label", btn_r22.displayName);
     } }
     function TableComponent_ng_template_9_Template(rf, ctx) { if (rf & 1) {
-        const _r10 = i0__namespace.ɵɵgetCurrentView();
+        const _r27 = i0__namespace.ɵɵgetCurrentView();
         i0__namespace.ɵɵelementStart(0, "a", 33);
-        i0__namespace.ɵɵlistener("click", function TableComponent_ng_template_9_Template_a_click_0_listener($event) { const btn_r11 = i0__namespace.ɵɵrestoreView(_r10).btn; const ctx_r0 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r0.invokeActionEvent($event, btn_r11.action)); });
+        i0__namespace.ɵɵlistener("click", function TableComponent_ng_template_9_Template_a_click_0_listener($event) { const restoredCtx = i0__namespace.ɵɵrestoreView(_r27); const btn_r25 = restoredCtx.btn; const ctx_r26 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r26.invokeActionEvent($event, btn_r25.action)); });
         i0__namespace.ɵɵelementEnd();
     } if (rf & 2) {
-        const btn_r11 = ctx.btn;
-        const ctx_r0 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction2(1, _c18, ctx_r0.spacing === "condensed", btn_r11.key === "addNewRow" && (ctx_r0.isGridEditMode || ctx_r0.isLoading)));
+        const btn_r25 = ctx.btn;
+        const ctx_r6 = i0__namespace.ɵɵnextContext();
+        i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction2(1, _c18, ctx_r6.spacing === "condensed", btn_r25.key === "addNewRow" && (ctx_r6.isGridEditMode || ctx_r6.isLoading)));
     } }
     const DEFAULT_CLS = 'app-grid app-panel panel';
     const WIDGET_CONFIG$5 = { widgetType: 'wm-table', hostClass: DEFAULT_CLS };
@@ -319,8 +318,8 @@
                 this.invokeEventCallback('enterkeypress', { $event, $data: this.gridData });
             }
         }
-        constructor(inj, fb, app, dynamicComponentProvider, statePersistence, paginationService, viewport, parentList, binddataset, binddatasource, readonlygrid, ngZone, trustAsPipe, explicitContext) {
-            super(inj, WIDGET_CONFIG$5, explicitContext);
+        constructor(inj, fb, app, dynamicComponentProvider, statePersistence, paginationService, viewport, parentList, binddataset, binddatasource, readonlygrid, ngZone, trustAsPipe) {
+            super(inj, WIDGET_CONFIG$5);
             this.inj = inj;
             this.fb = fb;
             this.app = app;
@@ -2121,7 +2120,7 @@
                 this._pageLoad = true;
             }
         }
-        static { this.ɵfac = function TableComponent_Factory(t) { return new (t || TableComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(i1__namespace.FormBuilder), i0__namespace.ɵɵdirectiveInject(i2__namespace.App), i0__namespace.ɵɵdirectiveInject(i2__namespace.DynamicComponentRefProvider), i0__namespace.ɵɵdirectiveInject(i2__namespace.StatePersistence), i0__namespace.ɵɵdirectiveInject(i2__namespace.PaginationService), i0__namespace.ɵɵdirectiveInject(i2__namespace.Viewport), i0__namespace.ɵɵdirectiveInject(i3__namespace.ListComponent, 8), i0__namespace.ɵɵinjectAttribute('dataset.bind'), i0__namespace.ɵɵinjectAttribute('datasource.bind'), i0__namespace.ɵɵinjectAttribute('readonlygrid'), i0__namespace.ɵɵdirectiveInject(i0__namespace.NgZone), i0__namespace.ɵɵdirectiveInject(i4__namespace.TrustAsPipe), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
+        static { this.ɵfac = function TableComponent_Factory(t) { return new (t || TableComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(i1__namespace.FormBuilder), i0__namespace.ɵɵdirectiveInject(i2__namespace.App), i0__namespace.ɵɵdirectiveInject(i2__namespace.DynamicComponentRefProvider), i0__namespace.ɵɵdirectiveInject(i2__namespace.StatePersistence), i0__namespace.ɵɵdirectiveInject(i2__namespace.PaginationService), i0__namespace.ɵɵdirectiveInject(i2__namespace.Viewport), i0__namespace.ɵɵdirectiveInject(i3__namespace.ListComponent, 8), i0__namespace.ɵɵinjectAttribute('dataset.bind'), i0__namespace.ɵɵinjectAttribute('datasource.bind'), i0__namespace.ɵɵinjectAttribute('readonlygrid'), i0__namespace.ɵɵdirectiveInject(i0__namespace.NgZone), i0__namespace.ɵɵdirectiveInject(i4__namespace.TrustAsPipe)); }; }
         static { this.ɵcmp = /*@__PURE__*/ i0__namespace.ɵɵdefineComponent({ type: TableComponent, selectors: [["", "wmTable", ""]], contentQueries: function TableComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
                 i0__namespace.ɵɵcontentQuery(dirIndex, _c0$1, 5);
                 i0__namespace.ɵɵcontentQuery(dirIndex, _c1$1, 5);
@@ -2167,36 +2166,37 @@
             } }, features: [i0__namespace.ɵɵProvidersFeature([
                     i4.provideAs(TableComponent, i1.NG_VALUE_ACCESSOR, true),
                     i4.provideAsWidgetRef(TableComponent)
-                ]), i0__namespace.ɵɵInheritDefinitionFeature], attrs: _c16, decls: 29, vars: 4, consts: [["datagridElement", ""], ["buttonRef", ""], ["anchorRef", ""], ["multiColumnFilterView", ""], ["inlineEditView", ""], ["inlineEditNewView", ""], ["rowActionsView", ""], ["rowExpansionActionView", ""], ["customExprView", ""], ["dynamicTable", ""], ["rowDetailView", ""], ["class", "panel-heading", 4, "ngIf"], [1, "app-datagrid"], [1, "panel-footer", "clearfix", 3, "hidden"], [1, "app-datagrid-paginator", 3, "hidden"], ["wmPagination", "", "show.bind", "shownavigation", "navigationalign.bind", "navigationalign", "navigationsize.bind", "navigationSize", "navigation.bind", "navControls", "showrecordcount.bind", "showrecordcount", "maxsize.bind", "maxsize", "boundarylinks.bind", "boundarylinks", "forceellipses.bind", "forceellipses", "directionlinks.bind", "directionlinks"], ["class", "app-datagrid-actions", 4, "ngIf"], ["hidden", ""], [1, "dynamic-table-container"], [1, "panel-heading"], [1, "panel-title"], [1, "pull-left"], [3, "class", 4, "ngIf"], [1, "heading", 3, "innerHTML"], [1, "description", 3, "innerHTML"], ["class", "panel-actions app-datagrid-actions", 4, "ngIf"], [1, "panel-actions", "app-datagrid-actions"], [3, "ngTemplateOutlet", "ngTemplateOutletContext", "ngTemplateOutletInjector", 4, "ngFor", "ngForOf"], ["wmMenu", "", "dropdown", "", "caption.bind", "appLocale.LABEL_EXPORT", "autoclose", "always", "dataset.bind", "exportOptions", "select.event", "export($item)", "menuposition", "down,left", 4, "ngIf"], [3, "ngTemplateOutlet", "ngTemplateOutletContext", "ngTemplateOutletInjector"], ["wmMenu", "", "dropdown", "", "caption.bind", "appLocale.LABEL_EXPORT", "autoclose", "always", "dataset.bind", "exportOptions", "select.event", "export($item)", "menuposition", "down,left"], [1, "app-datagrid-actions"], ["wmButton", "", "caption.bind", "btn.displayName", "show.bind", "btn.show", "class.bind", "btn.class", "iconclass.bind", "btn.iconclass", "type", "button", "shortcutkey.bind", "btn.shortcutkey", "tabindex.bind", "btn.tabindex", "hint.bind", "btn.title", "disabled.bind", "btn.disabled", "conditionalclass.bind", "btn.conditionalclass", "conditionalstyle.bind", "btn.conditionalstyle", 3, "click", "ngClass"], ["wmAnchor", "", "caption.bind", "btn.displayName", "show.bind", "btn.show", "class.bind", "btn.class", "iconclass.bind", "btn.iconclass", "shortcutkey.bind", "btn.shortcutkey", "tabindex.bind", "btn.tabindex", "hint.bind", "btn.title", "hyperlink.bind", "btn.hyperlink", "target.bind", "btn.target", "conditionalclass.bind", "btn.conditionalclass", "conditionalstyle.bind", "btn.conditionalstyle", 3, "click", "ngClass"]], template: function TableComponent_Template(rf, ctx) { if (rf & 1) {
-                i0__namespace.ɵɵtemplate(0, TableComponent_div_0_Template, 8, 4, "div", 11);
-                i0__namespace.ɵɵelement(1, "div", 12, 0);
-                i0__namespace.ɵɵelementStart(3, "div", 13)(4, "div", 14);
-                i0__namespace.ɵɵelement(5, "nav", 15);
+                ]), i0__namespace.ɵɵInheritDefinitionFeature], attrs: _c16, decls: 29, vars: 4, consts: [["class", "panel-heading", 4, "ngIf"], [1, "app-datagrid"], ["datagridElement", ""], [1, "panel-footer", "clearfix", 3, "hidden"], [1, "app-datagrid-paginator", 3, "hidden"], ["wmPagination", "", "show.bind", "shownavigation", "navigationalign.bind", "navigationalign", "navigationsize.bind", "navigationSize", "navigation.bind", "navControls", "showrecordcount.bind", "showrecordcount", "maxsize.bind", "maxsize", "boundarylinks.bind", "boundarylinks", "forceellipses.bind", "forceellipses", "directionlinks.bind", "directionlinks"], ["class", "app-datagrid-actions", 4, "ngIf"], ["buttonRef", ""], ["anchorRef", ""], ["hidden", ""], ["multiColumnFilterView", ""], ["inlineEditView", ""], ["inlineEditNewView", ""], ["rowActionsView", ""], ["rowExpansionActionView", ""], ["customExprView", ""], ["dynamicTable", ""], ["rowDetailView", ""], [1, "dynamic-table-container"], [1, "panel-heading"], [1, "panel-title"], [1, "pull-left"], [3, "class", 4, "ngIf"], [1, "heading", 3, "innerHTML"], [1, "description", 3, "innerHTML"], ["class", "panel-actions app-datagrid-actions", 4, "ngIf"], [1, "panel-actions", "app-datagrid-actions"], [3, "ngTemplateOutlet", "ngTemplateOutletContext", 4, "ngFor", "ngForOf"], ["wmMenu", "", "dropdown", "", "caption.bind", "appLocale.LABEL_EXPORT", "autoclose", "always", "dataset.bind", "exportOptions", "select.event", "export($item)", "menuposition", "down,left", 4, "ngIf"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["wmMenu", "", "dropdown", "", "caption.bind", "appLocale.LABEL_EXPORT", "autoclose", "always", "dataset.bind", "exportOptions", "select.event", "export($item)", "menuposition", "down,left"], [1, "app-datagrid-actions"], ["wmButton", "", "caption.bind", "btn.displayName", "show.bind", "btn.show", "class.bind", "btn.class", "iconclass.bind", "btn.iconclass", "type", "button", "shortcutkey.bind", "btn.shortcutkey", "tabindex.bind", "btn.tabindex", "hint.bind", "btn.title", "disabled.bind", "btn.disabled", "conditionalclass.bind", "btn.conditionalclass", "conditionalstyle.bind", "btn.conditionalstyle", 3, "ngClass", "click"], ["wmAnchor", "", "caption.bind", "btn.displayName", "show.bind", "btn.show", "class.bind", "btn.class", "iconclass.bind", "btn.iconclass", "shortcutkey.bind", "btn.shortcutkey", "tabindex.bind", "btn.tabindex", "hint.bind", "btn.title", "hyperlink.bind", "btn.hyperlink", "target.bind", "btn.target", "conditionalclass.bind", "btn.conditionalclass", "conditionalstyle.bind", "btn.conditionalstyle", 3, "ngClass", "click"]], template: function TableComponent_Template(rf, ctx) { if (rf & 1) {
+                i0__namespace.ɵɵtemplate(0, TableComponent_div_0_Template, 8, 4, "div", 0);
+                i0__namespace.ɵɵelement(1, "div", 1, 2);
+                i0__namespace.ɵɵelementStart(3, "div", 3)(4, "div", 4);
+                i0__namespace.ɵɵelement(5, "nav", 5);
                 i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵtemplate(6, TableComponent_div_6_Template, 2, 1, "div", 16);
+                i0__namespace.ɵɵtemplate(6, TableComponent_div_6_Template, 2, 1, "div", 6);
                 i0__namespace.ɵɵelementEnd();
-                i0__namespace.ɵɵtemplate(7, TableComponent_ng_template_7_Template, 1, 5, "ng-template", null, 1, i0__namespace.ɵɵtemplateRefExtractor)(9, TableComponent_ng_template_9_Template, 1, 4, "ng-template", null, 2, i0__namespace.ɵɵtemplateRefExtractor);
-                i0__namespace.ɵɵelementStart(11, "div", 17);
-                i0__namespace.ɵɵelementContainer(12, null, 3)(14, null, 4)(16, null, 5)(18, null, 6)(20, null, 7)(22, null, 8)(24, null, 9)(26, null, 10);
+                i0__namespace.ɵɵtemplate(7, TableComponent_ng_template_7_Template, 1, 5, "ng-template", null, 7, i0__namespace.ɵɵtemplateRefExtractor);
+                i0__namespace.ɵɵtemplate(9, TableComponent_ng_template_9_Template, 1, 4, "ng-template", null, 8, i0__namespace.ɵɵtemplateRefExtractor);
+                i0__namespace.ɵɵelementStart(11, "div", 9);
+                i0__namespace.ɵɵelementContainer(12, null, 10)(14, null, 11)(16, null, 12)(18, null, 13)(20, null, 14)(22, null, 15)(24, null, 16)(26, null, 17);
                 i0__namespace.ɵɵelement(28, "div", 18);
                 i0__namespace.ɵɵelementEnd();
             } if (rf & 2) {
                 i0__namespace.ɵɵproperty("ngIf", ctx.title || ctx.subheading || ctx.iconclass || ctx.exportOptions.length || ctx._actions.header.length);
                 i0__namespace.ɵɵadvance(3);
                 i0__namespace.ɵɵproperty("hidden", !ctx._actions.footer.length && (!ctx.shownavigation || ctx.onDemandLoad && ctx.dataNavigator.isDisableNext || (ctx.dataNavigator == null ? null : ctx.dataNavigator.dataSize) <= ctx.pagesize));
-                i0__namespace.ɵɵadvance();
+                i0__namespace.ɵɵadvance(1);
                 i0__namespace.ɵɵproperty("hidden", !(ctx.dataNavigator == null ? null : ctx.dataNavigator.dataSize) && !(ctx.dataNavigator.datasource == null ? null : ctx.dataNavigator.datasource.pagination == null ? null : ctx.dataNavigator.datasource.pagination.next) || !ctx.shownavigation || ctx.onDemandLoad && ctx.dataNavigator.isDisableNext || (ctx.dataNavigator == null ? null : ctx.dataNavigator.dataSize) <= ctx.pagesize);
                 i0__namespace.ɵɵadvance(2);
                 i0__namespace.ɵɵproperty("ngIf", ctx._actions.footer.length);
             } }, dependencies: [i5__namespace.AnchorComponent, i6__namespace.BsDropdownDirective, i7__namespace.NgClass, i7__namespace.NgForOf, i7__namespace.NgIf, i7__namespace.NgTemplateOutlet, i8__namespace.ButtonComponent, i9__namespace.MenuComponent, i10__namespace.PaginationComponent], encapsulation: 2 }); }
     }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableComponent, [{
+    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableComponent, [{
             type: i0.Component,
             args: [{ selector: '[wmTable]', providers: [
                         i4.provideAs(TableComponent, i1.NG_VALUE_ACCESSOR, true),
                         i4.provideAsWidgetRef(TableComponent)
-                    ], template: "<div class=\"panel-heading\" *ngIf=\"title || subheading || iconclass || exportOptions.length || _actions.header.length\">\n    <h3 class=\"panel-title\">\n        <div class=\"pull-left\">\n            <i class=\"app-icon panel-icon {{iconclass}}\" *ngIf=\"iconclass\"></i>\n        </div>\n        <div class=\"pull-left\">\n            <div class=\"heading\" [innerHTML]=\"title\"></div>\n            <div class=\"description\" [innerHTML]=\"subheading\"></div>\n        </div>\n        <div class=\"panel-actions app-datagrid-actions\" *ngIf=\"exportOptions.length || _actions.header.length\">\n            <ng-container *ngFor=\"let btn of _actions.header; let index = index;\"\n                          [ngTemplateOutlet]=\"btn.widgetType === 'button' ? buttonRef : anchorRef\"\n                          [ngTemplateOutletContext]=\"{btn:btn}\"\n                          [ngTemplateOutletInjector]=\"createCustomInjector('actions_header_' + index, {btn:btn})\">\n            </ng-container>\n            <div wmMenu dropdown caption.bind=\"appLocale.LABEL_EXPORT\" *ngIf=\"exportOptions.length\"  autoclose=\"always\" attr.name=\"{{name}}-export\"\n                dataset.bind=\"exportOptions\" select.event=\"export($item)\" menuposition=\"down,left\"></div>\n        </div>\n    </h3>\n</div>\n<div class=\"app-datagrid\" #datagridElement></div>\n\n<div class=\"panel-footer clearfix\" [hidden]=\"!_actions.footer.length && (!shownavigation || (onDemandLoad && dataNavigator.isDisableNext) || dataNavigator?.dataSize <= pagesize)\">\n    <div class=\"app-datagrid-paginator\" [hidden]=\"(!dataNavigator?.dataSize && !dataNavigator.datasource?.pagination?.next) || !shownavigation || (onDemandLoad && dataNavigator.isDisableNext) || dataNavigator?.dataSize <= pagesize\">\n        <nav wmPagination show.bind=\"shownavigation\" navigationalign.bind=\"navigationalign\"\n             navigationsize.bind=\"navigationSize\"\n             navigation.bind=\"navControls\" showrecordcount.bind=\"showrecordcount\" maxsize.bind=\"maxsize\"\n             boundarylinks.bind=\"boundarylinks\"\n             forceellipses.bind=\"forceellipses\" directionlinks.bind=\"directionlinks\"></nav>\n    </div>\n    <div class=\"app-datagrid-actions\" *ngIf=\"_actions.footer.length\">\n        <ng-container *ngFor=\"let btn of _actions.footer; let index = index;\"\n                      [ngTemplateOutlet]=\"btn.widgetType === 'button' ? buttonRef : anchorRef\"\n                      [ngTemplateOutletContext]=\"{btn:btn}\"\n                      [ngTemplateOutletInjector]=\"createCustomInjector('actions_footer_' + index, {btn:btn})\">\n        </ng-container>\n    </div>\n</div>\n\n<ng-template #buttonRef let-btn=\"btn\">\n    <button wmButton caption.bind=\"btn.displayName\" show.bind=\"btn.show\" class.bind=\"btn.class\"  iconclass.bind=\"btn.iconclass\" (click)=\"invokeActionEvent($event, btn.action)\"\n            [ngClass]=\"{'btn-sm': spacing === 'condensed', 'disabled-new': btn.key === 'addNewRow' && (isGridEditMode || isLoading)}\"\n            type=\"button\" shortcutkey.bind=\"btn.shortcutkey\" tabindex.bind=\"btn.tabindex\" hint.bind=\"btn.title\" [attr.aria-label]=\"btn.displayName\" disabled.bind=\"btn.disabled\" conditionalclass.bind=\"btn.conditionalclass\" conditionalstyle.bind=\"btn.conditionalstyle\"></button>\n</ng-template>\n\n<ng-template #anchorRef let-btn=\"btn\">\n    <a wmAnchor caption.bind=\"btn.displayName\" show.bind=\"btn.show\" class.bind=\"btn.class\"  iconclass.bind=\"btn.iconclass\" (click)=\"invokeActionEvent($event, btn.action)\"\n            [ngClass]=\"{'btn-sm': spacing === 'condensed', 'disabled-new': btn.key === 'addNewRow' && (isGridEditMode || isLoading)}\"\n            shortcutkey.bind=\"btn.shortcutkey\" tabindex.bind=\"btn.tabindex\" hint.bind=\"btn.title\"\n            hyperlink.bind=\"btn.hyperlink\" target.bind=\"btn.target\" conditionalclass.bind=\"btn.conditionalclass\" conditionalstyle.bind=\"btn.conditionalstyle\"></a>\n</ng-template>\n\n<div hidden>\n    <ng-container #multiColumnFilterView></ng-container>\n\n    <ng-container #inlineEditView></ng-container>\n\n    <ng-container #inlineEditNewView></ng-container>\n\n    <ng-container #rowActionsView></ng-container>\n\n    <ng-container #rowExpansionActionView></ng-container>\n\n    <ng-container #customExprView></ng-container>\n\n    <ng-container #dynamicTable></ng-container>\n\n    <ng-container #rowDetailView></ng-container>\n\n    <div class=\"dynamic-table-container\"></div>\n</div>\n" }]
-        }], () => [{ type: i0__namespace.Injector }, { type: i1__namespace.FormBuilder }, { type: i2__namespace.App }, { type: i2__namespace.DynamicComponentRefProvider }, { type: i2__namespace.StatePersistence }, { type: i2__namespace.PaginationService }, { type: i2__namespace.Viewport }, { type: i3__namespace.ListComponent, decorators: [{
+                    ], template: "<div class=\"panel-heading\" *ngIf=\"title || subheading || iconclass || exportOptions.length || _actions.header.length\">\n    <h3 class=\"panel-title\">\n        <div class=\"pull-left\">\n            <i class=\"app-icon panel-icon {{iconclass}}\" *ngIf=\"iconclass\"></i>\n        </div>\n        <div class=\"pull-left\">\n            <div class=\"heading\" [innerHTML]=\"title\"></div>\n            <div class=\"description\" [innerHTML]=\"subheading\"></div>\n        </div>\n        <div class=\"panel-actions app-datagrid-actions\" *ngIf=\"exportOptions.length || _actions.header.length\">\n            <ng-container *ngFor=\"let btn of _actions.header\"\n                          [ngTemplateOutlet]=\"btn.widgetType === 'button' ? buttonRef : anchorRef\" [ngTemplateOutletContext]=\"{btn:btn}\">\n            </ng-container>\n            <div wmMenu dropdown caption.bind=\"appLocale.LABEL_EXPORT\" *ngIf=\"exportOptions.length\"  autoclose=\"always\" attr.name=\"{{name}}-export\"\n                dataset.bind=\"exportOptions\" select.event=\"export($item)\" menuposition=\"down,left\"></div>\n        </div>\n    </h3>\n</div>\n<div class=\"app-datagrid\" #datagridElement></div>\n\n<div class=\"panel-footer clearfix\" [hidden]=\"!_actions.footer.length && (!shownavigation || (onDemandLoad && dataNavigator.isDisableNext) || dataNavigator?.dataSize <= pagesize)\">\n    <div class=\"app-datagrid-paginator\" [hidden]=\"(!dataNavigator?.dataSize && !dataNavigator.datasource?.pagination?.next) || !shownavigation || (onDemandLoad && dataNavigator.isDisableNext) || dataNavigator?.dataSize <= pagesize\">\n        <nav wmPagination show.bind=\"shownavigation\" navigationalign.bind=\"navigationalign\"\n             navigationsize.bind=\"navigationSize\"\n             navigation.bind=\"navControls\" showrecordcount.bind=\"showrecordcount\" maxsize.bind=\"maxsize\"\n             boundarylinks.bind=\"boundarylinks\"\n             forceellipses.bind=\"forceellipses\" directionlinks.bind=\"directionlinks\"></nav>\n    </div>\n    <div class=\"app-datagrid-actions\" *ngIf=\"_actions.footer.length\">\n        <ng-container *ngFor=\"let btn of _actions.footer\"\n                      [ngTemplateOutlet]=\"btn.widgetType === 'button' ? buttonRef : anchorRef\" [ngTemplateOutletContext]=\"{btn:btn}\">\n        </ng-container>\n    </div>\n</div>\n\n<ng-template #buttonRef let-btn=\"btn\">\n    <button wmButton caption.bind=\"btn.displayName\" show.bind=\"btn.show\" class.bind=\"btn.class\"  iconclass.bind=\"btn.iconclass\" (click)=\"invokeActionEvent($event, btn.action)\"\n            [ngClass]=\"{'btn-sm': spacing === 'condensed', 'disabled-new': btn.key === 'addNewRow' && (isGridEditMode || isLoading)}\"\n            type=\"button\" shortcutkey.bind=\"btn.shortcutkey\" tabindex.bind=\"btn.tabindex\" hint.bind=\"btn.title\" [attr.aria-label]=\"btn.displayName\" disabled.bind=\"btn.disabled\" conditionalclass.bind=\"btn.conditionalclass\" conditionalstyle.bind=\"btn.conditionalstyle\"></button>\n</ng-template>\n\n<ng-template #anchorRef let-btn=\"btn\">\n    <a wmAnchor caption.bind=\"btn.displayName\" show.bind=\"btn.show\" class.bind=\"btn.class\"  iconclass.bind=\"btn.iconclass\" (click)=\"invokeActionEvent($event, btn.action)\"\n            [ngClass]=\"{'btn-sm': spacing === 'condensed', 'disabled-new': btn.key === 'addNewRow' && (isGridEditMode || isLoading)}\"\n            shortcutkey.bind=\"btn.shortcutkey\" tabindex.bind=\"btn.tabindex\" hint.bind=\"btn.title\"\n            hyperlink.bind=\"btn.hyperlink\" target.bind=\"btn.target\" conditionalclass.bind=\"btn.conditionalclass\" conditionalstyle.bind=\"btn.conditionalstyle\"></a>\n</ng-template>\n\n<div hidden>\n    <ng-container #multiColumnFilterView></ng-container>\n\n    <ng-container #inlineEditView></ng-container>\n\n    <ng-container #inlineEditNewView></ng-container>\n\n    <ng-container #rowActionsView></ng-container>\n\n    <ng-container #rowExpansionActionView></ng-container>\n\n    <ng-container #customExprView></ng-container>\n\n    <ng-container #dynamicTable></ng-container>\n\n    <ng-container #rowDetailView></ng-container>\n\n    <div class=\"dynamic-table-container\"></div>\n</div>\n" }]
+        }], function () { return [{ type: i0__namespace.Injector }, { type: i1__namespace.FormBuilder }, { type: i2__namespace.App }, { type: i2__namespace.DynamicComponentRefProvider }, { type: i2__namespace.StatePersistence }, { type: i2__namespace.PaginationService }, { type: i2__namespace.Viewport }, { type: i3__namespace.ListComponent, decorators: [{
                     type: i0.Optional
                 }] }, { type: undefined, decorators: [{
                     type: i0.Attribute,
@@ -2207,12 +2207,7 @@
                 }] }, { type: undefined, decorators: [{
                     type: i0.Attribute,
                     args: ['readonlygrid']
-                }] }, { type: i0__namespace.NgZone }, { type: i4__namespace.TrustAsPipe }, { type: undefined, decorators: [{
-                    type: i0.Inject,
-                    args: ['EXPLICIT_CONTEXT']
-                }, {
-                    type: i0.Optional
-                }] }], { dataNavigator: [{
+                }] }, { type: i0__namespace.NgZone }, { type: i4__namespace.TrustAsPipe }]; }, { dataNavigator: [{
                 type: i0.ViewChild,
                 args: [i10.PaginationComponent, { static: true }]
             }], _tableElement: [{
@@ -2267,7 +2262,6 @@
                 type: i0.HostListener,
                 args: ['keypress', ['$event']]
             }] }); })();
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassDebugInfo(TableComponent, { className: "TableComponent", filePath: "table.component.ts", lineNumber: 109 }); })();
 
     const OPERATION = {
         'NEW': 'new',
@@ -2727,17 +2721,17 @@
         static { this.ɵfac = function TableCUDDirective_Factory(t) { return new (t || TableCUDDirective)(i0__namespace.ɵɵdirectiveInject(TableComponent, 2), i0__namespace.ɵɵdirectiveInject(i2__namespace.AbstractDialogService), i0__namespace.ɵɵdirectiveInject(i2__namespace.App)); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: TableCUDDirective, selectors: [["", "wmTableCUD", ""]] }); }
     }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableCUDDirective, [{
+    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableCUDDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmTableCUD]'
                 }]
-        }], () => [{ type: undefined, decorators: [{
+        }], function () { return [{ type: undefined, decorators: [{
                     type: i0.Self
                 }, {
                     type: i0.Inject,
                     args: [TableComponent]
-                }] }, { type: i2__namespace.AbstractDialogService }, { type: i2__namespace.App }], null); })();
+                }] }, { type: i2__namespace.AbstractDialogService }, { type: i2__namespace.App }]; }, null); })();
 
     const emptyMatchModes = ['null', 'empty', 'nullorempty', 'isnotnull', 'isnotempty'];
     // Get search value based on the time
@@ -3388,17 +3382,17 @@
         static { this.ɵfac = function TableFilterSortDirective_Factory(t) { return new (t || TableFilterSortDirective)(i0__namespace.ɵɵdirectiveInject(TableComponent, 2)); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: TableFilterSortDirective, selectors: [["", "wmTableFilterSort", ""]] }); }
     }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableFilterSortDirective, [{
+    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableFilterSortDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmTableFilterSort]'
                 }]
-        }], () => [{ type: undefined, decorators: [{
+        }], function () { return [{ type: undefined, decorators: [{
                     type: i0.Self
                 }, {
                     type: i0.Inject,
                     args: [TableComponent]
-                }] }], null); })();
+                }] }]; }, null); })();
 
     const registerProps$4 = () => {
         i4.register('wm-table-action', new Map([
@@ -3427,8 +3421,8 @@
     const WIDGET_CONFIG$4 = { widgetType: 'wm-table-action', hostClass: '' };
     class TableActionDirective extends i4.BaseComponent {
         static { this.initializeProps = registerProps$4(); }
-        constructor(inj, table, explicitContext) {
-            super(inj, WIDGET_CONFIG$4, explicitContext);
+        constructor(inj, table) {
+            super(inj, WIDGET_CONFIG$4);
             this.table = table;
         }
         populateAction() {
@@ -3470,12 +3464,12 @@
                 this.buttonDef[key] = nv;
             }
         }
-        static { this.ɵfac = function TableActionDirective_Factory(t) { return new (t || TableActionDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(TableComponent, 8), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
+        static { this.ɵfac = function TableActionDirective_Factory(t) { return new (t || TableActionDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(TableComponent, 8)); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: TableActionDirective, selectors: [["", "wmTableAction", ""]], features: [i0__namespace.ɵɵProvidersFeature([
                     i4.provideAsWidgetRef(TableActionDirective)
                 ]), i0__namespace.ɵɵInheritDefinitionFeature] }); }
     }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableActionDirective, [{
+    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableActionDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmTableAction]',
@@ -3483,14 +3477,9 @@
                         i4.provideAsWidgetRef(TableActionDirective)
                     ]
                 }]
-        }], () => [{ type: i0__namespace.Injector }, { type: TableComponent, decorators: [{
+        }], function () { return [{ type: i0__namespace.Injector }, { type: TableComponent, decorators: [{
                     type: i0.Optional
-                }] }, { type: undefined, decorators: [{
-                    type: i0.Inject,
-                    args: ['EXPLICIT_CONTEXT']
-                }, {
-                    type: i0.Optional
-                }] }], null); })();
+                }] }]; }, null); })();
 
     const registerProps$3 = () => {
         i4.register('wm-table-column', new Map([
@@ -3504,7 +3493,7 @@
             ['collapsible', i4.PROP_BOOLEAN],
             ['col-ng-class', i4.PROP_STRING],
             ['currencypattern', i4.PROP_STRING],
-            ['customExpression', i4.PROP_BOOLEAN], // Internal property to check if column has custom expression
+            ['customExpression', i4.PROP_BOOLEAN],
             ['dataentrymode', { value: 'default', ...i4.PROP_STRING }],
             ['datafield', i4.PROP_STRING],
             ['dataoptions', i4.PROP_ANY],
@@ -3595,8 +3584,8 @@
     const WIDGET_CONFIG$3 = { widgetType: 'wm-table-column-group', hostClass: '' };
     class TableColumnGroupDirective extends i4.BaseComponent {
         static { this.initializeProps = registerProps$2(); }
-        constructor(inj, group, table, explicitContext) {
-            super(inj, WIDGET_CONFIG$3, explicitContext);
+        constructor(inj, group, table) {
+            super(inj, WIDGET_CONFIG$3);
             this.group = group;
             this.table = table;
             this.config = {};
@@ -3631,12 +3620,12 @@
             const fieldName = this.group && this.group.name;
             i4.setHeaderConfigForTable(this.table.headerConfig, this.config, fieldName, fieldName ? colIndex : headerIndex);
         }
-        static { this.ɵfac = function TableColumnGroupDirective_Factory(t) { return new (t || TableColumnGroupDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(TableColumnGroupDirective, 12), i0__namespace.ɵɵdirectiveInject(TableComponent, 8), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
+        static { this.ɵfac = function TableColumnGroupDirective_Factory(t) { return new (t || TableColumnGroupDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(TableColumnGroupDirective, 12), i0__namespace.ɵɵdirectiveInject(TableComponent, 8)); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: TableColumnGroupDirective, selectors: [["", "wmTableColumnGroup", ""]], features: [i0__namespace.ɵɵProvidersFeature([
                     i4.provideAsWidgetRef(TableColumnGroupDirective)
                 ]), i0__namespace.ɵɵInheritDefinitionFeature] }); }
     }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableColumnGroupDirective, [{
+    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableColumnGroupDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmTableColumnGroup]',
@@ -3644,18 +3633,13 @@
                         i4.provideAsWidgetRef(TableColumnGroupDirective)
                     ]
                 }]
-        }], () => [{ type: i0__namespace.Injector }, { type: TableColumnGroupDirective, decorators: [{
+        }], function () { return [{ type: i0__namespace.Injector }, { type: TableColumnGroupDirective, decorators: [{
                     type: i0.SkipSelf
                 }, {
                     type: i0.Optional
                 }] }, { type: TableComponent, decorators: [{
                     type: i0.Optional
-                }] }, { type: undefined, decorators: [{
-                    type: i0.Inject,
-                    args: ['EXPLICIT_CONTEXT']
-                }, {
-                    type: i0.Optional
-                }] }], null); })();
+                }] }]; }, null); })();
 
     const _c0 = ["customExprTmpl"];
     const _c1 = ["inlineWidgetTmpl"];
@@ -3688,8 +3672,8 @@
     }
     class TableColumnDirective extends i4.BaseComponent {
         static { this.initializeProps = registerProps$3(); }
-        constructor(inj, appDefaults, table, group, bindfilterdataset, binddataset, explicitContext) {
-            super(inj, WIDGET_CONFIG$2, explicitContext);
+        constructor(inj, appDefaults, table, group, bindfilterdataset, binddataset) {
+            super(inj, WIDGET_CONFIG$2);
             this.appDefaults = appDefaults;
             this.table = table;
             this.group = group;
@@ -4184,6 +4168,15 @@
                 case 'caption':
                     this.displayName = nv || '';
                     this.setProperty('displayName', this.displayName);
+                    // Fix for [WMS-25934]: update the headerConfig list when there is change in display name
+                    // when column is inside a group then consider the col index and not header index.
+                    const fieldName = this.group && this.group.name;
+                    const index = fieldName ? parseInt(this.getAttr('index'), 10) : parseInt(this.getAttr('headerIndex'), 10);
+                    // Register column with header config to create group structure
+                    i4.setHeaderConfigForTable(this.table.headerConfig, {
+                        field: this.field,
+                        displayName: this.displayName
+                    }, fieldName, index);
                     break;
                 case 'defaultvalue':
                     this.defaultvalue = i4.getDefaultValue(this.defaultvalue, this.type, this.editWidgetType);
@@ -4222,7 +4215,7 @@
                     this.table.redraw(true);
             }
         }
-        static { this.ɵfac = function TableColumnDirective_Factory(t) { return new (t || TableColumnDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(i2__namespace.AppDefaults), i0__namespace.ɵɵdirectiveInject(TableComponent, 8), i0__namespace.ɵɵdirectiveInject(TableColumnGroupDirective, 8), i0__namespace.ɵɵinjectAttribute('filterdataset.bind'), i0__namespace.ɵɵinjectAttribute('dataset.bind'), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
+        static { this.ɵfac = function TableColumnDirective_Factory(t) { return new (t || TableColumnDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(i2__namespace.AppDefaults), i0__namespace.ɵɵdirectiveInject(TableComponent, 8), i0__namespace.ɵɵdirectiveInject(TableColumnGroupDirective, 8), i0__namespace.ɵɵinjectAttribute('filterdataset.bind'), i0__namespace.ɵɵinjectAttribute('dataset.bind')); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: TableColumnDirective, selectors: [["", "wmTableColumn", ""]], contentQueries: function TableColumnDirective_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
                 i0__namespace.ɵɵcontentQuery(dirIndex, _c0, 5);
                 i0__namespace.ɵɵcontentQuery(dirIndex, _c1, 5);
@@ -4242,7 +4235,7 @@
                     i4.provideAsWidgetRef(TableColumnDirective)
                 ]), i0__namespace.ɵɵInheritDefinitionFeature] }); }
     }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableColumnDirective, [{
+    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableColumnDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmTableColumn]',
@@ -4250,7 +4243,7 @@
                         i4.provideAsWidgetRef(TableColumnDirective)
                     ]
                 }]
-        }], () => [{ type: i0__namespace.Injector }, { type: i2__namespace.AppDefaults }, { type: TableComponent, decorators: [{
+        }], function () { return [{ type: i0__namespace.Injector }, { type: i2__namespace.AppDefaults }, { type: TableComponent, decorators: [{
                     type: i0.Optional
                 }] }, { type: TableColumnGroupDirective, decorators: [{
                     type: i0.Optional
@@ -4260,12 +4253,7 @@
                 }] }, { type: undefined, decorators: [{
                     type: i0.Attribute,
                     args: ['dataset.bind']
-                }] }, { type: undefined, decorators: [{
-                    type: i0.Inject,
-                    args: ['EXPLICIT_CONTEXT']
-                }, {
-                    type: i0.Optional
-                }] }], { _filterInstances: [{
+                }] }]; }, { _filterInstances: [{
                 type: i0.ContentChildren,
                 args: ['filterWidget', { descendants: true }]
             }], _inlineInstances: [{
@@ -4301,8 +4289,8 @@
     const WIDGET_CONFIG$1 = { widgetType: 'wm-table-row', hostClass: '' };
     class TableRowDirective extends i4.BaseComponent {
         static { this.initializeProps = registerProps$1(); }
-        constructor(inj, table, explicitContext) {
-            super(inj, WIDGET_CONFIG$1, explicitContext);
+        constructor(inj, table) {
+            super(inj, WIDGET_CONFIG$1);
             this.table = table;
         }
         populateConfig() {
@@ -4326,12 +4314,12 @@
                 this.config.content = this.content;
             }
         }
-        static { this.ɵfac = function TableRowDirective_Factory(t) { return new (t || TableRowDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(TableComponent, 12), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
+        static { this.ɵfac = function TableRowDirective_Factory(t) { return new (t || TableRowDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(TableComponent, 12)); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: TableRowDirective, selectors: [["", "wmTableRow", ""]], features: [i0__namespace.ɵɵProvidersFeature([
                     i4.provideAsWidgetRef(TableRowDirective)
                 ]), i0__namespace.ɵɵInheritDefinitionFeature] }); }
     }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableRowDirective, [{
+    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableRowDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmTableRow]',
@@ -4339,16 +4327,11 @@
                         i4.provideAsWidgetRef(TableRowDirective)
                     ]
                 }]
-        }], () => [{ type: i0__namespace.Injector }, { type: TableComponent, decorators: [{
+        }], function () { return [{ type: i0__namespace.Injector }, { type: TableComponent, decorators: [{
                     type: i0.Optional
                 }, {
                     type: i0.SkipSelf
-                }] }, { type: undefined, decorators: [{
-                    type: i0.Inject,
-                    args: ['EXPLICIT_CONTEXT']
-                }, {
-                    type: i0.Optional
-                }] }], null); })();
+                }] }]; }, null); })();
 
     const registerProps = () => {
         i4.register('wm-table-row-action', new Map([
@@ -4372,8 +4355,8 @@
     const WIDGET_CONFIG = { widgetType: 'wm-table-row-action', hostClass: '' };
     class TableRowActionDirective extends i4.BaseComponent {
         static { this.initializeProps = registerProps(); }
-        constructor(inj, table, contexts, explicitContext) {
-            super(inj, WIDGET_CONFIG, explicitContext);
+        constructor(inj, table, contexts) {
+            super(inj, WIDGET_CONFIG);
             this.table = table;
             contexts[0].editRow = (evt) => this.table.editRow(evt);
             contexts[0].deleteRow = (evt) => this.table.deleteRow(evt);
@@ -4406,13 +4389,13 @@
             this.populateAction();
             this.table.registerRowActions(this.buttonDef);
         }
-        static { this.ɵfac = function TableRowActionDirective_Factory(t) { return new (t || TableRowActionDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(TableComponent, 8), i0__namespace.ɵɵdirectiveInject(i4.Context, 2), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
+        static { this.ɵfac = function TableRowActionDirective_Factory(t) { return new (t || TableRowActionDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(TableComponent, 8), i0__namespace.ɵɵdirectiveInject(i4.Context, 2)); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: TableRowActionDirective, selectors: [["", "wmTableRowAction", ""]], features: [i0__namespace.ɵɵProvidersFeature([
                     i4.provideAsWidgetRef(TableRowActionDirective),
                     { provide: i4.Context, useFactory: () => { return {}; }, multi: true }
                 ]), i0__namespace.ɵɵInheritDefinitionFeature] }); }
     }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableRowActionDirective, [{
+    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableRowActionDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmTableRowAction]',
@@ -4421,19 +4404,14 @@
                         { provide: i4.Context, useFactory: () => { return {}; }, multi: true }
                     ]
                 }]
-        }], () => [{ type: i0__namespace.Injector }, { type: TableComponent, decorators: [{
+        }], function () { return [{ type: i0__namespace.Injector }, { type: TableComponent, decorators: [{
                     type: i0.Optional
                 }] }, { type: Array, decorators: [{
                     type: i0.Self
                 }, {
                     type: i0.Inject,
                     args: [i4.Context]
-                }] }, { type: undefined, decorators: [{
-                    type: i0.Inject,
-                    args: ['EXPLICIT_CONTEXT']
-                }, {
-                    type: i0.Optional
-                }] }], null); })();
+                }] }]; }, null); })();
 
     const components = [
         TableComponent,
@@ -4460,7 +4438,7 @@
                 tooltip.TooltipModule,
                 i4.WmComponentsModule] }); }
     }
-    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableModule, [{
+    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(TableModule, [{
             type: i0.NgModule,
             args: [{
                     imports: [