@adaptabletools/adaptable-cjs 22.1.1 → 23.0.0-canary.1

package/src/View/Layout/Wizard/sections/RowSelectionSection.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RowSelectionSection = exports.RowSelectionSectionSummary = void 0;
 const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const CheckBox_1 = require("../../../../components/CheckBox");
 const Radio_1 = tslib_1.__importStar(require("../../../../components/Radio"));
 const Radio_2 = require("../../../../components/Radio");
@@ -17,36 +17,13 @@ const GeneralConstants_1 = require("../../../../Utilities/Constants/GeneralConst
 const RowSelectionSectionSummary = () => {
     const { data: layout } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     if (layout.RowSelection === false) {
-        return (React.createElement(Flex_1.Box, null,
-            React.createElement(Tag_1.Tag, null, "Row Selection Disabled")));
+        return ((0, jsx_runtime_1.jsx)(Flex_1.Box, { children: (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: "Row Selection Disabled" }) }));
     }
     if (!layout.RowSelection) {
-        return (React.createElement(Flex_1.Box, null,
-            React.createElement(Tag_1.Tag, null, "Default (from Grid Options)")));
+        return ((0, jsx_runtime_1.jsx)(Flex_1.Box, { children: (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: "Default (from Grid Options)" }) }));
     }
     const rs = layout.RowSelection;
-    return (React.createElement(Flex_1.Box, null,
-        React.createElement(Tag_1.Tag, { className: "twa:mr-2" },
-            "Mode: ",
-            rs.Mode === 'multiRow' ? 'Multi Row' : 'Single Row'),
-        rs.Checkboxes != null && (React.createElement(Tag_1.Tag, { className: "twa:mr-2" },
-            "Checkboxes: ",
-            rs.Checkboxes ? 'Yes' : 'No')),
-        rs.HeaderCheckbox != null && (React.createElement(Tag_1.Tag, { className: "twa:mr-2" },
-            "Header Checkbox: ",
-            rs.HeaderCheckbox ? 'Yes' : 'No')),
-        rs.EnableClickSelection != null && (React.createElement(Tag_1.Tag, { className: "twa:mr-2" },
-            "Click Selection: ",
-            String(rs.EnableClickSelection))),
-        rs.CheckboxInGroupColumn != null && (React.createElement(Tag_1.Tag, { className: "twa:mr-2" },
-            "Checkbox Location: ",
-            rs.CheckboxInGroupColumn ? 'Group Column' : 'Selection Column')),
-        rs.GroupSelectMode != null && (React.createElement(Tag_1.Tag, { className: "twa:mr-2" },
-            "Group Select Mode: ",
-            rs.GroupSelectMode)),
-        rs.SelectAllMode != null && (React.createElement(Tag_1.Tag, { className: "twa:mr-2" },
-            "Select All Mode: ",
-            rs.SelectAllMode))));
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Box, { children: [(0, jsx_runtime_1.jsxs)(Tag_1.Tag, { className: "twa:mr-2", children: ["Mode: ", rs.Mode === 'multiRow' ? 'Multi Row' : 'Single Row'] }), rs.Checkboxes != null && ((0, jsx_runtime_1.jsxs)(Tag_1.Tag, { className: "twa:mr-2", children: ["Checkboxes: ", rs.Checkboxes ? 'Yes' : 'No'] })), rs.HeaderCheckbox != null && ((0, jsx_runtime_1.jsxs)(Tag_1.Tag, { className: "twa:mr-2", children: ["Header Checkbox: ", rs.HeaderCheckbox ? 'Yes' : 'No'] })), rs.EnableClickSelection != null && ((0, jsx_runtime_1.jsxs)(Tag_1.Tag, { className: "twa:mr-2", children: ["Click Selection: ", String(rs.EnableClickSelection)] })), rs.CheckboxInGroupColumn != null && ((0, jsx_runtime_1.jsxs)(Tag_1.Tag, { className: "twa:mr-2", children: ["Checkbox Location: ", rs.CheckboxInGroupColumn ? 'Group Column' : 'Selection Column'] })), rs.GroupSelectMode != null && ((0, jsx_runtime_1.jsxs)(Tag_1.Tag, { className: "twa:mr-2", children: ["Group Select Mode: ", rs.GroupSelectMode] })), rs.SelectAllMode != null && ((0, jsx_runtime_1.jsxs)(Tag_1.Tag, { className: "twa:mr-2", children: ["Select All Mode: ", rs.SelectAllMode] }))] }));
 };
 exports.RowSelectionSectionSummary = RowSelectionSectionSummary;
 function getMode(layout) {
@@ -97,50 +74,6 @@ const RowSelectionSection = (props) => {
         }
         props.onChange(newLayout);
     };
-    return (React.createElement(React.Fragment, null,
-        React.createElement(Tabs_1.Tabs, null,
-            React.createElement(Tabs_1.Tabs.Tab, null, "Row Selection Mode"),
-            React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(Flex_1.Flex, { flexDirection: "column" },
-                    React.createElement(Radio_2.RadioGroup, { orientation: "horizontal", variant: "text-only", className: (0, twMerge_1.twMerge)(Radio_1.radioGroupStyling.horizontalTextOnly, 'twa:gap-2 twa:max-w-[500px] twa:bg-defaultbackground twa:p-2'), value: mode, name: "rowSelectionMode", onRadioChange: handleModeChange },
-                        React.createElement(Radio_1.default, { value: false }, "Disabled"),
-                        React.createElement(Radio_1.default, { value: "singleRow" }, "Single Row"),
-                        React.createElement(Radio_1.default, { value: "multiRow" }, "Multi Row"))))),
-        !rowSelection && React.createElement(HelpBlock_1.default, null, "There is no Row Selection configured for this Layout"),
-        rowSelection && (React.createElement(React.Fragment, null,
-            React.createElement(Tabs_1.Tabs, { className: "twa:mt-2" },
-                React.createElement(Tabs_1.Tabs.Tab, null, "Row Selection Column Checkboxes"),
-                React.createElement(Tabs_1.Tabs.Content, null,
-                    React.createElement(Flex_1.Flex, { flexDirection: "row", className: "twa:gap-6" },
-                        React.createElement(CheckBox_1.CheckBox, { className: "twa:flex-1", checked: rowSelection.Checkboxes ?? true, onChange: (checked) => updateRowSelection({ Checkboxes: checked }) }, "Checkboxes in Column Cells"),
-                        mode === 'multiRow' && (React.createElement(CheckBox_1.CheckBox, { className: "twa:flex-1", checked: rowSelection.HeaderCheckbox ?? true, onChange: (checked) => updateRowSelection({ HeaderCheckbox: checked }) }, "Checkbox in Column Header (to enable Select All)"))))),
-            (rowSelection.Checkboxes ?? true) && (React.createElement(Tabs_1.Tabs, { className: "twa:mt-2" },
-                React.createElement(Tabs_1.Tabs.Tab, null, "Row Grouping Selection Checkboxes"),
-                React.createElement(Tabs_1.Tabs.Content, null,
-                    React.createElement(Radio_2.RadioGroup, { orientation: "vertical", value: rowSelection.CheckboxInGroupColumn ?? false, name: "checkboxLocation", onRadioChange: (value) => updateRowSelection({ CheckboxInGroupColumn: value }) },
-                        React.createElement(Radio_1.default, { value: false }, "Display in dedicated Selection Column"),
-                        React.createElement(Radio_1.default, { value: true }, "Display in Row Grouped Column"))))),
-            React.createElement(Tabs_1.Tabs, { className: "twa:mt-2" },
-                React.createElement(Tabs_1.Tabs.Tab, null, "Row Click Selection (when user clicks on Row outside of Selection Checkbox)"),
-                React.createElement(Tabs_1.Tabs.Content, null,
-                    React.createElement(Radio_2.RadioGroup, { orientation: "vertical", value: rowSelection.EnableClickSelection ?? false, name: "clickSelection", onRadioChange: (value) => updateRowSelection({ EnableClickSelection: value }) },
-                        React.createElement(Radio_1.default, { value: false }, "Disabled (Cannot select or deselect by clicking in Row)"),
-                        React.createElement(Radio_1.default, { value: true }, "Full (Enable selection by clicking in Row and deselection by Ctrl+clicking in Row)"),
-                        React.createElement(Radio_1.default, { value: 'enableSelection' }, "Selection Only (Enable selection by clicking in Row)"),
-                        React.createElement(Radio_1.default, { value: 'enableDeselection' }, "Deselection Only (Enable deselection by Ctrl+clicking in Row)")))),
-            mode === 'multiRow' && !isPivot && (React.createElement(Tabs_1.Tabs, { className: "twa:mt-2" },
-                React.createElement(Tabs_1.Tabs.Tab, null, "Grouped Row Selection Behaviour"),
-                React.createElement(Tabs_1.Tabs.Content, null,
-                    React.createElement(Radio_2.RadioGroup, { orientation: "vertical", value: rowSelection.GroupSelectMode ?? 'self', name: "groupSelectMode", onRadioChange: (value) => updateRowSelection({ GroupSelectMode: value }) },
-                        React.createElement(Radio_1.default, { value: 'self' }, "Select Grouped Row Only (no cascade)"),
-                        React.createElement(Radio_1.default, { value: 'descendants' }, "Select Grouped Row and all descendants"),
-                        React.createElement(Radio_1.default, { value: 'filteredDescendants' }, "Select Grouped Row and only filtered descendants"))))),
-            mode === 'multiRow' && (React.createElement(Tabs_1.Tabs, { className: "twa:mt-2" },
-                React.createElement(Tabs_1.Tabs.Tab, null, "Select All (in Header) Behaviour"),
-                React.createElement(Tabs_1.Tabs.Content, null,
-                    React.createElement(Radio_2.RadioGroup, { orientation: "vertical", value: rowSelection.SelectAllMode ?? 'all', name: "selectAllMode", onRadioChange: (value) => updateRowSelection({ SelectAllMode: value }) },
-                        React.createElement(Radio_1.default, { value: 'all' }, "All rows"),
-                        React.createElement(Radio_1.default, { value: 'filtered' }, "Filtered rows only"),
-                        React.createElement(Radio_1.default, { value: 'currentPage' }, "Current page only")))))))));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Row Selection Mode" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsx)(Flex_1.Flex, { flexDirection: "column", children: (0, jsx_runtime_1.jsxs)(Radio_2.RadioGroup, { orientation: "horizontal", variant: "text-only", className: (0, twMerge_1.twMerge)(Radio_1.radioGroupStyling.horizontalTextOnly, 'twa:gap-2 twa:max-w-[500px] twa:bg-defaultbackground twa:p-2'), value: mode, name: "rowSelectionMode", onRadioChange: handleModeChange, children: [(0, jsx_runtime_1.jsx)(Radio_1.default, { value: false, children: "Disabled" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { value: "singleRow", children: "Single Row" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { value: "multiRow", children: "Multi Row" })] }) }) })] }), !rowSelection && (0, jsx_runtime_1.jsx)(HelpBlock_1.default, { children: "There is no Row Selection configured for this Layout" }), rowSelection && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:mt-2", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Row Selection Column Checkboxes" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "row", className: "twa:gap-6", children: [(0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { className: "twa:flex-1", checked: rowSelection.Checkboxes ?? true, onChange: (checked) => updateRowSelection({ Checkboxes: checked }), children: "Checkboxes in Column Cells" }), mode === 'multiRow' && ((0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { className: "twa:flex-1", checked: rowSelection.HeaderCheckbox ?? true, onChange: (checked) => updateRowSelection({ HeaderCheckbox: checked }), children: "Checkbox in Column Header (to enable Select All)" }))] }) })] }), (rowSelection.Checkboxes ?? true) && ((0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:mt-2", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Row Grouping Selection Checkboxes" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsxs)(Radio_2.RadioGroup, { orientation: "vertical", value: rowSelection.CheckboxInGroupColumn ?? false, name: "checkboxLocation", onRadioChange: (value) => updateRowSelection({ CheckboxInGroupColumn: value }), children: [(0, jsx_runtime_1.jsx)(Radio_1.default, { value: false, children: "Display in dedicated Selection Column" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { value: true, children: "Display in Row Grouped Column" })] }) })] })), (0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:mt-2", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Row Click Selection (when user clicks on Row outside of Selection Checkbox)" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsxs)(Radio_2.RadioGroup, { orientation: "vertical", value: rowSelection.EnableClickSelection ?? false, name: "clickSelection", onRadioChange: (value) => updateRowSelection({ EnableClickSelection: value }), children: [(0, jsx_runtime_1.jsx)(Radio_1.default, { value: false, children: "Disabled (Cannot select or deselect by clicking in Row)" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { value: true, children: "Full (Enable selection by clicking in Row and deselection by Ctrl+clicking in Row)" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { value: 'enableSelection', children: "Selection Only (Enable selection by clicking in Row)" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { value: 'enableDeselection', children: "Deselection Only (Enable deselection by Ctrl+clicking in Row)" })] }) })] }), mode === 'multiRow' && !isPivot && ((0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:mt-2", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Grouped Row Selection Behaviour" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsxs)(Radio_2.RadioGroup, { orientation: "vertical", value: rowSelection.GroupSelectMode ?? 'self', name: "groupSelectMode", onRadioChange: (value) => updateRowSelection({ GroupSelectMode: value }), children: [(0, jsx_runtime_1.jsx)(Radio_1.default, { value: 'self', children: "Select Grouped Row Only (no cascade)" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { value: 'descendants', children: "Select Grouped Row and all descendants" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { value: 'filteredDescendants', children: "Select Grouped Row and only filtered descendants" })] }) })] })), mode === 'multiRow' && ((0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:mt-2", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Select All (in Header) Behaviour" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsxs)(Radio_2.RadioGroup, { orientation: "vertical", value: rowSelection.SelectAllMode ?? 'all', name: "selectAllMode", onRadioChange: (value) => updateRowSelection({ SelectAllMode: value }), children: [(0, jsx_runtime_1.jsx)(Radio_1.default, { value: 'all', children: "All rows" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { value: 'filtered', children: "Filtered rows only" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { value: 'currentPage', children: "Current page only" })] }) })] }))] }))] }));
 };
 exports.RowSelectionSection = RowSelectionSection;

package/src/View/Layout/Wizard/sections/RowSummarySection.js

@@ -2,11 +2,11 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RowSummarySection = exports.RowSummarySectionSummary = exports.areSummaryRowsValid = void 0;
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const CheckBox_1 = require("../../../../components/CheckBox");
 const FormLayout_1 = tslib_1.__importStar(require("../../../../components/FormLayout"));
 const Panel_1 = tslib_1.__importDefault(require("../../../../components/Panel"));
-const Select_1 = require("../../../../components/Select");
 const SimpleButton_1 = tslib_1.__importDefault(require("../../../../components/SimpleButton"));
 const Tabs_1 = require("../../../../components/Tabs");
 const Tag_1 = require("../../../../components/Tag");
@@ -22,6 +22,7 @@ const Utilities_1 = require("./Utilities");
 const ColumnGroupTag_1 = require("../../../Components/ColumnGroupTag");
 const ArrayExtensions_1 = tslib_1.__importDefault(require("../../../../Utilities/Extensions/ArrayExtensions"));
 const Flex_1 = require("../../../../components/Flex");
+const NewSelect_1 = require("../../../../components/NewSelect");
 const areSummaryRowsValid = (layout) => {
     if (!layout.RowSummaries)
         return true;
@@ -80,22 +81,13 @@ const getAvailableExpressionsForColumnType = (columnType, availableScalarExpress
 const RowSummarySectionSummary = () => {
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const { data: layout } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    return (React.createElement(Flex_1.Box, { className: "twa:flex twa:flex-col" }, layout.RowSummaries?.length ? (layout.RowSummaries.map((rowSummary, index) => {
-        return (React.createElement(React.Fragment, null,
-            React.createElement(Flex_1.Box, { className: "twa:mr-1 twa:mb-1", key: index },
-                rowSummary.Position,
-                ":",
-                ' ',
-                Object.keys(rowSummary.ColumnsMap).map((colId) => {
-                    if (colId === 'Source' || colId === 'Uuid')
-                        return null;
-                    return (React.createElement(Tag_1.Tag, { className: "twa:mr-1", key: colId },
-                        rowSummary.ColumnsMap[colId],
-                        "(",
-                        adaptable.api.columnApi.getFriendlyNameForColumnId(colId),
-                        ")"));
-                }))));
-    })) : (React.createElement(Tag_1.Tag, null, "No Row Summaries"))));
+    return ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:flex twa:flex-col", children: layout.RowSummaries?.length ? (layout.RowSummaries.map((rowSummary, index) => {
+            return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:mr-1 twa:mb-1", children: [rowSummary.Position, ":", ' ', Object.keys(rowSummary.ColumnsMap).map((colId) => {
+                            if (colId === 'Source' || colId === 'Uuid')
+                                return null;
+                            return ((0, jsx_runtime_1.jsxs)(Tag_1.Tag, { className: "twa:mr-1", children: [rowSummary.ColumnsMap[colId], "(", adaptable.api.columnApi.getFriendlyNameForColumnId(colId), ")"] }, colId));
+                        })] }, index) }));
+        })) : ((0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: "No Row Summaries" })) }));
 };
 exports.RowSummarySectionSummary = RowSummarySectionSummary;
 const RowSummaryEditor = React.memo(({ rowSummary, onChange, availableScalarExpressions, onDelete, }) => {
@@ -114,95 +106,76 @@ const RowSummaryEditor = React.memo(({ rowSummary, onChange, availableScalarExpr
             sortUnorderedItems: false,
         }).map((colId) => adaptable.api.columnApi.getColumnWithColumnId(colId));
     }, [rowSummary.ColumnsMap]);
-    return (React.createElement(Panel_1.default, { header: React.createElement(Flex_1.Flex, { className: "twa:w-full" },
-            React.createElement(Flex_1.Flex, { className: "twa:flex-1", alignItems: "center" }, "Row Summary"),
-            React.createElement(Flex_1.Box, { className: "twa:mr-2" },
-                React.createElement(SuspendToggleButton_1.SuspendToggleButton, { onSuspend: () => {
-                        onChange({
-                            ...rowSummary,
-                            IsSuspended: true,
-                        });
-                    }, onUnSuspend: () => {
-                        onChange({
-                            ...rowSummary,
-                            IsSuspended: false,
-                        });
-                    }, suspendableObject: rowSummary })),
-            React.createElement(SimpleButton_1.default, { icon: "delete", onClick: () => {
-                    onDelete();
-                } })), className: "twa:p-2" },
-        React.createElement(FormLayout_1.default, null,
-            React.createElement(FormLayout_1.FormRow, { label: "Position" },
-                React.createElement(Select_1.Select, { options: [
-                        {
-                            label: 'Top',
-                            value: 'Top',
-                        },
-                        {
-                            label: 'Bottom',
-                            value: 'Bottom',
-                        },
-                    ], value: rowSummary.Position, onChange: (position) => {
-                        onChange({
-                            ...rowSummary,
-                            Position: position,
-                        });
-                    } })),
-            React.createElement(FormLayout_1.FormRow, { label: "" },
-                React.createElement(CheckBox_1.CheckBox, { checked: rowSummary.IncludeOnlyFilteredRows ?? true, onChange: (IncludeOnlyFilteredRows) => {
-                        onChange({
-                            ...rowSummary,
-                            IncludeOnlyFilteredRows,
-                        });
-                    } }, "Include Only Filtered Rows"))),
-        React.createElement(Flex_1.Flex, { flexDirection: "column", className: "twa:mt-2 twa:mb-1" },
-            React.createElement(Flex_1.Flex, { alignItems: "center", className: "twa:flex-1 twa:mb-2" }, "Column Aggregations"),
-            React.createElement(Panel_1.default, { bodyProps: { className: 'twa:max-h-full twa:bg-primarylight ' }, className: "twa:h-[360px]" },
-                React.createElement(ValueSelector_1.ValueSelector, { style: { maxHeight: '100%' }, showFilterInput: true, filter: Utilities_1.columnFilter, toIdentifier: (column) => column.columnId, toLabel: (option) => option.friendlyName ?? option.columnId, options: columns, toListLabel: (column) => {
-                        const label = column.friendlyName ?? column.columnId;
-                        if (!(column.columnId in (rowSummary.ColumnsMap ?? {}))) {
-                            return (React.createElement(Flex_1.Flex, { alignItems: "center" },
-                                label,
-                                React.createElement(ColumnGroupTag_1.ColumnGroupTag, { column: column })));
-                        }
-                        const expressionOptions = getAvailableExpressionsForColumnType(column.dataType, availableScalarExpressions).map((expression) => ({
-                            label: expression,
-                            value: expression,
-                        }));
-                        // check out if this layout has a aggregation with weighted column
-                        const aggregation = layout.TableAggregationColumns?.find((agg) => agg.ColumnId === column.columnId)?.AggFunc;
-                        if (aggregation &&
-                            typeof aggregation === 'object' &&
-                            aggregation.weightedColumnId) {
-                            expressionOptions.push({
-                                label: 'WEIGHTERD_AVG',
-                                value: RowSummary_1.WEIGHTED_AVERAGE_AGGREGATED_FUNCTION,
+    return ((0, jsx_runtime_1.jsxs)(Panel_1.default, { header: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { className: "twa:w-full", children: [(0, jsx_runtime_1.jsx)(Flex_1.Flex, { className: "twa:flex-1", alignItems: "center", children: "Row Summary" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:mr-2", children: (0, jsx_runtime_1.jsx)(SuspendToggleButton_1.SuspendToggleButton, { onSuspend: () => {
+                            onChange({
+                                ...rowSummary,
+                                IsSuspended: true,
                             });
-                        }
-                        const expression = rowSummary.ColumnsMap[column.columnId];
-                        return (React.createElement(Flex_1.Flex, null,
-                            React.createElement(Flex_1.Flex, { className: "twa:mr-2", alignItems: 'center' },
-                                label,
-                                React.createElement(ColumnGroupTag_1.ColumnGroupTag, { column: column })),
-                            React.createElement(Select_1.Select, { value: expression, options: expressionOptions, onChange: (expression) => {
-                                    onChange({
-                                        ...rowSummary,
-                                        ColumnsMap: {
-                                            ...rowSummary.ColumnsMap,
-                                            [column.columnId]: expression,
-                                        },
+                        }, onUnSuspend: () => {
+                            onChange({
+                                ...rowSummary,
+                                IsSuspended: false,
+                            });
+                        }, suspendableObject: rowSummary }) }), (0, jsx_runtime_1.jsx)(SimpleButton_1.default, { icon: "delete", onClick: () => {
+                        onDelete();
+                    } })] }), className: "twa:p-2", children: [(0, jsx_runtime_1.jsxs)(FormLayout_1.default, { children: [(0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Position", children: (0, jsx_runtime_1.jsx)(NewSelect_1.SingleSelect, { items: [
+                                {
+                                    label: 'Top',
+                                    value: 'Top',
+                                },
+                                {
+                                    label: 'Bottom',
+                                    value: 'Bottom',
+                                },
+                            ], value: rowSummary.Position, onValueChange: (position) => {
+                                onChange({
+                                    ...rowSummary,
+                                    Position: position,
+                                });
+                            } }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "", children: (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { checked: rowSummary.IncludeOnlyFilteredRows ?? true, onChange: (IncludeOnlyFilteredRows) => {
+                                onChange({
+                                    ...rowSummary,
+                                    IncludeOnlyFilteredRows,
+                                });
+                            }, children: "Include Only Filtered Rows" }) })] }), (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:mt-2 twa:mb-1", children: [(0, jsx_runtime_1.jsx)(Flex_1.Flex, { alignItems: "center", className: "twa:flex-1 twa:mb-2", children: "Column Aggregations" }), (0, jsx_runtime_1.jsx)(Panel_1.default, { bodyProps: { className: 'twa:max-h-full twa:bg-primarylight ' }, className: "twa:h-[360px]", children: (0, jsx_runtime_1.jsx)(ValueSelector_1.ValueSelector, { style: { maxHeight: '100%' }, showFilterInput: true, filter: Utilities_1.columnFilter, toIdentifier: (column) => column.columnId, toLabel: (option) => option.friendlyName ?? option.columnId, options: columns, toListLabel: (column) => {
+                                const label = column.friendlyName ?? column.columnId;
+                                if (!(column.columnId in (rowSummary.ColumnsMap ?? {}))) {
+                                    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { alignItems: "center", children: [label, (0, jsx_runtime_1.jsx)(ColumnGroupTag_1.ColumnGroupTag, { column: column })] }));
+                                }
+                                const expressionOptions = getAvailableExpressionsForColumnType(column.dataType, availableScalarExpressions).map((expression) => ({
+                                    label: expression,
+                                    value: expression,
+                                }));
+                                // check out if this layout has a aggregation with weighted column
+                                const aggregation = layout.TableAggregationColumns?.find((agg) => agg.ColumnId === column.columnId)?.AggFunc;
+                                if (aggregation &&
+                                    typeof aggregation === 'object' &&
+                                    aggregation.weightedColumnId) {
+                                    expressionOptions.push({
+                                        label: 'WEIGHTERD_AVG',
+                                        value: RowSummary_1.WEIGHTED_AVERAGE_AGGREGATED_FUNCTION,
                                     });
-                                } })));
-                    }, value: Object.keys(rowSummary.ColumnsMap), onChange: (colIds) => {
-                        const newColumnsMap = {};
-                        colIds.forEach((colId) => {
-                            newColumnsMap[colId] = rowSummary.ColumnsMap[colId] ?? null;
-                        });
-                        onChange({
-                            ...rowSummary,
-                            ColumnsMap: newColumnsMap,
-                        });
-                    } })))));
+                                }
+                                const expression = rowSummary.ColumnsMap[column.columnId];
+                                return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { children: [(0, jsx_runtime_1.jsxs)(Flex_1.Flex, { className: "twa:mr-2", alignItems: 'center', children: [label, (0, jsx_runtime_1.jsx)(ColumnGroupTag_1.ColumnGroupTag, { column: column })] }), (0, jsx_runtime_1.jsx)(NewSelect_1.SingleSelect, { value: expression, items: expressionOptions, onValueChange: (expression) => {
+                                                onChange({
+                                                    ...rowSummary,
+                                                    ColumnsMap: {
+                                                        ...rowSummary.ColumnsMap,
+                                                        [column.columnId]: expression,
+                                                    },
+                                                });
+                                            } })] }));
+                            }, value: Object.keys(rowSummary.ColumnsMap), onChange: (colIds) => {
+                                const newColumnsMap = {};
+                                colIds.forEach((colId) => {
+                                    newColumnsMap[colId] = rowSummary.ColumnsMap[colId] ?? null;
+                                });
+                                onChange({
+                                    ...rowSummary,
+                                    ColumnsMap: newColumnsMap,
+                                });
+                            } }) })] })] }));
 });
 const RowSummarySection = (props) => {
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
@@ -213,41 +186,34 @@ const RowSummarySection = (props) => {
             .getModuleExpressionFunctionsMap(ModuleConstants_1.LayoutModuleId).aggregatedScalarFunctions;
         return sytemExpressions;
     }, []);
-    return (React.createElement(Tabs_1.Tabs, { style: { height: '100%' } },
-        React.createElement(Tabs_1.Tabs.Tab, null, "Row Summaries"),
-        React.createElement(Tabs_1.Tabs.Content, null,
-            React.createElement("div", null,
-                React.createElement(Flex_1.Flex, { className: "twa:mb-1" },
-                    React.createElement(Flex_1.Flex, { className: "twa:flex-1" }),
-                    React.createElement(SimpleButton_1.default, { onClick: () => {
-                            props.onChange({
-                                ...layout,
-                                RowSummaries: [
-                                    ...(layout.RowSummaries ?? []),
-                                    {
-                                        Position: 'Top',
-                                        ColumnsMap: {},
-                                        IncludeOnlyFilteredRows: true,
-                                    },
-                                ],
-                            });
-                        }, icon: "plus" }, "Add Row Summary")),
-                (layout.RowSummaries ?? []).map((rowSummary, index) => {
-                    return (React.createElement(RowSummaryEditor, { key: index, onDelete: () => {
-                            const newSummaries = [...layout.RowSummaries];
-                            newSummaries.splice(index, 1);
-                            props.onChange({
-                                ...layout,
-                                RowSummaries: newSummaries,
-                            });
-                        }, availableScalarExpressions: availableScalarExpressions, rowSummary: rowSummary, onChange: (rowSummary) => {
-                            const newSummaries = [...layout.RowSummaries];
-                            newSummaries[index] = rowSummary;
-                            props.onChange({
-                                ...layout,
-                                RowSummaries: newSummaries,
-                            });
-                        } }));
-                })))));
+    return ((0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { style: { height: '100%' }, children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Row Summaries" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)(Flex_1.Flex, { className: "twa:mb-1", children: [(0, jsx_runtime_1.jsx)(Flex_1.Flex, { className: "twa:flex-1" }), (0, jsx_runtime_1.jsx)(SimpleButton_1.default, { onClick: () => {
+                                        props.onChange({
+                                            ...layout,
+                                            RowSummaries: [
+                                                ...(layout.RowSummaries ?? []),
+                                                {
+                                                    Position: 'Top',
+                                                    ColumnsMap: {},
+                                                    IncludeOnlyFilteredRows: true,
+                                                },
+                                            ],
+                                        });
+                                    }, icon: "plus", children: "Add Row Summary" })] }), (layout.RowSummaries ?? []).map((rowSummary, index) => {
+                            return ((0, jsx_runtime_1.jsx)(RowSummaryEditor, { onDelete: () => {
+                                    const newSummaries = [...layout.RowSummaries];
+                                    newSummaries.splice(index, 1);
+                                    props.onChange({
+                                        ...layout,
+                                        RowSummaries: newSummaries,
+                                    });
+                                }, availableScalarExpressions: availableScalarExpressions, rowSummary: rowSummary, onChange: (rowSummary) => {
+                                    const newSummaries = [...layout.RowSummaries];
+                                    newSummaries[index] = rowSummary;
+                                    props.onChange({
+                                        ...layout,
+                                        RowSummaries: newSummaries,
+                                    });
+                                } }, index));
+                        })] }) })] }));
 };
 exports.RowSummarySection = RowSummarySection;

package/src/View/Layout/Wizard/sections/SettingsSection.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SettingsSection = exports.SettingsSectionSummary = void 0;
 const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const FormLayout_1 = tslib_1.__importStar(require("../../../../components/FormLayout"));
 const Input_1 = tslib_1.__importDefault(require("../../../../components/Input"));
 const Radio_1 = tslib_1.__importDefault(require("../../../../components/Radio"));
@@ -14,17 +14,7 @@ const Flex_1 = require("../../../../components/Flex");
 const SettingsSectionSummary = () => {
     const { data: layout } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     const isPivot = (0, isPivotLayout_1.isPivotLayout)(layout);
-    return (React.createElement(Flex_1.Box, null,
-        React.createElement(Tag_1.Tag, { className: "twa:mr-2" },
-            "Layout Name: ",
-            layout.Name),
-        React.createElement(Tag_1.Tag, { className: "twa:mr-2" },
-            "Layout Grid Type: ",
-            isPivot ? 'Pivot' : 'Table'),
-        React.createElement(Tag_1.Tag, { className: "twa:mr-2" },
-            "Suppress Aggregation Function in Column Header:",
-            ' ',
-            layout.SuppressAggFuncInHeader ? 'Yes' : 'No')));
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Box, { children: [(0, jsx_runtime_1.jsxs)(Tag_1.Tag, { className: "twa:mr-2", children: ["Layout Name: ", layout.Name] }), (0, jsx_runtime_1.jsxs)(Tag_1.Tag, { className: "twa:mr-2", children: ["Layout Grid Type: ", isPivot ? 'Pivot' : 'Table'] }), (0, jsx_runtime_1.jsxs)(Tag_1.Tag, { className: "twa:mr-2", children: ["Suppress Aggregation Function in Column Header:", ' ', layout.SuppressAggFuncInHeader ? 'Yes' : 'No'] })] }));
 };
 exports.SettingsSectionSummary = SettingsSectionSummary;
 const SettingsSection = (props) => {
@@ -35,19 +25,6 @@ const SettingsSection = (props) => {
             Name: event.target.value,
         });
     };
-    return (React.createElement(React.Fragment, null,
-        React.createElement(Tabs_1.Tabs, { className: "twa:mb-3" },
-            React.createElement(Tabs_1.Tabs.Tab, null, "Settings"),
-            React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(Flex_1.Flex, { flexDirection: "row" },
-                    React.createElement(FormLayout_1.default, { className: "twa:max-w-[300px] twa:w-full" },
-                        React.createElement(FormLayout_1.FormRow, { label: "Name" },
-                            React.createElement(Input_1.default, { className: "twa:w-full", "data-name": "layout-name", onChange: onNameChange, value: layout?.Name ?? '' })))))),
-        React.createElement(Tabs_1.Tabs, { className: "twa:mb-2" },
-            React.createElement(Tabs_1.Tabs.Tab, null, "Grid Type"),
-            React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(Flex_1.Flex, { flexDirection: "column" },
-                    React.createElement(Radio_1.default, { "data-name": "layout-type-table", disabled: true, checked: !(0, isPivotLayout_1.isPivotLayout)(layout) }, "Table"),
-                    React.createElement(Radio_1.default, { "data-name": "layout-type-pivot", disabled: true, checked: (0, isPivotLayout_1.isPivotLayout)(layout) }, "Pivot"))))));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:mb-3", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Settings" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsx)(Flex_1.Flex, { flexDirection: "row", children: (0, jsx_runtime_1.jsx)(FormLayout_1.default, { className: "twa:max-w-[300px] twa:w-full", children: (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Name", children: (0, jsx_runtime_1.jsx)(Input_1.default, { className: "twa:w-full", "data-name": "layout-name", onChange: onNameChange, value: layout?.Name ?? '' }) }) }) }) })] }), (0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:mb-2", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Grid Type" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", children: [(0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "layout-type-table", disabled: true, checked: !(0, isPivotLayout_1.isPivotLayout)(layout), children: "Table" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "layout-type-pivot", disabled: true, checked: (0, isPivotLayout_1.isPivotLayout)(layout), children: "Pivot" })] }) })] })] }));
 };
 exports.SettingsSection = SettingsSection;

package/src/View/Layout/Wizard/sections/SortSection.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SortSection = exports.SortSectionSummary = void 0;
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const SimpleButton_1 = tslib_1.__importDefault(require("../../../../components/SimpleButton"));
 const Tabs_1 = require("../../../../components/Tabs");
@@ -18,16 +19,13 @@ const SortSectionSummary = () => {
     const { data: layout } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const sortViewItems = (0, getLayoutSortViewItems_1.getLayoutSortViewItems)(layout, adaptable.api);
-    return (React.createElement(Flex_1.Box, null, sortViewItems.values.length ? (sortViewItems.values.map((value) => (React.createElement(Tag_1.Tag, { key: value, className: "twa:mb-1 twa:mr-1" }, value)))) : (React.createElement(Tag_1.Tag, null, "No Sorts"))));
+    return ((0, jsx_runtime_1.jsx)(Flex_1.Box, { children: sortViewItems.values.length ? (sortViewItems.values.map((value) => ((0, jsx_runtime_1.jsx)(Tag_1.Tag, { className: "twa:mb-1 twa:mr-1", children: value }, value)))) : ((0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: "No Sorts" })) }));
 };
 exports.SortSectionSummary = SortSectionSummary;
 const ColumnRow = (props) => {
     const SortOrder = (props.layout?.ColumnSorts ?? []).find((sort) => sort.ColumnId === props.column.columnId)?.SortOrder;
     const icon = SortOrder === 'Asc' ? 'sort-asc' : 'sort-desc';
-    return (React.createElement(Flex_1.Flex, { alignItems: "center" },
-        props.column.friendlyName,
-        React.createElement(ColumnGroupTag_1.ColumnGroupTag, { column: props.column }),
-        SortOrder && (React.createElement(SimpleButton_1.default, { className: "twa:ml-2", onClick: () => props.onSortChange(props.column.columnId, SortOrder === 'Asc' ? 'Desc' : 'Asc'), variant: "raised", icon: icon }))));
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { alignItems: "center", children: [props.column.friendlyName, (0, jsx_runtime_1.jsx)(ColumnGroupTag_1.ColumnGroupTag, { column: props.column }), SortOrder && ((0, jsx_runtime_1.jsx)(SimpleButton_1.default, { className: "twa:ml-2", onClick: () => props.onSortChange(props.column.columnId, SortOrder === 'Asc' ? 'Desc' : 'Asc'), variant: "raised", icon: icon }))] }));
 };
 const SortSection = (props) => {
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
@@ -62,9 +60,6 @@ const SortSection = (props) => {
             }),
         });
     }, [layout]);
-    return (React.createElement(Tabs_1.Tabs, { className: "twa:h-full" },
-        React.createElement(Tabs_1.Tabs.Tab, null, "Column Sorts"),
-        React.createElement(Tabs_1.Tabs.Content, null,
-            React.createElement(ValueSelector_1.ValueSelector, { showFilterInput: true, filter: Utilities_1.columnFilter, toIdentifier: (option) => `${option.columnId}`, toLabel: (option) => option.friendlyName ?? option.columnId, toListLabel: (column) => (React.createElement(ColumnRow, { onSortChange: handleSortChange, layout: layout, column: column })), options: sortedSortColumns, value: (layout.ColumnSorts ?? []).map((sort) => sort.ColumnId), allowReorder: () => true, onChange: handleColumnsSelectionChange }))));
+    return ((0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:h-full", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Column Sorts" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsx)(ValueSelector_1.ValueSelector, { showFilterInput: true, filter: Utilities_1.columnFilter, toIdentifier: (option) => `${option.columnId}`, toLabel: (option) => option.friendlyName ?? option.columnId, toListLabel: (column) => ((0, jsx_runtime_1.jsx)(ColumnRow, { onSortChange: handleSortChange, layout: layout, column: column })), options: sortedSortColumns, value: (layout.ColumnSorts ?? []).map((sort) => sort.ColumnId), allowReorder: () => true, onChange: handleColumnsSelectionChange }) })] }));
 };
 exports.SortSection = SortSection;

package/src/View/License/LicenseWatermark.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LicenseWatermark=void 0;const e=require("tslib"),t=e.__importStar(require("react")),r=require("../../components/Logo"),o=require("../../components/Flex"),n={border:"1px solid var(--ab-color-error)",padding:"5px",fontWeight:600,margin:"5px",fontSize:"14px",alignItems:"center",color:"var(--ab-color-text-on-defaultbackground)",background:"var(--ab-color-defaultbackground)"},i=e=>{const t=[["display","none"],["opacity","0"],["position","absolute"],["position","fixed"],["position","relative"],["visibility","hidden"]];for(const[r,o]of t)if(e.style[r]===o)return!1;return!0},l=e=>{const l=t.useRef(null);return t.useEffect(()=>{const e=setInterval(()=>{l.current?.isConnected||alert("It is not allowed to remove the Adaptable watermark."),i(l.current)||alert("It is not allowed to modify the Adaptable watermark."),l?.current?.style&&(l.current.style.border=n.border,l.current.style.padding=n.padding,l.current.style.fontWeight=`${n.fontWeight}`,l.current.style.margin=n.margin,l.current.style.fontSize=n.fontSize,l.current.style.color=n.color,l.current.style.background=n.background,l.current.style.display="flex",l.current.style.position="static",l.current.style.opacity="1",l.current.style.visibility="visible")},5e3);return()=>clearTimeout(e)},[]),t.createElement(o.Flex,{style:n,ref:l},t.createElement(r.Logo,{style:{marginRight:10}}),t.createElement("div",null,e.children))};exports.LicenseWatermark=l;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LicenseWatermark=void 0;const e=require("tslib"),r=require("react/jsx-runtime"),t=e.__importStar(require("react")),o=require("../../components/Logo"),n=require("../../components/Flex"),i={border:"1px solid var(--ab-color-error)",padding:"5px",fontWeight:600,margin:"5px",fontSize:"14px",alignItems:"center",color:"var(--ab-color-foreground)",background:"var(--ab-color-defaultbackground)"},s=e=>{const r=[["display","none"],["opacity","0"],["position","absolute"],["position","fixed"],["position","relative"],["visibility","hidden"]];for(const[t,o]of r)if(e.style[t]===o)return!1;return!0},l=e=>{const l=t.useRef(null);return t.useEffect(()=>{const e=setInterval(()=>{l.current?.isConnected||alert("It is not allowed to remove the Adaptable watermark."),s(l.current)||alert("It is not allowed to modify the Adaptable watermark."),l?.current?.style&&(l.current.style.border=i.border,l.current.style.padding=i.padding,l.current.style.fontWeight=`${i.fontWeight}`,l.current.style.margin=i.margin,l.current.style.fontSize=i.fontSize,l.current.style.color=i.color,l.current.style.background=i.background,l.current.style.display="flex",l.current.style.position="static",l.current.style.opacity="1",l.current.style.visibility="visible")},5e3);return()=>clearTimeout(e)},[]),(0,r.jsxs)(n.Flex,{style:i,ref:l,children:[(0,r.jsx)(o.Logo,{style:{marginRight:10}}),(0,r.jsx)("div",{children:e.children})]})};exports.LicenseWatermark=l;

package/src/View/NamedQuery/EditCurrentQueryButton.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EditGridFilterButton = void 0;
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const SimpleButton_1 = tslib_1.__importDefault(require("../../components/SimpleButton"));
 const AdaptableContext_1 = require("../AdaptableContext");
@@ -11,6 +12,6 @@ const EditGridFilterButton = () => {
         event.stopPropagation();
         adaptable.api.filterApi.gridFilterApi.openUIEditorForGridFilter();
     }, []);
-    return React.createElement(SimpleButton_1.default, { variant: "text", iconSize: 15, onClick: handleClick, icon: "edit" });
+    return (0, jsx_runtime_1.jsx)(SimpleButton_1.default, { variant: "text", iconSize: 15, onClick: handleClick, icon: "edit" });
 };
 exports.EditGridFilterButton = EditGridFilterButton;

package/src/View/NamedQuery/Wizard/NamedQueryExpressionWizardSection.js

@@ -1,8 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.NamedQueryExpressionWizardSection = exports.renderNamedQueryExpressionSummary = exports.isValidNamedQueryExpression = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const ExpressionEditor_1 = require("../../../components/ExpressionEditor");
 const Tag_1 = require("../../../components/Tag");
@@ -22,15 +21,13 @@ const isValidNamedQueryExpression = (data, api) => {
 exports.isValidNamedQueryExpression = isValidNamedQueryExpression;
 const renderNamedQueryExpressionSummary = (data) => {
     const { api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    return (React.createElement(Flex_1.Box, { className: "twa:text-2" },
-        "Expression: ",
-        React.createElement(Tag_1.Tag, null, api.internalApi.getAdaptableQueryExpressionText(data))));
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:text-2", children: ["Expression: ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: api.internalApi.getAdaptableQueryExpressionText(data) })] }));
 };
 exports.renderNamedQueryExpressionSummary = renderNamedQueryExpressionSummary;
 const NamedQueryExpressionWizardSection = (props) => {
     const { data, moduleInfo, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     const initialData = (0, react_1.useMemo)(() => api.internalApi.getQueryPreviewData(), []);
-    return (React.createElement(ExpressionEditor_1.ExpressionEditor, { allowSaveNamedQuery: false, showQueryBuilder: true, type: 'boolean', module: moduleInfo.ModuleName, value: data.BooleanExpression, onChange: (BooleanExpression) => {
+    return ((0, jsx_runtime_1.jsx)(ExpressionEditor_1.ExpressionEditor, { allowSaveNamedQuery: false, showQueryBuilder: true, type: 'boolean', module: moduleInfo.ModuleName, value: data.BooleanExpression, onChange: (BooleanExpression) => {
             props.onChange({ ...data, BooleanExpression });
         }, initialData: initialData, columns: api.columnApi.internalApi.getQueryableColumnsForUIEditor(), fields: api.expressionApi.internalApi.getAvailableFields(), namedQueries: api.namedQueryApi.getNamedQueries(), api: api }));
 };

package/src/View/NamedQuery/Wizard/NamedQuerySettingsWizardSection.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.NamedQuerySettingsWizardSection = exports.renderNamedQuerySettingsSummary = exports.isValidNamedQuerySettings = void 0;
 const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const WizardPanel_1 = tslib_1.__importDefault(require("../../../components/WizardPanel"));
 const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
 const ErrorBox_1 = tslib_1.__importDefault(require("../../../components/ErrorBox"));
@@ -20,9 +20,7 @@ const isValidNamedQuerySettings = (data, api) => {
 };
 exports.isValidNamedQuerySettings = isValidNamedQuerySettings;
 const renderNamedQuerySettingsSummary = (data) => {
-    return (React.createElement(Flex_1.Box, { className: "twa:text-2" },
-        "Name: ",
-        React.createElement(Tag_1.Tag, null, data.Name)));
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:text-2", children: ["Name: ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: data.Name })] }));
 };
 exports.renderNamedQuerySettingsSummary = renderNamedQuerySettingsSummary;
 const NamedQuerySettingsWizardSection = (props) => {
@@ -36,12 +34,6 @@ const NamedQuerySettingsWizardSection = (props) => {
             Name: e.value,
         });
     };
-    return (React.createElement(WizardPanel_1.default, { "data-name": 'named-query-settings' },
-        React.createElement(FormLayout_1.default, null,
-            React.createElement(FormLayout_1.FormRow, { label: "Name" },
-                React.createElement(AdaptableInput_1.default, { "data-name": "query-name", value: data.Name, autoFocus: true, className: "twa:w-[300px]", type: "text", placeholder: "Enter Named Query Name", onChange: (e) => handleColumnNameChange(e) })),
-            ' ',
-            errorMessage ? (React.createElement(FormLayout_1.FormRow, { label: "" },
-                React.createElement(ErrorBox_1.default, null, errorMessage))) : null)));
+    return ((0, jsx_runtime_1.jsx)(WizardPanel_1.default, { "data-name": 'named-query-settings', children: (0, jsx_runtime_1.jsxs)(FormLayout_1.default, { children: [(0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Name", children: (0, jsx_runtime_1.jsx)(AdaptableInput_1.default, { "data-name": "query-name", value: data.Name, autoFocus: true, className: "twa:w-[300px]", type: "text", placeholder: "Enter Named Query Name", onChange: (e) => handleColumnNameChange(e) }) }), ' ', errorMessage ? ((0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "", children: (0, jsx_runtime_1.jsx)(ErrorBox_1.default, { children: errorMessage }) })) : null] }) }));
 };
 exports.NamedQuerySettingsWizardSection = NamedQuerySettingsWizardSection;