@adaptabletools/adaptable 13.1.1-canary.0 → 13.1.1

package/src/Utilities/Helpers/FormatHelper.js

@@ -71,7 +71,7 @@ function NumberFormatter(input, options = {}) {
     return s;
 }
 exports.NumberFormatter = NumberFormatter;
-function DateFormatter(input, options) {
+function DateFormatter(input, options, strictFormatting = false) {
     if (input == null || input == undefined || input == 'Invalid Date') {
         return undefined;
     }
@@ -83,6 +83,12 @@ function DateFormatter(input, options) {
         return (0, format_1.default)(input, (options === null || options === void 0 ? void 0 : options.Pattern) || GeneralConstants_1.DEFAULT_DATE_FORMAT_PATTERN);
     }
     catch (error) {
+        if (strictFormatting) {
+            return `Invalid date formatting pattern`;
+        }
+        if (typeof input !== 'string') {
+            return String(input);
+        }
         return input;
     }
 }

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LicenseService=exports.LicenseValidityType=void 0;const e=require("tslib"),a=require("../../../Redux/ActionsReducers/SystemRedux"),s=require("../../../Redux/ActionsReducers/PopupRedux"),t=e.__importDefault(require("../../ObjectFactory")),o=require("../../Helpers/LoggingHelper"),i=e.__importDefault(require("lodash/clamp")),n=require("../../Constants/DocumentationLinkConstants"),r=require("../../license/decode"),c=require("./shouldLogThankYouMessage"),l="sales@adaptabletools.com",d=10,p=864e5;var E;!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"}(E=exports.LicenseValidityType||(exports.LicenseValidityType={}));const _=/(https):\/\/\d+\-\d+\-\d+\-(sandpack\.codesandbox\.io)/g,I=/(https):\/\/\S+(\.csb\.app)/g,O=/(https):\/\/\S+(\.adaptabletools\.com)/g,u="undefined"!=typeof window?window.location.origin:"",h=()=>{const[e,a,s]=Array.from(_.exec(u)||[]);return"https"===a&&"sandpack.codesandbox.io"===s},A=()=>{const[e,a,s]=Array.from(I.exec(u)||[]);return"https"===a&&".csb.app"===s},N=()=>{const[e,a,s]=Array.from(O.exec(u)||[]);return"https"===a&&".adaptabletools.com"===s};class L{constructor(e,a,s){this.adaptable=e,this.adaptable=e;let t=null;if(a)try{t=(0,r.decode)(a)}catch(e){t=e}h()||A()||N()||this.handleLicenseValidation(t,this.getValidityType(t,s))}getValidityType(e,a){if(!e)return E.NO_LICENSE;if(e instanceof Error)return E.INVALID_LICENSE;const s=new Date(a.publishedAt),t=new Date(e.end),o=t<new Date,i=e.trial;let n=null;return n=o?t>s?i?E.NON_PRODUCTION_EXPIRED_IN_SCOPE:E.COMMERCIAL_EXPIRED_IN_SCOPE:i?E.NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE:E.COMMERCIAL_EXPIRED_OUT_OF_SCOPE:i?E.NON_PRODUCTION_VALID:E.COMMERCIAL_VALID,n}handleLicenseValidation(e,a){var s;const t=new Date;t.setHours(0,0,0,0);let d=0;e instanceof Error||!(null==e?void 0:e.end)||(d=Math.floor(((null===(s=null==e?void 0:e.end)||void 0===s?void 0:s.getTime())-t.getTime())/864e5),d=(0,i.default)(d,0,1/0));let p="",E="";!e||e instanceof Error||!e.appName||e.appName==r.GENERIC_APP_NAME||(p=e.appName,E=" for application [APP_NAME]");const _=(e,a=n.LicenseDocsLink,s=l,t=d,o=p)=>e.replace("[LINK]",a).replace("[EMAIL]",s).replace("[APP_NAME]",o).replace("[DAYS]",`${t}`);switch(a){case"NO_LICENSE":case"NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE":(0,o.ConsoleLogByMessageType)(_("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":(0,o.ConsoleLogByMessageType)(_("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":(0,o.ConsoleLogByMessageType)(_("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":(0,o.ConsoleLogByMessageType)(_("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(d<=10)(0,o.ConsoleLogByMessageType)(_(`This AdapTable license${E} expires in [DAYS] days.  Please contact [EMAIL] to renew (giving you access to Support and Updates)`),"Info");else try{(0,c.shouldLogThankYouMessage)()&&(0,o.ConsoleLogByMessageType)(_(`Thank you for using a valid AdapTable license${E}. Your license will expire in [DAYS] days.`),"Info")}catch(e){}break;case"COMMERCIAL_EXPIRED_IN_SCOPE":(0,o.ConsoleLogByMessageType)(_(`This AdapTable license${E} 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":(0,o.ConsoleLogByMessageType)(_(`This AdapTable license${E} 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((0,s.PopupShowAlert)({alertType:"generic",header:"License Error",message:e,alertDefinition:t.default.CreateInternalAlertDefinitionForMessages("Error")}))}showWatermark(e){this.adaptable.api.internalApi.dispatchReduxAction((0,a.SystemLicenseShowWatermark)(e))}disableStatePersistence(){this.adaptable.api.internalApi.dispatchReduxAction((0,a.SystemLicenseDisablePersistence)())}destroy(){}}exports.LicenseService=L;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LicenseService=exports.LicenseValidityType=void 0;const e=require("tslib"),a=require("../../../Redux/ActionsReducers/SystemRedux"),s=require("../../../Redux/ActionsReducers/PopupRedux"),t=e.__importDefault(require("../../ObjectFactory")),o=require("../../Helpers/LoggingHelper"),i=e.__importDefault(require("lodash/clamp")),n=require("../../Constants/DocumentationLinkConstants"),r=require("../../license/decode"),c=require("./shouldLogThankYouMessage"),l="sales@adaptabletools.com",d=10,p=864e5;var E;!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"}(E=exports.LicenseValidityType||(exports.LicenseValidityType={}));const _=/(https):\/\/\d+\-\d+\-\d+\-(sandpack\.codesandbox\.io)/g,I=/(https):\/\/\S+(\.csb\.app)/g,O=/(https):\/\/\S+(\.adaptabletools\.com)/g,u="undefined"!=typeof window?window.location.origin:"",h=()=>{const[e,a,s]=Array.from(_.exec(u)||[]);return"https"===a&&"sandpack.codesandbox.io"===s},A=()=>{const[e,a,s]=Array.from(I.exec(u)||[]);return"https"===a&&".csb.app"===s},N=()=>{const[e,a,s]=Array.from(O.exec(u)||[]);return"https"===a&&".adaptabletools.com"===s};class L{constructor(e,a,s){this.adaptable=e,this.adaptable=e;let t=null;if(a)try{t=(0,r.decode)(a)}catch(e){t=e}h()||A()||N()||this.handleLicenseValidation(t,this.getValidityType(t,s))}getValidityType(e,a){if(!e)return E.NO_LICENSE;if(e instanceof Error)return E.INVALID_LICENSE;const s=new Date(a.publishedAt),t=new Date(e.end),o=t<new Date,i=e.trial;let n=null;return n=o?t>s?i?E.NON_PRODUCTION_EXPIRED_IN_SCOPE:E.COMMERCIAL_EXPIRED_IN_SCOPE:i?E.NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE:E.COMMERCIAL_EXPIRED_OUT_OF_SCOPE:i?E.NON_PRODUCTION_VALID:E.COMMERCIAL_VALID,n}handleLicenseValidation(e,a){var s;const t=new Date;t.setHours(0,0,0,0);let E=0;e instanceof Error||!(null==e?void 0:e.end)||(E=Math.floor(((null===(s=null==e?void 0:e.end)||void 0===s?void 0:s.getTime())-t.getTime())/p),E=(0,i.default)(E,0,1/0));let _="",I="";!e||e instanceof Error||!e.appName||e.appName==r.GENERIC_APP_NAME||(_=e.appName,I=" for application [APP_NAME]");const O=(e,a=n.LicenseDocsLink,s=l,t=E,o=_)=>e.replace("[LINK]",a).replace("[EMAIL]",s).replace("[APP_NAME]",o).replace("[DAYS]",`${t}`);switch(a){case"NO_LICENSE":case"NON_PRODUCTION_EXPIRED_OUT_OF_SCOPE":(0,o.ConsoleLogByMessageType)(O("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":(0,o.ConsoleLogByMessageType)(O("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":(0,o.ConsoleLogByMessageType)(O("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":(0,o.ConsoleLogByMessageType)(O("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(E<=d)(0,o.ConsoleLogByMessageType)(O(`This AdapTable license${I} expires in [DAYS] days.  Please contact [EMAIL] to renew (giving you access to Support and Updates)`),"Info");else try{(0,c.shouldLogThankYouMessage)()&&(0,o.ConsoleLogByMessageType)(O(`Thank you for using a valid AdapTable license${I}. Your license will expire in [DAYS] days.`),"Info")}catch(e){}break;case"COMMERCIAL_EXPIRED_IN_SCOPE":(0,o.ConsoleLogByMessageType)(O(`This AdapTable license${I} 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":(0,o.ConsoleLogByMessageType)(O(`This AdapTable license${I} 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((0,s.PopupShowAlert)({alertType:"generic",header:"License Error",message:e,alertDefinition:t.default.CreateInternalAlertDefinitionForMessages("Error")}))}showWatermark(e){this.adaptable.api.internalApi.dispatchReduxAction((0,a.SystemLicenseShowWatermark)(e))}disableStatePersistence(){this.adaptable.api.internalApi.dispatchReduxAction((0,a.SystemLicenseDisablePersistence)())}destroy(){}}exports.LicenseService=L;

package/src/View/Components/Charting/ChartingViewPanel.js

@@ -55,15 +55,17 @@ const ChartingViewPanel = (props) => {
                 setSelectedContainer(null);
             },
         },
-        ...chartContainers.map((contianerDef) => ({
-            label: contianerDef.name,
-            onClick: () => {
-                setSelectedContainer(contianerDef);
-            },
-        })),
+        ...(chartContainers
+            ? chartContainers === null || chartContainers === void 0 ? void 0 : chartContainers.map((contianerDef) => ({
+                label: contianerDef.name,
+                onClick: () => {
+                    setSelectedContainer(contianerDef);
+                },
+            }))
+            : []),
     ];
     const chartSelector = (React.createElement(DropdownButton_1.default, { width: "100%", columns: ['label'], className: `ab-${elementType}__Chart__select`, items: options, disabled: !hasCharts }, content));
-    const containerSelector = Boolean(chartContainers.length) && (React.createElement(DropdownButton_1.default, { width: "100%", columns: ['label'], items: containerOptions, disabled: !isSelectedChart }, (selectedContainer === null || selectedContainer === void 0 ? void 0 : selectedContainer.name) || 'Ag Grid Window'));
+    const containerSelector = Boolean(chartContainers === null || chartContainers === void 0 ? void 0 : chartContainers.length) && (React.createElement(DropdownButton_1.default, { width: "100%", columns: ['label'], items: containerOptions, disabled: !isSelectedChart }, (selectedContainer === null || selectedContainer === void 0 ? void 0 : selectedContainer.name) || 'Ag Grid Window'));
     const chartButton = (React.createElement(SimpleButton_1.default, { onClick: () => (isOpen ? closeChart() : showChart(selectedContainer)), disabled: !Boolean(selectedChart), variant: 'outlined', tone: 'neutral' }, isOpen ? 'Close' : 'Open'));
     if (elementType === 'DashboardToolbar') {
         return (React.createElement(rebass_1.Flex, { width: "100%", alignItems: "center" },

package/src/View/Components/Charting/ShowChartButton.js

@@ -25,12 +25,12 @@ const ShowChartButton = (props) => {
                 showChart(null);
             },
         },
-        ...chartContainers.map((contianerDef) => ({
-            label: contianerDef.name,
-            onClick: () => {
-                showChart(contianerDef);
-            },
-        })),
+        ...(chartContainers
+            ? chartContainers === null || chartContainers === void 0 ? void 0 : chartContainers.map((contianerDef) => ({
+                label: contianerDef.name,
+                onClick: () => showChart(contianerDef),
+            }))
+            : []),
     ];
     return (React.createElement(DropdownButton_1.default, { "data-name": "show-chart-dropdown", variant: "text", columns: ['label'], items: containerOptions },
         React.createElement(SimpleButton_1.default, { variant: "raised", tone: "success" }, "Open")));

package/src/View/Components/FilterForm/QuickFilterForm.js

@@ -142,7 +142,7 @@ class QuickFilterFormComponent extends React.Component {
             showQuickFilterInput = !hideQuickFilterInputFunction(this.props.currentColumn);
         }
         return (React.createElement(React.Fragment, null,
-            showQuickFilterDropdown && (React.createElement(OverlayTrigger_1.default, { className: "ab-QuickFilter", showEvent: showEvent, hideEvent: hideEvent, preventPortalEventPropagation: showEvent === 'click', alignHorizontal: "left", targetOffset: 10, hideDelay: 300, "data-name": "quick-filter-overlay", render: () => (React.createElement(rebass_1.Flex, { flexDirection: "column", "data-name": "quick-filter" },
+            showQuickFilterDropdown && (React.createElement(OverlayTrigger_1.default, { className: "ab-QuickFilter", showEvent: showEvent, hideEvent: hideEvent, preventPortalEventPropagation: showEvent === 'click', targetOffset: 10, hideDelay: 300, "data-name": "quick-filter-overlay", render: () => (React.createElement(rebass_1.Flex, { flexDirection: "column", "data-name": "quick-filter" },
                     (filter === null || filter === void 0 ? void 0 : filter.Predicate.PredicateId) && (React.createElement(SimpleButton_1.default, { p: 2, variant: "text", onClick: () => this.clearFilter() },
                         React.createElement("span", { style: { width: 20, marginRight: 10 } },
                             React.createElement(icons_1.Icon, { name: "delete" })),
@@ -247,7 +247,7 @@ class QuickFilterFormComponent extends React.Component {
                 return label !== null && label !== void 0 ? label : input;
             }).join(', ');
         }
-        return (React.createElement(OverlayTrigger_1.default, { alignHorizontal: "left", showEvent: showEvent, 
+        return (React.createElement(OverlayTrigger_1.default, { showEvent: showEvent, 
             // cannot hide on blur, because the form input receives the input when this is opened
             hideEvent: "mouseleave", hideDelay: 300, ref: (api) => {
                 this.valuesDropdown = api;

package/src/View/Components/RangesComponent.js

@@ -80,7 +80,7 @@ class RangesComponent extends React.Component {
                             React.createElement(ColorPicker_1.ColorPicker, { api: this.props.api, value: range.Color, onChange: (color) => {
                                     this.changeRangeColor(index, color);
                                 }, mr: 2, height: 33 })),
-                        this.props.showRangeDirection && (React.createElement(CheckBox_1.CheckBox, { disabled: this.props.disabled, checked: range.ReverseGradient && range.ReverseGradient == true, onChange: (checked) => this.changeRangeDirectionUp(index, checked) }, "Reverse Gradient")),
+                        this.props.showRangeDirection && (React.createElement(CheckBox_1.CheckBox, { disabled: this.props.disabled, checked: range.ReverseGradient && range.ReverseGradient == true, onChange: (checked) => this.changeRangeDirectionUp(index, checked), ml: 2 }, "Reverse Gradient")),
                         React.createElement(SimpleButton_1.default, { ml: 2, mb: 1, icon: "delete", disabled: this.props.disabled || (this.props.ranges && this.props.ranges.length == 1), onClick: () => this.removeRange(index) })))),
                     React.createElement("div", null,
                         React.createElement(SimpleButton_1.default, { disabled: this.props.disabled, variant: "raised", "data-name": "add", onClick: () => this.addRange() }, "Add New Range"))))),

package/src/View/Dashboard/Dashboard.js

@@ -125,8 +125,9 @@ const DashboardComponent = (props) => {
             }
         }, left: React.createElement(React.Fragment, null,
             React.createElement(AdaptableIconComponent_1.AdaptableIconComponent, { icon: applicationIcon, iconClassName: "ab-Dashboard__application-icon" }),
-            dashboardOptions.buttonsLocation === 'left' && renderModuleButtons()), right: React.createElement(React.Fragment, null,
-            renderDashboardButtons(),
+            dashboardOptions.buttonsLocation === 'left' && renderModuleButtons(),
+            dashboardOptions.buttonsLocation === 'left' && renderDashboardButtons()), right: React.createElement(React.Fragment, null,
+            dashboardOptions.buttonsLocation === 'right' && renderDashboardButtons(),
             dashboardOptions.buttonsLocation === 'right' && renderModuleButtons(),
             shouldRenderQuickSearchHeader && renderQuickSearch()), onShowDashboardPopup: props.onShowDashboardPopup }, props.DashboardState.Tabs &&
         props.DashboardState.Tabs.map((tab, index) => (React.createElement(Dashboard_1.DashboardTab, { key: index, title: tab.Name }, renderTab(tab))))));

package/src/View/FormatColumn/Wizard/FormatColumnFormatWizardSection.js

@@ -165,8 +165,8 @@ const renderDateFormat = (data, _onChange, setFormatOption, scopedCustomFormatte
                     ")."),
                 React.createElement(FormLayout_1.default, null,
                     React.createElement(FormLayout_1.FormRow, { label: "Pattern" },
-                        React.createElement(Input_1.default, { "data-name": "patern", value: data.DisplayFormat.Options.Pattern, onChange: (e) => setFormatOption('Pattern', e.currentTarget.value), mr: 2 }),
-                        React.createElement("span", null, FormatHelper_1.default.DateFormatter(new Date(), data.DisplayFormat.Options)))))),
+                        React.createElement(Input_1.default, { "data-name": "pattern", value: data.DisplayFormat.Options.Pattern, onChange: (e) => setFormatOption('Pattern', e.currentTarget.value), mr: 2 }),
+                        React.createElement("span", null, FormatHelper_1.default.DateFormatter(new Date(), data.DisplayFormat.Options, true)))))),
         scopedCustomFormatters.length > 0 && (React.createElement(Tabs_1.Tabs, { marginTop: 2, keyboardNavigation: false },
             React.createElement(Tabs_1.Tabs.Tab, null, "Custom Formats"),
             React.createElement(Tabs_1.Tabs.Content, null,

package/src/agGrid/Adaptable.d.ts

@@ -1,4 +1,4 @@
-import { ChartRef, ColDef, ColGroupDef, Column, ExcelStyle, GridOptions, Module, ModuleNames, RowNode } from '@ag-grid-community/core';
+import { ChartRef, ColDef, ColGroupDef, Column, ColumnRowGroupChangedEvent, ExcelStyle, GridOptions, Module, ModuleNames, RowNode } from '@ag-grid-community/core';
 import { AdaptableNoCodeWizardOptions, IAdaptableNoCodeWizard } from '../AdaptableInterfaces/AdaptableNoCodeWizard';
 import { AdaptableVariant, IAdaptable } from '../AdaptableInterfaces/IAdaptable';
 import { AdaptableOptions } from '../AdaptableOptions/AdaptableOptions';
@@ -395,6 +395,15 @@ export declare class Adaptable implements IAdaptable {
     private mapAggregationColumnsFromGrid;
     resetMinMaxCachedValueForColumn(column: AdaptableColumn): void;
     getMinMaxCachedValueForColumn(column: AdaptableColumn, minMax: 'min' | 'max'): number;
+    persistColumnIndexBeforeGrouping(params: ColumnRowGroupChangedEvent): void;
+    /**
+     * Restores the order previous grouping order.
+     
+     */
+    restoreUnGroupColumnOrder({ newGroupColumns, columnOrder, }: {
+        newGroupColumns: string[];
+        columnOrder: string[];
+    }): string[];
 }
 export declare class AdaptableNoCodeWizard implements IAdaptableNoCodeWizard {
     private init;

package/src/agGrid/Adaptable.js

@@ -1516,9 +1516,10 @@ class Adaptable {
      * This is the opposite of setLayout
      */
     updateLayoutFromGrid() {
+        var _a, _b;
         const currentLayout = this.api.layoutApi.getCurrentLayout();
         const layout = Object.assign({}, currentLayout);
-        const columnOrder = [];
+        let columnOrder = [];
         const columnFlexes = {};
         const pinnedColumns = {};
         const columnSorts = [];
@@ -1568,6 +1569,12 @@ class Adaptable {
         });
         groupedColumns = groupedColumns.filter((x) => !!x);
         pivotedColumns = pivotedColumns.filter((x) => !!x);
+        if ((_b = (_a = this.adaptableOptions) === null || _a === void 0 ? void 0 : _a.generalOptions) === null || _b === void 0 ? void 0 : _b.keepGroupedColumnIndex) {
+            columnOrder = this.restoreUnGroupColumnOrder({
+                columnOrder,
+                newGroupColumns: groupedColumns,
+            });
+        }
         layout.ColumnWidthMap = columnWidths;
         //  layout.ColumnFlexMap = columnFlexes;
         layout.PinnedColumnsMap = pinnedColumns;
@@ -2850,9 +2857,13 @@ class Adaptable {
          * Action: Make the column invisible
          */
         this.gridOptions.api.addEventListener(core_1.Events.EVENT_COLUMN_ROW_GROUP_CHANGED, (this.listenerColumnRowGroupChanged = (params) => {
+            var _a, _b;
             if (this.api.internalApi.isGridInPivotMode()) {
                 return;
             }
+            if ((_b = (_a = this.adaptableOptions) === null || _a === void 0 ? void 0 : _a.generalOptions) === null || _b === void 0 ? void 0 : _b.keepGroupedColumnIndex) {
+                this.persistColumnIndexBeforeGrouping(params);
+            }
             if (this.adaptableOptions.columnOptions.hideColumnWhenGrouped === true &&
                 params.source !== 'api') {
                 params.columns.forEach((col) => {
@@ -4665,17 +4676,19 @@ import "@adaptabletools/adaptable/themes/${themeName}.css"`);
         return this.ReportService.getCellExportValueFromRowNode(rowNode, columnId);
     }
     processRowGroupForExcelExport(rowNode) {
-        if (!rowNode.field || !rowNode.key) {
+        var _a, _b, _c, _d, _e;
+        const columnId = (_c = (_a = rowNode.field) !== null && _a !== void 0 ? _a : (_b = rowNode.rowGroupColumn) === null || _b === void 0 ? void 0 : _b.getColId()) !== null && _c !== void 0 ? _c : (_e = (_d = rowNode.rowGroupColumn) === null || _d === void 0 ? void 0 : _d.getColDef()) === null || _e === void 0 ? void 0 : _e.field;
+        if (!columnId || !rowNode.key) {
             return;
         }
-        const columnId = rowNode.field;
         let rawValue = rowNode.key;
         if (this.api.columnApi.getColumnDataTypeFromColumnId(columnId) === 'Date' &&
             typeof rawValue === 'string') {
             // AG-Grid converts the value to string, we have to reconvert it back
-            const numericRawValue = parseInt(rawValue);
-            if (!isNaN(numericRawValue)) {
-                rawValue = numericRawValue;
+            const dateRawValue = (0, DateHelper_1.parseDateValue)(rawValue);
+            if (dateRawValue != undefined) {
+                // @ts-ignore
+                rawValue = dateRawValue;
             }
         }
         return this.ReportService.getCellExportValueFromRawValue(rowNode, rawValue, columnId);
@@ -4809,6 +4822,61 @@ import "@adaptabletools/adaptable/themes/${themeName}.css"`);
         this.columnMinMaxValuesCache[columnId] = Object.assign(Object.assign({}, this.columnMinMaxValuesCache[columnId]), { [minMax]: value });
         return value;
     }
+    persistColumnIndexBeforeGrouping(params) {
+        const layout = this.api.layoutApi.getCurrentLayout();
+        const columnGroupsInLayout = layout.RowGroupedColumns;
+        const columnGroupsInGrid = params.columns.map((col) => col.getColId());
+        // what is new
+        const newGroups = columnGroupsInGrid.filter((colId) => !columnGroupsInLayout.includes(colId));
+        newGroups.forEach((colId) => {
+            const columnIndex = layout.Columns.findIndex((columnIdInLayout) => columnIdInLayout === colId);
+            // user may group after a column not in layout
+            if (columnIndex !== -1) {
+                this.api.internalApi.persistPreviousGroupedColumnsIndex(layout.Uuid, colId, columnIndex);
+            }
+        });
+    }
+    /**
+     * Restores the order previous grouping order.
+     
+     */
+    restoreUnGroupColumnOrder({ newGroupColumns, columnOrder, }) {
+        var _a;
+        const newColumnOrder = [...columnOrder];
+        const currentLayout = this.api.layoutApi.getCurrentLayout();
+        const previousGroupedColumnsIndex = this.api.internalApi.getPreviousGroupedColumnsIndex(currentLayout.Uuid);
+        const isUnGroup = newGroupColumns.length < ((_a = currentLayout === null || currentLayout === void 0 ? void 0 : currentLayout.RowGroupedColumns) === null || _a === void 0 ? void 0 : _a.length);
+        if (!isUnGroup) {
+            return columnOrder;
+        }
+        if (!previousGroupedColumnsIndex) {
+            return columnOrder;
+        }
+        for (let [colId, previousIndex] of Object.entries(previousGroupedColumnsIndex)) {
+            const isStillGrouped = newGroupColumns.includes(colId);
+            const isAlreadyInGrid = currentLayout.Columns.includes(colId); // was not just added by ungrouping
+            if (isStillGrouped) {
+                break;
+            }
+            if (isAlreadyInGrid) {
+                // no longer grouped, but already in grid, this means it was already in grid before ungrouping
+                // in this case the state can be cleared
+                this.api.internalApi.persistPreviousGroupedColumnsIndex(currentLayout.Uuid, colId, null);
+                break;
+            }
+            const indexInGrid = newColumnOrder.indexOf(colId);
+            const hasDifferentPositionAsPreviousLayout = previousIndex !== null && // if null, the reorder was already applied
+                indexInGrid > 0 && // needs to be in grid
+                previousIndex !== indexInGrid;
+            const isPreviousPositionInRange = previousIndex < newColumnOrder.length;
+            if (hasDifferentPositionAsPreviousLayout && isPreviousPositionInRange) {
+                newColumnOrder.splice(indexInGrid, 1);
+                newColumnOrder.splice(previousIndex, 0, colId);
+            }
+            this.api.internalApi.persistPreviousGroupedColumnsIndex(currentLayout.Uuid, colId, null);
+        }
+        return newColumnOrder;
+    }
 }
 exports.Adaptable = Adaptable;
 class AdaptableNoCodeWizard {

package/src/components/ColorPicker/ColorPicker.js

@@ -43,5 +43,5 @@ exports.ColorPicker = React.forwardRef((props, ref) => {
             React.createElement(Input_1.default, { className: "ab-ColorPicker-range", style: { background: rangeBackround }, value: alpha, onChange: (event) => {
                     const color = tinycolor(value).setAlpha(event.target.value).toRgbString();
                     props.onChange(color);
-                }, min: 0, max: 1, step: 0.1, type: "range" })))));
+                }, min: 0, max: 1, step: 0.01, type: "range" })))));
 });

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

@@ -15,4 +15,4 @@ export declare type DatepickerProps = Omit<BoxProps, 'value' | 'onChange' | 'def
     showWeekNumber?: boolean;
     showOutsideDays?: boolean;
 };
-export declare const Datepicker: React.ForwardRefExoticComponent<Pick<DatepickerProps, "max" | "required" | "type" | "data" | "default" | "high" | "low" | "key" | "id" | "media" | "height" | "width" | "start" | "open" | "name" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "color" | "content" | "display" | "flex" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "justifyContent" | "justifyItems" | "justifySelf" | "letterSpacing" | "lineHeight" | "margin" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflow" | "overflowX" | "overflowY" | "padding" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "textAlign" | "translate" | "verticalAlign" | "value" | "hidden" | "cite" | "dir" | "form" | "label" | "p" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "acceptCharset" | "action" | "method" | "noValidate" | "target" | "accessKey" | "draggable" | "lang" | "className" | "prefix" | "children" | "contentEditable" | "inputMode" | "nonce" | "tabIndex" | "async" | "disabled" | "multiple" | "size" | "manifest" | "m" | "wrap" | "accept" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "min" | "minLength" | "muted" | "optimum" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "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" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "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" | "onResize" | "onResizeCapture" | "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" | "onTransitionEnd" | "onTransitionEndCapture" | "bg" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "css" | "variant" | "tx" | "sx" | "showOutsideDays" | "showWeekNumber" | "onHide" | "showClearButton" | "datepickerButtons" | "dateProps"> & React.RefAttributes<HTMLInputElement>>;
+export declare const Datepicker: React.ForwardRefExoticComponent<Pick<DatepickerProps, "max" | "required" | "type" | "data" | "default" | "high" | "low" | "key" | "id" | "media" | "height" | "width" | "start" | "open" | "name" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "color" | "content" | "display" | "flex" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "justifyContent" | "justifyItems" | "justifySelf" | "letterSpacing" | "lineHeight" | "margin" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflow" | "overflowX" | "overflowY" | "padding" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "textAlign" | "translate" | "verticalAlign" | "value" | "hidden" | "cite" | "dir" | "form" | "label" | "p" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "acceptCharset" | "action" | "method" | "noValidate" | "target" | "accessKey" | "draggable" | "lang" | "className" | "prefix" | "children" | "contentEditable" | "inputMode" | "nonce" | "tabIndex" | "async" | "disabled" | "multiple" | "size" | "manifest" | "m" | "wrap" | "accept" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "min" | "minLength" | "muted" | "optimum" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "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" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "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" | "onResize" | "onResizeCapture" | "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" | "onTransitionEnd" | "onTransitionEndCapture" | "bg" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "css" | "variant" | "tx" | "sx" | "onHide" | "showOutsideDays" | "showWeekNumber" | "showClearButton" | "datepickerButtons" | "dateProps"> & React.RefAttributes<HTMLInputElement>>;

package/src/components/Datepicker/index.js

@@ -87,7 +87,7 @@ exports.Datepicker = React.forwardRef((props, ref) => {
         }, accessLevel: 'Full' })) : null;
     const calendarButton = (React.createElement(SimpleButton_1.default, { disabled: disabled, variant: "text", icon: "calendar", tooltip: "Date", iconSize: 20, px: 0, py: 0, onClick: () => setVisible(true) }));
     return (React.createElement(rebass_1.Flex, null,
-        React.createElement(OverlayTrigger_1.default, { visible: visible, alignHorizontal: 'left', render: () => (React.createElement(DatepickerOverlay, { onHide: () => setVisible(false), onKeyDown: (e) => {
+        React.createElement(OverlayTrigger_1.default, { visible: visible, render: () => (React.createElement(DatepickerOverlay, { onHide: () => setVisible(false), onKeyDown: (e) => {
                     if (e.key === 'Escape' || e.key === 'Enter') {
                         setVisible(false, e.key);
                     }

package/src/components/DropdownButton/index.js

@@ -102,9 +102,9 @@ const DropdownButton = React.forwardRef((props, theRef) => {
         hasClearButton ? clearButton : null,
         icon));
     const buttonRef = (0, react_1.useRef)(null);
-    return (React.createElement(OverlayTrigger_1.default, Object.assign({ visible: expanded, constrainTo: constrainTo, anchor: "vertical", targetOffset: listOffset, render: () => {
+    return (React.createElement(OverlayTrigger_1.default, Object.assign({ visible: expanded, targetOffset: listOffset, render: () => {
             return (React.createElement("div", { "data-name": `${dropdownButtonClassName}`, style: listStyle, className: `${baseClassName}__list` }, content));
-        } }, overlayProps, { target: domProps.tooltip ? (node) => node.previousSibling : undefined }),
+        } }, overlayProps),
         React.createElement(SimpleButton_1.default, Object.assign({ iconPosition: "end" }, (showToggleIcon && { icon, paddingRight: 0 }), domProps, { ref: (btn) => {
                 buttonRef.current = btn;
                 if (!theRef) {

package/src/components/OverlayTrigger/Overlay.d.ts

@@ -1,11 +1,8 @@
 import * as React from 'react';
 import { HTMLAttributes } from 'react';
-import { BoundingClientRect } from '../utils/getAvailableSizeInfo';
 export interface OverlayProps extends HTMLAttributes<HTMLElement> {
     visible: boolean;
-    anchor: 'vertical' | 'horizontal';
-    position: 'top' | 'bottom' | 'left' | 'right';
-    getConstrainRect: () => BoundingClientRect;
+    onTransitionEnd?: () => void;
 }
 export declare const useRefresh: () => () => void;
 declare const Overlay: React.ForwardRefExoticComponent<OverlayProps & React.RefAttributes<Element>>;

package/src/components/OverlayTrigger/Overlay.js

@@ -6,8 +6,6 @@ const React = tslib_1.__importStar(require("react"));
 const react_1 = require("react");
 const batchUpdate_1 = tslib_1.__importDefault(require("../utils/batchUpdate"));
 const usePrevious_1 = tslib_1.__importDefault(require("../utils/usePrevious"));
-const isEqual_1 = tslib_1.__importDefault(require("lodash/isEqual"));
-const utils_1 = require("./utils");
 const useRefresh = () => {
     const [x, update] = (0, react_1.useState)(0);
     return () => {
@@ -15,13 +13,8 @@ const useRefresh = () => {
     };
 };
 exports.useRefresh = useRefresh;
-const translateToValues = (x) => x
-    .split('(')[1]
-    .split(')')[0]
-    .split(',')
-    .map((s) => s.trim());
 const Overlay = React.forwardRef((props, ref) => {
-    const { visible, getConstrainRect, anchor, position } = props, domProps = tslib_1.__rest(props, ["visible", "getConstrainRect", "anchor", "position"]);
+    const { visible } = props, domProps = tslib_1.__rest(props, ["visible"]);
     const domRef = (0, react_1.useRef)(null);
     const setRef = (node) => {
         domRef.current = node;
@@ -40,44 +33,14 @@ const Overlay = React.forwardRef((props, ref) => {
             setOpacity(props.visible ? 1 : 0);
         }).commit();
     }, [visible]);
-    (0, react_1.useLayoutEffect)(() => {
-        if (!visible) {
-            return;
-        }
-        const constrainRect = getConstrainRect();
-        const domNode = domRef.current;
-        const thisRect = (0, utils_1.getRect)(domNode);
-        const intersection = (0, utils_1.getIntersection)(constrainRect, thisRect);
-        if (!(0, isEqual_1.default)(intersection, thisRect)) {
-            const transform = props.style
-                ? props.style.transform || 'translate3d(0px, 0px, 0px)'
-                : 'translate3d(0px, 0px, 0px)';
-            const horizontalDiff = Math.round(thisRect.left < constrainRect.left
-                ? constrainRect.left - thisRect.left
-                : thisRect.right > constrainRect.right
-                    ? constrainRect.right - thisRect.right
-                    : 0);
-            const verticalDiff = Math.round(thisRect.top < constrainRect.top
-                ? constrainRect.top - thisRect.top
-                : thisRect.bottom > constrainRect.bottom
-                    ? constrainRect.bottom - thisRect.bottom
-                    : 0);
-            const values = translateToValues(transform);
-            if (horizontalDiff) {
-                values[0] = `calc(${values[0]} + ${horizontalDiff}px)`;
-            }
-            if (verticalDiff) {
-                values[1] = `calc(${values[1]} + ${verticalDiff}px)`;
-            }
-            domNode.style.transform = `translate3d(${values.join(', ')})`;
-        }
-    }, [visible]);
     if (prevVisible && !visible) {
         transitionInProgressRef.current = true;
     }
     const onTransitionEnd = () => {
+        var _a;
         transitionInProgressRef.current = false;
         refresh();
+        (_a = props === null || props === void 0 ? void 0 : props.onTransitionEnd) === null || _a === void 0 ? void 0 : _a.call(props);
     };
     const renderTime = Date.now();
     const renderTimeRef = (0, react_1.useRef)(renderTime);

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

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { ReactNode, CSSProperties } from 'react';
-import { BoundingClientRect } from '../utils/getAvailableSizeInfo';
-import { OverlayHorizontalAlign } from './getOverlayStyle';
+import { OverlayShowParams } from '../InfiniteTable';
 export declare type ConstrainToType = ((node: HTMLElement) => HTMLElement) | string;
-export declare const getConstrainRect: (target: HTMLElement, constrainTo?: ConstrainToType) => BoundingClientRect;
+export declare const getConstrainElement: (target: HTMLElement, constrainTo?: ConstrainToType) => HTMLElement;
+export declare const getConstrainRect: (target: HTMLElement, constrainTo?: ConstrainToType) => import("../utils/getAvailableSizeInfo").BoundingClientRect;
 export interface OverlayTriggerProps extends React.HTMLAttributes<HTMLElement> {
     opacityTransitionDuration?: string | number;
     children: React.ReactNode;
@@ -20,7 +20,7 @@ export interface OverlayTriggerProps extends React.HTMLAttributes<HTMLElement> {
     targetOffset?: number;
     defaultZIndex?: number;
     anchor?: 'vertical' | 'horizontal';
-    alignHorizontal?: OverlayHorizontalAlign;
+    alignPosition?: OverlayShowParams['alignPosition'];
     constrainTo?: ConstrainToType;
 }
 declare const OverlayTrigger: React.ForwardRefExoticComponent<OverlayTriggerProps & React.RefAttributes<{