@adaptabletools/adaptable 20.2.0-canary.1 → 20.2.1

package/src/agGrid/AdaptableAgGrid.js

@@ -1322,12 +1322,12 @@ You need to define at least one Layout!`);
             this.autoSizeLayoutIfNeeded();
         }));
         /**
-         * Use Case: A format column that has ColumnGroupState needs to be re-evaluated
+         * Use Case: A format column that has ColumnGroupScope needs to be re-evaluated
          * whenever a column group is expanded or collapsed
          */
         this.agGridAdapter.getAgGridApi().addEventListener('columnGroupOpened', (this.listenerColumnGroupOpened = () => {
             if (this.api.formatColumnApi.getActiveFormatColumns().some((fc) => {
-                return fc.ColumnGroupState != null;
+                return fc.ColumnGroupScope != null;
             })) {
                 this.updateColumnModelAndRefreshGrid();
             }
@@ -1402,11 +1402,25 @@ You need to define at least one Layout!`);
         ];
         const chartingModule = this.ModuleService.getModuleById('Charting');
         if (chartingModule.isModuleAvailable()) {
-            this.agGridAdapter.getAgGridApi().addGlobalListener((type, params) => {
-                if (ArrayExtensions.ContainsItem(eventsThatTriggerChartingChanges, type)) {
+            // We need to break the loop of charting changes for 'chartOptionsChanged', which is triggered by the subsequent agGridApi.updateChart(...)
+            // see #ag_grid_update_chart_loop
+            let lastChartOptionsChangePayload = '';
+            this.listenerGlobalChartingChanges = (type, params) => {
+                if (eventsThatTriggerChartingChanges.includes(type)) {
+                    if (type === 'chartOptionsChanged') {
+                        // Exclude api and context
+                        const { api, context, ...sanitizedParams } = params || {};
+                        const eventPayload = JSON.stringify(sanitizedParams);
+                        if (eventPayload === lastChartOptionsChangePayload) {
+                            // this is a loop, so we ignore it
+                            return;
+                        }
+                        lastChartOptionsChangePayload = eventPayload;
+                    }
                     this.ChartingService.onChartModelChange(this.getChartModels(), type, params);
                 }
-            });
+            };
+            this.agGridAdapter.getAgGridApi().addGlobalListener(this.listenerGlobalChartingChanges);
         }
         /**
          * Row and Cell listeners created in 2020
@@ -2705,6 +2719,10 @@ You need to define at least one Layout!`);
         return chartRef;
     }
     updateChart(chart) {
+        if (!chart.Model) {
+            this.logger.consoleError(`Chart definition must have a Model property to be updated: ${chart.Name}`);
+            return;
+        }
         const upgradableProperties = {
             // Only Range charts are supported to be created at run time
             // the other two are pivot & cross-filter
@@ -2714,6 +2732,7 @@ You need to define at least one Layout!`);
             suppressChartRanges: Boolean(chart.Model.suppressChartRanges),
             aggFunc: chart.Model.aggFunc,
         };
+        // see also #ag_grid_update_chart_loop
         this.agGridAdapter.getAgGridApi().updateChart(upgradableProperties);
     }
     getChartModels() {
@@ -2930,6 +2949,9 @@ You need to define at least one Layout!`);
             agGridApi.removeEventListener('columnGroupOpened', this.listenerColumnGroupOpened);
             agGridApi.removeEventListener('sortChanged', this.listenerSortChanged);
             agGridApi.removeGlobalListener(this.listenerGlobalSetRowSelection);
+            if (this.listenerGlobalChartingChanges) {
+                this.agGridAdapter.getAgGridApi().removeGlobalListener(this.listenerGlobalChartingChanges);
+            }
             this.listenerFirstDataRendered = null;
             this.listenerPivotChanged = null;
             this.listenerColumnGroupOpened = null;
@@ -3007,7 +3029,9 @@ You need to define at least one Layout!`);
         }
         this.DANGER_USE_GETTER_adaptableContainerElement = null;
         this.DANGER_USE_GETTER_agGridContainerElement = null;
+        this.debouncedSetSelectedCells?.cancel?.();
         this.debouncedSetSelectedCells = null;
+        this.debouncedSetSelectedRows?.cancel?.();
         this.debouncedSetSelectedRows = null;
         this.adaptableStore?.destroy();
         this.adaptableStore = null;

package/src/agGrid/AgGridColumnAdapter.d.ts

@@ -36,6 +36,7 @@ export declare class AgGridColumnAdapter {
     private setupColumnValueSetter;
     private setupColumnComparator;
     private setupColumnGetFindText;
+    private getCellSearchText;
     private isCellSearchable;
     private isQuickSearchActive;
     private getEditableCellClass;

package/src/agGrid/AgGridColumnAdapter.js

@@ -1,3 +1,4 @@
+import kebabCase from 'lodash/kebabCase';
 import merge from 'lodash/merge';
 import { FilterWrapperFactory } from './FilterWrapper';
 import { FloatingFilterWrapperFactory } from './FloatingFilterWrapper';
@@ -210,15 +211,17 @@ export class AgGridColumnAdapter {
             const quickSearchCurrentTextMatchStyle = this.getQuickSearchCurrentTextMatchStyle();
             const textMatchStyle = quickSearchTextMatchStyle
                 ? Object.entries(quickSearchTextMatchStyle).reduce((acc, [key, value]) => {
+                    // needed as AG-Grid vanilla turns all CSS props
+                    // to kebab, while AG Grid React does not
                     // @ts-ignore
-                    acc[`--ab-dynamic-${key}`] = value;
+                    acc[`--ab-dynamic-${kebabCase(key)}`] = value;
                     return acc;
                 }, {})
                 : undefined;
             const currentTextMatchStyle = quickSearchCurrentTextMatchStyle
                 ? Object.entries(quickSearchCurrentTextMatchStyle).reduce((acc, [key, value]) => {
                     // @ts-ignore
-                    acc[`--ab-dynamic-${key}`] = value;
+                    acc[`--ab-dynamic-${kebabCase(key)}`] = value;
                     return acc;
                 }, {})
                 : undefined;
@@ -685,18 +688,25 @@ export class AgGridColumnAdapter {
                 }
                 const getCellSearchText = this.adaptableOptions.quickSearchOptions.getCellSearchText;
                 if (getCellSearchText) {
-                    const quickSearchValue = this.adaptableApi.quickSearchApi.getQuickSearchValue();
-                    const quickSearchContext = {
-                        ...this.adaptableApi.internalApi.buildBaseContext(),
-                        gridCell,
-                        quickSearchValue,
-                    };
-                    return getCellSearchText(quickSearchContext);
+                    return this.getCellSearchText(gridCell);
                 }
                 return userGetFindText?.(params) ?? gridCell.displayValue;
             };
         });
     }
+    getCellSearchText(gridCell) {
+        const getCellSearchText = this.adaptableOptions.quickSearchOptions.getCellSearchText;
+        if (getCellSearchText) {
+            const quickSearchValue = this.adaptableApi.quickSearchApi.getQuickSearchValue();
+            const quickSearchContext = {
+                ...this.adaptableApi.internalApi.buildBaseContext(),
+                gridCell,
+                quickSearchValue,
+            };
+            return getCellSearchText(quickSearchContext);
+        }
+        return gridCell.displayValue;
+    }
     isCellSearchable(gridCell) {
         const isCellSearchableFn = this.adaptableOptions.quickSearchOptions.isCellSearchable;
         if (!gridCell.column) {
@@ -732,6 +742,16 @@ export class AgGridColumnAdapter {
         if (!column) {
             return false;
         }
+        const isServerSideRowModel = this.adaptableApi.gridApi.getAgGridRowModelType() === 'serverSide';
+        if (isServerSideRowModel) {
+            const isCaseSensitive = this.adaptableOptions.quickSearchOptions.isQuickSearchCaseSensitive;
+            const cellDisplayValue = String(this.getCellSearchText(gridCell));
+            const displayValue = isCaseSensitive
+                ? cellDisplayValue
+                : cellDisplayValue.toLocaleLowerCase();
+            const searchText = isCaseSensitive ? quickSearchValue : quickSearchValue.toLocaleLowerCase();
+            return displayValue.indexOf(searchText) !== -1;
+        }
         return (this.agGridApi.findGetNumMatches({
             column,
             node: gridCell.rowNode,

package/src/agGrid/AgGridExportAdapter.js

@@ -180,19 +180,19 @@ export class AgGridExportAdapter {
             // recreating the standard AG Grid styling for row groups: 'Parent -> Child'
             // additionally the values are formatted
             let rowGroupNode = params.node;
-            const isFooterRow = rowGroupNode.footer;
+            const agColumn = params.column;
             const rowGroupSummary = [
-                this.processRowGroupForExcelExport(rowGroupNode, exportContext) ?? '',
+                this.processRowGroupForExcelExport(rowGroupNode, exportContext, agColumn) ?? '',
             ];
             while (rowGroupNode.parent) {
                 rowGroupNode = rowGroupNode.parent;
-                const formattedParentNode = this.processRowGroupForExcelExport(rowGroupNode, exportContext);
+                const formattedParentNode = this.processRowGroupForExcelExport(rowGroupNode, exportContext, agColumn);
                 if (formattedParentNode) {
                     rowGroupSummary.push(formattedParentNode);
                 }
             }
             let summary = rowGroupSummary.reverse().join(' -> ');
-            if (isFooterRow) {
+            if (agColumn?.getColId() === AG_GRID_GROUPED_COLUMN && rowGroupNode.footer) {
                 summary = `Total: ${summary}`;
             }
             return summary;
@@ -407,17 +407,29 @@ export class AgGridExportAdapter {
         }
         return this.getCellExportValueFromRawValue(rowNode, this.adaptableApi.gridApi.getRawValueFromRowNode(rowNode, columnId), columnId, exportContext);
     }
-    processRowGroupForExcelExport(rowNode, exportContext) {
+    processRowGroupForExcelExport(rowNode, exportContext, agColumn) {
         if (this.isTreeDataGrid()) {
             return rowNode.key;
         }
-        const columnId = rowNode.field ??
-            rowNode.rowGroupColumn?.getColId() ??
-            rowNode.rowGroupColumn?.getColDef()?.field;
-        if (!columnId || !rowNode.key) {
+        const getColIdAndRawValue = () => {
+            if (this.adaptableApi.columnApi.isAutoRowGroupColumn(agColumn?.getColId())) {
+                const columnId = rowNode.field ??
+                    rowNode.rowGroupColumn?.getColId() ??
+                    rowNode.rowGroupColumn?.getColDef()?.field;
+                let rawValue = rowNode.key;
+                return { columnId, rawValue };
+            }
+            if (this.adaptableApi.columnApi.isPivotResultColumn(agColumn.getColId())) {
+                const columnId = agColumn.getColId();
+                const rawValue = rowNode.aggData?.[columnId];
+                return { columnId, rawValue };
+            }
+            return {};
+        };
+        let { columnId, rawValue } = getColIdAndRawValue();
+        if (!columnId || rawValue == null) {
             return;
         }
-        let rawValue = rowNode.key;
         const columnDataType = this.adaptableApi.columnApi.getColumnDataTypeForColumnId(columnId);
         if ((columnDataType === 'date' || columnDataType === 'dateString') &&
             typeof rawValue === 'string' &&

package/src/components/WindowModal/useStacking.js

@@ -2,7 +2,8 @@ import * as React from 'react';
 import { createUuid } from '../utils/uuid';
 const setZIndexMap = {};
 const zIndexMap = [];
-const BASE_Z_INDEX = 1000;
+// starts with 3000, to be above the default zIndex of the Modal component
+const BASE_Z_INDEX = 3000;
 /**
  * Used to facilitate the stacking between multiple opened windows.
  * When calling 'bringToFront' brings caller to top.

package/src/env.js

@@ -1,5 +1,5 @@
 export default {
     NEXT_PUBLIC_INFINITE_TABLE_LICENSE_KEY: "StartDate=2021-06-29|EndDate=2030-01-01|Owner=Adaptable|Type=distribution|TS=1624971462479|C=137829811,1004007071,2756196225,1839832928,3994409405,636616862" || '',
-    PUBLISH_TIMESTAMP: 1749490679822 || Date.now(),
-    VERSION: "20.2.0-canary.1" || '--current-version--',
+    PUBLISH_TIMESTAMP: 1750416425464 || Date.now(),
+    VERSION: "20.2.1" || '--current-version--',
 };

package/src/metamodel/adaptable.metamodel.d.ts

@@ -934,11 +934,31 @@ export declare const ADAPTABLE_METAMODEL: {
         name: string;
         kind: string;
         desc: string;
-        props: {
+        props: ({
             name: string;
             kind: string;
             desc: string;
-        }[];
+            isOpt: boolean;
+            ref?: undefined;
+        } | {
+            name: string;
+            kind: string;
+            desc: string;
+            ref: string;
+            isOpt?: undefined;
+        } | {
+            name: string;
+            kind: string;
+            desc: string;
+            isOpt?: undefined;
+            ref?: undefined;
+        } | {
+            name: string;
+            kind: string;
+            desc: string;
+            isOpt: boolean;
+            ref: string;
+        })[];
     };
     AdaptableStatusBar: {
         name: string;
@@ -1667,6 +1687,11 @@ export declare const ADAPTABLE_METAMODEL: {
         kind: string;
         desc: string;
     };
+    CellAlignment: {
+        name: string;
+        kind: string;
+        desc: string;
+    };
     CellColorRange: {
         name: string;
         kind: string;
@@ -1975,6 +2000,11 @@ export declare const ADAPTABLE_METAMODEL: {
             ref?: undefined;
         })[];
     };
+    ColumnGroupScope: {
+        name: string;
+        kind: string;
+        desc: string;
+    };
     ColumnMenuContext: {
         name: string;
         kind: string;
@@ -3563,12 +3593,6 @@ export declare const ADAPTABLE_METAMODEL: {
         kind: string;
         desc: string;
         props: ({
-            name: string;
-            kind: string;
-            desc: string;
-            isOpt: boolean;
-            ref?: undefined;
-        } | {
             name: string;
             kind: string;
             desc: string;
@@ -5321,8 +5345,8 @@ export declare const ADAPTABLE_METAMODEL: {
             kind: string;
             desc: string;
             isOpt: boolean;
+            ref: string;
             defVal?: undefined;
-            ref?: undefined;
         } | {
             name: string;
             kind: string;
@@ -5337,13 +5361,6 @@ export declare const ADAPTABLE_METAMODEL: {
             isOpt: boolean;
             defVal: string;
             ref: string;
-        } | {
-            name: string;
-            kind: string;
-            desc: string;
-            isOpt: boolean;
-            ref: string;
-            defVal?: undefined;
         })[];
     };
     StatusBarState: {