@adaptabletools/adaptable-cjs 19.2.4 → 20.0.0-canary.1

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

@@ -12,41 +12,57 @@ const Tag_1 = require("../../../components/Tag");
 const ToggleGroup_1 = require("../../../components/Toggle/ToggleGroup");
 const Toggle_1 = require("../../../components/Toggle/Toggle");
 const renderFormatColumnSettingsSummary = (data) => {
-    var _a, _b, _c, _d;
     return (React.createElement(rebass_1.Box, { padding: 2 },
         React.createElement(rebass_1.Text, null,
             "Cell alignment ",
-            React.createElement(Tag_1.Tag, null, (_a = data.CellAlignment) !== null && _a !== void 0 ? _a : 'default')),
+            React.createElement(Tag_1.Tag, null, data.CellAlignment ?? 'default')),
         React.createElement(rebass_1.Text, { mt: 3 },
             "Data Rows ",
-            React.createElement(Tag_1.Tag, null, ((_b = data.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeDataRows) ? 'no' : 'yes')),
+            React.createElement(Tag_1.Tag, null, data.RowScope?.ExcludeDataRows ? 'no' : 'yes')),
         ' ',
         React.createElement(rebass_1.Text, { mt: 3 },
             "Group Rows ",
-            React.createElement(Tag_1.Tag, null, ((_c = data.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeGroupRows) ? 'no' : 'yes')),
+            React.createElement(Tag_1.Tag, null, data.RowScope?.ExcludeGroupRows ? 'no' : 'yes')),
         React.createElement(rebass_1.Text, { mt: 3 },
             "Summary Rows ",
-            React.createElement(Tag_1.Tag, null, ((_d = data.RowScope) === null || _d === void 0 ? void 0 : _d.ExcludeSummaryRows) ? 'no' : 'yes'))));
+            React.createElement(Tag_1.Tag, null, data.RowScope?.ExcludeSummaryRows ? 'no' : 'yes'))));
 };
 exports.renderFormatColumnSettingsSummary = renderFormatColumnSettingsSummary;
 const FormatColumnSettingsWizardSection = (props) => {
-    var _a, _b, _c;
     const { data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     const onCellAlignmentSelectChanged = (CellAlignment) => {
-        const newData = Object.assign(Object.assign({}, data), { CellAlignment });
+        const newData = { ...data, CellAlignment };
         if (CellAlignment === null) {
             delete newData.CellAlignment;
         }
         props.onChange(newData);
     };
     const onExcludeDataRowsChanged = (ExcludeDataRows) => {
-        props.onChange(Object.assign(Object.assign({}, data), { RowScope: Object.assign(Object.assign({}, data.RowScope), { ExcludeDataRows }) }));
+        props.onChange({
+            ...data,
+            RowScope: {
+                ...data.RowScope,
+                ExcludeDataRows,
+            },
+        });
     };
     const onExcludeGroupedRowsChanged = (ExcludeGroupedRows) => {
-        props.onChange(Object.assign(Object.assign({}, data), { RowScope: Object.assign(Object.assign({}, data.RowScope), { ExcludeGroupRows: ExcludeGroupedRows }) }));
+        props.onChange({
+            ...data,
+            RowScope: {
+                ...data.RowScope,
+                ExcludeGroupRows: ExcludeGroupedRows,
+            },
+        });
     };
     const onExcludeSummaryRowsChanged = (ExcludeSummaryRows) => {
-        props.onChange(Object.assign(Object.assign({}, data), { RowScope: Object.assign(Object.assign({}, data.RowScope), { ExcludeSummaryRows }) }));
+        props.onChange({
+            ...data,
+            RowScope: {
+                ...data.RowScope,
+                ExcludeSummaryRows,
+            },
+        });
     };
     return (React.createElement(Tabs_1.Tabs, null,
         React.createElement(Tabs_1.Tabs.Tab, null, "Settings"),
@@ -66,12 +82,12 @@ const FormatColumnSettingsWizardSection = (props) => {
                                     : onCellAlignmentSelectChanged(null) }))),
                     React.createElement(FormLayout_1.FormRow, { label: "Exclude Data Rows:" },
                         React.createElement(rebass_1.Flex, { alignItems: "center", marginLeft: 2 },
-                            React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-data-rows-checkbox", checked: (_a = data.RowScope) === null || _a === void 0 ? void 0 : _a.ExcludeDataRows, onChange: onExcludeDataRowsChanged, mr: 2 }))),
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-data-rows-checkbox", checked: data.RowScope?.ExcludeDataRows, onChange: onExcludeDataRowsChanged, mr: 2 }))),
                     React.createElement(FormLayout_1.FormRow, { label: "Exclude Group Rows:" },
                         React.createElement(rebass_1.Flex, { alignItems: "center", marginLeft: 2 },
-                            React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-grouped-rows-checkbox", checked: (_b = data.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeGroupRows, onChange: onExcludeGroupedRowsChanged, mr: 2 }))),
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-grouped-rows-checkbox", checked: data.RowScope?.ExcludeGroupRows, onChange: onExcludeGroupedRowsChanged, mr: 2 }))),
                     React.createElement(FormLayout_1.FormRow, { label: "Exclude Row Summaries:" },
                         React.createElement(rebass_1.Flex, { alignItems: "center", marginLeft: 2 },
-                            React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-summary-rows-checkbox", checked: (_c = data.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeSummaryRows, onChange: onExcludeSummaryRowsChanged, mr: 2 }))))))));
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "exclude-summary-rows-checkbox", checked: data.RowScope?.ExcludeSummaryRows, onChange: onExcludeSummaryRowsChanged, mr: 2 }))))))));
 };
 exports.FormatColumnSettingsWizardSection = FormatColumnSettingsWizardSection;

package/src/View/FormatColumn/Wizard/FormatColumnStyleWizardSection.d.ts

@@ -1,11 +1,11 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { FormatColumn } from '../../../PredefinedConfig/FormatColumnState';
 import { AdaptableApi } from '../../../Api/AdaptableApi';
 export declare const isFormatColumnStyleValid: (data: FormatColumn, api: AdaptableApi) => true | "No format applied";
 type FormatColumnStyleWizardSectionProps = {
     onChange: (data: FormatColumn) => void;
 };
-export declare const renderFormatColumnStyleWizardSummary: (data: FormatColumn) => JSX.Element;
-export declare const renderFormatColumnStyleSummary: (data: FormatColumn, api: AdaptableApi) => JSX.Element;
-export declare function FormatColumnStyleWizardSection(props: FormatColumnStyleWizardSectionProps): JSX.Element;
+export declare const renderFormatColumnStyleWizardSummary: (data: FormatColumn) => React.JSX.Element;
+export declare const renderFormatColumnStyleSummary: (data: FormatColumn, api: AdaptableApi) => React.JSX.Element;
+export declare function FormatColumnStyleWizardSection(props: FormatColumnStyleWizardSectionProps): React.JSX.Element;
 export {};

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

@@ -20,8 +20,12 @@ const isFormatColumnStyleValid = (data, api) => {
 };
 exports.isFormatColumnStyleValid = isFormatColumnStyleValid;
 const toStyle = (data) => {
-    var _a, _b;
-    return Object.assign(Object.assign({}, (0, StyleHelper_1.convertAdaptableStyleToCSS)((_a = data.Style) !== null && _a !== void 0 ? _a : {})), { borderWidth: ((_b = data.Style) === null || _b === void 0 ? void 0 : _b.BorderColor) ? 2 : 0, borderStyle: 'solid', textAlign: data.CellAlignment ? data.CellAlignment.toLowerCase() : undefined });
+    return {
+        ...(0, StyleHelper_1.convertAdaptableStyleToCSS)(data.Style ?? {}),
+        borderWidth: data.Style?.BorderColor ? 2 : 0,
+        borderStyle: 'solid',
+        textAlign: data.CellAlignment ? data.CellAlignment.toLowerCase() : undefined,
+    };
 };
 const renderFormatColumnStyleWizardSummary = (data) => {
     const { api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
@@ -33,10 +37,9 @@ const renderFormatColumnStyleSummary = (data, api) => {
 };
 exports.renderFormatColumnStyleSummary = renderFormatColumnStyleSummary;
 function FormatColumnStyleWizardSection(props) {
-    var _a;
     const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    return (React.createElement(StyleComponent_1.StyleComponent, { headless: true, api: api, Style: (_a = data.Style) !== null && _a !== void 0 ? _a : {}, UpdateStyle: (Style) => {
-            props.onChange(Object.assign(Object.assign({}, data), { Style }));
+    return (React.createElement(StyleComponent_1.StyleComponent, { headless: true, api: api, Style: data.Style ?? {}, UpdateStyle: (Style) => {
+            props.onChange({ ...data, Style });
         } }));
 }
 exports.FormatColumnStyleWizardSection = FormatColumnStyleWizardSection;

package/src/View/FormatColumn/Wizard/FormatColumnWizard.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { AdaptableOnePageWizardProps } from '../../Wizard/Interface/IAdaptableWizard';
 import { FormatColumn } from '../../../PredefinedConfig/FormatColumnState';
 export interface FormatColumnWizardProps extends AdaptableOnePageWizardProps<FormatColumn> {
 }
-export declare function FormatColumnWizard(props: FormatColumnWizardProps): JSX.Element;
+export declare function FormatColumnWizard(props: FormatColumnWizardProps): React.JSX.Element;

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

@@ -22,27 +22,27 @@ const FormatColumnRuleWizardSection_1 = require("./FormatColumnRuleWizardSection
 const constants_1 = require("./constants");
 const ObjectExtensions_1 = require("../../../Utilities/Extensions/ObjectExtensions");
 const adjustDisplayFormat = (formatColumn, api) => {
-    formatColumn = Object.assign({}, formatColumn);
+    formatColumn = { ...formatColumn };
     const formatDataType = (0, FormatColumnFormatWizardSection_1.getFormatDisplayTypeForScope)(formatColumn.Scope, api);
     if (!formatDataType && formatColumn.DisplayFormat) {
         formatColumn.DisplayFormat = undefined;
     }
     if ((!formatColumn.DisplayFormat || formatColumn.DisplayFormat.Formatter !== 'NumberFormatter') &&
-        formatDataType === 'Number') {
+        formatDataType === 'number') {
         formatColumn.DisplayFormat = {
             Formatter: 'NumberFormatter',
             Options: {},
         };
     }
     if ((!formatColumn.DisplayFormat || formatColumn.DisplayFormat.Formatter !== 'DateFormatter') &&
-        formatDataType === 'Date') {
+        formatDataType === 'date') {
         formatColumn.DisplayFormat = {
             Formatter: 'DateFormatter',
             Options: {},
         };
     }
     if ((!formatColumn.DisplayFormat || formatColumn.DisplayFormat.Formatter !== 'StringFormatter') &&
-        formatDataType === 'String') {
+        formatDataType === 'text') {
         formatColumn.DisplayFormat = {
             Formatter: 'StringFormatter',
             Options: {},
@@ -55,18 +55,16 @@ const adjustFormatColumn = (formatColumn, api) => {
     return formatColumn;
 };
 function FormatColumnWizard(props) {
-    var _a, _b;
     const { api } = (0, AdaptableContext_1.useAdaptable)();
-    const data = (_a = props.data) !== null && _a !== void 0 ? _a : (_b = props.popupParams) === null || _b === void 0 ? void 0 : _b.value;
+    const data = props.data ?? props.popupParams?.value;
     const [formatColumn, doSetFormatColumn] = (0, react_1.useState)(() => {
-        var _a, _b, _c, _d;
         let formatColumn = data ? (0, Helper_1.cloneObject)(data) : ObjectFactory_1.default.CreateEmptyFormatColumn();
-        formatColumn.Scope = (_a = formatColumn.Scope) !== null && _a !== void 0 ? _a : {
+        formatColumn.Scope = formatColumn.Scope ?? {
             ColumnIds: [],
         };
-        if (((_b = props.popupParams) === null || _b === void 0 ? void 0 : _b.action) === 'New' && ((_c = props.popupParams) === null || _c === void 0 ? void 0 : _c.column)) {
+        if (props.popupParams?.action === 'New' && props.popupParams?.column) {
             formatColumn.Scope = {
-                ColumnIds: [(_d = props.popupParams) === null || _d === void 0 ? void 0 : _d.column.columnId],
+                ColumnIds: [props.popupParams?.column.columnId],
             };
         }
         formatColumn = adjustFormatColumn(formatColumn, api);
@@ -77,9 +75,8 @@ function FormatColumnWizard(props) {
     }, []);
     const dispatch = (0, react_redux_1.useDispatch)();
     const handleFinish = () => {
-        var _a, _b;
-        if (((_a = formatColumn === null || formatColumn === void 0 ? void 0 : formatColumn.DisplayFormat) === null || _a === void 0 ? void 0 : _a.Options) &&
-            (0, ObjectExtensions_1.isObjectEmpty)((_b = formatColumn === null || formatColumn === void 0 ? void 0 : formatColumn.DisplayFormat) === null || _b === void 0 ? void 0 : _b.Options)) {
+        if (formatColumn?.DisplayFormat?.Options &&
+            (0, ObjectExtensions_1.isObjectEmpty)(formatColumn?.DisplayFormat?.Options)) {
             delete formatColumn.DisplayFormat;
         }
         if (formatColumn.Style && (0, ObjectExtensions_1.isObjectEmpty)(formatColumn.Style)) {

package/src/View/FreeTextColumn/FreeTextColumnSummary.d.ts

@@ -17,4 +17,6 @@ export declare class FreeTextColumnSummaryComponent extends React.Component<Free
     onFinishWizard: (FreeTextColumn: FreeTextColumn) => void;
     canFinishWizard(): boolean;
 }
-export declare let FreeTextColumnSummary: import("react-redux").ConnectedComponent<typeof FreeTextColumnSummaryComponent, any>;
+export declare let FreeTextColumnSummary: import("react-redux").ConnectedComponent<typeof FreeTextColumnSummaryComponent, {
+    [x: string]: any;
+}>;

package/src/View/FreeTextColumn/Wizard/FreeTextColumnSettingsWizardSection.d.ts

@@ -1,19 +1,10 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { FreeTextColumn } from '../../../PredefinedConfig/FreeTextColumnState';
 import { AdaptableApi } from '../../../Api/AdaptableApi';
-export declare const renderFreeTextColumnSummary: (data: FreeTextColumn) => JSX.Element;
+export declare const renderFreeTextColumnSummary: (data: FreeTextColumn) => React.JSX.Element;
 export declare const isValidFreeTextColumn: (data: FreeTextColumn, api: AdaptableApi) => true | "Column Id cannot be empty" | "A Column already exists with that id" | "No data type specified for column";
 export type FreeTextColumnSettingsWizardSectionProps = {
     onChange: (data: FreeTextColumn) => void;
     isEdit: boolean;
 };
-export interface FreeTextColumnSettingsWizardState {
-    ColumnId: string;
-    ColumnName: string;
-    ErrorMessage: string;
-    DefaultValue: string;
-    ColumnNameFocused: boolean;
-    TextEditor: 'Inline' | 'Large';
-    DataType: 'String' | 'Number' | 'Boolean' | 'Date';
-}
-export declare const FreeTextColumnSettingsWizardSection: (props: FreeTextColumnSettingsWizardSectionProps) => JSX.Element;
+export declare const FreeTextColumnSettingsWizardSection: (props: FreeTextColumnSettingsWizardSectionProps) => React.JSX.Element;

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

@@ -18,20 +18,19 @@ const Tag_1 = require("../../../components/Tag");
 const SpecialColumnSettingsWizardStep_1 = require("../../SpecialColumnSettingsWizardStep");
 const Select_1 = require("../../../components/Select");
 const options = [
-    { value: 'Number', label: 'Number' },
-    { value: 'String', label: 'String' },
-    { value: 'Date', label: 'Date' },
-    { value: 'Boolean', label: 'Boolean' },
+    { value: 'number', label: 'Number' },
+    { value: 'text', label: 'Text' },
+    { value: 'date', label: 'Date' },
+    { value: 'boolean', label: 'Boolean' },
 ];
 const renderFreeTextColumnSummary = (data) => {
-    var _a;
     return (React.createElement(rebass_1.Box, { fontSize: 2 },
         React.createElement(rebass_1.Box, null,
             "Column Identifier: ",
             React.createElement(Tag_1.Tag, null, data.ColumnId)),
         data.FriendlyName ? (React.createElement(rebass_1.Box, { mt: 3 },
             "Column Name: ",
-            React.createElement(Tag_1.Tag, null, (_a = data.FriendlyName) !== null && _a !== void 0 ? _a : data.ColumnId))) : null,
+            React.createElement(Tag_1.Tag, null, data.FriendlyName ?? data.ColumnId))) : null,
         React.createElement(rebass_1.Box, { mt: 3 },
             "Data Type: ",
             React.createElement(Tag_1.Tag, null, data.FreeTextColumnSettings.DataType)),
@@ -44,7 +43,7 @@ const renderFreeTextColumnSummary = (data) => {
 };
 exports.renderFreeTextColumnSummary = renderFreeTextColumnSummary;
 const isValidFreeTextColumn = (data, api) => {
-    const columns = api.columnApi.getColumns();
+    const columns = api.columnApi.getUIAvailableColumns();
     if (!data.ColumnId) {
         return 'Column Id cannot be empty';
     }
@@ -60,7 +59,6 @@ const isValidFreeTextColumn = (data, api) => {
 };
 exports.isValidFreeTextColumn = isValidFreeTextColumn;
 const FreeTextColumnSettingsWizardSection = (props) => {
-    var _a;
     const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     const Pattern = api.optionsApi.getUserInterfaceOptions().dateInputOptions.dateFormat;
     const [ColumnNameFocused, setColumnNameFocused] = (0, react_1.useState)(false);
@@ -70,41 +68,64 @@ const FreeTextColumnSettingsWizardSection = (props) => {
     const handleColumnIdChange = (event) => {
         let e = event.target;
         const ColumnId = e.value;
-        props.onChange(Object.assign(Object.assign({}, data), { ColumnId }));
+        props.onChange({
+            ...data,
+            ColumnId,
+        });
     };
     const handleColumnNameChange = (event) => {
         let e = event.target;
         const ColumnName = e.value;
-        props.onChange(Object.assign(Object.assign({}, data), { FriendlyName: ColumnName }));
+        props.onChange({
+            ...data,
+            FriendlyName: ColumnName,
+        });
     };
     const handleDataTypeChange = (DataType) => {
-        var _a;
-        const newData = Object.assign(Object.assign({}, data), { FreeTextColumnSettings: Object.assign(Object.assign({}, data.FreeTextColumnSettings), { DataType }) });
+        const newData = {
+            ...data,
+            FreeTextColumnSettings: {
+                ...data.FreeTextColumnSettings,
+                DataType,
+            },
+        };
         delete newData.DefaultValue;
         if (!DataType) {
-            (_a = newData.FreeTextColumnSettings) === null || _a === void 0 ? true : delete _a.DataType;
+            delete newData.FreeTextColumnSettings?.DataType;
         }
         props.onChange(newData);
     };
     const onDynamicSelectChanged = (event) => {
         let e = event.target;
         const TextEditor = e.value;
-        props.onChange(Object.assign(Object.assign({}, data), { TextEditor }));
+        props.onChange({
+            ...data,
+            TextEditor,
+        });
     };
     const handleDefaultValueChange = (event) => {
         let e = event.target;
         let DefaultValue = e.value;
-        if (data.FreeTextColumnSettings.DataType === 'Date') {
+        if (data.FreeTextColumnSettings.DataType === 'date') {
             DefaultValue = (0, FormatHelper_1.DateFormatter)(DefaultValue, {
                 Pattern,
             });
         }
-        props.onChange(Object.assign(Object.assign({}, data), { DefaultValue }));
+        props.onChange({
+            ...data,
+            DefaultValue,
+        });
     };
     const handleSpecialColumnSettingsChange = (
     //  settings: SpecialColumnSettings
     settings) => {
-        props.onChange(Object.assign(Object.assign({}, data), { FreeTextColumnSettings: Object.assign(Object.assign({}, data === null || data === void 0 ? void 0 : data.FreeTextColumnSettings), settings) }));
+        props.onChange({
+            ...data,
+            FreeTextColumnSettings: {
+                ...data?.FreeTextColumnSettings,
+                ...settings,
+            },
+        });
     };
     return (React.createElement(React.Fragment, null,
         React.createElement(FormLayout_1.default, null,
@@ -119,21 +140,24 @@ const FreeTextColumnSettingsWizardSection = (props) => {
             React.createElement(FormLayout_1.FormRow, { label: "Data Type" },
                 React.createElement(rebass_1.Box, { style: { maxWidth: 500 } },
                     React.createElement(Select_1.Select, { "data-name": "column-type-dropdown", options: options, placeholder: "Select Data Type", value: data.FreeTextColumnSettings.DataType, onChange: (value) => handleDataTypeChange(value) }))),
-            React.createElement(FormLayout_1.FormRow, { label: "Default Value" }, data.FreeTextColumnSettings.DataType === 'Boolean' ? (React.createElement(CheckBox_1.CheckBox, { "data-name": "column-default-value-checkbox", checked: !!data.DefaultValue, onChange: (DefaultValue) => {
-                    props.onChange(Object.assign(Object.assign({}, data), { DefaultValue }));
-                } })) : (React.createElement(AdaptableInput_1.default, { "data-name": "column-default-value", value: data.FreeTextColumnSettings.DataType === 'Date' && data.DefaultValue
+            React.createElement(FormLayout_1.FormRow, { label: "Default Value" }, data.FreeTextColumnSettings.DataType === 'boolean' ? (React.createElement(CheckBox_1.CheckBox, { "data-name": "column-default-value-checkbox", checked: !!data.DefaultValue, onChange: (DefaultValue) => {
+                    props.onChange({
+                        ...data,
+                        DefaultValue,
+                    });
+                } })) : (React.createElement(AdaptableInput_1.default, { "data-name": "column-default-value", value: data.FreeTextColumnSettings.DataType === 'date' && data.DefaultValue
                     ? (0, DateHelper_1.parseToISO)(data.DefaultValue, Pattern) || ''
-                    : data.DefaultValue || '', style: { width: '100%', maxWidth: 500 }, type: data.FreeTextColumnSettings.DataType === 'Number'
+                    : data.DefaultValue || '', style: { width: '100%', maxWidth: 500 }, type: data.FreeTextColumnSettings.DataType === 'number'
                     ? 'number'
-                    : data.FreeTextColumnSettings.DataType === 'Date'
+                    : data.FreeTextColumnSettings.DataType === 'date'
                         ? 'date'
                         : 'text', placeholder: "Default Column Value (optional)", onChange: (e) => handleDefaultValueChange(e) }))),
             React.createElement(FormLayout_1.FormRow, { label: "Header Tooltip" },
-                React.createElement(Input_1.default, { "data-name": "header-tooltip", type: "text", style: { width: '100%', maxWidth: 500 }, value: ((_a = data.FreeTextColumnSettings) === null || _a === void 0 ? void 0 : _a.HeaderToolTip) || '', onChange: (e) => handleSpecialColumnSettingsChange({
+                React.createElement(Input_1.default, { "data-name": "header-tooltip", type: "text", style: { width: '100%', maxWidth: 500 }, value: data.FreeTextColumnSettings?.HeaderToolTip || '', onChange: (e) => handleSpecialColumnSettingsChange({
                         HeaderToolTip: e.target.value,
                     }) })),
             ' ',
-            data.FreeTextColumnSettings.DataType == 'String' && (React.createElement(FormLayout_1.FormRow, { label: "Cell Editor" },
+            data.FreeTextColumnSettings.DataType == 'text' && (React.createElement(FormLayout_1.FormRow, { label: "Cell Editor" },
                 React.createElement(Radio_1.default, { "data-name": "inline-editor", value: "Inline", checked: data.TextEditor == 'Inline', onChange: (_, e) => onDynamicSelectChanged(e), marginRight: 2 }, "Inline Editor"),
                 React.createElement(Radio_1.default, { "data-name": "large-editor", value: "Large", checked: data.TextEditor == 'Large', onChange: (_, e) => onDynamicSelectChanged(e) }, "Large Editor")))),
         ErrorMessage ? (React.createElement(ErrorBox_1.default, { mt: 2, mb: 2 }, ErrorMessage)) : null,

package/src/View/FreeTextColumn/Wizard/FreeTextColumnWizard.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { AdaptableOnePageWizardProps } from '../../Wizard/Interface/IAdaptableWizard';
 import { FreeTextColumn } from '../../../PredefinedConfig/FreeTextColumnState';
 export interface FreeTextColumnWizardProps extends AdaptableOnePageWizardProps<FreeTextColumn> {
 }
-export declare const FreeTextColumnWizard: (props: FreeTextColumnWizardProps) => JSX.Element;
+export declare const FreeTextColumnWizard: (props: FreeTextColumnWizardProps) => React.JSX.Element;

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

@@ -14,21 +14,19 @@ const react_redux_1 = require("react-redux");
 const ObjectTagsWizardSection_1 = require("../../Wizard/ObjectTagsWizardSection");
 const AdaptableContext_1 = require("../../AdaptableContext");
 const FreeTextColumnWizard = (props) => {
-    var _a;
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const allFreeTextColumns = (0, react_redux_1.useSelector)((state) => state.FreeTextColumn.FreeTextColumns);
     const [freeTextColumn, setFreeTextColumn] = (0, react_1.useState)(() => {
-        var _a, _b;
         if (props.data) {
             return (0, Helper_1.cloneObject)(props.data);
         }
-        if (((_a = props.popupParams) === null || _a === void 0 ? void 0 : _a.action) === 'Edit' && ((_b = props.popupParams) === null || _b === void 0 ? void 0 : _b.column)) {
+        if (props.popupParams?.action === 'Edit' && props.popupParams?.column) {
             return allFreeTextColumns.find((column) => column.ColumnId === props.popupParams.column.columnId);
         }
         return ObjectFactory_1.default.CreateEmptyFreeTextColumn(adaptable.api.gridApi.internalApi.deriveSpecialColumnSettingsFromAgGridDefaultColDef());
     });
     const dispatch = (0, react_redux_1.useDispatch)();
-    const isEdit = props.data || ((_a = props.popupParams) === null || _a === void 0 ? void 0 : _a.action) === 'Edit';
+    const isEdit = props.data || props.popupParams?.action === 'Edit';
     const handleFinish = () => {
         if (isEdit) {
             dispatch(FreeTextColumnRedux.FreeTextColumnEdit(freeTextColumn));

package/src/View/GridFilter/GridFilterExpressionEditor.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
+import * as React from 'react';
 export declare const GridFilterExpressionEditor: (props: {
     expression?: string;
     onDismiss?: () => void;
-}) => JSX.Element;
+}) => React.JSX.Element;

package/src/View/GridFilter/GridFilterExpressionEditor.js

@@ -30,7 +30,7 @@ const GridFilterExpressionEditor = (props) => {
         : '';
     const hasNamedQueryError = (0, StringExtensions_1.IsNotNullOrEmpty)(namedQueryValidationError);
     const onRunQuery = (expression) => {
-        api.gridFilterApi.setGridFilterExpression(expression);
+        api.filterApi.gridFilterApi.setGridFilterExpression(expression);
     };
     const onAddNamedQuery = (namedQuery) => dispatch(NamedQueryRedux.NamedQueryAdd(namedQuery));
     const handleSaveQuery = () => {
@@ -92,7 +92,7 @@ const GridFilterExpressionEditor = (props) => {
             },
         } },
         React.createElement(rebass_1.Flex, { height: "100%", flexDirection: "column" },
-            React.createElement(ExpressionEditor_1.ExpressionEditor, Object.assign({}, expressionEditorProps, { type: 'boolean', module: ModuleConstants_1.GridFilterModuleId, value: expression, onChange: (expression) => setExpression(expression), initialData: initialData, columns: api.columnApi.getQueryableColumns(), fields: api.expressionApi.internalApi.getAvailableFields(), namedQueries: api.namedQueryApi.getNamedQueries(), api: api })),
+            React.createElement(ExpressionEditor_1.ExpressionEditor, { ...expressionEditorProps, type: 'boolean', module: ModuleConstants_1.GridFilterModuleId, value: expression, onChange: (expression) => setExpression(expression), initialData: initialData, columns: api.columnApi.getQueryableColumns(), fields: api.expressionApi.internalApi.getAvailableFields(), namedQueries: api.namedQueryApi.getNamedQueries(), api: api }),
             React.createElement(rebass_1.Flex, { flexDirection: "row", padding: 1, alignItems: "center" },
                 props.onDismiss && (React.createElement(SimpleButton_1.default, { margin: 1, variant: "text", "data-name": "action-close", onClick: () => {
                         props.onDismiss();
@@ -100,7 +100,6 @@ const GridFilterExpressionEditor = (props) => {
                 React.createElement(rebass_1.Box, { flex: 1 }),
                 React.createElement(SimpleButton_1.default, { disabled: actionsDisabled, onClick: handleSaveQuery, icon: "save" }, "Save Query"),
                 React.createElement(SimpleButton_1.default, { variant: "raised", tone: "accent", "data-name": "action-run", margin: 1, icon: "play", onClick: () => {
-                        var _a;
                         if (namedQuery) {
                             onAddNamedQuery({
                                 Name: namedQuery.Name,
@@ -108,7 +107,7 @@ const GridFilterExpressionEditor = (props) => {
                             });
                         }
                         onRunQuery(expression);
-                        (_a = props === null || props === void 0 ? void 0 : props.onDismiss) === null || _a === void 0 ? void 0 : _a.call(props);
+                        props?.onDismiss?.();
                     }, disabled: actionsDisabled }, "Apply Grid Filter")))));
 };
 exports.GridFilterExpressionEditor = GridFilterExpressionEditor;

package/src/View/GridFilter/GridFilterPopup.d.ts

@@ -1,2 +1,2 @@
-/// <reference types="react" />
-export declare const GridFilterPopup: () => JSX.Element;
+import * as React from 'react';
+export declare const GridFilterPopup: () => React.JSX.Element;

package/src/View/GridFilter/GridFilterPopup.js

@@ -35,7 +35,7 @@ const GridFilterPopup = () => {
                     React.createElement(FieldWrap_1.default, { marginRight: 1, width: "100%" },
                         React.createElement(ButtonExpand_1.ButtonExpand, { disabled: disabled, variant: "text", tone: "neutral", onClick: onExpand, tooltip: "Edit the Expression in UI", marginLeft: 1 }),
                         React.createElement(Input_1.default, { onKeyDown: handleEnter, disabled: disabled, type: "text", "data-name": "grid-filter-input", placeholder: "Grid Filter", spellCheck: false, value: expression, onChange: (x) => setExpression(x.target.value), style: { fontFamily: 'monospace', fontSize: 12 } }),
-                        isExpressionValid && (React.createElement(ButtonPlay_1.ButtonPlay, { onClick: () => runQuery(), tooltip: '', accessLevel: gridFilterAccessLevel, variant: "text", tone: "neutral", disabled: disabled || expression == '' || expression == (gridFilter === null || gridFilter === void 0 ? void 0 : gridFilter.Expression), marginRight: 1 })),
+                        isExpressionValid && (React.createElement(ButtonPlay_1.ButtonPlay, { onClick: () => runQuery(), tooltip: '', accessLevel: gridFilterAccessLevel, variant: "text", tone: "neutral", disabled: disabled || expression == '' || expression == gridFilter?.Expression, marginRight: 1 })),
                         gridFilter && !isExpressionValid && (React.createElement(ButtonInvalid_1.ButtonInvalid, { variant: "text", tone: "neutral", tooltip: "Invalid Grid Filter", marginRight: 1 })),
                         ' ',
                         StringExtensions_1.default.IsNotNullOrEmpty(expression) && (React.createElement(ButtonClear_1.ButtonClear, { onClick: () => clearQuery(), tooltip: "Clear Grid Filter", accessLevel: gridFilterAccessLevel })))),
@@ -44,6 +44,6 @@ const GridFilterPopup = () => {
                         React.createElement(ButtonSave_1.ButtonSave, { onClick: () => saveQuery(), tooltip: "Save as Named Query", accessLevel: namedQueryModuleAccessLevel, disabled: disabled || !isExpressionValid || isExpressionNamedQuery || expression == '', variant: "text", tone: "neutral", marginRight: 1 }, "Save"),
                         isSuspended ? (React.createElement(ButtonUnsuspend_1.ButtonUnsuspend, { onClick: () => unSuspendGridFilter(), tooltip: "Unsuspend Grid Filter", accessLevel: gridFilterAccessLevel, disabled: disabled || !isExpressionValid, variant: "text", tone: "neutral", marginRight: 1 }, "Resume")) : (React.createElement(ButtonPause_1.ButtonPause, { onClick: () => suspendGridFilter(), tooltip: "Suspend Grid Filter", accessLevel: gridFilterAccessLevel, disabled: disabled || !isExpressionValid, variant: "text", tone: "neutral", marginRight: 1 }, "Suspend")),
                         React.createElement(DropdownButton_1.default, { disabled: disabled, variant: "text", items: availableColumns, marginRight: 1, tooltip: "Pick Columns", icon: "list", iconPosition: "start" }, "Columns"),
-                        React.createElement(NamedQuerySelector_1.NamedQuerySelector, { disabled: disabled, namedQueries: namedQueries, cachedQueries: cachedQueries, currentQuery: gridFilter === null || gridFilter === void 0 ? void 0 : gridFilter.Expression, onSelect: (query) => runQuery(query), setGridFilterExpression: (query) => setGridFilterExpression(query) }, "Named Queries")))))));
+                        React.createElement(NamedQuerySelector_1.NamedQuerySelector, { disabled: disabled, namedQueries: namedQueries, cachedQueries: cachedQueries, currentQuery: gridFilter?.Expression, onSelect: (query) => runQuery(query), setGridFilterExpression: (query) => setGridFilterExpression(query) }, "Named Queries")))))));
 };
 exports.GridFilterPopup = GridFilterPopup;

package/src/View/GridFilter/GridFilterStatusbar.js

@@ -5,17 +5,16 @@ const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const react_redux_1 = require("react-redux");
 const GridFilterStatusbar = (props) => {
-    var _a, _b;
     const queryMaxLength = 15;
     const currentLayoutName = (0, react_redux_1.useSelector)((state) => state.Layout.CurrentLayout);
     const currentLayout = (0, react_redux_1.useSelector)((state) => state.Layout.Layouts).find((layout) => layout.Name === currentLayoutName);
-    const query = (_b = (_a = currentLayout === null || currentLayout === void 0 ? void 0 : currentLayout.GridFilter) === null || _a === void 0 ? void 0 : _a.Expression) !== null && _b !== void 0 ? _b : '';
+    const query = currentLayout?.GridFilter?.Expression ?? '';
     let text = query;
     let popover = null;
     if (query.length > queryMaxLength) {
         text = query.substring(0, queryMaxLength - 3) + '...';
         popover = query;
     }
-    return React.createElement(React.Fragment, null, text !== null && text !== void 0 ? text : 'No Query');
+    return React.createElement(React.Fragment, null, text ?? 'No Query');
 };
 exports.GridFilterStatusbar = GridFilterStatusbar;

package/src/View/GridFilter/GridFilterViewPanel.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { ViewPanelProps } from '../Components/SharedProps/ViewPanelProps';
 export interface QueryViewPanelComponentProps extends ViewPanelProps {
 }
-export declare const GridFilterPanelControl: (props: QueryViewPanelComponentProps) => JSX.Element;
+export declare const GridFilterPanelControl: (props: QueryViewPanelComponentProps) => React.JSX.Element;

package/src/View/GridFilter/GridFilterViewPanel.js

@@ -54,7 +54,7 @@ const QueryViewPanelComponent = (props) => {
                         overflow: 'hidden',
                         zIndex: 100,
                     }, placeholder: "Grid Filter", onChange: (x) => setExpression(x.target.value), value: expression })),
-            isExpressionValid && (React.createElement(ButtonPlay_1.ButtonPlay, { onClick: () => runQuery(), tooltip: '', accessLevel: gridFilterAccessLevel, variant: "text", tone: "neutral", disabled: disabled || expression == '' || expression == (gridFilter === null || gridFilter === void 0 ? void 0 : gridFilter.Expression), marginRight: 1 })),
+            isExpressionValid && (React.createElement(ButtonPlay_1.ButtonPlay, { onClick: () => runQuery(), tooltip: '', accessLevel: gridFilterAccessLevel, variant: "text", tone: "neutral", disabled: disabled || expression == '' || expression == gridFilter?.Expression, marginRight: 1 })),
             gridFilter && !isExpressionValid && (React.createElement(ButtonInvalid_1.ButtonInvalid, { variant: "text", tone: "neutral", tooltip: "Invalid Grid Filter", marginRight: 1 })),
             ' ',
             StringExtensions_1.default.IsNotNullOrEmpty(expression) && (React.createElement(ButtonClear_1.ButtonClear, { onClick: () => clearQuery(), tooltip: "Clear Grid Filter", accessLevel: gridFilterAccessLevel })))) : (React.createElement(FieldWrap_1.default, { width: "100%", overflow: "visible" },
@@ -84,7 +84,7 @@ const QueryViewPanelComponent = (props) => {
     const saveButton = (React.createElement(ButtonSave_1.ButtonSave, { onClick: () => saveQuery(), tooltip: "Save as Named Query", accessLevel: namedQueryModuleAccessLevel, disabled: disabled || !isExpressionValid || isExpressionNamedQuery || expression == '', variant: "text", tone: "neutral", marginRight: 1 }));
     const suspendButton = (React.createElement(ButtonPause_1.ButtonPause, { onClick: () => suspendGridFilter(), tooltip: "Suspend Grid Filter", accessLevel: gridFilterAccessLevel, disabled: disabled || !isExpressionValid, variant: "text", tone: "neutral", marginRight: 1 }));
     const unSuspendButton = (React.createElement(ButtonUnsuspend_1.ButtonUnsuspend, { onClick: () => unSuspendGridFilter(), tooltip: "Unsuspend Grid Filter", accessLevel: gridFilterAccessLevel, disabled: !isExpressionValid, variant: "text", tone: "neutral", marginRight: 1 }));
-    const namedQuerySelector = (React.createElement(NamedQuerySelector_1.NamedQuerySelector, { namedQueries: namedQueries, cachedQueries: cachedQueries, currentQuery: gridFilter === null || gridFilter === void 0 ? void 0 : gridFilter.Expression, onSelect: (query) => runQuery(query), setGridFilterExpression: (query) => setGridFilterExpression(query) }));
+    const namedQuerySelector = (React.createElement(NamedQuerySelector_1.NamedQuerySelector, { namedQueries: namedQueries, cachedQueries: cachedQueries, currentQuery: gridFilter?.Expression, onSelect: (query) => runQuery(query), setGridFilterExpression: (query) => setGridFilterExpression(query) }));
     const columnsDropdown = (React.createElement(DropdownButton_1.default, { disabled: disabled, accessLevel: gridFilterAccessLevel, variant: "text", items: availableColumns, marginRight: 1, tooltip: "Pick Columns" },
         React.createElement(icons_1.Icon, { name: 'list' })));
     const renderButtons = () => {

package/src/View/GridFilter/NamedQuerySelector.d.ts

@@ -1,10 +1,10 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { CachedQuery } from '../../PredefinedConfig/NamedQueryState';
 import { NamedQuery } from '../../types';
 export declare const AvailableSearchLabel: (props: {
     label: string;
     expression: string;
-}) => JSX.Element;
+}) => React.JSX.Element;
 export declare const NamedQuerySelector: (props: {
     namedQueries: NamedQuery[];
     cachedQueries: CachedQuery[];
@@ -13,4 +13,4 @@ export declare const NamedQuerySelector: (props: {
     setGridFilterExpression: (query: string) => void;
     children?: any;
     disabled?: boolean;
-}) => JSX.Element;
+}) => React.JSX.Element;

package/src/View/GridFilter/NamedQuerySelector.js

@@ -19,8 +19,7 @@ const AvailableSearchLabel = (props) => {
 };
 exports.AvailableSearchLabel = AvailableSearchLabel;
 const NamedQuerySelector = (props) => {
-    var _a;
-    const sortedNamedQueries = (_a = ArrayExtensions_1.default.sortArrayWithProperty(Enums_1.SortOrder.Asc, props.namedQueries, 'Name')) !== null && _a !== void 0 ? _a : [];
+    const sortedNamedQueries = ArrayExtensions_1.default.sortArrayWithProperty(Enums_1.SortOrder.Asc, props.namedQueries, 'Name') ?? [];
     const availableSearches = sortedNamedQueries.map((expression) => {
         return {
             label: (React.createElement(exports.AvailableSearchLabel, { label: expression.Name, expression: expression.BooleanExpression })),