@firestitch/report 18.0.20 → 18.0.22

package/fesm2022/{firestitch-report-firestitch-report-D5cx4IJg.mjs → firestitch-report-firestitch-report-D9XMKkVT.mjs}

@@ -131,8 +131,9 @@ class ReportData {
             ...config,
         });
     }
-    // Report settings: any subset of { name, pageSize, pageOrientation, layout,
+    // Report settings: any subset of { name, pageWidth, pageHeight, layout,
     // styles } — styles carry the report's typographic config (e.g. heading size).
+    // The page size is in inches and width/height go together.
     update(reportId, settings, config = {}) {
         return this._api.put(this._path(`${reportId}`), settings, {
             key: 'report',
@@ -388,6 +389,14 @@ function pageGeometry(report, page) {
     }
     return geometry;
 }
+// Bounds for a page dimension, in inches. Mirrors ReportModel::PAGE_DIMENSION_MIN
+// / MAX on the server, which is the enforcing side — these drive the field-level
+// message so the operator sees the limit before submitting. The ceiling is set by
+// PowerPoint, not by the canvas: ECMA-376 caps a slide at 56 inches, and a .pptx
+// over that is refused on open, so a page is not allowed to be sized past what it
+// can be exported as.
+const PAGE_DIMENSION_MIN = 1;
+const PAGE_DIMENSION_MAX = 50;
 
 // 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
@@ -528,6 +537,36 @@ function selectQueryValues(raw) {
     return String(raw).split(',');
 }
 
+// Whether two stored filter-group defaults are the same. Compared on the fields a
+// default can actually carry, so key order in the payload can't read as a change.
+function sameDefault(a, b) {
+    if (!a || !b) {
+        return !a && !b;
+    }
+    return a.start === b.start
+        && a.end === b.end
+        && a.value === b.value
+        && a.relative === b.relative
+        && (a.values ?? []).length === (b.values ?? []).length
+        && (a.values ?? []).every((value, index) => value === (b.values ?? [])[index]);
+}
+// A stable signature for a group's stored default. The report toolbar keys its
+// fs-filter on this, because fs-filter reads its config once at init — without a
+// key change it keeps rendering the values it was created with even after the
+// config behind it has been rebuilt.
+function defaultSignature(group) {
+    const groupDefault = group.config?.default;
+    if (!groupDefault) {
+        return '';
+    }
+    return [
+        groupDefault.start ?? '',
+        groupDefault.end ?? '',
+        groupDefault.value ?? '',
+        groupDefault.relative ?? '',
+        (groupDefault.values ?? []).join(','),
+    ].join('~');
+}
 // Session filter state for the open report. Filter VALUES are never persisted
 // — this service holds them per filter GROUP (the propagation unit), resolves
 // them into per-component member-filter values for each data request, and
@@ -551,18 +590,28 @@ class ReportFilterStateService {
     _changed$ = new Subject();
     // Seed groups + their defaults when a report loads. Existing session values
     // for still-existing groups survive a structure re-fetch (a chat edit
-    // shouldn't reset the viewer's filters).
+    // shouldn't reset the viewer's filters) — UNLESS the group's stored default
+    // itself changed, which only happens when an operator saved a new default in
+    // report settings. That is an explicit instruction to re-seed, so it wins over
+    // the surviving session value; without it the bar keeps showing whatever it was
+    // first seeded with until a full page reload.
     init(report) {
-        this._groups.clear();
+        const previousGroups = this._groups;
+        this._groups = new Map();
         const validIds = new Set();
         for (const group of report.filterGroups ?? []) {
             this._groups.set(group.id, group);
             validIds.add(group.id);
-            if (!this._values.has(group.id)) {
+            const defaultChanged = !sameDefault(previousGroups.get(group.id)?.config?.default ?? null, group.config?.default ?? null);
+            if (!this._values.has(group.id) || defaultChanged) {
                 const defaultValue = this._defaultValue(group);
                 if (defaultValue) {
                     this._values.set(group.id, defaultValue);
                 }
+                else if (defaultChanged) {
+                    // The default was cleared, so the value it seeded goes with it.
+                    this._values.delete(group.id);
+                }
             }
         }
         for (const groupId of [...this._values.keys()]) {
@@ -2378,7 +2427,7 @@ function dateToBound(value) {
 }
 
 // Report settings, in three tabs:
-//   Settings — name + page setup (size, orientation, layout mode).
+//   Settings — name + page setup (size in inches, layout mode).
 //   Styles   — the report's typographic styles (sizes in POINTS, 1:1 with
 //   PDF/PowerPoint); the Heading size to start.
 //   Filters  — the report-level filters and their DEFAULT values. A default
@@ -2389,8 +2438,13 @@ function dateToBound(value) {
 class ReportSettingsComponent {
     selectedTab = 'settings';
     name = '';
-    pageSize = 'widescreen';
-    pageOrientation = 'landscape';
+    // The page in inches. No initializer: every report carries a size, and
+    // ngOnInit seeds both before the tab renders, so a placeholder here could only
+    // ever be a wrong number briefly showing as the operator's own.
+    pageWidth;
+    pageHeight;
+    pageDimensionMin = PAGE_DIMENSION_MIN;
+    pageDimensionMax = PAGE_DIMENSION_MAX;
     layout = 'freeform';
     // Empty until the report has one; app-timezone-select then defaults it to the
     // viewer's browser zone (which Save persists, making the report's zone explicit).
@@ -2407,8 +2461,8 @@ class ReportSettingsComponent {
     ngOnInit() {
         const report = this._data.report;
         this.name = report.name;
-        this.pageSize = report.pageSize;
-        this.pageOrientation = report.pageOrientation;
+        this.pageWidth = report.pageWidth;
+        this.pageHeight = report.pageHeight;
         this.layout = report.layout ?? 'freeform';
         this.timezone = report.timezone ?? '';
         this.headingSize = report.config?.styles?.heading?.size ?? DEFAULT_HEADING_SIZE;
@@ -2435,8 +2489,8 @@ class ReportSettingsComponent {
         // result, re-seeding the bar from the new defaults.
         const settings$ = this._reportData.update(reportId, {
             name: this.name,
-            pageSize: this.pageSize,
-            pageOrientation: this.pageOrientation,
+            pageWidth: this.pageWidth,
+            pageHeight: this.pageHeight,
             layout: this.layout,
             timezone: this.timezone,
             styles: { heading: { size: this.headingSize } },
@@ -2546,7 +2600,7 @@ class ReportSettingsComponent {
         return Object.keys(normalized).length ? normalized : null;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportSettingsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ReportSettingsComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<form\n    fsForm\n    [submit]=\"save\">\n  <fs-dialog>\n    <h1 mat-dialog-title>\n      Report Settings\n    </h1>\n    <mat-dialog-content>\n      <mat-tab-group [(selected)]=\"selectedTab\">\n        <mat-tab\n            label=\"Settings\"\n            name=\"settings\">\n          <div class=\"fs-column tab-body\">\n            <mat-form-field>\n              <mat-label>\n                Name\n              </mat-label>\n              <input\n                matInput\n                [(ngModel)]=\"name\"\n                name=\"name\"\n                [fsFormRequired]=\"true\">\n            </mat-form-field>\n            <mat-form-field>\n              <mat-label>\n                Page Size\n              </mat-label>\n              <mat-select\n                  [(ngModel)]=\"pageSize\"\n                  name=\"pageSize\">\n                <mat-option value=\"widescreen\">\n                  Widescreen (13.33\" \u00D7 7.5\")\n                </mat-option>\n                <mat-option value=\"letter\">\n                  Letter (11\" \u00D7 8.5\")\n                </mat-option>\n              </mat-select>\n            </mat-form-field>\n            <mat-form-field>\n              <mat-label>\n                Orientation\n              </mat-label>\n              <mat-select\n                  [(ngModel)]=\"pageOrientation\"\n                  name=\"pageOrientation\">\n                <mat-option value=\"landscape\">\n                  Landscape\n                </mat-option>\n                <mat-option value=\"portrait\">\n                  Portrait\n                </mat-option>\n              </mat-select>\n            </mat-form-field>\n            <mat-form-field>\n              <mat-label>\n                Layout\n              </mat-label>\n              <mat-select\n                  [(ngModel)]=\"layout\"\n                  name=\"layout\">\n                <mat-option value=\"freeform\">\n                  Freeform \u2014 position components anywhere on the page\n                </mat-option>\n                <mat-option value=\"flow\">\n                  Flow \u2014 components flow into rows by width %\n                </mat-option>\n              </mat-select>\n              <mat-hint>\n                Freeform is like PowerPoint; Flow is like a responsive dashboard.\n              </mat-hint>\n            </mat-form-field>\n            <fs-ai-report-timezone-select [(timezone)]=\"timezone\"></fs-ai-report-timezone-select>\n          </div>\n        </mat-tab>\n        <mat-tab\n            label=\"Styles\"\n            name=\"styles\">\n          <div class=\"fs-column tab-body\">\n            <mat-form-field>\n              <mat-label>\n                Heading Size\n              </mat-label>\n              <input\n                matInput\n                type=\"number\"\n                step=\"1\"\n                min=\"6\"\n                max=\"96\"\n                [(ngModel)]=\"headingSize\"\n                name=\"headingSize\"\n                [fsFormMin]=\"6\"\n                [fsFormMax]=\"96\">\n              <span matTextSuffix>\n                pt\n              </span>\n              <mat-hint>\n                Applies to component titles. Points map 1:1 to PDF and PowerPoint.\n              </mat-hint>\n            </mat-form-field>\n          </div>\n        </mat-tab>\n        <mat-tab\n            label=\"Filters\"\n            name=\"filters\">\n          <div class=\"fs-column tab-body\">\n            @if (filterRows().length) {\n              @for (row of filterRows(); track row.group.id) {\n                @switch (row.group.type) {\n                  @case ('dateRange') {\n                    <div class=\"fs-row.gap-sm.align-center fs-flex\">\n                      <mat-form-field class=\"fs-flex\">\n                        <mat-label>\n                          Default From {{ row.label }}\n                        </mat-label>\n                        <input\n                          matInput\n                          fsDatePicker\n                          [(ngModel)]=\"row.start\"\n                          [name]=\"'start' + row.group.id\">\n                      </mat-form-field>\n                      <mat-form-field class=\"fs-flex\">\n                        <mat-label>\n                          Default To {{ row.label }}\n                        </mat-label>\n                        <input\n                          matInput\n                          fsDatePicker\n                          [(ngModel)]=\"row.end\"\n                          [name]=\"'end' + row.group.id\">\n                      </mat-form-field>\n                    </div>\n                  }\n                  @case ('select') {\n                    <fs-autocomplete-chips\n                        class=\"fs-flex\"\n                        [label]=\"'Default ' + row.label\"\n                        [fetch]=\"row.fetch\"\n                        [(ngModel)]=\"row.values\"\n                        [name]=\"'values' + row.group.id\"\n                        [multiple]=\"true\"\n                        [fetchOnFocus]=\"true\">\n                      <ng-template\n                          fsAutocompleteChipsTemplate\n                          let-object=\"object\">\n                        {{ object.name }}\n                      </ng-template>\n                    </fs-autocomplete-chips>\n                  }\n                  @default {\n                    <mat-form-field class=\"fs-flex\">\n                      <mat-label>\n                        Default {{ row.label }}\n                      </mat-label>\n                      <input\n                        matInput\n                        [(ngModel)]=\"row.value\"\n                        [name]=\"'value' + row.group.id\">\n                    </mat-form-field>\n                  }\n                }\n              }\n            } @else {\n              <fs-message-info>\n                This report has no report-level filters yet. Add a filter to a\n                component (its settings \u2192 Filters) and show it in the report bar,\n                then set its default here.\n              </fs-message-info>\n            }\n          </div>\n        </mat-tab>\n      </mat-tab-group>\n    </mat-dialog-content>\n    <mat-dialog-actions>\n      <fs-form-dialog-actions>\n        <button\n            type=\"button\"\n            mat-button\n            color=\"warn\"\n            (click)=\"delete()\">\n          Delete\n        </button>\n      </fs-form-dialog-actions>\n    </mat-dialog-actions>\n  </fs-dialog>\n</form>", styles: ["mat-form-field{width:100%}.tab-body{padding-top:16px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FsFormModule }, { kind: "directive", type: i2$1.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "dirtySubmitButton", "submit", "successDelay", "errorDelay", "deactivationGuard"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"], exportAs: ["fsForm"] }, { kind: "directive", type: i2$1.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { kind: "directive", type: i2$1.FsFormMinDirective, selector: "[fsFormMin]", inputs: ["fsFormMin", "fsFormMinMessage"] }, { kind: "directive", type: i2$1.FsFormMaxDirective, selector: "[fsFormMax]", inputs: ["fsFormMax", "fsFormMaxMessage"] }, { kind: "component", type: i2$1.FsFormDialogActionsComponent, selector: "fs-form-dialog-actions", inputs: ["save", "create", "close", "done", "closeData", "name"] }, { kind: "directive", type: i2$1.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: i2$1.FsButtonDirective, selector: "[mat-raised-button],[mat-button],[mat-flat-button],[mat-stroked-button]", inputs: ["name", "dirtySubmit"] }, { kind: "ngmodule", type: FsDialogModule }, { kind: "component", type: i3.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileButtonPlacement", "mobileWidth", "mode", "buttonLayout"] }, { kind: "ngmodule", type: FsMessageModule }, { kind: "component", type: i4.FsMessageInfoComponent, selector: "fs-message-info" }, { kind: "ngmodule", type: FsTabsModule }, { kind: "directive", type: i5.FsTabsHeaderTabGroupDirective, selector: "mat-tab-group, matTabGroup, [matTabGroup]", inputs: ["orientation", "selected", "selectedData"], outputs: ["selectedChange", "selectedDataChange"], exportAs: ["fsTabsHeaderTabGroup"] }, { kind: "directive", type: i5.FsTabsTabDirective, selector: "mat-tab,matTab", inputs: ["name", "data"], exportAs: ["fsTabsTab"] }, { kind: "ngmodule", type: FsDatePickerModule }, { kind: "component", type: i6.FsDatePickerComponent, selector: "[fsDatePicker]", inputs: ["minYear", "maxYear", "minDate", "maxDate", "startOfDay", "view", "format", "minutes", "width"], outputs: ["change"] }, { 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: "ngmodule", type: MatTabsModule }, { kind: "component", type: i5$1.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass"], exportAs: ["matTab"] }, { kind: "component", type: i5$1.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: MatOption$1, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: TimezoneSelectComponent, selector: "fs-ai-report-timezone-select", inputs: ["placeholder", "required", "disabled", "timezone"], outputs: ["timezoneChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ReportSettingsComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: "<form\n    fsForm\n    [submit]=\"save\">\n  <fs-dialog>\n    <h1 mat-dialog-title>\n      Report Settings\n    </h1>\n    <mat-dialog-content>\n      <mat-tab-group [(selected)]=\"selectedTab\">\n        <mat-tab\n            label=\"Settings\"\n            name=\"settings\">\n          <div class=\"fs-column tab-body\">\n            <mat-form-field>\n              <mat-label>\n                Name\n              </mat-label>\n              <input\n                matInput\n                [(ngModel)]=\"name\"\n                name=\"name\"\n                [fsFormRequired]=\"true\">\n            </mat-form-field>\n            <!--\n              The page, typed in inches. Orientation is not asked for because it\n              is not an independent choice - a page wider than it is tall IS\n              landscape - so the two numbers say everything there is to say.\n            -->\n            <div class=\"fs-row.gap-sm\">\n              <mat-form-field class=\"fs-flex\">\n                <mat-label>\n                  Width\n                </mat-label>\n                <input\n                    matInput\n                    type=\"number\"\n                    step=\"0.1\"\n                    [(ngModel)]=\"pageWidth\"\n                    name=\"pageWidth\"\n                    [fsFormRequired]=\"true\"\n                    [fsFormMin]=\"pageDimensionMin\"\n                    [fsFormMax]=\"pageDimensionMax\">\n                <span matTextSuffix>\n                  inches\n                </span>\n              </mat-form-field>\n              <mat-form-field class=\"fs-flex\">\n                <mat-label>\n                  Height\n                </mat-label>\n                <input\n                    matInput\n                    type=\"number\"\n                    step=\"0.1\"\n                    [(ngModel)]=\"pageHeight\"\n                    name=\"pageHeight\"\n                    [fsFormRequired]=\"true\"\n                    [fsFormMin]=\"pageDimensionMin\"\n                    [fsFormMax]=\"pageDimensionMax\">\n                <span matTextSuffix>\n                  inches\n                </span>\n              </mat-form-field>\n            </div>\n            <mat-form-field>\n              <mat-label>\n                Layout\n              </mat-label>\n              <mat-select\n                  [(ngModel)]=\"layout\"\n                  name=\"layout\">\n                <mat-option value=\"freeform\">\n                  Freeform \u2014 position components anywhere on the page\n                </mat-option>\n                <mat-option value=\"flow\">\n                  Flow \u2014 components flow into rows by width %\n                </mat-option>\n              </mat-select>\n              <mat-hint>\n                Freeform is like PowerPoint; Flow is like a responsive dashboard.\n              </mat-hint>\n            </mat-form-field>\n            <fs-ai-report-timezone-select [(timezone)]=\"timezone\"></fs-ai-report-timezone-select>\n          </div>\n        </mat-tab>\n        <mat-tab\n            label=\"Styles\"\n            name=\"styles\">\n          <div class=\"fs-column tab-body\">\n            <mat-form-field>\n              <mat-label>\n                Heading Size\n              </mat-label>\n              <input\n                matInput\n                type=\"number\"\n                step=\"1\"\n                min=\"6\"\n                max=\"96\"\n                [(ngModel)]=\"headingSize\"\n                name=\"headingSize\"\n                [fsFormMin]=\"6\"\n                [fsFormMax]=\"96\">\n              <span matTextSuffix>\n                pt\n              </span>\n              <mat-hint>\n                Applies to component titles. Points map 1:1 to PDF and PowerPoint.\n              </mat-hint>\n            </mat-form-field>\n          </div>\n        </mat-tab>\n        <mat-tab\n            label=\"Filters\"\n            name=\"filters\">\n          <div class=\"fs-column tab-body\">\n            @if (filterRows().length) {\n              @for (row of filterRows(); track row.group.id) {\n                @switch (row.group.type) {\n                  @case ('dateRange') {\n                    <div class=\"fs-row.gap-sm.align-center fs-flex\">\n                      <mat-form-field class=\"fs-flex\">\n                        <mat-label>\n                          Default From {{ row.label }}\n                        </mat-label>\n                        <input\n                          matInput\n                          fsDatePicker\n                          [(ngModel)]=\"row.start\"\n                          [name]=\"'start' + row.group.id\">\n                      </mat-form-field>\n                      <mat-form-field class=\"fs-flex\">\n                        <mat-label>\n                          Default To {{ row.label }}\n                        </mat-label>\n                        <input\n                          matInput\n                          fsDatePicker\n                          [(ngModel)]=\"row.end\"\n                          [name]=\"'end' + row.group.id\">\n                      </mat-form-field>\n                    </div>\n                  }\n                  @case ('select') {\n                    <fs-autocomplete-chips\n                        class=\"fs-flex\"\n                        [label]=\"'Default ' + row.label\"\n                        [fetch]=\"row.fetch\"\n                        [(ngModel)]=\"row.values\"\n                        [name]=\"'values' + row.group.id\"\n                        [multiple]=\"true\"\n                        [fetchOnFocus]=\"true\">\n                      <ng-template\n                          fsAutocompleteChipsTemplate\n                          let-object=\"object\">\n                        {{ object.name }}\n                      </ng-template>\n                    </fs-autocomplete-chips>\n                  }\n                  @default {\n                    <mat-form-field class=\"fs-flex\">\n                      <mat-label>\n                        Default {{ row.label }}\n                      </mat-label>\n                      <input\n                        matInput\n                        [(ngModel)]=\"row.value\"\n                        [name]=\"'value' + row.group.id\">\n                    </mat-form-field>\n                  }\n                }\n              }\n            } @else {\n              <fs-message-info>\n                This report has no report-level filters yet. Add a filter to a\n                component (its settings \u2192 Filters) and show it in the report bar,\n                then set its default here.\n              </fs-message-info>\n            }\n          </div>\n        </mat-tab>\n      </mat-tab-group>\n    </mat-dialog-content>\n    <mat-dialog-actions>\n      <fs-form-dialog-actions>\n        <button\n            type=\"button\"\n            mat-button\n            color=\"warn\"\n            (click)=\"delete()\">\n          Delete\n        </button>\n      </fs-form-dialog-actions>\n    </mat-dialog-actions>\n  </fs-dialog>\n</form>", styles: ["mat-form-field{width:100%}.tab-body{padding-top:16px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FsFormModule }, { kind: "directive", type: i2$1.FsFormDirective, selector: "[fsForm]", inputs: ["wrapperSelector", "messageSelector", "hintSelector", "labelSelector", "autocomplete", "shortcuts", "confirm", "confirmDialog", "confirmDrawer", "confirmBrowser", "dirtySubmitButton", "submit", "successDelay", "errorDelay", "deactivationGuard"], outputs: ["fsForm", "invalid", "valid", "submitted", "reseted", "cleared"], exportAs: ["fsForm"] }, { kind: "directive", type: i2$1.FsFormRequiredDirective, selector: "[fsFormRequired],[ngModel][required]", inputs: ["fsFormRequired", "required", "fsFormRequiredMessage"] }, { kind: "directive", type: i2$1.FsFormMinDirective, selector: "[fsFormMin]", inputs: ["fsFormMin", "fsFormMinMessage"] }, { kind: "directive", type: i2$1.FsFormMaxDirective, selector: "[fsFormMax]", inputs: ["fsFormMax", "fsFormMaxMessage"] }, { kind: "component", type: i2$1.FsFormDialogActionsComponent, selector: "fs-form-dialog-actions", inputs: ["save", "create", "close", "done", "closeData", "name"] }, { kind: "directive", type: i2$1.FsFormNoFsValidatorsDirective, selector: "[ngModel]:not([required]):not([fsFormRequired]):not([fsFormCompare]):not([fsFormDateRange]):not([fsFormEmail]):not([fsFormEmails]):not([fsFormFunction]):not([fsFormGreater]):not([fsFormGreaterEqual]):not([fsFormInteger]):not([fsFormLesser]):not([fsFormMax]):not([fsFormMaxLength]):not([fsFormMin]):not([fsFormMinLength]):not([fsFormNumeric]):not([fsFormPattern]):not([fsFormPhone]):not([fsFormUrl]):not([validate])" }, { kind: "directive", type: i2$1.FsButtonDirective, selector: "[mat-raised-button],[mat-button],[mat-flat-button],[mat-stroked-button]", inputs: ["name", "dirtySubmit"] }, { kind: "ngmodule", type: FsDialogModule }, { kind: "component", type: i3.FsDialogComponent, selector: "fs-dialog", inputs: ["mobileMode", "mobileButtonPlacement", "mobileWidth", "mode", "buttonLayout"] }, { kind: "ngmodule", type: FsMessageModule }, { kind: "component", type: i4.FsMessageInfoComponent, selector: "fs-message-info" }, { kind: "ngmodule", type: FsTabsModule }, { kind: "directive", type: i5.FsTabsHeaderTabGroupDirective, selector: "mat-tab-group, matTabGroup, [matTabGroup]", inputs: ["orientation", "selected", "selectedData"], outputs: ["selectedChange", "selectedDataChange"], exportAs: ["fsTabsHeaderTabGroup"] }, { kind: "directive", type: i5.FsTabsTabDirective, selector: "mat-tab,matTab", inputs: ["name", "data"], exportAs: ["fsTabsTab"] }, { kind: "ngmodule", type: FsDatePickerModule }, { kind: "component", type: i6.FsDatePickerComponent, selector: "[fsDatePicker]", inputs: ["minYear", "maxYear", "minDate", "maxDate", "startOfDay", "view", "format", "minutes", "width"], outputs: ["change"] }, { 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: "ngmodule", type: MatTabsModule }, { kind: "component", type: i5$1.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass"], exportAs: ["matTab"] }, { kind: "component", type: i5$1.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "component", type: MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: MatOption$1, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: TimezoneSelectComponent, selector: "fs-ai-report-timezone-select", inputs: ["placeholder", "required", "disabled", "timezone"], outputs: ["timezoneChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ReportSettingsComponent, decorators: [{
             type: Component,
@@ -2571,7 +2625,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         MatSelect,
                         MatOption$1,
                         TimezoneSelectComponent,
-                    ], template: "<form\n    fsForm\n    [submit]=\"save\">\n  <fs-dialog>\n    <h1 mat-dialog-title>\n      Report Settings\n    </h1>\n    <mat-dialog-content>\n      <mat-tab-group [(selected)]=\"selectedTab\">\n        <mat-tab\n            label=\"Settings\"\n            name=\"settings\">\n          <div class=\"fs-column tab-body\">\n            <mat-form-field>\n              <mat-label>\n                Name\n              </mat-label>\n              <input\n                matInput\n                [(ngModel)]=\"name\"\n                name=\"name\"\n                [fsFormRequired]=\"true\">\n            </mat-form-field>\n            <mat-form-field>\n              <mat-label>\n                Page Size\n              </mat-label>\n              <mat-select\n                  [(ngModel)]=\"pageSize\"\n                  name=\"pageSize\">\n                <mat-option value=\"widescreen\">\n                  Widescreen (13.33\" \u00D7 7.5\")\n                </mat-option>\n                <mat-option value=\"letter\">\n                  Letter (11\" \u00D7 8.5\")\n                </mat-option>\n              </mat-select>\n            </mat-form-field>\n            <mat-form-field>\n              <mat-label>\n                Orientation\n              </mat-label>\n              <mat-select\n                  [(ngModel)]=\"pageOrientation\"\n                  name=\"pageOrientation\">\n                <mat-option value=\"landscape\">\n                  Landscape\n                </mat-option>\n                <mat-option value=\"portrait\">\n                  Portrait\n                </mat-option>\n              </mat-select>\n            </mat-form-field>\n            <mat-form-field>\n              <mat-label>\n                Layout\n              </mat-label>\n              <mat-select\n                  [(ngModel)]=\"layout\"\n                  name=\"layout\">\n                <mat-option value=\"freeform\">\n                  Freeform \u2014 position components anywhere on the page\n                </mat-option>\n                <mat-option value=\"flow\">\n                  Flow \u2014 components flow into rows by width %\n                </mat-option>\n              </mat-select>\n              <mat-hint>\n                Freeform is like PowerPoint; Flow is like a responsive dashboard.\n              </mat-hint>\n            </mat-form-field>\n            <fs-ai-report-timezone-select [(timezone)]=\"timezone\"></fs-ai-report-timezone-select>\n          </div>\n        </mat-tab>\n        <mat-tab\n            label=\"Styles\"\n            name=\"styles\">\n          <div class=\"fs-column tab-body\">\n            <mat-form-field>\n              <mat-label>\n                Heading Size\n              </mat-label>\n              <input\n                matInput\n                type=\"number\"\n                step=\"1\"\n                min=\"6\"\n                max=\"96\"\n                [(ngModel)]=\"headingSize\"\n                name=\"headingSize\"\n                [fsFormMin]=\"6\"\n                [fsFormMax]=\"96\">\n              <span matTextSuffix>\n                pt\n              </span>\n              <mat-hint>\n                Applies to component titles. Points map 1:1 to PDF and PowerPoint.\n              </mat-hint>\n            </mat-form-field>\n          </div>\n        </mat-tab>\n        <mat-tab\n            label=\"Filters\"\n            name=\"filters\">\n          <div class=\"fs-column tab-body\">\n            @if (filterRows().length) {\n              @for (row of filterRows(); track row.group.id) {\n                @switch (row.group.type) {\n                  @case ('dateRange') {\n                    <div class=\"fs-row.gap-sm.align-center fs-flex\">\n                      <mat-form-field class=\"fs-flex\">\n                        <mat-label>\n                          Default From {{ row.label }}\n                        </mat-label>\n                        <input\n                          matInput\n                          fsDatePicker\n                          [(ngModel)]=\"row.start\"\n                          [name]=\"'start' + row.group.id\">\n                      </mat-form-field>\n                      <mat-form-field class=\"fs-flex\">\n                        <mat-label>\n                          Default To {{ row.label }}\n                        </mat-label>\n                        <input\n                          matInput\n                          fsDatePicker\n                          [(ngModel)]=\"row.end\"\n                          [name]=\"'end' + row.group.id\">\n                      </mat-form-field>\n                    </div>\n                  }\n                  @case ('select') {\n                    <fs-autocomplete-chips\n                        class=\"fs-flex\"\n                        [label]=\"'Default ' + row.label\"\n                        [fetch]=\"row.fetch\"\n                        [(ngModel)]=\"row.values\"\n                        [name]=\"'values' + row.group.id\"\n                        [multiple]=\"true\"\n                        [fetchOnFocus]=\"true\">\n                      <ng-template\n                          fsAutocompleteChipsTemplate\n                          let-object=\"object\">\n                        {{ object.name }}\n                      </ng-template>\n                    </fs-autocomplete-chips>\n                  }\n                  @default {\n                    <mat-form-field class=\"fs-flex\">\n                      <mat-label>\n                        Default {{ row.label }}\n                      </mat-label>\n                      <input\n                        matInput\n                        [(ngModel)]=\"row.value\"\n                        [name]=\"'value' + row.group.id\">\n                    </mat-form-field>\n                  }\n                }\n              }\n            } @else {\n              <fs-message-info>\n                This report has no report-level filters yet. Add a filter to a\n                component (its settings \u2192 Filters) and show it in the report bar,\n                then set its default here.\n              </fs-message-info>\n            }\n          </div>\n        </mat-tab>\n      </mat-tab-group>\n    </mat-dialog-content>\n    <mat-dialog-actions>\n      <fs-form-dialog-actions>\n        <button\n            type=\"button\"\n            mat-button\n            color=\"warn\"\n            (click)=\"delete()\">\n          Delete\n        </button>\n      </fs-form-dialog-actions>\n    </mat-dialog-actions>\n  </fs-dialog>\n</form>", styles: ["mat-form-field{width:100%}.tab-body{padding-top:16px}\n"] }]
+                    ], template: "<form\n    fsForm\n    [submit]=\"save\">\n  <fs-dialog>\n    <h1 mat-dialog-title>\n      Report Settings\n    </h1>\n    <mat-dialog-content>\n      <mat-tab-group [(selected)]=\"selectedTab\">\n        <mat-tab\n            label=\"Settings\"\n            name=\"settings\">\n          <div class=\"fs-column tab-body\">\n            <mat-form-field>\n              <mat-label>\n                Name\n              </mat-label>\n              <input\n                matInput\n                [(ngModel)]=\"name\"\n                name=\"name\"\n                [fsFormRequired]=\"true\">\n            </mat-form-field>\n            <!--\n              The page, typed in inches. Orientation is not asked for because it\n              is not an independent choice - a page wider than it is tall IS\n              landscape - so the two numbers say everything there is to say.\n            -->\n            <div class=\"fs-row.gap-sm\">\n              <mat-form-field class=\"fs-flex\">\n                <mat-label>\n                  Width\n                </mat-label>\n                <input\n                    matInput\n                    type=\"number\"\n                    step=\"0.1\"\n                    [(ngModel)]=\"pageWidth\"\n                    name=\"pageWidth\"\n                    [fsFormRequired]=\"true\"\n                    [fsFormMin]=\"pageDimensionMin\"\n                    [fsFormMax]=\"pageDimensionMax\">\n                <span matTextSuffix>\n                  inches\n                </span>\n              </mat-form-field>\n              <mat-form-field class=\"fs-flex\">\n                <mat-label>\n                  Height\n                </mat-label>\n                <input\n                    matInput\n                    type=\"number\"\n                    step=\"0.1\"\n                    [(ngModel)]=\"pageHeight\"\n                    name=\"pageHeight\"\n                    [fsFormRequired]=\"true\"\n                    [fsFormMin]=\"pageDimensionMin\"\n                    [fsFormMax]=\"pageDimensionMax\">\n                <span matTextSuffix>\n                  inches\n                </span>\n              </mat-form-field>\n            </div>\n            <mat-form-field>\n              <mat-label>\n                Layout\n              </mat-label>\n              <mat-select\n                  [(ngModel)]=\"layout\"\n                  name=\"layout\">\n                <mat-option value=\"freeform\">\n                  Freeform \u2014 position components anywhere on the page\n                </mat-option>\n                <mat-option value=\"flow\">\n                  Flow \u2014 components flow into rows by width %\n                </mat-option>\n              </mat-select>\n              <mat-hint>\n                Freeform is like PowerPoint; Flow is like a responsive dashboard.\n              </mat-hint>\n            </mat-form-field>\n            <fs-ai-report-timezone-select [(timezone)]=\"timezone\"></fs-ai-report-timezone-select>\n          </div>\n        </mat-tab>\n        <mat-tab\n            label=\"Styles\"\n            name=\"styles\">\n          <div class=\"fs-column tab-body\">\n            <mat-form-field>\n              <mat-label>\n                Heading Size\n              </mat-label>\n              <input\n                matInput\n                type=\"number\"\n                step=\"1\"\n                min=\"6\"\n                max=\"96\"\n                [(ngModel)]=\"headingSize\"\n                name=\"headingSize\"\n                [fsFormMin]=\"6\"\n                [fsFormMax]=\"96\">\n              <span matTextSuffix>\n                pt\n              </span>\n              <mat-hint>\n                Applies to component titles. Points map 1:1 to PDF and PowerPoint.\n              </mat-hint>\n            </mat-form-field>\n          </div>\n        </mat-tab>\n        <mat-tab\n            label=\"Filters\"\n            name=\"filters\">\n          <div class=\"fs-column tab-body\">\n            @if (filterRows().length) {\n              @for (row of filterRows(); track row.group.id) {\n                @switch (row.group.type) {\n                  @case ('dateRange') {\n                    <div class=\"fs-row.gap-sm.align-center fs-flex\">\n                      <mat-form-field class=\"fs-flex\">\n                        <mat-label>\n                          Default From {{ row.label }}\n                        </mat-label>\n                        <input\n                          matInput\n                          fsDatePicker\n                          [(ngModel)]=\"row.start\"\n                          [name]=\"'start' + row.group.id\">\n                      </mat-form-field>\n                      <mat-form-field class=\"fs-flex\">\n                        <mat-label>\n                          Default To {{ row.label }}\n                        </mat-label>\n                        <input\n                          matInput\n                          fsDatePicker\n                          [(ngModel)]=\"row.end\"\n                          [name]=\"'end' + row.group.id\">\n                      </mat-form-field>\n                    </div>\n                  }\n                  @case ('select') {\n                    <fs-autocomplete-chips\n                        class=\"fs-flex\"\n                        [label]=\"'Default ' + row.label\"\n                        [fetch]=\"row.fetch\"\n                        [(ngModel)]=\"row.values\"\n                        [name]=\"'values' + row.group.id\"\n                        [multiple]=\"true\"\n                        [fetchOnFocus]=\"true\">\n                      <ng-template\n                          fsAutocompleteChipsTemplate\n                          let-object=\"object\">\n                        {{ object.name }}\n                      </ng-template>\n                    </fs-autocomplete-chips>\n                  }\n                  @default {\n                    <mat-form-field class=\"fs-flex\">\n                      <mat-label>\n                        Default {{ row.label }}\n                      </mat-label>\n                      <input\n                        matInput\n                        [(ngModel)]=\"row.value\"\n                        [name]=\"'value' + row.group.id\">\n                    </mat-form-field>\n                  }\n                }\n              }\n            } @else {\n              <fs-message-info>\n                This report has no report-level filters yet. Add a filter to a\n                component (its settings \u2192 Filters) and show it in the report bar,\n                then set its default here.\n              </fs-message-info>\n            }\n          </div>\n        </mat-tab>\n      </mat-tab-group>\n    </mat-dialog-content>\n    <mat-dialog-actions>\n      <fs-form-dialog-actions>\n        <button\n            type=\"button\"\n            mat-button\n            color=\"warn\"\n            (click)=\"delete()\">\n          Delete\n        </button>\n      </fs-form-dialog-actions>\n    </mat-dialog-actions>\n  </fs-dialog>\n</form>", styles: ["mat-form-field{width:100%}.tab-body{padding-top:16px}\n"] }]
         }] });
 
 // The assembled report structure returned by GET /api/reports/:id — composed
@@ -2720,7 +2774,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-D4VLD05J.mjs')).default;
+    const echarts = (await import('./firestitch-report-echarts-DM9HRleW.mjs')).default;
     const host = document.createElement('div');
     host.style.width = `${width}px`;
     host.style.height = `${height}px`;
@@ -3415,7 +3469,10 @@ class ReportComponent {
     // changes, e.g. after the component settings dialog adds/moves a filter.
     get reportFilterKey() {
         return [
-            ...this._reportGroups().map((group) => `${group.id}:${group.level}:${group.label}`),
+            // The stored default is part of the signature: saving a new default in report
+            // settings rebuilds the config, but without a key change fs-filter keeps
+            // rendering the values it was created with until a full page reload.
+            ...this._reportGroups().map((group) => `${group.id}:${group.level}:${group.label}:${defaultSignature(group)}`),
             this._hasTimeSeriesChart() ? 'frequency' : '',
         ].join('|');
     }
@@ -3482,7 +3539,7 @@ class ReportComponent {
             ReportPdfService,
             // Tree-shaken ECharts core + the 'report' house theme, loaded lazily with
             // this route's chunk.
-            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-D4VLD05J.mjs').then((module) => module.default) }),
+            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-DM9HRleW.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: [{
@@ -3496,7 +3553,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         ReportPdfService,
                         // Tree-shaken ECharts core + the 'report' house theme, loaded lazily with
                         // this route's chunk.
-                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-D4VLD05J.mjs').then((module) => module.default) }),
+                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-DM9HRleW.mjs').then((module) => module.default) }),
                     ], imports: [
                         FormsModule,
                         FsAutocompleteChipsModule,
@@ -4763,7 +4820,10 @@ class FsAiReportComponent {
     // rebuilt config) whenever the report-level filter set changes.
     get reportFilterKey() {
         return [
-            ...this._reportGroups().map((group) => `${group.id}:${group.level}:${group.label}`),
+            // The stored default is part of the signature: saving a new default in report
+            // settings rebuilds the config, but without a key change fs-filter keeps
+            // rendering the values it was created with until a full page reload.
+            ...this._reportGroups().map((group) => `${group.id}:${group.level}:${group.label}:${defaultSignature(group)}`),
             this._hasTimeSeriesChart() ? 'frequency' : '',
         ].join('|');
     }
@@ -4813,7 +4873,7 @@ class FsAiReportComponent {
             ReportPptxService,
             ReportPdfService,
             // Tree-shaken ECharts core + the 'report' house theme, loaded lazily.
-            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-D4VLD05J.mjs').then((module) => module.default) }),
+            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-DM9HRleW.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: [{
@@ -4826,7 +4886,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         ReportPptxService,
                         ReportPdfService,
                         // Tree-shaken ECharts core + the 'report' house theme, loaded lazily.
-                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-D4VLD05J.mjs').then((module) => module.default) }),
+                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-DM9HRleW.mjs').then((module) => module.default) }),
                     ], imports: [
                         FsFilterModule,
                         FsMenuModule,
@@ -4860,4 +4920,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
  */
 
 export { FsAiReportsComponent as F, REPORT_CHART_COLORS_CSS as R, ReportComponent as a, FsAiReportComponent as b, ReportData as c, ReportService as d, ReportFilterStateService as e, FREQUENCY_OPTIONS as f, ReportNodeType as g, ReportState as h, ReportStates as i };
-//# sourceMappingURL=firestitch-report-firestitch-report-D5cx4IJg.mjs.map
+//# sourceMappingURL=firestitch-report-firestitch-report-D9XMKkVT.mjs.map