@adaptabletools/adaptable 20.0.6 → 20.0.7-canary.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable",
-  "version": "20.0.6",
+  "version": "20.0.7-canary.1",
   "description": "Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements",
   "keywords": [
     "web-components",

package/src/AdaptableOptions/ColumnOptions.d.ts

@@ -1,5 +1,5 @@
 import { Column } from 'ag-grid-enterprise';
-import { AdaptableColumnGroup, BaseContext } from '../types';
+import { AdaptableColumnGroup, BaseContext, Layout } from '../types';
 /**
  * Options related to managing Columns in Adaptable.
  */
@@ -9,6 +9,10 @@ export interface ColumnOptions {
      * @defaultValue  undefined
      */
     columnFriendlyName?: (columnFriendlyNameContext: ColumnFriendlyNameContext) => string | undefined;
+    /**
+     * Provide a custom Header Name for a Table or Pivot Column
+     */
+    columnHeader?: (context: ColumnHeaderContext) => string;
     /**
      * Optional list of Column Types - used for Scope and creating Special Columns
      * @defaultValue Empty Array
@@ -31,10 +35,177 @@ export interface ColumnOptions {
      */
     addColumnGroupToColumnFriendlyName?: boolean;
 }
+/**
+ * Common properties for Column Header Context
+ */
+export type BaseColumnHeaderContext = {
+    /**
+     * The default header name for the column
+     */
+    defaultHeaderName: string;
+    /**
+     * The mame of the current Layout
+     */
+    currentLayoutName: string;
+    /**
+     * The type (table/pivot) of the current Layout
+     */
+    currentLayoutType: 'table' | 'pivot';
+    /**
+     * The current Layout
+     */
+    currentLayout: Layout;
+} & BaseContext;
+export type ColumnHeaderContext = BaseColumnHeaderContext & ({
+    /**
+     * Auto-generated Group Column when GroupDisplayType is `single` column
+     */
+    columnType: 'autoGroupColumn';
+    /**
+     * Technical ID of the Column
+     */
+    columnId: string;
+    /**
+     * IDs of the Columns that are grouped
+     */
+    groupedColumnIds: string[];
+} | {
+    /**
+     * Group Columns - see `TableLayout.RowGroupedColumns` or `PivotLayout.PivotGroupedColumns`
+     */
+    columnType: 'groupColumn';
+    /**
+     * Technical ID of the Column
+     */
+    columnId: string;
+    /**
+     * ID of the grouped Column
+     */
+    groupColumnId: string;
+} | {
+    /**
+     *  Table Column - see `TableLayout.TableColumns`
+     */
+    columnType: 'tableColumn';
+    /**
+     * Technical ID of the Column
+     */
+    columnId: string;
+    /**
+     * Optional Aggregation function of the Column - see `TableLayout.TableAggregationColumns`
+     */
+    aggregation?: string;
+} | {
+    /**
+     * Column Group - see https://www.ag-grid.com/javascript-data-grid/column-groups/
+     */
+    columnType: 'tableColumnGroup';
+    /**
+     * Technical ID of the Column Group - see `ColGroupDef.groupId`
+     */
+    groupId: string;
+    /**
+     * IDs of the Column Group children - see `ColGroupDef.children`
+     */
+    childrenColumnIds: string[];
+    /**
+     * State of the Column Group
+     */
+    state: 'expanded' | 'collapsed';
+} | {
+    /**
+     * Pivot Column - see `PivotLayout.PivotColumns`
+     */
+    columnType: 'pivotColumnGroup';
+    /**
+     * Technical ID of the generated Column Group
+     */
+    groupId: string;
+    /**
+     * Pivot Keys for the current Column Group
+     */
+    pivotKeys: string[];
+    /**
+     * State of the Column Group
+     */
+    state: 'expanded' | 'collapsed';
+} | {
+    /**
+     * Pivot Aggregation Column - see `PivotLayout.PivotAggregationColumns`
+     */
+    columnType: 'pivotAggregationColumn';
+    /**
+     * Technical ID of the generated Column
+     */
+    columnId: string;
+    /**
+     * Current Pivot Keys
+     */
+    pivotKeys: string[];
+    /**
+     * ID of the Aggregated Column - see `PivotLayout.PivotAggregationColumns`
+     */
+    aggregatedColumnId: string;
+    /**
+     *  Aggregation function of the Column - see `PivotLayout.PivotAggregationColumns.AggregationColumnValue`
+     */
+    aggregation: string;
+} | {
+    /**
+     * Grand Total Column - see `PivotLayout.GrandTotalColumn`
+     */
+    columnType: 'pivotGrandTotal';
+    /**
+     * ID of the Aggregated Column - see `PivotLayout.PivotAggregationColumns`
+     */
+    aggregatedColumnId: string;
+    /**
+     *  Aggregation function of the Column - see `PivotLayout.PivotAggregationColumns.AggregationColumnValue`
+     */
+    aggregation: string;
+} | {
+    /**
+     * Pivot Group Total Column - see `PivotLayout.PivotGroupTotalColumn`
+     */
+    columnType: 'pivotGroupTotal';
+    /**
+     * Current Pivot Keys
+     */
+    pivotKey: string;
+    /**
+     * ID of the Pivot Column - see `PivotLayout.PivotColumns`
+     */
+    pivotColumnId: string;
+    /**
+     *  Aggregation function of the Column - see `PivotLayout.PivotAggregationColumns.AggregationColumnValue`
+     */
+    aggregation: string;
+} | {
+    /**
+     * Pivot Aggregation Total Column - see `PivotLayout.PivotAggregationColumns.TotalColumn`
+     */
+    columnType: 'pivotAggregationTotal';
+    /**
+     * ID of the Aggregated Column - see `PivotLayout.PivotAggregationColumns`
+     */
+    aggregatedColumnId: string;
+    /**
+     *  Aggregation function of the Column - see `PivotLayout.PivotAggregationColumns.AggregationColumnValue`
+     */
+    aggregation: string;
+    /**
+     * ID of the Pivot Column - see `PivotLayout.PivotColumns`
+     */
+    pivotColumnId: string;
+    /**
+     * Current Pivot Keys
+     */
+    pivotKey: string;
+});
 /**
  * Context used when setting a Column Friendly Name
  */
-export interface ColumnFriendlyNameContext {
+export interface ColumnFriendlyNameContext extends BaseContext {
     /**
      * Id of the Column
      */

package/src/AdaptableState/Common/AggregationColumns.d.ts

@@ -12,7 +12,14 @@ export type TableAggregationColumns = {
 /**
  * Defines an Aggregated Column in a Pivot Layout
  */
-export type PivotAggregationColumns = TableAggregationColumns;
+export type PivotAggregationColumns = {
+    ColumnId: string;
+    AggFunc: AggregationColumnValue;
+    TotalColumn?: boolean | 'before' | 'after' | {
+        PivotColumnId: string;
+        ShowTotal?: boolean | 'before' | 'after';
+    }[];
+}[];
 export declare const WEIGHTED_AVERAGE_AGG_FN_NAME = "weightedAvg";
 /**
  * Defines a Weighted Average Agg

package/src/AdaptableState/LayoutState.d.ts

@@ -148,6 +148,18 @@ export interface PivotLayout extends LayoutBase {
      * Row Grouped Columns Columns - must NOT be provided
      */
     RowGroupedColumns?: never;
+    /**
+     * Display Grand Total Row at the top or bottom of the Pivot Table
+     */
+    GrandTotalRow?: 'top' | 'bottom' | boolean;
+    /**
+     * Display automatically calculated Totals of all Pivot Columns, in the position specified
+     */
+    GrandTotalColumn?: 'before' | 'after' | boolean;
+    /**
+     * Display automatically calculated Totals within EACH Pivot Column Group, in the position specified
+     */
+    PivotGroupTotalColumn?: 'before' | 'after' | boolean;
 }
 /**
  * Manages how (and which) Row Group values are stored

package/src/Api/Implementation/ColumnApiImpl.d.ts

@@ -11,6 +11,7 @@ export declare function generateAutoTreeSingleColumn(): AdaptableColumn;
 export declare function generateAutoRowGroupColumnForColumn(column: AdaptableColumn): AdaptableColumn;
 export declare function getFriendlyNameForPivotResultColumn(columnId: string): string;
 export declare function isPivotResultColumn(columnId: string): boolean;
+export declare function isPivotGrandTotalColumn(columnId: string): boolean;
 export declare class ColumnApiImpl extends ApiBase implements ColumnApi {
     internalApi: ColumnInternalApi;
     constructor(_adaptable: IAdaptable);

package/src/Api/Implementation/ColumnApiImpl.js

@@ -63,6 +63,13 @@ export function generateAutoRowGroupColumnForColumn(column) {
     };
 }
 export function getFriendlyNameForPivotResultColumn(columnId) {
+    if (isPivotGrandTotalColumn(columnId)) {
+        return `[Grand Total] ${columnId
+            .split('_')
+            .slice(2)
+            .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+            .join(' ')}`;
+    }
     return `[Pivot] ${columnId
         .split('_')
         .slice(1)
@@ -73,6 +80,9 @@ export function isPivotResultColumn(columnId) {
     // put this here as there might be other indicators we are not aware of?
     return columnId?.startsWith(GeneralConstants.AG_GRID_PIVOT_COLUMN);
 }
+export function isPivotGrandTotalColumn(columnId) {
+    return columnId?.startsWith(GeneralConstants.AG_GRID_PIVOT_GRAND_TOTAL_COLUMN);
+}
 export class ColumnApiImpl extends ApiBase {
     constructor(_adaptable) {
         super(_adaptable);
@@ -136,7 +146,7 @@ export class ColumnApiImpl extends ApiBase {
         return isAutoRowGroupColumn(columnId);
     }
     isPivotResultColumn(columnId) {
-        return isPivotResultColumn(columnId);
+        return isPivotResultColumn(columnId) || isPivotGrandTotalColumn(columnId);
     }
     isAutoRowGroupColumnForSingle(columnId) {
         return columnId === GROUP_COLUMN_ID__SINGLE;

package/src/Api/Implementation/LayoutHelpers.js

@@ -197,12 +197,16 @@ export const pivotLayoutToPivotLayoutModel = (pivotLayout) => {
         ColumnPinning: pivotLayout.ColumnPinning,
         PivotColumns: pivotLayout.PivotColumns,
         PivotExpandLevel: pivotLayout.PivotExpandLevel,
-        PivotAggregationColumns: (pivotLayout.PivotAggregationColumns || []).map(({ ColumnId, AggFunc }) => {
+        PivotAggregationColumns: (pivotLayout.PivotAggregationColumns || []).map(({ ColumnId, AggFunc, TotalColumn }) => {
             return {
                 ColumnId,
                 AggFunc: toAggFunc(AggFunc),
+                TotalColumn,
             };
         }),
+        GrandTotalRow: pivotLayout.GrandTotalRow,
+        GrandTotalColumn: pivotLayout.GrandTotalColumn,
+        PivotGroupTotalColumn: pivotLayout.PivotGroupTotalColumn,
         RowGroupValues: pivotLayout.RowGroupValues
             ? pivotLayout.RowGroupValues.RowGroupDefaultBehavior === 'always-collapsed' ||
                 pivotLayout.RowGroupValues.RowGroupDefaultBehavior === 'always-expanded'
@@ -326,10 +330,29 @@ export const pivotLayoutModelToPivotLayout = (layoutModel, defaults) => {
     else {
         delete pivotLayout.RowGroupValues;
     }
+    if (layoutModel.GrandTotalRow) {
+        pivotLayout.GrandTotalRow = layoutModel.GrandTotalRow;
+    }
+    else {
+        delete pivotLayout.GrandTotalRow;
+    }
+    if (layoutModel.GrandTotalColumn) {
+        pivotLayout.GrandTotalColumn = layoutModel.GrandTotalColumn;
+    }
+    else {
+        delete pivotLayout.GrandTotalColumn;
+    }
+    if (layoutModel.PivotGroupTotalColumn) {
+        pivotLayout.PivotGroupTotalColumn = layoutModel.PivotGroupTotalColumn;
+    }
+    else {
+        delete pivotLayout.PivotGroupTotalColumn;
+    }
     if (layoutModel.PivotAggregationColumns) {
-        pivotLayout.PivotAggregationColumns = (layoutModel.PivotAggregationColumns || []).map(({ ColumnId, AggFunc }) => ({
+        pivotLayout.PivotAggregationColumns = (layoutModel.PivotAggregationColumns || []).map(({ ColumnId, AggFunc, TotalColumn }) => ({
             ColumnId,
             AggFunc: toAggregationColumnValue(AggFunc),
+            TotalColumn,
         }));
     }
     else {

package/src/Api/Internal/ColumnInternalApi.d.ts

@@ -1,5 +1,5 @@
 import { ApiBase } from '../Implementation/ApiBase';
-import { Column, IRowNode } from 'ag-grid-enterprise';
+import { Column, HeaderValueGetterParams, IRowNode } from 'ag-grid-enterprise';
 import { CustomSort } from '../../AdaptableState/CustomSortState';
 import { ColumnValuesComparer } from '../../AdaptableOptions/CustomSortOptions';
 import { AdaptableColumn } from '../../types';
@@ -31,4 +31,6 @@ export declare class ColumnInternalApi extends ApiBase {
     getAgGridColumnForAdaptableColumn(columnId: string): Column;
     getActiveColumnComparator(columnId: string, customSort?: CustomSort, customSortComparer?: ColumnValuesComparer): (valueA: any, valueB: any, nodeA?: IRowNode, nodeB?: IRowNode, isInverted?: boolean) => number | undefined;
     isSpecialColumn(columnId: string, column?: AdaptableColumn): boolean;
+    getColumnHeaderName(params: HeaderValueGetterParams): string;
+    private buildColumnHeaderContext;
 }

package/src/Api/Internal/ColumnInternalApi.js

@@ -2,6 +2,10 @@ import { ApiBase } from '../Implementation/ApiBase';
 import { AG_GRID_GROUPED_COLUMN } from '../../Utilities/Constants/GeneralConstants';
 import uniq from 'lodash/uniq';
 import StringExtensions from '../../Utilities/Extensions/StringExtensions';
+import { isPivotGrandTotalColumn, isPivotResultColumn } from '../Implementation/ColumnApiImpl';
+import { destructurePivotColumnId } from '../../layout-manager/src/destructurePivotColumnId';
+import { isPivotGroupTotalColumn } from '../../layout-manager/src/isPivotGroupTotalColumn';
+import { isPivotTotalColumn } from '../../layout-manager/src/isPivotTotalColumn';
 export function getAutoRowGroupColumnIdFor(columnId) {
     return `${AG_GRID_GROUPED_COLUMN}-${columnId}`;
 }
@@ -81,4 +85,201 @@ export class ColumnInternalApi extends ApiBase {
                 this.getColumnApi().isActionColumn(columnId) ||
                 this.getColumnApi().isFdc3Column(columnId));
     }
+    getColumnHeaderName(params) {
+        // this is the same object, but casting it makes it easier to work with
+        const isColumn = !params.columnGroup;
+        const columnParams = params;
+        const isColumnGroup = !!params.columnGroup;
+        const columnGroupParams = params;
+        const defaultHeaderName = params.colDef?.headerName ??
+            (isColumn ? StringExtensions.CamelCaseToHumanText(columnParams.colDef?.field) : '') ??
+            '';
+        // for now we override ONLY the header names
+        if (params.location !== 'header') {
+            return defaultHeaderName;
+        }
+        // 1. Layout specific header has the highest priority
+        const layoutSpecificCustomHeader = this.getLayoutApi().getCurrentLayout().ColumnHeaders?.[isColumn ? columnParams.column.getColId() : columnGroupParams.columnGroup.getGroupId()];
+        if (layoutSpecificCustomHeader) {
+            return layoutSpecificCustomHeader;
+        }
+        // 2. check for custom ColumnOptions.columnHeader
+        if (typeof this.getColumnOptions().columnHeader === 'function') {
+            const columnHeaderContext = this.buildColumnHeaderContext(params, defaultHeaderName);
+            if (columnHeaderContext === 'skip') {
+                return defaultHeaderName;
+            }
+            const customHeader = this.getColumnOptions().columnHeader(columnHeaderContext);
+            return customHeader;
+        }
+        // 3. fallback to default header name
+        return defaultHeaderName;
+    }
+    buildColumnHeaderContext(params, defaultHeaderName) {
+        const currentLayoutType = this.getLayoutApi().isCurrentLayoutPivot() ? 'pivot' : 'table';
+        const currentLayout = this.getLayoutApi().getCurrentLayout();
+        const baseContext = {
+            ...this.getAdaptableApi().internalApi.buildBaseContext(),
+            defaultHeaderName,
+            currentLayout,
+            currentLayoutName: currentLayout.Name,
+            currentLayoutType: currentLayoutType,
+        };
+        // makes it easier to work with
+        const currentTableLayout = currentLayout;
+        const currentPivotLayout = currentLayout;
+        if (params.column?.getColId() === AG_GRID_GROUPED_COLUMN) {
+            const columnType = 'autoGroupColumn';
+            return {
+                ...baseContext,
+                columnType,
+                columnId: params.column.getColId(),
+                groupedColumnIds: currentLayoutType === 'table'
+                    ? currentTableLayout.RowGroupedColumns ?? []
+                    : currentPivotLayout.PivotGroupedColumns ?? [],
+            };
+        }
+        if (params.column?.getColId().startsWith(`${AG_GRID_GROUPED_COLUMN}-`)) {
+            const columnType = 'groupColumn';
+            const columnId = params.column.getColId();
+            // remove `${AG_GRID_GROUPED_COLUMN}-` from beginning of columnId
+            const groupColumnId = columnId.substring(`${AG_GRID_GROUPED_COLUMN}-`.length);
+            return {
+                ...baseContext,
+                columnType,
+                columnId,
+                groupColumnId,
+            };
+        }
+        if (baseContext.currentLayoutType === 'table') {
+            if (params.columnGroup) {
+                const columnType = 'tableColumnGroup';
+                if (!params.colDef?.children) {
+                    // AG Grid created virtual column groups for all columns
+                    // we want to skip those
+                    return 'skip';
+                }
+                return {
+                    ...baseContext,
+                    columnType,
+                    groupId: params.columnGroup?.getGroupId(),
+                    childrenColumnIds: params.columnGroup
+                        ?.getChildren()
+                        .map((col) => {
+                        if (col.isColumn) {
+                            return col.getColId();
+                        }
+                    })
+                        .filter(Boolean),
+                    state: params.columnGroup?.isExpandable() && !params.columnGroup?.isExpanded()
+                        ? 'collapsed'
+                        : 'expanded',
+                };
+            }
+            if (params.column) {
+                const columnType = 'tableColumn';
+                return {
+                    ...baseContext,
+                    columnType,
+                    columnId: params.column?.getColId(),
+                    aggregation: params.column.getAggFunc(),
+                };
+            }
+        }
+        if (baseContext.currentLayoutType === 'pivot') {
+            if (params.columnGroup) {
+                if (!params.colDef?.pivotKeys) {
+                    // we might have user defined colGroups, but we are not interested in them in pivot mode
+                    return 'skip';
+                }
+                const columnType = 'pivotColumnGroup';
+                return {
+                    ...baseContext,
+                    columnType,
+                    groupId: params.columnGroup?.getGroupId(),
+                    pivotKeys: params.colDef.pivotKeys,
+                    state: params.columnGroup?.isExpandable() && !params.columnGroup?.isExpanded()
+                        ? 'collapsed'
+                        : 'expanded',
+                };
+            }
+            if (params.column) {
+                let columnId = params.column.getColId();
+                if (isPivotGrandTotalColumn(columnId)) {
+                    const columnType = 'pivotGrandTotal';
+                    const pivotValueCol = params.colDef.pivotValueColumn;
+                    const aggregatedColumnId = pivotValueCol?.getColId();
+                    const currentLayoutAggCols = currentPivotLayout.PivotAggregationColumns?.map((col) => col.ColumnId);
+                    if (!currentLayoutAggCols?.includes(aggregatedColumnId)) {
+                        // this column is not an aggregation column
+                        return 'skip';
+                    }
+                    return {
+                        ...baseContext,
+                        columnType,
+                        aggregatedColumnId,
+                        aggregation: pivotValueCol.getAggFunc(),
+                    };
+                }
+                if (isPivotGroupTotalColumn(params.colDef)) {
+                    const columnType = 'pivotGroupTotal';
+                    const pivotColInfo = destructurePivotColumnId(params.colDef, {
+                        pivotColIds: currentPivotLayout.PivotColumns,
+                        aggColIds: currentPivotLayout.PivotAggregationColumns.map((col) => col.ColumnId),
+                    }, (message) => this.logWarn(message));
+                    if (pivotColInfo === '!unknown!') {
+                        return 'skip';
+                    }
+                    const pivotKey = pivotColInfo.pivotKeys[pivotColInfo.pivotKeys.length - 1];
+                    return {
+                        ...baseContext,
+                        columnType,
+                        pivotKey,
+                        pivotColumnId: pivotColInfo.pivotColumnId,
+                        aggregation: params.colDef?.pivotValueColumn?.getAggFunc(),
+                    };
+                }
+                if (isPivotTotalColumn(params.colDef)) {
+                    const columnType = 'pivotAggregationTotal';
+                    const pivotValueCol = params.colDef.pivotValueColumn;
+                    const pivotColInfo = destructurePivotColumnId(params.colDef, {
+                        pivotColIds: currentPivotLayout.PivotColumns,
+                        aggColIds: currentPivotLayout.PivotAggregationColumns.map((col) => col.ColumnId),
+                    }, (message) => this.logWarn(message));
+                    if (pivotColInfo === '!unknown!') {
+                        return 'skip';
+                    }
+                    const pivotKey = pivotColInfo.pivotKeys[pivotColInfo.pivotKeys.length - 1];
+                    return {
+                        ...baseContext,
+                        columnType,
+                        aggregatedColumnId: pivotValueCol?.getColId(),
+                        aggregation: pivotValueCol.getAggFunc(),
+                        pivotColumnId: pivotColInfo.pivotColumnId,
+                        pivotKey,
+                    };
+                }
+                if (isPivotResultColumn(columnId)) {
+                    const columnType = 'pivotAggregationColumn';
+                    const pivotValueCol = params.colDef.pivotValueColumn;
+                    const aggregatedColumnId = pivotValueCol?.getColId();
+                    const currentLayoutAggCols = currentPivotLayout.PivotAggregationColumns?.map((col) => col.ColumnId);
+                    if (!currentLayoutAggCols?.includes(aggregatedColumnId)) {
+                        // this column is not an aggregation column
+                        return 'skip';
+                    }
+                    return {
+                        ...baseContext,
+                        columnType,
+                        columnId,
+                        pivotKeys: params.colDef.pivotKeys,
+                        aggregatedColumnId,
+                        aggregation: pivotValueCol.getAggFunc(),
+                    };
+                }
+            }
+        }
+        // if nothing matched, we skip this column[group]
+        return 'skip';
+    }
 }

package/src/Utilities/Constants/GeneralConstants.d.ts

@@ -24,6 +24,7 @@ export declare const GROUP_PATH_SEPARATOR: string;
 export declare const AG_GRID_GROUPED_COLUMN: string;
 export declare const AG_GRID_SELECTION_COLUMN: string;
 export declare const AG_GRID_PIVOT_COLUMN: string;
+export declare const AG_GRID_PIVOT_GRAND_TOTAL_COLUMN: string;
 export declare const AG_GRID_CHART_WINDOW = "AG Grid Window";
 export declare const ADAPTABLE_FDC3_ACTION_COLUMN_FRIENDLY_NAME = "(FDC3ActionColumn)";
 export declare const DEFAULT_DATE_FORMAT_PATTERN = "dd-MM-yyyy";

package/src/Utilities/Constants/GeneralConstants.js

@@ -23,6 +23,7 @@ export const GROUP_PATH_SEPARATOR = '/';
 export const AG_GRID_GROUPED_COLUMN = 'ag-Grid-AutoColumn';
 export const AG_GRID_SELECTION_COLUMN = 'ag-Grid-SelectionColumn';
 export const AG_GRID_PIVOT_COLUMN = 'pivot_';
+export const AG_GRID_PIVOT_GRAND_TOTAL_COLUMN = 'PivotRowTotal_pivot_';
 export const AG_GRID_CHART_WINDOW = 'AG Grid Window';
 export const ADAPTABLE_FDC3_ACTION_COLUMN_FRIENDLY_NAME = '(FDC3ActionColumn)';
 // FIXME AFL - load this from DateInputOptions

package/src/Utilities/Extensions/StringExtensions.js

@@ -23,13 +23,21 @@ export function IsNullOrEmptyOrWhiteSpace(stringToCheck) {
 export function IsNotNullOrEmptyOrWhiteSpace(stringToCheck) {
     return !IsNullOrEmptyOrWhiteSpace(stringToCheck);
 }
-// from https://stackoverflow.com/questions/15369566/putting-space-in-camel-case-string-using-regular-expression
+// clone of A Grid's implementation
+// https://github.com/ag-grid/ag-grid/blob/a5c3d9f56350271ab7e8d42d72aaf5314672719a/packages/ag-grid-community/src/columns/columnNameService.ts#L14
 export function CamelCaseToHumanText(camelCase) {
     if (!camelCase || camelCase == null) {
         return null;
     }
-    const rex = /([A-Z])([A-Z])([a-z])|([a-z])([A-Z])/g;
-    const words = camelCase.replace(rex, '$1$4 $2$3$5').replace('.', ' ').split(' ');
+    // either split on a lowercase followed by uppercase ie  asHereTo -> as Here To
+    const rex = /([a-z])([A-Z])/g;
+    // or starts with uppercase and we take all expect the last which is assumed to be part of next word if followed by lowercase HEREToThere -> HERE To There
+    const rexCaps = /([A-Z]+)([A-Z])([a-z])/g;
+    const words = camelCase
+        .replace(rex, '$1 $2')
+        .replace(rexCaps, '$1 $2$3')
+        .replace(/\./g, ' ')
+        .split(' ');
     return words
         .map((word) => word.substring(0, 1).toUpperCase() + (word.length > 1 ? word.substring(1, word.length) : ''))
         .join(' ');

package/src/Utilities/adaptableOverrideCheck.d.ts

@@ -0,0 +1,2 @@
+export declare function tagProvidedByAdaptable(fn: any): any;
+export declare function isProvidedByAdaptable(fn: any): boolean;

package/src/Utilities/adaptableOverrideCheck.js

@@ -0,0 +1,8 @@
+const PROVIDED_BY_ADAPTABLE = Symbol('isProvidedByAdaptable');
+export function tagProvidedByAdaptable(fn) {
+    fn[PROVIDED_BY_ADAPTABLE] = true;
+    return fn;
+}
+export function isProvidedByAdaptable(fn) {
+    return fn && !!fn[PROVIDED_BY_ADAPTABLE];
+}

package/src/agGrid/AdaptableAgGrid.js

@@ -97,6 +97,7 @@ import { ACTION_COLUMN_TYPE, CALCULATED_COLUMN_TYPE, FDC3_COLUMN_TYPE, FREE_TEXT
 import { agGridDataTypeDefinitions } from './agGridDataTypeDefinitions';
 import { AgGridThemeAdapter } from './AgGridThemeAdapter';
 import { mapOldTypeToDataType } from '../migration/VersionUpgrade20';
+import { tagProvidedByAdaptable } from '../Utilities/adaptableOverrideCheck';
 const LocalEventService_Prototype = LocalEventService.prototype;
 const LocalEventService_dispatchEvent = LocalEventService_Prototype.dispatchEvent;
 LocalEventService_Prototype.dispatchEvent = function (event) {
@@ -610,6 +611,34 @@ You need to define at least one Layout!`);
             this.agGridAdapter.setAgGridId(agGridId);
             return agGridId;
         });
+        /**
+         * `defaultColDef`
+         */
+        this.agGridOptionsService.setGridOptionsProperty(gridOptions, 'defaultColDef', (original_defaultColDef) => {
+            if (original_defaultColDef?.headerValueGetter) {
+                this.logger.warn(`defaultColDef.headerValueGetter and overrides the Adaptable custom header mechanism! We recommend using a ColumnOptions.tableColumnHeader instead!`);
+                return original_defaultColDef;
+            }
+            const defaultColDef = { ...original_defaultColDef };
+            defaultColDef.headerValueGetter = tagProvidedByAdaptable((params) => {
+                return this.api.columnApi.internalApi.getColumnHeaderName(params);
+            });
+            return defaultColDef;
+        });
+        /**
+         * `defaultColGroupDef`
+         */
+        this.agGridOptionsService.setGridOptionsProperty(gridOptions, 'defaultColGroupDef', (original_defaultColGroupDef) => {
+            if (original_defaultColGroupDef?.headerValueGetter) {
+                this.logger.warn(`defaultColGroupDef.headerValueGetter and overrides the Adaptable custom header mechanism! We recommend using a ColumnOptions.tableColumnHeader instead!`);
+                return original_defaultColGroupDef;
+            }
+            const defaultColGroupDef = { ...original_defaultColGroupDef };
+            defaultColGroupDef.headerValueGetter = tagProvidedByAdaptable((params) => {
+                return this.api.columnApi.internalApi.getColumnHeaderName(params);
+            });
+            return defaultColGroupDef;
+        });
         /**
          * `theme`
          */

package/src/agGrid/AgGridAdapter.js

@@ -374,6 +374,7 @@ export class AgGridAdapter {
                     agColumn: agGridColumn,
                     columnGroup: isRealColumnGroup ? ColumnGroup : undefined,
                     displayName: displayName,
+                    ...this.adaptableApi.internalApi.buildBaseContext(),
                 })
                 : null;
             friendlyName =