@adaptabletools/adaptable 18.0.0-canary.3 → 18.0.0-canary.31

package/src/agGrid/AgGridOptionsService.js

@@ -0,0 +1,76 @@
+export class AgGridOptionsService {
+    constructor(adaptableInstance) {
+        this.adaptableInstance = adaptableInstance;
+        this.gridOptionsPropertyCache = new Map();
+        this.colDefPropertyCache = new Map();
+    }
+    destroy() {
+        this.gridOptionsPropertyCache.clear();
+        this.colDefPropertyCache.clear();
+        this.gridOptionsPropertyCache = null;
+        this.colDefPropertyCache = null;
+    }
+    setGridOptionsProperty(gridOptions, propertyName, propertyGetter) {
+        if (this.adaptableInstance.lifecycleState === 'preDestroyed') {
+            return;
+        }
+        const userKey = `user.${propertyName}`;
+        const adaptableKey = `adaptable.${propertyName}`;
+        const value = gridOptions[propertyName];
+        const isUserDefined = value !== this.gridOptionsPropertyCache.get(adaptableKey);
+        if (isUserDefined) {
+            this.gridOptionsPropertyCache.set(userKey, value);
+        }
+        const userValue = this.gridOptionsPropertyCache.get(userKey);
+        let adaptableValue = propertyGetter(userValue);
+        if (typeof adaptableValue === 'function') {
+            const previousValue = adaptableValue;
+            // @ts-ignore we know that adaptableValue is a function
+            adaptableValue = (...args) => {
+                if (this.adaptableInstance.isDestroyed) {
+                    return;
+                }
+                this.agGridAdapter.grabAgGridApiOnTheFly(args);
+                return previousValue(...args);
+            };
+        }
+        if (adaptableValue != null) {
+            this.gridOptionsPropertyCache.set(adaptableKey, adaptableValue);
+        }
+        gridOptions[propertyName] = adaptableValue !== null && adaptableValue !== void 0 ? adaptableValue : userValue;
+        return gridOptions;
+    }
+    getUserGridOptionsProperty(propertyName) {
+        const userKey = `user.${propertyName}`;
+        return this.gridOptionsPropertyCache.get(userKey);
+    }
+    revertGridOptionsPropertyToUserValue(propertyName) {
+        const userKey = `user.${propertyName}`;
+        const userValue = this.gridOptionsPropertyCache.get(userKey);
+        this.agGridAdapter.setGridOption(propertyName, userValue);
+    }
+    CAREFUL_patchGridOptionsProperty(propertyName, value) {
+        var _a;
+        // @ts-ignore this is required to set gridOptions peroperties which are marked as initial (writable once, before grid is initialised)
+        const gos = (_a = this.agGridAdapter.getAgGridApi()) === null || _a === void 0 ? void 0 : _a.gos;
+        if (gos) {
+            gos.updateGridOptions({
+                options: {
+                    [propertyName]: value,
+                },
+                source: 'api',
+            });
+        }
+    }
+    revertGridOptionsPropertiesToUserValue(gridOptions, propertyNames) {
+        for (const propertyName of propertyNames) {
+            // see this.setGridOptionsProperty(...)
+            const userKey = `user.${propertyName}`;
+            const userValue = this.gridOptionsPropertyCache.get(userKey);
+            gridOptions[propertyName] = userValue;
+        }
+    }
+    get agGridAdapter() {
+        return this.adaptableInstance.agGridAdapter;
+    }
+}

package/src/agGrid/BadgeRenderer.d.ts

@@ -1,4 +1,4 @@
-import { StyledColumn } from '../PredefinedConfig/StyledColumnState';
+import { BadgeStyle } from '../PredefinedConfig/StyledColumnState';
 import { AdaptableApi } from '../Api/AdaptableApi';
 import { AdaptableColumn } from '../PredefinedConfig/Common/AdaptableColumn';
-export declare const getBadgeRendererForColumn: (styledColumn: StyledColumn, abColumn: AdaptableColumn, api: AdaptableApi) => any;
+export declare const getBadgeRendererForColumn: (badgeStyle: BadgeStyle, abColumn: AdaptableColumn, api: AdaptableApi) => any;

package/src/agGrid/BadgeRenderer.js

@@ -1,25 +1,39 @@
 import { Badge } from '../View/Components/Badge';
 import { renderWithAdaptableContext } from '../View/renderWithAdaptableContext';
 import * as React from 'react';
-export const getBadgeRendererForColumn = (styledColumn, abColumn, api) => {
-    if (!styledColumn.BadgeStyle) {
-        return;
-    }
+import { ROW_SUMMARY_ROW_ID } from '../PredefinedConfig/Common/RowSummary';
+export const getBadgeRendererForColumn = (badgeStyle, abColumn, api) => {
     return class BadgetRenderer {
         getAdaptableInstance(params) {
-            const adaptable = params.api.__adaptable;
+            const adaptable = params.context.__adaptable;
             return adaptable;
         }
         init(params) {
-            var _a, _b, _c;
+            var _a, _b, _c, _d, _e, _f, _g;
             const adaptable = this.getAdaptableInstance(params);
             const adapatableApi = adaptable.api;
             this.eGui = document.createElement('div');
             this.eGui.className = 'ab-Badge__wrapper';
-            const includeGrouped = Boolean(styledColumn.IncludeGroupedRows);
-            const isGrouped = params.node.group;
-            if (includeGrouped === false && isGrouped) {
-                const formattedValue = (_c = (_b = (_a = params.formatValue) === null || _a === void 0 ? void 0 : _a.call(params, params.value)) !== null && _b !== void 0 ? _b : params.value) !== null && _c !== void 0 ? _c : '';
+            const isGroupedRow = params.node.group;
+            const isSummaryRow = (_a = params === null || params === void 0 ? void 0 : params.data) === null || _a === void 0 ? void 0 : _a[ROW_SUMMARY_ROW_ID];
+            let shouldRender = true;
+            if (isGroupedRow) {
+                if ((_b = badgeStyle.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupedRows) {
+                    shouldRender = false;
+                }
+            }
+            else if (isSummaryRow) {
+                if ((_c = badgeStyle.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeSummaryRows) {
+                    shouldRender = false;
+                }
+            }
+            else {
+                if ((_d = badgeStyle.RowScope) === null || _d === void 0 ? void 0 : _d.ExcludeDataRows) {
+                    shouldRender = false;
+                }
+            }
+            if (!shouldRender) {
+                const formattedValue = (_g = (_f = (_e = params.formatValue) === null || _e === void 0 ? void 0 : _e.call(params, params.value)) !== null && _f !== void 0 ? _f : params.value) !== null && _g !== void 0 ? _g : '';
                 this.eGui.innerHTML = formattedValue;
                 return;
             }
@@ -50,7 +64,7 @@ export const getBadgeRendererForColumn = (styledColumn, abColumn, api) => {
                     userName: adapatableApi.optionsApi.getUserName(),
                     adaptableId: adapatableApi.optionsApi.getAdaptableId(),
                 };
-                const badge = api.styledColumnApi.internalApi.getApplicableBadge(styledColumn, predicateDefHandlerContext);
+                const badge = api.styledColumnApi.internalApi.getApplicableBadge(badgeStyle, predicateDefHandlerContext);
                 const isNullValue = formattedValue === '' || formattedValue === null || formattedValue === undefined;
                 if (!isNullValue && badge) {
                     badgesConfig.push({
@@ -74,7 +88,7 @@ export const getBadgeRendererForColumn = (styledColumn, abColumn, api) => {
                 userName: adapatableApi.optionsApi.getUserName(),
                 adaptableId: adapatableApi.optionsApi.getAdaptableId(),
             };
-            const badge = api.styledColumnApi.internalApi.getApplicableBadge(styledColumn, predicateDefHandlerContext);
+            const badge = api.styledColumnApi.internalApi.getApplicableBadge(badgeStyle, predicateDefHandlerContext);
             const isNullValue = formattedValue === '' || formattedValue === null || formattedValue === undefined;
             if (
             // empty values

package/src/agGrid/CheckboxRenderer.js

@@ -65,7 +65,7 @@ export class CheckboxEditor {
     // however, using ReactUI makes some race conditions possible, in which cases the editor will be displayed for a few milliseconds
     // we provide this logic for those few cases (to avoid a flicker effect)
     init(params) {
-        const adaptable = params.api.__adaptable;
+        const adaptable = params.context.__adaptable;
         const inputElement = document.createElement('input');
         inputElement.type = 'checkbox';
         inputElement.checked = params.value;

package/src/agGrid/FilterWrapper.d.ts

@@ -1,2 +1,2 @@
-import { Adaptable } from './Adaptable';
-export declare let FilterWrapperFactory: (adaptable: Adaptable) => any;
+import { AdaptableAgGrid } from './AdaptableAgGrid';
+export declare const FilterWrapperFactory: (adaptable: AdaptableAgGrid) => any;

package/src/agGrid/FilterWrapper.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { forwardRef, useImperativeHandle, useState } from 'react';
 import { FilterFormReact } from '../View/Components/FilterForm/FilterForm';
-export let FilterWrapperFactory = (adaptable) => {
+export const FilterWrapperFactory = (adaptable) => {
     function isFilterActive(colId) {
         // we need this here
         if (adaptable.isDestroyed) {

package/src/agGrid/PercentBarRenderer.js

@@ -13,7 +13,8 @@ export const getPercentBarRendererForColumn = (styledColumn, abColumn, api) => {
             if (Helper.objectNotExists(value)) {
                 value = 0;
             }
-            if (!styledColumn.IncludeGroupedRows && api.gridApi.isGroupRowNode(params.node)) {
+            // No longer support showing Percent Bar in Grouped Rows
+            if (api.gridApi.isGroupRowNode(params.node)) {
                 if (params.value) {
                     this.eGui = document.createElement('div');
                     this.eGui.append(params.value);

package/src/agGrid/attachAddaptableColumnTypes.d.ts

@@ -1,16 +1,16 @@
 import { GridOptions } from '@ag-grid-community/core';
 export declare const attachColumnTypes: (gridOptions: GridOptions) => {
-    [key: string]: import("@ag-grid-community/core").ColDef<any, any>;
+    [key: string]: import("@ag-grid-community/core").ColTypeDef<any, any>;
 } & {
-    [x: string]: import("@ag-grid-community/core").ColDef<any, any>;
-    abColDefNumber: import("@ag-grid-community/core").ColDef<any, any>;
-    abColDefString: import("@ag-grid-community/core").ColDef<any, any>;
-    abColDefBoolean: import("@ag-grid-community/core").ColDef<any, any>;
-    abColDefDate: import("@ag-grid-community/core").ColDef<any, any>;
-    abColDefObject: import("@ag-grid-community/core").ColDef<any, any>;
-    abColDefCustom: import("@ag-grid-community/core").ColDef<any, any>;
-    abColDefStringArray: import("@ag-grid-community/core").ColDef<any, any>;
-    abColDefNumberArray: import("@ag-grid-community/core").ColDef<any, any>;
-    abColDefTupleNumberArray: import("@ag-grid-community/core").ColDef<any, any>;
-    abColDefObjectNumberArray: import("@ag-grid-community/core").ColDef<any, any>;
+    [x: string]: import("@ag-grid-community/core").ColTypeDef<any, any>;
+    abColDefNumber: import("@ag-grid-community/core").ColTypeDef<any, any>;
+    abColDefString: import("@ag-grid-community/core").ColTypeDef<any, any>;
+    abColDefBoolean: import("@ag-grid-community/core").ColTypeDef<any, any>;
+    abColDefDate: import("@ag-grid-community/core").ColTypeDef<any, any>;
+    abColDefObject: import("@ag-grid-community/core").ColTypeDef<any, any>;
+    abColDefCustom: import("@ag-grid-community/core").ColTypeDef<any, any>;
+    abColDefStringArray: import("@ag-grid-community/core").ColTypeDef<any, any>;
+    abColDefNumberArray: import("@ag-grid-community/core").ColTypeDef<any, any>;
+    abColDefTupleNumberArray: import("@ag-grid-community/core").ColTypeDef<any, any>;
+    abColDefObjectNumberArray: import("@ag-grid-community/core").ColTypeDef<any, any>;
 };

package/src/agGrid/buildSortedColumnStateForLayout.d.ts

@@ -0,0 +1,7 @@
+import { ColumnState, GridOptions } from '@ag-grid-community/core';
+import { Layout } from '../types';
+export declare function buildSortedColumnStateForLayout(params: {
+    columnState: ColumnState[];
+    layout: Layout;
+    gridOptions: GridOptions;
+}): ColumnState[];

package/src/agGrid/buildSortedColumnStateForLayout.js

@@ -0,0 +1,120 @@
+import { AG_GRID_GROUPED_COLUMN } from '../Utilities/Constants/GeneralConstants';
+import { getAutoRowGroupColumnIdFor } from '../Api/Internal/ColumnInternalApi';
+import { isAutoRowGroupColumn } from '../Api/Implementation/ColumnApiImpl';
+import { sortColumnStateForVisibleColumns } from './sortColumnStateForVisibleColumns';
+export function buildSortedColumnStateForLayout(params) {
+    const { columnState, layout, gridOptions } = params;
+    let visibleColumnList = [...layout.Columns];
+    const multipleGroupColumns = gridOptions.groupDisplayType === 'multipleColumns';
+    const singleGroupColumn = !multipleGroupColumns;
+    const rowGroupedColumnsIndexes = {};
+    let generatedRowGroupColumnsIds = [];
+    // here we make sure the visibleColumnList includes all the generated group columns
+    if (layout.RowGroupedColumns) {
+        layout.RowGroupedColumns.forEach((colId, index) => {
+            rowGroupedColumnsIndexes[colId] = index;
+            rowGroupedColumnsIndexes[getAutoRowGroupColumnIdFor(colId)] = index;
+        });
+        // if the layout does not include the grouped columns,
+        // make sure we add the grouped columns to the visible column list
+        // at the start of the list
+        if (singleGroupColumn) {
+            if (!visibleColumnList.includes(AG_GRID_GROUPED_COLUMN)) {
+                visibleColumnList = [AG_GRID_GROUPED_COLUMN, ...visibleColumnList];
+            }
+            generatedRowGroupColumnsIds.push(AG_GRID_GROUPED_COLUMN);
+        }
+        else {
+            let missingGroupColumns = 0;
+            [...layout.RowGroupedColumns].reverse().forEach((colId) => {
+                const groupColId = getAutoRowGroupColumnIdFor(colId);
+                if (!visibleColumnList.includes(groupColId)) {
+                    visibleColumnList = [groupColId, ...visibleColumnList];
+                    missingGroupColumns++;
+                }
+                generatedRowGroupColumnsIds = [groupColId, ...generatedRowGroupColumnsIds];
+            });
+            // now we need to sort the visibleColumnList to contain the group columns
+            // in the correct order
+            // but we only need to do this if the layout.Columns list missed some of the
+            // group columns, but not all of them. if all were missing, we already
+            // inserted them at the start of the list
+            if (missingGroupColumns && missingGroupColumns < layout.RowGroupedColumns.length) {
+                visibleColumnList.sort((colId1, colId2) => {
+                    const isRowGroup1 = isAutoRowGroupColumn(colId1);
+                    const isRowGroup2 = isAutoRowGroupColumn(colId2);
+                    if (isRowGroup1 && isRowGroup2) {
+                        return rowGroupedColumnsIndexes[colId1] - rowGroupedColumnsIndexes[colId2];
+                    }
+                    return 0;
+                });
+            }
+        }
+    }
+    const visibleColumnsIndexes = visibleColumnList.reduce((acc, colId, index) => {
+        acc[colId] = index;
+        return acc;
+    }, {});
+    const pivotMode = layout.EnablePivot;
+    if (pivotMode) {
+        // in pivot mode, we sort the Visible columns of the layout
+        // to make sure the group cols are at the beginning
+        const groupCols = visibleColumnList.filter(isAutoRowGroupColumn);
+        visibleColumnList = visibleColumnList.filter((colId) => !isAutoRowGroupColumn(colId));
+        visibleColumnList = [...groupCols, ...visibleColumnList];
+    }
+    // we're now ready to go over the columnState
+    // we want as much as possible to keep the order of the columns
+    // as they are in the column state.
+    // if the order is different in the visibleColumns, we only move those columns around
+    // if some columns in the columnState are not in the visibleColumns, we need to return them as hide: true
+    // first step - keep the same order, but filter out old group columns
+    // VERY IMPORTANT to only filter out OLD group columns, that is,
+    // group columns that are not in the layout anymore
+    // since we might have different group columns in the layout
+    let newColumnState = [...columnState].filter((colState) => {
+        const { colId } = colState;
+        if (isAutoRowGroupColumn(colId) && rowGroupedColumnsIndexes[colId] == null) {
+            return false;
+        }
+        return true;
+    });
+    // second step - keep the same order
+    // but make sure the visibility is adjusted to reflect the
+    // visible columns in the layout
+    newColumnState = newColumnState.map((colState) => {
+        const { colId } = colState;
+        const visibleIndex = visibleColumnsIndexes[colId];
+        if (visibleIndex == null) {
+            return Object.assign(Object.assign({}, colState), { hide: true });
+        }
+        return Object.assign(Object.assign({}, colState), { hide: null });
+    });
+    // third step - correctly mark the columns that are grouped
+    newColumnState = newColumnState.map((colState) => {
+        const { colId } = colState;
+        const groupIndex = rowGroupedColumnsIndexes[colId];
+        if (groupIndex != null) {
+            return Object.assign(Object.assign({}, colState), { rowGroup: true, rowGroupIndex: groupIndex });
+        }
+        return Object.assign(Object.assign({}, colState), { rowGroup: false, rowGroupIndex: null });
+    });
+    // fourth step - add the new group columns, if they are missing
+    const columnStateIndexes = newColumnState.reduce((acc, colState, index) => {
+        acc[colState.colId] = index;
+        return acc;
+    }, {});
+    generatedRowGroupColumnsIds.reverse().forEach((rowGroupColId) => {
+        if (columnStateIndexes[rowGroupColId] == null) {
+            newColumnState = [
+                {
+                    colId: rowGroupColId,
+                },
+                ...newColumnState,
+            ];
+        }
+    });
+    // fitfth step - sort the column state to respect the order of the visible columns
+    // we can't simply call sort in this case
+    return sortColumnStateForVisibleColumns(newColumnState, visibleColumnList);
+}

package/src/agGrid/defaultAdaptableOptions.d.ts

@@ -0,0 +1,3 @@
+import { AdaptableOptions } from '../AdaptableOptions/AdaptableOptions';
+export declare function applyDefaultAdaptableOptions(adaptableOptions: AdaptableOptions): AdaptableOptions;
+export declare const getDefaultAdaptableOptions: () => AdaptableOptions<any>;

package/src/{Utilities/Defaults/DefaultAdaptableOptions.js → agGrid/defaultAdaptableOptions.js}

@@ -1,11 +1,11 @@
-import * as GeneralConstants from '../Constants/GeneralConstants';
-import { EMPTY_ARRAY } from '../Constants/GeneralConstants';
-import UIHelper, { getHexForName, GRAY, GREEN, RED } from '../../View/UIHelper';
-import { SystemAlertPredicateIds, SystemBadgeStylePredicateIds, SystemFilterPredicateIds, SystemFlashingCellPredicateIds, SystemFormatColumnPredicateIds, } from '../../PredefinedConfig/Common/AdaptablePredicate';
-import { ExportDestination } from '../../PredefinedConfig/Common/Enums';
-import * as ModuleConstants from '../../Utilities/Constants/ModuleConstants';
-// change type to DeepRequired<AdaptableOptions> to check which properties have no default values defined
-export const DefaultAdaptableOptions = {
+import * as GeneralConstants from '../Utilities/Constants/GeneralConstants';
+import UIHelper, { getHexForName, GRAY, GREEN, RED } from '../View/UIHelper';
+import { EMPTY_ARRAY } from '../Utilities/Constants/GeneralConstants';
+import { ExportDestination } from '../PredefinedConfig/Common/Enums';
+import { SystemAlertPredicateIds, SystemBadgeStylePredicateIds, SystemFilterPredicateIds, SystemFlashingCellPredicateIds, SystemFormatColumnPredicateIds, } from '../PredefinedConfig/Common/AdaptablePredicate';
+import * as ModuleConstants from '../Utilities/Constants/ModuleConstants';
+import { initPredefinedConfigWithUuids } from '../Utilities/Helpers/AdaptableHelper';
+const DefaultAdaptableOptions = {
     adaptableId: GeneralConstants.ADAPTABLE_ID,
     adaptableStateKey: undefined,
     primaryKey: '',
@@ -143,8 +143,6 @@ export const DefaultAdaptableOptions = {
     customSortOptions: { customSortComparers: undefined },
     dataSetOptions: { dataSets: EMPTY_ARRAY },
     groupingOptions: {
-        showGroupingTotalsAsHeader: false,
-        balancedGroupsKey: undefined,
         restoreUngroupedColumns: false,
         autoOrderGroupedColumns: true,
     },
@@ -169,13 +167,6 @@ export const DefaultAdaptableOptions = {
     menuOptions: {
         customColumnMenu: undefined,
         customContextMenu: undefined,
-        showAdaptableContextMenu: true,
-        showAdaptableColumnMenu: true,
-        showUngroupColumnMenuItem: true,
-        columnMenuOrder: ['aggrid', 'adaptable', 'user'],
-        contextMenuOrder: ['aggrid', 'adaptable', 'user'],
-        columnMenuItems: undefined,
-        contextMenuItems: undefined,
     },
     columnFilterOptions: {
         quickFilterOptions: {
@@ -197,7 +188,7 @@ export const DefaultAdaptableOptions = {
             sortValuesFilter: false,
             filterValuesUsingTime: false,
             showDistinctFilteredValuesOnly: false,
-            maxFilterValuesToDisplay: 2000,
+            maxFilterValuesToDisplay: undefined,
             includeBlankFilterValues: false,
             showValuesCount: undefined,
         },
@@ -219,6 +210,7 @@ export const DefaultAdaptableOptions = {
         enableFilterOnSpecialColumns: true,
         showClearFilterButton: false,
         showSuspendFilterButton: false,
+        showDatePicker: true,
     },
     gridFilterOptions: {
         availableFilterEditors: ['ExpressionEditor', 'QueryBuilder'],
@@ -250,6 +242,7 @@ export const DefaultAdaptableOptions = {
         loadState: undefined,
         persistState: undefined,
         clearState: undefined,
+        autoMigrateState: true,
     },
     teamSharingOptions: {
         enableTeamSharing: false,
@@ -268,6 +261,9 @@ export const DefaultAdaptableOptions = {
         useCustomMacLikeScrollbars: false,
         englishVariant: 'GB',
         showLoadingScreen: true,
+        loadingScreenDelay: 200,
+        loadingScreenTitle: 'Initialising Grid',
+        loadingScreenText: 'Retrieving your settings and setting up the grid...',
         disableDeleteConfirmation: false,
         dateInputOptions: {
             useNativeInput: false,
@@ -325,3 +321,60 @@ export const DefaultAdaptableOptions = {
         },
     },
 };
+export function applyDefaultAdaptableOptions(adaptableOptions) {
+    var _a;
+    const adaptableOptsWithDefaults = Object.assign({}, DefaultAdaptableOptions, adaptableOptions);
+    adaptableOptsWithDefaults.adaptableStateKey =
+        (_a = adaptableOptsWithDefaults.adaptableStateKey) !== null && _a !== void 0 ? _a : adaptableOptsWithDefaults.adaptableId;
+    adaptableOptsWithDefaults.dataImportOptions = Object.assign({}, DefaultAdaptableOptions.dataImportOptions, adaptableOptions.dataImportOptions);
+    adaptableOptsWithDefaults.expressionOptions = Object.assign({}, DefaultAdaptableOptions.expressionOptions, adaptableOptions.expressionOptions);
+    adaptableOptsWithDefaults.calendarOptions = Object.assign({}, DefaultAdaptableOptions.calendarOptions, adaptableOptions.calendarOptions);
+    adaptableOptsWithDefaults.columnOptions = Object.assign({}, DefaultAdaptableOptions.columnOptions, adaptableOptions.columnOptions);
+    adaptableOptsWithDefaults.customSortOptions = Object.assign({}, DefaultAdaptableOptions.customSortOptions, adaptableOptions.customSortOptions);
+    adaptableOptsWithDefaults.dataSetOptions = Object.assign({}, DefaultAdaptableOptions.dataSetOptions, adaptableOptions.dataSetOptions);
+    adaptableOptsWithDefaults.cellSummaryOptions = Object.assign({}, DefaultAdaptableOptions.cellSummaryOptions, adaptableOptions.cellSummaryOptions);
+    adaptableOptsWithDefaults.predicateOptions = Object.assign({}, DefaultAdaptableOptions.predicateOptions, adaptableOptsWithDefaults.predicateOptions);
+    adaptableOptsWithDefaults.layoutOptions = Object.assign({}, DefaultAdaptableOptions.layoutOptions, adaptableOptions.layoutOptions);
+    adaptableOptsWithDefaults.notificationsOptions = Object.assign({}, DefaultAdaptableOptions.notificationsOptions, adaptableOptions.notificationsOptions);
+    adaptableOptsWithDefaults.alertOptions = Object.assign({}, DefaultAdaptableOptions.alertOptions, adaptableOptions.alertOptions);
+    adaptableOptsWithDefaults.flashingCellOptions = Object.assign({}, DefaultAdaptableOptions.flashingCellOptions, adaptableOptions.flashingCellOptions);
+    adaptableOptsWithDefaults.entitlementOptions = Object.assign({}, DefaultAdaptableOptions.entitlementOptions, adaptableOptions.entitlementOptions);
+    adaptableOptsWithDefaults.dashboardOptions = Object.assign({}, DefaultAdaptableOptions.dashboardOptions, adaptableOptions.dashboardOptions);
+    adaptableOptsWithDefaults.editOptions = Object.assign({}, DefaultAdaptableOptions.editOptions, adaptableOptions.editOptions);
+    adaptableOptsWithDefaults.actionColumnOptions = Object.assign({}, DefaultAdaptableOptions.actionColumnOptions, adaptableOptions.actionColumnOptions);
+    // to do
+    adaptableOptsWithDefaults.actionRowOptions = Object.assign({}, DefaultAdaptableOptions.actionRowOptions, adaptableOptions.actionRowOptions);
+    adaptableOptsWithDefaults.actionRowOptions.actionRowButtonOptions = Object.assign({}, DefaultAdaptableOptions.actionRowOptions.actionRowButtonOptions, adaptableOptsWithDefaults.actionRowOptions.actionRowButtonOptions);
+    adaptableOptsWithDefaults.actionRowOptions.actionRowFormOptions = Object.assign({}, DefaultAdaptableOptions.actionRowOptions.actionRowFormOptions, adaptableOptsWithDefaults.actionRowOptions.actionRowFormOptions);
+    adaptableOptsWithDefaults.containerOptions = Object.assign({}, DefaultAdaptableOptions.containerOptions, adaptableOptions.containerOptions);
+    adaptableOptsWithDefaults.groupingOptions = Object.assign({}, DefaultAdaptableOptions.groupingOptions, adaptableOptions.groupingOptions);
+    adaptableOptsWithDefaults.quickSearchOptions = Object.assign({}, DefaultAdaptableOptions.quickSearchOptions, adaptableOptions.quickSearchOptions);
+    adaptableOptsWithDefaults.columnFilterOptions = Object.assign({}, DefaultAdaptableOptions.columnFilterOptions, adaptableOptions.columnFilterOptions);
+    adaptableOptsWithDefaults.columnFilterOptions.quickFilterOptions = Object.assign({}, DefaultAdaptableOptions.columnFilterOptions.quickFilterOptions, adaptableOptsWithDefaults.columnFilterOptions.quickFilterOptions);
+    adaptableOptsWithDefaults.columnFilterOptions.filterFormOptions = Object.assign({}, DefaultAdaptableOptions.columnFilterOptions.filterFormOptions, adaptableOptsWithDefaults.columnFilterOptions.filterFormOptions);
+    adaptableOptsWithDefaults.columnFilterOptions.valuesFilterOptions = Object.assign({}, DefaultAdaptableOptions.columnFilterOptions.valuesFilterOptions, adaptableOptsWithDefaults.columnFilterOptions.valuesFilterOptions);
+    adaptableOptsWithDefaults.gridFilterOptions = Object.assign({}, DefaultAdaptableOptions.gridFilterOptions, adaptableOptions.gridFilterOptions);
+    adaptableOptsWithDefaults.userInterfaceOptions = Object.assign({}, DefaultAdaptableOptions.userInterfaceOptions, adaptableOptions.userInterfaceOptions);
+    adaptableOptsWithDefaults.userInterfaceOptions.dateInputOptions = Object.assign({}, DefaultAdaptableOptions.userInterfaceOptions.dateInputOptions, adaptableOptsWithDefaults.userInterfaceOptions.dateInputOptions);
+    adaptableOptsWithDefaults.menuOptions = Object.assign({}, DefaultAdaptableOptions.menuOptions, adaptableOptions.menuOptions);
+    adaptableOptsWithDefaults.stateOptions = Object.assign({}, DefaultAdaptableOptions.stateOptions, adaptableOptions.stateOptions);
+    adaptableOptsWithDefaults.exportOptions = Object.assign({}, DefaultAdaptableOptions.exportOptions, adaptableOptions.exportOptions);
+    adaptableOptsWithDefaults.teamSharingOptions = Object.assign({}, DefaultAdaptableOptions.teamSharingOptions, adaptableOptions.teamSharingOptions);
+    adaptableOptsWithDefaults.toolPanelOptions = Object.assign({}, DefaultAdaptableOptions.toolPanelOptions, adaptableOptions.toolPanelOptions);
+    adaptableOptsWithDefaults.dataChangeHistoryOptions = Object.assign({}, DefaultAdaptableOptions.dataChangeHistoryOptions, adaptableOptions.dataChangeHistoryOptions);
+    adaptableOptsWithDefaults.chartingOptions = Object.assign({}, DefaultAdaptableOptions.chartingOptions, adaptableOptions.chartingOptions);
+    adaptableOptsWithDefaults.chartingOptions.externalChartingOptions = Object.assign({}, DefaultAdaptableOptions.chartingOptions.externalChartingOptions, adaptableOptsWithDefaults.chartingOptions.externalChartingOptions);
+    adaptableOptsWithDefaults.settingsPanelOptions = Object.assign({}, DefaultAdaptableOptions.settingsPanelOptions, adaptableOptions.settingsPanelOptions);
+    adaptableOptsWithDefaults.fdc3Options = Object.assign({}, DefaultAdaptableOptions.fdc3Options, adaptableOptions.fdc3Options);
+    adaptableOptsWithDefaults.fdc3Options.actionColumnDefaultConfiguration = Object.assign({}, DefaultAdaptableOptions.fdc3Options.actionColumnDefaultConfiguration, adaptableOptsWithDefaults.fdc3Options.actionColumnDefaultConfiguration);
+    adaptableOptsWithDefaults.fdc3Options.uiControlsDefaultConfiguration = Object.assign({}, DefaultAdaptableOptions.fdc3Options.uiControlsDefaultConfiguration, adaptableOptsWithDefaults.fdc3Options.uiControlsDefaultConfiguration);
+    const { predefinedConfig } = adaptableOptsWithDefaults;
+    if (predefinedConfig) {
+        adaptableOptsWithDefaults.predefinedConfig =
+            typeof predefinedConfig === 'string'
+                ? predefinedConfig
+                : initPredefinedConfigWithUuids(predefinedConfig);
+    }
+    return adaptableOptsWithDefaults;
+}
+export const getDefaultAdaptableOptions = () => DefaultAdaptableOptions;

package/src/agGrid/editors/AdaptableDateEditor/index.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ICellEditorParams, ICellEditorComp } from '@ag-grid-community/core';
+import { ICellEditorComp, ICellEditorParams } from '@ag-grid-community/core';
 import { IAdaptable } from '../../../AdaptableInterfaces/IAdaptable';
 export declare const ReactAdaptableDateEditor: React.ForwardRefExoticComponent<ICellEditorParams<any, any, any> & {
     showClearButton?: boolean;

package/src/agGrid/editors/AdaptableDateEditor/index.js

@@ -2,8 +2,8 @@ import * as React from 'react';
 import { renderWithAdaptableContext } from '../../../View/renderWithAdaptableContext';
 import { InternalAdaptableDateEditor, } from './InternalAdaptableDateEditor';
 import { KeyCode, } from '@ag-grid-community/core';
-import { DateFormatter } from '../../../Utilities/Helpers/FormatHelper';
 import { forwardRef, useImperativeHandle, useRef, useState } from 'react';
+import { DateFormatter } from '../../../Utilities/Helpers/FormatHelper';
 function shouldClearExistingValue(params) {
     return params.eventKey === KeyCode.BACKSPACE || params.eventKey === KeyCode.DELETE;
 }
@@ -29,7 +29,7 @@ export const ReactAdaptableDateEditor = forwardRef((props, ref) => {
     const valueRef = useRef(initialValue);
     const colValueParser = props.column.getColDef().valueParser;
     const valueParser = typeof colValueParser === 'function' ? colValueParser : defaultDateValueParser;
-    const adaptable = props.api.__adaptable;
+    const adaptable = props.context.__adaptable;
     const editorRef = useRef(null);
     useImperativeHandle(ref, () => {
         return {
@@ -135,7 +135,7 @@ export class AdaptableDateEditor {
     }
     focusOut() { }
     getAdaptableInstance(params) {
-        const adaptable = params.api.__adaptable;
+        const adaptable = params.context.__adaptable;
         return adaptable;
     }
     // after this component has been created and inserted into the grid

package/src/agGrid/editors/AdaptableNumberEditor/index.d.ts

@@ -6,12 +6,12 @@ import { ICellEditorComp, ICellEditorParams } from '@ag-grid-community/core';
 interface AdaptableNumberCellEditorParams extends ICellEditorParams {
     /**
      * Whether to show the clear button. If `true`, it works together with `cellEditorParams.emptyValue`
-     * @default true
+     * @defaultValue true
      */
     showClearButton: boolean;
     /**
      * Value to set for the cell, when the clear button is pressed
-     * @default '' (empty string)
+     * @defaultValue '' (empty string)
      */
     emptyValue: string;
 }

package/src/agGrid/editors/AdaptableNumberEditor/index.js

@@ -35,7 +35,7 @@ export const ReactAdaptableNumberEditor = forwardRef((props, ref) => {
     const [initialValue] = useState(() => getStartValue(props));
     const valueRef = useRef(initialValue);
     const columnId = props.column.getColId();
-    const adaptable = props.api.__adaptable;
+    const adaptable = props.context.__adaptable;
     const colValueParser = props.column.getColDef().valueParser;
     const valueParser = typeof colValueParser === 'function' ? colValueParser : defaultValueParser;
     function onValueChange(value) {
@@ -134,7 +134,7 @@ export class AdaptableNumberEditor {
     // after this component has been created and inserted into the grid
     afterGuiAttached() {
         var _a, _b;
-        const adaptable = this.params.api.__adaptable;
+        const adaptable = this.params.context.__adaptable;
         const defaultValue = this.value;
         const editorElement = (React.createElement(InternalAdaptableNumberEditor, { defaultValue: defaultValue, showClearButton: (_a = this.params.showClearButton) !== null && _a !== void 0 ? _a : true, emptyValue: (_b = this.params.emptyValue) !== null && _b !== void 0 ? _b : '', onValueChange: this.onValueChange, ref: (editor) => {
                 this.editor = editor;

package/src/agGrid/sortColumnStateForVisibleColumns.d.ts

@@ -0,0 +1,12 @@
+type ColState = {
+    colId: string;
+    hide?: boolean | null;
+};
+/**
+ * This method takes a column state and the list of visible columns
+ * and returns a new column state that respects the order of the visible columns
+ * while trying to keep the hidden columns in their original order.
+ *
+ */
+export declare function sortColumnStateForVisibleColumns<T extends ColState>(columnState: T[], visibleColumns: string[]): T[];
+export {};

package/src/agGrid/sortColumnStateForVisibleColumns.js

@@ -0,0 +1,46 @@
+function insertAtCorrectIndex(result, colState, visibleColumnsIndexes, offset = 0, lastVisibleOffset = 0) {
+    const prevColState = result[result.length - 1 - offset];
+    if (!prevColState) {
+        result.splice(result.length - lastVisibleOffset, 0, colState);
+        return;
+    }
+    if (prevColState.hide) {
+        insertAtCorrectIndex(result, colState, visibleColumnsIndexes, offset + 1, 
+        /* do not advance this as, as we've encountered a hidden column*/ lastVisibleOffset);
+        return;
+    }
+    const prevCol_visibilityIndex = visibleColumnsIndexes[prevColState.colId];
+    const currentCol_visibilityIndex = visibleColumnsIndexes[colState.colId];
+    if (currentCol_visibilityIndex < prevCol_visibilityIndex) {
+        insertAtCorrectIndex(result, colState, visibleColumnsIndexes, offset + 1, 
+        /*make sure we sync with the normal offset, as we've hit a visible col*/ offset + 1);
+    }
+    else {
+        result.splice(result.length - lastVisibleOffset, 0, colState);
+    }
+}
+/**
+ * This method takes a column state and the list of visible columns
+ * and returns a new column state that respects the order of the visible columns
+ * while trying to keep the hidden columns in their original order.
+ *
+ */
+export function sortColumnStateForVisibleColumns(columnState, visibleColumns) {
+    const visibleColumnsIndexes = visibleColumns.reduce((acc, colId, index) => {
+        acc[colId] = index;
+        return acc;
+    }, {});
+    const result = [];
+    for (let i = 0, len = columnState.length; i < len; i++) {
+        const colState = columnState[i];
+        const colVisible = visibleColumnsIndexes[colState.colId] != null;
+        if (!colVisible) {
+            // for cols not present in this layout, we keep them
+            // where they are
+            result.push(colState);
+            continue;
+        }
+        insertAtCorrectIndex(result, colState, visibleColumnsIndexes);
+    }
+    return result;
+}

package/src/agGrid/weightedAverage.d.ts

@@ -1,9 +1,7 @@
 import { IAggFuncParams } from '@ag-grid-community/core';
-import { CellSummaryOperationContext } from '../types';
 export declare const getNumericValue: (input: unknown) => number | null;
 export declare const weightedAverage: (params: IAggFuncParams, columnId: string, weightColumnId: string) => {
     [x: string]: number | (() => number | "");
     toString: () => number | "";
     valueOf: () => number;
 };
-export declare const cellSummaryWeightedAverage: ({ numericColumns, selectedCellInfo, adaptableApi, }: CellSummaryOperationContext) => any;