@acorex-platform/module-report-management-client 0.0.37 → 0.0.46

package/fesm2022/acorex-platform-module-report-management-client-report-layout-switcher.util-BGhHRYfe.mjs

@@ -0,0 +1,2266 @@
+import { AXPPageStatus } from '@acorex-platform/framework-shared/widget-core';
+import { AXBarChartComponent } from '@acorex/charts/bar-chart';
+import { AXChartLegendComponent } from '@acorex/charts/chart-legend';
+import { AXDonutChartComponent } from '@acorex/charts/donut-chart';
+import { AXLineChartComponent } from '@acorex/charts/line-chart';
+import * as i4 from '@acorex/core/translation';
+import { AXTranslationService, AXTranslationModule } from '@acorex/core/translation';
+import * as i2$1 from '@acorex-platform/framework-client/layout/widget-core';
+import { AXPWidgetRegistryService, AXPWidgetCoreModule } from '@acorex-platform/framework-client/layout/widget-core';
+import { AXPStateMessageComponent, AXPTextCommandColumnComponent } from '@acorex-platform/framework-client/layout/components';
+import * as i2 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { inject, Injectable, computed, effect, untracked, signal, ChangeDetectionStrategy, Component, ViewEncapsulation, viewChild } from '@angular/core';
+import { r as resolveReportFilterDefaultValue, c as convertContextDataToFilterClause, b as collectReportParameterDefaults, A as AXPReportViewerService, d as queryResultToChartSeries, e as AXLineChartReportMapper, f as AXPieChartReportMapper, g as AXBarChartReportMapper, q as queryResultToPdfSource } from './acorex-platform-module-report-management-client-acorex-platform-module-report-management-client-D5dCG62j.mjs';
+import { AXButtonModule } from '@acorex/components/button';
+import { AXDecoratorModule } from '@acorex/components/decorators';
+import { DomSanitizer } from '@angular/platform-browser';
+import { AXPPlatformScope, AXPWidgetsList, runtimeQueryPayloadData, runtimeCommandPayloadData, runtimeQueryCollectionData, getSystemActions, resolveMultiLanguageString } from '@acorex-platform/framework-shared/core';
+import * as i1 from '@acorex/components/data-table';
+import { AXDataTableModule } from '@acorex/components/data-table';
+import { AXLoadingModule } from '@acorex/components/loading';
+import { moveItemInArray } from '@angular/cdk/drag-drop';
+import { AXLocaleService } from '@acorex/core/locale';
+import { AXPSettingsService, commandMessageTextForError, AXP_USER_NOTIFICATION_SERVICE, AXPCommonSettings } from '@acorex-platform/framework-client/common';
+import { AXPQueryService, AXPCommandService } from '@acorex-platform/framework-client/runtime';
+import { Subscription } from 'rxjs';
+import { signalStore, withState, withComputed, withMethods, patchState, withHooks } from '@ngrx/signals';
+import { AXPInAppInboxConnectorService } from '@acorex-platform/module-communication-management-client';
+import { set } from 'lodash';
+import { buildReportGenerationNotificationCorrelationId, AXMReportManagementQueryKeys, AXMReportManagementCommandKeys } from '@acorex-platform/module-report-management-client/contracts';
+import { AXDataSource } from '@acorex/cdk/common';
+import { AXPExpressionEvaluatorService, applySystemActionDefault } from '@acorex-platform/framework-client/core';
+import { get } from 'lodash-es';
+
+//#region ----   Report Viewer User Settings Service   ----
+class AXPReportViewerUserSettingsService {
+    constructor() {
+        this.settingsService = inject(AXPSettingsService);
+    }
+    getSettingKey(reportId) {
+        return `ReportManagement:Report:${reportId}`;
+    }
+    async load(reportId) {
+        const stored = await this.settingsService.get(this.getSettingKey(reportId));
+        return stored ?? null;
+    }
+    getTableLayoutState(settings, layoutId) {
+        return settings?.layouts?.[layoutId]?.table;
+    }
+    async saveActiveLayoutId(reportId, layoutId) {
+        await this.patch(reportId, (prev) => ({
+            ...prev,
+            activeLayoutId: layoutId,
+        }));
+    }
+    async saveTableColumnOrder(reportId, layoutId, columns) {
+        await this.patchTable(reportId, layoutId, (table) => ({
+            ...table,
+            columns,
+        }));
+    }
+    async saveTableColumnWidth(reportId, layoutId, field, width, baseColumns) {
+        const columns = baseColumns.map((col) => col.field === field ? { ...col, width } : col);
+        await this.saveTableColumnOrder(reportId, layoutId, columns);
+    }
+    async saveTableSorts(reportId, layoutId, sorts) {
+        await this.patchTable(reportId, layoutId, (table) => ({
+            ...table,
+            sorts,
+        }));
+    }
+    async saveTablePageSize(reportId, layoutId, pageSize) {
+        await this.patchTable(reportId, layoutId, (table) => ({
+            ...table,
+            pageSize,
+        }));
+    }
+    async patch(reportId, updateFn) {
+        await this.settingsService.scope(AXPPlatformScope.User).update(this.getSettingKey(reportId), (prev) => {
+            const base = (prev && typeof prev === 'object' ? prev : {});
+            return updateFn(base);
+        });
+    }
+    async patchTable(reportId, layoutId, updateFn) {
+        await this.patch(reportId, (prev) => {
+            const next = { ...prev };
+            const currentTable = prev.layouts?.[layoutId]?.table ?? {};
+            const updatedTable = updateFn(currentTable);
+            set(next, `layouts.${layoutId}.table`, updatedTable);
+            return next;
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPReportViewerUserSettingsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPReportViewerUserSettingsService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPReportViewerUserSettingsService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+//#region ----   Constants   ----
+const OPEN_REPORT_IN_POPUP_COMMAND = 'ReportManagement.Report:OpenInPopup';
+//#endregion
+//#region ----   Row Action Builder   ----
+/**
+ * Builds table row actions from declarative group-by drill-down definitions.
+ * Skips row commands when linked display columns are used.
+ */
+function buildDrillRowActionsFromGroupBy(definitions, currentReportId) {
+    if (!definitions?.length || !currentReportId || hasGroupByDrillLinks(definitions)) {
+        return [];
+    }
+    const hasExplicitDefault = definitions.some((definition) => definition.default);
+    return definitions.map((definition, index) => {
+        const isDefault = definition.default ?? (!hasExplicitDefault && index === 0);
+        return {
+            title: definition.title ?? 'View',
+            command: {
+                name: OPEN_REPORT_IN_POPUP_COMMAND,
+                options: buildDrillCommandOptions(definition, currentReportId),
+            },
+            type: 'view',
+            priority: definition.priority ?? 'primary',
+            default: isDefault,
+            iconOnly: false,
+        };
+    });
+}
+//#endregion
+//#region ----   Drill Link Columns   ----
+/**
+ * Whether group-by definitions use linked display columns instead of row command actions.
+ */
+function hasGroupByDrillLinks(definitions) {
+    return definitions?.some((definition) => isGroupByDrillLinkDefinition(definition)) ?? false;
+}
+function isGroupByDrillLinkDefinition(definition) {
+    return Boolean(definition.displayField) && definition.linkDisplay !== false;
+}
+function findGroupByDefinitionForDisplayField(definitions, field) {
+    return definitions?.find((definition) => definition.displayField === field && isGroupByDrillLinkDefinition(definition));
+}
+function buildGroupByDrillCommandOptions(definition, currentReportId) {
+    return buildDrillCommandOptions(definition, currentReportId);
+}
+function resolveGroupByDrillLinkFields(definitions) {
+    if (!definitions?.length) {
+        return [];
+    }
+    return definitions
+        .filter((definition) => isGroupByDrillLinkDefinition(definition))
+        .map((definition) => definition.displayField)
+        .filter(Boolean);
+}
+//#endregion
+//#region ----   Helpers   ----
+function buildDrillCommandOptions(definition, currentReportId) {
+    const drillDown = definition.drillDown;
+    const reportId = drillDown.reportId ?? currentReportId;
+    return {
+        reportId,
+        layoutId: drillDown.layoutId,
+        title: resolveDrillTitle(definition, drillDown.title),
+        parameters: mapDrillParameters(drillDown.parameters),
+        hideColumnFields: resolveDrillHideColumnFields(definition),
+    };
+}
+function resolveDrillHideColumnFields(definition) {
+    const fields = new Set(definition.fields);
+    if (definition.displayField) {
+        fields.add(definition.displayField);
+    }
+    return [...fields];
+}
+function resolveDrillTitle(definition, explicitTitle) {
+    if (explicitTitle) {
+        return explicitTitle;
+    }
+    if (definition.displayField) {
+        return `{{ context.eval('${definition.displayField}') }}`;
+    }
+    return undefined;
+}
+function mapDrillParameters(parameters) {
+    if (!parameters) {
+        return undefined;
+    }
+    return Object.fromEntries(Object.entries(parameters).map(([parameterKey, rowField]) => [
+        parameterKey,
+        toRowExpression(rowField),
+    ]));
+}
+function toRowExpression(value) {
+    const trimmed = value.trim();
+    if (trimmed.includes('{{') || trimmed.includes('context.eval')) {
+        return value;
+    }
+    return `{{ context.eval('${value}') }}`;
+}
+//#endregion
+
+/** Infers a column display widget when the report definition omits `widget.type`. */
+const NUMERIC_COLUMN_FIELD_PATTERN = /(?:count|total|average|avg|min|max|price|value|amount|quantity|number|year|month|quarter|experience|rate|percent|score|age|duration|hours?|days?|tokens)$/i;
+function buildReportTableColumns(definitionColumns, savedColumns) {
+    const base = definitionColumns
+        ?.filter((col) => col.visible !== false)
+        .map((col) => mapDefinitionColumn(col)) ?? [];
+    return applySavedColumnLayout(base, savedColumns);
+}
+/**
+ * Builds columns and evaluates `visible` expressions (`permission.check` / `feature.check`).
+ */
+async function buildReportTableColumnsAsync(definitionColumns, savedColumns, expressionEvaluator) {
+    const visibleColumns = [];
+    for (const col of definitionColumns ?? []) {
+        if (await isReportColumnVisible(col.visible, expressionEvaluator)) {
+            visibleColumns.push(col);
+        }
+    }
+    const base = visibleColumns.map((col) => mapDefinitionColumn(col));
+    return applySavedColumnLayout(base, savedColumns);
+}
+async function isReportColumnVisible(visible, expressionEvaluator) {
+    if (visible === false) {
+        return false;
+    }
+    if (visible === undefined || visible === true) {
+        return true;
+    }
+    if (typeof visible === 'string' && expressionEvaluator.isExpression(visible)) {
+        try {
+            return Boolean(await expressionEvaluator.evaluate(visible));
+        }
+        catch {
+            return true;
+        }
+    }
+    return Boolean(visible);
+}
+function applySavedColumnLayout(base, savedColumns) {
+    if (!savedColumns?.length) {
+        return base;
+    }
+    const widthMap = new Map(savedColumns.map((col) => [col.field, col.width]));
+    const orderIndex = new Map(savedColumns.map((col, index) => [col.field, index]));
+    return [...base]
+        .map((col) => {
+        const savedWidth = widthMap.get(col.field);
+        const resolvedWidth = typeof savedWidth === 'number' ? savedWidth : parseColumnResizeWidth(savedWidth) ?? col.width;
+        return {
+            ...col,
+            width: resolvedWidth,
+        };
+    })
+        .sort((a, b) => {
+        const aIndex = orderIndex.get(a.field) ?? Number.MAX_SAFE_INTEGER;
+        const bIndex = orderIndex.get(b.field) ?? Number.MAX_SAFE_INTEGER;
+        return aIndex - bIndex;
+    });
+}
+function toColumnUserState(columns) {
+    return columns.map((col) => ({
+        field: col.field,
+        width: typeof col.width === 'number' ? col.width : parseColumnResizeWidth(col.width) ?? undefined,
+    }));
+}
+function inferReportColumnWidgetType(field) {
+    return NUMERIC_COLUMN_FIELD_PATTERN.test(field)
+        ? AXPWidgetsList.Editors.NumberBox
+        : AXPWidgetsList.Editors.TextBox;
+}
+function resolveColumnWidget(col) {
+    const path = col.widget?.path ?? col.field;
+    if (col.widget?.type) {
+        return { ...col.widget, path };
+    }
+    return {
+        type: inferReportColumnWidgetType(col.field),
+        path,
+    };
+}
+function mapDefinitionColumn(col) {
+    return {
+        field: col.field,
+        title: col.title || col.field,
+        width: col.width || 'auto',
+        visible: col.visible !== false,
+        align: col.align || 'left',
+        sortable: col.sortable === true,
+        pin: col.pin,
+        widget: resolveColumnWidget(col),
+    };
+}
+function parseColumnResizeWidth(value) {
+    if (typeof value === 'number' && Number.isFinite(value)) {
+        return value;
+    }
+    if (typeof value === 'string') {
+        const parsed = Number.parseInt(value, 10);
+        return Number.isFinite(parsed) ? parsed : null;
+    }
+    return null;
+}
+function resolveColumnFieldFromDataField(dataField) {
+    if (dataField.startsWith('col-')) {
+        return dataField.slice(4);
+    }
+    if (dataField.includes('-')) {
+        return dataField.split('-').slice(1).join('-');
+    }
+    return dataField;
+}
+function applyGroupByDrillLinksToColumns(columns, groupByDefinitions) {
+    if (!groupByDefinitions?.length) {
+        return columns;
+    }
+    const linkFields = new Set(groupByDefinitions
+        .filter((definition) => isGroupByDrillLinkDefinition(definition))
+        .map((definition) => definition.displayField)
+        .filter(Boolean));
+    if (linkFields.size === 0) {
+        return columns;
+    }
+    return columns.map((column) => {
+        if (!linkFields.has(column.field)) {
+            return column;
+        }
+        return {
+            ...column,
+            isGroupByDrillLink: true,
+            drillDisplayField: column.field,
+        };
+    });
+}
+//#endregion
+
+const OPEN_REPORT_VIEWER_COMMAND = 'ReportManagement.Report:OpenViewer';
+const AXPReportViewerViewModel = signalStore(withState(() => ({
+    reportDefinition: null,
+    currentLayout: null,
+    filterContext: {},
+    allowFetchData: false,
+    shouldExecuteReport: false,
+    executionRequestId: 0,
+    lastAppliedFilterContext: null, // Track last applied filters
+    hasBeenExecuted: false, // Track if report has been executed at least once
+    status: AXPPageStatus.Idle,
+    error: null,
+    showRowIndexColumn: false,
+    reportUserSettings: null,
+    runId: null,
+    frozen: false,
+    freeze: null,
+    backgroundQueued: false,
+    backgroundGenerationRequestId: null,
+    /** When true, completion is delivered inline on the viewer (no server inbox toast). */
+    inlineGenerationWatchActive: false,
+    parametersReadonly: false,
+    selectedLayoutIds: [],
+})), withComputed((store, widgetRegistryService = inject(AXPWidgetRegistryService)) => ({
+    //#region ----   Layout Management   ----
+    availableLayouts: computed(() => {
+        const report = store.reportDefinition();
+        if (!report?.layouts)
+            return [];
+        const freeze = store.freeze();
+        const layouts = store.frozen() && freeze?.dataSources?.length
+            ? report.layouts.filter((layout) => freeze.dataSources.some((source) => source.layoutId === layout.id))
+            : report.layouts;
+        return layouts.map((layout) => ({
+            id: layout.id,
+            title: layout.title,
+            icon: layout.icon,
+            type: layout.layout.type,
+        }));
+    }),
+    defaultLayout: computed(() => {
+        const report = store.reportDefinition();
+        if (!report?.layouts?.length)
+            return null;
+        // Find layout marked as default, or use first layout
+        return report.layouts.find((l) => l.isDefault) || report.layouts[0];
+    }),
+    activeLayoutId: computed(() => store.currentLayout()?.id || null),
+    layoutType: computed(() => store.currentLayout()?.layout?.type || null),
+    //#endregion
+    //#region ----   Layout-Specific Configurations   ----
+    tableLayoutConfig: computed(() => {
+        const layout = store.currentLayout();
+        return layout?.layout?.type === 'table' ? layout.layout : null;
+    }),
+    chartLayoutConfig: computed(() => {
+        const layout = store.currentLayout();
+        return layout?.layout?.type === 'chart' ? layout.layout : null;
+    }),
+    pdfLayoutConfig: computed(() => {
+        const layout = store.currentLayout();
+        return layout?.layout?.type === 'pdf' ? layout.layout : null;
+    }),
+    //#endregion
+    //#region ----   State Indicators   ----
+    isLoading: computed(() => store.status() === AXPPageStatus.Processing),
+    isExecuting: computed(() => store.status() === AXPPageStatus.Submitting),
+    hasError: computed(() => store.error() !== null),
+    canExecute: computed(() => {
+        // Always allow execution if there's an error (to enable retry)
+        if (store.error() !== null) {
+            return true;
+        }
+        if ((store.reportDefinition()?.generation?.mode ?? 'interactive') === 'background') {
+            if (store.backgroundQueued() && !store.frozen()) {
+                return false;
+            }
+            return store.selectedLayoutIds().length > 0;
+        }
+        // Allow execution if there are unapplied filters
+        const currentContext = store.filterContext();
+        const lastApplied = store.lastAppliedFilterContext();
+        const hasBeenExecuted = store.hasBeenExecuted();
+        if (hasBeenExecuted && JSON.stringify(currentContext) !== JSON.stringify(lastApplied)) {
+            return true;
+        }
+        // Allow execution if report hasn't been executed yet
+        if (!hasBeenExecuted) {
+            return true;
+        }
+        // Otherwise, don't allow execution
+        return false;
+    }),
+    hasMultipleLayouts: computed(() => {
+        const report = store.reportDefinition();
+        const freeze = store.freeze();
+        if (store.frozen() && freeze?.dataSources?.length) {
+            return freeze.dataSources.length > 1;
+        }
+        return (report?.layouts?.length ?? 0) > 1;
+    }),
+    title: computed(() => store.reportDefinition()?.title ?? '@report-management:report-viewer.components.report-viewer.title'),
+    description: computed(() => store.reportDefinition()?.description ?? null),
+    //#endregion
+    //#region ----   Form Configuration   ----
+    formDefinition: computed(() => {
+        const report = store.reportDefinition();
+        if (!report || !report.parameterGroups) {
+            return { groups: [] };
+        }
+        const formDefinition = {
+            groups: report.parameterGroups.map((group) => ({
+                name: group.name,
+                title: group.title,
+                description: group.description,
+                parameters: group.parameters.map((param) => {
+                    const editorType = param.widget.type ?? '';
+                    const widget = widgetRegistryService.getOptional(editorType);
+                    const filterType = widget?.defaultFilterWidgetName ?? editorType;
+                    // date-time / text filter aliases do not mount reliably in report filter forms;
+                    // keep the editor widget and enable filterMode instead.
+                    const useEditorFilter = editorType === 'date-time-editor' ||
+                        filterType === 'datetime-filter' ||
+                        editorType === 'text-editor' ||
+                        filterType === 'string-filter';
+                    const widgetType = useEditorFilter ? editorType || filterType : filterType;
+                    const rawDefault = param.widget.defaultValue ?? param.widget.options?.['defaultValue'];
+                    const resolvedDefault = rawDefault === undefined ? undefined : resolveReportFilterDefaultValue(rawDefault);
+                    return {
+                        path: param.path,
+                        title: param.title,
+                        description: param.description,
+                        visible: param.visible,
+                        badge: `{{ filter.getTitle(context.eval("${param.path}.operation.type")) }}`,
+                        widget: {
+                            path: param.path,
+                            type: widgetType,
+                            ...(resolvedDefault !== undefined ? { defaultValue: resolvedDefault } : {}),
+                            options: {
+                                ...param.widget.options,
+                                clearButton: true,
+                                hasClearButton: true,
+                                ...(useEditorFilter ? { filterMode: true } : {}),
+                            },
+                            triggers: param.widget.triggers,
+                        }
+                    };
+                }),
+            })),
+        };
+        return formDefinition;
+    }),
+    //#endregion
+    //#region ----   Layout Type Detection   ----
+    isTableLayout: computed(() => store.currentLayout()?.layout?.type === 'table'),
+    isChartLayout: computed(() => store.currentLayout()?.layout?.type === 'chart'),
+    isPdfLayout: computed(() => store.currentLayout()?.layout?.type === 'pdf'),
+    //#endregion
+    //#region ----   Filter States   ----
+    hasUnappliedFilters: computed(() => {
+        const currentContext = store.filterContext();
+        const lastApplied = store.lastAppliedFilterContext();
+        const hasBeenExecuted = store.hasBeenExecuted();
+        // If report has never been executed, don't show unapplied filters warning
+        if (!hasBeenExecuted) {
+            return false;
+        }
+        // If no filters have been applied yet, return true
+        if (lastApplied === null) {
+            return true;
+        }
+        // Check if current filters are different from last applied filters
+        const currentKeys = Object.keys(currentContext);
+        const lastKeys = Object.keys(lastApplied);
+        if (currentKeys.length !== lastKeys.length) {
+            return true;
+        }
+        // Check if any values are different
+        for (const key of currentKeys) {
+            if (currentContext[key] !== lastApplied[key]) {
+                return true;
+            }
+        }
+        return false;
+    }),
+    //#endregion
+    //#region ----   Action States   ----
+    canSelectRows: computed(() => {
+        const layout = store.currentLayout();
+        return (layout?.layout?.type === 'table' &&
+            layout.layout.options?.selectable?.mode &&
+            layout.layout.options?.selectable?.mode !== 'none');
+    }),
+    tableLayoutUserSettings: computed(() => {
+        const settings = store.reportUserSettings();
+        const layoutId = store.currentLayout()?.id;
+        if (!settings || !layoutId) {
+            return null;
+        }
+        return settings.layouts?.[layoutId]?.table ?? null;
+    }),
+    reportId: computed(() => store.reportDefinition()?.id ?? null),
+    isFrozen: computed(() => store.frozen()),
+    isBackgroundQueued: computed(() => store.backgroundQueued()),
+    isBackgroundReportMode: computed(() => (store.reportDefinition()?.generation?.mode ?? 'interactive') === 'background'),
+    hasSelectedBackgroundLayouts: computed(() => store.selectedLayoutIds().length > 0),
+    areParametersReadonly: computed(() => store.parametersReadonly() || store.frozen()),
+    isBackgroundGenerateDisabled: computed(() => {
+        if ((store.reportDefinition()?.generation?.mode ?? 'interactive') !== 'background') {
+            return false;
+        }
+        return store.backgroundQueued() || store.selectedLayoutIds().length === 0;
+    }),
+    canSwitchLayout: computed(() => {
+        if (store.frozen() && (store.freeze()?.dataSources?.length ?? 0) <= 1) {
+            return false;
+        }
+        return (store.reportDefinition()?.layouts?.length ?? 0) > 1 && store.status() !== AXPPageStatus.Submitting;
+    }),
+    generationMode: computed(() => store.reportDefinition()?.generation?.mode ?? 'interactive'),
+    //#endregion
+})), withMethods((store, reportDefinitionService = inject(AXPReportViewerService), reportUserSettingsService = inject(AXPReportViewerUserSettingsService), queryService = inject(AXPQueryService), commandService = inject(AXPCommandService), userNotificationService = inject(AXP_USER_NOTIFICATION_SERVICE), translationService = inject(AXTranslationService), inboxConnector = inject(AXPInAppInboxConnectorService, {
+    optional: true,
+})) => {
+    let activeFetchCount = 0;
+    let activeGenerationWatchId = null;
+    const BACKGROUND_GENERATION_POLL_MS = 3_000;
+    const dismissReportGenerationInboxNotification = async (runId) => {
+        const normalized = runId.trim();
+        if (!normalized || !inboxConnector) {
+            return;
+        }
+        try {
+            await inboxConnector.dismissByCorrelationId(buildReportGenerationNotificationCorrelationId(normalized));
+        }
+        catch {
+            // Best-effort — the report viewer should still open.
+        }
+    };
+    const openGeneratedReportFromNotification = async (runId) => {
+        const report = store.reportDefinition();
+        const normalizedRunId = runId.trim();
+        if (!report?.id || !normalizedRunId) {
+            return;
+        }
+        await dismissReportGenerationInboxNotification(normalizedRunId);
+        await commandService.execute(OPEN_REPORT_VIEWER_COMMAND, {
+            reportId: report.id,
+            runId: normalizedRunId,
+        });
+    };
+    const showGenerationNotification = async (options) => {
+        const runId = options.runId?.trim();
+        const showOpenAction = options.showOpenAction === true && !!runId;
+        const toastActions = showOpenAction
+            ? [
+                {
+                    text: await translationService.translateAsync('@report-management:report-generation.notifications.actions.open-viewer'),
+                    color: 'primary',
+                    onClick: () => openGeneratedReportFromNotification(runId),
+                },
+            ]
+            : undefined;
+        await userNotificationService.notify({
+            correlationId: runId
+                ? buildReportGenerationNotificationCorrelationId(runId)
+                : `report-generation-ui:${options.titleKey}`,
+            title: await translationService.translateAsync(options.titleKey),
+            body: await translationService.translateAsync(options.bodyKey),
+            icon: options.icon,
+            delivery: {
+                toast: {
+                    color: options.color,
+                    location: 'bottom-center',
+                    closeButton: true,
+                    timeOut: showOpenAction ? 8_000 : 3_000,
+                    timeOutProgress: true,
+                    showActions: showOpenAction,
+                },
+            },
+            toastActions,
+        });
+    };
+    const showGenerationReadyNotification = async (runId) => {
+        await showGenerationNotification({
+            color: 'success',
+            icon: 'fa-light fa-circle-check',
+            titleKey: '@report-management:report-generation.notifications.complete.title',
+            bodyKey: '@report-management:report-generation.notifications.complete.body',
+            runId,
+            showOpenAction: false,
+        });
+    };
+    const showGenerationFailedNotification = async () => {
+        await showGenerationNotification({
+            color: 'danger',
+            icon: 'fa-light fa-circle-exclamation',
+            titleKey: '@report-management:report-generation.notifications.failed.title',
+            bodyKey: '@report-management:report-generation.notifications.failed.body',
+        });
+    };
+    const api = {
+        loadFrozenRun: async (_runId) => { },
+        startBackgroundGenerationWatch: async (_requestId) => { },
+    };
+    api.loadFrozenRun = async (runId) => {
+        patchState(store, { status: AXPPageStatus.Processing, error: null });
+        try {
+            const result = await queryService.fetch(AXMReportManagementQueryKeys.ReportGeneration.GetViewerFreeze, { id: runId });
+            const freeze = runtimeQueryPayloadData(result);
+            if (!result?.success || !freeze) {
+                patchState(store, {
+                    error: commandMessageTextForError(result?.message?.text) ||
+                        '@report-management:report-generation.errors.freeze-not-found',
+                });
+                return;
+            }
+            let report = store.reportDefinition();
+            if (freeze.definition) {
+                report = {
+                    id: freeze.reportId,
+                    title: freeze.definition.title,
+                    categoryIds: report?.categoryIds ?? [],
+                    parameterGroups: report?.parameterGroups ?? [],
+                    layouts: freeze.definition.layouts,
+                    defaultLayoutId: freeze.definition.defaultLayoutId,
+                    generation: report?.generation,
+                };
+            }
+            else if (!report) {
+                report = (await reportDefinitionService.getReportById(freeze.reportId)) ?? null;
+            }
+            if (!report) {
+                patchState(store, {
+                    error: '@report-management:report-viewer.messages.error.failed-to-load',
+                });
+                return;
+            }
+            const defaultLayout = report.layouts.find((layout) => layout.id === freeze.definition?.defaultLayoutId) ||
+                report.layouts.find((layout) => layout.id === freeze.dataSources[0]?.layoutId) ||
+                report.layouts[0];
+            patchState(store, {
+                reportDefinition: report,
+                currentLayout: defaultLayout,
+                filterContext: freeze.parameters ?? {},
+                lastAppliedFilterContext: freeze.parameters ?? {},
+                allowFetchData: true,
+                shouldExecuteReport: true,
+                hasBeenExecuted: true,
+                executionRequestId: store.executionRequestId() + 1,
+                runId,
+                frozen: true,
+                freeze,
+                backgroundQueued: false,
+                backgroundGenerationRequestId: null,
+                inlineGenerationWatchActive: false,
+                parametersReadonly: true,
+                status: AXPPageStatus.Idle,
+            });
+        }
+        catch (error) {
+            patchState(store, {
+                error: error instanceof Error
+                    ? error.message
+                    : '@report-management:report-generation.errors.freeze-not-found',
+            });
+        }
+        finally {
+            patchState(store, { status: AXPPageStatus.Idle });
+        }
+    };
+    api.startBackgroundGenerationWatch = async (requestId) => {
+        activeGenerationWatchId = requestId;
+        while (activeGenerationWatchId === requestId) {
+            if (!store.backgroundQueued() || store.backgroundGenerationRequestId() !== requestId) {
+                return;
+            }
+            await new Promise((resolve) => setTimeout(resolve, BACKGROUND_GENERATION_POLL_MS));
+            if (activeGenerationWatchId !== requestId) {
+                return;
+            }
+            try {
+                const result = await queryService.fetch(AXMReportManagementQueryKeys.ReportGeneration.Get, { id: requestId });
+                const request = runtimeQueryPayloadData(result);
+                if (!request || activeGenerationWatchId !== requestId) {
+                    continue;
+                }
+                if (request.status === 'completed') {
+                    activeGenerationWatchId = null;
+                    const inlineWatchActive = store.inlineGenerationWatchActive();
+                    patchState(store, {
+                        backgroundQueued: false,
+                        inlineGenerationWatchActive: false,
+                        ...(inlineWatchActive ? {} : { backgroundGenerationRequestId: null }),
+                    });
+                    if (!inlineWatchActive) {
+                        return;
+                    }
+                    await api.loadFrozenRun(requestId);
+                    if (!store.error()) {
+                        await showGenerationReadyNotification(requestId);
+                    }
+                    return;
+                }
+                if (request.status === 'failed' || request.status === 'cancelled') {
+                    activeGenerationWatchId = null;
+                    patchState(store, {
+                        backgroundQueued: false,
+                        backgroundGenerationRequestId: null,
+                        inlineGenerationWatchActive: false,
+                        status: AXPPageStatus.Error,
+                        error: '@report-management:report-generation.notifications.failed.body',
+                    });
+                    await showGenerationFailedNotification();
+                    return;
+                }
+            }
+            catch {
+                // Keep polling while the run is still active.
+            }
+        }
+    };
+    const generateInBackground = async () => {
+        const report = store.reportDefinition();
+        const isBackgroundMode = (report?.generation?.mode ?? 'interactive') === 'background';
+        const layoutIds = isBackgroundMode
+            ? store.selectedLayoutIds()
+            : store.currentLayout()
+                ? [store.currentLayout().id]
+                : [];
+        if (!report || layoutIds.length === 0) {
+            patchState(store, {
+                error: layoutIds.length === 0
+                    ? '@report-management:report-generation.errors.no-layouts-selected'
+                    : '@report-management:report-viewer.messages.error.report-or-layout-not-found',
+            });
+            return;
+        }
+        patchState(store, { status: AXPPageStatus.Submitting, error: null });
+        if (store.frozen()) {
+            patchState(store, {
+                frozen: false,
+                freeze: null,
+                runId: null,
+                hasBeenExecuted: false,
+                allowFetchData: false,
+                parametersReadonly: false,
+            });
+        }
+        try {
+            const result = await commandService.executeRemote(AXMReportManagementCommandKeys.ReportGeneration.Create, {
+                reportId: report.id,
+                layoutIds,
+                layoutId: layoutIds[0],
+                parameters: store.filterContext(),
+                trigger: 'manual',
+                suppressNotificationOnComplete: true,
+            });
+            if (!result?.success) {
+                patchState(store, {
+                    status: AXPPageStatus.Error,
+                    error: commandMessageTextForError(result?.message?.text) ||
+                        '@report-management:report-generation.errors.create-failed',
+                });
+                return;
+            }
+            const createResult = runtimeCommandPayloadData(result);
+            const requestId = createResult?.id?.trim();
+            if (!createResult || !requestId) {
+                patchState(store, {
+                    status: AXPPageStatus.Error,
+                    error: '@report-management:report-generation.errors.create-failed',
+                });
+                return;
+            }
+            if (createResult.status === 'completed') {
+                patchState(store, { status: AXPPageStatus.Idle, error: null });
+                await api.loadFrozenRun(requestId);
+                if (!store.error()) {
+                    await showGenerationReadyNotification(requestId);
+                }
+                return;
+            }
+            patchState(store, {
+                status: AXPPageStatus.Submitted,
+                backgroundQueued: true,
+                backgroundGenerationRequestId: requestId,
+                inlineGenerationWatchActive: true,
+                error: null,
+            });
+            if (createResult.deduplicated) {
+                await showGenerationNotification({
+                    color: 'warning',
+                    icon: 'fa-light fa-triangle-exclamation',
+                    titleKey: '@report-management:report-generation.messages.deduplicated-title',
+                    bodyKey: '@report-management:report-generation.messages.deduplicated-body',
+                });
+            }
+            else {
+                await showGenerationNotification({
+                    color: 'success',
+                    icon: 'fa-light fa-clock',
+                    titleKey: '@report-management:report-generation.messages.queued-title',
+                    bodyKey: '@report-management:report-generation.messages.queued-body',
+                });
+            }
+            void api.startBackgroundGenerationWatch(requestId);
+        }
+        catch (error) {
+            patchState(store, {
+                status: AXPPageStatus.Error,
+                error: error instanceof Error
+                    ? error.message
+                    : '@report-management:report-generation.errors.create-failed',
+            });
+        }
+    };
+    const releaseInlineNotificationWatch = async () => {
+        const requestId = store.backgroundGenerationRequestId()?.trim();
+        activeGenerationWatchId = null;
+        patchState(store, {
+            inlineGenerationWatchActive: false,
+            backgroundQueued: false,
+        });
+        if (!requestId) {
+            return;
+        }
+        try {
+            await commandService.executeRemote(AXMReportManagementCommandKeys.ReportGeneration.ReleaseInlineWatch, { id: requestId });
+        }
+        catch {
+            // Best-effort — completion notify re-reads the flag from storage.
+        }
+    };
+    const executeReport = async () => {
+        try {
+            if (store.status() === AXPPageStatus.Processing ||
+                store.status() === AXPPageStatus.Submitting) {
+                return;
+            }
+            const report = store.reportDefinition();
+            if ((report?.generation?.mode ?? 'interactive') === 'background') {
+                await generateInBackground();
+                return;
+            }
+            if (store.frozen()) {
+                patchState(store, {
+                    allowFetchData: true,
+                    shouldExecuteReport: true,
+                    executionRequestId: store.executionRequestId() + 1,
+                    hasBeenExecuted: true,
+                });
+                return;
+            }
+            const layout = store.currentLayout();
+            if (!report || !layout) {
+                patchState(store, {
+                    error: '@report-management:report-viewer.messages.error.report-or-layout-not-found',
+                });
+                return;
+            }
+            patchState(store, {
+                status: AXPPageStatus.Submitting,
+                error: null,
+                allowFetchData: true,
+                shouldExecuteReport: true,
+                executionRequestId: store.executionRequestId() + 1,
+                lastAppliedFilterContext: { ...store.filterContext() }, // Mark current filters as applied
+                hasBeenExecuted: true, // Mark that report has been executed at least once
+            });
+            patchState(store, {
+                status: AXPPageStatus.Submitted,
+                error: null,
+            });
+        }
+        catch (error) {
+            patchState(store, {
+                status: AXPPageStatus.Error,
+                error: error instanceof Error ? error.message : '@report-management:report-viewer.messages.error.unexpected-execution',
+            });
+        }
+    };
+    const buildSummaryFromLayout = (layoutDef) => {
+        const tableLayout = layoutDef.layout;
+        if (tableLayout?.type !== 'table' || !Array.isArray(tableLayout.summary)) {
+            return undefined;
+        }
+        const footer = tableLayout.summary.filter((s) => s.displayIn === 'reportFooter');
+        return footer.length > 0 ? footer : undefined;
+    };
+    const fetchData = async (query) => {
+        const report = store.reportDefinition();
+        const layout = store.currentLayout();
+        if (!report || !layout) {
+            return null;
+        }
+        if (store.frozen()) {
+            const freeze = store.freeze();
+            const layoutId = layout.id;
+            const source = freeze?.dataSources.find((item) => item.layoutId === layoutId) ?? freeze?.dataSources[0];
+            if (!source?.result) {
+                return null;
+            }
+            const collection = runtimeQueryCollectionData(source.result);
+            if (!collection) {
+                return source.result;
+            }
+            const skip = query?.skip ?? 0;
+            const take = query?.take ?? collection.items.length;
+            return {
+                ...source.result,
+                success: true,
+                kind: 'collection',
+                data: {
+                    ...collection,
+                    items: collection.items.slice(skip, skip + take),
+                },
+            };
+        }
+        if (activeFetchCount > 0) {
+            return null;
+        }
+        activeFetchCount++;
+        patchState(store, {
+            status: AXPPageStatus.Processing,
+            error: null,
+        });
+        let nextStatus = AXPPageStatus.Idle;
+        try {
+            const dataSource = layout.dataSource;
+            if (!dataSource || dataSource.type !== 'query' || !dataSource.name) {
+                nextStatus = AXPPageStatus.Error;
+                patchState(store, {
+                    error: '@report-management:report-viewer.messages.error.failed-to-execute',
+                });
+                return null;
+            }
+            const filterClause = convertContextDataToFilterClause(store.filterContext());
+            const runtimeSort = query?.sort?.length
+                ? query.sort.map((s) => ({
+                    name: s.field,
+                    dir: s.dir,
+                }))
+                : dataSource.sortFields;
+            const summary = buildSummaryFromLayout(layout);
+            const queryInput = {
+                skip: query?.skip ?? 0,
+                take: query?.take ?? null,
+                filter: filterClause,
+                ...(runtimeSort?.length
+                    ? {
+                        sort: runtimeSort.map((s) => ({
+                            field: s.name,
+                            dir: s.dir,
+                        })),
+                    }
+                    : {}),
+                ...(summary ? { summary } : {}),
+            };
+            const queryResult = await queryService.fetch(dataSource.name, queryInput);
+            if (!queryResult?.success) {
+                nextStatus = AXPPageStatus.Error;
+                patchState(store, {
+                    error: commandMessageTextForError(queryResult?.message?.text) ||
+                        '@report-management:report-viewer.messages.error.failed-to-execute',
+                });
+                return null;
+            }
+            return queryResult;
+        }
+        catch (error) {
+            nextStatus = AXPPageStatus.Error;
+            const message = error instanceof Error && error.message
+                ? error.message
+                : '@report-management:report-viewer.messages.error.failed-to-execute';
+            patchState(store, {
+                error: message,
+            });
+            console.error('Error executing report:', error);
+            return null;
+        }
+        finally {
+            activeFetchCount--;
+            patchState(store, {
+                status: nextStatus,
+            });
+        }
+    };
+    return {
+        //#region ----   Report Loading   ----
+        async loadReport(reportId) {
+            await releaseInlineNotificationWatch();
+            patchState(store, {
+                status: AXPPageStatus.Processing,
+                error: null,
+            });
+            try {
+                const report = await reportDefinitionService.getReportById(reportId);
+                if (report) {
+                    // Configure parameter widgets with proper paths
+                    report.parameterGroups.forEach((group) => {
+                        group.parameters.forEach((param) => {
+                            param.widget.path = param.path;
+                        });
+                    });
+                    const userSettings = await reportUserSettingsService.load(reportId);
+                    const defaultLayout = report.layouts.find((l) => l.isDefault) || report.layouts[0];
+                    const savedLayout = userSettings?.activeLayoutId
+                        ? report.layouts.find((l) => l.id === userSettings.activeLayoutId)
+                        : undefined;
+                    patchState(store, {
+                        reportDefinition: report,
+                        currentLayout: savedLayout ?? defaultLayout,
+                        filterContext: collectReportParameterDefaults(report.parameterGroups),
+                        allowFetchData: false,
+                        hasBeenExecuted: false,
+                        executionRequestId: 0,
+                        reportUserSettings: userSettings,
+                        runId: null,
+                        frozen: false,
+                        freeze: null,
+                        backgroundQueued: false,
+                        backgroundGenerationRequestId: null,
+                        inlineGenerationWatchActive: false,
+                        parametersReadonly: false,
+                        selectedLayoutIds: report.layouts.map((layout) => layout.id),
+                    });
+                }
+            }
+            catch (error) {
+                patchState(store, {
+                    error: '@report-management:report-viewer.messages.error.failed-to-load',
+                });
+                console.error('Error loading report:', error);
+            }
+            finally {
+                patchState(store, {
+                    status: AXPPageStatus.Idle,
+                });
+            }
+        },
+        //#endregion
+        //#region ----   Layout Management   ----
+        switchLayout(layoutId) {
+            const report = store.reportDefinition();
+            if (!report)
+                return;
+            const layout = report.layouts.find((l) => l.id === layoutId);
+            if (layout) {
+                patchState(store, {
+                    currentLayout: layout,
+                    reportUserSettings: {
+                        ...(store.reportUserSettings() ?? {}),
+                        activeLayoutId: layoutId,
+                    },
+                });
+                void reportUserSettingsService.saveActiveLayoutId(report.id, layoutId);
+            }
+        },
+        isBackgroundLayoutSelected(layoutId) {
+            return store.selectedLayoutIds().includes(layoutId);
+        },
+        setBackgroundLayoutSelected(layoutId, selected) {
+            const current = store.selectedLayoutIds();
+            if (selected) {
+                if (current.includes(layoutId)) {
+                    return;
+                }
+                patchState(store, { selectedLayoutIds: [...current, layoutId] });
+                return;
+            }
+            patchState(store, {
+                selectedLayoutIds: current.filter((id) => id !== layoutId),
+            });
+        },
+        async saveTableColumnOrder(columns) {
+            const reportId = store.reportDefinition()?.id;
+            const layoutId = store.currentLayout()?.id;
+            if (!reportId || !layoutId) {
+                return;
+            }
+            await reportUserSettingsService.saveTableColumnOrder(reportId, layoutId, toColumnUserState(columns));
+            patchState(store, {
+                reportUserSettings: mergeTableColumnsIntoSettings(store.reportUserSettings(), layoutId, toColumnUserState(columns)),
+            });
+        },
+        async saveTableColumnWidth(field, width, columns) {
+            const reportId = store.reportDefinition()?.id;
+            const layoutId = store.currentLayout()?.id;
+            if (!reportId || !layoutId) {
+                return;
+            }
+            const columnState = toColumnUserState(columns);
+            await reportUserSettingsService.saveTableColumnWidth(reportId, layoutId, field, width, columnState);
+            patchState(store, {
+                reportUserSettings: mergeTableColumnsIntoSettings(store.reportUserSettings(), layoutId, columnState),
+            });
+        },
+        async saveTableSorts(sorts) {
+            const reportId = store.reportDefinition()?.id;
+            const layoutId = store.currentLayout()?.id;
+            if (!reportId || !layoutId) {
+                return;
+            }
+            await reportUserSettingsService.saveTableSorts(reportId, layoutId, sorts);
+            patchState(store, {
+                reportUserSettings: mergeTableSortsIntoSettings(store.reportUserSettings(), layoutId, sorts),
+            });
+        },
+        async saveTablePageSize(pageSize) {
+            const reportId = store.reportDefinition()?.id;
+            const layoutId = store.currentLayout()?.id;
+            if (!reportId || !layoutId) {
+                return;
+            }
+            await reportUserSettingsService.saveTablePageSize(reportId, layoutId, pageSize);
+            patchState(store, {
+                reportUserSettings: mergeTablePageSizeIntoSettings(store.reportUserSettings(), layoutId, pageSize),
+            });
+        },
+        //#endregion
+        //#region ----   Data Execution   ----
+        executeReport,
+        fetchData,
+        generateInBackground,
+        releaseInlineNotificationWatch,
+        nudgeFetch() {
+            if (!store.allowFetchData()) {
+                return;
+            }
+            patchState(store, { executionRequestId: store.executionRequestId() + 1 });
+        },
+        loadFrozenRun: api.loadFrozenRun,
+        //#endregion
+        //#region ----   Drill View   ----
+        /**
+         * Applies the same layout in drill-down mode: hides group-by columns, keeps summary and data source.
+         */
+        applyDrillView(options) {
+            const layout = store.currentLayout();
+            if (!layout || layout.layout.type !== 'table') {
+                return;
+            }
+            const tableLayout = layout.layout;
+            const hiddenFields = new Set(options.hideColumnFields);
+            const nextTableLayout = {
+                ...tableLayout,
+                columns: tableLayout.columns.map((column) => hiddenFields.has(column.field) ? { ...column, visible: false } : column),
+                groupBy: undefined,
+                actions: [],
+            };
+            patchState(store, {
+                currentLayout: {
+                    ...layout,
+                    layout: nextTableLayout,
+                },
+            });
+        },
+        //#endregion
+        //#region ----   Filter Management   ----
+        updateFilterContext(context) {
+            patchState(store, {
+                filterContext: { ...store.filterContext(), ...context },
+                shouldExecuteReport: false, // Reset execution flag when filters change
+            });
+        },
+        clearFilters() {
+            patchState(store, {
+                allowFetchData: false,
+                shouldExecuteReport: false,
+                filterContext: collectReportParameterDefaults(store.reportDefinition()?.parameterGroups),
+                lastAppliedFilterContext: null, // Reset applied filters when clearing
+                hasBeenExecuted: false, // Reset execution state when clearing filters
+            });
+        },
+        resetFilters() {
+            patchState(store, {
+                allowFetchData: false,
+            });
+        },
+        //#endregion
+        //#region ----   Export Management   ----
+        async exportReport(format) {
+            const layout = store.currentLayout();
+            if (!layout?.export) {
+                console.warn('@report-management:report-viewer.messages.warnings.export-not-configured');
+                return;
+            }
+            try {
+                // Export logic would go here
+                // This would typically call a different command for export
+                console.log(`Exporting report in ${format} format`);
+            }
+            catch (error) {
+                console.error('Error exporting report:', error);
+            }
+        },
+        //#endregion
+        //#region ----   Utility Methods   ----
+        refresh() {
+            return executeReport();
+        },
+        clearError() {
+            patchState(store, {
+                error: null,
+            });
+        },
+        clearExecutionState() {
+            patchState(store, {
+                hasBeenExecuted: false,
+                allowFetchData: false,
+                shouldExecuteReport: false,
+                executionRequestId: 0,
+            });
+        },
+        cancel() {
+            patchState(store, {
+                status: AXPPageStatus.Idle,
+                hasBeenExecuted: false,
+                error: null,
+            });
+            //TODO: Cancel the report execution
+        },
+        reset() {
+            patchState(store, {
+                reportDefinition: null,
+                currentLayout: null,
+                filterContext: {},
+                allowFetchData: false,
+                shouldExecuteReport: false,
+                executionRequestId: 0,
+                lastAppliedFilterContext: null,
+                hasBeenExecuted: false,
+                status: AXPPageStatus.Idle,
+                error: null,
+                reportUserSettings: null,
+                runId: null,
+                frozen: false,
+                freeze: null,
+                backgroundQueued: false,
+                backgroundGenerationRequestId: null,
+                inlineGenerationWatchActive: false,
+                parametersReadonly: false,
+            });
+        },
+        //#endregion
+    };
+}), withHooks((store, translationService = inject(AXTranslationService), localeService = inject(AXLocaleService), settingsService = inject(AXPSettingsService)) => {
+    const settingSubs = new Subscription();
+    const syncShowRowIndexColumn = async () => {
+        try {
+            const value = await settingsService.get(AXPCommonSettings.ShowRowIndexColumn);
+            patchState(store, { showRowIndexColumn: value ?? false });
+        }
+        catch {
+            patchState(store, { showRowIndexColumn: false });
+        }
+    };
+    return {
+        async onInit() {
+            translationService.langChanges$.subscribe(() => {
+                // Handle language change if needed
+            });
+            localeService.profileChanged$.subscribe(() => {
+                // Handle locale change if needed
+            });
+            void syncShowRowIndexColumn();
+            settingSubs.add(settingsService.onLoaded.subscribe(() => void syncShowRowIndexColumn()));
+            settingSubs.add(settingsService.onChanged.subscribe(() => void syncShowRowIndexColumn()));
+        },
+        onDestroy() {
+            settingSubs.unsubscribe();
+        },
+    };
+}));
+//#region ----   Settings Merge Helpers   ----
+function mergeTableColumnsIntoSettings(settings, layoutId, columns) {
+    const base = settings ?? {};
+    return {
+        ...base,
+        layouts: {
+            ...base.layouts,
+            [layoutId]: {
+                ...base.layouts?.[layoutId],
+                table: {
+                    ...base.layouts?.[layoutId]?.table,
+                    columns,
+                },
+            },
+        },
+    };
+}
+function mergeTableSortsIntoSettings(settings, layoutId, sorts) {
+    const base = settings ?? {};
+    return {
+        ...base,
+        layouts: {
+            ...base.layouts,
+            [layoutId]: {
+                ...base.layouts?.[layoutId],
+                table: {
+                    ...base.layouts?.[layoutId]?.table,
+                    sorts,
+                },
+            },
+        },
+    };
+}
+function mergeTablePageSizeIntoSettings(settings, layoutId, pageSize) {
+    const base = settings ?? {};
+    return {
+        ...base,
+        layouts: {
+            ...base.layouts,
+            [layoutId]: {
+                ...base.layouts?.[layoutId],
+                table: {
+                    ...base.layouts?.[layoutId]?.table,
+                    pageSize,
+                },
+            },
+        },
+    };
+}
+//#endregion
+
+class AXPReportChartViewComponent {
+    constructor() {
+        //#region ----   Dependencies   ----
+        this.vm = inject(AXPReportViewerViewModel);
+        this.AXPPageStatus = AXPPageStatus;
+        //#endregion
+        //#region ----   Computed Properties   ----
+        /**
+         * Current chart layout configuration
+         */
+        this.chartLayout = computed(() => {
+            const layout = this.vm.currentLayout();
+            return layout?.layout.type === 'chart' ? layout.layout : null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "chartLayout" }] : /* istanbul ignore next */ []));
+        /**
+         * Chart configuration options
+         */
+        this.chartOptions = computed(() => {
+            const chartLayout = this.chartLayout();
+            return chartLayout?.options || null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "chartOptions" }] : /* istanbul ignore next */ []));
+        /**
+         * Chart type for rendering
+         */
+        this.chartType = computed(() => {
+            const options = this.chartOptions();
+            return options?.chartType || 'bar';
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "chartType" }] : /* istanbul ignore next */ []));
+        /**
+         * Data mapping configuration
+         */
+        this.dataMapping = computed(() => {
+            const options = this.chartOptions();
+            return options?.dataMapping || null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "dataMapping" }] : /* istanbul ignore next */ []));
+        //#endregion
+        //#region ----   Effects   ----
+        /**
+         * Effect to fetch chart data when conditions are met
+         */
+        this.#fetchData = effect(() => {
+            if (this.vm.allowFetchData() && this.vm.shouldExecuteReport() && this.chartOptions()) {
+                void untracked(() => this.vm.fetchData()).then((result) => {
+                    if (!result) {
+                        return;
+                    }
+                    const series = queryResultToChartSeries(result, this.dataMapping());
+                    const seriesColors = this.chartOptions()?.styling?.seriesColors;
+                    switch (this.chartType()) {
+                        case 'bar': {
+                            // Mapper returns flat bars for report series (not clustered).
+                            const bars = AXBarChartReportMapper(series);
+                            this.barChartData.set(applySeriesColors(bars, seriesColors));
+                            break;
+                        }
+                        case 'doughnut': {
+                            this.donutChartData.set(applySeriesColors(AXPieChartReportMapper(series), seriesColors));
+                            break;
+                        }
+                        case 'line':
+                        default: {
+                            this.lineChartData.set(AXLineChartReportMapper(series));
+                            break;
+                        }
+                    }
+                });
+            }
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#fetchData" }] : /* istanbul ignore next */ []));
+        this.legendOptions = signal({
+            mode: 'vertical',
+            showValues: true,
+            showPercentage: true,
+            interactive: true,
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "legendOptions" }] : /* istanbul ignore next */ []));
+        this.barChartData = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "barChartData" }] : /* istanbul ignore next */ []));
+        this.barChartOptions = signal({}, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "barChartOptions" }] : /* istanbul ignore next */ []));
+        this.donutChartData = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "donutChartData" }] : /* istanbul ignore next */ []));
+        this.donutChartOptions = signal({
+            totalLabel: 'Total',
+            showTooltip: true,
+            showDataLabels: false,
+            donutWidth: 28,
+            cornerRadius: 4,
+            animationDuration: 800,
+            animationEasing: 'cubic-out',
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "donutChartOptions" }] : /* istanbul ignore next */ []));
+        this.lineChartData = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "lineChartData" }] : /* istanbul ignore next */ []));
+        this.lineChartOptions = signal({}, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "lineChartOptions" }] : /* istanbul ignore next */ []));
+        /**
+         * Check if bar chart data has items
+         */
+        this.hasBarChartData = computed(() => {
+            const data = this.barChartData();
+            return Array.isArray(data) && data.length > 0;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "hasBarChartData" }] : /* istanbul ignore next */ []));
+        /**
+         * Check if donut chart data has items
+         */
+        this.hasDonutChartData = computed(() => {
+            const data = this.donutChartData();
+            return Array.isArray(data) && data.length > 0;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "hasDonutChartData" }] : /* istanbul ignore next */ []));
+        /**
+         * Check if line chart data has items
+         */
+        this.hasLineChartData = computed(() => {
+            const data = this.lineChartData();
+            return Array.isArray(data) && data.length > 0;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "hasLineChartData" }] : /* istanbul ignore next */ []));
+        /**
+         * Check if chart has any data (for any chart type)
+         */
+        this.hasChartData = computed(() => {
+            return this.hasBarChartData() || this.hasDonutChartData() || this.hasLineChartData();
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "hasChartData" }] : /* istanbul ignore next */ []));
+        /**
+         * Check if report has been executed and has no data
+         */
+        this.showNoDataState = computed(() => {
+            return this.vm.hasBeenExecuted() && !this.hasChartData();
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "showNoDataState" }] : /* istanbul ignore next */ []));
+    }
+    //#endregion
+    //#region ----   Effects   ----
+    /**
+     * Effect to fetch chart data when conditions are met
+     */
+    #fetchData;
+    //#endregion
+    //#region ----   Helper Methods   ----
+    /**
+     * Check if chart is ready to render
+     */
+    isChartReady() {
+        return !!(this.chartOptions() && this.dataMapping());
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPReportChartViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPReportChartViewComponent, isStandalone: true, selector: "axp-report-chart-view", host: { classAttribute: "axp-report-chart-view w-full h-full flex flex-col" }, ngImport: i0, template: "<ng-container *translate=\"let t\">\n  @if (vm.status() === AXPPageStatus.Processing) {\n    <!-- Loading State -->\n    <div class=\"__loading flex flex-col items-center justify-center h-full gap-6 p-8\">\n      <div class=\"spinner spin w-10 h-10\"></div>\n      <div class=\"__loading-text text-sm opacity-70\">\n        {{ t('@report-management:report-viewer.components.chart.messages.loading') | async }}\n      </div>\n    </div>\n  } @else if (vm.status() === AXPPageStatus.Error) {\n    <!-- Error State -->\n    <axp-state-message\n      mode=\"error\"\n      icon=\"fa-light fa-exclamation-triangle\"\n      [title]=\"'@report-management:report-viewer.messages.error.fetch-title'\"\n      [description]=\"vm.error() || '@report-management:report-viewer.messages.error.fetch-description'\"\n    >\n    </axp-state-message>\n  } @else if (isChartReady() && showNoDataState()) {\n    <!-- No Data State -->\n    <axp-state-message\n      icon=\"fa-light fa-chart-pie\"\n      [title]=\"'@report-management:report-viewer.components.chart.empty-states.no-data.title'\"\n      [description]=\"'@report-management:report-viewer.components.chart.empty-states.no-data.description'\"\n    >\n    </axp-state-message>\n  } @else if (isChartReady()) {\n    <!-- Chart Content -->\n    <section\n      class=\"__chart-container overflow-auto md:overflow-hidden rounded-2xl border h-full flex flex-col\"\n    >\n      @if (chartLayout()?.header) {\n        <header\n          class=\"__chart-header p-4 md:p-6 border-b flex flex-col sm:flex-row gap-2 sm:items-center sm:justify-between\"\n        >\n          <h3 class=\"__chart-title text-base md:text-lg font-semibold truncate\">\n            {{ chartLayout()?.header?.title }}\n          </h3>\n          @if (chartLayout()?.header?.showDate) {\n            <div class=\"__chart-date text-xs md:text-sm opacity-70 font-medium flex-shrink-0\">\n              {{ '@general:common.date.today' | translate | async }}\n            </div>\n          }\n        </header>\n      }\n\n      <div class=\"__chart-body flex min-h-0 flex-1 flex-col p-3 md:p-6\">\n        @switch (chartType()) {\n          @case ('bar') {\n            <!-- ----- Bar chart with side legend ----- -->\n            <div class=\"__chart-wrapper flex h-full min-h-0 w-full flex-col items-center gap-4 lg:flex-row lg:gap-6\">\n              <div\n                class=\"__chart-content flex h-full min-h-[250px] w-full flex-1 items-center justify-center overflow-hidden md:min-h-[300px]\"\n              >\n                <ax-bar-chart #barChart [data]=\"barChartData()\" [options]=\"barChartOptions()\"></ax-bar-chart>\n              </div>\n              @if (hasBarChartData()) {\n                <div class=\"__chart-legend w-fit flex-shrink-0\">\n                  <ax-chart-legend [options]=\"legendOptions()\" [chart]=\"barChart\"></ax-chart-legend>\n                </div>\n              }\n            </div>\n          }\n          @case ('doughnut') {\n            <!-- ----- Donut in a square box; vertical legend on the right (same as bar) ----- -->\n            <div class=\"__chart-wrapper flex h-full min-h-0 w-full flex-col items-center gap-4 lg:flex-row lg:gap-6\">\n              <div\n                class=\"__chart-content flex h-full min-h-[250px] w-full flex-1 items-center justify-center overflow-hidden md:min-h-[300px]\"\n              >\n                <div\n                  class=\"__chart-radial relative aspect-square h-full max-h-full w-auto max-w-full min-h-64 min-w-64 overflow-hidden\"\n                >\n                  <ax-donut-chart\n                    #donutChart\n                    [data]=\"donutChartData()\"\n                    [options]=\"donutChartOptions()\"\n                  ></ax-donut-chart>\n                </div>\n              </div>\n              @if (hasDonutChartData()) {\n                <div class=\"__chart-legend w-fit flex-shrink-0\">\n                  <ax-chart-legend [options]=\"legendOptions()\" [chart]=\"donutChart\"></ax-chart-legend>\n                </div>\n              }\n            </div>\n          }\n          @default {\n            <!-- ----- Line chart with side legend ----- -->\n            <div class=\"__chart-wrapper flex h-full min-h-0 w-full flex-col items-center gap-4 lg:flex-row lg:gap-6\">\n              <div\n                class=\"__chart-content flex h-full min-h-[250px] w-full flex-1 items-center justify-center overflow-hidden md:min-h-[300px]\"\n              >\n                <ax-line-chart #lineChart [data]=\"lineChartData()\" [options]=\"lineChartOptions()\"></ax-line-chart>\n              </div>\n              @if (hasLineChartData()) {\n                <div class=\"__chart-legend w-fit flex-shrink-0\">\n                  <ax-chart-legend [options]=\"legendOptions()\" [chart]=\"lineChart\"></ax-chart-legend>\n                </div>\n              }\n            </div>\n          }\n        }\n      </div>\n\n      @if (chartLayout()?.footer) {\n        <footer class=\"__chart-footer p-4 md:p-6 border-t\">\n          @if (chartLayout()?.footer?.customHtml) {\n            <div [innerHTML]=\"$safeNavigationMigration(chartLayout()?.footer?.customHtml)\"></div>\n          }\n        </footer>\n      }\n    </section>\n  } @else {\n    <!-- No Configuration State -->\n    <axp-state-message\n      icon=\"fa-light fa-chart-line\"\n      [title]=\"'@report-management:report-viewer.components.chart.empty-states.no-config.title'\"\n      [description]=\"'@report-management:report-viewer.components.chart.empty-states.no-config.description'\"\n    >\n    </axp-state-message>\n  }\n</ng-container>\n", styles: [":host ::ng-deep .__chart-radial ax-donut-chart{display:block!important;width:100%!important;height:100%!important;min-height:0!important;max-height:100%!important}:host ::ng-deep .__chart-radial ax-donut-chart .ax-donut-chart{min-height:0!important;height:100%!important;width:100%!important}:host ::ng-deep ax-chart-legend{display:block!important;height:auto!important;max-height:none;width:100%}:host ::ng-deep .ax-chart-legend{height:auto;max-height:none}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i4.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: AXBarChartComponent, selector: "ax-bar-chart", inputs: ["data", "options"], outputs: ["barClick"] }, { kind: "component", type: AXDonutChartComponent, selector: "ax-donut-chart", inputs: ["data", "options"], outputs: ["segmentClick", "segmentHover"] }, { kind: "component", type: AXLineChartComponent, selector: "ax-line-chart", inputs: ["data", "options"], outputs: ["pointClick"] }, { kind: "component", type: AXChartLegendComponent, selector: "ax-chart-legend", inputs: ["chart", "options"], outputs: ["itemClick", "itemMouseEnter", "itemMouseLeave"] }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPReportChartViewComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'axp-report-chart-view', imports: [
+                        CommonModule,
+                        AXTranslationModule,
+                        AXPWidgetCoreModule,
+                        AXBarChartComponent,
+                        AXDonutChartComponent,
+                        AXLineChartComponent,
+                        AXChartLegendComponent,
+                        AXPStateMessageComponent,
+                    ], host: {
+                        class: 'axp-report-chart-view w-full h-full flex flex-col',
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *translate=\"let t\">\n  @if (vm.status() === AXPPageStatus.Processing) {\n    <!-- Loading State -->\n    <div class=\"__loading flex flex-col items-center justify-center h-full gap-6 p-8\">\n      <div class=\"spinner spin w-10 h-10\"></div>\n      <div class=\"__loading-text text-sm opacity-70\">\n        {{ t('@report-management:report-viewer.components.chart.messages.loading') | async }}\n      </div>\n    </div>\n  } @else if (vm.status() === AXPPageStatus.Error) {\n    <!-- Error State -->\n    <axp-state-message\n      mode=\"error\"\n      icon=\"fa-light fa-exclamation-triangle\"\n      [title]=\"'@report-management:report-viewer.messages.error.fetch-title'\"\n      [description]=\"vm.error() || '@report-management:report-viewer.messages.error.fetch-description'\"\n    >\n    </axp-state-message>\n  } @else if (isChartReady() && showNoDataState()) {\n    <!-- No Data State -->\n    <axp-state-message\n      icon=\"fa-light fa-chart-pie\"\n      [title]=\"'@report-management:report-viewer.components.chart.empty-states.no-data.title'\"\n      [description]=\"'@report-management:report-viewer.components.chart.empty-states.no-data.description'\"\n    >\n    </axp-state-message>\n  } @else if (isChartReady()) {\n    <!-- Chart Content -->\n    <section\n      class=\"__chart-container overflow-auto md:overflow-hidden rounded-2xl border h-full flex flex-col\"\n    >\n      @if (chartLayout()?.header) {\n        <header\n          class=\"__chart-header p-4 md:p-6 border-b flex flex-col sm:flex-row gap-2 sm:items-center sm:justify-between\"\n        >\n          <h3 class=\"__chart-title text-base md:text-lg font-semibold truncate\">\n            {{ chartLayout()?.header?.title }}\n          </h3>\n          @if (chartLayout()?.header?.showDate) {\n            <div class=\"__chart-date text-xs md:text-sm opacity-70 font-medium flex-shrink-0\">\n              {{ '@general:common.date.today' | translate | async }}\n            </div>\n          }\n        </header>\n      }\n\n      <div class=\"__chart-body flex min-h-0 flex-1 flex-col p-3 md:p-6\">\n        @switch (chartType()) {\n          @case ('bar') {\n            <!-- ----- Bar chart with side legend ----- -->\n            <div class=\"__chart-wrapper flex h-full min-h-0 w-full flex-col items-center gap-4 lg:flex-row lg:gap-6\">\n              <div\n                class=\"__chart-content flex h-full min-h-[250px] w-full flex-1 items-center justify-center overflow-hidden md:min-h-[300px]\"\n              >\n                <ax-bar-chart #barChart [data]=\"barChartData()\" [options]=\"barChartOptions()\"></ax-bar-chart>\n              </div>\n              @if (hasBarChartData()) {\n                <div class=\"__chart-legend w-fit flex-shrink-0\">\n                  <ax-chart-legend [options]=\"legendOptions()\" [chart]=\"barChart\"></ax-chart-legend>\n                </div>\n              }\n            </div>\n          }\n          @case ('doughnut') {\n            <!-- ----- Donut in a square box; vertical legend on the right (same as bar) ----- -->\n            <div class=\"__chart-wrapper flex h-full min-h-0 w-full flex-col items-center gap-4 lg:flex-row lg:gap-6\">\n              <div\n                class=\"__chart-content flex h-full min-h-[250px] w-full flex-1 items-center justify-center overflow-hidden md:min-h-[300px]\"\n              >\n                <div\n                  class=\"__chart-radial relative aspect-square h-full max-h-full w-auto max-w-full min-h-64 min-w-64 overflow-hidden\"\n                >\n                  <ax-donut-chart\n                    #donutChart\n                    [data]=\"donutChartData()\"\n                    [options]=\"donutChartOptions()\"\n                  ></ax-donut-chart>\n                </div>\n              </div>\n              @if (hasDonutChartData()) {\n                <div class=\"__chart-legend w-fit flex-shrink-0\">\n                  <ax-chart-legend [options]=\"legendOptions()\" [chart]=\"donutChart\"></ax-chart-legend>\n                </div>\n              }\n            </div>\n          }\n          @default {\n            <!-- ----- Line chart with side legend ----- -->\n            <div class=\"__chart-wrapper flex h-full min-h-0 w-full flex-col items-center gap-4 lg:flex-row lg:gap-6\">\n              <div\n                class=\"__chart-content flex h-full min-h-[250px] w-full flex-1 items-center justify-center overflow-hidden md:min-h-[300px]\"\n              >\n                <ax-line-chart #lineChart [data]=\"lineChartData()\" [options]=\"lineChartOptions()\"></ax-line-chart>\n              </div>\n              @if (hasLineChartData()) {\n                <div class=\"__chart-legend w-fit flex-shrink-0\">\n                  <ax-chart-legend [options]=\"legendOptions()\" [chart]=\"lineChart\"></ax-chart-legend>\n                </div>\n              }\n            </div>\n          }\n        }\n      </div>\n\n      @if (chartLayout()?.footer) {\n        <footer class=\"__chart-footer p-4 md:p-6 border-t\">\n          @if (chartLayout()?.footer?.customHtml) {\n            <div [innerHTML]=\"$safeNavigationMigration(chartLayout()?.footer?.customHtml)\"></div>\n          }\n        </footer>\n      }\n    </section>\n  } @else {\n    <!-- No Configuration State -->\n    <axp-state-message\n      icon=\"fa-light fa-chart-line\"\n      [title]=\"'@report-management:report-viewer.components.chart.empty-states.no-config.title'\"\n      [description]=\"'@report-management:report-viewer.components.chart.empty-states.no-config.description'\"\n    >\n    </axp-state-message>\n  }\n</ng-container>\n", styles: [":host ::ng-deep .__chart-radial ax-donut-chart{display:block!important;width:100%!important;height:100%!important;min-height:0!important;max-height:100%!important}:host ::ng-deep .__chart-radial ax-donut-chart .ax-donut-chart{min-height:0!important;height:100%!important;width:100%!important}:host ::ng-deep ax-chart-legend{display:block!important;height:auto!important;max-height:none;width:100%}:host ::ng-deep .ax-chart-legend{height:auto;max-height:none}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
+        }] });
+//#region ----- Series color helpers -----
+function applySeriesColors(items, seriesColors) {
+    if (!seriesColors || Object.keys(seriesColors).length === 0) {
+        return items;
+    }
+    return items.map((item) => {
+        const color = seriesColors[item.id] ?? (item.label ? seriesColors[item.label] : undefined);
+        return color ? { ...item, color } : item;
+    });
+}
+
+class AXPReportPdfViewComponent {
+    constructor() {
+        //#region ----   Dependencies   ----
+        this.vm = inject(AXPReportViewerViewModel);
+        this.AXPPageStatus = AXPPageStatus;
+        this.sanitizer = inject(DomSanitizer);
+        //#endregion
+        //#region ----   Computed Properties   ----
+        /**
+         * Current PDF layout configuration
+         */
+        this.pdfLayout = computed(() => {
+            const layout = this.vm.currentLayout();
+            return layout?.layout.type === 'pdf' ? layout.layout : null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "pdfLayout" }] : /* istanbul ignore next */ []));
+        /**
+         * PDF layout options
+         */
+        this.pdfOptions = computed(() => {
+            const pdfLayout = this.pdfLayout();
+            return pdfLayout?.options || {};
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "pdfOptions" }] : /* istanbul ignore next */ []));
+        /**
+         * PDF source URL (sanitized for embed)
+         */
+        this.pdfSource = computed(() => {
+            const pdfData = this.pdfData();
+            if (!pdfData) {
+                return null;
+            }
+            // Handle URL
+            if (pdfData.url) {
+                return this.sanitizer.bypassSecurityTrustResourceUrl(pdfData.url);
+            }
+            // Handle base64
+            if (pdfData.base64) {
+                const base64Data = pdfData.base64.startsWith('data:')
+                    ? pdfData.base64
+                    : `data:application/pdf;base64,${pdfData.base64}`;
+                return this.sanitizer.bypassSecurityTrustResourceUrl(base64Data);
+            }
+            // Handle blob
+            if (pdfData.blob) {
+                const blobUrl = URL.createObjectURL(pdfData.blob);
+                return this.sanitizer.bypassSecurityTrustResourceUrl(blobUrl);
+            }
+            return null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "pdfSource" }] : /* istanbul ignore next */ []));
+        /**
+         * PDF filename for download
+         */
+        this.pdfFilename = computed(() => {
+            const pdfData = this.pdfData();
+            return pdfData?.filename || 'report.pdf';
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "pdfFilename" }] : /* istanbul ignore next */ []));
+        /**
+         * PDF embed height
+         */
+        this.embedHeight = computed(() => {
+            const options = this.pdfOptions();
+            return options.height || '100%';
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "embedHeight" }] : /* istanbul ignore next */ []));
+        /**
+         * Check if PDF is ready to render
+         */
+        this.isPdfReady = computed(() => {
+            return !!this.pdfSource();
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isPdfReady" }] : /* istanbul ignore next */ []));
+        /**
+         * Check if download button should be shown
+         */
+        this.showDownloadButton = computed(() => {
+            const options = this.pdfOptions();
+            return options.showDownloadButton !== false; // Default to true
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "showDownloadButton" }] : /* istanbul ignore next */ []));
+        /**
+         * Check if print button should be shown
+         */
+        this.showPrintButton = computed(() => {
+            const options = this.pdfOptions();
+            return options.showPrintButton !== false; // Default to true
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "showPrintButton" }] : /* istanbul ignore next */ []));
+        /**
+         * Check if zoom controls should be shown
+         */
+        this.showZoomControls = computed(() => {
+            const options = this.pdfOptions();
+            return options.showZoomControls !== false; // Default to true
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "showZoomControls" }] : /* istanbul ignore next */ []));
+        /**
+         * Check if fullscreen button should be shown
+         */
+        this.showFullscreenButton = computed(() => {
+            const options = this.pdfOptions();
+            return options.showFullscreenButton !== false; // Default to true
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "showFullscreenButton" }] : /* istanbul ignore next */ []));
+        /**
+         * Current zoom level
+         */
+        this.currentZoom = signal(100, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "currentZoom" }] : /* istanbul ignore next */ []));
+        /**
+         * PDF data from execution result
+         */
+        this.pdfData = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "pdfData" }] : /* istanbul ignore next */ []));
+        /**
+         * Fullscreen state
+         */
+        this.isFullscreen = signal(false, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "isFullscreen" }] : /* istanbul ignore next */ []));
+        //#endregion
+        //#region ----   Effects   ----
+        /**
+         * Effect to fetch PDF data when conditions are met
+         */
+        this.#fetchData = effect(() => {
+            if (this.vm.allowFetchData() && this.vm.shouldExecuteReport() && this.pdfLayout()) {
+                void untracked(() => this.vm.fetchData()).then((result) => {
+                    if (!result) {
+                        return;
+                    }
+                    const pdfResult = queryResultToPdfSource(result);
+                    this.pdfData.set(pdfResult);
+                    if (pdfResult) {
+                        const options = this.pdfOptions();
+                        if (options.defaultZoom) {
+                            this.currentZoom.set(options.defaultZoom);
+                        }
+                    }
+                });
+            }
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#fetchData" }] : /* istanbul ignore next */ []));
+    }
+    //#endregion
+    //#region ----   Effects   ----
+    /**
+     * Effect to fetch PDF data when conditions are met
+     */
+    #fetchData;
+    //#endregion
+    //#region ----   Methods   ----
+    /**
+     * Handle download PDF
+     */
+    downloadPdf() {
+        const pdfData = this.pdfData();
+        if (!pdfData) {
+            return;
+        }
+        let url;
+        let filename = this.pdfFilename();
+        let shouldRevokeUrl = false;
+        if (pdfData.url) {
+            // For URL, create a temporary link
+            url = pdfData.url;
+        }
+        else if (pdfData.base64) {
+            // Convert base64 to blob and create URL
+            const base64Data = pdfData.base64.startsWith('data:')
+                ? pdfData.base64.split(',')[1]
+                : pdfData.base64;
+            const byteCharacters = atob(base64Data);
+            const byteNumbers = new Array(byteCharacters.length);
+            for (let i = 0; i < byteCharacters.length; i++) {
+                byteNumbers[i] = byteCharacters.charCodeAt(i);
+            }
+            const byteArray = new Uint8Array(byteNumbers);
+            const blob = new Blob([byteArray], { type: 'application/pdf' });
+            url = URL.createObjectURL(blob);
+            shouldRevokeUrl = true;
+        }
+        else if (pdfData.blob) {
+            url = URL.createObjectURL(pdfData.blob);
+            shouldRevokeUrl = true;
+        }
+        else {
+            return;
+        }
+        // Create download link
+        const link = document.createElement('a');
+        link.href = url;
+        link.download = filename;
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+        // Clean up blob URL if created
+        if (shouldRevokeUrl) {
+            setTimeout(() => URL.revokeObjectURL(url), 100);
+        }
+    }
+    /**
+     * Handle print PDF
+     */
+    printPdf() {
+        const pdfData = this.pdfData();
+        if (!pdfData) {
+            return;
+        }
+        let url;
+        if (pdfData.url) {
+            url = pdfData.url;
+        }
+        else if (pdfData.base64) {
+            const base64Data = pdfData.base64.startsWith('data:')
+                ? pdfData.base64
+                : `data:application/pdf;base64,${pdfData.base64}`;
+            url = base64Data;
+        }
+        else if (pdfData.blob) {
+            url = URL.createObjectURL(pdfData.blob);
+        }
+        else {
+            return;
+        }
+        // Open PDF in new window for printing
+        const printWindow = window.open(url, '_blank');
+        if (printWindow) {
+            printWindow.onload = () => {
+                printWindow.print();
+            };
+        }
+    }
+    /**
+     * Handle zoom in
+     */
+    zoomIn() {
+        const current = this.currentZoom();
+        if (current < 500) {
+            this.currentZoom.set(Math.min(current + 25, 500));
+        }
+    }
+    /**
+     * Handle zoom out
+     */
+    zoomOut() {
+        const current = this.currentZoom();
+        if (current > 25) {
+            this.currentZoom.set(Math.max(current - 25, 25));
+        }
+    }
+    /**
+     * Handle zoom reset
+     */
+    zoomReset() {
+        const options = this.pdfOptions();
+        this.currentZoom.set(options.defaultZoom || 100);
+    }
+    /**
+     * Handle fullscreen toggle
+     */
+    toggleFullscreen() {
+        const isFullscreen = this.isFullscreen();
+        this.isFullscreen.set(!isFullscreen);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPReportPdfViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPReportPdfViewComponent, isStandalone: true, selector: "axp-report-pdf-view", host: { classAttribute: "axp-report-pdf-view w-full h-full flex flex-col" }, ngImport: i0, template: "<ng-container *translate=\"let t\">\n    @if (vm.status() === AXPPageStatus.Processing) {\n    <!-- Loading State -->\n    <div class=\"__loading flex flex-col items-center justify-center h-full gap-6 p-8\">\n        <div class=\"spinner spin w-10 h-10\"></div>\n        <div class=\"__loading-text text-sm opacity-70\">\n            {{ t('@report-management:report-viewer.components.pdf.messages.loading') | async }}\n        </div>\n    </div>\n    } @else if (vm.status() === AXPPageStatus.Error) {\n    <!-- Error State -->\n    <axp-state-message mode=\"error\" icon=\"fa-light fa-exclamation-triangle\"\n        [title]=\"'@report-management:report-viewer.messages.error.fetch-title'\"\n        [description]=\"vm.error() || '@report-management:report-viewer.messages.error.fetch-description'\">\n    </axp-state-message>\n    } @else if (isPdfReady()) {\n    <!-- PDF Embed Only -->\n    <embed class=\"__pdf-embed w-full h-full\" [src]=\"pdfSource()\" type=\"application/pdf\" />\n    } @else {\n    <!-- No PDF Data State -->\n    <axp-state-message icon=\"fa-light fa-file-pdf\"\n        [title]=\"'@report-management:report-viewer.components.pdf.empty-states.no-data.title'\"\n        [description]=\"'@report-management:report-viewer.components.pdf.empty-states.no-data.description'\">\n    </axp-state-message>\n    }\n</ng-container>", styles: [".axp-report-pdf-view .__loading{min-height:400px}.axp-report-pdf-view .__pdf-container{background:var(--ax-color-background)}.axp-report-pdf-view .__pdf-container.__fullscreen{position:fixed;z-index:9999;inset:0;border-radius:0}.axp-report-pdf-view .__pdf-toolbar{background:var(--ax-color-surface)}.axp-report-pdf-view .__pdf-body{background:var(--ax-color-background-secondary)}.axp-report-pdf-view .__pdf-wrapper{min-height:400px}.axp-report-pdf-view .__pdf-embed{--tw-border-style: none;border-style:none;box-shadow:0 2px 8px #0000001a;transition:width .3s ease,height .3s ease}.axp-report-pdf-view .__zoom-level{-webkit-user-select:none;user-select:none}@media(max-width:640px){.axp-report-pdf-view .__zoom-controls{margin-top:calc(var(--spacing, .25rem) * 2);width:100%;justify-content:center;margin-left:0}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXButtonModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i4.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: AXPStateMessageComponent, selector: "axp-state-message", inputs: ["mode", "icon", "title", "description", "titleParams", "descriptionParams", "look"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPReportPdfViewComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'axp-report-pdf-view', imports: [
+                        CommonModule,
+                        AXButtonModule,
+                        AXDecoratorModule,
+                        AXTranslationModule,
+                        AXPWidgetCoreModule,
+                        AXPStateMessageComponent,
+                    ], host: {
+                        class: 'axp-report-pdf-view w-full h-full flex flex-col',
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container *translate=\"let t\">\n    @if (vm.status() === AXPPageStatus.Processing) {\n    <!-- Loading State -->\n    <div class=\"__loading flex flex-col items-center justify-center h-full gap-6 p-8\">\n        <div class=\"spinner spin w-10 h-10\"></div>\n        <div class=\"__loading-text text-sm opacity-70\">\n            {{ t('@report-management:report-viewer.components.pdf.messages.loading') | async }}\n        </div>\n    </div>\n    } @else if (vm.status() === AXPPageStatus.Error) {\n    <!-- Error State -->\n    <axp-state-message mode=\"error\" icon=\"fa-light fa-exclamation-triangle\"\n        [title]=\"'@report-management:report-viewer.messages.error.fetch-title'\"\n        [description]=\"vm.error() || '@report-management:report-viewer.messages.error.fetch-description'\">\n    </axp-state-message>\n    } @else if (isPdfReady()) {\n    <!-- PDF Embed Only -->\n    <embed class=\"__pdf-embed w-full h-full\" [src]=\"pdfSource()\" type=\"application/pdf\" />\n    } @else {\n    <!-- No PDF Data State -->\n    <axp-state-message icon=\"fa-light fa-file-pdf\"\n        [title]=\"'@report-management:report-viewer.components.pdf.empty-states.no-data.title'\"\n        [description]=\"'@report-management:report-viewer.components.pdf.empty-states.no-data.description'\">\n    </axp-state-message>\n    }\n</ng-container>", styles: [".axp-report-pdf-view .__loading{min-height:400px}.axp-report-pdf-view .__pdf-container{background:var(--ax-color-background)}.axp-report-pdf-view .__pdf-container.__fullscreen{position:fixed;z-index:9999;inset:0;border-radius:0}.axp-report-pdf-view .__pdf-toolbar{background:var(--ax-color-surface)}.axp-report-pdf-view .__pdf-body{background:var(--ax-color-background-secondary)}.axp-report-pdf-view .__pdf-wrapper{min-height:400px}.axp-report-pdf-view .__pdf-embed{--tw-border-style: none;border-style:none;box-shadow:0 2px 8px #0000001a;transition:width .3s ease,height .3s ease}.axp-report-pdf-view .__zoom-level{-webkit-user-select:none;user-select:none}@media(max-width:640px){.axp-report-pdf-view .__zoom-controls{margin-top:calc(var(--spacing, .25rem) * 2);width:100%;justify-content:center;margin-left:0}}\n/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n"] }]
+        }] });
+
+class AXPReportTableViewComponent {
+    constructor() {
+        //#region ----   Dependencies   ----
+        this.vm = inject(AXPReportViewerViewModel);
+        this.commandService = inject(AXPCommandService);
+        this.expressionEvaluator = inject(AXPExpressionEvaluatorService);
+        this.grid = viewChild('grid', /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "grid" }] : /* istanbul ignore next */ []));
+        //#endregion
+        //#region ----   State   ----
+        this.columns = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
+        this.sortedFields = signal([], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "sortedFields" }] : /* istanbul ignore next */ []));
+        this.tableSummary = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "tableSummary" }] : /* istanbul ignore next */ []));
+        this.handledExecutionRequestId = 0;
+        this.lastDataSourcePreferencesKey = null;
+        //#endregion
+        //#region ----   Effects   ----
+        this.#resetExecutionHandler = effect(() => {
+            const reportId = this.vm.reportId();
+            untracked(() => {
+                this.handledExecutionRequestId = 0;
+                this.lastDataSourcePreferencesKey = null;
+                void reportId;
+            });
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#resetExecutionHandler" }] : /* istanbul ignore next */ []));
+        this.#syncTableColumns = effect(() => {
+            const layoutDef = this.vm.currentLayout();
+            const tableLayout = layoutDef?.layout;
+            if (!tableLayout || tableLayout.type !== 'table') {
+                this.columns.set([]);
+                return;
+            }
+            const savedTable = this.vm.tableLayoutUserSettings();
+            const groupBy = tableLayout.groupBy;
+            const columns = tableLayout.columns;
+            const savedColumns = savedTable?.columns;
+            void (async () => {
+                const builtColumns = await buildReportTableColumnsAsync(columns, savedColumns, this.expressionEvaluator);
+                this.columns.set(applyGroupByDrillLinksToColumns(builtColumns, groupBy));
+            })();
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#syncTableColumns" }] : /* istanbul ignore next */ []));
+        this.#syncDataSourcePreferences = effect(() => {
+            const layoutDef = this.vm.currentLayout();
+            if (!layoutDef) {
+                return;
+            }
+            const tableLayout = layoutDef.layout;
+            if (!tableLayout || tableLayout.type !== 'table') {
+                return;
+            }
+            const savedTable = this.vm.tableLayoutUserSettings();
+            const queryDataSource = layoutDef.dataSource;
+            const defaultSort = tableLayout.options?.sorting?.length
+                ? tableLayout.options.sorting
+                : (queryDataSource?.sortFields ?? []);
+            const effectiveSort = savedTable?.sorts?.length ? savedTable.sorts : defaultSort;
+            const pageSize = savedTable?.pageSize ?? 10;
+            const preferencesKey = `${layoutDef.id}:${pageSize}:${JSON.stringify(effectiveSort)}`;
+            if (this.lastDataSourcePreferencesKey === preferencesKey) {
+                return;
+            }
+            untracked(() => {
+                this.lastDataSourcePreferencesKey = preferencesKey;
+                this.sortedFields.set(effectiveSort);
+                this.applySortToDataSource(effectiveSort);
+                this.dataSource.setPageSize(pageSize);
+            });
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#syncDataSourcePreferences" }] : /* istanbul ignore next */ []));
+        /**
+         * Refresh grid once per execute-report request.
+         */
+        this.#fetchData = effect(() => {
+            const requestId = this.vm.executionRequestId();
+            const grid = this.grid();
+            if (!grid || requestId <= this.handledExecutionRequestId || !this.vm.allowFetchData()) {
+                return;
+            }
+            untracked(() => {
+                this.handledExecutionRequestId = requestId;
+                grid.refresh();
+            });
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "#fetchData" }] : /* istanbul ignore next */ []));
+        //#endregion
+        //#region ----   Computed Properties   ----
+        this.layout = computed(() => {
+            return this.vm.currentLayout()?.layout;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
+        this.dataSource = new AXDataSource({
+            load: async (e) => {
+                if (!this.vm.allowFetchData()) {
+                    this.tableSummary.set(null);
+                    return { items: [], total: 0 };
+                }
+                const result = await this.vm.fetchData(e);
+                const page = runtimeQueryCollectionData(result);
+                if (!page) {
+                    this.tableSummary.set(null);
+                    return { items: [], total: 0 };
+                }
+                this.tableSummary.set(page.aggregateRows?.[0] ?? null);
+                return {
+                    items: (page.items ?? []),
+                    total: Number(page.total ?? page.items?.length ?? 0),
+                };
+            },
+            pageSize: 10,
+            key: 'id',
+        });
+        this.visibleColumns = computed(() => this.columns().filter((c) => c.visible), /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "visibleColumns" }] : /* istanbul ignore next */ []));
+        this.paginationEnabled = computed(() => {
+            return this.layout().options?.pagination !== false;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "paginationEnabled" }] : /* istanbul ignore next */ []));
+        this.hasReportFooterSummary = computed(() => {
+            return ((this.layout().summary?.some((s) => s.displayIn === 'reportFooter') ?? false) &&
+                this.tableSummary() !== null);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "hasReportFooterSummary" }] : /* istanbul ignore next */ []));
+        this.rowActions = computed(() => {
+            const tableLayout = this.layout();
+            const generated = buildDrillRowActionsFromGroupBy(tableLayout.groupBy, this.vm.reportDefinition()?.id);
+            const manual = tableLayout.actions ?? [];
+            return [...generated, ...manual];
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "rowActions" }] : /* istanbul ignore next */ []));
+        this.primaryRowAction = computed(() => {
+            return (this.rowActions().filter((a) => a.priority === 'primary')?.map((a) => this.convertToRowCommandItem(a)) ??
+                []);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "primaryRowAction" }] : /* istanbul ignore next */ []));
+        this.hasPrimaryRowAction = computed(() => {
+            return this.primaryRowAction().length > 0;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "hasPrimaryRowAction" }] : /* istanbul ignore next */ []));
+        this.secondaryRowAction = computed(() => {
+            return (this.rowActions()
+                .filter((a) => a.priority === 'secondary')
+                ?.map((a) => this.convertToRowCommandItem(a)) ?? []);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "secondaryRowAction" }] : /* istanbul ignore next */ []));
+        this.hasSecondaryRowAction = computed(() => {
+            return this.secondaryRowAction().length > 0;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "hasSecondaryRowAction" }] : /* istanbul ignore next */ []));
+        this.defaultGroupByDrillDefinition = computed(() => {
+            const groupBy = this.layout().groupBy;
+            if (!hasGroupByDrillLinks(groupBy)) {
+                return null;
+            }
+            return groupBy?.find((definition) => definition.default) ?? groupBy?.[0] ?? null;
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "defaultGroupByDrillDefinition" }] : /* istanbul ignore next */ []));
+        this.defaultRowAction = computed(() => {
+            const defaultAction = this.rowActions().find((a) => a.default);
+            if (!defaultAction) {
+                return null;
+            }
+            return this.convertToRowCommandItem(defaultAction);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "defaultRowAction" }] : /* istanbul ignore next */ []));
+    }
+    //#endregion
+    //#region ----   Effects   ----
+    #resetExecutionHandler;
+    #syncTableColumns;
+    #syncDataSourcePreferences;
+    /**
+     * Refresh grid once per execute-report request.
+     */
+    #fetchData;
+    //#endregion
+    //#region ----   Event Handlers   ----
+    handleRowClick(event) {
+        void this.handleRowAction(event.name, event.data);
+    }
+    handleDbRowClick(event) {
+        const defaultGroupByDrill = this.defaultGroupByDrillDefinition();
+        if (defaultGroupByDrill?.displayField) {
+            void this.handleGroupByDrill(defaultGroupByDrill.displayField, event.data);
+            return;
+        }
+        if (this.defaultRowAction()) {
+            void this.handleRowAction(this.defaultRowAction().name, event.data);
+        }
+    }
+    async handleGroupByDrill(displayField, data) {
+        const definition = findGroupByDefinitionForDisplayField(this.layout().groupBy, displayField);
+        if (!definition) {
+            return;
+        }
+        const reportId = this.vm.reportDefinition()?.id;
+        if (!reportId) {
+            return;
+        }
+        const commandOptions = buildGroupByDrillCommandOptions(definition, reportId);
+        const evaluatedOptions = await this.evaluateActionOptions(commandOptions, data);
+        await this.commandService.execute('ReportManagement.Report:OpenInPopup', {
+            data: data,
+            options: evaluatedOptions,
+        });
+    }
+    async handleRowAction(name, data) {
+        const action = this.rowActions().find((item) => item.command?.name === name);
+        const commandName = action?.command?.name ?? name;
+        const evaluatedOptions = await this.evaluateActionOptions(action?.command?.options, data);
+        await this.commandService.execute(commandName, {
+            data: data,
+            options: evaluatedOptions,
+        });
+    }
+    async evaluateActionOptions(options, data) {
+        if (!options) {
+            return {};
+        }
+        const scope = {
+            context: {
+                eval: (path) => get(data, path),
+            },
+        };
+        return (await this.expressionEvaluator.evaluate(options, scope));
+    }
+    handleColumnSort(columnField) {
+        const column = this.layout().columns?.find((c) => c.field === columnField);
+        if (!column?.sortable) {
+            return;
+        }
+        const activeSorts = [...this.sortedFields()];
+        const index = activeSorts.findIndex((s) => s.name === columnField);
+        const currentDir = index >= 0 ? activeSorts[index].dir : undefined;
+        const newDir = currentDir === 'asc' ? 'desc' : currentDir === 'desc' ? undefined : 'asc';
+        const nextSorts = newDir ? [{ name: columnField, dir: newDir }] : [];
+        this.sortedFields.set(nextSorts);
+        this.applySortToDataSource(nextSorts);
+        void this.vm.saveTableSorts(nextSorts);
+        this.grid()?.refresh();
+    }
+    onColumnSizeChanged(event) {
+        if (!event.isUserInteraction || event.type !== 'end' || !event.data) {
+            return;
+        }
+        const dataField = String(event.data.dataField ?? '');
+        const field = resolveColumnFieldFromDataField(dataField);
+        const width = parseColumnResizeWidth(event.data.width);
+        if (!field || width == null) {
+            return;
+        }
+        const nextColumns = this.columns().map((col) => col.field === field ? { ...col, width } : col);
+        this.columns.set(nextColumns);
+        void this.vm.saveTableColumnWidth(field, width, nextColumns);
+    }
+    onColumnsOrderChanged(event) {
+        if (!event.isUserInteraction || !event.data?.event) {
+            return;
+        }
+        const dragEvent = event.data.event;
+        const offset = this.leadingColumnCount();
+        const previousIndex = dragEvent.previousIndex - offset;
+        const currentIndex = dragEvent.currentIndex - offset;
+        if (previousIndex < 0 || currentIndex < 0) {
+            return;
+        }
+        const nextColumns = [...this.columns()];
+        const source = nextColumns[previousIndex];
+        if (!source || source.pin) {
+            return;
+        }
+        if (nextColumns[currentIndex]?.pin) {
+            return;
+        }
+        moveItemInArray(nextColumns, previousIndex, currentIndex);
+        this.columns.set(nextColumns);
+        void this.vm.saveTableColumnOrder(nextColumns);
+    }
+    onPageChanged(event) {
+        if (event.isUserInteraction) {
+            void this.vm.saveTablePageSize(event.take);
+        }
+    }
+    //#endregion
+    //#region ----   Sort Helpers   ----
+    resolveColumnSortDirection(columnField) {
+        const dir = this.sortedFields().find((s) => s.name === columnField)?.dir;
+        return dir === 'asc' || dir === 'desc' ? dir : undefined;
+    }
+    //#endregion
+    //#region ----   Summary Helpers   ----
+    getSummaryDisplayValue(field) {
+        const summary = this.tableSummary();
+        if (!summary || !(field in summary)) {
+            return null;
+        }
+        const value = summary[field];
+        if (value == null) {
+            return null;
+        }
+        return String(value);
+    }
+    isFirstVisibleColumn(field) {
+        return this.visibleColumns()[0]?.field === field;
+    }
+    //#endregion
+    //#region ----   Helpers   ----
+    leadingColumnCount() {
+        let count = 0;
+        if (this.vm.showRowIndexColumn()) {
+            count++;
+        }
+        if (this.vm.canSelectRows()) {
+            count++;
+        }
+        return count;
+    }
+    applySortToDataSource(sorts) {
+        const sortOptions = sorts.map((s) => ({ field: s.name, dir: s.dir }));
+        this.dataSource.sort(...sortOptions);
+    }
+    convertToRowCommandItem(action) {
+        const systemAction = getSystemActions(action.type);
+        if (!systemAction) {
+            return {
+                icon: action.icon ?? 'fa-light fa-eye',
+                iconOnly: action.iconOnly ?? true,
+                text: action.title,
+                name: action.command?.name,
+                divided: action.break,
+                color: action.color,
+            };
+        }
+        const defaultAction = applySystemActionDefault(action, systemAction.key);
+        return {
+            icon: defaultAction.icon ?? 'fa-light fa-eye',
+            iconOnly: action.iconOnly ?? true,
+            text: defaultAction.title,
+            name: action.command?.name,
+            divided: defaultAction.break ?? action.break,
+            color: defaultAction.color,
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPReportTableViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXPReportTableViewComponent, isStandalone: true, selector: "axp-report-table-view", host: { classAttribute: "axp-report-table-view flex flex-col flex-1 min-h-0 h-full w-full" }, viewQueries: [{ propertyName: "grid", first: true, predicate: ["grid"], descendants: true, isSignal: true }], ngImport: i0, template: "<ax-data-table\n  #grid\n  [dataSource]=\"dataSource\"\n  [paging]=\"paginationEnabled()\"\n  [showFooter]=\"hasReportFooterSummary()\"\n  [allowReordering]=\"true\"\n  (onRowDbClick)=\"handleDbRowClick($event)\"\n  (onColumnSizeChanged)=\"onColumnSizeChanged($event)\"\n  (onColumnsOrderChanged)=\"onColumnsOrderChanged($event)\"\n  (onPageChanged)=\"onPageChanged($event)\"\n  class=\"flex-1 min-h-0 h-full\"\n>\n  @if (vm.showRowIndexColumn()) {\n    <ax-index-column\n      [caption]=\"('@general:terms.common.row-number' | translate | async)!\"\n      fixed=\"start\"\n      [width]=\"'80px'\"\n      [padZero]=\"false\"\n    ></ax-index-column>\n  }\n  @if (vm.canSelectRows()) {\n    <ax-select-column fixed=\"start\" [width]=\"'50px'\"></ax-select-column>\n  }\n  @for (column of columns(); track column.field) {\n    @if (column.visible) {\n      <ng-template #footerCell>\n        <div\n          class=\"w-full truncate\"\n          [class.text-start]=\"column.align === 'left'\"\n          [class.text-center]=\"column.align === 'center'\"\n          [class.text-end]=\"column.align === 'right'\"\n        >\n          @if (isFirstVisibleColumn(column.field) && hasReportFooterSummary()) {\n            <span class=\"font-medium\">\n              {{ '@report-management:report-viewer.components.table.footer-total' | translate | async }}\n            </span>\n          } @else if (getSummaryDisplayValue(column.field); as summaryValue) {\n            <span>{{ summaryValue }}</span>\n          }\n        </div>\n      </ng-template>\n      @if (column.isGroupByDrillLink && column.drillDisplayField) {\n        <axp-text-command-column\n          [customWidth]=\"column.width == 'auto' ? 'auto' : column.width + 'px'\"\n          [caption]=\"(column.title | translate | async)!\"\n          [textField]=\"column.drillDisplayField\"\n          [columnFixed]=\"column.pin\"\n          [sortEnabled]=\"column.sortable\"\n          [headerSortDirection]=\"resolveColumnSortDirection(column.field)\"\n          [footerTemplate]=\"footerCell\"\n          (sortToggle)=\"handleColumnSort(column.field)\"\n          (commandClick)=\"handleGroupByDrill(column.drillDisplayField, $event.data)\"\n        ></axp-text-command-column>\n      } @else {\n        <axp-widget-column-renderer\n          [customWidth]=\"column.width == 'auto' ? 'auto' : column.width + 'px'\"\n          [caption]=\"(column.title | translate | async)!\"\n          [node]=\"column.widget!\"\n          [sortEnabled]=\"column.sortable\"\n          [headerSortDirection]=\"resolveColumnSortDirection(column.field)\"\n          [columnFixed]=\"column.pin\"\n          [footerTemplate]=\"footerCell\"\n          (sortToggle)=\"handleColumnSort(column.field)\"\n        ></axp-widget-column-renderer>\n      }\n    }\n  }\n  @if (hasPrimaryRowAction()) {\n    <ax-command-column\n      fixed=\"end\"\n      [width]=\"primaryRowAction().length * 70 + 'px'\"\n      [items]=\"primaryRowAction()\"\n      (onItemClick)=\"handleRowClick($event)\"\n    ></ax-command-column>\n  }\n  @if (hasSecondaryRowAction()) {\n    <ax-dropdown-command-column\n      fixed=\"end\"\n      [width]=\"'60px'\"\n      [items]=\"secondaryRowAction()\"\n      (onItemClick)=\"handleRowClick($event)\"\n    ></ax-dropdown-command-column>\n  }\n</ax-data-table>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: AXDataTableModule }, { kind: "component", type: i1.AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "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.AXRowIndexColumnComponent, selector: "ax-index-column", inputs: ["width", "caption", "fixed", "footerTemplate", "padZero"] }, { kind: "component", type: i1.AXRowSelectColumnComponent, selector: "ax-select-column", inputs: ["width", "caption", "fixed", "advanceSelect"] }, { kind: "component", type: i1.AXRowCommandColumnComponent, selector: "ax-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "items"], outputs: ["onItemClick"] }, { kind: "component", type: i1.AXRowDropdownCommandColumnComponent, selector: "ax-dropdown-command-column", inputs: ["width", "caption", "fixed", "footerTemplate", "emptyStateTemplate", "emptyStateText", "items"], outputs: ["onItemClick"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "ngmodule", type: AXPWidgetCoreModule }, { kind: "component", type: i2$1.AXPWidgetColumnRendererComponent, selector: "axp-widget-column-renderer", inputs: ["caption", "customExpandIcon", "customCollapseIcon", "customWidth", "columnKey", "node", "footerTemplate", "expandHandler", "sortEnabled", "headerSortDirection", "headerSortPriority", "columnFixed", "cellTemplate", "headerTemplate"], outputs: ["sortToggle"] }, { kind: "component", type: AXPTextCommandColumnComponent, selector: "axp-text-command-column", inputs: ["caption", "textField", "customWidth", "columnFixed", "footerTemplate", "sortEnabled", "headerSortDirection", "headerSortPriority", "disabled", "emptyDisplay"], outputs: ["commandClick", "sortToggle"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPReportTableViewComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'axp-report-table-view', imports: [
+                        CommonModule,
+                        AXDataTableModule,
+                        AXLoadingModule,
+                        AXDecoratorModule,
+                        AXTranslationModule,
+                        AXPWidgetCoreModule,
+                        AXPTextCommandColumnComponent,
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        class: 'axp-report-table-view flex flex-col flex-1 min-h-0 h-full w-full',
+                    }, template: "<ax-data-table\n  #grid\n  [dataSource]=\"dataSource\"\n  [paging]=\"paginationEnabled()\"\n  [showFooter]=\"hasReportFooterSummary()\"\n  [allowReordering]=\"true\"\n  (onRowDbClick)=\"handleDbRowClick($event)\"\n  (onColumnSizeChanged)=\"onColumnSizeChanged($event)\"\n  (onColumnsOrderChanged)=\"onColumnsOrderChanged($event)\"\n  (onPageChanged)=\"onPageChanged($event)\"\n  class=\"flex-1 min-h-0 h-full\"\n>\n  @if (vm.showRowIndexColumn()) {\n    <ax-index-column\n      [caption]=\"('@general:terms.common.row-number' | translate | async)!\"\n      fixed=\"start\"\n      [width]=\"'80px'\"\n      [padZero]=\"false\"\n    ></ax-index-column>\n  }\n  @if (vm.canSelectRows()) {\n    <ax-select-column fixed=\"start\" [width]=\"'50px'\"></ax-select-column>\n  }\n  @for (column of columns(); track column.field) {\n    @if (column.visible) {\n      <ng-template #footerCell>\n        <div\n          class=\"w-full truncate\"\n          [class.text-start]=\"column.align === 'left'\"\n          [class.text-center]=\"column.align === 'center'\"\n          [class.text-end]=\"column.align === 'right'\"\n        >\n          @if (isFirstVisibleColumn(column.field) && hasReportFooterSummary()) {\n            <span class=\"font-medium\">\n              {{ '@report-management:report-viewer.components.table.footer-total' | translate | async }}\n            </span>\n          } @else if (getSummaryDisplayValue(column.field); as summaryValue) {\n            <span>{{ summaryValue }}</span>\n          }\n        </div>\n      </ng-template>\n      @if (column.isGroupByDrillLink && column.drillDisplayField) {\n        <axp-text-command-column\n          [customWidth]=\"column.width == 'auto' ? 'auto' : column.width + 'px'\"\n          [caption]=\"(column.title | translate | async)!\"\n          [textField]=\"column.drillDisplayField\"\n          [columnFixed]=\"column.pin\"\n          [sortEnabled]=\"column.sortable\"\n          [headerSortDirection]=\"resolveColumnSortDirection(column.field)\"\n          [footerTemplate]=\"footerCell\"\n          (sortToggle)=\"handleColumnSort(column.field)\"\n          (commandClick)=\"handleGroupByDrill(column.drillDisplayField, $event.data)\"\n        ></axp-text-command-column>\n      } @else {\n        <axp-widget-column-renderer\n          [customWidth]=\"column.width == 'auto' ? 'auto' : column.width + 'px'\"\n          [caption]=\"(column.title | translate | async)!\"\n          [node]=\"column.widget!\"\n          [sortEnabled]=\"column.sortable\"\n          [headerSortDirection]=\"resolveColumnSortDirection(column.field)\"\n          [columnFixed]=\"column.pin\"\n          [footerTemplate]=\"footerCell\"\n          (sortToggle)=\"handleColumnSort(column.field)\"\n        ></axp-widget-column-renderer>\n      }\n    }\n  }\n  @if (hasPrimaryRowAction()) {\n    <ax-command-column\n      fixed=\"end\"\n      [width]=\"primaryRowAction().length * 70 + 'px'\"\n      [items]=\"primaryRowAction()\"\n      (onItemClick)=\"handleRowClick($event)\"\n    ></ax-command-column>\n  }\n  @if (hasSecondaryRowAction()) {\n    <ax-dropdown-command-column\n      fixed=\"end\"\n      [width]=\"'60px'\"\n      [items]=\"secondaryRowAction()\"\n      (onItemClick)=\"handleRowClick($event)\"\n    ></ax-dropdown-command-column>\n  }\n</ax-data-table>\n" }]
+        }], propDecorators: { grid: [{ type: i0.ViewChild, args: ['grid', { isSignal: true }] }] } });
+
+//#region ----- Imports -----
+//#endregion
+//#region ----- Constants -----
+const STYLE_PREFIX = /^(fa-light|fa-solid|fa-regular|fa-thin|fa-duotone)\s+/;
+const REPORT_LAYOUT_TITLE_KEYS = {
+    table: '@report-management:report-viewer.layouts.table.title',
+    bar: '@report-management:report-viewer.layouts.bar-chart.title',
+    doughnut: '@report-management:report-viewer.layouts.doughnut-chart.title',
+    pie: '@report-management:report-viewer.layouts.pie-chart.title',
+    line: '@report-management:report-viewer.layouts.line-chart.title',
+    pdf: '@report-management:report-viewer.layouts.pdf.title',
+    chart: '@report-management:report-viewer.layouts.chart.title',
+};
+const DEFAULT_LAYOUT_GLYPHS = {
+    table: 'fa-table',
+    pdf: 'fa-file-pdf',
+    chart: 'fa-chart-mixed',
+};
+//#endregion
+//#region ----- Layout switcher helpers -----
+function reportLayoutTitleKey(option) {
+    if (option.type === 'table') {
+        return REPORT_LAYOUT_TITLE_KEYS.table;
+    }
+    if (option.type === 'pdf') {
+        return REPORT_LAYOUT_TITLE_KEYS.pdf;
+    }
+    const glyph = stripIconStylePrefix(option.icon);
+    if (glyph.includes('fa-chart-bar')) {
+        return REPORT_LAYOUT_TITLE_KEYS.bar;
+    }
+    if (glyph.includes('fa-chart-pie')) {
+        return REPORT_LAYOUT_TITLE_KEYS.doughnut;
+    }
+    if (glyph.includes('fa-chart-line')) {
+        return REPORT_LAYOUT_TITLE_KEYS.line;
+    }
+    return REPORT_LAYOUT_TITLE_KEYS.chart;
+}
+function reportLayoutGlyph(icon, option) {
+    const fromIcon = stripIconStylePrefix(icon);
+    if (fromIcon) {
+        return fromIcon;
+    }
+    if (option.type === 'table') {
+        return DEFAULT_LAYOUT_GLYPHS['table'];
+    }
+    if (option.type === 'pdf') {
+        return DEFAULT_LAYOUT_GLYPHS['pdf'];
+    }
+    return DEFAULT_LAYOUT_GLYPHS['chart'];
+}
+function reportLayoutPageIcon(icon, option) {
+    return `fa-light ${reportLayoutGlyph(icon, option)}`;
+}
+function isDistinctLayoutTitle(layoutTitle, reportTitle, locale) {
+    const resolvedLayout = resolveMultiLanguageString(layoutTitle, locale).trim();
+    if (!resolvedLayout) {
+        return false;
+    }
+    const resolvedReport = resolveMultiLanguageString(reportTitle, locale).trim();
+    return resolvedLayout !== resolvedReport;
+}
+function stripIconStylePrefix(icon) {
+    if (!icon?.trim()) {
+        return '';
+    }
+    return icon.trim().replace(STYLE_PREFIX, '').trim();
+}
+//#endregion
+
+export { AXPReportViewerViewModel as A, reportLayoutTitleKey as a, reportLayoutGlyph as b, AXPReportTableViewComponent as c, AXPReportChartViewComponent as d, AXPReportPdfViewComponent as e, isDistinctLayoutTitle as i, reportLayoutPageIcon as r };
+//# sourceMappingURL=acorex-platform-module-report-management-client-report-layout-switcher.util-BGhHRYfe.mjs.map