@adaptabletools/adaptable-cjs 18.0.0-canary.4 → 18.0.0-canary.5

package/src/components/Datepicker/index.d.ts

@@ -15,4 +15,4 @@ export type DatepickerProps = Omit<BoxProps, 'value' | 'onChange' | 'defaultValu
     showWeekNumber?: boolean;
     showOutsideDays?: boolean;
 };
-export declare const Datepicker: React.ForwardRefExoticComponent<Pick<DatepickerProps, "children" | "size" | "name" | "tabIndex" | "color" | "style" | "cite" | "data" | "form" | "label" | "p" | "slot" | "span" | "summary" | "title" | "pattern" | "start" | "hidden" | "content" | "default" | "flex" | "wrap" | "open" | "padding" | "multiple" | "disabled" | "checked" | "download" | "list" | "order" | "target" | "src" | "className" | "onTransitionEnd" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEndCapture" | "opacity" | "value" | "key" | "sizes" | "variant" | "tx" | "as" | "css" | "m" | "margin" | "mt" | "marginTop" | "mr" | "marginRight" | "mb" | "marginBottom" | "ml" | "marginLeft" | "mx" | "marginX" | "my" | "marginY" | "pt" | "paddingTop" | "pr" | "paddingRight" | "pb" | "paddingBottom" | "pl" | "paddingLeft" | "px" | "paddingX" | "py" | "paddingY" | "width" | "height" | "minWidth" | "minHeight" | "maxWidth" | "maxHeight" | "display" | "verticalAlign" | "overflow" | "overflowX" | "overflowY" | "fontFamily" | "fontSize" | "fontWeight" | "lineHeight" | "letterSpacing" | "fontStyle" | "textAlign" | "bg" | "backgroundColor" | "alignItems" | "alignContent" | "justifyItems" | "justifyContent" | "flexWrap" | "flexDirection" | "flexGrow" | "flexShrink" | "flexBasis" | "justifySelf" | "alignSelf" | "sx" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "async" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "muted" | "nonce" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "srcDoc" | "srcLang" | "srcSet" | "step" | "type" | "useMap" | "wmode" | "onHide" | "showClearButton" | "datepickerButtons" | "dateProps" | "showWeekNumber" | "showOutsideDays"> & React.RefAttributes<HTMLInputElement>>;
+export declare const Datepicker: React.ForwardRefExoticComponent<Pick<DatepickerProps, "children" | "size" | "name" | "tabIndex" | "color" | "style" | "cite" | "data" | "form" | "label" | "p" | "slot" | "span" | "summary" | "title" | "pattern" | "start" | "hidden" | "content" | "default" | "flex" | "wrap" | "open" | "padding" | "multiple" | "disabled" | "checked" | "download" | "list" | "order" | "target" | "src" | "className" | "onTransitionEnd" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEndCapture" | "opacity" | "value" | "key" | "sizes" | "variant" | "tx" | "as" | "css" | "m" | "margin" | "mt" | "marginTop" | "mr" | "marginRight" | "mb" | "marginBottom" | "ml" | "marginLeft" | "mx" | "marginX" | "my" | "marginY" | "pt" | "paddingTop" | "pr" | "paddingRight" | "pb" | "paddingBottom" | "pl" | "paddingLeft" | "px" | "paddingX" | "py" | "paddingY" | "width" | "height" | "minWidth" | "minHeight" | "maxWidth" | "maxHeight" | "display" | "verticalAlign" | "overflow" | "overflowX" | "overflowY" | "fontFamily" | "fontSize" | "fontWeight" | "lineHeight" | "letterSpacing" | "fontStyle" | "textAlign" | "bg" | "backgroundColor" | "alignItems" | "alignContent" | "justifyItems" | "justifyContent" | "flexWrap" | "flexDirection" | "flexGrow" | "flexShrink" | "flexBasis" | "justifySelf" | "alignSelf" | "sx" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "async" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "muted" | "nonce" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "srcDoc" | "srcLang" | "srcSet" | "step" | "type" | "useMap" | "wmode" | "showClearButton" | "onHide" | "datepickerButtons" | "dateProps" | "showWeekNumber" | "showOutsideDays"> & React.RefAttributes<HTMLInputElement>>;

package/src/components/InfiniteTable/index.js

@@ -5,9 +5,9 @@ const tslib_1 = require("tslib");
 const infinite_react_1 = require("@infinite-table/infinite-react");
 Object.defineProperty(exports, "InfiniteTable", { enumerable: true, get: function () { return infinite_react_1.InfiniteTable; } });
 tslib_1.__exportStar(require("@infinite-table/infinite-react"), exports);
-const env_1 = tslib_1.__importDefault(require("../../env"));
+const EnvVars_1 = require("../../EnvVars");
 const defaultProps = infinite_react_1.InfiniteTable.defaultProps;
-defaultProps.licenseKey = env_1.default.INFINITE_TABLE_LICENSE_KEY;
+defaultProps.licenseKey = EnvVars_1.INFINITE_TABLE_LICENSE_KEY;
 defaultProps.sortable = false;
 defaultProps.rowHeight = '--ab-grid-row-height';
 defaultProps.draggableColumns = false;

package/src/components/Modal/index.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { FlexProps } from 'rebass';
+export declare const ensurePortalElement: () => HTMLElement;
 export interface ModalProps extends FlexProps {
     isOpen?: boolean;
     baseZIndex?: number;

package/src/components/Modal/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Modal = void 0;
+exports.Modal = exports.ensurePortalElement = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const react_dom_1 = require("react-dom");
@@ -14,17 +14,19 @@ const UIHelper_1 = require("../../View/UIHelper");
 let portalElement;
 const ensurePortalElement = () => {
     if (!(0, UIHelper_1.isBrowserDocumentAvailable)()) {
-        return;
+        return null;
     }
     if (portalElement) {
-        return;
+        return portalElement;
     }
     portalElement = document.createElement('div');
     document.body.appendChild(portalElement);
+    return portalElement;
 };
+exports.ensurePortalElement = ensurePortalElement;
 let globalCounter = 0;
 const Modal = (props) => {
-    ensurePortalElement();
+    (0, exports.ensurePortalElement)();
     const { className, style, children, isOpen, onBringToFront } = props, boxProps = tslib_1.__rest(props, ["className", "style", "children", "isOpen", "onBringToFront"]);
     const uuid = (0, react_1.useMemo)(() => (0, uuid_1.createUuid)(), []);
     const counter = (0, react_1.useMemo)(() => globalCounter++, [isOpen]);

package/src/env.js

@@ -2,6 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.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: 1710512556255 || Date.now(),
-    VERSION: "18.0.0-canary.4" || '--current-version--',
+    PUBLISH_TIMESTAMP: 1710513543012 || Date.now(),
+    VERSION: "18.0.0-canary.5" || '--current-version--',
 };

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

@@ -681,6 +681,15 @@ export declare const ADAPTABLE_METAMODEL: {
             noCode: string;
             defVal?: undefined;
             ref?: undefined;
+        } | {
+            name: string;
+            kind: string;
+            desc: string;
+            isOpt: boolean;
+            defVal: string;
+            gridInfo?: undefined;
+            noCode?: undefined;
+            ref?: undefined;
         } | {
             name: string;
             kind: string;
@@ -735,15 +744,6 @@ export declare const ADAPTABLE_METAMODEL: {
             gridInfo?: undefined;
             defVal?: undefined;
             ref?: undefined;
-        } | {
-            name: string;
-            kind: string;
-            desc: string;
-            isOpt: boolean;
-            defVal: string;
-            gridInfo?: undefined;
-            noCode?: undefined;
-            ref?: undefined;
         } | {
             name: string;
             kind: string;

package/src/metamodel/adaptable.metamodel.js

@@ -1191,6 +1191,13 @@ exports.ADAPTABLE_METAMODEL = {
                 "gridInfo": "item",
                 "defVal": "false"
             },
+            {
+                "name": "autoMigrateState",
+                "kind": "b",
+                "desc": "Automatically migrate the state from the previous version of Adaptable to the current version.",
+                "isOpt": true,
+                "defVal": "true"
+            },
             {
                 "name": "calendarOptions",
                 "kind": "R",

package/src/migration/AdaptableUpgradeHelper.d.ts

@@ -0,0 +1,38 @@
+import { VersionUpgrade } from './VersionUpgrade';
+import { AdaptableState } from '../PredefinedConfig/AdaptableState';
+/**
+ * The upgrade config object
+ */
+export interface UpgradeConfig {
+    /**
+     * The version to upgrade from
+     */
+    fromVersion: number;
+    /**
+     * The version to upgrade to
+     *
+     * @defaultValue The current version
+     */
+    toVersion?: number;
+    /**
+     * The logger object
+     *
+     * @defaultValue The console object
+     */
+    logger?: MigrationLogger;
+}
+export interface MigrationLogger {
+    success: (message: string, ...optionalParams: any[]) => void;
+    info: (message: string, ...optionalParams: any[]) => void;
+    warn: (message: string, ...optionalParams: any[]) => void;
+    error: (message: string, ...optionalParams: any[]) => void;
+}
+export declare class AdaptableUpgradeHelper {
+    protected currentMajorVersion: number;
+    protected versionUpgrades: Map<number, VersionUpgrade>;
+    protected logger: MigrationLogger;
+    private constructor();
+    static migrateAdaptableState(state: AdaptableState, config: UpgradeConfig): AdaptableState;
+    private getCurrentMajorVersion;
+    private getConsoleLogger;
+}

package/src/migration/AdaptableUpgradeHelper.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptableUpgradeHelper = void 0;
+const VersionUpgrade17_1 = require("./VersionUpgrade17");
+const VersionUpgrade18_1 = require("./VersionUpgrade18");
+const EnvVars_1 = require("../EnvVars");
+class AdaptableUpgradeHelper {
+    constructor(logger) {
+        this.currentMajorVersion = this.getCurrentMajorVersion(EnvVars_1.ADAPTABLE_VERSION);
+        this.logger = logger || this.getConsoleLogger();
+        this.versionUpgrades = new Map();
+        this.versionUpgrades.set(17, new VersionUpgrade17_1.VersionUpgrade17(this.logger));
+        this.versionUpgrades.set(18, new VersionUpgrade18_1.VersionUpgrade18(this.logger));
+    }
+    static migrateAdaptableState(state, config) {
+        const upgradeHelper = new AdaptableUpgradeHelper(config.logger);
+        let fromVersion = (config === null || config === void 0 ? void 0 : config.fromVersion) || 16;
+        const toVersion = (config === null || config === void 0 ? void 0 : config.toVersion) || upgradeHelper.currentMajorVersion;
+        if (fromVersion >= toVersion) {
+            console.warn(`The fromVersion (${fromVersion}) should be less than toVersion (${toVersion})!`);
+            return state;
+        }
+        if (fromVersion < 16) {
+            // until version 16 we didn't have versioning
+            fromVersion = 16;
+        }
+        const versionUpgrades = Array.from(upgradeHelper.versionUpgrades.keys());
+        let updatedState = structuredClone(state);
+        for (const version of versionUpgrades) {
+            if (version > fromVersion && version <= toVersion) {
+                upgradeHelper.logger.info(`Migration to ${version} started...`);
+                updatedState = upgradeHelper.versionUpgrades.get(version).migrateState(updatedState);
+                upgradeHelper.logger.info(`Migration to ${version} finished!`);
+            }
+        }
+        return updatedState;
+    }
+    getCurrentMajorVersion(version) {
+        // is good enough for now, we just need to make sure we don't forget to update it
+        // TODO AFL is there a better way to do this for local development?
+        return parseInt(version.split('.')[0]) || 18;
+    }
+    getConsoleLogger() {
+        return {
+            success: console.log,
+            info: console.info,
+            warn: console.warn,
+            error: console.error,
+        };
+    }
+}
+exports.AdaptableUpgradeHelper = AdaptableUpgradeHelper;

package/src/migration/VersionUpgrade.d.ts

@@ -0,0 +1,8 @@
+import { AdaptableState } from '../PredefinedConfig/AdaptableState';
+import { MigrationLogger } from './AdaptableUpgradeHelper';
+export declare abstract class VersionUpgrade {
+    protected logger: MigrationLogger;
+    constructor(logger: MigrationLogger);
+    abstract migrateState(state: AdaptableState): AdaptableState;
+    protected migrateStateWithMethods(state: AdaptableState, methods: ((state: AdaptableState) => AdaptableState)[]): AdaptableState;
+}

package/src/migration/VersionUpgrade.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VersionUpgrade = void 0;
+class VersionUpgrade {
+    constructor(logger) {
+        this.logger = logger;
+    }
+    migrateStateWithMethods(state, methods) {
+        for (let method of methods) {
+            state = method.call(this, state);
+        }
+        return state;
+    }
+}
+exports.VersionUpgrade = VersionUpgrade;

package/src/migration/VersionUpgrade17.d.ts

@@ -0,0 +1,18 @@
+import { VersionUpgrade } from './VersionUpgrade';
+import { AdaptableState } from '../PredefinedConfig/AdaptableState';
+export declare class VersionUpgrade17 extends VersionUpgrade {
+    migrateState(state: AdaptableState): AdaptableState;
+    private migrateChartingState;
+    private migrateColumnFilterState;
+    private migrateDashboardState;
+    private migrateFlashinCellState;
+    private migrateFormatColumnState;
+    private migrateFreeTextColumnState;
+    private migrateGridFilterState;
+    private migrateNamedQueryState;
+    private migrateStyledColumnState;
+    private migrateToolPanelState;
+    private migrateAlertState;
+    private migrateCalculatedColumnState;
+    private migrateUserState;
+}

package/src/migration/VersionUpgrade17.js

@@ -0,0 +1,347 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VersionUpgrade17 = void 0;
+const tslib_1 = require("tslib");
+const VersionUpgrade_1 = require("./VersionUpgrade");
+const updateSingleToMultiplePredicates_1 = require("../Strategy/Utilities/updateSingleToMultiplePredicates");
+const ArrayExtensions_1 = tslib_1.__importDefault(require("../Utilities/Extensions/ArrayExtensions"));
+const ObjectFactory_1 = tslib_1.__importDefault(require("../Utilities/ObjectFactory"));
+const StringExtensions_1 = tslib_1.__importDefault(require("../Utilities/Extensions/StringExtensions"));
+class VersionUpgrade17 extends VersionUpgrade_1.VersionUpgrade {
+    migrateState(state) {
+        return this.migrateStateWithMethods(state, [
+            this.migrateCalculatedColumnState,
+            this.migrateAlertState,
+            this.migrateToolPanelState,
+            this.migrateStyledColumnState,
+            this.migrateNamedQueryState,
+            this.migrateGridFilterState,
+            this.migrateFreeTextColumnState,
+            this.migrateFormatColumnState,
+            this.migrateFlashinCellState,
+            this.migrateDashboardState,
+            this.migrateColumnFilterState,
+            this.migrateChartingState,
+        ]);
+    }
+    migrateChartingState(state) {
+        var _a;
+        // const allChartDefinitions = this.api.chartingApi.getChartDefinitions();
+        const allChartDefinitions = (_a = state.Charting) === null || _a === void 0 ? void 0 : _a.ChartDefinitions;
+        if (Array.isArray(allChartDefinitions)) {
+            allChartDefinitions
+                .filter((chartDefinition) => 'model' in chartDefinition || !('Name' in chartDefinition))
+                .forEach((charDefinition) => {
+                if ('model' in charDefinition) {
+                    charDefinition.Model = charDefinition.model;
+                    delete charDefinition.model;
+                }
+                if (!('Name' in charDefinition)) {
+                    // default to chartId
+                    // @ts-ignore possible because First iteration had no 'Name' and model was under 'model' key (lowercase)
+                    charDefinition.Name = charDefinition.Model.chartId;
+                }
+            });
+        }
+        return state;
+    }
+    migrateColumnFilterState(state) {
+        var _a, _b, _c, _d, _e;
+        // Update Module Buttons
+        const moduleButtons = (_a = state.Dashboard) === null || _a === void 0 ? void 0 : _a.ModuleButtons;
+        if ((moduleButtons === null || moduleButtons === void 0 ? void 0 : moduleButtons.length) && !moduleButtons.includes('ColumnFilter')) {
+            const dashboardState = (_b = state.Dashboard) !== null && _b !== void 0 ? _b : {};
+            dashboardState.ModuleButtons = moduleButtons.map((moduleButton) => {
+                if (moduleButton == 'Filter') {
+                    return 'ColumnFilter';
+                }
+                return moduleButton;
+            });
+        }
+        // Update Toolbars
+        const tabs = (_c = state.Dashboard) === null || _c === void 0 ? void 0 : _c.Tabs;
+        if (Array.isArray(tabs)) {
+            state.Dashboard.Tabs = tabs.map((tab) => {
+                if (tab.Toolbars.includes('Filter') &&
+                    !tab.Toolbars.includes('ColumnFilter')) {
+                    return Object.assign(Object.assign({}, tab), { 
+                        // replace with 'GridFilter'
+                        Toolbars: tab.Toolbars.map((t) => (t == 'Filter' ? 'ColumnFilter' : t)) });
+                }
+                return tab;
+            });
+        }
+        // - move pinned toolbars
+        const pinnedToolbars = (_d = state.Dashboard) === null || _d === void 0 ? void 0 : _d.PinnedToolbars;
+        if (pinnedToolbars && !(pinnedToolbars === null || pinnedToolbars === void 0 ? void 0 : pinnedToolbars.includes('ColumnFilter'))) {
+            state.Dashboard.PinnedToolbars = pinnedToolbars.map((pinnedToolbar) => {
+                if (pinnedToolbar == 'Filter') {
+                    return 'ColumnFilter';
+                }
+                return pinnedToolbar;
+            });
+        }
+        // Update Status Bar
+        const statusBars = (_e = state.StatusBar) === null || _e === void 0 ? void 0 : _e.StatusBars;
+        if (statusBars) {
+            state.StatusBar.StatusBars = statusBars.map((panel) => {
+                return Object.assign(Object.assign({}, panel), { StatusBarPanels: panel.StatusBarPanels.map((panel) => {
+                        if (panel === 'Filter') {
+                            return 'ColumnFilter';
+                        }
+                        return panel;
+                    }) });
+            });
+        }
+        return state;
+    }
+    migrateDashboardState(state) {
+        // let dashboardState: any = this.api.dashboardApi.getDashboardState();
+        let dashboardState = state.Dashboard;
+        if (dashboardState === null || dashboardState === void 0 ? void 0 : dashboardState.VisibleButtons) {
+            this.logger.warn(`Updating Obsolete VisibleButtons Config for DashboardState: [${dashboardState.VisibleButtons}]`);
+            state.Dashboard.ModuleButtons = [
+                ...state.Dashboard.ModuleButtons,
+                ...dashboardState.VisibleButtons,
+            ];
+            //@ts-ignore delete as no longer needed
+            delete state.Dashboard.VisibleButtons;
+        }
+        return state;
+    }
+    migrateFlashinCellState(state) {
+        const flashingCellState = state.FlashingCell;
+        if (Array.isArray(flashingCellState === null || flashingCellState === void 0 ? void 0 : flashingCellState.FlashingCellDefinitions)) {
+            flashingCellState.FlashingCellDefinitions.forEach((flashingCellDefinition) => {
+                if (flashingCellDefinition.Rule && 'Predicate' in flashingCellDefinition.Rule) {
+                    (0, updateSingleToMultiplePredicates_1.updateSingleToMultiplePredicates)(flashingCellDefinition.Rule);
+                }
+            });
+        }
+        return state;
+    }
+    migrateFormatColumnState(state) {
+        var _a, _b, _c, _d;
+        // const formatColumns = this.api.formatColumnApi.getFormatColumns();
+        const formatColumns = ((_a = state.FormatColumn) === null || _a === void 0 ? void 0 : _a.FormatColumns) || [];
+        formatColumns.forEach((formatColumn) => {
+            if (formatColumn.Rule && 'Predicate' in formatColumn.Rule) {
+                //@ts-ignore ignore
+                (0, updateSingleToMultiplePredicates_1.updateSingleToMultiplePredicates)(formatColumn.Rule);
+            }
+        });
+        // update ConditionalStyle StatusBarPanel
+        // const oldStatusBars = this.api.internalApi.getState().StatusBar.StatusBars;
+        const statusBars = ((_b = state.StatusBar) === null || _b === void 0 ? void 0 : _b.StatusBars) || [];
+        let replaceConditionalStyleStatusBar = false;
+        statusBars.forEach((statusBar) => (Object.assign(Object.assign({}, statusBar), { StatusBarPanels: [
+                ...new Set(statusBar.StatusBarPanels.map((statusBarPanel) => {
+                    if (statusBarPanel === 'ConditionalStyle') {
+                        replaceConditionalStyleStatusBar = true;
+                        return 'FormatColumn';
+                    }
+                    return statusBarPanel;
+                })),
+            ] })));
+        // update ConditionalStyle dashboard buttons
+        // const dashboardModuleButtons = this.api.internalApi.getState().Dashboard.ModuleButtons as any;
+        const dashboardModuleButtons = (_c = state.Dashboard) === null || _c === void 0 ? void 0 : _c.ModuleButtons;
+        if (dashboardModuleButtons && dashboardModuleButtons.includes('ConditionalStyle')) {
+            dashboardModuleButtons[dashboardModuleButtons.indexOf('ConditionalStyle')] = 'FormatColumn';
+        }
+        // update ConditionalStyle toolPanel buttons
+        // const toolPanelModuleButtons = this.api.internalApi.getState().ToolPanel.ModuleButtons as any;
+        const toolPanelModuleButtons = (_d = state.ToolPanel) === null || _d === void 0 ? void 0 : _d.ModuleButtons;
+        if (toolPanelModuleButtons && toolPanelModuleButtons.includes('ConditionalStyle')) {
+            toolPanelModuleButtons[toolPanelModuleButtons.indexOf('ConditionalStyle')] = 'FormatColumn';
+        }
+        return state;
+    }
+    migrateFreeTextColumnState(state) {
+        var _a;
+        // make sure all default to type string
+        const allFreeTextColumns = ((_a = state.FreeTextColumn) === null || _a === void 0 ? void 0 : _a.FreeTextColumns) || [];
+        for (const freeTextColumn of allFreeTextColumns) {
+            const unTypedCol = freeTextColumn;
+            if (unTypedCol.DataType) {
+                const dataType = unTypedCol.DataType;
+                delete unTypedCol['DataType'];
+                if (!freeTextColumn.FreeTextColumnSettings) {
+                    freeTextColumn.FreeTextColumnSettings = {
+                        DataType: dataType,
+                    };
+                }
+                else {
+                    freeTextColumn.FreeTextColumnSettings.DataType = dataType;
+                }
+            }
+            if (!freeTextColumn.FreeTextColumnSettings) {
+                freeTextColumn.FreeTextColumnSettings = {
+                    DataType: 'String',
+                };
+            }
+            if (!freeTextColumn.FreeTextColumnSettings.DataType) {
+                freeTextColumn.FreeTextColumnSettings.DataType = 'String';
+            }
+        }
+        return state;
+    }
+    migrateGridFilterState(state) {
+        var _a, _b;
+        const oldQueryState = state.Query;
+        if (!oldQueryState) {
+            return state;
+        }
+        // - move query to current layout
+        const expression = oldQueryState.CurrentQuery;
+        const currentLayout = (_a = state.Layout.Layouts) === null || _a === void 0 ? void 0 : _a.find((l) => l.Name === state.Layout.CurrentLayout);
+        const currentGridFilter = currentLayout === null || currentLayout === void 0 ? void 0 : currentLayout.GridFilter;
+        const currentGridFilterExpression = currentGridFilter && !currentGridFilter.IsSuspended ? currentGridFilter.Expression || '' : '';
+        if (expression && StringExtensions_1.default.IsNullOrEmpty(currentGridFilterExpression)) {
+            currentLayout.GridFilter = Object.assign(Object.assign({}, currentGridFilter), { Expression: expression });
+        }
+        // - move dashboard/toolbar
+        (_b = state.Dashboard.Tabs) === null || _b === void 0 ? void 0 : _b.forEach((tab) => {
+            if (tab.Toolbars.includes('Query')) {
+                tab.Toolbars = tab.Toolbars.map((t) => (t == 'Query' ? 'GridFilter' : t));
+            }
+        });
+        // - move pinned toolbars
+        let updatePinnedToolbars = false;
+        if (state.Dashboard.PinnedToolbars) {
+            state.Dashboard.PinnedToolbars = state.Dashboard.PinnedToolbars.map((pinnedToolbar) => {
+                if (pinnedToolbar == 'Query') {
+                    return 'GridFilter';
+                }
+                return pinnedToolbar;
+            });
+        }
+        return state;
+    }
+    migrateNamedQueryState(state) {
+        // - move named queries from old Query State to this Module
+        // Note: GridFilter Module moves the "old" CurrentQuery into Layout
+        // const oldQueryState: QueryState = this.api.internalApi.getAdaptableState().Query;
+        const oldQueryState = state.Query;
+        const oldNamedQueries = oldQueryState === null || oldQueryState === void 0 ? void 0 : oldQueryState.NamedQueries;
+        if (ArrayExtensions_1.default.IsNotNullOrEmpty(oldNamedQueries)) {
+            const currentNamedQueries = state.NamedQuery.NamedQueries;
+            oldNamedQueries.forEach((oldNamedQuery) => {
+                var _a, _b;
+                const currentQuery = currentNamedQueries.find((q) => q.Name === oldNamedQuery.Name);
+                if (!currentQuery) {
+                    (_b = (_a = state.NamedQuery) === null || _a === void 0 ? void 0 : _a.NamedQueries) === null || _b === void 0 ? void 0 : _b.push(oldNamedQuery);
+                }
+            });
+        }
+        if (oldQueryState) {
+            delete state.Query;
+        }
+        return state;
+    }
+    migrateStyledColumnState(state) {
+        var _a, _b, _c, _d;
+        var _e;
+        const formatColumnsWithColumnStyles = ((_b = (_a = state.FormatColumn) === null || _a === void 0 ? void 0 : _a.FormatColumns) === null || _b === void 0 ? void 0 : _b.filter((fc) => fc.ColumnStyle)) || [];
+        if (!formatColumnsWithColumnStyles.length) {
+            return state;
+        }
+        this.logger.info(`Converting ${formatColumnsWithColumnStyles.length} FormatColumns Styles to Styled Columns`, formatColumnsWithColumnStyles);
+        // delete the format columns with column styles
+        state.FormatColumn.FormatColumns = (_c = state.FormatColumn.FormatColumns) === null || _c === void 0 ? void 0 : _c.filter((fc) => !fc.ColumnStyle);
+        const styledColumns = formatColumnsWithColumnStyles
+            .map((formatColumn) => {
+            if (!('ColumnIds' in formatColumn.Scope)) {
+                return null;
+            }
+            return Object.assign(Object.assign(Object.assign({}, ObjectFactory_1.default.CreateEmptyStyledColumn()), { ColumnId: formatColumn.Scope.ColumnIds[0] }), formatColumn.ColumnStyle);
+        })
+            .filter(Boolean);
+        (_d = (_e = state.StyledColumn).StyledColumns) !== null && _d !== void 0 ? _d : (_e.StyledColumns = []);
+        styledColumns.forEach((styledColumn) => {
+            state.StyledColumn.StyledColumns.push(styledColumn);
+        });
+        return state;
+    }
+    migrateToolPanelState(state) {
+        var _a;
+        // const deprecatedToolPanelConfigs: AdaptableToolPanels | undefined = (
+        //   this.api.toolPanelApi.getToolPanelState() as any
+        // ).VisibleToolPanels;
+        const deprecatedToolPanelConfigs = (_a = state.ToolPanel) === null || _a === void 0 ? void 0 : _a.VisibleToolPanels;
+        if (deprecatedToolPanelConfigs === null || deprecatedToolPanelConfigs === void 0 ? void 0 : deprecatedToolPanelConfigs.length) {
+            this.logger.warn(`Updating Obsolete VisibleToolPanels Config for ToolPanelState: [${deprecatedToolPanelConfigs}]`);
+            const migratedToolPanelConfigs = deprecatedToolPanelConfigs.map((toolPanel) => ({
+                Name: toolPanel,
+                State: 'collapsed',
+            }));
+            state.ToolPanel.ToolPanels = migratedToolPanelConfigs;
+        }
+        return state;
+    }
+    migrateAlertState(state) {
+        var _a, _b, _c, _d, _e;
+        (_b = (_a = state.Alert) === null || _a === void 0 ? void 0 : _a.AlertDefinitions) === null || _b === void 0 ? void 0 : _b.forEach((alertDefinition) => {
+            if (alertDefinition.Rule && 'Predicate' in alertDefinition.Rule) {
+                (0, updateSingleToMultiplePredicates_1.updateSingleToMultiplePredicates)(alertDefinition.Rule);
+            }
+        });
+        const alertState = state.Alert;
+        if (ArrayExtensions_1.default.IsEmpty((_c = state.FlashingCell) === null || _c === void 0 ? void 0 : _c.FlashingCellDefinitions) &&
+            ArrayExtensions_1.default.IsNotNullOrEmpty(alertState === null || alertState === void 0 ? void 0 : alertState.FlashingAlertDefinitions)) {
+            state.FlashingCell.FlashingCellDefinitions = alertState.FlashingAlertDefinitions;
+            //@ts-ignore delete as no longer needed
+            delete state.Alert.FlashingAlertDefinitions;
+        }
+        (_e = (_d = state.Alert) === null || _d === void 0 ? void 0 : _d.AlertDefinitions) === null || _e === void 0 ? void 0 : _e.forEach((alertDefinition) => {
+            // if ShowPopup then change to DisplayNotificate
+            if (alertDefinition.AlertProperties &&
+                alertDefinition.AlertProperties.ShowPopup &&
+                alertDefinition.AlertProperties.ShowPopup == true &&
+                !alertDefinition.AlertProperties.DisplayNotification) {
+                alertDefinition.AlertProperties.DisplayNotification = true;
+                alertDefinition.AlertProperties.ShowPopup = undefined;
+            }
+            // if no rule but a predicate then use that
+            if (!alertDefinition.Rule) {
+                if (alertDefinition.Predicate && alertDefinition.Predicate != undefined) {
+                    const predicate = alertDefinition.Predicate;
+                    alertDefinition.Rule = {
+                        Predicate: predicate,
+                    };
+                    alertDefinition.Predicate = undefined;
+                }
+            }
+            else {
+                //migrate alert definitions with `AggregationExpression` (now `AggregatedBooleanExpression`)
+                const obsoleteAggregationExpression = alertDefinition.Rule['AggregationExpression'];
+                if (obsoleteAggregationExpression) {
+                    alertDefinition.Rule.AggregatedBooleanExpression = obsoleteAggregationExpression;
+                }
+            }
+        });
+        return state;
+    }
+    migrateCalculatedColumnState(state) {
+        var _a, _b;
+        (_b = (_a = state.CalculatedColumn) === null || _a === void 0 ? void 0 : _a.CalculatedColumns) === null || _b === void 0 ? void 0 : _b.forEach((cc) => {
+            if (cc.ColumnExpression && !cc.Query) {
+                cc.Query = {
+                    ScalarExpression: cc.ColumnExpression,
+                };
+                cc.ColumnExpression = undefined;
+            }
+            if (!cc.CalculatedColumnSettings) {
+                cc.CalculatedColumnSettings = {
+                    DataType: 'Number',
+                };
+                this.logger.warn(`Updating incorrect Predefined Config for Calculated Column: ${cc.ColumnId}`);
+            }
+        });
+        return state;
+    }
+    migrateUserState(state) {
+        return state;
+    }
+}
+exports.VersionUpgrade17 = VersionUpgrade17;

package/src/migration/VersionUpgrade18.d.ts

@@ -0,0 +1,5 @@
+import { VersionUpgrade } from './VersionUpgrade';
+import { AdaptableState } from '../PredefinedConfig/AdaptableState';
+export declare class VersionUpgrade18 extends VersionUpgrade {
+    migrateState(state: AdaptableState): AdaptableState;
+}