@adaptabletools/adaptable 17.0.0-canary.1 → 17.0.0-canary.11

package/src/View/SmartEdit/SmartEditViewPanel.js

@@ -1,17 +1,21 @@
-import * as SystemRedux from '../../Redux/ActionsReducers/SystemRedux';
-import * as SmartEditRedux from '../../Redux/ActionsReducers/SmartEditRedux';
-import { MathOperation, StatusColour } from '../../PredefinedConfig/Common/Enums';
-import * as React from 'react';
-import { StringExtensions } from '../../Utilities/Extensions/StringExtensions';
-import { PreviewResultsPanel } from '../Components/PreviewResultsPanel';
-import { EnumExtensions } from '../../Utilities/Extensions/EnumExtensions';
-import { Flex } from 'rebass';
-import Input from '../../components/Input';
-import { ButtonApply } from '../Components/Buttons/ButtonApply';
-import { AdaptablePopover } from '../AdaptablePopover';
-import { UIHelper } from '../UIHelper';
-import { connect } from 'react-redux';
-import { Select } from '../../components/Select';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SmartEditViewPanelControl = void 0;
+const tslib_1 = require("tslib");
+const SystemRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/SystemRedux"));
+const SmartEditRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/SmartEditRedux"));
+const Enums_1 = require("../../PredefinedConfig/Common/Enums");
+const React = tslib_1.__importStar(require("react"));
+const StringExtensions_1 = require("../../Utilities/Extensions/StringExtensions");
+const PreviewResultsPanel_1 = require("../Components/PreviewResultsPanel");
+const EnumExtensions_1 = require("../../Utilities/Extensions/EnumExtensions");
+const rebass_1 = require("rebass");
+const Input_1 = tslib_1.__importDefault(require("../../components/Input"));
+const ButtonApply_1 = require("../Components/Buttons/ButtonApply");
+const AdaptablePopover_1 = require("../AdaptablePopover");
+const UIHelper_1 = require("../UIHelper");
+const react_redux_1 = require("react-redux");
+const Select_1 = require("../../components/Select");
 class SmartEditViewPanelComponent extends React.Component {
     constructor(props) {
         super(props);
@@ -36,11 +40,11 @@ class SmartEditViewPanelComponent extends React.Component {
     }
     render() {
         let statusColour = this.getStatusColour();
-        let selectedColumn = StringExtensions.IsNotNullOrEmpty(this.state.SelectedColumnId)
+        let selectedColumn = StringExtensions_1.StringExtensions.IsNotNullOrEmpty(this.state.SelectedColumnId)
             ? this.props.api.columnApi.getColumnWithColumnId(this.state.SelectedColumnId)
             : null;
-        let previewPanel = (React.createElement(PreviewResultsPanel, { previewInfo: this.props.PreviewInfo, api: this.props.api, selectedColumn: selectedColumn, showPanel: true, showHeader: false }));
-        const operationMenuItems = EnumExtensions.getNames(MathOperation).map((mathOperation, index) => {
+        let previewPanel = (React.createElement(PreviewResultsPanel_1.PreviewResultsPanel, { previewInfo: this.props.PreviewInfo, api: this.props.api, selectedColumn: selectedColumn, showPanel: true, showHeader: false }));
+        const operationMenuItems = EnumExtensions_1.EnumExtensions.getNames(Enums_1.MathOperation).map((mathOperation, index) => {
             return {
                 onClick: () => this.props.onSmartEditOperationChange(mathOperation),
                 value: mathOperation,
@@ -65,21 +69,21 @@ class SmartEditViewPanelComponent extends React.Component {
             !this.props.IsValidSelection ||
             this.props.InPivotMode == true;
         const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
-        return (React.createElement(Flex, { flexDirection: "row", className: `ab-${elementType}__SmartEdit__wrap`, flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
-            React.createElement(Flex, null,
-                React.createElement(Select, { value: typeof this.props.SmartEditOperation === 'object'
+        return (React.createElement(rebass_1.Flex, { flexDirection: "row", className: `ab-${elementType}__SmartEdit__wrap`, flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
+            React.createElement(rebass_1.Flex, null,
+                React.createElement(Select_1.Select, { value: typeof this.props.SmartEditOperation === 'object'
                         ? this.props.SmartEditOperation.name
                         : this.props.SmartEditOperation, options: operationMenuItems, onChange: (operation) => this.props.onSmartEditOperationChange(operation), style: { marginRight: 1 } }),
-                React.createElement(Input, { style: {
+                React.createElement(Input_1.default, { style: {
                         width: '5rem',
                     }, className: `ab-${elementType}__SmartEdit__select-value`, value: this.props.SmartEditValue.toString(), type: "number", placeholder: "Enter a Number", step: "any", onChange: (e) => this.onSmartEditValueChange(e), disabled: shouldDisable })),
-            React.createElement(Flex, null,
-                !shouldDisable && (React.createElement(ButtonApply, { onClick: () => this.onApplyClick(), style: applyButtonStyle, className: `ab-${elementType}__SmartEdit__apply`, tooltip: "Apply Smart Edit", disabled: StringExtensions.IsNullOrEmpty(`${this.props.SmartEditValue}`) ||
+            React.createElement(rebass_1.Flex, null,
+                !shouldDisable && (React.createElement(ButtonApply_1.ButtonApply, { onClick: () => this.onApplyClick(), style: applyButtonStyle, className: `ab-${elementType}__SmartEdit__apply`, tooltip: "Apply Smart Edit", disabled: StringExtensions_1.StringExtensions.IsNullOrEmpty(`${this.props.SmartEditValue}`) ||
                         (this.props.PreviewInfo != null &&
                             this.props.PreviewInfo.previewValidationSummary.validationResult == 'All'), accessLevel: this.props.accessLevel }, this.props.viewType === 'ToolPanel' && 'Apply Smart Edit')),
-                !shouldDisable && (React.createElement(AdaptablePopover, { headerText: "Preview Results", className: `ab-${elementType}__SmartEdit__info`, 
+                !shouldDisable && (React.createElement(AdaptablePopover_1.AdaptablePopover, { headerText: "Preview Results", className: `ab-${elementType}__SmartEdit__info`, 
                     //  tooltipText="Preview Results"
-                    bodyText: [previewPanel], MessageType: UIHelper.getMessageTypeByStatusColour(statusColour), useButton: true, showEvent: 'focus', hideEvent: "blur" })))));
+                    bodyText: [previewPanel], MessageType: UIHelper_1.UIHelper.getMessageTypeByStatusColour(statusColour), useButton: true, showEvent: 'focus', hideEvent: "blur" })))));
     }
     checkSelectedCells() {
         this.props.onSmartEditCheckSelectedCells();
@@ -89,16 +93,16 @@ class SmartEditViewPanelComponent extends React.Component {
         this.props.onSmartEditValueChange(Number(e.value));
     }
     getStatusColour() {
-        if (StringExtensions.IsNotNullOrEmpty(`${this.props.SmartEditValue}`) &&
+        if (StringExtensions_1.StringExtensions.IsNotNullOrEmpty(`${this.props.SmartEditValue}`) &&
             this.props.PreviewInfo) {
             if (this.props.PreviewInfo.previewValidationSummary.validationResult == 'All') {
-                return StatusColour.Error;
+                return Enums_1.StatusColour.Error;
             }
             if (this.props.PreviewInfo.previewValidationSummary.validationResult == 'Some') {
-                return StatusColour.Warn;
+                return Enums_1.StatusColour.Warn;
             }
         }
-        return StatusColour.Success;
+        return Enums_1.StatusColour.Success;
     }
     onApplyClick() {
         this.onApplySmartEdit();
@@ -124,4 +128,4 @@ function mapDispatchToProps(dispatch) {
         onRunSmartEdit: () => dispatch(SmartEditRedux.SmartEditRun(false)),
     };
 }
-export let SmartEditViewPanelControl = connect(mapStateToProps, mapDispatchToProps)(SmartEditViewPanelComponent);
+exports.SmartEditViewPanelControl = (0, react_redux_1.connect)(mapStateToProps, mapDispatchToProps)(SmartEditViewPanelComponent);

package/src/View/SpecialColumnSettingsWizardStep.js

@@ -1,14 +1,18 @@
-import chunk from 'lodash/chunk';
-import * as React from 'react';
-import { Flex } from 'rebass';
-import { CheckBox } from '../components/CheckBox';
-import FormLayout, { FormRow } from '../components/FormLayout';
-import { Tabs } from '../components/Tabs';
-import { ColumnFilterModuleId } from '../Utilities/Constants/ModuleConstants';
-import { useAdaptable } from './AdaptableContext';
-export const SpecialColumnSettingsWizardStep = (props) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SpecialColumnSettingsWizardStep = void 0;
+const tslib_1 = require("tslib");
+const chunk_1 = tslib_1.__importDefault(require("lodash/chunk"));
+const React = tslib_1.__importStar(require("react"));
+const rebass_1 = require("rebass");
+const CheckBox_1 = require("../components/CheckBox");
+const FormLayout_1 = tslib_1.__importStar(require("../components/FormLayout"));
+const Tabs_1 = require("../components/Tabs");
+const ModuleConstants_1 = require("../Utilities/Constants/ModuleConstants");
+const AdaptableContext_1 = require("./AdaptableContext");
+const SpecialColumnSettingsWizardStep = (props) => {
     var _a, _b;
-    const adaptable = useAdaptable();
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const possibleColumnTypes = adaptable.api.optionsApi.getColumnOptions().columnTypes;
     const { Filterable, Resizable, Groupable, Sortable, Pivotable, Aggregatable, SuppressMenu, SuppressMovable, } = (_a = props.settings) !== null && _a !== void 0 ? _a : {};
     const handleColumnTypeChange = (columnType, checked) => {
@@ -25,36 +29,37 @@ export const SpecialColumnSettingsWizardStep = (props) => {
         props.onChange(Object.assign(Object.assign({}, props.settings), values));
     };
     return (React.createElement(React.Fragment, null,
-        React.createElement(Tabs, { marginTop: 2, autoFocus: false },
-            React.createElement(Tabs.Tab, null, "Column Properties"),
-            React.createElement(Tabs.Content, null,
-                React.createElement(Flex, { flexDirection: "column" },
-                    React.createElement(FormLayout, { style: { width: '100%' }, columns: [
+        React.createElement(Tabs_1.Tabs, { marginTop: 2, autoFocus: false },
+            React.createElement(Tabs_1.Tabs.Tab, null, "Column Properties"),
+            React.createElement(Tabs_1.Tabs.Content, null,
+                React.createElement(rebass_1.Flex, { flexDirection: "column" },
+                    React.createElement(FormLayout_1.default, { style: { width: '100%' }, columns: [
                             { name: 'first', size: '30%' },
                             { size: '30%', name: 'second' },
                             { size: '30%', name: 'third' },
                         ] },
-                        React.createElement(FormRow, null,
-                            React.createElement(CheckBox, { "data-name": "filterable", checked: Filterable, onChange: (Filterable) => onSettingsChange({ Filterable }), disabled: !adaptable.api.optionsApi.getColumnFilterOptions()
+                        React.createElement(FormLayout_1.FormRow, null,
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "filterable", checked: Filterable, onChange: (Filterable) => onSettingsChange({ Filterable }), disabled: !adaptable.api.optionsApi.getColumnFilterOptions()
                                     .enableFilterOnSpecialColumns ||
-                                    adaptable.EntitlementService.getEntitlementAccessLevelForModule(ColumnFilterModuleId) == 'Hidden' }, "Filterable"),
-                            React.createElement(CheckBox, { "data-name": "resizable", checked: Resizable, onChange: (Resizable) => onSettingsChange({ Resizable }) }, "Resizable"),
-                            React.createElement(CheckBox, { "data-name": "groupable", checked: Groupable, onChange: (Groupable) => onSettingsChange({ Groupable }) }, "Groupable")),
-                        React.createElement(FormRow, null,
-                            React.createElement(CheckBox, { "data-name": "sortable", checked: Sortable, onChange: (Sortable) => onSettingsChange({ Sortable }) }, "Sortable"),
-                            React.createElement(CheckBox, { "data-name": "pivotable", checked: Pivotable, onChange: (Pivotable) => onSettingsChange({ Pivotable }) }, "Pivotable"),
-                            React.createElement(CheckBox, { "data-name": "aggregatable", checked: Aggregatable, onChange: (Aggregatable) => onSettingsChange({ Aggregatable }) }, "Aggregatable")),
-                        React.createElement(FormRow, null,
-                            React.createElement(CheckBox, { "data-name": "suppres-smenu", checked: SuppressMenu, onChange: (SuppressMenu) => onSettingsChange({ SuppressMenu }) }, "Suppress Menu"),
-                            React.createElement(CheckBox, { "data-name": "suppres-movable", checked: SuppressMovable, onChange: (SuppressMovable) => onSettingsChange({ SuppressMovable }) }, "Suppress Movable"),
-                            React.createElement(CheckBox, { disabled: true, checked: props.isEditable }, "Editable")))))),
-        Boolean(possibleColumnTypes === null || possibleColumnTypes === void 0 ? void 0 : possibleColumnTypes.length) && (React.createElement(Tabs, { marginTop: 2, autoFocus: false },
-            React.createElement(Tabs.Tab, null, "Column Types"),
-            React.createElement(Tabs.Content, null,
-                React.createElement(FormLayout, { columns: [{ name: 'first', size: '30%' }, { name: 'second' }] }, (_b = chunk(possibleColumnTypes !== null && possibleColumnTypes !== void 0 ? possibleColumnTypes : [], 2)) === null || _b === void 0 ? void 0 : _b.map(([first, second]) => {
+                                    adaptable.EntitlementService.getEntitlementAccessLevelForModule(ModuleConstants_1.ColumnFilterModuleId) == 'Hidden' }, "Filterable"),
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "resizable", checked: Resizable, onChange: (Resizable) => onSettingsChange({ Resizable }) }, "Resizable"),
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "groupable", checked: Groupable, onChange: (Groupable) => onSettingsChange({ Groupable }) }, "Groupable")),
+                        React.createElement(FormLayout_1.FormRow, null,
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "sortable", checked: Sortable, onChange: (Sortable) => onSettingsChange({ Sortable }) }, "Sortable"),
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "pivotable", checked: Pivotable, onChange: (Pivotable) => onSettingsChange({ Pivotable }) }, "Pivotable"),
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "aggregatable", checked: Aggregatable, onChange: (Aggregatable) => onSettingsChange({ Aggregatable }) }, "Aggregatable")),
+                        React.createElement(FormLayout_1.FormRow, null,
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "suppres-smenu", checked: SuppressMenu, onChange: (SuppressMenu) => onSettingsChange({ SuppressMenu }) }, "Suppress Menu"),
+                            React.createElement(CheckBox_1.CheckBox, { "data-name": "suppres-movable", checked: SuppressMovable, onChange: (SuppressMovable) => onSettingsChange({ SuppressMovable }) }, "Suppress Movable"),
+                            React.createElement(CheckBox_1.CheckBox, { disabled: true, checked: props.isEditable }, "Editable")))))),
+        Boolean(possibleColumnTypes === null || possibleColumnTypes === void 0 ? void 0 : possibleColumnTypes.length) && (React.createElement(Tabs_1.Tabs, { marginTop: 2, autoFocus: false },
+            React.createElement(Tabs_1.Tabs.Tab, null, "Column Types"),
+            React.createElement(Tabs_1.Tabs.Content, null,
+                React.createElement(FormLayout_1.default, { columns: [{ name: 'first', size: '30%' }, { name: 'second' }] }, (_b = (0, chunk_1.default)(possibleColumnTypes !== null && possibleColumnTypes !== void 0 ? possibleColumnTypes : [], 2)) === null || _b === void 0 ? void 0 : _b.map(([first, second]) => {
                     var _a, _b, _c, _d, _e, _f;
-                    return (React.createElement(FormRow, { key: first },
-                        first && (React.createElement(CheckBox, { "data-name": first, onChange: (checked) => handleColumnTypeChange(first, checked), checked: (_c = (_b = (_a = props.settings) === null || _a === void 0 ? void 0 : _a.ColumnTypes) === null || _b === void 0 ? void 0 : _b.includes) === null || _c === void 0 ? void 0 : _c.call(_b, first) }, first)),
-                        second && (React.createElement(CheckBox, { "data-name": second, onChange: (checked) => handleColumnTypeChange(second, checked), checked: (_f = (_e = (_d = props.settings) === null || _d === void 0 ? void 0 : _d.ColumnTypes) === null || _e === void 0 ? void 0 : _e.includes) === null || _f === void 0 ? void 0 : _f.call(_e, second) }, second))));
+                    return (React.createElement(FormLayout_1.FormRow, { key: first },
+                        first && (React.createElement(CheckBox_1.CheckBox, { "data-name": first, onChange: (checked) => handleColumnTypeChange(first, checked), checked: (_c = (_b = (_a = props.settings) === null || _a === void 0 ? void 0 : _a.ColumnTypes) === null || _b === void 0 ? void 0 : _b.includes) === null || _c === void 0 ? void 0 : _c.call(_b, first) }, first)),
+                        second && (React.createElement(CheckBox_1.CheckBox, { "data-name": second, onChange: (checked) => handleColumnTypeChange(second, checked), checked: (_f = (_e = (_d = props.settings) === null || _d === void 0 ? void 0 : _d.ColumnTypes) === null || _e === void 0 ? void 0 : _e.includes) === null || _f === void 0 ? void 0 : _f.call(_e, second) }, second))));
                 })))))));
 };
+exports.SpecialColumnSettingsWizardStep = SpecialColumnSettingsWizardStep;

package/src/View/StateManagement/StateManagementPopup.js

@@ -1,27 +1,32 @@
-import * as React from 'react';
-import { PopupPanel } from '../Components/Popups/AdaptablePopup/PopupPanel';
-import HelpBlock from '../../components/HelpBlock';
-import { LoadButton } from './components/LoadButton';
-import { ClearButton } from './components/ClearButton';
-import { ExportDropdown } from './components/ExportDropdown';
-import Panel from '../../components/Panel';
-export const StateManagementPopup = (props) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StateManagementPopup = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const PopupPanel_1 = require("../Components/Popups/AdaptablePopup/PopupPanel");
+const HelpBlock_1 = tslib_1.__importDefault(require("../../components/HelpBlock"));
+const LoadButton_1 = require("./components/LoadButton");
+const ClearButton_1 = require("./components/ClearButton");
+const ExportDropdown_1 = require("./components/ExportDropdown");
+const Panel_1 = tslib_1.__importDefault(require("../../components/Panel"));
+const StateManagementPopup = (props) => {
     const baseClassName = 'ab-ManageState';
-    return (React.createElement(PopupPanel, { className: baseClassName, headerText: props.moduleInfo.FriendlyName, glyphicon: props.moduleInfo.Glyph, infoLink: props.moduleInfo.HelpPage, infoLinkDisabled: !props.api.internalApi.isDocumentationLinksDisplayed() },
-        React.createElement(Panel, { className: `${baseClassName}__panel`, "data-name": "user-state", header: 'User State', style: { height: 'auto' }, variant: "default", borderRadius: "none", marginRight: 2, mb: 2 },
-            React.createElement(HelpBlock, { marginBottom: 2 }, 'Clear all current user state that has been persisted'),
-            React.createElement(HelpBlock, { style: { color: 'var(--ab-color-warn)' } }, 'This will cause this window to close and any state you have previously created will be lost and the initial Predefined Config will then be reapplied.'),
-            React.createElement(ClearButton, { "data-name": "clear-user-state-button", tone: "info", variant: "raised", marginTop: 2, accessLevel: props.accessLevel, onClick: () => props.api.configApi.reloadPredefinedConfig() }, "Clear User State")),
-        React.createElement(Panel, { className: `${baseClassName}__panel`, "data-name": "predefined-config", header: 'Load Predefined Config', style: { height: 'auto' }, variant: "default", borderRadius: "none", marginTop: 3, marginRight: 2, mb: 2 },
-            React.createElement(HelpBlock, { marginTop: 2 }, 'Load Predefined Config (from a .json file) - this will cause this window to close'),
+    return (React.createElement(PopupPanel_1.PopupPanel, { className: baseClassName, headerText: props.moduleInfo.FriendlyName, glyphicon: props.moduleInfo.Glyph, infoLink: props.moduleInfo.HelpPage, infoLinkDisabled: !props.api.internalApi.isDocumentationLinksDisplayed() },
+        React.createElement(Panel_1.default, { className: `${baseClassName}__panel`, "data-name": "user-state", header: 'User State', style: { height: 'auto' }, variant: "default", borderRadius: "none", marginRight: 2, mb: 2 },
+            React.createElement(HelpBlock_1.default, { marginBottom: 2 }, 'Clear all current user state that has been persisted'),
+            React.createElement(HelpBlock_1.default, { style: { color: 'var(--ab-color-warn)' } }, 'This will cause this window to close and any state you have previously created will be lost and the initial Predefined Config will then be reapplied.'),
+            React.createElement(ClearButton_1.ClearButton, { "data-name": "clear-user-state-button", tone: "info", variant: "raised", marginTop: 2, accessLevel: props.accessLevel, onClick: () => props.api.configApi.reloadPredefinedConfig() }, "Clear User State")),
+        React.createElement(Panel_1.default, { className: `${baseClassName}__panel`, "data-name": "predefined-config", header: 'Load Predefined Config', style: { height: 'auto' }, variant: "default", borderRadius: "none", marginTop: 3, marginRight: 2, mb: 2 },
+            React.createElement(HelpBlock_1.default, { marginTop: 2 }, 'Load Predefined Config (from a .json file) - this will cause this window to close'),
             ' ',
-            React.createElement(LoadButton, { tone: "info", variant: "raised", marginTop: 2, accessLevel: props.accessLevel, onLoad: (json) => props.api.configApi.reloadPredefinedConfig(json), "data-name": "load-predefined-config-button" }, "Load Predefined Config")),
-        React.createElement(Panel, { className: `${baseClassName}__panel`, "data-name": "adaptable-state", header: 'Export Adaptable State', style: { height: 'auto' }, variant: "default", borderRadius: "none", marginTop: 3, marginRight: 2, mb: 2 },
-            React.createElement(HelpBlock, { marginTop: 2, marginBottom: 2 }, 'Exports the currently persisted Adaptable State'),
+            React.createElement(LoadButton_1.LoadButton, { tone: "info", variant: "raised", marginTop: 2, accessLevel: props.accessLevel, onLoad: (json) => props.api.configApi.reloadPredefinedConfig(json), "data-name": "load-predefined-config-button" }, "Load Predefined Config")),
+        React.createElement(Panel_1.default, { className: `${baseClassName}__panel`, "data-name": "adaptable-state", header: 'Export Adaptable State', style: { height: 'auto' }, variant: "default", borderRadius: "none", marginTop: 3, marginRight: 2, mb: 2 },
+            React.createElement(HelpBlock_1.default, { marginTop: 2, marginBottom: 2 }, 'Exports the currently persisted Adaptable State'),
             ' ',
-            React.createElement(ExportDropdown, { api: props.api, type: "adaptableState", marginRight: 3, style: { flex: 1, maxWidth: 'none' }, columns: ['label'], "data-name": "export-adaptable-state-dropdown" }, "Select Export Destination")),
-        React.createElement(Panel, { className: `${baseClassName}__panel`, "data-name": "initial-predefined-config", header: 'Export Initial Predefined Config', style: { height: 'auto' }, variant: "default", borderRadius: "none", marginTop: 3, marginRight: 2, mb: 2 },
-            React.createElement(HelpBlock, { marginTop: 2, marginBottom: 2 }, 'Exports the Predefined Config which was provided at design time'),
+            React.createElement(ExportDropdown_1.ExportDropdown, { api: props.api, type: "adaptableState", marginRight: 3, style: { flex: 1, maxWidth: 'none' }, columns: ['label'], "data-name": "export-adaptable-state-dropdown" }, "Select Export Destination")),
+        React.createElement(Panel_1.default, { className: `${baseClassName}__panel`, "data-name": "initial-predefined-config", header: 'Export Initial Predefined Config', style: { height: 'auto' }, variant: "default", borderRadius: "none", marginTop: 3, marginRight: 2, mb: 2 },
+            React.createElement(HelpBlock_1.default, { marginTop: 2, marginBottom: 2 }, 'Exports the Predefined Config which was provided at design time'),
             ' ',
-            React.createElement(ExportDropdown, { api: props.api, type: "predefinedConfig", marginRight: 3, style: { flex: 1, maxWidth: 'none' }, columns: ['label'], "data-name": "export-initial-predefined-config-dropdown" }, "Select Export Destination"))));
+            React.createElement(ExportDropdown_1.ExportDropdown, { api: props.api, type: "predefinedConfig", marginRight: 3, style: { flex: 1, maxWidth: 'none' }, columns: ['label'], "data-name": "export-initial-predefined-config-dropdown" }, "Select Export Destination"))));
 };
+exports.StateManagementPopup = StateManagementPopup;

package/src/View/StateManagement/StateManagementViewPanel.js

@@ -1,17 +1,22 @@
-import * as React from 'react';
-import join from '../../components/utils/join';
-import * as GeneralConstants from '../../Utilities/Constants/GeneralConstants';
-import { LoadButton } from './components/LoadButton';
-import { ClearButton } from './components/ClearButton';
-import { Flex } from 'rebass';
-import { ExportDropdown } from './components/ExportDropdown';
-export const StateManagementViewPanel = (props) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StateManagementViewPanel = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const join_1 = tslib_1.__importDefault(require("../../components/utils/join"));
+const GeneralConstants = tslib_1.__importStar(require("../../Utilities/Constants/GeneralConstants"));
+const LoadButton_1 = require("./components/LoadButton");
+const ClearButton_1 = require("./components/ClearButton");
+const rebass_1 = require("rebass");
+const ExportDropdown_1 = require("./components/ExportDropdown");
+const StateManagementViewPanel = (props) => {
     const isToolbar = props.viewType === 'Toolbar';
     const elementType = isToolbar ? 'DashboardToolbar' : 'ToolPanel';
-    return (React.createElement(Flex, { flexDirection: isToolbar ? 'row' : 'column', className: join(props.accessLevel == 'ReadOnly' ? GeneralConstants.READ_ONLY_STYLE : '', `ab-${elementType}__StateManagement__wrap`) },
-        React.createElement(Flex, { flexDirection: "row" },
-            React.createElement(LoadButton, { tooltip: "Load Predefined Config", variant: "text", icon: "upload", onLoad: (json) => props.api.configApi.reloadPredefinedConfig(json), accessLevel: props.accessLevel }, !isToolbar && 'Load'),
-            React.createElement(ClearButton, { icon: "delete", tooltip: "Clear User State", variant: "text", onClick: () => props.api.configApi.reloadPredefinedConfig(), accessLevel: props.accessLevel }, !isToolbar && 'Clear')),
-        React.createElement(ExportDropdown, { api: props.api, type: "adaptableState" }, "All State"),
-        React.createElement(ExportDropdown, { api: props.api, type: "predefinedConfig" }, "Predefined Config")));
+    return (React.createElement(rebass_1.Flex, { flexDirection: isToolbar ? 'row' : 'column', className: (0, join_1.default)(props.accessLevel == 'ReadOnly' ? GeneralConstants.READ_ONLY_STYLE : '', `ab-${elementType}__StateManagement__wrap`) },
+        React.createElement(rebass_1.Flex, { flexDirection: "row" },
+            React.createElement(LoadButton_1.LoadButton, { tooltip: "Load Predefined Config", variant: "text", icon: "upload", onLoad: (json) => props.api.configApi.reloadPredefinedConfig(json), accessLevel: props.accessLevel }, !isToolbar && 'Load'),
+            React.createElement(ClearButton_1.ClearButton, { icon: "delete", tooltip: "Clear User State", variant: "text", onClick: () => props.api.configApi.reloadPredefinedConfig(), accessLevel: props.accessLevel }, !isToolbar && 'Clear')),
+        React.createElement(ExportDropdown_1.ExportDropdown, { api: props.api, type: "adaptableState" }, "All State"),
+        React.createElement(ExportDropdown_1.ExportDropdown, { api: props.api, type: "predefinedConfig" }, "Predefined Config")));
 };
+exports.StateManagementViewPanel = StateManagementViewPanel;

package/src/View/StateManagement/components/ClearButton.js

@@ -1,5 +1,10 @@
-import * as React from 'react';
-import SimpleButton from '../../../components/SimpleButton';
-export const ClearButton = (props) => {
-    return (React.createElement(SimpleButton, Object.assign({}, props, { className: "ab-StateManagement__Clear-Button", tooltip: "Clear User State" }), props.children));
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ClearButton = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const SimpleButton_1 = tslib_1.__importDefault(require("../../../components/SimpleButton"));
+const ClearButton = (props) => {
+    return (React.createElement(SimpleButton_1.default, Object.assign({}, props, { className: "ab-StateManagement__Clear-Button", tooltip: "Clear User State" }), props.children));
 };
+exports.ClearButton = ClearButton;

package/src/View/StateManagement/components/ExportDropdown.js

@@ -1,16 +1,20 @@
-import * as React from 'react';
-import DropdownButton from '../../../components/DropdownButton';
-import { handleExportState } from '../handleExportState';
-export const ExportDropdown = (props) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ExportDropdown = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const DropdownButton_1 = tslib_1.__importDefault(require("../../../components/DropdownButton"));
+const handleExportState_1 = require("../handleExportState");
+const ExportDropdown = (props) => {
     const handleChange = (destination) => {
         switch (props.type) {
             case 'adaptableState':
                 const adaptableState = props.api.configApi.getPersistedState();
-                handleExportState(destination, 'adaptableState', adaptableState);
+                (0, handleExportState_1.handleExportState)(destination, 'adaptableState', adaptableState);
                 break;
             case 'predefinedConfig':
                 const predefinedConfig = props.api.configApi.getPredefinedConfig();
-                handleExportState(destination, 'predefinedConfig', predefinedConfig);
+                (0, handleExportState_1.handleExportState)(destination, 'predefinedConfig', predefinedConfig);
                 break;
         }
     };
@@ -31,5 +35,6 @@ export const ExportDropdown = (props) => {
             onClick: () => handleChange('JSON'),
         },
     ];
-    return (React.createElement(DropdownButton, Object.assign({ className: "ab-StateManagement__Export-Dropdown" }, props, { items: destinationOptions, value: undefined })));
+    return (React.createElement(DropdownButton_1.default, Object.assign({ className: "ab-StateManagement__Export-Dropdown" }, props, { items: destinationOptions, value: undefined })));
 };
+exports.ExportDropdown = ExportDropdown;

package/src/View/StateManagement/components/LoadButton.js

@@ -1,7 +1,11 @@
-import * as React from 'react';
-import { readJSONFile } from '../../../components/FileDroppable';
-import SimpleButton from '../../../components/SimpleButton';
-export const LoadButton = (props) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LoadButton = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const FileDroppable_1 = require("../../../components/FileDroppable");
+const SimpleButton_1 = tslib_1.__importDefault(require("../../../components/SimpleButton"));
+const LoadButton = (props) => {
     const onLoadPredefinedConfig = (e) => {
         const nativeEvent = e.nativeEvent;
         let files;
@@ -12,11 +16,11 @@ export const LoadButton = (props) => {
             files = e.target.files;
         }
         const file = files[0];
-        readJSONFile(file).then((json) => {
+        (0, FileDroppable_1.readJSONFile)(file).then((json) => {
             props.onLoad(json);
         });
     };
-    return (React.createElement(SimpleButton, Object.assign({}, props, { className: "ab-StateManagement__Load-Button" }),
+    return (React.createElement(SimpleButton_1.default, Object.assign({}, props, { className: "ab-StateManagement__Load-Button" }),
         React.createElement("input", { type: "file", onChange: (json) => onLoadPredefinedConfig(json), accept: '.json', style: {
                 opacity: 0,
                 position: 'absolute',
@@ -32,3 +36,4 @@ export const LoadButton = (props) => {
         ' ',
         props.children));
 };
+exports.LoadButton = LoadButton;

package/src/View/StateManagement/handleExportState.js

@@ -1,9 +1,13 @@
-import Helper from '../../Utilities/Helpers/Helper';
-export const handleExportState = (type, name, state) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.handleExportState = void 0;
+const tslib_1 = require("tslib");
+const Helper_1 = tslib_1.__importDefault(require("../../Utilities/Helpers/Helper"));
+const handleExportState = (type, name, state) => {
     switch (type) {
         case 'Clipboard':
             let stringifiedState = JSON.stringify(state);
-            Helper.copyToClipboard(stringifiedState);
+            Helper_1.default.copyToClipboard(stringifiedState);
             break;
         case 'Console':
             console.log('Adaptable State: ', state);
@@ -11,7 +15,8 @@ export const handleExportState = (type, name, state) => {
         case 'JSON':
             const jsonFileName = name + '.json';
             const jsonContent = JSON.stringify(state);
-            Helper.createDownloadedFile(jsonContent, jsonFileName, 'application/json');
+            Helper_1.default.createDownloadedFile(jsonContent, jsonFileName, 'application/json');
             break;
     }
 };
+exports.handleExportState = handleExportState;

package/src/View/StatusBar/AdaptableStatusBar.js

@@ -1,21 +1,25 @@
-import * as React from 'react';
-import { useDispatch, useSelector } from 'react-redux';
-import { Flex } from 'rebass';
-import { getStatusPanelsSelector } from '../../Redux/ActionsReducers/StatusBarRedux';
-import { useAdaptable } from '../AdaptableContext';
-import { StatusBarPanel } from './StatusBarPanel';
-export const AdaptableStatusBar = (props) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptableStatusBar = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_redux_1 = require("react-redux");
+const rebass_1 = require("rebass");
+const StatusBarRedux_1 = require("../../Redux/ActionsReducers/StatusBarRedux");
+const AdaptableContext_1 = require("../AdaptableContext");
+const StatusBarPanel_1 = require("./StatusBarPanel");
+const AdaptableStatusBar = (props) => {
     var _a;
     /**
      * All state is selected so the Status Bar is re-rendered for all adaptable state changes
      */
-    const state = useSelector((state) => state);
-    const statusPanels = getStatusPanelsSelector(state);
-    const adaptable = useAdaptable();
-    const dispatch = useDispatch();
+    const state = (0, react_redux_1.useSelector)((state) => state);
+    const statusPanels = (0, StatusBarRedux_1.getStatusPanelsSelector)(state);
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    const dispatch = (0, react_redux_1.useDispatch)();
     const statusSubPanels = statusPanels.find((statusPanel) => statusPanel.Key === props.context.Key);
-    const allMenuItems = useSelector((state) => { var _a; return (_a = state === null || state === void 0 ? void 0 : state.Grid) === null || _a === void 0 ? void 0 : _a.SettingPanelModuleMenuItems; });
-    return (React.createElement(Flex, { className: "ab-StatusBar-Panel", "data-id": props.context.Key }, (_a = statusSubPanels === null || statusSubPanels === void 0 ? void 0 : statusSubPanels.StatusBarPanels) === null || _a === void 0 ? void 0 : _a.map((subPanel) => {
+    const allMenuItems = (0, react_redux_1.useSelector)((state) => { var _a; return (_a = state === null || state === void 0 ? void 0 : state.Grid) === null || _a === void 0 ? void 0 : _a.SettingPanelModuleMenuItems; });
+    return (React.createElement(rebass_1.Flex, { className: "ab-StatusBar-Panel", "data-id": props.context.Key }, (_a = statusSubPanels === null || statusSubPanels === void 0 ? void 0 : statusSubPanels.StatusBarPanels) === null || _a === void 0 ? void 0 : _a.map((subPanel) => {
         var _a, _b, _c, _d, _e, _f;
         const module = adaptable.ModuleService.getModuleById(subPanel);
         if (!module) {
@@ -35,6 +39,7 @@ export const AdaptableStatusBar = (props) => {
                 dispatch(menuItem.reduxAction);
             }
         });
-        return (React.createElement(StatusBarPanel, Object.assign({ "data-name": subPanel }, statusBarPanelProps, { tooltip: moduleInfo.FriendlyName, onAction: onAction, icon: (_f = statusBarPanelProps.icon) !== null && _f !== void 0 ? _f : moduleInfo.Glyph, key: subPanel })));
+        return (React.createElement(StatusBarPanel_1.StatusBarPanel, Object.assign({ "data-name": subPanel }, statusBarPanelProps, { tooltip: moduleInfo.FriendlyName, onAction: onAction, icon: (_f = statusBarPanelProps.icon) !== null && _f !== void 0 ? _f : moduleInfo.Glyph, key: subPanel })));
     })));
 };
+exports.AdaptableStatusBar = AdaptableStatusBar;

package/src/View/StatusBar/StatusBarPanel.js

@@ -1,18 +1,21 @@
-import { __rest } from "tslib";
-import * as React from 'react';
-import { Box, Flex } from 'rebass';
-import SimpleButton from '../../components/SimpleButton';
-import ArrayExtensions from '../../Utilities/Extensions/ArrayExtensions';
-import { AdaptablePopover } from '../AdaptablePopover';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StatusBarPanel = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const rebass_1 = require("rebass");
+const SimpleButton_1 = tslib_1.__importDefault(require("../../components/SimpleButton"));
+const ArrayExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/ArrayExtensions"));
+const AdaptablePopover_1 = require("../AdaptablePopover");
 /**
  * Statusbar sub panel are similar to vs code:
  * - text
  * - action
  * - icon
  */
-export const StatusBarPanel = (props) => {
+const StatusBarPanel = (props) => {
     var _a;
-    const { icon, content, popover, popoverMinWidth, view, onAction, extraActions, triggerActionOnWrapperClick = true, tooltip } = props, flexProps = __rest(props, ["icon", "content", "popover", "popoverMinWidth", "view", "onAction", "extraActions", "triggerActionOnWrapperClick", "tooltip"]);
+    const { icon, content, popover, popoverMinWidth, view, onAction, extraActions, triggerActionOnWrapperClick = true, tooltip } = props, flexProps = tslib_1.__rest(props, ["icon", "content", "popover", "popoverMinWidth", "view", "onAction", "extraActions", "triggerActionOnWrapperClick", "tooltip"]);
     const handleAction = () => onAction();
     if (view) {
         const View = view;
@@ -36,8 +39,9 @@ export const StatusBarPanel = (props) => {
     const preparedContent = typeof content === 'function'
         ? React.createElement(content)
         : content;
-    return (React.createElement(Flex, Object.assign({}, flexProps, { alignItems: "center", justifyContent: "center", className: baseClassName, onClick: handleWrapperClick, style: { cursor: shouldTriggerActionOnWrapperClick ? 'pointer' : 'default' } }),
-        props.icon && (React.createElement(SimpleButton, { tooltip: tooltip, color: props.color, icon: props.icon, iconSize: 15, variant: "text", onClick: handleIconClick, mr: preparedContent ? 1 : 0 })),
-        popover ? (React.createElement(AdaptablePopover, { alignPosition: [['BottomCenter', 'TopCenter']], tooltipText: tooltip, showIcon: false, bodyText: [popoverContent], MessageType: 'Info', showEvent: 'focus', hideEvent: "blur", popoverMinWidth: popoverMinWidth }, preparedContent)) : (preparedContent),
-        ArrayExtensions.IsNotNullOrEmpty(extraActions) && (React.createElement(Box, { ml: 1 }, (_a = extraActions === null || extraActions === void 0 ? void 0 : extraActions.map) === null || _a === void 0 ? void 0 : _a.call(extraActions, (action, index) => React.createElement(action, { key: index }))))));
+    return (React.createElement(rebass_1.Flex, Object.assign({}, flexProps, { alignItems: "center", justifyContent: "center", className: baseClassName, onClick: handleWrapperClick, style: { cursor: shouldTriggerActionOnWrapperClick ? 'pointer' : 'default' } }),
+        props.icon && (React.createElement(SimpleButton_1.default, { tooltip: tooltip, color: props.color, icon: props.icon, iconSize: 15, variant: "text", onClick: handleIconClick, mr: preparedContent ? 1 : 0 })),
+        popover ? (React.createElement(AdaptablePopover_1.AdaptablePopover, { alignPosition: [['BottomCenter', 'TopCenter']], tooltipText: tooltip, showIcon: false, bodyText: [popoverContent], MessageType: 'Info', showEvent: 'focus', hideEvent: "blur", popoverMinWidth: popoverMinWidth }, preparedContent)) : (preparedContent),
+        ArrayExtensions_1.default.IsNotNullOrEmpty(extraActions) && (React.createElement(rebass_1.Box, { ml: 1 }, (_a = extraActions === null || extraActions === void 0 ? void 0 : extraActions.map) === null || _a === void 0 ? void 0 : _a.call(extraActions, (action, index) => React.createElement(action, { key: index }))))));
 };
+exports.StatusBarPanel = StatusBarPanel;

package/src/View/StatusBar/StatusBarPopup.js

@@ -1,14 +1,18 @@
-import * as React from 'react';
-import { useSelector } from 'react-redux';
-import { ModuleManager } from '../../components/DragAndDropContext/ModuleManager';
-import EmptyContent from '../../components/EmptyContent';
-import { ALL_STATUS_SUB_PANELS, } from '../../PredefinedConfig/Common/Types';
-import { getStatusPanelsSelector } from '../../Redux/ActionsReducers/StatusBarRedux';
-import { useAdaptable } from '../AdaptableContext';
-import { PopupPanel } from '../Components/Popups/AdaptablePopup/PopupPanel';
-export const StatusBarPopup = (props) => {
-    const statusPanels = useSelector(getStatusPanelsSelector);
-    const adaptable = useAdaptable();
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StatusBarPopup = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_redux_1 = require("react-redux");
+const ModuleManager_1 = require("../../components/DragAndDropContext/ModuleManager");
+const EmptyContent_1 = tslib_1.__importDefault(require("../../components/EmptyContent"));
+const Types_1 = require("../../PredefinedConfig/Common/Types");
+const StatusBarRedux_1 = require("../../Redux/ActionsReducers/StatusBarRedux");
+const AdaptableContext_1 = require("../AdaptableContext");
+const PopupPanel_1 = require("../Components/Popups/AdaptablePopup/PopupPanel");
+const StatusBarPopup = (props) => {
+    const statusPanels = (0, react_redux_1.useSelector)(StatusBarRedux_1.getStatusPanelsSelector);
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const tabs = React.useMemo(() => statusPanels.map((statusPanel) => {
         return {
             Name: statusPanel.Key,
@@ -22,7 +26,7 @@ export const StatusBarPopup = (props) => {
         });
         adaptable.api.statusBarApi.setStatusBarPanels(newStatusPanels);
     }, [statusPanels]);
-    const availableItems = ALL_STATUS_SUB_PANELS.filter((panel) => {
+    const availableItems = Types_1.ALL_STATUS_SUB_PANELS.filter((panel) => {
         const module = adaptable.ModuleService.getModuleById(panel);
         return module && module.isModuleAvailable();
     }).map((panel) => {
@@ -30,10 +34,11 @@ export const StatusBarPopup = (props) => {
         return { Id: panel, Title: module.moduleInfo.FriendlyName };
     });
     const disabled = props.accessLevel === 'ReadOnly';
-    return (React.createElement(PopupPanel, { headerText: props.moduleInfo.FriendlyName, glyphicon: props.moduleInfo.Glyph, infoLink: props.moduleInfo.HelpPage, infoLinkDisabled: !props.api.internalApi.isDocumentationLinksDisplayed() }, statusPanels.length ? (React.createElement(ModuleManager, { permittedActions: {
+    return (React.createElement(PopupPanel_1.PopupPanel, { headerText: props.moduleInfo.FriendlyName, glyphicon: props.moduleInfo.Glyph, infoLink: props.moduleInfo.HelpPage, infoLinkDisabled: !props.api.internalApi.isDocumentationLinksDisplayed() }, statusPanels.length ? (React.createElement(ModuleManager_1.ModuleManager, { permittedActions: {
             createTab: false,
             dragAndDropTab: false,
             deleteTab: false,
             editTabName: false,
-        }, onTabsChange: handleTabChange, disabled: disabled, tabs: tabs, availableItems: availableItems, tabsTitle: 'AdapTable Status Bar Panels', unusedPanelTitle: "Available Status Bar Components", dragItemText: "Drag into a Status Bar Panel below" })) : (React.createElement(EmptyContent, null, "To enable this feature add to Grid Options statusPanels the Adaptable Status Panel."))));
+        }, onTabsChange: handleTabChange, disabled: disabled, tabs: tabs, availableItems: availableItems, tabsTitle: 'AdapTable Status Bar Panels', unusedPanelTitle: "Available Status Bar Components", dragItemText: "Drag into a Status Bar Panel below" })) : (React.createElement(EmptyContent_1.default, null, "To enable this feature add to Grid Options statusPanels the Adaptable Status Panel."))));
 };
+exports.StatusBarPopup = StatusBarPopup;