@adaptabletools/adaptable 20.2.1 → 20.2.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable",
-  "version": "20.2.1",
+  "version": "20.2.3",
   "description": "Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements",
   "keywords": [
     "web-components",

package/src/AdaptableOptions/ExportOptions.d.ts

@@ -346,10 +346,21 @@ export interface DataFormatDataType {
     date?: DataFormatType;
 }
 /**
- * Custom Export Parameters which extend AG Grid's base export parameters.
- * Use:
- * - `ExcelExportParams` for Excel format exports
- * - `CsvExportParams` for CSV, JSON and any custom format exports
- * These parameters allow overriding AdapTable's default export behavior.
+ * Custom Export Parameters which extend AG Grid's base export parameters, allowing overriding of AdapTable's default export behaviour.
+ * Use `ExcelExportParams` for Excel format exports and `CsvExportParams` for CSV, JSON and any custom format exports
  */
 export type CustomExportParams = ExcelExportParams | CsvExportParams;
+/**
+ * Config used when Exporting via API, allows fine grained exporting
+ */
+export interface ExportConfig {
+    /**
+     *
+     * Function to modify export params; receives default params & returns modified params
+     */
+    exportParams?: (defaultExportParams: CustomExportParams) => CustomExportParams;
+    /**
+     * Whether to show progress indicator
+     */
+    showProgressIndicator?: boolean;
+}

package/src/AdaptableState/Common/AdaptableColumn.d.ts

@@ -155,6 +155,10 @@ export interface AdaptableColumn<TData = any> extends AdaptableColumnBase {
      * Is Column a generated Row Group Column
      */
     isGeneratedRowGroupColumn: boolean;
+    /**
+     * Is Column a generated Selection Column
+     */
+    isGeneratedSelectionColumn: boolean;
     /**
      * Is Column a generated Pivot Result Column
      */

package/src/AdaptableState/LayoutState.d.ts

@@ -5,6 +5,7 @@ import { ColumnFilter, GridFilter } from '../types';
 import { TableAggregationColumns, PivotAggregationColumns } from './Common/AggregationColumns';
 import { RowSummary } from './Common/RowSummary';
 import { NonEmptyArray } from '../Utilities/Extensions/ArrayExtensions';
+import { XOR } from '../Utilities/Extensions/TypeExtensions';
 /**
  * Base Layout Type - Pivot or Table
  */
@@ -188,11 +189,24 @@ export type RowGroupValuesWithExceptionKeys = {
      * Default behaviour for Row Groups: 'expanded' or 'collapsed';
      */
     RowGroupDefaultBehavior: 'expanded' | 'collapsed';
+} & XOR<{
     /**
-     * Keys of Row Groups which are exceptions to default RowGroupDefaultBehavior - these are actual values in Row Grouped Column
+     * @deprecated - use GroupKeys instead. Layout.RowGroupValues.GroupKeys[] array allows you
+     * to configure the row group expand / collapse behaviour for each combination of row grouped columns.
      */
     ExceptionGroupKeys?: any[][];
-};
+}, {
+    /**
+     * Allows you to configure the row group expand / collapse behaviour for each combination of row grouped columns.
+     * The default value is configured via RowGroupDefaultBehavior, but exceptions are configured by the GroupKeys array.
+     * Each item in the GroupKeys array is a an object with `RowGroupedColumns` and `ExceptionGroupKeys`. Those properties
+     * configure the collapse/expand exceptions for the specific row group columns.
+     */
+    GroupKeys?: {
+        RowGroupedColumns: string[];
+        ExceptionGroupKeys?: any[][];
+    }[];
+}>;
 /**
  * Manages Column Group expand / collapse behaviour, including exceptions
  */

package/src/AdaptableState/QuickSearchState.d.ts

@@ -5,19 +5,19 @@ import { BaseState } from './BaseState';
  */
 export interface QuickSearchState extends BaseState {
     /**
-     * Last Quick Search that was run (and will run again at start up)
+     * Last Quick Search that was run (and will be applied at start-up)
      */
     QuickSearchText?: string;
     /**
-     * Style to use to highlight matching cells
+     * Style used to highlight matching cells
      */
-    Style?: AdaptableStyle;
+    CellMatchStyle?: Omit<AdaptableStyle, 'ClassName'>;
     /**
-     * Style to use to highlight matching text within a cell
+     * Style used to highlight matching text within a cell (not availale in SSRM)
      */
     TextMatchStyle?: Omit<AdaptableStyle, 'ClassName'>;
     /**
-     * Style to use to highlight matching text within current match
+     * Style used to highlight matching text within current match (not availale in SSRM)
      */
     CurrentTextMatchStyle?: Omit<AdaptableStyle, 'ClassName'>;
 }

package/src/Api/ExportApi.d.ts

@@ -1,6 +1,6 @@
 import { AdaptableForm } from '../AdaptableState/Common/AdaptableForm';
 import { ExportState, Report, ReportFormatType, ReportNameType, SystemReportFormat, SystemReportName } from '../AdaptableState/ExportState';
-import { CustomDestination, CustomExportParams, ExportDestinationType, ExportFormContext, ExportResultData, SystemExportDestination } from '../AdaptableOptions/ExportOptions';
+import { CustomDestination, CustomExportParams, ExportConfig, ExportDestinationType, ExportFormContext, ExportResultData, SystemExportDestination } from '../AdaptableOptions/ExportOptions';
 import { AdaptableColumn } from '../types';
 /**
  * Provides run-time access to the Export Module and Report state
@@ -143,14 +143,9 @@ export interface ExportApi {
      * @param reportName - name of the report
      * @param format - format of the report
      * @param destination - destination to export to
-     * @param config - optional configuration
-     * @param config.exportParams - function to modify the default export parameters; it will be called with the default export parameters and should return the modified export parameters
-     * @param config.showProgressIndicator - whether to show progress indicator
-     */
-    exportReport(reportName: ReportNameType, format: ReportFormatType, destination?: ExportDestinationType, config?: {
-        exportParams?: (defaultExportParams: CustomExportParams) => CustomExportParams;
-        showProgressIndicator?: boolean;
-    }): Promise<void>;
+     * @param exportConfig - optional export configuration
+      */
+    exportReport(reportName: ReportNameType, format: ReportFormatType, destination?: ExportDestinationType, exportConfig?: ExportConfig): Promise<void>;
     /**
      * Gets the data for the Report with the given Name in the given Format
      * @param reportName - name of the report

package/src/Api/Implementation/ColumnApiImpl.js

@@ -27,6 +27,7 @@ const ROW_GROUP_COLUMN_DEFAULTS = {
     isGrouped: true,
     isGeneratedRowGroupColumn: true,
     isGeneratedPivotResultColumn: false,
+    isGeneratedSelectionColumn: false,
     isFixed: false,
     pinned: null,
     isSparkline: false,

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

@@ -2,7 +2,7 @@ import { ExportApi } from '../ExportApi';
 import { ExportState, Report, ReportFormatType, ReportNameType, SystemReportFormat, SystemReportName } from '../../AdaptableState/ExportState';
 import { ApiBase } from './ApiBase';
 import { AdaptableForm } from '../../AdaptableState/Common/AdaptableForm';
-import { CustomDestination, CustomExportParams, ExportDestinationType, ExportFormContext, ExportResultData, SystemExportDestination } from '../../AdaptableOptions/ExportOptions';
+import { CustomDestination, CustomExportParams, ExportConfig, ExportDestinationType, ExportFormContext, ExportResultData, SystemExportDestination } from '../../AdaptableOptions/ExportOptions';
 import { IAdaptable } from '../../AdaptableInterfaces/IAdaptable';
 import { ExportInternalApi } from '../Internal/ExportInternalApi';
 import { AdaptableColumn } from '../../types';
@@ -37,10 +37,7 @@ export declare class ExportApiImpl extends ApiBase implements ExportApi {
     getCustomReports(): Report[];
     isColumnExportable(adaptableColumn: AdaptableColumn): boolean;
     getSupportedExportDestinations(reportFormat: ReportFormatType): ExportDestinationType[];
-    exportReport(reportName: ReportNameType, format: ReportFormatType, destination?: ExportDestinationType, config?: {
-        exportParams?: (defaultExportParams: CustomExportParams) => CustomExportParams;
-        showProgressIndicator?: boolean;
-    }): Promise<void>;
+    exportReport(reportName: ReportNameType, format: ReportFormatType, destination?: ExportDestinationType, exportConfig?: ExportConfig): Promise<void>;
     getReportData(reportName: ReportNameType, format: ReportFormatType, config?: {
         exportParams?: (defaultExportParams: CustomExportParams) => CustomExportParams;
         showProgressIndicator?: boolean;

package/src/Api/Implementation/ExportApiImpl.js

@@ -179,7 +179,7 @@ export class ExportApiImpl extends ApiBase {
             return true;
         });
     }
-    async exportReport(reportName, format, destination = 'Download', config) {
+    async exportReport(reportName, format, destination = 'Download', exportConfig) {
         let report = this.getReportByName(reportName);
         if (!this.checkItemExists(report, reportName, 'Report')) {
             return;
@@ -197,8 +197,8 @@ export class ExportApiImpl extends ApiBase {
                 report,
                 format,
                 destination,
-                showProgressIndicator: config?.showProgressIndicator === false ? false : true,
-                customExportParams: config?.exportParams,
+                showProgressIndicator: exportConfig?.showProgressIndicator === false ? false : true,
+                customExportParams: exportConfig?.exportParams,
             });
             if (!exportedReport) {
                 // for destination 'Download' and format 'Excel', 'VisualExcel' or 'Csv', AG Grid handles the download as well

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

@@ -15,6 +15,9 @@ export declare const normalizeTableLayout: (tableLayout: TableLayout, options?:
     isTree: boolean;
 }) => TableLayout;
 export declare const normalizePivotLayout: (pivotLayout: PivotLayout) => PivotLayout;
+export declare const getLayoutRowGroupValuesExceptionGroupKeys: (layout: TableLayout | PivotLayout) => any[][];
+export declare const toRowGroupValuesForLayoutState: (rowGroupValuesModel: TableLayoutModel['RowGroupValues']) => TableLayout['RowGroupValues'];
+export declare const toRowGroupValuesForLayoutModel: (rowGroupValuesState: TableLayout['RowGroupValues']) => TableLayoutModel['RowGroupValues'];
 export declare const checkForDuplicateColumns: (layout: TableLayout) => void;
 export declare const tableLayoutToTableLayoutModel: (tableLayout: TableLayout) => TableLayoutModel;
 export declare const pivotLayoutToPivotLayoutModel: (pivotLayout: PivotLayout) => PivotLayoutModel;

package/src/Api/Implementation/LayoutHelpers.js

@@ -64,6 +64,78 @@ const errorOnce = (message) => {
     console.error(message);
     errorOnceMessages.set(message, true);
 };
+export const getLayoutRowGroupValuesExceptionGroupKeys = (layout) => {
+    if (!layout.RowGroupValues) {
+        return [];
+    }
+    if (layout.RowGroupValues?.RowGroupDefaultBehavior === 'always-collapsed') {
+        return [];
+    }
+    if (layout.RowGroupValues?.RowGroupDefaultBehavior === 'always-expanded') {
+        return [];
+    }
+    if (Array.isArray(layout.RowGroupValues?.GroupKeys)) {
+        const currentGroupedColumns = (layout.RowGroupedColumns || []).join(',');
+        const matchingGroupKeys = layout.RowGroupValues.GroupKeys.find(({ RowGroupedColumns }) => {
+            return RowGroupedColumns.join(',') === currentGroupedColumns;
+        });
+        if (matchingGroupKeys) {
+            return matchingGroupKeys.ExceptionGroupKeys;
+        }
+    }
+    return layout.RowGroupValues.ExceptionGroupKeys || [];
+};
+export const toRowGroupValuesForLayoutState = (rowGroupValuesModel) => {
+    if (!rowGroupValuesModel) {
+        return undefined;
+    }
+    const rowGroupValuesState = {
+        RowGroupDefaultBehavior: rowGroupValuesModel.RowGroupDisplay,
+    };
+    if (rowGroupValuesModel.RowGroupDisplay === 'collapsed' ||
+        rowGroupValuesModel.RowGroupDisplay === 'expanded') {
+        if (rowGroupValuesModel.GroupKeys) {
+            rowGroupValuesState.GroupKeys =
+                rowGroupValuesModel.GroupKeys.map(({ RowGroupedColumns, Values }) => {
+                    return {
+                        RowGroupedColumns,
+                        ExceptionGroupKeys: Values,
+                    };
+                });
+        }
+        else {
+            rowGroupValuesState.ExceptionGroupKeys =
+                rowGroupValuesModel.Values;
+        }
+    }
+    return rowGroupValuesState;
+};
+export const toRowGroupValuesForLayoutModel = (rowGroupValuesState) => {
+    if (!rowGroupValuesState) {
+        return undefined;
+    }
+    if (rowGroupValuesState.RowGroupDefaultBehavior === 'always-collapsed' ||
+        rowGroupValuesState.RowGroupDefaultBehavior === 'always-expanded') {
+        return {
+            RowGroupDisplay: rowGroupValuesState.RowGroupDefaultBehavior,
+        };
+    }
+    if (rowGroupValuesState.GroupKeys) {
+        return {
+            RowGroupDisplay: rowGroupValuesState.RowGroupDefaultBehavior,
+            GroupKeys: rowGroupValuesState.GroupKeys.map(({ RowGroupedColumns, ExceptionGroupKeys }) => {
+                return {
+                    RowGroupedColumns,
+                    Values: ExceptionGroupKeys,
+                };
+            }),
+        };
+    }
+    return {
+        RowGroupDisplay: rowGroupValuesState.RowGroupDefaultBehavior,
+        Values: rowGroupValuesState.ExceptionGroupKeys || [],
+    };
+};
 export const checkForDuplicateColumns = (layout) => {
     if (layout.TableColumns) {
         const set = new Set(layout.TableColumns);
@@ -97,17 +169,7 @@ export const tableLayoutToTableLayoutModel = (tableLayout) => {
         ColumnSorts: tableLayout.ColumnSorts,
         RowGroupedColumns: tableLayout.RowGroupedColumns,
         ColumnPinning: tableLayout.ColumnPinning,
-        RowGroupValues: tableLayout.RowGroupValues
-            ? tableLayout.RowGroupValues.RowGroupDefaultBehavior === 'always-collapsed' ||
-                tableLayout.RowGroupValues.RowGroupDefaultBehavior === 'always-expanded'
-                ? {
-                    RowGroupDisplay: tableLayout.RowGroupValues.RowGroupDefaultBehavior,
-                }
-                : {
-                    RowGroupDisplay: tableLayout.RowGroupValues.RowGroupDefaultBehavior,
-                    Values: tableLayout.RowGroupValues.ExceptionGroupKeys || [],
-                }
-            : undefined,
+        RowGroupValues: toRowGroupValuesForLayoutModel(tableLayout.RowGroupValues),
         ColumnGroupValues: tableLayout.ColumnGroupValues
             ? tableLayout.ColumnGroupValues.ColumnGroupDefaultBehavior === 'always-expanded' ||
                 tableLayout.ColumnGroupValues.ColumnGroupDefaultBehavior === 'always-collapsed'
@@ -180,17 +242,7 @@ export const pivotLayoutToPivotLayoutModel = (pivotLayout) => {
         GrandTotalRow: pivotLayout.GrandTotalRow,
         PivotGrandTotal: pivotLayout.PivotGrandTotal,
         PivotColumnTotal: pivotLayout.PivotColumnTotal,
-        RowGroupValues: pivotLayout.RowGroupValues
-            ? pivotLayout.RowGroupValues.RowGroupDefaultBehavior === 'always-collapsed' ||
-                pivotLayout.RowGroupValues.RowGroupDefaultBehavior === 'always-expanded'
-                ? {
-                    RowGroupDisplay: pivotLayout.RowGroupValues.RowGroupDefaultBehavior,
-                }
-                : {
-                    RowGroupDisplay: pivotLayout.RowGroupValues.RowGroupDefaultBehavior,
-                    Values: pivotLayout.RowGroupValues.ExceptionGroupKeys || [],
-                }
-            : undefined,
+        RowGroupValues: toRowGroupValuesForLayoutModel(pivotLayout.RowGroupValues),
         ColumnGroupValues: pivotLayout.ColumnGroupValues
             ? pivotLayout.ColumnGroupValues.ColumnGroupDefaultBehavior === 'always-expanded' ||
                 pivotLayout.ColumnGroupValues.ColumnGroupDefaultBehavior === 'always-collapsed'
@@ -295,15 +347,7 @@ export const tableLayoutModelToTableLayout = (layoutModel) => {
         delete tableLayout.ColumnPinning;
     }
     if (layoutModel.RowGroupValues) {
-        tableLayout.RowGroupValues = {
-            RowGroupDefaultBehavior: layoutModel.RowGroupValues.RowGroupDisplay,
-        };
-        if ((layoutModel.RowGroupValues.RowGroupDisplay === 'collapsed' ||
-            layoutModel.RowGroupValues.RowGroupDisplay === 'expanded') &&
-            layoutModel.RowGroupValues.Values) {
-            // @ts-ignore
-            tableLayout.RowGroupValues.ExceptionGroupKeys = layoutModel.RowGroupValues.Values;
-        }
+        tableLayout.RowGroupValues = toRowGroupValuesForLayoutState(layoutModel.RowGroupValues);
     }
     else {
         delete tableLayout.RowGroupValues;
@@ -397,15 +441,7 @@ export const pivotLayoutModelToPivotLayout = (layoutModel) => {
         delete pivotLayout.PivotGroupedColumns;
     }
     if (layoutModel.RowGroupValues) {
-        pivotLayout.RowGroupValues = {
-            RowGroupDefaultBehavior: layoutModel.RowGroupValues.RowGroupDisplay,
-        };
-        if ((layoutModel.RowGroupValues.RowGroupDisplay === 'collapsed' ||
-            layoutModel.RowGroupValues.RowGroupDisplay === 'expanded') &&
-            layoutModel.RowGroupValues.Values) {
-            // @ts-ignore
-            pivotLayout.RowGroupValues.ExceptionGroupKeys = layoutModel.RowGroupValues.Values;
-        }
+        pivotLayout.RowGroupValues = toRowGroupValuesForLayoutState(layoutModel.RowGroupValues);
     }
     else {
         delete pivotLayout.RowGroupValues;

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

@@ -9,10 +9,10 @@ export declare class QuickSearchApiImpl extends ApiBase implements QuickSearchAp
     gotoNextMatch(): void;
     gotoPreviousMatch(): void;
     getQuickSearchValue(): string;
-    getQuickSearchStyle(): AdaptableStyle;
+    getQuickSearchCellMatchStyle(): AdaptableStyle;
     getQuickSearchTextMatchStyle(): AdaptableStyle | undefined;
     getQuickSearchCurrentTextMatchStyle(): AdaptableStyle | undefined;
-    setQuickSearchStyle(style: AdaptableStyle): void;
+    setQuickSearchCellMatchStyle(style: AdaptableStyle): void;
     openQuickSearchSettingsPanel(): void;
     showFloatingQuickSearch(): void;
     hideFloatingQuickSearch(): void;

package/src/Api/Implementation/QuickSearchApiImpl.js

@@ -21,8 +21,8 @@ export class QuickSearchApiImpl extends ApiBase {
     getQuickSearchValue() {
         return this.getQuickSearchState().QuickSearchText;
     }
-    getQuickSearchStyle() {
-        return this.getQuickSearchState().Style;
+    getQuickSearchCellMatchStyle() {
+        return this.getQuickSearchState().CellMatchStyle;
     }
     getQuickSearchTextMatchStyle() {
         return this.getQuickSearchState().TextMatchStyle;
@@ -30,8 +30,8 @@ export class QuickSearchApiImpl extends ApiBase {
     getQuickSearchCurrentTextMatchStyle() {
         return this.getQuickSearchState().CurrentTextMatchStyle;
     }
-    setQuickSearchStyle(style) {
-        this.dispatchAction(QuickSearchRedux.QuickSearchSetStyle(style));
+    setQuickSearchCellMatchStyle(style) {
+        this.dispatchAction(QuickSearchRedux.QuickSearchSetCellMatchingStyle(style));
     }
     openQuickSearchSettingsPanel() {
         this.showModulePopup(ModuleConstants.QuickSearchModuleId);

package/src/Api/Internal/FormatColumnInternalApi.d.ts

@@ -77,7 +77,7 @@ export declare class FormatColumnInternalApi extends ApiBase {
      * @param scope Scope to check
      */
     getFormatColumnDefsForScope(scope: ColumnScope): AdaptablePredicateDef[];
-    formatColumnWithColumnGroupStateShouldRender(formatColumn: FormatColumn, column: AdaptableColumn): boolean;
+    formatColumnWithColumnGroupScopeShouldRender(formatColumn: FormatColumn, column: AdaptableColumn): boolean;
     /**
      * Checks if format column is relevant for a given cell (intersection of given AdaptableColumn and RowNode)
      *

package/src/Api/Internal/FormatColumnInternalApi.js

@@ -172,7 +172,7 @@ export class FormatColumnInternalApi extends ApiBase {
             .predicateApi.internalApi.getFormatColumnPredicateDefs(scope)
             .filter((predicateDef) => this.getColumnScopeApi().isScopeInScope(scope, predicateDef.columnScope));
     }
-    formatColumnWithColumnGroupStateShouldRender(formatColumn, column) {
+    formatColumnWithColumnGroupScopeShouldRender(formatColumn, column) {
         if (!formatColumn.ColumnGroupScope) {
             return true;
         }
@@ -187,7 +187,7 @@ export class FormatColumnInternalApi extends ApiBase {
         if (!columnGroupParentForCurrentColumn) {
             return false;
         }
-        const columnGroupState = columnGroupParentForCurrentColumn.isExpanded()
+        const columnGroupScope = columnGroupParentForCurrentColumn.isExpanded()
             ? 'Expanded'
             : 'Collapsed';
         const columnGroupLeafColumns = columnGroupParentForCurrentColumn.getLeafColumns();
@@ -201,7 +201,7 @@ export class FormatColumnInternalApi extends ApiBase {
         if (formatColumn.ColumnGroupScope === 'Both') {
             return true;
         }
-        return formatColumn.ColumnGroupScope === columnGroupState;
+        return formatColumn.ColumnGroupScope === columnGroupScope;
     }
     /**
      * Checks if format column is relevant for a given cell (intersection of given AdaptableColumn and RowNode)
@@ -234,7 +234,7 @@ export class FormatColumnInternalApi extends ApiBase {
             }
         }
         if (formatColumn.ColumnGroupScope &&
-            !this.formatColumnWithColumnGroupStateShouldRender(formatColumn, column)) {
+            !this.formatColumnWithColumnGroupScopeShouldRender(formatColumn, column)) {
             return false;
         }
         if (!formatColumn.Rule) {

package/src/Api/QuickSearchApi.d.ts

@@ -32,7 +32,7 @@ export interface QuickSearchApi {
     /**
      *  Retrieves current Quick Search style
      */
-    getQuickSearchStyle(): AdaptableStyle;
+    getQuickSearchCellMatchStyle(): AdaptableStyle;
     /**
      * Retrieves the style for the text match in the Quick Search
      */
@@ -45,7 +45,7 @@ export interface QuickSearchApi {
      * Sets style for Quick Search; can be name of (a provided) css style
      * @param style the style to use
      */
-    setQuickSearchStyle(style: AdaptableStyle): void;
+    setQuickSearchCellMatchStyle(style: AdaptableStyle): void;
     /**
      * Opens Settings Panel with Quick Search section selected and visible
      */

package/src/Redux/ActionsReducers/QuickSearchRedux.d.ts

@@ -1,6 +1,10 @@
 import * as Redux from 'redux';
 import { QuickSearchState } from '../../AdaptableState/QuickSearchState';
 import { AdaptableStyle } from '../../AdaptableState/Common/AdaptableStyle';
+export declare const QUICK_SEARCH_SET_CELL_MATCHING_STYLE_DEFAULT: {
+    BackColor: string;
+    ForeColor: string;
+};
 /**
  * @ReduxAction Runs Quick Search
  */
@@ -8,7 +12,7 @@ export declare const QUICK_SEARCH_RUN = "QUICK_SEARCH_RUN";
 /**
  * @ReduxAction Sets Quick Search style
  */
-export declare const QUICK_SEARCH_SET_STYLE = "QUICK_SEARCH_SET_STYLE";
+export declare const QUICK_SEARCH_SET_CELL_MATCHING_STYLE = "QUICK_SEARCH_SET_CELL_MATCHING_STYLE";
 /**
  * @ReduxAction Quick Search Module is ready
  */
@@ -16,13 +20,13 @@ export declare const QUICK_SEARCH_READY = "QUICK_SEARCH_READY";
 export interface QuickSearchRunAction extends Redux.Action {
     quickSearchText: string;
 }
-export interface QuickSearchSetStyleAction extends Redux.Action {
-    style: AdaptableStyle;
+export interface QuickSearchSetMatchingCellStyleAction extends Redux.Action {
+    matchingCellStyle: AdaptableStyle;
 }
 export interface QuickSearchReadyAction extends Redux.Action {
     quickSearchState: QuickSearchState;
 }
 export declare const QuickSearchRun: (quickSearchText: string) => QuickSearchRunAction;
-export declare const QuickSearchSetStyle: (style: AdaptableStyle) => QuickSearchSetStyleAction;
+export declare const QuickSearchSetCellMatchingStyle: (matchingCellStyle: AdaptableStyle) => QuickSearchSetMatchingCellStyleAction;
 export declare const QuickSearchReady: (quickSearchState: QuickSearchState) => QuickSearchReadyAction;
 export declare const QuickSearchReducer: Redux.Reducer<QuickSearchState>;

package/src/Redux/ActionsReducers/QuickSearchRedux.js

@@ -1,5 +1,9 @@
 import { QUICK_SEARCH_DEFAULT_BACK_COLOR, QUICK_SEARCH_DEFAULT_FORE_COLOR, } from '../../Utilities/Constants/ReduxConstants';
 import { EMPTY_STRING } from '../../Utilities/Constants/GeneralConstants';
+export const QUICK_SEARCH_SET_CELL_MATCHING_STYLE_DEFAULT = {
+    BackColor: QUICK_SEARCH_DEFAULT_BACK_COLOR,
+    ForeColor: QUICK_SEARCH_DEFAULT_FORE_COLOR,
+};
 /**
  * @ReduxAction Runs Quick Search
  */
@@ -7,7 +11,7 @@ export const QUICK_SEARCH_RUN = 'QUICK_SEARCH_RUN';
 /**
  * @ReduxAction Sets Quick Search style
  */
-export const QUICK_SEARCH_SET_STYLE = 'QUICK_SEARCH_SET_STYLE';
+export const QUICK_SEARCH_SET_CELL_MATCHING_STYLE = 'QUICK_SEARCH_SET_CELL_MATCHING_STYLE';
 /**
  * @ReduxAction Quick Search Module is ready
  */
@@ -16,9 +20,9 @@ export const QuickSearchRun = (quickSearchText) => ({
     type: QUICK_SEARCH_RUN,
     quickSearchText,
 });
-export const QuickSearchSetStyle = (style) => ({
-    type: QUICK_SEARCH_SET_STYLE,
-    style,
+export const QuickSearchSetCellMatchingStyle = (matchingCellStyle) => ({
+    type: QUICK_SEARCH_SET_CELL_MATCHING_STYLE,
+    matchingCellStyle: matchingCellStyle,
 });
 export const QuickSearchReady = (quickSearchState) => ({
     type: QUICK_SEARCH_READY,
@@ -26,10 +30,6 @@ export const QuickSearchReady = (quickSearchState) => ({
 });
 const initialState = {
     QuickSearchText: EMPTY_STRING,
-    Style: {
-        BackColor: QUICK_SEARCH_DEFAULT_BACK_COLOR,
-        ForeColor: QUICK_SEARCH_DEFAULT_FORE_COLOR,
-    },
 };
 export const QuickSearchReducer = (state = initialState, action) => {
     switch (action.type) {
@@ -37,9 +37,9 @@ export const QuickSearchReducer = (state = initialState, action) => {
             return Object.assign({}, state, {
                 QuickSearchText: action.quickSearchText,
             });
-        case QUICK_SEARCH_SET_STYLE:
+        case QUICK_SEARCH_SET_CELL_MATCHING_STYLE:
             return Object.assign({}, state, {
-                Style: action.style,
+                CellMatchStyle: action.matchingCellStyle,
             });
         default:
             return state;

package/src/Redux/Store/AdaptableStore.js

@@ -466,7 +466,7 @@ const adaptableMiddleware = (adaptable) => (function(middlewareAPI) {
                  * Use Case: We have updated an AdapTable Module that affects rendering
                  * Action: We set up all columns again
                  */
-                case QuickSearchRedux.QUICK_SEARCH_SET_STYLE:
+                case QuickSearchRedux.QUICK_SEARCH_SET_CELL_MATCHING_STYLE:
                 case FormatColumnRedux.FORMAT_COLUMN_ADD:
                 case FormatColumnRedux.FORMAT_COLUMN_EDIT:
                 case FormatColumnRedux.FORMAT_COLUMN_DELETE:

package/src/Strategy/QuickSearchModule.d.ts

@@ -4,4 +4,5 @@ import { AdaptableApi } from '../Api/AdaptableApi';
 export declare class QuickSearchModule extends AdaptableModuleBase implements IModule {
     constructor(api: AdaptableApi);
     getViewProperties(): AdaptableModuleView;
+    onAdaptableReady(): void;
 }

package/src/Strategy/QuickSearchModule.js

@@ -1,6 +1,7 @@
 import { AdaptableModuleBase } from './AdaptableModuleBase';
 import * as ModuleConstants from '../Utilities/Constants/ModuleConstants';
 import { QuickSearchStatusBarContent } from '../View/QuickSearch/QuickSearchStatusBarContent';
+import { QUICK_SEARCH_SET_CELL_MATCHING_STYLE_DEFAULT, QuickSearchSetCellMatchingStyle, } from '../Redux/ActionsReducers/QuickSearchRedux';
 export class QuickSearchModule extends AdaptableModuleBase {
     constructor(api) {
         super(ModuleConstants.QuickSearchModuleId, ModuleConstants.QuickSearchFriendlyName, 'search-table', 'QuickSearchPopup', 'Quickly highlight all cells in the grid that contain matching query text', api);
@@ -14,4 +15,17 @@ export class QuickSearchModule extends AdaptableModuleBase {
             },
         };
     }
+    onAdaptableReady() {
+        const { api } = this;
+        const { internalApi, agGridApi } = api;
+        const isServerSideRowModel = agGridApi.getGridOption('rowModelType') === 'serverSide';
+        if (isServerSideRowModel &&
+            internalApi.getAdaptableState().QuickSearch.CellMatchStyle === undefined) {
+            // for server side row model,
+            // let's setup some defaults if there are no styles set
+            // as there are no defaults in the AG Grid find functionality (as it only works for non ssrm)
+            // so we need to set the defaults here
+            this.api.internalApi.dispatchReduxAction(QuickSearchSetCellMatchingStyle(QUICK_SEARCH_SET_CELL_MATCHING_STYLE_DEFAULT));
+        }
+    }
 }

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

@@ -8,6 +8,7 @@ export interface StyleComponentProps extends React.ClassAttributes<StyleComponen
     api: AdaptableApi;
     headless?: boolean;
     hidePreview?: boolean;
+    headerText?: string;
     Style: AdaptableStyle;
     showFontSizeAs?: 'radio' | 'dropdown';
     UpdateStyle: (style: AdaptableStyle) => void;

package/src/View/Components/StyleComponent.js

@@ -44,10 +44,11 @@ export class StyleComponent extends React.Component {
     }
     render() {
         const Cmp = this.props.headless ? Box : Panel;
+        const headerText = this.props.headerText ?? 'Style';
         const cmpProps = this.props.headless
             ? {}
             : {
-                header: 'Style',
+                header: headerText,
                 margin: 2,
                 'data-name': 'style-component',
             };