@adaptabletools/adaptable 10.0.2 → 10.0.4-canary.2

package/src/View/Filter/FilterSummary.js

@@ -18,7 +18,7 @@ class FilterSummaryComponent extends React.Component {
         this.state = UIHelper_1.UIHelper.getEmptyConfigState();
     }
     render() {
-        let columnFilter = this.props.ColumnFilters.find((c) => c.ColumnId == this.props.summarisedColumn.ColumnId);
+        let columnFilter = this.props.ColumnFilters.find((c) => c.ColumnId == this.props.summarisedColumn.columnId);
         let description = this.getDescription(columnFilter);
         let summaryItems = [];
         summaryItems.push(React.createElement("b", null, React.createElement(ModuleProfile_1.ModuleProfile, { moduleInfo: this.props.moduleInfo })));
@@ -27,7 +27,7 @@ class FilterSummaryComponent extends React.Component {
         return React.createElement(SummaryRowItem_1.SummaryRowItem, { SummaryItems: summaryItems });
     }
     getDescription(columnFilter) {
-        if (this.props.summarisedColumn && !this.props.summarisedColumn.Filterable) {
+        if (this.props.summarisedColumn && !this.props.summarisedColumn.filterable) {
             return 'Column is not filterable';
         }
         if (columnFilter == null) {

package/src/View/FormatColumn/FormatColumnPopup.js

@@ -55,7 +55,7 @@ class FormatColumnPopupComponent extends React.Component {
                 if (this.props.popupParams.action == 'New') {
                     let newFormatColumn = ObjectFactory_1.ObjectFactory.CreateEmptyFormatColumn();
                     newFormatColumn.Scope = {
-                        ColumnIds: [column.ColumnId],
+                        ColumnIds: [column.columnId],
                     };
                     this.onNewFromColumn(newFormatColumn);
                 }

package/src/View/FormatColumn/FormatColumnSummary.js

@@ -51,7 +51,7 @@ class FormatColumnSummaryComponent extends React.Component {
     onNew() {
         let configEntity = ObjectFactory_1.ObjectFactory.CreateEmptyFormatColumn();
         configEntity.Scope = {
-            ColumnIds: [this.props.summarisedColumn.ColumnId],
+            ColumnIds: [this.props.summarisedColumn.columnId],
         };
         this.setState({
             editedAdaptableObject: configEntity,

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

@@ -104,7 +104,7 @@ exports.getFormatDisplayTypeForScope = (scope, api) => {
     // need to see if all columns are numeric or date
     if ('ColumnIds' in scope) {
         const columns = scope.ColumnIds.map((c) => api.columnApi.getColumnFromId(c));
-        const columnDataTypes = uniq_1.default(columns.map((c) => c.DataType));
+        const columnDataTypes = uniq_1.default(columns.map((c) => c.dataType));
         if (columnDataTypes.length == 1 && columnDataTypes[0] == 'Number') {
             return 'Number';
         }

package/src/View/FreeTextColumn/FreeTextColumnPopup.js

@@ -44,7 +44,7 @@ class FreeTextColumnPopupComponent extends React.Component {
         if (this.props.popupParams) {
             if (this.props.popupParams.action && this.props.popupParams.column) {
                 if (this.props.popupParams.action == 'Edit') {
-                    let editFreeTextColumn = this.props.FreeTextColumns.find((x) => x.ColumnId == this.props.popupParams.column.ColumnId);
+                    let editFreeTextColumn = this.props.FreeTextColumns.find((x) => x.ColumnId == this.props.popupParams.column.columnId);
                     let index = this.props.FreeTextColumns.indexOf(editFreeTextColumn);
                     this.onEdit(editFreeTextColumn);
                 }
@@ -74,7 +74,9 @@ class FreeTextColumnPopupComponent extends React.Component {
                 this.state.editedAdaptableObject != null && (React.createElement(FreeTextColumnWizard_1.FreeTextColumnWizard, { moduleInfo: this.props.moduleInfo, data: this.state.editedAdaptableObject, configEntities: this.props.FreeTextColumns, wizardStartIndex: this.state.wizardStartIndex, onCloseWizard: () => this.onCloseWizard(), onFinishWizard: this.onFinishWizard })))));
     }
     onNew() {
-        const editedAdaptableObject = ObjectFactory_1.ObjectFactory.CreateEmptyFreeTextColumn();
+        const specialColumnsAreFilterable = this.props.api.internalApi.getAdaptableOptions()
+            .filterOptions.enableFilterOnSpecialColumns;
+        const editedAdaptableObject = ObjectFactory_1.ObjectFactory.CreateEmptyFreeTextColumn(specialColumnsAreFilterable);
         // we want to do this here, as we need a way to differentiate in the wizard
         // if it's a new or existing column
         delete editedAdaptableObject.Uuid;

package/src/View/FreeTextColumn/FreeTextColumnSummary.js

@@ -35,7 +35,7 @@ class FreeTextColumnSummaryComponent extends React.Component {
         this.state = UIHelper_1.UIHelper.getEmptyConfigState();
     }
     render() {
-        let freeTextColumn = this.props.FreeTextColumns.find((c) => c.ColumnId == this.props.summarisedColumn.ColumnId);
+        let freeTextColumn = this.props.FreeTextColumns.find((c) => c.ColumnId == this.props.summarisedColumn.columnId);
         let noFreeTextColumn = freeTextColumn == null;
         let FreeTextColumnRow;
         if (!noFreeTextColumn) {
@@ -49,8 +49,10 @@ class FreeTextColumnSummaryComponent extends React.Component {
             this.state.editedAdaptableObject && (React.createElement(FreeTextColumnWizard_1.FreeTextColumnWizard, { moduleInfo: this.props.moduleInfo, data: this.state.editedAdaptableObject, configEntities: this.props.FreeTextColumns, onCloseWizard: () => this.onCloseWizard(), onFinishWizard: this.onFinishWizard }))));
     }
     onNew() {
-        let configEntity = ObjectFactory_1.ObjectFactory.CreateEmptyFreeTextColumn();
-        configEntity.ColumnId = this.props.summarisedColumn.ColumnId;
+        const specialColumnsAreFilterable = this.props.api.internalApi.getAdaptableOptions()
+            .filterOptions.enableFilterOnSpecialColumns;
+        let configEntity = ObjectFactory_1.ObjectFactory.CreateEmptyFreeTextColumn(specialColumnsAreFilterable);
+        configEntity.ColumnId = this.props.summarisedColumn.columnId;
         this.setState({
             editedAdaptableObject: configEntity,
             wizardStartIndex: 1,

package/src/View/FreeTextColumn/Wizard/FreeTextColumnSettingsWizardSection.js

@@ -47,7 +47,7 @@ exports.isValidFreeTextColumn = (data, api) => {
     if (!data.ColumnId) {
         return 'Column id cannot be empty';
     }
-    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;
     if (hasAlreadyExistingId) {
         return 'A Column already exists with that id';

package/src/View/GridInfo/ColumnInfoComponent.js

@@ -31,36 +31,36 @@ class ColumnInfoComponent extends React.Component {
             { Content: '', Size: 2 },
         ];
         let selectedColumnId = this.state.SelectedColumn
-            ? this.state.SelectedColumn.ColumnId
+            ? this.state.SelectedColumn.columnId
             : null;
         let keyValuePairs = [
             {
                 Key: 'Column Id',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.ColumnId : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.columnId : null,
             },
             {
                 Key: 'Header',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.FriendlyName : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.friendlyName : null,
             },
             {
                 Key: 'Aggregatable',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.Aggregatable : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.aggregatable : null,
             },
             {
                 Key: 'DataType',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.DataType : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.dataType : null,
             },
             {
                 Key: 'Groupable',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.Groupable : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.groupable : null,
             },
             {
                 Key: 'Filterable',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.Filterable : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.filterable : null,
             },
             {
                 Key: 'Hideable',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.Hideable : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.hideable : null,
             },
             {
                 Key: 'Editable',
@@ -68,27 +68,27 @@ class ColumnInfoComponent extends React.Component {
             },
             {
                 Key: 'Moveable',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.Moveable : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.moveable : null,
             },
             {
                 Key: 'Pivotable',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.Pivotable : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.pivotable : null,
             },
             {
                 Key: 'Queryable',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.Queryable : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.queryable : null,
             },
             {
                 Key: 'Sortable',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.Sortable : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.sortable : null,
             },
             {
                 Key: 'Visible',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.Visible : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.visible : null,
             },
             {
                 Key: 'Grouped',
-                Value: this.state.SelectedColumn ? this.state.SelectedColumn.IsGrouped : null,
+                Value: this.state.SelectedColumn ? this.state.SelectedColumn.isGrouped : null,
             },
         ];
         let moduleService = this.props.api.internalApi.getModuleService();
@@ -125,14 +125,14 @@ class ColumnInfoComponent extends React.Component {
                     React.createElement(FreeTextColumnSummary_1.FreeTextColumnSummary, { key: ModuleConstants.FreeTextColumnModuleId, summarisedColumn: this.state.SelectedColumn, teamSharingActivated: this.props.teamSharingActivated, accessLevel: this.getAccessLevel(ModuleConstants.FreeTextColumnModuleId), api: this.props.api, moduleInfo: moduleService.getModuleInfoByModule(ModuleConstants.FreeTextColumnModuleId) })));
             }
             if (this.isModuleAvailable(ModuleConstants.PlusMinusModuleId) &&
-                this.state.SelectedColumn.DataType == Enums_1.DataType.Number) {
+                this.state.SelectedColumn.dataType == Enums_1.DataType.Number) {
                 summaries.push(React.createElement("div", { key: ModuleConstants.PlusMinusModuleId, className: this.isModuleReadOnly(ModuleConstants.PlusMinusModuleId)
                         ? GeneralConstants.READ_ONLY_STYLE
                         : '' },
                     React.createElement(PlusMinusSummary_1.PlusMinusSummary, { key: ModuleConstants.PlusMinusModuleId, summarisedColumn: this.state.SelectedColumn, teamSharingActivated: this.props.teamSharingActivated, accessLevel: this.getAccessLevel(ModuleConstants.PlusMinusModuleId), api: this.props.api, moduleInfo: moduleService.getModuleInfoByModule(ModuleConstants.PlusMinusModuleId) })));
             }
             if (this.isModuleAvailable(ModuleConstants.CalculatedColumnModuleId) &&
-                ArrayExtensions_1.ArrayExtensions.ContainsItem(this.props.api.calculatedColumnApi.getAllCalculatedColumn().map((cc) => cc.ColumnId), this.state.SelectedColumn.ColumnId)) {
+                ArrayExtensions_1.ArrayExtensions.ContainsItem(this.props.api.calculatedColumnApi.getAllCalculatedColumn().map((cc) => cc.ColumnId), this.state.SelectedColumn.columnId)) {
                 summaries.push(React.createElement("div", { key: ModuleConstants.CalculatedColumnModuleId, className: this.isModuleReadOnly(ModuleConstants.CalculatedColumnModuleId)
                         ? GeneralConstants.READ_ONLY_STYLE
                         : '' },

package/src/View/GridInfo/GridInfoPopup.js

@@ -48,13 +48,16 @@ exports.GridInfoPopup = (props) => {
                 return props.api.columnApi.getFriendlyNameFromColumnId(gs.ColumnId) + ': ' + gs.SortOrder;
             })
             : null;
+        const selectedRowInfo = props.api.gridApi.getSelectedRowInfo();
         returnRows.push(createReadOnlyColItem(colItems, 'AdapTable Version', version_1.default));
         returnRows.push(createReadOnlyColItem(colItems, 'Sorted Columns', ArrayExtensions_1.default.IsNotNullOrEmpty(sorts) ? sorts.join('; ') : 'None'));
         returnRows.push(createReadOnlyColItem(colItems, 'Column Filters', columnFilterDescription));
         returnRows.push(createReadOnlyColItem(colItems, 'All Rows', props.api.gridApi.getRowCount()));
         returnRows.push(createReadOnlyColItem(colItems, 'Visible Rows', props.api.gridApi.getVisibleRowCount()));
+        returnRows.push(createReadOnlyColItem(colItems, 'Selected Rows', selectedRowInfo === null || selectedRowInfo === void 0 ? void 0 : selectedRowInfo.gridRows.length));
+        returnRows.push(createReadOnlyColItem(colItems, 'Visible Selected Rows', selectedRowInfo === null || selectedRowInfo === void 0 ? void 0 : selectedRowInfo.gridRows.filter((gr) => { var _a; return ((_a = gr.rowNode) === null || _a === void 0 ? void 0 : _a.displayed) == true; }).length));
         returnRows.push(createReadOnlyColItem(colItems, 'All Columns', props.api.gridApi.getColumnCount()));
-        returnRows.push(createReadOnlyColItem(colItems, 'Visible Column', props.api.gridApi.getVisibleColumnCount()));
+        returnRows.push(createReadOnlyColItem(colItems, 'Visible Columns', props.api.gridApi.getVisibleColumnCount()));
         returnRows.push(createReadOnlyColItem(colItems, 'Calculated Columns', ArrayExtensions_1.default.IsNotNullOrEmpty(calcColumns) ? calcColumns : 'None'));
         returnRows.push(createReadOnlyColItem(colItems, 'Free Text Columns', ArrayExtensions_1.default.IsNotNullOrEmpty(freeTextColumns) ? freeTextColumns : 'None'));
         returnRows.push(createReadOnlyColItem(colItems, 'Action Columns', ArrayExtensions_1.default.IsNotNullOrEmpty(actionColumns) ? actionColumns : 'None'));

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.getVendorGridInstance();
+        const gridOptions = props.api.internalApi.getAgGridInstance();
         this.state = {
             testString: 'Hello world',
             showTotalFooter: gridOptions.groupIncludeTotalFooter,

package/src/View/Layout/LayoutViewPanel.js

@@ -30,8 +30,8 @@ class LayoutViewPanelComponent extends React.Component {
         });
         const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
         return (React.createElement(rebass_1.Flex, { flexDirection: "row", className: `ab-${elementType}__Layout__wrap`, flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
-            React.createElement(rebass_1.Flex, null,
-                React.createElement(DropdownButton_1.default, { marginRight: 2, columns: ['label'], style: { minWidth: 168, fontSize: 'small' }, className: `ab-${elementType}__Layout__select`, items: availableLayoutOptions, disabled: availableLayoutOptions.length == 0 }, layoutEntity ? layoutEntity.Name : null)),
+            React.createElement(rebass_1.Flex, { flex: 1 },
+                React.createElement(DropdownButton_1.default, { marginRight: 2, columns: ['label'], style: { width: '100%', fontSize: 'small' }, className: `ab-${elementType}__Layout__select`, items: availableLayoutOptions, disabled: availableLayoutOptions.length == 0 }, layoutEntity ? layoutEntity.Name : null)),
             React.createElement(rebass_1.Flex, { flexDirection: "row", className: join_1.default(this.props.accessLevel == 'ReadOnly' ? GeneralConstants.READ_ONLY_STYLE : '', `ab-${elementType}__Layout__wrap`) },
                 isManualSaveLayout && (React.createElement(ButtonSave_1.ButtonSave, { className: `ab-${elementType}__Layout__save`, onClick: () => this.onSaveLayout(), tooltip: "Save Changes to Current Layout", disabled: !this.props.CanSave, accessLevel: accessLevel })),
                 React.createElement(ButtonEdit_1.ButtonEdit, { onClick: () => this.props.onEditLayout(this.props.moduleInfo.Popup), tooltip: "Edit Layout", className: `ab-${elementType}__Layout__edit`, accessLevel: accessLevel }),

package/src/View/Layout/Wizard/LayoutEditor/ColumnList.js

@@ -24,7 +24,7 @@ exports.ColumnList = (props) => {
             source.droppableId !== destination.droppableId) {
             return;
         }
-        if (!source.column || !source.column.Moveable) {
+        if (!source.column || !source.column.moveable) {
             return;
         }
         if (destination.index === source.index) {
@@ -36,8 +36,8 @@ exports.ColumnList = (props) => {
             // cannot drop on this list while searching
             return;
         }
-        if (!source.column.IsFixed &&
-            newColumns.slice(newDropIndex).filter((c) => c.IsFixed).length) {
+        if (!source.column.isFixed &&
+            newColumns.slice(newDropIndex).filter((c) => c.isFixed).length) {
             // there are fixed cols after this one, so it's an invalid drop
             return;
         }
@@ -59,7 +59,7 @@ exports.ColumnList = (props) => {
     }, [onDragEnd]);
     const renderColumn = react_2.useCallback((c) => {
         const defaultRenderColumn = (c) => {
-            return React.createElement(React.Fragment, null, c.FriendlyName);
+            return React.createElement(React.Fragment, null, c.friendlyName);
         };
         return (props.renderItem || defaultRenderColumn)(c);
     }, [props.renderItem]);
@@ -68,11 +68,11 @@ exports.ColumnList = (props) => {
             React.createElement(rebass_1.Box, { px: 2, mb: 2 },
                 React.createElement(AdaptableFormControlTextClear_1.AdaptableFormControlTextClear, { placeholder: "Search a column", width: "100%", value: search, OnTextChange: setSearch })),
             columns.map((c, index) => {
-                return (React.createElement(react_beautiful_dnd_1.Draggable, { key: `${c.ColumnId}-column`, draggableId: c.ColumnId, index: index }, (provided, snapshot) => {
+                return (React.createElement(react_beautiful_dnd_1.Draggable, { key: `${c.columnId}-column`, draggableId: c.columnId, index: index }, (provided, snapshot) => {
                     const style = props.getItemStyle(c, snapshot, provided.draggableProps.style);
                     style.padding = 0;
                     if (search &&
-                        c.FriendlyName.toLowerCase().indexOf(search.toLowerCase()) == -1) {
+                        c.friendlyName.toLowerCase().indexOf(search.toLowerCase()) == -1) {
                         style.display = 'none';
                     }
                     return (React.createElement("div", Object.assign({ ref: provided.innerRef }, provided.draggableProps, provided.dragHandleProps, { className: "ab-LayoutEditor__ColumnList__column", style: style }), renderColumn(c)));

package/src/View/Layout/Wizard/LayoutEditor/ColumnSortList.js

@@ -39,7 +39,7 @@ exports.ColumnSortList = (props) => {
             return;
         }
         if (columnDrag) {
-            if (!source.column.Sortable) {
+            if (!source.column.sortable) {
                 return;
             }
             if (columnSorts.filter((c) => c.ColumnId === source.columnId)[0]) {

package/src/View/Layout/Wizard/LayoutEditor/PivotList.js

@@ -36,7 +36,7 @@ exports.PivotList = (props) => {
             return;
         }
         if (columnDrag) {
-            if (!source.column.Pivotable) {
+            if (!source.column.pivotable) {
                 return;
             }
             if (pivotColumns.filter((colId) => colId === source.columnId)[0]) {

package/src/View/Layout/Wizard/LayoutEditor/RowGroupsList.js

@@ -36,7 +36,7 @@ exports.RowGroupsList = (props) => {
             return;
         }
         if (columnDrag) {
-            if (!source.column.Groupable) {
+            if (!source.column.groupable) {
                 return;
             }
             if (rowGroups.filter((colId) => colId === source.columnId)[0]) {

package/src/View/Layout/Wizard/LayoutEditor/getItemStyle.js

@@ -10,9 +10,9 @@ exports.getItemStyle = (column, layout, dragSource, snapshot, draggableStyle) =>
         if (dragSource == droppableIds_1.LayoutEditorDroppableIds.ColumnList &&
             draggingOver === droppableIds_1.LayoutEditorDroppableIds.ColumnSortList &&
             //if col not sortable or is already in the sort order
-            (!column.Sortable ||
+            (!column.sortable ||
                 (layout.ColumnSorts &&
-                    layout.ColumnSorts.filter((sort) => sort.ColumnId === column.ColumnId)[0]))) {
+                    layout.ColumnSorts.filter((sort) => sort.ColumnId === column.columnId)[0]))) {
         }
         //dragging things on the first column, from any other column
         if (dragSource != droppableIds_1.LayoutEditorDroppableIds.ColumnList &&

package/src/View/Layout/Wizard/LayoutEditor/index.js

@@ -88,7 +88,7 @@ exports.LayoutEditor = React.memo((props) => {
     const { layout } = state;
     const allColumnsMap = React.useMemo(() => {
         return allColumns.reduce((acc, col) => {
-            acc[col.ColumnId] = col;
+            acc[col.columnId] = col;
             return acc;
         }, {});
     }, [allColumns]);
@@ -99,7 +99,7 @@ exports.LayoutEditor = React.memo((props) => {
         return col;
     })
         .concat(allColumns.filter((col) => {
-        return !tmpMap[col.ColumnId];
+        return !tmpMap[col.columnId];
     }))
         .filter((c) => c));
     const setLayout = (layout) => {
@@ -118,7 +118,7 @@ exports.LayoutEditor = React.memo((props) => {
     }, [props.layout]);
     const visibleColumnsMap = React.useMemo(() => {
         return allColumns.reduce((acc, col) => {
-            acc[col.ColumnId] = layout.Columns.indexOf(col.ColumnId) != -1 ? col : null;
+            acc[col.columnId] = layout.Columns.indexOf(col.columnId) != -1 ? col : null;
             return acc;
         }, {});
     }, [layout, allColumns]);
@@ -126,7 +126,7 @@ exports.LayoutEditor = React.memo((props) => {
         return Object.keys(layout.AggregationColumns || {}).reduce((acc, colId) => {
             let fn = layout.AggregationColumns[colId];
             if (typeof fn === 'boolean') {
-                fn = allColumnsMap[colId].AggregationFunction;
+                fn = allColumnsMap[colId].aggregationFunction;
             }
             acc[colId] = fn;
             return acc;
@@ -145,8 +145,8 @@ exports.LayoutEditor = React.memo((props) => {
     const setColumnVisibility = (c, visible) => {
         const newLayout = visible
             ? Object.assign(Object.assign({}, layout), { Columns: columnList
-                    .filter((col) => visibleColumnsMap[col.ColumnId] || col.ColumnId === c.ColumnId)
-                    .map((c) => c.ColumnId) }) : Object.assign(Object.assign({}, layout), { Columns: layout.Columns.filter((colId) => colId !== c.ColumnId) });
+                    .filter((col) => visibleColumnsMap[col.columnId] || col.columnId === c.columnId)
+                    .map((c) => c.columnId) }) : Object.assign(Object.assign({}, layout), { Columns: layout.Columns.filter((colId) => colId !== c.columnId) });
         const previousGroupCols = getAgGridGroupAutoColumn(layout);
         const currentGroupCols = getAgGridGroupAutoColumn(newLayout);
         if (previousGroupCols.length !== currentGroupCols.length) {
@@ -172,7 +172,7 @@ exports.LayoutEditor = React.memo((props) => {
         }
         if (source.droppableId === droppableIds_1.LayoutEditorDroppableIds.ColumnList) {
             source.column = columnList[source.index];
-            source.columnId = source.column.ColumnId;
+            source.columnId = source.column.columnId;
         }
         if (destination.droppableId === droppableIds_1.LayoutEditorDroppableIds.ColumnList) {
             onDragEndRef.current.columnList(result);
@@ -192,7 +192,7 @@ exports.LayoutEditor = React.memo((props) => {
         const dragSource = source.droppableId;
         const column = dragSource === droppableIds_1.LayoutEditorDroppableIds.ColumnList ? allColumnsMap[draggableId] : null;
         const invalidSourceForColumns = source.droppableId !== droppableIds_1.LayoutEditorDroppableIds.ColumnList;
-        const dropDisabledOnColumns = !column || !column.Moveable || invalidSourceForColumns;
+        const dropDisabledOnColumns = !column || !column.moveable || invalidSourceForColumns;
         dispatch({
             type: reducer_1.LayoutEditorActions.SET_DROP_DISABLED_ON_COLUMNS,
             payload: dropDisabledOnColumns,
@@ -203,37 +203,37 @@ exports.LayoutEditor = React.memo((props) => {
         });
         const columnAlreadySorted = column &&
             layout.ColumnSorts &&
-            !!layout.ColumnSorts.filter((c) => c.ColumnId === column.ColumnId)[0];
+            !!layout.ColumnSorts.filter((c) => c.ColumnId === column.columnId)[0];
         const invalidSourceForSort = dragSource !== droppableIds_1.LayoutEditorDroppableIds.ColumnList &&
             dragSource !== droppableIds_1.LayoutEditorDroppableIds.ColumnSortList;
-        const disableDropOnSort = invalidSourceForSort || columnAlreadySorted || (column && !column.Sortable);
+        const disableDropOnSort = invalidSourceForSort || columnAlreadySorted || (column && !column.sortable);
         dispatch({
             type: reducer_1.LayoutEditorActions.SET_DROP_DISABLED_ON_SORT,
             payload: !!disableDropOnSort,
         });
         const columnAlreadyRowGrouped = column && layout.RowGroupedColumns
-            ? !!layout.RowGroupedColumns.filter((colId) => colId === column.ColumnId)[0]
+            ? !!layout.RowGroupedColumns.filter((colId) => colId === column.columnId)[0]
             : false;
         const invalidSourceForRowGroups = dragSource !== droppableIds_1.LayoutEditorDroppableIds.ColumnList &&
             dragSource !== droppableIds_1.LayoutEditorDroppableIds.RowGroupsList;
-        const disableDropOnRowGroups = invalidSourceForRowGroups || columnAlreadyRowGrouped || (column && !column.Groupable);
+        const disableDropOnRowGroups = invalidSourceForRowGroups || columnAlreadyRowGrouped || (column && !column.groupable);
         dispatch({
             type: reducer_1.LayoutEditorActions.SET_DROP_DISABLED_ON_ROW_GROUPS,
             payload: !!disableDropOnRowGroups,
         });
         const columnAlreadyPivoted = column && layout.PivotColumns
-            ? !!layout.PivotColumns.filter((colId) => colId === column.ColumnId)[0]
+            ? !!layout.PivotColumns.filter((colId) => colId === column.columnId)[0]
             : false;
         const invalidSourceForPivot = dragSource !== droppableIds_1.LayoutEditorDroppableIds.ColumnList &&
             dragSource !== droppableIds_1.LayoutEditorDroppableIds.PivotList;
-        const disableDropOnPivot = invalidSourceForPivot || columnAlreadyPivoted || (column && !column.Pivotable);
+        const disableDropOnPivot = invalidSourceForPivot || columnAlreadyPivoted || (column && !column.pivotable);
         dispatch({
             type: reducer_1.LayoutEditorActions.SET_DROP_DISABLED_ON_PIVOT,
             payload: !!disableDropOnPivot,
         });
     }, [state, layout]);
     const onColumnOrderChange = react_1.useCallback((columns) => {
-        setLayout(Object.assign(Object.assign({}, layout), { Columns: columns.filter((c) => visibleColumnsMap[c.ColumnId]).map((c) => c.ColumnId) }));
+        setLayout(Object.assign(Object.assign({}, layout), { Columns: columns.filter((c) => visibleColumnsMap[c.columnId]).map((c) => c.columnId) }));
         setColumnList(columns);
     }, [visibleColumnsMap, layout]);
     const onColumnSortsChange = react_1.useCallback((ColumnSorts) => {
@@ -257,16 +257,16 @@ exports.LayoutEditor = React.memo((props) => {
                     }, getItemStyle: (c, snapshot, draggableStyle) => {
                         return getItemStyle_1.getItemStyle(c, layout, state.dragSource, snapshot, draggableStyle);
                     }, columns: columnList, isDropDisabled: state.dropDisabledOnColumns, onColumnOrderChange: onColumnOrderChange, renderItem: (c) => {
-                        const visible = !!visibleColumnsMap[c.ColumnId];
-                        const aggregate = !!aggregationColumnsMap[c.ColumnId];
+                        const visible = !!visibleColumnsMap[c.columnId];
+                        const aggregate = !!aggregationColumnsMap[c.columnId];
                         // enable aggregation if there are row groups or pivoting is enabled
                         //  const aggregateEnabled =
                         //    (layout.RowGroupedColumns && layout.RowGroupedColumns.length) || layout.EnablePivot;
                         // JW: Not sure we do - why not just make it always visible as we ignore if if not required.
                         const aggregateEnabled = true;
-                        const customHeader = headerColumnsMap[c.ColumnId];
-                        const initialHeader = api.internalApi.getUserDefinedHeaderName(c.ColumnId);
-                        return (React.createElement(rebass_1.Flex, { flexDirection: "column", alignItems: "stretch", "data-name": "drag-item", "data-col-id": c.ColumnId },
+                        const customHeader = headerColumnsMap[c.columnId];
+                        const initialHeader = api.internalApi.getUserDefinedHeaderName(c.columnId);
+                        return (React.createElement(rebass_1.Flex, { flexDirection: "column", alignItems: "stretch", "data-name": "drag-item", "data-col-id": c.columnId },
                             React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", backgroundColor: "secondary", color: "text-on-secondary" },
                                 React.createElement(rebass_1.Flex, { flex: 1, alignItems: "center" },
                                     React.createElement(rebass_1.Box, { ml: 2, mr: 2 },
@@ -279,18 +279,18 @@ exports.LayoutEditor = React.memo((props) => {
                                                 source: 'ContextMenu',
                                             });
                                         } }),
-                                    c.ColumnGroup && c.ColumnGroup.GroupCount > 1 ? (React.createElement(rebass_1.Box, { ml: 2, padding: 1, style: {
+                                    c.columnGroup && c.columnGroup.groupCount > 1 ? (React.createElement(rebass_1.Box, { ml: 2, padding: 1, style: {
                                             borderRadius: 'var(--ab__border-radius)',
                                             background: 'var(--ab-color-defaultbackground)',
                                             color: 'var(--ab-color-text-on-defaultbackground)',
                                         } },
                                         "Group: ",
-                                        c.ColumnGroup.FriendlyName)) : null),
-                                React.createElement(CheckBox_1.CheckBox, { title: "Visible", readOnly: !c.Hideable && visible, checked: visible, mx: 2, style: {
+                                        c.columnGroup.friendlyName)) : null),
+                                React.createElement(CheckBox_1.CheckBox, { title: "Visible", readOnly: !c.hideable && visible, checked: visible, mx: 2, style: {
                                         whiteSpace: 'nowrap',
                                     }, onChange: setColumnVisibility.bind(null, c) }, "Visible")),
                             React.createElement(rebass_1.Flex, { padding: 2, flexDirection: "column" },
-                                React.createElement(ColumnLabels, { showTitle: true, Sortable: c.Sortable, Filterable: c.Filterable, Moveable: c.Moveable, Pivotable: c.Pivotable, Groupable: c.Groupable, Aggregatable: c.Aggregatable }, ' '),
+                                React.createElement(ColumnLabels, { showTitle: true, sortable: c.sortable, filterable: c.filterable, moveable: c.moveable, pivotable: c.pivotable, groupable: c.groupable, aggregatable: c.aggregatable }, ' '),
                                 React.createElement(rebass_1.Flex, { flexDirection: "row", mt: 2 },
                                     React.createElement(rebass_1.Flex, { flex: 3, alignItems: "baseline" },
                                         React.createElement(rebass_1.Text, { fontSize: 3, mr: 2 }, "Header:"),
@@ -298,27 +298,27 @@ exports.LayoutEditor = React.memo((props) => {
                                                 const newTextValue = event.target.value;
                                                 const columnHeaders = Object.assign({}, layout.ColumnHeadersMap) || {};
                                                 if (StringExtensions_1.default.IsNullOrEmptyOrWhiteSpace(newTextValue)) {
-                                                    delete columnHeaders[c.ColumnId];
+                                                    delete columnHeaders[c.columnId];
                                                 }
                                                 else {
-                                                    columnHeaders[c.ColumnId] = newTextValue;
+                                                    columnHeaders[c.columnId] = newTextValue;
                                                 }
                                                 setLayout(Object.assign(Object.assign({}, layout), { ColumnHeadersMap: columnHeaders }));
                                             } })),
-                                    React.createElement(rebass_1.Flex, { flex: 2 }, c.Aggregatable &&
-                                        c.AvailableAggregationFunctions &&
-                                        c.AvailableAggregationFunctions.length ? (React.createElement(CheckBox_1.CheckBox, { key: "checkbox", ml: 3, my: 0, disabled: !aggregateEnabled, onChange: (checked) => {
+                                    React.createElement(rebass_1.Flex, { flex: 2 }, c.aggregatable &&
+                                        c.availableAggregationFunctions &&
+                                        c.availableAggregationFunctions.length ? (React.createElement(CheckBox_1.CheckBox, { key: "checkbox", ml: 3, my: 0, disabled: !aggregateEnabled, onChange: (checked) => {
                                             let aggCols = layout.AggregationColumns || {};
                                             // const aggCols = new Set(layout.AggregationColumns);
                                             if (checked) {
-                                                let aggFunc = c.AggregationFunction;
-                                                if (!aggFunc && c.AvailableAggregationFunctions) {
-                                                    aggFunc = c.AvailableAggregationFunctions[0];
+                                                let aggFunc = c.aggregationFunction;
+                                                if (!aggFunc && c.availableAggregationFunctions) {
+                                                    aggFunc = c.availableAggregationFunctions[0];
                                                 }
-                                                aggCols[c.ColumnId] = aggFunc;
+                                                aggCols[c.columnId] = aggFunc;
                                             }
                                             else {
-                                                delete aggCols[c.ColumnId];
+                                                delete aggCols[c.columnId];
                                                 if (!Object.keys(aggCols).length) {
                                                     aggCols = null;
                                                 }
@@ -328,7 +328,7 @@ exports.LayoutEditor = React.memo((props) => {
                                         "Aggregate",
                                         React.createElement(DropdownButton_1.default, { style: {
                                                 visibility: aggregate ? 'visible' : 'hidden',
-                                            }, ml: 2, padding: 0, columns: ['label'], variant: "text", items: c.AvailableAggregationFunctions.map((fnName) => {
+                                            }, ml: 2, padding: 0, columns: ['label'], variant: "text", items: c.availableAggregationFunctions.map((fnName) => {
                                                 return {
                                                     label: fnName,
                                                     onClick: () => {
@@ -336,11 +336,11 @@ exports.LayoutEditor = React.memo((props) => {
                                                         if (!aggCols) {
                                                             return;
                                                         }
-                                                        aggCols[c.ColumnId] = fnName;
+                                                        aggCols[c.columnId] = fnName;
                                                         setLayout(Object.assign(Object.assign({}, layout), { AggregationColumns: aggCols }));
                                                     },
                                                 };
-                                            }) }, aggregationColumnsMap[c.ColumnId]))) : null)))));
+                                            }) }, aggregationColumnsMap[c.columnId]))) : null)))));
                     } })),
             React.createElement(ListPanel, { header: "Sorting", className: "ab-LayoutEditor__ColumnSortListPanel" },
                 React.createElement(ColumnSortList_1.ColumnSortList, { columnSorts: layout.ColumnSorts, onColumnSortsChange: onColumnSortsChange, isDropDisabled: state.dropDisabledOnSort, onReady: (dragEnd) => {
@@ -356,7 +356,7 @@ exports.LayoutEditor = React.memo((props) => {
                             React.createElement(rebass_1.Box, { ml: 2, mr: 3 },
                                 React.createElement(icons_1.Icon, { name: "drag", size: 30 })),
                             React.createElement(rebass_1.Flex, { flex: "1", flexDirection: "row", alignItems: "center" },
-                                column.FriendlyName,
+                                column.friendlyName,
                                 " [",
                                 c.SortOrder,
                                 "]"),
@@ -381,7 +381,7 @@ exports.LayoutEditor = React.memo((props) => {
                         return (React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", "data-name": "drag-item" },
                             React.createElement(rebass_1.Box, { ml: 2, mr: 3 },
                                 React.createElement(icons_1.Icon, { name: "drag", size: 30 })),
-                            React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", flex: 1 }, column.FriendlyName),
+                            React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", flex: 1 }, column.friendlyName),
                             React.createElement(SimpleButton_1.default, { variant: "text", onClick: (e) => {
                                     e.stopPropagation();
                                     clear();
@@ -400,7 +400,7 @@ exports.LayoutEditor = React.memo((props) => {
                         return (React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", "data-name": "drag-item" },
                             React.createElement(rebass_1.Box, { ml: 2, mr: 3 },
                                 React.createElement(icons_1.Icon, { name: "drag", size: 30 })),
-                            React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", flex: 1 }, column.FriendlyName),
+                            React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", flex: 1 }, column.friendlyName),
                             React.createElement(SimpleButton_1.default, { variant: "text", onClick: (e) => {
                                     e.stopPropagation();
                                     clear();
@@ -424,5 +424,5 @@ exports.LayoutEditor = React.memo((props) => {
                         Groupable: 'Can form a row group',
                         Moveable: 'Is draggable and movable',
                         Pivotable: 'Eligible for pivoting',
-                    }, Sortable: true, Filterable: true, Moveable: true, Pivotable: true, Groupable: true, Aggregatable: true })))));
+                    }, sortable: true, filterable: true, moveable: true, pivotable: true, groupable: true, aggregatable: true })))));
 }, areEqual);

package/src/View/PlusMinus/PlusMinusPopup.js

@@ -45,7 +45,7 @@ class PlusMinusPopupComponent extends React.Component {
                     let column = this.props.popupParams.column;
                     let plusMinus = ObjectFactory_1.ObjectFactory.CreateEmptyPlusMinusNudge();
                     plusMinus.Scope = {
-                        ColumnIds: [column.ColumnId],
+                        ColumnIds: [column.columnId],
                     };
                     this.setState({
                         editedAdaptableObject: plusMinus,

package/src/View/PlusMinus/PlusMinusSummary.js

@@ -40,7 +40,7 @@ class PlusMinusSummaryComponent extends React.Component {
     onNew() {
         let configEntity = ObjectFactory_1.ObjectFactory.CreateEmptyPlusMinusNudge();
         configEntity.Scope = {
-            ColumnIds: [this.props.summarisedColumn.ColumnId],
+            ColumnIds: [this.props.summarisedColumn.columnId],
         };
         this.setState({
             editedAdaptableObject: configEntity,