@firestitch/report 18.21.1 → 18.21.3

package/fesm2022/{firestitch-report-echarts-D1UDj4L9.mjs → firestitch-report-echarts-CUVOSBvJ.mjs}

@@ -4,7 +4,7 @@ import * as echarts from 'echarts/core';
 export { echarts as default };
 import { LabelLayout } from 'echarts/features';
 import { CanvasRenderer } from 'echarts/renderers';
-import { R as REPORT_CHART_COLORS_CSS, a as REPORT_CHART_FONT_FAMILY, b as REPORT_AXIS_LABEL_FONT_SIZE } from './firestitch-report-firestitch-report-cys9XusN.mjs';
+import { R as REPORT_CHART_COLORS_CSS, a as REPORT_CHART_FONT_FAMILY, b as REPORT_AXIS_LABEL_FONT_SIZE } from './firestitch-report-firestitch-report-CfvBTMrG.mjs';
 
 // Tree-shaken ECharts build for the reports renderer: only the chart types and
 // components the option-builder emits are registered, keeping the lazy chunk
@@ -63,4 +63,4 @@ echarts.registerTheme('report', {
         axisLabel: { color: '#52606d', fontSize: REPORT_AXIS_LABEL_FONT_SIZE },
     },
 });
-//# sourceMappingURL=firestitch-report-echarts-D1UDj4L9.mjs.map
+//# sourceMappingURL=firestitch-report-echarts-CUVOSBvJ.mjs.map

package/fesm2022/{firestitch-report-echarts-D1UDj4L9.mjs.map → firestitch-report-echarts-CUVOSBvJ.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"firestitch-report-echarts-D1UDj4L9.mjs","sources":["../../src/app/reports/theme/echarts.ts"],"sourcesContent":["// Tree-shaken ECharts build for the reports renderer: only the chart types and\n// components the option-builder emits are registered, keeping the lazy chunk\n// lean. Loaded on demand by ngx-echarts via provideEchartsCore — see\n// REPORT_ECHARTS_PROVIDERS in reports-echarts.provider.ts.\n//\n// The canvas renderer (not SVG) is deliberate: chart.getDataURL() needs it for\n// the high-res images the PPT/PDF exports will use.\n\nimport { BarChart, LineChart, PieChart } from 'echarts/charts';\nimport {\n  DatasetComponent,\n  GridComponent,\n  LegendComponent,\n  MarkAreaComponent,\n  MarkLineComponent,\n  TooltipComponent,\n} from 'echarts/components';\nimport * as echarts from 'echarts/core';\nimport { LabelLayout } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\n\nimport { REPORT_CHART_COLORS_CSS } from './palette';\nimport { REPORT_AXIS_LABEL_FONT_SIZE, REPORT_CHART_FONT_FAMILY } from './typography';\n\necharts.use([\n  BarChart,\n  LineChart,\n  PieChart,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n  DatasetComponent,\n  // Reference lines and statistic lines (markLine), reference bands\n  // (markArea), and the overlap hiding of 'auto' data labels (LabelLayout).\n  MarkLineComponent,\n  MarkAreaComponent,\n  LabelLayout,\n  CanvasRenderer,\n]);\n\n// The house theme — the single place report chart \"standards\" live (palette,\n// typography, tooltip styling). Polished defaults now; refined in the polish\n// phase.\necharts.registerTheme('report', {\n  color: REPORT_CHART_COLORS_CSS,\n  textStyle: {\n    fontFamily: REPORT_CHART_FONT_FAMILY,\n  },\n  title: {\n    textStyle: { color: '#1f2933', fontSize: 14, fontWeight: 600 },\n  },\n  legend: {\n    textStyle: { color: '#52606d', fontSize: 11 },\n  },\n  tooltip: {\n    backgroundColor: 'rgba(31, 41, 51, 0.92)',\n    borderWidth: 0,\n    textStyle: { color: '#fff', fontSize: 12 },\n  },\n  categoryAxis: {\n    axisLine: { lineStyle: { color: '#cbd2d9' } },\n    axisTick: { show: false },\n    axisLabel: { color: '#52606d', fontSize: REPORT_AXIS_LABEL_FONT_SIZE },\n    splitLine: { show: false },\n  },\n  valueAxis: {\n    axisLine: { show: false },\n    axisLabel: { color: '#52606d', fontSize: REPORT_AXIS_LABEL_FONT_SIZE },\n    splitLine: { lineStyle: { color: '#e4e7eb' } },\n  },\n  timeAxis: {\n    axisLine: { lineStyle: { color: '#cbd2d9' } },\n    axisLabel: { color: '#52606d', fontSize: REPORT_AXIS_LABEL_FONT_SIZE },\n  },\n});\n\nexport default echarts;\n"],"names":[],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAkBA,OAAO,CAAC,GAAG,CAAC;IACV,QAAQ;IACR,SAAS;IACT,QAAQ;IACR,aAAa;IACb,gBAAgB;IAChB,eAAe;IACf,gBAAgB;;;IAGhB,iBAAiB;IACjB,iBAAiB;IACjB,WAAW;IACX,cAAc;AACf,CAAA,CAAC,CAAC;AAEH;AACA;AACA;AACA,OAAO,CAAC,aAAa,CAAC,QAAQ,EAAE;AAC9B,IAAA,KAAK,EAAE,uBAAuB;AAC9B,IAAA,SAAS,EAAE;AACT,QAAA,UAAU,EAAE,wBAAwB;AACrC,KAAA;AACD,IAAA,KAAK,EAAE;AACL,QAAA,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE;AAC/D,KAAA;AACD,IAAA,MAAM,EAAE;QACN,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE;AAC9C,KAAA;AACD,IAAA,OAAO,EAAE;AACP,QAAA,eAAe,EAAE,wBAAwB;AACzC,QAAA,WAAW,EAAE,CAAC;QACd,SAAS,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,EAAE;AAC3C,KAAA;AACD,IAAA,YAAY,EAAE;QACZ,QAAQ,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE;AAC7C,QAAA,QAAQ,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;QACzB,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,2BAA2B,EAAE;AACtE,QAAA,SAAS,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;AAC3B,KAAA;AACD,IAAA,SAAS,EAAE;AACT,QAAA,QAAQ,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;QACzB,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,2BAA2B,EAAE;QACtE,SAAS,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE;AAC/C,KAAA;AACD,IAAA,QAAQ,EAAE;QACR,QAAQ,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE;QAC7C,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,2BAA2B,EAAE;AACvE,KAAA;AACF,CAAA,CAAC"}
+{"version":3,"file":"firestitch-report-echarts-CUVOSBvJ.mjs","sources":["../../src/app/reports/theme/echarts.ts"],"sourcesContent":["// Tree-shaken ECharts build for the reports renderer: only the chart types and\n// components the option-builder emits are registered, keeping the lazy chunk\n// lean. Loaded on demand by ngx-echarts via provideEchartsCore — see\n// REPORT_ECHARTS_PROVIDERS in reports-echarts.provider.ts.\n//\n// The canvas renderer (not SVG) is deliberate: chart.getDataURL() needs it for\n// the high-res images the PPT/PDF exports will use.\n\nimport { BarChart, LineChart, PieChart } from 'echarts/charts';\nimport {\n  DatasetComponent,\n  GridComponent,\n  LegendComponent,\n  MarkAreaComponent,\n  MarkLineComponent,\n  TooltipComponent,\n} from 'echarts/components';\nimport * as echarts from 'echarts/core';\nimport { LabelLayout } from 'echarts/features';\nimport { CanvasRenderer } from 'echarts/renderers';\n\nimport { REPORT_CHART_COLORS_CSS } from './palette';\nimport { REPORT_AXIS_LABEL_FONT_SIZE, REPORT_CHART_FONT_FAMILY } from './typography';\n\necharts.use([\n  BarChart,\n  LineChart,\n  PieChart,\n  GridComponent,\n  TooltipComponent,\n  LegendComponent,\n  DatasetComponent,\n  // Reference lines and statistic lines (markLine), reference bands\n  // (markArea), and the overlap hiding of 'auto' data labels (LabelLayout).\n  MarkLineComponent,\n  MarkAreaComponent,\n  LabelLayout,\n  CanvasRenderer,\n]);\n\n// The house theme — the single place report chart \"standards\" live (palette,\n// typography, tooltip styling). Polished defaults now; refined in the polish\n// phase.\necharts.registerTheme('report', {\n  color: REPORT_CHART_COLORS_CSS,\n  textStyle: {\n    fontFamily: REPORT_CHART_FONT_FAMILY,\n  },\n  title: {\n    textStyle: { color: '#1f2933', fontSize: 14, fontWeight: 600 },\n  },\n  legend: {\n    textStyle: { color: '#52606d', fontSize: 11 },\n  },\n  tooltip: {\n    backgroundColor: 'rgba(31, 41, 51, 0.92)',\n    borderWidth: 0,\n    textStyle: { color: '#fff', fontSize: 12 },\n  },\n  categoryAxis: {\n    axisLine: { lineStyle: { color: '#cbd2d9' } },\n    axisTick: { show: false },\n    axisLabel: { color: '#52606d', fontSize: REPORT_AXIS_LABEL_FONT_SIZE },\n    splitLine: { show: false },\n  },\n  valueAxis: {\n    axisLine: { show: false },\n    axisLabel: { color: '#52606d', fontSize: REPORT_AXIS_LABEL_FONT_SIZE },\n    splitLine: { lineStyle: { color: '#e4e7eb' } },\n  },\n  timeAxis: {\n    axisLine: { lineStyle: { color: '#cbd2d9' } },\n    axisLabel: { color: '#52606d', fontSize: REPORT_AXIS_LABEL_FONT_SIZE },\n  },\n});\n\nexport default echarts;\n"],"names":[],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAkBA,OAAO,CAAC,GAAG,CAAC;IACV,QAAQ;IACR,SAAS;IACT,QAAQ;IACR,aAAa;IACb,gBAAgB;IAChB,eAAe;IACf,gBAAgB;;;IAGhB,iBAAiB;IACjB,iBAAiB;IACjB,WAAW;IACX,cAAc;AACf,CAAA,CAAC,CAAC;AAEH;AACA;AACA;AACA,OAAO,CAAC,aAAa,CAAC,QAAQ,EAAE;AAC9B,IAAA,KAAK,EAAE,uBAAuB;AAC9B,IAAA,SAAS,EAAE;AACT,QAAA,UAAU,EAAE,wBAAwB;AACrC,KAAA;AACD,IAAA,KAAK,EAAE;AACL,QAAA,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE;AAC/D,KAAA;AACD,IAAA,MAAM,EAAE;QACN,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE;AAC9C,KAAA;AACD,IAAA,OAAO,EAAE;AACP,QAAA,eAAe,EAAE,wBAAwB;AACzC,QAAA,WAAW,EAAE,CAAC;QACd,SAAS,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,EAAE;AAC3C,KAAA;AACD,IAAA,YAAY,EAAE;QACZ,QAAQ,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE;AAC7C,QAAA,QAAQ,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;QACzB,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,2BAA2B,EAAE;AACtE,QAAA,SAAS,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;AAC3B,KAAA;AACD,IAAA,SAAS,EAAE;AACT,QAAA,QAAQ,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;QACzB,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,2BAA2B,EAAE;QACtE,SAAS,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE;AAC/C,KAAA;AACD,IAAA,QAAQ,EAAE;QACR,QAAQ,EAAE,EAAE,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE;QAC7C,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,2BAA2B,EAAE;AACvE,KAAA;AACF,CAAA,CAAC"}

package/fesm2022/{firestitch-report-firestitch-report-cys9XusN.mjs → firestitch-report-firestitch-report-CfvBTMrG.mjs}

@@ -7955,19 +7955,23 @@ class ReportFilterStateService {
         this._stateChanged$.next();
     }
     // Notifications relevant to ONE component: any change to a group one of its
-    // filters belongs to (or a full re-init).
+    // filters belongs to (or a full re-init). The component is read on each
+    // event, never captured at subscribe: a tile keeps its subscription across
+    // report loads, so a filter added to it while the report is open (the MCP,
+    // a chat edit, the settings dialog) reaches it on the first change of its
+    // group.
     changesFor(component) {
-        const groupIds = new Set((component.filters ?? []).map((filter) => filter.filterGroupId));
         return this._changed$.asObservable()
-            .pipe(filter((groupId) => groupId === null || groupIds.has(groupId)));
+            .pipe(filter((groupId) => groupId === null
+            || (component().filters ?? []).some((filter) => filter.filterGroupId === groupId)));
     }
     // Notifications relevant to ANY of a set of components that comes and goes
     // (a page's values): a change to a group one of their filters belongs to.
-    // Unlike changesFor, the set is read on each event rather than captured at
-    // subscribe, so one subscription follows the set as the report reloads. A
-    // full re-init (null) is not passed on: init() runs on a report
-    // (re)load, and a caller of this checks on that reload itself whether the
-    // filter values its components are read with moved.
+    // Like changesFor, the set is read on each event, so one subscription
+    // follows the set as the report reloads. Unlike it, a full re-init (null)
+    // is not passed on: init() runs on a report (re)load, and a caller of this
+    // checks on that reload itself whether the filter values its components
+    // are read with moved.
     changesForAny(components) {
         return this._changed$.asObservable()
             .pipe(filter((groupId) => groupId !== null
@@ -9958,6 +9962,18 @@ const NUMBER_UNITS = {
 };
 // What an abbreviated number's suffix multiplies it by, when a viewer types one.
 const UNIT_SUFFIXES = { k: 1e3, m: 1e6 };
+// A column written in thousands or millions is typed in them: the grid's
+// filter shows its K or M beside the inputs, so 12 there means 12,000. A K or
+// M typed after the digits wins, so 12K is still 12,000.
+const TYPED_UNITS = {
+    [GridUnits.Thousands]: 1e3,
+    [GridUnits.Millions]: 1e6,
+};
+// The significant digits a scaled typed number keeps, as fs-grid's own reader
+// keeps them: scaling leaves binary noise behind (12.3% reads
+// 0.12300000000000001, 1.005K 1004.9999999999999), which would move a range's
+// end past the very value it names.
+const TYPED_DIGITS = 15;
 const YES = 'Yes';
 const NO = 'No';
 // A grid tile's formatter: every value written as the report writes it on
@@ -10035,20 +10051,25 @@ function optionLabel(value, field) {
     return field.options?.find((option) => option.key === value)?.label ?? null;
 }
 // A number a viewer typed, read in the report's locale: its grouping dropped,
-// its decimal mark read, a K or M suffix multiplied out, and a percent of a
-// ratio-percent report read back to its ratio. null when it is no number.
+// its decimal mark read, a K or M suffix multiplied out (else the column's own
+// thousands or millions), and a percent of a ratio-percent report read back to
+// its ratio. The placement's units and format win over the field's, as they do
+// where the number is written (numberSpec). null when it is no number.
 function readGridNumber(context, text, field, placement) {
     const decimal = decimalMark(context.format.locale);
     const trimmed = text.trim().toLowerCase();
-    const multiplier = UNIT_SUFFIXES[trimmed.slice(-1)] ?? 1;
+    const multiplier = UNIT_SUFFIXES[trimmed.slice(-1)]
+        ?? TYPED_UNITS[placement?.units ?? field.units ?? GridUnits.None]
+        ?? 1;
     const digits = trimmed
         .split(decimal).map((part) => part.replace(/[^0-9-]/g, '')).join('.');
     const number = digits && digits !== '-' && digits !== '.' ? Number(digits) * multiplier : NaN;
     if (!Number.isFinite(number)) {
         return null;
     }
-    const isPercent = (placement?.format ?? field.format) === GridFormat.Percent;
-    return isPercent && context.format.ratioPercent ? number / 100 : number;
+    const isRatio = (placement?.format ?? field.format) === GridFormat.Percent && context.format.ratioPercent;
+    const value = isRatio ? number / 100 : number;
+    return multiplier === 1 && !isRatio ? value : Number(value.toPrecision(TYPED_DIGITS));
 }
 function decimalMark(locale) {
     return numberFormat(locale, {}).formatToParts(1.5).find((part) => part.type === 'decimal')?.value ?? '.';
@@ -10065,9 +10086,14 @@ function decimalMark(locale) {
 //   re-init the filter state) reads the table again at once, even when its
 //   filters did not move: the rows behind it, or its own query, may have.
 //   The load is counted into the params (reportLoads), since fs-grid reads
-//   only when they move. The new params land in the same tick as the
-//   reloaded tile, so a load that also moves the authored layout costs one
-//   read.
+//   only when they move. The params are derived from the tile as it is
+//   drawn (params), so the read of a load carries the filters the load
+//   brought, a filter added since the report opened included, and lands in
+//   the same tick as the reloaded tile: a load that also moves the authored
+//   layout costs one read.
+// - Which filter groups and whether the group-by reach the tile is read
+//   from the tile as it stands at each change, never as it was drawn: a
+//   filter added while the report is open reads on its first pick.
 // - The layout on screen is the state service's (gridLayout): the viewer's
 //   own while they changed it from the layout authored now, else the
 //   authored one. It outlives a page switch, and the chat reads it. So do
@@ -10091,7 +10117,16 @@ function decimalMark(locale) {
 class ComponentGridComponent {
     reportId = input.required();
     component = input.required();
-    params = signal(null);
+    // What fs-grid reads with: the tile's params (_readParams) for the
+    // component drawn now, read again at each settled change (_paramsRead).
+    // A load re-inits the filter state a tick before the tile gets the
+    // component it brought, so deriving them here is what puts a filter added
+    // by that load into its read.
+    params = computed(() => {
+        const component = this.component();
+        this._paramsRead();
+        return untracked(() => this._readParams(component));
+    });
     controls = computed(() => this.component().config?.controls ?? {});
     source = computed(() => new ReportGridSource(this._reportData, this.reportId(), this._componentId(), {
         locale: () => this._filterState.formatContext().locale,
@@ -10118,6 +10153,8 @@ class ComponentGridComponent {
     _paramsVersion = 0;
     // The report loads seen since the tile was drawn (ReportGridParams).
     _reportLoads = 0;
+    // Moves each time a settled change has the params read again.
+    _paramsRead = signal(0);
     ngOnInit() {
         this.expansion.set(this._filterState.gridExpansion(this.component()));
         this._init();
@@ -10131,16 +10168,14 @@ class ComponentGridComponent {
     }
     _init() {
         this._paramsVersion = this._filterState.stateVersion();
-        this.params.set(this._readParams());
         // A null group is a full re-init: a report load, or a reset.
-        this._filterState.changesFor(this.component())
+        this._filterState.changesFor(this.component)
             .pipe(switchMap$1((groupId) => this._settled$(groupId === null)), tap$1((isLoad) => this._applyParams(isLoad)), takeUntilDestroyed(this._destroyRef))
             .subscribe();
-        if (followsGroupBy(this.component())) {
-            this._filterState.frequencyChanges()
-                .pipe(takeUntilDestroyed(this._destroyRef))
-                .subscribe(() => this._applyParams());
-        }
+        // A load can make the table follow the group-by, or stop.
+        this._filterState.frequencyChanges()
+            .pipe(filter$1(() => followsGroupBy(this.component())), tap$1(() => this._applyParams()), takeUntilDestroyed(this._destroyRef))
+            .subscribe();
     }
     // Once the tile's first read is in, its notes prune the viewer's layout
     // (prunedGridLayout). A tile showing its authored layout has nothing to
@@ -10181,12 +10216,11 @@ class ComponentGridComponent {
             this._reportLoads++;
         }
         this._paramsVersion = this._filterState.stateVersion();
-        this.params.set(this._readParams());
+        this._paramsRead.update((count) => count + 1);
     }
     // The tile's report filters, 'any' groups and group-by grain as they stand
     // (tileState()), and the report loads it has seen.
-    _readParams() {
-        const component = this.component();
+    _readParams(component) {
         const { matchAnyGroupIds, frequency } = this._filterState.tileState(component);
         return {
             filters: this._filterState.resolveForComponent(component),
@@ -10196,7 +10230,7 @@ class ComponentGridComponent {
         };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ComponentGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ComponentGridComponent, isStandalone: true, selector: "app-report-component-grid", inputs: { reportId: { classPropertyName: "reportId", publicName: "reportId", isSignal: true, isRequired: true, transformFunction: null }, component: { classPropertyName: "component", publicName: "component", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<!-- The comparison and window note strip above the table, from the report\n     line of the latest read; the windows' descriptions and notes go in each\n     column's \"About this column\" instead. -->\n<div class=\"fs-column grid-pane\">\n  <app-report-component-note\n    [data]=\"noteData()\"\n    [windowNotes]=\"false\">\n  </app-report-component-note>\n  <!-- The params are seeded before the first render, so the grid's first read\n       carries the tile's report filters. -->\n  @if (params(); as params) {\n    <fs-grid\n      class=\"fs-flex\"\n      [source]=\"source()\"\n      [layout]=\"layout()\"\n      [expansion]=\"expansion()\"\n      [clearedFilter]=\"clearedFilter()\"\n      (expansionChange)=\"setExpansion($event)\"\n      [params]=\"params\"\n      [controls]=\"controls()\"\n      [formatter]=\"formatter()\"\n      (layoutChange)=\"setLayout($event)\">\n      <ng-template fsGridCell let-value let-field=\"field\" let-record=\"record\" let-text=\"text\">\n        @if (value | fsReportGridCell: field : record : text : noteData() : formatContext(); as shown) {\n          <!-- A cell that says why (a missing or zero prior) opens it on a\n               click; no cell carries a native tooltip. -->\n          @if (shown.title) {\n            <span\n                class=\"explained\"\n                fsPopover\n                trigger=\"click\"\n                [template]=\"explanation\"\n                [indication]=\"false\"\n                [maxWidth]=\"320\">\n              {{ shown.text }}\n            </span>\n            <ng-template #explanation>{{ shown.title }}</ng-template>\n          } @else {\n            <span>{{ shown.text }}</span>\n          }\n        }\n      </ng-template>\n    </fs-grid>\n  }\n</div>\n", styles: [":host{display:block;height:100%}.grid-pane{height:100%;min-height:0}fs-grid{min-height:0}.explained{cursor:pointer;text-decoration:underline dotted;text-underline-offset:2px}\n"], dependencies: [{ kind: "component", type: FsGridComponent, selector: "fs-grid", inputs: ["source", "layout", "controls", "params", "expansion", "panel", "editorOpen", "formatter", "clearedFilter"], outputs: ["layoutChange", "expansionChange", "panelChange", "editorOpenChange"] }, { kind: "directive", type: FsGridCellDirective, selector: "[fsGridCell]" }, { kind: "directive", type: FsPopoverDirective, selector: "[fsPopover]", inputs: ["text", "template", "data", "leaveDelay", "showDelay", "maxWidth", "maxHeight", "wrapperClass", "autoShow", "autoClose", "loadingDiameter", "loading", "indication", "position", "theme", "size", "trigger", "enabled", "panel"], outputs: ["closed"], exportAs: ["fsPopover"] }, { kind: "component", type: ComponentNoteComponent, selector: "app-report-component-note", inputs: ["data", "windows", "windowDescriptions", "windowNotes"] }, { kind: "pipe", type: ReportGridCellPipe, name: "fsReportGridCell" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ComponentGridComponent, isStandalone: true, selector: "app-report-component-grid", inputs: { reportId: { classPropertyName: "reportId", publicName: "reportId", isSignal: true, isRequired: true, transformFunction: null }, component: { classPropertyName: "component", publicName: "component", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<!-- The comparison and window note strip above the table, from the report\n     line of the latest read; the windows' descriptions and notes go in each\n     column's \"About this column\" instead. -->\n<div class=\"fs-column grid-pane\">\n  <app-report-component-note\n    [data]=\"noteData()\"\n    [windowNotes]=\"false\">\n  </app-report-component-note>\n  <!-- The params are read from the tile drawn (params), from its first\n       render on, so every read carries the tile's report filters. -->\n  <fs-grid\n    class=\"fs-flex\"\n    [source]=\"source()\"\n    [layout]=\"layout()\"\n    [expansion]=\"expansion()\"\n    [clearedFilter]=\"clearedFilter()\"\n    (expansionChange)=\"setExpansion($event)\"\n    [params]=\"params()\"\n    [controls]=\"controls()\"\n    [formatter]=\"formatter()\"\n    (layoutChange)=\"setLayout($event)\">\n    <ng-template fsGridCell let-value let-field=\"field\" let-record=\"record\" let-text=\"text\">\n      @if (value | fsReportGridCell: field : record : text : noteData() : formatContext(); as shown) {\n        <!-- A cell that says why (a missing or zero prior) opens it on a\n             click; no cell carries a native tooltip. -->\n        @if (shown.title) {\n          <span\n              class=\"explained\"\n              fsPopover\n              trigger=\"click\"\n              [template]=\"explanation\"\n              [indication]=\"false\"\n              [maxWidth]=\"320\">\n            {{ shown.text }}\n          </span>\n          <ng-template #explanation>{{ shown.title }}</ng-template>\n        } @else {\n          <span>{{ shown.text }}</span>\n        }\n      }\n    </ng-template>\n  </fs-grid>\n</div>\n", styles: [":host{display:block;height:100%}.grid-pane{height:100%;min-height:0}fs-grid{min-height:0}.explained{cursor:pointer;text-decoration:underline dotted;text-underline-offset:2px}\n"], dependencies: [{ kind: "component", type: FsGridComponent, selector: "fs-grid", inputs: ["source", "layout", "controls", "params", "expansion", "panel", "editorOpen", "formatter", "clearedFilter"], outputs: ["layoutChange", "expansionChange", "panelChange", "editorOpenChange"] }, { kind: "directive", type: FsGridCellDirective, selector: "[fsGridCell]" }, { kind: "directive", type: FsPopoverDirective, selector: "[fsPopover]", inputs: ["text", "template", "data", "leaveDelay", "showDelay", "maxWidth", "maxHeight", "wrapperClass", "autoShow", "autoClose", "loadingDiameter", "loading", "indication", "position", "theme", "size", "trigger", "enabled", "panel"], outputs: ["closed"], exportAs: ["fsPopover"] }, { kind: "component", type: ComponentNoteComponent, selector: "app-report-component-note", inputs: ["data", "windows", "windowDescriptions", "windowNotes"] }, { kind: "pipe", type: ReportGridCellPipe, name: "fsReportGridCell" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ComponentGridComponent, decorators: [{
             type: Component,
@@ -10206,7 +10240,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         FsPopoverDirective,
                         ComponentNoteComponent,
                         ReportGridCellPipe,
-                    ], template: "<!-- The comparison and window note strip above the table, from the report\n     line of the latest read; the windows' descriptions and notes go in each\n     column's \"About this column\" instead. -->\n<div class=\"fs-column grid-pane\">\n  <app-report-component-note\n    [data]=\"noteData()\"\n    [windowNotes]=\"false\">\n  </app-report-component-note>\n  <!-- The params are seeded before the first render, so the grid's first read\n       carries the tile's report filters. -->\n  @if (params(); as params) {\n    <fs-grid\n      class=\"fs-flex\"\n      [source]=\"source()\"\n      [layout]=\"layout()\"\n      [expansion]=\"expansion()\"\n      [clearedFilter]=\"clearedFilter()\"\n      (expansionChange)=\"setExpansion($event)\"\n      [params]=\"params\"\n      [controls]=\"controls()\"\n      [formatter]=\"formatter()\"\n      (layoutChange)=\"setLayout($event)\">\n      <ng-template fsGridCell let-value let-field=\"field\" let-record=\"record\" let-text=\"text\">\n        @if (value | fsReportGridCell: field : record : text : noteData() : formatContext(); as shown) {\n          <!-- A cell that says why (a missing or zero prior) opens it on a\n               click; no cell carries a native tooltip. -->\n          @if (shown.title) {\n            <span\n                class=\"explained\"\n                fsPopover\n                trigger=\"click\"\n                [template]=\"explanation\"\n                [indication]=\"false\"\n                [maxWidth]=\"320\">\n              {{ shown.text }}\n            </span>\n            <ng-template #explanation>{{ shown.title }}</ng-template>\n          } @else {\n            <span>{{ shown.text }}</span>\n          }\n        }\n      </ng-template>\n    </fs-grid>\n  }\n</div>\n", styles: [":host{display:block;height:100%}.grid-pane{height:100%;min-height:0}fs-grid{min-height:0}.explained{cursor:pointer;text-decoration:underline dotted;text-underline-offset:2px}\n"] }]
+                    ], template: "<!-- The comparison and window note strip above the table, from the report\n     line of the latest read; the windows' descriptions and notes go in each\n     column's \"About this column\" instead. -->\n<div class=\"fs-column grid-pane\">\n  <app-report-component-note\n    [data]=\"noteData()\"\n    [windowNotes]=\"false\">\n  </app-report-component-note>\n  <!-- The params are read from the tile drawn (params), from its first\n       render on, so every read carries the tile's report filters. -->\n  <fs-grid\n    class=\"fs-flex\"\n    [source]=\"source()\"\n    [layout]=\"layout()\"\n    [expansion]=\"expansion()\"\n    [clearedFilter]=\"clearedFilter()\"\n    (expansionChange)=\"setExpansion($event)\"\n    [params]=\"params()\"\n    [controls]=\"controls()\"\n    [formatter]=\"formatter()\"\n    (layoutChange)=\"setLayout($event)\">\n    <ng-template fsGridCell let-value let-field=\"field\" let-record=\"record\" let-text=\"text\">\n      @if (value | fsReportGridCell: field : record : text : noteData() : formatContext(); as shown) {\n        <!-- A cell that says why (a missing or zero prior) opens it on a\n             click; no cell carries a native tooltip. -->\n        @if (shown.title) {\n          <span\n              class=\"explained\"\n              fsPopover\n              trigger=\"click\"\n              [template]=\"explanation\"\n              [indication]=\"false\"\n              [maxWidth]=\"320\">\n            {{ shown.text }}\n          </span>\n          <ng-template #explanation>{{ shown.title }}</ng-template>\n        } @else {\n          <span>{{ shown.text }}</span>\n        }\n      }\n    </ng-template>\n  </fs-grid>\n</div>\n", styles: [":host{display:block;height:100%}.grid-pane{height:100%;min-height:0}fs-grid{min-height:0}.explained{cursor:pointer;text-decoration:underline dotted;text-underline-offset:2px}\n"] }]
         }] });
 
 // A KPI's trend over its last periods: a line that stretches to the card's
@@ -10469,9 +10503,10 @@ class ComponentListComponent {
         this._initListConfig(config);
         this._observePinOffsets();
         // A change to any group this list's filters belong to (from the report bar
-        // or the component header strip) re-runs the list.
-        // So does a change of the text in its search box (in the component header).
-        merge(this._filterState.changesFor(component), this._filterState.listSearchChanges(component.id))
+        // or the component header strip) re-runs the list, a filter added since
+        // the list was drawn included. So does a change of the text in its search
+        // box (in the component header).
+        merge(this._filterState.changesFor(this.component), this._filterState.listSearchChanges(component.id))
             .pipe(tap$1(() => this.listComponent()?.reload()), takeUntilDestroyed(this._destroyRef))
             .subscribe();
     }
@@ -11922,19 +11957,21 @@ class ReportComponentComponent {
             tileLoads(this._refresh$, () => this._load(), () => this._filterState.stateVersion())
                 .pipe(tap$1((result) => this._loaded(result)), takeUntilDestroyed(this._destroyRef))
                 .subscribe();
-            this._filterState.changesFor(this.component)
-                .pipe(takeUntilDestroyed(this._destroyRef))
-                .subscribe(() => this._refresh$.next());
+            // A change to one of the tile's filter groups, read from the tile as
+            // it stands, so a filter a report load added reads on its first pick.
+            this._filterState.changesFor(() => this.component)
+                .pipe(tap$1(() => this._refresh$.next()), takeUntilDestroyed(this._destroyRef))
+                .subscribe();
             // A group-by change re-buckets every tile that follows it; it isn't
-            // scoped to a filter group, so it rides its own stream.
-            if (followsGroupBy(this.component)) {
-                this._filterState.frequencyChanges()
-                    .pipe(takeUntilDestroyed(this._destroyRef))
-                    .subscribe(() => {
-                    this._grainMoved = true;
-                    this._refresh$.next();
-                });
-            }
+            // scoped to a filter group, so it rides its own stream. Whether the
+            // tile follows it is read at each change: a load can make it follow
+            // (a chart moved onto a time axis) or stop.
+            this._filterState.frequencyChanges()
+                .pipe(filter$1(() => followsGroupBy(this.component)), tap$1(() => {
+                this._grainMoved = true;
+                this._refresh$.next();
+            }), takeUntilDestroyed(this._destroyRef))
+                .subscribe();
             // A drill moves this chart alone.
             this._filterState.drillChanges(this.component.id)
                 .pipe(takeUntilDestroyed(this._destroyRef))
@@ -12351,7 +12388,7 @@ class ReportComponentComponent {
     // A change to one group the header shows with another value (another bar
     // set it) builds it again too.
     _rebuildHeaderOnNewState() {
-        this._filterState.changesFor(this.component)
+        this._filterState.changesFor(() => this.component)
             .pipe(filter$1((groupId) => (groupId === null
             ? this._filterState.stateVersion() !== this._headerVersion()
             : this._showsOtherValue(groupId))), tap$1(() => this._buildFilterConfig()), takeUntilDestroyed(this._destroyRef))
@@ -15819,7 +15856,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
 // in the report's format context, as on screen.
 async function renderChartImage(component, data, width, height, context, pixelRatio = 3) {
     // The same tree-shaken echarts build + 'report' theme the live canvas uses.
-    const echarts = (await import('./firestitch-report-echarts-D1UDj4L9.mjs')).default;
+    const echarts = (await import('./firestitch-report-echarts-CUVOSBvJ.mjs')).default;
     const host = document.createElement('div');
     host.style.width = `${width}px`;
     host.style.height = `${height}px`;
@@ -19512,7 +19549,7 @@ class FsAiReportComponent {
             ReportAiChatData,
             { provide: FsAiChatData, useExisting: ReportAiChatData },
             // Tree-shaken ECharts core + the 'report' house theme, loaded lazily.
-            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-D1UDj4L9.mjs').then((module) => module.default) }),
+            provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-CUVOSBvJ.mjs').then((module) => module.default) }),
             // The bar's date pickers start their weeks on Monday and list the built-in
             // presets; a preset only sets the days.
             provideReportDatePicker(),
@@ -19536,7 +19573,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
                         ReportAiChatData,
                         { provide: FsAiChatData, useExisting: ReportAiChatData },
                         // Tree-shaken ECharts core + the 'report' house theme, loaded lazily.
-                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-D1UDj4L9.mjs').then((module) => module.default) }),
+                        provideEchartsCore({ echarts: () => import('./firestitch-report-echarts-CUVOSBvJ.mjs').then((module) => module.default) }),
                         // The bar's date pickers start their weeks on Monday and list the built-in
                         // presets; a preset only sets the days.
                         provideReportDatePicker(),
@@ -19629,4 +19666,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
  */
 
 export { FsAiReportsComponent as F, GRANULARITY_OPTIONS as G, REPORT_CHART_COLORS_CSS as R, REPORT_CHART_FONT_FAMILY as a, REPORT_AXIS_LABEL_FONT_SIZE as b, FsAiReportComponent as c, ReportData as d, ReportService as e, ReportFilterStateService as f, ReportNodeType as g, ReportState as h, ReportValueFormat as i, ReportValueFormula as j, ReportListColumnFormat as k, ReportNumberUnits as l, ReportChartDataLabels as m, ReportChartColor as n, ReportChartLineStyle as o, ReportChartMarkStat as p, ReportChartDateLabel as q, ReportChartSpanThrough as r, ReportChangePolarity as s };
-//# sourceMappingURL=firestitch-report-firestitch-report-cys9XusN.mjs.map
+//# sourceMappingURL=firestitch-report-firestitch-report-CfvBTMrG.mjs.map