@firestitch/report 18.3.1 → 18.3.2

package/fesm2022/{firestitch-report-firestitch-report-JORFp_xa.mjs → firestitch-report-firestitch-report-DY8HwvAU.mjs}

@@ -2,10 +2,10 @@ import * as i0 from '@angular/core';
 import { inject, Injectable, Component, ChangeDetectionStrategy, Input, signal, DestroyRef, ViewChild, input, output, computed, viewChild, ElementRef, effect, untracked, EventEmitter, ChangeDetectorRef, NgZone, Output, HostBinding, ViewChildren, CUSTOM_ELEMENTS_SCHEMA, model } from '@angular/core';
 import * as i1$1 from '@angular/forms';
 import { FormsModule, ControlContainer, NgForm } from '@angular/forms';
-import * as i3$4 from '@angular/material/button';
+import * as i3$3 from '@angular/material/button';
 import { MatIconButton, MatButton, MatButtonModule } from '@angular/material/button';
 import { MAT_DIALOG_DATA, MatDialogRef, MatDialogTitle, MatDialogContent, MatDialogActions, MatDialogClose, MatDialog } from '@angular/material/dialog';
-import * as i4$1 from '@angular/material/icon';
+import * as i5$2 from '@angular/material/icon';
 import { MatIcon, MatIconModule } from '@angular/material/icon';
 import * as i2$5 from '@angular/material/tooltip';
 import { MatTooltip, MatTooltipModule } from '@angular/material/tooltip';
@@ -57,12 +57,12 @@ import { FsDatePickerModule } from '@firestitch/datepicker';
 import { MatOption } from '@angular/material/core';
 import { guid } from '@firestitch/common';
 import { Router, ActivatedRoute, RouterLink } from '@angular/router';
+import * as i1$4 from '@firestitch/chip';
+import { FsChipModule } from '@firestitch/chip';
 import * as i4 from '@firestitch/skeleton';
 import { FsSkeletonModule } from '@firestitch/skeleton';
-import * as i3$3 from '@firestitch/tree';
+import * as i4$1 from '@firestitch/tree';
 import { FsTreeComponent, TreeDragMode, TreeActionType, FsTreeModule } from '@firestitch/tree';
-import * as i1$4 from '@firestitch/chip';
-import { FsChipModule } from '@firestitch/chip';
 import * as i2$4 from '@firestitch/date';
 import { FsDateModule } from '@firestitch/date';
 import { FsMarkdownRendererComponent, FsMarkdownEditorComponent } from '@firestitch/markdown-editor';
@@ -123,14 +123,23 @@ class ReportData {
             ...config,
         });
     }
-    // A real delete — the backend refuses while the folder still holds a
-    // sub-folder or an active report, so there is no undelete counterpart.
+    // Soft-delete, whatever the folder holds: its contents leave the listing with
+    // it, and undeleteFolder() brings the lot back.
     deleteFolder(reportFolderId, config = {}) {
         return this._api.delete(this._path(`folders/${reportFolderId}`), {}, {
             key: 'folder',
             ...config,
         });
     }
+    // Restore a soft-deleted folder through its own action endpoint — the folder
+    // PUT does not accept `state`. Any deleted folder above it is restored too, so
+    // it lands back where it was.
+    undeleteFolder(reportFolderId, config = {}) {
+        return this._api.post(this._path(`folders/${reportFolderId}/undelete`), {}, {
+            key: 'folder',
+            ...config,
+        });
+    }
     rename(reportId, name, config = {}) {
         return this._api.put(this._path(`${reportId}`), { name }, {
             key: 'report',
@@ -216,7 +225,8 @@ class ReportData {
         });
     }
     // Restore a soft-deleted report through its own action endpoint — the report
-    // PUT does not accept `state`.
+    // PUT does not accept `state`. Its folder is restored too when it is deleted,
+    // or inside one that is, so the report lands back where it was.
     undelete(reportId, config = {}) {
         return this._api.post(this._path(`${reportId}/undelete`), {}, {
             key: 'report',
@@ -493,19 +503,15 @@ var ReportNodeType;
     ReportNodeType["Folder"] = "folder";
     ReportNodeType["Report"] = "report";
 })(ReportNodeType || (ReportNodeType = {}));
-// Reports are soft-deletable: a deleted report leaves the listing but keeps its
-// pages and components, and the listing's "Show Deleted" mode restores it.
-// Folders have no equivalent — they are only deletable once empty, so they hard
-// delete and there is nothing to restore.
+// Reports and folders are both soft-deletable. A deleted report keeps its pages
+// and components; a deleted folder keeps everything filed under it, which leaves
+// the listing with it and comes back with it. "Show Deleted" shows the whole
+// tree, live and deleted together, so any of it can be restored in place.
 var ReportState;
 (function (ReportState) {
     ReportState["Active"] = "active";
     ReportState["Deleted"] = "deleted";
 })(ReportState || (ReportState = {}));
-const ReportStates = [
-    { name: 'Active', value: ReportState.Active },
-    { name: 'Deleted', value: ReportState.Deleted },
-];
 
 // A date-range boundary as the picked LOCAL calendar day (no time, no tz).
 // Date-range filters are calendar-day semantics, so the boundary must carry
@@ -3882,7 +3888,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-Dg5PjbjT.mjs')).default;
+    const echarts = (await import('./firestitch-report-echarts-D4xJt3zs.mjs')).default;
     const host = document.createElement('div');
     host.style.width = `${width}px`;
     host.style.height = `${height}px`;
@@ -4970,7 +4976,7 @@ class ReportComponent {
             ReportExportService,
             // Tree-shaken ECharts core + the 'report' house theme, loaded lazily with
             // this route's chunk.
-            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-Dg5PjbjT.mjs').then((module) => module.default) }),
+            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-D4xJt3zs.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 && editMode) {\n        <!-- What layout editing can add or switch to, and the way out of it \u2014\n             the same outlined buttons as the fs-ai-report toolbar. -->\n        <button\n            mat-stroked-button\n            type=\"button\"\n            matTooltip=\"Add a block of text\"\n            (click)=\"addText()\">\n          <mat-icon>title</mat-icon>\n          Add text\n        </button>\n        <button\n            mat-stroked-button\n            type=\"button\"\n            class=\"master-toggle\"\n            [class.active]=\"isMasterMode\"\n            [matTooltip]=\"isMasterMode ? 'Back to editing this page' : 'Edit the header and footer shown on every page'\"\n            (click)=\"toggleMasterMode()\">\n          <mat-icon>web_asset</mat-icon>\n          Header & footer\n        </button>\n        <button\n            mat-stroked-button\n            type=\"button\"\n            (click)=\"toggleEditMode()\">\n          <mat-icon>check</mat-icon>\n          Done editing\n        </button>\n      }\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_customize\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      </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%}.master-toggle.active{background:#eceff3}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: FsAutocompleteChipsModule }, { kind: "component", type: i2$3.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$3.FsAutocompleteObjectDirective, selector: "[fsAutocompleteObject],[fsAutocompleteChipsTemplate]" }, { kind: "directive", type: i2$3.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$1.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass", "buttonType", "buttonColor"], outputs: ["opened", "closed"] }, { kind: "directive", type: i2$1.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }, { kind: "component", type: FsAiChatComponent, selector: "fs-ai-chat", inputs: ["basePath", "requestData", "ready", "introMessage", "showThinking"], outputs: ["response", "showThinkingChange"] }, { 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: "component", type: ReportCanvasComponent, selector: "app-report-canvas", inputs: ["report", "editMode", "pageId"], outputs: ["componentSettings", "reportChanged", "pageChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportComponent, decorators: [{
@@ -4985,7 +4991,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         ReportExportService,
                         // Tree-shaken ECharts core + the 'report' house theme, loaded lazily with
                         // this route's chunk.
-                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-Dg5PjbjT.mjs').then((module) => module.default) }),
+                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-D4xJt3zs.mjs').then((module) => module.default) }),
                     ], imports: [
                         FormsModule,
                         FsAutocompleteChipsModule,
@@ -5662,17 +5668,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
 // report in no folder is a root node, which is where every report sat before
 // folders existed, so nothing had to be migrated or bucketed as "uncategorized".
 //
-// Reports are soft-deletable: the row kebab deletes, "Show Deleted" flips the
-// listing into deleted mode (the backend hides deleted reports otherwise), and
-// in that mode the kebab offers Restore instead. Folders do NOT take part in
-// that — a folder is only deletable once it is empty, so it hard deletes and has
-// nothing to restore. The upshot is that deleted mode keeps the folder structure
-// on screen with the deleted reports sitting where they belong, so restoring one
-// puts it back rather than dropping it at the root.
+// Folders and reports are both soft-deletable, and a folder deletes whatever it
+// holds. Only the folder's own row is written: everything under it drops out of
+// the listing because it sits under a deleted folder, and comes back with it.
+// "Show Deleted" shows the WHOLE tree — live and deleted together, each deleted
+// row where it was filed — and on anything deleted the kebab offers Restore
+// instead. Restoring also restores any deleted folder above the row, so it lands
+// back where it was rather than at the root.
+//
+// Every folder starts collapsed; the tree remembers what was opened across its
+// own reloads (a rename, a move, the Show Deleted toggle) and across a search.
 class FsAiReportsComponent {
-    // How deep the tree opens on load. Folders are audience buckets, not a
-    // filesystem, so there is nothing worth hiding behind a closed chevron.
-    static EXPAND_LEVEL = 10;
     // API base for the reports endpoints; override to mount elsewhere.
     basePath = input('reports');
     // Where a row links to; ':id' is replaced with the report id. Default takes
@@ -5696,6 +5702,10 @@ class FsAiReportsComponent {
     _destroyRef = inject(DestroyRef);
     // The filter bar's current query — carries `state` when Show Deleted is on.
     _query = {};
+    // The folders that were open when a search started; null while no search is
+    // running. The search opens every match's path over the top of them, and
+    // clearing it puts these back.
+    _expandedBeforeSearch = null;
     constructor() {
         effect(() => {
             this._reportData.basePath = this.basePath();
@@ -5713,11 +5723,6 @@ class FsAiReportsComponent {
     openLink(report) {
         return this._patternCommands(this.openPattern(), report.id);
     }
-    // A deleted report can't be opened — the backend only assembles active ones —
-    // so in Show Deleted mode its name renders as plain text rather than a link.
-    isDeleted(report) {
-        return report?.state === ReportState.Deleted;
-    }
     // Prompt for a title, create the report — filed under reportFolderId when a
     // folder's kebab asked, at the root otherwise — then route to it (createPattern).
     createReport(reportFolderId = null) {
@@ -5752,13 +5757,16 @@ class FsAiReportsComponent {
                     type: ItemType.Keyword,
                     label: 'Search',
                 },
+                // A checkbox rather than the usual Status select with a "Show Deleted"
+                // isolate. Isolating the deleted rows would strand them: a deleted
+                // report in a live folder arrives without the folder it sits in, and a
+                // tree cannot place a node whose parent it never received. So the
+                // toggle asks for everything, and the rows mark what is deleted.
                 {
                     name: 'state',
-                    type: ItemType.Select,
-                    label: 'Status',
-                    multiple: true,
-                    values: () => ReportStates,
-                    isolate: { label: 'Show Deleted', value: ReportState.Deleted },
+                    type: ItemType.Checkbox,
+                    label: 'Show Deleted',
+                    checked: [ReportState.Active, ReportState.Deleted].join(','),
                 },
             ],
             actions: [
@@ -5791,15 +5799,19 @@ class FsAiReportsComponent {
                     click: () => this.createReport(),
                 },
             ],
-            // The two items are answered in different places and both have to run.
-            // The keyword drives the tree's own search, which is the whole point of
-            // searching a tree — it reveals a match nested inside collapsed folders
-            // rather than only filtering what is already on screen. `state` is the
-            // Show Deleted toggle, and only the server can answer that.
+            // The two items are answered in different places, and each only when it
+            // changed. The keyword drives the tree's own search, which is the whole
+            // point of searching a tree — it reveals a match nested inside collapsed
+            // folders rather than only filtering what is already on screen. `state` is
+            // the Show Deleted toggle, and only the server can answer that. Running the
+            // search on a toggle would clear it, and clearing collapses the tree.
             change: (query) => {
+                const keywordChanged = String(query?.keyword ?? '') !== String(this._query.keyword ?? '');
                 const stateChanged = String(query?.state ?? '') !== String(this._query.state ?? '');
                 this._query = { ...query };
-                this._search(query?.keyword);
+                if (keywordChanged) {
+                    this._search(query?.keyword);
+                }
                 if (stateChanged) {
                     this._load();
                 }
@@ -5807,22 +5819,26 @@ class FsAiReportsComponent {
         };
     }
     _initTreeConfig() {
+        // No expandLevel: every folder starts collapsed.
         this.treeConfig = {
             data: [],
             childrenName: 'children',
-            expandLevel: FsAiReportsComponent.EXPAND_LEVEL,
             draggable: true,
             // The whole row is the grip and the handle stays hidden; a press only
             // becomes a drag once the pointer moves, so the kebab, the chevron and the
             // report link all stay clickable.
             dragMode: TreeDragMode.Node,
+            // Anything deleted is restored before it is moved — the backend refuses
+            // to edit a deleted row, and a drag would only snap back.
+            canDrag: (node) => !this._isDeletedNode(node),
             // canDrop is asked about the node being DRAGGED, so only `toParent`
             // describes the destination — reading node.level/node.parent here would
             // describe where it came from. A report can never be a parent because its
             // type says so, and that single test is the whole "folders nest, reports
-            // are leaves" rule on this side.
+            // are leaves" rule on this side. A deleted folder is no destination
+            // either: whatever landed in it would vanish from the live listing.
             canDrop: (node, fromParent, toParent) => {
-                return !toParent || toParent.data?.type === ReportNodeType.Folder;
+                return !toParent || (this._isFolderNode(toParent) && !this._isDeletedNode(toParent));
             },
             changeReorder: (event) => this._move(event),
             nodeClass: (node) => node.data?.type,
@@ -5846,12 +5862,12 @@ class FsAiReportsComponent {
                         },
                         {
                             label: 'New report',
-                            show: (node) => this._isFolderNode(node),
+                            show: (node) => this._isFolderNode(node) && !this._isDeletedNode(node),
                             click: (node) => this.createReport(node.data?.id),
                         },
                         {
                             label: 'New folder',
-                            show: (node) => this._isFolderNode(node),
+                            show: (node) => this._isFolderNode(node) && !this._isDeletedNode(node),
                             click: (node) => this._createFolder(node.data?.id),
                         },
                         {
@@ -5859,8 +5875,8 @@ class FsAiReportsComponent {
                             show: (node) => !this._isDeletedNode(node),
                             click: (node) => this._delete(node),
                         },
-                        // Folders never reach this: they hard delete, so a deleted folder
-                        // does not exist to be restored.
+                        // On every deleted row, including a live one that is only hidden by
+                        // a deleted folder above it — restoring that brings the folder back.
                         {
                             label: 'Restore',
                             show: (node) => this._isDeletedNode(node),
@@ -5875,66 +5891,128 @@ class FsAiReportsComponent {
         return node?.data?.type === ReportNodeType.Folder;
     }
     _isDeletedNode(node) {
-        return this.isDeleted(node?.data?.report);
+        return !!node?.data?.deleted;
     }
     // Drive the tree's built-in search: it collapses everything, hides every node,
     // then unhides each match and walks its ancestors open, so a report several
-    // folders deep surfaces with its path expanded. Clearing does NOT undo that
-    // initial collapse, so the tree is re-opened here — otherwise the listing is
-    // left fully collapsed the moment somebody empties the search box.
+    // folders deep surfaces with its path expanded. Clearing collapses everything
+    // again, so the folders that were open before the search are put back.
     _search(keyword) {
         const tree = this._tree();
         if (!tree) {
             return;
         }
         if (keyword) {
+            this._expandedBeforeSearch ??= this._expandedKeys();
             tree.search(keyword);
             return;
         }
         tree.clearSearch();
-        tree.expandAll();
+        this._expandKeys(this._expandedBeforeSearch ?? []);
+        this._expandedBeforeSearch = null;
     }
     _load() {
-        this._reportData.tree(this._query)
+        // Only the Show Deleted toggle is the server's to answer — the keyword is
+        // the tree's own search — and an unchecked toggle sends nothing, leaving the
+        // backend's active-only default in charge.
+        const query = this._query.state ? { state: this._query.state } : {};
+        this._reportData.tree(query)
             .pipe(takeUntilDestroyed(this._destroyRef))
-            .subscribe((tree) => {
-            const nodes = this._buildNodes(tree);
+            .subscribe((reportTree) => {
+            const nodes = this._buildNodes(reportTree);
             this.nodes.set(nodes);
             // The tree reads `config` once, in its own ngOnInit. The first load
             // lands before it exists, so the data has to arrive through the config;
             // every later one has to go through the instance or nothing changes.
             this.treeConfig = { ...this.treeConfig, data: nodes };
-            this._tree()?.setData(nodes);
+            const tree = this._tree();
+            if (!tree) {
+                return;
+            }
+            // setData() rebuilds every node collapsed, so a rename or a move would
+            // otherwise slam shut every folder somebody had opened. Keys are stable
+            // across loads ('f:12'), so what was open is reopened by key — and a
+            // folder that no longer comes back simply is not.
+            const expandedKeys = this._expandedKeys();
+            tree.setData(nodes);
+            this._expandKeys(expandedKeys);
+            const keyword = String(this._query.keyword ?? '');
+            if (keyword) {
+                tree.search(keyword);
+            }
         });
     }
+    // The keys of every open folder, walked through the tree's public node API.
+    _expandedKeys() {
+        const tree = this._tree();
+        if (!tree) {
+            return [];
+        }
+        const walk = (parent) => tree.getNodes(parent)
+            .filter((node) => node.isExpanded())
+            .flatMap((node) => [node.data?.key, ...walk(node)]);
+        return walk(null);
+    }
+    _expandKeys(keys) {
+        const tree = this._tree();
+        if (!tree || !keys.length) {
+            return;
+        }
+        const open = new Set(keys);
+        const walk = (parent) => {
+            tree.getNodes(parent)
+                .filter((node) => open.has(node.data?.key))
+                .forEach((node) => {
+                node.expand();
+                walk(node);
+            });
+        };
+        walk(null);
+    }
     // Flat API rows → the nested shape fs-tree renders. Folders come before
     // reports at every level, each already name-ordered by the backend.
-    _buildNodes(tree) {
-        const folders = tree?.folders ?? [];
-        const reports = tree?.reports ?? [];
-        const build = (parentId) => {
+    //
+    // `deleted` is inherited downward: a deleted folder hides everything below it
+    // without the rows below being deleted themselves, and that is only visible
+    // from here, where the parent is in hand. The backend applies the same rule
+    // when it filters (ReportFolderModel::getDeletedFolderIds()).
+    _buildNodes(reportTree) {
+        const folders = reportTree?.folders ?? [];
+        const reports = reportTree?.reports ?? [];
+        const build = (parentId, parentDeleted) => {
             const folderNodes = folders
                 .filter((folder) => (folder.parentReportFolderId ?? null) === parentId)
-                .map((folder) => ({
-                key: `f:${folder.id}`,
-                id: folder.id,
-                name: folder.name,
-                type: ReportNodeType.Folder,
-                children: build(folder.id),
-            }));
+                .map((folder) => {
+                const stateDeleted = folder.state === ReportState.Deleted;
+                const deleted = parentDeleted || stateDeleted;
+                return {
+                    key: `f:${folder.id}`,
+                    id: folder.id,
+                    name: folder.name,
+                    type: ReportNodeType.Folder,
+                    children: build(folder.id, deleted),
+                    stateDeleted,
+                    deleted,
+                };
+            });
             const reportNodes = reports
                 .filter((report) => (report.reportFolderId ?? null) === parentId)
-                .map((report) => ({
-                key: `r:${report.id}`,
-                id: report.id,
-                name: report.name,
-                type: ReportNodeType.Report,
-                children: [],
-                report,
-            }));
+                .map((report) => {
+                const stateDeleted = report.state === ReportState.Deleted;
+                return {
+                    key: `r:${report.id}`,
+                    id: report.id,
+                    name: report.name,
+                    type: ReportNodeType.Report,
+                    children: [],
+                    report,
+                    stateDeleted,
+                    deleted: parentDeleted || stateDeleted,
+                };
+            });
             return [...folderNodes, ...reportNodes];
         };
-        return build(null);
+        return build(null, false);
     }
     // A drop moved a node under a new parent, or out to the root. The tree has
     // already moved it on screen, so both outcomes reload: a success to pick up
@@ -5995,9 +6073,9 @@ class FsAiReportsComponent {
             this._load();
         });
     }
-    // Deleting a folder is refused server-side while it still holds a sub-folder
-    // or an active report, and the message says which — so the confirm here warns
-    // that a folder delete is permanent rather than trying to restate the rule.
+    // A folder deletes with everything in it, so the confirm says what that is —
+    // and that it all comes back from Show Deleted, which is what makes it safe to
+    // offer.
     _delete(node) {
         const data = node?.data;
         if (!data) {
@@ -6007,7 +6085,7 @@ class FsAiReportsComponent {
         this._prompt.confirm({
             title: 'Confirm',
             template: folder
-                ? `Are you sure you would like to delete the folder "${data.name}"? This cannot be undone.`
+                ? this._deleteFolderMessage(data)
                 : 'Are you sure you would like to delete this report?',
         })
             .pipe(switchMap(() => (folder
@@ -6018,15 +6096,41 @@ class FsAiReportsComponent {
             this._load();
         });
     }
+    // Counted from the node already on screen, live rows only: in Show Deleted
+    // mode the folder can also hold rows that are gone already, and those are not
+    // leaving with it.
+    _deleteFolderMessage(folder) {
+        const count = (node) => node.children
+            .filter((child) => !child.deleted)
+            .reduce((total, child) => {
+            const below = count(child);
+            return {
+                folders: total.folders + below.folders + (child.type === ReportNodeType.Folder ? 1 : 0),
+                reports: total.reports + below.reports + (child.type === ReportNodeType.Report ? 1 : 0),
+            };
+        }, { folders: 0, reports: 0 });
+        const { folders, reports } = count(folder);
+        const contents = [
+            folders ? `${folders} ${folders === 1 ? 'folder' : 'folders'}` : '',
+            reports ? `${reports} ${reports === 1 ? 'report' : 'reports'}` : '',
+        ].filter(Boolean);
+        const inside = contents.length ? ` and the ${contents.join(' and ')} inside it` : '';
+        return `Are you sure you would like to delete the folder "${folder.name}"${inside}? It can be restored from Show Deleted.`;
+    }
+    // Both endpoints also restore any deleted folder above the row, so a row that
+    // is live itself but hidden by a deleted folder is restored by the same call.
     _restore(node) {
         const data = node?.data;
         if (!data) {
             return;
         }
-        this._reportData.undelete(data.id)
+        const folder = data.type === ReportNodeType.Folder;
+        (folder
+            ? this._reportData.undeleteFolder(data.id)
+            : this._reportData.undelete(data.id))
             .pipe(takeUntilDestroyed(this._destroyRef))
             .subscribe(() => {
-            this._message.success('Restored report');
+            this._message.success(folder ? 'Restored folder' : 'Restored report');
             this._load();
         });
     }
@@ -6046,17 +6150,18 @@ class FsAiReportsComponent {
         return segments;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FsAiReportsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FsAiReportsComponent, isStandalone: true, selector: "fs-ai-reports", inputs: { basePath: { classPropertyName: "basePath", publicName: "basePath", isSignal: true, isRequired: false, transformFunction: null }, openPattern: { classPropertyName: "openPattern", publicName: "openPattern", isSignal: true, isRequired: false, transformFunction: null }, createPattern: { classPropertyName: "createPattern", publicName: "createPattern", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "_tree", first: true, predicate: FsTreeComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<fs-filter [config]=\"filterConfig\"></fs-filter>\n\n<ng-container *fsSkeleton=\"nodes()\">\n  <fs-tree [config]=\"treeConfig\">\n    <ng-template\n        fsTreeNode\n        let-data=\"data\">\n      <div class=\"fs-row.gap-sm.align-center node-row\">\n        <mat-icon class=\"node-icon\">\n          {{ data.type === nodeType.Folder ? 'folder' : 'insert_chart_outlined' }}\n        </mat-icon>\n\n        @if (data.type === nodeType.Folder) {\n          <span class=\"node-name\">{{ data.name }}</span>\n        } @else if (isDeleted(data.report)) {\n          <!-- A deleted report can't be opened (the backend only assembles\n               active ones), so in Show Deleted mode the name is plain text \u2014\n               restore it from the row menu first. -->\n          <span class=\"node-name\">{{ data.name }}</span>\n        } @else {\n          <a\n              class=\"node-name\"\n              [routerLink]=\"openLink(data.report)\">\n            {{ data.name }}\n          </a>\n        }\n      </div>\n    </ng-template>\n  </fs-tree>\n\n  @if (!nodes().length) {\n    <p class=\"small tree-empty\">\n      No reports yet. Create one, or add a folder to group them.\n    </p>\n  }\n</ng-container>\n", styles: ["a{cursor:pointer}fs-tree .node>.container{flex:1;min-width:0}fs-tree .node>.container>.content{min-width:0}fs-tree .node>.container>button{margin-top:-5px}.node-row{min-width:0}.node-icon{font-size:18px;width:18px;height:18px;flex:none}.node-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tree-empty{margin-top:10px}\n"], dependencies: [{ kind: "ngmodule", type: FsFilterModule }, { kind: "component", type: i2.FilterComponent, selector: "fs-filter", inputs: ["config"], outputs: ["closed", "opened", "ready"] }, { kind: "ngmodule", type: FsSkeletonModule }, { kind: "directive", type: i4.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { kind: "ngmodule", type: FsTreeModule }, { kind: "component", type: i3$3.FsTreeComponent, selector: "fs-tree", inputs: ["config"] }, { kind: "directive", type: i3$3.FsTreeNodeDirective, selector: "[fsTreeNode]", inputs: ["class"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: FsAiReportsComponent, isStandalone: true, selector: "fs-ai-reports", inputs: { basePath: { classPropertyName: "basePath", publicName: "basePath", isSignal: true, isRequired: false, transformFunction: null }, openPattern: { classPropertyName: "openPattern", publicName: "openPattern", isSignal: true, isRequired: false, transformFunction: null }, createPattern: { classPropertyName: "createPattern", publicName: "createPattern", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "_tree", first: true, predicate: FsTreeComponent, descendants: true, isSignal: true }], ngImport: i0, template: "<fs-filter [config]=\"filterConfig\"></fs-filter>\n\n<ng-container *fsSkeleton=\"nodes()\">\n  <fs-tree [config]=\"treeConfig\">\n    <ng-template\n        fsTreeNode\n        let-data=\"data\">\n      <div\n          class=\"fs-row.gap-sm.align-center node-row\"\n          [class.deleted]=\"data.deleted\">\n        <mat-icon class=\"node-icon\">\n          {{ data.type === nodeType.Folder ? 'folder' : 'insert_chart_outlined' }}\n        </mat-icon>\n\n        @if (data.type === nodeType.Folder || data.deleted) {\n          <!-- A deleted report can't be opened (the backend only assembles\n               live ones, and one under a deleted folder is not on the live\n               listing), so in Show Deleted mode the name is plain text \u2014\n               restore it from the row menu first. -->\n          <span class=\"node-name\">{{ data.name }}</span>\n        } @else {\n          <a\n              class=\"node-name\"\n              [routerLink]=\"openLink(data.report)\">\n            {{ data.name }}\n          </a>\n        }\n\n        <!-- Only on the row somebody deleted. Everything under a deleted\n             folder is muted with it, but was not deleted itself. -->\n        @if (data.stateDeleted) {\n          <fs-chip size=\"tiny\">Deleted</fs-chip>\n        }\n      </div>\n    </ng-template>\n  </fs-tree>\n\n  @if (!nodes().length) {\n    <p class=\"small tree-empty\">\n      No reports yet. Create one, or add a folder to group them.\n    </p>\n  }\n</ng-container>\n", styles: ["a{cursor:pointer}fs-tree .node>.container{flex:1;min-width:0}fs-tree .node>.container>.content{min-width:0}fs-tree .node>.container>button{margin-top:-5px}.node-row{min-width:0}.node-row.deleted{opacity:.55}.node-icon{font-size:18px;width:18px;height:18px;flex:none}.node-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tree-empty{margin-top:10px}\n"], dependencies: [{ kind: "ngmodule", type: FsChipModule }, { kind: "component", type: i1$4.FsChipComponent, selector: "fs-chip", inputs: ["selectable", "removable", "value", "maxWidth", "width", "backgroundColor", "borderColor", "color", "shape", "outlined", "outlineDash", "icon", "image", "selected", "disabled", "padding", "contrastColor", "size"], outputs: ["selectedToggled", "removed", "click"] }, { kind: "ngmodule", type: FsFilterModule }, { kind: "component", type: i2.FilterComponent, selector: "fs-filter", inputs: ["config"], outputs: ["closed", "opened", "ready"] }, { kind: "ngmodule", type: FsSkeletonModule }, { kind: "directive", type: i4.FsSkeletonContentDirective, selector: "[fsSkeleton]", inputs: ["fsSkeleton", "fsSkeletonPattern"] }, { kind: "ngmodule", type: FsTreeModule }, { kind: "component", type: i4$1.FsTreeComponent, selector: "fs-tree", inputs: ["config"] }, { kind: "directive", type: i4$1.FsTreeNodeDirective, selector: "[fsTreeNode]", inputs: ["class"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FsAiReportsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fs-ai-reports', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [
+                        FsChipModule,
                         FsFilterModule,
                         FsSkeletonModule,
                         FsTreeModule,
                         MatIconModule,
                         RouterLink,
-                    ], template: "<fs-filter [config]=\"filterConfig\"></fs-filter>\n\n<ng-container *fsSkeleton=\"nodes()\">\n  <fs-tree [config]=\"treeConfig\">\n    <ng-template\n        fsTreeNode\n        let-data=\"data\">\n      <div class=\"fs-row.gap-sm.align-center node-row\">\n        <mat-icon class=\"node-icon\">\n          {{ data.type === nodeType.Folder ? 'folder' : 'insert_chart_outlined' }}\n        </mat-icon>\n\n        @if (data.type === nodeType.Folder) {\n          <span class=\"node-name\">{{ data.name }}</span>\n        } @else if (isDeleted(data.report)) {\n          <!-- A deleted report can't be opened (the backend only assembles\n               active ones), so in Show Deleted mode the name is plain text \u2014\n               restore it from the row menu first. -->\n          <span class=\"node-name\">{{ data.name }}</span>\n        } @else {\n          <a\n              class=\"node-name\"\n              [routerLink]=\"openLink(data.report)\">\n            {{ data.name }}\n          </a>\n        }\n      </div>\n    </ng-template>\n  </fs-tree>\n\n  @if (!nodes().length) {\n    <p class=\"small tree-empty\">\n      No reports yet. Create one, or add a folder to group them.\n    </p>\n  }\n</ng-container>\n", styles: ["a{cursor:pointer}fs-tree .node>.container{flex:1;min-width:0}fs-tree .node>.container>.content{min-width:0}fs-tree .node>.container>button{margin-top:-5px}.node-row{min-width:0}.node-icon{font-size:18px;width:18px;height:18px;flex:none}.node-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tree-empty{margin-top:10px}\n"] }]
+                    ], template: "<fs-filter [config]=\"filterConfig\"></fs-filter>\n\n<ng-container *fsSkeleton=\"nodes()\">\n  <fs-tree [config]=\"treeConfig\">\n    <ng-template\n        fsTreeNode\n        let-data=\"data\">\n      <div\n          class=\"fs-row.gap-sm.align-center node-row\"\n          [class.deleted]=\"data.deleted\">\n        <mat-icon class=\"node-icon\">\n          {{ data.type === nodeType.Folder ? 'folder' : 'insert_chart_outlined' }}\n        </mat-icon>\n\n        @if (data.type === nodeType.Folder || data.deleted) {\n          <!-- A deleted report can't be opened (the backend only assembles\n               live ones, and one under a deleted folder is not on the live\n               listing), so in Show Deleted mode the name is plain text \u2014\n               restore it from the row menu first. -->\n          <span class=\"node-name\">{{ data.name }}</span>\n        } @else {\n          <a\n              class=\"node-name\"\n              [routerLink]=\"openLink(data.report)\">\n            {{ data.name }}\n          </a>\n        }\n\n        <!-- Only on the row somebody deleted. Everything under a deleted\n             folder is muted with it, but was not deleted itself. -->\n        @if (data.stateDeleted) {\n          <fs-chip size=\"tiny\">Deleted</fs-chip>\n        }\n      </div>\n    </ng-template>\n  </fs-tree>\n\n  @if (!nodes().length) {\n    <p class=\"small tree-empty\">\n      No reports yet. Create one, or add a folder to group them.\n    </p>\n  }\n</ng-container>\n", styles: ["a{cursor:pointer}fs-tree .node>.container{flex:1;min-width:0}fs-tree .node>.container>.content{min-width:0}fs-tree .node>.container>button{margin-top:-5px}.node-row{min-width:0}.node-row.deleted{opacity:.55}.node-icon{font-size:18px;width:18px;height:18px;flex:none}.node-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tree-empty{margin-top:10px}\n"] }]
         }], ctorParameters: () => [] });
 
 // A single report: the AI chat on the left, the report canvas on the right,
@@ -6438,8 +6543,8 @@ class FsAiReportComponent {
             ReportPdfService,
             ReportExportService,
             // Tree-shaken ECharts core + the 'report' house theme, loaded lazily.
-            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-Dg5PjbjT.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      <!-- What layout editing can add or switch to, and the way out of it.\n           One style for all three \u2014 outlined, icon and text. \"Header & footer\"\n           is a toggle: it keeps its label and turns gray while it is on. -->\n      @if (editMode) {\n        <div class=\"fs-ai-report__edit-tools fs-row.align-center.gap-xs\">\n          <button\n              mat-stroked-button\n              type=\"button\"\n              matTooltip=\"Add a block of text\"\n              (click)=\"addText()\">\n            <mat-icon>title</mat-icon>\n            Add text\n          </button>\n          <button\n              mat-stroked-button\n              type=\"button\"\n              class=\"fs-ai-report__master\"\n              [class.active]=\"isMasterMode\"\n              [matTooltip]=\"isMasterMode ? 'Back to editing this page' : 'Edit the header and footer shown on every page'\"\n              (click)=\"toggleMasterMode()\">\n            <mat-icon>web_asset</mat-icon>\n            Header & footer\n          </button>\n          <button\n              mat-stroked-button\n              type=\"button\"\n              (click)=\"toggleEditMode()\">\n            <mat-icon>check</mat-icon>\n            Done editing\n          </button>\n        </div>\n      }\n\n      <!-- One icon for both states: it reads as pressed while editing rather\n           than swapping to something else. -->\n      <button\n          mat-icon-button\n          type=\"button\"\n          class=\"fs-ai-report__toggle\"\n          [class.active]=\"editMode\"\n          [matTooltip]=\"editMode ? 'Done editing' : 'Edit layout'\"\n          (click)=\"toggleEditMode()\">\n        <mat-icon>dashboard_customize</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]=\"chatRequestData()\"\n        [ready]=\"chatPageId() !== null\"\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            [pageId]=\"pageId\"\n            (componentSettings)=\"componentSettings($event)\"\n            (reportChanged)=\"onCanvasReportChanged()\"\n            (pageChanged)=\"onCanvasPageChanged($event)\">\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__toggle.active{background:#e3ecf7;color:var(--brand-primary-color, #2196f3)}.fs-ai-report__master.active{background:#eceff3}.fs-ai-report__edit-tools{margin:0 5px}.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$1.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass", "buttonType", "buttonColor"], outputs: ["opened", "closed"] }, { kind: "directive", type: i2$1.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }, { kind: "directive", type: i2$1.FsMenuTriggerDirective, selector: "[fsMenuTriggerFor]", inputs: ["fsMenuTriggerFor"] }, { kind: "component", type: FsAiChatComponent, selector: "fs-ai-chat", inputs: ["basePath", "requestData", "ready", "introMessage", "showThinking"], outputs: ["response", "showThinkingChange"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3$4.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i3$4.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4$1.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", "pageId"], outputs: ["componentSettings", "reportChanged", "pageChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-D4xJt3zs.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      <!-- What layout editing can add or switch to, and the way out of it.\n           One style for all three \u2014 outlined, icon and text. \"Header & footer\"\n           is a toggle: it keeps its label and turns gray while it is on. -->\n      @if (editMode) {\n        <div class=\"fs-ai-report__edit-tools fs-row.align-center.gap-xs\">\n          <button\n              mat-stroked-button\n              type=\"button\"\n              matTooltip=\"Add a block of text\"\n              (click)=\"addText()\">\n            <mat-icon>title</mat-icon>\n            Add text\n          </button>\n          <button\n              mat-stroked-button\n              type=\"button\"\n              class=\"fs-ai-report__master\"\n              [class.active]=\"isMasterMode\"\n              [matTooltip]=\"isMasterMode ? 'Back to editing this page' : 'Edit the header and footer shown on every page'\"\n              (click)=\"toggleMasterMode()\">\n            <mat-icon>web_asset</mat-icon>\n            Header & footer\n          </button>\n          <button\n              mat-stroked-button\n              type=\"button\"\n              (click)=\"toggleEditMode()\">\n            <mat-icon>check</mat-icon>\n            Done editing\n          </button>\n        </div>\n      }\n\n      <!-- One icon for both states: it reads as pressed while editing rather\n           than swapping to something else. -->\n      <button\n          mat-icon-button\n          type=\"button\"\n          class=\"fs-ai-report__toggle\"\n          [class.active]=\"editMode\"\n          [matTooltip]=\"editMode ? 'Done editing' : 'Edit layout'\"\n          (click)=\"toggleEditMode()\">\n        <mat-icon>dashboard_customize</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]=\"chatRequestData()\"\n        [ready]=\"chatPageId() !== null\"\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            [pageId]=\"pageId\"\n            (componentSettings)=\"componentSettings($event)\"\n            (reportChanged)=\"onCanvasReportChanged()\"\n            (pageChanged)=\"onCanvasPageChanged($event)\">\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__toggle.active{background:#e3ecf7;color:var(--brand-primary-color, #2196f3)}.fs-ai-report__master.active{background:#eceff3}.fs-ai-report__edit-tools{margin:0 5px}.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$1.FsMenuComponent, selector: "fs-menu", inputs: ["class", "buttonClass", "buttonType", "buttonColor"], outputs: ["opened", "closed"] }, { kind: "directive", type: i2$1.FsMenuItemDirective, selector: "fs-menu-group,[fs-menu-item]" }, { kind: "directive", type: i2$1.FsMenuTriggerDirective, selector: "[fsMenuTriggerFor]", inputs: ["fsMenuTriggerFor"] }, { kind: "component", type: FsAiChatComponent, selector: "fs-ai-chat", inputs: ["basePath", "requestData", "ready", "introMessage", "showThinking"], outputs: ["response", "showThinkingChange"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3$3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i3$3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5$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", "pageId"], outputs: ["componentSettings", "reportChanged", "pageChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: FsAiReportComponent, decorators: [{
             type: Component,
@@ -6452,7 +6557,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         ReportPdfService,
                         ReportExportService,
                         // Tree-shaken ECharts core + the 'report' house theme, loaded lazily.
-                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-Dg5PjbjT.mjs').then((module) => module.default) }),
+                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-D4xJt3zs.mjs').then((module) => module.default) }),
                     ], imports: [
                         FsFilterModule,
                         FsMenuModule,
@@ -6485,5 +6590,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-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-JORFp_xa.mjs.map
+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 };
+//# sourceMappingURL=firestitch-report-firestitch-report-DY8HwvAU.mjs.map