@adaptabletools/adaptable 18.0.0-canary.5 → 18.0.0-canary.7

package/package.json

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

package/src/PredefinedConfig/Common/DataUpdateConfig.d.ts

@@ -6,6 +6,14 @@ export interface DataUpdateConfig {
      * Whether data should be updated asynchronously
      */
     runAsync?: boolean;
+    /**
+     * Whether to flush async updates.
+     *
+     * If `true`, any async transactions will be flushed.
+     * This flag can be true even if you runAsync is `false`.
+     * So even if the currenct transaction/operation is synchronous, this will flush existing async transactions.
+     */
+    flushAsync?: boolean;
     /**
      * Callback function invoked when a batch successfully updates
      */

package/src/View/Layout/TransposedPopup.js

@@ -94,7 +94,7 @@ export const TransposedPopup = (props) => {
             },
             layoutOptions: {
                 createDefaultLayout: false,
-                autoSizeColumnsInLayout: false,
+                autoSizeColumnsInLayout: true,
             },
             predefinedConfig: {
                 Layout: {

package/src/agGrid/AdaptableAgGrid.d.ts

@@ -27,7 +27,7 @@ import { AgGridOptionsService } from './AgGridOptionsService';
 import { AgGridColumnAdapter } from './AgGridColumnAdapter';
 import { RowEditService } from '../Utilities/Services/RowEditService';
 export type AdaptableVariant = 'vanilla' | 'react' | 'angular';
-export type AdaptableLifecycleState = 'initial' | 'preprocessOptions' | 'initAdaptableState' | 'setupAgGrid' | 'initAgGrid' | 'ready' | 'ready' | 'preDestroyed';
+export type AdaptableLifecycleState = 'initial' | 'preprocessOptions' | 'initAdaptableState' | 'setupAgGrid' | 'initAgGrid' | 'available' | 'ready' | 'preDestroyed';
 type RenderAgGridFrameworkComponentResult = false | GridApi;
 interface AdaptableInitInternalConfig<TData = any> {
     variant: AdaptableVariant;
@@ -115,6 +115,7 @@ export declare class AdaptableAgGrid implements IAdaptable {
     private static collectInstance;
     private static dismissInstance;
     get isReady(): boolean;
+    get isAvailable(): boolean;
     get isDestroyed(): boolean;
     _emit: (eventName: string, data?: any) => Promise<any>;
     _emitSync: (eventName: string, data?: any) => any;

package/src/agGrid/AdaptableAgGrid.js

@@ -191,6 +191,9 @@ export class AdaptableAgGrid {
     get isReady() {
         return this.lifecycleState === 'ready';
     }
+    get isAvailable() {
+        return this.lifecycleState === 'available' || this.lifecycleState === 'ready';
+    }
     get isDestroyed() {
         return this.lifecycleState === 'preDestroyed';
     }
@@ -409,7 +412,10 @@ export class AdaptableAgGrid {
         /**
          * At this point AG Grid is initialized!
          */
-        this.updateColumnModelAndRefreshGrid();
+        this.deriveAdaptableColumnStateFromAgGrid();
+        this.agGridColumnAdapter.setupColumns();
+        // we need this because we need the internal Column state to be ready before doing any extra business logic
+        this.lifecycleState = 'available';
         this.api.themeApi.applyCurrentTheme();
         this.validatePrimaryKey();
         this.embedColumnMenu = this.agGridAdapter.isModulePresent(ModuleNames.MenuModule);
@@ -419,6 +425,8 @@ export class AdaptableAgGrid {
         this.applyColumnFiltering();
         this.addGridEventListeners();
         this.temporaryAdaptableStateUpdates();
+        this.redrawBody();
+        this.refreshHeader();
         // do this now so it sets module entitlements
         this.EntitlementService.setModulesEntitlements();
         // create the module menu (for use in the dashboard and the toolpanel)
@@ -588,7 +596,7 @@ export class AdaptableAgGrid {
          */
         this.agGridOptionsService.setGridOptionsProperty(gridOptions, 'isExternalFilterPresent', (original_isExternalFilterPresent) => {
             return (params) => {
-                if (this.isDestroyed) {
+                if (!this.isAvailable) {
                     return true;
                 }
                 const columnFilters = this.api.columnFilterApi.getActiveColumnFilters();
@@ -605,7 +613,7 @@ export class AdaptableAgGrid {
          */
         this.agGridOptionsService.setGridOptionsProperty(gridOptions, 'doesExternalFilterPass', (original_doesExternalFilterPass) => {
             return (node) => {
-                if (this.isDestroyed) {
+                if (!this.isAvailable) {
                     return true;
                 }
                 // first we assess a Grid Filter (if its running locally)
@@ -916,7 +924,8 @@ export class AdaptableAgGrid {
                 const gridRoot = agGridApi.ctrlsService.gridBodyCtrl.eGridBody;
                 const gridContainer = gridRoot === null || gridRoot === void 0 ? void 0 : gridRoot.closest('[class*="ag-theme"]');
                 if (!gridContainer) {
-                    this.logger.consoleError('No AG Grid container element found in the DOM. Please provide a valid container element in `ContainerOptions.agGridContainer`');
+                    this.logger.consoleError(`No AG Grid container could be derived from the Adaptable framework wrapper.
+            Please contact AdapTable Support and in the meantime provide a valid container element in 'ContainerOptions.agGridContainer'!`);
                 }
                 this.DANGER_USE_GETTER_agGridContainerElement = gridContainer;
             }
@@ -1930,12 +1939,18 @@ export class AdaptableAgGrid {
                     }
                     resolve(transaction === null || transaction === void 0 ? void 0 : transaction.update);
                 });
+                if (dataUpdateConfig.flushAsync) {
+                    this.agGridAdapter.getAgGridApi().flushAsyncTransactions();
+                }
             });
         }
         else {
             const transaction = this.agGridAdapter.getAgGridApi().applyTransaction({
                 update: dataRows,
             });
+            if (dataUpdateConfig.flushAsync) {
+                this.agGridAdapter.getAgGridApi().flushAsyncTransactions();
+            }
             return Promise.resolve(transaction === null || transaction === void 0 ? void 0 : transaction.update);
         }
     }
@@ -1957,10 +1972,16 @@ export class AdaptableAgGrid {
                     resolve(transaction === null || transaction === void 0 ? void 0 : transaction.add);
                     this.updateRowGroupsExpandedState();
                 });
+                if (dataUpdateConfig.flushAsync) {
+                    this.agGridAdapter.getAgGridApi().flushAsyncTransactions();
+                }
             });
         }
         else {
             const transaction = this.agGridAdapter.getAgGridApi().applyTransaction(newData);
+            if (dataUpdateConfig.flushAsync) {
+                this.agGridAdapter.getAgGridApi().flushAsyncTransactions();
+            }
             this.updateRowGroupsExpandedState();
             return Promise.resolve(transaction === null || transaction === void 0 ? void 0 : transaction.add);
         }
@@ -1990,11 +2011,17 @@ export class AdaptableAgGrid {
                     if (typeof dataUpdateConfig.callback === 'function') {
                         dataUpdateConfig.callback(transaction);
                     }
+                    if (transaction === null || transaction === void 0 ? void 0 : transaction.add) {
+                        this.updateRowGroupsExpandedState();
+                    }
                     resolve({
                         added: transaction === null || transaction === void 0 ? void 0 : transaction.add,
                         updated: transaction === null || transaction === void 0 ? void 0 : transaction.update,
                     });
                 });
+                if (dataUpdateConfig.flushAsync) {
+                    this.agGridAdapter.getAgGridApi().flushAsyncTransactions();
+                }
             });
         }
         else {
@@ -2003,6 +2030,12 @@ export class AdaptableAgGrid {
                 add: addDataRows,
                 addIndex: dataUpdateConfig.addIndex,
             });
+            if (transaction === null || transaction === void 0 ? void 0 : transaction.add) {
+                this.updateRowGroupsExpandedState();
+            }
+            if (dataUpdateConfig.flushAsync) {
+                this.agGridAdapter.getAgGridApi().flushAsyncTransactions();
+            }
             return Promise.resolve({
                 added: transaction === null || transaction === void 0 ? void 0 : transaction.add,
                 updated: transaction === null || transaction === void 0 ? void 0 : transaction.update,
@@ -2021,12 +2054,18 @@ export class AdaptableAgGrid {
                     }
                     resolve(transaction === null || transaction === void 0 ? void 0 : transaction.remove);
                 });
+                if (dataUpdateConfig.flushAsync) {
+                    this.agGridAdapter.getAgGridApi().flushAsyncTransactions();
+                }
             });
         }
         else {
             const transaction = this.agGridAdapter.getAgGridApi().applyTransaction({
                 remove: dataRows,
             });
+            if (dataUpdateConfig.flushAsync) {
+                this.agGridAdapter.getAgGridApi().flushAsyncTransactions();
+            }
             return Promise.resolve(transaction.remove);
         }
     }

package/src/agGrid/AgGridAdapter.d.ts

@@ -7,6 +7,7 @@ import { ColGroupDef } from '@ag-grid-community/core/dist/esm/es6/entities/colDe
 export declare class AgGridAdapter {
     private adaptableInstance;
     private DANGER_USE_GETTER_gridApi;
+    private DANGER_gridApi_from_args;
     initialGridOptions: GridOptions;
     constructor(adaptableInstance: AdaptableAgGrid);
     private get adaptableOptions();
@@ -15,6 +16,12 @@ export declare class AgGridAdapter {
     destroy(): void;
     setAgGridApi(gridApi: GridApi): void;
     getAgGridApi(skipLogging?: boolean): GridApi | undefined;
+    /**
+     * When AG Grid is rendered the first time, the AG GridApi is not yet set in the Adaptable context (as it's set only AFTER the grid is fully initialised)
+     * yet we need it when evaluating custom GridOptions properties on the first render.
+     * to handle this edge case, we try to extract the AG GridApi from the invocation arguments
+     */
+    grabAgGridApiOnTheFly(args: unknown): void;
     getLiveGridOptions(): GridOptions | undefined;
     updateGridOptions(options: ManagedGridOptions): void;
     setGridOption<Key extends ManagedGridOptionKey>(key: Key, value: GridOptions[Key]): void;

package/src/agGrid/AgGridAdapter.js

@@ -1,4 +1,4 @@
-import { ModuleRegistry, } from '@ag-grid-community/core';
+import { GridApi, ModuleRegistry, } from '@ag-grid-community/core';
 import { ADAPTABLE_FDC3_ACTION_COLUMN_FRIENDLY_NAME, ADAPTABLE_ROW_ACTION_BUTTONS, ADAPTABLE_ROW_ACTION_BUTTONS_FRIENDLY_NAME, } from '../Utilities/Constants/GeneralConstants';
 import { createUuid } from '../PredefinedConfig/Uuid';
 import ArrayExtensions from '../Utilities/Extensions/ArrayExtensions';
@@ -26,10 +26,30 @@ export class AgGridAdapter {
         if (this.DANGER_USE_GETTER_gridApi) {
             return this.DANGER_USE_GETTER_gridApi;
         }
+        if (this.DANGER_gridApi_from_args) {
+            return this.DANGER_gridApi_from_args;
+        }
         if (!skipLogging) {
             console.error('AgGridApi is not available yet');
         }
     }
+    /**
+     * When AG Grid is rendered the first time, the AG GridApi is not yet set in the Adaptable context (as it's set only AFTER the grid is fully initialised)
+     * yet we need it when evaluating custom GridOptions properties on the first render.
+     * to handle this edge case, we try to extract the AG GridApi from the invocation arguments
+     */
+    grabAgGridApiOnTheFly(args) {
+        var _a, _b;
+        if (this.DANGER_USE_GETTER_gridApi) {
+            return;
+        }
+        if (Array.isArray(args) &&
+            typeof ((_a = args[0]) === null || _a === void 0 ? void 0 : _a.api) === 'object' &&
+            ((_b = args[0]) === null || _b === void 0 ? void 0 : _b.api) instanceof GridApi) {
+            this.DANGER_gridApi_from_args = args[0].api;
+        }
+    }
+    // TODO AFL check if this is still needed if GridAPI offers the `getOption` method
     // do NOT ever mutate the returned object!!
     getLiveGridOptions() {
         var _a, _b;

package/src/agGrid/AgGridOptionsService.d.ts

@@ -8,4 +8,5 @@ export declare class AgGridOptionsService {
     destroy(): void;
     setGridOptionsProperty<T extends keyof GridOptions>(gridOptions: GridOptions, propertyName: T, propertyGetter: (userPropertyValue: GridOptions[T]) => GridOptions[T] | undefined): GridOptions;
     revertGridOptionsPropertiesToUserValue<T extends keyof GridOptions>(gridOptions: GridOptions, propertyNames: T[]): void;
+    private get agGridAdapter();
 }

package/src/agGrid/AgGridOptionsService.js

@@ -30,6 +30,7 @@ export class AgGridOptionsService {
                 if (this.adaptableInstance.isDestroyed) {
                     return;
                 }
+                this.agGridAdapter.grabAgGridApiOnTheFly(args);
                 return previousValue(...args);
             };
         }
@@ -47,4 +48,7 @@ export class AgGridOptionsService {
             gridOptions[propertyName] = userValue;
         }
     }
+    get agGridAdapter() {
+        return this.adaptableInstance.agGridAdapter;
+    }
 }

package/src/env.js

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

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

@@ -5299,6 +5299,33 @@ export declare const ADAPTABLE_METAMODEL: {
             ref: string;
         }[];
     };
+    UpgradeConfig: {
+        name: string;
+        kind: string;
+        desc: string;
+        props: ({
+            name: string;
+            kind: string;
+            desc: string;
+            isOpt?: undefined;
+            defVal?: undefined;
+            ref?: undefined;
+        } | {
+            name: string;
+            kind: string;
+            desc: string;
+            isOpt: boolean;
+            defVal: string;
+            ref: string;
+        } | {
+            name: string;
+            kind: string;
+            desc: string;
+            isOpt: boolean;
+            defVal: string;
+            ref?: undefined;
+        })[];
+    };
     UserColumnMenuItem: {
         name: string;
         kind: string;

package/src/metamodel/adaptable.metamodel.js

@@ -4409,6 +4409,12 @@ export const ADAPTABLE_METAMODEL = {
                 "desc": "Callback function invoked when a batch successfully updates",
                 "isOpt": true
             },
+            {
+                "name": "flushAsync",
+                "kind": "b",
+                "desc": "Whether to flush async updates.",
+                "isOpt": true
+            },
             {
                 "name": "runAsync",
                 "kind": "b",
@@ -8972,6 +8978,33 @@ export const ADAPTABLE_METAMODEL = {
             }
         ]
     },
+    "UpgradeConfig": {
+        "name": "UpgradeConfig",
+        "kind": "I",
+        "desc": "The upgrade config object",
+        "props": [
+            {
+                "name": "fromVersion",
+                "kind": "n",
+                "desc": "The version to upgrade from"
+            },
+            {
+                "name": "logger",
+                "kind": "R",
+                "desc": "The logger object",
+                "isOpt": true,
+                "defVal": "The console object",
+                "ref": "unknown"
+            },
+            {
+                "name": "toVersion",
+                "kind": "n",
+                "desc": "The version to upgrade to",
+                "isOpt": true,
+                "defVal": "The current version"
+            }
+        ]
+    },
     "UserColumnMenuItem": {
         "name": "UserColumnMenuItem",
         "kind": "I",
@@ -9154,6 +9187,27 @@ export const ADAPTABLE_METAMODEL = {
                 "desc": "Custom column values for Values Column Filter and Grid Filter Builder",
                 "isOpt": true
             },
+            {
+                "name": "loadingScreenDelay",
+                "kind": "n",
+                "desc": "Delay in milliseconds before Loading Screen appears. `showLoadingScreen` must be true for this to take effect",
+                "isOpt": true,
+                "defVal": "200"
+            },
+            {
+                "name": "loadingScreenText",
+                "kind": "s",
+                "desc": "Text to display in Loading Screen.",
+                "isOpt": true,
+                "defVal": "'Retrieving your settings and setting up the grid...'"
+            },
+            {
+                "name": "loadingScreenTitle",
+                "kind": "s",
+                "desc": "Title to display in Loading Screen.",
+                "isOpt": true,
+                "defVal": "'Initialising Grid'"
+            },
             {
                 "name": "objectTags",
                 "kind": "u",