@adaptabletools/adaptable 10.0.0-canary.0

package/src/View/Components/Panels/PanelWithRow.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { IColItem } from '../../UIInterfaces';
+import { PanelProps } from '../../../components/Panel';
+export interface PanelWithRowProps extends PanelProps {
+    colItems: IColItem[];
+    headerAlign?: string;
+}
+export declare class PanelWithRow extends React.Component<PanelWithRowProps, {}> {
+    render(): JSX.Element;
+}

package/src/View/Components/Panels/PanelWithRow.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PanelWithRow = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const rebass_1 = require("rebass");
+const Panel_1 = tslib_1.__importDefault(require("../../../components/Panel"));
+// We cannot destructure this.props using the react way in typescript which is a real pain as you
+// need to transfer props individually as a consequence
+// let { buttonContent, ...other } = this.props
+class PanelWithRow extends React.Component {
+    render() {
+        const headerItems = this.props.colItems.map((colItem, index) => (React.createElement(rebass_1.Text, { key: colItem.key || colItem.Content || index, fontWeight: "bold", fontSize: 'var(--ab-font-size-3)', paddingLeft: 1, paddingRight: 1, style: {
+                flex: colItem.Size,
+            } }, colItem.Content)));
+        const header = (React.createElement(rebass_1.Flex, { alignItems: this.props.headerAlign || 'center', style: { width: '100%' } }, headerItems));
+        return (React.createElement("div", { style: this.props.style, className: this.props.className },
+            React.createElement(Panel_1.default, { bodyScroll: true, header: header, border: this.props.border, bodyProps: this.props.bodyProps }, this.props.children)));
+    }
+}
+exports.PanelWithRow = PanelWithRow;

package/src/View/Components/Panels/PanelWithTwoButtons.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { PanelProps } from '../../../components/Panel';
+export interface PanelWithTwoButtonsProps extends PanelProps {
+    firstButtonContent?: React.ReactNode;
+    firstButton?: React.ReactElement<any>;
+    secondButtonContent?: React.ReactNode;
+    secondButton?: React.ReactElement<any>;
+    headerText: string;
+}
+export declare class PanelWithTwoButtons extends React.Component<PanelWithTwoButtonsProps, {}> {
+    render(): JSX.Element;
+}

package/src/View/Components/Panels/PanelWithTwoButtons.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PanelWithTwoButtons = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const Panel_1 = tslib_1.__importDefault(require("../../../components/Panel"));
+const rebass_1 = require("rebass");
+//We cannot destructure this.props using the react way in typescript which is a real pain as you
+//need to transfer props individually as a consequence
+//let { buttonContent, ...other } = this.props
+class PanelWithTwoButtons extends React.Component {
+    render() {
+        let header = (React.createElement(rebass_1.Flex, { alignItems: "center", width: "100%" },
+            React.createElement(rebass_1.Flex, { flex: 1 }, this.props.headerText),
+            this.props.secondButton,
+            this.props.firstButton));
+        return (React.createElement(Panel_1.default, Object.assign({}, this.props, { header: header }), this.props.children));
+    }
+}
+exports.PanelWithTwoButtons = PanelWithTwoButtons;

package/src/View/Components/Panels/ToolPanelSettingsPanel.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { PanelProps } from '../../../components/Panel';
+export interface ToolPanelSettingsPanelProps extends PanelProps {
+    button: React.ReactElement<any>;
+}
+export declare class ToolPanelSettingsPanel extends React.Component<ToolPanelSettingsPanelProps, {}> {
+    render(): JSX.Element;
+}

package/src/View/Components/Panels/ToolPanelSettingsPanel.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ToolPanelSettingsPanel = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const icons_1 = require("../../../components/icons");
+const Panel_1 = tslib_1.__importDefault(require("../../../components/Panel"));
+//We cannot destructure this.props using the react way in typescript which is a real pain as you
+//need to transfer props individually as a consequence
+//let { buttonContent, ...other } = this.props
+class ToolPanelSettingsPanel extends React.Component {
+    render() {
+        let header = (React.createElement("span", { style: { verticalAlign: 'middle' } },
+            ' ',
+            React.createElement(icons_1.Icon, { name: 'build' }),
+            " ",
+            React.createElement("span", null, "Settings"),
+            this.props.button &&
+                React.cloneElement(this.props.button, {
+                    style: {
+                        float: 'right',
+                        border: '0px',
+                        background: 'none',
+                        borderRadius: '0px',
+                        boxShadow: 'none',
+                    },
+                })));
+        return (React.createElement(Panel_1.default, { header: header, style: { margin: '0px', padding: '0px' } }, this.props.children));
+    }
+}
+exports.ToolPanelSettingsPanel = ToolPanelSettingsPanel;

package/src/View/Components/Popups/AdaptableChart.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { AccessLevel } from '../../../PredefinedConfig/Common/Entitlement';
+import { AdaptableApi } from '../../../types';
+export interface IAdaptableChartProps extends React.ClassAttributes<AdaptableChart> {
+    showChart: boolean;
+    onClose?: () => void;
+    api: AdaptableApi;
+    showModal: boolean;
+}
+export interface AdaptableChartState {
+    chartContainer: HTMLElement;
+    accessLevel: AccessLevel;
+    isValidUserChartContainer: boolean;
+}
+export declare class AdaptableChart extends React.Component<IAdaptableChartProps, AdaptableChartState> {
+    constructor(props: IAdaptableChartProps);
+    render(): JSX.Element;
+}

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

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptableChart = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const ReactDOM = tslib_1.__importStar(require("react-dom"));
+const AdaptableViewFactory_1 = require("../../AdaptableViewFactory");
+const UIHelper_1 = require("../../UIHelper");
+const ModuleConstants = tslib_1.__importStar(require("../../../Utilities/Constants/ModuleConstants"));
+const AdaptablePopup_1 = require("./AdaptablePopup");
+class AdaptableChart extends React.Component {
+    constructor(props) {
+        super(props);
+        let options = this.props.api.internalApi.getAdaptableOptions();
+        this.state = {
+            chartContainer: UIHelper_1.UIHelper.getChartContainer(options, document, this.props.showModal),
+            accessLevel: this.props.api.internalApi
+                .getEntitlementService()
+                .getEntitlementAccessLevelForModule(ModuleConstants.ChartModuleId),
+            isValidUserChartContainer: UIHelper_1.UIHelper.isValidUserChartContainer(options, document),
+        };
+    }
+    render() {
+        let moduleInfo = this.props.api.internalApi
+            .getModuleService()
+            .getModuleInfoByModule(ModuleConstants.ChartModuleId);
+        let commonProps = {
+            modalContainer: this.state.chartContainer,
+            onClose: this.props.onClose,
+            ShowModal: this.props.showModal,
+            accessLevel: this.state.accessLevel,
+            api: this.props.api,
+            moduleInfo: moduleInfo,
+        };
+        let ChartCmp = AdaptableViewFactory_1.AdaptableViewFactory['ChartDisplayPopup'];
+        const body = React.createElement(ChartCmp, Object.assign({}, commonProps));
+        return this.props.showModal ? (React.createElement(AdaptablePopup_1.AdaptablePopup, { api: this.props.api, onHide: this.props.onClose, showModal: true, moduleParams: null, componentName: 'ChartDisplayPopup', componentModule: ModuleConstants.ChartModuleId }, body)) : this.state.isValidUserChartContainer ? (ReactDOM.createPortal(body, this.state.chartContainer)) : (body);
+    }
+}
+exports.AdaptableChart = AdaptableChart;

package/src/View/Components/Popups/AdaptableLoadingScreen.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+export interface IAdaptableLoadingScreenProps extends React.ClassAttributes<AdaptableLoadingScreen> {
+    showLoadingScreen: boolean;
+    onClose?: () => {};
+}
+export declare class AdaptableLoadingScreen extends React.Component<IAdaptableLoadingScreenProps, {}> {
+    render(): JSX.Element;
+}

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

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptableLoadingScreen = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const Dialog_1 = tslib_1.__importDefault(require("../../../components/Dialog"));
+const rebass_1 = require("rebass");
+class AdaptableLoadingScreen extends React.Component {
+    render() {
+        return (React.createElement(Dialog_1.default, { modal: true, isOpen: this.props.showLoadingScreen, onDismiss: this.props.onClose, showCloseButton: false, style: {
+                minHeight: 'auto',
+            } },
+            React.createElement(rebass_1.Box, { padding: 3 },
+                React.createElement("h4", null, "Initialising Grid"),
+                React.createElement("p", null, "Retrieving your settings and setting up the grid..."))));
+    }
+}
+exports.AdaptableLoadingScreen = AdaptableLoadingScreen;

package/src/View/Components/Popups/AdaptablePopup.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import * as PopupRedux from '../../../Redux/ActionsReducers/PopupRedux';
+import { ModuleParams } from '../SharedProps/ModuleViewPopupProps';
+import { AdaptableModule } from '../../../PredefinedConfig/Common/Types';
+import { AdaptableApi } from '../../../Api/AdaptableApi';
+/**
+ * This is the main popup that we use - so all function popups will appear here.
+ */
+export interface AdaptablePopupProps extends React.ClassAttributes<AdaptablePopup> {
+    showModal: boolean;
+    componentName?: string;
+    componentModule: AdaptableModule;
+    onHide?: () => void;
+    api: AdaptableApi;
+    moduleParams: ModuleParams;
+    moduleProps?: {
+        [key: string]: any;
+    };
+    onClearParams?: () => PopupRedux.PopupClearParamAction;
+}
+export declare class AdaptablePopup extends React.Component<AdaptablePopupProps, {}> {
+    render(): JSX.Element;
+}

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

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptablePopup = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const AdaptableViewFactory_1 = require("../../AdaptableViewFactory");
+const GeneralConstants = tslib_1.__importStar(require("../../../Utilities/Constants/GeneralConstants"));
+const UIHelper_1 = require("../../UIHelper");
+const SimpleButton_1 = tslib_1.__importDefault(require("../../../components/SimpleButton"));
+const rebass_1 = require("rebass");
+const PopupWithFooter_1 = require("../../../components/PopupWithFooter");
+const PopupContext_1 = tslib_1.__importDefault(require("./PopupContext"));
+class AdaptablePopup extends React.Component {
+    render() {
+        var _a;
+        let modalContainer = UIHelper_1.UIHelper.getModalContainer(this.props.api.internalApi.getAdaptableOptions(), document);
+        let accessLevel = this.props.api.internalApi
+            .getEntitlementService()
+            .getEntitlementAccessLevelForModule(this.props.componentModule);
+        if (this.props.componentName) {
+            let bodyElement = AdaptableViewFactory_1.AdaptableViewFactory[this.props.componentName];
+            //Warning : FilterForm needs to be changed if we add properties since it uses the same interface
+            let moduleProps = {
+                popupParams: this.props.moduleParams,
+                onClearPopupParams: () => (this.props.onClearParams ? this.props.onClearParams() : null),
+                onClosePopup: () => {
+                    if (this.props.onHide) {
+                        this.props.onHide();
+                    }
+                },
+                // show share button if TeamSharing is active & user has edit rights
+                teamSharingActivated: this.props.api.teamSharingApi.isTeamSharingActivated() &&
+                    this.props.api.teamSharingApi.hasTeamSharingFullRights(),
+                modalContainer: modalContainer,
+                accessLevel: accessLevel,
+                api: this.props.api,
+                moduleInfo: this.props.api.internalApi
+                    .getModuleService()
+                    .getModuleInfoByModule(this.props.componentModule),
+            };
+            var body = React.createElement(bodyElement, moduleProps);
+        }
+        return (React.createElement(PopupContext_1.default.Provider, { value: {
+                hidePopup: () => {
+                    if (this.props.onHide) {
+                        this.props.onHide();
+                    }
+                },
+            } },
+            React.createElement(PopupWithFooter_1.PopupWithFooter, Object.assign({ showModal: this.props.showModal, onHide: this.props.onHide, "data-name": this.props.componentName, modal: true, padding: 0, maxWidth: (_a = this.props.moduleParams) === null || _a === void 0 ? void 0 : _a.maxWidth, footer: React.createElement(React.Fragment, null,
+                    React.createElement(SimpleButton_1.default, { "data-name": "action-close", onClick: () => {
+                            if (this.props.onHide) {
+                                this.props.onHide();
+                            }
+                        }, variant: "text" }, "CLOSE")) }, this.props.moduleProps),
+                React.createElement(rebass_1.Flex, { flexDirection: "column", flex: 1, className: accessLevel == 'ReadOnly' ? GeneralConstants.READ_ONLY_STYLE : '' }, body))));
+    }
+}
+exports.AdaptablePopup = AdaptablePopup;

package/src/View/Components/Popups/AdaptablePopupAlert.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { AdaptableAlert } from '../../../PredefinedConfig/Common/AdaptableAlert';
+import { AdaptableApi } from '../../../Api/AdaptableApi';
+export interface AdaptablePopupAlertProps {
+    onClose: () => void;
+    api: AdaptableApi;
+    adaptableAlert: AdaptableAlert;
+    headless?: boolean;
+}
+export declare const AdaptablePopupAlert: (props: AdaptablePopupAlertProps) => JSX.Element;

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

@@ -0,0 +1,73 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptablePopupAlert = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const PanelWithImage_1 = require("../Panels/PanelWithImage");
+const UIHelper_1 = require("../../UIHelper");
+const rebass_1 = require("rebass");
+const Dialog_1 = tslib_1.__importDefault(require("../../../components/Dialog"));
+const AdaptableFormComponent_1 = require("../../../components/AdaptableFormComponent");
+const react_1 = require("react");
+const AdaptableContext_1 = require("../../AdaptableContext");
+exports.AdaptablePopupAlert = (props) => {
+    var _a;
+    const messageType = props.adaptableAlert.alertDefinition.MessageType || 'Error';
+    const msg = (_a = props.adaptableAlert.message) !== null && _a !== void 0 ? _a : '';
+    const headerColor = UIHelper_1.UIHelper.getColorByMessageType(messageType);
+    let header = messageType;
+    const { api } = AdaptableContext_1.useAdaptable();
+    if (props.adaptableAlert.header) {
+        header = `${header}: ${props.adaptableAlert.header}`;
+    }
+    let glyph = UIHelper_1.UIHelper.getGlyphByMessageType(messageType);
+    const defaultForm = React.useMemo(() => {
+        return {
+            fields: [],
+            Buttons: [
+                {
+                    Label: 'OK',
+                    ButtonStyle: {
+                        variant: 'raised',
+                    },
+                },
+            ],
+        };
+    }, []);
+    const [formData, setFormData] = react_1.useState({});
+    const context = React.useMemo(() => {
+        return {
+            alert: props.adaptableAlert,
+            api,
+            formData: formData,
+        };
+    }, [JSON.stringify(formData), props.adaptableAlert]);
+    const adaptableForm = React.useMemo(() => {
+        return props.api.internalApi.getAdaptableFormFromAlertForm(props.adaptableAlert.alertDefinition.AlertForm || defaultForm, context, messageType);
+    }, [props.adaptableAlert.alertDefinition.AlertForm, defaultForm, messageType, context]);
+    const content = (React.createElement(PanelWithImage_1.PanelWithImage, { header: header, headerColor: headerColor, glyphicon: glyph, bodyProps: { padding: 2 } },
+        React.createElement("div", null,
+            React.createElement(rebass_1.Flex, { flexDirection: "column", alignItems: "flex-start" }, typeof msg === 'string'
+                ? msg.split('\n').map(function (item, index) {
+                    return (React.createElement(rebass_1.Flex, { flexDirection: "row", key: index },
+                        React.createElement(rebass_1.Text, { key: index, margin: 2 },
+                            item,
+                            React.createElement("br", null))));
+                })
+                : msg),
+            React.createElement(rebass_1.Box, { margin: 2 },
+                React.createElement(AdaptableFormComponent_1.AdaptableFormComponent, { data: formData, formDef: adaptableForm, displayTitle: true, onChange: setFormData, api: props.api, context: context, onButtonClick: (button) => {
+                        props.onClose();
+                        // we want to give the current popup time to close
+                        // and we reopen with a delay in case this button action causes another popup
+                        setTimeout(() => {
+                            var _a;
+                            (_a = button.onClick) === null || _a === void 0 ? void 0 : _a.call(button, button, context);
+                        }, 20);
+                    } })))));
+    return props.headless ? (content) : (React.createElement(Dialog_1.default, { "data-name": `alert-popup alert-popup-${messageType.toLowerCase()}`, showCloseButton: false, isOpen: true, onDismiss: props.onClose, style: {
+            minHeight: 'auto',
+            minWidth: '20vw',
+            maxWidth: '70vw',
+        } }, content));
+};

package/src/View/Components/Popups/AdaptablePopupConfirmation.d.ts

@@ -0,0 +1,29 @@
+import * as React from 'react';
+import { AdaptableMessageType } from '../../../PredefinedConfig/Common/AdaptableMessageType';
+import { AdaptableApi } from '../../../Api/AdaptableApi';
+/**
+ * Used when giving the user 2 choices with the option of adding text also
+ */
+export interface AdaptablePopupConfirmationProps extends React.ClassAttributes<AdaptablePopupConfirmation> {
+    showPopup: boolean;
+    onConfirm: (comment: string) => void;
+    onCancel: () => void;
+    header: string;
+    messsage: string;
+    confirmButtonText: string;
+    cancelButtonText: string;
+    showInputBox: boolean;
+    messageType: AdaptableMessageType;
+    api: AdaptableApi;
+}
+export interface AdaptablePopupConfirmationState {
+    PromptText: string;
+}
+export declare class AdaptablePopupConfirmation extends React.Component<AdaptablePopupConfirmationProps, AdaptablePopupConfirmationState> {
+    constructor(props: AdaptablePopupConfirmationProps);
+    render(): JSX.Element;
+    onCancelForm(): void;
+    onConfirmmForm(): void;
+    changeContent: (e: any) => void;
+    canConfirm(): boolean;
+}

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

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptablePopupConfirmation = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const UIHelper_1 = require("../../UIHelper");
+const StringExtensions_1 = require("../../../Utilities/Extensions/StringExtensions");
+const PanelWithImage_1 = require("../Panels/PanelWithImage");
+const rebass_1 = require("rebass");
+const SimpleButton_1 = tslib_1.__importDefault(require("../../../components/SimpleButton"));
+const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
+const Dialog_1 = tslib_1.__importDefault(require("../../../components/Dialog"));
+class AdaptablePopupConfirmation extends React.Component {
+    constructor(props) {
+        super(props);
+        this.changeContent = (e) => {
+            this.setState({ PromptText: e.target.value });
+        };
+        this.state = { PromptText: '' };
+    }
+    render() {
+        let header = this.props.header;
+        let glyph = UIHelper_1.UIHelper.getGlyphByMessageType(this.props.messageType);
+        return (this.props.showPopup && (React.createElement(Dialog_1.default, { modal: true, "data-name": `confirmation-popup confirmation-popup--${this.props.messageType.toLowerCase()}`, isOpen: this.props.showPopup, onDismiss: this.props.onCancel, showCloseButton: false, style: { minHeight: 'auto', maxWidth: '50%' } },
+            React.createElement(PanelWithImage_1.PanelWithImage, { header: header, icon: glyph, variant: "primary" },
+                React.createElement("div", null,
+                    React.createElement("div", { style: { display: 'flex', alignItems: 'center' } }, this.props.messsage.split('\n').map(function (item, index) {
+                        return (React.createElement(rebass_1.Text, { key: index, margin: 2 },
+                            item,
+                            React.createElement("br", null)));
+                    })),
+                    this.props.showInputBox && (React.createElement(rebass_1.Box, { padding: 2, "data-name": "body" },
+                        React.createElement("p", null, "Please enter a comment to confirm"),
+                        React.createElement(Input_1.default, { marginTop: 2, width: '100%', value: this.state.PromptText, type: "string", placeholder: "Enter text", onChange: (e) => this.changeContent(e) }))),
+                    React.createElement(rebass_1.Flex, { marginTop: 3, padding: 2, "data-name": "footer" },
+                        React.createElement(SimpleButton_1.default, { tone: "error", "data-name": "delete", variant: "raised", disabled: !this.canConfirm(), onClick: () => this.onConfirmmForm() }, this.props.confirmButtonText),
+                        React.createElement("div", { style: { flex: 1 } }),
+                        React.createElement(SimpleButton_1.default, { "data-name": "cancel", tone: "neutral", variant: "raised", onClick: () => this.onCancelForm() }, this.props.cancelButtonText)))))));
+    }
+    onCancelForm() {
+        this.setState({ PromptText: '' });
+        this.props.onCancel();
+    }
+    onConfirmmForm() {
+        let promptText = this.state.PromptText;
+        this.setState({ PromptText: '' });
+        this.props.onConfirm(promptText);
+    }
+    canConfirm() {
+        if (this.props.showInputBox) {
+            return StringExtensions_1.StringExtensions.IsNotNullOrEmpty(this.state.PromptText);
+        }
+        return true;
+    }
+}
+exports.AdaptablePopupConfirmation = AdaptablePopupConfirmation;

package/src/View/Components/Popups/AdaptablePopupPrompt.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+export interface AdaptablePopupPromptProps extends React.ClassAttributes<AdaptablePopupPrompt> {
+    showPopup: boolean;
+    header: string;
+    message: string;
+    onClose: () => void;
+    onConfirm: Function;
+}
+export interface AdaptablePopupPromptState {
+    promptText: string;
+}
+export declare class AdaptablePopupPrompt extends React.Component<AdaptablePopupPromptProps, AdaptablePopupPromptState> {
+    constructor(props: AdaptablePopupPromptProps);
+    render(): JSX.Element;
+    onCloseForm(): void;
+    onConfirmmForm(): void;
+    changeContent: (e: any) => void;
+}

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

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptablePopupPrompt = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const StringExtensions_1 = require("../../../Utilities/Extensions/StringExtensions");
+const Dialog_1 = tslib_1.__importDefault(require("../../../components/Dialog"));
+const rebass_1 = require("rebass");
+const SimpleButton_1 = tslib_1.__importDefault(require("../../../components/SimpleButton"));
+const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
+class AdaptablePopupPrompt extends React.Component {
+    constructor(props) {
+        super(props);
+        this.changeContent = (e) => {
+            this.setState({ promptText: e.target.value });
+        };
+        this.state = { promptText: '' };
+    }
+    render() {
+        return (this.props.showPopup && (React.createElement(Dialog_1.default, { modal: true, "data-name": `prompt-popup`, isOpen: this.props.showPopup, onDismiss: this.props.onClose, showCloseButton: false, style: { minHeight: 'auto', maxWidth: '50%' } },
+            React.createElement(rebass_1.Flex, { flexDirection: "column" },
+                React.createElement(rebass_1.Box, { marginTop: 3, mx: 2 }, this.props.header),
+                StringExtensions_1.StringExtensions.IsNotNullOrEmpty(this.props.message) && (React.createElement(rebass_1.Box, { marginTop: 3, mx: 2 },
+                    ' ',
+                    React.createElement("div", { style: { display: 'flex', alignItems: 'center' } }, this.props.message.split('\n').map(function (item, index) {
+                        return (React.createElement("span", { key: index },
+                            item,
+                            React.createElement("br", null)));
+                    })))),
+                React.createElement(Input_1.default, { autoFocus: true, marginTop: 3, mx: 3, value: this.state.promptText, type: "string", placeholder: "Enter text", onChange: (e) => this.changeContent(e) }),
+                React.createElement(rebass_1.Box, { marginTop: 3 },
+                    React.createElement(rebass_1.Flex, { padding: 2 },
+                        React.createElement(SimpleButton_1.default, { tone: "accent", "data-name": "ok", variant: "raised", disabled: StringExtensions_1.StringExtensions.IsNullOrEmpty(this.state.promptText), onClick: () => this.onConfirmmForm() }, "OK"),
+                        React.createElement("div", { style: { flex: 1 } }),
+                        React.createElement(SimpleButton_1.default, { tone: "neutral", variant: "raised", onClick: () => this.onCloseForm(), "data-name": "cancel" }, "Cancel")))))));
+    }
+    onCloseForm() {
+        this.setState({ promptText: '' });
+        this.props.onClose();
+    }
+    onConfirmmForm() {
+        let promptText = this.state.promptText;
+        this.setState({ promptText: '' });
+        this.props.onConfirm(promptText);
+    }
+}
+exports.AdaptablePopupPrompt = AdaptablePopupPrompt;

package/src/View/Components/Popups/AdaptablePopupTeamSharing.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { SharedEntityConfig } from '../../../PredefinedConfig/TeamSharingState';
+export interface AdaptablePopupTeamSharingProps {
+    showPopup: boolean;
+    header: string;
+    onClose: () => void;
+    onConfirm: (config: SharedEntityConfig) => void;
+}
+export declare const AdaptablePopupTeamSharing: (props: AdaptablePopupTeamSharingProps) => JSX.Element;

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

@@ -0,0 +1,46 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptablePopupTeamSharing = void 0;
+const tslib_1 = require("tslib");
+const Dialog_1 = tslib_1.__importDefault(require("../../../components/Dialog"));
+const rebass_1 = require("rebass");
+const StringExtensions_1 = require("../../../Utilities/Extensions/StringExtensions");
+const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
+const react_1 = require("react");
+const SimpleButton_1 = tslib_1.__importDefault(require("../../../components/SimpleButton"));
+const React = tslib_1.__importStar(require("react"));
+const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
+const HelpBlock_1 = tslib_1.__importDefault(require("../../../components/HelpBlock"));
+const Radio_1 = tslib_1.__importDefault(require("../../../components/Radio"));
+exports.AdaptablePopupTeamSharing = (props) => {
+    const { showPopup, onClose, onConfirm, header } = props;
+    const [config, setConfig] = react_1.useState({ description: '', type: 'Snapshot' });
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Dialog_1.default, { modal: true, "data-name": "teamsharing-popup", isOpen: showPopup, onDismiss: onClose, autoFocus: false, showCloseButton: false, style: { minHeight: 'auto', maxWidth: '50%' } },
+            React.createElement(rebass_1.Flex, { flexDirection: "column" },
+                React.createElement(HelpBlock_1.default, { "data-name": "teamsharing-popup-description", margin: 2, mb: 2, p: 2, style: { fontSize: 'var(--ab-font-size-3)' } },
+                    "Create a ",
+                    header,
+                    " which may be either:",
+                    React.createElement("ul", null,
+                        React.createElement("li", null,
+                            React.createElement("strong", null, "Snapshot"),
+                            ": a one-off share of an exact copy of the current object"),
+                        React.createElement("li", null,
+                            React.createElement("strong", null, "Active"),
+                            ": a \"live\" share that is automatically updated with every local change"))),
+                React.createElement(FormLayout_1.default, { padding: 2 },
+                    React.createElement(FormLayout_1.FormRow, { label: "Description: " },
+                        React.createElement(Input_1.default, { autoFocus: true, value: config.description, type: "string", width: 300, placeholder: "Enter text", onChange: (e) => setConfig(Object.assign(Object.assign({}, config), { description: e.target.value })) })),
+                    React.createElement(FormLayout_1.FormRow, { label: "Share: " },
+                        React.createElement(rebass_1.Flex, { flexDirection: "row" },
+                            React.createElement(Radio_1.default, { checked: config.type === 'Snapshot', onChange: () => setConfig(Object.assign(Object.assign({}, config), { type: 'Snapshot' })) }, "Snapshot"),
+                            ' ',
+                            React.createElement(Radio_1.default, { marginLeft: 3, checked: config.type === 'Active', onChange: () => setConfig(Object.assign(Object.assign({}, config), { type: 'Active' })) }, "Active"),
+                            ' '))),
+                React.createElement(rebass_1.Box, { marginTop: 3 },
+                    React.createElement(rebass_1.Flex, { padding: 2 },
+                        React.createElement(SimpleButton_1.default, { tone: "neutral", variant: "raised", onClick: () => onClose(), "data-name": "cancel" }, "Cancel"),
+                        React.createElement("div", { style: { flex: 1 } }),
+                        React.createElement(SimpleButton_1.default, { tone: "accent", "data-name": "ok", variant: "raised", disabled: StringExtensions_1.StringExtensions.IsNullOrEmpty(config.description), onClick: () => onConfirm(config) }, "OK")))))));
+};

package/src/View/Components/Popups/AdaptableToaster.d.ts

@@ -0,0 +1,7 @@
+import { AdaptableApi } from '../../../Api/AdaptableApi';
+import { AdaptableAlert } from '../../../PredefinedConfig/Common/AdaptableAlert';
+export interface ShowToastProps {
+    api: AdaptableApi;
+    adaptableAlert: AdaptableAlert;
+}
+export declare const showToast: (props: ShowToastProps) => void;

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

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.showToast = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const Toastify_1 = require("../../../components/Toastify");
+const ObjectFactory_1 = tslib_1.__importDefault(require("../../../Utilities/ObjectFactory"));
+const AdaptablePopupAlert_1 = require("./AdaptablePopupAlert");
+exports.showToast = (props) => {
+    const toastProps = ObjectFactory_1.default.CreateToastOptions(props.api.internalApi.getAdaptableOptions().alertOptions, {
+        onClose: () => {
+            props.api.internalApi.hidePopupAlert();
+        },
+    });
+    const content = (React.createElement(AdaptablePopupAlert_1.AdaptablePopupAlert, Object.assign({ headless: true }, props, { onClose: () => {
+            Toastify_1.toast.dismiss(toastId);
+        } })));
+    let toastId;
+    switch (props.adaptableAlert.alertDefinition.MessageType) {
+        case 'Info':
+            toastId = Toastify_1.toast.info(content, toastProps);
+            break;
+        case 'Error':
+            toastId = Toastify_1.toast.error(content, toastProps);
+            break;
+        case 'Success':
+            toastId = Toastify_1.toast.success(content, toastProps);
+            break;
+        case 'Warning':
+            toastId = Toastify_1.toast.warn(content, toastProps);
+            break;
+    }
+};

package/src/View/Components/Popups/PopupContext.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export interface PopupContextProps {
+    hidePopup: () => void;
+}
+declare const PopupContext: React.Context<PopupContextProps>;
+export declare const usePopupContext: () => PopupContextProps;
+export default PopupContext;