@adaptabletools/adaptable 10.0.3 → 10.0.4-canary.3

package/src/Utilities/Defaults/DefaultAdaptableOptions.js

@@ -33,6 +33,7 @@ exports.DefaultAdaptableOptions = {
         isDraggable: false,
         transition: 'Slide',
         actionHandlers: undefined,
+        showApplicationIcon: false,
         flashingAlertDefaultProperties: {
             FlashDuration: 500,
             DownChangeStyle: {
@@ -50,8 +51,8 @@ exports.DefaultAdaptableOptions = {
     },
     containerOptions: {
         adaptableContainer: 'adaptable',
-        vendorContainer: 'grid',
-        vendorContainerWaitTimeout: 60000,
+        agGridContainer: 'grid',
+        agGridContainerWaitTimeout: 60000,
         modalContainer: undefined,
         chartContainer: undefined,
         systemStatusContainer: undefined,
@@ -117,8 +118,8 @@ exports.DefaultAdaptableOptions = {
         showAdaptableContextMenu: true,
         showAdaptableColumnMenu: true,
         showUngroupColumnMenuItem: true,
-        columnMenuOrder: ['vendor', 'adaptable', 'user'],
-        contextMenuOrder: ['vendor', 'adaptable', 'user'],
+        columnMenuOrder: ['aggrid', 'adaptable', 'user'],
+        contextMenuOrder: ['aggrid', 'adaptable', 'user'],
         columnMenuItems: undefined,
         contextMenuItems: undefined,
     },
@@ -127,7 +128,7 @@ exports.DefaultAdaptableOptions = {
         hideQuickFilterInput: undefined,
         indicateFilteredColumns: true,
         useAdaptableFilterForm: true,
-        useVendorFilterFormStyle: true,
+        useAgGridFilterFormStyle: true,
         useAdaptableQuickFilter: true,
         clearFiltersOnStartUp: false,
         quickFilterTrigger: 'mouseenter',
@@ -203,7 +204,7 @@ exports.DefaultAdaptableOptions = {
         width: UIHelper_1.default.getAdaptableToolPanelWidth(),
         minWidth: UIHelper_1.default.getAdaptableToolPanelWidth(),
         maxWidth: undefined,
-        toolPanelOrder: ['filters', 'columns', 'AdaptableToolPanel'],
+        toolPanelOrder: ['filters', 'columns', 'adaptable'],
     },
     queryLanguageOptions: {
         defaultBooleanFunctions: booleanExpressionFunctions_1.booleanExpressionFunctions,
@@ -217,7 +218,7 @@ exports.DefaultAdaptableOptions = {
     },
     dataChangeHistoryOptions: {
         activeByDefault: false,
-        filterDataChange: undefined,
+        showDataChange: undefined,
     },
     customPredicateDefs: [],
 };

package/src/Utilities/ExpressionFunctions/booleanExpressionFunctions.js

@@ -227,7 +227,7 @@ exports.booleanExpressionFunctions = {
             const searchTerm = expressionFunctionUtils_1.getStringValue(context, String(args[0]));
             return (_a = context.api) === null || _a === void 0 ? void 0 : _a.columnApi.getColumns().some((column) => {
                 var _a;
-                const value = (_a = context.api) === null || _a === void 0 ? void 0 : _a.gridApi.getNormalisedValueFromRowNode(context.node, column.ColumnId);
+                const value = (_a = context.api) === null || _a === void 0 ? void 0 : _a.gridApi.getNormalisedValueFromRowNode(context.node, column.columnId);
                 const columnValue = expressionFunctionUtils_1.getStringValue(context, String(value));
                 return columnValue.indexOf(searchTerm) !== -1;
             });

package/src/Utilities/ExpressionFunctions/expressionFunctionUtils.js

@@ -23,7 +23,7 @@ exports.isTextSearchCaseInsensitive = (context) => !context.api.internalApi.isTe
 exports.getDataChangeLog$ = (context, columnNameFilter) => {
     let dataChangeLog$ = context.api.internalApi.getDataService().dataChangeLog$;
     // filter only the given column changes
-    dataChangeLog$ = dataChangeLog$.pipe(operators_1.filter((dataChangeLog) => dataChangeLog.columnId === columnNameFilter));
+    dataChangeLog$ = dataChangeLog$.pipe(operators_1.filter((dataChangeLog) => dataChangeLog.column.columnId === columnNameFilter));
     // filter based on the WHERE clause
     if (context.filterFn) {
         dataChangeLog$ = dataChangeLog$.pipe(operators_1.filter((value) => context.filterFn(value.rowNode)));
@@ -92,7 +92,7 @@ const validateColumnId = (columnId, api) => {
     if (!column) {
         throw new ExpressionEvaluationError_1.ExpressionEvaluationError('', `Column name "${columnId}" is not found`);
     }
-    if (!column.Queryable) {
+    if (!column.queryable) {
         throw new ExpressionEvaluationError_1.ExpressionEvaluationError('', `Column name "${columnId}" is not queryable`);
     }
 };

package/src/Utilities/ExpressionFunctions/observableExpressionFunctions.js

@@ -244,14 +244,15 @@ const getDataChangedInfoStub = (context) => {
     const rowNode = rowNodeStub;
     if (rowNode) {
         const primaryKeyValue = context.api.gridApi.getPrimaryKeyValueForRowNode(rowNode);
-        const columnId = (_a = context.api.columnApi.getQueryableColumns()[0]) === null || _a === void 0 ? void 0 : _a.ColumnId;
+        const columnId = (_a = context.api.columnApi.getQueryableColumns()[0]) === null || _a === void 0 ? void 0 : _a.columnId;
         const oldValue = context.api.gridApi.getCellRawValue(primaryKeyValue, columnId);
+        const column = context.api.columnApi.getColumnFromId(columnId);
         const newValue = oldValue;
         return {
             changedAt: Date.now(),
             rowNode,
             primaryKeyValue,
-            columnId,
+            column: column,
             oldValue,
             newValue,
         };

package/src/Utilities/ExpressionFunctions/scalarExpressionFunctions.js

@@ -89,7 +89,7 @@ exports.scalarExpressionFunctions = {
             if (!column) {
                 throw new ExpressionEvaluationError_1.ExpressionEvaluationError('COL', `Column name "${columnId}" is not found`);
             }
-            if (!column.Queryable) {
+            if (!column.queryable) {
                 throw new ExpressionEvaluationError_1.ExpressionEvaluationError('COL', `Column name "${columnId}" is not queryable`);
             }
             return (_b = context.api) === null || _b === void 0 ? void 0 : _b.gridApi.getNormalisedValueFromRowNode(context.node, columnId);

package/src/Utilities/Helpers/PreviewHelper.js

@@ -39,11 +39,11 @@ function GetCellInfosFromPreview(previewInfo, bypassValidationWarnings) {
             if (previewResult.validationRules.length == 0) {
                 newValues.push({
                     primaryKeyValue: previewResult.id,
-                    columnId: previewInfo.columnId,
                     rawValue: previewResult.computedValue,
                     displayValue: previewResult.computedValue,
                     normalisedValue: previewResult.computedValue,
                     rowNode: previewResult.rowNode,
+                    column: previewInfo.column,
                 });
             }
         }
@@ -54,7 +54,7 @@ function GetCellInfosFromPreview(previewInfo, bypassValidationWarnings) {
             .forEach((pr) => {
             newValues.push({
                 primaryKeyValue: pr.id,
-                columnId: previewInfo.columnId,
+                column: previewInfo.column,
                 rawValue: pr.computedValue,
                 displayValue: pr.computedValue,
                 normalisedValue: pr.computedValue,

package/src/Utilities/Interface/Preview.d.ts

@@ -1,7 +1,8 @@
 import { AlertDefinition } from '../../PredefinedConfig/AlertState';
 import { RowNode } from '@ag-grid-community/all-modules';
+import { AdaptableColumn } from '../../../types';
 export interface PreviewInfo {
-    columnId: string;
+    column: AdaptableColumn;
     previewResults: PreviewResult[];
     previewValidationSummary: PreviewValidationSummary;
 }

package/src/Utilities/ObjectFactory.js

@@ -360,7 +360,7 @@ function CreateEmptyLayout(layout, adaptableColumns) {
     return Object.assign(Object.assign({}, layout), { Uuid: Uuid_1.createUuid(), Columns: layout.Columns || [], ColumnSorts: layout.ColumnSorts || [], 
         //  ColumnFlexMap: layout.ColumnFlexMap || {},
         ColumnWidthMap: layout.ColumnWidthMap || {}, RowGroupedColumns: layout.RowGroupedColumns ||
-            (adaptableColumns ? adaptableColumns.filter((c) => c.IsGrouped).map((c) => c.ColumnId) : []) });
+            (adaptableColumns ? adaptableColumns.filter((c) => c.isGrouped).map((c) => c.columnId) : []) });
 }
 exports.CreateEmptyLayout = CreateEmptyLayout;
 function CreateEmptyStyle() {

package/src/Utilities/Services/DataService.js

@@ -30,8 +30,8 @@ class DataService {
     // we need this temporary "shared memory" because the value change and the AG Grid cellChanged event are asynchronous
     // in the first phase we keep the undone change
     logUndoChange(change) {
-        const { primaryKeyValue, columnId, oldValue, newValue } = change;
-        const undoChangeKey = this.getUndoChangeKey(primaryKeyValue, columnId, oldValue, newValue);
+        const { primaryKeyValue, column, oldValue, newValue } = change;
+        const undoChangeKey = this.getUndoChangeKey(primaryKeyValue, column.columnId, oldValue, newValue);
         this.undoChangeLog.set(undoChangeKey, change);
         // normally the extractUndoChange() should be executed right after this method
         // just to be sure that no 'zombie' undo change remains here (if something goes wrong with the undo value change)
@@ -39,16 +39,16 @@ class DataService {
         // why 2 and not 3 or 1? no good reason, only seems like a reasonable waiting time :)
         const UNDO_WAIT = 2000;
         const timeoutId = setTimeout(() => {
-            LoggingHelper_1.LogAdaptableInfo(`Undo change was NOT handled, this should NOT happen: PK(${change.primaryKeyValue}) Col(${change.columnId}) RevertedValue(${change.newValue}) NewValue(${change.oldValue})`);
+            LoggingHelper_1.LogAdaptableInfo(`Undo change was NOT handled, this should NOT happen: PK(${change.primaryKeyValue}) Col(${change.column}) RevertedValue(${change.newValue}) NewValue(${change.oldValue})`);
             this.extractUndoChange(change);
         }, UNDO_WAIT);
         this.undoChangeTimers.set(undoChangeKey, timeoutId);
     }
     // in the second phase, when AG-Grid triggers the cellChange event, we check if it corresponds to an undone change
     extractUndoChange(change) {
-        const { primaryKeyValue, columnId, oldValue, newValue } = change;
+        const { primaryKeyValue, column, oldValue, newValue } = change;
         // this is post-undo, so we have to swap the new& old values
-        const undoChangeKey = this.getUndoChangeKey(primaryKeyValue, columnId, newValue, oldValue);
+        const undoChangeKey = this.getUndoChangeKey(primaryKeyValue, column.columnId, newValue, oldValue);
         const result = this.undoChangeLog.get(undoChangeKey);
         this.undoChangeLog.delete(undoChangeKey);
         const timeoutId = this.undoChangeTimers.get(undoChangeKey);

package/src/Utilities/Services/LicenseService.js

@@ -23,19 +23,33 @@ var LicenseValidityType;
     LicenseValidityType["COMMERCIAL_EXPIRED_IN_SCOPE"] = "COMMERCIAL_EXPIRED_IN_SCOPE";
     LicenseValidityType["COMMERCIAL_EXPIRED_OUT_OF_SCOPE"] = "COMMERCIAL_EXPIRED_OUT_OF_SCOPE";
 })(LicenseValidityType = exports.LicenseValidityType || (exports.LicenseValidityType = {}));
+const SANDPACK_REGEX = /(https):\/\/\d+\-\d+\-\d\-(sandpack\.codesandbox\.io)/g;
+const SANDBOX_REGEX = /(https):\/\/\S+(\.csb\.app)/g;
+const origin = typeof window !== 'undefined' ? window.location.origin : '';
+const isInsideSandpack = () => {
+    const [_fullUrl, protocol, sandpackUrl] = Array.from(SANDPACK_REGEX.exec(origin) || []);
+    return protocol === 'https' && sandpackUrl === 'sandpack.codesandbox.io';
+};
+const isInsideSandbox = () => {
+    const [_fullUrl, protocol, sandboxUrl] = Array.from(SANDBOX_REGEX.exec(origin) || []);
+    return protocol === 'https' && sandboxUrl === '.csb.app';
+};
 class LicenseService {
     constructor(adaptable, licenseKey, packageDetails) {
         this.adaptable = adaptable;
         this.adaptable = adaptable;
         let details = null;
-        if (licenseKey)
+        if (licenseKey) {
             try {
                 details = decode_1.decode(licenseKey);
             }
             catch (error) {
                 details = error;
             }
-        this.handleLicenseValidation(details, this.getValidityType(details, packageDetails));
+        }
+        if (!isInsideSandpack() && !isInsideSandbox()) {
+            this.handleLicenseValidation(details, this.getValidityType(details, packageDetails));
+        }
     }
     getValidityType(details, packageDetails) {
         if (!details) {

package/src/Utilities/Services/MetamodelService.js

@@ -16,7 +16,6 @@ class MetamodelService {
     buildGridInfoOptions() {
         const gridInfoOptions = new Map();
         const adaptableMetamodel = adaptable_metamodel_1.ADAPTABLE_METAMODEL;
-        console.log({ adaptableMetamodel });
         const adaptableOptionsMetamodel = adaptableMetamodel['AdaptableOptions'];
         const adaptableOptionsValues = this.adaptable.adaptableOptions;
         const adaptableOptionsDefaultValues = DefaultAdaptableOptions_1.DefaultAdaptableOptions;

package/src/Utilities/Services/ReportService.js

@@ -160,14 +160,14 @@ class ReportService {
                 reportColumns = gridColumns;
                 break;
             case Enums_1.ReportColumnScope.VisibleColumns:
-                reportColumns = gridColumns.filter((c) => c.Visible);
+                reportColumns = gridColumns.filter((c) => c.visible);
                 break;
             case Enums_1.ReportColumnScope.SelectedColumns:
                 // we extract the selected columns from the grid columns to preserve the grid column order
                 const selectedColumnIds = this.adaptable.api.gridApi
                     .getSelectedCellInfo()
-                    .columns.map((column) => column.ColumnId);
-                reportColumns = gridColumns.filter((gridColumn) => selectedColumnIds.includes(gridColumn.ColumnId));
+                    .columns.map((column) => column.columnId);
+                reportColumns = gridColumns.filter((gridColumn) => selectedColumnIds.includes(gridColumn.columnId));
                 break;
             case Enums_1.ReportColumnScope.ScopeColumns:
                 if ('ColumnIds' in report.Scope) {
@@ -182,7 +182,7 @@ class ReportService {
                 break;
         }
         if (includePrimaryKey) {
-            const pkColumn = reportColumns.find((column) => column.ColumnId === this.adaptable.adaptableOptions.primaryKey);
+            const pkColumn = reportColumns.find((column) => column.columnId === this.adaptable.adaptableOptions.primaryKey);
             // TODO simplify after we fix the IsPrimaryKey bug
             // const pkColumn = reportColumns.find(column => column.IsPrimaryKey);
             if (!pkColumn && !!this.adaptable.api.columnApi.getPrimaryKeyColumn()) {
@@ -194,16 +194,16 @@ class ReportService {
     getReportData(report, includePrimaryKey = false) {
         var _a, _b;
         const columns = this.GetReportColumnsForReport(report, includePrimaryKey).map((column) => ({
-            ColumnId: column.ColumnId,
-            FriendlyName: column.FriendlyName,
-            DataType: column.DataType,
+            columnId: column.columnId,
+            friendlyName: column.friendlyName,
+            dataType: column.dataType,
         }));
         if (ArrayExtensions_1.default.IsNullOrEmpty(columns) &&
             report.ReportRowScope !== Enums_1.ReportRowScope.CustomRows) {
             return { columns: [], rows: [] };
         }
         const data = { columns, rows: [] };
-        const columnIds = columns.map((column) => column.ColumnId);
+        const columnIds = columns.map((column) => column.columnId);
         switch (report.ReportRowScope) {
             case Enums_1.ReportRowScope.AllRows:
                 this.adaptable.forAllRowNodesDo((rowNode) => {
@@ -240,7 +240,7 @@ class ReportService {
                     const rowPrimaryKeyValue = this.adaptable.getPrimaryKeyValueFromRowNode(rowNode);
                     const selectedRowCells = selectedCellsByPrimaryKey[rowPrimaryKeyValue];
                     if (selectedRowCells) {
-                        const selectedRowColumnIds = selectedRowCells.map((rowCell) => rowCell.columnId);
+                        const selectedRowColumnIds = selectedRowCells.map((rowCell) => rowCell.column.columnId);
                         const selectedColumnIds = columnIds.filter((columnId) => selectedRowColumnIds.includes(columnId));
                         const row = this.getRowObjectForColumnIds(rowNode, selectedColumnIds);
                         if (includePrimaryKey) {
@@ -275,8 +275,8 @@ class ReportService {
     }
     convertReportDataToArray(reportData) {
         return [
-            reportData.columns.map((column) => column.FriendlyName),
-            ...reportData.rows.map((row) => reportData.columns.map((column) => row[column.ColumnId])),
+            reportData.columns.map((column) => column.friendlyName),
+            ...reportData.rows.map((row) => reportData.columns.map((column) => row[column.columnId])),
         ];
     }
     getRowObjectForColumnIds(rowNode, columnIds) {
@@ -287,6 +287,7 @@ class ReportService {
     }
     PublishLiveLiveDataChangedEvent(reportDestination, liveDataTrigger, liveReport) {
         const liveDataChangedInfo = {
+            adaptableApi: this.adaptable.api,
             reportDestination: reportDestination,
             liveDataTrigger: liveDataTrigger,
             liveReport: liveReport,

package/src/Utilities/Services/ValidationService.js

@@ -18,7 +18,7 @@ class ValidationService {
         }
         let editingRules = this.adaptable.api.alertApi
             .getAlertDefinitionsWithPreventEdit()
-            .filter((v) => this.adaptable.api.scopeApi.isColumnInScope(this.adaptable.api.columnApi.getColumnFromId(dataChangedInfo.columnId), v.Scope));
+            .filter((v) => this.adaptable.api.scopeApi.isColumnInScope(dataChangedInfo.column, v.Scope));
         let failedValidations = [];
         if (ArrayExtensions_1.ArrayExtensions.IsNotEmpty(editingRules)) {
             editingRules.forEach((alertDefinition) => {
@@ -55,13 +55,12 @@ class ValidationService {
         return true;
     }
     IsAlertDefinitionTriggered(alertDefinition, dataChangedEvent) {
-        const column = this.adaptable.api.columnApi.getColumnFromId(dataChangedEvent.columnId);
         return this.adaptable.api.predicateApi.handlePredicate(alertDefinition.Rule.Predicate, {
             value: dataChangedEvent.newValue,
             oldValue: dataChangedEvent.oldValue,
-            displayValue: this.adaptable.getDisplayValueFromRowNode(dataChangedEvent.rowNode, dataChangedEvent.columnId),
+            displayValue: this.adaptable.getDisplayValueFromRowNode(dataChangedEvent.rowNode, dataChangedEvent.column.columnId),
             node: dataChangedEvent.rowNode,
-            column,
+            column: dataChangedEvent.column,
         }, false);
     }
     performServerValidation(dataChangedInfo, config) {
@@ -82,7 +81,7 @@ class ValidationService {
                     if (!row) {
                         return;
                     }
-                    row[(_b = this.adaptable.api.columnApi.getVendorGridColumnFieldForColumn(dataChangedInfo.columnId)) !== null && _b !== void 0 ? _b : dataChangedInfo.columnId] = validationResult.NewValue;
+                    row[(_b = this.adaptable.api.columnApi.getAgGridColumnFieldForAdaptableColumn(dataChangedInfo.column.columnId)) !== null && _b !== void 0 ? _b : dataChangedInfo.column.columnId] = validationResult.NewValue;
                     this.adaptable.api.gridApi.updateGridData([row]);
                     if (StringExtensions_1.default.IsNotNullOrEmpty(validationResult.ValidationMessage) &&
                         this.adaptable.adaptableOptions.editOptions.displayServerValidationMessages) {

package/src/View/AdaptableViewFactory.d.ts

@@ -1,7 +1,8 @@
+import * as React from 'react';
 import { ConnectedComponent } from 'react-redux';
 import { AdaptableModule } from '../PredefinedConfig/Common/Types';
 export declare const AdaptableViewFactory: IAdaptableViewFactory;
-export declare const AdaptableViewPanelFactory: Map<AdaptableModule, ConnectedComponent<any, any>>;
+export declare const AdaptableViewPanelFactory: Map<AdaptableModule, React.FunctionComponent<any> | ConnectedComponent<any, any>>;
 export interface IAdaptableViewFactory {
     [key: string]: any;
 }

package/src/View/AdaptableViewFactory.js

@@ -44,6 +44,7 @@ const ThemeViewPanel_1 = require("./Theme/ThemeViewPanel");
 const DataSourceViewPanel_1 = require("./DataSource/DataSourceViewPanel");
 const DataChangeHistoryPopup_1 = require("./DataChangeHistory/DataChangeHistoryPopup");
 const DataChangeHistoryViewPanel_1 = require("./DataChangeHistory/DataChangeHistoryViewPanel");
+const StateManagementViewPanel_1 = require("./StateManagement/StateManagementViewPanel");
 exports.AdaptableViewFactory = {
     ExpandedQueryPopup: ExpandedQueryPopup_1.ExpandedQueryPopup,
     AlertPopup: AlertPopup_1.AlertPopup,
@@ -88,4 +89,5 @@ exports.AdaptableViewPanelFactory = new Map([
     [ModuleConstants.ThemeModuleId, ThemeViewPanel_1.ThemeViewPanelControl],
     [ModuleConstants.DataSourceModuleId, DataSourceViewPanel_1.DataSourceViewPanelControl],
     [ModuleConstants.DataChangeHistoryModuleId, DataChangeHistoryViewPanel_1.DataChangeHistoryViewPanelControl],
+    [ModuleConstants.StateManagementModuleId, StateManagementViewPanel_1.StateManagementViewPanel],
 ]);

package/src/View/AdaptableWizardView/AdaptableConfigurationDialog/ConfigurationForm.js

@@ -16,7 +16,7 @@ const ConfigurationForm = (props) => {
     const searchOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.searchOptions), abOptions.searchOptions);
     const filterOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.filterOptions), abOptions.filterOptions);
     // we are 'hard-coding' this to use AG Grid but so does helper so ok for now and we can refactor when Adaptable Grid is ready
-    const vendorGrid = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.vendorGrid), abOptions.vendorGrid);
+    const gridOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.vendorGrid), abOptions.vendorGrid);
     return (React.createElement(React.Fragment, null,
         React.createElement(HelpBlock_1.default, null, "General Options"),
         React.createElement(FormLayout_1.default, { margin: 2, columns: [{ name: 'children' }, { name: 'label', style: { textAlign: 'start' } }] },
@@ -30,28 +30,28 @@ const ConfigurationForm = (props) => {
         React.createElement(HelpBlock_1.default, null, "Grid Options"),
         React.createElement(FormLayout_1.default, { margin: 2, columns: [{ name: 'children' }, { name: 'label', style: { textAlign: 'start' } }] },
             React.createElement(FormLayout_1.FormRow, { label: "Enable Range Selection" },
-                React.createElement(CheckBox_1.CheckBox, { checked: vendorGrid.enableRangeSelection, onChange: (enableRangeSelection) => {
+                React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.enableRangeSelection, onChange: (enableRangeSelection) => {
                         abOptions = Object.assign({}, abOptions);
                         abOptions.vendorGrid = Object.assign({}, abOptions.vendorGrid);
                         abOptions.vendorGrid.enableRangeSelection = enableRangeSelection;
                         props.onChangeadaptableOptions(abOptions);
                     } })),
             React.createElement(FormLayout_1.FormRow, { label: "Show Quick Filter" },
-                React.createElement(CheckBox_1.CheckBox, { checked: vendorGrid.floatingFilter, onChange: (floatingFilter) => {
+                React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.floatingFilter, onChange: (floatingFilter) => {
                         abOptions = Object.assign({}, abOptions);
                         abOptions.vendorGrid = Object.assign({}, abOptions.vendorGrid);
                         abOptions.vendorGrid.floatingFilter = floatingFilter;
                         props.onChangeadaptableOptions(abOptions);
                     } })),
             React.createElement(FormLayout_1.FormRow, { label: "Suppress Column Virtualisation" },
-                React.createElement(CheckBox_1.CheckBox, { checked: vendorGrid.suppressColumnVirtualisation, onChange: (suppressColumnVirtualisation) => {
+                React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.suppressColumnVirtualisation, onChange: (suppressColumnVirtualisation) => {
                         abOptions = Object.assign({}, abOptions);
                         abOptions.vendorGrid = Object.assign({}, abOptions.vendorGrid);
                         abOptions.vendorGrid.suppressColumnVirtualisation = suppressColumnVirtualisation;
                         props.onChangeadaptableOptions(abOptions);
                     } })),
             React.createElement(FormLayout_1.FormRow, { label: "Show Column Menu Button" },
-                React.createElement(CheckBox_1.CheckBox, { checked: vendorGrid.suppressMenuHide, onChange: (suppressMenuHide) => {
+                React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.suppressMenuHide, onChange: (suppressMenuHide) => {
                         abOptions = Object.assign({}, abOptions);
                         abOptions.vendorGrid = Object.assign({}, abOptions.vendorGrid);
                         abOptions.vendorGrid.suppressMenuHide = suppressMenuHide;
@@ -76,10 +76,10 @@ const ConfigurationForm = (props) => {
                         props.onChangeadaptableOptions(abOptions);
                     } })),
             React.createElement(FormLayout_1.FormRow, { label: "Use Vendor Filter Form Style" },
-                React.createElement(CheckBox_1.CheckBox, { checked: filterOptions.useVendorFilterFormStyle, onChange: (useVendorFilterFormStyle) => {
+                React.createElement(CheckBox_1.CheckBox, { checked: filterOptions.useAgGridFilterFormStyle, onChange: (useAgGridFilterFormStyle) => {
                         abOptions = Object.assign({}, abOptions);
                         abOptions.filterOptions = Object.assign({}, abOptions.filterOptions);
-                        abOptions.filterOptions.useVendorFilterFormStyle = useVendorFilterFormStyle;
+                        abOptions.filterOptions.useAgGridFilterFormStyle = useAgGridFilterFormStyle;
                         props.onChangeadaptableOptions(abOptions);
                     } })),
             React.createElement(FormLayout_1.FormRow, { label: "Use Adaptable Quick Filter" },

package/src/View/Alert/AlertPopup.js

@@ -64,7 +64,7 @@ class AlertPopupComponent extends React.Component {
                 if (this.props.popupParams.action == 'New') {
                     let alertDefinition = ObjectFactory_1.ObjectFactory.CreateEmptyAlertDefinition();
                     alertDefinition.Scope = {
-                        ColumnIds: [this.props.popupParams.column.ColumnId],
+                        ColumnIds: [this.props.popupParams.column.columnId],
                     };
                     this.setState({
                         editedAdaptableObject: alertDefinition,

package/src/View/Alert/Wizard/BaseAlertScopeWizardSection.js

@@ -49,7 +49,7 @@ exports.renderBaseAlertScopeSummary = (data) => {
                 : null)),
         React.createElement(rebass_1.Box, { style: { overflow: 'hidden' } }, 'ColumnIds' in data.Scope ? (React.createElement(React.Fragment, null,
             React.createElement(rebass_1.Text, { fontSize: 2, mb: columnsInScope.length ? 2 : 0 }, "Changes in selected columns will trigger an alert"),
-            columnsInScope.length ? (React.createElement(ValueSelector_1.ValueOptionsTags, { options: columnsInScope, value: columnsInScope.map((c) => c.ColumnId), toLabel: (c) => c.FriendlyName, allowWrap: true, readOnly: true, renderLabel: (c) => React.createElement(rebass_1.Text, { fontSize: 2 }, c), toIdentifier: (c) => c.ColumnId })) : null)) : null),
+            columnsInScope.length ? (React.createElement(ValueSelector_1.ValueOptionsTags, { options: columnsInScope, value: columnsInScope.map((c) => c.columnId), toLabel: (c) => c.friendlyName, allowWrap: true, readOnly: true, renderLabel: (c) => React.createElement(rebass_1.Text, { fontSize: 2 }, c), toIdentifier: (c) => c.columnId })) : null)) : null),
         React.createElement(rebass_1.Box, null, 'DataTypes' in data.Scope ? (React.createElement(React.Fragment, null,
             React.createElement(rebass_1.Text, { fontSize: 2, mb: 2 }, "Changes in columns of the selected data-types trigger an alert"),
             React.createElement(ValueSelector_1.ValueOptionsTags, { readOnly: true, options: data.Scope.DataTypes, value: data.Scope.DataTypes, toLabel: (c) => c, allowWrap: true, renderLabel: (c) => React.createElement(rebass_1.Text, { fontSize: 2 }, `DataType: ${c}`), toIdentifier: (c) => c }))) : null)));

package/src/View/BulkUpdate/BulkUpdatePopup.js

@@ -34,7 +34,7 @@ class BulkUpdatePopupComponent extends React.Component {
         let dataTypeErrorMessage = '';
         if (col && StringExtensions_1.StringExtensions.IsNotNullOrEmpty(this.props.BulkUpdateValue)) {
             // check that the update value is a number for a numeric column.  not issue for dates as we dont allow free text
-            if (col.DataType == Enums_1.DataType.Number) {
+            if (col.dataType == Enums_1.DataType.Number) {
                 if (isNaN(Number(this.props.BulkUpdateValue))) {
                     hasDataTypeError = true;
                     dataTypeErrorMessage = 'This column only accepts numbers';
@@ -50,14 +50,14 @@ class BulkUpdatePopupComponent extends React.Component {
             return null;
         }
         return (React.createElement(PanelWithImage_1.PanelWithImage, { header: this.props.moduleInfo.FriendlyName, glyphicon: this.props.moduleInfo.Glyph, infoLink: this.props.moduleInfo.HelpPage, infoLinkDisabled: !this.props.api.internalApi.isDocumentationLinksDisplayed(), variant: "primary", bodyProps: { padding: 2 }, style: { height: '100%' } },
-            col.DataType == Enums_1.DataType.Date ? (React.createElement(React.Fragment, null,
+            col.dataType == Enums_1.DataType.Date ? (React.createElement(React.Fragment, null,
                 React.createElement(HelpBlock_1.default, { marginTop: 2, marginBottom: 2 }, "Enter a date value. Alternatively, tick the checkbox and select from an existing column value."),
                 React.createElement(rebass_1.Box, null,
                     React.createElement(CheckBox_1.CheckBox, { marginLeft: 2, onChange: (checked) => this.onUseColumnValuesSelectorChanged(checked), checked: this.state.useSelector },
                         ' ',
                         "Select from existing column values")),
                 React.createElement(rebass_1.Flex, { padding: 2, flexDirection: "row", alignItems: "center" },
-                    React.createElement(rebass_1.Flex, { alignItems: "center", flexDirection: "row", flex: 1, marginRight: 2 }, this.state.useSelector ? (React.createElement(ColumnValueSelector_1.ColumnValueSelector, { selectedGridCells: this.props.SelectedGridCells, selectedColumnValue: this.props.BulkUpdateValue, selectedColumn: col, api: this.props.api, onColumnValueChange: (values) => this.onColumnValueSelectedChanged(values), allowNew: false, style: { width: '100%', maxWidth: 'inherit' } })) : (React.createElement(AdaptableInput_1.default, { style: { width: '100%' }, value: String(this.props.BulkUpdateValue), type: UIHelper_1.UIHelper.getDescriptionForDataType(col.DataType), placeholder: UIHelper_1.UIHelper.getPlaceHolderforDataType(col.DataType), onChange: (e) => this.onBulkUpdateValueChange(e) }))),
+                    React.createElement(rebass_1.Flex, { alignItems: "center", flexDirection: "row", flex: 1, marginRight: 2 }, this.state.useSelector ? (React.createElement(ColumnValueSelector_1.ColumnValueSelector, { selectedGridCells: this.props.SelectedGridCells, selectedColumnValue: this.props.BulkUpdateValue, selectedColumn: col, api: this.props.api, onColumnValueChange: (values) => this.onColumnValueSelectedChanged(values), allowNew: false, style: { width: '100%', maxWidth: 'inherit' } })) : (React.createElement(AdaptableInput_1.default, { style: { width: '100%' }, value: String(this.props.BulkUpdateValue), type: UIHelper_1.UIHelper.getDescriptionForDataType(col.dataType), placeholder: UIHelper_1.UIHelper.getPlaceHolderforDataType(col.dataType), onChange: (e) => this.onBulkUpdateValueChange(e) }))),
                     React.createElement(SimpleButton_1.default, { disabled: StringExtensions_1.StringExtensions.IsNullOrEmpty(this.props.BulkUpdateValue) ||
                             this.props.PreviewInfo.previewValidationSummary.validationResult == 'All', onClick: () => {
                             this.onApplyClick();

package/src/View/CalculatedColumn/CalculatedColumnPopup.js

@@ -46,7 +46,7 @@ class CalculatedColumnPopupComponent extends React.Component {
             if (this.props.popupParams.action && this.props.popupParams.column) {
                 if (this.props.popupParams.action == 'Edit') {
                     // only editing is possible - you cannot create a new calc column from the column menu
-                    let calculatedColumn = this.props.CalculatedColumns.find((x) => x.ColumnId == this.props.popupParams.column.ColumnId);
+                    let calculatedColumn = this.props.CalculatedColumns.find((x) => x.ColumnId == this.props.popupParams.column.columnId);
                     this.onEdit(calculatedColumn);
                 }
             }

package/src/View/CalculatedColumn/CalculatedColumnSummary.js

@@ -29,7 +29,7 @@ class CalculatedColumnSummaryComponent extends React.Component {
         let sharing = this.props.teamSharingActivated;
         this.props.CalculatedColumns.map((item, index) => {
             var _a;
-            if (item.ColumnId == this.props.summarisedColumn.ColumnId) {
+            if (item.ColumnId == this.props.summarisedColumn.columnId) {
                 detailRow = (React.createElement(ModuleDetail_1.ModuleDetail, { key: 'UF' + index, item1: this.props.moduleInfo.FriendlyName, item2: (_a = item.Query) === null || _a === void 0 ? void 0 : _a.ScalarExpression, configEnity: item, showShare: this.props.teamSharingActivated, moduleInfo: this.props.moduleInfo, onEdit: () => this.onEdit(item), onShare: (config) => this.props.onShare(item, config), onDelete: CalculatedColumnRedux.CalculatedColumnDelete(item), showBold: true, accessLevel: this.props.accessLevel }));
             }
         });

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

@@ -48,7 +48,7 @@ exports.isValidCalculatedColumnSettings = (data, api) => {
     if (!((_a = data.CalculatedColumnSettings) === null || _a === void 0 ? void 0 : _a.DataType)) {
         return 'No data type specified for column';
     }
-    const columnsWithSameIdCount = columns.filter((c) => c.ColumnId === data.ColumnId).length;
+    const columnsWithSameIdCount = columns.filter((c) => c.columnId === data.ColumnId).length;
     const hasAlreadyExistingId = data.Uuid ? columnsWithSameIdCount > 1 : columnsWithSameIdCount > 0;
     return hasAlreadyExistingId ? 'A Column already exists with that id' : true;
 };

package/src/View/CellSummary/CellSummaryViewPanel.js

@@ -64,8 +64,8 @@ class CellSummaryViewPanelComponent extends React.Component {
         };
         const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
         return (React.createElement(rebass_1.Flex, { flexDirection: "row", className: shouldDisable ? GeneralConstants.READ_ONLY_STYLE : `ab-${elementType}__CellSummary__wrap`, flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
-            React.createElement(rebass_1.Flex, null,
-                React.createElement(DropdownButton_1.default, { style: { fontSize: 'small' }, marginRight: 2, columns: ['label'], className: `ab-${elementType}__CellSummary__select`, items: [...operationMenuItems, ...operationDefinitions], disabled: shouldDisable, variant: "outlined", tone: 'neutral' }, this.props.CellSummaryOperation)),
+            React.createElement(rebass_1.Flex, { flex: 1 },
+                React.createElement(DropdownButton_1.default, { style: { fontSize: 'small', width: '100%' }, marginRight: 2, columns: ['label'], className: `ab-${elementType}__CellSummary__select`, items: [...operationMenuItems, ...operationDefinitions], disabled: shouldDisable, variant: "outlined", tone: 'neutral' }, this.props.CellSummaryOperation)),
             React.createElement(rebass_1.Flex, { alignItems: "center" }, React.createElement(React.Fragment, null,
                 renderOperationValue(),
                 this.props.CellSummary != null && this.props.CellSummary.Count > 0 && (React.createElement(AdaptablePopover_1.AdaptablePopover, { className: "ab-ToolPanel__CellSummary__info", bodyText: [cellSummaryPopover], useButton: true, showEvent: 'focus', hideEvent: "blur" }))))));

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

@@ -9,7 +9,7 @@ exports.NewColumnSelector = (props) => {
     const { columnFilterText, availableColumns, selected, onChange, singleSelect } = props;
     const filterFn = react_1.useMemo(() => {
         return columnFilterText
-            ? (c) => c.FriendlyName.toLowerCase().indexOf(columnFilterText.toLowerCase()) != -1
+            ? (c) => c.friendlyName.toLowerCase().indexOf(columnFilterText.toLowerCase()) != -1
             : null;
     }, [columnFilterText]);
     return (React.createElement(ValueSelector_1.ValueSelector, { value: selected, options: availableColumns, filter: filterFn, singleSelect: singleSelect, allowReorder: false, onChange: (colIds) => {
@@ -19,7 +19,7 @@ exports.NewColumnSelector = (props) => {
             else {
                 onChange(colIds);
             }
-        }, toIdentifier: (c) => c.ColumnId, toLabel: (c) => c.FriendlyName, noSelectionLabel: singleSelect ? 'Please select a column' : 'You have not selected any columns.', xSelectedLabel: singleSelect
+        }, toIdentifier: (c) => c.columnId, toLabel: (c) => c.friendlyName, noSelectionLabel: singleSelect ? 'Please select a column' : 'You have not selected any columns.', xSelectedLabel: singleSelect
             ? () => null
             : (count) => (count > 1 ? `You selected ${count} columns.` : 'You selected one column.') }));
 };