@adaptabletools/adaptable 22.0.0-canary.1 → 22.0.0-canary.3

package/src/Utilities/Services/ChartingService.js

@@ -1,6 +1,7 @@
 import * as InternalRedux from '../../Redux/ActionsReducers/InternalRedux';
 import ObjectFactory from '../ObjectFactory';
 export class ChartingService {
+    api;
     constructor(api) {
         this.api = api;
     }

package/src/Utilities/Services/DataService.js

@@ -4,10 +4,16 @@ import Helper from '../Helpers/Helper';
 // ~ 8 hours
 const MAX_TIMEFRAME_SIZE = 86400000;
 export class DataService {
+    adaptable;
+    emitter;
+    cellDataChangeLogSubject$;
+    cellDataChangeLog$;
+    rowDataChangeLogSubject$;
+    rowDataChangeLog$;
+    undoChangeLog;
+    undoChangeTimers;
     constructor(adaptable) {
         this.adaptable = adaptable;
-        this.on = (eventName, callback) => this.emitter.on(eventName, callback);
-        this.emit = (eventName, data) => this.emitter.emit(eventName, data);
         this.adaptable = adaptable;
         this.emitter = new Emitter();
         this.cellDataChangeLogSubject$ = new Subject();
@@ -31,6 +37,8 @@ export class DataService {
         this.undoChangeTimers.clear();
         this.undoChangeTimers = null;
     }
+    on = (eventName, callback) => this.emitter.on(eventName, callback);
+    emit = (eventName, data) => this.emitter.emit(eventName, data);
     CreateCellDataChangedEvent(cellDataChangedInfo) {
         if (cellDataChangedInfo.newValue != cellDataChangedInfo.oldValue) {
             this.emitter.emitSync('CellDataChanged', cellDataChangedInfo);

package/src/Utilities/Services/Fdc3Service.js

@@ -1,11 +1,13 @@
 import { ContextConfiguration } from '../../AdaptableState/Common/Fdc3Context';
 import { Fdc3IntentConfiguration } from '../../AdaptableState/Common/Fdc3Intent';
 export class Fdc3Service {
+    adaptableApi;
+    contextHandlerSubscriptions = [];
+    intentHandlerSubscriptions = [];
+    loggedAgentError = false;
+    uiControlsDefaultConfiguration;
     constructor(adaptableApi) {
         this.adaptableApi = adaptableApi;
-        this.contextHandlerSubscriptions = [];
-        this.intentHandlerSubscriptions = [];
-        this.loggedAgentError = false;
         // 1. Subscribe to FDC3 events
         const adaptableHandleIntentFn = this.getFdc3Options().intents?.handleIntent;
         const listenForIntents = this.getFdc3Options().intents?.listensFor ?? [];

package/src/Utilities/Services/FlashingCellService.js

@@ -3,6 +3,11 @@ export const FLASHING_CELL_ROW_KEY = '__ROW';
  * This service manages Flashing Cells
  */
 export class FlashingCellService {
+    api;
+    // map of rowPrimaryKey -> ColIdOrRowId -> FlashingCellUuid
+    gridCellsCurrentlyFlashing;
+    // map of FlashingCellUuid -> FlashingCell
+    flashingCellsMapping;
     constructor(api) {
         this.api = api;
         this.gridCellsCurrentlyFlashing = {};

package/src/Utilities/Services/LicenseService/index.js

@@ -1 +1 @@
-import{LicenseDisablePersistence as e,LicenseShowWatermark as a}from"../../../Redux/ActionsReducers/InternalRedux";import{PopupShowAlert as t}from"../../../Redux/ActionsReducers/PopupRedux";import i from"../../ObjectFactory";import s from"lodash/clamp";import{LicenseDocsLink as o}from"../../Constants/DocumentationLinkConstants";import{decode as n,GENERIC_APP_NAME as r}from"../../license/decode";import{shouldLogThankYouMessage as l}from"./shouldLogThankYouMessage";const c="sales@adaptabletools.com",p=10,d=864e5;export var LicenseValidityType;!function(e){e.INVALID_LICENSE="INVALID_LICENSE",e.NO_LICENSE="NO_LICENSE",e.NON_PRODUCTION_VALID="NON_PRODUCTION_VALID",e.NON_PRODUCTION_EXPIRED_IN_SCOPE="NON_PRODUCTION_EXPIRED_IN_SCOPE",e.NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE="NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE",e.COMMERCIAL_VALID="COMMERCIAL_VALID",e.COMMERCIAL_EXPIRED_IN_SCOPE="COMMERCIAL_EXPIRED_IN_SCOPE",e.COMMERCIAL_EXPIRED_OUT_OF_SCOPE="COMMERCIAL_EXPIRED_OUT_OF_SCOPE"}(LicenseValidityType||(LicenseValidityType={}));const h=()=>"undefined"!=typeof window?window.location.origin:"",E=()=>{const e=h(),[a,t,i]=Array.from(/(https):\/\/\d+\-\d+\-\d+\-(sandpack\.codesandbox\.io)/g.exec(e)||[]);return"https"===t&&"sandpack.codesandbox.io"===i},I=()=>{const e=h(),[a,t,i]=Array.from(/(https):\/\/\S+(\.csb\.app)/g.exec(e)||[]);return"https"===t&&".csb.app"===i},_=()=>{const e=h(),[a,t,i]=Array.from(/(https):\/\/\S+(\.adaptabletools\.com)/g.exec(e)||[]);return"https"===t&&".adaptabletools.com"===i};export class LicenseService{constructor(e,a,t){this.adaptable=e,this.licenseKey=a,this.packageDetails=t,this.adaptable=e,this.adaptable.api.eventApi.on("AdaptableReady",()=>{requestAnimationFrame(()=>{this.adaptable.isDestroyed||this.init()})})}init(){let e=null;if(this.licenseKey)try{e=n(this.licenseKey)}catch(a){e=a}E()||I()||_()||this.handleLicenseValidation(e,this.getValidityType(e,this.packageDetails))}getValidityType(e,a){if(!e)return LicenseValidityType.NO_LICENSE;if(e instanceof Error)return LicenseValidityType.INVALID_LICENSE;const t=new Date(a.publishedAt),i=new Date(e.end),s=i<new Date,o=e.trial;let n=null;return n=s?i>t?o?LicenseValidityType.NON_PRODUCTION_EXPIRED_IN_SCOPE:LicenseValidityType.COMMERCIAL_EXPIRED_IN_SCOPE:o?LicenseValidityType.NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE:LicenseValidityType.COMMERCIAL_EXPIRED_OUT_OF_SCOPE:o?LicenseValidityType.NON_PRODUCTION_VALID:LicenseValidityType.COMMERCIAL_VALID,n}handleLicenseValidation(e,a){const t=new Date;t.setHours(0,0,0,0);let i=0;e instanceof Error||!e?.end||(i=Math.floor((e?.end?.getTime()-t.getTime())/d),i=s(i,0,1/0));let n="",h="";!e||e instanceof Error||!e.appName||e.appName==r||(n=e.appName,h=" for application [APP_NAME]");const E=(e,a=o,t=c,s=i,r=n)=>e.replace("[LINK]",a).replace("[EMAIL]",t).replace("[APP_NAME]",r).replace("[DAYS]",`${s}`);switch(a){case"NO_LICENSE":case"NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE":this.adaptable.logger.consoleLogByMessageType(E("This instance of AdapTable does not have a license, and some functionality has therefore been removed. In order to use a fully-featured version of AdapTable, please contact [EMAIL]. You can learn more about the different AdapTable license options at [LINK]."),"Error"),this.showNotification("No AdapTable License found."),this.showWatermark("This instance of AdapTable does not have a license, and some functionality has therefore been removed."),this.disableStatePersistence();break;case"INVALID_LICENSE":this.adaptable.logger.consoleLogByMessageType(E("This instance of AdapTable seems to use a corrupted License, and some functionality has therefore been removed. In order to use a fully-featured version of AdapTable, please contact [EMAIL]. You can learn more about the different AdapTable license options at [LINK]."),"Error"),this.showNotification("Corrupted AdapTable License found."),this.showWatermark("This instance of AdapTable has a corrupted License, and some functionality has therefore been removed."),this.disableStatePersistence();break;case"NON_PRODUCTION_VALID":this.adaptable.logger.consoleLogByMessageType(E("This AdapTable trial license expires in [DAYS] days. Please contact [EMAIL] to upgrade to a commercial version of AdapTable. You can learn more about the different AdapTable license options at [LINK]."),"Info");break;case"NON_PRODUCTION_EXPIRED_IN_SCOPE":this.adaptable.logger.consoleLogByMessageType(E("This AdapTable trial license has now expired. Please contact [EMAIL] to upgrade to a commercial version of AdapTable. You can learn more about the different AdapTable license options at [LINK]."),"Warning"),this.showWatermark("AdapTable License has expired");break;case"COMMERCIAL_VALID":if(i<=p)this.adaptable.logger.consoleLogByMessageType(E(`This AdapTable license${h} expires in [DAYS] days.  Please contact [EMAIL] to renew (giving you access to Support and Updates)`),"Info");else try{l()&&this.adaptable.logger.consoleLogByMessageType(E(`Thank you for using a valid AdapTable license${h}. Your license will expire in [DAYS] days.`),"Info")}catch(e){}break;case"COMMERCIAL_EXPIRED_IN_SCOPE":this.adaptable.logger.consoleLogByMessageType(E(`This AdapTable license${h} has expired.  Please contact [EMAIL] if you wish to renew (giving you access to Support and Updates)`),"Warning");break;case"COMMERCIAL_EXPIRED_OUT_OF_SCOPE":this.adaptable.logger.consoleLogByMessageType(E(`This AdapTable license${h} has expired. Adaptable version was published after the license expired. Please contact [EMAIL] if you wish to renew your license.`),"Error"),this.showNotification("Adaptable License has expired"),this.showWatermark("Adaptable License has expired")}}showNotification(e){this.adaptable.api.internalApi.dispatchReduxAction(t({alertType:"generic",header:"License Error",message:e,alertDefinition:i.CreateInternalAlertDefinitionForMessages("Error")}))}showWatermark(e){this.adaptable.api.internalApi.dispatchReduxAction(a(e))}disableStatePersistence(){this.adaptable.api.internalApi.dispatchReduxAction(e())}destroy(){}}
+import{LicenseDisablePersistence as e,LicenseShowWatermark as a}from"../../../Redux/ActionsReducers/InternalRedux";import{PopupShowAlert as t}from"../../../Redux/ActionsReducers/PopupRedux";import i from"../../ObjectFactory";import s from"lodash/clamp";import{LicenseDocsLink as o}from"../../Constants/DocumentationLinkConstants";import{decode as n,GENERIC_APP_NAME as r}from"../../license/decode";import{shouldLogThankYouMessage as l}from"./shouldLogThankYouMessage";const c="sales@adaptabletools.com",p=10,d=864e5;export var LicenseValidityType;!function(e){e.INVALID_LICENSE="INVALID_LICENSE",e.NO_LICENSE="NO_LICENSE",e.NON_PRODUCTION_VALID="NON_PRODUCTION_VALID",e.NON_PRODUCTION_EXPIRED_IN_SCOPE="NON_PRODUCTION_EXPIRED_IN_SCOPE",e.NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE="NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE",e.COMMERCIAL_VALID="COMMERCIAL_VALID",e.COMMERCIAL_EXPIRED_IN_SCOPE="COMMERCIAL_EXPIRED_IN_SCOPE",e.COMMERCIAL_EXPIRED_OUT_OF_SCOPE="COMMERCIAL_EXPIRED_OUT_OF_SCOPE"}(LicenseValidityType||(LicenseValidityType={}));const h=()=>"undefined"!=typeof window?window.location.origin:"",E=()=>{const e=h(),[a,t,i]=Array.from(/(https):\/\/\d+\-\d+\-\d+\-(sandpack\.codesandbox\.io)/g.exec(e)||[]);return"https"===t&&"sandpack.codesandbox.io"===i},I=()=>{const e=h(),[a,t,i]=Array.from(/(https):\/\/\S+(\.csb\.app)/g.exec(e)||[]);return"https"===t&&".csb.app"===i},_=()=>{const e=h(),[a,t,i]=Array.from(/(https):\/\/\S+(\.adaptabletools\.com)/g.exec(e)||[]);return"https"===t&&".adaptabletools.com"===i};export class LicenseService{adaptable;licenseKey;packageDetails;constructor(e,a,t){this.adaptable=e,this.licenseKey=a,this.packageDetails=t,this.adaptable=e,this.adaptable.api.eventApi.on("AdaptableReady",()=>{requestAnimationFrame(()=>{this.adaptable.isDestroyed||this.init()})})}init(){let e=null;if(this.licenseKey)try{e=n(this.licenseKey)}catch(a){e=a}E()||I()||_()||this.handleLicenseValidation(e,this.getValidityType(e,this.packageDetails))}getValidityType(e,a){if(!e)return LicenseValidityType.NO_LICENSE;if(e instanceof Error)return LicenseValidityType.INVALID_LICENSE;const t=new Date(a.publishedAt),i=new Date(e.end),s=i<new Date,o=e.trial;let n=null;return n=s?i>t?o?LicenseValidityType.NON_PRODUCTION_EXPIRED_IN_SCOPE:LicenseValidityType.COMMERCIAL_EXPIRED_IN_SCOPE:o?LicenseValidityType.NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE:LicenseValidityType.COMMERCIAL_EXPIRED_OUT_OF_SCOPE:o?LicenseValidityType.NON_PRODUCTION_VALID:LicenseValidityType.COMMERCIAL_VALID,n}handleLicenseValidation(e,a){const t=new Date;t.setHours(0,0,0,0);let i=0;e instanceof Error||!e?.end||(i=Math.floor((e?.end?.getTime()-t.getTime())/d),i=s(i,0,1/0));let n="",h="";!e||e instanceof Error||!e.appName||e.appName==r||(n=e.appName,h=" for application [APP_NAME]");const E=(e,a=o,t=c,s=i,r=n)=>e.replace("[LINK]",a).replace("[EMAIL]",t).replace("[APP_NAME]",r).replace("[DAYS]",`${s}`);switch(a){case"NO_LICENSE":case"NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE":this.adaptable.logger.consoleLogByMessageType(E("This instance of AdapTable does not have a license, and some functionality has therefore been removed. In order to use a fully-featured version of AdapTable, please contact [EMAIL]. You can learn more about the different AdapTable license options at [LINK]."),"Error"),this.showNotification("No AdapTable License found."),this.showWatermark("This instance of AdapTable does not have a license, and some functionality has therefore been removed."),this.disableStatePersistence();break;case"INVALID_LICENSE":this.adaptable.logger.consoleLogByMessageType(E("This instance of AdapTable seems to use a corrupted License, and some functionality has therefore been removed. In order to use a fully-featured version of AdapTable, please contact [EMAIL]. You can learn more about the different AdapTable license options at [LINK]."),"Error"),this.showNotification("Corrupted AdapTable License found."),this.showWatermark("This instance of AdapTable has a corrupted License, and some functionality has therefore been removed."),this.disableStatePersistence();break;case"NON_PRODUCTION_VALID":this.adaptable.logger.consoleLogByMessageType(E("This AdapTable trial license expires in [DAYS] days. Please contact [EMAIL] to upgrade to a commercial version of AdapTable. You can learn more about the different AdapTable license options at [LINK]."),"Info");break;case"NON_PRODUCTION_EXPIRED_IN_SCOPE":this.adaptable.logger.consoleLogByMessageType(E("This AdapTable trial license has now expired. Please contact [EMAIL] to upgrade to a commercial version of AdapTable. You can learn more about the different AdapTable license options at [LINK]."),"Warning"),this.showWatermark("AdapTable License has expired");break;case"COMMERCIAL_VALID":if(i<=p)this.adaptable.logger.consoleLogByMessageType(E(`This AdapTable license${h} expires in [DAYS] days.  Please contact [EMAIL] to renew (giving you access to Support and Updates)`),"Info");else try{l()&&this.adaptable.logger.consoleLogByMessageType(E(`Thank you for using a valid AdapTable license${h}. Your license will expire in [DAYS] days.`),"Info")}catch(e){}break;case"COMMERCIAL_EXPIRED_IN_SCOPE":this.adaptable.logger.consoleLogByMessageType(E(`This AdapTable license${h} has expired.  Please contact [EMAIL] if you wish to renew (giving you access to Support and Updates)`),"Warning");break;case"COMMERCIAL_EXPIRED_OUT_OF_SCOPE":this.adaptable.logger.consoleLogByMessageType(E(`This AdapTable license${h} has expired. Adaptable version was published after the license expired. Please contact [EMAIL] if you wish to renew your license.`),"Error"),this.showNotification("Adaptable License has expired"),this.showWatermark("Adaptable License has expired")}}showNotification(e){this.adaptable.api.internalApi.dispatchReduxAction(t({alertType:"generic",header:"License Error",message:e,alertDefinition:i.CreateInternalAlertDefinitionForMessages("Error")}))}showWatermark(e){this.adaptable.api.internalApi.dispatchReduxAction(a(e))}disableStatePersistence(){this.adaptable.api.internalApi.dispatchReduxAction(e())}destroy(){}}

package/src/Utilities/Services/MetamodelService.js

@@ -5,9 +5,9 @@ import { AdaptableLogger } from '../../agGrid/AdaptableLogger';
 import { getDefaultAdaptableOptions } from '../../AdaptableOptions/DefaultAdaptableOptions';
 const supportedMetamodelTypes = ['s', 'n', 'b', 'a', 'f', 'R'];
 export class MetamodelService {
+    gridInfoOptions = new Map();
+    getAdaptableOptions = () => null;
     constructor(getAdaptableOptions, validateOptions) {
-        this.gridInfoOptions = new Map();
-        this.getAdaptableOptions = () => null;
         this.getAdaptableOptions = getAdaptableOptions;
         this.gridInfoOptions = this.buildGridInfoOptions();
         if (validateOptions) {

package/src/Utilities/Services/ModuleService.js

@@ -1,6 +1,7 @@
 import Helper from '../Helpers/Helper';
 import { AgGridRequiredModulesDocsLink, HOST_URL_DOCS, } from '../Constants/DocumentationLinkConstants';
 export class ModuleService {
+    adaptableApi;
     constructor(adaptableApi) {
         this.adaptableApi = adaptableApi;
         this.adaptableApi = adaptableApi;
@@ -113,13 +114,13 @@ export class ModuleService {
             case 'CalculatedColumn':
                 return url + 'handbook-calculated-column';
             case 'CellSummary':
-                return url + 'handbook-summarising';
+                return url + 'handbook-summarising-cells';
             case 'Charting':
                 return url + 'handbook-charts';
             case 'ColumnFilter':
                 return url + 'handbook-column-filter';
             case 'ColumnInfo':
-                return url + 'dev-guide-column-grid-column-info';
+                return url + 'dev-guide-columns-column-info';
             case 'Comment':
                 return url + 'handbook-comments';
             case 'CustomSort':
@@ -145,7 +146,7 @@ export class ModuleService {
             case 'GridFilter':
                 return url + 'handbook-grid-filter';
             case 'GridInfo':
-                return url + 'dev-guide-column-grid-column-info';
+                return url + 'dev-guide-support-monitoring';
             case 'Layout':
                 return url + 'handbook-layouts';
             case 'NamedQuery':

package/src/Utilities/Services/QueryLanguageService.js

@@ -9,13 +9,14 @@ import { scalarExpressionFunctions } from '../ExpressionFunctions/scalarExpressi
 import { getTypedKeys } from '../Extensions/TypeExtensions';
 import { AggregatedScalarLiveValue } from './AggregatedScalarLiveValue';
 export class QueryLanguageService {
+    adaptableApi;
+    cacheBooleanValidation = new Map();
+    cacheObservableValidation = new Map();
+    cacheAggregatedBooleanValidation = new Map();
+    cacheAggregatedScalarValidation = new Map();
+    cacheModuleSpecificExpressionFunctions = new Map();
     constructor(adaptableApi) {
         this.adaptableApi = adaptableApi;
-        this.cacheBooleanValidation = new Map();
-        this.cacheObservableValidation = new Map();
-        this.cacheAggregatedBooleanValidation = new Map();
-        this.cacheAggregatedScalarValidation = new Map();
-        this.cacheModuleSpecificExpressionFunctions = new Map();
     }
     evaluateBooleanExpression(expression, module, rowNode, evalContext) {
         if (expression == undefined) {

package/src/Utilities/Services/RowFormService.js

@@ -1,4 +1,5 @@
 export class RowFormService {
+    adaptableApi;
     constructor(adaptableApi) {
         this.adaptableApi = adaptableApi;
         if (adaptableApi.optionsApi.getRowFormOptions().autoHandle) {

package/src/Utilities/Services/RowSummaryService.js

@@ -10,15 +10,12 @@ import isEqual from 'lodash/isEqual';
  * The logic is extracted here to make it easier to follow
  */
 export class RowSummaryService {
+    api;
+    cachedCellSummary = new Map();
+    previousRowSummaries;
+    previousLayout;
     constructor(api) {
         this.api = api;
-        this.cachedCellSummary = new Map();
-        this._throttleAcumulatedColumnsThatChanged = new Set();
-        /**
-         *
-         * @param colId optional to evaluate only one column
-         */
-        this._throttledEvaluateRowSummary = throttle(this.evaluateRowSummary, 300);
     }
     onAdaptableReady() {
         this.rowSummariesSubscriptions();
@@ -66,12 +63,18 @@ export class RowSummaryService {
             this.throttledEvaluateRowSummary();
         });
     }
+    _throttleAcumulatedColumnsThatChanged = new Set();
     throttledEvaluateRowSummary(reason) {
         if (reason) {
             reason.columnIds.forEach((col) => this._throttleAcumulatedColumnsThatChanged.add(col));
         }
         this._throttledEvaluateRowSummary(reason);
     }
+    /**
+     *
+     * @param colId optional to evaluate only one column
+     */
+    _throttledEvaluateRowSummary = throttle(this.evaluateRowSummary, 300);
     evaluateRowSummary(reason) {
         if (this._throttleAcumulatedColumnsThatChanged.size > 0) {
             const columnIds = Array.from(this._throttleAcumulatedColumnsThatChanged.values());

package/src/Utilities/Services/TeamSharingService.js

@@ -1,9 +1,11 @@
 import { createUuid } from '../../AdaptableState/Uuid';
 import ObjectFactory from '../ObjectFactory';
 export class TeamSharingService {
+    adaptableApi;
+    dismissedNotifications = [];
+    updateCheckTimerId;
     constructor(adaptableApi) {
         this.adaptableApi = adaptableApi;
-        this.dismissedNotifications = [];
         const teamSharingOptions = adaptableApi.optionsApi.getTeamSharingOptions();
         if (teamSharingOptions.updateInterval > 0) {
             // convert minutes to millis

package/src/Utilities/Services/ThemeService.js

@@ -1,14 +1,8 @@
 export class ThemeService {
+    api;
+    unsubscribe = () => { };
+    styleSheetObject;
     constructor(api) {
-        this.unsubscribe = () => { };
-        this.onThemeChanged = () => {
-            let currentTheme = this.api.themeApi.getCurrentThemeObject();
-            currentTheme = this.mapOsTheme(currentTheme);
-            this.applyNewThemeVariables(currentTheme);
-            // this needs to be called after variables are set
-            // as it may show the warning for a custom/runtime theme
-            this.showMissingThemeFiles(currentTheme);
-        };
         this.api = api;
         this.subscribe();
         if (!this.styleSheetObject) {
@@ -33,6 +27,14 @@ export class ThemeService {
             prefferedColorSchemeUnsubscribe();
         };
     }
+    onThemeChanged = () => {
+        let currentTheme = this.api.themeApi.getCurrentThemeObject();
+        currentTheme = this.mapOsTheme(currentTheme);
+        this.applyNewThemeVariables(currentTheme);
+        // this needs to be called after variables are set
+        // as it may show the warning for a custom/runtime theme
+        this.showMissingThemeFiles(currentTheme);
+    };
     applyNewThemeVariables(theme) {
         const variables = theme.CSSVariables;
         if (!variables || Object.keys(variables).length === 0) {

package/src/Utilities/Services/ValidationService.js

@@ -4,6 +4,7 @@ import { AlertModuleId } from '../Constants/ModuleConstants';
 import { SERVER_VALIDATION_HEADER, SERVER_VALIDATION_MESSAGE_TYPE, } from '../Constants/GeneralConstants';
 import { errorOnce } from '../../agGrid/AdaptableLogger';
 export class ValidationService {
+    adaptableApi;
     constructor(adaptableApi) {
         this.adaptableApi = adaptableApi;
         this.adaptableApi = adaptableApi;

package/src/Utilities/createAgStatusPanelComponent.js

@@ -19,6 +19,9 @@ export const createAgStatusPanelComponent = (component, adaptable, context) => {
         };
     }
     return class StatusBarRenderer {
+        params;
+        eGui;
+        unmountReactRoot;
         init(params) {
             this.params = params;
             this.eGui = document.createElement('div');

package/src/View/AdaptablePopover/index.d.ts

@@ -17,6 +17,7 @@ export interface AdaptablePopoverProps extends React.ClassAttributes<React.Props
     popupPadding?: 0 | 2;
     alignPosition?: OverlayShowParams['alignPosition'];
     visible?: boolean;
+    disabled?: boolean;
 }
 export declare class AdaptablePopover extends React.Component<React.PropsWithChildren<AdaptablePopoverProps>, {}> {
     render(): React.JSX.Element;

package/src/View/AdaptablePopover/index.js

@@ -35,7 +35,7 @@ export class AdaptablePopover extends React.Component {
                 // showTriangle
                 visible: this.props.visible, render: () => popoverClickRootClose, showEvent: (this.props.showEvent || 'mouseenter'), hideEvent: (this.props.hideEvent || 'mouseleave'), style: {
                     overflow: 'visible',
-                }, alignPosition: this.props.alignPosition }, useButton ? (React.createElement(ButtonInfo, { style: iconStyle, variant: "text", onClick: () => null, icon: showIcon && icon, tooltip: this.props.tooltipText }, this.props.children)) : (React.createElement("div", { title: this.props.tooltipText, tabIndex: 0, style: { cursor: 'pointer', display: 'inline-block' } },
+                }, alignPosition: this.props.alignPosition }, useButton ? (React.createElement(ButtonInfo, { style: iconStyle, variant: "text", onClick: () => null, icon: showIcon && icon, tooltip: this.props.tooltipText, disabled: this.props.disabled }, this.props.children)) : (React.createElement("div", { title: this.props.tooltipText, tabIndex: 0, style: { cursor: 'pointer', display: 'inline-block' } },
                 this.props.children,
                 showIcon && React.createElement(Icon, { name: icon, style: iconStyle }))))));
     }

package/src/View/Alert/ActiveAlertsPanel.js

@@ -7,5 +7,13 @@ export const ActiveAlertsPanel = () => {
     const adaptable = useAdaptable();
     const filterModule = adaptable.ModuleService.getModuleById(ModuleConstants.AlertModuleId);
     const alerts = useSelector((state) => state.Internal.AdaptableAlerts);
+    // map the suspended property from the underlying AlertDefinitions
+    alerts.forEach((alert) => {
+        const liveAlertDef = adaptable.api.alertApi.getAlertDefinitionById(alert.alertDefinition.Uuid);
+        if (liveAlertDef) {
+            // @ts-ignore theoretically AdaptableAlert is not Suspendable; practically <AdaptableObjectCompactList> expects it
+            alert.IsSuspended = liveAlertDef.IsSuspended;
+        }
+    });
     return React.createElement(AdaptableObjectCompactList, { abObjects: alerts, module: filterModule });
 };

package/src/View/Alert/AlertViewPanel.js

@@ -2,10 +2,11 @@ import * as React from 'react';
 import { connect } from 'react-redux';
 import * as InternalRedux from '../../Redux/ActionsReducers/InternalRedux';
 import { AdaptablePopover } from '../AdaptablePopover';
-import UIHelper from '../UIHelper';
 import { getAlertButtonStyle } from './Utilities/getAlertButtonStyle';
 import { ActiveAlertsPanel } from './ActiveAlertsPanel';
 import { Flex } from '../../components/Flex';
+import { ButtonClear } from '../Components/Buttons/ButtonClear';
+import clsx from 'clsx';
 class AlertViewPanelComponent extends React.Component {
     constructor(props) {
         super(props);
@@ -20,7 +21,6 @@ class AlertViewPanelComponent extends React.Component {
         }
     }
     render() {
-        const messageType = UIHelper.getMessageTypeFromAdaptableAlerts(this.props.AdaptableAlerts);
         const { color: buttonTextColor, background: buttonBackground } = getAlertButtonStyle(this.props.AdaptableAlerts);
         const collapsedText = this.props.AdaptableAlerts.length == 0
             ? '0 Alerts'
@@ -28,13 +28,17 @@ class AlertViewPanelComponent extends React.Component {
                 ? '1 Alert'
                 : this.props.AdaptableAlerts.length + ' Alerts';
         const alertsPanel = React.createElement(ActiveAlertsPanel, null);
-        const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
-        return (React.createElement(Flex, { alignItems: "stretch", className: `ab-${elementType}__Alert__wrap` },
-            React.createElement(Flex, { className: `ab-${elementType}__Alert__text twa:rounded-standard twa:mr-2 twa:p-2 text-2`, style: { color: buttonTextColor, backgroundColor: buttonBackground }, alignItems: "center" }, collapsedText),
-            this.props.AdaptableAlerts.length > 0 && (React.createElement(Flex, { alignItems: "center" },
-                React.createElement(AdaptablePopover, { className: `ab-${elementType}__Alert__info`, headerText: "", 
-                    // tooltipText="Alerts"
-                    bodyText: [alertsPanel], MessageType: messageType, useButton: true, showEvent: 'focus', hideEvent: "blur", popoverMinWidth: 400 })))));
+        const isToolbar = this.props.viewType === 'Toolbar';
+        const elementType = isToolbar ? 'DashboardToolbar' : 'ToolPanel';
+        return (React.createElement(Flex, { alignItems: "stretch", className: clsx(`ab-${elementType}__Alert__wrap twa:gap-1`, {
+                'twa:min-w-[140px] twa:w-[140px]': isToolbar,
+                [`twa:flex-1`]: !isToolbar,
+            }) },
+            React.createElement(Flex, { key: `${buttonTextColor}_${buttonBackground}_${collapsedText}`, className: `ab-${elementType}__Alert__text twa:flex-1 twa:rounded-standard twa:p-2 text-2 twa:items-center twa:justify-center twa:min-h-input`, style: { color: buttonTextColor, backgroundColor: buttonBackground } }, collapsedText),
+            this.props.AdaptableAlerts.length > 0 && (React.createElement(Flex, { className: 'twa:gap-1' },
+                React.createElement(Flex, { className: "twa:flex twa:box-border" },
+                    React.createElement(ButtonClear, { "aria-label": 'Clear All Alerts', variant: 'outlined', className: `ab-${elementType}__Alert__clear`, onClick: () => this.props.onDeleteAllAlert(this.state.Alerts), tooltip: "Clear All Alerts", showText: this.props.viewType === 'ToolPanel' }, 'Clear Alerts')),
+                React.createElement(AdaptablePopover, { className: `ab-${elementType}__Alert__info`, headerText: "Alerts Details", bodyText: [alertsPanel], MessageType: 'Info', useButton: true, showEvent: 'focus', hideEvent: "blur", popoverMinWidth: 400 })))));
     }
 }
 function mapStateToProps(state, ownProps) {

package/src/View/Alert/Utilities/getAlertButtonStyle.d.ts

@@ -2,4 +2,5 @@ import { AdaptableAlert } from '../../../../types';
 export declare const getAlertButtonStyle: (alerts: AdaptableAlert[]) => {
     color: string;
     background: string;
+    cssClasses: string;
 };

package/src/View/Alert/Utilities/getAlertButtonStyle.js

@@ -4,8 +4,16 @@ export const getAlertButtonStyle = (alerts) => {
     const messageTypeColor = UIHelper.getColorByMessageType(messageType);
     const buttonBackground = UIHelper.getButtonColourForAdaptableAlerts(alerts, messageTypeColor);
     const buttonTextColor = UIHelper.getButtonTextColourForArrayandMessageType(alerts, messageType);
+    let cssClasses = '';
+    if (alerts?.length) {
+        const cssMessageType = UIHelper.getCSSColorByMessageType(messageType);
+        cssClasses = cssMessageType
+            ? `twa:bg-${cssMessageType} twa:text-text-on-${cssMessageType}`
+            : '';
+    }
     return {
         color: buttonTextColor,
         background: buttonBackground,
+        cssClasses,
     };
 };

package/src/View/BulkUpdate/BulkUpdateViewPanel.js

@@ -13,6 +13,7 @@ import { connect } from 'react-redux';
 import { Flex } from '../../components/Flex';
 import clsx from 'clsx';
 class BulkUpdateViewPanelComponent extends React.Component {
+    cleanupEvent;
     constructor(props) {
         super(props);
         this.state = {
@@ -37,24 +38,36 @@ class BulkUpdateViewPanelComponent extends React.Component {
         let statusColour = this.getStatusColour();
         let selectedColumn = this.props.BulkUpdateValidationResult.Column;
         let previewPanel = (React.createElement(PreviewResultsPanel, { previewInfo: this.props.PreviewInfo, api: this.props.api, selectedColumn: selectedColumn, showPanel: true, showHeader: false }));
-        let shouldDisable = this.props.accessLevel == 'ReadOnly' ||
+        const valueSelectorDisabled = this.props.accessLevel == 'ReadOnly' ||
             !this.props.BulkUpdateValidationResult.IsValid ||
-            this.props.api.layoutApi.isCurrentLayoutPivot() == true;
+            this.props.api.layoutApi.isCurrentLayoutPivot();
+        const valueOperationDisabled = valueSelectorDisabled ||
+            StringExtensions.IsNullOrEmpty(this.props.BulkUpdateValue) ||
+            (this.props.PreviewInfo != null &&
+                this.props.PreviewInfo.previewValidationSummary.validationResult == 'All');
         const applyStyle = {
             color: statusColour,
             fill: 'currentColor',
         };
-        const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
-        return (React.createElement(Flex, { flexDirection: "row", className: clsx(shouldDisable ? GeneralConstants.READ_ONLY_STYLE : '', `ab-${elementType}__BulkUpdate__wrap twa:min-w-[150px]`), flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
-            React.createElement(Flex, null,
+        const isToolbar = this.props.viewType === 'Toolbar';
+        const elementType = isToolbar ? 'DashboardToolbar' : 'ToolPanel';
+        const messageStyle = UIHelper.getMessageTypeByStatusColour(statusColour);
+        const infoStyle = messageStyle === 'Success' ? 'Info' : messageStyle;
+        return (React.createElement(Flex, { className: clsx(valueSelectorDisabled ? GeneralConstants.READ_ONLY_STYLE : '', `ab-${elementType}__BulkUpdate__wrap twa:gap-1 twa:flex-row`, {
+                'twa:min-w-[300px] twa:max-w-[300px] twa:w-[300px] twa:flex-nowrap': isToolbar,
+                'twa:flex-1 twa:flex-wrap': !isToolbar,
+            }), flexWrap: isToolbar ? 'nowrap' : 'wrap' },
+            React.createElement(Flex, { className: clsx('twa:flex-1', {
+                    'twa:min-w-[100px]': !isToolbar,
+                    'twa:min-w-0': isToolbar,
+                }) },
                 React.createElement(BulkUpdateValueSelector, { selectedGridCells: this.props.SelectedGridCells, newLabel: "New", existingLabel: "Existing", dropdownButtonProps: {
                         listMinWidth: 160,
-                    }, className: `ab-${elementType}__BulkUpdate__select`, disabled: shouldDisable, selectedColumnValue: this.props.BulkUpdateValue, selectedColumn: selectedColumn, api: this.props.api, onColumnValueChange: (columns) => this.onColumnValueSelectedChanged(columns) })),
-            React.createElement(Flex, null,
-                !shouldDisable && StringExtensions.IsNotNullOrEmpty(this.props.BulkUpdateValue) && (React.createElement(ButtonApply, { className: `ab-${elementType}__BulkUpdate__apply twa:ml-2`, onClick: () => this.onApplyClick(), style: applyStyle, tooltip: "Apply Bulk Update", disabled: StringExtensions.IsNullOrEmpty(this.props.BulkUpdateValue) ||
-                        (this.props.PreviewInfo != null &&
-                            this.props.PreviewInfo.previewValidationSummary.validationResult == 'All'), accessLevel: this.props.accessLevel }, this.props.viewType === 'ToolPanel' && 'Update')),
-                !shouldDisable && StringExtensions.IsNotNullOrEmpty(this.props.BulkUpdateValue) && (React.createElement(AdaptablePopover, { popoverMinWidth: 360, className: `ab-${elementType}__BulkUpdate__info`, headerText: "Preview Results", bodyText: [previewPanel], MessageType: UIHelper.getMessageTypeByStatusColour(statusColour), useButton: true, showEvent: 'focus', hideEvent: "blur" })))));
+                    }, className: `ab-${elementType}__BulkUpdate__select twa:w-full`, disabled: valueSelectorDisabled, selectedColumnValue: this.props.BulkUpdateValue, selectedColumn: selectedColumn, api: this.props.api, onColumnValueChange: (columns) => this.onColumnValueSelectedChanged(columns) })),
+            React.createElement(Flex, { className: "twa:flex-shrink-0 twa:gap-1" },
+                React.createElement(Flex, { className: "twa:flex twa:box-border twa:items-center" },
+                    React.createElement(ButtonApply, { className: `ab-${elementType}__BulkUpdate__apply twa:h-full`, onClick: () => this.onApplyClick(), style: applyStyle, tooltip: "Apply Bulk Update", disabled: valueOperationDisabled, accessLevel: this.props.accessLevel }, 'Apply')),
+                React.createElement(AdaptablePopover, { popoverMinWidth: 360, className: `ab-${elementType}__BulkUpdate__info`, headerText: "Preview Results", bodyText: [previewPanel], MessageType: infoStyle, useButton: true, showEvent: 'focus', hideEvent: "blur", disabled: valueSelectorDisabled || StringExtensions.IsNullOrEmpty(this.props.BulkUpdateValue) }))));
     }
     onColumnValueSelectedChanged(selectedColumnValue) {
         this.props.onBulkUpdateValueChange(selectedColumnValue);

package/src/View/CalculatedColumn/CalculatedColumnSummary.js

@@ -9,14 +9,6 @@ import { CalculatedColumnWizard } from './Wizard/CalculatedColumnWizard';
 export class CalculatedColumnSummaryComponent extends React.Component {
     constructor(props) {
         super(props);
-        this.onFinishWizard = (calculatedColumn) => {
-            this.props.onEdit(calculatedColumn);
-            this.setState({
-                editedAdaptableObject: null,
-                wizardStartIndex: 0,
-                wizardStatus: WizardStatus.None,
-            });
-        };
         this.state = UIHelper.getEmptyConfigState();
     }
     render() {
@@ -44,6 +36,14 @@ export class CalculatedColumnSummaryComponent extends React.Component {
             wizardStatus: WizardStatus.None,
         });
     }
+    onFinishWizard = (calculatedColumn) => {
+        this.props.onEdit(calculatedColumn);
+        this.setState({
+            editedAdaptableObject: null,
+            wizardStartIndex: 0,
+            wizardStatus: WizardStatus.None,
+        });
+    };
 }
 function mapStateToProps(state) {
     return {

package/src/View/CalculatedColumn/Wizard/CalculatedColumnExpressionWizardSection.js

@@ -17,11 +17,11 @@ export const isValidCalculatedColumnExpression = (data, api) => {
     const calculatedColumnExpressionService = api.internalApi.getCalculatedColumnExpressionService();
     const expression = api.expressionApi.getAdaptableQueryExpression(data.Query)?.trim();
     if (!expression) {
-        return 'Calculated column expression cannot be empty';
+        return 'Calculated Column Expression cannot be empty';
     }
     const isValid = calculatedColumnExpressionService.isCalculatedColumnQueryValid(data.Query);
     if (!isValid) {
-        return 'Calculated column expression is not valid';
+        return 'Calculated Column Expression is not valid';
     }
     return true;
 };

package/src/View/CellSummary/CellSummaryViewPanel.js

@@ -9,7 +9,9 @@ import * as InternalRedux from '../../Redux/ActionsReducers/InternalRedux';
 import { connect } from 'react-redux';
 import { Select } from '../../components/Select';
 import { Flex } from '../../components/Flex';
+import clsx from 'clsx';
 class CellSummaryViewPanelComponent extends React.Component {
+    cleanupEvent;
     constructor(props) {
         super(props);
     }
@@ -43,30 +45,27 @@ class CellSummaryViewPanelComponent extends React.Component {
             });
         let cellSummaryPopover = React.createElement(CellSummaryPopover, { CellSummary: this.props.CellSummary });
         let shouldDisable = this.props.accessLevel == 'ReadOnly' || this.props.CellSummary == null;
-        const renderOperationValue = () => {
-            if (shouldDisable) {
-                return;
-            }
-            const operationValue = this.getOperationValue();
-            if (operationValue == undefined) {
-                return;
-            }
-            return this.props.viewType === 'ToolPanel' ? (React.createElement(Flex, { className: `ab-${elementType}__CellSummary__value twa:rounded-standard twa:mr-2 twa:p-2 twa:text-text-on-info twa:bg-info twa:text-2` }, operationValue)) : (React.createElement(Flex, { justifyContent: "center", className: `ab-${elementType}__CellSummary__value twa:flex-1 twa:mr-2 twa:ml-1 text-text-on-primary` }, operationValue));
-        };
-        const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
-        return (React.createElement(Flex, { flexDirection: "row", className: shouldDisable ? GeneralConstants.READ_ONLY_STYLE : `ab-${elementType}__CellSummary__wrap`, flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
+        const isToolbar = this.props.viewType === 'Toolbar';
+        const elementType = isToolbar ? 'DashboardToolbar' : 'ToolPanel';
+        const operationValue = this.getOperationValue() ?? 'N/A';
+        return (React.createElement(Flex, { className: clsx(shouldDisable ? GeneralConstants.READ_ONLY_STYLE : '', `ab-${elementType}__CellSummary__wrap twa:gap-2 twa:flex-row`, {
+                'twa:min-w-[215px] twa:max-w-[215px] twa:w-[215px] twa:flex-nowrap': isToolbar,
+                'twa:flex-1 twa:flex-wrap': !isToolbar,
+            }) },
             React.createElement(Flex, { className: "twa:flex-1" },
                 React.createElement(Select, { "aria-label": "Cell Summary Operation Selector", className: `ab-${elementType}__CellSummary__select twa:w-full`, disabled: shouldDisable, options: [...operationMenuItems, ...operationDefinitions], onChange: (x) => this.props.onCellSummaryOperationChange(x), value: this.props.CellSummaryOperation })),
-            React.createElement(Flex, { alignItems: "center", className: "twa:ml-2" }, React.createElement(React.Fragment, null,
-                renderOperationValue(),
-                this.props.CellSummary != null && this.props.CellSummary.Count > 0 && (React.createElement(AdaptablePopover, { popoverMaxWidth: 360, className: "ab-ToolPanel__CellSummary__info", bodyText: [cellSummaryPopover], useButton: true, showEvent: 'focus', hideEvent: "blur", tooltipText: 'Show Cell Summaries' }))))));
+            React.createElement(Flex, { className: "twa:items-center twa:gap-1" }, React.createElement(React.Fragment, null,
+                React.createElement(Flex, { className: clsx(`ab-${elementType}__CellSummary__value twa:min-w-[50px]`, {
+                        'twa:rounded-standard twa:text-color-text-on-info twa:bg-color-info twa:text-2': !isToolbar,
+                        'twa:flex-1 twa:text-color-text-on-primary twa:justify-center': isToolbar,
+                    }) }, operationValue),
+                React.createElement(AdaptablePopover, { popoverMaxWidth: 360, className: "ab-ToolPanel__CellSummary__info", bodyText: [cellSummaryPopover], useButton: true, showEvent: 'focus', hideEvent: "blur", tooltipText: 'Show Cell Summaries', disabled: !this.props.CellSummary?.Count })))));
     }
     checkSelectedCells() {
         this.props.onCreateCellSummary();
     }
     getOperationValue() {
-        const api = this.props.api;
-        return api.cellSummaryApi.getCellSummaryOperationValue(this.props.CellSummaryOperation);
+        return this.props.api.cellSummaryApi.getCellSummaryOperationValue(this.props.CellSummaryOperation);
     }
 }
 function mapStateToProps(state, ownProps) {

package/src/View/Components/AdaptableDateInput/index.js

@@ -8,7 +8,7 @@ const AdaptableDateInput = React.forwardRef(function AdaptableDateInputCmp(props
     const { value: _, defaultValue: __, onChange, required, disabled, showClearButton, ...inputProps } = props;
     const [value, setValue] = useProperty(props, 'value', undefined, {
         onChange: (dateString) => 
-        // wrap date value in FormEvent in order to keep the external API unchanged
+        // wrap date value in ChangeEvent in order to keep the external API unchanged
         props.onChange?.({
             target: {
                 // ALWAYS trigger onChange with the ISO format

package/src/View/Components/Buttons/ButtonApply.js

@@ -2,6 +2,6 @@ import * as React from 'react';
 import SimpleButton from '../../../components/SimpleButton';
 export class ButtonApply extends React.Component {
     render() {
-        return (React.createElement(SimpleButton, { "data-name": "apply", tooltip: "Apply", iconSize: 20, icon: "check", variant: "text", ...this.props }));
+        return (React.createElement(SimpleButton, { "data-name": "apply", tooltip: "Apply", iconSize: 20, icon: "check", variant: "outlined", ...this.props }));
     }
 }

package/src/View/Components/Buttons/ButtonBase/index.js

@@ -7,6 +7,15 @@ const Glyphicon = ({ glyph, style }) => {
 };
 const baseClassName = 'ab-Button twa:text-current';
 export class ButtonBase extends React.Component {
+    static defaultProps = {
+        overrideDisableButton: false,
+        toolTipAndText: '',
+        glyph: '',
+        displayMode: 'Glyph+Text',
+        transformGlyph: false,
+        accessLevel: 'Full',
+        showDefaultStyle: false,
+    };
     render() {
         let isDisabled;
         isDisabled = this.props.accessLevel == 'Hidden';
@@ -59,12 +68,3 @@ export class ButtonBase extends React.Component {
         return hideToolTip ? button : buttonwithtooltip;
     }
 }
-ButtonBase.defaultProps = {
-    overrideDisableButton: false,
-    toolTipAndText: '',
-    glyph: '',
-    displayMode: 'Glyph+Text',
-    transformGlyph: false,
-    accessLevel: 'Full',
-    showDefaultStyle: false,
-};

package/src/View/Components/Buttons/ButtonClear.d.ts

@@ -3,6 +3,7 @@ import { SimpleButtonProps } from '../../../components/SimpleButton';
 export interface ClearButtonProps extends SimpleButtonProps {
     showText?: boolean;
     showIcon?: boolean;
+    variant?: SimpleButtonProps['variant'];
 }
 export declare class ButtonClear extends React.Component<ClearButtonProps, {}> {
     render(): React.JSX.Element;