@firestitch/report 18.0.27 → 18.0.29

package/fesm2022/{firestitch-report-firestitch-report-B8LjVTvx.mjs → firestitch-report-firestitch-report-Nxl-C1w0.mjs}

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, Injectable, Component, ChangeDetectionStrategy, Input, DestroyRef, ViewChild, EventEmitter, ChangeDetectorRef, NgZone, ElementRef, Output, HostBinding, signal, CUSTOM_ELEMENTS_SCHEMA, model, input, computed, viewChild, effect, output } from '@angular/core';
+import { inject, Injectable, Component, ChangeDetectionStrategy, Input, DestroyRef, ViewChild, EventEmitter, ChangeDetectorRef, NgZone, ElementRef, Output, HostBinding, ViewChildren, signal, CUSTOM_ELEMENTS_SCHEMA, model, input, computed, viewChild, effect, output } from '@angular/core';
 import * as i1$3 from '@angular/forms';
 import { FormsModule, ControlContainer, NgForm } from '@angular/forms';
 import { MAT_DIALOG_DATA, MatDialogRef, MatDialogTitle, MatDialogContent, MatDialogActions, MatDialog, MatDialogClose } from '@angular/material/dialog';
@@ -13,8 +13,7 @@ import * as i2$3 from '@firestitch/menu';
 import { FsMenuModule } from '@firestitch/menu';
 import { FsProcess } from '@firestitch/process';
 import { FsPrompt } from '@firestitch/prompt';
-import { of, Subject, map as map$1, debounceTime, forkJoin, BehaviorSubject, from, switchMap as switchMap$1 } from 'rxjs';
-import { map, shareReplay, filter, tap, switchMap, catchError, finalize, take } from 'rxjs/operators';
+import { map, shareReplay, filter, tap, switchMap, mergeMap, toArray, catchError, finalize, takeUntil, take } from 'rxjs/operators';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { NgxEchartsDirective, provideEchartsCore } from 'ngx-echarts';
 import { FsAiChatComponent } from '@firestitch/ai';
@@ -27,7 +26,8 @@ import { FsZoomPanComponent, FsZoomPanModule } from '@firestitch/zoom-pan';
 import { FsApi, StreamEventType } from '@firestitch/api';
 import * as i1$1 from '@angular/material/menu';
 import { MatMenuModule } from '@angular/material/menu';
-import { format, startOfYear, startOfQuarter, startOfMonth, subMonths, subDays, subWeeks, startOfWeek, endOfWeek, parseISO, isValid } from 'date-fns';
+import { of, Subject, map as map$1, debounceTime, forkJoin, from, EMPTY, BehaviorSubject, switchMap as switchMap$1 } from 'rxjs';
+import { format, parseISO, startOfYear, startOfQuarter, startOfMonth, subMonths, subDays, subWeeks, startOfWeek, endOfWeek, isValid } from 'date-fns';
 import { DatePipe } from '@angular/common';
 import * as i1 from '@firestitch/list';
 import { PaginationStrategy, FsListComponent, FsListModule } from '@firestitch/list';
@@ -190,8 +190,13 @@ class ReportData {
     }
     // One component's data. The body carries everything session-scoped: the
     // resolved filter values and the component's own interaction state.
-    componentData(reportId, componentId, filters = [], state = {}, config = {}) {
-        return this._api.post(this._path(`${reportId}/components/${componentId}/data`), { filters, state }, {
+    //
+    // `isExport` marks the read as part of a PDF/PowerPoint render. The server
+    // gives those a longer per-statement ceiling than an on-screen tile, because
+    // a reader watching an export progress bar can wait for a query nobody would
+    // tolerate waiting for on a dashboard.
+    componentData(reportId, componentId, filters = [], state = {}, isExport = false, config = {}) {
+        return this._api.post(this._path(`${reportId}/components/${componentId}/data`), { filters, state, export: isExport }, {
             key: 'data',
             ...config,
         });
@@ -443,6 +448,22 @@ function dateBoundString(value) {
     // keep just the date portion.
     return value ? String(value).slice(0, 10) : undefined;
 }
+// A date-range boundary as it should READ on a cover page — the same calendar
+// day dateBoundString() hands the server, so a printed period can never name a
+// different day than the numbers under it were filtered by. Returns null when
+// there is no boundary; the caller supplies its own placeholder.
+//
+// The parse has to be parseISO, not `new Date`: `new Date('2026-05-01')` is UTC
+// midnight, so formatting it anywhere west of UTC prints Apr 30. parseISO reads
+// a bare Y-M-D as LOCAL midnight, which no offset can shift.
+function dateBoundLabel(value) {
+    const bound = dateBoundString(value);
+    if (!bound) {
+        return null;
+    }
+    const date = parseISO(bound);
+    return Number.isNaN(date.getTime()) ? String(value) : format(date, 'MMM d, yyyy');
+}
 // Maps a report filter GROUP to an fs-filter config item, and reads fs-filter
 // query values back into per-group FilterGroupValues. Shared by the report-bar
 // fs-filter and the per-component fs-filter so both render through the same
@@ -1567,11 +1588,16 @@ class ReportComponentComponent {
             this._buildFilterConfig();
         }
     }
-    // fs-filter reads its config only once at init, so the header is keyed on the
-    // set of component-level filter groups: the block is recreated (re-reading
-    // the rebuilt config) whenever that set changes.
+    // fs-filter reads its config only once at init, so the header is keyed on what
+    // it renders: the set of component-level filter groups AND the title, which
+    // lives in fs-filter's heading template. fs-filter is OnPush and the heading is
+    // rendered inside ITS view, so marking this component does not repaint the
+    // title — recreating the block does.
     get filterKey() {
-        return this.componentFilterGroups.map((group) => `${group.id}:${group.level}`).join('|');
+        return [
+            this.component.title,
+            ...this.componentFilterGroups.map((group) => `${group.id}:${group.level}`),
+        ].join('|');
     }
     get truncated() {
         return !!this.data?.truncated;
@@ -1607,6 +1633,17 @@ class ReportComponentComponent {
     settings() {
         this.openSettings.emit(this.component);
     }
+    // Presentation settings saved from the settings dialog. Title and padding are
+    // not part of the query, so the data already fetched still stands — this only
+    // repaints. The header config is rebuilt because `filterKey` changes with the
+    // title and recreates the fs-filter block around it. The chart follows its box
+    // on its own (ngx-echarts observes the host), so nothing is told to resize.
+    applySettings(settings) {
+        this.component.title = settings.title;
+        this.component.config = { ...this.component.config, padding: settings.padding };
+        this._buildFilterConfig();
+        this._cdRef.markForCheck();
+    }
     exportCsv() {
         const filters = this._filterState.resolveForComponent(this.component);
         this._process.download(`Exporting ${this.component.title ?? 'component'}`, this._reportData.exportComponent(this.reportId, this.component.id, filters));
@@ -1865,7 +1902,7 @@ class ReportComponentComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportComponentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ReportComponentComponent, isStandalone: true, selector: "app-report-component", inputs: { reportId: "reportId", component: "component", groups: "groups", editMode: "editMode", layout: "layout", zoom: "zoom", snapper: "snapper", selected: "selected" }, outputs: { selectComponent: "selectComponent", positionChanged: "positionChanged", flowReorder: "flowReorder", openSettings: "openSettings" }, host: { properties: { "class.height-auto": "this.heightAuto" } }, viewQueries: [{ propertyName: "chartComponent", first: true, predicate: ComponentChartComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n    class=\"component-box\"\n    [class.editing]=\"editMode\"\n    [class.selected]=\"selected\"\n    [style.padding]=\"bodyPadding\"\n    (pointerdown)=\"onComponentPointerDown($event)\"\n    (mousedown)=\"stopCanvasPan($event)\"\n    (touchstart)=\"stopCanvasPan($event)\">\n  <!-- The header is an fs-filter: heading template = title (and the edit-mode\n       drag handle), actions = the menu, items = component-level filters.\n       Lists carry no items here \u2014 they filter through FsList. fs-filter reads\n       its config once, so the block is keyed on the component-filter set to be\n       recreated when it changes. -->\n  @for (key of [filterKey]; track key) {\n    <fs-filter\n        class=\"component-filter\"\n        [config]=\"filterConfig\">\n      <ng-template fsFilterHeading>\n        <div\n            class=\"component-title\"\n            (pointerdown)=\"onDragStart($event)\">\n          {{ component.title }}\n          @if (truncated) {\n            <mat-icon\n                class=\"truncated-icon\"\n                matTooltip=\"Showing a truncated result \u2014 refine the filters to see everything.\">\n              warning_amber\n            </mat-icon>\n          }\n        </div>\n      </ng-template>\n    </fs-filter>\n  }\n  <!-- The actions menu is floated top-right (absolute) rather than living in\n       fs-filter's actions slot, so its ~40px button height no longer drives the\n       header row's height. It overlays the box corner; the heading reserves\n       right padding so a long title ellipsises before it. -->\n  <button\n      mat-icon-button\n      class=\"component-menu\"\n      [matMenuTriggerFor]=\"menu\"\n      (pointerdown)=\"$event.stopPropagation()\"\n      (mousedown)=\"stopCanvasPan($event)\">\n    <mat-icon>more_vert</mat-icon>\n  </button>\n  <mat-menu #menu=\"matMenu\">\n    <button mat-menu-item (click)=\"settings()\">\n      <mat-icon>tune</mat-icon>\n      <span>Settings</span>\n    </button>\n    <button mat-menu-item (click)=\"exportCsv()\">\n      <mat-icon>download</mat-icon>\n      <span>Export CSV</span>\n    </button>\n  </mat-menu>\n  <div class=\"component-body\">\n    @if (component.type === 'list') {\n      <app-report-component-list\n        [reportId]=\"reportId\"\n        [component]=\"component\"\n        [groups]=\"groups\">\n      </app-report-component-list>\n    } @else if (loading) {\n      <div class=\"component-state\">\n        <div class=\"loading-shimmer\"></div>\n      </div>\n    } @else if (error) {\n      <div class=\"component-state error\">\n        {{ error }}\n      </div>\n    } @else if (!data?.rows?.length) {\n      <div class=\"component-state\">\n        No data\n      </div>\n    } @else if (component.type === 'kpi') {\n      <app-report-component-kpi\n        [component]=\"component\"\n        [data]=\"data\">\n      </app-report-component-kpi>\n    } @else {\n      <app-report-component-chart\n        [component]=\"component\"\n        [data]=\"data\">\n      </app-report-component-chart>\n    }\n    <!-- In edit mode a transparent veil over the body makes the WHOLE\n         component draggable (industry standard: you grab the object, not just\n         its title bar) and keeps inner widgets from swallowing the gesture. -->\n    @if (editMode) {\n      <div\n        class=\"drag-veil\"\n        (pointerdown)=\"onDragStart($event)\">\n      </div>\n    }\n  </div>\n</div>\n<!-- Handles live OUTSIDE the clipped box so they straddle its edges. -->\n@if (editMode && selected) {\n  @if (layout === 'freeform') {\n    @for (handle of resizeHandles; track handle) {\n      <div\n        class=\"handle handle-{{ handle }}\"\n        (mousedown)=\"stopCanvasPan($event)\"\n        (pointerdown)=\"onResizeStart($event, handle)\">\n      </div>\n    }\n  } @else {\n    <!-- Flow height is always auto (the box fits its content), so only the\n         east handle (width %) is offered here. -->\n    <div\n      class=\"handle handle-e\"\n      matTooltip=\"Width (% of page)\"\n      (mousedown)=\"stopCanvasPan($event)\"\n      (pointerdown)=\"onResizeStart($event, 'e')\">\n    </div>\n  }\n}", styles: [":host{position:absolute;display:flex;flex-direction:column;font-size:10px;--mdc-outlined-button-container-height: 30px;--mdc-outlined-button-label-text-size: 10px;--mat-outlined-button-horizontal-padding: 15px;--mdc-text-button-container-height: 30px;--mdc-text-button-label-text-size: 10px;--mat-text-button-horizontal-padding: 15px}:host.flow-item{position:relative;left:auto;top:auto}:host.flow-dragging{z-index:40;opacity:.7;pointer-events:none}.component-box{position:relative;width:100%;flex:1 1 auto;min-height:0;box-sizing:border-box;display:flex;flex-direction:column;background:#fff;border:1px solid #e4e7eb;border-radius:6px;overflow:hidden;transition:box-shadow .12s ease,border-color .12s ease}.component-box.editing .component-title{cursor:grab}.component-box.editing .component-title:active{cursor:grabbing}.component-box.editing:hover{border-color:#9db3c8;box-shadow:0 2px 8px #0f172a14}.component-box.selected{border-color:var(--brand-primary-color);box-shadow:0 0 0 1px var(--brand-primary-color),0 4px 14px #2196f32e}:host ::ng-deep .component-filter .filter-bar-container{align-items:center!important}.component-filter{flex:0 0 auto;display:block;padding:0 0 4px}.component-filter .component-title{display:flex;align-items:center;gap:4px;-webkit-user-select:none;user-select:none;padding-right:40px;font-size:var(--report-heading-size);font-weight:600;color:#1f2933;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.component-filter .component-title .truncated-icon{font-size:16px;width:16px;height:16px;color:#f59e0b}.component-menu{position:absolute;top:2px;right:2px;z-index:30}.component-body{flex:1 1 auto;min-height:0;position:relative}:host(.height-auto) .component-state{min-height:120px}.drag-veil{position:absolute;inset:0;cursor:grab;touch-action:none}.drag-veil:active{cursor:grabbing}.component-state{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:12px;color:#7b8794;padding:8px;text-align:center}.component-state.error{color:#e15759}.loading-shimmer{width:70%;height:60%;border-radius:6px;background:linear-gradient(100deg,#f0f4f8 40%,#e4ebf2,#f0f4f8 60%);background-size:200% 100%;animation:shimmer 1.2s infinite linear}@keyframes shimmer{to{background-position-x:-200%}}.handle{position:absolute;width:14px;height:14px;display:flex;align-items:center;justify-content:center;touch-action:none;z-index:20;transform:scale(calc(1 / var(--canvas-zoom, 1)))}.handle:before{content:\"\";width:8px;height:8px;background:#fff;border:1.5px solid var(--brand-primary-color);border-radius:2px;box-shadow:0 1px 2px #0f172a33}.handle-nw{left:-7px;top:-7px;cursor:nwse-resize}.handle-n{left:calc(50% - 7px);top:-7px;cursor:ns-resize}.handle-ne{right:-7px;top:-7px;cursor:nesw-resize}.handle-e{right:-7px;top:calc(50% - 7px);cursor:ew-resize}.handle-se{right:-7px;bottom:-7px;cursor:nwse-resize}.handle-s{left:calc(50% - 7px);bottom:-7px;cursor:ns-resize}.handle-sw{left:-7px;bottom:-7px;cursor:nesw-resize}.handle-w{left:-7px;top:calc(50% - 7px);cursor:ew-resize}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: FsFilterModule }, { kind: "component", type: i2.FilterComponent, selector: "fs-filter", inputs: ["config"], outputs: ["closed", "opened", "ready"] }, { kind: "directive", type: i2.FilterHeadingDirective, selector: "[fsFilterHeading]" }, { kind: "component", type: ComponentChartComponent, selector: "app-report-component-chart", inputs: ["component", "data"] }, { kind: "component", type: ComponentKpiComponent, selector: "app-report-component-kpi", inputs: ["component", "data"] }, { kind: "component", type: ComponentListComponent, selector: "app-report-component-list", inputs: ["reportId", "component", "groups"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ReportComponentComponent, isStandalone: true, selector: "app-report-component", inputs: { reportId: "reportId", component: "component", groups: "groups", editMode: "editMode", layout: "layout", zoom: "zoom", snapper: "snapper", selected: "selected" }, outputs: { selectComponent: "selectComponent", positionChanged: "positionChanged", flowReorder: "flowReorder", openSettings: "openSettings" }, host: { properties: { "class.height-auto": "this.heightAuto" } }, viewQueries: [{ propertyName: "chartComponent", first: true, predicate: ComponentChartComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n    class=\"component-box\"\n    [class.editing]=\"editMode\"\n    [class.selected]=\"selected\"\n    [style.padding]=\"bodyPadding\"\n    (pointerdown)=\"onComponentPointerDown($event)\"\n    (mousedown)=\"stopCanvasPan($event)\"\n    (touchstart)=\"stopCanvasPan($event)\">\n  <!-- The header is an fs-filter: heading template = title (and the edit-mode\n       drag handle), actions = the menu, items = component-level filters.\n       Lists carry no items here \u2014 they filter through FsList. fs-filter reads\n       its config once, so the block is keyed on the component-filter set to be\n       recreated when it changes. -->\n  @for (key of [filterKey]; track key) {\n    <fs-filter\n        class=\"component-filter\"\n        [config]=\"filterConfig\">\n      <ng-template fsFilterHeading>\n        <div\n            class=\"component-title\"\n            (pointerdown)=\"onDragStart($event)\">\n          {{ component.title }}\n          @if (truncated) {\n            <mat-icon\n                class=\"truncated-icon\"\n                matTooltip=\"Showing a truncated result \u2014 refine the filters to see everything.\">\n              warning_amber\n            </mat-icon>\n          }\n        </div>\n      </ng-template>\n    </fs-filter>\n  }\n  <!-- The actions menu is floated top-right (absolute) rather than living in\n       fs-filter's actions slot, so its ~40px button height no longer drives the\n       header row's height. It overlays the box corner; the heading reserves\n       right padding so a long title ellipsises before it. -->\n  <button\n      mat-icon-button\n      class=\"component-menu\"\n      [matMenuTriggerFor]=\"menu\"\n      (pointerdown)=\"$event.stopPropagation()\"\n      (mousedown)=\"stopCanvasPan($event)\">\n    <mat-icon>more_vert</mat-icon>\n  </button>\n  <mat-menu #menu=\"matMenu\">\n    <button mat-menu-item (click)=\"settings()\">\n      <mat-icon>tune</mat-icon>\n      <span>Settings</span>\n    </button>\n    <button mat-menu-item (click)=\"exportCsv()\">\n      <mat-icon>download</mat-icon>\n      <span>Export CSV</span>\n    </button>\n  </mat-menu>\n  <div class=\"component-body\">\n    @if (component.type === 'list') {\n      <app-report-component-list\n        [reportId]=\"reportId\"\n        [component]=\"component\"\n        [groups]=\"groups\">\n      </app-report-component-list>\n    } @else if (loading) {\n      <div class=\"component-state\">\n        <div class=\"loading-shimmer\"></div>\n      </div>\n    } @else if (error) {\n      <div class=\"component-state error\">\n        {{ error }}\n      </div>\n    } @else if (!data?.rows?.length) {\n      <div class=\"component-state\">\n        No data\n      </div>\n    } @else if (component.type === 'kpi') {\n      <app-report-component-kpi\n        [component]=\"component\"\n        [data]=\"data\">\n      </app-report-component-kpi>\n    } @else {\n      <app-report-component-chart\n        [component]=\"component\"\n        [data]=\"data\">\n      </app-report-component-chart>\n    }\n    <!-- In edit mode a transparent veil over the body makes the WHOLE\n         component draggable (industry standard: you grab the object, not just\n         its title bar) and keeps inner widgets from swallowing the gesture. -->\n    @if (editMode) {\n      <div\n        class=\"drag-veil\"\n        (pointerdown)=\"onDragStart($event)\">\n      </div>\n    }\n  </div>\n</div>\n<!-- Handles live OUTSIDE the clipped box so they straddle its edges. -->\n@if (editMode && selected) {\n  @if (layout === 'freeform') {\n    @for (handle of resizeHandles; track handle) {\n      <div\n        class=\"handle handle-{{ handle }}\"\n        (mousedown)=\"stopCanvasPan($event)\"\n        (pointerdown)=\"onResizeStart($event, handle)\">\n      </div>\n    }\n  } @else {\n    <!-- Flow height is always auto (the box fits its content), so only the\n         east handle (width %) is offered here. -->\n    <div\n      class=\"handle handle-e\"\n      matTooltip=\"Width (% of page)\"\n      (mousedown)=\"stopCanvasPan($event)\"\n      (pointerdown)=\"onResizeStart($event, 'e')\">\n    </div>\n  }\n}", styles: [":host{position:absolute;display:flex;flex-direction:column;font-size:10px;--mdc-outlined-button-container-height: 30px;--mdc-outlined-button-label-text-size: 10px;--mat-outlined-button-horizontal-padding: 15px;--mdc-text-button-container-height: 30px;--mdc-text-button-label-text-size: 10px;--mat-text-button-horizontal-padding: 15px}:host.flow-item{position:relative;left:auto;top:auto}:host.flow-dragging{z-index:40;opacity:.7;pointer-events:none}.component-box{position:relative;width:100%;flex:1 1 auto;min-height:0;box-sizing:border-box;display:flex;flex-direction:column;background:#fff;border:1px solid #e4e7eb;border-radius:6px;overflow:hidden;transition:box-shadow .12s ease,border-color .12s ease;cursor:default}.component-box.editing .component-title{cursor:grab}.component-box.editing .component-title:active{cursor:grabbing}.component-box.editing:hover{border-color:#9db3c8;box-shadow:0 2px 8px #0f172a14}.component-box.selected{border-color:var(--brand-primary-color);box-shadow:0 0 0 1px var(--brand-primary-color),0 4px 14px #2196f32e}:host ::ng-deep .component-filter .filter-bar-container{align-items:center!important}.component-filter{flex:0 0 auto;display:block;padding:0 0 4px}.component-filter .component-title{display:flex;align-items:center;gap:4px;-webkit-user-select:none;user-select:none;padding-right:40px;font-size:var(--report-heading-size);font-weight:600;color:#1f2933;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.component-filter .component-title .truncated-icon{font-size:16px;width:16px;height:16px;color:#f59e0b}.component-menu{position:absolute;top:2px;right:2px;z-index:30}.component-body{flex:1 1 auto;min-height:0;position:relative}:host(.height-auto) .component-state{min-height:120px}.drag-veil{position:absolute;inset:0;cursor:grab;touch-action:none}.drag-veil:active{cursor:grabbing}.component-state{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:12px;color:#7b8794;padding:8px;text-align:center}.component-state.error{color:#e15759}.loading-shimmer{width:70%;height:60%;border-radius:6px;background:linear-gradient(100deg,#f0f4f8 40%,#e4ebf2,#f0f4f8 60%);background-size:200% 100%;animation:shimmer 1.2s infinite linear}@keyframes shimmer{to{background-position-x:-200%}}.handle{position:absolute;width:14px;height:14px;display:flex;align-items:center;justify-content:center;touch-action:none;z-index:20;transform:scale(calc(1 / var(--canvas-zoom, 1)))}.handle:before{content:\"\";width:8px;height:8px;background:#fff;border:1.5px solid var(--brand-primary-color);border-radius:2px;box-shadow:0 1px 2px #0f172a33}.handle-nw{left:-7px;top:-7px;cursor:nwse-resize}.handle-n{left:calc(50% - 7px);top:-7px;cursor:ns-resize}.handle-ne{right:-7px;top:-7px;cursor:nesw-resize}.handle-e{right:-7px;top:calc(50% - 7px);cursor:ew-resize}.handle-se{right:-7px;bottom:-7px;cursor:nwse-resize}.handle-s{left:calc(50% - 7px);bottom:-7px;cursor:ns-resize}.handle-sw{left:-7px;bottom:-7px;cursor:nesw-resize}.handle-w{left:-7px;top:calc(50% - 7px);cursor:ew-resize}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: FsFilterModule }, { kind: "component", type: i2.FilterComponent, selector: "fs-filter", inputs: ["config"], outputs: ["closed", "opened", "ready"] }, { kind: "directive", type: i2.FilterHeadingDirective, selector: "[fsFilterHeading]" }, { kind: "component", type: ComponentChartComponent, selector: "app-report-component-chart", inputs: ["component", "data"] }, { kind: "component", type: ComponentKpiComponent, selector: "app-report-component-kpi", inputs: ["component", "data"] }, { kind: "component", type: ComponentListComponent, selector: "app-report-component-list", inputs: ["reportId", "component", "groups"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportComponentComponent, decorators: [{
             type: Component,
@@ -1878,7 +1915,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         ComponentChartComponent,
                         ComponentKpiComponent,
                         ComponentListComponent,
-                    ], template: "<div\n    class=\"component-box\"\n    [class.editing]=\"editMode\"\n    [class.selected]=\"selected\"\n    [style.padding]=\"bodyPadding\"\n    (pointerdown)=\"onComponentPointerDown($event)\"\n    (mousedown)=\"stopCanvasPan($event)\"\n    (touchstart)=\"stopCanvasPan($event)\">\n  <!-- The header is an fs-filter: heading template = title (and the edit-mode\n       drag handle), actions = the menu, items = component-level filters.\n       Lists carry no items here \u2014 they filter through FsList. fs-filter reads\n       its config once, so the block is keyed on the component-filter set to be\n       recreated when it changes. -->\n  @for (key of [filterKey]; track key) {\n    <fs-filter\n        class=\"component-filter\"\n        [config]=\"filterConfig\">\n      <ng-template fsFilterHeading>\n        <div\n            class=\"component-title\"\n            (pointerdown)=\"onDragStart($event)\">\n          {{ component.title }}\n          @if (truncated) {\n            <mat-icon\n                class=\"truncated-icon\"\n                matTooltip=\"Showing a truncated result \u2014 refine the filters to see everything.\">\n              warning_amber\n            </mat-icon>\n          }\n        </div>\n      </ng-template>\n    </fs-filter>\n  }\n  <!-- The actions menu is floated top-right (absolute) rather than living in\n       fs-filter's actions slot, so its ~40px button height no longer drives the\n       header row's height. It overlays the box corner; the heading reserves\n       right padding so a long title ellipsises before it. -->\n  <button\n      mat-icon-button\n      class=\"component-menu\"\n      [matMenuTriggerFor]=\"menu\"\n      (pointerdown)=\"$event.stopPropagation()\"\n      (mousedown)=\"stopCanvasPan($event)\">\n    <mat-icon>more_vert</mat-icon>\n  </button>\n  <mat-menu #menu=\"matMenu\">\n    <button mat-menu-item (click)=\"settings()\">\n      <mat-icon>tune</mat-icon>\n      <span>Settings</span>\n    </button>\n    <button mat-menu-item (click)=\"exportCsv()\">\n      <mat-icon>download</mat-icon>\n      <span>Export CSV</span>\n    </button>\n  </mat-menu>\n  <div class=\"component-body\">\n    @if (component.type === 'list') {\n      <app-report-component-list\n        [reportId]=\"reportId\"\n        [component]=\"component\"\n        [groups]=\"groups\">\n      </app-report-component-list>\n    } @else if (loading) {\n      <div class=\"component-state\">\n        <div class=\"loading-shimmer\"></div>\n      </div>\n    } @else if (error) {\n      <div class=\"component-state error\">\n        {{ error }}\n      </div>\n    } @else if (!data?.rows?.length) {\n      <div class=\"component-state\">\n        No data\n      </div>\n    } @else if (component.type === 'kpi') {\n      <app-report-component-kpi\n        [component]=\"component\"\n        [data]=\"data\">\n      </app-report-component-kpi>\n    } @else {\n      <app-report-component-chart\n        [component]=\"component\"\n        [data]=\"data\">\n      </app-report-component-chart>\n    }\n    <!-- In edit mode a transparent veil over the body makes the WHOLE\n         component draggable (industry standard: you grab the object, not just\n         its title bar) and keeps inner widgets from swallowing the gesture. -->\n    @if (editMode) {\n      <div\n        class=\"drag-veil\"\n        (pointerdown)=\"onDragStart($event)\">\n      </div>\n    }\n  </div>\n</div>\n<!-- Handles live OUTSIDE the clipped box so they straddle its edges. -->\n@if (editMode && selected) {\n  @if (layout === 'freeform') {\n    @for (handle of resizeHandles; track handle) {\n      <div\n        class=\"handle handle-{{ handle }}\"\n        (mousedown)=\"stopCanvasPan($event)\"\n        (pointerdown)=\"onResizeStart($event, handle)\">\n      </div>\n    }\n  } @else {\n    <!-- Flow height is always auto (the box fits its content), so only the\n         east handle (width %) is offered here. -->\n    <div\n      class=\"handle handle-e\"\n      matTooltip=\"Width (% of page)\"\n      (mousedown)=\"stopCanvasPan($event)\"\n      (pointerdown)=\"onResizeStart($event, 'e')\">\n    </div>\n  }\n}", styles: [":host{position:absolute;display:flex;flex-direction:column;font-size:10px;--mdc-outlined-button-container-height: 30px;--mdc-outlined-button-label-text-size: 10px;--mat-outlined-button-horizontal-padding: 15px;--mdc-text-button-container-height: 30px;--mdc-text-button-label-text-size: 10px;--mat-text-button-horizontal-padding: 15px}:host.flow-item{position:relative;left:auto;top:auto}:host.flow-dragging{z-index:40;opacity:.7;pointer-events:none}.component-box{position:relative;width:100%;flex:1 1 auto;min-height:0;box-sizing:border-box;display:flex;flex-direction:column;background:#fff;border:1px solid #e4e7eb;border-radius:6px;overflow:hidden;transition:box-shadow .12s ease,border-color .12s ease}.component-box.editing .component-title{cursor:grab}.component-box.editing .component-title:active{cursor:grabbing}.component-box.editing:hover{border-color:#9db3c8;box-shadow:0 2px 8px #0f172a14}.component-box.selected{border-color:var(--brand-primary-color);box-shadow:0 0 0 1px var(--brand-primary-color),0 4px 14px #2196f32e}:host ::ng-deep .component-filter .filter-bar-container{align-items:center!important}.component-filter{flex:0 0 auto;display:block;padding:0 0 4px}.component-filter .component-title{display:flex;align-items:center;gap:4px;-webkit-user-select:none;user-select:none;padding-right:40px;font-size:var(--report-heading-size);font-weight:600;color:#1f2933;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.component-filter .component-title .truncated-icon{font-size:16px;width:16px;height:16px;color:#f59e0b}.component-menu{position:absolute;top:2px;right:2px;z-index:30}.component-body{flex:1 1 auto;min-height:0;position:relative}:host(.height-auto) .component-state{min-height:120px}.drag-veil{position:absolute;inset:0;cursor:grab;touch-action:none}.drag-veil:active{cursor:grabbing}.component-state{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:12px;color:#7b8794;padding:8px;text-align:center}.component-state.error{color:#e15759}.loading-shimmer{width:70%;height:60%;border-radius:6px;background:linear-gradient(100deg,#f0f4f8 40%,#e4ebf2,#f0f4f8 60%);background-size:200% 100%;animation:shimmer 1.2s infinite linear}@keyframes shimmer{to{background-position-x:-200%}}.handle{position:absolute;width:14px;height:14px;display:flex;align-items:center;justify-content:center;touch-action:none;z-index:20;transform:scale(calc(1 / var(--canvas-zoom, 1)))}.handle:before{content:\"\";width:8px;height:8px;background:#fff;border:1.5px solid var(--brand-primary-color);border-radius:2px;box-shadow:0 1px 2px #0f172a33}.handle-nw{left:-7px;top:-7px;cursor:nwse-resize}.handle-n{left:calc(50% - 7px);top:-7px;cursor:ns-resize}.handle-ne{right:-7px;top:-7px;cursor:nesw-resize}.handle-e{right:-7px;top:calc(50% - 7px);cursor:ew-resize}.handle-se{right:-7px;bottom:-7px;cursor:nwse-resize}.handle-s{left:calc(50% - 7px);bottom:-7px;cursor:ns-resize}.handle-sw{left:-7px;bottom:-7px;cursor:nesw-resize}.handle-w{left:-7px;top:calc(50% - 7px);cursor:ew-resize}\n"] }]
+                    ], template: "<div\n    class=\"component-box\"\n    [class.editing]=\"editMode\"\n    [class.selected]=\"selected\"\n    [style.padding]=\"bodyPadding\"\n    (pointerdown)=\"onComponentPointerDown($event)\"\n    (mousedown)=\"stopCanvasPan($event)\"\n    (touchstart)=\"stopCanvasPan($event)\">\n  <!-- The header is an fs-filter: heading template = title (and the edit-mode\n       drag handle), actions = the menu, items = component-level filters.\n       Lists carry no items here \u2014 they filter through FsList. fs-filter reads\n       its config once, so the block is keyed on the component-filter set to be\n       recreated when it changes. -->\n  @for (key of [filterKey]; track key) {\n    <fs-filter\n        class=\"component-filter\"\n        [config]=\"filterConfig\">\n      <ng-template fsFilterHeading>\n        <div\n            class=\"component-title\"\n            (pointerdown)=\"onDragStart($event)\">\n          {{ component.title }}\n          @if (truncated) {\n            <mat-icon\n                class=\"truncated-icon\"\n                matTooltip=\"Showing a truncated result \u2014 refine the filters to see everything.\">\n              warning_amber\n            </mat-icon>\n          }\n        </div>\n      </ng-template>\n    </fs-filter>\n  }\n  <!-- The actions menu is floated top-right (absolute) rather than living in\n       fs-filter's actions slot, so its ~40px button height no longer drives the\n       header row's height. It overlays the box corner; the heading reserves\n       right padding so a long title ellipsises before it. -->\n  <button\n      mat-icon-button\n      class=\"component-menu\"\n      [matMenuTriggerFor]=\"menu\"\n      (pointerdown)=\"$event.stopPropagation()\"\n      (mousedown)=\"stopCanvasPan($event)\">\n    <mat-icon>more_vert</mat-icon>\n  </button>\n  <mat-menu #menu=\"matMenu\">\n    <button mat-menu-item (click)=\"settings()\">\n      <mat-icon>tune</mat-icon>\n      <span>Settings</span>\n    </button>\n    <button mat-menu-item (click)=\"exportCsv()\">\n      <mat-icon>download</mat-icon>\n      <span>Export CSV</span>\n    </button>\n  </mat-menu>\n  <div class=\"component-body\">\n    @if (component.type === 'list') {\n      <app-report-component-list\n        [reportId]=\"reportId\"\n        [component]=\"component\"\n        [groups]=\"groups\">\n      </app-report-component-list>\n    } @else if (loading) {\n      <div class=\"component-state\">\n        <div class=\"loading-shimmer\"></div>\n      </div>\n    } @else if (error) {\n      <div class=\"component-state error\">\n        {{ error }}\n      </div>\n    } @else if (!data?.rows?.length) {\n      <div class=\"component-state\">\n        No data\n      </div>\n    } @else if (component.type === 'kpi') {\n      <app-report-component-kpi\n        [component]=\"component\"\n        [data]=\"data\">\n      </app-report-component-kpi>\n    } @else {\n      <app-report-component-chart\n        [component]=\"component\"\n        [data]=\"data\">\n      </app-report-component-chart>\n    }\n    <!-- In edit mode a transparent veil over the body makes the WHOLE\n         component draggable (industry standard: you grab the object, not just\n         its title bar) and keeps inner widgets from swallowing the gesture. -->\n    @if (editMode) {\n      <div\n        class=\"drag-veil\"\n        (pointerdown)=\"onDragStart($event)\">\n      </div>\n    }\n  </div>\n</div>\n<!-- Handles live OUTSIDE the clipped box so they straddle its edges. -->\n@if (editMode && selected) {\n  @if (layout === 'freeform') {\n    @for (handle of resizeHandles; track handle) {\n      <div\n        class=\"handle handle-{{ handle }}\"\n        (mousedown)=\"stopCanvasPan($event)\"\n        (pointerdown)=\"onResizeStart($event, handle)\">\n      </div>\n    }\n  } @else {\n    <!-- Flow height is always auto (the box fits its content), so only the\n         east handle (width %) is offered here. -->\n    <div\n      class=\"handle handle-e\"\n      matTooltip=\"Width (% of page)\"\n      (mousedown)=\"stopCanvasPan($event)\"\n      (pointerdown)=\"onResizeStart($event, 'e')\">\n    </div>\n  }\n}", styles: [":host{position:absolute;display:flex;flex-direction:column;font-size:10px;--mdc-outlined-button-container-height: 30px;--mdc-outlined-button-label-text-size: 10px;--mat-outlined-button-horizontal-padding: 15px;--mdc-text-button-container-height: 30px;--mdc-text-button-label-text-size: 10px;--mat-text-button-horizontal-padding: 15px}:host.flow-item{position:relative;left:auto;top:auto}:host.flow-dragging{z-index:40;opacity:.7;pointer-events:none}.component-box{position:relative;width:100%;flex:1 1 auto;min-height:0;box-sizing:border-box;display:flex;flex-direction:column;background:#fff;border:1px solid #e4e7eb;border-radius:6px;overflow:hidden;transition:box-shadow .12s ease,border-color .12s ease;cursor:default}.component-box.editing .component-title{cursor:grab}.component-box.editing .component-title:active{cursor:grabbing}.component-box.editing:hover{border-color:#9db3c8;box-shadow:0 2px 8px #0f172a14}.component-box.selected{border-color:var(--brand-primary-color);box-shadow:0 0 0 1px var(--brand-primary-color),0 4px 14px #2196f32e}:host ::ng-deep .component-filter .filter-bar-container{align-items:center!important}.component-filter{flex:0 0 auto;display:block;padding:0 0 4px}.component-filter .component-title{display:flex;align-items:center;gap:4px;-webkit-user-select:none;user-select:none;padding-right:40px;font-size:var(--report-heading-size);font-weight:600;color:#1f2933;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.component-filter .component-title .truncated-icon{font-size:16px;width:16px;height:16px;color:#f59e0b}.component-menu{position:absolute;top:2px;right:2px;z-index:30}.component-body{flex:1 1 auto;min-height:0;position:relative}:host(.height-auto) .component-state{min-height:120px}.drag-veil{position:absolute;inset:0;cursor:grab;touch-action:none}.drag-veil:active{cursor:grabbing}.component-state{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:12px;color:#7b8794;padding:8px;text-align:center}.component-state.error{color:#e15759}.loading-shimmer{width:70%;height:60%;border-radius:6px;background:linear-gradient(100deg,#f0f4f8 40%,#e4ebf2,#f0f4f8 60%);background-size:200% 100%;animation:shimmer 1.2s infinite linear}@keyframes shimmer{to{background-position-x:-200%}}.handle{position:absolute;width:14px;height:14px;display:flex;align-items:center;justify-content:center;touch-action:none;z-index:20;transform:scale(calc(1 / var(--canvas-zoom, 1)))}.handle:before{content:\"\";width:8px;height:8px;background:#fff;border:1.5px solid var(--brand-primary-color);border-radius:2px;box-shadow:0 1px 2px #0f172a33}.handle-nw{left:-7px;top:-7px;cursor:nwse-resize}.handle-n{left:calc(50% - 7px);top:-7px;cursor:ns-resize}.handle-ne{right:-7px;top:-7px;cursor:nesw-resize}.handle-e{right:-7px;top:calc(50% - 7px);cursor:ew-resize}.handle-se{right:-7px;bottom:-7px;cursor:nwse-resize}.handle-s{left:calc(50% - 7px);bottom:-7px;cursor:ns-resize}.handle-sw{left:-7px;bottom:-7px;cursor:nesw-resize}.handle-w{left:-7px;top:calc(50% - 7px);cursor:ew-resize}\n"] }]
         }], propDecorators: { reportId: [{
                 type: Input
             }], component: [{
@@ -1936,6 +1973,9 @@ class ReportCanvasComponent {
     // editMode flag, so it flips it off (mirrors the menu's "Done editing layout").
     editDone = new EventEmitter();
     zoomPan;
+    // The rendered components of the active page — only the canvas can reach the
+    // one instance a settings save applies to.
+    _renderedComponents;
     _viewport;
     _guides;
     PX = PX_PER_INCH;
@@ -2006,6 +2046,14 @@ class ReportCanvasComponent {
     pageLabel(page, index) {
         return page.name || `Page ${index + 1}`;
     }
+    // Hand presentation settings (title, padding) saved in the settings dialog to
+    // the one component they belong to. Nothing here feeds the query, so that
+    // component repaints and every other one on the page is left alone.
+    applyComponentSettings(componentId, settings) {
+        this._renderedComponents
+            .find((rendered) => rendered.component.id === componentId)
+            ?.applySettings(settings);
+    }
     selectComponent(componentId) {
         this.selectedComponentId = componentId;
         this._cdRef.markForCheck();
@@ -2215,7 +2263,7 @@ class ReportCanvasComponent {
         this._guides?.nativeElement?.replaceChildren();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportCanvasComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ReportCanvasComponent, isStandalone: true, selector: "app-report-canvas", inputs: { report: "report", editMode: "editMode" }, outputs: { componentSettings: "componentSettings", reportChanged: "reportChanged", editDone: "editDone" }, viewQueries: [{ propertyName: "zoomPan", first: true, predicate: FsZoomPanComponent, descendants: true }, { propertyName: "_viewport", first: true, predicate: ["viewport"], descendants: true, static: true }, { propertyName: "_guides", first: true, predicate: ["guides"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"canvas\">\n  <div\n    #viewport\n    class=\"page-viewport\"\n    (pointerdown)=\"onCanvasPointerDown()\">\n    <fs-zoom-pan\n      [zoomMin]=\"0.1\"\n      [zoomMax]=\"3\"\n      (zoomed)=\"onZoomed($event)\">\n      @if (activePage; as page) {\n        <div\n          class=\"page\"\n          [class.flow]=\"isFlow\"\n          [class.editing]=\"editMode\"\n          [style.width.px]=\"report.pageWidth * PX\"\n          [style.height.px]=\"report.pageHeight * PX\"\n          [style.padding.px]=\"isFlow ? flowPadding * PX : 0\"\n          [style.--canvas-zoom]=\"zoom\"\n          [style.--report-heading-size.px]=\"headingSizePx\">\n          @if (isFlow) {\n            @for (component of flowComponents; track component.id) {\n              <app-report-component\n                class=\"flow-item\"\n                [reportId]=\"report.id\"\n                [component]=\"component\"\n                [groups]=\"groups\"\n                [editMode]=\"editMode\"\n                [layout]=\"'flow'\"\n                [zoom]=\"zoom\"\n                [snapper]=\"snapper\"\n                [selected]=\"component.id === selectedComponentId\"\n                [style.width.%]=\"component.flowWidth\"\n                [style.height.px]=\"component.autoHeight ? null : component.h * PX\"\n                (selectComponent)=\"selectComponent($event)\"\n                (positionChanged)=\"onPositionChanged($event)\"\n                (flowReorder)=\"onFlowReorder($event)\"\n                (openSettings)=\"componentSettings.emit($event)\">\n              </app-report-component>\n            }\n          } @else {\n            @for (component of page.components; track component.id) {\n              <app-report-component\n                [reportId]=\"report.id\"\n                [component]=\"component\"\n                [groups]=\"groups\"\n                [editMode]=\"editMode\"\n                [layout]=\"'freeform'\"\n                [zoom]=\"zoom\"\n                [snapper]=\"snapper\"\n                [selected]=\"component.id === selectedComponentId\"\n                [style.left.px]=\"component.x * PX\"\n                [style.top.px]=\"component.y * PX\"\n                [style.width.px]=\"component.w * PX\"\n                [style.height.px]=\"component.autoHeight ? null : component.h * PX\"\n                (selectComponent)=\"selectComponent($event)\"\n                (positionChanged)=\"onPositionChanged($event)\"\n                (openSettings)=\"componentSettings.emit($event)\">\n              </app-report-component>\n            }\n          }\n\n          <div\n            #guides\n            class=\"guides\">\n          </div>\n\n          @if (!page.components.length) {\n            <div class=\"page-empty\">\n              Ask the assistant to add a chart, list or KPI to this page.\n            </div>\n          }\n        </div>\n      }\n    </fs-zoom-pan>\n\n    @if (editMode) {\n      <button\n        mat-flat-button\n        type=\"button\"\n        color=\"primary\"\n        class=\"edit-done\"\n        matTooltip=\"Exit layout editing\"\n        (click)=\"editDone.emit()\">\n        <mat-icon>check</mat-icon>\n        Done editing\n      </button>\n    }\n  </div>\n\n  <div class=\"canvas-toolbar\">\n    <div class=\"page-tabs\">\n      @if ((report?.pages?.length ?? 0) > 1) {\n        @for (page of report.pages; track page.id; let index = $index) {\n          <button\n            type=\"button\"\n            class=\"page-tab\"\n            [class.active]=\"index === activePageIndex\"\n            (click)=\"selectPage(index)\">\n            {{ pageLabel(page, index) }}\n          </button>\n        }\n      }\n      <button\n        type=\"button\"\n        class=\"page-tab add-page\"\n        matTooltip=\"Add page\"\n        (click)=\"addPage()\">\n        <mat-icon>add</mat-icon>\n        Page\n      </button>\n    </div>\n\n    <div class=\"zoom-controls\">\n      <button\n        type=\"button\"\n        class=\"zoom-button\"\n        matTooltip=\"Zoom out\"\n        (click)=\"zoomOut()\">\n        <mat-icon>remove</mat-icon>\n      </button>\n      <button\n        type=\"button\"\n        class=\"zoom-label\"\n        matTooltip=\"Zoom to 100%\"\n        (click)=\"zoomActual()\">\n        {{ (zoom * 100).toFixed(0) }}%\n      </button>\n      <button\n        type=\"button\"\n        class=\"zoom-button\"\n        matTooltip=\"Zoom in\"\n        (click)=\"zoomIn()\">\n        <mat-icon>add</mat-icon>\n      </button>\n      <button\n        type=\"button\"\n        class=\"zoom-button\"\n        matTooltip=\"Fit page\"\n        (click)=\"zoomFit()\">\n        <mat-icon>fit_screen</mat-icon>\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column;min-width:0;min-height:0;flex:1;margin-top:10px}.canvas{display:flex;flex-direction:column;gap:8px;flex:1;min-height:0}.canvas-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px}.canvas-toolbar .page-tabs{display:flex;gap:4px;flex-wrap:wrap}.canvas-toolbar .page-tabs .page-tab{border:1px solid #e4e7eb;border-radius:16px;background:#fff;padding:4px 14px;font-size:12px;color:#52606d;cursor:pointer}.canvas-toolbar .page-tabs .page-tab.active{background:var(--brand-primary-color, #3b82f6);border-color:var(--brand-primary-color, #3b82f6);color:#fff}.canvas-toolbar .page-tabs .page-tab.add-page{display:inline-flex;align-items:center;gap:2px;padding-left:8px;border-style:dashed;color:#52606d}.canvas-toolbar .page-tabs .page-tab.add-page mat-icon{font-size:16px;width:16px;height:16px}.canvas-toolbar .zoom-controls{display:flex;align-items:center;gap:2px;margin-left:auto;border:1px solid #e4e7eb;border-radius:18px;background:#fff;padding:2px 6px}.canvas-toolbar .zoom-controls .zoom-button{display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:transparent;color:#52606d;cursor:pointer}.canvas-toolbar .zoom-controls .zoom-button:hover{background:#f0f4f8}.canvas-toolbar .zoom-controls .zoom-button mat-icon{font-size:18px;width:18px;height:18px}.canvas-toolbar .zoom-controls .zoom-label{border:none;background:transparent;font-size:12px;color:#52606d;min-width:44px;cursor:pointer}.canvas-toolbar .zoom-controls .zoom-label:hover{color:#1f2933}.page-viewport{position:relative;flex:1;min-height:420px;border:1px solid #e4e7eb;border-radius:8px;background:#eef1f5;overflow:hidden}.page-viewport fs-zoom-pan{width:100%;height:100%}.edit-done{position:absolute;top:12px;right:12px;z-index:40;border-radius:999px;box-shadow:0 2px 10px #0f172a2e}.page{position:relative;background:#fff;border-radius:2px;box-shadow:0 2px 12px #0f172a1f,0 0 0 1px #0f172a0a;box-sizing:border-box}.page.flow{display:flex;flex-wrap:wrap;align-content:flex-start;align-items:flex-start}.page.editing{background-image:radial-gradient(circle,#d8dee6 1px,transparent 1px);background-size:24px 24px}.guides{position:absolute;inset:0;pointer-events:none;z-index:30}.guides ::ng-deep .guide{position:absolute;background:#2196f3}.guides ::ng-deep .guide.guide-v{top:0;bottom:0;width:calc(1.25px / var(--canvas-zoom, 1))}.guides ::ng-deep .guide.guide-h{left:0;right:0;height:calc(1.25px / var(--canvas-zoom, 1))}.page-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#9aa5b1;font-size:14px;pointer-events:none}\n"], dependencies: [{ kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: FsZoomPanModule }, { kind: "component", type: i1$2.FsZoomPanComponent, selector: "fs-zoom-pan", inputs: ["zoomMax", "zoomMin", "zoomScale", "zoomDefault", "zoomFactor", "top", "left"], outputs: ["moved", "zoomed"] }, { kind: "component", type: ReportComponentComponent, selector: "app-report-component", inputs: ["reportId", "component", "groups", "editMode", "layout", "zoom", "snapper", "selected"], outputs: ["selectComponent", "positionChanged", "flowReorder", "openSettings"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ReportCanvasComponent, isStandalone: true, selector: "app-report-canvas", inputs: { report: "report", editMode: "editMode" }, outputs: { componentSettings: "componentSettings", reportChanged: "reportChanged", editDone: "editDone" }, viewQueries: [{ propertyName: "zoomPan", first: true, predicate: FsZoomPanComponent, descendants: true }, { propertyName: "_viewport", first: true, predicate: ["viewport"], descendants: true, static: true }, { propertyName: "_guides", first: true, predicate: ["guides"], descendants: true }, { propertyName: "_renderedComponents", predicate: ReportComponentComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"canvas\">\n  <div\n    #viewport\n    class=\"page-viewport\"\n    (pointerdown)=\"onCanvasPointerDown()\">\n    <fs-zoom-pan\n      [zoomMin]=\"0.1\"\n      [zoomMax]=\"3\"\n      (zoomed)=\"onZoomed($event)\">\n      @if (activePage; as page) {\n        <div\n          class=\"page\"\n          [class.flow]=\"isFlow\"\n          [class.editing]=\"editMode\"\n          [style.width.px]=\"report.pageWidth * PX\"\n          [style.height.px]=\"report.pageHeight * PX\"\n          [style.padding.px]=\"isFlow ? flowPadding * PX : 0\"\n          [style.--canvas-zoom]=\"zoom\"\n          [style.--report-heading-size.px]=\"headingSizePx\">\n          @if (isFlow) {\n            @for (component of flowComponents; track component.id) {\n              <app-report-component\n                class=\"flow-item\"\n                [reportId]=\"report.id\"\n                [component]=\"component\"\n                [groups]=\"groups\"\n                [editMode]=\"editMode\"\n                [layout]=\"'flow'\"\n                [zoom]=\"zoom\"\n                [snapper]=\"snapper\"\n                [selected]=\"component.id === selectedComponentId\"\n                [style.width.%]=\"component.flowWidth\"\n                [style.height.px]=\"component.autoHeight ? null : component.h * PX\"\n                (selectComponent)=\"selectComponent($event)\"\n                (positionChanged)=\"onPositionChanged($event)\"\n                (flowReorder)=\"onFlowReorder($event)\"\n                (openSettings)=\"componentSettings.emit($event)\">\n              </app-report-component>\n            }\n          } @else {\n            @for (component of page.components; track component.id) {\n              <app-report-component\n                [reportId]=\"report.id\"\n                [component]=\"component\"\n                [groups]=\"groups\"\n                [editMode]=\"editMode\"\n                [layout]=\"'freeform'\"\n                [zoom]=\"zoom\"\n                [snapper]=\"snapper\"\n                [selected]=\"component.id === selectedComponentId\"\n                [style.left.px]=\"component.x * PX\"\n                [style.top.px]=\"component.y * PX\"\n                [style.width.px]=\"component.w * PX\"\n                [style.height.px]=\"component.autoHeight ? null : component.h * PX\"\n                (selectComponent)=\"selectComponent($event)\"\n                (positionChanged)=\"onPositionChanged($event)\"\n                (openSettings)=\"componentSettings.emit($event)\">\n              </app-report-component>\n            }\n          }\n\n          <div\n            #guides\n            class=\"guides\">\n          </div>\n\n          @if (!page.components.length) {\n            <div class=\"page-empty\">\n              Ask the assistant to add a chart, list or KPI to this page.\n            </div>\n          }\n        </div>\n      }\n    </fs-zoom-pan>\n\n    @if (editMode) {\n      <button\n        mat-flat-button\n        type=\"button\"\n        color=\"primary\"\n        class=\"edit-done\"\n        matTooltip=\"Exit layout editing\"\n        (click)=\"editDone.emit()\">\n        <mat-icon>check</mat-icon>\n        Done editing\n      </button>\n    }\n  </div>\n\n  <div class=\"canvas-toolbar\">\n    <div class=\"page-tabs\">\n      @if ((report?.pages?.length ?? 0) > 1) {\n        @for (page of report.pages; track page.id; let index = $index) {\n          <button\n            type=\"button\"\n            class=\"page-tab\"\n            [class.active]=\"index === activePageIndex\"\n            (click)=\"selectPage(index)\">\n            {{ pageLabel(page, index) }}\n          </button>\n        }\n      }\n      <button\n        type=\"button\"\n        class=\"page-tab add-page\"\n        matTooltip=\"Add page\"\n        (click)=\"addPage()\">\n        <mat-icon>add</mat-icon>\n        Page\n      </button>\n    </div>\n\n    <div class=\"zoom-controls\">\n      <button\n        type=\"button\"\n        class=\"zoom-button\"\n        matTooltip=\"Zoom out\"\n        (click)=\"zoomOut()\">\n        <mat-icon>remove</mat-icon>\n      </button>\n      <button\n        type=\"button\"\n        class=\"zoom-label\"\n        matTooltip=\"Zoom to 100%\"\n        (click)=\"zoomActual()\">\n        {{ (zoom * 100).toFixed(0) }}%\n      </button>\n      <button\n        type=\"button\"\n        class=\"zoom-button\"\n        matTooltip=\"Zoom in\"\n        (click)=\"zoomIn()\">\n        <mat-icon>add</mat-icon>\n      </button>\n      <button\n        type=\"button\"\n        class=\"zoom-button\"\n        matTooltip=\"Fit page\"\n        (click)=\"zoomFit()\">\n        <mat-icon>fit_screen</mat-icon>\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column;min-width:0;min-height:0;flex:1;margin-top:10px}.canvas{display:flex;flex-direction:column;gap:8px;flex:1;min-height:0}.canvas-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px}.canvas-toolbar .page-tabs{display:flex;gap:4px;flex-wrap:wrap}.canvas-toolbar .page-tabs .page-tab{border:1px solid #e4e7eb;border-radius:16px;background:#fff;padding:4px 14px;font-size:12px;color:#52606d;cursor:pointer}.canvas-toolbar .page-tabs .page-tab.active{background:var(--brand-primary-color, #3b82f6);border-color:var(--brand-primary-color, #3b82f6);color:#fff}.canvas-toolbar .page-tabs .page-tab.add-page{display:inline-flex;align-items:center;gap:2px;padding-left:8px;border-style:dashed;color:#52606d}.canvas-toolbar .page-tabs .page-tab.add-page mat-icon{font-size:16px;width:16px;height:16px}.canvas-toolbar .zoom-controls{display:flex;align-items:center;gap:2px;margin-left:auto;border:1px solid #e4e7eb;border-radius:18px;background:#fff;padding:2px 6px}.canvas-toolbar .zoom-controls .zoom-button{display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:transparent;color:#52606d;cursor:pointer}.canvas-toolbar .zoom-controls .zoom-button:hover{background:#f0f4f8}.canvas-toolbar .zoom-controls .zoom-button mat-icon{font-size:18px;width:18px;height:18px}.canvas-toolbar .zoom-controls .zoom-label{border:none;background:transparent;font-size:12px;color:#52606d;min-width:44px;cursor:pointer}.canvas-toolbar .zoom-controls .zoom-label:hover{color:#1f2933}.page-viewport{position:relative;flex:1;min-height:420px;border:1px solid #e4e7eb;border-radius:8px;background:#eef1f5;overflow:hidden}.page-viewport fs-zoom-pan{width:100%;height:100%}.edit-done{position:absolute;top:12px;right:12px;z-index:40;border-radius:999px;box-shadow:0 2px 10px #0f172a2e}.page{position:relative;background:#fff;border-radius:2px;box-shadow:0 2px 12px #0f172a1f,0 0 0 1px #0f172a0a;box-sizing:border-box}.page.flow{display:flex;flex-wrap:wrap;align-content:flex-start;align-items:flex-start}.page.editing{background-image:radial-gradient(circle,#d8dee6 1px,transparent 1px);background-size:24px 24px}.guides{position:absolute;inset:0;pointer-events:none;z-index:30}.guides ::ng-deep .guide{position:absolute;background:#2196f3}.guides ::ng-deep .guide.guide-v{top:0;bottom:0;width:calc(1.25px / var(--canvas-zoom, 1))}.guides ::ng-deep .guide.guide-h{left:0;right:0;height:calc(1.25px / var(--canvas-zoom, 1))}.page-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#9aa5b1;font-size:14px;pointer-events:none}\n"], dependencies: [{ kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: FsZoomPanModule }, { kind: "component", type: i1$2.FsZoomPanComponent, selector: "fs-zoom-pan", inputs: ["zoomMax", "zoomMin", "zoomScale", "zoomDefault", "zoomFactor", "top", "left"], outputs: ["moved", "zoomed"] }, { kind: "component", type: ReportComponentComponent, selector: "app-report-component", inputs: ["reportId", "component", "groups", "editMode", "layout", "zoom", "snapper", "selected"], outputs: ["selectComponent", "positionChanged", "flowReorder", "openSettings"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportCanvasComponent, decorators: [{
             type: Component,
@@ -2239,6 +2287,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
             }], zoomPan: [{
                 type: ViewChild,
                 args: [FsZoomPanComponent]
+            }], _renderedComponents: [{
+                type: ViewChildren,
+                args: [ReportComponentComponent]
             }], _viewport: [{
                 type: ViewChild,
                 args: ['viewport', { static: true }]
@@ -2257,6 +2308,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
 //   immediately and refreshes the in-dialog list.
 //   SQL / Config — read-only diagnostics.
 class ComponentSettingsComponent {
+    // A filter was added, removed or re-levelled, so the report's filter groups
+    // changed. Those mutations persist the moment they are clicked and the dialog
+    // can then be dismissed by a route that carries no result (Escape, backdrop),
+    // so the page is told here rather than through the close result.
+    filtersChanged = new EventEmitter();
     component;
     report;
     selectedTab = 'settings';
@@ -2281,9 +2337,6 @@ class ComponentSettingsComponent {
         dateRange: 'Date range',
         keyword: 'Search text',
     };
-    // True once any filter mutation happened — the parent reloads the report so
-    // the canvas + report bar reflect the change.
-    _changed = false;
     _data = inject(MAT_DIALOG_DATA);
     _dialogRef = inject(MatDialogRef);
     _reportData = inject(ReportData);
@@ -2302,9 +2355,6 @@ class ComponentSettingsComponent {
         this._seedFilters(this.report, this.component.id);
         this._loadColumns();
     }
-    get hasChanges() {
-        return this._changed;
-    }
     // Human-friendly name for the inferred interface shown beside each column.
     typeLabel(type) {
         return this._typeLabels[type] ?? type;
@@ -2319,10 +2369,10 @@ class ComponentSettingsComponent {
                 left: this.paddingLeft,
             },
         };
-        return this._reportData.updateComponent(this.report.id, this.component.id, settings)
+        return this._reportData.updateComponent(this.report.id, this.component.id, { ...settings })
             .pipe(tap(() => {
             this._message.success('Component saved');
-            this._dialogRef.close(true);
+            this._dialogRef.close({ settings });
         }));
     };
     // Flip one exposure (report bar or this component) for a row. We update the
@@ -2380,7 +2430,7 @@ class ComponentSettingsComponent {
     // After any filter mutation: re-fetch the report so the dialog's filter list
     // (and the parent canvas, on close) reflect the new groups/levels.
     _afterMutation() {
-        this._changed = true;
+        this.filtersChanged.emit();
         this._reportData.get(this.report.id)
             .subscribe((report) => {
             this.report = report;
@@ -2732,29 +2782,74 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
 // Rows fetched for a list component's export table — enough to fill a
 // slide/page table; the cap note covers the rest.
 const LIST_EXPORT_ROWS = 100;
+// How many tile queries an export runs at once.
+//
+// Not a politeness setting — it is the difference between a deck and a broken
+// one. These queries are heavy and read the same tables, so firing all of them
+// together puts every one in contention for the same database at the same
+// moment and they cross the statement ceiling as a group: measured on report
+// 28, ten tiles that each answer in 9-24s run one after another all failed at
+// ~30s when released together. Concurrency buys wall-clock only up to the point
+// where the queries start taking it back off each other, and past that it buys
+// failures.
+const EXPORT_CONCURRENCY = 3;
+// What a component with nothing to draw prints in the exported file.
+//
+// The two cases must not read alike. A tile that returned no rows is a finding
+// about the period — the report worked and the answer is "none". A tile whose
+// query failed is a hole in the file, and calling that "Data unavailable" tells
+// the reader the data does not exist when what happened is that nobody managed
+// to ask for it. Shared by both renderers so the PDF and the deck cannot end up
+// describing the same hole two different ways.
+function emptyLabel(item) {
+    return item.data ? 'No data' : 'Could not be generated';
+}
+// The pages of a collected report that have at least one tile whose query
+// failed — what the export gate names to the user, and what makes "some of this
+// file is missing" a fact the caller can act on rather than a thing they notice
+// in the PDF afterwards.
+function failedPageNames(collected) {
+    // Numbered before the filter — an unnamed page 4 that failed has to read
+    // "Page 4", not "Page 1" because it happened to be the first failure.
+    return collected.pages
+        .map((page, index) => ({ page, number: index + 1 }))
+        .filter(({ page }) => page.components.some((item) => !item.data))
+        .map(({ page, number }) => page.page.name || `Page ${number}`);
+}
 // Gathers everything an export needs: every component's data across ALL pages
 // (the canvas only renders the active page, so exports can't scrape the
-// screen), fetched fresh with the viewer's current filter state. One failed
-// component degrades to a note in the deck, never a failed export.
+// screen), fetched fresh with the viewer's current filter state.
+//
+// A failed component resolves to a null `data` rather than failing the whole
+// collection — but that is so the caller can REPORT what failed, not so it can
+// be ignored: see failedPageNames() and the export gate that uses it.
 class ReportExportCollectorService {
     _reportData = inject(ReportData);
     _filterState = inject(ReportFilterStateService);
     collect(report) {
-        const requests = [];
         const slots = [];
         report.pages.forEach((page, pageIndex) => {
             for (const component of page.components) {
-                slots.push({ pageIndex });
-                requests.push(this._componentData(report, component));
+                slots.push({ pageIndex, component });
             }
         });
-        const all$ = requests.length ? forkJoin(requests) : of([]);
+        // Released a few at a time rather than all at once. mergeMap completes out
+        // of order, so each result carries the slot it came from and the rows are
+        // filed by index — the deck's page order can't depend on which query
+        // happened to finish first.
+        const all$ = slots.length
+            ? from(slots.map((slot, index) => ({ slot, index })))
+                .pipe(mergeMap(({ slot, index }) => this._componentData(report, slot.component)
+                .pipe(map$1((item) => ({ item, index }))), EXPORT_CONCURRENCY), toArray())
+            : of([]);
         // The summary rides alongside the component data rather than being built at
         // the end, because naming a select filter's values is itself a request.
         return forkJoin({ collected: all$, filterSummary: this._filterSummary(report) })
             .pipe(map$1(({ collected, filterSummary }) => {
             const pages = report.pages.map((page) => ({ page, components: [] }));
-            collected.forEach((item, index) => {
+            [...collected]
+                .sort((a, b) => a.index - b.index)
+                .forEach(({ item, index }) => {
                 pages[slots[index].pageIndex].components.push(item);
             });
             return {
@@ -2773,7 +2868,10 @@ class ReportExportCollectorService {
         const state = component.type === 'list'
             ? { page: 1, pageSize: LIST_EXPORT_ROWS }
             : (isTimeSeries && frequency ? { frequency } : {});
-        return this._reportData.componentData(report.id, component.id, filters, state)
+        // handlers: false keeps the app's global error dialog out of this. A failed
+        // tile is reported once, by the export gate, naming the pages it cost —
+        // never as ten stacked modals carrying the database's own wording.
+        return this._reportData.componentData(report.id, component.id, filters, state, true, { handlers: false })
             .pipe(map$1((data) => ({ component, data })), catchError(() => of({ component, data: null })));
     }
     // "Report Period: Jun 12, 2025 – Jun 12, 2026", "Organization: Alnylam - AHP,
@@ -2824,12 +2922,10 @@ class ReportExportCollectorService {
         return resolveOptionValues(loadGroupOptions(group, this._reportData, reportId), values)
             .pipe(map$1((resolved) => `${label}: ${resolved.map((item) => item.name).join(', ')}`), catchError(() => of(`${label}: ${values.map((item) => String(item)).join(', ')}`)));
     }
+    // Rendered off the same calendar day the filter sends to the server, so the
+    // cover's period is the period the numbers behind it were queried for.
     _date(value) {
-        if (!value) {
-            return '…';
-        }
-        const date = value instanceof Date ? value : new Date(value);
-        return Number.isNaN(date.getTime()) ? String(value) : format(date, 'MMM d, yyyy');
+        return dateBoundLabel(value) ?? '…';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportExportCollectorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportExportCollectorService });
@@ -2845,7 +2941,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
 // complete synchronously after setOption.
 async function renderChartImage(component, data, width, height, pixelRatio = 3) {
     // The same tree-shaken echarts build + 'report' theme the live canvas uses.
-    const echarts = (await import('./firestitch-report-echarts-6sMh877A.mjs')).default;
+    const echarts = (await import('./firestitch-report-echarts-DeE74U3a.mjs')).default;
     const host = document.createElement('div');
     host.style.width = `${width}px`;
     host.style.height = `${height}px`;
@@ -2939,7 +3035,7 @@ class ReportPdfService {
             doc.setFont('helvetica', 'italic');
             doc.setFontSize(9);
             doc.setTextColor('#7b8794');
-            doc.text(item.data ? 'No data' : 'Data unavailable', x + w / 2, bodyY + bodyH / 2, { align: 'center' });
+            doc.text(emptyLabel(item), x + w / 2, bodyY + bodyH / 2, { align: 'center' });
             return;
         }
         switch (component.type) {
@@ -3099,7 +3195,7 @@ class ReportPptxService {
         const bodyY = y + TITLE_H;
         const bodyH = Math.max(0.3, h - TITLE_H);
         if (!item.data || !item.data.rows?.length) {
-            slide.addText(item.data ? 'No data' : 'Data unavailable', {
+            slide.addText(emptyLabel(item), {
                 x, y: bodyY, w, h: bodyH,
                 fontSize: 10, italic: true, color: '7B8794', align: 'center', valign: 'middle',
             });
@@ -3248,6 +3344,75 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
             type: Injectable
         }] });
 
+// What the user chose when told the export is incomplete. Retry re-runs the
+// whole collection — the queries that failed were killed on a clock, not on
+// anything about the data, so a second attempt against a warmed database
+// genuinely often succeeds.
+const RETRY = 'retry';
+const DOWNLOAD = 'download';
+// Runs a report export end to end: collect every tile, refuse to write a file
+// that is missing any of them without saying so, then render.
+//
+// The gate is the reason this sits between the collector and the renderers
+// rather than in either of them. A deck with five blank pages is worse than no
+// deck: it looks finished, so it gets emailed to a client, and the pages that
+// are missing are exactly the ones nobody thinks to check. The renderers can
+// only describe a hole they are handed; the collector only knows one tile at a
+// time. Whether the FILE should exist is a decision about the whole report, and
+// this is the only place that sees it.
+class ReportExportService {
+    _collector = inject(ReportExportCollectorService);
+    _pdfService = inject(ReportPdfService);
+    _pptxService = inject(ReportPptxService);
+    _prompt = inject(FsPrompt);
+    pdf(report) {
+        return this._run(report, (collected) => this._pdfService.export(collected));
+    }
+    powerpoint(report) {
+        return this._run(report, (collected) => this._pptxService.export(collected));
+    }
+    // Retry re-collects the WHOLE report, not just the tiles that failed. Every
+    // number in one file has to have been true at one moment: refetching four
+    // tiles and keeping nine from three minutes ago produces a deck whose pages
+    // disagree with each other, and nothing on it would say so.
+    _run(report, render) {
+        return this._collector.collect(report)
+            .pipe(switchMap((collected) => this._gate(collected)
+            .pipe(switchMap((choice) => choice === RETRY
+            ? this._run(report, render)
+            : from(render(collected))))));
+    }
+    // Resolves to DOWNLOAD when the export is whole (or the user accepted an
+    // incomplete one) and to RETRY when they want another attempt. Cancelling
+    // ends the export quietly: EMPTY completes without emitting, so nothing
+    // renders and no error surfaces — they know what they just declined.
+    _gate(collected) {
+        const failed = failedPageNames(collected);
+        if (!failed.length) {
+            return of(DOWNLOAD);
+        }
+        const pages = failed.length === 1
+            ? `<strong>${failed[0]}</strong> could not be generated`
+            : `${failed.length} pages could not be generated: <strong>${failed.join('</strong>, <strong>')}</strong>`;
+        return this._prompt.confirm({
+            title: 'Export is incomplete',
+            template: `${pages}. This usually means those tiles took too long to load. `
+                + 'Retry, or download the file with those pages marked as missing.',
+            buttons: [
+                { label: 'Retry', value: RETRY, color: 'primary' },
+                { label: 'Download Anyway', value: DOWNLOAD, color: '' },
+                { label: 'Cancel', cancel: true, color: '' },
+            ],
+        })
+            .pipe(catchError(() => EMPTY));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportExportService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportExportService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportExportService, decorators: [{
+            type: Injectable
+        }] });
+
 // Holds the report list in memory so the picker doesn't hit the API on every
 // focus. Loaded once when the page opens; create/rename/delete keep the cache
 // in sync.
@@ -3325,9 +3490,7 @@ class ReportComponent {
     _reportData = inject(ReportData);
     _reportService = inject(ReportService);
     _filterState = inject(ReportFilterStateService);
-    _exportCollector = inject(ReportExportCollectorService);
-    _pptxService = inject(ReportPptxService);
-    _pdfService = inject(ReportPdfService);
+    _exportService = inject(ReportExportService);
     _process = inject(FsProcess);
     _prompt = inject(FsPrompt);
     _dialog = inject(MatDialog);
@@ -3406,18 +3569,34 @@ class ReportComponent {
         if (!this.report) {
             return;
         }
-        this._dialog.open(ComponentSettingsComponent, {
+        const dialogRef = this._dialog.open(ComponentSettingsComponent, {
             data: { report: this.report, component },
             width: '640px',
-        })
-            .afterClosed()
+        });
+        // Filter add/remove/level changes persist immediately inside the dialog (no
+        // "save") and can leave it by an exit that carries no result, so they are
+        // announced as they land. The reload waits for the close so the canvas isn't
+        // re-rendering underneath an open dialog.
+        let filtersChanged = false;
+        dialogRef.componentInstance.filtersChanged
+            .pipe(takeUntil(dialogRef.afterClosed()))
+            .subscribe(() => filtersChanged = true);
+        dialogRef.afterClosed()
             .pipe(takeUntilDestroyed(this._destroyRef))
-            .subscribe(() => {
-            // Always reload: filter add/remove/level changes persist immediately
-            // inside the dialog (no "save"), so the canvas + report bar must
-            // refresh however the dialog was closed.
-            if (this.selected) {
-                this._loadReport(this.selected.id);
+            .subscribe((result) => {
+            // The report's filter groups changed, so the report bar and the
+            // on-component strips have to be rebuilt from a fresh report.
+            if (filtersChanged) {
+                if (this.selected) {
+                    this._loadReport(this.selected.id);
+                }
+                return;
+            }
+            // Nothing else in the dialog touches the query — title and padding are
+            // presentation. Repaint the one component it was opened for and leave
+            // every other component's data, and its query, alone.
+            if (result?.settings) {
+                this._canvas?.applyComponentSettings(component.id, result.settings);
             }
         });
     }
@@ -3436,9 +3615,7 @@ class ReportComponent {
         if (!this.report) {
             return;
         }
-        const report = this.report;
-        this._process.run('Exporting PowerPoint', this._exportCollector.collect(report)
-            .pipe(switchMap((collected) => from(this._pptxService.export(collected)))));
+        this._process.run('Exporting PowerPoint', this._exportService.powerpoint(this.report));
     }
     // Export to PDF, entirely client-side: same collection pass, charts rendered
     // through an offscreen ECharts instance at 3× pixel ratio (pixel-identical
@@ -3447,9 +3624,7 @@ class ReportComponent {
         if (!this.report) {
             return;
         }
-        const report = this.report;
-        this._process.run('Exporting PDF', this._exportCollector.collect(report)
-            .pipe(switchMap((collected) => from(this._pdfService.export(collected)))));
+        this._process.run('Exporting PDF', this._exportService.pdf(this.report));
     }
     // The raw data behind the whole report in one action: the server exports every
     // component's full filtered dataset and zips one CSV per component, foldered
@@ -3610,9 +3785,10 @@ class ReportComponent {
             ReportExportCollectorService,
             ReportPptxService,
             ReportPdfService,
+            ReportExportService,
             // Tree-shaken ECharts core + the 'report' house theme, loaded lazily with
             // this route's chunk.
-            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-6sMh877A.mjs').then((module) => module.default) }),
+            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-DeE74U3a.mjs').then((module) => module.default) }),
         ], viewQueries: [{ propertyName: "_split", first: true, predicate: ["split"], descendants: true, static: true }, { propertyName: "_chatPanel", first: true, predicate: ["chatPanel"], descendants: true, read: ElementRef, static: true }, { propertyName: "_canvas", first: true, predicate: ReportCanvasComponent, descendants: true }], ngImport: i0, template: "<div\n    #split\n    class=\"report fs-row.align-start\">\n  <fs-ai-chat\n    #chatPanel\n    class=\"chat\"\n    style=\"min-height: 500px;\"\n    basePath=\"reports\"\n    [requestData]=\"{ reportId: selected?.id ?? null }\"\n    [introMessage]=\"introMessage\"\n    (response)=\"onChatResponse($event)\">\n  </fs-ai-chat>\n  <div\n    class=\"resizer\"\n    (pointerdown)=\"onResizeStart($event)\">\n  </div>\n  <div class=\"viewer fs-flex fs-column\">\n    <div class=\"fs-row.align-center.gap-sm\">\n      <fs-autocomplete-chips\n          class=\"fs-flex\"\n          [fetch]=\"fetchReports\"\n          [(ngModel)]=\"selected\"\n          [disabled]=\"loadingReports\"\n          [padless]=\"true\"\n          [multiple]=\"false\"\n          [fetchOnFocus]=\"true\"\n          (ngModelChange)=\"reportChange($event)\"\n          placeholder=\"Report\"\n          name=\"report\">\n        <ng-template\n            fsAutocompleteChipsTemplate\n            let-object=\"object\">\n          {{ object.name }}\n        </ng-template>\n        <ng-template\n            fsAutocompleteChipsStatic\n            (click)=\"createReport()\">\n          Create Report\n        </ng-template>\n      </fs-autocomplete-chips>\n      @if (report) {\n        <fs-menu>\n          <ng-template\n              fs-menu-item\n              (click)=\"reportSettings()\">\n            <mat-icon>\n              tune\n            </mat-icon>\n            Report settings\n          </ng-template>\n          <ng-template\n              fs-menu-item\n              (click)=\"toggleEditMode()\"\n              [disabled]=\"editMode\">\n            <mat-icon>\n              dashboard_2_edit\n            </mat-icon>\n            {{ editMode ? 'Done editing layout' : 'Edit layout' }}\n          </ng-template>\n          <ng-template\n              fs-menu-item\n              (click)=\"exportPowerpoint()\">\n            <mat-icon>\n              slideshow\n            </mat-icon>\n            Export PowerPoint\n          </ng-template>\n          <ng-template\n              fs-menu-item\n              (click)=\"exportPdf()\">\n            <mat-icon>\n              picture_as_pdf\n            </mat-icon>\n            Export PDF\n          </ng-template>\n          <ng-template\n              fs-menu-item\n              (click)=\"exportData()\">\n            <mat-icon>\n              table_view\n            </mat-icon>\n            Export Raw Data\n          </ng-template>\n          @if ((report?.pages?.length ?? 0) > 1) {\n            <ng-template\n                fs-menu-item\n                (click)=\"exportData(true)\">\n              <mat-icon>\n                table_view\n              </mat-icon>\n              Export Raw Data (This Page)\n            </ng-template>\n          }\n        </fs-menu>\n      }\n    </div>\n    @if (report) {\n      <!-- Report-level filters only (the report's actions live in the menu\n           above). fs-filter reads its config once at init, so it's keyed on the\n           filter signature: when the report-level filter set changes the block\n           is recreated and re-reads the rebuilt config. -->\n      @if (reportHasFilters) {\n        @for (key of [reportFilterKey]; track key) {\n          <fs-filter [config]=\"reportFilterConfig\"></fs-filter>\n        }\n      }\n      <app-report-canvas\n        [report]=\"report\"\n        [editMode]=\"editMode\"\n        (componentSettings)=\"componentSettings($event)\"\n        (reportChanged)=\"onCanvasReportChanged()\"\n        (editDone)=\"toggleEditMode()\">\n      </app-report-canvas>\n    }\n  </div>\n</div>", styles: [".report{height:100%;min-height:500px}.report .chat{display:block;flex:0 0 25%;width:100%;height:100%;min-height:500px;min-width:0;border:none}.report .viewer{display:flex;flex-direction:column;min-width:0;height:100%;overflow:hidden}.report .viewer fs-filter{flex:0 0 auto;margin-top:10px;margin-bottom:0}.report .viewer ::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none}.report .resizer{flex:0 0 11px;align-self:stretch;display:flex;justify-content:center;cursor:col-resize;touch-action:none;-webkit-user-select:none;user-select:none}.report .resizer:before{content:\"\";width:0px;background:#0000001f;transition:width .12s ease,background-color .12s ease}.report .resizer:hover:before{width:3px;background:var(--brand-primary-color)}.report.resizing{cursor:col-resize;-webkit-user-select:none;user-select:none}.report.resizing .resizer:before{width:3px;background:var(--brand-primary-color)}.report.resizing .chat,.report.resizing .viewer{pointer-events:none}::ng-deep body.body-report-reports .mat-mdc-card-content{display:flex;flex-direction:column;box-sizing:border-box}::ng-deep body.body-report-reports .mat-mdc-card-content mat-tab-nav-panel{flex:1;min-height:0}::ng-deep body.body-report-reports .mat-mdc-card-content mat-tab-nav-panel router-outlet+ng-component{height:100%}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: FsAutocompleteChipsModule }, { kind: "component", type: i2$2.FsAutocompleteChipsComponent, selector: "fs-autocomplete-chips", inputs: ["fetch", "appearance", "floatLabel", "readonly", "size", "label", "placeholder", "chipImage", "chipBackground", "chipColor", "chipIcon", "chipIconColor", "chipClass", "chipPadding", "shape", "hint", "allowText", "allowObject", "delay", "minPanelWidth", "maxPanelHeight", "validateText", "removable", "allowClear", "color", "background", "orderable", "padless", "initOnClick", "fetchOnFocus", "multiple", "multipleAdd", "confirm", "disabled", "groupBy", "panelWidth", "panelClass", "compareWith"], outputs: ["selected", "removed", "reordered", "clear", "panelOpened", "panelClosed"] }, { kind: "directive", type: i2$2.FsAutocompleteObjectDirective, selector: "[fsAutocompleteObject],[fsAutocompleteChipsTemplate]" }, { kind: "directive", type: i2$2.FsAutocompleteChipsStaticDirective, selector: "[fsAutocompleteChipsStatic]", inputs: ["show", "disable"], outputs: ["click", "selected"] }, { kind: "ngmodule", type: FsFilterModule }, { kind: "component", type: i2.FilterComponent, selector: "fs-filter", inputs: ["config"], outputs: ["closed", "opened", "ready"] }, { kind: "ngmodule", type: FsMenuModule }, { kind: "component", type: i2$3.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass", "buttonType", "buttonColor"], outputs: ["opened", "closed"] }, { kind: "directive", type: i2$3.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }, { kind: "component", type: FsAiChatComponent, selector: "fs-ai-chat", inputs: ["basePath", "requestData", "introMessage", "showThinking"], outputs: ["response", "showThinkingChange"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ReportCanvasComponent, selector: "app-report-canvas", inputs: ["report", "editMode"], outputs: ["componentSettings", "reportChanged", "editDone"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportComponent, decorators: [{
@@ -3624,9 +3800,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         ReportExportCollectorService,
                         ReportPptxService,
                         ReportPdfService,
+                        ReportExportService,
                         // Tree-shaken ECharts core + the 'report' house theme, loaded lazily with
                         // this route's chunk.
-                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-6sMh877A.mjs').then((module) => module.default) }),
+                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-DeE74U3a.mjs').then((module) => module.default) }),
                     ], imports: [
                         FormsModule,
                         FsAutocompleteChipsModule,
@@ -4701,9 +4878,7 @@ class FsAiReportComponent {
     _canvas;
     _reportData = inject(ReportData);
     _filterState = inject(ReportFilterStateService);
-    _exportCollector = inject(ReportExportCollectorService);
-    _pptxService = inject(ReportPptxService);
-    _pdfService = inject(ReportPdfService);
+    _exportService = inject(ReportExportService);
     _process = inject(FsProcess);
     _dialog = inject(MatDialog);
     _destroyRef = inject(DestroyRef);
@@ -4763,17 +4938,33 @@ class FsAiReportComponent {
             return;
         }
         const reportId = this.report.id;
-        this._dialog.open(ComponentSettingsComponent, {
+        const dialogRef = this._dialog.open(ComponentSettingsComponent, {
             data: { report: this.report, component },
             width: '640px',
-        })
-            .afterClosed()
+        });
+        // Filter add/remove/level changes persist immediately inside the dialog (no
+        // "save") and can leave it by an exit that carries no result, so they are
+        // announced as they land. The reload waits for the close so the canvas isn't
+        // re-rendering underneath an open dialog.
+        let filtersChanged = false;
+        dialogRef.componentInstance.filtersChanged
+            .pipe(takeUntil(dialogRef.afterClosed()))
+            .subscribe(() => filtersChanged = true);
+        dialogRef.afterClosed()
             .pipe(takeUntilDestroyed(this._destroyRef))
-            .subscribe(() => {
-            // Always reload: filter add/remove/level changes persist immediately
-            // inside the dialog (no "save"), so the canvas + report bar must
-            // refresh however the dialog was closed.
-            this._loadReport(reportId);
+            .subscribe((result) => {
+            // The report's filter groups changed, so the report bar and the
+            // on-component strips have to be rebuilt from a fresh report.
+            if (filtersChanged) {
+                this._loadReport(reportId);
+                return;
+            }
+            // Nothing else in the dialog touches the query — title and padding are
+            // presentation. Repaint the one component it was opened for and leave
+            // every other component's data, and its query, alone.
+            if (result?.settings) {
+                this._canvas?.applyComponentSettings(component.id, result.settings);
+            }
         });
     }
     // The canvas changed the report's structure (added a page) — re-fetch so the
@@ -4789,18 +4980,14 @@ class FsAiReportComponent {
         if (!this.report) {
             return;
         }
-        const report = this.report;
-        this._process.run('Exporting PowerPoint', this._exportCollector.collect(report)
-            .pipe(switchMap((collected) => from(this._pptxService.export(collected)))));
+        this._process.run('Exporting PowerPoint', this._exportService.powerpoint(this.report));
     }
     // Export to PDF, entirely client-side (offscreen ECharts at 3×; page = PDF page).
     exportPdf() {
         if (!this.report) {
             return;
         }
-        const report = this.report;
-        this._process.run('Exporting PDF', this._exportCollector.collect(report)
-            .pipe(switchMap((collected) => from(this._pdfService.export(collected)))));
+        this._process.run('Exporting PDF', this._exportService.pdf(this.report));
     }
     // The raw data behind the whole report in one action: the server exports every
     // component's full filtered dataset and zips one CSV per component, foldered
@@ -4948,8 +5135,9 @@ class FsAiReportComponent {
             ReportExportCollectorService,
             ReportPptxService,
             ReportPdfService,
+            ReportExportService,
             // Tree-shaken ECharts core + the 'report' house theme, loaded lazily.
-            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-6sMh877A.mjs').then((module) => module.default) }),
+            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-DeE74U3a.mjs').then((module) => module.default) }),
         ], viewQueries: [{ propertyName: "_split", first: true, predicate: ["split"], descendants: true, static: true }, { propertyName: "_chatPanel", first: true, predicate: ["chatPanel"], descendants: true, read: ElementRef, static: true }, { propertyName: "_canvas", first: true, predicate: ReportCanvasComponent, descendants: true }], ngImport: i0, template: "<div class=\"fs-ai-report fs-column\">\n\n  <div class=\"fs-ai-report__header fs-row.align-center\">\n    <h2 class=\"fs-ai-report__title fs-flex\">{{ report?.name }}</h2>\n\n    @if (report) {\n      <!-- Report-level filters, inline with the toolbar actions. fs-filter\n           reads its config once at init, so it's keyed on the filter\n           signature: when the report-level filter set changes the block is\n           recreated and re-reads the rebuilt config. -->\n      @if (reportHasFilters) {\n        @for (key of [reportFilterKey]; track key) {\n          <fs-filter\n              class=\"fs-ai-report__filters\"\n              [config]=\"reportFilterConfig\">\n          </fs-filter>\n        }\n      }\n\n      <button\n          mat-icon-button\n          type=\"button\"\n          [matTooltip]=\"editMode ? 'Done' : 'Edit layout'\"\n          (click)=\"toggleEditMode()\">\n        <mat-icon>{{ editMode ? 'lock' : 'open_with' }}</mat-icon>\n      </button>\n\n      <button\n          mat-icon-button\n          type=\"button\"\n          matTooltip=\"Export\"\n          [fsMenuTriggerFor]=\"exportMenu\">\n        <mat-icon>download</mat-icon>\n      </button>\n      <fs-menu #exportMenu>\n        <ng-template\n            fs-menu-item\n            (click)=\"exportPowerpoint()\">\n          Export PowerPoint\n        </ng-template>\n        <ng-template\n            fs-menu-item\n            (click)=\"exportPdf()\">\n          Export PDF\n        </ng-template>\n        <ng-template\n            fs-menu-item\n            (click)=\"exportData()\">\n          Export Raw Data\n        </ng-template>\n        @if ((report?.pages?.length ?? 0) > 1) {\n          <ng-template\n              fs-menu-item\n              (click)=\"exportData(true)\">\n            Export Raw Data (This Page)\n          </ng-template>\n        }\n      </fs-menu>\n\n      <button\n          mat-icon-button\n          type=\"button\"\n          matTooltip=\"Report settings\"\n          (click)=\"reportSettings()\">\n        <mat-icon>settings</mat-icon>\n      </button>\n    }\n  </div>\n\n  <div\n      #split\n      class=\"fs-ai-report__split fs-row.align-start\">\n    <fs-ai-chat\n        #chatPanel\n        class=\"chat\"\n        [basePath]=\"basePath()\"\n        [requestData]=\"{ reportId: reportId() }\"\n        (response)=\"onChatResponse($event)\">\n    </fs-ai-chat>\n\n    <div\n        class=\"resizer\"\n        (pointerdown)=\"onResizeStart($event)\">\n    </div>\n\n    <div class=\"viewer fs-flex fs-column\">\n      @if (report) {\n        <app-report-canvas\n            [report]=\"report\"\n            [editMode]=\"editMode\"\n            (componentSettings)=\"componentSettings($event)\"\n            (reportChanged)=\"onCanvasReportChanged()\"\n            (editDone)=\"toggleEditMode()\">\n        </app-report-canvas>\n      }\n    </div>\n  </div>\n</div>\n", styles: [".fs-ai-report{height:100%;min-height:500px;display:flex;flex-direction:column}.fs-ai-report__header{flex:0 0 auto;margin-bottom:10px}.fs-ai-report__title{margin:0;min-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fs-ai-report__filters{flex:0 1 auto;min-width:0;display:block;margin:0 5px 0 0}.fs-ai-report__filters ::ng-deep .filter-bar-container{align-items:center!important}.fs-ai-report__filters ::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none}.fs-ai-report__split{flex:1 1 auto;min-height:0}.fs-ai-report .chat{display:block;flex:0 0 25%;width:100%;height:100%;min-height:400px;min-width:0;border:none}.fs-ai-report .viewer{display:flex;flex-direction:column;min-width:0;height:100%;overflow:hidden}.fs-ai-report .resizer{flex:0 0 11px;align-self:stretch;display:flex;justify-content:center;cursor:col-resize;touch-action:none;-webkit-user-select:none;user-select:none}.fs-ai-report .resizer:before{content:\"\";width:3px;border-radius:3px;background:transparent;transition:background-color .12s ease}.fs-ai-report .resizer:hover:before{background:var(--brand-primary-color)}.fs-ai-report__split.resizing{cursor:col-resize;-webkit-user-select:none;user-select:none}.fs-ai-report__split.resizing .resizer:before{background:var(--brand-primary-color)}.fs-ai-report__split.resizing .chat,.fs-ai-report__split.resizing .viewer{pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: FsFilterModule }, { kind: "component", type: i2.FilterComponent, selector: "fs-filter", inputs: ["config"], outputs: ["closed", "opened", "ready"] }, { kind: "ngmodule", type: FsMenuModule }, { kind: "component", type: i2$3.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass", "buttonType", "buttonColor"], outputs: ["opened", "closed"] }, { kind: "directive", type: i2$3.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }, { kind: "directive", type: i2$3.FsMenuTriggerDirective, selector: "[fsMenuTriggerFor]", inputs: ["fsMenuTriggerFor"] }, { kind: "component", type: FsAiChatComponent, selector: "fs-ai-chat", inputs: ["basePath", "requestData", "introMessage", "showThinking"], outputs: ["response", "showThinkingChange"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3$2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2$5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: ReportCanvasComponent, selector: "app-report-canvas", inputs: ["report", "editMode"], outputs: ["componentSettings", "reportChanged", "editDone"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FsAiReportComponent, decorators: [{
@@ -4961,8 +5149,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         ReportExportCollectorService,
                         ReportPptxService,
                         ReportPdfService,
+                        ReportExportService,
                         // Tree-shaken ECharts core + the 'report' house theme, loaded lazily.
-                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-6sMh877A.mjs').then((module) => module.default) }),
+                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-DeE74U3a.mjs').then((module) => module.default) }),
                     ], imports: [
                         FsFilterModule,
                         FsMenuModule,
@@ -4996,4 +5185,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
  */
 
 export { FsAiReportsComponent as F, GRANULARITY_OPTIONS as G, REPORT_CHART_COLORS_CSS as R, ReportComponent as a, FsAiReportComponent as b, ReportData as c, ReportService as d, ReportFilterStateService as e, ReportNodeType as f, ReportState as g, ReportStates as h };
-//# sourceMappingURL=firestitch-report-firestitch-report-B8LjVTvx.mjs.map
+//# sourceMappingURL=firestitch-report-firestitch-report-Nxl-C1w0.mjs.map