@adaptabletools/adaptable 16.2.4 → 17.0.0-canary.0

package/src/View/CellSummary/CellSummaryPopup.js

@@ -1,12 +1,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CellSummaryPopup = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const react_redux_1 = require("react-redux");
-const GridRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/GridRedux"));
-const CellSummaryDetails_1 = require("./CellSummaryDetails");
-const PanelWithButton_1 = require("../Components/Panels/PanelWithButton");
+import * as React from 'react';
+import { connect } from 'react-redux';
+import * as GridRedux from '../../Redux/ActionsReducers/GridRedux';
+import { CellSummaryDetails } from './CellSummaryDetails';
+import { PanelWithButton } from '../Components/Panels/PanelWithButton';
 class CellSummaryPopupComponent extends React.Component {
     componentDidMount() {
         var _a, _b, _c;
@@ -20,8 +16,8 @@ class CellSummaryPopupComponent extends React.Component {
         this.props.onCreateCellSummary();
     }
     render() {
-        return (React.createElement(PanelWithButton_1.PanelWithButton, { headerText: this.props.moduleInfo.FriendlyName, glyphicon: this.props.moduleInfo.Glyph, infoLink: this.props.moduleInfo.HelpPage, infoLinkDisabled: !this.props.api.internalApi.isDocumentationLinksDisplayed() },
-            React.createElement(CellSummaryDetails_1.CellSummaryDetails, { CellSummary: this.props.CellSummary })));
+        return (React.createElement(PanelWithButton, { headerText: this.props.moduleInfo.FriendlyName, glyphicon: this.props.moduleInfo.Glyph, infoLink: this.props.moduleInfo.HelpPage, infoLinkDisabled: !this.props.api.internalApi.isDocumentationLinksDisplayed() },
+            React.createElement(CellSummaryDetails, { CellSummary: this.props.CellSummary })));
     }
 }
 function mapStateToProps(state, ownProps) {
@@ -34,4 +30,4 @@ function mapDispatchToProps(dispatch) {
         onCreateCellSummary: () => dispatch(GridRedux.GridCreateCellSummary()),
     };
 }
-exports.CellSummaryPopup = (0, react_redux_1.connect)(mapStateToProps, mapDispatchToProps)(CellSummaryPopupComponent);
+export let CellSummaryPopup = connect(mapStateToProps, mapDispatchToProps)(CellSummaryPopupComponent);

package/src/View/CellSummary/CellSummaryStatusBarSubPanelPopover.js

@@ -1,16 +1,11 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CellSummaryStatusBarSubPanelPopover = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const CellSummaryDetails_1 = require("./CellSummaryDetails");
-const react_redux_1 = require("react-redux");
-const CellSummaryStatusBarSubPanelPopover = () => {
-    const cellSummary = (0, react_redux_1.useSelector)((state) => state.Grid.CellSummary);
-    const summary = React.createElement(CellSummaryDetails_1.CellSummaryDetails, { CellSummary: cellSummary });
+import * as React from 'react';
+import { CellSummaryDetails } from './CellSummaryDetails';
+import { useSelector } from 'react-redux';
+export const CellSummaryStatusBarSubPanelPopover = () => {
+    const cellSummary = useSelector((state) => state.Grid.CellSummary);
+    const summary = React.createElement(CellSummaryDetails, { CellSummary: cellSummary });
     return cellSummary && cellSummary.Count ? (summary) : (
     // the extra wrapper is added because the empty text is rendered
     // inside a  EmptyContent, hat has position absolute
     React.createElement("div", { style: { position: 'relative', width: '100%', height: 80 } }, summary));
 };
-exports.CellSummaryStatusBarSubPanelPopover = CellSummaryStatusBarSubPanelPopover;

package/src/View/CellSummary/CellSummaryStatusPanel.js

@@ -1,18 +1,14 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CellSummaryStatusPanel = 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 StatusBarPanel_1 = require("../StatusBar/StatusBarPanel");
-const ModuleConstants = tslib_1.__importStar(require("../../Utilities/Constants/ModuleConstants"));
-const GridRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/GridRedux"));
-const CellSummaryStatusBarSubPanelPopover_1 = require("./CellSummaryStatusBarSubPanelPopover");
-const CellSummaryStatusPanel = () => {
+import * as React from 'react';
+import { useDispatch } from 'react-redux';
+import { useAdaptable } from '../AdaptableContext';
+import { StatusBarPanel } from '../StatusBar/StatusBarPanel';
+import * as ModuleConstants from '../../Utilities/Constants/ModuleConstants';
+import * as GridRedux from '../../Redux/ActionsReducers/GridRedux';
+import { CellSummaryStatusBarSubPanelPopover } from './CellSummaryStatusBarSubPanelPopover';
+export const CellSummaryStatusPanel = () => {
     var _a;
-    const adaptable = (0, AdaptableContext_1.useAdaptable)();
-    const dispatch = (0, react_redux_1.useDispatch)();
+    const adaptable = useAdaptable();
+    const dispatch = useDispatch();
     const cellSummaryApi = adaptable.api.cellSummaryApi;
     const module = adaptable.ModuleService.getModuleById(ModuleConstants.CellSummaryModuleId);
     const text = `${cellSummaryApi.getCurrentCellSummaryOperation()}: ${(_a = cellSummaryApi.getCurrentCellSummaryOperationValue()) !== null && _a !== void 0 ? _a : 'N/A'}`;
@@ -32,6 +28,5 @@ const CellSummaryStatusPanel = () => {
         checkSelectedCells();
         return () => cleanupEvent === null || cleanupEvent === void 0 ? void 0 : cleanupEvent();
     }, []);
-    return (React.createElement(StatusBarPanel_1.StatusBarPanel, { tooltip: module.moduleInfo.ModuleName, "data-name": module.moduleInfo.ModuleName, icon: module.moduleInfo.Glyph, onAction: onAction, content: text, popover: CellSummaryStatusBarSubPanelPopover_1.CellSummaryStatusBarSubPanelPopover, popoverMinWidth: 360 }));
+    return (React.createElement(StatusBarPanel, { tooltip: module.moduleInfo.ModuleName, "data-name": module.moduleInfo.ModuleName, icon: module.moduleInfo.Glyph, onAction: onAction, content: text, popover: CellSummaryStatusBarSubPanelPopover, popoverMinWidth: 360 }));
 };
-exports.CellSummaryStatusPanel = CellSummaryStatusPanel;

package/src/View/CellSummary/CellSummaryViewPanel.js

@@ -1,19 +1,15 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CellSummaryViewPanelControl = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const EnumExtensions_1 = require("../../Utilities/Extensions/EnumExtensions");
-const Enums_1 = require("../../PredefinedConfig/Common/Enums");
-const ArrayExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/ArrayExtensions"));
-const CellSummaryPopover_1 = require("./CellSummaryPopover");
-const rebass_1 = require("rebass");
-const GeneralConstants = tslib_1.__importStar(require("../../Utilities/Constants/GeneralConstants"));
-const DropdownButton_1 = tslib_1.__importDefault(require("../../components/DropdownButton"));
-const AdaptablePopover_1 = require("../AdaptablePopover");
-const SystemRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/SystemRedux"));
-const GridRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/GridRedux"));
-const react_redux_1 = require("react-redux");
+import * as React from 'react';
+import { EnumExtensions } from '../../Utilities/Extensions/EnumExtensions';
+import { SummaryOperation } from '../../PredefinedConfig/Common/Enums';
+import ArrayExtensions from '../../Utilities/Extensions/ArrayExtensions';
+import { CellSummaryPopover } from './CellSummaryPopover';
+import { Flex } from 'rebass';
+import * as GeneralConstants from '../../Utilities/Constants/GeneralConstants';
+import DropdownButton from '../../components/DropdownButton';
+import { AdaptablePopover } from '../AdaptablePopover';
+import * as SystemRedux from '../../Redux/ActionsReducers/SystemRedux';
+import * as GridRedux from '../../Redux/ActionsReducers/GridRedux';
+import { connect } from 'react-redux';
 class CellSummaryViewPanelComponent extends React.Component {
     constructor(props) {
         super(props);
@@ -32,14 +28,14 @@ class CellSummaryViewPanelComponent extends React.Component {
         (_a = this.cleanupEvent) === null || _a === void 0 ? void 0 : _a.call(this);
     }
     render() {
-        let operationMenuItems = EnumExtensions_1.EnumExtensions.getNames(Enums_1.SummaryOperation).map((summaryOperation, index) => {
+        let operationMenuItems = EnumExtensions.getNames(SummaryOperation).map((summaryOperation, index) => {
             return {
                 label: summaryOperation,
                 onClick: () => this.props.onCellSummaryOperationChange(summaryOperation),
             };
         });
         const cellSummaryOperationDefinitions = this.props.api.cellSummaryApi.getCellSummaryOperationDefinitions();
-        const operationDefinitions = ArrayExtensions_1.default.IsNullOrEmpty(cellSummaryOperationDefinitions)
+        const operationDefinitions = ArrayExtensions.IsNullOrEmpty(cellSummaryOperationDefinitions)
             ? []
             : cellSummaryOperationDefinitions.map((operationDefinition) => {
                 return {
@@ -47,7 +43,7 @@ class CellSummaryViewPanelComponent extends React.Component {
                     label: operationDefinition.operationName,
                 };
             });
-        let cellSummaryPopover = React.createElement(CellSummaryPopover_1.CellSummaryPopover, { CellSummary: this.props.CellSummary });
+        let cellSummaryPopover = React.createElement(CellSummaryPopover, { CellSummary: this.props.CellSummary });
         let shouldDisable = this.props.accessLevel == 'ReadOnly' ||
             this.props.api.internalApi.isGridInPivotMode() ||
             this.props.CellSummary == null;
@@ -59,15 +55,15 @@ class CellSummaryViewPanelComponent extends React.Component {
             if (operationValue == undefined) {
                 return;
             }
-            return this.props.viewType === 'ToolPanel' ? (React.createElement(rebass_1.Flex, { className: `ab-${elementType}__CellSummary__value`, style: { borderRadius: 'var(--ab__border-radius)' }, marginRight: 2, padding: 2, color: 'var( --ab-color-text-on-info)', backgroundColor: 'var(--ab-color-info)', fontSize: 'var( --ab-font-size-2)' }, operationValue)) : (React.createElement(rebass_1.Flex, { flex: 1, marginRight: 2, marginLeft: 1, justifyContent: "center", className: `ab-${elementType}__CellSummary__value`, color: 'var(--ab-color-text-on-primary)' }, operationValue));
+            return this.props.viewType === 'ToolPanel' ? (React.createElement(Flex, { className: `ab-${elementType}__CellSummary__value`, style: { borderRadius: 'var(--ab__border-radius)' }, marginRight: 2, padding: 2, color: 'var( --ab-color-text-on-info)', backgroundColor: 'var(--ab-color-info)', fontSize: 'var( --ab-font-size-2)' }, operationValue)) : (React.createElement(Flex, { flex: 1, marginRight: 2, marginLeft: 1, justifyContent: "center", className: `ab-${elementType}__CellSummary__value`, color: 'var(--ab-color-text-on-primary)' }, operationValue));
         };
         const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
-        return (React.createElement(rebass_1.Flex, { flexDirection: "row", className: shouldDisable ? GeneralConstants.READ_ONLY_STYLE : `ab-${elementType}__CellSummary__wrap`, flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
-            React.createElement(rebass_1.Flex, { flex: 1 },
-                React.createElement(DropdownButton_1.default, { style: { fontSize: 'small', width: '100%' }, marginRight: 2, columns: ['label'], className: `ab-${elementType}__CellSummary__select`, items: [...operationMenuItems, ...operationDefinitions], disabled: shouldDisable, variant: "outlined", tone: 'neutral' }, this.props.CellSummaryOperation)),
-            React.createElement(rebass_1.Flex, { alignItems: "center" }, React.createElement(React.Fragment, null,
+        return (React.createElement(Flex, { flexDirection: "row", className: shouldDisable ? GeneralConstants.READ_ONLY_STYLE : `ab-${elementType}__CellSummary__wrap`, flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
+            React.createElement(Flex, { flex: 1 },
+                React.createElement(DropdownButton, { style: { fontSize: 'small', width: '100%' }, marginRight: 2, columns: ['label'], className: `ab-${elementType}__CellSummary__select`, items: [...operationMenuItems, ...operationDefinitions], disabled: shouldDisable, variant: "outlined", tone: 'neutral' }, this.props.CellSummaryOperation)),
+            React.createElement(Flex, { alignItems: "center" }, React.createElement(React.Fragment, null,
                 renderOperationValue(),
-                this.props.CellSummary != null && this.props.CellSummary.Count > 0 && (React.createElement(AdaptablePopover_1.AdaptablePopover, { popoverMaxWidth: 360, className: "ab-ToolPanel__CellSummary__info", bodyText: [cellSummaryPopover], useButton: true, showEvent: 'focus', hideEvent: "blur" }))))));
+                this.props.CellSummary != null && this.props.CellSummary.Count > 0 && (React.createElement(AdaptablePopover, { popoverMaxWidth: 360, className: "ab-ToolPanel__CellSummary__info", bodyText: [cellSummaryPopover], useButton: true, showEvent: 'focus', hideEvent: "blur" }))))));
     }
     checkSelectedCells() {
         this.props.onCreateCellSummary();
@@ -90,4 +86,4 @@ function mapDispatchToProps(dispatch) {
         onCreateCellSummary: () => dispatch(GridRedux.GridCreateCellSummary()),
     };
 }
-exports.CellSummaryViewPanelControl = (0, react_redux_1.connect)(mapStateToProps, mapDispatchToProps)(CellSummaryViewPanelComponent);
+export let CellSummaryViewPanelControl = connect(mapStateToProps, mapDispatchToProps)(CellSummaryViewPanelComponent);

package/src/View/Charting/ChartingStatusBarPopover.js

@@ -1,28 +1,23 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChartingStatusBarPopover = 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 useChartingElements_1 = require("./useChartingElements");
-const rebass_1 = require("rebass");
-const ChartingStatusBarPopover = (props) => {
-    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+import * as React from 'react';
+import { useAdaptable } from '../AdaptableContext';
+import * as ModuleConstants from '../../Utilities/Constants/ModuleConstants';
+import { useChartingElements } from './useChartingElements';
+import { Box, Flex } from 'rebass';
+export const ChartingStatusBarPopover = (props) => {
+    const adaptable = useAdaptable();
     const accessLevel = adaptable.api.internalApi
         .getEntitlementService()
         .getEntitlementAccessLevelForModule(ModuleConstants.ChartingModuleId);
-    const { chartSelector, containerSelector, chartButton, deleteButton, editButton } = (0, useChartingElements_1.useChartingElements)({
+    const { chartSelector, containerSelector, chartButton, deleteButton, editButton } = useChartingElements({
         elementType: 'Statusbar',
         accessLevel: accessLevel,
         size: 'small',
     });
-    return (React.createElement(rebass_1.Flex, { width: "100%", alignItems: "center" },
-        React.createElement(rebass_1.Box, null, chartSelector),
-        containerSelector && React.createElement(rebass_1.Box, { ml: 1 }, containerSelector),
-        React.createElement(rebass_1.Box, { ml: 1 },
+    return (React.createElement(Flex, { width: "100%", alignItems: "center" },
+        React.createElement(Box, null, chartSelector),
+        containerSelector && React.createElement(Box, { ml: 1 }, containerSelector),
+        React.createElement(Box, { ml: 1 },
             chartButton,
             deleteButton,
             editButton)));
 };
-exports.ChartingStatusBarPopover = ChartingStatusBarPopover;

package/src/View/Charting/ChartingViewPanel.js

@@ -1,30 +1,25 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChartingViewPanel = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const rebass_1 = require("rebass");
-const useChartingElements_1 = require("./useChartingElements");
-const ChartingViewPanel = (props) => {
+import * as React from 'react';
+import { Box, Flex } from 'rebass';
+import { useChartingElements } from './useChartingElements';
+export const ChartingViewPanel = (props) => {
     const elementType = props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
-    const { chartSelector, containerSelector, chartButton, deleteButton, editButton } = (0, useChartingElements_1.useChartingElements)({ elementType, accessLevel: props.accessLevel });
+    const { chartSelector, containerSelector, chartButton, deleteButton, editButton } = useChartingElements({ elementType, accessLevel: props.accessLevel });
     if (elementType === 'DashboardToolbar') {
-        return (React.createElement(rebass_1.Flex, { width: "100%", alignItems: "center" },
-            React.createElement(rebass_1.Box, null, chartSelector),
-            containerSelector && React.createElement(rebass_1.Box, { ml: 1 }, containerSelector),
-            React.createElement(rebass_1.Box, { ml: 1 },
+        return (React.createElement(Flex, { width: "100%", alignItems: "center" },
+            React.createElement(Box, null, chartSelector),
+            containerSelector && React.createElement(Box, { ml: 1 }, containerSelector),
+            React.createElement(Box, { ml: 1 },
                 chartButton,
                 deleteButton,
                 editButton)));
     }
-    return (React.createElement(rebass_1.Flex, { flexDirection: "column", width: "100%" },
-        React.createElement(rebass_1.Box, { mb: 1 }, chartSelector),
-        containerSelector && React.createElement(rebass_1.Box, { mb: 1 }, containerSelector),
-        React.createElement(rebass_1.Box, null,
+    return (React.createElement(Flex, { flexDirection: "column", width: "100%" },
+        React.createElement(Box, { mb: 1 }, chartSelector),
+        containerSelector && React.createElement(Box, { mb: 1 }, containerSelector),
+        React.createElement(Box, null,
             chartButton,
             " ",
             deleteButton,
             " ",
             editButton)));
 };
-exports.ChartingViewPanel = ChartingViewPanel;

package/src/View/Charting/ChartingWizard/AgChargingWizard/AgChargingWizard.js

@@ -1,16 +1,12 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AgChargingWizard = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const rebass_1 = require("rebass");
-const AdaptableContext_1 = require("../../../AdaptableContext");
-const OnePageAdaptableWizard_1 = require("../../../Wizard/OnePageAdaptableWizard");
-const PreviewChartSection_1 = require("./PreviewChartSection");
-const SettingsSection_1 = require("./SettingsSection");
-const ObjectTagsWizardSection_1 = require("../../../Wizard/ObjectTagsWizardSection");
-const AgChargingWizard = (props) => {
-    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+import * as React from 'react';
+import { Box } from 'rebass';
+import { useAdaptable } from '../../../AdaptableContext';
+import { OnePageAdaptableWizard } from '../../../Wizard/OnePageAdaptableWizard';
+import { PreviewChartSection } from './PreviewChartSection';
+import { isSettingsValid, SettingsSection } from './SettingsSection';
+import { ObjectTagsWizardSection, renderObjectTagsSummary, } from '../../../Wizard/ObjectTagsWizardSection';
+export const AgChargingWizard = (props) => {
+    const adaptable = useAdaptable();
     const [chartDefinition, setChartDefinition] = React.useState(() => {
         var _a, _b;
         return (_a = props.data) !== null && _a !== void 0 ? _a : (_b = props.popupParams) === null || _b === void 0 ? void 0 : _b.value;
@@ -19,29 +15,28 @@ const AgChargingWizard = (props) => {
         adaptable.api.chartingApi.editChartDefinition(chartDefinition);
         props.onFinishWizard(chartDefinition);
     }, [chartDefinition]);
-    return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: chartDefinition, onHide: props.onCloseWizard, onFinish: handleFinish, sections: [
+    return (React.createElement(OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: chartDefinition, onHide: props.onCloseWizard, onFinish: handleFinish, sections: [
             {
                 title: 'Settings',
                 details: 'Chart Settings',
-                isValid: SettingsSection_1.isSettingsValid,
-                render: () => (React.createElement(rebass_1.Box, { padding: 2 },
-                    React.createElement(SettingsSection_1.SettingsSection, { chartDefinition: chartDefinition, onChange: setChartDefinition }))),
+                isValid: isSettingsValid,
+                render: () => (React.createElement(Box, { padding: 2 },
+                    React.createElement(SettingsSection, { chartDefinition: chartDefinition, onChange: setChartDefinition }))),
             },
             {
                 details: 'Select Chart Tags',
                 title: 'Tags',
                 isVisible: () => adaptable.api.internalApi.shouldDisplayTagSections(),
-                render: () => (React.createElement(rebass_1.Box, { padding: 2 },
-                    React.createElement(ObjectTagsWizardSection_1.ObjectTagsWizardSection, { onChange: setChartDefinition }))),
-                renderSummary: ObjectTagsWizardSection_1.renderObjectTagsSummary,
+                render: () => (React.createElement(Box, { padding: 2 },
+                    React.createElement(ObjectTagsWizardSection, { onChange: setChartDefinition }))),
+                renderSummary: renderObjectTagsSummary,
             },
             '-',
             {
                 title: 'Preview Chart',
                 details: 'Chart Preview',
-                render: () => (React.createElement(rebass_1.Box, { p: 2 },
-                    React.createElement(PreviewChartSection_1.PreviewChartSection, { chartDefinition: chartDefinition, onChange: setChartDefinition }))),
+                render: () => (React.createElement(Box, { p: 2 },
+                    React.createElement(PreviewChartSection, { chartDefinition: chartDefinition, onChange: setChartDefinition }))),
             },
         ] }));
 };
-exports.AgChargingWizard = AgChargingWizard;

package/src/View/Charting/ChartingWizard/AgChargingWizard/PreviewChartSection.js

@@ -1,16 +1,12 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PreviewChartSection = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const react_redux_1 = require("react-redux");
-const isEqual_1 = tslib_1.__importDefault(require("lodash/isEqual"));
-const SystemRedux = tslib_1.__importStar(require("../../../../Redux/ActionsReducers/SystemRedux"));
-const AdaptableContext_1 = require("../../../AdaptableContext");
-const PreviewChartSection = (props) => {
-    const currentChartModels = (0, react_redux_1.useSelector)((state) => SystemRedux.SystemChartingCurrentChartModelsSelector(state.System));
+import * as React from 'react';
+import { useSelector } from 'react-redux';
+import isEqual from 'lodash/isEqual';
+import * as SystemRedux from '../../../../Redux/ActionsReducers/SystemRedux';
+import { useAdaptable } from '../../../AdaptableContext';
+export const PreviewChartSection = (props) => {
+    const currentChartModels = useSelector((state) => SystemRedux.SystemChartingCurrentChartModelsSelector(state.System));
     const [localChartId, setLocalChartId] = React.useState(null);
-    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    const adaptable = useAdaptable();
     const divRef = React.useRef(null);
     React.useEffect(() => {
         if (!divRef.current) {
@@ -25,10 +21,9 @@ const PreviewChartSection = (props) => {
     }, [divRef]);
     React.useEffect(() => {
         const model = currentChartModels.find((model) => model.chartId == localChartId);
-        if (model && !(0, isEqual_1.default)(model, props.chartDefinition.Model)) {
+        if (model && !isEqual(model, props.chartDefinition.Model)) {
             props.onChange(Object.assign(Object.assign({}, props.chartDefinition), { Model: model }));
         }
     }, [currentChartModels]);
     return React.createElement("div", { ref: divRef });
 };
-exports.PreviewChartSection = PreviewChartSection;

package/src/View/Charting/ChartingWizard/AgChargingWizard/SettingsSection.js

@@ -1,13 +1,9 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SettingsSection = exports.isSettingsValid = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const CheckBox_1 = require("../../../../components/CheckBox");
-const DropdownButton_1 = tslib_1.__importDefault(require("../../../../components/DropdownButton"));
-const FormLayout_1 = tslib_1.__importStar(require("../../../../components/FormLayout"));
-const AdaptableInput_1 = tslib_1.__importDefault(require("../../../Components/AdaptableInput"));
-const isSettingsValid = (chartDefinition, api) => {
+import * as React from 'react';
+import { CheckBox } from '../../../../components/CheckBox';
+import DropdownButton from '../../../../components/DropdownButton';
+import FormLayout, { FormRow } from '../../../../components/FormLayout';
+import AdaptableInput from '../../../Components/AdaptableInput';
+export const isSettingsValid = (chartDefinition, api) => {
     if (!chartDefinition.Name) {
         return 'Name is mandatory';
     }
@@ -18,8 +14,7 @@ const isSettingsValid = (chartDefinition, api) => {
     }
     return true;
 };
-exports.isSettingsValid = isSettingsValid;
-const SettingsSection = (props) => {
+export const SettingsSection = (props) => {
     const handleNameChange = React.useCallback((event) => {
         props.onChange(Object.assign(Object.assign({}, props.chartDefinition), { Name: event.target.value, Model: props.chartDefinition.Model }));
     }, [props.chartDefinition]);
@@ -40,14 +35,13 @@ const SettingsSection = (props) => {
     const handleAggFuncClear = React.useCallback(() => {
         props.onChange(Object.assign(Object.assign({}, props.chartDefinition), { Model: Object.assign(Object.assign({}, props.chartDefinition.Model), { aggFunc: '' }) }));
     }, [props.chartDefinition]);
-    return (React.createElement(FormLayout_1.default, null,
-        React.createElement(FormLayout_1.FormRow, { label: "Name" },
-            React.createElement(AdaptableInput_1.default, { onChange: handleNameChange, value: props.chartDefinition.Name })),
-        React.createElement(FormLayout_1.FormRow, { label: "Unlink Chart" },
-            React.createElement(CheckBox_1.CheckBox, { onClick: handleUnLinkChange, checked: props.chartDefinition.Model.unlinkChart })),
-        React.createElement(FormLayout_1.FormRow, { label: "Suppress Chart Ranges" },
-            React.createElement(CheckBox_1.CheckBox, { onClick: handleSuppressChartRanges, checked: props.chartDefinition.Model.suppressChartRanges })),
-        props.chartDefinition.Model.modelType === 'range' && typeof aggFunc !== 'function' && (React.createElement(FormLayout_1.FormRow, { label: "Agg Func" },
-            React.createElement(DropdownButton_1.default, { columns: ['label'], items: aggFuncsOptions, onClear: handleAggFuncClear }, aggFunc ? aggFunc : 'Select ')))));
+    return (React.createElement(FormLayout, null,
+        React.createElement(FormRow, { label: "Name" },
+            React.createElement(AdaptableInput, { onChange: handleNameChange, value: props.chartDefinition.Name })),
+        React.createElement(FormRow, { label: "Unlink Chart" },
+            React.createElement(CheckBox, { onClick: handleUnLinkChange, checked: props.chartDefinition.Model.unlinkChart })),
+        React.createElement(FormRow, { label: "Suppress Chart Ranges" },
+            React.createElement(CheckBox, { onClick: handleSuppressChartRanges, checked: props.chartDefinition.Model.suppressChartRanges })),
+        props.chartDefinition.Model.modelType === 'range' && typeof aggFunc !== 'function' && (React.createElement(FormRow, { label: "Agg Func" },
+            React.createElement(DropdownButton, { columns: ['label'], items: aggFuncsOptions, onClear: handleAggFuncClear }, aggFunc ? aggFunc : 'Select ')))));
 };
-exports.SettingsSection = SettingsSection;

package/src/View/Charting/ChartingWizard/AgChargingWizard/index.js

@@ -1,4 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./AgChargingWizard"), exports);
+export * from './AgChargingWizard';

package/src/View/Charting/ChartingWizard/ChartingWizard.js

@@ -1,20 +1,16 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChartingWizard = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const ChartingState_1 = require("../../../PredefinedConfig/ChartingState");
-const AgChargingWizard_1 = require("./AgChargingWizard");
-const ExternalChartingWizard_1 = require("./ExternalChartingWizard");
-const ChartingWizard = (props) => {
-    const { data, configEntities } = props, other = tslib_1.__rest(props, ["data", "configEntities"]);
-    if ((0, ChartingState_1.isAgChartDefinition)(data)) {
+import { __rest } from "tslib";
+import * as React from 'react';
+import { isAgChartDefinition, } from '../../../PredefinedConfig/ChartingState';
+import { AgChargingWizard } from './AgChargingWizard';
+import { ExternalChartingWizard } from './ExternalChartingWizard';
+export const ChartingWizard = (props) => {
+    const { data, configEntities } = props, other = __rest(props, ["data", "configEntities"]);
+    if (isAgChartDefinition(data)) {
         const chartDef = data;
-        return (React.createElement(AgChargingWizard_1.AgChargingWizard, Object.assign({}, other, { data: chartDef })));
+        return (React.createElement(AgChargingWizard, Object.assign({}, other, { data: chartDef })));
     }
     else {
         const chartDef = data;
-        return (React.createElement(ExternalChartingWizard_1.ExternalChartingWizard, Object.assign({}, other, { data: chartDef })));
+        return (React.createElement(ExternalChartingWizard, Object.assign({}, other, { data: chartDef })));
     }
 };
-exports.ChartingWizard = ChartingWizard;

package/src/View/Charting/ChartingWizard/ExternalChartingWizard/ExternalChartingWizard.js

@@ -1,14 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ExternalChartingWizard = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const rebass_1 = require("rebass");
-const AdaptableContext_1 = require("../../../AdaptableContext");
-const OnePageAdaptableWizard_1 = require("../../../Wizard/OnePageAdaptableWizard");
-const SettingsSection_1 = require("./SettingsSection");
+import * as React from 'react';
+import { Box } from 'rebass';
+import { useAdaptable } from '../../../AdaptableContext';
+import { OnePageAdaptableWizard } from '../../../Wizard/OnePageAdaptableWizard';
+import { isSettingsValid, SettingsSection } from './SettingsSection';
 const PreviewChartSection = ({ chartDefinition }) => {
-    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    const adaptable = useAdaptable();
     const divRef = React.useRef(null);
     React.useEffect(() => {
         if (!divRef.current) {
@@ -25,9 +21,9 @@ const PreviewChartSection = ({ chartDefinition }) => {
     }, [divRef]);
     return React.createElement("div", { ref: divRef });
 };
-const ExternalChartingWizard = (props) => {
+export const ExternalChartingWizard = (props) => {
     var _a;
-    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    const adaptable = useAdaptable();
     const onPreviewChart = (_a = adaptable.api.optionsApi.getChartingOptions().externalChartingOptions) === null || _a === void 0 ? void 0 : _a.onPreviewChart;
     const [chartDefinition, setChartDefinition] = React.useState(() => {
         var _a, _b;
@@ -37,23 +33,22 @@ const ExternalChartingWizard = (props) => {
         adaptable.api.chartingApi.editExternalChartDefinition(chartDefinition);
         props.onFinishWizard(props.data);
     };
-    return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: chartDefinition, onHide: props.onCloseWizard, onFinish: handleFinish, sections: [
+    return (React.createElement(OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: chartDefinition, onHide: props.onCloseWizard, onFinish: handleFinish, sections: [
             {
                 title: 'Settings',
                 details: 'Chart Settings',
-                isValid: SettingsSection_1.isSettingsValid,
-                render: () => (React.createElement(rebass_1.Box, { padding: 2 },
-                    React.createElement(SettingsSection_1.SettingsSection, { chartDefinition: chartDefinition, onChange: setChartDefinition }))),
+                isValid: isSettingsValid,
+                render: () => (React.createElement(Box, { padding: 2 },
+                    React.createElement(SettingsSection, { chartDefinition: chartDefinition, onChange: setChartDefinition }))),
             },
             onPreviewChart
                 ? {
                     title: 'Preview Chart',
                     render: () => {
-                        return (React.createElement(rebass_1.Box, { padding: 2 },
+                        return (React.createElement(Box, { padding: 2 },
                             React.createElement(PreviewChartSection, { chartDefinition: chartDefinition })));
                     },
                 }
                 : null,
         ].filter(Boolean) }));
 };
-exports.ExternalChartingWizard = ExternalChartingWizard;

package/src/View/Charting/ChartingWizard/ExternalChartingWizard/SettingsSection.js

@@ -1,11 +1,7 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SettingsSection = exports.isSettingsValid = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const FormLayout_1 = tslib_1.__importStar(require("../../../../components/FormLayout"));
-const AdaptableInput_1 = tslib_1.__importDefault(require("../../../Components/AdaptableInput"));
-const isSettingsValid = (chartDefinition, api) => {
+import React from 'react';
+import FormLayout, { FormRow } from '../../../../components/FormLayout';
+import AdaptableInput from '../../../Components/AdaptableInput';
+export const isSettingsValid = (chartDefinition, api) => {
     if (!chartDefinition.Name) {
         return 'Name is mandatory';
     }
@@ -16,10 +12,8 @@ const isSettingsValid = (chartDefinition, api) => {
     }
     return true;
 };
-exports.isSettingsValid = isSettingsValid;
-const SettingsSection = (props) => {
-    return (react_1.default.createElement(FormLayout_1.default, null,
-        react_1.default.createElement(FormLayout_1.FormRow, { label: "Name" },
-            react_1.default.createElement(AdaptableInput_1.default, { value: props.chartDefinition.Name, onChange: (e) => props.onChange(Object.assign(Object.assign({}, props.chartDefinition), { Name: e.target.value })) }))));
+export const SettingsSection = (props) => {
+    return (React.createElement(FormLayout, null,
+        React.createElement(FormRow, { label: "Name" },
+            React.createElement(AdaptableInput, { value: props.chartDefinition.Name, onChange: (e) => props.onChange(Object.assign(Object.assign({}, props.chartDefinition), { Name: e.target.value })) }))));
 };
-exports.SettingsSection = SettingsSection;

package/src/View/Charting/ChartingWizard/ExternalChartingWizard/index.js

@@ -1,4 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./ExternalChartingWizard"), exports);
+export * from './ExternalChartingWizard';

package/src/View/Charting/ChartingWizard/index.js

@@ -1,4 +1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./ChartingWizard"), exports);
+export * from './ChartingWizard';

package/src/View/Charting/DeleteChartButton.js

@@ -1,14 +1,9 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DeleteChartButton = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
-const ButtonDelete_1 = require("../Components/Buttons/ButtonDelete");
-const ChartingRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/ChartingRedux"));
-const ChartingState_1 = require("../../PredefinedConfig/ChartingState");
-const DeleteChartButton = (props) => {
-    return (React.createElement(ButtonDelete_1.ButtonDelete, { iconSize: props.iconSize, disabled: !props.chart, ConfirmAction: (0, ChartingState_1.isAgChartDefinition)(props.chart)
+import * as React from 'react';
+import { ButtonDelete } from '../Components/Buttons/ButtonDelete';
+import * as ChartingRedux from '../../Redux/ActionsReducers/ChartingRedux';
+import { isAgChartDefinition } from '../../PredefinedConfig/ChartingState';
+export const DeleteChartButton = (props) => {
+    return (React.createElement(ButtonDelete, { iconSize: props.iconSize, disabled: !props.chart, ConfirmAction: isAgChartDefinition(props.chart)
             ? ChartingRedux.ChartingDeleteChart(props.chart)
             : ChartingRedux.ChartingDeleteExternalChart(props.chart), ConfirmationMsg: `Are you sure you want to delete this Charts?`, ConfirmationTitle: 'Delete Charts', accessLevel: props.accessLevel, tooltip: "Delete Chart" }));
 };
-exports.DeleteChartButton = DeleteChartButton;