@acorex/modules 20.0.21 → 20.0.22

package/fesm2022/acorex-modules-report-management.mjs

@@ -1,11 +1,11 @@
 import { AXPSessionService, AXPAuthGuard } from '@acorex/platform/auth';
 import { AXP_REPORT_DEFINITION_PROVIDER, AXP_REPORT_CATEGORY_PROVIDER, createAllQueryView, AXPEntityCommandScope, AXPEntityQueryType, AXPLockService, AXP_MENU_PROVIDER, AXPReportDefinitionService } from '@acorex/platform/common';
 import { AXPDomainModule, provideEntity } from '@acorex/platform/domain';
-import { AXPQueryService, provideCommandSetups } from '@acorex/platform/runtime';
 import { AXPRootLayoutComponent } from '@acorex/platform/themes/default';
 import * as i0 from '@angular/core';
-import { inject, Injectable, NgModule, computed, input, output, ChangeDetectionStrategy, Component, viewChild, ViewEncapsulation } from '@angular/core';
+import { inject, Injectable, NgModule, computed, output, ViewEncapsulation, ChangeDetectionStrategy, Component, input, viewChild } from '@angular/core';
 import { ROUTES, ActivatedRoute, Router } from '@angular/router';
+import { AXPQueryService, AXPCommandService } from '@acorex/platform/runtime';
 import { AXP_EXPRESSION_EVALUATOR_SCOPE_PROVIDER } from '@acorex/platform/core';
 import * as i1 from '@acorex/platform/workflow';
 import { AXPWorkflowAction, AXPWorkflowModule } from '@acorex/platform/workflow';
@@ -25,7 +25,7 @@ import { AXDecoratorModule } from '@acorex/components/decorators';
 import * as i3 from '@acorex/components/loading';
 import { AXLoadingModule } from '@acorex/components/loading';
 import { AXUnsubscriber } from '@acorex/core/utils';
-import { AXPDynamicFormComponent, AXPThemeLayoutStartSideComponent, AXPThemeLayoutHeaderComponent, AXPThemeLayoutBlockComponent } from '@acorex/platform/layout/components';
+import { AXPDynamicFormComponent, AXPThemeLayoutStartSideComponent, AXPThemeLayoutHeaderComponent, AXPThemeLayoutBlockComponent, AXPThemeLayoutFooterComponent } from '@acorex/platform/layout/components';
 import { AXPPageLayoutBaseComponent, AXPPageLayoutComponent, AXPPageLayoutBase } from '@acorex/platform/layout/views';
 import { AXPLayoutThemeService } from '@acorex/platform/themes/shared';
 import * as i1$1 from '@angular/common';
@@ -1044,7 +1044,7 @@ function routesFacory() {
             children: [
                 {
                     path: '**',
-                    loadComponent: () => import('./acorex-modules-report-management-report-runner-root-page.component-S8qyvs79.mjs').then((c) => c.AXMReportRunnerRootPageComponent),
+                    loadComponent: () => import('./acorex-modules-report-management-report-runner-root-page.component-C3UP9Jsi.mjs').then((c) => c.AXMReportRunnerRootPageComponent),
                     data: { reuse: true },
                 },
             ],
@@ -1082,16 +1082,6 @@ class AXMReportManagementModule {
                 multi: true,
                 useFactory: routesFacory,
             },
-            provideCommandSetups([
-                {
-                    key: `${RootConfig.entities.report.fullName}:Run`,
-                    command: () => import('./acorex-modules-report-management-run.command-DHPmdkSZ.mjs').then((c) => c.AXMReportRunCommand),
-                },
-                {
-                    key: `${RootConfig.entities.report.fullName}:Execute`,
-                    command: () => Promise.resolve().then(function () { return execute_command; }).then((c) => c.AXMReportExecuteCommand),
-                },
-            ]),
             provideEntity([RootConfig.entities.report.fullName, RootConfig.entities.category.fullName]),
             {
                 provide: AXP_EXPRESSION_EVALUATOR_SCOPE_PROVIDER,
@@ -1151,16 +1141,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImpor
                             multi: true,
                             useFactory: routesFacory,
                         },
-                        provideCommandSetups([
-                            {
-                                key: `${RootConfig.entities.report.fullName}:Run`,
-                                command: () => import('./acorex-modules-report-management-run.command-DHPmdkSZ.mjs').then((c) => c.AXMReportRunCommand),
-                            },
-                            {
-                                key: `${RootConfig.entities.report.fullName}:Execute`,
-                                command: () => Promise.resolve().then(function () { return execute_command; }).then((c) => c.AXMReportExecuteCommand),
-                            },
-                        ]),
                         provideEntity([RootConfig.entities.report.fullName, RootConfig.entities.category.fullName]),
                         {
                             provide: AXP_EXPRESSION_EVALUATOR_SCOPE_PROVIDER,
@@ -1171,57 +1151,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImpor
                 }]
         }] });
 
-class AXMReportExecuteCommand {
-    //#region ----   Command Implementation   ----
-    async execute(input) {
-        try {
-            // Simulate mock data for now
-            const { parameters, page = 1, pageSize = 50 } = input;
-            // Mock data generation based on parameters
-            const mockData = this.generateMockData(parameters, pageSize);
-            return {
-                data: mockData,
-                total: 150, // Mock total
-                page,
-                pageSize
-            };
-        }
-        catch (error) {
-            console.error('Error executing report:', error);
-            throw new Error('Failed to execute report');
-        }
-    }
-    //#endregion
-    //#region ----   Mock Data Generation   ----
-    generateMockData(parameters, pageSize) {
-        const data = [];
-        for (let i = 0; i < pageSize; i++) {
-            data.push({
-                id: `report-item-${i + 1}`,
-                title: `Report Item ${i + 1}`,
-                category: parameters['category'] || 'General',
-                createdDate: new Date(Date.now() - Math.random() * 30 * 24 * 60 * 60 * 1000),
-                status: ['Active', 'Pending', 'Completed'][Math.floor(Math.random() * 3)],
-                value: Math.floor(Math.random() * 1000),
-                description: `This is a sample report item ${i + 1} with some description text.`,
-                ...(parameters['startDate'] && { filteredByDate: true }),
-                ...(parameters['category'] && { categoryFilter: parameters['category'] })
-            });
-        }
-        return data;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: AXMReportExecuteCommand, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: AXMReportExecuteCommand }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: AXMReportExecuteCommand, decorators: [{
-            type: Injectable
-        }] });
-
-var execute_command = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    AXMReportExecuteCommand: AXMReportExecuteCommand
-});
-
 const AXPReportViewerViewModel = signalStore(withState(() => ({
     reportDefinition: null,
     reportData: [],
@@ -1231,8 +1160,9 @@ const AXPReportViewerViewModel = signalStore(withState(() => ({
     status: AXPPageStatus.Idle,
     totalRecords: 0,
     currentPage: 1,
-    pageSize: 50,
+    pageSize: 10,
     error: null,
+    showResults: false,
 })), withComputed((store) => ({
     //#region ----   Layout Type Detection   ----
     layoutType: computed(() => store.reportDefinition()?.layout?.type),
@@ -1274,6 +1204,7 @@ const AXPReportViewerViewModel = signalStore(withState(() => ({
     //#region ----   Data Source   ----
     dataSource: computed(() => new AXDataSource({
         load: async () => {
+            debugger;
             const data = store.reportData();
             return {
                 items: data,
@@ -1307,7 +1238,7 @@ const AXPReportViewerViewModel = signalStore(withState(() => ({
     }),
     canExecute: computed(() => store.reportDefinition() !== null && !store.isLoading() && !store.isExecuting()),
     //#endregion
-})), withMethods((store, reportDefinitionService = inject(AXPReportDefinitionService), executeCommand = inject(AXMReportExecuteCommand)) => ({
+})), withMethods((store, reportDefinitionService = inject(AXPReportDefinitionService), commandService = inject(AXPCommandService)) => ({
     //#region ----   Report Loading   ----
     async loadReport(reportId) {
         patchState(store, {
@@ -1359,13 +1290,14 @@ const AXPReportViewerViewModel = signalStore(withState(() => ({
             error: null
         });
         try {
-            const result = await executeCommand.execute({
+            const result = await commandService.execute('ReportManagement.Report:Execute', {
                 reportId: report.id,
                 parameters: store.filterContext(),
                 page: store.currentPage(),
                 pageSize: store.pageSize()
             });
             patchState(store, {
+                showResults: true,
                 reportData: result.data || [],
                 totalRecords: result.total || 0,
                 previousFilterContext: { ...store.filterContext() }
@@ -1373,7 +1305,8 @@ const AXPReportViewerViewModel = signalStore(withState(() => ({
         }
         catch (error) {
             patchState(store, {
-                error: 'Failed to execute report'
+                error: 'Failed to execute report',
+                showResults: false,
             });
             console.error('Error executing report:', error);
         }
@@ -1386,9 +1319,8 @@ const AXPReportViewerViewModel = signalStore(withState(() => ({
     //#endregion
     //#region ----   Filter Management   ----
     updateFilterContext(context) {
-        // Replace context completely instead of merging to fix binding issues
         patchState(store, {
-            filterContext: { ...context }
+            filterContext: { ...store.filterContext(), ...context },
         });
     },
     clearFilters() {
@@ -1463,14 +1395,8 @@ const AXPReportViewerViewModel = signalStore(withState(() => ({
 
 class AXPReportTableViewComponent {
     constructor() {
-        //#region ----   Inputs   ----
-        this.dataSource = input.required();
-        this.columns = input.required();
-        this.isLoading = input(false);
-        this.hasError = input(false);
-        this.errorMessage = input(null);
-        this.hasData = input(false);
-        this.paginationEnabled = input(true);
+        //#region ----   Dependencies   ----
+        this.vm = inject(AXPReportViewerViewModel);
         //#endregion
         //#region ----   Outputs   ----
         this.rowClick = output();
@@ -1493,7 +1419,7 @@ class AXPReportTableViewComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: AXPReportTableViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.7", type: AXPReportTableViewComponent, isStandalone: true, selector: "axp-report-table-view", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, hasData: { classPropertyName: "hasData", publicName: "hasData", isSignal: true, isRequired: false, transformFunction: null }, paginationEnabled: { classPropertyName: "paginationEnabled", publicName: "paginationEnabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rowClick: "rowClick", actionClick: "actionClick" }, ngImport: i0, template: "<div class=\"axp-report-table-view\" *translate=\"let t\">\n  @if (isLoading()) {\n    <!-- Loading State -->\n    <div class=\"__loading-state\">\n      <ax-loading></ax-loading>\n      <p class=\"__loading-text\">\n        {{ t('@report-management:features.report-viewer.loading') | async }}\n      </p>\n    </div>\n  } @else if (hasError()) {\n    <!-- Error State -->\n    <div class=\"__error-state\">\n      <div class=\"__error-content\">\n        <div class=\"__error-icon\">\n          <ax-icon class=\"fa-light fa-exclamation-triangle\"></ax-icon>\n        </div>\n        <div class=\"__error-message\">\n          {{ errorMessage() || (t('@report-management:features.report-viewer.error') | async) }}\n        </div>\n      </div>\n    </div>\n  } @else if (!hasData()) {\n    <!-- No Data State -->\n    <div class=\"__no-data-state\">\n      <div class=\"__no-data-content\">\n        <div class=\"__no-data-icon\">\n          <ax-icon class=\"fa-light fa-table\"></ax-icon>\n        </div>\n        <div class=\"__no-data-title\">\n          {{ t('@report-management:features.report-viewer.no-data.title') | async }}\n        </div>\n        <div class=\"__no-data-description\">\n          {{ t('@report-management:features.report-viewer.no-data.description') | async }}\n        </div>\n      </div>\n    </div>\n  } @else {\n    <!-- Data Table -->\n    <div class=\"__table-container\">\n      <ax-data-table\n        [dataSource]=\"dataSource()\"\n        [paging]=\"paginationEnabled()\"\n        [fetchDataMode]=\"'manual'\"\n        [loading]=\"{ enabled: true, animation: true }\"\n        (onRowClick)=\"handleRowClick($event)\"\n        class=\"__data-table\"\n      >\n        <!-- Dynamic columns based on configuration -->\n        @for (column of columns(); track column.field) {\n          @if (column.visible) {\n            <ax-text-column [dataField]=\"column.field\" [caption]=\"column.title\" [width]=\"column.width\">\n            </ax-text-column>\n          }\n        }\n      </ax-data-table>\n    </div>\n  }\n</div>\n", styles: [".axp-report-table-view{display:flex;height:100%;width:100%;flex-direction:column}.axp-report-table-view .__loading-state{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem}.axp-report-table-view .__loading-state ax-loading{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__loading-state .__loading-text{max-width:28rem;text-align:center;font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-table-view .__error-state{display:flex;height:100%;align-items:center;justify-content:center;padding:2rem}.axp-report-table-view .__error-state .__error-content{display:flex;max-width:28rem;flex-direction:column;align-items:center;gap:1rem;text-align:center}.axp-report-table-view .__error-state .__error-content .__error-icon{margin-bottom:.5rem;font-size:3rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-danger-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__error-state .__error-content .__error-message{font-weight:500;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-danger-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__no-data-state{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center}.axp-report-table-view .__no-data-state .__no-data-content{max-width:28rem}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-icon{margin-bottom:1rem;font-size:3rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-secondary-500),var(--tw-text-opacity, 1));opacity:.5}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-title{margin-bottom:.5rem;font-size:1.125rem;line-height:1.75rem;font-weight:600}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-description{font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-table-view .__table-container{display:flex;flex:1 1 0%;flex-direction:column;overflow:hidden}.axp-report-table-view .__table-container .__data-table{height:100%;width:100%}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table{display:flex;height:100%;flex-direction:column}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table .ax-data-table-container{flex:1 1 0%;overflow:auto}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table .ax-data-table-content{height:100%;overflow:auto}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table .ax-table{min-height:0px}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table .ax-table-body{overflow:auto}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table-footer{flex-shrink:0;border-top-width:1px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i2.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "parentField", "rowTemplate", "emptyTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i2.AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i3.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i5.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXPLayoutBuilderModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.7", type: AXPReportTableViewComponent, isStandalone: true, selector: "axp-report-table-view", outputs: { rowClick: "rowClick", actionClick: "actionClick" }, host: { classAttribute: "axp-report-table-view" }, ngImport: i0, template: "<ng-container *translate=\"let t\">\n  @if (vm.isLoading()) {\n    <!-- Loading State -->\n    <div class=\"__loading-state\">\n      <ax-loading></ax-loading>\n      <p class=\"__loading-text\">\n        {{ t('@report-management:features.report-viewer.loading') | async }}\n      </p>\n    </div>\n  } @else if (vm.hasError()) {\n    <!-- Error State -->\n    <div class=\"__error-state\">\n      <div class=\"__error-content\">\n        <div class=\"__error-icon\">\n          <ax-icon class=\"fa-light fa-exclamation-triangle\"></ax-icon>\n        </div>\n        <div class=\"__error-message\">\n          {{ vm.error() || (t('@report-management:features.report-viewer.error') | async) }}\n        </div>\n      </div>\n    </div>\n  } @else if (!vm.hasData()) {\n    <!-- No Data State -->\n    <div class=\"__no-data-state\">\n      <div class=\"__no-data-content\">\n        <div class=\"__no-data-icon\">\n          <ax-icon class=\"fa-light fa-table\"></ax-icon>\n        </div>\n        <div class=\"__no-data-title\">\n          {{ t('@report-management:features.report-viewer.no-data.title') | async }}\n        </div>\n        <div class=\"__no-data-description\">\n          {{ t('@report-management:features.report-viewer.no-data.description') | async }}\n        </div>\n      </div>\n    </div>\n  } @else {\n    <!-- Data Table -->\n    <ax-data-table\n      [dataSource]=\"vm.dataSource()\"\n      [paging]=\"vm.paginationEnabled()\"\n      [loading]=\"{ enabled: true, animation: true }\"\n      (onRowClick)=\"handleRowClick($event)\"\n      class=\"ax-flex-1\"\n    >\n      <!-- Dynamic columns based on configuration -->\n      @for (column of vm.columns(); track column.field) {\n        @if (column.visible) {\n          <ax-text-column [dataField]=\"column.field\" [caption]=\"column.title\" [width]=\"column.width\"> </ax-text-column>\n        }\n      }\n    </ax-data-table>\n  }\n</ng-container>\n", styles: [".axp-report-table-view{display:flex;height:100%;width:100%;flex:1 1 0%;flex-direction:column;overflow:hidden}.axp-report-table-view .__loading-state{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem}.axp-report-table-view .__loading-state ax-loading{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__loading-state .__loading-text{max-width:28rem;text-align:center;font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-table-view .__error-state{display:flex;height:100%;align-items:center;justify-content:center;padding:2rem}.axp-report-table-view .__error-state .__error-content{display:flex;max-width:28rem;flex-direction:column;align-items:center;gap:1rem;text-align:center}.axp-report-table-view .__error-state .__error-content .__error-icon{margin-bottom:.5rem;font-size:3rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-danger-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__error-state .__error-content .__error-message{font-weight:500;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-danger-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__no-data-state{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center}.axp-report-table-view .__no-data-state .__no-data-content{max-width:28rem}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-icon{margin-bottom:1rem;font-size:3rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-secondary-500),var(--tw-text-opacity, 1));opacity:.5}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-title{margin-bottom:.5rem;font-size:1.125rem;line-height:1.75rem;font-weight:600}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-description{font-size:.875rem;line-height:1.25rem;opacity:.75}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i2.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "parentField", "rowTemplate", "emptyTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: i2.AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "component", type: i3.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i5.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXPLayoutBuilderModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: AXPReportTableViewComponent, decorators: [{
             type: Component,
@@ -1504,7 +1430,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImpor
                         AXDecoratorModule,
                         AXTranslationModule,
                         AXPLayoutBuilderModule
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"axp-report-table-view\" *translate=\"let t\">\n  @if (isLoading()) {\n    <!-- Loading State -->\n    <div class=\"__loading-state\">\n      <ax-loading></ax-loading>\n      <p class=\"__loading-text\">\n        {{ t('@report-management:features.report-viewer.loading') | async }}\n      </p>\n    </div>\n  } @else if (hasError()) {\n    <!-- Error State -->\n    <div class=\"__error-state\">\n      <div class=\"__error-content\">\n        <div class=\"__error-icon\">\n          <ax-icon class=\"fa-light fa-exclamation-triangle\"></ax-icon>\n        </div>\n        <div class=\"__error-message\">\n          {{ errorMessage() || (t('@report-management:features.report-viewer.error') | async) }}\n        </div>\n      </div>\n    </div>\n  } @else if (!hasData()) {\n    <!-- No Data State -->\n    <div class=\"__no-data-state\">\n      <div class=\"__no-data-content\">\n        <div class=\"__no-data-icon\">\n          <ax-icon class=\"fa-light fa-table\"></ax-icon>\n        </div>\n        <div class=\"__no-data-title\">\n          {{ t('@report-management:features.report-viewer.no-data.title') | async }}\n        </div>\n        <div class=\"__no-data-description\">\n          {{ t('@report-management:features.report-viewer.no-data.description') | async }}\n        </div>\n      </div>\n    </div>\n  } @else {\n    <!-- Data Table -->\n    <div class=\"__table-container\">\n      <ax-data-table\n        [dataSource]=\"dataSource()\"\n        [paging]=\"paginationEnabled()\"\n        [fetchDataMode]=\"'manual'\"\n        [loading]=\"{ enabled: true, animation: true }\"\n        (onRowClick)=\"handleRowClick($event)\"\n        class=\"__data-table\"\n      >\n        <!-- Dynamic columns based on configuration -->\n        @for (column of columns(); track column.field) {\n          @if (column.visible) {\n            <ax-text-column [dataField]=\"column.field\" [caption]=\"column.title\" [width]=\"column.width\">\n            </ax-text-column>\n          }\n        }\n      </ax-data-table>\n    </div>\n  }\n</div>\n", styles: [".axp-report-table-view{display:flex;height:100%;width:100%;flex-direction:column}.axp-report-table-view .__loading-state{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem}.axp-report-table-view .__loading-state ax-loading{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__loading-state .__loading-text{max-width:28rem;text-align:center;font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-table-view .__error-state{display:flex;height:100%;align-items:center;justify-content:center;padding:2rem}.axp-report-table-view .__error-state .__error-content{display:flex;max-width:28rem;flex-direction:column;align-items:center;gap:1rem;text-align:center}.axp-report-table-view .__error-state .__error-content .__error-icon{margin-bottom:.5rem;font-size:3rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-danger-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__error-state .__error-content .__error-message{font-weight:500;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-danger-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__no-data-state{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center}.axp-report-table-view .__no-data-state .__no-data-content{max-width:28rem}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-icon{margin-bottom:1rem;font-size:3rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-secondary-500),var(--tw-text-opacity, 1));opacity:.5}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-title{margin-bottom:.5rem;font-size:1.125rem;line-height:1.75rem;font-weight:600}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-description{font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-table-view .__table-container{display:flex;flex:1 1 0%;flex-direction:column;overflow:hidden}.axp-report-table-view .__table-container .__data-table{height:100%;width:100%}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table{display:flex;height:100%;flex-direction:column}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table .ax-data-table-container{flex:1 1 0%;overflow:auto}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table .ax-data-table-content{height:100%;overflow:auto}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table .ax-table{min-height:0px}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table .ax-table-body{overflow:auto}.axp-report-table-view .__table-container .__data-table ::ng-deep .ax-data-table-footer{flex-shrink:0;border-top-width:1px}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        class: 'axp-report-table-view'
+                    }, template: "<ng-container *translate=\"let t\">\n  @if (vm.isLoading()) {\n    <!-- Loading State -->\n    <div class=\"__loading-state\">\n      <ax-loading></ax-loading>\n      <p class=\"__loading-text\">\n        {{ t('@report-management:features.report-viewer.loading') | async }}\n      </p>\n    </div>\n  } @else if (vm.hasError()) {\n    <!-- Error State -->\n    <div class=\"__error-state\">\n      <div class=\"__error-content\">\n        <div class=\"__error-icon\">\n          <ax-icon class=\"fa-light fa-exclamation-triangle\"></ax-icon>\n        </div>\n        <div class=\"__error-message\">\n          {{ vm.error() || (t('@report-management:features.report-viewer.error') | async) }}\n        </div>\n      </div>\n    </div>\n  } @else if (!vm.hasData()) {\n    <!-- No Data State -->\n    <div class=\"__no-data-state\">\n      <div class=\"__no-data-content\">\n        <div class=\"__no-data-icon\">\n          <ax-icon class=\"fa-light fa-table\"></ax-icon>\n        </div>\n        <div class=\"__no-data-title\">\n          {{ t('@report-management:features.report-viewer.no-data.title') | async }}\n        </div>\n        <div class=\"__no-data-description\">\n          {{ t('@report-management:features.report-viewer.no-data.description') | async }}\n        </div>\n      </div>\n    </div>\n  } @else {\n    <!-- Data Table -->\n    <ax-data-table\n      [dataSource]=\"vm.dataSource()\"\n      [paging]=\"vm.paginationEnabled()\"\n      [loading]=\"{ enabled: true, animation: true }\"\n      (onRowClick)=\"handleRowClick($event)\"\n      class=\"ax-flex-1\"\n    >\n      <!-- Dynamic columns based on configuration -->\n      @for (column of vm.columns(); track column.field) {\n        @if (column.visible) {\n          <ax-text-column [dataField]=\"column.field\" [caption]=\"column.title\" [width]=\"column.width\"> </ax-text-column>\n        }\n      }\n    </ax-data-table>\n  }\n</ng-container>\n", styles: [".axp-report-table-view{display:flex;height:100%;width:100%;flex:1 1 0%;flex-direction:column;overflow:hidden}.axp-report-table-view .__loading-state{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;gap:1rem;padding:2rem}.axp-report-table-view .__loading-state ax-loading{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__loading-state .__loading-text{max-width:28rem;text-align:center;font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-table-view .__error-state{display:flex;height:100%;align-items:center;justify-content:center;padding:2rem}.axp-report-table-view .__error-state .__error-content{display:flex;max-width:28rem;flex-direction:column;align-items:center;gap:1rem;text-align:center}.axp-report-table-view .__error-state .__error-content .__error-icon{margin-bottom:.5rem;font-size:3rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-danger-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__error-state .__error-content .__error-message{font-weight:500;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-danger-500),var(--tw-text-opacity, 1))}.axp-report-table-view .__no-data-state{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center}.axp-report-table-view .__no-data-state .__no-data-content{max-width:28rem}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-icon{margin-bottom:1rem;font-size:3rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-secondary-500),var(--tw-text-opacity, 1));opacity:.5}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-title{margin-bottom:.5rem;font-size:1.125rem;line-height:1.75rem;font-weight:600}.axp-report-table-view .__no-data-state .__no-data-content .__no-data-description{font-size:.875rem;line-height:1.25rem;opacity:.75}\n"] }]
         }] });
 
 class AXPReportViewerPageComponent extends AXPPageLayoutBaseComponent {
@@ -1521,15 +1449,11 @@ class AXPReportViewerPageComponent extends AXPPageLayoutBaseComponent {
         this.reportId = input();
         this.reportParameters = input({});
         //#endregion
-        //#region ----   Outputs   ----
-        this.reportExecuted = output();
-        //#endregion
         //#region ----   ViewChildren   ----
         this.filtersForm = viewChild('filtersForm');
-        this.mobileFiltersForm = viewChild('mobileFiltersForm');
         //#endregion
         //#region ----   ViewModel   ----
-        this.vm = new AXPReportViewerViewModel();
+        this.vm = inject(AXPReportViewerViewModel);
         //#endregion
         //#region ----   Computed Properties   ----
         this.showFiltersPanel = () => this.layoutService.isLarge();
@@ -1556,40 +1480,58 @@ class AXPReportViewerPageComponent extends AXPPageLayoutBaseComponent {
     //#region ----   Lifecycle   ----
     async ngOnInit() {
         await super.ngOnInit();
-        // Load report from route parameter or input
+        // Subscribe to route parameter changes for dynamic report loading
+        this.unsubscriber.takeUntilDestroy(this.route.paramMap).subscribe(async (params) => {
+            const reportId = params.get('reportId') ||
+                this.route.snapshot.queryParamMap.get('reportId') ||
+                this.reportId();
+            if (reportId) {
+                await this.loadReportAndRefresh(reportId);
+            }
+        });
+        // Initial load if reportId is available
         const reportId = this.route.snapshot.paramMap.get('reportId') ||
             this.route.snapshot.queryParamMap.get('reportId') ||
             this.reportId();
         if (reportId) {
-            await this.vm.loadReport(reportId);
-            // Extract all query parameters except reportId as initial parameters
-            const queryParams = this.route.snapshot.queryParams;
-            const initialParams = { ...queryParams };
-            delete initialParams['reportId']; // Remove reportId from parameters
-            // Merge with component input parameters
-            const allParams = { ...initialParams, ...this.reportParameters() };
-            if (Object.keys(allParams).length > 0) {
-                console.log('Applying initial parameters:', allParams);
-                this.vm.updateFilterContext(allParams);
-                // Auto-execute if parameters are provided
-                setTimeout(async () => {
-                    await this.vm.executeReport();
-                }, 500); // Small delay to ensure form is ready
-            }
+            await this.loadReportAndRefresh(reportId);
+        }
+    }
+    //#endregion
+    //#region ----   Helper Methods   ----
+    async loadReportAndRefresh(reportId) {
+        await this.vm.loadReport(reportId);
+        // Force refresh of page layout (breadcrumbs, title, etc.) after report loads
+        this.recompute();
+        // Handle initial parameters from query string
+        const queryParams = this.route.snapshot.queryParams;
+        const initialParams = { ...queryParams };
+        delete initialParams['reportId']; // Remove reportId from parameters
+        // Merge with component input parameters
+        const allParams = { ...initialParams, ...this.reportParameters() };
+        if (Object.keys(allParams).length > 0) {
+            console.log('Applying initial parameters:', allParams);
+            this.vm.updateFilterContext(allParams);
+            // Auto-execute if parameters are provided
+            setTimeout(async () => {
+                await this.vm.executeReport();
+            }, 500); // Small delay to ensure form is ready
         }
     }
     //#endregion
     //#region ----   Event Handlers   ----
     handleFiltersChange(event) {
-        this.vm.updateFilterContext(event.data);
+        this.vm.updateFilterContext(event);
     }
     handleFiltersInitiated(event) {
-        this.vm.updateFilterContext(event.data);
+        this.vm.updateFilterContext(event);
     }
     async handleExecuteReport() {
-        console.log('Executing report with context:', this.vm.filterContext());
+        const isValid = await this.filtersForm()?.validate();
+        if (!isValid) {
+            return;
+        }
         await this.vm.executeReport();
-        this.reportExecuted.emit(this.vm.reportData());
     }
     handleRefresh() {
         this.vm.refresh();
@@ -1597,7 +1539,7 @@ class AXPReportViewerPageComponent extends AXPPageLayoutBaseComponent {
     handleClearFilters() {
         this.vm.clearFilters();
         // Reset form if available
-        const form = this.filtersForm() || this.mobileFiltersForm();
+        const form = this.filtersForm();
         if (form) {
             form.resetErrors();
         }
@@ -1616,7 +1558,7 @@ class AXPReportViewerPageComponent extends AXPPageLayoutBaseComponent {
         const breadcrumbs = [
             {
                 name: 'reports',
-                title: await this.translateService.translateAsync('@report-management:features.report-runner.menu-title'),
+                title: await this.translateService.translateAsync('@report-management:root-menu'),
                 command: {
                     name: 'navigate-to-reports',
                 },
@@ -1751,14 +1693,16 @@ class AXPReportViewerPageComponent extends AXPPageLayoutBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: AXPReportViewerPageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.7", type: AXPReportViewerPageComponent, isStandalone: true, selector: "axp-report-viewer-page", inputs: { reportId: { classPropertyName: "reportId", publicName: "reportId", isSignal: true, isRequired: false, transformFunction: null }, reportParameters: { classPropertyName: "reportParameters", publicName: "reportParameters", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { reportExecuted: "reportExecuted" }, host: { classAttribute: "axp-report-viewer-page" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.7", type: AXPReportViewerPageComponent, isStandalone: true, selector: "axp-report-viewer-page", inputs: { reportId: { classPropertyName: "reportId", publicName: "reportId", isSignal: true, isRequired: false, transformFunction: null }, reportParameters: { classPropertyName: "reportParameters", publicName: "reportParameters", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "axp-report-viewer-page" }, providers: [
             AXUnsubscriber,
-            AXMReportExecuteCommand,
+            AXPReportViewerViewModel,
             {
                 provide: AXPPageLayoutBase,
                 useExisting: AXPReportViewerPageComponent,
             },
-        ], viewQueries: [{ propertyName: "filtersForm", first: true, predicate: ["filtersForm"], descendants: true, isSignal: true }, { propertyName: "mobileFiltersForm", first: true, predicate: ["mobileFiltersForm"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<axp-page-layout *translate=\"let t\">\n  <!-- Left Panel: Filters (Always visible for desktop) -->\n  @if (showFiltersPanel()) {\n  <axp-layout-start-side>\n    <axp-layout-header>\n      <axp-layout-title>\n        {{ t('@report-management:features.report-viewer.filters.title') | async }}\n      </axp-layout-title>\n    </axp-layout-header>\n    <axp-layout-content>\n      <div class=\"__filters-container\">\n        <axp-dynamic-form #filtersForm [formDefinition]=\"vm.formDefinition()\" [context]=\"vm.filterContext()\"\n          [layoutConfig]=\"defaultLayout()\" [layoutStyle]=\"'compact'\" (contextChange)=\"handleFiltersChange($event)\"\n          (contextInitiated)=\"handleFiltersInitiated($event)\">\n        </axp-dynamic-form>\n      </div>\n    </axp-layout-content>\n  </axp-layout-start-side>\n  }\n\n  <!-- Main Content: Report Display -->\n  <axp-page-content>\n    <!-- Mobile Filters (Collapsed) -->\n    @if (!showFiltersPanel() && vm.reportDefinition()) {\n    <div class=\"__mobile-filters\">\n      <axp-dynamic-form #mobileFiltersForm [formDefinition]=\"vm.formDefinition()\" [context]=\"vm.filterContext()\"\n        [layoutConfig]=\"compactLayout()\" [layoutStyle]=\"'compact'\" (contextChange)=\"handleFiltersChange($event)\"\n        (contextInitiated)=\"handleFiltersInitiated($event)\">\n      </axp-dynamic-form>\n    </div>\n    }\n\n    @if (!vm.reportDefinition()) {\n    <!-- No Report Selected State -->\n    <div class=\"__no-report\">\n      <div class=\"__no-report-icon\">\n        <ax-icon class=\"fa-light fa-chart-line\"></ax-icon>\n      </div>\n      <div class=\"__no-report-content\">\n        <h3 class=\"__no-report-title\">\n          {{ t('@report-management:features.report-viewer.no-report.title') | async }}\n        </h3>\n        <p class=\"__no-report-description\">\n          {{ t('@report-management:features.report-viewer.no-report.description') | async }}\n        </p>\n        <div class=\"__no-report-actions\">\n          <ax-button look=\"outline\" color=\"primary\"\n            [text]=\"t('@report-management:features.report-viewer.no-report.browse-reports') | async\">\n            <ax-prefix>\n              <ax-icon class=\"fa-light fa-folder-open\"></ax-icon>\n            </ax-prefix>\n          </ax-button>\n        </div>\n      </div>\n    </div>\n    } @else {\n    <!-- Report Display Area -->\n    @if (vm.isTableLayout()) {\n    <axp-report-table-view [dataSource]=\"vm.dataSource()\" [columns]=\"vm.columns()\" [isLoading]=\"vm.isLoading()\"\n      [hasError]=\"vm.hasError()\" [errorMessage]=\"vm.error()\" [hasData]=\"vm.hasData()\"\n      [paginationEnabled]=\"vm.paginationEnabled()\" (rowClick)=\"handleRowClick($event)\"\n      (actionClick)=\"handleActionClick($event)\">\n    </axp-report-table-view>\n    } @else if (vm.isChartLayout()) {\n    <!-- Chart View Placeholder -->\n    <div class=\"__chart-placeholder\">\n      <div class=\"__placeholder-icon\">\n        <ax-icon class=\"fa-light fa-chart-column\"></ax-icon>\n      </div>\n      <div class=\"__placeholder-content\">\n        <h4 class=\"__placeholder-title\">Chart View</h4>\n        <p class=\"__placeholder-description\">Chart visualization will be implemented here</p>\n      </div>\n    </div>\n    } @else if (vm.isCardsLayout()) {\n    <!-- Cards View Placeholder -->\n    <div class=\"__cards-placeholder\">\n      <div class=\"__placeholder-icon\">\n        <ax-icon class=\"fa-light fa-table-cells\"></ax-icon>\n      </div>\n      <div class=\"__placeholder-content\">\n        <h4 class=\"__placeholder-title\">Cards View</h4>\n        <p class=\"__placeholder-description\">Card-based layout will be implemented here</p>\n      </div>\n    </div>\n    } @else {\n    <!-- Custom Layout Placeholder -->\n    <div class=\"__custom-placeholder\">\n      <div class=\"__placeholder-icon\">\n        <ax-icon class=\"fa-light fa-layout-grid\"></ax-icon>\n      </div>\n      <div class=\"__placeholder-content\">\n        <h4 class=\"__placeholder-title\">Custom Layout</h4>\n        <p class=\"__placeholder-description\">Custom report layout will be implemented here</p>\n      </div>\n    </div>\n    }\n    }\n  </axp-page-content>\n\n  <!-- Footer: Execute Button -->\n  <axp-page-footer class=\"--animated\">\n    <axp-layout-suffix>\n      <ax-button [class.ax-sm]=\"layoutService.isSmall()\"\n        [text]=\"t('@report-management:features.report-viewer.actions.execute') | async\" [color]=\"'primary'\"\n        (onClick)=\"execute({ name: 'execute-report' })\">\n        <ax-prefix>\n          <ax-icon class=\"fa-light fa-play\"></ax-icon>\n        </ax-prefix>\n      </ax-button>\n    </axp-layout-suffix>\n  </axp-page-footer>\n</axp-page-layout>", styles: [".axp-report-viewer-page{display:flex;height:100%;width:100%;flex-direction:column}.axp-report-viewer-page axp-layout-start-side{height:100%;width:20rem;border-inline-end-width:1px;background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}@media (min-width: 1920px){.axp-report-viewer-page axp-layout-start-side{width:24rem}}.axp-report-viewer-page axp-layout-start-side axp-layout-content{overflow-x:auto}.axp-report-viewer-page axp-layout-start-side .__filters-container{padding:1rem}.axp-report-viewer-page .__mobile-filters{flex-shrink:0;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lightest-surface),var(--tw-border-opacity, 1));padding:1rem;background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.axp-report-viewer-page axp-page-content{display:flex;height:100%;flex-direction:column}.axp-report-viewer-page .__no-report{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center}.axp-report-viewer-page .__no-report .__no-report-icon{margin-bottom:1rem;font-size:3.75rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1));opacity:.5}.axp-report-viewer-page .__no-report .__no-report-content{max-width:28rem}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-title{margin-bottom:.5rem;font-size:1.25rem;line-height:1.75rem;font-weight:600}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-description{margin-bottom:1.5rem;font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-actions{display:flex;justify-content:center}.axp-report-viewer-page axp-report-table-view{flex:1 1 0%;overflow:hidden}.axp-report-viewer-page .__chart-placeholder,.axp-report-viewer-page .__cards-placeholder,.axp-report-viewer-page .__custom-placeholder{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center;margin:1.5rem;border-radius:.5rem;border-width:2px;border-style:dashed;--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1));background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.axp-report-viewer-page .__chart-placeholder .__placeholder-icon,.axp-report-viewer-page .__cards-placeholder .__placeholder-icon,.axp-report-viewer-page .__custom-placeholder .__placeholder-icon{margin-bottom:1rem;font-size:3rem;line-height:1;opacity:.5}.axp-report-viewer-page .__chart-placeholder .__placeholder-content,.axp-report-viewer-page .__cards-placeholder .__placeholder-content,.axp-report-viewer-page .__custom-placeholder .__placeholder-content{max-width:28rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-title{margin-bottom:.5rem;font-size:1.125rem;line-height:1.75rem;font-weight:600}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-description{font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-viewer-page .__chart-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1))}.axp-report-viewer-page .__cards-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-secondary-500),var(--tw-text-opacity, 1))}.axp-report-viewer-page .__custom-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-accent1-500),var(--tw-text-opacity, 1))}@media (max-width: 768px){.axp-report-viewer-page .__chart-placeholder,.axp-report-viewer-page .__cards-placeholder,.axp-report-viewer-page .__custom-placeholder{margin:1rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-title{font-size:1rem;line-height:1.5rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-description{font-size:.75rem;line-height:1rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i5.AXTranslatorDirective, selector: "[translate]" }, { kind: "component", type: AXPDynamicFormComponent, selector: "axp-dynamic-form", inputs: ["formDefinition", "context", "layoutStyle", "layoutConfig"], outputs: ["contextChange", "contextInitiated", "validityChange"] }, { kind: "component", type: AXPPageLayoutComponent, selector: "axp-page-layout" }, { kind: "component", type: AXPThemeLayoutStartSideComponent, selector: "axp-layout-page-start-side, axp-layout-start-side" }, { kind: "component", type: AXPThemeLayoutHeaderComponent, selector: "axp-layout-header" }, { kind: "component", type: AXPThemeLayoutBlockComponent, selector: "    axp-page-content,     axp-page-footer-container,    axp-page-footer,    axp-page-header,    axp-page-header-container,    axp-page-toolbar,    axp-layout-content,     axp-layout-page-content,     axp-layout-sections,    axp-layout-body,    axp-layout-page-body,    axp-layout-prefix,    axp-layout-suffix,    axp-layout-title-bar,    axp-layout-title,     axp-layout-title-actions,     axp-layout-nav-button,     axp-layout-description,     axp-layout-breadcrumbs,    axp-layout-list-action,    " }, { kind: "component", type: AXPReportTableViewComponent, selector: "axp-report-table-view", inputs: ["dataSource", "columns", "isLoading", "hasError", "errorMessage", "hasData", "paginationEnabled"], outputs: ["rowClick", "actionClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "filtersForm", first: true, predicate: ["filtersForm"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<axp-page-layout *translate=\"let t\">\n  <!-- Left Panel: Filters (Always visible for desktop) -->\n  @if (showFiltersPanel()) {\n    <axp-layout-start-side>\n      <axp-layout-header>\n        <axp-layout-title>\n          {{ t('@report-management:features.report-viewer.filters.title') | async }}\n        </axp-layout-title>\n      </axp-layout-header>\n      <axp-layout-content>\n        <div class=\"__filters-container\">\n          <axp-dynamic-form\n            #filtersForm\n            [formDefinition]=\"vm.formDefinition()\"\n            [context]=\"vm.filterContext()\"\n            [layoutConfig]=\"defaultLayout()\"\n            [layoutStyle]=\"'compact'\"\n            (contextChange)=\"handleFiltersChange($event)\"\n            (contextInitiated)=\"handleFiltersInitiated($event)\"\n          >\n          </axp-dynamic-form>\n        </div>\n      </axp-layout-content>\n      <axp-layout-footer class=\"ax-p-4 ax-border-t\">\n        <ax-button\n          [class.ax-sm]=\"layoutService.isSmall()\"\n          class=\"ax-w-full\"\n          [text]=\"t('@report-management:features.report-viewer.actions.execute') | async\"\n          [color]=\"'primary'\"\n          (onClick)=\"execute({ name: 'execute-report' })\"\n        >\n          <ax-prefix>\n            <ax-icon class=\"fa-light fa-play\"></ax-icon>\n          </ax-prefix>\n        </ax-button>\n      </axp-layout-footer>\n    </axp-layout-start-side>\n  }\n  <!-- Main Content: Report Display -->\n  <axp-page-content>\n    @if (!vm.reportDefinition()) {\n      <ng-container *ngTemplateOutlet=\"noReport\"></ng-container>\n    } @else {\n      <ng-container *ngTemplateOutlet=\"reportDisplay\"></ng-container>\n    }\n  </axp-page-content>\n</axp-page-layout>\n\n<!-- Report Display Area -->\n<ng-template #reportDisplay>\n  @if (vm.isTableLayout()) {\n    <axp-report-table-view (rowClick)=\"handleRowClick($event)\" (actionClick)=\"handleActionClick($event)\">\n    </axp-report-table-view>\n  } @else if (vm.isChartLayout()) {\n    <!-- Chart View Placeholder -->\n    <div class=\"__chart-placeholder\">\n      <div class=\"__placeholder-icon\">\n        <ax-icon class=\"fa-light fa-chart-column\"></ax-icon>\n      </div>\n      <div class=\"__placeholder-content\">\n        <h4 class=\"__placeholder-title\">Chart View</h4>\n        <p class=\"__placeholder-description\">Chart visualization will be implemented here</p>\n      </div>\n    </div>\n  } @else {\n    <!-- Custom Layout Placeholder -->\n    <div class=\"__custom-placeholder\">\n      <div class=\"__placeholder-icon\">\n        <ax-icon class=\"fa-light fa-layout-grid\"></ax-icon>\n      </div>\n      <div class=\"__placeholder-content\">\n        <h4 class=\"__placeholder-title\">Custom Layout</h4>\n        <p class=\"__placeholder-description\">Custom report layout will be implemented here</p>\n      </div>\n    </div>\n  }\n</ng-template>\n\n<!-- No Report Selected State -->\n<ng-template #noReport>\n  <div class=\"__no-report\" *translate=\"let t\">\n    <div class=\"__no-report-icon\">\n      <ax-icon class=\"fa-light fa-chart-line\"></ax-icon>\n    </div>\n    <div class=\"__no-report-content\">\n      <h3 class=\"__no-report-title\">\n        {{ t('@report-management:features.report-viewer.no-report.title') | async }}\n      </h3>\n      <p class=\"__no-report-description\">\n        {{ t('@report-management:features.report-viewer.no-report.description') | async }}\n      </p>\n      <div class=\"__no-report-actions\">\n        <ax-button\n          look=\"outline\"\n          color=\"primary\"\n          [text]=\"t('@report-management:features.report-viewer.no-report.browse-reports') | async\"\n        >\n          <ax-prefix>\n            <ax-icon class=\"fa-light fa-folder-open\"></ax-icon>\n          </ax-prefix>\n        </ax-button>\n      </div>\n    </div>\n  </div>\n</ng-template>\n", styles: [".axp-report-viewer-page{display:flex;height:100%;width:100%;flex-direction:column}.axp-report-viewer-page axp-layout-container{overflow:hidden}.axp-report-viewer-page axp-layout-start-side{height:100%;width:20rem;border-inline-end-width:1px;background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}@media (min-width: 1920px){.axp-report-viewer-page axp-layout-start-side{width:24rem}}.axp-report-viewer-page axp-layout-start-side>axp-layout-header{height:73px;border-bottom-width:1px}.axp-report-viewer-page axp-layout-start-side axp-layout-content{overflow-x:auto;padding:.5rem}.axp-report-viewer-page axp-layout-start-side axp-layout-content .__filters-container axp-layout-sections{gap:0px!important}.axp-report-viewer-page axp-layout-start-side axp-layout-content .__filters-container axp-layout-sections axp-layout-section{border-style:none!important;padding:0!important;--tw-shadow: 0 0 #0000 !important;--tw-shadow-colored: 0 0 #0000 !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)!important}.axp-report-viewer-page .__mobile-filters{flex-shrink:0;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lightest-surface),var(--tw-border-opacity, 1));padding:1rem;background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.axp-report-viewer-page axp-page-content{display:flex;height:100%;flex-direction:column}.axp-report-viewer-page .__no-report{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center}.axp-report-viewer-page .__no-report .__no-report-icon{margin-bottom:1rem;font-size:3.75rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1));opacity:.5}.axp-report-viewer-page .__no-report .__no-report-content{max-width:28rem}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-title{margin-bottom:.5rem;font-size:1.25rem;line-height:1.75rem;font-weight:600}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-description{margin-bottom:1.5rem;font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-actions{display:flex;justify-content:center}.axp-report-viewer-page axp-report-table-view{flex:1 1 0%;overflow:hidden}.axp-report-viewer-page .__chart-placeholder,.axp-report-viewer-page .__cards-placeholder,.axp-report-viewer-page .__custom-placeholder{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center;margin:1.5rem;border-radius:.5rem;border-width:2px;border-style:dashed;--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1));background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.axp-report-viewer-page .__chart-placeholder .__placeholder-icon,.axp-report-viewer-page .__cards-placeholder .__placeholder-icon,.axp-report-viewer-page .__custom-placeholder .__placeholder-icon{margin-bottom:1rem;font-size:3rem;line-height:1;opacity:.5}.axp-report-viewer-page .__chart-placeholder .__placeholder-content,.axp-report-viewer-page .__cards-placeholder .__placeholder-content,.axp-report-viewer-page .__custom-placeholder .__placeholder-content{max-width:28rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-title{margin-bottom:.5rem;font-size:1.125rem;line-height:1.75rem;font-weight:600}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-description{font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-viewer-page .__chart-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1))}.axp-report-viewer-page .__cards-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-secondary-500),var(--tw-text-opacity, 1))}.axp-report-viewer-page .__custom-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-accent1-500),var(--tw-text-opacity, 1))}@media (max-width: 768px){.axp-report-viewer-page .__chart-placeholder,.axp-report-viewer-page .__cards-placeholder,.axp-report-viewer-page .__custom-placeholder{margin:1rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-title{font-size:1rem;line-height:1.5rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-description{font-size:.75rem;line-height:1rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i2$1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i4.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i4.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i5.AXTranslatorDirective, selector: "[translate]" }, { kind: "component", type: 
+                // 
+                AXPDynamicFormComponent, selector: "axp-dynamic-form", inputs: ["formDefinition", "context", "layoutStyle", "layoutConfig"], outputs: ["contextChange", "contextInitiated", "validityChange"] }, { kind: "component", type: AXPPageLayoutComponent, selector: "axp-page-layout" }, { kind: "component", type: AXPThemeLayoutStartSideComponent, selector: "axp-layout-page-start-side, axp-layout-start-side" }, { kind: "component", type: AXPThemeLayoutHeaderComponent, selector: "axp-layout-header" }, { kind: "component", type: AXPThemeLayoutBlockComponent, selector: "    axp-page-content,     axp-page-footer-container,    axp-page-footer,    axp-page-header,    axp-page-header-container,    axp-page-toolbar,    axp-layout-content,     axp-layout-page-content,     axp-layout-sections,    axp-layout-body,    axp-layout-page-body,    axp-layout-prefix,    axp-layout-suffix,    axp-layout-title-bar,    axp-layout-title,     axp-layout-title-actions,     axp-layout-nav-button,     axp-layout-description,     axp-layout-breadcrumbs,    axp-layout-list-action,    " }, { kind: "component", type: AXPReportTableViewComponent, selector: "axp-report-table-view", outputs: ["rowClick", "actionClick"] }, { kind: "component", type: AXPThemeLayoutFooterComponent, selector: "axp-layout-footer, axp-layout-page-footer" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: AXPReportViewerPageComponent, decorators: [{
             type: Component,
@@ -1768,20 +1712,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImpor
                         AXDecoratorModule,
                         AXLoadingModule,
                         AXTranslationModule,
+                        // 
                         AXPDynamicFormComponent,
                         AXPPageLayoutComponent,
                         AXPThemeLayoutStartSideComponent,
                         AXPThemeLayoutHeaderComponent,
                         AXPThemeLayoutBlockComponent,
-                        AXPReportTableViewComponent
+                        AXPReportTableViewComponent,
+                        AXPThemeLayoutFooterComponent
                     ], providers: [
                         AXUnsubscriber,
-                        AXMReportExecuteCommand,
+                        AXPReportViewerViewModel,
                         {
                             provide: AXPPageLayoutBase,
                             useExisting: AXPReportViewerPageComponent,
                         },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { class: 'axp-report-viewer-page' }, template: "<axp-page-layout *translate=\"let t\">\n  <!-- Left Panel: Filters (Always visible for desktop) -->\n  @if (showFiltersPanel()) {\n  <axp-layout-start-side>\n    <axp-layout-header>\n      <axp-layout-title>\n        {{ t('@report-management:features.report-viewer.filters.title') | async }}\n      </axp-layout-title>\n    </axp-layout-header>\n    <axp-layout-content>\n      <div class=\"__filters-container\">\n        <axp-dynamic-form #filtersForm [formDefinition]=\"vm.formDefinition()\" [context]=\"vm.filterContext()\"\n          [layoutConfig]=\"defaultLayout()\" [layoutStyle]=\"'compact'\" (contextChange)=\"handleFiltersChange($event)\"\n          (contextInitiated)=\"handleFiltersInitiated($event)\">\n        </axp-dynamic-form>\n      </div>\n    </axp-layout-content>\n  </axp-layout-start-side>\n  }\n\n  <!-- Main Content: Report Display -->\n  <axp-page-content>\n    <!-- Mobile Filters (Collapsed) -->\n    @if (!showFiltersPanel() && vm.reportDefinition()) {\n    <div class=\"__mobile-filters\">\n      <axp-dynamic-form #mobileFiltersForm [formDefinition]=\"vm.formDefinition()\" [context]=\"vm.filterContext()\"\n        [layoutConfig]=\"compactLayout()\" [layoutStyle]=\"'compact'\" (contextChange)=\"handleFiltersChange($event)\"\n        (contextInitiated)=\"handleFiltersInitiated($event)\">\n      </axp-dynamic-form>\n    </div>\n    }\n\n    @if (!vm.reportDefinition()) {\n    <!-- No Report Selected State -->\n    <div class=\"__no-report\">\n      <div class=\"__no-report-icon\">\n        <ax-icon class=\"fa-light fa-chart-line\"></ax-icon>\n      </div>\n      <div class=\"__no-report-content\">\n        <h3 class=\"__no-report-title\">\n          {{ t('@report-management:features.report-viewer.no-report.title') | async }}\n        </h3>\n        <p class=\"__no-report-description\">\n          {{ t('@report-management:features.report-viewer.no-report.description') | async }}\n        </p>\n        <div class=\"__no-report-actions\">\n          <ax-button look=\"outline\" color=\"primary\"\n            [text]=\"t('@report-management:features.report-viewer.no-report.browse-reports') | async\">\n            <ax-prefix>\n              <ax-icon class=\"fa-light fa-folder-open\"></ax-icon>\n            </ax-prefix>\n          </ax-button>\n        </div>\n      </div>\n    </div>\n    } @else {\n    <!-- Report Display Area -->\n    @if (vm.isTableLayout()) {\n    <axp-report-table-view [dataSource]=\"vm.dataSource()\" [columns]=\"vm.columns()\" [isLoading]=\"vm.isLoading()\"\n      [hasError]=\"vm.hasError()\" [errorMessage]=\"vm.error()\" [hasData]=\"vm.hasData()\"\n      [paginationEnabled]=\"vm.paginationEnabled()\" (rowClick)=\"handleRowClick($event)\"\n      (actionClick)=\"handleActionClick($event)\">\n    </axp-report-table-view>\n    } @else if (vm.isChartLayout()) {\n    <!-- Chart View Placeholder -->\n    <div class=\"__chart-placeholder\">\n      <div class=\"__placeholder-icon\">\n        <ax-icon class=\"fa-light fa-chart-column\"></ax-icon>\n      </div>\n      <div class=\"__placeholder-content\">\n        <h4 class=\"__placeholder-title\">Chart View</h4>\n        <p class=\"__placeholder-description\">Chart visualization will be implemented here</p>\n      </div>\n    </div>\n    } @else if (vm.isCardsLayout()) {\n    <!-- Cards View Placeholder -->\n    <div class=\"__cards-placeholder\">\n      <div class=\"__placeholder-icon\">\n        <ax-icon class=\"fa-light fa-table-cells\"></ax-icon>\n      </div>\n      <div class=\"__placeholder-content\">\n        <h4 class=\"__placeholder-title\">Cards View</h4>\n        <p class=\"__placeholder-description\">Card-based layout will be implemented here</p>\n      </div>\n    </div>\n    } @else {\n    <!-- Custom Layout Placeholder -->\n    <div class=\"__custom-placeholder\">\n      <div class=\"__placeholder-icon\">\n        <ax-icon class=\"fa-light fa-layout-grid\"></ax-icon>\n      </div>\n      <div class=\"__placeholder-content\">\n        <h4 class=\"__placeholder-title\">Custom Layout</h4>\n        <p class=\"__placeholder-description\">Custom report layout will be implemented here</p>\n      </div>\n    </div>\n    }\n    }\n  </axp-page-content>\n\n  <!-- Footer: Execute Button -->\n  <axp-page-footer class=\"--animated\">\n    <axp-layout-suffix>\n      <ax-button [class.ax-sm]=\"layoutService.isSmall()\"\n        [text]=\"t('@report-management:features.report-viewer.actions.execute') | async\" [color]=\"'primary'\"\n        (onClick)=\"execute({ name: 'execute-report' })\">\n        <ax-prefix>\n          <ax-icon class=\"fa-light fa-play\"></ax-icon>\n        </ax-prefix>\n      </ax-button>\n    </axp-layout-suffix>\n  </axp-page-footer>\n</axp-page-layout>", styles: [".axp-report-viewer-page{display:flex;height:100%;width:100%;flex-direction:column}.axp-report-viewer-page axp-layout-start-side{height:100%;width:20rem;border-inline-end-width:1px;background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}@media (min-width: 1920px){.axp-report-viewer-page axp-layout-start-side{width:24rem}}.axp-report-viewer-page axp-layout-start-side axp-layout-content{overflow-x:auto}.axp-report-viewer-page axp-layout-start-side .__filters-container{padding:1rem}.axp-report-viewer-page .__mobile-filters{flex-shrink:0;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lightest-surface),var(--tw-border-opacity, 1));padding:1rem;background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.axp-report-viewer-page axp-page-content{display:flex;height:100%;flex-direction:column}.axp-report-viewer-page .__no-report{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center}.axp-report-viewer-page .__no-report .__no-report-icon{margin-bottom:1rem;font-size:3.75rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1));opacity:.5}.axp-report-viewer-page .__no-report .__no-report-content{max-width:28rem}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-title{margin-bottom:.5rem;font-size:1.25rem;line-height:1.75rem;font-weight:600}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-description{margin-bottom:1.5rem;font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-actions{display:flex;justify-content:center}.axp-report-viewer-page axp-report-table-view{flex:1 1 0%;overflow:hidden}.axp-report-viewer-page .__chart-placeholder,.axp-report-viewer-page .__cards-placeholder,.axp-report-viewer-page .__custom-placeholder{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center;margin:1.5rem;border-radius:.5rem;border-width:2px;border-style:dashed;--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1));background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.axp-report-viewer-page .__chart-placeholder .__placeholder-icon,.axp-report-viewer-page .__cards-placeholder .__placeholder-icon,.axp-report-viewer-page .__custom-placeholder .__placeholder-icon{margin-bottom:1rem;font-size:3rem;line-height:1;opacity:.5}.axp-report-viewer-page .__chart-placeholder .__placeholder-content,.axp-report-viewer-page .__cards-placeholder .__placeholder-content,.axp-report-viewer-page .__custom-placeholder .__placeholder-content{max-width:28rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-title{margin-bottom:.5rem;font-size:1.125rem;line-height:1.75rem;font-weight:600}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-description{font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-viewer-page .__chart-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1))}.axp-report-viewer-page .__cards-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-secondary-500),var(--tw-text-opacity, 1))}.axp-report-viewer-page .__custom-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-accent1-500),var(--tw-text-opacity, 1))}@media (max-width: 768px){.axp-report-viewer-page .__chart-placeholder,.axp-report-viewer-page .__cards-placeholder,.axp-report-viewer-page .__custom-placeholder{margin:1rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-title{font-size:1rem;line-height:1.5rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-description{font-size:.75rem;line-height:1rem}}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { class: 'axp-report-viewer-page' }, template: "<axp-page-layout *translate=\"let t\">\n  <!-- Left Panel: Filters (Always visible for desktop) -->\n  @if (showFiltersPanel()) {\n    <axp-layout-start-side>\n      <axp-layout-header>\n        <axp-layout-title>\n          {{ t('@report-management:features.report-viewer.filters.title') | async }}\n        </axp-layout-title>\n      </axp-layout-header>\n      <axp-layout-content>\n        <div class=\"__filters-container\">\n          <axp-dynamic-form\n            #filtersForm\n            [formDefinition]=\"vm.formDefinition()\"\n            [context]=\"vm.filterContext()\"\n            [layoutConfig]=\"defaultLayout()\"\n            [layoutStyle]=\"'compact'\"\n            (contextChange)=\"handleFiltersChange($event)\"\n            (contextInitiated)=\"handleFiltersInitiated($event)\"\n          >\n          </axp-dynamic-form>\n        </div>\n      </axp-layout-content>\n      <axp-layout-footer class=\"ax-p-4 ax-border-t\">\n        <ax-button\n          [class.ax-sm]=\"layoutService.isSmall()\"\n          class=\"ax-w-full\"\n          [text]=\"t('@report-management:features.report-viewer.actions.execute') | async\"\n          [color]=\"'primary'\"\n          (onClick)=\"execute({ name: 'execute-report' })\"\n        >\n          <ax-prefix>\n            <ax-icon class=\"fa-light fa-play\"></ax-icon>\n          </ax-prefix>\n        </ax-button>\n      </axp-layout-footer>\n    </axp-layout-start-side>\n  }\n  <!-- Main Content: Report Display -->\n  <axp-page-content>\n    @if (!vm.reportDefinition()) {\n      <ng-container *ngTemplateOutlet=\"noReport\"></ng-container>\n    } @else {\n      <ng-container *ngTemplateOutlet=\"reportDisplay\"></ng-container>\n    }\n  </axp-page-content>\n</axp-page-layout>\n\n<!-- Report Display Area -->\n<ng-template #reportDisplay>\n  @if (vm.isTableLayout()) {\n    <axp-report-table-view (rowClick)=\"handleRowClick($event)\" (actionClick)=\"handleActionClick($event)\">\n    </axp-report-table-view>\n  } @else if (vm.isChartLayout()) {\n    <!-- Chart View Placeholder -->\n    <div class=\"__chart-placeholder\">\n      <div class=\"__placeholder-icon\">\n        <ax-icon class=\"fa-light fa-chart-column\"></ax-icon>\n      </div>\n      <div class=\"__placeholder-content\">\n        <h4 class=\"__placeholder-title\">Chart View</h4>\n        <p class=\"__placeholder-description\">Chart visualization will be implemented here</p>\n      </div>\n    </div>\n  } @else {\n    <!-- Custom Layout Placeholder -->\n    <div class=\"__custom-placeholder\">\n      <div class=\"__placeholder-icon\">\n        <ax-icon class=\"fa-light fa-layout-grid\"></ax-icon>\n      </div>\n      <div class=\"__placeholder-content\">\n        <h4 class=\"__placeholder-title\">Custom Layout</h4>\n        <p class=\"__placeholder-description\">Custom report layout will be implemented here</p>\n      </div>\n    </div>\n  }\n</ng-template>\n\n<!-- No Report Selected State -->\n<ng-template #noReport>\n  <div class=\"__no-report\" *translate=\"let t\">\n    <div class=\"__no-report-icon\">\n      <ax-icon class=\"fa-light fa-chart-line\"></ax-icon>\n    </div>\n    <div class=\"__no-report-content\">\n      <h3 class=\"__no-report-title\">\n        {{ t('@report-management:features.report-viewer.no-report.title') | async }}\n      </h3>\n      <p class=\"__no-report-description\">\n        {{ t('@report-management:features.report-viewer.no-report.description') | async }}\n      </p>\n      <div class=\"__no-report-actions\">\n        <ax-button\n          look=\"outline\"\n          color=\"primary\"\n          [text]=\"t('@report-management:features.report-viewer.no-report.browse-reports') | async\"\n        >\n          <ax-prefix>\n            <ax-icon class=\"fa-light fa-folder-open\"></ax-icon>\n          </ax-prefix>\n        </ax-button>\n      </div>\n    </div>\n  </div>\n</ng-template>\n", styles: [".axp-report-viewer-page{display:flex;height:100%;width:100%;flex-direction:column}.axp-report-viewer-page axp-layout-container{overflow:hidden}.axp-report-viewer-page axp-layout-start-side{height:100%;width:20rem;border-inline-end-width:1px;background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}@media (min-width: 1920px){.axp-report-viewer-page axp-layout-start-side{width:24rem}}.axp-report-viewer-page axp-layout-start-side>axp-layout-header{height:73px;border-bottom-width:1px}.axp-report-viewer-page axp-layout-start-side axp-layout-content{overflow-x:auto;padding:.5rem}.axp-report-viewer-page axp-layout-start-side axp-layout-content .__filters-container axp-layout-sections{gap:0px!important}.axp-report-viewer-page axp-layout-start-side axp-layout-content .__filters-container axp-layout-sections axp-layout-section{border-style:none!important;padding:0!important;--tw-shadow: 0 0 #0000 !important;--tw-shadow-colored: 0 0 #0000 !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)!important}.axp-report-viewer-page .__mobile-filters{flex-shrink:0;border-bottom-width:1px;--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lightest-surface),var(--tw-border-opacity, 1));padding:1rem;background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.axp-report-viewer-page axp-page-content{display:flex;height:100%;flex-direction:column}.axp-report-viewer-page .__no-report{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center}.axp-report-viewer-page .__no-report .__no-report-icon{margin-bottom:1rem;font-size:3.75rem;line-height:1;--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1));opacity:.5}.axp-report-viewer-page .__no-report .__no-report-content{max-width:28rem}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-title{margin-bottom:.5rem;font-size:1.25rem;line-height:1.75rem;font-weight:600}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-description{margin-bottom:1.5rem;font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-viewer-page .__no-report .__no-report-content .__no-report-actions{display:flex;justify-content:center}.axp-report-viewer-page axp-report-table-view{flex:1 1 0%;overflow:hidden}.axp-report-viewer-page .__chart-placeholder,.axp-report-viewer-page .__cards-placeholder,.axp-report-viewer-page .__custom-placeholder{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center;margin:1.5rem;border-radius:.5rem;border-width:2px;border-style:dashed;--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1));background-color:rgb(var(--ax-sys-color-lightest-surface));color:rgb(var(--ax-sys-color-on-lightest-surface));border-color:rgb(var(--ax-sys-color-border-lightest-surface))}.axp-report-viewer-page .__chart-placeholder .__placeholder-icon,.axp-report-viewer-page .__cards-placeholder .__placeholder-icon,.axp-report-viewer-page .__custom-placeholder .__placeholder-icon{margin-bottom:1rem;font-size:3rem;line-height:1;opacity:.5}.axp-report-viewer-page .__chart-placeholder .__placeholder-content,.axp-report-viewer-page .__cards-placeholder .__placeholder-content,.axp-report-viewer-page .__custom-placeholder .__placeholder-content{max-width:28rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-title{margin-bottom:.5rem;font-size:1.125rem;line-height:1.75rem;font-weight:600}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-description{font-size:.875rem;line-height:1.25rem;opacity:.75}.axp-report-viewer-page .__chart-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-primary-500),var(--tw-text-opacity, 1))}.axp-report-viewer-page .__cards-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-secondary-500),var(--tw-text-opacity, 1))}.axp-report-viewer-page .__custom-placeholder .__placeholder-icon{--tw-text-opacity: 1;color:rgba(var(--ax-sys-color-accent1-500),var(--tw-text-opacity, 1))}@media (max-width: 768px){.axp-report-viewer-page .__chart-placeholder,.axp-report-viewer-page .__cards-placeholder,.axp-report-viewer-page .__custom-placeholder{margin:1rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-title,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-title{font-size:1rem;line-height:1.5rem}.axp-report-viewer-page .__chart-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__cards-placeholder .__placeholder-content .__placeholder-description,.axp-report-viewer-page .__custom-placeholder .__placeholder-content .__placeholder-description{font-size:.75rem;line-height:1rem}}\n"] }]
         }] });
 
 var reportViewerPage_component = /*#__PURE__*/Object.freeze({
@@ -1793,5 +1739,5 @@ var reportViewerPage_component = /*#__PURE__*/Object.freeze({
  * Generated bundle index. Do not edit.
  */
 
-export { AXMReportExecuteCommand, AXMReportManagementModule, AXPReportTableViewComponent, AXPReportViewerPageComponent, AXPReportViewerViewModel, RootConfig };
+export { AXMReportManagementModule, AXPReportTableViewComponent, AXPReportViewerPageComponent, AXPReportViewerViewModel, RootConfig };
 //# sourceMappingURL=acorex-modules-report-management.mjs.map