@adaptabletools/adaptable 12.0.6 → 12.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable",
-  "version": "12.0.6",
+  "version": "12.0.7",
   "description": "Powerful data-agnostic HTML5 datagrid add-on that sits on top of an underlying grid component and provides all the rich functionality that advanced users expect from their DataGrids and Data Tables",
   "keywords": [
     "web-components",

package/publishTimestamp.d.ts

@@ -1,2 +1,2 @@
-declare const _default: 1657449987893;
+declare const _default: 1657722189050;
 export default _default;

package/publishTimestamp.js

@@ -1,3 +1,3 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = 1657449987893;
+exports.default = 1657722189050;

package/src/Api/GridApi.d.ts

@@ -261,8 +261,9 @@ export interface GridApi {
      * Retrieves Formatted Value for a given Raw Value in given Column
      * @param columnId ColumnId to lookup
      * @param rawValue Raw Value
+     * @param rowNode Node containig the Column
      */
-    getFormattedValueFromRawValue(rowNode: RowNode, columnId: string, rawValue: any): string | undefined;
+    getDisplayValueFromRawValue(rowNode: RowNode, columnId: string, rawValue: any): string | undefined;
     /**
      * Retrieves Display Value for Cell in given Row and Column
      * @param rowNode Row to use

package/src/Api/Implementation/GridApiImpl.d.ts

@@ -65,7 +65,7 @@ export declare class GridApiImpl extends ApiBase implements GridApi {
     getGridCellFromRowNode(rowNode: RowNode, columnId: string): GridCell | undefined;
     getRawValueFromRowNode(rowNode: RowNode, columnId: string): any | undefined;
     getDisplayValueFromRowNode(rowNode: RowNode, columnId: string): any | undefined;
-    getFormattedValueFromRawValue(rowNode: RowNode, columnId: string, rawValue: any): string | undefined;
+    getDisplayValueFromRawValue(rowNode: RowNode, columnId: string, rawValue: any): string | undefined;
     getNormalisedValueFromRowNode(rowNode: RowNode, columnId: string): any | undefined;
     getRowNodesForPrimaryKeys(primaryKeyValues: any[]): RowNode[];
     getRowNodeForPrimaryKey(primaryKeyValue: any): RowNode;

package/src/Api/Implementation/GridApiImpl.js

@@ -200,7 +200,7 @@ class GridApiImpl extends ApiBase_1.ApiBase {
     getDisplayValueFromRowNode(rowNode, columnId) {
         return this.adaptable.getDisplayValueFromRowNode(rowNode, columnId);
     }
-    getFormattedValueFromRawValue(rowNode, columnId, rawValue) {
+    getDisplayValueFromRawValue(rowNode, columnId, rawValue) {
         return this.adaptable.getDisplayValueFromRawValue(rowNode, columnId, rawValue);
     }
     getNormalisedValueFromRowNode(rowNode, columnId) {

package/src/Api/Implementation/InternalApiImpl.js

@@ -390,6 +390,9 @@ class InternalApiImpl extends ApiBase_1.ApiBase {
     getQueryPreviewData() {
         var _a;
         const firstRowNode = this.adaptable.api.gridApi.getFirstRowNode();
+        if (firstRowNode == undefined) {
+            return {};
+        }
         const firstRowData = (_a = Object.assign({}, firstRowNode === null || firstRowNode === void 0 ? void 0 : firstRowNode.data)) !== null && _a !== void 0 ? _a : {};
         // handle CalcCols which are not persisted in the rowModel
         this.adaptable.api.calculatedColumnApi.getAllCalculatedColumn().forEach((calculatedColumn) => {

package/src/Strategy/AlertModule.js

@@ -32,8 +32,8 @@ class AlertModule extends AdaptableModuleBase_1.AdaptableModuleBase {
                 'formattedValue') {
                 const { oldValue, newValue, rowNode } = cellDataChangedInfo;
                 const columnId = cellDataChangedInfo.column.columnId;
-                const oldFormattedValue = this.api.gridApi.getFormattedValueFromRawValue(rowNode, columnId, oldValue);
-                const newFormattedValue = this.api.gridApi.getFormattedValueFromRawValue(rowNode, columnId, newValue);
+                const oldFormattedValue = this.api.gridApi.getDisplayValueFromRawValue(rowNode, columnId, oldValue);
+                const newFormattedValue = this.api.gridApi.getDisplayValueFromRawValue(rowNode, columnId, newValue);
                 if (oldFormattedValue === newFormattedValue) {
                     // if the formattedValues are identical, then no alert is fired
                     return;

package/src/Strategy/FlashingCellModule.js

@@ -31,8 +31,8 @@ class FlashingCellModule extends AdaptableModuleBase_1.AdaptableModuleBase {
                 'formattedValue') {
                 const { oldValue, newValue, rowNode } = cellDataChangedInfo;
                 const columnId = cellDataChangedInfo.column.columnId;
-                const oldFormattedValue = this.api.gridApi.getFormattedValueFromRawValue(rowNode, columnId, oldValue);
-                const newFormattedValue = this.api.gridApi.getFormattedValueFromRawValue(rowNode, columnId, newValue);
+                const oldFormattedValue = this.api.gridApi.getDisplayValueFromRawValue(rowNode, columnId, oldValue);
+                const newFormattedValue = this.api.gridApi.getDisplayValueFromRawValue(rowNode, columnId, newValue);
                 if (oldFormattedValue === newFormattedValue) {
                     // if the formattedValues are identical, then no alert is fired
                     return;

package/src/Utilities/Services/ReportService.js

@@ -339,7 +339,7 @@ class ReportService {
         return type === 'rawValue'
             ? cellRawValue
             : // type === formattedValue
-                this.adaptableApi.gridApi.getFormattedValueFromRawValue(rowNode, columnId, cellRawValue);
+                this.adaptableApi.gridApi.getDisplayValueFromRawValue(rowNode, columnId, cellRawValue);
     }
     computeCellExportValueFormat(columnDataType) {
         const exportOptions = this.adaptableApi.internalApi.getAdaptableOptions().exportOptions;

package/src/Utilities/Services/RowEditService.js

@@ -189,7 +189,10 @@ class RowEditService {
                     adaptableApi,
                 })
                 : Object.assign({}, formData);
-            adaptableApi.gridApi.addGridData([newRowData], { addIndex: 0 });
+            const config = {
+                addIndex: 0,
+            };
+            adaptableApi.gridApi.addGridData([newRowData], config);
         }
     }
 }

package/src/View/AdaptableWizardView/AdaptableConfigurationDialog/AdaptableOptionsForm.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { AdaptableOptions } from '../../../types';
+interface AdaptableOptionsFormOptions {
+    adaptableOptions: AdaptableOptions;
+    onChangeadaptableOptions: (adaptableOptions: AdaptableOptions) => void;
+}
+declare const AdaptableOptionsForm: (props: AdaptableOptionsFormOptions) => JSX.Element;
+export default AdaptableOptionsForm;

package/src/View/AdaptableWizardView/AdaptableConfigurationDialog/{ConfigurationForm.js → AdaptableOptionsForm.js}

@@ -8,17 +8,13 @@ const HelpBlock_1 = tslib_1.__importDefault(require("../../../components/HelpBlo
 const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
 const rebass_1 = require("rebass");
 const DefaultAdaptableOptions_1 = require("../../../Utilities/Defaults/DefaultAdaptableOptions");
-const ConfigurationForm = (props) => {
-    var _a, _b, _c;
+const AdaptableOptionsForm = (props) => {
+    var _a, _b;
     let abOptions = props.adaptableOptions;
     const layoutOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.layoutOptions), abOptions.layoutOptions);
     const generalOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.generalOptions), abOptions.generalOptions);
     const adaptableQLOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.adaptableQLOptions), abOptions.adaptableQLOptions);
-    const userInterfaceOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.userInterfaceOptions), abOptions.userInterfaceOptions);
-    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 gridOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.gridOptions), abOptions.gridOptions);
     return (React.createElement(React.Fragment, null,
         React.createElement(HelpBlock_1.default, null, "Base Options"),
         React.createElement(FormLayout_1.default, { margin: 2, columns: [{ name: 'label', style: { textAlign: 'start' } }, { name: 'children' }] },
@@ -36,38 +32,6 @@ const ConfigurationForm = (props) => {
                         abOptions.generalOptions.showMissingPrimaryKeyAlert = showMissingPrimaryKeyWarning;
                         props.onChangeadaptableOptions(abOptions);
                     } }))),
-        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: gridOptions.enableRangeSelection, onChange: (enableRangeSelection) => {
-                        abOptions = Object.assign({}, abOptions);
-                        abOptions.gridOptions = Object.assign({}, abOptions.gridOptions);
-                        abOptions.gridOptions.enableRangeSelection = enableRangeSelection;
-                        props.onChangeadaptableOptions(abOptions);
-                    } })),
-            React.createElement(FormLayout_1.FormRow, { label: "Show Quick Filter" },
-                React.createElement(CheckBox_1.CheckBox, { checked: (_c = gridOptions.defaultColDef) === null || _c === void 0 ? void 0 : _c.floatingFilter, onChange: (floatingFilter) => {
-                        abOptions = Object.assign({}, abOptions);
-                        abOptions.gridOptions = Object.assign({}, abOptions.gridOptions);
-                        abOptions.gridOptions.defaultColDef = {
-                            floatingFilter,
-                        };
-                        props.onChangeadaptableOptions(abOptions);
-                    } })),
-            React.createElement(FormLayout_1.FormRow, { label: "Suppress Column Virtualisation" },
-                React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.suppressColumnVirtualisation, onChange: (suppressColumnVirtualisation) => {
-                        abOptions = Object.assign({}, abOptions);
-                        abOptions.gridOptions = Object.assign({}, abOptions.gridOptions);
-                        abOptions.gridOptions.suppressColumnVirtualisation = suppressColumnVirtualisation;
-                        props.onChangeadaptableOptions(abOptions);
-                    } })),
-            React.createElement(FormLayout_1.FormRow, { label: "Show Column Menu Button" },
-                React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.suppressMenuHide, onChange: (suppressMenuHide) => {
-                        abOptions = Object.assign({}, abOptions);
-                        abOptions.gridOptions = Object.assign({}, abOptions.gridOptions);
-                        abOptions.gridOptions.suppressMenuHide = suppressMenuHide;
-                        props.onChangeadaptableOptions(abOptions);
-                    } }))),
         React.createElement(HelpBlock_1.default, null, "Layout Options"),
         React.createElement(FormLayout_1.default, { margin: 2, columns: [{ name: 'children' }, { name: 'label', style: { textAlign: 'start' } }] },
             React.createElement(FormLayout_1.FormRow, { label: "Auto Save Layouts" },
@@ -134,4 +98,4 @@ const ConfigurationForm = (props) => {
                         props.onChangeadaptableOptions(abOptions);
                     }, value: filterOptions.maxFilterValuesToDisplay, marginRight: 3 })))));
 };
-exports.default = ConfigurationForm;
+exports.default = AdaptableOptionsForm;

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

@@ -7,7 +7,8 @@ const react_1 = require("react");
 const StringExtensions_1 = tslib_1.__importDefault(require("../../../Utilities/Extensions/StringExtensions"));
 const OnePageWizards_1 = require("../../Wizard/OnePageWizards");
 const ConfigurationWizardColumnsStep_1 = require("./ConfigurationWizardColumnsStep");
-const ConfigurationForm_1 = tslib_1.__importDefault(require("./ConfigurationForm"));
+const GridOptionsForm_1 = tslib_1.__importDefault(require("./GridOptionsForm"));
+const AdaptableOptionsForm_1 = tslib_1.__importDefault(require("./AdaptableOptionsForm"));
 const ConfigurationWizard = (props) => {
     const [isPrimaryKeySelected, setIsValid] = React.useState(true);
     const [adaptableOptions, setAdaptableOptions] = react_1.useState(props.adaptableOptions);
@@ -50,7 +51,7 @@ const ConfigurationWizard = (props) => {
     let sections = [
         {
             title: 'Columns',
-            details: 'Configure Adaptable',
+            details: 'Configure Columns',
             isValid: () => {
                 if (!isPrimaryKeySelected) {
                     return 'Primary key column must be included';
@@ -65,10 +66,33 @@ const ConfigurationWizard = (props) => {
             title: 'Adaptable Options',
             details: 'Configure Adaptable Options',
             isValid: () => (adaptableOptions.adaptableId ? true : 'Adaptable ID is required'),
-            render: () => (React.createElement(ConfigurationForm_1.default, { adaptableOptions: adaptableOptions, onChangeadaptableOptions: (abOptions) => {
+            render: () => (React.createElement(AdaptableOptionsForm_1.default, { adaptableOptions: adaptableOptions, onChangeadaptableOptions: (abOptions) => {
                     setAdaptableOptions(abOptions);
                 } })),
         },
+        {
+            title: 'Grid Options',
+            details: 'Configure AG Grid Options',
+            render: () => (React.createElement(GridOptionsForm_1.default, { adaptableOptions: adaptableOptions, onChangeadaptableOptions: (abOptions) => {
+                    setAdaptableOptions(abOptions);
+                } })),
+        },
+        // JW - I would like at some point to do a page of Entitlements
+        // to show all the Modules and let users select which are Full, ReadOnly or Hidden
+        /*
+        {
+          title: 'Entitlements',
+          details: 'Configure Entitlements',
+          render: () => (
+            <EntitlementsForm
+              adaptableOptions={adaptableOptions}
+              onChangeadaptableOptions={(abOptions) => {
+                setAdaptableOptions(abOptions);
+              }}
+            />
+          ),
+        },
+        */
     ];
     if (props.startSections) {
         sections = [

package/src/View/AdaptableWizardView/AdaptableConfigurationDialog/{ConfigurationForm.d.ts → EntitlementsForm.d.ts}

@@ -1,8 +1,8 @@
 /// <reference types="react" />
 import { AdaptableOptions } from '../../../types';
-interface ConfigurationFormOptions {
+interface EntitlementsFormOptions {
     adaptableOptions: AdaptableOptions;
     onChangeadaptableOptions: (adaptableOptions: AdaptableOptions) => void;
 }
-declare const ConfigurationForm: (props: ConfigurationFormOptions) => JSX.Element;
-export default ConfigurationForm;
+declare const EntitlementsForm: (props: EntitlementsFormOptions) => JSX.Element;
+export default EntitlementsForm;

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

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
+const HelpBlock_1 = tslib_1.__importDefault(require("../../../components/HelpBlock"));
+const DefaultAdaptableOptions_1 = require("../../../Utilities/Defaults/DefaultAdaptableOptions");
+const EntitlementsForm = (props) => {
+    let abOptions = props.adaptableOptions;
+    const entitlementOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.entitlementOptions), abOptions.entitlementOptions);
+    const gridOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.gridOptions), abOptions.gridOptions);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(HelpBlock_1.default, null, "EntitlementOptions Options"),
+        React.createElement(FormLayout_1.default, { margin: 2, columns: [{ name: 'children' }, { name: 'label', style: { textAlign: 'start' } }] },
+            React.createElement(FormLayout_1.FormRow, { label: "Entitlements to be set here" }))));
+};
+exports.default = EntitlementsForm;

package/src/View/AdaptableWizardView/AdaptableConfigurationDialog/GridOptionsForm.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { AdaptableOptions } from '../../../types';
+interface GridOptionsFormOptions {
+    adaptableOptions: AdaptableOptions;
+    onChangeadaptableOptions: (adaptableOptions: AdaptableOptions) => void;
+}
+declare const GridOptionsForm: (props: GridOptionsFormOptions) => JSX.Element;
+export default GridOptionsForm;

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

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
+const CheckBox_1 = require("../../../components/CheckBox");
+const HelpBlock_1 = tslib_1.__importDefault(require("../../../components/HelpBlock"));
+const DefaultAdaptableOptions_1 = require("../../../Utilities/Defaults/DefaultAdaptableOptions");
+const GridOptionsForm = (props) => {
+    var _a;
+    let abOptions = props.adaptableOptions;
+    const gridOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions.gridOptions), abOptions.gridOptions);
+    return (React.createElement(React.Fragment, null,
+        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: "Show ToolPanel" },
+                React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.sideBar == true, onChange: (addSideBar) => {
+                        abOptions = Object.assign({}, abOptions);
+                        abOptions.gridOptions = Object.assign({}, abOptions.gridOptions);
+                        abOptions.gridOptions.sideBar = addSideBar;
+                        props.onChangeadaptableOptions(abOptions);
+                    } })),
+            React.createElement(FormLayout_1.FormRow, { label: "Enable Range Selection" },
+                React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.enableRangeSelection, onChange: (enableRangeSelection) => {
+                        abOptions = Object.assign({}, abOptions);
+                        abOptions.gridOptions = Object.assign({}, abOptions.gridOptions);
+                        abOptions.gridOptions.enableRangeSelection = enableRangeSelection;
+                        props.onChangeadaptableOptions(abOptions);
+                    } })),
+            React.createElement(FormLayout_1.FormRow, { label: "Show Quick Filter" },
+                React.createElement(CheckBox_1.CheckBox, { checked: (_a = gridOptions.defaultColDef) === null || _a === void 0 ? void 0 : _a.floatingFilter, onChange: (floatingFilter) => {
+                        abOptions = Object.assign({}, abOptions);
+                        abOptions.gridOptions = Object.assign({}, abOptions.gridOptions);
+                        abOptions.gridOptions.defaultColDef = {
+                            floatingFilter,
+                        };
+                        props.onChangeadaptableOptions(abOptions);
+                    } })),
+            React.createElement(FormLayout_1.FormRow, { label: "Suppress Column Virtualisation" },
+                React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.suppressColumnVirtualisation, onChange: (suppressColumnVirtualisation) => {
+                        abOptions = Object.assign({}, abOptions);
+                        abOptions.gridOptions = Object.assign({}, abOptions.gridOptions);
+                        abOptions.gridOptions.suppressColumnVirtualisation = suppressColumnVirtualisation;
+                        props.onChangeadaptableOptions(abOptions);
+                    } })),
+            React.createElement(FormLayout_1.FormRow, { label: "Show Column Menu Button" },
+                React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.suppressMenuHide, onChange: (suppressMenuHide) => {
+                        abOptions = Object.assign({}, abOptions);
+                        abOptions.gridOptions = Object.assign({}, abOptions.gridOptions);
+                        abOptions.gridOptions.suppressMenuHide = suppressMenuHide;
+                        props.onChangeadaptableOptions(abOptions);
+                    } })))));
+};
+exports.default = GridOptionsForm;

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

@@ -324,7 +324,6 @@ const renderStringFormat = (data, _onChange, setFormatOption, scopedCustomFormat
     if (data.DisplayFormat.Formatter !== 'StringFormatter') {
         return null;
     }
-    console.log('formatters', scopedCustomFormatters);
     return (React.createElement(rebass_1.Box, { "data-name": 'format-column-display-format', padding: 2 },
         React.createElement(Tabs_1.Tabs, null,
             React.createElement(Tabs_1.Tabs.Tab, null, "Format"),

package/src/agGrid/Adaptable.js

@@ -1394,13 +1394,6 @@ class Adaptable {
             shouldUpdateHeaders = this.setupColumnHeader(colSetupInfo) || shouldUpdateHeaders;
         });
         isChanged = isChanged || shouldUpdateHeaders;
-        if (this.api.layoutApi.areExpandedRowGroupsSavedInLayouts() &&
-            ArrayExtensions_1.ArrayExtensions.IsNotNullOrEmpty(layout.ExpandedRowGroupValues)) {
-            this.expandRowGroupsForValues(layout.ExpandedRowGroupValues);
-        }
-        if (this.adaptableOptions.layoutOptions.displayRowGroups === 'expanded') {
-            this.expandAllRowGroups();
-        }
         if (isChanged) {
             // it's important we set pivot mode
             // before we set column state
@@ -1421,6 +1414,15 @@ class Adaptable {
             // so we figured out the following line fixes the issue
             // this.gridOptions.api.setColumnDefs(this.gridOptions.api.getColumnDefs()); //TODO find a solution for weighted averages - column floating filters are not showing
             GridApi_setColumnDefs.call(this.gridOptions.api, this.gridOptions.api.getColumnDefs());
+            // these updates need to be at the end, the methods are based on the grid state/col defs
+            // the layout needs to be applied for them to work
+            if (this.api.layoutApi.areExpandedRowGroupsSavedInLayouts() &&
+                ArrayExtensions_1.ArrayExtensions.IsNotNullOrEmpty(layout.ExpandedRowGroupValues)) {
+                this.expandRowGroupsForValues(layout.ExpandedRowGroupValues);
+            }
+            if (this.adaptableOptions.layoutOptions.displayRowGroups === 'expanded') {
+                this.expandAllRowGroups();
+            }
             // this.updateColumnsIntoStore();// no longer needed
         }
         const colsToAutoSizeArray = Object.keys(colsToAutoSize);

package/src/agGrid/agGridHelper.js

@@ -162,9 +162,9 @@ class agGridHelper {
         const customFriendlyName = typeof columnFriendlyName === 'function'
             ? columnFriendlyName({ colId: colId, agColumn: agGridColumn })
             : null;
-        const FriendlyName = (customFriendlyName !== null && customFriendlyName !== void 0 ? customFriendlyName : isActionRowButtonColumn)
+        const FriendlyName = customFriendlyName !== null && customFriendlyName !== void 0 ? customFriendlyName : (isActionRowButtonColumn
             ? GeneralConstants_1.ADAPTABLE_ROW_ACTION_BUTTONS_FRIENDLY_NAME
-            : this.gridOptions.columnApi.getDisplayNameForColumn(agGridColumn, 'header');
+            : this.gridOptions.columnApi.getDisplayNameForColumn(agGridColumn, 'header'));
         if (!this.initialAgGridColDefs[colId]) {
             this.initialAgGridColDefs[colId] = Object.assign({}, agGridColumn.getUserProvidedColDef());
         }

package/src/components/ExpressionEditor/BaseEditorInput.js

@@ -40,6 +40,9 @@ function BaseEditorInput(props) {
     };
     const testRowNode = react_1.useMemo(() => {
         const firstRowNode = props.api.gridApi.getFirstRowNode();
+        if (!firstRowNode || !firstRowNode.data) {
+            return {};
+        }
         // clone the class instance to still keep the prototype methods
         return Object.assign(Object.create(Object.getPrototypeOf(firstRowNode)), firstRowNode);
     }, []);

package/src/components/ExpressionEditor/index.js

@@ -112,9 +112,9 @@ function ExpressionEditor(props) {
                     cursor: 'grab',
                     marginRight: 'var(--ab-space-1)',
                 }, data: `[${column.columnId}]`, "data-name": "column", icon: "drag" },
-                React.createElement(rebass_1.Flex, { flexDirection: "column", alignItems: "start" }, showColumnIds ? `[${column.columnId}]` : column.friendlyName)) }, column.dataType === 'Number' ? (React.createElement(Input_1.default, { type: "number", "data-name": "column-input", value: getColValue(column), onChange: (e) => setData(updateColValue(data, column, Number(e.target.value))), width: "100%", disabled: column.readOnly })) : column.dataType === 'String' ? (React.createElement(Input_1.default, { type: "text", "data-name": "column-input", value: getColValue(column), onChange: (e) => setData(updateColValue(data, column, e.target.value)), width: "100%", disabled: column.readOnly })) : column.dataType === 'Date' ? (React.createElement(AdaptableInput_1.default, { type: "date", "data-name": "column-input", value: getColDateValue(column), onChange: (e) => {
+                React.createElement(rebass_1.Flex, { flexDirection: "column", alignItems: "start" }, showColumnIds ? `[${column.columnId}]` : column.friendlyName)) }, column.dataType === 'Number' ? (React.createElement(Input_1.default, { type: "number", "data-name": "column-input", "data-value": column.columnId, value: getColValue(column), onChange: (e) => setData(updateColValue(data, column, Number(e.target.value))), width: "100%", disabled: column.readOnly })) : column.dataType === 'String' ? (React.createElement(Input_1.default, { type: "text", "data-name": "column-input", "data-value": column.columnId, value: getColValue(column), onChange: (e) => setData(updateColValue(data, column, e.target.value)), width: "100%", disabled: column.readOnly })) : column.dataType === 'Date' ? (React.createElement(AdaptableInput_1.default, { type: "date", "data-name": "column-input", "data-value": column.columnId, value: getColDateValue(column), onChange: (e) => {
                 setData(updateColValue(data, column, new Date(e.target.value)));
-            }, style: { width: '100%' }, disabled: column.readOnly })) : column.dataType === 'Boolean' ? (React.createElement(CheckBox_1.CheckBox, { "data-name": "column-input", checked: getColValue(column), onChange: (checked) => setData(updateColValue(data, column, checked)), disabled: column.readOnly })) : null))))));
+            }, style: { width: '100%' }, disabled: column.readOnly })) : column.dataType === 'Boolean' ? (React.createElement(CheckBox_1.CheckBox, { "data-name": "column-input", "data-value": column.columnId, checked: getColValue(column), onChange: (checked) => setData(updateColValue(data, column, checked)), disabled: column.readOnly })) : null))))));
     const namedQueries = (React.createElement("div", null, props.namedQueries.map((namedQuery) => (React.createElement(rebass_1.Flex, { key: namedQuery.Uuid, flexDirection: "column", alignItems: "start", style: {
             padding: 3,
             marginTop: 'var(--ab-space-2)',