@adaptabletools/adaptable 16.2.4 → 17.0.0-canary.1

package/src/View/AdaptableWizardView/index.js

@@ -1,10 +1,7 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const styled_components_1 = require("styled-components");
-const theme_1 = tslib_1.__importDefault(require("../../theme"));
-const Wizard_1 = require("./Wizard");
-const AdaptableWizardView = (props) => (React.createElement(styled_components_1.ThemeProvider, { theme: theme_1.default },
-    React.createElement(Wizard_1.Wizard, Object.assign({}, props))));
-exports.default = AdaptableWizardView;
+import * as React from 'react';
+import { ThemeProvider } from 'styled-components';
+import theme from '../../theme';
+import { Wizard } from './Wizard';
+const AdaptableWizardView = (props) => (React.createElement(ThemeProvider, { theme: theme },
+    React.createElement(Wizard, Object.assign({}, props))));
+export default AdaptableWizardView;

package/src/View/Alert/ActiveAlertsPanel.js

@@ -1,16 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ActiveAlertsPanel = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const AdaptableContext_1 = require("../AdaptableContext");
-const ModuleConstants = tslib_1.__importStar(require("../../Utilities/Constants/ModuleConstants"));
-const AdaptableObjectCompactList_1 = require("../Components/AdaptableObjectList/AdaptableObjectCompactList");
-const react_redux_1 = require("react-redux");
-const ActiveAlertsPanel = () => {
-    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+import * as React from 'react';
+import { useAdaptable } from '../AdaptableContext';
+import * as ModuleConstants from '../../Utilities/Constants/ModuleConstants';
+import { AdaptableObjectCompactList } from '../Components/AdaptableObjectList/AdaptableObjectCompactList';
+import { useSelector } from 'react-redux';
+export const ActiveAlertsPanel = () => {
+    const adaptable = useAdaptable();
     const filterModule = adaptable.ModuleService.getModuleById(ModuleConstants.AlertModuleId);
-    const alerts = (0, react_redux_1.useSelector)((state) => state.System.AdaptableAlerts);
-    return React.createElement(AdaptableObjectCompactList_1.AdaptableObjectCompactList, { abObjects: alerts, module: filterModule });
+    const alerts = useSelector((state) => state.System.AdaptableAlerts);
+    return React.createElement(AdaptableObjectCompactList, { abObjects: alerts, module: filterModule });
 };
-exports.ActiveAlertsPanel = ActiveAlertsPanel;

package/src/View/Alert/ActiveAlertsPanelItemLabel.js

@@ -1,22 +1,17 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ActiveAlertsPanelItemLabel = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const rebass_1 = require("rebass");
-const icons_1 = require("../../components/icons");
-const UIHelper_1 = tslib_1.__importDefault(require("../UIHelper"));
-const ActiveAlertsPanelItemLabel = (props) => {
-    const iconColor = UIHelper_1.default.getColorByMessageType(props.data.alertDefinition.MessageType);
+import * as React from 'react';
+import { Box, Text } from 'rebass';
+import { allIcons } from '../../components/icons';
+import UIHelper from '../UIHelper';
+export const ActiveAlertsPanelItemLabel = (props) => {
+    const iconColor = UIHelper.getColorByMessageType(props.data.alertDefinition.MessageType);
     const iconStyle = {
         color: iconColor,
         fill: iconColor,
     };
-    const iconName = UIHelper_1.default.getGlyphByMessageType(props.data.alertDefinition.MessageType);
-    const IconCmp = icons_1.allIcons[iconName];
+    const iconName = UIHelper.getGlyphByMessageType(props.data.alertDefinition.MessageType);
+    const IconCmp = allIcons[iconName];
     const icon = IconCmp ? React.createElement(IconCmp, null) : null;
-    return (React.createElement(rebass_1.Box, null,
-        React.createElement(rebass_1.Text, { style: Object.assign({ float: 'left' }, iconStyle) }, icon),
+    return (React.createElement(Box, null,
+        React.createElement(Text, { style: Object.assign({ float: 'left' }, iconStyle) }, icon),
         props.data.header));
 };
-exports.ActiveAlertsPanelItemLabel = ActiveAlertsPanelItemLabel;

package/src/View/Alert/AlertEmptyView.js

@@ -1,17 +1,12 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AlertEmptyView = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const AdaptableContext_1 = require("../AdaptableContext");
-const AlertEmptyView = (props) => {
-    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+import * as React from 'react';
+import { useAdaptable } from '../AdaptableContext';
+export const AlertEmptyView = (props) => {
+    const adaptable = useAdaptable();
     const accessLevel = adaptable.api.internalApi
         .getEntitlementService()
         .getEntitlementAccessLevelForModule(props.module.moduleInfo.ModuleName);
     const text = accessLevel == 'ReadOnly'
         ? 'You have no Alert Definitions.'
-        : "Click 'New' to start creating Alert Definitions. An Alert is triggered whenever an edit - or external data change - matches the Rule in the Alert Definition.";
+        : "Click 'New' to create a new Alert Definition. The Definition will include the Rule which triggers the Alert, and the behaviour of the Alert.";
     return React.createElement(React.Fragment, null, text);
 };
-exports.AlertEmptyView = AlertEmptyView;

package/src/View/Alert/AlertEntityRow.js

@@ -1,33 +1,28 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AlertEntityRow = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const EntityListActionButtons_1 = require("../Components/Buttons/EntityListActionButtons");
-const AdaptableObjectRow_1 = require("../Components/AdaptableObjectRow");
-const EntityRowItem_1 = require("../Components/EntityRowItem");
-const DropdownButton_1 = tslib_1.__importDefault(require("../../components/DropdownButton"));
-const Helper_1 = require("../../Utilities/Helpers/Helper");
-class AlertEntityRow extends React.Component {
+import * as React from 'react';
+import { EntityListActionButtons } from '../Components/Buttons/EntityListActionButtons';
+import { AdaptableObjectRow } from '../Components/AdaptableObjectRow';
+import { EntityRowItem } from '../Components/EntityRowItem';
+import DropdownButton from '../../components/DropdownButton';
+import { cloneObject } from '../../Utilities/Helpers/Helper';
+export class AlertEntityRow extends React.Component {
     render() {
         let alertDefinition = this.props.adaptableObject;
         let messageTypes = ['Info', 'Success', 'Warning', 'Error'];
-        let colItems = (0, Helper_1.cloneObject)(this.props.colItems);
-        colItems[0].Content = (React.createElement(EntityRowItem_1.EntityRowItem, { Content: this.props.api.scopeApi.getScopeToString(alertDefinition.Scope) }));
-        colItems[1].Content = (React.createElement(EntityRowItem_1.EntityRowItem, { Content: this.props.api.alertApi.internalApi.getAlertRuleDescription(alertDefinition) }));
+        let colItems = cloneObject(this.props.colItems);
+        colItems[0].Content = (React.createElement(EntityRowItem, { Content: this.props.api.scopeApi.getScopeToString(alertDefinition.Scope) }));
+        colItems[1].Content = (React.createElement(EntityRowItem, { Content: this.props.api.alertApi.internalApi.getAlertRuleDescription(alertDefinition) }));
         colItems[2].Content = (React.createElement("div", null,
-            React.createElement(DropdownButton_1.default, { showClearButton: false, items: messageTypes.map((item) => ({
+            React.createElement(DropdownButton, { showClearButton: false, items: messageTypes.map((item) => ({
                     value: item,
                     label: item,
                     onClick: () => this.onMessageTypeChanged(alertDefinition, item),
                 })), columns: ['label'], accessLevel: this.props.accessLevel }, alertDefinition.MessageType)));
-        colItems[3].Content = (React.createElement(EntityListActionButtons_1.EntityListActionButtons, { showSuspend: true, suspendableObject: alertDefinition, confirmDeleteAction: this.props.onDeleteConfirm, showShare: this.props.teamSharingActivated, editClick: () => this.props.onEdit(alertDefinition), shareClick: (config) => this.props.onShare(config), 
+        colItems[3].Content = (React.createElement(EntityListActionButtons, { showSuspend: true, suspendableObject: alertDefinition, confirmDeleteAction: this.props.onDeleteConfirm, showShare: this.props.teamSharingActivated, editClick: () => this.props.onEdit(alertDefinition), shareClick: (config) => this.props.onShare(config), 
             //overrideDisableEdit={!this.props.Column}
             entityType: this.props.moduleInfo.FriendlyName, accessLevel: this.props.accessLevel, onSuspend: this.props.onSuspend, onUnSuspend: this.props.onUnSuspend }));
-        return React.createElement(AdaptableObjectRow_1.AdaptableObjectRow, { isSuspended: alertDefinition.IsSuspended, colItems: colItems });
+        return React.createElement(AdaptableObjectRow, { isSuspended: alertDefinition.IsSuspended, colItems: colItems });
     }
     onMessageTypeChanged(alertDefinition, value) {
         this.props.onChangeMessageType(alertDefinition, value);
     }
 }
-exports.AlertEntityRow = AlertEntityRow;

package/src/View/Alert/AlertStatusSubPanel.js

@@ -1,24 +1,20 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AlertStatusPanel = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const react_redux_1 = require("react-redux");
-const AdaptableContext_1 = require("../AdaptableContext");
-const getAlertButtonStyle_1 = require("./Utilities/getAlertButtonStyle");
-const StatusBarPanel_1 = require("../StatusBar/StatusBarPanel");
-const ModuleConstants = tslib_1.__importStar(require("../../Utilities/Constants/ModuleConstants"));
-const ActiveAlertsPanel_1 = require("./ActiveAlertsPanel");
+import * as React from 'react';
+import { useSelector } from 'react-redux';
+import { useAdaptable } from '../AdaptableContext';
+import { getAlertButtonStyle } from './Utilities/getAlertButtonStyle';
+import { StatusBarPanel } from '../StatusBar/StatusBarPanel';
+import * as ModuleConstants from '../../Utilities/Constants/ModuleConstants';
+import { ActiveAlertsPanel } from './ActiveAlertsPanel';
 const initialStyle = { color: '', background: '' };
-const AlertStatusPanel = () => {
-    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+export const AlertStatusPanel = () => {
+    const adaptable = useAdaptable();
     const [style, setStyle] = React.useState(initialStyle);
     const module = adaptable.ModuleService.getModuleById(ModuleConstants.AlertModuleId);
     const statusbarHighlightDuration = adaptable.adaptableOptions.alertOptions.statusbarHighlightDuration;
     /**
      * Using a selector to so the component updates each time an alert is triggered.
      */
-    const alerts = (0, react_redux_1.useSelector)((state) => state.System.AdaptableAlerts);
+    const alerts = useSelector((state) => state.System.AdaptableAlerts);
     const text = alerts.length == 0 ? '0 Alerts' : alerts.length == 1 ? '1 Alert' : alerts.length + ' Alerts';
     const handleAction = React.useCallback(() => adaptable.api.alertApi.openAlertSettingsPanel(), []);
     // blinking logic
@@ -33,7 +29,7 @@ const AlertStatusPanel = () => {
         if (noNewAlerts) {
             return;
         }
-        const { color, background } = (0, getAlertButtonStyle_1.getAlertButtonStyle)(alerts);
+        const { color, background } = getAlertButtonStyle(alerts);
         setStyle({ color, background });
         if (timeoutId.current) {
             clearTimeout(timeoutId.current);
@@ -47,7 +43,6 @@ const AlertStatusPanel = () => {
             setStyle(initialStyle);
         }, statusbarHighlightDuration);
     }, [alerts]);
-    let alertsPanel = React.createElement(ActiveAlertsPanel_1.ActiveAlertsPanel, null);
-    return (React.createElement(StatusBarPanel_1.StatusBarPanel, { tooltip: module.moduleInfo.ModuleName, "data-name": module.moduleInfo.ModuleName, color: style.color, backgroundColor: style.background, onAction: handleAction, icon: module.moduleInfo.Glyph, popover: alerts.length ? alertsPanel : null, content: text }));
+    let alertsPanel = React.createElement(ActiveAlertsPanel, null);
+    return (React.createElement(StatusBarPanel, { tooltip: module.moduleInfo.ModuleName, "data-name": module.moduleInfo.ModuleName, color: style.color, backgroundColor: style.background, onAction: handleAction, icon: module.moduleInfo.Glyph, popover: alerts.length ? alertsPanel : null, content: text }));
 };
-exports.AlertStatusPanel = AlertStatusPanel;

package/src/View/Alert/AlertViewPanel.js

@@ -1,15 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AlertViewPanelControl = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const react_redux_1 = require("react-redux");
-const SystemRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/SystemRedux"));
-const AdaptablePopover_1 = require("../AdaptablePopover");
-const rebass_1 = require("rebass");
-const UIHelper_1 = tslib_1.__importDefault(require("../UIHelper"));
-const getAlertButtonStyle_1 = require("./Utilities/getAlertButtonStyle");
-const ActiveAlertsPanel_1 = require("./ActiveAlertsPanel");
+import * as React from 'react';
+import { connect } from 'react-redux';
+import * as SystemRedux from '../../Redux/ActionsReducers/SystemRedux';
+import { AdaptablePopover } from '../AdaptablePopover';
+import { Flex } from 'rebass';
+import UIHelper from '../UIHelper';
+import { getAlertButtonStyle } from './Utilities/getAlertButtonStyle';
+import { ActiveAlertsPanel } from './ActiveAlertsPanel';
 class AlertViewPanelComponent extends React.Component {
     constructor(props) {
         super(props);
@@ -24,21 +20,21 @@ class AlertViewPanelComponent extends React.Component {
         }
     }
     render() {
-        const messageType = UIHelper_1.default.getMessageTypeFromAdaptableAlerts(this.props.AdaptableAlerts);
-        const { color: buttonTextColor, background: buttonBackground } = (0, getAlertButtonStyle_1.getAlertButtonStyle)(this.props.AdaptableAlerts);
+        const messageType = UIHelper.getMessageTypeFromAdaptableAlerts(this.props.AdaptableAlerts);
+        const { color: buttonTextColor, background: buttonBackground } = getAlertButtonStyle(this.props.AdaptableAlerts);
         const collapsedText = this.props.AdaptableAlerts.length == 0
             ? '0 Alerts'
             : this.props.AdaptableAlerts.length == 1
                 ? '1 Alert'
                 : this.props.AdaptableAlerts.length + ' Alerts';
-        const alertsPanel = React.createElement(ActiveAlertsPanel_1.ActiveAlertsPanel, null);
+        const alertsPanel = React.createElement(ActiveAlertsPanel, null);
         const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
-        return (React.createElement(rebass_1.Flex, { alignItems: "stretch", className: `ab-${elementType}__Alert__wrap` },
-            React.createElement(rebass_1.Flex, { style: { borderRadius: 'var(--ab__border-radius)' }, className: `ab-${elementType}__Alert__text`, marginRight: 2, padding: 2, color: buttonTextColor, backgroundColor: buttonBackground, fontSize: 'var( --ab-font-size-2)', alignItems: "center" }, collapsedText),
-            this.props.AdaptableAlerts.length > 0 && (React.createElement(rebass_1.Flex, { alignItems: "center" },
-                React.createElement(AdaptablePopover_1.AdaptablePopover, { className: `ab-${elementType}__Alert__info`, headerText: "", 
+        return (React.createElement(Flex, { alignItems: "stretch", className: `ab-${elementType}__Alert__wrap` },
+            React.createElement(Flex, { style: { borderRadius: 'var(--ab__border-radius)' }, className: `ab-${elementType}__Alert__text`, marginRight: 2, padding: 2, color: buttonTextColor, backgroundColor: buttonBackground, fontSize: 'var( --ab-font-size-2)', alignItems: "center" }, collapsedText),
+            this.props.AdaptableAlerts.length > 0 && (React.createElement(Flex, { alignItems: "center" },
+                React.createElement(AdaptablePopover, { className: `ab-${elementType}__Alert__info`, headerText: "", 
                     // tooltipText="Alerts"
-                    bodyText: [alertsPanel], MessageType: messageType, useButton: true, showEvent: 'focus', hideEvent: "blur" })))));
+                    bodyText: [alertsPanel], MessageType: messageType, useButton: true, showEvent: 'focus', hideEvent: "blur", popoverMinWidth: 400 })))));
     }
 }
 function mapStateToProps(state, ownProps) {
@@ -53,4 +49,4 @@ function mapDispatchToProps(dispatch) {
         onDeleteAllAlert: (alerts) => dispatch(SystemRedux.SystemAlertDeleteAll(alerts)),
     };
 }
-exports.AlertViewPanelControl = (0, react_redux_1.connect)(mapStateToProps, mapDispatchToProps)(AlertViewPanelComponent);
+export const AlertViewPanelControl = connect(mapStateToProps, mapDispatchToProps)(AlertViewPanelComponent);

package/src/View/Alert/AlertsPanel.js

@@ -1,44 +1,39 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AlertsPanel = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const UIHelper_1 = require("../UIHelper");
-const ButtonPreviewDelete_1 = tslib_1.__importDefault(require("../Components/Buttons/ButtonPreviewDelete"));
-const PanelWithButton_1 = require("../Components/Panels/PanelWithButton");
-const StringExtensions_1 = require("../../Utilities/Extensions/StringExtensions");
-const rebass_1 = require("rebass");
-const icons_1 = require("../../components/icons");
-const ListGroupItem_1 = tslib_1.__importDefault(require("../../components/List/ListGroupItem"));
-const ListGroup_1 = tslib_1.__importDefault(require("../../components/List/ListGroup"));
-const SimpleButton_1 = tslib_1.__importDefault(require("../../components/SimpleButton"));
-class AlertsPanel extends React.Component {
+import * as React from 'react';
+import { UIHelper } from '../UIHelper';
+import ButtonPreviewDelete from '../Components/Buttons/ButtonPreviewDelete';
+import { PanelWithButton } from '../Components/Panels/PanelWithButton';
+import { StringExtensions } from '../../Utilities/Extensions/StringExtensions';
+import { Flex, Text } from 'rebass';
+import { allIcons } from '../../components/icons';
+import ListGroupItem from '../../components/List/ListGroupItem';
+import ListGroup from '../../components/List/ListGroup';
+import SimpleButton from '../../components/SimpleButton';
+export class AlertsPanel extends React.Component {
     componentWillUnmount() {
         var _a, _b;
         (_b = (_a = this.props).onRender) === null || _b === void 0 ? void 0 : _b.call(_a);
     }
     render() {
         let alerts = this.props.Alerts.map((alert, index) => {
-            let alertHasheader = StringExtensions_1.StringExtensions.IsNotNullOrEmpty(alert.header);
-            const textColor = UIHelper_1.UIHelper.getColorByMessageType(alert.alertDefinition.MessageType);
+            let alertHasHeader = StringExtensions.IsNotNullOrEmpty(alert.header);
+            const textColor = UIHelper.getColorByMessageType(alert.alertDefinition.MessageType);
             const textStyle = {
                 color: textColor,
                 fill: textColor,
             };
-            const iconName = UIHelper_1.UIHelper.getGlyphByMessageType(alert.alertDefinition.MessageType);
-            const IconCmp = icons_1.allIcons[iconName];
+            const iconName = UIHelper.getGlyphByMessageType(alert.alertDefinition.MessageType);
+            const IconCmp = allIcons[iconName];
             const icon = IconCmp ? React.createElement(IconCmp, null) : null;
             let alertText = (React.createElement("div", { key: alert.Uuid, style: { maxWidth: '600px', width: '100%' } },
-                React.createElement(rebass_1.Flex, { alignItems: "center", width: "100%" },
-                    React.createElement(rebass_1.Text, { style: textStyle }, icon),
-                    alertHasheader ? (React.createElement("b", { style: { flex: 1 } }, alert.header)) : (React.createElement("div", { style: { fontSize: 10, flex: 1, display: 'inline-block' } }, alert.message)),
-                    React.createElement(ButtonPreviewDelete_1.default, { onClick: () => this.props.onClearAlert(alert), tooltip: "Clear Alert", disabled: false, style: { float: 'left' }, accessLevel: 'Full' })),
-                React.createElement("div", null, alertHasheader && React.createElement("span", { style: { fontSize: 10 } }, alert.message))));
-            return (React.createElement(ListGroupItem_1.default, { factory: "div", key: alert.Uuid || index }, alertText));
+                React.createElement(Flex, { alignItems: "center", width: "100%" },
+                    React.createElement(Text, { style: textStyle }, icon),
+                    alertHasHeader ? (React.createElement("b", { style: { flex: 1 } }, alert.header)) : (React.createElement("div", { style: { fontSize: 10, flex: 1, display: 'inline-block' } }, alert.message)),
+                    React.createElement(ButtonPreviewDelete, { onClick: () => this.props.onClearAlert(alert), tooltip: "Clear Alert", disabled: false, style: { float: 'left' }, accessLevel: 'Full' })),
+                React.createElement("div", null, alertHasHeader && React.createElement("span", { style: { fontSize: 10 } }, alert.message))));
+            return (React.createElement(ListGroupItem, { factory: "div", key: alert.Uuid || index }, alertText));
         });
-        let clearAllButton = (React.createElement(SimpleButton_1.default, { onClick: () => this.props.onClearAllAlerts(this.props.Alerts), variant: "raised", tone: "neutral", accessLevel: 'Full' }, "Clear All"));
-        return (React.createElement(PanelWithButton_1.PanelWithButton, { variant: "default", bodyProps: { padding: 0 }, headerText: 'Alerts', button: clearAllButton },
-            React.createElement(ListGroup_1.default, null, alerts)));
+        let clearAllButton = (React.createElement(SimpleButton, { onClick: () => this.props.onClearAllAlerts(this.props.Alerts), variant: "raised", tone: "neutral", accessLevel: 'Full' }, "Clear All"));
+        return (React.createElement(PanelWithButton, { variant: "default", bodyProps: { padding: 0 }, headerText: 'Alerts', button: clearAllButton },
+            React.createElement(ListGroup, null, alerts)));
     }
 }
-exports.AlertsPanel = AlertsPanel;

package/src/View/Alert/Utilities/getAlertButtonStyle.js

@@ -1,16 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getAlertButtonStyle = void 0;
-const tslib_1 = require("tslib");
-const UIHelper_1 = tslib_1.__importDefault(require("../../UIHelper"));
-const getAlertButtonStyle = (alerts) => {
-    const messageType = UIHelper_1.default.getMessageTypeFromAdaptableAlerts(alerts);
-    const messageTypeColor = UIHelper_1.default.getColorByMessageType(messageType);
-    const buttonBackground = UIHelper_1.default.getButtonColourForAdaptableAlerts(alerts, messageTypeColor);
-    const buttonTextColor = UIHelper_1.default.getButtonTextColourForArrayandMessageType(alerts, messageType);
+import UIHelper from '../../UIHelper';
+export const getAlertButtonStyle = (alerts) => {
+    const messageType = UIHelper.getMessageTypeFromAdaptableAlerts(alerts);
+    const messageTypeColor = UIHelper.getColorByMessageType(messageType);
+    const buttonBackground = UIHelper.getButtonColourForAdaptableAlerts(alerts, messageTypeColor);
+    const buttonTextColor = UIHelper.getButtonTextColourForArrayandMessageType(alerts, messageType);
     return {
         color: buttonTextColor,
         background: buttonBackground,
     };
 };
-exports.getAlertButtonStyle = getAlertButtonStyle;

package/src/View/Alert/Utilities/getAlertType.js

@@ -1,20 +1,17 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getAlertTypeText = exports.getAlertType = exports.AlertType = void 0;
-var AlertType;
+export var AlertType;
 (function (AlertType) {
     AlertType["DataChange"] = "DataChange";
     AlertType["RowChange"] = "RowChange";
     AlertType["Aggregation"] = "Aggregation";
     AlertType["Observable"] = "Observable";
-})(AlertType = exports.AlertType || (exports.AlertType = {}));
+})(AlertType || (AlertType = {}));
 /**
  * Based on alert shape the type is derived.
  * In the future the alert will get a type property.
  *
  * @param alert
  */
-const getAlertType = (alert) => {
+export const getAlertType = (alert) => {
     if (alert.Rule.ObservableExpression) {
         return AlertType.Observable;
     }
@@ -36,8 +33,7 @@ const getAlertType = (alert) => {
     // the object is not a valid alert
     return null;
 };
-exports.getAlertType = getAlertType;
-const getAlertTypeText = (alertType) => {
+export const getAlertTypeText = (alertType) => {
     let text = '';
     switch (alertType) {
         case AlertType.DataChange:
@@ -55,4 +51,3 @@ const getAlertTypeText = (alertType) => {
     }
     return text;
 };
-exports.getAlertTypeText = getAlertTypeText;

package/src/View/Alert/Utilities/getAvailablePredicates.js

@@ -1,13 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getAvailablePredicateDefinitions = void 0;
-const getAvailablePredicateDefinitions = (api, scope, alertType) => {
+export const getAvailablePredicateDefinitions = (api, scope, alertType) => {
     let predicateDefs = [];
     if (alertType === 'DataChange') {
         predicateDefs = api.alertApi.internalApi
             .getAlertPredicateDefsForScope(scope)
             .filter((predicateDef) => !['AddedRow', 'RemovedRow'].includes(predicateDef.id));
-        predicateDefs = [...predicateDefs].sort((a, b) => a.id === 'Any' ? -1 : b.id === 'Any' ? 1 : 0);
+        predicateDefs = [...predicateDefs].sort((a, b) => a.id === 'AnyChange' ? -1 : b.id === 'AnyChange' ? 1 : 0);
     }
     else if (alertType === 'RowChange') {
         predicateDefs = api.alertApi.internalApi
@@ -16,4 +13,3 @@ const getAvailablePredicateDefinitions = (api, scope, alertType) => {
     }
     return predicateDefs;
 };
-exports.getAvailablePredicateDefinitions = getAvailablePredicateDefinitions;

package/src/View/Alert/Utilities/getDefaultAlertDefinition.js

@@ -1,24 +1,20 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getDefaultAlertDefinition = void 0;
-const tslib_1 = require("tslib");
-const ObjectFactory_1 = tslib_1.__importDefault(require("../../../Utilities/ObjectFactory"));
-const getAlertType_1 = require("./getAlertType");
+import ObjectFactory from '../../../Utilities/ObjectFactory';
+import { AlertType } from './getAlertType';
 /**
  * This logic should be moved into Object factory once we have types on alert definitions
  * @param type AlertType
  */
-const getDefaultAlertDefinition = (alertDefinition, type) => {
-    const newAlert = Object.assign(Object.assign({}, ObjectFactory_1.default.CreateEmptyAlertDefinition()), { Uuid: alertDefinition.Uuid });
+export const getDefaultAlertDefinition = (alertDefinition, type) => {
+    const newAlert = Object.assign(Object.assign({}, ObjectFactory.CreateEmptyAlertDefinition()), { Uuid: alertDefinition.Uuid });
     // can only be all
-    if (type === getAlertType_1.AlertType.Observable ||
-        type === getAlertType_1.AlertType.Aggregation ||
-        type === getAlertType_1.AlertType.RowChange) {
+    if (type === AlertType.Observable ||
+        type === AlertType.Aggregation ||
+        type === AlertType.RowChange) {
         newAlert.Scope = {
             All: true,
         };
     }
-    if (type === getAlertType_1.AlertType.RowChange) {
+    if (type === AlertType.RowChange) {
         newAlert.Rule = {
             Predicates: [
                 {
@@ -29,4 +25,3 @@ const getDefaultAlertDefinition = (alertDefinition, type) => {
     }
     return newAlert;
 };
-exports.getDefaultAlertDefinition = getDefaultAlertDefinition;

package/src/View/Alert/Utilities/mapAlertDefinition.js

@@ -1,7 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.mapAlertDefinition = void 0;
-const mapAlertDefinition = (api, alertDefinition) => {
+export const mapAlertDefinition = (api, alertDefinition) => {
     var _a;
     const isRemovedRowChangeAlert = api.alertApi.internalApi.isAlertDefinitionForRemovedRowChangeEvent(alertDefinition);
     const mapValidButtonActions = (alertAction) => {
@@ -35,4 +32,3 @@ const mapAlertDefinition = (api, alertDefinition) => {
     }
     return alertDefinition;
 };
-exports.mapAlertDefinition = mapAlertDefinition;

package/src/View/Alert/Wizard/AlertBehaviourWizardSection.d.ts

@@ -4,7 +4,7 @@ import { AdaptableApi } from '../../../types';
 import { AlertType } from '../Utilities/getAlertType';
 export declare const renderAlertBehaviourWizardSummary: (alertDefinition: AlertDefinition) => JSX.Element;
 export declare const renderAlertBehaviourSummary: (alert: AlertDefinition, api: AdaptableApi, allowWrap?: boolean) => JSX.Element;
-declare type AlertBehaviourWizardSectionProps = {
+type AlertBehaviourWizardSectionProps = {
     onChange: (data: AlertDefinition) => void;
     alertType: AlertType;
 };