@adaptabletools/adaptable 18.0.0-canary.9 → 18.0.0

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

@@ -15,6 +15,7 @@ import { getDefaultColumnFilterPredicate } from './getDefaultColumnFilterPredica
 import { isAdaptableIcon } from '../../../components/Icon';
 import { QuickFilterValues } from './QuickFilterValues';
 import { AdaptableIconComponent } from '../AdaptableIconComponent';
+import { AdaptableDateInlineInput } from '../AdaptableInput/AdaptableDateInlineInput';
 class QuickFilterFormComponent extends React.Component {
     constructor(props) {
         super(props);
@@ -136,17 +137,23 @@ class QuickFilterFormComponent extends React.Component {
                     } })));
         }
         return (_a = predicateDef === null || predicateDef === void 0 ? void 0 : predicateDef.inputs) === null || _a === void 0 ? void 0 : _a.map((predicateInput, index) => {
-            var _a, _b;
+            var _a, _b, _c, _d, _e, _f;
+            const showDatePicker = (_b = (_a = this.props.api.optionsApi) === null || _a === void 0 ? void 0 : _a.getColumnFilterOptions()) === null || _b === void 0 ? void 0 : _b.showDatePicker;
+            const value = (_d = (_c = filter.Predicate.Inputs) === null || _c === void 0 ? void 0 : _c[index]) !== null && _d !== void 0 ? _d : '';
+            const onKeyDownCapture = (e) => {
+                if (e.nativeEvent.key === 'Escape') {
+                    e.nativeEvent.preventDefault();
+                    e.nativeEvent.stopPropagation();
+                    this.clearFilter();
+                }
+            };
+            if (predicateInput.type === 'date' && !showDatePicker) {
+                return (React.createElement(AdaptableDateInlineInput, { value: value, key: index, onKeyDownCapture: onKeyDownCapture, onChange: (value) => this.changeColumnPredicateInput(value, index) }));
+            }
             return (React.createElement(AdaptableInput, { disabled: this.isFilterDisabled(), key: index, type: predicateInput.type === 'number' ? 'text' : predicateInput.type, 
                 // autoFocus has to be FALSE because if the input receives focus in the init phase,
                 // it may scroll the AG Grid header viewport into view and de-synchronize it (relative to the content viewport)
-                autoFocus: false, value: (_b = (_a = filter.Predicate.Inputs) === null || _a === void 0 ? void 0 : _a[index]) !== null && _b !== void 0 ? _b : '', onChange: (e) => this.changeColumnPredicateInput(e.target.value, index), onKeyDownCapture: (e) => {
-                    if (e.nativeEvent.key === 'Escape') {
-                        e.nativeEvent.preventDefault();
-                        e.nativeEvent.stopPropagation();
-                        this.clearFilter();
-                    }
-                }, style: {
+                autoFocus: false, value: (_f = (_e = filter.Predicate.Inputs) === null || _e === void 0 ? void 0 : _e[index]) !== null && _f !== void 0 ? _f : '', onChange: (e) => this.changeColumnPredicateInput(e.target.value, index), onKeyDownCapture: onKeyDownCapture, style: {
                     width: '100%',
                     padding: 'var(--ab-space-1)',
                     borderRadius: 0,

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

@@ -6,6 +6,7 @@ import { isSameDay } from 'date-fns';
 import OverlayTrigger from '../../../components/OverlayTrigger';
 import { Flex } from 'rebass';
 import { ListBoxFilterForm } from './ListBoxFilterForm';
+import { Resizable } from 're-resizable';
 export const QuickFilterValues = (props) => {
     const { api } = props;
     const currentOverlayVisible = useRef(false);
@@ -135,33 +136,48 @@ export const QuickFilterValues = (props) => {
             }
         }, render: ({ targetWidth }) => {
             var _a;
-            return (React.createElement(Flex, { onMouseEnter: () => {
-                    if (showEvent === 'click') {
-                        // For showEvent=mousenter this is not needed.
-                        // When mouseenter is triggered on the overlay, onShowFn is called, the overlay is no longer hidden.
-                        // But in this case because the trigger is click, another show is not triggered.
-                        // The hide event is added direcly on the element so it does not use the React event system.
-                        // But this event does, maybe beause it uses event delegation it is triggered to soon.
-                        requestAnimationFrame(() => {
-                            var _a;
-                            (_a = valuesDropdownRef.current) === null || _a === void 0 ? void 0 : _a.show();
-                        });
-                    }
-                }, "data-name": "quick-filter-form", flexDirection: "column", style: {
+            return (React.createElement(Resizable, { style: {
                     fontSize: 'var(--ab-font-size-2)',
                     border: '1px solid var(--ab-color-primarydark)',
                     background: 'var(--ab-color-defaultbackground)',
                     zIndex: 1000,
-                    width: getPopoverWidth(targetWidth),
-                } },
-                React.createElement(Flex, { m: 2 },
-                    React.createElement(SimpleButton, { onClick: () => clearColumnFilter() }, "Clear Filter"),
-                    ((_a = api.optionsApi.getColumnFilterOptions()) === null || _a === void 0 ? void 0 : _a.autoApplyFilter) == false && (React.createElement(SimpleButton, { ml: 2, onClick: () => {
-                            if (transientColumnFilter) {
-                                props.updateColumnFilter(transientColumnFilter);
-                            }
-                        } }, "Apply Filter"))),
-                React.createElement(ListBoxFilterForm, { disabled: props.isFilterDisabled, suppressClientSideFilter: quickFilterValues.suppressClientSideFilter, isLoading: isDistinctColumnValuesLoading, onFilterChange: handleFilterChange, currentColumn: props.currentColumn, columns: [], columnDistinctValues: quickFilterValues.values, dataType: props.currentColumn.dataType, uiSelectedColumnValues: props.columnFilter.Predicate.Inputs.filter((input) => input !== ''), useAgGridStyle: true, onColumnValueSelectedChange: (list) => onColumnValueSelectedChange(list) })));
+                }, enable: {
+                    top: false,
+                    right: true,
+                    bottom: false,
+                    left: false,
+                    topRight: false,
+                    bottomRight: false,
+                    bottomLeft: false,
+                    topLeft: false,
+                }, minWidth: getPopoverWidth(targetWidth) },
+                React.createElement(Flex, { onMouseEnter: () => {
+                        if (showEvent === 'click') {
+                            // For showEvent=mousenter this is not needed.
+                            // When mouseenter is triggered on the overlay, onShowFn is called, the overlay is no longer hidden.
+                            // But in this case because the trigger is click, another show is not triggered.
+                            // The hide event is added direcly on the element so it does not use the React event system.
+                            // But this event does, maybe beause it uses event delegation it is triggered to soon.
+                            requestAnimationFrame(() => {
+                                var _a;
+                                (_a = valuesDropdownRef.current) === null || _a === void 0 ? void 0 : _a.show();
+                            });
+                        }
+                    }, "data-name": "quick-filter-form", flexDirection: "column", style: {
+                    // fontSize: 'var(--ab-font-size-2)',
+                    // border: '1px solid var(--ab-color-primarydark)',
+                    // background: 'var(--ab-color-defaultbackground)',
+                    // zIndex: 1000,
+                    // width: getPopoverWidth(targetWidth),
+                    } },
+                    React.createElement(Flex, { m: 2 },
+                        React.createElement(SimpleButton, { onClick: () => clearColumnFilter() }, "Clear Filter"),
+                        ((_a = api.optionsApi.getColumnFilterOptions()) === null || _a === void 0 ? void 0 : _a.autoApplyFilter) == false && (React.createElement(SimpleButton, { ml: 2, onClick: () => {
+                                if (transientColumnFilter) {
+                                    props.updateColumnFilter(transientColumnFilter);
+                                }
+                            } }, "Apply Filter"))),
+                    React.createElement(ListBoxFilterForm, { disabled: props.isFilterDisabled, suppressClientSideFilter: quickFilterValues.suppressClientSideFilter, isLoading: isDistinctColumnValuesLoading, onFilterChange: handleFilterChange, currentColumn: props.currentColumn, columns: [], columnDistinctValues: quickFilterValues.values, dataType: props.currentColumn.dataType, uiSelectedColumnValues: props.columnFilter.Predicate.Inputs.filter((input) => input !== ''), useAgGridStyle: true, onColumnValueSelectedChange: (list) => onColumnValueSelectedChange(list) }))));
         } },
         React.createElement(SimpleButton, { "data-name": 'Select Values', style: {
                 flex: 1,

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

@@ -1,18 +1,18 @@
 import * as React from 'react';
-import { ScopeDataType, AdaptableScope } from '../../PredefinedConfig/Common/AdaptableScope';
+import { ScopeDataType, ColumnScope } from '../../PredefinedConfig/Common/ColumnScope';
 import { AdaptableColumn } from '../../types';
 export declare const isScopeValid: ({ Scope }: {
-    Scope: AdaptableScope;
+    Scope: ColumnScope;
 }) => string | true;
-export declare const renderScopeSummary: (scope: AdaptableScope, labels: {
+export declare const renderScopeSummary: (scope: ColumnScope, labels: {
     scopeWholeRow: string;
     scopeColumns: string;
     scopeDataTypes: string;
 }) => JSX.Element;
 export interface NewScopeComponentProps extends React.ClassAttributes<any> {
-    scope: AdaptableScope;
+    scope: ColumnScope;
     scopeColumns?: AdaptableColumn[];
-    updateScope: (scope: AdaptableScope) => void;
+    updateScope: (scope: ColumnScope) => void;
     availableDataTypes?: ScopeDataType[];
     hideWholeRow?: boolean;
     style?: React.CSSProperties;

package/src/View/Components/NewScopeComponent.js

@@ -42,7 +42,7 @@ const DATA_TYPES_MAP = {
 };
 export const renderScopeSummary = (scope, labels) => {
     const adaptable = useAdaptable();
-    const scopeApi = adaptable.api.scopeApi;
+    const scopeApi = adaptable.api.columnScopeApi;
     const columnsInScope = scopeApi.getColumnsForScope(scope);
     return (React.createElement(React.Fragment, null,
         React.createElement(Box, null,
@@ -56,8 +56,9 @@ export const renderScopeSummary = (scope, labels) => {
 };
 const DATA_TYPES_OPTIONS = Object.values(DATA_TYPES_MAP);
 export const NewScopeComponent = (props) => {
+    var _a, _b;
     const { api } = useAdaptable();
-    const { scopeApi, columnApi } = api;
+    const { columnScopeApi: scopeApi, columnApi } = api;
     const [columnsSearchText, setColumnsSearchText] = useState('');
     const scopeColumns = React.useMemo(() => {
         const allColumns = props.scopeColumns || columnApi.getColumns();
@@ -137,7 +138,8 @@ export const NewScopeComponent = (props) => {
         dataTypeOptions = props.availableDataTypes.map((dataType) => DATA_TYPES_MAP[dataType]);
     }
     const hasColumnTypes = React.useMemo(() => {
-        return api.optionsApi.getColumnOptions().columnTypes.length > 0;
+        var _a;
+        return ((_a = api.columnApi.getColumnTypes()) === null || _a === void 0 ? void 0 : _a.length) > 0;
     }, []);
     return (React.createElement(Tabs, { "data-name": 'scope-component', className: "ab-ScopeComponent", value: scopeChoice, style: Object.assign({ height: '100%' }, props.style), onValueChange: onScopeSelectChanged },
         props.hideWholeRow ? null : (React.createElement(Tabs.Tab, { value: "Row" },
@@ -163,7 +165,7 @@ export const NewScopeComponent = (props) => {
                 React.createElement(Flex, { flexDirection: "column" }, dataTypeOptions.map((dataTypeOption) => (React.createElement(CheckBox, { "data-name": "scope", "data-value": dataTypeOption.value, key: dataTypeOption.value, checked: dataTypesInScope && dataTypesInScope.includes(dataTypeOption.value), onChange: (checked) => onCheckBoxDataTypeChecked(checked, dataTypeOption.value) }, dataTypeOption.label))))))),
         hasColumnTypes && (React.createElement(Tabs.Content, { value: "ColumnType", style: { flex: 'none' }, "data-name": "column-type-scope" },
             React.createElement(Box, null,
-                React.createElement(Flex, { flexDirection: "column" }, api.optionsApi.getColumnOptions().columnTypes.map((columnType) => {
+                React.createElement(Flex, { flexDirection: "column" }, (_b = (_a = api.columnApi.getColumnTypes()) === null || _a === void 0 ? void 0 : _a.map) === null || _b === void 0 ? void 0 : _b.call(_a, (columnType) => {
                     var _a;
                     return (React.createElement(CheckBox, { "data-name": "scope", "data-value": columnType, key: columnType, checked: 'ColumnTypes' in props.scope && ((_a = props.scope.ColumnTypes) === null || _a === void 0 ? void 0 : _a.includes(columnType)), onChange: (checked) => {
                             let columnTypes = [].concat(props.scope.ColumnTypes);

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

@@ -35,7 +35,10 @@ export const AdaptablePopup = (props) => {
     let componentName = props.componentName;
     // ts forces to check for General, there is no menu item General
     const useFirstItem = !props.componentName;
-    if (useFirstItem && firstMenuModule !== 'General' && firstMenuModule !== 'CustomSettingsPanel') {
+    if (useFirstItem &&
+        firstMenuModule !== 'General' &&
+        firstMenuModule !== 'CustomSettingsPanel' &&
+        firstMenuModule !== 'Group') {
         componentModule = firstMenuModule;
     }
     const customSettingsPanel = (_c = settingsPanelOptions === null || settingsPanelOptions === void 0 ? void 0 : settingsPanelOptions.customSettingsPanels) === null || _c === void 0 ? void 0 : _c.find((customPanel) => useFirstItem ? customPanel.name === firstMenuItem.label : customPanel.name === componentName);

package/src/View/Components/Popups/AdaptablePopup/useMenuItems.js

@@ -18,9 +18,10 @@ export const useMenuItems = () => {
         }
         const visibleItems = allMenuItems.filter((item) => item.module !== 'General' &&
             item.module !== 'CustomSettingsPanel' &&
+            item.module !== 'Group' &&
             !STANDALONE_MODULE_POPUPS.includes(item.module) &&
             item.isVisible);
-        return navigationItems
+        let navItems = navigationItems
             .map((moduleName) => {
             var _a, _b;
             if (moduleName === '-') {
@@ -40,5 +41,13 @@ export const useMenuItems = () => {
             return customPanelMenuItem || visibleItems.find((item) => item.module === moduleName);
         })
             .filter(Boolean);
+        // remove sequential '-' items
+        navItems = navItems.filter((item, index) => {
+            if (item === '-' && navItems[index - 1] === '-') {
+                return false;
+            }
+            return true;
+        });
+        return navItems;
     }, [allMenuItems]);
 };

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

@@ -1,28 +1,25 @@
 import * as React from 'react';
 import { useSelector } from 'react-redux';
 import { Flex } from 'rebass';
-import { GetNotesSelector } from '../../../../Redux/ActionsReducers/NotesRedux';
+import { GetNoteSelector } from '../../../../Redux/ActionsReducers/NoteRedux';
 import { SystemCommentsAndNotesEditModeSelector, SystemCommentsAndNotesFocusedEntitySelector, SystemCommentsAndNotesSelector, } from '../../../../Redux/ActionsReducers/SystemRedux';
 import { useAdaptable } from '../../../AdaptableContext';
 import { CommentsEditor } from '../../../Comments/CommentsEditor';
-import { NoteEditor } from '../../../Notes/NoteEditor';
+import { NoteEditor } from '../../../Note/NoteEditor';
 import { CellPopup } from '../../CellPopup';
 const ConnectedNoteEditor = ({ enableEditMode }) => {
     const { api } = useAdaptable();
-    const isReadonly = api.entitlementApi.isModuleReadOnlyEntitlement('Notes');
+    const isReadonly = api.entitlementApi.isModuleReadOnlyEntitlement('Note');
     const editMode = useSelector((state) => SystemCommentsAndNotesEditModeSelector(state.System));
     const cellPopupService = api.internalApi.getCellPopupService();
     const cellAddress = useSelector((state) => SystemCommentsAndNotesSelector(state.System));
-    const [
-    // Only handle first note for now
-    // Later we can handle multiple notes
-    note,] = useSelector((state) => {
-        return cellAddress ? GetNotesSelector(state.Notes, cellAddress) : [];
+    const note = useSelector((state) => {
+        return cellAddress ? GetNoteSelector(state.Note, cellAddress) : null;
     });
     const handleNoteChange = React.useCallback((value) => {
-        api.notesApi.updateNoteText(value, note);
+        api.noteApi.updateNoteText(value, note);
     }, [note]);
-    return (React.createElement(Flex, { onClick: () => enableEditMode(), flexDirection: "column", className: "ab-NotesPopup" },
+    return (React.createElement(Flex, { onClick: () => enableEditMode(), flexDirection: "column", className: "ab-NotePopup" },
         React.createElement(NoteEditor, { isReadonly: isReadonly, editMode: editMode, key: note === null || note === void 0 ? void 0 : note.Uuid, onClose: () => cellPopupService.hidePopup(), note: note === null || note === void 0 ? void 0 : note.Text, onNoteChange: (value) => handleNoteChange(value) })));
 };
 export const GridCellPopup = (props) => {

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

@@ -1,13 +1,13 @@
 import * as React from 'react';
 import { AdaptableApi } from '../../Api/AdaptableApi';
 import { CellColorRange, ColumnComparison, NumericStyledColumn } from '../../PredefinedConfig/StyledColumnState';
-import { AdaptableScope } from '../../PredefinedConfig/Common/AdaptableScope';
+import { ColumnScope } from '../../PredefinedConfig/Common/ColumnScope';
 export interface RangesComponentProps extends React.ClassAttributes<RangesComponent> {
     ranges: CellColorRange[];
     columnComparison?: ColumnComparison;
     rangeValueType: NumericStyledColumn['RangeValueType'];
     onRangeValueTypeChange: (rangeValueType: NumericStyledColumn['RangeValueType']) => void;
-    scope: AdaptableScope;
+    scope: ColumnScope;
     api: AdaptableApi;
     showRangeDirection: boolean;
     updateRanges: (ranges: CellColorRange[]) => void;

package/src/View/Components/RangesComponent.js

@@ -114,7 +114,7 @@ export class RangesComponent extends React.Component {
             this.props.updateColumnComparison(columnComparison);
         }
         else {
-            const ranges = this.props.api.scopeApi.createCellColorRangesForScope(this.props.scope);
+            const ranges = this.props.api.columnScopeApi.createCellColorRangesForScope(this.props.scope);
             this.setState({
                 rangesType: 'Standard',
             });

package/src/View/Components/Selectors/PermittedValuesSelector.js

@@ -64,5 +64,5 @@ export const PermittedValuesSelector = function (props) {
             handleSingleValueChange(value);
         }
     };
-    return (React.createElement(Select, { isMulti: props.isMulti, className: props.className, disabled: props.disabled, "data-name": "permitted-values-selector", placeholder: props.placeholder || (props.allowNewValues ? 'Select or type new value' : 'Select value'), isCreatable: isCreatable, isClearable: true, options: options, isLoding: isLoading, onInputChange: setFilter, onChange: handleOnChange, value: props.value }));
+    return (React.createElement(Select, { isMulti: props.isMulti, className: props.className, disabled: props.disabled, "data-name": "permitted-values-selector", placeholder: props.placeholder || (props.allowNewValues ? 'Select or type new value' : 'Select value'), isCreatable: isCreatable, isClearable: true, options: options, isLoading: isLoading, onInputChange: setFilter, onChange: handleOnChange, value: props.value }));
 };

package/src/View/Components/SharedProps/WizardScopeState.d.ts

@@ -1,4 +1,4 @@
-import { AdaptableScope } from '../../../PredefinedConfig/Common/AdaptableScope';
+import { ColumnScope } from '../../../PredefinedConfig/Common/ColumnScope';
 export interface WizardScopeState {
-    scope: AdaptableScope;
+    scope: ColumnScope;
 }

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

@@ -26,6 +26,7 @@ export type ValueSelectorProps<OPTION_TYPE, ID_TYPE extends number | string> = {
     onShowSelectedOnlyChange?: (selectedOnly: boolean) => void;
     isOptionDisabled?: (option: OPTION_TYPE) => boolean;
     disabled?: boolean;
+    style?: React.CSSProperties;
 };
 export declare function ValueSelector<OPTION_TYPE, ID_TYPE extends number | string>(props: ValueSelectorProps<OPTION_TYPE, ID_TYPE>): JSX.Element;
 export declare namespace ValueSelector {

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

@@ -62,7 +62,7 @@ export function ValueSelector(props) {
         const label = !allowReorder ? preparedToLabel(option) : null;
         const reorderable = typeof allowReorder === 'function' ? allowReorder(option) : allowReorder;
         const renderNode = (props, dragHandleProps) => {
-            return (React.createElement(Flex, Object.assign({ className: `${baseClassName}__option`, alignItems: "center", mt: index ? 1 : 0, key: identifier, backgroundColor: 'primary', padding: 2, "data-index": index, "data-id": identifier, "data-name": "option" }, props),
+            return (React.createElement(Flex, Object.assign({ className: `${baseClassName}__option`, alignItems: "center", mt: index ? 1 : 0, key: identifier !== null && identifier !== void 0 ? identifier : index, backgroundColor: 'primary', padding: 2, "data-index": index, "data-id": identifier, "data-name": "option" }, props),
                 React.createElement(Flex, { flex: 1, flexDirection: "row", alignItems: "center" },
                     reorderable ? (React.createElement(Box, Object.assign({ mr: 3 }, dragHandleProps),
                         React.createElement(Icon, { name: "drag", style: { cursor: 'grab' } }))) : null,
@@ -111,7 +111,7 @@ export function ValueSelector(props) {
     };
     const showOnlySelectedCheckbox = (React.createElement(CheckBox, { disabled: !value.length, checked: selectedOnly, onChange: setSelectedOnly }, showSelectedOnlyLabel !== null && showSelectedOnlyLabel !== void 0 ? showSelectedOnlyLabel : 'Show Selected Only'));
     const showSelectedOnlyPosition = (_a = props.showSelectedOnlyPosition) !== null && _a !== void 0 ? _a : 'floating';
-    return (React.createElement(Flex, { className: baseClassName, flexDirection: "column", flex: 1 },
+    return (React.createElement(Flex, { style: props.style, className: baseClassName, flexDirection: "column", flex: 1 },
         React.createElement(Flex, { mb: 1 },
             showFilterInput && filter ? (React.createElement(AdaptableFormControlTextClear, { value: searchInputValue, OnTextChange: setSearchInputValue, placeholder: "Type to search", style: { flex: 1, border: 0, margin: 3 } })) : (React.createElement(Box, { flex: 1 })),
             showSelectedOnlyPosition === 'top' && React.createElement(Box, { ml: 20 }, showOnlySelectedCheckbox)),

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

@@ -24,7 +24,7 @@ export const CustomSortColumnWizardSection = (props) => {
         const columnSortComparers = api.optionsApi.getCustomSortOptions().customSortComparers || [];
         const usedColumnIds = [
             ...customSorts.map((customSort) => customSort.ColumnId),
-            ...columnSortComparers.map((comparer) => api.scopeApi.getColumnIdsInScope(comparer.scope)),
+            ...columnSortComparers.map((comparer) => api.columnScopeApi.getColumnIdsInScope(comparer.scope)),
         ];
         // filter out used colum ids, but include the current one
         return sortableColumns.filter((column) => {

package/src/View/DataChangeHistory/DataChangeHistoryGrid.js

@@ -94,7 +94,10 @@ const buildAdaptableOptions = (mainAdaptableInstance, gridOptions, adaptableCont
                 {
                     columnId: 'undoActionColumn',
                     friendlyName: ' ',
-                    includeGroupedRows: true,
+                    rowScope: {
+                        ExcludeGroupRows: true,
+                        ExcludeSummaryRows: true,
+                    },
                     actionColumnSettings: { suppressMenu: true, suppressMovable: true },
                     actionColumnButton,
                 },
@@ -208,7 +211,6 @@ const buildGridOptions = (mainAdaptableInstance, changeHistoryLog) => {
         },
         autoGroupColumnDef: {
             sortable: true,
-            // suppressMenu: true,
         },
         columnDefs: [
             {

package/src/View/DataImport/DataImportWizard/DataImportWizard.js

@@ -132,7 +132,7 @@ export const DataImportWizard = (props) => {
         return [...userDefinedHandlers, ...systemFileHandlers];
     }, []);
     const supportedFileFormats = React.useMemo(() => {
-        return fileHandlers.map((h) => h.fileExtension).join(', ');
+        return [...new Set(fileHandlers.map((h) => h.fileExtension)).values()].join(', ');
     }, [fileHandlers]);
     const readFile = React.useCallback(async (file) => {
         var _a, _b;

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

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { FormatColumn } from '../../../PredefinedConfig/FormatColumnState';
 import { AdaptableFormat } from '../../../PredefinedConfig/Common/AdaptableFormat';
-import { AdaptableScope } from '../../../PredefinedConfig/Common/AdaptableScope';
+import { ColumnScope } from '../../../PredefinedConfig/Common/ColumnScope';
 import { AdaptableApi } from '../../../Api/AdaptableApi';
 export type FormatColumnFormatWizardSectionProps = {
     onChange: (data: FormatColumn) => void;
@@ -12,5 +12,5 @@ export interface FormatColumnFormatWizardState {
 }
 export declare const getFormatColumnFormatSummaryValue: (data: FormatColumn) => string;
 export declare const renderFormatColumnFormatSummary: (data: FormatColumn) => JSX.Element;
-export declare const getFormatDisplayTypeForScope: (scope: AdaptableScope, api: AdaptableApi) => 'Number' | 'Date' | 'String' | undefined;
+export declare const getFormatDisplayTypeForScope: (scope: ColumnScope, api: AdaptableApi) => 'Number' | 'Date' | 'String' | undefined;
 export declare const FormatColumnFormatWizardSection: (props: FormatColumnFormatWizardSectionProps) => JSX.Element;

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

@@ -143,6 +143,19 @@ export const getFormatDisplayTypeForScope = (scope, api) => {
     if ('DataTypes' in scope && scope.DataTypes.length == 1 && scope.DataTypes[0] == 'String') {
         return 'String';
     }
+    if ('ColumnTypes' in scope && scope.ColumnTypes.length) {
+        // need to check if all column with this column type has the same data type and return that particular one
+        const columns = scope.ColumnTypes.flatMap((columnType) => {
+            return api.columnApi.getColumnsByColumnType(columnType);
+        });
+        // check if all have the same type
+        if (columns.length &&
+            columns.every((column) => column.dataType === columns[0].dataType) &&
+            // supported data types
+            ['Number', 'Date', 'String'].includes(columns[0].dataType)) {
+            return columns[0].dataType;
+        }
+    }
     return undefined;
 };
 const renderDateFormat = (data, _onChange, setFormatOption, scopedCustomFormatters) => {
@@ -189,7 +202,7 @@ const renderDateFormat = (data, _onChange, setFormatOption, scopedCustomFormatte
                     ] })))))));
 };
 const renderNumberFormat = (data, onChange, setFormatOption, scopedCustomFormatters, formatColumnApi) => {
-    var _a, _b, _c;
+    var _a, _b, _c, _d, _e;
     if (data.DisplayFormat.Formatter !== 'NumberFormatter') {
         return null;
     }
@@ -248,13 +261,13 @@ const renderNumberFormat = (data, onChange, setFormatOption, scopedCustomFormatt
                 React.createElement(Flex, { flexDirection: "row" },
                     React.createElement(FormLayout, { mr: 3 },
                         React.createElement(FormRow, { label: "Fraction Separator" },
-                            React.createElement(Input, { "data-name": "fraction-separator", value: data.DisplayFormat.Options.FractionSeparator, onChange: (e) => setFormatOption('FractionSeparator', e.currentTarget.value) })),
+                            React.createElement(Input, { "data-name": "fraction-separator", value: (_a = data.DisplayFormat.Options.FractionSeparator) !== null && _a !== void 0 ? _a : '', onChange: (e) => setFormatOption('FractionSeparator', e.currentTarget.value) })),
                         React.createElement(FormRow, { label: "Integer Separator" },
-                            React.createElement(Input, { "data-name": "integer-separator", value: data.DisplayFormat.Options.IntegerSeparator, onChange: (e) => setFormatOption('IntegerSeparator', e.currentTarget.value) })),
+                            React.createElement(Input, { "data-name": "integer-separator", value: (_b = data.DisplayFormat.Options.IntegerSeparator) !== null && _b !== void 0 ? _b : '', onChange: (e) => setFormatOption('IntegerSeparator', e.currentTarget.value) })),
                         React.createElement(FormRow, { label: "Prefix" },
-                            React.createElement(Input, { "data-name": "prefix", value: (_a = data.DisplayFormat.Options.Prefix) !== null && _a !== void 0 ? _a : '', onChange: (e) => setFormatOption('Prefix', e.currentTarget.value) })),
+                            React.createElement(Input, { "data-name": "prefix", value: (_c = data.DisplayFormat.Options.Prefix) !== null && _c !== void 0 ? _c : '', onChange: (e) => setFormatOption('Prefix', e.currentTarget.value) })),
                         React.createElement(FormRow, { label: "Suffix" },
-                            React.createElement(Input, { "data-name": "suffix", value: (_b = data.DisplayFormat.Options.Suffix) !== null && _b !== void 0 ? _b : '', onChange: (e) => setFormatOption('Suffix', e.currentTarget.value) })),
+                            React.createElement(Input, { "data-name": "suffix", value: (_d = data.DisplayFormat.Options.Suffix) !== null && _d !== void 0 ? _d : '', onChange: (e) => setFormatOption('Suffix', e.currentTarget.value) })),
                         React.createElement(FormRow, { label: "Truncate" },
                             React.createElement(CheckBox, { "data-name": "truncate-checkbox", checked: data.DisplayFormat.Options.Truncate, onChange: (checked) => setFormatOption('Truncate', checked) })),
                         React.createElement(FormRow, { label: "Ceiling" },
@@ -279,7 +292,7 @@ const renderNumberFormat = (data, onChange, setFormatOption, scopedCustomFormatt
                             React.createElement(Input, { "data-name": "multiplier", type: "number", value: data.DisplayFormat.Options.Multiplier, onChange: (e) => setFormatOption('Multiplier', Number(e.currentTarget.value)) })),
                         ' ',
                         React.createElement(FormRow, { label: "Content" },
-                            React.createElement(Input, { "data-name": "content", value: (_c = data.DisplayFormat.Options.Content) !== null && _c !== void 0 ? _c : '', onChange: (e) => setFormatOption('Content', e.currentTarget.value) })),
+                            React.createElement(Input, { "data-name": "content", value: (_e = data.DisplayFormat.Options.Content) !== null && _e !== void 0 ? _e : '', onChange: (e) => setFormatOption('Content', e.currentTarget.value) })),
                         ' ',
                         React.createElement(FormRow, { label: "Parentheses" },
                             React.createElement(CheckBox, { "data-name": "parentheses-checkbox", checked: data.DisplayFormat.Options.Parentheses, onChange: (checked) => setFormatOption('Parentheses', checked) })),
@@ -397,7 +410,7 @@ export const FormatColumnFormatWizardSection = (props) => {
         update({ DisplayFormat });
     };
     const Type = data.DisplayFormat && data.DisplayFormat.Formatter;
-    const customScopedFormatters = customDisplayFormatters.filter((displayFormatter) => adaptable.api.scopeApi.isScopeInScope(data.Scope, displayFormatter.scope));
+    const customScopedFormatters = customDisplayFormatters.filter((displayFormatter) => adaptable.api.columnScopeApi.isScopeInScope(data.Scope, displayFormatter.scope));
     if (Type === 'NumberFormatter') {
         return renderNumberFormat(data, update, setFormatOption, customScopedFormatters, formatColumnApi);
     }

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

@@ -5,7 +5,7 @@ export function FormatColumnRuleWizardSection(props) {
     const { data, api, moduleInfo } = useOnePageAdaptableWizardContext();
     return (React.createElement(EntityRulesEditor, { module: moduleInfo.ModuleName, defaultPredicateId: props.defaultPredicateId, 
         // TODO see what is this
-        predicateDefs: api.formatColumnApi.internalApi.getFormatColumnDefsForScope(data.Scope), getPredicateDefsForColId: (colId) => api.formatColumnApi.internalApi.getFormatColumnDefsForScope({ ColumnIds: [colId] }), showNoRule: true, showBoolean: true, showAggregation: false, showObservable: false, showPredicate: !api.scopeApi.scopeIsAll(data.Scope), data: data, onChange: (formatColumn) => props.onChange(formatColumn), descriptions: {
+        predicateDefs: api.formatColumnApi.internalApi.getFormatColumnDefsForScope(data.Scope), getPredicateDefsForColId: (colId) => api.formatColumnApi.internalApi.getFormatColumnDefsForScope({ ColumnIds: [colId] }), showNoRule: true, showBoolean: true, showAggregation: false, showObservable: false, showPredicate: !api.columnScopeApi.scopeIsAll(data.Scope), data: data, onChange: (formatColumn) => props.onChange(formatColumn), descriptions: {
             selectPredicate: 'Create a Format Column Rule - to be applied when data changes',
             useBooleanQuery: (React.createElement(React.Fragment, null,
                 "Use an BooleanQuery if ",

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

@@ -17,7 +17,7 @@ export const FormatColumnScopeWizardSection = (props) => {
         }, scope: data.Scope, updateScope: (Scope) => {
             var _a, _b;
             const newData = Object.assign(Object.assign({}, data), { Scope });
-            const wholeRow = api.scopeApi.scopeIsAll(Scope);
+            const wholeRow = api.columnScopeApi.scopeIsAll(Scope);
             if ((_b = (_a = newData.Rule) === null || _a === void 0 ? void 0 : _a.Predicates) === null || _b === void 0 ? void 0 : _b.length) {
                 if (wholeRow) {
                     // if scope is whole row, a predicate cannot be present, so we set the rule

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

@@ -7,22 +7,25 @@ import { useOnePageAdaptableWizardContext } from '../../Wizard/OnePageAdaptableW
 import { Tag } from '../../../components/Tag';
 import { ToggleGroup } from '../../../components/Toggle/ToggleGroup';
 import { Toggle } from '../../../components/Toggle/Toggle';
-let alignmentOptions = [
-    { value: 'Left', label: 'Left' },
-    { value: 'Right', label: 'Right' },
-    { value: 'Center', label: 'Center' },
-];
 export const renderFormatColumnSettingsSummary = (data) => {
-    var _a;
+    var _a, _b, _c, _d;
     return (React.createElement(Box, { padding: 2 },
         React.createElement(Text, null,
             "Cell alignment ",
             React.createElement(Tag, null, (_a = data.CellAlignment) !== null && _a !== void 0 ? _a : 'default')),
         React.createElement(Text, { mt: 3 },
-            "Include grouped rows ",
-            React.createElement(Tag, null, data.IncludeGroupedRows ? 'yes' : 'no'))));
+            "Data Rows ",
+            React.createElement(Tag, null, ((_b = data.RowScope) === null || _b === void 0 ? void 0 : _b.ExcludeDataRows) ? 'no' : 'yes')),
+        ' ',
+        React.createElement(Text, { mt: 3 },
+            "Group Rows ",
+            React.createElement(Tag, null, ((_c = data.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeGroupRows) ? 'no' : 'yes')),
+        React.createElement(Text, { mt: 3 },
+            "Summary Rows ",
+            React.createElement(Tag, null, ((_d = data.RowScope) === null || _d === void 0 ? void 0 : _d.ExcludeSummaryRows) ? 'no' : 'yes'))));
 };
 export const FormatColumnSettingsWizardSection = (props) => {
+    var _a, _b, _c;
     const { data } = useOnePageAdaptableWizardContext();
     const onCellAlignmentSelectChanged = (CellAlignment) => {
         const newData = Object.assign(Object.assign({}, data), { CellAlignment });
@@ -31,8 +34,14 @@ export const FormatColumnSettingsWizardSection = (props) => {
         }
         props.onChange(newData);
     };
-    const onIncludeGroupedRowsChanged = (IncludeGroupedRows) => {
-        props.onChange(Object.assign(Object.assign({}, data), { IncludeGroupedRows }));
+    const onExcludeDataRowsChanged = (ExcludeDataRows) => {
+        props.onChange(Object.assign(Object.assign({}, data), { RowScope: Object.assign(Object.assign({}, data.RowScope), { ExcludeDataRows }) }));
+    };
+    const onExcludeGroupedRowsChanged = (ExcludeGroupedRows) => {
+        props.onChange(Object.assign(Object.assign({}, data), { RowScope: Object.assign(Object.assign({}, data.RowScope), { ExcludeGroupRows: ExcludeGroupedRows }) }));
+    };
+    const onExcludeSummaryRowsChanged = (ExcludeSummaryRows) => {
+        props.onChange(Object.assign(Object.assign({}, data), { RowScope: Object.assign(Object.assign({}, data.RowScope), { ExcludeSummaryRows }) }));
     };
     return (React.createElement(Tabs, null,
         React.createElement(Tabs.Tab, null, "Settings"),
@@ -50,7 +59,13 @@ export const FormatColumnSettingsWizardSection = (props) => {
                             React.createElement(Toggle, { icon: "align-right", pressed: data.CellAlignment === 'Right', onPressedChange: (pressed) => pressed
                                     ? onCellAlignmentSelectChanged('Right')
                                     : onCellAlignmentSelectChanged(null) }))),
-                    React.createElement(FormRow, { label: "Include Grouped Rows:" },
+                    React.createElement(FormRow, { label: "Exclude Data Rows:" },
+                        React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
+                            React.createElement(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(FormRow, { label: "Exclude Group Rows:" },
+                        React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
+                            React.createElement(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(FormRow, { label: "Exclude Row Summaries:" },
                         React.createElement(Flex, { alignItems: "center", marginLeft: 2 },
-                            React.createElement(CheckBox, { "data-name": "include-grouped-rows-checkbox", checked: data.IncludeGroupedRows, onChange: onIncludeGroupedRowsChanged, mr: 2 }))))))));
+                            React.createElement(CheckBox, { "data-name": "exclude-summary-rows-checkbox", checked: (_c = data.RowScope) === null || _c === void 0 ? void 0 : _c.ExcludeSummaryRows, onChange: onExcludeSummaryRowsChanged, mr: 2 }))))))));
 };

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

@@ -9,7 +9,7 @@ export const isFormatColumnStyleValid = (data, api) => {
         UIHelper.IsEmptyStyle(data.Style) &&
         data.DisplayFormat === undefined &&
         data.CellAlignment === undefined &&
-        !api.scopeApi.isSingleBooleanColumnScope(data.Scope)) {
+        !api.columnScopeApi.isSingleBooleanColumnScope(data.Scope)) {
         return 'No format applied';
     }
     return true;

package/src/View/FreeTextColumn/FreeTextColumnSummary.js

@@ -45,7 +45,7 @@ export class FreeTextColumnSummaryComponent extends React.Component {
             this.state.editedAdaptableObject && (React.createElement(FreeTextColumnWizard, { moduleInfo: this.props.moduleInfo, data: this.state.editedAdaptableObject, configEntities: this.props.FreeTextColumns, onCloseWizard: () => this.onCloseWizard(), onFinishWizard: this.onFinishWizard }))));
     }
     onNew() {
-        let configEntity = ObjectFactory.CreateEmptyFreeTextColumn();
+        let configEntity = ObjectFactory.CreateEmptyFreeTextColumn(this.props.api.gridApi.internalApi.deriveSpecialColumnSettingsFromAgGridDefaultColDef());
         configEntity.ColumnId = this.props.summarisedColumn.columnId;
         this.setState({
             editedAdaptableObject: configEntity,

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

@@ -8,8 +8,10 @@ import ObjectFactory from '../../../Utilities/ObjectFactory';
 import * as FreeTextColumnRedux from '../../../Redux/ActionsReducers/FreeTextColumnRedux';
 import { useDispatch, useSelector } from 'react-redux';
 import { ObjectTagsWizardSection, renderObjectTagsSummary, } from '../../Wizard/ObjectTagsWizardSection';
+import { useAdaptable } from '../../AdaptableContext';
 export const FreeTextColumnWizard = (props) => {
     var _a;
+    const adaptable = useAdaptable();
     const allFreeTextColumns = useSelector((state) => state.FreeTextColumn.FreeTextColumns);
     const [freeTextColumn, setFreeTextColumn] = useState(() => {
         var _a, _b;
@@ -19,7 +21,7 @@ export const FreeTextColumnWizard = (props) => {
         if (((_a = props.popupParams) === null || _a === void 0 ? void 0 : _a.action) === 'Edit' && ((_b = props.popupParams) === null || _b === void 0 ? void 0 : _b.column)) {
             return allFreeTextColumns.find((column) => column.ColumnId === props.popupParams.column.columnId);
         }
-        return ObjectFactory.CreateEmptyFreeTextColumn();
+        return ObjectFactory.CreateEmptyFreeTextColumn(adaptable.api.gridApi.internalApi.deriveSpecialColumnSettingsFromAgGridDefaultColDef());
     });
     const dispatch = useDispatch();
     const isEdit = props.data || ((_a = props.popupParams) === null || _a === void 0 ? void 0 : _a.action) === 'Edit';