@adaptabletools/adaptable 10.0.4-canary.1 → 10.0.4-canary.5

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

@@ -14,9 +14,9 @@ const react_1 = require("react");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const AdaptableInput_1 = tslib_1.__importDefault(require("../../Components/AdaptableInput"));
 const CheckBox_1 = require("../../../components/CheckBox");
-const CodeBlock_1 = require("../../../components/CodeBlock");
 const FormatHelper_1 = require("../../../Utilities/Helpers/FormatHelper");
 const DateHelper_1 = require("../../../Utilities/Helpers/DateHelper");
+const Tag_1 = require("../../../components/Tag");
 const options = [
     { value: Enums_1.DataType.Number, label: Enums_1.DataType.Number },
     { value: Enums_1.DataType.String, label: Enums_1.DataType.String },
@@ -28,19 +28,19 @@ exports.renderFreeTextColumnSummary = (data) => {
     return (React.createElement(rebass_1.Box, { fontSize: 2 },
         React.createElement(rebass_1.Box, null,
             "Column Identifier: ",
-            React.createElement(CodeBlock_1.CodeBlock, null, data.ColumnId)),
+            React.createElement(Tag_1.Tag, null, data.ColumnId)),
         data.FriendlyName ? (React.createElement(rebass_1.Box, { mt: 3 },
             "Column Name: ",
-            React.createElement(CodeBlock_1.CodeBlock, null, (_a = data.FriendlyName) !== null && _a !== void 0 ? _a : data.ColumnId))) : null,
+            React.createElement(Tag_1.Tag, null, (_a = data.FriendlyName) !== null && _a !== void 0 ? _a : data.ColumnId))) : null,
         React.createElement(rebass_1.Box, { mt: 3 },
             "Data Type: ",
-            React.createElement(CodeBlock_1.CodeBlock, null, data.DataType)),
+            React.createElement(Tag_1.Tag, null, data.DataType)),
         data.DefaultValue !== undefined ? (React.createElement(rebass_1.Box, { mt: 3 },
             "Default Value: ",
-            React.createElement(CodeBlock_1.CodeBlock, null, `${data.DefaultValue}`))) : null,
+            React.createElement(Tag_1.Tag, null, data.DefaultValue))) : null,
         data.TextEditor !== undefined ? (React.createElement(rebass_1.Box, { mt: 3 },
             "Editor Type: ",
-            React.createElement(CodeBlock_1.CodeBlock, null, data.TextEditor))) : null));
+            React.createElement(Tag_1.Tag, null, data.TextEditor))) : null));
 };
 exports.isValidFreeTextColumn = (data, api) => {
     const columns = api.columnApi.getColumns();
@@ -62,7 +62,7 @@ exports.FreeTextColumnSettingsWizardSection = (props) => {
     const Pattern = api.internalApi.getAdaptableOptions().userInterfaceOptions.dateInputOptions
         .dateFormat;
     const [ColumnNameFocused, setColumnNameFocused] = react_1.useState(false);
-    const inEdit = !!data.Uuid;
+    const inEdit = props.isEdit;
     const validCheck = exports.isValidFreeTextColumn(data, api);
     const ErrorMessage = validCheck === true ? null : validCheck;
     const handleColumnIdChange = (event) => {

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

@@ -5,23 +5,36 @@ const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const react_1 = require("react");
 const rebass_1 = require("rebass");
-const AdaptableContext_1 = require("../../AdaptableContext");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const Helper_1 = require("../../../Utilities/Helpers/Helper");
 const FreeTextColumnSettingsWizardSection_1 = require("./FreeTextColumnSettingsWizardSection");
+const ObjectFactory_1 = tslib_1.__importDefault(require("../../../Utilities/ObjectFactory"));
+const FreeTextColumnRedux = tslib_1.__importStar(require("../../../Redux/ActionsReducers/FreeTextColumnRedux"));
+const react_redux_1 = require("react-redux");
 exports.FreeTextColumnWizard = (props) => {
-    const { api } = AdaptableContext_1.useAdaptable();
     const [freeTextColumn, setFreeTextColumn] = react_1.useState(() => {
-        const freeTextColumn = Helper_1.cloneObject(props.data);
+        const freeTextColumn = props.data
+            ? Helper_1.cloneObject(props.data)
+            : ObjectFactory_1.default.CreateEmptyFreeTextColumn(false);
         return freeTextColumn;
     });
-    return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { moduleInfo: props.moduleInfo, data: freeTextColumn, onHide: props.onCloseWizard, onFinish: props.onFinishWizard, sections: [
+    const dispatch = react_redux_1.useDispatch();
+    const handleFinish = () => {
+        if (props.data) {
+            dispatch(FreeTextColumnRedux.FreeTextColumnEdit(freeTextColumn));
+        }
+        else {
+            dispatch(FreeTextColumnRedux.FreeTextColumnAdd(freeTextColumn));
+        }
+        props.onFinishWizard(freeTextColumn);
+    };
+    return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: freeTextColumn, onHide: props.onCloseWizard, onFinish: handleFinish, sections: [
             {
                 title: 'Settings',
                 details: 'Configure the Free Text Column',
                 render: () => {
                     return (React.createElement(rebass_1.Box, { padding: 2 },
-                        React.createElement(FreeTextColumnSettingsWizardSection_1.FreeTextColumnSettingsWizardSection, { onChange: setFreeTextColumn })));
+                        React.createElement(FreeTextColumnSettingsWizardSection_1.FreeTextColumnSettingsWizardSection, { isEdit: Boolean(props.data), onChange: setFreeTextColumn })));
                 },
             },
             '-',

package/src/View/GridInfo/AdaptableOptionsComponent.js

@@ -70,7 +70,7 @@ exports.AdaptableOptionsComponent = (props) => {
         return (React.createElement(AdaptableObjectCollection_1.AdaptableObjectCollection, { colItems: getAdaptableOptionsColItems(), items: gridInfoOptionComponents }));
     };
     const [gridInfoOptions, setGridInfoOptions] = react_1.useState();
-    const [gridInfoContainerComponents, setGridInfoContainerComponents,] = react_1.useState();
+    const [gridInfoContainerComponents, setGridInfoContainerComponents] = react_1.useState();
     react_1.useEffect(() => {
         const gridInfoOptions = api.internalApi.getMetamodelService().getGridInfoOptions();
         const gridInfoContainerComponentMap = new Map();
@@ -81,7 +81,7 @@ exports.AdaptableOptionsComponent = (props) => {
         setGridInfoOptions(gridInfoOptions);
     }, []);
     const [expandedComponentContainer, setExpandedComponentContainer] = react_1.useState('');
-    return (React.createElement(rebass_1.Box, { margin: 2, "data-name": "gridInfo-adaptableOptions-content" }, gridInfoOptions &&
+    return (React.createElement(rebass_1.Box, { className: "ab-AdaptableOptions", padding: 2, "data-name": "gridInfo-adaptableOptions-content" }, gridInfoOptions &&
         Array.from(gridInfoOptions.entries()).map(([containerName, container]) => (React.createElement(OptionContainerComponent, { key: containerName, name: containerName, label: container.containerLabel, viewMode: containerName === expandedComponentContainer ? 'expanded' : 'collapsed', onViewModeChange: (newViewMode) => setExpandedComponentContainer(newViewMode === 'expanded' ? containerName : '') }, gridInfoContainerComponents.get(containerName))))));
 };
 const OptionContainerComponent = (props) => {

package/src/View/GridInfo/GridInfoPopup.d.ts

@@ -1,10 +1,11 @@
 /// <reference types="react" />
 import { ModuleViewPopupProps } from '../Components/SharedProps/ModuleViewPopupProps';
 import { AdaptableColumn } from '../../types';
+import { GridInfoSection } from '../../AdaptableOptions/UserInterfaceOptions';
 interface GridInfoPopupProps extends ModuleViewPopupProps<any> {
 }
 export interface AdaptableGridInfoState {
-    ActiveTab: 'GridSummary' | 'GridProperties' | 'AdaptableOptions' | 'Column';
+    ActiveTab: GridInfoSection;
     CurrentColumn: AdaptableColumn | undefined;
     IsBaseOptionsMinimised: boolean;
     IsContainerOptionsMinimised: boolean;

package/src/View/GridInfo/GridInfoPopup.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const AdaptableObjectRow_1 = require("../Components/AdaptableObjectRow");
 const rebass_1 = require("rebass");
-const PanelWithImage_1 = require("../Components/Panels/PanelWithImage");
+const PopupPanel_1 = require("../Components/Popups/AdaptablePopup/PopupPanel");
 const Radio_1 = tslib_1.__importDefault(require("../../components/Radio"));
 const AdaptableObjectCollection_1 = require("../Components/AdaptableObjectCollection");
 const ArrayExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/ArrayExtensions"));
@@ -13,12 +13,20 @@ const Helper_1 = tslib_1.__importDefault(require("../../Utilities/Helpers/Helper
 const AdaptablePopover_1 = require("../AdaptablePopover");
 const version_1 = tslib_1.__importDefault(require("../../../version"));
 const ColumnInfoComponent_1 = require("./ColumnInfoComponent");
-const GridOptionsComponent_1 = require("./GridOptionsComponent");
 const AdaptableOptionsComponent_1 = require("./AdaptableOptionsComponent");
 exports.GridInfoPopup = (props) => {
     var _a, _b, _c;
+    const entitlementService = props.api.internalApi.getEntitlementService();
+    const showGridSummary = entitlementService.isGridInfoSectionVisible('GridSummary');
+    const showAdaptableOptions = entitlementService.isGridInfoSectionVisible('AdaptableOptions');
+    const showColumnInfo = entitlementService.isGridInfoSectionVisible('ColumnInfo');
     const [state, setState] = React.useState({
-        ActiveTab: ((_a = props.popupParams) === null || _a === void 0 ? void 0 : _a.column) ? 'Column' : 'GridSummary',
+        ActiveTab: ((_a = props.popupParams) === null || _a === void 0 ? void 0 : _a.column) ? 'ColumnInfo'
+            : showGridSummary
+                ? 'GridSummary'
+                : showAdaptableOptions
+                    ? 'AdaptableOptions'
+                    : 'ColumnInfo',
         CurrentColumn: (_c = (_b = props.popupParams) === null || _b === void 0 ? void 0 : _b.column) !== null && _c !== void 0 ? _c : undefined,
         IsBaseOptionsMinimised: true,
         IsContainerOptionsMinimised: true,
@@ -83,17 +91,14 @@ exports.GridInfoPopup = (props) => {
     let gridSummaries = CreateGridSummaries(propValueColItems).map((x, index) => {
         return React.createElement(AdaptableObjectRow_1.AdaptableObjectRow, { key: index, colItems: x });
     });
-    return (React.createElement(rebass_1.Flex, { flexDirection: "column", style: { height: '100%' } },
-        React.createElement(PanelWithImage_1.PanelWithImage, { header: 'Grid Info', variant: "primary", glyphicon: 'info-sign', style: { flex: 1 } },
-            React.createElement(rebass_1.Flex, { marginBottom: 2, padding: 3 },
-                React.createElement(Radio_1.default, { "data-name": "radioButton-GridSummary", marginRight: 3, value: "GridSummary", checked: state.ActiveTab == 'GridSummary', onChange: (_, e) => onShowGridSummaryChanged('GridSummary') }, "Grid Summary"),
-                React.createElement(Radio_1.default, { "data-name": "radioButton-AdaptableOptions", marginRight: 3, value: "AdaptableOptions", checked: state.ActiveTab == 'AdaptableOptions', onChange: (_, e) => onShowGridSummaryChanged('AdaptableOptions') }, "Adaptable Options"),
-                React.createElement(Radio_1.default, { "data-name": "radioButton-Column", value: "Column", checked: state.ActiveTab == 'Column', onChange: (_, e) => onShowGridSummaryChanged('Column') }, "Column Info")),
-            state.ActiveTab == 'GridSummary' && (React.createElement(rebass_1.Box, { margin: 2 },
-                React.createElement(AdaptableObjectCollection_1.AdaptableObjectCollection, { colItems: propValueColItems, items: gridSummaries }))),
-            state.ActiveTab == 'GridProperties' && React.createElement(GridOptionsComponent_1.GridOptionsComponent, { api: props.api }),
-            state.ActiveTab == 'AdaptableOptions' && React.createElement(AdaptableOptionsComponent_1.AdaptableOptionsComponent, { api: props.api }),
-            state.ActiveTab == 'Column' && (React.createElement("div", null,
-                React.createElement(ColumnInfoComponent_1.ColumnInfoComponent, { api: props.api, teamSharingActivated: props.teamSharingActivated, column: state.CurrentColumn })))),
-        React.createElement(rebass_1.Flex, { alignItems: "center", flexDirection: "row", padding: 2, backgroundColor: "defaultbackground" })));
+    return (React.createElement(PopupPanel_1.PopupPanel, { headerText: 'Grid Info', glyphicon: 'info-sign' },
+        React.createElement(rebass_1.Flex, { marginBottom: 2, padding: 3 },
+            showGridSummary && (React.createElement(Radio_1.default, { "data-name": "radioButton-GridSummary", marginRight: 3, value: "GridSummary", checked: state.ActiveTab == 'GridSummary', onChange: (_, e) => onShowGridSummaryChanged('GridSummary') }, "Grid Summary")),
+            showAdaptableOptions && (React.createElement(Radio_1.default, { "data-name": "radioButton-AdaptableOptions", marginRight: 3, value: "AdaptableOptions", checked: state.ActiveTab == 'AdaptableOptions', onChange: (_, e) => onShowGridSummaryChanged('AdaptableOptions') }, "Adaptable Options")),
+            showColumnInfo && (React.createElement(Radio_1.default, { "data-name": "radioButton-Column", value: "Column", checked: state.ActiveTab == 'ColumnInfo', onChange: (_, e) => onShowGridSummaryChanged('ColumnInfo') }, "Column Info"))),
+        state.ActiveTab == 'GridSummary' && (React.createElement(rebass_1.Box, { margin: 2 },
+            React.createElement(AdaptableObjectCollection_1.AdaptableObjectCollection, { colItems: propValueColItems, items: gridSummaries }))),
+        state.ActiveTab == 'AdaptableOptions' && React.createElement(AdaptableOptionsComponent_1.AdaptableOptionsComponent, { api: props.api }),
+        state.ActiveTab == 'ColumnInfo' && (React.createElement("div", null,
+            React.createElement(ColumnInfoComponent_1.ColumnInfoComponent, { api: props.api, teamSharingActivated: props.teamSharingActivated, column: state.CurrentColumn })))));
 };

package/src/View/GridInfo/GridOptionsComponent.js

@@ -9,7 +9,7 @@ const CheckBox_1 = require("../../components/CheckBox");
 class GridOptionsComponent extends React.Component {
     constructor(props) {
         super(props);
-        const gridOptions = props.api.internalApi.getVendorGridInstance();
+        const gridOptions = props.api.internalApi.getAgGridInstance();
         this.state = {
             testString: 'Hello world',
             showTotalFooter: gridOptions.groupIncludeTotalFooter,
@@ -17,7 +17,7 @@ class GridOptionsComponent extends React.Component {
         };
     }
     render() {
-        return (React.createElement(Panel_1.default, { header: "Grid Options", margin: 2, "data-name": "grid-options-component" },
+        return (React.createElement(Panel_1.default, { className: "ab-GridOptions", header: "Grid Options", margin: 2, "data-name": "grid-options-component" },
             React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", marginBottom: 2 },
                 React.createElement(CheckBox_1.CheckBox, { onChange: (checked) => this.onTotalFooterChanged(checked), checked: this.state.showTotalFooter }, "Show Total Footer")),
             React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", marginBottom: 2 },

package/src/View/Layout/LayoutPopup.js

@@ -4,7 +4,7 @@ exports.LayoutPopup = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const react_redux_1 = require("react-redux");
-const PanelWithButton_1 = require("../Components/Panels/PanelWithButton");
+const PopupPanel_1 = require("../Components/Popups/AdaptablePopup/PopupPanel");
 const LayoutRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/LayoutRedux"));
 const TeamSharingRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/TeamSharingRedux"));
 const LayoutWizard_1 = require("./Wizard/LayoutWizard");
@@ -18,7 +18,6 @@ const EditableConfigEntityState_1 = require("../Components/SharedProps/EditableC
 const UIHelper_1 = require("../UIHelper");
 const StringExtensions_1 = require("../../Utilities/Extensions/StringExtensions");
 const EmptyContent_1 = tslib_1.__importDefault(require("../../components/EmptyContent"));
-const rebass_1 = require("rebass");
 const uuid_1 = require("../../components/utils/uuid");
 const AdaptableHelper_1 = tslib_1.__importDefault(require("../../Utilities/Helpers/AdaptableHelper"));
 class LayoutPopupComponent extends React.Component {
@@ -78,10 +77,9 @@ class LayoutPopupComponent extends React.Component {
                 fill: 'var(--ab-color-text-on-add)',
                 background: 'var(--ab-color-action-add)',
             } }));
-        return (React.createElement(rebass_1.Flex, { flex: 1, flexDirection: "column" },
-            React.createElement(PanelWithButton_1.PanelWithButton, { headerText: this.props.moduleInfo.FriendlyName, infoLink: this.props.moduleInfo.HelpPage, infoLinkDisabled: !this.props.api.internalApi.isDocumentationLinksDisplayed(), button: newSearchButton, glyphicon: this.props.moduleInfo.Glyph, bodyProps: { padding: 0 } },
-                layoutRows.length > 0 ? (React.createElement(AdaptableObjectCollection_1.AdaptableObjectCollection, { colItems: colItems, items: layoutRows })) : (React.createElement(EmptyContent_1.default, null, "Click 'New' to start creating layouts.")),
-                this.state.editedAdaptableObject != null && (React.createElement(LayoutWizard_1.LayoutWizard, { moduleInfo: this.props.moduleInfo, editedAdaptableObject: this.state.editedAdaptableObject, configEntities: this.props.Layouts, modalContainer: this.props.modalContainer, ColumnSorts: this.props.api.gridApi.getColumnSorts(), api: this.props.api, wizardStartIndex: this.state.wizardStartIndex, onCloseWizard: () => this.onCloseWizard(), onFinishWizard: () => this.onFinishWizard(), canFinishWizard: () => this.canFinishWizard() })))));
+        return (React.createElement(PopupPanel_1.PopupPanel, { headerText: this.props.moduleInfo.FriendlyName, infoLink: this.props.moduleInfo.HelpPage, infoLinkDisabled: !this.props.api.internalApi.isDocumentationLinksDisplayed(), button: newSearchButton, glyphicon: this.props.moduleInfo.Glyph },
+            layoutRows.length > 0 ? (React.createElement(AdaptableObjectCollection_1.AdaptableObjectCollection, { colItems: colItems, items: layoutRows })) : (React.createElement(EmptyContent_1.default, null, "Click 'New' to start creating layouts.")),
+            this.state.editedAdaptableObject != null && (React.createElement(LayoutWizard_1.LayoutWizard, { moduleInfo: this.props.moduleInfo, editedAdaptableObject: this.state.editedAdaptableObject, configEntities: this.props.Layouts, modalContainer: this.props.modalContainer, ColumnSorts: this.props.api.gridApi.getColumnSorts(), api: this.props.api, wizardStartIndex: this.state.wizardStartIndex, onCloseWizard: () => this.onCloseWizard(), onFinishWizard: () => this.onFinishWizard(), canFinishWizard: () => this.canFinishWizard() }))));
     }
     onNew() {
         this.setState({

package/src/View/Layout/LayoutViewPanel.js

@@ -30,8 +30,8 @@ class LayoutViewPanelComponent extends React.Component {
         });
         const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
         return (React.createElement(rebass_1.Flex, { flexDirection: "row", className: `ab-${elementType}__Layout__wrap`, flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
-            React.createElement(rebass_1.Flex, null,
-                React.createElement(DropdownButton_1.default, { marginRight: 2, columns: ['label'], style: { minWidth: 168, fontSize: 'small' }, className: `ab-${elementType}__Layout__select`, items: availableLayoutOptions, disabled: availableLayoutOptions.length == 0 }, layoutEntity ? layoutEntity.Name : null)),
+            React.createElement(rebass_1.Flex, { flex: 1 },
+                React.createElement(DropdownButton_1.default, { marginRight: 2, columns: ['label'], style: { width: '100%', fontSize: 'small' }, className: `ab-${elementType}__Layout__select`, items: availableLayoutOptions, disabled: availableLayoutOptions.length == 0 }, layoutEntity ? layoutEntity.Name : null)),
             React.createElement(rebass_1.Flex, { flexDirection: "row", className: join_1.default(this.props.accessLevel == 'ReadOnly' ? GeneralConstants.READ_ONLY_STYLE : '', `ab-${elementType}__Layout__wrap`) },
                 isManualSaveLayout && (React.createElement(ButtonSave_1.ButtonSave, { className: `ab-${elementType}__Layout__save`, onClick: () => this.onSaveLayout(), tooltip: "Save Changes to Current Layout", disabled: !this.props.CanSave, accessLevel: accessLevel })),
                 React.createElement(ButtonEdit_1.ButtonEdit, { onClick: () => this.props.onEditLayout(this.props.moduleInfo.Popup), tooltip: "Edit Layout", className: `ab-${elementType}__Layout__edit`, accessLevel: accessLevel }),

package/src/View/Layout/Wizard/LayoutEditor/ColumnList.js

@@ -71,8 +71,10 @@ exports.ColumnList = (props) => {
                 return (React.createElement(react_beautiful_dnd_1.Draggable, { key: `${c.columnId}-column`, draggableId: c.columnId, index: index }, (provided, snapshot) => {
                     const style = props.getItemStyle(c, snapshot, provided.draggableProps.style);
                     style.padding = 0;
+                    // required in case of non-string values returned by `headerValueGetter`
+                    const columnFriendlyName = typeof c.friendlyName === 'string' ? c.friendlyName : `${c.friendlyName}`;
                     if (search &&
-                        c.friendlyName.toLowerCase().indexOf(search.toLowerCase()) == -1) {
+                        columnFriendlyName.toLowerCase().indexOf(search.toLowerCase()) == -1) {
                         style.display = 'none';
                     }
                     return (React.createElement("div", Object.assign({ ref: provided.innerRef }, provided.draggableProps, provided.dragHandleProps, { className: "ab-LayoutEditor__ColumnList__column", style: style }), renderColumn(c)));

package/src/View/Layout/Wizard/LayoutEditor/index.js

@@ -245,6 +245,9 @@ exports.LayoutEditor = React.memo((props) => {
     const onPivotColumnsChange = react_1.useCallback((PivotColumns) => {
         setLayout(Object.assign(Object.assign({}, layout), { PivotColumns }));
     }, [layout]);
+    const showGridInfoLink = props.api.internalApi
+        .getEntitlementService()
+        .isGridInfoSectionVisible('ColumnInfo');
     return (React.createElement(react_beautiful_dnd_1.DragDropContext, { onDragEnd: onDragEnd, onDragStart: onDragStart },
         React.createElement(rebass_1.Box, { className: "ab-LayoutEditor" },
             React.createElement(ListPanel, { header: React.createElement(rebass_1.Flex, { width: "100%", flexDirection: "row", justifyContent: "space-between", alignItems: "center" },
@@ -273,12 +276,12 @@ exports.LayoutEditor = React.memo((props) => {
                                         React.createElement(icons_1.Icon, { name: "drag", size: 30 })),
                                     initialHeader,
                                     ' ',
-                                    React.createElement(ButtonInfo_1.ButtonInfo, { marginLeft: 1, style: { color: 'var(--ab-color-text-on-secondary)' }, onClick: () => {
+                                    showGridInfoLink && (React.createElement(ButtonInfo_1.ButtonInfo, { marginLeft: 1, style: { color: 'var(--ab-color-text-on-secondary)' }, onClick: () => {
                                             props.api.internalApi.showPopupScreen('GridInfo', 'GridInfoPopup', {
                                                 column: c,
                                                 source: 'ContextMenu',
                                             });
-                                        } }),
+                                        } })),
                                     c.columnGroup && c.columnGroup.groupCount > 1 ? (React.createElement(rebass_1.Box, { ml: 2, padding: 1, style: {
                                             borderRadius: 'var(--ab__border-radius)',
                                             background: 'var(--ab-color-defaultbackground)',

package/src/View/License/LicenseWatermark.js

@@ -12,6 +12,8 @@ const style = {
     margin: '5px',
     fontSize: '14px',
     alignItems: 'center',
+    color: 'var(--ab-color-text-on-defaultbackground)',
+    background: 'var(--ab-color-defaultbackground)',
 };
 const isStyleValid = (element) => {
     const notAllowedProperties = [
@@ -46,6 +48,8 @@ exports.LicenseWatermark = (props) => {
                 ref.current.style.fontWeight = `${style.fontWeight}`;
                 ref.current.style.margin = style.margin;
                 ref.current.style.fontSize = style.fontSize;
+                ref.current.style.color = style.color;
+                ref.current.style.background = style.background;
                 ref.current.style.display = 'flex';
                 ref.current.style.position = 'static';
                 ref.current.style.opacity = '1';

package/src/View/PlusMinus/Wizard/PlusMinusSettingsWizardSection.js

@@ -8,18 +8,18 @@ const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
 const Radio_1 = tslib_1.__importDefault(require("../../../components/Radio"));
 const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
 const Tabs_1 = require("../../../components/Tabs");
-const CodeBlock_1 = require("../../../components/CodeBlock");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const PlusMinusRuleWizardSection_1 = require("./PlusMinusRuleWizardSection");
 const EntityRulesEditor_1 = require("../../Components/EntityRulesEditor");
 const OnePageAdaptableWizard_2 = require("../../../View/Wizard/OnePageAdaptableWizard");
+const Tag_1 = require("../../../components/Tag");
 exports.PlusMinusSettingsSummary = (props) => {
     var _a;
     const { data } = OnePageAdaptableWizard_1.useOnePageWizardContext();
     return (React.createElement(React.Fragment, null,
         React.createElement(OnePageAdaptableWizard_2.SummaryText, null,
             "Nudge Value ",
-            React.createElement(CodeBlock_1.CodeBlock, null, (_a = data.NudgeValue) !== null && _a !== void 0 ? _a : 'Not selected')),
+            React.createElement(Tag_1.Tag, null, (_a = data.NudgeValue) !== null && _a !== void 0 ? _a : 'Not selected')),
         props.hasCondition && React.createElement(PlusMinusRuleWizardSection_1.PlusMinusRuleSummary, null)));
 };
 exports.isSettingsValid = (hasCondition) => (data, api, context) => {

package/src/View/PlusMinus/Wizard/PlusMinusWizard.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { AdaptableOnePageWizardProps } from '../../../View/Wizard/Interface/IAdaptableWizard';
 import { PlusMinusNudge } from '../../../PredefinedConfig/PlusMinusState';
-interface PlusMinusWizardProps extends AdaptableOnePageWizardProps<PlusMinusNudge> {
+export interface PlusMinusWizardProps extends AdaptableOnePageWizardProps<PlusMinusNudge> {
 }
 export declare const PlusMinusWizard: React.FunctionComponent<PlusMinusWizardProps>;
-export {};

package/src/View/PlusMinus/Wizard/PlusMinusWizard.js

@@ -8,14 +8,18 @@ const OnePageAdaptableWizard_1 = require("../../../View/Wizard/OnePageAdaptableW
 const NewScopeComponent_1 = require("../../Components/NewScopeComponent");
 const PlusMinusScopeWizardSection_1 = require("./PlusMinusScopeWizardSection");
 const PlusMinusSettingsWizardSection_1 = require("./PlusMinusSettingsWizardSection");
+const ObjectFactory_1 = tslib_1.__importDefault(require("../../../Utilities/ObjectFactory"));
+const react_redux_1 = require("react-redux");
+const PlusMinusRedux = tslib_1.__importStar(require("../../../Redux/ActionsReducers/PlusMinusRedux"));
 exports.PlusMinusWizard = (props) => {
     const [plusMinus, setPlusMinus] = React.useState(() => {
-        var _a, _b, _c;
-        return Object.assign(Object.assign({}, props.data), { Scope: (_a = props.data.Scope) !== null && _a !== void 0 ? _a : { All: true }, NudgeValue: (_c = (_b = props === null || props === void 0 ? void 0 : props.data) === null || _b === void 0 ? void 0 : _b.NudgeValue) !== null && _c !== void 0 ? _c : 20 });
+        var _a, _b, _c, _d;
+        return Object.assign(Object.assign({}, (props.data ? props.data : ObjectFactory_1.default.CreateEmptyPlusMinusNudge())), { Scope: (_b = (_a = props === null || props === void 0 ? void 0 : props.data) === null || _a === void 0 ? void 0 : _a.Scope) !== null && _b !== void 0 ? _b : { All: true }, NudgeValue: (_d = (_c = props === null || props === void 0 ? void 0 : props.data) === null || _c === void 0 ? void 0 : _c.NudgeValue) !== null && _d !== void 0 ? _d : 20 });
     });
     const [hasCondition, setHasCondition] = React.useState(() => {
+        var _a;
         // true if on edit and it has a condition
-        return Boolean(props.data.Rule);
+        return Boolean((_a = props === null || props === void 0 ? void 0 : props.data) === null || _a === void 0 ? void 0 : _a.Rule);
     });
     React.useEffect(() => {
         var _a;
@@ -28,7 +32,17 @@ exports.PlusMinusWizard = (props) => {
         }
         setPlusMinus(preparedData);
     }, [hasCondition]);
-    return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { moduleInfo: props.moduleInfo, data: plusMinus, onHide: props.onCloseWizard, onFinish: props.onFinishWizard, sections: [
+    const dispatch = react_redux_1.useDispatch();
+    const handleFinish = () => {
+        if (props.data) {
+            dispatch(PlusMinusRedux.PlusMinusNudgeEdit(plusMinus));
+        }
+        else {
+            dispatch(PlusMinusRedux.PlusMinusNudgeAdd(plusMinus));
+        }
+        props.onFinishWizard(plusMinus);
+    };
+    return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: plusMinus, onHide: props.onCloseWizard, onFinish: handleFinish, sections: [
             {
                 title: 'Target',
                 isValid: NewScopeComponent_1.isScopeValid,

package/src/View/Query/QueryViewPanel.js

@@ -88,7 +88,7 @@ class QueryViewPanelComponent extends React.Component {
                     } }),
                 isExpressionValid ? (React.createElement(ButtonPlay_1.ButtonPlay, { onClick: () => this.runQuery(), tooltip: '', accessLevel: 'Full', variant: "text", tone: "neutral", disabled: this.state.expression == '' || this.state.expression == this.props.CurrentQuery, marginRight: 1 })) : (React.createElement(ButtonInvalid_1.ButtonInvalid, { variant: "text", tone: "neutral", tooltip: "Invalid Query", marginRight: 1 })),
                 ' ',
-                this.props.CurrentQuery !== '' && (React.createElement(ButtonClear_1.ButtonClear, { onClick: () => this.props.onRunQuery(''), tooltip: "Clear Query", accessLevel: 'Full' })))) : (React.createElement(Input_1.default, { type: "text", placeholder: "Query", spellCheck: false, value: this.state.expression, onChange: (x) => this.setState({ expression: x.target.value }), style: { width: '100%', minWidth: 168 } }));
+                this.props.CurrentQuery !== '' && (React.createElement(ButtonClear_1.ButtonClear, { onClick: () => this.props.onRunQuery(''), tooltip: "Clear Query", accessLevel: 'Full' })))) : (React.createElement(Input_1.default, { type: "text", placeholder: "Query", spellCheck: false, value: this.state.expression, onChange: (x) => this.setState({ expression: x.target.value }), style: { width: '100%' } }));
         };
         const queryModuleAccessLevel = this.props.api.internalApi
             .getEntitlementService()

package/src/View/Query/Wizard/NamedQueryExpressionWizardSection.js

@@ -5,11 +5,11 @@ const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const react_1 = require("react");
 const rebass_1 = require("rebass");
-const CodeBlock_1 = require("../../../components/CodeBlock");
 const ExpressionEditor_1 = require("../../../components/ExpressionEditor");
 const AdaptableContext_1 = require("../../AdaptableContext");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const ModuleConstants_1 = require("../../../Utilities/Constants/ModuleConstants");
+const Tag_1 = require("../../../components/Tag");
 exports.isValidNamedQueryExpression = (data, api) => {
     if (!data.BooleanExpression) {
         return 'Query is empty';
@@ -23,7 +23,7 @@ exports.isValidNamedQueryExpression = (data, api) => {
 exports.renderNamedQueryExpressionSummary = (data) => {
     return (React.createElement(rebass_1.Text, { fontSize: 2 },
         "Expression: ",
-        React.createElement(CodeBlock_1.CodeBlock, null, data.BooleanExpression)));
+        React.createElement(Tag_1.Tag, null, data.BooleanExpression)));
 };
 exports.NamedQueryExpressionWizardSection = (props) => {
     const { api } = AdaptableContext_1.useAdaptable();

package/src/View/Query/Wizard/NamedQuerySettingsWizardSection.js

@@ -8,8 +8,8 @@ const WizardPanel_1 = tslib_1.__importDefault(require("../../../components/Wizar
 const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
 const ErrorBox_1 = tslib_1.__importDefault(require("../../../components/ErrorBox"));
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
-const CodeBlock_1 = require("../../../components/CodeBlock");
 const AdaptableInput_1 = tslib_1.__importDefault(require("../../Components/AdaptableInput"));
+const Tag_1 = require("../../../components/Tag");
 exports.isValidNamedQuerySettings = (data, api) => {
     const validationResult = api.queryApi.isValidNamedQueryName(data);
     const ErrorMessage = !validationResult.valid ? validationResult.message : null;
@@ -21,7 +21,7 @@ exports.isValidNamedQuerySettings = (data, api) => {
 exports.renderNamedQuerySettingsSummary = (data) => {
     return (React.createElement(rebass_1.Text, { fontSize: 2 },
         "Name: ",
-        React.createElement(CodeBlock_1.CodeBlock, null, data.Name)));
+        React.createElement(Tag_1.Tag, null, data.Name)));
 };
 exports.NamedQuerySettingsWizardSection = (props) => {
     const { data, api } = OnePageAdaptableWizard_1.useOnePageWizardContext();

package/src/View/Query/Wizard/NamedQueryWizard.js

@@ -9,11 +9,23 @@ const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const NamedQuerySettingsWizardSection_1 = require("./NamedQuerySettingsWizardSection");
 const Helper_1 = require("../../../Utilities/Helpers/Helper");
 const NamedQueryExpressionWizardSection_1 = require("./NamedQueryExpressionWizardSection");
+const ObjectFactory_1 = tslib_1.__importDefault(require("../../../Utilities/ObjectFactory"));
+const react_redux_1 = require("react-redux");
+const QueryRedux = tslib_1.__importStar(require("../../../Redux/ActionsReducers/QueryRedux"));
 function NamedQueryWizard(props) {
     const [namedQuery, setNamedQuery] = react_1.useState(() => {
-        return Helper_1.cloneObject(props.data);
+        return props.data
+            ? Helper_1.cloneObject(props.data)
+            : ObjectFactory_1.default.CreateEmptyNamedQuery();
     });
-    return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { onFinish: props.onFinishWizard, sections: [
+    const dispatch = react_redux_1.useDispatch();
+    if (props.data) {
+        dispatch(QueryRedux.NamedQueryEdit);
+    }
+    else {
+        dispatch(QueryRedux.NamedQueryAdd);
+    }
+    return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, onFinish: props.onFinishWizard, sections: [
             {
                 title: 'Expression',
                 details: 'Specify the query expression',

package/src/View/QuickSearch/QuickSearchPopup.js

@@ -6,7 +6,7 @@ const React = tslib_1.__importStar(require("react"));
 const react_1 = require("react");
 const react_redux_1 = require("react-redux");
 const QuickSearchRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/QuickSearchRedux"));
-const PanelWithImage_1 = require("../Components/Panels/PanelWithImage");
+const PopupPanel_1 = require("../Components/Popups/AdaptablePopup/PopupPanel");
 const Panel_1 = tslib_1.__importDefault(require("../../components/Panel"));
 const FormLayout_1 = tslib_1.__importStar(require("../../components/FormLayout"));
 const AdaptableFormControlTextClear_1 = require("../Components/Forms/AdaptableFormControlTextClear");
@@ -30,7 +30,7 @@ const QuickSearchPopupComponent = (props) => {
         setState(Object.assign(Object.assign({}, state), { RunQueryAfterQuickSearch: checked }));
         props.api.internalApi.getAdaptableOptions().searchOptions.filterResultsAfterQuickSearch = checked;
     };
-    return (React.createElement(PanelWithImage_1.PanelWithImage, { variant: "primary", header: props.moduleInfo.FriendlyName, glyphicon: props.moduleInfo.Glyph, infoLink: props.moduleInfo.HelpPage, infoLinkDisabled: !props.api.internalApi.isDocumentationLinksDisplayed(), bodyProps: { padding: 2 } },
+    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,

package/src/View/QuickSearch/useQuickSearchDebounced.js

@@ -4,12 +4,11 @@ exports.useQuickSearchDebounced = void 0;
 const tslib_1 = require("tslib");
 const react_1 = require("react");
 const debounce_1 = tslib_1.__importDefault(require("lodash-es/debounce"));
+const GeneralConstants_1 = require("../../Utilities/Constants/GeneralConstants");
 exports.useQuickSearchDebounced = (props) => {
     var _a;
     const [searchText, setSearchText] = react_1.useState((_a = props.QuickSearchText) !== null && _a !== void 0 ? _a : '');
-    const debouncedRunQuickSearch = react_1.useMemo(() => debounce_1.default(props.onRunQuickSearch, 350), [
-        props.onRunQuickSearch,
-    ]);
+    const debouncedRunQuickSearch = react_1.useMemo(() => debounce_1.default(props.onRunQuickSearch, GeneralConstants_1.QUICK_SEARCH_DEBOUNCE_TIME), [props.onRunQuickSearch]);
     react_1.useEffect(() => {
         setSearchText(props.QuickSearchText);
     }, [props.QuickSearchText]);

package/src/View/Schedule/Wizard/ScheduleScheduleSummary.js

@@ -3,12 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ScheduleScheduleSummary = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
-const CodeBlock_1 = require("../../../components/CodeBlock");
+const Tag_1 = require("../../../components/Tag");
 const UIHelper_1 = require("../../UIHelper");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 exports.ScheduleScheduleSummary = () => {
     const { data } = OnePageAdaptableWizard_1.useOnePageWizardContext();
     return (React.createElement(OnePageAdaptableWizard_1.SummaryText, null,
         "Schedule: ",
-        React.createElement(CodeBlock_1.CodeBlock, null, UIHelper_1.UIHelper.getScheduleDescription(data.Schedule))));
+        React.createElement(Tag_1.Tag, null, UIHelper_1.UIHelper.getScheduleDescription(data.Schedule))));
 };

package/src/View/Schedule/Wizard/ScheduleScheduleWizard.js

@@ -8,7 +8,6 @@ const CheckBox_1 = require("../../../components/CheckBox");
 const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
 const Radio_1 = tslib_1.__importDefault(require("../../../components/Radio"));
 const Tabs_1 = require("../../../components/Tabs");
-const Schedule_1 = require("../../../PredefinedConfig/Common/Schedule");
 const ArrayExtensions_1 = tslib_1.__importDefault(require("../../../Utilities/Extensions/ArrayExtensions"));
 const AdaptableInput_1 = tslib_1.__importDefault(require("../../Components/AdaptableInput"));
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
@@ -31,31 +30,31 @@ exports.isScheduleValid = (schedule, isOneOff) => {
 const daysMap = [
     {
         label: 'Monday',
-        value: Schedule_1.DayOfWeek.Monday,
+        value: 'Monday',
     },
     {
         label: 'Tuesday',
-        value: Schedule_1.DayOfWeek.Tuesday,
+        value: 'Tuesday',
     },
     {
         label: 'Wednesday',
-        value: Schedule_1.DayOfWeek.Wednesday,
+        value: 'Wednesday',
     },
     {
         label: 'Thursday',
-        value: Schedule_1.DayOfWeek.Thursday,
+        value: 'Thursday',
     },
     {
         label: 'Friday',
-        value: Schedule_1.DayOfWeek.Friday,
+        value: 'Friday',
     },
     {
         label: 'Saturday',
-        value: Schedule_1.DayOfWeek.Saturday,
+        value: 'Saturday',
     },
     {
         label: 'Sunday',
-        value: Schedule_1.DayOfWeek.Sunday,
+        value: 'Sunday',
     },
 ];
 exports.ScheduleScheduleWizard = (props) => {

package/src/View/Schedule/Wizard/ScheduleSettingsWizard/ScheduleSettingsOpenFin.js

@@ -20,5 +20,5 @@ exports.ScheduleSettingsOpenFin = (props) => {
             React.createElement(Tabs_1.Tabs.Content, null,
                 React.createElement(FormLayout_1.default, null,
                     React.createElement(FormLayout_1.FormRow, { label: "Select Report" },
-                        React.createElement(DropdownButton_1.default, { style: { width: 300 }, disabled: props.allReports.length == 0, items: reportOptions }, ((_b = (_a = props === null || props === void 0 ? void 0 : props.openFin) === null || _a === void 0 ? void 0 : _a.OpenFinReport) === null || _b === void 0 ? void 0 : _b.ReportName) || 'Select Report')))))));
+                        React.createElement(DropdownButton_1.default, { columns: ['label'], style: { width: 300 }, disabled: props.allReports.length == 0, items: reportOptions }, ((_b = (_a = props === null || props === void 0 ? void 0 : props.openFin) === null || _a === void 0 ? void 0 : _a.OpenFinReport) === null || _b === void 0 ? void 0 : _b.ReportName) || 'Select Report')))))));
 };