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

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

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.NamedQueryWizard = NamedQueryWizard;
 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 OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const NamedQuerySettingsWizardSection_1 = require("./NamedQuerySettingsWizardSection");
@@ -30,13 +30,13 @@ function NamedQueryWizard(props) {
         }
         props.onFinishWizard(namedQuery);
     };
-    return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, onFinish: handleFinish, sections: [
+    return ((0, jsx_runtime_1.jsx)(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, onFinish: handleFinish, sections: [
             {
                 title: 'Expression',
                 details: "Build the Named Query's Expression",
                 renderSummary: NamedQueryExpressionWizardSection_1.renderNamedQueryExpressionSummary,
                 isValid: NamedQueryExpressionWizardSection_1.isValidNamedQueryExpression,
-                render: () => React.createElement(NamedQueryExpressionWizardSection_1.NamedQueryExpressionWizardSection, { onChange: setNamedQuery }),
+                render: () => (0, jsx_runtime_1.jsx)(NamedQueryExpressionWizardSection_1.NamedQueryExpressionWizardSection, { onChange: setNamedQuery }),
             },
             {
                 title: 'Query Name',
@@ -44,15 +44,14 @@ function NamedQueryWizard(props) {
                 renderSummary: NamedQuerySettingsWizardSection_1.renderNamedQuerySettingsSummary,
                 isValid: NamedQuerySettingsWizardSection_1.isValidNamedQuerySettings,
                 render: () => {
-                    return React.createElement(NamedQuerySettingsWizardSection_1.NamedQuerySettingsWizardSection, { onChange: setNamedQuery });
+                    return (0, jsx_runtime_1.jsx)(NamedQuerySettingsWizardSection_1.NamedQuerySettingsWizardSection, { onChange: setNamedQuery });
                 },
             },
             {
                 details: 'Select Named Query Tags',
                 title: 'Tags',
                 isVisible: (_, api) => api.internalApi.shouldDisplayTagSections(),
-                render: () => (React.createElement(Flex_1.Box, { className: "twa:p-2" },
-                    React.createElement(ObjectTagsWizardSection_1.ObjectTagsWizardSection, { onChange: setNamedQuery }))),
+                render: () => ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-2", children: (0, jsx_runtime_1.jsx)(ObjectTagsWizardSection_1.ObjectTagsWizardSection, { onChange: setNamedQuery }) })),
                 renderSummary: ObjectTagsWizardSection_1.renderObjectTagsSummary,
             },
             '-',
@@ -60,8 +59,7 @@ function NamedQueryWizard(props) {
                 title: 'Summary',
                 details: 'Review your Named Query',
                 render: () => {
-                    return (React.createElement(Flex_1.Box, { className: "twa:p-2" },
-                        React.createElement(OnePageAdaptableWizard_1.OnePageWizardSummary, null)));
+                    return ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-2", children: (0, jsx_runtime_1.jsx)(OnePageAdaptableWizard_1.OnePageWizardSummary, {}) }));
                 },
             },
         ], onHide: props.onCloseWizard, moduleInfo: props.moduleInfo, data: namedQuery }));

package/src/View/Note/NoteEditor.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.NoteEditor = void 0;
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const throttle_1 = tslib_1.__importDefault(require("../../Utilities/utils/throttle"));
 const React = tslib_1.__importStar(require("react"));
 const Textarea_1 = tslib_1.__importDefault(require("../../components/Textarea"));
@@ -28,15 +29,13 @@ const NoteEditor = ({ note, onNoteChange, onClose, editMode, isReadonly }) => {
     if (note === undefined || note === null) {
         return null;
     }
-    return (React.createElement(React.Fragment, null,
-        React.createElement(Textarea_1.default, { readOnly: isReadonly, ref: textAreaRef, className: (0, clsx_1.default)('twa:min-w-[180px] twa:min-h-[120px] twa:w-full', {
-                'twa:pr-[30px]': showPopupCloseButton,
-                'twa:pr-0': !showPopupCloseButton,
-            }), value: liveValue, onBlur: () => onClose(), onKeyDown: (event) => {
-                if (event.key === 'Escape') {
-                    onClose();
-                }
-            }, onChange: (event) => throttledOnChange(event.target.value) }),
-        showPopupCloseButton && (React.createElement(SimpleButton_1.default, { variant: "text", style: { position: 'absolute', right: 5, top: 5 }, icon: "close" }))));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Textarea_1.default, { readOnly: isReadonly, ref: textAreaRef, className: (0, clsx_1.default)('twa:min-w-[180px] twa:min-h-[120px] twa:w-full', {
+                    'twa:pr-[30px]': showPopupCloseButton,
+                    'twa:pr-0': !showPopupCloseButton,
+                }), value: liveValue, onBlur: () => onClose(), onKeyDown: (event) => {
+                    if (event.key === 'Escape') {
+                        onClose();
+                    }
+                }, onChange: (event) => throttledOnChange(event.target.value) }), showPopupCloseButton && ((0, jsx_runtime_1.jsx)(SimpleButton_1.default, { variant: "text", style: { position: 'absolute', right: 5, top: 5 }, icon: "close" }))] }));
 };
 exports.NoteEditor = NoteEditor;

package/src/View/Note/NotePopup.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.NotePopup = void 0;
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const react_redux_1 = require("react-redux");
 const InfiniteTable_1 = require("../../components/InfiniteTable");
@@ -69,7 +70,7 @@ const NotePopup = (props) => {
             delete: {
                 defaultWidth: 50,
                 render: (params) => {
-                    return (React.createElement(AdaptableButton_1.AdaptableButtonComponent, { disabled: isReadOnlyModule, variant: "text", icon: "delete", onClick: () => {
+                    return ((0, jsx_runtime_1.jsx)(AdaptableButton_1.AdaptableButtonComponent, { disabled: isReadOnlyModule, variant: "text", icon: "delete", onClick: () => {
                             const note = adaptable.api.noteApi.getNoteByUuid(params.data.Uuid);
                             adaptable.api.noteApi.deleteNote(note);
                         } }));
@@ -78,8 +79,7 @@ const NotePopup = (props) => {
         };
         return columns;
     }, []);
-    return (React.createElement(PopupPanel_1.PopupPanel, { headerText: 'Notes', glyphicon: 'import', infoLink: props.moduleInfo.HelpPage },
-        React.createElement(InfiniteTable_1.DataSource, { data: allNotes, primaryKey: "Uuid", onDataMutations: (params) => {
+    return ((0, jsx_runtime_1.jsx)(PopupPanel_1.PopupPanel, { headerText: 'Notes', glyphicon: 'import', infoLink: props.moduleInfo.HelpPage, children: (0, jsx_runtime_1.jsx)(InfiniteTable_1.DataSource, { data: allNotes, primaryKey: "Uuid", onDataMutations: (params) => {
                 for (const mutation of params.mutations) {
                     const [uuid, changes] = mutation;
                     for (const change of changes) {
@@ -92,7 +92,6 @@ const NotePopup = (props) => {
                         }
                     }
                 }
-            } },
-            React.createElement(InfiniteTable_1.InfiniteTableGrid, { columnTypes: columnTypes, headerOptions: headerOptions, domProps: tableDOMProps, columns: columnsMap }))));
+            }, children: (0, jsx_runtime_1.jsx)(InfiniteTable_1.InfiniteTableGrid, { columnTypes: columnTypes, headerOptions: headerOptions, domProps: tableDOMProps, columns: columnsMap }) }) }));
 };
 exports.NotePopup = NotePopup;

package/src/View/PlusMinus/MovePlusMinus.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MovePlusMinus = 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 PlusMinusRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/PlusMinusRedux"));
@@ -18,10 +19,8 @@ const MovePlusMinus = (props) => {
         dispatch(PlusMinusRedux.PlusMinusMoveDown(props.data));
     }, []);
     if (plusMinusNudges?.length <= 1) {
-        return React.createElement(React.Fragment, null);
+        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
     }
-    return (React.createElement(React.Fragment, null,
-        React.createElement(SimpleButton_1.default, { "data-id": "move-up", title: "move up", onClick: handleMoveUp, variant: "text", icon: "arrow-up" }),
-        React.createElement(SimpleButton_1.default, { "data-name": "move-down", title: "move down", onClick: handleMoveDown, variant: "text", icon: "arrow-down" })));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(SimpleButton_1.default, { "data-id": "move-up", title: "move up", onClick: handleMoveUp, variant: "text", icon: "arrow-up" }), (0, jsx_runtime_1.jsx)(SimpleButton_1.default, { "data-name": "move-down", title: "move down", onClick: handleMoveDown, variant: "text", icon: "arrow-down" })] }));
 };
 exports.MovePlusMinus = MovePlusMinus;

package/src/View/PlusMinus/Wizard/PlusMinusRuleWizardSection.js

@@ -2,23 +2,16 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PlusMinusRuleSummary = PlusMinusRuleSummary;
 exports.PlusMinusRuleWizardSection = PlusMinusRuleWizardSection;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const EntityRulesEditor_1 = require("../../Components/EntityRulesEditor");
 const CodeBlock_1 = require("../../../components/CodeBlock");
 function PlusMinusRuleSummary() {
     const { data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    return (React.createElement(EntityRulesEditor_1.EntityRulesSummary, { data: data, renderPredicate: (contents) => {
-            return (React.createElement(React.Fragment, null,
-                "Apply Plus Minus on ",
-                React.createElement(CodeBlock_1.CodeBlock, null, contents)));
+    return ((0, jsx_runtime_1.jsx)(EntityRulesEditor_1.EntityRulesSummary, { data: data, renderPredicate: (contents) => {
+            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Apply Plus Minus on ", (0, jsx_runtime_1.jsx)(CodeBlock_1.CodeBlock, { children: contents })] }));
         }, renderQueryExpression: (contents) => {
-            return (React.createElement(React.Fragment, null,
-                "Apply Plus Minus when",
-                ' ',
-                React.createElement("b", null,
-                    React.createElement(CodeBlock_1.CodeBlock, null, contents))));
+            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Apply Plus Minus when", ' ', (0, jsx_runtime_1.jsx)("b", { children: (0, jsx_runtime_1.jsx)(CodeBlock_1.CodeBlock, { children: contents }) })] }));
         } }));
 }
 function PlusMinusRuleWizardSection(props) {
@@ -27,7 +20,7 @@ function PlusMinusRuleWizardSection(props) {
         ...data,
         Rule: data?.Rule ?? { BooleanExpression: '' },
     };
-    return (React.createElement(EntityRulesEditor_1.EntityRulesEditor, { module: moduleInfo.ModuleName, 
+    return ((0, jsx_runtime_1.jsx)(EntityRulesEditor_1.EntityRulesEditor, { module: moduleInfo.ModuleName, 
         // min-height 0 so the container does not min-size from it's children
         // https://stackoverflow.com/questions/33605552/how-to-prevent-a-flex-item-height-to-overflow-due-to-its-content
         flexProps: { style: { minHeight: 0 } }, defaultPredicateId: props.defaultPredicateId, predicateDefs: [], showAggregation: false, showObservable: false, showPredicate: false, data: plusMinusNudge, 
@@ -35,10 +28,7 @@ function PlusMinusRuleWizardSection(props) {
         // even when Rule is not optional, the type is inferred from `plusMinusNudge`
         onChange: (plusMinus) => props.onChange(plusMinus), descriptions: {
             selectPredicate: null,
-            useBooleanQuery: (React.createElement(React.Fragment, null,
-                "Use an BooleanQuery if ",
-                React.createElement("i", null, "Scope"),
-                " is 'All Columns' - so any data change may be evaluated in a complex BooleanExpression")),
+            useBooleanQuery: ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Use an BooleanQuery if ", (0, jsx_runtime_1.jsx)("i", { children: "Scope" }), " is 'All Columns' - so any data change may be evaluated in a complex BooleanExpression"] })),
             useObservableQuery: null,
             useAggregationQuery: null,
         } }));

package/src/View/PlusMinus/Wizard/PlusMinusScopeWizardSection.js

@@ -2,13 +2,14 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PlusMinusScopeWizardSection = void 0;
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const NewScopeComponent_1 = require("../../Components/NewScopeComponent");
 const PlusMinusScopeWizardSection = (props) => {
     const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     const availableColumns = React.useMemo(() => api.columnApi.getNumericColumns(), []);
-    return (React.createElement(NewScopeComponent_1.NewScopeComponent, { availableDataTypes: ['number'], scopeColumns: availableColumns, scope: data.Scope, descriptions: {
+    return ((0, jsx_runtime_1.jsx)(NewScopeComponent_1.NewScopeComponent, { availableDataTypes: ['number'], scopeColumns: availableColumns, scope: data.Scope, descriptions: {
             rowScope: 'Matching rows will have the plus/minus applied',
             columnScope: 'Matching Columns will have the plus/minus applied',
         }, updateScope: (Scope) => {

package/src/View/PlusMinus/Wizard/PlusMinusSettingsWizardSection.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PlusMinusSettingsWizardSection = exports.isSettingsValid = exports.PlusMinusSettingsSummary = void 0;
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
 const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
@@ -9,22 +10,17 @@ const Tabs_1 = require("../../../components/Tabs");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const PlusMinusRuleWizardSection_1 = require("./PlusMinusRuleWizardSection");
 const Utilities_1 = require("../../Components/EntityRulesEditor/Utilities");
-const OnePageAdaptableWizard_2 = require("../../../View/Wizard/OnePageAdaptableWizard");
 const Tag_1 = require("../../../components/Tag");
 const Flex_1 = require("../../../components/Flex");
+const plusMinusTriggerKeys_1 = require("../../../Utilities/Helpers/plusMinusTriggerKeys");
+const plusMinusSettingsFormColumns = [
+    { name: 'label', style: { textAlign: 'start' } },
+    { name: 'children' },
+];
 const PlusMinusSettingsSummary = (props) => {
-    const { data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    return (React.createElement(React.Fragment, null,
-        React.createElement(OnePageAdaptableWizard_2.SummaryText, null,
-            "Name ",
-            React.createElement(Tag_1.Tag, null, data.Name || 'Not specified')),
-        React.createElement(OnePageAdaptableWizard_2.SummaryText, null,
-            "Nudge Value ",
-            React.createElement(Tag_1.Tag, null, data.NudgeValue ?? 'Not selected')),
-        React.createElement(OnePageAdaptableWizard_2.SummaryText, null,
-            "Nudge Type ",
-            React.createElement(Tag_1.Tag, null, props.hasCondition ? 'Conditional' : 'Always Apply')),
-        props.hasCondition && React.createElement(PlusMinusRuleWizardSection_1.PlusMinusRuleSummary, null)));
+    const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const { incrementKey, decrementKey } = (0, plusMinusTriggerKeys_1.resolvePlusMinusTriggerKeysForNudge)(data, api.optionsApi.getEditOptions().plusMinusOptions ?? {});
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(OnePageAdaptableWizard_1.SummaryText, { children: ["Name ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: data.Name || 'Not specified' })] }), (0, jsx_runtime_1.jsxs)(OnePageAdaptableWizard_1.SummaryText, { children: ["Nudge Value ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: data.NudgeValue ?? 'Not selected' })] }), (0, jsx_runtime_1.jsxs)(OnePageAdaptableWizard_1.SummaryText, { children: ["Keys ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: incrementKey }), " / ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: decrementKey })] }), (0, jsx_runtime_1.jsxs)(OnePageAdaptableWizard_1.SummaryText, { children: ["Nudge Type ", (0, jsx_runtime_1.jsx)(Tag_1.Tag, { children: props.hasCondition ? 'Conditional' : 'Always Apply' })] }), props.hasCondition && (0, jsx_runtime_1.jsx)(PlusMinusRuleWizardSection_1.PlusMinusRuleSummary, {})] }));
 };
 exports.PlusMinusSettingsSummary = PlusMinusSettingsSummary;
 const isSettingsValid = (hasCondition) => (data, api, context) => {
@@ -51,11 +47,53 @@ const isSettingsValid = (hasCondition) => (data, api, context) => {
     if (data.NudgeValue === 0) {
         return 'Nudge value must not be zero.';
     }
+    if ((0, plusMinusTriggerKeys_1.plusMinusResolvedKeysConflict)(data, api.optionsApi.getEditOptions().plusMinusOptions ?? {})) {
+        return 'Increment and decrement keys cannot be the same for this nudge.';
+    }
     return true;
 };
 exports.isSettingsValid = isSettingsValid;
 const PlusMinusSettingsWizardSection = (props) => {
-    const { data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const pmOpts = api.optionsApi.getEditOptions().plusMinusOptions ?? {};
+    const incrementBaseline = (0, plusMinusTriggerKeys_1.plusMinusIncrementKeyFromOptionsOnly)(pmOpts);
+    const decrementBaseline = (0, plusMinusTriggerKeys_1.plusMinusDecrementKeyFromOptionsOnly)(pmOpts);
+    const [incrementEdit, setIncrementEdit] = React.useState(undefined);
+    const [decrementEdit, setDecrementEdit] = React.useState(undefined);
+    React.useEffect(() => {
+        setIncrementEdit(undefined);
+        setDecrementEdit(undefined);
+    }, [data.Uuid]);
+    const incrementDisplayValue = incrementEdit !== undefined
+        ? incrementEdit
+        : data.IncrementKey?.trim()
+            ? (data.IncrementKey ?? '').trim()
+            : incrementBaseline;
+    const decrementDisplayValue = decrementEdit !== undefined
+        ? decrementEdit
+        : data.DecrementKey?.trim()
+            ? (data.DecrementKey ?? '').trim()
+            : decrementBaseline;
+    const commitIncrementKey = React.useCallback((raw) => {
+        const trimmed = raw.trim();
+        const next = trimmed === '' || (0, plusMinusTriggerKeys_1.plusMinusTriggerSameAsBaseline)(trimmed, incrementBaseline)
+            ? undefined
+            : trimmed;
+        const prev = data.IncrementKey?.trim() || undefined;
+        if (next !== prev) {
+            props.onChange({ ...data, IncrementKey: next });
+        }
+    }, [data, incrementBaseline, props.onChange]);
+    const commitDecrementKey = React.useCallback((raw) => {
+        const trimmed = raw.trim();
+        const next = trimmed === '' || (0, plusMinusTriggerKeys_1.plusMinusTriggerSameAsBaseline)(trimmed, decrementBaseline)
+            ? undefined
+            : trimmed;
+        const prev = data.DecrementKey?.trim() || undefined;
+        if (next !== prev) {
+            props.onChange({ ...data, DecrementKey: next });
+        }
+    }, [data, decrementBaseline, props.onChange]);
     const handleNameChange = (event) => {
         props.onChange({
             ...data,
@@ -69,21 +107,30 @@ const PlusMinusSettingsWizardSection = (props) => {
             NudgeValue: isNaN(newValue) ? '' : newValue,
         });
     };
-    return (React.createElement(Flex_1.Flex, { flexDirection: "column", "data-name": "plus-minus-column-settings", className: "twa:h-full" },
-        React.createElement(Tabs_1.Tabs, { className: "twa:p-2" },
-            React.createElement(Tabs_1.Tabs.Tab, null, "Settings"),
-            React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(FormLayout_1.default, null,
-                    React.createElement(FormLayout_1.FormRow, { label: "Name" },
-                        React.createElement(Input_1.default, { "data-name": "plus-minus-name", className: "twa:flex-1 twa:mr-3", onChange: handleNameChange, placeholder: "Enter Name", value: data.Name ?? '' })),
-                    React.createElement(FormLayout_1.FormRow, { label: "Nudge Value" },
-                        React.createElement(Input_1.default, { "data-name": "nudge-value", className: "twa:flex-1 twa:mr-3", onChange: handleNudgeValueChange, placeholder: "Enter Number", type: "number", value: data.NudgeValue ?? '' }))))),
-        React.createElement(Tabs_1.Tabs, { className: "twa:p-2", selectedIndex: props.hasCondition ? 1 : 0, onSelectedIndexChange: (index) => props.onConditionChange(index === 1) },
-            React.createElement(Tabs_1.Tabs.Tab, { "data-name": "nudge-type-always" }, "Always Apply"),
-            React.createElement(Tabs_1.Tabs.Tab, { "data-name": "nudge-type-condition" }, "Conditional"),
-            React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(Flex_1.Flex, { className: "twa:text-2 twa:py-2" }, "The nudge value is always applied when using Plus/Minus")),
-            React.createElement(Tabs_1.Tabs.Content, { className: "twa:p-0" },
-                React.createElement(PlusMinusRuleWizardSection_1.PlusMinusRuleWizardSection, { defaultPredicateId: "NonBlanks", onChange: props.onChange })))));
+    const handleIncrementKeyFocus = () => {
+        setIncrementEdit(data.IncrementKey?.trim() ? (data.IncrementKey ?? '').trim() : incrementBaseline);
+    };
+    const handleIncrementKeyChange = (event) => {
+        const raw = event.target.value;
+        setIncrementEdit(raw);
+        commitIncrementKey(raw);
+    };
+    const handleIncrementKeyBlur = (event) => {
+        commitIncrementKey(event.target.value);
+        setIncrementEdit(undefined);
+    };
+    const handleDecrementKeyFocus = () => {
+        setDecrementEdit(data.DecrementKey?.trim() ? (data.DecrementKey ?? '').trim() : decrementBaseline);
+    };
+    const handleDecrementKeyChange = (event) => {
+        const raw = event.target.value;
+        setDecrementEdit(raw);
+        commitDecrementKey(raw);
+    };
+    const handleDecrementKeyBlur = (event) => {
+        commitDecrementKey(event.target.value);
+        setDecrementEdit(undefined);
+    };
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", "data-name": "plus-minus-column-settings", className: "twa:h-full", children: [(0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:p-2", 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.jsxs)(FormLayout_1.default, { columns: plusMinusSettingsFormColumns, sizes: ['minmax(140px, max-content)', '1fr'], children: [(0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Name", children: (0, jsx_runtime_1.jsx)(Input_1.default, { "data-name": "plus-minus-name", className: "twa:mr-3 twa:max-w-md twa:w-full", onChange: handleNameChange, placeholder: "Enter Name", value: data.Name ?? '' }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Nudge Value", children: (0, jsx_runtime_1.jsx)(Input_1.default, { "data-name": "nudge-value", className: "twa:mr-3 twa:max-w-md twa:w-full", onChange: handleNudgeValueChange, placeholder: "Enter Number", type: "number", value: data.NudgeValue ?? '' }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Increment key", children: (0, jsx_runtime_1.jsx)(Input_1.default, { "data-name": "plus-minus-increment-key", className: "twa:mr-3 twa:max-w-md twa:w-full", onBlur: handleIncrementKeyBlur, onChange: handleIncrementKeyChange, onFocus: handleIncrementKeyFocus, value: incrementDisplayValue }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Decrement key", children: (0, jsx_runtime_1.jsx)(Input_1.default, { "data-name": "plus-minus-decrement-key", className: "twa:mr-3 twa:max-w-md twa:w-full", onBlur: handleDecrementKeyBlur, onChange: handleDecrementKeyChange, onFocus: handleDecrementKeyFocus, value: decrementDisplayValue }) })] }) })] }), (0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:p-2", selectedIndex: props.hasCondition ? 1 : 0, onSelectedIndexChange: (index) => props.onConditionChange(index === 1), children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { "data-name": "nudge-type-always", children: "Always Apply" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { "data-name": "nudge-type-condition", children: "Conditional" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsx)(Flex_1.Flex, { className: "twa:text-2 twa:py-2", children: "The nudge value is always applied when using Plus/Minus" }) }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { className: "twa:p-0", children: (0, jsx_runtime_1.jsx)(PlusMinusRuleWizardSection_1.PlusMinusRuleWizardSection, { defaultPredicateId: "NonBlanks", onChange: props.onChange }) })] })] }));
 };
 exports.PlusMinusSettingsWizardSection = PlusMinusSettingsWizardSection;

package/src/View/PlusMinus/Wizard/PlusMinusWizard.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PlusMinusWizard = void 0;
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const OnePageAdaptableWizard_1 = require("../../../View/Wizard/OnePageAdaptableWizard");
 const NewScopeComponent_1 = require("../../Components/NewScopeComponent");
@@ -55,12 +56,12 @@ const PlusMinusWizard = (props) => {
         }
         props.onFinishWizard(plusMinus);
     };
-    return (React.createElement(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: plusMinus, onHide: props.onCloseWizard, onFinish: handleFinish, sections: [
+    return ((0, jsx_runtime_1.jsx)(OnePageAdaptableWizard_1.OnePageAdaptableWizard, { defaultCurrentSectionName: props.defaultCurrentSectionName, moduleInfo: props.moduleInfo, data: plusMinus, onHide: props.onCloseWizard, onFinish: handleFinish, sections: [
             {
                 title: 'Settings',
                 isValid: (0, PlusMinusSettingsWizardSection_1.isSettingsValid)(hasCondition),
-                renderSummary: () => React.createElement(PlusMinusSettingsWizardSection_1.PlusMinusSettingsSummary, { hasCondition: hasCondition }),
-                render: () => (React.createElement(PlusMinusSettingsWizardSection_1.PlusMinusSettingsWizardSection, { hasCondition: hasCondition, onConditionChange: setHasCondition, onChange: setPlusMinus })),
+                renderSummary: () => (0, jsx_runtime_1.jsx)(PlusMinusSettingsWizardSection_1.PlusMinusSettingsSummary, { hasCondition: hasCondition }),
+                render: () => ((0, jsx_runtime_1.jsx)(PlusMinusSettingsWizardSection_1.PlusMinusSettingsWizardSection, { hasCondition: hasCondition, onConditionChange: setHasCondition, onChange: setPlusMinus })),
             },
             {
                 title: 'Target',
@@ -71,22 +72,19 @@ const PlusMinusWizard = (props) => {
                     scopeColumns: 'Plus/Minus is applied in cells in selected columns',
                     scopeDataTypes: 'Plus/Minus is applied for cells with selected data type',
                 }),
-                render: () => (React.createElement(Flex_1.Box, { className: "twa:p-2" },
-                    React.createElement(PlusMinusScopeWizardSection_1.PlusMinusScopeWizardSection, { onChange: setPlusMinus }))),
+                render: () => ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-2", children: (0, jsx_runtime_1.jsx)(PlusMinusScopeWizardSection_1.PlusMinusScopeWizardSection, { onChange: setPlusMinus }) })),
             },
             {
                 details: 'Select Plus/Minus Tags',
                 title: 'Tags',
                 isVisible: (_, api) => api.internalApi.shouldDisplayTagSections(),
-                render: () => (React.createElement(Flex_1.Box, { className: "twa:p-2" },
-                    React.createElement(ObjectTagsWizardSection_1.ObjectTagsWizardSection, { onChange: setPlusMinus }))),
+                render: () => ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-2", children: (0, jsx_runtime_1.jsx)(ObjectTagsWizardSection_1.ObjectTagsWizardSection, { onChange: setPlusMinus }) })),
                 renderSummary: ObjectTagsWizardSection_1.renderObjectTagsSummary,
             },
             '-',
             {
                 render: () => {
-                    return (React.createElement(Flex_1.Box, { className: "twa:p-2" },
-                        React.createElement(OnePageAdaptableWizard_1.OnePageWizardSummary, null)));
+                    return ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-2", children: (0, jsx_runtime_1.jsx)(OnePageAdaptableWizard_1.OnePageWizardSummary, {}) }));
                 },
                 title: 'Summary',
             },

package/src/View/QuickSearch/FloatingQuickSearch/FloatingQuickSearch.js

@@ -1,8 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.QuickSearchDrawer = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_redux_1 = require("react-redux");
 const Flex_1 = require("../../../components/Flex");
 const index_1 = require("../../../components/Drawer/index");
@@ -12,15 +11,13 @@ const QuickSearchInput_1 = require("../QuickSearchInput");
 const QuickSearchDrawer = () => {
     const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const isOpen = (0, react_redux_1.useSelector)((state) => (0, InternalRedux_1.QuickSearchFloatingVisibilitySelector)(state.Internal));
-    return (React.createElement(index_1.Drawer, { open: isOpen, onOpenChange: (open) => {
+    return ((0, jsx_runtime_1.jsx)(index_1.Drawer, { open: isOpen, onOpenChange: (open) => {
             if (open) {
                 adaptable.api.quickSearchApi.showFloatingQuickSearch();
             }
             else {
                 adaptable.api.quickSearchApi.hideFloatingQuickSearch();
             }
-        } },
-        React.createElement(Flex_1.Flex, { className: "ab-FloatinQuickSearch ab-FloatingQuickSearch" },
-            React.createElement(QuickSearchInput_1.QuickSearchInput, { autoFocus: true }))));
+        }, children: (0, jsx_runtime_1.jsx)(Flex_1.Flex, { className: "ab-FloatinQuickSearch ab-FloatingQuickSearch", children: (0, jsx_runtime_1.jsx)(QuickSearchInput_1.QuickSearchInput, { autoFocus: true }) }) }));
 };
 exports.QuickSearchDrawer = QuickSearchDrawer;

package/src/View/QuickSearch/QuickSearchInput.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.QuickSearchInput = void 0;
 const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = tslib_1.__importDefault(require("react"));
 const react_redux_1 = require("react-redux");
 const QuickSearchRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/QuickSearchRedux"));
@@ -21,8 +22,6 @@ const QuickSearchInput = (props) => {
         QuickSearchText,
         onRunQuickSearch,
     });
-    return (react_1.default.createElement(AdaptableFormControlTextClear_1.AdaptableFormControlTextClear, { onClick: props.onClick, "aria-label": 'Quick Search', type: "text", autoFocus: props.autoFocus, placeholder: adaptable.api.optionsApi.getQuickSearchOptions().quickSearchPlaceholder, className: (0, twMerge_1.twMerge)('ab-QuickSearch__control twa:h-full twa:min-h-input', props.className), value: searchText, OnTextChange: search, inputClassName: (0, twMerge_1.twMerge)('twa:w-[10rem]', props.inputClassName), actionTools: isServerSideRowModel ? null : (react_1.default.createElement(Flex_1.Flex, { flexDirection: "row", alignItems: "center", className: "twa:flex-none" },
-            react_1.default.createElement(SimpleButton_1.default, { "aria-label": 'Previous Match', icon: "arrow-up", className: "twa:px-0 twa:py-0 twa:mr-1", disabled: !searchText, variant: "text", onClick: () => adaptable.api.quickSearchApi.gotoPreviousMatch() }),
-            react_1.default.createElement(SimpleButton_1.default, { "aria-label": 'Next Match', icon: "arrow-down", className: "twa:px-0 twa:py-0 twa:mr-1", disabled: !searchText, variant: "text", onClick: () => adaptable.api.quickSearchApi.gotoNextMatch() }))) }));
+    return ((0, jsx_runtime_1.jsx)(AdaptableFormControlTextClear_1.AdaptableFormControlTextClear, { onClick: props.onClick, "aria-label": 'Quick Search', type: "text", autoFocus: props.autoFocus, placeholder: adaptable.api.optionsApi.getQuickSearchOptions().quickSearchPlaceholder, className: (0, twMerge_1.twMerge)('ab-QuickSearch__control twa:h-full twa:min-h-input', props.className), value: searchText, OnTextChange: search, inputClassName: (0, twMerge_1.twMerge)('twa:w-[10rem]', props.inputClassName), actionTools: isServerSideRowModel ? null : ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "row", alignItems: "center", className: "twa:flex-none", children: [(0, jsx_runtime_1.jsx)(SimpleButton_1.default, { "aria-label": 'Previous Match', icon: "arrow-up", className: "twa:px-0 twa:py-0 twa:mr-1", disabled: !searchText, variant: "text", onClick: () => adaptable.api.quickSearchApi.gotoPreviousMatch() }), (0, jsx_runtime_1.jsx)(SimpleButton_1.default, { "aria-label": 'Next Match', icon: "arrow-down", className: "twa:px-0 twa:py-0 twa:mr-1", disabled: !searchText, variant: "text", onClick: () => adaptable.api.quickSearchApi.gotoNextMatch() })] })) }));
 };
 exports.QuickSearchInput = QuickSearchInput;

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

@@ -4,9 +4,13 @@ import { ModuleViewPopupProps } from '../Components/SharedProps/ModuleViewPopupP
 import { AdaptableStyle } from '../../AdaptableState/Common/AdaptableStyle';
 interface QuickSearchPopupProps extends ModuleViewPopupProps<any> {
     QuickSearchText: string;
-    QuickSearchStyle: AdaptableStyle;
+    QuickSearchTextMatchStyle: AdaptableStyle;
+    QuickSearchCurrentTextMatchStyle: AdaptableStyle;
+    QuickSearchCellMatchStyle: AdaptableStyle;
     onRunQuickSearch: (quickSearchText: string) => QuickSearchRedux.QuickSearchRunAction;
-    onSetMatchingCellStyle: (style: AdaptableStyle) => QuickSearchRedux.QuickSearchSetMatchingCellStyleAction;
+    onSetTextMatchingStyle: (style: AdaptableStyle) => QuickSearchRedux.QuickSearchSetTextMatchingStyleAction;
+    onSetCurrentTextMatchingStyle: (style: AdaptableStyle) => QuickSearchRedux.QuickSearchSetCurrentTextMatchingStyleAction;
+    onSetCellMatchingStyle: (style: AdaptableStyle) => QuickSearchRedux.QuickSearchSetMatchingCellStyleAction;
 }
 export declare const QuickSearchPopup: import("react-redux").ConnectedComponent<(props: QuickSearchPopupProps) => React.JSX.Element, {
     [x: string]: any;

package/src/View/QuickSearch/QuickSearchPopup.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.QuickSearchPopup = 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 react_redux_1 = require("react-redux");
 const QuickSearchRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/QuickSearchRedux"));
@@ -10,55 +10,45 @@ const PopupPanel_1 = require("../Components/Popups/AdaptablePopup/PopupPanel");
 const StyleComponent_1 = require("../Components/StyleComponent");
 const Flex_1 = require("../../components/Flex");
 const CheckBox_1 = require("../../components/CheckBox");
+const Tabs_1 = require("../../components/Tabs");
 const StringExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/StringExtensions"));
 const useQuickSearchDebounced_1 = require("./useQuickSearchDebounced");
 const QuickSearchInput_1 = require("./QuickSearchInput");
 const HelpBlock_1 = tslib_1.__importDefault(require("../../components/HelpBlock"));
 const Card_1 = require("../../components/Card");
+const QuickSearchStyleHelper_1 = require("../../Utilities/Helpers/QuickSearchStyleHelper");
+const QuickSearchStyleEditor = ({ api, helpText, headerText, style, updateStyle }) => ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:gap-2", children: [(0, jsx_runtime_1.jsx)(HelpBlock_1.default, { className: "twa:text-2", children: helpText }), (0, jsx_runtime_1.jsx)(StyleComponent_1.StyleComponent, { headless: true, hidePreview: true, className: "twa:h-full twa:flex-1 twa:rounded-none", headerText: headerText, api: api, Style: style, UpdateStyle: updateStyle })] }));
 const QuickSearchPopupComponent = (props) => {
     const [searchText, search] = (0, useQuickSearchDebounced_1.useQuickSearchDebounced)(props);
     const [state, setState] = (0, react_1.useState)({
         RunQueryAfterQuickSearch: props.api.optionsApi.getQuickSearchOptions().filterGridAfterQuickSearch,
-        EditedStyle: props.QuickSearchStyle,
     });
-    const onUpdateStyle = (style) => {
-        setState({ ...state, EditedStyle: style });
-        props.onSetMatchingCellStyle(style);
-    };
     const onQuickSearchBehaviourChange = (checked) => {
         setState({ ...state, RunQueryAfterQuickSearch: checked });
         props.api.optionsApi.getAdaptableOptions().quickSearchOptions.filterGridAfterQuickSearch =
             checked;
     };
-    return (React.createElement(PopupPanel_1.PopupPanel, { headerText: props.moduleInfo.FriendlyName, glyphicon: props.moduleInfo.Glyph, infoLink: props.moduleInfo.HelpPage, infoLinkDisabled: !props.api.internalApi.isDocumentationLinksDisplayed(), bodyClassName: "twa:gap-3 twa:flex twa:flex-col" },
-        React.createElement(Flex_1.Flex, { flexDirection: "column", className: "twa:h-full twa:gap-4" },
-            React.createElement(Card_1.Card, null,
-                React.createElement(Card_1.Card.Title, null, "Search Text"),
-                React.createElement(Card_1.Card.Body, { className: "twa:p-1 twa:w-fit" },
-                    React.createElement(QuickSearchInput_1.QuickSearchInput, null))),
-            React.createElement(Card_1.Card, null,
-                React.createElement(Card_1.Card.Title, null, "Behaviour"),
-                React.createElement(Card_1.Card.Body, { className: "twa:p-1", gap: 2 },
-                    React.createElement(HelpBlock_1.default, { className: "twa:text-2 twa:w-fit" },
-                        "Filter Grid when searching to only show rows with matching cells; ",
-                        React.createElement("b", null, "use with care"),
-                        " as can cause performance issues"),
-                    React.createElement(CheckBox_1.CheckBox, { "data-name": "filter-quick-search-results", value: "existing", checked: state.RunQueryAfterQuickSearch, disabled: StringExtensions_1.default.IsNotNullOrEmpty(searchText), onChange: onQuickSearchBehaviourChange }, "Filter using Quick Search Results"))),
-            React.createElement(Card_1.Card.Title, { border: false, className: "twa:pt-3" }, "Cell Matching Style"),
-            React.createElement(Card_1.Card, null,
-                React.createElement(Card_1.Card.Body, null,
-                    React.createElement(StyleComponent_1.StyleComponent, { headless: true, className: "twa:h-full twa:flex-1 twa:rounded-none", headerText: 'Cell Matching Style', api: props.api, Style: props.QuickSearchStyle, UpdateStyle: onUpdateStyle }))))));
+    const isServerSideRowModel = props.api.agGridApi.getGridOption('rowModelType') === 'serverSide';
+    return ((0, jsx_runtime_1.jsx)(PopupPanel_1.PopupPanel, { headerText: props.moduleInfo.FriendlyName, glyphicon: props.moduleInfo.Glyph, infoLink: props.moduleInfo.HelpPage, infoLinkDisabled: !props.api.internalApi.isDocumentationLinksDisplayed(), bodyClassName: "twa:gap-3 twa:flex twa:flex-col", children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:h-full twa:gap-4", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card, { children: [(0, jsx_runtime_1.jsx)(Card_1.Card.Title, { children: "Search Text" }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:p-1 twa:w-fit", children: (0, jsx_runtime_1.jsx)(QuickSearchInput_1.QuickSearchInput, {}) })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card, { children: [(0, jsx_runtime_1.jsx)(Card_1.Card.Title, { children: "Behaviour" }), (0, jsx_runtime_1.jsxs)(Card_1.Card.Body, { className: "twa:p-1", gap: 2, children: [(0, jsx_runtime_1.jsxs)(HelpBlock_1.default, { className: "twa:text-2 twa:w-fit", children: ["Filter Grid when searching to only show rows with matching cells; ", (0, jsx_runtime_1.jsx)("b", { children: "use with care" }), " as can cause performance issues"] }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "filter-quick-search-results", value: "existing", checked: state.RunQueryAfterQuickSearch, disabled: StringExtensions_1.default.IsNotNullOrEmpty(searchText), onChange: onQuickSearchBehaviourChange, children: "Filter using Quick Search Results" })] })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card, { children: [(0, jsx_runtime_1.jsx)(Card_1.Card.Title, { children: "Matching Styles" }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:p-0", children: isServerSideRowModel ? ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:p-2", children: (0, jsx_runtime_1.jsx)(QuickSearchStyleEditor, { api: props.api, helpText: "Server-side row model: styles the whole matching cell.", headerText: "Cell Matching Style", style: props.QuickSearchCellMatchStyle, updateStyle: props.onSetCellMatchingStyle }) })) : ((0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { defaultValue: "text", className: "twa:min-h-0", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { value: "text", children: "Text Match" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { value: "current", children: "Current Match" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { value: "cell", children: "Cell Match" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { value: "text", children: (0, jsx_runtime_1.jsx)(QuickSearchStyleEditor, { api: props.api, helpText: "Highlights the matching text within each cell (AG Grid Find).", headerText: "Text Matching Style", style: props.QuickSearchTextMatchStyle, updateStyle: props.onSetTextMatchingStyle }) }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { value: "current", children: (0, jsx_runtime_1.jsx)(QuickSearchStyleEditor, { api: props.api, helpText: "Applied to the active match when cycling through results.", headerText: "Current Match Style", style: props.QuickSearchCurrentTextMatchStyle, updateStyle: props.onSetCurrentTextMatchingStyle }) }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { value: "cell", children: (0, jsx_runtime_1.jsx)(QuickSearchStyleEditor, { api: props.api, helpText: "Optional background for whole matching cells. When unset, only matching text is highlighted.", headerText: "Cell Matching Style", style: props.QuickSearchCellMatchStyle, updateStyle: props.onSetCellMatchingStyle }) })] })) })] })] }) }));
 };
 function mapStateToProps(state, ownProps) {
+    const quickSearch = state.QuickSearch;
     return {
-        QuickSearchText: state.QuickSearch.QuickSearchText,
-        QuickSearchStyle: state.QuickSearch.CellMatchStyle ?? {},
+        QuickSearchText: quickSearch.QuickSearchText,
+        QuickSearchTextMatchStyle: (0, QuickSearchStyleHelper_1.resolveQuickSearchTextMatchStyle)(quickSearch),
+        QuickSearchCurrentTextMatchStyle: (0, QuickSearchStyleHelper_1.resolveQuickSearchCurrentTextMatchStyle)(quickSearch),
+        // Cell match: show only what is in state — defaults are not applied until explicitly set
+        QuickSearchCellMatchStyle: (0, QuickSearchStyleHelper_1.isQuickSearchStyleUnset)(quickSearch.CellMatchStyle)
+            ? {}
+            : quickSearch.CellMatchStyle,
     };
 }
 function mapDispatchToProps(dispatch) {
     return {
         onRunQuickSearch: (quickSearchText) => dispatch(QuickSearchRedux.QuickSearchRun(quickSearchText)),
-        onSetMatchingCellStyle: (style) => dispatch(QuickSearchRedux.QuickSearchSetCellMatchingStyle(style)),
+        onSetTextMatchingStyle: (style) => dispatch(QuickSearchRedux.QuickSearchSetTextMatchingStyle(style)),
+        onSetCurrentTextMatchingStyle: (style) => dispatch(QuickSearchRedux.QuickSearchSetCurrentTextMatchingStyle(style)),
+        onSetCellMatchingStyle: (style) => dispatch(QuickSearchRedux.QuickSearchSetCellMatchingStyle(style)),
     };
 }
 exports.QuickSearchPopup = (0, react_redux_1.connect)(mapStateToProps, mapDispatchToProps)(QuickSearchPopupComponent);

package/src/View/QuickSearch/QuickSearchStatusBarContent.js

@@ -1,10 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.QuickSearchStatusBarContent = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const QuickSearchInput_1 = require("./QuickSearchInput");
 const QuickSearchStatusBarContent = () => {
-    return React.createElement(QuickSearchInput_1.QuickSearchInput, { onClick: (event) => event.stopPropagation() });
+    return (0, jsx_runtime_1.jsx)(QuickSearchInput_1.QuickSearchInput, { onClick: (event) => event.stopPropagation() });
 };
 exports.QuickSearchStatusBarContent = QuickSearchStatusBarContent;

package/src/View/QuickSearch/QuickSearchViewPanel.js

@@ -1,11 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.QuickSearchViewPanelControl = void 0;
-const tslib_1 = require("tslib");
-const React = tslib_1.__importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const QuickSearchInput_1 = require("./QuickSearchInput");
 const QuickSearchViewPanelControl = (props) => {
     let elementType = props.viewType === 'ToolPanel' ? 'DashboardToolbar' : 'ToolPanel';
-    return (React.createElement(QuickSearchInput_1.QuickSearchInput, { className: `ab-${elementType}__QuickSearch__text`, inputClassName: "twa:w-[15rem]" }));
+    return ((0, jsx_runtime_1.jsx)(QuickSearchInput_1.QuickSearchInput, { className: `ab-${elementType}__QuickSearch__text`, inputClassName: "twa:w-[15rem]" }));
 };
 exports.QuickSearchViewPanelControl = QuickSearchViewPanelControl;