@adaptabletools/adaptable 16.0.0-canary.1 → 16.0.0-canary.2

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { AdaptableOptions } from '../../../../types';
+import { AdaptableConfig } from '../../../../types';
 export interface FinanceFormProps {
-    adaptableOptions: AdaptableOptions;
-    onChangeadAptableOptions: (adaptableOptions: AdaptableOptions) => void;
+    adaptableConfig: AdaptableConfig;
+    onChangedAdaptableConfig: (adaptableConfig: AdaptableConfig) => void;
 }
 export declare const FinanceForm: React.FunctionComponent<React.PropsWithChildren<FinanceFormProps>>;

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

@@ -216,17 +216,17 @@ const FDC3ColumnCreator = (props) => {
 const FinanceFormSectionTitle = (props) => (React.createElement(rebass_1.Box, Object.assign({}, props, { mb: 2 }),
     React.createElement(HelpBlock_1.default, null, props.children)));
 const FinanceForm = (props) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
-    const columnOptions = (_d = (_c = (_b = (_a = props.adaptableOptions) === null || _a === void 0 ? void 0 : _a._gridOptions) === null || _b === void 0 ? void 0 : _b.columnDefs) === null || _c === void 0 ? void 0 : _c.map) === null || _d === void 0 ? void 0 : _d.call(_c, (item) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+    const columnOptions = (_c = (_b = (_a = props.adaptableConfig.gridOptions) === null || _a === void 0 ? void 0 : _a.columnDefs) === null || _b === void 0 ? void 0 : _b.map) === null || _c === void 0 ? void 0 : _c.call(_b, (item) => {
         var _a;
         return ({
             label: StringExtensions_1.default.Humanize((_a = item.headerName) !== null && _a !== void 0 ? _a : item.field),
             value: item.field,
         });
     });
-    const financePlugin = (_f = (_e = props.adaptableOptions) === null || _e === void 0 ? void 0 : _e.plugins) === null || _f === void 0 ? void 0 : _f.find((item) => item.pluginId === 'finance');
-    const financePluginOptions = ((_g = financePlugin === null || financePlugin === void 0 ? void 0 : financePlugin.options) !== null && _g !== void 0 ? _g : {});
-    const fdc3Columns = (_h = financePluginOptions === null || financePluginOptions === void 0 ? void 0 : financePluginOptions.fdc3Columns) !== null && _h !== void 0 ? _h : {};
+    const financePlugin = (_e = (_d = props.adaptableConfig.adaptableOptions) === null || _d === void 0 ? void 0 : _d.plugins) === null || _e === void 0 ? void 0 : _e.find((item) => item.pluginId === 'finance');
+    const financePluginOptions = ((_f = financePlugin === null || financePlugin === void 0 ? void 0 : financePlugin.options) !== null && _f !== void 0 ? _f : {});
+    const fdc3Columns = (_g = financePluginOptions === null || financePluginOptions === void 0 ? void 0 : financePluginOptions.fdc3Columns) !== null && _g !== void 0 ? _g : {};
     const handleSetFdc3Columns = (key, newFDC3Columns) => {
         var _a;
         // Unfurtunatly finance plugin options need to be mutated.
@@ -235,7 +235,7 @@ const FinanceForm = (props) => {
         financePluginOptions.fdc3Columns = (_a = financePluginOptions.fdc3Columns) !== null && _a !== void 0 ? _a : {};
         financePluginOptions.fdc3Columns[key] = newFDC3Columns;
         // on change is called with a new array of plugins so the component refreshes.
-        props.onChangeadAptableOptions(Object.assign(Object.assign({}, props.adaptableOptions), { plugins: [...props.adaptableOptions.plugins] }));
+        props.onChangedAdaptableConfig(Object.assign(Object.assign({}, props.adaptableConfig), { adaptableOptions: Object.assign(Object.assign({}, props.adaptableConfig.adaptableOptions), { plugins: [...props.adaptableConfig.adaptableOptions.plugins] }) }));
     };
     const renderEditor = (fdc3ColumnType, fdc3ColumnsItems) => {
         return fdc3ColumnsItems.map((fdc3Column, currentFDCColumnId) => (React.createElement(rebass_1.Box, { key: currentFDCColumnId, mb: 3 },
@@ -261,19 +261,19 @@ const FinanceForm = (props) => {
                     var _a;
                     handleSetFdc3Columns(type, [...((_a = fdc3Columns[type]) !== null && _a !== void 0 ? _a : []), fdc3Column]);
                 } })),
-        Boolean((_j = fdc3Columns.instrumentColumns) === null || _j === void 0 ? void 0 : _j.length) && (React.createElement(rebass_1.Box, null,
+        Boolean((_h = fdc3Columns.instrumentColumns) === null || _h === void 0 ? void 0 : _h.length) && (React.createElement(rebass_1.Box, null,
             React.createElement(FinanceFormSectionTitle, null, "Instrument Columns"),
             renderEditor('instrumentColumns', fdc3Columns.instrumentColumns))),
-        Boolean((_k = fdc3Columns.positionColumns) === null || _k === void 0 ? void 0 : _k.length) && (React.createElement(rebass_1.Box, null,
+        Boolean((_j = fdc3Columns.positionColumns) === null || _j === void 0 ? void 0 : _j.length) && (React.createElement(rebass_1.Box, null,
             React.createElement(FinanceFormSectionTitle, null, "Position Columns"),
             renderEditor('positionColumns', fdc3Columns.positionColumns))),
-        Boolean((_l = fdc3Columns.contactColumns) === null || _l === void 0 ? void 0 : _l.length) && (React.createElement(rebass_1.Box, null,
+        Boolean((_k = fdc3Columns.contactColumns) === null || _k === void 0 ? void 0 : _k.length) && (React.createElement(rebass_1.Box, null,
             React.createElement(FinanceFormSectionTitle, null, "Contact Columns"),
             renderEditor('contactColumns', fdc3Columns.contactColumns))),
-        Boolean((_m = fdc3Columns.countryColumns) === null || _m === void 0 ? void 0 : _m.length) && (React.createElement(rebass_1.Box, null,
+        Boolean((_l = fdc3Columns.countryColumns) === null || _l === void 0 ? void 0 : _l.length) && (React.createElement(rebass_1.Box, null,
             React.createElement(FinanceFormSectionTitle, null, "Country Columns"),
             renderEditor('countryColumns', fdc3Columns.countryColumns))),
-        Boolean((_o = fdc3Columns.organizationColumns) === null || _o === void 0 ? void 0 : _o.length) && (React.createElement(rebass_1.Box, null,
+        Boolean((_m = fdc3Columns.organizationColumns) === null || _m === void 0 ? void 0 : _m.length) && (React.createElement(rebass_1.Box, null,
             React.createElement(FinanceFormSectionTitle, null, "Organization Columns"),
             renderEditor('organizationColumns', fdc3Columns.organizationColumns)))));
 };

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

@@ -1,8 +1,8 @@
 /// <reference types="react" />
-import { AdaptableOptions } from '../../../types';
+import { GridOptions } from '@ag-grid-community/core';
 interface GridOptionsFormOptions {
-    adaptableOptions: AdaptableOptions;
-    onChangeadAptableOptions: (adaptableOptions: AdaptableOptions) => void;
+    gridOptions: GridOptions;
+    onChangedGridOptions: (gridOptions: GridOptions) => void;
 }
 declare const GridOptionsForm: (props: GridOptionsFormOptions) => JSX.Element;
 export default GridOptionsForm;

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

@@ -5,44 +5,34 @@ const React = tslib_1.__importStar(require("react"));
 const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
 const CheckBox_1 = require("../../../components/CheckBox");
 const HelpBlock_1 = tslib_1.__importDefault(require("../../../components/HelpBlock"));
-const DefaultAdaptableOptions_1 = require("../../../Utilities/Defaults/DefaultAdaptableOptions");
 const rebass_1 = require("rebass");
 const GridOptionsForm = (props) => {
     var _a;
-    let abOptions = props.adaptableOptions;
-    const gridOptions = Object.assign(Object.assign({}, DefaultAdaptableOptions_1.DefaultAdaptableOptions._gridOptions), abOptions._gridOptions);
+    let { gridOptions } = props;
     return (React.createElement(rebass_1.Box, { p: 2 },
         React.createElement(HelpBlock_1.default, null, "Grid Options"),
         React.createElement(FormLayout_1.default, { margin: 2, columns: [{ name: 'children' }, { name: 'label', style: { textAlign: 'start' } }] },
             React.createElement(FormLayout_1.FormRow, { label: "Enable Range Selection" },
                 React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.enableRangeSelection, onChange: (enableRangeSelection) => {
-                        abOptions = Object.assign({}, abOptions);
-                        abOptions._gridOptions = Object.assign({}, abOptions._gridOptions);
-                        abOptions._gridOptions.enableRangeSelection = enableRangeSelection;
-                        props.onChangeadAptableOptions(abOptions);
+                        gridOptions = Object.assign(Object.assign({}, gridOptions), { enableRangeSelection: enableRangeSelection });
+                        props.onChangedGridOptions(gridOptions);
                     } })),
             React.createElement(FormLayout_1.FormRow, { label: "Show Quick Filter" },
                 React.createElement(CheckBox_1.CheckBox, { checked: (_a = gridOptions.defaultColDef) === null || _a === void 0 ? void 0 : _a.floatingFilter, onChange: (floatingFilter) => {
-                        abOptions = Object.assign({}, abOptions);
-                        abOptions._gridOptions = Object.assign({}, abOptions._gridOptions);
-                        abOptions._gridOptions.defaultColDef = {
-                            floatingFilter,
-                        };
-                        props.onChangeadAptableOptions(abOptions);
+                        gridOptions = Object.assign(Object.assign({}, gridOptions), { defaultColDef: {
+                                floatingFilter,
+                            } });
+                        props.onChangedGridOptions(gridOptions);
                     } })),
             React.createElement(FormLayout_1.FormRow, { label: "Suppress Column Virtualisation" },
                 React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.suppressColumnVirtualisation, onChange: (suppressColumnVirtualisation) => {
-                        abOptions = Object.assign({}, abOptions);
-                        abOptions._gridOptions = Object.assign({}, abOptions._gridOptions);
-                        abOptions._gridOptions.suppressColumnVirtualisation = suppressColumnVirtualisation;
-                        props.onChangeadAptableOptions(abOptions);
+                        gridOptions = Object.assign(Object.assign({}, gridOptions), { suppressColumnVirtualisation: suppressColumnVirtualisation });
+                        props.onChangedGridOptions(gridOptions);
                     } })),
             React.createElement(FormLayout_1.FormRow, { label: "Show Column Menu Button" },
                 React.createElement(CheckBox_1.CheckBox, { checked: gridOptions.suppressMenuHide, onChange: (suppressMenuHide) => {
-                        abOptions = Object.assign({}, abOptions);
-                        abOptions._gridOptions = Object.assign({}, abOptions._gridOptions);
-                        abOptions._gridOptions.suppressMenuHide = suppressMenuHide;
-                        props.onChangeadAptableOptions(abOptions);
+                        gridOptions = Object.assign(Object.assign({}, gridOptions), { suppressMenuHide: suppressMenuHide });
+                        props.onChangedGridOptions(gridOptions);
                     } })))));
 };
 exports.default = GridOptionsForm;

package/src/View/AdaptableWizardView/AdaptableConfigurationDialog/UIOptions/UIOptionsSidebarForm.d.ts

@@ -1,6 +1,6 @@
+import { GridOptions } from '@ag-grid-community/core';
 import * as React from 'react';
-import { AdaptableOptions } from '../../../../../types';
 export declare const UIOptionsSidebarForm: React.FunctionComponent<{
-    abOptions: AdaptableOptions;
-    onChange: (abOptions: AdaptableOptions) => void;
+    gridOptions: GridOptions;
+    onChange: (gridOptions: GridOptions) => void;
 }>;

package/src/View/AdaptableWizardView/AdaptableConfigurationDialog/UIOptions/UIOptionsSidebarForm.js

@@ -38,9 +38,8 @@ const isSidebarChecked = (sideBar, panelName) => {
 };
 const UIOptionsSidebarForm = (props) => {
     var _a;
-    const { abOptions, onChange } = props;
-    const { _gridOptions } = props.abOptions;
-    const sideBar = prepareSidebarDef(_gridOptions.sideBar);
+    const { gridOptions, onChange } = props;
+    const sideBar = prepareSidebarDef(gridOptions.sideBar);
     const renderSidebarCheckbox = (sidebarName) => {
         return (React.createElement(CheckBox_1.CheckBox, { mr: 3, key: sidebarName, checked: isSidebarChecked(sideBar, sidebarName), onChange: (check) => handleToolpanelsChange(sidebarName, check) }, StringExtensions_1.default.Humanize(sidebarName)));
     };
@@ -60,13 +59,13 @@ const UIOptionsSidebarForm = (props) => {
         if (newPanels.length === 0) {
             hiddenByDefault = true;
         }
-        const newAbOptions = Object.assign(Object.assign({}, abOptions), { _gridOptions: Object.assign(Object.assign({}, abOptions._gridOptions), { sideBar: Object.assign(Object.assign({}, sideBar), { toolPanels: newPanels, hiddenByDefault }) }) });
-        props.onChange(newAbOptions);
+        const newGridOptions = Object.assign(Object.assign({}, gridOptions), { sideBar: Object.assign(Object.assign({}, sideBar), { toolPanels: newPanels, hiddenByDefault }) });
+        props.onChange(newGridOptions);
     };
     let sidebarPosition = (_a = sideBar === null || sideBar === void 0 ? void 0 : sideBar.position) !== null && _a !== void 0 ? _a : 'right';
     const handleSidebarPositionChange = (position) => {
-        const newAbOptions = Object.assign(Object.assign({}, abOptions), { gridOptions: Object.assign(Object.assign({}, abOptions._gridOptions), { sideBar: Object.assign(Object.assign({}, sideBar), { position }) }) });
-        props.onChange(newAbOptions);
+        const newGridOptions = Object.assign(Object.assign({}, gridOptions), { sideBar: Object.assign(Object.assign({}, sideBar), { position }) });
+        props.onChange(newGridOptions);
     };
     return (React.createElement(rebass_1.Box, null,
         React.createElement(HelpBlock_1.default, null, "Tool Panels"),

package/src/View/AdaptableWizardView/AdaptableConfigurationDialog/UIOptions/UIOptionsStatusbarForm.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { AdaptableOptions } from '../../../../types';
+import { GridOptions } from '@ag-grid-community/core';
 export declare const UIOptionsStatusbarForm: React.FunctionComponent<{
-    abOptions: AdaptableOptions;
-    onChange: (abOptions: AdaptableOptions) => void;
+    gridOptions: GridOptions;
+    onChange: (gridOptions: GridOptions) => void;
 }>;

package/src/View/AdaptableWizardView/AdaptableConfigurationDialog/UIOptions/UIOptionsStatusbarForm.js

@@ -13,7 +13,7 @@ const DropdownButton_1 = tslib_1.__importDefault(require("../../../../components
 const FormBox_1 = require("../Components/FormBox");
 const UIOptionsStatusbarForm = (props) => {
     var _a, _b, _c, _d;
-    const allPanels = (_c = (_b = (_a = props.abOptions._gridOptions) === null || _a === void 0 ? void 0 : _a.statusBar) === null || _b === void 0 ? void 0 : _b.statusPanels) !== null && _c !== void 0 ? _c : [];
+    const allPanels = (_c = (_b = (_a = props.gridOptions) === null || _a === void 0 ? void 0 : _a.statusBar) === null || _b === void 0 ? void 0 : _b.statusPanels) !== null && _c !== void 0 ? _c : [];
     const panelIdtoPanel = (panelsIds, align) => panelsIds.map((panelId) => {
         const previousItem = allPanels.find((panel) => panel.key === panelId || panel.statusPanel === panelId);
         if (previousItem) {
@@ -35,7 +35,7 @@ const UIOptionsStatusbarForm = (props) => {
         const centerPanels = panelIdtoPanel(tabs[1].Items, 'center');
         const rightPanels = panelIdtoPanel(tabs[2].Items, 'right');
         const newStatusbarPanels = [...leftPanels, ...centerPanels, ...rightPanels];
-        props.onChange(Object.assign(Object.assign({}, props.abOptions), { _gridOptions: Object.assign(Object.assign({}, props.abOptions._gridOptions), { statusBar: Object.assign(Object.assign({}, props.abOptions._gridOptions.statusBar), { statusPanels: newStatusbarPanels }) }) }));
+        props.onChange(Object.assign(Object.assign({}, props.gridOptions), { statusBar: Object.assign(Object.assign({}, props.gridOptions.statusBar), { statusPanels: newStatusbarPanels }) }));
     };
     const disabled = false;
     const panelToTabItemId = (panel) => { var _a; return (_a = panel.key) !== null && _a !== void 0 ? _a : panel.statusPanel; };
@@ -78,7 +78,7 @@ const UIOptionsStatusbarForm = (props) => {
         const newStatusbarPanels = [...allPanels, newAdaptablePanel];
         setAdaptablePanelTitle('');
         setAdaptablePanelAlign('left');
-        props.onChange(Object.assign(Object.assign({}, props.abOptions), { _gridOptions: Object.assign(Object.assign({}, props.abOptions._gridOptions), { statusBar: Object.assign(Object.assign({}, props.abOptions._gridOptions.statusBar), { statusPanels: newStatusbarPanels }) }) }));
+        props.onChange(Object.assign(Object.assign({}, props.gridOptions), { statusBar: Object.assign(Object.assign({}, props.gridOptions.statusBar), { statusPanels: newStatusbarPanels }) }));
     };
     return (React.createElement(rebass_1.Box, null,
         React.createElement(HelpBlock_1.default, null, "Status Bar"),

package/src/View/AdaptableWizardView/AdaptableConfigurationDialog/UIOptions/UiOptionsForm.d.ts

@@ -1,8 +1,11 @@
+import { GridOptions } from '@ag-grid-community/core';
 import * as React from 'react';
 import { AdaptableOptions } from '../../../../types';
 interface UIElementsOptionsProps {
     adaptableOptions: AdaptableOptions;
-    onChangeadAptableOptions: (adaptableOptions: AdaptableOptions) => void;
+    gridOptions: GridOptions;
+    onChangedAdaptableOptions: (adaptableOptions: AdaptableOptions) => void;
+    onChangedGridOptions: (gridOptions: GridOptions) => void;
 }
 export declare const UIElementsForm: React.FunctionComponent<UIElementsOptionsProps>;
 export {};

package/src/View/AdaptableWizardView/AdaptableConfigurationDialog/UIOptions/UiOptionsForm.js

@@ -9,18 +9,17 @@ const UIOptionsActionColumnsForm_1 = require("./UIOptionsActionColumnsForm");
 const UIOptionsSidebarForm_1 = require("./UIOptionsSidebarForm");
 const UIOptionsStatusbarForm_1 = require("./UIOptionsStatusbarForm");
 const UIElementsForm = (props) => {
-    let abOptions = props.adaptableOptions;
     return (React.createElement(rebass_1.Box, { p: 2 },
         React.createElement(Tabs_1.Tabs, null,
             React.createElement(Tabs_1.Tabs.Tab, null, "Tool Panel"),
             React.createElement(Tabs_1.Tabs.Tab, null, "Status Bar"),
             React.createElement(Tabs_1.Tabs.Tab, null, "Action Rows"),
             React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(UIOptionsSidebarForm_1.UIOptionsSidebarForm, { abOptions: abOptions, onChange: props.onChangeadAptableOptions })),
+                React.createElement(UIOptionsSidebarForm_1.UIOptionsSidebarForm, { gridOptions: props.gridOptions, onChange: props.onChangedGridOptions })),
             React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(UIOptionsStatusbarForm_1.UIOptionsStatusbarForm, { abOptions: abOptions, onChange: props.onChangeadAptableOptions })),
+                React.createElement(UIOptionsStatusbarForm_1.UIOptionsStatusbarForm, { gridOptions: props.gridOptions, onChange: props.onChangedGridOptions })),
             ' ',
             React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(UIOptionsActionColumnsForm_1.UIOptionsActionColumnsForm, { abOptions: abOptions, onChange: props.onChangeadAptableOptions })))));
+                React.createElement(UIOptionsActionColumnsForm_1.UIOptionsActionColumnsForm, { abOptions: props.adaptableOptions, onChange: props.onChangedAdaptableOptions })))));
 };
 exports.UIElementsForm = UIElementsForm;

package/src/View/AdaptableWizardView/Wizard.d.ts

@@ -1,11 +1,13 @@
 import * as React from 'react';
 import { Reducer, ReactNode } from 'react';
+import { GridOptions } from '@ag-grid-community/core';
 import { AdaptableOptions } from '../../types';
 import { ConfigurationWizardProps } from './AdaptableConfigurationDialog/ConfigurationWizard';
 export interface AdaptableWizardViewProps {
     adaptableOptions?: Omit<AdaptableOptions, 'primaryKey'> & {
         primaryKey?: string;
     };
+    gridOptions?: GridOptions;
     /**
      * Default true.
      */
@@ -16,7 +18,7 @@ export interface AdaptableWizardViewProps {
      * This mode skips over interpreting data to figure-out columns.
      */
     skipToWizard?: boolean;
-    onInit: (adaptableOptions: AdaptableOptions) => any;
+    onInit: (adaptableOptions: AdaptableOptions, gridOptions: GridOptions) => any;
     fileContentsToJSON?: (str: string) => Promise<any> | any;
     readFile?: (file: File) => Promise<any>;
     fileAccept?: string;
@@ -39,6 +41,7 @@ interface WizardState {
     dropped: boolean;
     error: any;
     adaptableOptions: AdaptableOptions;
+    gridOptions: GridOptions;
 }
 /**
  * The wizard in a few modes:

package/src/View/AdaptableWizardView/Wizard.js

@@ -14,7 +14,7 @@ exports.initialState = {
 };
 const reducer = (state, action) => {
     if (action.type === 'DROPPED') {
-        return Object.assign(Object.assign({}, state), { adaptableOptions: action.payload, dropped: true, error: null });
+        return Object.assign(Object.assign({}, state), { adaptableOptions: action.payload.adaptableOptions, gridOptions: action.payload.gridOptions, dropped: true, error: null });
     }
     if (action.type === 'ERROR') {
         return Object.assign(Object.assign({}, state), { dropped: false, error: action.payload });
@@ -37,11 +37,10 @@ exports.reducer = reducer;
  */
 const Wizard = (props) => {
     var _a;
-    const [state, dispatch] = (0, react_1.useReducer)(exports.reducer, Object.assign(Object.assign({}, exports.initialState), { adaptableOptions: props.adaptableOptions }));
+    const [state, dispatch] = (0, react_1.useReducer)(exports.reducer, Object.assign(Object.assign({}, exports.initialState), { adaptableOptions: props.adaptableOptions, gridOptions: props.gridOptions }));
     const [droppableKey, setDroppableKey] = (0, react_1.useState)(Date.now());
     const [isDataLoading, setIsDataLoading] = (0, react_1.useState)(false);
     const handleDataSource = (array, file) => {
-        var _a;
         const dataSourceInfo = (props.prepareData || helper_1.prepareDataSource)(array, file);
         try {
             (0, Utils_1.validDataSource)(dataSourceInfo);
@@ -52,10 +51,9 @@ const Wizard = (props) => {
                 payload: `Invalid adaptable configuration - ${err}`,
             });
         }
-        const gridOptions = (0, helper_1.prepareGridOptions)(dataSourceInfo, (_a = props.adaptableOptions) === null || _a === void 0 ? void 0 : _a._gridOptions);
+        const gridOptions = (0, helper_1.prepareGridOptions)(dataSourceInfo, props.gridOptions);
         const adaptableOptions = Object.assign({}, props.adaptableOptions);
         adaptableOptions.adaptableId = adaptableOptions.adaptableId || (file ? file.name : '');
-        adaptableOptions._gridOptions = gridOptions;
         if (dataSourceInfo.primaryKey) {
             adaptableOptions.primaryKey = dataSourceInfo.primaryKey;
         }
@@ -63,24 +61,27 @@ const Wizard = (props) => {
         if (shouldShowWizard) {
             dispatch({
                 type: 'DROPPED',
-                payload: adaptableOptions,
+                payload: { adaptableOptions, gridOptions },
             });
         }
         else {
-            props.onInit(adaptableOptions);
+            props.onInit(adaptableOptions, gridOptions);
         }
     };
     let wizard;
     if (props.skipToWizard || state.dropped) {
-        wizard = (React.createElement(AdaptableConfigurationDialog_1.default, { startSections: props.startSections, adaptableOptions: state.adaptableOptions, onCancel: () => {
+        wizard = (React.createElement(AdaptableConfigurationDialog_1.default, { startSections: props.startSections, adaptableConfig: {
+                adaptableOptions: state.adaptableOptions,
+                gridOptions: state.gridOptions,
+            }, onCancel: () => {
                 // change the file droppable component key
                 // so it's remounted and it's in the initial state
                 setDroppableKey(Date.now());
                 dispatch({
                     type: 'CANCEL',
                 });
-            }, onFinish: (adaptableOptions) => {
-                props.onInit(adaptableOptions);
+            }, onFinish: (adaptableConfig) => {
+                props.onInit(adaptableConfig.adaptableOptions, adaptableConfig.gridOptions);
             } }));
     }
     (0, react_1.useEffect)(() => {

package/src/View/Dashboard/Dashboard.js

@@ -99,7 +99,7 @@ const DashboardComponent = (props) => {
     };
     const renderQuickSearch = () => {
         return (React.createElement(rebass_1.Box, { ml: 2 },
-            React.createElement(AdaptableFormControlTextClear_1.AdaptableFormControlTextClear, { type: "text", placeholder: props.api.optionsApi.getSearchOptions().quickSearchPlaceholder, className: "ab-DashboardToolbar__QuickSearch__text", value: searchText, OnTextChange: search, style: { width: 'auto' }, inputStyle: { width: '7rem' } })));
+            React.createElement(AdaptableFormControlTextClear_1.AdaptableFormControlTextClear, { type: "text", placeholder: props.api.optionsApi.getQuickSearchOptions().quickSearchPlaceholder, className: "ab-DashboardToolbar__QuickSearch__text", value: searchText, OnTextChange: search, style: { width: 'auto' }, inputStyle: { width: '7rem' } })));
     };
     let instanceName = props.api.internalApi.getToolbarTitle();
     let dashboardOptions = props.api.optionsApi.getDashboardOptions();

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

@@ -388,11 +388,11 @@ const renderStringFormat = (data, _onChange, setFormatOption, scopedCustomFormat
                     ] })))));
 };
 const FormatColumnFormatWizardSection = (props) => {
-    var _a, _b, _c;
+    var _a;
     const { data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const formatColumnApi = adaptable.api.formatColumnApi;
-    const customDisplayFormatters = (_c = (_b = (_a = adaptable.adaptableOptions) === null || _a === void 0 ? void 0 : _a.userInterfaceOptions) === null || _b === void 0 ? void 0 : _b.customDisplayFormatters) !== null && _c !== void 0 ? _c : [];
+    const customDisplayFormatters = (_a = adaptable.api.optionsApi.getFormatColumnOptions().customDisplayFormatters) !== null && _a !== void 0 ? _a : [];
     const update = (updated) => {
         props.onChange(Object.assign(Object.assign({}, data), updated));
     };

package/src/View/QuickSearch/QuickSearchPopup.js

@@ -18,7 +18,7 @@ const useQuickSearchDebounced_1 = require("./useQuickSearchDebounced");
 const QuickSearchPopupComponent = (props) => {
     const [searchText, search] = (0, useQuickSearchDebounced_1.useQuickSearchDebounced)(props);
     const [state, setState] = (0, react_1.useState)({
-        RunQueryAfterQuickSearch: props.api.optionsApi.getSearchOptions().filterResultsAfterQuickSearch,
+        RunQueryAfterQuickSearch: props.api.optionsApi.getQuickSearchOptions().filterResultsAfterQuickSearch,
         EditedStyle: props.QuickSearchStyle,
     });
     const onUpdateStyle = (style) => {
@@ -27,14 +27,14 @@ const QuickSearchPopupComponent = (props) => {
     };
     const onQuickSearchBehaviourChange = (checked) => {
         setState(Object.assign(Object.assign({}, state), { RunQueryAfterQuickSearch: checked }));
-        props.api.optionsApi.getAdaptableOptions().searchOptions.filterResultsAfterQuickSearch =
+        props.api.optionsApi.getAdaptableOptions().quickSearchOptions.filterResultsAfterQuickSearch =
             checked;
     };
     return (React.createElement(PopupPanel_1.PopupPanel, { headerText: props.moduleInfo.FriendlyName, glyphicon: props.moduleInfo.Glyph, infoLink: props.moduleInfo.HelpPage, infoLinkDisabled: !props.api.internalApi.isDocumentationLinksDisplayed() },
         React.createElement(Panel_1.default, { header: props.moduleInfo.FriendlyName + ' Text', style: { height: 'auto' }, variant: "default", borderRadius: "none", marginTop: 3, marginLeft: 2, marginRight: 2 },
             ' ',
             React.createElement(FormLayout_1.default, null,
-                React.createElement(AdaptableFormControlTextClear_1.AdaptableFormControlTextClear, { "data-name": "quick-search-text", type: "text", marginLeft: 2, marginRight: 5, padding: 20, style: { height: '100%' }, placeholder: props.api.optionsApi.getSearchOptions().quickSearchPlaceholder, value: searchText, OnTextChange: search }))),
+                React.createElement(AdaptableFormControlTextClear_1.AdaptableFormControlTextClear, { "data-name": "quick-search-text", type: "text", marginLeft: 2, marginRight: 5, padding: 20, style: { height: '100%' }, placeholder: props.api.optionsApi.getQuickSearchOptions().quickSearchPlaceholder, value: searchText, OnTextChange: search }))),
         React.createElement(Panel_1.default, { header: props.api.internalApi.getCorrectEnglishVariant('Behaviour'), style: { height: 'auto' }, variant: "default", borderRadius: "none", marginTop: 3, marginLeft: 2, marginRight: 2 },
             ' ',
             React.createElement(rebass_1.Flex, { flexDirection: "column" },

package/src/View/QuickSearch/QuickSearchStatusBarContent.js

@@ -12,6 +12,6 @@ const QuickSearchStatusBarContent = () => {
     const dispatch = (0, react_redux_1.useDispatch)();
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const handleTextChange = React.useCallback((text) => dispatch(QuickSearchRedux.QuickSearchRun(text)), []);
-    return (React.createElement(AdaptableFormControlTextClear_1.AdaptableFormControlTextClear, { onClick: (event) => event.stopPropagation(), type: "text", inputStyle: { padding: '2px 3px', width: 90 }, placeholder: adaptable.api.optionsApi.getSearchOptions().quickSearchPlaceholder, value: text, OnTextChange: handleTextChange }));
+    return (React.createElement(AdaptableFormControlTextClear_1.AdaptableFormControlTextClear, { onClick: (event) => event.stopPropagation(), type: "text", inputStyle: { padding: '2px 3px', width: 90 }, placeholder: adaptable.api.optionsApi.getQuickSearchOptions().quickSearchPlaceholder, value: text, OnTextChange: handleTextChange }));
 };
 exports.QuickSearchStatusBarContent = QuickSearchStatusBarContent;

package/src/View/QuickSearch/QuickSearchViewPanel.js

@@ -10,7 +10,7 @@ const React = tslib_1.__importStar(require("react"));
 const QuickSearchViewPanelComponent = (props) => {
     const [searchText, search] = (0, useQuickSearchDebounced_1.useQuickSearchDebounced)(props);
     const elementType = props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
-    return (React.createElement(AdaptableFormControlTextClear_1.AdaptableFormControlTextClear, { type: "text", placeholder: props.api.optionsApi.getSearchOptions().quickSearchPlaceholder, className: `ab-${elementType}__QuickSearch__text`, value: searchText, OnTextChange: search, style: { height: '100%' }, inputStyle: { width: '7rem' } }));
+    return (React.createElement(AdaptableFormControlTextClear_1.AdaptableFormControlTextClear, { type: "text", placeholder: props.api.optionsApi.getQuickSearchOptions().quickSearchPlaceholder, className: `ab-${elementType}__QuickSearch__text`, value: searchText, OnTextChange: search, style: { height: '100%' }, inputStyle: { width: '7rem' } }));
 };
 function mapStateToProps(state) {
     return {

package/src/agGrid/Adaptable.js

@@ -1256,7 +1256,7 @@ class Adaptable {
         if (!params.node) {
             return false;
         }
-        if (!this.api.optionsApi.getSearchOptions().runQuickSearchOnRowGroups && params.node.group) {
+        if (!this.api.optionsApi.getQuickSearchOptions().runQuickSearchOnRowGroups && params.node.group) {
             return false;
         }
         let quickSearchValue = this.api.quickSearchApi.getQuickSearchValue();

package/src/agGrid/agGridHelper.js

@@ -221,7 +221,7 @@ class agGridHelper {
             }
         }
         // lets set this here one as the function cannot change the result so dont need to run it each time
-        let excludeColumnFromQuickSearch = this.adaptable.adaptableOptions.searchOptions.excludeColumnFromQuickSearch;
+        let excludeColumnFromQuickSearch = this.adaptable.adaptableOptions.quickSearchOptions.excludeColumnFromQuickSearch;
         if (excludeColumnFromQuickSearch) {
             if (excludeColumnFromQuickSearch(abColumn)) {
                 abColumn.isExcludedFromQuickSearch = true;
@@ -540,7 +540,7 @@ class agGridHelper {
             }
         }
         // if they have selected to clear searches on startup then do it
-        if (this.adaptable.adaptableOptions.searchOptions.clearSearchesOnStartUp) {
+        if (this.adaptable.adaptableOptions.quickSearchOptions.clearSearchesOnStartUp) {
             if (StringExtensions_1.StringExtensions.IsNotNullOrEmpty(this.adaptable.api.quickSearchApi.getQuickSearchState().QuickSearchText) ||
                 StringExtensions_1.StringExtensions.IsNotNullOrEmpty(this.adaptable.api.queryApi.getCurrentQuery()) ||
                 ArrayExtensions_1.ArrayExtensions.IsNotNullOrEmpty(this.adaptable.api.dataSetApi.getDataSets())) {

package/src/metamodel/adaptable.metamodel.d.ts

@@ -964,6 +964,22 @@ export declare const ADAPTABLE_METAMODEL: {
         kind: string;
         desc: string;
     };
+    AgGridConfig: {
+        name: string;
+        kind: string;
+        desc: string;
+        props: ({
+            name: string;
+            kind: string;
+            desc: string;
+            ref: string;
+        } | {
+            name: string;
+            kind: string;
+            desc: string;
+            ref?: undefined;
+        })[];
+    };
     AlertButton: {
         name: string;
         kind: string;
@@ -2975,6 +2991,17 @@ export declare const ADAPTABLE_METAMODEL: {
             defVal?: undefined;
         })[];
     };
+    FormatColumnOptions: {
+        name: string;
+        kind: string;
+        desc: string;
+        props: {
+            name: string;
+            kind: string;
+            desc: string;
+            isOpt: boolean;
+        }[];
+    };
     FormatColumnPredicate: {
         name: string;
         kind: string;
@@ -3986,6 +4013,36 @@ export declare const ADAPTABLE_METAMODEL: {
             isOpt: boolean;
         }[];
     };
+    QuickSearchOptions: {
+        name: string;
+        kind: string;
+        desc: string;
+        props: ({
+            name: string;
+            kind: string;
+            desc: string;
+            isOpt: boolean;
+            gridInfo: string;
+            defVal: string;
+            noCode?: undefined;
+        } | {
+            name: string;
+            kind: string;
+            desc: string;
+            isOpt: boolean;
+            defVal: string;
+            gridInfo?: undefined;
+            noCode?: undefined;
+        } | {
+            name: string;
+            kind: string;
+            desc: string;
+            isOpt: boolean;
+            gridInfo: string;
+            noCode: string;
+            defVal: string;
+        })[];
+    };
     QuickSearchState: {
         name: string;
         kind: string;
@@ -4215,36 +4272,6 @@ export declare const ADAPTABLE_METAMODEL: {
             isOpt: boolean;
         }[];
     };
-    SearchOptions: {
-        name: string;
-        kind: string;
-        desc: string;
-        props: ({
-            name: string;
-            kind: string;
-            desc: string;
-            isOpt: boolean;
-            gridInfo: string;
-            defVal: string;
-            noCode?: undefined;
-        } | {
-            name: string;
-            kind: string;
-            desc: string;
-            isOpt: boolean;
-            defVal: string;
-            gridInfo?: undefined;
-            noCode?: undefined;
-        } | {
-            name: string;
-            kind: string;
-            desc: string;
-            isOpt: boolean;
-            gridInfo: string;
-            noCode: string;
-            defVal: string;
-        })[];
-    };
     SelectedCellInfo: {
         name: string;
         kind: string;