@adaptabletools/adaptable 15.4.3 → 16.0.0-canary.1

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

@@ -21,7 +21,7 @@ exports.renderCalculatedColumnExpressionSummary = renderCalculatedColumnExpressi
 const isValidCalculatedColumnExpression = (data, api) => {
     var _a;
     const calculatedColumnExpressionService = api.internalApi.getCalculatedColumnExpressionService();
-    const expression = (_a = api.queryLanguageApi.getAdaptableQueryExpression(data.Query)) === null || _a === void 0 ? void 0 : _a.trim();
+    const expression = (_a = api.expressionApi.getAdaptableQueryExpression(data.Query)) === null || _a === void 0 ? void 0 : _a.trim();
     if (!expression) {
         return 'Calculated column expression cannot be empty';
     }

package/src/View/CellSummary/CellSummaryStatusPanel.js

@@ -17,7 +17,7 @@ const CellSummaryStatusPanel = () => {
     const module = adaptable.ModuleService.getModuleById(ModuleConstants.CellSummaryModuleId);
     const text = `${cellSummaryApi.getCurrentCellSummaryOperation()}: ${(_a = cellSummaryApi.getCurrentCellSummaryOperationValue()) !== null && _a !== void 0 ? _a : 'N/A'}`;
     const onAction = () => {
-        adaptable.api.cellSummaryApi.showCellSummaryPopup();
+        adaptable.api.cellSummaryApi.openCellSummaryPopupSettingsPanel();
     };
     React.useEffect(() => {
         let cleanupEvent = () => null;

package/src/View/Components/AdaptableIconSelector/index.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import { IconSelectorProps } from '../../../components/IconSelector';
+/**
+ * This component connects to adaptable to retrieve custom icons
+ */
+export declare const AdaptableIconSelector: React.FunctionComponent<IconSelectorProps>;

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

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptableIconSelector = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const IconSelector_1 = require("../../../components/IconSelector");
+const AdaptableContext_1 = require("../../AdaptableContext");
+/**
+ * This component connects to adaptable to retrieve custom icons
+ */
+const AdaptableIconSelector = (props) => {
+    var _a, _b;
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    const userInterfaceOptions = (_a = adaptable.api.optionsApi.getAdaptableOptions()) === null || _a === void 0 ? void 0 : _a.userInterfaceOptions;
+    const customDefinedIcons = (_b = userInterfaceOptions.customIcons) !== null && _b !== void 0 ? _b : [];
+    return React.createElement(IconSelector_1.IconSelector, Object.assign({ customIcons: customDefinedIcons }, props));
+};
+exports.AdaptableIconSelector = AdaptableIconSelector;

package/src/View/Components/AdaptableObjectList/AdaptableObjectList.js

@@ -126,9 +126,9 @@ const AdaptableObjectListItem = (props) => {
     const showEditButton = Boolean(EditWizard);
     const adaptableOpttions = adaptable.api.optionsApi.getAdaptableOptions();
     const disableDeleteConfirmationState = (0, react_redux_1.useSelector)((adaptableState) => SystemRedux.SystemDisableDeleteConfirmationSelector(adaptableState.System));
-    const disableDeleteConfirmation = disableDeleteConfirmationState || ((_h = adaptableOpttions === null || adaptableOpttions === void 0 ? void 0 : adaptableOpttions.generalOptions) === null || _h === void 0 ? void 0 : _h.disableDeleteConfirmation);
+    const disableDeleteConfirmation = disableDeleteConfirmationState || ((_h = adaptableOpttions === null || adaptableOpttions === void 0 ? void 0 : adaptableOpttions.userInterfaceOptions) === null || _h === void 0 ? void 0 : _h.disableDeleteConfirmation);
     return (React.createElement(React.Fragment, null,
-        React.createElement(exports.AdaptableObjectListItemView, { module: props.module, disableDeleteConfirmation: disableDeleteConfirmation, abObject: props.data.abObject, accessLevel: accessLevel, actions: actions, className: itemClassName, handleOnEdit: handleOnEdit, items: props.data.items, showActions: showActions, showEditButton: showEditButton, style: props.data.style, teamSharingActivated: teamSharingActivated, onShare: (config) => adaptable.api.teamSharingApi.shareEntity(props.data.abObject, props.module.moduleInfo.ModuleName, config), entityType: entityType, deleteAction: deleteAction, deleteDisabled: props.deleteDisabled, deleteTooltip: props.deleteTooltip, editDisabled: isEditDisabled, suspendedEnabled: hasSuspend, onSuspend: () => dispatch(viewOptions.getSuspendAction(props.data.abObject)), onUnSuspend: () => dispatch(viewOptions.getUnSuspendAction(props.data.abObject)) }),
+        React.createElement(exports.AdaptableObjectListItemView, { module: props.module, disableDeleteConfirmation: disableDeleteConfirmation, abObject: props.data.abObject, accessLevel: accessLevel, actions: actions, className: itemClassName, handleOnEdit: handleOnEdit, items: props.data.items, showActions: showActions, showEditButton: showEditButton, style: props.data.style, teamSharingActivated: teamSharingActivated, onShare: (config) => adaptable.api.teamSharingApi.shareAdaptableEntity(props.data.abObject, props.module.moduleInfo.ModuleName, config), entityType: entityType, deleteAction: deleteAction, deleteDisabled: props.deleteDisabled, deleteTooltip: props.deleteTooltip, editDisabled: isEditDisabled, suspendedEnabled: hasSuspend, onSuspend: () => dispatch(viewOptions.getSuspendAction(props.data.abObject)), onUnSuspend: () => dispatch(viewOptions.getUnSuspendAction(props.data.abObject)) }),
         isEditWizardVisible && EditWizard && (React.createElement(EditWizard, { defaultCurrentSectionName: wizardStepName, moduleInfo: props.module.moduleInfo, data: props.data.abObject, configEntities: null, onCloseWizard: handleCloseWizard, onFinishWizard: handleCloseWizard }))));
 };
 exports.AdaptableObjectListItem = AdaptableObjectListItem;

package/src/View/Components/AdaptableViewIcon/index.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { AdaptableIconComponentProps } from '../../../components/AdaptableIconComponent';
+export interface AdaptableViewIconProps extends AdaptableIconComponentProps {
+}
+/**
+ * This component is a wrapper around AdaptableIconComponent
+ * It connects to adaptable and handles custom icons
+ * @param props
+ */
+export declare const AdaptableViewIcon: React.FunctionComponent<AdaptableViewIconProps>;

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

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptableViewIcon = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const AdaptableIconComponent_1 = require("../../../components/AdaptableIconComponent");
+const AdaptableContext_1 = require("../../AdaptableContext");
+/**
+ * This component is a wrapper around AdaptableIconComponent
+ * It connects to adaptable and handles custom icons
+ * @param props
+ */
+const AdaptableViewIcon = (_a) => {
+    var iconProps = tslib_1.__rest(_a, []);
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    return React.createElement(AdaptableIconComponent_1.AdaptableIconComponent, Object.assign({}, iconProps));
+};
+exports.AdaptableViewIcon = AdaptableViewIcon;

package/src/View/Components/EntityRulesEditor/Utilities.js

@@ -9,17 +9,17 @@ const isAdaptableRuleValid = (abObject, api, context) => {
         }
     }
     if ((_f = abObject === null || abObject === void 0 ? void 0 : abObject.Rule) === null || _f === void 0 ? void 0 : _f.BooleanExpression) {
-        if (!api.queryLanguageApi.isValidBooleanExpression((_g = abObject === null || abObject === void 0 ? void 0 : abObject.Rule) === null || _g === void 0 ? void 0 : _g.BooleanExpression, context.moduleInfo.ModuleName)) {
+        if (!api.expressionApi.isValidBooleanExpression((_g = abObject === null || abObject === void 0 ? void 0 : abObject.Rule) === null || _g === void 0 ? void 0 : _g.BooleanExpression, context.moduleInfo.ModuleName)) {
             return 'The Expression is not a valid Boolean Expression';
         }
     }
     if ((_h = abObject === null || abObject === void 0 ? void 0 : abObject.Rule) === null || _h === void 0 ? void 0 : _h.ObservableExpression) {
-        if (!api.queryLanguageApi.isValidObservableExpression((_j = abObject === null || abObject === void 0 ? void 0 : abObject.Rule) === null || _j === void 0 ? void 0 : _j.ObservableExpression, context.moduleInfo.ModuleName)) {
+        if (!api.expressionApi.isValidObservableExpression((_j = abObject === null || abObject === void 0 ? void 0 : abObject.Rule) === null || _j === void 0 ? void 0 : _j.ObservableExpression, context.moduleInfo.ModuleName)) {
             return 'The Expression is not a valid Observable Expression';
         }
     }
     if ((_k = abObject === null || abObject === void 0 ? void 0 : abObject.Rule) === null || _k === void 0 ? void 0 : _k.AggregatedBooleanExpression) {
-        if (!api.queryLanguageApi.isValidAggregatedBooleanExpression((_l = abObject === null || abObject === void 0 ? void 0 : abObject.Rule) === null || _l === void 0 ? void 0 : _l.AggregatedBooleanExpression, context.moduleInfo.ModuleName)) {
+        if (!api.expressionApi.isValidAggregatedBooleanExpression((_l = abObject === null || abObject === void 0 ? void 0 : abObject.Rule) === null || _l === void 0 ? void 0 : _l.AggregatedBooleanExpression, context.moduleInfo.ModuleName)) {
             return 'The Expression is not a valid Aggregated Boolean Expression';
         }
     }

package/src/View/Components/ExternalRenderer.js

@@ -13,7 +13,13 @@ const ExternalRenderer = (_a) => {
         const element = ref.current;
         const adaptableApi = adaptable.api;
         if (render) {
-            const html = render({ visible: true, element, adaptableApi });
+            const html = render({
+                visible: true,
+                element,
+                adaptableApi,
+                userName: adaptableApi.optionsApi.getUserName(),
+                adaptableId: adaptableApi.optionsApi.getAdaptableId(),
+            });
             setContentsHTML(html);
         }
         else if (frameworkComponent) {
@@ -21,7 +27,13 @@ const ExternalRenderer = (_a) => {
         }
         return () => {
             if (render) {
-                render({ visible: false, element: element, adaptableApi });
+                render({
+                    visible: false,
+                    element: element,
+                    adaptableApi,
+                    userName: adaptableApi.optionsApi.getUserName(),
+                    adaptableId: adaptableApi.optionsApi.getAdaptableId(),
+                });
             }
             else if (frameworkComponent) {
                 adaptableApi.internalApi.destroyFrameworkComponent(element, frameworkComponent, 

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

@@ -61,6 +61,8 @@ class QuickFilterFormComponent extends React.Component {
             const filterContext = {
                 column: this.props.currentColumn,
                 adaptableApi: this.props.api,
+                userName: this.props.api.optionsApi.getUserName(),
+                adaptableId: this.props.api.optionsApi.getAdaptableId(),
             };
             showQuickFilterDropdown = !hideQuickFilterDropdownFunction(filterContext);
         }
@@ -70,6 +72,8 @@ class QuickFilterFormComponent extends React.Component {
             const filterContext = {
                 column: this.props.currentColumn,
                 adaptableApi: this.props.api,
+                userName: this.props.api.optionsApi.getUserName(),
+                adaptableId: this.props.api.optionsApi.getAdaptableId(),
             };
             showQuickFilterInput = !hideQuickFilterInputFunction(filterContext);
         }

package/src/View/Components/Popups/AdaptablePopupAlert.js

@@ -41,6 +41,8 @@ const AdaptablePopupAlert = (props) => {
             alert: props.adaptableAlert,
             adaptableApi: api,
             formData: formData,
+            userName: api.optionsApi.getUserName(),
+            adaptableId: api.optionsApi.getAdaptableId(),
         };
     }, [JSON.stringify(formData), props.adaptableAlert]);
     const adaptableForm = React.useMemo(() => {

package/src/View/Components/RangesComponent.d.ts

@@ -26,17 +26,17 @@ export declare class RangesComponent extends React.Component<RangesComponentProp
     render(): JSX.Element;
     private onRangesTypeChanged;
     private handleRangeValueTypeChange;
-    changeRangeMin(index: number, value: string): void;
-    changeRangeMax(index: number, value: string): void;
+    changeRangeMin(index: number, value: number): void;
+    changeRangeMax(index: number, value: number): void;
     changeRangeColor(index: number, value: string): void;
     changeRangeDirectionUp(index: number, checked: boolean): void;
     removeRange(index: number): void;
     setRangeColMin(range: CellColorRange): void;
     setRangeColMax(range: CellColorRange): void;
     addRange(): void;
-    changeColumnComparisonMinValue(event: React.FormEvent<any>): void;
+    changeColumnComparisonMinValue(value: number): void;
     private onMinColumnSelectedChanged;
-    changeColumnComparisonMaxValue(event: React.FormEvent<any>): void;
+    changeColumnComparisonMaxValue(value: number): void;
     private onMaxColumnSelectedChanged;
     changeColumnComparisonColor(value: string): void;
 }

package/src/View/Components/RangesComponent.js

@@ -6,10 +6,9 @@ const React = tslib_1.__importStar(require("react"));
 const rebass_1 = require("rebass");
 const ColorPicker_1 = require("../../components/ColorPicker");
 const clamp_1 = tslib_1.__importDefault(require("lodash/clamp"));
-const StringExtensions_1 = require("../../Utilities/Extensions/StringExtensions");
 const CheckBox_1 = require("../../components/CheckBox");
 const FormLayout_1 = tslib_1.__importStar(require("../../components/FormLayout"));
-const Input_1 = tslib_1.__importDefault(require("../../components/Input"));
+const NumberInput_1 = require("../../components/Input/NumberInput");
 const SimpleButton_1 = tslib_1.__importDefault(require("../../components/SimpleButton"));
 const UIHelper_1 = require("../UIHelper");
 const ColumnSelector_1 = require("./Selectors/ColumnSelector");
@@ -62,18 +61,16 @@ class RangesComponent extends React.Component {
                     _b.map((range, index, list) => (React.createElement(rebass_1.Flex, { key: index, alignItems: "end", mb: 2, "data-name": "percent-bar-range" },
                         React.createElement(rebass_1.Flex, { flexDirection: "column" },
                             isRangeValueTypeNumber && index === 0 && (React.createElement(CheckBox_1.CheckBox, { onClick: () => this.setRangeColMin(range), checked: range.Min === 'Col-Min', mt: 0, mb: 1, fontSize: 3, disabled: this.props.disabled }, "Col Min")),
-                            React.createElement(Input_1.default, { type: typeof range.Min == 'number' ? 'number' : 'text', disabled: this.props.disabled ||
+                            React.createElement(NumberInput_1.NumberInput, { disabled: this.props.disabled ||
                                     range.Min === 'Col-Min' ||
-                                    (index === 0 && !isRangeValueTypeNumber), value: range.Min, onChange: (event) => {
-                                    const { value } = event.target;
+                                    (index === 0 && !isRangeValueTypeNumber), value: range.Min, onChange: (value) => {
                                     this.changeRangeMin(index, value);
                                 }, mr: 2 })),
                         React.createElement(rebass_1.Flex, { flexDirection: "column" },
                             isRangeValueTypeNumber && index === list.length - 1 && (React.createElement(CheckBox_1.CheckBox, { mt: 0, mb: 1, onClick: () => this.setRangeColMax(range), checked: range.Max === 'Col-Max', fontSize: 3, disabled: this.props.disabled }, "Col Max")),
-                            React.createElement(Input_1.default, { value: range.Max, type: typeof range.Max == 'number' ? 'number' : 'text', disabled: this.props.disabled ||
+                            React.createElement(NumberInput_1.NumberInput, { value: range.Max, disabled: this.props.disabled ||
                                     range.Max === 'Col-Max' ||
-                                    (index === list.length - 1 && !isRangeValueTypeNumber), onChange: (event) => {
-                                    const { value } = event.target;
+                                    (index === list.length - 1 && !isRangeValueTypeNumber), onChange: (value) => {
                                     this.changeRangeMax(index, value);
                                 }, mr: 2 })),
                         React.createElement(rebass_1.Flex, { alignItems: "center", height: "100%" },
@@ -94,12 +91,12 @@ class RangesComponent extends React.Component {
                             this.props.api.internalApi.getCorrectEnglishVariant('Colour'),
                             " for the Bar."),
                         React.createElement(FormLayout_1.default, { columns: ['label', 'first', 'or', 'second'], sizes: ['auto', 'auto', 'auto', '1fr'] },
-                            React.createElement(FormLayout_1.FormRow, { label: "Min Value:", first: React.createElement(Input_1.default, { disabled: this.props.disabled, type: "number", value: comparisonMinValueNumber, onChange: (e) => {
-                                        this.changeColumnComparisonMinValue(e);
+                            React.createElement(FormLayout_1.FormRow, { label: "Min Value:", first: React.createElement(NumberInput_1.NumberInput, { disabled: this.props.disabled, type: "number", value: comparisonMinValueNumber, onChange: (value) => {
+                                        this.changeColumnComparisonMinValue(value);
                                     } }), or: "OR", second: React.createElement(ColumnSelector_1.ColumnSelector, { disabled: this.props.disabled, style: { maxWidth: '15rem' }, SelectedColumnIds: [comparisonMinValueColumnId], ColumnList: this.props.api.columnApi.getNumericColumns(), onColumnChange: (columns) => this.onMinColumnSelectedChanged(columns), SelectionMode: Enums_1.SelectionMode.Single }) }),
                             ' ',
-                            React.createElement(FormLayout_1.FormRow, { label: "Max Value:", first: React.createElement(Input_1.default, { disabled: this.props.disabled, type: "number", value: comparisonMaxValueNumber, onChange: (e) => {
-                                        this.changeColumnComparisonMaxValue(e);
+                            React.createElement(FormLayout_1.FormRow, { label: "Max Value:", first: React.createElement(NumberInput_1.NumberInput, { disabled: this.props.disabled, type: "number", value: comparisonMaxValueNumber, onChange: (value) => {
+                                        this.changeColumnComparisonMaxValue(value);
                                     } }), or: "OR", second: React.createElement(ColumnSelector_1.ColumnSelector, { disabled: this.props.disabled, style: { maxWidth: '15rem' }, SelectedColumnIds: [comparisonMaxValueColumnId], ColumnList: this.props.api.columnApi.getNumericColumns(), onColumnChange: (columns) => this.onMaxColumnSelectedChanged(columns), SelectionMode: Enums_1.SelectionMode.Single }) }),
                             React.createElement(FormLayout_1.FormRow, { label: `Bar ${this.props.api.internalApi.getCorrectEnglishVariant('Colour')}`, first: React.createElement(ColorPicker_1.ColorPicker, { disabled: this.props.disabled, api: this.props.api, value: comparisonColor, onChange: (color) => {
                                         this.changeColumnComparisonColor(color);
@@ -210,12 +207,9 @@ class RangesComponent extends React.Component {
         const newRanges = [...this.props.ranges.slice(0, -1), previousRange, newRange];
         this.props.updateRanges(newRanges);
     }
-    changeColumnComparisonMinValue(event) {
-        let e = event.target;
+    changeColumnComparisonMinValue(value) {
         const { columnComparison } = this.props;
-        columnComparison.MinValue = StringExtensions_1.StringExtensions.IsNotNullOrEmpty(e.value)
-            ? Number(e.value)
-            : undefined;
+        columnComparison.MinValue = value;
         this.props.updateColumnComparison(columnComparison);
     }
     onMinColumnSelectedChanged(columns) {
@@ -223,12 +217,9 @@ class RangesComponent extends React.Component {
         columnComparison.MinValue = columns.length > 0 ? columns[0].columnId : undefined;
         this.props.updateColumnComparison(columnComparison);
     }
-    changeColumnComparisonMaxValue(event) {
-        let e = event.target;
+    changeColumnComparisonMaxValue(value) {
         const { columnComparison } = this.props;
-        columnComparison.MaxValue = StringExtensions_1.StringExtensions.IsNotNullOrEmpty(e.value)
-            ? Number(e.value)
-            : undefined;
+        columnComparison.MaxValue = value;
         this.props.updateColumnComparison(columnComparison);
     }
     onMaxColumnSelectedChanged(columns) {

package/src/View/Components/ToolPanel/AdaptableToolPanel.js

@@ -149,6 +149,8 @@ const AdaptableToolPanelComponent = (props) => {
             // with the next opportunity we should abstract it
             const toolPanelContext = {
                 adaptableApi: props.api,
+                userName: props.api.optionsApi.getUserName(),
+                adaptableId: props.api.optionsApi.getAdaptableId(),
                 toolPanelState: props.api.toolPanelApi.getToolPanelState(),
             };
             const buttonIcon = props.api.internalApi.getIconForButton(button, toolPanelContext);

package/src/View/Components/ToolPanel/CustomToolPanelContent.js

@@ -23,6 +23,8 @@ const CustomToolPanelContent = (props) => {
                 visible: true,
                 element,
                 adaptableApi: api,
+                userName: api.optionsApi.getUserName(),
+                adaptableId: api.optionsApi.getAdaptableId(),
             };
             const html = customToolPanel.render(customRenderContext);
             setContentsHTML(html);
@@ -32,7 +34,13 @@ const CustomToolPanelContent = (props) => {
         }
         return () => {
             if (hasCustomRenderFn(customToolPanel)) {
-                customToolPanel.render({ visible: false, element, adaptableApi: api });
+                customToolPanel.render({
+                    visible: false,
+                    element,
+                    adaptableApi: api,
+                    userName: api.optionsApi.getUserName(),
+                    adaptableId: api.optionsApi.getAdaptableId(),
+                });
             }
             else if (hasCustomFrameworkComponent(customToolPanel) && !api.isDestroyed()) {
                 api.internalApi.destroyFrameworkComponent(element, customToolPanel.frameworkComponent, 'toolPanel');
@@ -46,6 +54,8 @@ const CustomToolPanelContent = (props) => {
             // with the next opportunity we should abstract it
             const toolPanelContext = {
                 adaptableApi: api,
+                userName: api.optionsApi.getUserName(),
+                adaptableId: api.optionsApi.getAdaptableId(),
                 toolPanelState: api.toolPanelApi.getToolPanelState(),
                 customToolPanel: customToolPanel,
             };

package/src/View/CustomSort/Wizard/CustomSortColumnWizardSection.js

@@ -27,7 +27,7 @@ const CustomSortColumnWizardSection = (props) => {
     const sortableCols = React.useMemo(() => {
         const sortableColumns = api.columnApi.getSortableColumns();
         const customSorts = api.customSortApi.getCustomSorts();
-        const columnSortComparers = api.optionsApi.getGeneralOptions().customSortComparers || [];
+        const columnSortComparers = api.optionsApi.getCustomSortOptions().customSortComparers || [];
         const usedColumnIds = [
             ...customSorts.map((customSort) => customSort.ColumnId),
             ...columnSortComparers.map((comparer) => api.scopeApi.getColumnIdsInScope(comparer.scope)),

package/src/View/Dashboard/CustomDashboardButton.js

@@ -13,6 +13,8 @@ const CustomDashboardButton = (props) => {
     // with the next opportunity we should abstract it
     const dashboardContext = {
         adaptableApi: props.api,
+        userName: props.api.optionsApi.getUserName(),
+        adaptableId: props.api.optionsApi.getAdaptableId(),
         dashboardState: props.api.dashboardApi.getDashboardState(),
     };
     const buttonIcon = props.api.internalApi.getIconForButton(button, dashboardContext);

package/src/View/Dashboard/CustomToolbarWrapper.js

@@ -23,6 +23,8 @@ const CustomToolbarWrapper = (props) => {
                 visible: true,
                 element,
                 adaptableApi,
+                userName: adaptableApi.optionsApi.getUserName(),
+                adaptableId: adaptableApi.optionsApi.getAdaptableId(),
             });
             setContentsHTML(html);
         }
@@ -33,7 +35,13 @@ const CustomToolbarWrapper = (props) => {
         // cleanup runs in a separate effect, this way it's executed only once on unmount
         return () => {
             if (props.customToolbar.render) {
-                props.customToolbar.render({ visible: false, element, adaptableApi });
+                props.customToolbar.render({
+                    visible: false,
+                    element,
+                    adaptableApi,
+                    userName: adaptableApi.optionsApi.getUserName(),
+                    adaptableId: adaptableApi.optionsApi.getAdaptableId(),
+                });
             }
         };
     }, []);
@@ -60,6 +68,8 @@ const CustomToolbarWrapper = (props) => {
             const customToolbarConfiguredInfo = {
                 adaptableApi: api,
                 customToolbar: props.customToolbar,
+                userName: api.optionsApi.getUserName(),
+                adaptableId: api.optionsApi.getAdaptableId(),
             };
             api.eventApi.emit('CustomToolbarConfigured', customToolbarConfiguredInfo);
         }, accessLevel: api.internalApi
@@ -73,6 +83,8 @@ const CustomToolbarWrapper = (props) => {
                 const dashboardContext = {
                     customToolbar: props.customToolbar,
                     adaptableApi: api,
+                    userName: api.optionsApi.getUserName(),
+                    adaptableId: api.optionsApi.getAdaptableId(),
                     dashboardState: api.dashboardApi.getDashboardState(),
                 };
                 const buttonIcon = api.internalApi.getIconForButton(button, dashboardContext);

package/src/View/DataChangeHistory/DataChangeHistoryGrid.js

@@ -23,9 +23,13 @@ const DataChangeHistoryGrid = (props) => {
         const initializeAdaptableGrid = async () => {
             const gridOptions = buildGridOptions(mainAdaptableInstance, changeHistoryLog);
             const adaptableOptions = buildAdaptableOptions(mainAdaptableInstance, gridOptions, adaptableContainerId, agGridContainerId, undoChangeEnabled, onUndoChange);
+            const agGridOptions = {
+                gridOptions,
+                modules: mainAdaptableInstance.getAgGridRegisteredModules(),
+            };
             // to avoid direct dependency to Adaptable.ts and thus creating a circular dependency;
             const adaptableInitFn = Object.getPrototypeOf(mainAdaptableInstance).constructor.init;
-            const dataChangeHistoryAdaptableApi = await adaptableInitFn(adaptableOptions);
+            const dataChangeHistoryAdaptableApi = await adaptableInitFn(adaptableOptions, agGridOptions);
             setAdaptableApi(dataChangeHistoryAdaptableApi);
         };
         initializeAdaptableGrid();
@@ -64,7 +68,7 @@ const DataChangeHistoryGrid = (props) => {
         // 2. this UI will be reimplemented with Infinite Table anyway
         const addedRows = mapChangeHistoryRowData(addedChangeHistoryLogs, mainAdaptableInstance);
         const removedRows = mapChangeHistoryRowData(removedChangeHistoryLogs, mainAdaptableInstance);
-        adaptableApi.optionsApi.getAgGridOptions().api.applyTransactionAsync({
+        adaptableApi.gridApi.getAgGridInstance().api.applyTransactionAsync({
             add: addedRows,
             remove: removedRows,
         });
@@ -81,10 +85,10 @@ const buildAdaptableOptions = (mainAdaptableInstance, gridOptions, adaptableCont
         const changeKey = rowData === null || rowData === void 0 ? void 0 : rowData['changeKey'];
         changeKey && onUndoChange(changeKey);
     };
-    const actionColumnButton = (0, buildActionColumnButton_1.buildActionColumnButton)((_a = mainAdaptableInstance.adaptableOptions) === null || _a === void 0 ? void 0 : _a.dataChangeHistoryOptions, undoRowNode);
-    let actionOptions = undefined;
+    const actionColumnButton = (0, buildActionColumnButton_1.buildActionColumnButton)((_a = mainAdaptableInstance.adaptableOptions) === null || _a === void 0 ? void 0 : _a.dataChangeHistoryOptions, mainAdaptableInstance.api, undoRowNode);
+    let actionColumnOptions = undefined;
     if (actionColumnButton) {
-        actionOptions = {
+        actionColumnOptions = {
             actionColumns: [
                 {
                     columnId: 'undoActionColumn',
@@ -97,7 +101,7 @@ const buildAdaptableOptions = (mainAdaptableInstance, gridOptions, adaptableCont
         };
     }
     const options = {
-        gridOptions: gridOptions,
+        _gridOptions: gridOptions,
         primaryKey: 'primaryKey',
         licenseKey: mainAdaptableOptions.licenseKey,
         userName: `${mainAdaptableOptions.userName}`,
@@ -116,7 +120,7 @@ const buildAdaptableOptions = (mainAdaptableInstance, gridOptions, adaptableCont
             createDefaultLayout: false,
             autoSizeColumnsInLayout: true,
         },
-        actionOptions: actionOptions,
+        actionColumnOptions: actionColumnOptions,
         predefinedConfig: {
             Layout: {
                 Revision: Date.now(),

package/src/View/DataChangeHistory/buildActionColumnButton.d.ts

@@ -1,3 +1,3 @@
 import { IRowNode } from '@ag-grid-community/core';
-import { ActionColumnContext, AdaptableButton, DataChangeHistoryOptions } from '../../types';
-export declare const buildActionColumnButton: (options: DataChangeHistoryOptions, undoRowNode: (rowNode: IRowNode) => void) => AdaptableButton<ActionColumnContext<any>>[];
+import { ActionColumnContext, AdaptableApi, AdaptableButton, DataChangeHistoryOptions } from '../../types';
+export declare const buildActionColumnButton: (options: DataChangeHistoryOptions, parentAdapTableApi: AdaptableApi, undoRowNode: (rowNode: IRowNode) => void) => AdaptableButton<ActionColumnContext<any>>[];

package/src/View/DataChangeHistory/buildActionColumnButton.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.buildActionColumnButton = void 0;
-const buildActionColumnButton = (options, undoRowNode) => {
+const buildActionColumnButton = (options, parentAdapTableApi, undoRowNode) => {
     let changeHistoryButtons = options.changeHistoryButton;
     if (!changeHistoryButtons ||
         (Array.isArray(changeHistoryButtons) && changeHistoryButtons.length === 0)) {
@@ -27,7 +27,8 @@ const buildActionColumnButton = (options, undoRowNode) => {
     };
     const buildContext = (context) => {
         const dataChangedInfo = context.rowNode.data.changeInfo;
-        return Object.assign(Object.assign({}, context), { isGroupNode: isGroupNode(context), undoDataChange: () => onUndo(context), dataChangedInfo });
+        return Object.assign(Object.assign({}, context), { isGroupNode: isGroupNode(context), undoDataChange: () => onUndo(context), dataChangedInfo,
+            parentAdapTableApi });
     };
     return changeHistoryButtons.map((actionColumnOption) => ({
         label: (button, context) => {

package/src/View/Export/ExportViewPanel.d.ts

@@ -25,5 +25,5 @@ declare class ExportViewPanelComponent extends React.Component<ExportViewPanelCo
     private isCustomDestination;
     private onNewReportSchedule;
 }
-export declare let ExportViewPanelControl: import("react-redux").ConnectedComponent<typeof ExportViewPanelComponent, import("react-redux").Omit<React.ClassAttributes<ExportViewPanelComponent> & ExportViewPanelComponentProps, "api" | "accessLevel" | "moduleInfo" | "CurrentReport" | "CurrentDestination" | "Columns" | "viewType" | "onApplyExport" | "onSelectReport" | "onSelectDestination" | "onNewReport" | "onEditReport" | "onNewReportSchedule" | "UserReports">>;
+export declare let ExportViewPanelControl: import("react-redux").ConnectedComponent<typeof ExportViewPanelComponent, import("react-redux").Omit<React.ClassAttributes<ExportViewPanelComponent> & ExportViewPanelComponentProps, "api" | "accessLevel" | "moduleInfo" | "Columns" | "CurrentReport" | "CurrentDestination" | "viewType" | "onApplyExport" | "onSelectReport" | "onSelectDestination" | "onNewReport" | "onEditReport" | "onNewReportSchedule" | "UserReports">>;
 export {};

package/src/View/Export/ExportViewPanel.js

@@ -85,7 +85,7 @@ class ExportViewPanelComponent extends React.Component {
                 React.createElement(DropdownButton_1.default, { disabled: currentReportId === constants_1.SELECT_REPORT_STRING, width: "100%", fontSize: "small", items: destinationItems, columns: ['label'], className: `ab-${elementType}__Export__export`, onClear: () => this.onSelectedDestinationChanged(null), showClearButton: !!currentDestination, variant: "outlined", marginRight: 2 }, currentDestinationId)),
             React.createElement(rebass_1.Flex, { className: (0, join_1.default)(accessLevel == 'ReadOnly' ? GeneralConstants.READ_ONLY_STYLE : '', `ab-${elementType}__Export__controls`), style: { width: '100%' } },
                 React.createElement(ButtonExport_1.ButtonExport, { onClick: () => onApplyExport(), tooltip: "Export Report", className: `ab-${elementType}__Export__export`, disabled: currentReport == null || currentDestination == null }),
-                React.createElement(ButtonEdit_1.ButtonEdit, { onClick: () => this.props.onEditReport(this.props.moduleInfo.Popup), tooltip: "Edit Report", className: `ab-${elementType}__Export__edit`, disabled: currentReport == null || this.props.api.exportApi.isServerReport(currentReport), accessLevel: accessLevel }),
+                React.createElement(ButtonEdit_1.ButtonEdit, { onClick: () => this.props.onEditReport(this.props.moduleInfo.Popup), tooltip: "Edit Report", className: `ab-${elementType}__Export__edit`, disabled: currentReport == null || this.props.api.exportApi.isExternalReport(currentReport), accessLevel: accessLevel }),
                 React.createElement(ButtonNew_1.ButtonNew, { variant: "text", className: `ab-${elementType}__Export__new`, tone: "neutral", children: null, onClick: () => this.props.onNewReport(this.props.moduleInfo.Popup), tooltip: "Create New Report", accessLevel: accessLevel }),
                 React.createElement(ButtonDelete_1.ButtonDelete, { tooltip: "Delete Report", className: `ab-${elementType}__Export__delete`, disabled: currentReport == null, ConfirmAction: ExportRedux.ReportDelete(currentReport), ConfirmationMsg: deleteMessage, ConfirmationTitle: 'Delete Report', accessLevel: accessLevel }),
                 this.props.api.internalApi
@@ -103,9 +103,9 @@ class ExportViewPanelComponent extends React.Component {
             ...this.props.api.exportApi.getAvailableSystemReports(),
             ...this.props.UserReports.map((r) => r.Name),
         ];
-        const serverReports = this.props.api.exportApi.getServerReports();
-        if (ArrayExtensions_1.default.IsNotNullOrEmpty(serverReports)) {
-            reportNames.push(...serverReports.map((r) => r.name));
+        const externalReports = this.props.api.exportApi.getExternalReports();
+        if (ArrayExtensions_1.default.IsNotNullOrEmpty(externalReports)) {
+            reportNames.push(...externalReports.map((r) => r.name));
         }
         return reportNames;
     }

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

@@ -278,7 +278,9 @@ const renderNumberFormat = (data, onChange, setFormatOption, scopedCustomFormatt
                                     ? (0, clamp_1.default)(Number(e.currentTarget.value), 0, 20)
                                     : undefined) })),
                         React.createElement(FormLayout_1.FormRow, { label: "Integer Digits" },
-                            React.createElement(Input_1.default, { "data-name": "integer-digits", type: "number", min: "0", value: data.DisplayFormat.Options.IntegerDigits, onChange: (e) => setFormatOption('IntegerDigits', Number(e.currentTarget.value)) })),
+                            React.createElement(Input_1.default, { "data-name": "integer-digits", type: "number", min: "0", value: data.DisplayFormat.Options.IntegerDigits, onChange: (e) => setFormatOption('IntegerDigits', StringExtensions_1.default.IsNumeric(e.currentTarget.value)
+                                    ? (0, clamp_1.default)(Number(e.currentTarget.value), 0, 20)
+                                    : undefined) })),
                         React.createElement(FormLayout_1.FormRow, { label: "Multiplier" },
                             React.createElement(Input_1.default, { "data-name": "multiplier", type: "number", value: data.DisplayFormat.Options.Multiplier, onChange: (e) => setFormatOption('Multiplier', Number(e.currentTarget.value)) })),
                         ' ',

package/src/View/GridInfo/GridInfoPopup.d.ts

@@ -11,7 +11,6 @@ export interface AdaptableGridInfoState {
     IsContainerOptionsMinimised: boolean;
     IsSearchOptionsMinimised: boolean;
     IsLayoutOptionsMinimised: boolean;
-    IsGeneralOptionsMinimised: boolean;
 }
 export declare const GridInfoPopup: (props: GridInfoPopupProps) => JSX.Element;
 export {};

package/src/View/GridInfo/GridInfoPopup.js

@@ -39,7 +39,6 @@ const GridInfoPopup = (props) => {
         IsContainerOptionsMinimised: true,
         IsSearchOptionsMinimised: true,
         IsLayoutOptionsMinimised: true,
-        IsGeneralOptionsMinimised: true,
     });
     const updateState = (partialState) => {
         setState((state) => {
@@ -52,7 +51,7 @@ const GridInfoPopup = (props) => {
         const calcColumns = props.api.calculatedColumnApi
             .getCalculatedColumns()
             .map((c) => c.ColumnId);
-        const actionColumns = props.api.actionApi
+        const actionColumns = props.api.actionColumnApi
             .getActionColumns()
             .map((ac) => ac.columnId);
         const freeTextColumns = props.api.freeTextColumnApi

package/src/View/GridInfo/GridOptionsComponent.js

@@ -9,7 +9,7 @@ const CheckBox_1 = require("../../components/CheckBox");
 class GridOptionsComponent extends React.Component {
     constructor(props) {
         super(props);
-        const gridOptions = props.api.internalApi.getAgGridInstance();
+        const gridOptions = props.api.gridApi.getAgGridInstance();
         this.state = {
             showTotalFooter: gridOptions.groupIncludeTotalFooter,
             showGroupFooter: gridOptions.groupIncludeFooter,

package/src/View/Layout/LayoutViewPanel.js

@@ -24,7 +24,7 @@ class LayoutViewPanelComponent extends React.Component {
         const cloneAccessLevel = this.props.accessLevel;
         const newAccessLevel = this.props.accessLevel;
         const accessLevel = AdaptableHelper_1.default.getAppropriateAccessLevel(layoutEntity, this.props.accessLevel);
-        const isManualSaveLayout = !this.props.api.layoutApi.shouldAutoSaveLayout(this.props.CurrentDraftLayout);
+        const isManualSaveLayout = !this.props.api.layoutApi.shouldAutoSaveLayouts();
         const availableLayoutOptions = this.props.Layouts.map((layout, index) => {
             return Object.assign(Object.assign({}, layout), { label: layout.Name, value: layout.Name, onClick: () => this.props.onSelectLayout(layout.Name) });
         });

package/src/View/Layout/PivotDetailsPopoup.js

@@ -28,6 +28,8 @@ const PivotDetailsPopoup = (props) => {
                 layout: layout,
                 columnId: columnId,
                 adaptableApi: adaptableApi,
+                userName: adaptableApi.optionsApi.getUserName(),
+                adaptableId: adaptableApi.optionsApi.getAdaptableId(),
             };
             pivotPreviewExtraColumns = pivotPreviewOptionColumn(pivotPreviewColumnsContext);
         }

package/src/View/Layout/SaveLayoutButton.js

@@ -16,7 +16,7 @@ const SaveLayoutButton = () => {
         .getEntitlementAccessLevelForModule(ModuleConstants.LayoutModuleId);
     const dispatch = (0, react_redux_1.useDispatch)();
     const currentDraftLayout = (0, react_redux_1.useSelector)((state) => state.Grid.CurrentLayout);
-    const isManualSaveLayout = !adaptable.api.layoutApi.shouldAutoSaveLayout(currentDraftLayout);
+    const isManualSaveLayout = !adaptable.api.layoutApi.shouldAutoSaveLayouts();
     const handleSave = React.useCallback((layout) => {
         dispatch(LayoutRedux.LayoutSave(layout));
         dispatch(GridRedux.LayoutUpdateCurrentDraft(null));

package/src/View/Layout/Wizard/LayoutWizard.js

@@ -37,7 +37,7 @@ const LayoutWizard = (props) => {
         }
         if (preparedLayout.SuppressAggFuncInHeader === undefined) {
             preparedLayout.SuppressAggFuncInHeader =
-                !!adaptable.api.internalApi.getAgGridInstance().suppressAggFuncInHeader;
+                !!adaptable.api.gridApi.getAgGridInstance().suppressAggFuncInHeader;
         }
         return preparedLayout;
     });

package/src/View/Query/Wizard/NamedQueryExpressionWizardSection.js

@@ -13,7 +13,7 @@ const isValidNamedQueryExpression = (data, api) => {
     if (!data.BooleanExpression) {
         return 'Expression is empty';
     }
-    const valid = api.queryLanguageApi.isValidBooleanExpression(data.BooleanExpression, ModuleConstants_1.QueryModuleId);
+    const valid = api.expressionApi.isValidBooleanExpression(data.BooleanExpression, ModuleConstants_1.QueryModuleId);
     if (!valid) {
         return 'Query is not a valid Boolean Query';
     }