@adaptabletools/adaptable-cjs 20.0.0-canary.1 → 20.0.0-canary.10

package/src/View/StyledColumn/Wizard/StyledColumnWizardTypeSection.js

@@ -18,7 +18,7 @@ const renderStyledColumnTypeSummary = (data) => {
     else if (data.PercentBarStyle) {
         type = 'Percent Bar';
     }
-    else if (data.SparkLineStyle) {
+    else if (data.SparklineStyle) {
         type = 'Spark Line';
     }
     else if (data.BadgeStyle) {
@@ -38,7 +38,7 @@ const StyledColumnWizardTypeSection = (props) => {
         };
         delete newStyledColumn.GradientStyle;
         delete newStyledColumn.PercentBarStyle;
-        delete newStyledColumn.SparkLineStyle;
+        delete newStyledColumn.SparklineStyle;
         delete newStyledColumn.BadgeStyle;
         switch (type) {
             case 'gradient':
@@ -48,7 +48,7 @@ const StyledColumnWizardTypeSection = (props) => {
                 newStyledColumn.PercentBarStyle = {};
                 break;
             case 'sparkline':
-                newStyledColumn.SparkLineStyle = {
+                newStyledColumn.SparklineStyle = {
                     options: {
                         type: 'line',
                     },
@@ -69,7 +69,7 @@ const StyledColumnWizardTypeSection = (props) => {
             React.createElement(Tabs_1.Tabs.Content, null,
                 React.createElement(TypeRadio_1.TypeRadio, { text: "Gradient", description: "Colour each cell in the column using a Gradient value (Numeric Columns)", checked: Boolean(data.GradientStyle), onClick: () => handleTypeChange('gradient') }),
                 React.createElement(TypeRadio_1.TypeRadio, { text: "Percent Bar", description: "Display a coloured Bar where the width is based on the cell (Numeric Columns)", checked: Boolean(data.PercentBarStyle), onClick: () => handleTypeChange('percent') }),
-                adaptable.api.styledColumnApi.canDisplaySparklines() && (React.createElement(TypeRadio_1.TypeRadio, { text: "Sparkline", description: "Render the column as a Sparkline (Numeric Array Columns)", checked: Boolean(data.SparkLineStyle), onClick: () => handleTypeChange('sparkline') })),
+                adaptable.api.styledColumnApi.canDisplaySparklines() && (React.createElement(TypeRadio_1.TypeRadio, { text: "Sparkline", description: "Render the column as a Sparkline (Numeric Array Columns)", checked: Boolean(data.SparklineStyle), onClick: () => handleTypeChange('sparkline') })),
                 React.createElement(TypeRadio_1.TypeRadio, { text: "Badge", description: "Display the column's values as Badges (All Columns)", checked: Boolean(data.BadgeStyle), onClick: () => handleTypeChange('badge') })))));
 };
 exports.StyledColumnWizardTypeSection = StyledColumnWizardTypeSection;

package/src/agGrid/AdaptableAgGrid.d.ts

@@ -29,6 +29,7 @@ import { RowFormService } from '../Utilities/Services/RowFormService';
 import { GridCellWithCount } from '../PredefinedConfig/Selection/GridCell';
 import { FlashingCellService } from '../Utilities/Services/FlashingCellService';
 import { AgGridExportAdapter } from './AgGridExportAdapter';
+import { AgGridThemeAdapter } from './AgGridThemeAdapter';
 export type AdaptableLifecycleState = 'initial' | 'preprocessOptions' | 'initAdaptableState' | 'setupAgGrid' | 'initAgGrid' | 'agGridReady' | 'available' | 'ready' | 'preDestroyed';
 type RenderAgGridFrameworkComponentResult = false | GridApi;
 interface AdaptableInitInternalConfig<TData = any> {
@@ -61,11 +62,6 @@ export declare class AdaptableAgGrid implements IAdaptable {
     hasAutogeneratedPrimaryKey: boolean;
     hasAdaptableToolPanel: boolean;
     private initWithLazyData;
-    /**
-     * once layouts are properly handled with the new aggrid methods & events
-     * we can remove this hack
-     */
-    private previousAgGridLayoutState;
     _rawAdaptableOptions: AdaptableOptions;
     adaptableOptions: AdaptableOptions;
     _isDetailGrid: boolean;
@@ -75,6 +71,7 @@ export declare class AdaptableAgGrid implements IAdaptable {
     agGridColumnAdapter: AgGridColumnAdapter;
     agGridMenuAdapter: AgGridMenuAdapter;
     agGridExportAdapter: AgGridExportAdapter;
+    agGridThemeAdapter: AgGridThemeAdapter;
     private DANGER_USE_GETTER_adaptableContainerElement;
     private DANGER_USE_GETTER_agGridContainerElement;
     api: AdaptableApi;
@@ -147,6 +144,7 @@ export declare class AdaptableAgGrid implements IAdaptable {
      */
     static _initInternal(config: AdaptableInitInternalConfig): Promise<AdaptableApi>;
     private _initAdaptableAgGrid;
+    midwayDestroy(): void;
     normalizeAdaptableState(state: AdaptableState, agGridOptions: NormalizeAdaptableStateOptions): AdaptableState;
     private normaliseLayoutState;
     private normaliseToolPanelState;
@@ -299,8 +297,6 @@ export declare class AdaptableAgGrid implements IAdaptable {
     isGridGroupingActive(): boolean;
     setAgGridQuickSearch(searchText: string): void;
     clearAgGridQuickSearch(): void;
-    getAgGridCurrentThemeName(): string;
-    private getAgGridLightThemeName;
     applyAdaptableTheme(theme: AdaptableTheme | string): void;
     setRowGroupColumns(columnIds: string[]): void;
     getAllGridColumns(): Column<any>[];
@@ -337,6 +333,5 @@ export declare class AdaptableAgGrid implements IAdaptable {
     refreshLayout(): void;
     private isRowGroupDifferentInLayout;
     private onLayoutChange;
-    private getColumnSorts;
 }
 export {};

package/src/agGrid/AdaptableAgGrid.js

@@ -99,6 +99,7 @@ const src_1 = require("../layout-manager/src");
 const isPivotLayoutModel_1 = require("../layout-manager/src/isPivotLayoutModel");
 const AdaptableColumn_1 = require("../PredefinedConfig/Common/AdaptableColumn");
 const agGridDataTypeDefinitions_1 = require("./agGridDataTypeDefinitions");
+const AgGridThemeAdapter_1 = require("./AgGridThemeAdapter");
 const LocalEventService_Prototype = ag_grid_enterprise_1.LocalEventService.prototype;
 const LocalEventService_dispatchEvent = LocalEventService_Prototype.dispatchEvent;
 LocalEventService_Prototype.dispatchEvent = function (event) {
@@ -135,11 +136,6 @@ const adaptableInstances = {};
 const publishTimestamp = Number(EnvVars_1.ADAPTABLE_PUBLISH_TIMESTAMP);
 class AdaptableAgGrid {
     constructor(config) {
-        /**
-         * once layouts are properly handled with the new aggrid methods & events
-         * we can remove this hack
-         */
-        this.previousAgGridLayoutState = '';
         this.filteredOutPrimaryKeys = new Set();
         this.columnMinMaxValuesCache = {};
         this.renderReactRoot = (node, container) => (0, renderReactRoot_1.renderReactRoot)(node, container);
@@ -178,6 +174,7 @@ class AdaptableAgGrid {
         this.agGridMenuAdapter = new AgGridMenuAdapter_1.AgGridMenuAdapter(this);
         this.agGridColumnAdapter = new AgGridColumnAdapter_1.AgGridColumnAdapter(this);
         this.agGridExportAdapter = new AgGridExportAdapter_1.AgGridExportAdapter(this);
+        this.agGridThemeAdapter = new AgGridThemeAdapter_1.AgGridThemeAdapter(this);
         this.DataService = new DataService_1.DataService(this);
     }
     static forEachAdaptable(fn) {
@@ -299,11 +296,6 @@ class AdaptableAgGrid {
         this.api = new AdaptableApiImpl_1.AdaptableApiImpl(this);
         this.forPlugins((plugin) => plugin.afterInitApi(this, this.api));
         this.lifecycleState = 'initAdaptableState';
-        // just in case Adaptable was destroyed while loading the store (which is an async operation)
-        if (this.isDestroyed) {
-            return Promise.reject('Adaptable was destroyed while loading the store.');
-            // FIXME AFL MIG: is this enough?! talk with the team
-        }
         this.initServices();
         this.forPlugins((plugin) => plugin.afterInitServices(this));
         this.adaptableModules = this.initModules();
@@ -334,6 +326,7 @@ class AdaptableAgGrid {
         perfLoadStore.end();
         // just in case Adaptable was destroyed while loading the store (which is an async operation)
         if (this.isDestroyed) {
+            this.midwayDestroy();
             return Promise.reject('Adaptable was destroyed while loading the store.');
             // FIXME AFL MIG: is this enough?! talk with the team
         }
@@ -369,6 +362,7 @@ class AdaptableAgGrid {
         this.agGridColumnAdapter.setupColumnFloatingFilterTemporarily(gridOptions);
         const agGridApi = await this.initializeAgGrid(gridOptions, config.modules, config.renderAgGridFrameworkComponent);
         if (agGridApi === false) {
+            this.midwayDestroy();
             this.logger.consoleError(`Adaptable failed to initialize AG Grid!`);
             return Promise.reject('Adaptable failed to initialize AG Grid!');
         }
@@ -476,6 +470,12 @@ class AdaptableAgGrid {
         perfInitAdaptableAgGrid.end();
         return Promise.resolve(this.api);
     }
+    midwayDestroy() {
+        this.destroy({
+            destroyAgGrid: false,
+            unmount: false,
+        });
+    }
     normalizeAdaptableState(state, agGridOptions) {
         state = this.normaliseLayoutState(state, agGridOptions);
         state = this.normaliseToolPanelState(state);
@@ -602,12 +602,12 @@ You need to define at least one Layout!`);
             this.agGridAdapter.setAgGridId(agGridId);
             return agGridId;
         });
-        // FIXME AFL: handle both ThemingApi and legacy CSS
         /**
          * `theme`
          */
-        this.agGridOptionsService.setGridOptionsProperty(gridOptions, 'theme', (original_gridId) => {
-            return 'legacy';
+        this.agGridOptionsService.setGridOptionsProperty(gridOptions, 'theme', (original_theme) => {
+            this.agGridThemeAdapter.setAgGridThemeMode(original_theme === 'legacy' ? 'legacy' : 'themingApi');
+            return original_theme;
         });
         /**
          *  `getRowId`
@@ -724,7 +724,7 @@ You need to define at least one Layout!`);
                 if (this.isGroupRowNode(node)) {
                     return true;
                 }
-                // first assess if the Row is filterable - if not, then return true so it appears in Grid
+                // first assess if the Row i s filterable - if not, then return true so it appears in Grid
                 const isRowFilterable = this.api.optionsApi.getFilterOptions().isRowFilterable;
                 if (typeof isRowFilterable === 'function') {
                     const rowFilterableContext = {
@@ -1018,13 +1018,13 @@ You need to define at least one Layout!`);
         // this will have to go/be heavily extended with https://github.com/AdaptableTools/adaptable/issues/2230
         this.agGridOptionsService.setGridOptionsProperty(gridOptions, 'columnTypes', (original_columnTypes) => {
             const providedColumnTypes = original_columnTypes || {};
-            const adaptableColumnTypes = {
+            const adaptableSpecialColumnTypes = {
                 [AdaptableColumn_1.CALCULATED_COLUMN_TYPE]: {},
                 [AdaptableColumn_1.FREE_TEXT_COLUMN_TYPE]: {},
                 [AdaptableColumn_1.ACTION_COLUMN_TYPE]: {},
                 [AdaptableColumn_1.FDC3_COLUMN_TYPE]: {},
             };
-            const patchedColumnTypes = Object.assign({}, providedColumnTypes, adaptableColumnTypes);
+            const patchedColumnTypes = Object.assign({}, providedColumnTypes, adaptableSpecialColumnTypes);
             const customColumnTypes = this.api.columnApi.getColumnTypes() ?? [];
             for (const customColumnType of customColumnTypes) {
                 if (!patchedColumnTypes[customColumnType]) {
@@ -1046,7 +1046,14 @@ You need to define at least one Layout!`);
      */
     async initializeAgGrid(gridOptions, modules, renderAgGridFrameworkComponent) {
         if (renderAgGridFrameworkComponent) {
-            const result = await renderAgGridFrameworkComponent(gridOptions);
+            let result = false;
+            try {
+                result = await renderAgGridFrameworkComponent(gridOptions);
+            }
+            catch (err) {
+                console.log('Failed to get AG Grid API');
+                result = false;
+            }
             if (result === false) {
                 return false;
             }
@@ -1054,6 +1061,10 @@ You need to define at least one Layout!`);
             // framework wrapper may have altered the context value via props
             // in that case, we have to re-populate it with the Adaptable context values
             const agGridContext = agGridApi.getGridOption('context');
+            if (!agGridContext) {
+                console.log('Failed to get AG Grid context');
+                return false;
+            }
             if (!agGridContext.__adaptable) {
                 agGridContext.__adaptable = this;
                 agGridContext.adaptableApi = this.api;
@@ -1339,7 +1350,7 @@ You need to define at least one Layout!`);
         return currentLayout.AutoSizeColumns;
     }
     autoSizeLayoutIfNeeded() {
-        if (this.shouldAutoSizeLayout()) {
+        if (this.isAvailable && this.shouldAutoSizeLayout()) {
             requestAnimationFrame(() => {
                 if (this.isAvailable) {
                     this.autoSizeAllColumns();
@@ -2571,40 +2582,6 @@ You need to define at least one Layout!`);
     clearAgGridQuickSearch() {
         this.setAgGridQuickSearch('');
     }
-    getAgGridCurrentThemeName() {
-        const container = this.getAgGridContainerElement();
-        if (container && container.classList) {
-            // we detect the ag theme class
-            const classList = container.classList;
-            for (let i = 0, len = classList.length; i < len; i++) {
-                const cls = classList[i];
-                if (cls.indexOf('ag-theme-') === 0) {
-                    return cls;
-                }
-            }
-        }
-        return this.getAgGridLightThemeName();
-    }
-    getAgGridLightThemeName() {
-        const container = this.getAgGridContainerElement();
-        if (container && container.classList) {
-            // we detect the ag theme class
-            const classList = container.classList;
-            for (let i = 0, len = classList.length; i < len; i++) {
-                const cls = classList[i];
-                if (cls.indexOf('ag-theme-') === 0) {
-                    // even if dark theme is included, we compute the light theme name out of it
-                    return cls.replace('-dark', '');
-                }
-            }
-        }
-        else {
-            this.logger.warn('No AgGrid container found, defaulting to ag-theme-balham for the light theme');
-        }
-        this.logger.warn('No ag-theme- class found on the grid container, defaulting to ag-theme-balham');
-        // fallback to the default light theme
-        return 'ag-theme-balham';
-    }
     applyAdaptableTheme(theme) {
         const container = this.getAgGridContainerElement();
         if (container != null) {
@@ -2669,41 +2646,8 @@ You need to define at least one Layout!`);
         else if (variantTheme) {
             el.classList.add(`infinite-${variantTheme}`);
         }
-        // AG THEME CLASS NAME
-        const getAgGridLightThemeName = () => this.getAgGridLightThemeName();
-        const getAgGridDarkThemeName = () => getAgGridLightThemeName() + '-dark';
-        if (newTheme && (isSystemTheme || variantTheme)) {
-            if ((variantTheme || themeName) === GeneralConstants_1.LIGHT_THEME) {
-                newTheme.AgGridClassName = newTheme.AgGridClassName || getAgGridLightThemeName();
-            }
-            if ((variantTheme || themeName) === GeneralConstants_1.DARK_THEME) {
-                newTheme.AgGridClassName = newTheme.AgGridClassName || getAgGridDarkThemeName();
-            }
-        }
-        if (!newTheme.AgGridClassName) {
-            // default AG Grid to its light theme
-            newTheme.AgGridClassName = getAgGridLightThemeName();
-        }
-        if (container != null) {
-            if (themesToRemove.length) {
-                themesToRemove.forEach((theme) => {
-                    if (theme.AgGridClassName) {
-                        container.classList.remove(theme.AgGridClassName);
-                    }
-                });
-            }
-            // also remove all AG Grid theme class names
-            const agGridClassNamesToRemove = [];
-            container.classList.forEach((x) => {
-                if (x && x.indexOf('ag-theme-') === 0) {
-                    agGridClassNamesToRemove.push(x);
-                }
-            });
-            agGridClassNamesToRemove.forEach((x) => container.classList.remove(x));
-            if (newTheme && newTheme.AgGridClassName) {
-                container.classList.add(newTheme.AgGridClassName);
-            }
-        }
+        // Update AG THEME
+        this.agGridThemeAdapter.applyAgGridThemeOnAdaptableThemeChange(newTheme, variantTheme, container, themesToRemove);
         // MAC LIKE SCROLLBARS
         if (this.adaptableOptions.userInterfaceOptions &&
             this.adaptableOptions.userInterfaceOptions.useCustomMacLikeScrollbars &&
@@ -2796,8 +2740,9 @@ You need to define at least one Layout!`);
             }
         }
         this.__prevLayoutForOnChange = undefined;
-        this.layoutManager.destroy();
-        this.filteredOutPrimaryKeys.clear();
+        this.layoutManager?.destroy();
+        this.layoutManager = null;
+        this.filteredOutPrimaryKeys?.clear();
         if (this.agGridAdapter?.getAgGridApi() && !this.agGridAdapter.getAgGridApi().isDestroyed()) {
             this.agGridAdapter
                 .getAgGridApi()
@@ -2876,7 +2821,6 @@ You need to define at least one Layout!`);
         if (config?.destroyAgGrid === true) {
             this.agGridAdapter.getAgGridApi()?.destroy();
         }
-        this.previousAgGridLayoutState = '';
         const gridContainerElement = this.getAgGridContainerElement();
         if (gridContainerElement) {
             gridContainerElement.removeEventListener('keydown', this.agGridListenerKeydown, true);
@@ -2887,8 +2831,6 @@ You need to define at least one Layout!`);
             this.agGridListenerMouseLeave = null;
         }
         this.api._internalDestroySelf();
-        this.layoutManager?.destroy();
-        this.layoutManager = null;
         this.agGridOptionsService?.destroy();
         this.agGridOptionsService = null;
         this.agGridAdapter?.destroy();
@@ -2899,6 +2841,8 @@ You need to define at least one Layout!`);
         this.agGridColumnAdapter = null;
         this.agGridExportAdapter?.destroy();
         this.agGridExportAdapter = null;
+        this.agGridThemeAdapter?.destroy();
+        this.agGridThemeAdapter = null;
         this.rowListeners = null;
         this.emitter.destroy();
         this.emitter = null;
@@ -3021,6 +2965,10 @@ You need to define at least one Layout!`);
             };
             this.agGridColumnAdapter.setupColumnHeader(colSetupInfo);
         });
+        // need to refresh the header,
+        // as the Layout.ColumnHeaders state property is not implemented in the LayoutManager
+        // and is specific to Adaptable, therefore we need to refresh it manually
+        this.refreshHeader();
         const layoutModel = (0, LayoutHelpers_1.layoutStateToLayoutModel)(layout);
         this.layoutManager?.setLayout(layoutModel, {
             skipApplyRowGroupsExpandedState: !shouldUpdateExpandState,
@@ -3344,30 +3292,5 @@ You need to define at least one Layout!`);
         this.__prevLayoutForOnChange = layout;
         this.api.layoutApi.createOrUpdateLayout(layout);
     }
-    getColumnSorts() {
-        const columnSorts = [];
-        const { columnApi } = this.api;
-        const columnState = this.agGridAdapter.getAgGridApi().getColumnState();
-        columnState.forEach((colState) => {
-            const { colId } = colState;
-            if (columnApi.isAutoRowGroupColumn(colId)) {
-                return;
-            }
-            if (colState.sort && colState.sortIndex != null) {
-                columnSorts.push({
-                    ColumnId: colId,
-                    SortOrder: colState.sort === 'asc' ? 'Asc' : 'Desc',
-                    SortIndex: colState.sortIndex,
-                });
-            }
-        });
-        columnSorts.sort((a, b) => a.SortIndex - b.SortIndex);
-        return columnSorts.map((c) => {
-            return {
-                ColumnId: c.ColumnId,
-                SortOrder: c.SortOrder,
-            };
-        });
-    }
 }
 exports.AdaptableAgGrid = AdaptableAgGrid;

package/src/agGrid/AgGridAdapter.d.ts

@@ -3,6 +3,7 @@ import { AdaptableAgGrid } from './AdaptableAgGrid';
 import { AdaptableColumn, AdaptableColumnGroup } from '../PredefinedConfig/Common/AdaptableColumn';
 import { SelectedCellInfo } from '../PredefinedConfig/Selection/SelectedCellInfo';
 import { SelectedRowInfo } from '../PredefinedConfig/Selection/SelectedRowInfo';
+export type AgGridThemeMode = 'legacy' | 'themingApi';
 export declare class AgGridAdapter {
     private _adaptableInstance;
     private DANGER_USE_GETTER_gridApi;
@@ -45,7 +46,6 @@ export declare class AgGridAdapter {
     deriveSelectedCellInfoFromAgGrid(): SelectedCellInfo;
     deriveSelectedRowInfoFromAgGrid(): SelectedRowInfo;
     isPinnedRowNode(rowNode: IRowNode): boolean;
-    getFirstGroupedColumn(): string | undefined;
     createAdaptableColumnFromAgGridColumn(agGridColumn: Column, colsToGroups: Record<string, AdaptableColumnGroup>): AdaptableColumn;
     private deriveAdaptableColumnDataType;
     private isColumnReadonly;

package/src/agGrid/AgGridAdapter.js

@@ -35,6 +35,9 @@ class AgGridAdapter {
     }
     destroy() {
         delete DANGER_AG_GRID_BEANS_MAP[this._agGridId];
+        this.initialGridOptions = null;
+        this.DANGER_gridApi_from_args = null;
+        this.DANGER_USE_GETTER_gridApi = null;
         this.DANGER_updateGridOptionsMonkeyPatcher = null;
         this._adaptableInstance = null;
     }
@@ -97,7 +100,7 @@ class AgGridAdapter {
             // `context`
             const passedContext = options.context;
             if (passedContext) {
-                passedContext['__adaptable'] = self;
+                passedContext['__adaptable'] = self._adaptableInstance;
                 passedContext['adaptableApi'] = self.adaptableApi;
             }
             // we mutated the options array, so it's OK to use the 'arguments' object
@@ -368,10 +371,6 @@ class AgGridAdapter {
         }
         return false;
     }
-    // TODO AFL MIG rename to getFirstGroupedColumnId()
-    getFirstGroupedColumn() {
-        return this.getAgGridApi?.()?.getRowGroupColumns()?.[0]?.getColId();
-    }
     createAdaptableColumnFromAgGridColumn(agGridColumn, colsToGroups) {
         const colId = agGridColumn.getColId();
         const colDef = agGridColumn.getColDef();
@@ -526,7 +525,7 @@ class AgGridAdapter {
         else if (Array.isArray(value)) {
             const arrayDataType = agGridDataTypeDefinitions_1.ALL_ADAPTABLE_DATA_TYPES.find((arrayType) => {
                 const dataTypeDefinition = agGridDataTypeDefinitions_1.agGridDataTypeDefinitions[arrayType];
-                const dataTypeMatching = dataTypeDefinition.dataTypeMatcher(value);
+                const dataTypeMatching = dataTypeDefinition?.dataTypeMatcher(value);
                 return dataTypeMatching;
             });
             if (arrayDataType) {

package/src/agGrid/AgGridColumnAdapter.js

@@ -16,6 +16,7 @@ const Helper_1 = tslib_1.__importDefault(require("../Utilities/Helpers/Helper"))
 const AdaptableNumberEditor_1 = require("./editors/AdaptableNumberEditor");
 const AdaptableDateEditor_1 = require("./editors/AdaptableDateEditor");
 const AgGridExportAdapter_1 = require("./AgGridExportAdapter");
+const AdaptableHelper_1 = require("../Utilities/Helpers/AdaptableHelper");
 function getEditorForColumnDataType(columnDataType, variant) {
     if (columnDataType === 'number') {
         return variant === 'react' ? AdaptableNumberEditor_1.AdaptableReactNumberEditor : AdaptableNumberEditor_1.AdaptableNumberEditor;
@@ -142,8 +143,6 @@ class AgGridColumnAdapter {
             this.setupColumnQuickFilerText(colSetupInfo);
             this.setupColumnAllowedAggFuncs(colSetupInfo);
             this.setupColumnType(colSetupInfo);
-            // this is just to make sure that AG Grid does NOT infer the cellDataType
-            // https://github.com/AdaptableTools/adaptable/issues/2230 should render it obsolete
             this.setupColumnCellDataType(colSetupInfo);
         });
     }
@@ -283,7 +282,7 @@ class AgGridColumnAdapter {
                 if (styledColumn.BadgeStyle) {
                     return (0, BadgeRenderer_1.getBadgeRendererForColumn)(styledColumn.BadgeStyle, abColumn, this.adaptableApi);
                 }
-                if (styledColumn.SparkLineStyle) {
+                if (styledColumn.SparklineStyle) {
                     return 'agSparklineCellRenderer';
                 }
             }
@@ -291,8 +290,9 @@ class AgGridColumnAdapter {
         this.setColDefProperty(col, 'cellRendererParams', (userDefined) => {
             const styledColumn = this.adaptableApi.styledColumnApi.getStyledColumnForColumnId(abColumn.columnId);
             if (styledColumn && !styledColumn.IsSuspended) {
-                if (styledColumn.SparkLineStyle) {
-                    const sparklineOptions = (0, merge_1.default)({}, userDefined?.sparklineOptions, styledColumn.SparkLineStyle.options);
+                if (styledColumn.SparklineStyle) {
+                    const sanitizedSparklineOptions = AdaptableHelper_1.AdaptableHelper.removeAdaptableObjectPrimitives(styledColumn.SparklineStyle.options);
+                    const sparklineOptions = (0, merge_1.default)({}, userDefined?.sparklineOptions, sanitizedSparklineOptions);
                     return {
                         ...userDefined,
                         sparklineOptions,
@@ -378,8 +378,6 @@ class AgGridColumnAdapter {
     }
     setupColumnCellDataType(columnSetupInfo) {
         const { col } = columnSetupInfo;
-        // AG Grid introduced since v30.x an inferred cellDataType
-        // the problem is that it breaks the default value formatter and/or editor (especially for Date columns)
         this.setColDefProperty(col, 'cellDataType', (original_cellDataType) => {
             return original_cellDataType ?? true;
         });
@@ -394,9 +392,6 @@ class AgGridColumnAdapter {
             if (layoutCustomHeader) {
                 resultHeaderName = layoutCustomHeader;
             }
-            // required here for the initial layout rendering
-            // Removed by JW, 3 october 2023; i don't think we need it and it overrides stuff unnecessarily
-            //  abColumn.friendlyName = resultHeaderName;
             return resultHeaderName;
         });
         const newColumnHeader = col?.getColDef()?.headerName;
@@ -484,7 +479,7 @@ class AgGridColumnAdapter {
                 }
                 if (mostRelevantFormatColumn.DisplayFormat.Formatter === 'StringFormatter') {
                     // change the String format - if the scope allows it
-                    if (this.adaptableApi.columnScopeApi.isColumnInStringsScope(abColumn, mostRelevantFormatColumn.Scope)) {
+                    if (this.adaptableApi.columnScopeApi.isColumnInTextScope(abColumn, mostRelevantFormatColumn.Scope)) {
                         let cellValue = params.value;
                         if (typeof params.value?.toNumber === 'function' &&
                             typeof params.value?.toString === 'function') {

package/src/agGrid/AgGridExportAdapter.d.ts

@@ -1,13 +1,30 @@
 import { AdaptableAgGrid } from './AdaptableAgGrid';
 import { Report, ReportFormatType } from '../PredefinedConfig/ExportState';
-import { ExcelStyle } from 'ag-grid-enterprise';
+import { CsvExportParams, ExcelExportParams, ExcelStyle } from 'ag-grid-enterprise';
 import { ExportDestinationType, ExportResultData } from '../AdaptableOptions/ExportOptions';
+import { Layout } from '../PredefinedConfig/LayoutState';
 export interface ExportConfig {
     report: Report;
     format: ReportFormatType;
     destination: ExportDestinationType;
     showProgressIndicator: boolean;
 }
+interface ExportProcessContext extends ExportConfig {
+    exportedColumnIds: string[];
+    isExcelReport: boolean;
+    isVisualExcelReport: boolean;
+    isExportingVisibleColumnToJSON: boolean;
+    getCurrent: () => {
+        layout: Layout;
+        groupColumnIds: string[];
+        pivotColumnIds: string[];
+    };
+    isCellPartOfSelection: (rowId: string, columnId: string) => boolean;
+}
+export interface ExportProcessData {
+    exportContext: ExportProcessContext;
+    exportParams: ExcelExportParams | CsvExportParams;
+}
 export declare class AgGridExportAdapter {
     private _adaptableInstance;
     /**
@@ -23,9 +40,14 @@ export declare class AgGridExportAdapter {
     private get agGridApi();
     private get adaptableApi();
     private get exportOptions();
+    private get logger();
     static getExcelClassNameForCell(colId: string, primaryKeyValue: any, userDefinedCellClass?: string | string[]): string;
     destroy(): void;
     exportData(config: ExportConfig): Promise<null | ExportResultData>;
+    /**
+     * Creates export context and parameters for a given export configuration
+     */
+    buildExportProcessData(config: ExportConfig): ExportProcessData;
     private buildExportParams;
     private buildBaseExportParams;
     private computeProcessRowGroupCallback;
@@ -50,3 +72,4 @@ export declare class AgGridExportAdapter {
     private computeSkipColumnHeaders;
     private computeGetCustomContentBelowRow;
 }
+export {};

package/src/agGrid/AgGridExportAdapter.js

@@ -33,6 +33,9 @@ class AgGridExportAdapter {
     get exportOptions() {
         return this._adaptableInstance.api.optionsApi.getExportOptions();
     }
+    get logger() {
+        return this._adaptableInstance.logger;
+    }
     static getExcelClassNameForCell(colId, primaryKeyValue, userDefinedCellClass) {
         let excelClassName = `--excel-cell-${colId}-${primaryKeyValue}`;
         if (excelClassName.indexOf(' ') > 0) {
@@ -61,14 +64,12 @@ class AgGridExportAdapter {
                 await (0, waitForTimeout_1.waitForTimeout)(16);
             }
             this.adaptableApi.exportApi.internalApi.setExportInProgress(config.report.Name, config.format, config.destination);
-            const exportContext = this.buildExportProcessContext(config);
+            const { exportContext, exportParams } = this.buildExportProcessData(config);
             if (exportContext.isVisualExcelReport) {
                 // FIXME AFL patch styles only for exported columns!
                 // or even better, only cells
                 this.patchExcelStyles();
             }
-            const exportParams = this.buildExportParams(exportContext);
-            exportContext.exportedColumnIds = exportParams.columnKeys;
             // 1. easiest case, we download the file using AG Grid
             // these methods will automatically handle the file download
             if (exportContext.destination === 'Download' && exportContext.isExcelReport) {
@@ -102,8 +103,7 @@ class AgGridExportAdapter {
             };
         }
         catch (error) {
-            // FIXME AFL improve logging
-            console.error(error);
+            this.logger.consoleError(`Error exporting ${report.Name} in ${format} format to ${config.destination}`, error);
         }
         finally {
             /**
@@ -118,6 +118,21 @@ class AgGridExportAdapter {
             }
         }
     }
+    /**
+     * Creates export context and parameters for a given export configuration
+     */
+    buildExportProcessData(config) {
+        const exportContext = this.buildExportProcessContext(config);
+        if (exportContext.isVisualExcelReport) {
+            this.patchExcelStyles();
+        }
+        const exportParams = this.buildExportParams(exportContext);
+        exportContext.exportedColumnIds = exportParams.columnKeys;
+        return {
+            exportContext,
+            exportParams,
+        };
+    }
     buildExportParams(exportContext) {
         const baseExportParams = this.buildBaseExportParams(exportContext);
         if (exportContext.format === 'Excel' || exportContext.format === 'VisualExcel') {
@@ -656,9 +671,9 @@ class AgGridExportAdapter {
             .map((columnId) => this.adaptableApi.columnApi.getColumnWithColumnId(columnId))
             .map((column) => ({
             columnId: column.columnId,
+            field: column.field ?? column.columnId,
             friendlyName: column.friendlyName,
             dataType: column.dataType,
-            field: column.field ?? column.columnId,
         }));
         const reportData = {
             columns,
@@ -730,27 +745,11 @@ class AgGridExportAdapter {
                 masterRowNode: node,
                 masterRowData: node?.data,
                 isExpanded: node.expanded,
-                createCellCsv: (cellContent) => {
-                    return {
-                        data: {
-                            value: cellContent != undefined ? String(cellContent) : null,
-                        },
-                    };
-                },
-                createCellExcel: (cellContent, cellType) => {
-                    return {
-                        data: {
-                            value: cellContent != undefined ? String(cellContent) : null,
-                            type: cellType,
-                        },
-                    };
-                },
+                createCellCsv: (cellContent) => this.adaptableApi.exportApi.internalApi.createCellCsv(cellContent),
+                createCellExcel: (cellContent, cellType) => this.adaptableApi.exportApi.internalApi.createCellExcel(cellContent, cellType),
                 createCellHeader: (cellContent) => {
                     return {
-                        data: {
-                            value: cellContent != undefined ? String(cellContent) : null,
-                            type: 'String',
-                        },
+                        ...this.adaptableApi.exportApi.internalApi.createCellHeader(cellContent),
                         // see #masterDetailHeader
                         styleId: '_masterDetailHeader',
                     };