eru-grid 0.0.53 → 0.0.55

package/fesm2022/eru-grid.mjs

@@ -194,9 +194,23 @@ const SELF_COLOURED_DATATYPES = new Set(['status', 'priority', 'tag', 'progress'
  */
 const ACTION_COLUMN_MIN_WIDTH = 56;
 const SEEDED_FIELD_KEYS = [
-    'dynamic_number', 'display_number_as', 'symbol_field', 'date_format', 'label',
+    'dynamic_number', 'display_number_as', 'symbol_field', 'date_format',
     'storage_name', 'folder_name', 'default_upload',
 ];
+/**
+ * Keys the model seeds only until the design panel overrides them EXPLICITLY,
+ * tracked by a companion flag rather than by "does the column hold a value".
+ *
+ * `label` is the case that forced this: it is in SEEDED_FIELD_KEYS' spirit —
+ * the model's label is the default and a grid may shorten it — but a column
+ * never arrives without one, so the seeded test ("column already has a value,
+ * leave it alone") was true from the first render and the model's label never
+ * reached a mapped column. A query-derived column kept showing its raw result
+ * key as the heading.
+ */
+const EXPLICITLY_OVERRIDDEN_FIELD_KEYS = {
+    label: 'label_overridden',
+};
 /**
  * Datatype aliases the data model emits that mean an existing DataTypes value.
  *
@@ -1288,7 +1302,10 @@ class PivotTransformService {
         const enableColumnSubtotals = gridConfiguration?.config?.enableColumnSubtotals ?? false;
         const enableGrandTotal = gridConfiguration?.config?.enableGrandTotal ?? false;
         const enableColumnGrandTotal = gridConfiguration?.config?.enableColumnGrandTotal ?? false;
-        if (enableRowSubtotals || enableColumnSubtotals || enableGrandTotal || enableColumnGrandTotal) {
+        // Nothing to total when there are no rows — a grand total of an empty set
+        // would render a row of zeros under a result that has no data.
+        if (pivotRows.length > 0 &&
+            (enableRowSubtotals || enableColumnSubtotals || enableGrandTotal || enableColumnGrandTotal)) {
             pivotRows = this.addSubtotals(pivotRows, configuration, pivotColumns, gridConfiguration, sourceData);
         }
         // Step 5: Generate column definitions (including subtotal columns)
@@ -3896,6 +3913,11 @@ class EruGridStore {
     // Pivot-specific signals
     _pivotConfiguration = signal(null, ...(ngDevMode ? [{ debugName: "_pivotConfiguration" }] : []));
     _pivotResult = signal(null, ...(ngDevMode ? [{ debugName: "_pivotResult" }] : []));
+    /**
+     * Widths for generated pivot leaves that have no field to hold them.
+     * Keyed by leaf name — see updateColumnWidth.
+     */
+    _pivotLeafWidths = signal(new Map(), ...(ngDevMode ? [{ debugName: "_pivotLeafWidths" }] : []));
     _drilldown = signal(null, ...(ngDevMode ? [{ debugName: "_drilldown" }] : []));
     _actionClick = signal(null, ...(ngDevMode ? [{ debugName: "_actionClick" }] : []));
     _columnResize = signal(null, ...(ngDevMode ? [{ debugName: "_columnResize" }] : []));
@@ -3985,6 +4007,7 @@ class EruGridStore {
     // Pivot-specific readonly signals
     pivotConfiguration = this._pivotConfiguration.asReadonly();
     pivotResult = this._pivotResult.asReadonly();
+    pivotLeafWidths = this._pivotLeafWidths.asReadonly();
     drilldown = this._drilldown.asReadonly();
     actionClick = this._actionClick.asReadonly();
     columnResize = this._columnResize.asReadonly();
@@ -4068,33 +4091,34 @@ class EruGridStore {
         }
         return this.rows();
     }, ...(ngDevMode ? [{ debugName: "displayData" }] : []));
+    // The frozen grand total is the row the transform appended (or prepended) to
+    // the pivot data, so it is only there when the transform actually produced
+    // one. It skips totalling an empty result, so `data` can be [] with the
+    // grand-total config still on; indexing it then yields undefined and the
+    // frozen-row template renders a row that has no `_rowKey`. Read the row
+    // positionally but keep it only when it really is the grand total.
+    frozenGrandTotalRow = computed(() => {
+        if (!this.isPivotMode() || !this.pivotResult())
+            return null;
+        const config = this.configuration().config;
+        if (!config?.enableGrandTotal || !config?.freezeGrandTotal)
+            return null;
+        const data = this.pivotResult().data;
+        const row = config?.grandTotalPosition === 'before' ? data[0] : data[data.length - 1];
+        return row?._isGrandTotal ? row : null;
+    }, ...(ngDevMode ? [{ debugName: "frozenGrandTotalRow" }] : []));
     // Type-safe accessors for specific modes
     pivotGrandTotalData = computed(() => {
-        let pd = [];
-        if (this.isPivotMode() && this.pivotResult()) {
-            if (this.configuration().config?.enableGrandTotal) {
-                if (this.configuration().config?.freezeGrandTotal) {
-                    if (this.configuration().config?.grandTotalPosition === 'before') {
-                        pd = [this.pivotResult().data[0]];
-                    }
-                    else {
-                        pd = [this.pivotResult().data[this.pivotResult().data.length - 1]];
-                    }
-                }
-            }
-        }
-        return pd;
+        const row = this.frozenGrandTotalRow();
+        return row ? [row] : [];
     }, ...(ngDevMode ? [{ debugName: "pivotGrandTotalData" }] : []));
     // Type-safe accessors for specific modes
     pivotDisplayData = computed(() => {
         if (this.isPivotMode() && this.pivotResult()) {
-            if (this.configuration().config?.enableGrandTotal && this.configuration().config?.freezeGrandTotal) {
-                if (this.configuration().config?.grandTotalPosition === 'before') {
-                    return this.pivotResult().data.slice(1);
-                }
-                else {
-                    return this.pivotResult().data;
-                }
+            // Only drop the leading row when it is the frozen grand total that the
+            // header renders separately, never a real data row.
+            if (this.frozenGrandTotalRow() && this.configuration().config?.grandTotalPosition === 'before') {
+                return this.pivotResult().data.slice(1);
             }
             return this.pivotResult().data;
         }
@@ -4401,8 +4425,20 @@ class EruGridStore {
             });
             return;
         }
-        const columns = this.columns().map(col => col.name === owner ? { ...col, field_size: field_size } : col);
-        this._columns.set(columns);
+        const columns = this.columns();
+        if (!columns.some(col => col.name === owner)) {
+            // A pivot dimension the grid has no column for — the author put a field
+            // in the pivot's rows that is not in the column set. There is no owner to
+            // hold the width, so it is held against the leaf name. Without this the
+            // resize reached the cells (the directive styles them directly) but
+            // nothing else: the next change detection re-asserted the old width, and
+            // the table total, which is summed from the leaves, never moved.
+            const next = new Map(this._pivotLeafWidths());
+            next.set(owner, field_size);
+            this._pivotLeafWidths.set(next);
+            return;
+        }
+        this._columns.set(columns.map(col => (col.name === owner ? { ...col, field_size: field_size } : col)));
     }
     setCellValueChange(change) {
         this._cellValueChange.set(change);
@@ -4481,6 +4517,56 @@ class EruGridStore {
         const rows = this.rows().map(row => row.entity_id === rowId ? { ...row, ...updates } : row);
         this._rows.set(rows);
     }
+    /**
+     * Merge field values into the record with this id, wherever the grid is
+     * holding it — the flat row list AND the per-group buckets a board fills.
+     *
+     * For a consumer that edits a record somewhere else on the page and needs the
+     * grid to agree without refetching. `updateRow` is not enough on two counts:
+     * it only looks at `_rows`, so a grouped/board grid keeps the stale copy, and
+     * it replaces top-level row keys rather than merging into `entity_data`,
+     * where an entity-backed row keeps its fields.
+     *
+     * Unknown ids are ignored, so a caller can announce a change blindly.
+     */
+    patchRecord(entityId, fields) {
+        if (!entityId || !fields)
+            return;
+        const entries = Object.entries(fields);
+        if (entries.length === 0)
+            return;
+        const patch = (row) => {
+            if (!row || row.entity_id !== entityId)
+                return row;
+            const next = { ...row };
+            if (next.entity_data && typeof next.entity_data === 'object') {
+                next.entity_data = { ...next.entity_data, ...fields };
+            }
+            // An array-sourced row carries its fields at the top level instead. Only
+            // keys the row already has are touched, so this never invents columns.
+            for (const [key, value] of entries) {
+                if (key !== 'entity_data' && Object.prototype.hasOwnProperty.call(next, key)) {
+                    next[key] = value;
+                }
+            }
+            return next;
+        };
+        const holdsRecord = (rows) => rows.some(row => row?.entity_id === entityId);
+        if (holdsRecord(this._rows())) {
+            this._rows.set(this._rows().map(patch));
+        }
+        this._groupRows.update(current => {
+            let touched = false;
+            const next = new Map(current);
+            current.forEach((rows, groupId) => {
+                if (!holdsRecord(rows))
+                    return;
+                next.set(groupId, rows.map(patch));
+                touched = true;
+            });
+            return touched ? next : current;
+        });
+    }
     // Selection methods
     selectRow(rowId) {
         const selectedRowIds = new Set(this.selectedRowIds());
@@ -4721,16 +4807,16 @@ class EruGridStore {
         }
         if (!pivotConfig)
             return;
-        // No source rows: publish an EMPTY pivot rather than returning and leaving
-        // the previous result on screen. Bailing here is what kept the last
-        // filter's rows — and their subtotals — rendered after a query came back
-        // with nothing, since the pivot view reads _pivotResult and not the row
-        // stores that had already been cleared.
-        if (sourceData.length === 0) {
-            if (this._pivotResult() !== null)
-                this._pivotResult.set(null);
-            return;
-        }
+        // No source rows still goes through the transform, producing a pivot with
+        // the row-dimension columns and no data rows.
+        //
+        // Two things this must NOT do. Bailing out leaves the previous filter's
+        // rows and subtotals on screen, since the pivot view reads _pivotResult and
+        // not the row stores that were already cleared. Publishing null empties it
+        // but drops the pivot's own column definitions, so displayColumns() falls
+        // back to the raw source columns and an empty pivot reads as a table. The
+        // transform on an empty set yields neither: column values and measures
+        // cannot be derived from nothing, so only the row dimensions remain.
         this.setLoading(true);
         this.setError(null);
         try {
@@ -13735,9 +13821,13 @@ class ColumnDesignPanelComponent {
      * drift apart: a key that is inherited is always locked, and vice versa.
      *
      * SEEDED_FIELD_KEYS are the exception the resolver makes too: the model seeds
-     * them, this grid may then override them, so they stay editable here.
+     * them, this grid may then override them, so they stay editable here. So are
+     * EXPLICITLY_OVERRIDDEN_FIELD_KEYS, seeded the same way but tracked by a flag
+     * — `label` among them, which must stay typeable for the flag to ever be set.
      */
-    static INHERITED_KEYS = new Set(INHERITED_FIELD_KEYS.filter(k => !SEEDED_FIELD_KEYS.includes(k) && k !== 'datatype'));
+    static INHERITED_KEYS = new Set(INHERITED_FIELD_KEYS.filter(k => !SEEDED_FIELD_KEYS.includes(k) &&
+        !EXPLICITLY_OVERRIDDEN_FIELD_KEYS[k] &&
+        k !== 'datatype'));
     isInherited(key) {
         return this.isEntityMapped() && ColumnDesignPanelComponent.INHERITED_KEYS.has(key);
     }
@@ -14024,6 +14114,20 @@ class ColumnDesignPanelComponent {
         this.gridStore.updateColumnMeta(name, { [key]: value });
     }
     onText(key, value) {
+        // A typed heading is the author's, and stops the mapped field's label from
+        // seeding it on the next resolve; clearing the box hands the column back to
+        // the data model rather than pinning it to an empty header.
+        const flag = EXPLICITLY_OVERRIDDEN_FIELD_KEYS[key];
+        if (flag) {
+            const name = this.gridStore.selectedDesignColumn();
+            if (!name)
+                return;
+            const typed = String(value ?? '').trim();
+            this.gridStore.updateColumnMeta(name, typed
+                ? { [key]: value, [flag]: true }
+                : { [key]: null, [flag]: null });
+            return;
+        }
         this.patch(key, value);
     }
     onNumber(key, value) {
@@ -14584,7 +14688,6 @@ class EruGridComponent {
         return !!row && this.gridStore.activeBoardRow() === row;
     }
     initialMinHeight = 400;
-    initialTotalWidth = 0;
     viewport;
     groupsViewport;
     groupsScrollContainerEl;
@@ -14889,10 +14992,21 @@ class EruGridComponent {
         this.viewport?.getRenderedRange();
         this.firstTr = this.viewport?.getRenderedRange()?.start || 0;
     }
+    /**
+     * The sum of the rendered column widths — what every table in the grid is
+     * forced to via `--table-total-width`.
+     *
+     * A signal, not a value captured at init. A resize writes the new width to
+     * the column (or, in pivot mode, to the measure the leaf came from), and the
+     * cells and `<col>`s follow it; a cached total does not, so the table stayed
+     * at its old width while its columns changed underneath — leaving the header
+     * and body tables wider or narrower than the columns they contain, and the
+     * horizontal scroll range wrong. Pivot mode also changes its leaf SET as the
+     * data changes, so even without a resize the total goes stale.
+     */
+    totalTableWidth = computed(() => this.getLeafColumns().reduce((total, column) => total + (column?.field_size || 0), 0), ...(ngDevMode ? [{ debugName: "totalTableWidth" }] : []));
     getTotalTableWidth() {
-        const columns = this.getLeafColumns();
-        let totalWidth = columns.reduce((total, column) => total + column.field_size, 0);
-        return totalWidth;
+        return this.totalTableWidth();
     }
     /* getContainerHeight(): number {
       const element = this.rowContainer?.nativeElement;
@@ -15120,7 +15234,6 @@ class EruGridComponent {
                 this.initializeColumnWidths();
                 this.firstDataRowIndex.set(this.maxDepth() + 1);
                 this.initialMinHeight = this.getMinHeightPx();
-                this.initialTotalWidth = this.getTotalTableWidth();
                 this.columnsInitialized.set(true);
             }
         });
@@ -15322,7 +15435,6 @@ class EruGridComponent {
         // initializeGroups() moved to effect in constructor to handle timing
         this.firstDataRowIndex.set(this.maxDepth() + 1);
         this.initialMinHeight = this.getMinHeightPx();
-        this.initialTotalWidth = this.getTotalTableWidth();
     }
     ngAfterViewInit() {
         this.applyTokens();
@@ -15419,12 +15531,12 @@ class EruGridComponent {
         return this.initialMinHeight;
     }
     getInitialTotalWidth() {
-        return this.initialTotalWidth;
+        return this.totalTableWidth();
     }
     applyCdkWidth() {
         const element = this.rowContainer?.nativeElement;
         if (element) {
-            return element.clientWidth > this.initialTotalWidth;
+            return element.clientWidth > this.totalTableWidth();
         }
         return false;
     }
@@ -15760,7 +15872,7 @@ class EruGridComponent {
         }
     }
     trackByPivotRowFn(index, pivotRow) {
-        return pivotRow._rowKey || `pivot-row-${index}`;
+        return pivotRow?._rowKey || `pivot-row-${index}`;
     }
     trackByRowFn(index, row) {
         // Use both entity_id and index to ensure uniqueness even with duplicate entity_ids
@@ -15828,6 +15940,7 @@ class EruGridComponent {
         const leaves = pivotResult.headerStructure.leafColumns;
         const aggregations = this.gridStore.configuration()?.pivot?.aggregations || [];
         const sourceColumns = this.gridStore.columns() || [];
+        const leafWidths = this.gridStore.pivotLeafWidths();
         // Carry configuration from the field a leaf came from onto the leaf itself.
         // The pivot transform builds leaves with a handful of hard-coded keys — it
         // types every aggregated column as plain 'number' whatever the measure says,
@@ -15841,15 +15954,20 @@ class EruGridComponent {
             const owner = leaf.aggregationFunction
                 ? aggregations.find(a => a.name === this.designTargetFor(leaf))
                 : sourceColumns.find(c => c.name === leaf.name);
-            if (!owner)
-                return leaf;
             const patch = {};
-            for (const key of EruGridComponent.PIVOT_INHERITED_KEYS) {
-                const value = owner[key];
-                // `false` is meaningful (enableDrilldown), blank/absent is not.
-                if (value !== undefined && value !== null && value !== '')
-                    patch[key] = value;
+            if (owner) {
+                for (const key of EruGridComponent.PIVOT_INHERITED_KEYS) {
+                    const value = owner[key];
+                    // `false` is meaningful (enableDrilldown), blank/absent is not.
+                    if (value !== undefined && value !== null && value !== '')
+                        patch[key] = value;
+                }
             }
+            // A resize of a leaf with no owning field is held against the leaf name
+            // instead — see EruGridStore.updateColumnWidth.
+            const width = leafWidths.get(leaf.name);
+            if (typeof width === 'number' && width > 0)
+                patch.field_size = width;
             return Object.keys(patch).length ? { ...leaf, ...patch } : leaf;
         });
     }
@@ -16086,6 +16204,11 @@ class EruGridComponent {
      * including an explicit `false` on a checkbox — wins from then on. Without the
      * column in hand there is no way to tell "not set" from "set to the opposite",
      * so an override was overwritten on every resolve.
+     *
+     * EXPLICITLY_OVERRIDDEN_FIELD_KEYS work the same way but ask a companion flag
+     * instead, for keys a column always holds a value for — `label`, whose
+     * "already set" was true from the first render, so the model's label never
+     * won and a mapped column kept its raw result key as the heading.
      */
     buildMappedColumnPatch(meta, col) {
         const patch = {};
@@ -16097,6 +16220,9 @@ class EruGridComponent {
                 continue;
             if (seeded.has(k) && !isUnset(col?.[k]))
                 continue;
+            const overrideFlag = EXPLICITLY_OVERRIDDEN_FIELD_KEYS[k];
+            if (overrideFlag && col?.[overrideFlag])
+                continue;
             patch[k] = v;
         }
         // setColumns() stores the canonical datatype ('r_status' -> 'status'), so a
@@ -16998,5 +17124,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ACTION_COLUMN_MIN_WIDTH, AttachmentComponent, CELL_RULE_OPERATORS, CheckboxComponent, ChipListComponent, ColumnConstraintsService, CompositeComponent, CurrencyComponent, CustomVirtualScrollStrategy, DATA_TYPES, DATETIME_FORMATS, DATE_FORMATS, DateComponent, DatetimeComponent, DurationComponent, EmailComponent, EruGridComponent, EruGridService, EruGridStore, GRID_COLOR_TOKENS, INHERITED_FIELD_KEYS, LocationComponent, MATERIAL_MODULES, MATERIAL_PROVIDERS, MONTH_SHORT_NAMES, NumberComponent, NumericInputDirective, PRESENTATION_DATATYPES, PRESET_CONFIG_DEFAULTS, PRESET_MANAGED_FIELDS, PeopleComponent, PhoneComponent, PriorityComponent, ProgressComponent, RatingComponent, SEEDED_FIELD_KEYS, SELF_COLOURED_DATATYPES, SelectComponent, StatusComponent, TagComponent, TextareaComponent, TextboxComponent, ThemeService, ThemeToggleComponent, WebsiteComponent, abbreviateNumber, abbreviationScaleFor, cellRuleBarPercent, cellRuleMatches, cellRuleToCss, cellStatAlias, cellTextStyleToCss, collectColumnStatRequests, columnCellRules, composeColorValue, effectiveValueDatatype, evaluateRowCondition, formatCellValue, formatDateTimeWithPattern, formatDateWithPattern, formatNumberValue, hasOwnCellRules, matchCellRule, matchColorRange, normalizeCellRender, normalizeDatatype, normalizeDateFormat, normalizeDateTimeFormat, parseCellDate, parseCellDateTime, parseColorValue, parseDateWithPattern, readRowValue, resolveColumnRules, resolveRowValue, resolveStatValue, rowSelectionKey, statusPillColors, tagPillColors, toDateOnlyString, toDateTimeString };
+export { ACTION_COLUMN_MIN_WIDTH, AttachmentComponent, CELL_RULE_OPERATORS, CheckboxComponent, ChipListComponent, ColumnConstraintsService, CompositeComponent, CurrencyComponent, CustomVirtualScrollStrategy, DATA_TYPES, DATETIME_FORMATS, DATE_FORMATS, DateComponent, DatetimeComponent, DurationComponent, EXPLICITLY_OVERRIDDEN_FIELD_KEYS, EmailComponent, EruGridComponent, EruGridService, EruGridStore, GRID_COLOR_TOKENS, INHERITED_FIELD_KEYS, LocationComponent, MATERIAL_MODULES, MATERIAL_PROVIDERS, MONTH_SHORT_NAMES, NumberComponent, NumericInputDirective, PRESENTATION_DATATYPES, PRESET_CONFIG_DEFAULTS, PRESET_MANAGED_FIELDS, PeopleComponent, PhoneComponent, PriorityComponent, ProgressComponent, RatingComponent, SEEDED_FIELD_KEYS, SELF_COLOURED_DATATYPES, SelectComponent, StatusComponent, TagComponent, TextareaComponent, TextboxComponent, ThemeService, ThemeToggleComponent, WebsiteComponent, abbreviateNumber, abbreviationScaleFor, cellRuleBarPercent, cellRuleMatches, cellRuleToCss, cellStatAlias, cellTextStyleToCss, collectColumnStatRequests, columnCellRules, composeColorValue, effectiveValueDatatype, evaluateRowCondition, formatCellValue, formatDateTimeWithPattern, formatDateWithPattern, formatNumberValue, hasOwnCellRules, matchCellRule, matchColorRange, normalizeCellRender, normalizeDatatype, normalizeDateFormat, normalizeDateTimeFormat, parseCellDate, parseCellDateTime, parseColorValue, parseDateWithPattern, readRowValue, resolveColumnRules, resolveRowValue, resolveStatValue, rowSelectionKey, statusPillColors, tagPillColors, toDateOnlyString, toDateTimeString };
 //# sourceMappingURL=eru-grid.mjs.map