@adaptabletools/adaptable 13.0.0-canary.12 → 13.0.0-canary.13

package/src/View/FormatColumn/Wizard/FormatColumnStyleWizardSection.js

@@ -4,347 +4,38 @@ exports.FormatColumnStyleWizardSection = exports.renderFormatColumnStyleSummary
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const rebass_1 = require("rebass");
-const HelpBlock_1 = tslib_1.__importDefault(require("../../../components/HelpBlock"));
-const CheckBox_1 = require("../../../components/CheckBox");
 const StyleHelper_1 = require("../../../Utilities/Helpers/StyleHelper");
 const StyleComponent_1 = require("../../Components/StyleComponent");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
-const Tabs_1 = require("../../../components/Tabs");
-const Radio_1 = tslib_1.__importDefault(require("../../../components/Radio"));
-const RangesComponent_1 = require("../../Components/RangesComponent");
-const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
-const ColorPicker_1 = require("../../ColorPicker");
-const UIHelper_1 = tslib_1.__importStar(require("../../UIHelper"));
-const StyleVisualItem_1 = require("../../Components/StyleVisualItem");
+const UIHelper_1 = tslib_1.__importDefault(require("../../UIHelper"));
 const isFormatColumnStyleValid = (data, api) => {
-    var _a, _b, _c, _d, _e;
-    if (!data.ColumnStyle &&
-        data.Style &&
+    if (data.Style &&
         UIHelper_1.default.IsEmptyStyle(data.Style) &&
         data.DisplayFormat === undefined &&
         data.CellAlignment === undefined &&
         !api.scopeApi.isSingleBooleanColumnScope(data.Scope)) {
         return 'No format applied';
     }
-    if ((_c = (_b = (_a = data.ColumnStyle) === null || _a === void 0 ? void 0 : _a.PercentBarStyle) === null || _b === void 0 ? void 0 : _b.CellRanges) === null || _c === void 0 ? void 0 : _c.length) {
-        if (data.ColumnStyle.PercentBarStyle.CellRanges.some((cellRange) => cellRange.Min == undefined || cellRange.Max == undefined)) {
-            return 'Invalid Cell Range';
-        }
-    }
-    if ((_e = (_d = data.ColumnStyle) === null || _d === void 0 ? void 0 : _d.PercentBarStyle) === null || _e === void 0 ? void 0 : _e.ColumnComparison) {
-        if (data.ColumnStyle.PercentBarStyle.ColumnComparison.MinValue == undefined ||
-            data.ColumnStyle.PercentBarStyle.ColumnComparison.MaxValue == undefined) {
-            return 'Invalid Column Comparison Range';
-        }
-    }
     return true;
 };
 exports.isFormatColumnStyleValid = isFormatColumnStyleValid;
 const toStyle = (style) => {
     return Object.assign(Object.assign({}, (0, StyleHelper_1.convertAdaptableStyleToCSS)(style !== null && style !== void 0 ? style : {})), { borderWidth: (style === null || style === void 0 ? void 0 : style.BorderColor) ? 2 : 0, borderStyle: 'solid' });
 };
-const getRanges = (ranges) => {
-    return ranges.map((r, i) => (React.createElement(rebass_1.Flex, { key: i, alignItems: "center", mr: 3 },
-        React.createElement(rebass_1.Box, { mr: 1 },
-            r.Min,
-            " to ",
-            r.Max,
-            ' '),
-        React.createElement(StyleVisualItem_1.StyleVisualItem, { Style: {
-                BackColor: r.Color,
-                ForeColor: r.Color,
-            } }))));
-};
-const getColumnComparison = (columnComparison, api) => {
-    return (React.createElement(rebass_1.Flex, { key: 'cc', alignItems: "center", mr: 3 },
-        React.createElement(rebass_1.Box, { mr: 1 },
-            "Min Value:",
-            ' ',
-            isNaN(Number(columnComparison.MinValue))
-                ? '[' + api.columnApi.getFriendlyNameFromColumnId(String(columnComparison.MinValue)) + ']'
-                : columnComparison.MinValue,
-            ' ',
-            ", Max Value:",
-            ' ',
-            isNaN(Number(columnComparison.MaxValue))
-                ? '[' + api.columnApi.getFriendlyNameFromColumnId(String(columnComparison.MaxValue)) + ']'
-                : columnComparison.MaxValue,
-            ' '),
-        React.createElement(StyleVisualItem_1.StyleVisualItem, { Style: {
-                BackColor: columnComparison.Color,
-                ForeColor: columnComparison.Color,
-            } })));
-};
 const renderFormatColumnStyleWizardSummary = (data) => {
     const { api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     return (0, exports.renderFormatColumnStyleSummary)(data, api);
 };
 exports.renderFormatColumnStyleWizardSummary = renderFormatColumnStyleWizardSummary;
 const renderFormatColumnStyleSummary = (data, api) => {
-    if (data.ColumnStyle) {
-        if (data.ColumnStyle.CheckBoxStyle) {
-            return 'Checkbox Style';
-        }
-        if (data.ColumnStyle.GradientStyle) {
-            if (data.ColumnStyle.GradientStyle.CellRanges) {
-                return getRanges(data.ColumnStyle.GradientStyle.CellRanges);
-            }
-            if (data.ColumnStyle.GradientStyle.ColumnComparison) {
-                return getColumnComparison(data.ColumnStyle.GradientStyle.ColumnComparison, api);
-            }
-        }
-        if (data.ColumnStyle.PercentBarStyle) {
-            if (data.ColumnStyle.PercentBarStyle.CellRanges) {
-                return getRanges(data.ColumnStyle.PercentBarStyle.CellRanges);
-            }
-            if (data.ColumnStyle.PercentBarStyle.ColumnComparison) {
-                return getColumnComparison(data.ColumnStyle.PercentBarStyle.ColumnComparison, api);
-            }
-        }
-        if (data.Style == null || UIHelper_1.default.IsEmptyStyle(data.Style)) {
-            return '[None]';
-        }
-        return React.createElement(StyleVisualItem_1.StyleVisualItem, { Style: data.Style });
-    }
     return (React.createElement(rebass_1.Text, { padding: 2, style: toStyle(data.Style) }, "Preview result"));
 };
 exports.renderFormatColumnStyleSummary = renderFormatColumnStyleSummary;
 function FormatColumnStyleWizardSection(props) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7;
+    var _a;
     const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    const singleNumericColumn = api.scopeApi.isSingleNumericColumnScope(data.Scope);
-    const minMaxRangeValues = React.useMemo(() => {
-        if (!singleNumericColumn) {
-            return null;
-        }
-        if (!('ColumnIds' in data.Scope)) {
-            return null;
-        }
-        const [columnId] = data.Scope.ColumnIds;
-        const column = api.columnApi.getColumnFromId(columnId);
-        return {
-            min: api.columnApi.getMinValueForNumericColumn(column),
-            max: api.columnApi.getMaxValueForNumericColumn(column),
-        };
-    }, [singleNumericColumn]);
-    const onlyBooleanColumnsInScope = api.scopeApi.areAllBooleanColumnsInScope(data.Scope) ||
-        api.scopeApi.scopeHasOnlyBooleanDataType(data.Scope);
-    const onPercentBarCellTextCellValueChanged = (checked) => {
-        var _a;
-        let percentBarStyle = (_a = data.ColumnStyle) === null || _a === void 0 ? void 0 : _a.PercentBarStyle;
-        if (checked) {
-            if (!percentBarStyle.CellText) {
-                percentBarStyle.CellText = ['CellValue'];
-            }
-            else {
-                percentBarStyle.CellText.push('CellValue');
-            }
-        }
-        else {
-            if (percentBarStyle.CellText && percentBarStyle.CellText.includes('PercentageValue')) {
-                percentBarStyle.CellText = ['PercentageValue'];
-            }
-            else {
-                percentBarStyle.CellText = [];
-            }
-        }
-        props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle: {
-                PercentBarStyle: percentBarStyle,
-            } }));
-    };
-    const onPercentBarCellTextPercentValueChanged = (checked) => {
-        var _a;
-        let percentBarStyle = (_a = data.ColumnStyle) === null || _a === void 0 ? void 0 : _a.PercentBarStyle;
-        if (checked) {
-            if (!percentBarStyle.CellText) {
-                percentBarStyle.CellText = ['PercentageValue'];
-            }
-            else {
-                percentBarStyle.CellText.push('PercentageValue');
-            }
-        }
-        else {
-            if (percentBarStyle.CellText && percentBarStyle.CellText.includes('CellValue')) {
-                percentBarStyle.CellText = ['CellValue'];
-            }
-            else {
-                percentBarStyle.CellText = [];
-            }
-        }
-        props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle: {
-                PercentBarStyle: percentBarStyle,
-            } }));
-    };
-    const onPercentBarToolTipTextCellValueChanged = (checked) => {
-        var _a;
-        let percentBarStyle = (_a = data.ColumnStyle) === null || _a === void 0 ? void 0 : _a.PercentBarStyle;
-        if (checked) {
-            if (!percentBarStyle.ToolTipText) {
-                percentBarStyle.ToolTipText = ['CellValue'];
-            }
-            else {
-                percentBarStyle.ToolTipText.push('CellValue');
-            }
-        }
-        else {
-            if (percentBarStyle.ToolTipText && percentBarStyle.ToolTipText.includes('PercentageValue')) {
-                percentBarStyle.ToolTipText = ['PercentageValue'];
-            }
-            else {
-                percentBarStyle.ToolTipText = [];
-            }
-        }
-        props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle: {
-                PercentBarStyle: percentBarStyle,
-            } }));
-    };
-    const onPercentBarToolTipTextPercentValueChanged = (checked) => {
-        var _a;
-        let percentBarStyle = (_a = data.ColumnStyle) === null || _a === void 0 ? void 0 : _a.PercentBarStyle;
-        if (checked) {
-            if (!percentBarStyle.ToolTipText) {
-                percentBarStyle.ToolTipText = ['PercentageValue'];
-            }
-            else {
-                percentBarStyle.ToolTipText.push('PercentageValue');
-            }
-        }
-        else {
-            if (percentBarStyle.ToolTipText && percentBarStyle.ToolTipText.includes('CellValue')) {
-                percentBarStyle.ToolTipText = ['CellValue'];
-            }
-            else {
-                percentBarStyle.ToolTipText = [];
-            }
-        }
-        props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle: {
-                PercentBarStyle: percentBarStyle,
-            } }));
-    };
-    const onUpdatePercentBarStyleColumnComparison = (columnComparison) => {
-        let ColumnStyle = {
-            PercentBarStyle: {
-                ColumnComparison: columnComparison,
-            },
-        };
-        props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle }));
-    };
-    const onUsePercentStyleColorCheckChanged = (checked) => {
-        var _a;
-        let percentBarStyle = (_a = data.ColumnStyle) === null || _a === void 0 ? void 0 : _a.PercentBarStyle;
-        percentBarStyle.BackColor = checked ? (0, UIHelper_1.getHexForName)(UIHelper_1.GRAY) : null;
-        props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle: {
-                PercentBarStyle: percentBarStyle,
-            } }));
-    };
-    const onForeColorSelectChange = (color) => {
-        var _a;
-        let percentBarStyle = (_a = data.ColumnStyle) === null || _a === void 0 ? void 0 : _a.PercentBarStyle;
-        percentBarStyle.BackColor = color;
-        props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle: {
-                PercentBarStyle: percentBarStyle,
-            } }));
-    };
-    const onUpdatePercentBarStyleRanges = (ranges) => {
-        let ColumnStyle = {
-            PercentBarStyle: {
-                CellRanges: ranges,
-            },
-        };
-        props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle }));
-    };
-    const onUpdateGradientStyleRanges = (ranges) => {
-        let ColumnStyle = {
-            GradientStyle: {
-                CellRanges: ranges,
-            },
-        };
-        props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle }));
-    };
-    const onUpdateGradientStyleColumnComparison = (columnComparison) => {
-        let ColumnStyle = {
-            GradientStyle: {
-                ColumnComparison: columnComparison,
-            },
-        };
-        props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle }));
-    };
-    const onStyleTypeChanged = (event) => {
-        let e = event.target;
-        if (e.value == 'Gradient') {
-            props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle: {
-                    GradientStyle: {
-                        CellRanges: api.scopeApi.createCellColorRangesForScope(data.Scope),
-                    },
-                } }));
-        }
-        else if (e.value == 'PercentBar') {
-            props.onChange(Object.assign(Object.assign({}, data), { ColumnStyle: {
-                    PercentBarStyle: {
-                        CellRanges: api.scopeApi.createCellColorRangesForScope(data.Scope),
-                    },
-                } }));
-        }
-        else if (e.value == 'None') {
-            const newData = Object.assign({}, data);
-            delete newData.ColumnStyle;
-            props.onChange(newData);
-        }
-    };
-    const onlyStandardStyleAvailable = Boolean(data.Rule);
-    return (React.createElement(React.Fragment, null,
-        onlyBooleanColumnsInScope && (React.createElement(Tabs_1.Tabs, null,
-            React.createElement(Tabs_1.Tabs.Tab, null, "CheckBox Column"),
-            React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(HelpBlock_1.default, { fontSize: 2 }, "Shows each cell in the Column as a Checkbox"),
-                ' ',
-                React.createElement(CheckBox_1.CheckBox, { marginLeft: 2, checked: !!((_a = data.ColumnStyle) === null || _a === void 0 ? void 0 : _a.CheckBoxStyle), onChange: (CheckBoxStyle) => {
-                        const formatColumn = Object.assign(Object.assign({}, data), { ColumnStyle: {
-                                CheckBoxStyle,
-                            } });
-                        if (!CheckBoxStyle) {
-                            delete formatColumn.ColumnStyle;
-                        }
-                        props.onChange(formatColumn);
-                    } }, "Display Column As CheckBox")))),
-        singleNumericColumn && !onlyStandardStyleAvailable ? (React.createElement(React.Fragment, null,
-            React.createElement(Tabs_1.Tabs, null,
-                React.createElement(Tabs_1.Tabs.Tab, null, "Create a Format Column Style"),
-                React.createElement(Tabs_1.Tabs.Content, null,
-                    React.createElement(rebass_1.Flex, { flexDirection: "row" },
-                        React.createElement(Radio_1.default, { marginLeft: 2, value: "None", checked: !data.ColumnStyle, onChange: (checked, e) => onStyleTypeChanged(e) }, "Standard"),
-                        ' ',
-                        React.createElement(Radio_1.default, { marginLeft: 3, value: "Gradient", checked: !!((_b = data.ColumnStyle) === null || _b === void 0 ? void 0 : _b.GradientStyle), onChange: (checked, e) => onStyleTypeChanged(e) }, "Gradient"),
-                        ' ',
-                        React.createElement(Radio_1.default, { marginLeft: 3, value: "PercentBar", checked: !!((_c = data.ColumnStyle) === null || _c === void 0 ? void 0 : _c.PercentBarStyle), onChange: (checked, e) => onStyleTypeChanged(e) },
-                            "Percent Bar",
-                            ' '),
-                        ' '))),
-            ((_d = data.ColumnStyle) === null || _d === void 0 ? void 0 : _d.GradientStyle) && (React.createElement(RangesComponent_1.RangesComponent, { minMaxRangeValues: minMaxRangeValues, api: api, scope: data === null || data === void 0 ? void 0 : data.Scope, showRangeDirection: true, ranges: (_f = (_e = data.ColumnStyle) === null || _e === void 0 ? void 0 : _e.GradientStyle) === null || _f === void 0 ? void 0 : _f.CellRanges, columnComparison: (_h = (_g = data === null || data === void 0 ? void 0 : data.ColumnStyle) === null || _g === void 0 ? void 0 : _g.GradientStyle) === null || _h === void 0 ? void 0 : _h.ColumnComparison, updateRanges: (ranges) => onUpdateGradientStyleRanges(ranges), updateColumnComparison: (columnComparison) => onUpdateGradientStyleColumnComparison(columnComparison) })),
-            ((_j = data.ColumnStyle) === null || _j === void 0 ? void 0 : _j.PercentBarStyle) && (React.createElement(React.Fragment, null,
-                React.createElement(RangesComponent_1.RangesComponent, { minMaxRangeValues: minMaxRangeValues, api: api, scope: data === null || data === void 0 ? void 0 : data.Scope, showRangeDirection: false, ranges: (_l = (_k = data.ColumnStyle) === null || _k === void 0 ? void 0 : _k.PercentBarStyle) === null || _l === void 0 ? void 0 : _l.CellRanges, columnComparison: (_o = (_m = data === null || data === void 0 ? void 0 : data.ColumnStyle) === null || _m === void 0 ? void 0 : _m.PercentBarStyle) === null || _o === void 0 ? void 0 : _o.ColumnComparison, updateRanges: (ranges) => onUpdatePercentBarStyleRanges(ranges), updateColumnComparison: (columnComparison) => onUpdatePercentBarStyleColumnComparison(columnComparison) }),
-                React.createElement(FormLayout_1.default, { marginLeft: 2, marginTop: 2 },
-                    React.createElement(FormLayout_1.FormRow, { label: "Cell Display:" },
-                        React.createElement(CheckBox_1.CheckBox, { marginLeft: 2, checked: (_r = (_q = (_p = data.ColumnStyle) === null || _p === void 0 ? void 0 : _p.PercentBarStyle) === null || _q === void 0 ? void 0 : _q.CellText) === null || _r === void 0 ? void 0 : _r.includes('CellValue'), onChange: (checked) => onPercentBarCellTextCellValueChanged(checked) }, "Cell Value"),
-                        ' ',
-                        React.createElement(CheckBox_1.CheckBox, { marginLeft: 3, checked: (_u = (_t = (_s = data.ColumnStyle) === null || _s === void 0 ? void 0 : _s.PercentBarStyle) === null || _t === void 0 ? void 0 : _t.CellText) === null || _u === void 0 ? void 0 : _u.includes('PercentageValue'), onChange: (checked) => onPercentBarCellTextPercentValueChanged(checked) },
-                            "Percent Value",
-                            ' '),
-                        ' '),
-                    React.createElement(FormLayout_1.FormRow, { label: "ToolTip Display:" },
-                        React.createElement(CheckBox_1.CheckBox, { marginLeft: 2, checked: (_x = (_w = (_v = data.ColumnStyle) === null || _v === void 0 ? void 0 : _v.PercentBarStyle) === null || _w === void 0 ? void 0 : _w.ToolTipText) === null || _x === void 0 ? void 0 : _x.includes('CellValue'), onChange: (checked) => onPercentBarToolTipTextCellValueChanged(checked) }, "Cell Value"),
-                        ' ',
-                        React.createElement(CheckBox_1.CheckBox, { marginLeft: 3, checked: (_0 = (_z = (_y = data.ColumnStyle) === null || _y === void 0 ? void 0 : _y.PercentBarStyle) === null || _z === void 0 ? void 0 : _z.ToolTipText) === null || _0 === void 0 ? void 0 : _0.includes('PercentageValue'), onChange: (checked) => onPercentBarToolTipTextPercentValueChanged(checked) },
-                            "Percent Value",
-                            ' '),
-                        ' '),
-                    React.createElement(FormLayout_1.FormRow, { label: `Back ${api.internalApi.getCorrectEnglishVariant('Colour')}` },
-                        React.createElement(rebass_1.Flex, { alignItems: "center", marginLeft: 2 },
-                            React.createElement(CheckBox_1.CheckBox, { checked: !!((_2 = (_1 = data.ColumnStyle) === null || _1 === void 0 ? void 0 : _1.PercentBarStyle) === null || _2 === void 0 ? void 0 : _2.BackColor), onChange: (checked) => onUsePercentStyleColorCheckChanged(checked), mr: 2 }),
-                            ((_4 = (_3 = data.ColumnStyle) === null || _3 === void 0 ? void 0 : _3.PercentBarStyle) === null || _4 === void 0 ? void 0 : _4.BackColor) !== undefined && (React.createElement(ColorPicker_1.ColorPicker, { api: api, value: (_6 = (_5 = data.ColumnStyle) === null || _5 === void 0 ? void 0 : _5.PercentBarStyle) === null || _6 === void 0 ? void 0 : _6.BackColor, onChange: (x) => onForeColorSelectChange(x) }))))),
-                React.createElement(rebass_1.Flex, { flexDirection: "row", padding: 2 }))))) : null,
-        !data.ColumnStyle ? (React.createElement(StyleComponent_1.StyleComponent, { headless: true, api: api, Style: (_7 = data.Style) !== null && _7 !== void 0 ? _7 : {}, UpdateStyle: (Style) => {
-                props.onChange(Object.assign(Object.assign({}, data), { Style }));
-            } })) : null));
+    return (React.createElement(React.Fragment, null, !data.ColumnStyle ? (React.createElement(StyleComponent_1.StyleComponent, { headless: true, api: api, Style: (_a = data.Style) !== null && _a !== void 0 ? _a : {}, UpdateStyle: (Style) => {
+            props.onChange(Object.assign(Object.assign({}, data), { Style }));
+        } })) : null));
 }
 exports.FormatColumnStyleWizardSection = FormatColumnStyleWizardSection;

package/src/View/Layout/LayoutViewPanel.d.ts

@@ -15,5 +15,5 @@ declare class LayoutViewPanelComponent extends React.Component<LayoutViewPanelCo
     render(): any;
     private onSaveLayout;
 }
-export declare let LayoutViewPanelControl: import("react-redux").ConnectedComponent<typeof LayoutViewPanelComponent, import("react-redux").Omit<React.ClassAttributes<LayoutViewPanelComponent> & LayoutViewPanelComponentProps, "api" | "Layouts" | "moduleInfo" | "accessLevel" | "viewType" | "onSelectLayout" | "onSaveLayout" | "CurrentDraftLayout" | "CanSave" | "CurrentLayoutName"> & LayoutViewPanelComponentProps>;
+export declare let LayoutViewPanelControl: import("react-redux").ConnectedComponent<typeof LayoutViewPanelComponent, import("react-redux").Omit<React.ClassAttributes<LayoutViewPanelComponent> & LayoutViewPanelComponentProps, "api" | "accessLevel" | "moduleInfo" | "Layouts" | "viewType" | "onSelectLayout" | "onSaveLayout" | "CurrentDraftLayout" | "CanSave" | "CurrentLayoutName"> & LayoutViewPanelComponentProps>;
 export {};

package/src/View/Query/QueryViewPanel.d.ts

@@ -26,5 +26,5 @@ declare class QueryViewPanelComponent extends React.Component<QueryViewPanelComp
     onSelectedQueryChanged(queryName: string): void;
     runQuery(expression?: string): void;
 }
-export declare let QueryViewPanelControl: import("react-redux").ConnectedComponent<typeof QueryViewPanelComponent, import("react-redux").Omit<React.ClassAttributes<QueryViewPanelComponent> & QueryViewPanelComponentProps, "api" | "NamedQueries" | "CurrentQuery" | "moduleInfo" | "accessLevel" | "CachedQueries" | "viewType" | "onAddCachedQuery" | "onRunQuery" | "onShowNamedQueries">>;
+export declare let QueryViewPanelControl: import("react-redux").ConnectedComponent<typeof QueryViewPanelComponent, import("react-redux").Omit<React.ClassAttributes<QueryViewPanelComponent> & QueryViewPanelComponentProps, "api" | "accessLevel" | "NamedQueries" | "CurrentQuery" | "moduleInfo" | "CachedQueries" | "viewType" | "onAddCachedQuery" | "onRunQuery" | "onShowNamedQueries">>;
 export {};

package/src/View/QuickSearch/QuickSearchViewPanel.d.ts

@@ -5,4 +5,4 @@ export interface QuickSearchViewPanelComponentProps extends ViewPanelProps {
     onRunQuickSearch: (quickSearchText: string) => QuickSearchRedux.QuickSearchRunAction;
     QuickSearchText: string;
 }
-export declare const QuickSearchViewPanelControl: import("react-redux").ConnectedComponent<(props: QuickSearchViewPanelComponentProps) => JSX.Element, import("react-redux").Omit<QuickSearchViewPanelComponentProps, "api" | "QuickSearchText" | "moduleInfo" | "accessLevel" | "onRunQuickSearch" | "viewType">>;
+export declare const QuickSearchViewPanelControl: import("react-redux").ConnectedComponent<(props: QuickSearchViewPanelComponentProps) => JSX.Element, import("react-redux").Omit<QuickSearchViewPanelComponentProps, "api" | "accessLevel" | "moduleInfo" | "QuickSearchText" | "onRunQuickSearch" | "viewType">>;

package/src/View/StyledColumn/Wizard/StyledColumnWizard.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { AdaptableOnePageWizardProps } from '../../Wizard/Interface/IAdaptableWizard';
+import { StyledColumn } from '../../../PredefinedConfig/StyledColumnState';
+export interface StyledColumnWizardProps extends AdaptableOnePageWizardProps<StyledColumn> {
+    isNew: boolean;
+}
+export declare const StyledColumnWizard: (props: StyledColumnWizardProps) => JSX.Element;

package/src/View/StyledColumn/Wizard/StyledColumnWizard.js

@@ -0,0 +1,77 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledColumnWizard = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_1 = require("react");
+const rebass_1 = require("rebass");
+const react_redux_1 = require("react-redux");
+const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
+const ObjectFactory_1 = tslib_1.__importDefault(require("../../../Utilities/ObjectFactory"));
+const StyledColumnRedux = tslib_1.__importStar(require("../../../Redux/ActionsReducers/StyledColumnRedux"));
+const StyledColumnWizardTypeSection_1 = require("./StyledColumnWizardTypeSection");
+const StyledColumnWizardColumnSection_1 = require("./StyledColumnWizardColumnSection");
+const StyledColumnWizardStyleSection_1 = require("./StyledColumnWizardStyleSection");
+const Helper_1 = require("../../../Utilities/Helpers/Helper");
+const StyledColumnWizard = (props) => {
+    var _a;
+    const data = (_a = props.data) !== null && _a !== void 0 ? _a : props.popupParams.value;
+    const [styledColumn, setStyledColumn] = (0, react_1.useState)(() => {
+        if (data) {
+            return (0, Helper_1.cloneObject)(data);
+        }
+        const newData = ObjectFactory_1.default.CreateEmptyStyledColumn();
+        newData.GradientStyle = {};
+        return newData;
+    });
+    const dispatch = (0, react_redux_1.useDispatch)();
+    const handleFinish = () => {
+        if (data) {
+            dispatch(StyledColumnRedux.StyledColumnEdit(styledColumn));
+        }
+        else {
+            dispatch(StyledColumnRedux.StyledColumnAdd(styledColumn));
+        }
+        props.onFinishWizard(styledColumn);
+    };
+    return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: styledColumn, onFinish: handleFinish, onHide: props.onCloseWizard, sections: [
+            {
+                details: 'Select a Styled Column Type',
+                renderSummary: StyledColumnWizardTypeSection_1.renderStyledColumnTypeSummary,
+                render: () => {
+                    return (React.createElement(rebass_1.Box, { padding: 2 },
+                        React.createElement(StyledColumnWizardTypeSection_1.StyledColumnWizardTypeSection, { onChange: setStyledColumn })));
+                },
+                title: 'Type',
+            },
+            {
+                isValid: StyledColumnWizardColumnSection_1.isValidStyledColumnColumn,
+                renderSummary: StyledColumnWizardColumnSection_1.renderStyledColumnColumnSummary,
+                details: 'Select column to apply the style to',
+                render: () => {
+                    return (React.createElement(rebass_1.Box, { padding: 2, style: { height: '100%' } },
+                        React.createElement(StyledColumnWizardColumnSection_1.StyledColumnWizardColumnSection, { isNew: props.isNew, onChange: setStyledColumn })));
+                },
+                title: 'Column',
+            },
+            {
+                details: 'Select the style to apply',
+                renderSummary: StyledColumnWizardStyleSection_1.renderStyledColumnStyleSummary,
+                render: () => {
+                    return (React.createElement(rebass_1.Box, { padding: 2 },
+                        React.createElement(StyledColumnWizardStyleSection_1.StyledColumnWizardStyleSection, { onChange: setStyledColumn })));
+                },
+                title: 'Style',
+            },
+            '-',
+            {
+                title: 'Summary',
+                details: 'Review your Styled Column',
+                render: () => {
+                    return (React.createElement(rebass_1.Box, { padding: 2 },
+                        React.createElement(OnePageAdaptableWizard_1.OnePageWizardSummary, null)));
+                },
+            },
+        ] }));
+};
+exports.StyledColumnWizard = StyledColumnWizard;

package/src/View/StyledColumn/Wizard/StyledColumnWizardColumnSection.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { StyledColumn } from '../../../PredefinedConfig/StyledColumnState';
+export declare const renderStyledColumnColumnSummary: (data: StyledColumn) => JSX.Element;
+export declare const isValidStyledColumnColumn: (data: StyledColumn) => true | string;
+export declare type StyledColumnWizardColumnSectionProps = {
+    onChange: (data: StyledColumn) => void;
+    isNew: boolean;
+};
+export declare const StyledColumnWizardColumnSection: (props: StyledColumnWizardColumnSectionProps) => JSX.Element;

package/src/View/StyledColumn/Wizard/StyledColumnWizardColumnSection.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StyledColumnWizardColumnSection = exports.isValidStyledColumnColumn = exports.renderStyledColumnColumnSummary = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const rebass_1 = require("rebass");
+const Tabs_1 = require("../../../components/Tabs");
+const Tag_1 = require("../../../components/Tag");
+const ColumnSelector_1 = require("../../Components/ColumnSelector");
+const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
+const renderStyledColumnColumnSummary = (data) => {
+    const { api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    return (React.createElement(rebass_1.Text, { pr: 2, py: 2 },
+        "Styled Column column:",
+        ' ',
+        React.createElement(Tag_1.Tag, null, data.ColumnId
+            ? api.columnApi.getFriendlyNameFromColumnId(data.ColumnId)
+            : 'No Column Selected')));
+};
+exports.renderStyledColumnColumnSummary = renderStyledColumnColumnSummary;
+const isValidStyledColumnColumn = (data) => {
+    if (!data.ColumnId) {
+        return 'You have to select a Column for Styled Column';
+    }
+    return true;
+};
+exports.isValidStyledColumnColumn = isValidStyledColumnColumn;
+const StyledColumnWizardColumnSection = (props) => {
+    const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const sortableCols = React.useMemo(() => {
+        const sortableColumns = data.CheckBoxStyle
+            ? api.columnApi.getBooleanColumns()
+            : api.columnApi.getNumericColumns();
+        const styledColumns = api.styledColumnApi.getAllStyledColumn();
+        const usedColumnIds = styledColumns.map((StyledColumn) => StyledColumn.ColumnId);
+        // filter out used colum ids, but include the current one
+        return sortableColumns.filter((column) => {
+            if (!props.isNew && column.columnId === (data === null || data === void 0 ? void 0 : data.ColumnId)) {
+                return true;
+            }
+            return usedColumnIds.every((usedColumnId) => {
+                return column.columnId !== usedColumnId;
+            });
+        });
+    }, []);
+    const handleColumnsChange = (columnIds) => {
+        const columnId = columnIds[0];
+        const emptyRanges = api.scopeApi.createCellColorRangesForScope({
+            ColumnIds: [columnId], // TODO: refactor to not use scope
+        });
+        const newStyledColumn = Object.assign(Object.assign({}, data), { ColumnId: columnId });
+        if (newStyledColumn.PercentBarStyle) {
+            newStyledColumn.PercentBarStyle = Object.assign(Object.assign({}, newStyledColumn.PercentBarStyle), { CellRanges: emptyRanges });
+        }
+        if (newStyledColumn.GradientStyle) {
+            newStyledColumn.GradientStyle = Object.assign(Object.assign({}, newStyledColumn.GradientStyle), { CellRanges: emptyRanges });
+        }
+        props.onChange(newStyledColumn);
+    };
+    return (React.createElement(Tabs_1.Tabs, { style: { height: '100%' } },
+        React.createElement(Tabs_1.Tabs.Tab, null, "Column"),
+        React.createElement(Tabs_1.Tabs.Content, null,
+            React.createElement(ColumnSelector_1.NewColumnSelector, { availableColumns: sortableCols, selected: data.ColumnId ? [data.ColumnId] : [], singleSelect: true, onChange: handleColumnsChange, allowReorder: false }))));
+};
+exports.StyledColumnWizardColumnSection = StyledColumnWizardColumnSection;

package/src/View/StyledColumn/Wizard/StyledColumnWizardStyleSection.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { StyledColumn } from '../../../PredefinedConfig/StyledColumnState';
+import { AdaptableApi } from '../../../types';
+export declare const renderFormatColumnStyleWizardSummary: (data: StyledColumn) => JSX.Element;
+export declare const renderStyledColumnStyleSummary: (data: StyledColumn, api: AdaptableApi) => JSX.Element;
+export interface StyledColumnWizardStyleSectionProps {
+    onChange: (styledColumn: StyledColumn) => void;
+}
+export declare const StyledColumnWizardStyleSection: React.FunctionComponent<StyledColumnWizardStyleSectionProps>;