@acorex/modules 20.7.3 → 20.7.4

package/fesm2022/{acorex-modules-task-management-task-board.page-D7dEWzjn.mjs → acorex-modules-task-management-task-board.page-CIlxqtgJ.mjs}

@@ -34,7 +34,7 @@ import { AXPPageLayoutBaseComponent, AXPPageLayoutComponent, AXPPageLayoutBase }
 import * as i1$1 from '@angular/common';
 import { AsyncPipe, CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { computed, inject, signal, effect, ViewEncapsulation, ChangeDetectionStrategy, Component, input, output, viewChild, model, untracked } from '@angular/core';
+import { computed, inject, signal, effect, ViewEncapsulation, ChangeDetectionStrategy, Component, input, output, viewChild, untracked, afterNextRender, model, viewChildren } from '@angular/core';
 import * as i1$3 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import { Router, ActivatedRoute, NavigationEnd, RouterModule } from '@angular/router';
@@ -895,6 +895,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
         }], propDecorators: { schedulerComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXSchedulerComponent), { isSignal: true }] }], taskPopover: [{ type: i0.ViewChild, args: ['taskPopover', { isSignal: true }] }], resources: [{ type: i0.Input, args: [{ isSignal: true, alias: "resources", required: false }] }], startingDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "startingDate", required: false }] }], selectedView: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedView", required: false }] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], onTaskClick: [{ type: i0.Output, args: ["onTaskClick"] }], onTaskChanged: [{ type: i0.Output, args: ["onTaskChanged"] }], onMonthSlotDblClicked: [{ type: i0.Output, args: ["onMonthSlotDblClicked"] }], onActionClick: [{ type: i0.Output, args: ["onActionClick"] }], component: [{ type: i0.Output, args: ["component"] }], onTaskRightClick: [{ type: i0.Output, args: ["onTaskRightClick"] }], onRangeChanged: [{ type: i0.Output, args: ["onRangeChanged"] }] } });
 
 class AXMTaskBoardGridViewComponent {
+    #dataSourceChanged;
     constructor() {
         this.vm = inject(AXMTaskBoardViewModel);
         this.localeService = inject(AXLocaleService);
@@ -905,6 +906,7 @@ class AXMTaskBoardGridViewComponent {
         this.onActionClick = output();
         this.fetchedTasks = signal([], ...(ngDevMode ? [{ debugName: "fetchedTasks" }] : []));
         this.columns = signal([], ...(ngDevMode ? [{ debugName: "columns" }] : []));
+        this.grid = viewChild('grid', ...(ngDevMode ? [{ debugName: "grid" }] : []));
         this.tasksDataSource = computed(() => {
             const parentDataSource = this.dataSource();
             return new AXDataSource({
@@ -927,6 +929,8 @@ class AXMTaskBoardGridViewComponent {
                         startDate: this.calendarService.format(task.startDate, 'DD/MM/YYYY HH:mm', {
                             locale: this.localeService.activeProfile().calendar.system,
                         }),
+                        // Store the original task for row click handler
+                        _originalTask: task,
                     }));
                     return { items: mappedItems, total: result.total };
                 },
@@ -938,7 +942,23 @@ class AXMTaskBoardGridViewComponent {
             });
         }, ...(ngDevMode ? [{ debugName: "tasksDataSource" }] : []));
         this.#dataSourceChanged = effect(() => {
-            this.tasksDataSource().refresh();
+            // Track filter-related signals that affect the data source
+            // When these change, the parent's filter() computed signal changes,
+            // which means the data source function will return different results
+            this.vm.selectedTaskTypeNames();
+            this.vm.selectedAssigneeIds();
+            this.vm.selectedReporterIds();
+            this.vm.selectedPriorities();
+            this.vm.currentDate();
+            this.vm.daysCount();
+            this.vm.currentViewMode();
+            // Use untracked to refresh the grid without tracking it
+            untracked(() => {
+                // Schedule refresh in next tick to avoid issues during effect execution
+                setTimeout(() => {
+                    this.grid()?.refresh();
+                }, 0);
+            });
         }, ...(ngDevMode ? [{ debugName: "#dataSourceChanged" }] : []));
         this.#providerChanged = effect(async () => {
             const taskType = this.vm.selectedTaskTypes()[0];
@@ -952,12 +972,22 @@ class AXMTaskBoardGridViewComponent {
                 }
             });
         }, ...(ngDevMode ? [{ debugName: "#providerChanged" }] : []));
+        // Ensure data source is refreshed after initial render
+        afterNextRender(() => {
+            untracked(() => {
+                this.grid()?.refresh();
+            });
+        });
     }
-    #dataSourceChanged;
     #providerChanged;
     handleRowClick(event) {
         if (event.data) {
-            this.onTaskClick.emit(event.data);
+            // Get the original task from the mapped item or find it by ID
+            const mappedItem = event.data;
+            const originalTask = mappedItem._originalTask || this.fetchedTasks().find((task) => task.id === mappedItem.id);
+            if (originalTask) {
+                this.onTaskClick.emit(originalTask);
+            }
         }
     }
     onActionClickHandler(e) {
@@ -967,12 +997,12 @@ class AXMTaskBoardGridViewComponent {
         this.onActionClick.emit({ nativeEvent: e.nativeEvent, task });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AXMTaskBoardGridViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AXMTaskBoardGridViewComponent, isStandalone: true, selector: "axm-task-board-grid-view", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { onTaskClick: "onTaskClick", onActionClick: "onActionClick" }, ngImport: i0, template: "<ax-data-table\n  [fetchDataMode]=\"'manual'\"\n  [dataSource]=\"tasksDataSource()\"\n  (onRowClick)=\"handleRowClick($event)\"\n  [loading]=\"{ enabled: true, animation: true }\"\n>\n  <ax-text-column dataField=\"title\" caption=\"title\" [width]=\"'350px'\"></ax-text-column>\n  <ax-text-column dataField=\"description\" caption=\"description\" [width]=\"'500px'\"></ax-text-column>\n  <ax-text-column dataField=\"startDate\" caption=\"Start Date\" [width]=\"'150px'\"></ax-text-column>\n  <ax-text-column dataField=\"endDate\" caption=\"Due Date\" [width]=\"'150px'\"></ax-text-column>\n  <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"reporter\" caption=\"Reporter\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"assignee\" caption=\"Assignee\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"statusTitle\" caption=\"status\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"type\" caption=\"type\" [width]=\"'150px'\"></ax-text-column>\n\n  @if (columns().length) {\n    <ng-container>\n      @for (column of columns(); track column) {\n        <axp-widget-column-renderer\n          [node]=\"column.widget\"\n          [caption]=\"(column.title | translate | async)!\"\n        ></axp-widget-column-renderer>\n      }\n    </ng-container>\n  }\n\n  <ax-command-column\n    fixed=\"end\"\n    [width]=\"'60px'\"\n    (onItemClick)=\"onActionClickHandler($event)\"\n    [items]=\"[{ name: 'view', text: 'View', icon: 'ax-icon ax-icon-more-horizontal' }]\"\n  ></ax-command-column>\n</ax-data-table>\n", styles: ["ax-kanban{--ax-comp-kanban-status-min-width: 25rem;height:100%;line-height:1.5}\n"], dependencies: [{ kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i1$2.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "rowDetailsTemplate", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i1$2.AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }, { kind: "component", type: i1$2.AXRowCommandColumnComponent, selector: "ax-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i1.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["caption", "customExpandIcon", "customCollapseIcon", "customWidth", "node", "footerTemplate", "expandHandler", "cellTemplate", "headerTemplate"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AXMTaskBoardGridViewComponent, isStandalone: true, selector: "axm-task-board-grid-view", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { onTaskClick: "onTaskClick", onActionClick: "onActionClick" }, viewQueries: [{ propertyName: "grid", first: true, predicate: ["grid"], descendants: true, isSignal: true }], ngImport: i0, template: "<ax-data-table\n  #grid\n  [fetchDataMode]=\"'manual'\"\n  [dataSource]=\"tasksDataSource()\"\n  (onRowClick)=\"handleRowClick($event)\"\n  [loading]=\"{ enabled: true, animation: true }\"\n>\n  <ax-text-column dataField=\"title\" caption=\"title\" [width]=\"'350px'\"></ax-text-column>\n  <ax-text-column dataField=\"description\" caption=\"description\" [width]=\"'500px'\"></ax-text-column>\n  <ax-text-column dataField=\"startDate\" caption=\"Start Date\" [width]=\"'150px'\"></ax-text-column>\n  <ax-text-column dataField=\"endDate\" caption=\"Due Date\" [width]=\"'150px'\"></ax-text-column>\n  <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column [allowResizing]=\"true\" dataField=\"reporter\" caption=\"Reporter\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"assignee\" caption=\"Assignee\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"statusTitle\" caption=\"status\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"type\" caption=\"type\" [width]=\"'150px'\"></ax-text-column>\n\n  @if (columns().length) {\n    <ng-container>\n      @for (column of columns(); track column) {\n        <axp-widget-column-renderer\n          [node]=\"column.widget\"\n          [caption]=\"(column.title | translate | async)!\"\n        ></axp-widget-column-renderer>\n      }\n    </ng-container>\n  }\n\n  <ax-command-column\n    fixed=\"end\"\n    [width]=\"'60px'\"\n    (onItemClick)=\"onActionClickHandler($event)\"\n    [items]=\"[{ name: 'view', text: 'View', icon: 'ax-icon ax-icon-more-horizontal' }]\"\n  ></ax-command-column>\n</ax-data-table>\n", styles: ["ax-kanban{--ax-comp-kanban-status-min-width: 25rem;height:100%;line-height:1.5}\n"], dependencies: [{ kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i1$2.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "rowDetailsTemplate", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i1$2.AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }, { kind: "component", type: i1$2.AXRowCommandColumnComponent, selector: "ax-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i1.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["caption", "customExpandIcon", "customCollapseIcon", "customWidth", "node", "footerTemplate", "expandHandler", "cellTemplate", "headerTemplate"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AXMTaskBoardGridViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'axm-task-board-grid-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXDataTableModule, AXTranslatorPipe, AsyncPipe, AXPWidgetCoreModule], template: "<ax-data-table\n  [fetchDataMode]=\"'manual'\"\n  [dataSource]=\"tasksDataSource()\"\n  (onRowClick)=\"handleRowClick($event)\"\n  [loading]=\"{ enabled: true, animation: true }\"\n>\n  <ax-text-column dataField=\"title\" caption=\"title\" [width]=\"'350px'\"></ax-text-column>\n  <ax-text-column dataField=\"description\" caption=\"description\" [width]=\"'500px'\"></ax-text-column>\n  <ax-text-column dataField=\"startDate\" caption=\"Start Date\" [width]=\"'150px'\"></ax-text-column>\n  <ax-text-column dataField=\"endDate\" caption=\"Due Date\" [width]=\"'150px'\"></ax-text-column>\n  <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"reporter\" caption=\"Reporter\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"assignee\" caption=\"Assignee\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"statusTitle\" caption=\"status\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"type\" caption=\"type\" [width]=\"'150px'\"></ax-text-column>\n\n  @if (columns().length) {\n    <ng-container>\n      @for (column of columns(); track column) {\n        <axp-widget-column-renderer\n          [node]=\"column.widget\"\n          [caption]=\"(column.title | translate | async)!\"\n        ></axp-widget-column-renderer>\n      }\n    </ng-container>\n  }\n\n  <ax-command-column\n    fixed=\"end\"\n    [width]=\"'60px'\"\n    (onItemClick)=\"onActionClickHandler($event)\"\n    [items]=\"[{ name: 'view', text: 'View', icon: 'ax-icon ax-icon-more-horizontal' }]\"\n  ></ax-command-column>\n</ax-data-table>\n", styles: ["ax-kanban{--ax-comp-kanban-status-min-width: 25rem;height:100%;line-height:1.5}\n"] }]
-        }], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], onTaskClick: [{ type: i0.Output, args: ["onTaskClick"] }], onActionClick: [{ type: i0.Output, args: ["onActionClick"] }] } });
+            args: [{ selector: 'axm-task-board-grid-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXDataTableModule, AXTranslatorPipe, AsyncPipe, AXPWidgetCoreModule], template: "<ax-data-table\n  #grid\n  [fetchDataMode]=\"'manual'\"\n  [dataSource]=\"tasksDataSource()\"\n  (onRowClick)=\"handleRowClick($event)\"\n  [loading]=\"{ enabled: true, animation: true }\"\n>\n  <ax-text-column dataField=\"title\" caption=\"title\" [width]=\"'350px'\"></ax-text-column>\n  <ax-text-column dataField=\"description\" caption=\"description\" [width]=\"'500px'\"></ax-text-column>\n  <ax-text-column dataField=\"startDate\" caption=\"Start Date\" [width]=\"'150px'\"></ax-text-column>\n  <ax-text-column dataField=\"endDate\" caption=\"Due Date\" [width]=\"'150px'\"></ax-text-column>\n  <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column [allowResizing]=\"true\" dataField=\"reporter\" caption=\"Reporter\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"assignee\" caption=\"Assignee\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"statusTitle\" caption=\"status\" [width]=\"'125px'\"></ax-text-column>\n  <ax-text-column dataField=\"type\" caption=\"type\" [width]=\"'150px'\"></ax-text-column>\n\n  @if (columns().length) {\n    <ng-container>\n      @for (column of columns(); track column) {\n        <axp-widget-column-renderer\n          [node]=\"column.widget\"\n          [caption]=\"(column.title | translate | async)!\"\n        ></axp-widget-column-renderer>\n      }\n    </ng-container>\n  }\n\n  <ax-command-column\n    fixed=\"end\"\n    [width]=\"'60px'\"\n    (onItemClick)=\"onActionClickHandler($event)\"\n    [items]=\"[{ name: 'view', text: 'View', icon: 'ax-icon ax-icon-more-horizontal' }]\"\n  ></ax-command-column>\n</ax-data-table>\n", styles: ["ax-kanban{--ax-comp-kanban-status-min-width: 25rem;height:100%;line-height:1.5}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], onTaskClick: [{ type: i0.Output, args: ["onTaskClick"] }], onActionClick: [{ type: i0.Output, args: ["onActionClick"] }], grid: [{ type: i0.ViewChild, args: ['grid', { isSignal: true }] }] } });
 
 class AXMTaskBoardKanbanViewComponent {
     constructor() {
@@ -1447,6 +1477,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
         }], propDecorators: { kanbanComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXKanbanComponent), { isSignal: true }] }], taskPopover: [{ type: i0.ViewChild, args: ['taskPopover', { isSignal: true }] }], tasks: [{ type: i0.Input, args: [{ isSignal: true, alias: "tasks", required: true }] }, { type: i0.Output, args: ["tasksChange"] }], onTaskClick: [{ type: i0.Output, args: ["onTaskClick"] }], onTaskChanged: [{ type: i0.Output, args: ["onTaskChanged"] }], component: [{ type: i0.Output, args: ["component"] }], onActionClick: [{ type: i0.Output, args: ["onActionClick"] }] } });
 
 class AXMTaskBoardStatusGroupedGridViewComponent {
+    #dataChanged;
+    #providerChanged;
+    #gridsChanged;
     constructor() {
         this.vm = inject(AXMTaskBoardViewModel);
         this.localeService = inject(AXLocaleService);
@@ -1458,7 +1491,18 @@ class AXMTaskBoardStatusGroupedGridViewComponent {
         this.allFetchedTasks = signal([], ...(ngDevMode ? [{ debugName: "allFetchedTasks" }] : []));
         this.columns = signal([], ...(ngDevMode ? [{ debugName: "columns" }] : []));
         this.statuses = signal([], ...(ngDevMode ? [{ debugName: "statuses" }] : []));
+        this.grids = viewChildren('grid', ...(ngDevMode ? [{ debugName: "grids" }] : []));
         this.#dataChanged = effect(async () => {
+            // Track filter-related signals that affect the data source
+            // When these change, the parent's filter() computed signal changes,
+            // which means the data source function will return different results
+            this.vm.selectedTaskTypeNames();
+            this.vm.selectedAssigneeIds();
+            this.vm.selectedReporterIds();
+            this.vm.selectedPriorities();
+            this.vm.currentDate();
+            this.vm.daysCount();
+            this.vm.currentViewMode();
             const parentDataSource = this.dataSource();
             const allStatuses = this.statuses();
             if (!parentDataSource || allStatuses.length === 0) {
@@ -1478,11 +1522,17 @@ class AXMTaskBoardStatusGroupedGridViewComponent {
             });
             this.groupedTasks.set(statusGroups);
             untracked(() => {
+                // Use afterRender to ensure data tables are rendered before refreshing
                 setTimeout(() => {
+                    // Refresh data sources
                     this.groupedTasks()?.forEach((group) => {
                         group.tasks.refresh();
                     });
-                });
+                    // Refresh data table components
+                    this.grids().forEach((grid) => {
+                        grid.refresh();
+                    });
+                }, 0);
             });
         }, ...(ngDevMode ? [{ debugName: "#dataChanged" }] : []));
         this.#providerChanged = effect(async () => {
@@ -1498,9 +1548,35 @@ class AXMTaskBoardStatusGroupedGridViewComponent {
                 }
             });
         }, ...(ngDevMode ? [{ debugName: "#providerChanged" }] : []));
+        this.#gridsChanged = effect(() => {
+            // Track when groupedTasks changes to refresh grids
+            const groups = this.groupedTasks();
+            untracked(() => {
+                // Wait for grids to be rendered
+                setTimeout(() => {
+                    this.grids().forEach((grid) => {
+                        grid.refresh();
+                    });
+                }, 100);
+            });
+        }, ...(ngDevMode ? [{ debugName: "#gridsChanged" }] : []));
+        // Ensure data sources are refreshed after initial render
+        afterNextRender(() => {
+            untracked(() => {
+                // Use a longer timeout to ensure data tables are fully rendered
+                setTimeout(() => {
+                    // Refresh data sources
+                    this.groupedTasks()?.forEach((group) => {
+                        group.tasks.refresh();
+                    });
+                    // Refresh data table components
+                    this.grids().forEach((grid) => {
+                        grid.refresh();
+                    });
+                }, 200);
+            });
+        });
     }
-    #dataChanged;
-    #providerChanged;
     createTaskDataSourceForGroup(tasks) {
         return new AXDataSource({
             load: async (e) => {
@@ -1538,12 +1614,12 @@ class AXMTaskBoardStatusGroupedGridViewComponent {
         this.onActionClick.emit({ nativeEvent: e.nativeEvent, task });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AXMTaskBoardStatusGroupedGridViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AXMTaskBoardStatusGroupedGridViewComponent, isStandalone: true, selector: "axm-task-board-status-grouped-grid-view", inputs: { provider: { classPropertyName: "provider", publicName: "provider", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { onActionClick: "onActionClick" }, ngImport: i0, template: "@for (group of groupedTasks(); track group) {\n  <h1 class=\"ax-text-xl ax-font-bold\">{{ group.statusInfo.title }}</h1>\n  <ax-data-table\n    class=\"ax-h-[300px]\"\n    [fetchDataMode]=\"'manual'\"\n    [dataSource]=\"group.tasks\"\n    [loading]=\"{ enabled: true, animation: true }\"\n  >\n    <ax-text-column dataField=\"title\" caption=\"title\" [width]=\"'350px'\"></ax-text-column>\n    <ax-text-column dataField=\"description\" caption=\"description\" [width]=\"'500px'\"></ax-text-column>\n    <ax-text-column dataField=\"startDate\" caption=\"Start Date\" [width]=\"'150px'\"></ax-text-column>\n    <ax-text-column dataField=\"endDate\" caption=\"Due Date\" [width]=\"'150px'\"></ax-text-column>\n    <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"reporter\" caption=\"Reporter\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"assignee\" caption=\"Assignee\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n\n    @for (column of columns(); track column) {\n      <axp-widget-column-renderer\n        [node]=\"column.widget\"\n        [caption]=\"(column.title | translate | async)!\"\n      ></axp-widget-column-renderer>\n    }\n\n    <ax-command-column\n      fixed=\"end\"\n      [width]=\"'60px'\"\n      (onItemClick)=\"onActionClickHandler($event)\"\n      [items]=\"[{ name: 'view', text: 'View', icon: 'ax-icon ax-icon-more-horizontal' }]\"\n    ></ax-command-column>\n  </ax-data-table>\n}\n", styles: ["ax-kanban{--ax-comp-kanban-status-min-width: 25rem;height:100%;line-height:1.5}\n"], dependencies: [{ kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i1$2.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "rowDetailsTemplate", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i1$2.AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }, { kind: "component", type: i1$2.AXRowCommandColumnComponent, selector: "ax-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i1.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["caption", "customExpandIcon", "customCollapseIcon", "customWidth", "node", "footerTemplate", "expandHandler", "cellTemplate", "headerTemplate"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AXMTaskBoardStatusGroupedGridViewComponent, isStandalone: true, selector: "axm-task-board-status-grouped-grid-view", inputs: { provider: { classPropertyName: "provider", publicName: "provider", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { onActionClick: "onActionClick" }, viewQueries: [{ propertyName: "grids", predicate: ["grid"], descendants: true, isSignal: true }], ngImport: i0, template: "@for (group of groupedTasks(); track group) {\n  <h1 class=\"ax-text-xl ax-font-bold\">{{ group.statusInfo.title }}</h1>\n  <ax-data-table\n    #grid\n    class=\"ax-h-[300px]\"\n    [fetchDataMode]=\"'manual'\"\n    [dataSource]=\"group.tasks\"\n    [loading]=\"{ enabled: true, animation: true }\"\n  >\n    <ax-text-column dataField=\"title\" caption=\"title\" [width]=\"'350px'\"></ax-text-column>\n    <ax-text-column dataField=\"description\" caption=\"description\" [width]=\"'500px'\"></ax-text-column>\n    <ax-text-column dataField=\"startDate\" caption=\"Start Date\" [width]=\"'150px'\"></ax-text-column>\n    <ax-text-column dataField=\"endDate\" caption=\"Due Date\" [width]=\"'150px'\"></ax-text-column>\n    <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"reporter\" caption=\"Reporter\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"assignee\" caption=\"Assignee\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n\n  \n\n    <ax-command-column\n      fixed=\"end\"\n      [width]=\"'60px'\"\n      (onItemClick)=\"onActionClickHandler($event)\"\n      [items]=\"[{ name: 'view', text: 'View', icon: 'ax-icon ax-icon-more-horizontal' }]\"\n    ></ax-command-column>\n  </ax-data-table>\n}\n", styles: ["ax-kanban{--ax-comp-kanban-status-min-width: 25rem;height:100%;line-height:1.5}\n"], dependencies: [{ kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i1$2.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "rowDetailsTemplate", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i1$2.AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }, { kind: "component", type: i1$2.AXRowCommandColumnComponent, selector: "ax-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXPWidgetCoreModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AXMTaskBoardStatusGroupedGridViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'axm-task-board-status-grouped-grid-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXDataTableModule, AXTranslatorPipe, AsyncPipe, AXPWidgetCoreModule], template: "@for (group of groupedTasks(); track group) {\n  <h1 class=\"ax-text-xl ax-font-bold\">{{ group.statusInfo.title }}</h1>\n  <ax-data-table\n    class=\"ax-h-[300px]\"\n    [fetchDataMode]=\"'manual'\"\n    [dataSource]=\"group.tasks\"\n    [loading]=\"{ enabled: true, animation: true }\"\n  >\n    <ax-text-column dataField=\"title\" caption=\"title\" [width]=\"'350px'\"></ax-text-column>\n    <ax-text-column dataField=\"description\" caption=\"description\" [width]=\"'500px'\"></ax-text-column>\n    <ax-text-column dataField=\"startDate\" caption=\"Start Date\" [width]=\"'150px'\"></ax-text-column>\n    <ax-text-column dataField=\"endDate\" caption=\"Due Date\" [width]=\"'150px'\"></ax-text-column>\n    <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"reporter\" caption=\"Reporter\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"assignee\" caption=\"Assignee\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n\n    @for (column of columns(); track column) {\n      <axp-widget-column-renderer\n        [node]=\"column.widget\"\n        [caption]=\"(column.title | translate | async)!\"\n      ></axp-widget-column-renderer>\n    }\n\n    <ax-command-column\n      fixed=\"end\"\n      [width]=\"'60px'\"\n      (onItemClick)=\"onActionClickHandler($event)\"\n      [items]=\"[{ name: 'view', text: 'View', icon: 'ax-icon ax-icon-more-horizontal' }]\"\n    ></ax-command-column>\n  </ax-data-table>\n}\n", styles: ["ax-kanban{--ax-comp-kanban-status-min-width: 25rem;height:100%;line-height:1.5}\n"] }]
-        }], propDecorators: { provider: [{ type: i0.Input, args: [{ isSignal: true, alias: "provider", required: false }] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], onActionClick: [{ type: i0.Output, args: ["onActionClick"] }] } });
+            args: [{ selector: 'axm-task-board-status-grouped-grid-view', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXDataTableModule, AXPWidgetCoreModule], template: "@for (group of groupedTasks(); track group) {\n  <h1 class=\"ax-text-xl ax-font-bold\">{{ group.statusInfo.title }}</h1>\n  <ax-data-table\n    #grid\n    class=\"ax-h-[300px]\"\n    [fetchDataMode]=\"'manual'\"\n    [dataSource]=\"group.tasks\"\n    [loading]=\"{ enabled: true, animation: true }\"\n  >\n    <ax-text-column dataField=\"title\" caption=\"title\" [width]=\"'350px'\"></ax-text-column>\n    <ax-text-column dataField=\"description\" caption=\"description\" [width]=\"'500px'\"></ax-text-column>\n    <ax-text-column dataField=\"startDate\" caption=\"Start Date\" [width]=\"'150px'\"></ax-text-column>\n    <ax-text-column dataField=\"endDate\" caption=\"Due Date\" [width]=\"'150px'\"></ax-text-column>\n    <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"reporter\" caption=\"Reporter\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"assignee\" caption=\"Assignee\" [width]=\"'125px'\"></ax-text-column>\n    <ax-text-column dataField=\"priority\" caption=\"priority\" [width]=\"'125px'\"></ax-text-column>\n\n  \n\n    <ax-command-column\n      fixed=\"end\"\n      [width]=\"'60px'\"\n      (onItemClick)=\"onActionClickHandler($event)\"\n      [items]=\"[{ name: 'view', text: 'View', icon: 'ax-icon ax-icon-more-horizontal' }]\"\n    ></ax-command-column>\n  </ax-data-table>\n}\n", styles: ["ax-kanban{--ax-comp-kanban-status-min-width: 25rem;height:100%;line-height:1.5}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { provider: [{ type: i0.Input, args: [{ isSignal: true, alias: "provider", required: false }] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], onActionClick: [{ type: i0.Output, args: ["onActionClick"] }], grids: [{ type: i0.ViewChildren, args: ['grid', { isSignal: true }] }] } });
 
 class AXMTaskBoardPage extends AXPPageLayoutBaseComponent {
     constructor() {
@@ -2220,4 +2296,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
         }], propDecorators: { popover: [{ type: i0.ViewChild, args: ['popover', { isSignal: true }] }], calendar: [{ type: i0.ViewChild, args: ['calendar', { isSignal: true }] }], sidebarCalendar: [{ type: i0.ViewChild, args: ['sidebarCalendar', { isSignal: true }] }], dayCellTemplateRef: [{ type: i0.ViewChild, args: ['dayCellTemplate', { isSignal: true }] }], contextMenu: [{ type: i0.ViewChild, args: ['rootContextMenu', { isSignal: true }] }] } });
 
 export { AXMTaskBoardPage };
-//# sourceMappingURL=acorex-modules-task-management-task-board.page-D7dEWzjn.mjs.map
+//# sourceMappingURL=acorex-modules-task-management-task-board.page-CIlxqtgJ.mjs.map