@adaptabletools/adaptable-cjs 23.0.0-canary.8 → 23.0.0-canary.9

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

@@ -4,8 +4,8 @@ exports.FormatColumnFormatWizardSection = exports.getFormatDisplayTypeForScope =
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
-const uniq_1 = tslib_1.__importDefault(require("../../../Utilities/utils/uniq"));
-const clamp_1 = tslib_1.__importDefault(require("../../../Utilities/utils/clamp"));
+const ArrayExtensions_1 = require("../../../Utilities/Extensions/ArrayExtensions");
+const NumberExtensions_1 = require("../../../Utilities/Extensions/NumberExtensions");
 const HelpBlock_1 = tslib_1.__importDefault(require("../../../components/HelpBlock"));
 const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
 const SimpleButton_1 = tslib_1.__importDefault(require("../../../components/SimpleButton"));
@@ -18,7 +18,7 @@ const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const StringExtensions_1 = tslib_1.__importDefault(require("../../../Utilities/Extensions/StringExtensions"));
 const Tag_1 = require("../../../components/Tag");
 const AdaptableContext_1 = require("../../AdaptableContext");
-const FormatHelper_1 = tslib_1.__importDefault(require("../../../Utilities/Helpers/FormatHelper"));
+const DisplayFormatHelper_1 = tslib_1.__importDefault(require("../../../Utilities/Helpers/DisplayFormatHelper"));
 const Toggle_1 = require("../../../components/Toggle");
 const GeneralConstants_1 = require("../../../Utilities/Constants/GeneralConstants");
 const Textarea_1 = tslib_1.__importDefault(require("../../../components/Textarea"));
@@ -193,7 +193,7 @@ const getFormatDisplayTypeForScope = (scope, api) => {
     // Check for ColumnIds in scope
     if ('ColumnIds' in scope) {
         const columns = scope.ColumnIds.map((c) => api.columnApi.getColumnWithColumnId(c)).filter(Boolean);
-        const columnDataTypes = (0, uniq_1.default)(columns.map((c) => c.dataType));
+        const columnDataTypes = (0, ArrayExtensions_1.uniq)(columns.map((c) => c.dataType));
         // If there's only one data type
         if (columnDataTypes.length === 1) {
             const dataType = columnDataTypes[0];
@@ -298,7 +298,7 @@ const DATE_FORMAT_PRESET_HEADER_HEIGHT = 40;
 const DateFormatPresetsTable = ({ onApplyPattern }) => {
     const rows = React.useMemo(() => DateFormatPresets.map((pattern) => ({
         pattern,
-        formattedDate: FormatHelper_1.default.DateFormatter(new Date(), { Pattern: pattern }) ?? '',
+        formattedDate: DisplayFormatHelper_1.default.DateFormatter(new Date(), { Pattern: pattern }) ?? '',
     })), []);
     const columns = React.useMemo(() => ({
         pattern: {
@@ -331,7 +331,7 @@ const renderDateFormat = (data, _onChange, setFormatOption, scopedCustomFormatte
         return null;
     }
     return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:gap-3 twa:p-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Format" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Enter a Unicode date pattern (e.g. dd/MM/yyyy), or pick a preset below" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsx)(FormLayout_1.default, { children: (0, jsx_runtime_1.jsxs)(FormLayout_1.FormRow, { label: "Pattern", children: [(0, jsx_runtime_1.jsx)(Input_1.default, { "data-name": "pattern", value: resolved.Options.Pattern ?? '', onChange: (e) => setFormatOption('Pattern', e.currentTarget.value), className: "twa:mr-2" }), (0, jsx_runtime_1.jsx)("span", { children: resolved.Options.Pattern &&
-                                            FormatHelper_1.default.DateFormatter(new Date(), resolved.Options, true) })] }) }) })] }), scopedCustomFormatters.length > 0 && ((0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Custom Formats" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Apply a developer-defined formatter to this Column" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsx)(FormLayout_1.default, { children: scopedCustomFormatters.map((formatter) => renderCustomFormatter(data, formatter, setFormatOption)) }) })] })), (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Presets" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Apply a common date pattern as a starting point" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:px-0 twa:pt-0 twa:pb-1", children: (0, jsx_runtime_1.jsx)(DateFormatPresetsTable, { onApplyPattern: (pattern) => setFormatOption('Pattern', pattern) }) })] })] }));
+                                            DisplayFormatHelper_1.default.DateFormatter(new Date(), resolved.Options, true) })] }) }) })] }), scopedCustomFormatters.length > 0 && ((0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Custom Formats" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Apply a developer-defined formatter to this Column" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsx)(FormLayout_1.default, { children: scopedCustomFormatters.map((formatter) => renderCustomFormatter(data, formatter, setFormatOption)) }) })] })), (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Presets" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Apply a common date pattern as a starting point" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:px-0 twa:pt-0 twa:pb-1", children: (0, jsx_runtime_1.jsx)(DateFormatPresetsTable, { onApplyPattern: (pattern) => setFormatOption('Pattern', pattern) }) })] })] }));
 };
 const renderNumberFormat = (data, onChange, setFormatOption, scopedCustomFormatters, api) => {
     const resolved = (0, AdaptableFormatPresets_1.resolveDisplayFormat)(data.DisplayFormat);
@@ -367,9 +367,9 @@ const renderNumberFormat = (data, onChange, setFormatOption, scopedCustomFormatt
     return ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", "data-name": 'format-column-display-format', className: "twa:gap-3 twa:p-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Presets" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Pick a common numeric preset as a starting point" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "row", className: "twa:m-2", children: [(0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:mr-6", children: [(0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-dollar", className: "twa:my-1", checked: IS_DOLLAR, onChange: () => setPreset('Dollar'), children: "Dollar" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-sterling", className: "twa:my-1", checked: IS_STERLING, onChange: () => setPreset('Sterling'), children: "Sterling" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-euro", className: "twa:my-1", checked: IS_EURO, onChange: () => setPreset('Euro'), children: "Euro" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-yen", className: "twa:my-1", checked: IS_YEN, onChange: () => setPreset('Yen'), children: "Yen" })] }), (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:mr-6", children: [(0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-thousand", className: "twa:my-1", checked: IS_THOUSAND, onChange: () => setPreset('Thousand'), children: "K (Thousand)" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-million", className: "twa:my-1", checked: IS_MILLION, onChange: () => setPreset('Million'), children: "M (Million)" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-billion", className: "twa:my-1", checked: IS_BILLION, onChange: () => setPreset('Billion'), children: "B (Billion)" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-basis-points", className: "twa:my-1", checked: IS_BASIS_POINTS, onChange: () => setPreset('BasisPoints'), children: "bps (Basis Pts)" })] }), (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:mr-6", children: [(0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-integer", className: "twa:my-1", checked: IS_INTEGER, onChange: () => setPreset('Integer'), children: "Integer" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-decimal", className: "twa:my-1", checked: IS_DECIMAL, onChange: () => setPreset('Decimal'), children: "Decimal" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-percentage", className: "twa:my-1", checked: IS_PERCENT, onChange: () => setPreset('Percentage'), children: "Percentage" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-scientific", className: "twa:my-1", checked: IS_SCIENTIFIC, onChange: () => setPreset('Scientific'), children: "Scientific" })] }), (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", children: [(0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-accounting", className: "twa:my-1", checked: IS_ACCOUNTING, onChange: () => setPreset('Accounting'), children: "Accounting" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-fx-rate", className: "twa:my-1", checked: IS_FX_RATE, onChange: () => setPreset('FXRate'), children: "FX Rate" }), (0, jsx_runtime_1.jsx)(Radio_1.default, { "data-name": "preset-bitcoin", className: "twa:my-1", checked: IS_BITCOIN, onChange: () => setPreset('Bitcoin'), children: "Bitcoin" })] })] }) })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:pl-0", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Format" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Fine-tune digits, separators, prefix / suffix and rounding behaviour" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:px-0 twa:pt-0 twa:pb-1", children: (0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:flex twa:flex-row twa:items-start twa:-ml-0.5", children: [(0, jsx_runtime_1.jsxs)(FormLayout_1.default, { sizes: NUMBER_FORMAT_DIGIT_FORM_SIZES, columns: [NUMBER_FORMAT_LABEL_COLUMN, { name: 'children' }], className: "twa:mr-6 twa:shrink-0", children: [(0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Fraction Digits", children: (0, jsx_runtime_1.jsx)(Input_1.default, { className: NUMBER_FORMAT_INPUT_CLASS, "data-name": "fraction-digits", type: "number", min: "0", value: typeof resolved.Options.FractionDigits === 'number'
                                                     ? resolved.Options.FractionDigits
                                                     : '', onChange: (e) => setFormatOption('FractionDigits', StringExtensions_1.default.IsNumeric(e.currentTarget.value)
-                                                    ? (0, clamp_1.default)(Number(e.currentTarget.value), 0, 20)
+                                                    ? (0, NumberExtensions_1.clamp)(Number(e.currentTarget.value), 0, 20)
                                                     : undefined) }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Integer Digits", children: (0, jsx_runtime_1.jsx)(Input_1.default, { className: NUMBER_FORMAT_INPUT_CLASS, "data-name": "integer-digits", type: "number", min: "0", value: resolved.Options.IntegerDigits, onChange: (e) => setFormatOption('IntegerDigits', StringExtensions_1.default.IsNumeric(e.currentTarget.value)
-                                                    ? (0, clamp_1.default)(Number(e.currentTarget.value), 0, 20)
+                                                    ? (0, NumberExtensions_1.clamp)(Number(e.currentTarget.value), 0, 20)
                                                     : undefined) }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Fraction Separator", children: (0, jsx_runtime_1.jsx)(Input_1.default, { className: NUMBER_FORMAT_INPUT_CLASS, "data-name": "fraction-separator", value: resolved.Options.FractionSeparator ?? '', onChange: (e) => setFormatOption('FractionSeparator', e.currentTarget.value) }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Integer Separator", children: (0, jsx_runtime_1.jsx)(Input_1.default, { className: NUMBER_FORMAT_INPUT_CLASS, "data-name": "integer-separator", value: resolved.Options.IntegerSeparator ?? '', onChange: (e) => setFormatOption('IntegerSeparator', e.currentTarget.value) }) })] }), (0, jsx_runtime_1.jsxs)(FormLayout_1.default, { sizes: NUMBER_FORMAT_VALUE_FORM_SIZES, columns: [NUMBER_FORMAT_LABEL_COLUMN, NUMBER_FORMAT_VALUE_CHILDREN_COLUMN], className: "twa:mr-5 twa:shrink-0", children: [(0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Multiplier", children: (0, jsx_runtime_1.jsx)(Input_1.default, { className: NUMBER_FORMAT_INPUT_CLASS, "data-name": "multiplier", type: "number", value: resolved.Options.Multiplier, onChange: (e) => setFormatOption('Multiplier', Number(e.currentTarget.value)) }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Prefix", children: (0, jsx_runtime_1.jsx)(Input_1.default, { className: NUMBER_FORMAT_INPUT_CLASS, "data-name": "prefix", value: resolved.Options.Prefix ?? '', onChange: (e) => setFormatOption('Prefix', e.currentTarget.value) }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Suffix", children: (0, jsx_runtime_1.jsx)(Input_1.default, { className: NUMBER_FORMAT_INPUT_CLASS, "data-name": "suffix", value: resolved.Options.Suffix ?? '', onChange: (e) => setFormatOption('Suffix', e.currentTarget.value) }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Zero Display", children: (0, jsx_runtime_1.jsx)(Input_1.default, { className: NUMBER_FORMAT_INPUT_CLASS, "data-name": "zero-display", value: resolved.Options.ZeroDisplay === undefined ||
                                                     resolved.Options.ZeroDisplay === '0'
                                                     ? '0'
@@ -390,25 +390,25 @@ const renderNumberFormat = (data, onChange, setFormatOption, scopedCustomFormatt
                                 ] }), (0, jsx_runtime_1.jsx)(AdaptableObjectRow_1.AdaptableObjectRow, { colItems: [
                                     { Content: GeneralConstants_1.DEFAULT_DOUBLE_DISPLAY_VALUE, Size: 1 },
                                     {
-                                        Content: FormatHelper_1.default.NumberFormatter(GeneralConstants_1.DEFAULT_DOUBLE_DISPLAY_VALUE, resolved.Options),
+                                        Content: DisplayFormatHelper_1.default.NumberFormatter(GeneralConstants_1.DEFAULT_DOUBLE_DISPLAY_VALUE, resolved.Options),
                                         Size: 1,
                                     },
                                 ] }), (0, jsx_runtime_1.jsx)(AdaptableObjectRow_1.AdaptableObjectRow, { colItems: [
                                     { Content: '-' + GeneralConstants_1.DEFAULT_DOUBLE_DISPLAY_VALUE, Size: 1 },
                                     {
-                                        Content: FormatHelper_1.default.NumberFormatter(-GeneralConstants_1.DEFAULT_DOUBLE_DISPLAY_VALUE, resolved.Options),
+                                        Content: DisplayFormatHelper_1.default.NumberFormatter(-GeneralConstants_1.DEFAULT_DOUBLE_DISPLAY_VALUE, resolved.Options),
                                         Size: 1,
                                     },
                                 ] }), (0, jsx_runtime_1.jsx)(AdaptableObjectRow_1.AdaptableObjectRow, { colItems: [
                                     { Content: '0.123', Size: 1 },
                                     {
-                                        Content: FormatHelper_1.default.NumberFormatter(0.123, resolved.Options),
+                                        Content: DisplayFormatHelper_1.default.NumberFormatter(0.123, resolved.Options),
                                         Size: 1,
                                     },
                                 ] }), (0, jsx_runtime_1.jsx)(AdaptableObjectRow_1.AdaptableObjectRow, { colItems: [
                                     { Content: '0', Size: 1 },
                                     {
-                                        Content: FormatHelper_1.default.NumberFormatter(0, resolved.Options),
+                                        Content: DisplayFormatHelper_1.default.NumberFormatter(0, resolved.Options),
                                         Size: 1,
                                     },
                                 ] })] })] })] }));
@@ -426,7 +426,7 @@ const renderStringFormat = (data, _onChange, setFormatOption, scopedCustomFormat
                                     { Content: '"' + GeneralConstants_1.DEFAULT_STRING_DISPLAY_VALUE + '"', Size: 1 },
                                     {
                                         Content: '"' +
-                                            FormatHelper_1.default.StringFormatter(GeneralConstants_1.DEFAULT_STRING_DISPLAY_VALUE, resolved.Options) +
+                                            DisplayFormatHelper_1.default.StringFormatter(GeneralConstants_1.DEFAULT_STRING_DISPLAY_VALUE, resolved.Options) +
                                             '"',
                                         Size: 1,
                                     },

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

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const AdaptableFormatPresets_1 = require("../../../AdaptableState/Common/AdaptableFormatPresets");
 const GeneralConstants_1 = require("../../../Utilities/Constants/GeneralConstants");
-const FormatHelper_1 = tslib_1.__importDefault(require("../../../Utilities/Helpers/FormatHelper"));
+const DisplayFormatHelper_1 = tslib_1.__importDefault(require("../../../Utilities/Helpers/DisplayFormatHelper"));
 const StyleHelper_1 = require("../../../Utilities/Helpers/StyleHelper");
 const Card_1 = require("../../../components/Card");
 const Flex_1 = require("../../../components/Flex");
@@ -52,13 +52,13 @@ const getFormatColumnPreviewText = (formatColumn, api) => {
         return String(sample);
     }
     if (resolved.Formatter === 'NumberFormatter' && typeof sample === 'number') {
-        return FormatHelper_1.default.NumberFormatter(sample, resolved.Options) ?? String(sample);
+        return DisplayFormatHelper_1.default.NumberFormatter(sample, resolved.Options) ?? String(sample);
     }
     if (resolved.Formatter === 'DateFormatter') {
-        return FormatHelper_1.default.DateFormatter(new Date(), resolved.Options) ?? String(sample);
+        return DisplayFormatHelper_1.default.DateFormatter(new Date(), resolved.Options) ?? String(sample);
     }
     if (resolved.Formatter === 'StringFormatter' && typeof sample === 'string') {
-        return FormatHelper_1.default.StringFormatter(sample, resolved.Options) ?? sample;
+        return DisplayFormatHelper_1.default.StringFormatter(sample, resolved.Options) ?? sample;
     }
     return String(sample);
 };

package/src/View/FreeTextColumn/Wizard/FreeTextColumnSettingsWizardSection.js

@@ -8,7 +8,7 @@ const Radio_1 = tslib_1.__importStar(require("../../../components/Radio"));
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const AdaptableInput_1 = tslib_1.__importDefault(require("../../Components/AdaptableInput"));
 const CheckBox_1 = require("../../../components/CheckBox");
-const FormatHelper_1 = require("../../../Utilities/Helpers/FormatHelper");
+const DisplayFormatHelper_1 = require("../../../Utilities/Helpers/DisplayFormatHelper");
 const DateHelper_1 = require("../../../Utilities/Helpers/DateHelper");
 const Tag_1 = require("../../../components/Tag");
 const SpecialColumnSettingsWizardStep_1 = require("../../SpecialColumnSettingsWizardStep");
@@ -56,7 +56,7 @@ const FreeTextColumnSettingsWizardSection = (props) => {
         let e = event.target;
         let DefaultValue = e.value;
         if (data.FreeTextColumnSettings.DataType === 'date') {
-            DefaultValue = (0, FormatHelper_1.DateFormatter)(DefaultValue, {
+            DefaultValue = (0, DisplayFormatHelper_1.DateFormatter)(DefaultValue, {
                 Pattern,
             });
         }

package/src/View/Layout/LayoutViewPanel.js

@@ -6,7 +6,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const PopupRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/PopupRedux"));
 const react_redux_1 = require("react-redux");
-const isEqual_1 = tslib_1.__importDefault(require("../../Utilities/utils/isEqual"));
+const ObjectExtensions_1 = require("../../Utilities/Extensions/ObjectExtensions");
 const join_1 = tslib_1.__importDefault(require("../../components/utils/join"));
 const LayoutRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/LayoutRedux"));
 const GeneralConstants = tslib_1.__importStar(require("../../Utilities/Constants/GeneralConstants"));
@@ -24,7 +24,7 @@ const NewSelect_1 = require("../../components/NewSelect");
 exports.COMPONENT_LAYOUT_POPUP_NAME = 'LayoutEditorStandalonePopup';
 const LayoutViewPanelComponent = (props) => {
     const { Layouts, CurrentLayoutName, accessLevel, viewType, api, onSelectLayout, showMissingLayoutsError, } = props;
-    const isErrorLayout = !Layouts.length || (Layouts.length === 1 && (0, isEqual_1.default)(Layouts[0], GeneralConstants_1.ERROR_LAYOUT));
+    const isErrorLayout = !Layouts.length || (Layouts.length === 1 && (0, ObjectExtensions_1.isEqual)(Layouts[0], GeneralConstants_1.ERROR_LAYOUT));
     React.useEffect(() => {
         if (isErrorLayout) {
             showMissingLayoutsError();

package/src/View/Note/NoteEditor.js

@@ -3,7 +3,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 TimingHelper_1 = require("../../Utilities/Helpers/TimingHelper");
 const React = tslib_1.__importStar(require("react"));
 const Textarea_1 = tslib_1.__importDefault(require("../../components/Textarea"));
 const SimpleButton_1 = tslib_1.__importDefault(require("../../components/SimpleButton"));
@@ -15,7 +15,7 @@ const NoteEditor = ({ note, onNoteChange, onClose, editMode, isReadonly }) => {
     const textAreaRef = React.useRef(null);
     const [liveValue, setLiveValue] = React.useState(note || '');
     const throttledOnChange = React.useMemo(() => {
-        const throttled = (0, throttle_1.default)((value) => onNoteChange(value), 300);
+        const throttled = (0, TimingHelper_1.throttle)((value) => onNoteChange(value), 300);
         return (value) => {
             setLiveValue(value);
             throttled(value);

package/src/View/Note/NotePopup.js

@@ -11,7 +11,7 @@ const AdaptableContext_1 = require("../AdaptableContext");
 const AdaptableButton_1 = require("../Components/AdaptableButton");
 const PopupPanel_1 = require("../Components/Popups/AdaptablePopup/PopupPanel");
 const StringExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/StringExtensions"));
-const FormatHelper_1 = tslib_1.__importDefault(require("../../Utilities/Helpers/FormatHelper"));
+const DisplayFormatHelper_1 = tslib_1.__importDefault(require("../../Utilities/Helpers/DisplayFormatHelper"));
 const GeneralConstants_1 = require("../../Utilities/Constants/GeneralConstants");
 const tableDOMProps = {
     style: {
@@ -40,7 +40,7 @@ const NotePopup = (props) => {
     const isReadOnlyModule = adaptable.api.entitlementApi.getEntitlementAccessLevelForModule('Note') ===
         GeneralConstants_1.ACCESS_LEVEL_READ_ONLY;
     const formatDate = (date, format) => {
-        return FormatHelper_1.default.DateFormatter(date, { Pattern: format });
+        return DisplayFormatHelper_1.default.DateFormatter(date, { Pattern: format });
     };
     const columnsMap = React.useMemo(() => {
         const columns = {

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

@@ -9,10 +9,10 @@ const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const Tag_1 = require("../../../components/Tag");
 const Flex_1 = require("../../../components/Flex");
 const Card_1 = require("../../../components/Card");
-const plusMinusTriggerKeys_1 = require("../../../Utilities/Helpers/plusMinusTriggerKeys");
+const PlusMinusHelper_1 = require("../../../Utilities/Helpers/PlusMinusHelper");
 const PlusMinusSettingsSummary = () => {
     const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    const { incrementKey, decrementKey } = (0, plusMinusTriggerKeys_1.resolvePlusMinusTriggerKeysForNudge)(data, api.optionsApi.getEditOptions().plusMinusOptions ?? {});
+    const { incrementKey, decrementKey } = (0, PlusMinusHelper_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 })] })] }));
 };
 exports.PlusMinusSettingsSummary = PlusMinusSettingsSummary;
@@ -31,7 +31,7 @@ const isSettingsValid = (data, api, _context) => {
     if (data.NudgeValue === 0) {
         return 'Nudge value must not be zero.';
     }
-    if ((0, plusMinusTriggerKeys_1.plusMinusResolvedKeysConflict)(data, api.optionsApi.getEditOptions().plusMinusOptions ?? {})) {
+    if ((0, PlusMinusHelper_1.plusMinusResolvedKeysConflict)(data, api.optionsApi.getEditOptions().plusMinusOptions ?? {})) {
         return 'Increment and decrement keys cannot be the same for this nudge.';
     }
     return true;
@@ -40,8 +40,8 @@ exports.isSettingsValid = isSettingsValid;
 const PlusMinusSettingsWizardSection = (props) => {
     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 incrementBaseline = (0, PlusMinusHelper_1.plusMinusIncrementKeyFromOptionsOnly)(pmOpts);
+    const decrementBaseline = (0, PlusMinusHelper_1.plusMinusDecrementKeyFromOptionsOnly)(pmOpts);
     const [incrementEdit, setIncrementEdit] = React.useState(undefined);
     const [decrementEdit, setDecrementEdit] = React.useState(undefined);
     React.useEffect(() => {
@@ -60,7 +60,7 @@ const PlusMinusSettingsWizardSection = (props) => {
             : decrementBaseline;
     const commitIncrementKey = React.useCallback((raw) => {
         const trimmed = raw.trim();
-        const next = trimmed === '' || (0, plusMinusTriggerKeys_1.plusMinusTriggerSameAsBaseline)(trimmed, incrementBaseline)
+        const next = trimmed === '' || (0, PlusMinusHelper_1.plusMinusTriggerSameAsBaseline)(trimmed, incrementBaseline)
             ? undefined
             : trimmed;
         const prev = data.IncrementKey?.trim() || undefined;
@@ -70,7 +70,7 @@ const PlusMinusSettingsWizardSection = (props) => {
     }, [data, incrementBaseline, props.onChange]);
     const commitDecrementKey = React.useCallback((raw) => {
         const trimmed = raw.trim();
-        const next = trimmed === '' || (0, plusMinusTriggerKeys_1.plusMinusTriggerSameAsBaseline)(trimmed, decrementBaseline)
+        const next = trimmed === '' || (0, PlusMinusHelper_1.plusMinusTriggerSameAsBaseline)(trimmed, decrementBaseline)
             ? undefined
             : trimmed;
         const prev = data.DecrementKey?.trim() || undefined;

package/src/View/QuickSearch/QuickSearchPopup.js

@@ -15,7 +15,7 @@ const StringExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Exte
 const useQuickSearchDebounced_1 = require("./useQuickSearchDebounced");
 const QuickSearchInput_1 = require("./QuickSearchInput");
 const Card_1 = require("../../components/Card");
-const QuickSearchStyleHelper_1 = require("../../Utilities/Helpers/QuickSearchStyleHelper");
+const QuickSearchHelper_1 = require("../../Utilities/Helpers/QuickSearchHelper");
 const QuickSearchStyleEditor = ({ api, helpText, headerText, style, updateStyle }) => ((0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: headerText }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: helpText })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:p-1", children: (0, jsx_runtime_1.jsx)(StyleComponent_1.StyleComponent, { headless: true, hidePreview: true, className: "twa:h-full twa:flex-1 twa:rounded-none", api: api, Style: style, UpdateStyle: updateStyle }) })] }));
 const QuickSearchPopupComponent = (props) => {
     const [searchText, search] = (0, useQuickSearchDebounced_1.useQuickSearchDebounced)(props);
@@ -34,10 +34,10 @@ function mapStateToProps(state, ownProps) {
     const quickSearch = state.QuickSearch;
     return {
         QuickSearchText: quickSearch.QuickSearchText,
-        QuickSearchTextMatchStyle: (0, QuickSearchStyleHelper_1.resolveQuickSearchTextMatchStyle)(quickSearch),
-        QuickSearchCurrentTextMatchStyle: (0, QuickSearchStyleHelper_1.resolveQuickSearchCurrentTextMatchStyle)(quickSearch),
+        QuickSearchTextMatchStyle: (0, QuickSearchHelper_1.resolveQuickSearchTextMatchStyle)(quickSearch),
+        QuickSearchCurrentTextMatchStyle: (0, QuickSearchHelper_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)
+        QuickSearchCellMatchStyle: (0, QuickSearchHelper_1.isQuickSearchStyleUnset)(quickSearch.CellMatchStyle)
             ? {}
             : quickSearch.CellMatchStyle,
     };

package/src/View/QuickSearch/useQuickSearchDebounced.js

@@ -1,13 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useQuickSearchDebounced = void 0;
-const tslib_1 = require("tslib");
 const react_1 = require("react");
-const debounce_1 = tslib_1.__importDefault(require("../../Utilities/utils/debounce"));
+const TimingHelper_1 = require("../../Utilities/Helpers/TimingHelper");
 const GeneralConstants_1 = require("../../Utilities/Constants/GeneralConstants");
 const useQuickSearchDebounced = (props) => {
     const [searchText, setSearchText] = (0, react_1.useState)(props.QuickSearchText ?? '');
-    const debouncedRunQuickSearch = (0, react_1.useMemo)(() => (0, debounce_1.default)(props.onRunQuickSearch, GeneralConstants_1.QUICK_SEARCH_DEBOUNCE_TIME), [props.onRunQuickSearch]);
+    const debouncedRunQuickSearch = (0, react_1.useMemo)(() => (0, TimingHelper_1.debounce)(props.onRunQuickSearch, GeneralConstants_1.QUICK_SEARCH_DEBOUNCE_TIME), [props.onRunQuickSearch]);
     (0, react_1.useEffect)(() => {
         setSearchText(props.QuickSearchText);
     }, [props.QuickSearchText]);

package/src/View/Schedule/Wizard/ScheduleScheduleWizard.js

@@ -13,7 +13,7 @@ const Flex_1 = require("../../../components/Flex");
 const Card_1 = require("../../../components/Card");
 const NewSelect_1 = require("../../../components/NewSelect");
 const ObjectFactory_1 = tslib_1.__importDefault(require("../../../Utilities/ObjectFactory"));
-const ScheduleHelper_1 = require("../../../Utilities/Helpers/ScheduleHelper");
+const ScheduleHelper_1 = require("../../../Utilities/Helpers/Scheduling/ScheduleHelper");
 const isScheduleValid = (holder) => {
     if (!holder?.Schedule) {
         return 'Schedule is not specified';

package/src/View/SpecialColumnSettingsWizardStep.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.SpecialColumnSettingsWizardStep = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const chunk_1 = tslib_1.__importDefault(require("../Utilities/utils/chunk"));
+const ArrayExtensions_1 = require("../Utilities/Extensions/ArrayExtensions");
 const CheckBox_1 = require("../components/CheckBox");
 const FormLayout_1 = tslib_1.__importStar(require("../components/FormLayout"));
 const AdaptableContext_1 = require("./AdaptableContext");
@@ -39,6 +39,6 @@ const SpecialColumnSettingsWizardStep = (props) => {
                                 { name: 'first', size: '30%' },
                                 { size: '30%', name: 'second' },
                                 { size: '30%', name: 'third' },
-                            ], children: [(0, jsx_runtime_1.jsxs)(FormLayout_1.FormRow, { children: [(0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "filterable", checked: Filterable, onChange: (Filterable) => onSettingsChange({ Filterable }), disabled: !adaptable.api.optionsApi.getFilterOptions().enableFilterOnSpecialColumns, children: "Filterable" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "resizable", checked: Resizable, onChange: (Resizable) => onSettingsChange({ Resizable }), children: "Resizable" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "groupable", checked: Groupable, onChange: (Groupable) => onSettingsChange({ Groupable }), children: "Groupable" })] }), (0, jsx_runtime_1.jsxs)(FormLayout_1.FormRow, { children: [(0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "sortable", checked: Sortable, onChange: (Sortable) => onSettingsChange({ Sortable }), children: "Sortable" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "pivotable", checked: Pivotable, onChange: (Pivotable) => onSettingsChange({ Pivotable }), children: "Pivotable" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "aggregatable", checked: Aggregatable, onChange: (Aggregatable) => onSettingsChange({ Aggregatable }), children: "Aggregatable" })] }), (0, jsx_runtime_1.jsxs)(FormLayout_1.FormRow, { children: [(0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "suppres-smenu", checked: SuppressMenu, onChange: (SuppressMenu) => onSettingsChange({ SuppressMenu }), children: "Suppress Menu" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "suppres-movable", checked: SuppressMovable, onChange: (SuppressMovable) => onSettingsChange({ SuppressMovable }), children: "Suppress Movable" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { disabled: true, checked: props.isEditable, children: "Editable" })] })] }) })] }), Boolean(possibleColumnTypes?.length) && ((0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Column Types" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Assign custom column types to this column" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsx)(FormLayout_1.default, { columns: [{ name: 'first', size: '30%' }, { name: 'second' }], children: (0, chunk_1.default)(possibleColumnTypes ?? [], 2)?.map(([first, second]) => ((0, jsx_runtime_1.jsxs)(FormLayout_1.FormRow, { children: [first && ((0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": first, onChange: (checked) => handleColumnTypeChange(first, checked), checked: props.settings?.ColumnTypes?.includes?.(first), children: first })), second && ((0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": second, onChange: (checked) => handleColumnTypeChange(second, checked), checked: props.settings?.ColumnTypes?.includes?.(second), children: second }))] }, first))) }) })] }))] }));
+                            ], children: [(0, jsx_runtime_1.jsxs)(FormLayout_1.FormRow, { children: [(0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "filterable", checked: Filterable, onChange: (Filterable) => onSettingsChange({ Filterable }), disabled: !adaptable.api.optionsApi.getFilterOptions().enableFilterOnSpecialColumns, children: "Filterable" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "resizable", checked: Resizable, onChange: (Resizable) => onSettingsChange({ Resizable }), children: "Resizable" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "groupable", checked: Groupable, onChange: (Groupable) => onSettingsChange({ Groupable }), children: "Groupable" })] }), (0, jsx_runtime_1.jsxs)(FormLayout_1.FormRow, { children: [(0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "sortable", checked: Sortable, onChange: (Sortable) => onSettingsChange({ Sortable }), children: "Sortable" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "pivotable", checked: Pivotable, onChange: (Pivotable) => onSettingsChange({ Pivotable }), children: "Pivotable" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "aggregatable", checked: Aggregatable, onChange: (Aggregatable) => onSettingsChange({ Aggregatable }), children: "Aggregatable" })] }), (0, jsx_runtime_1.jsxs)(FormLayout_1.FormRow, { children: [(0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "suppres-smenu", checked: SuppressMenu, onChange: (SuppressMenu) => onSettingsChange({ SuppressMenu }), children: "Suppress Menu" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": "suppres-movable", checked: SuppressMovable, onChange: (SuppressMovable) => onSettingsChange({ SuppressMovable }), children: "Suppress Movable" }), (0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { disabled: true, checked: props.isEditable, children: "Editable" })] })] }) })] }), Boolean(possibleColumnTypes?.length) && ((0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Column Types" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Assign custom column types to this column" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsx)(FormLayout_1.default, { columns: [{ name: 'first', size: '30%' }, { name: 'second' }], children: (0, ArrayExtensions_1.chunk)(possibleColumnTypes ?? [], 2)?.map(([first, second]) => ((0, jsx_runtime_1.jsxs)(FormLayout_1.FormRow, { children: [first && ((0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": first, onChange: (checked) => handleColumnTypeChange(first, checked), checked: props.settings?.ColumnTypes?.includes?.(first), children: first })), second && ((0, jsx_runtime_1.jsx)(CheckBox_1.CheckBox, { "data-name": second, onChange: (checked) => handleColumnTypeChange(second, checked), checked: props.settings?.ColumnTypes?.includes?.(second), children: second }))] }, first))) }) })] }))] }));
 };
 exports.SpecialColumnSettingsWizardStep = SpecialColumnSettingsWizardStep;

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

@@ -21,8 +21,8 @@ const NewSelect_1 = require("../../../components/NewSelect");
 const StyledColumnSliceStyleEditors_1 = require("./StyledColumnSliceStyleEditors");
 const Card_1 = require("../../../components/Card");
 const SummaryColorTag_1 = require("../../Wizard/SummaryColorTag");
-const barChartCellText_1 = require("../../../Utilities/Helpers/barChartCellText");
-const BarChartCellTextLayoutEditor_1 = require("./StyledColumnWizardStyleSection/Components/BarChartCellTextLayoutEditor");
+const BarStylesHelper_1 = require("../../../Utilities/Helpers/StyledColumns/BarStylesHelper");
+const BarStyleCellTextLayoutEditor_1 = require("./StyledColumnWizardStyleSection/Components/BarStyleCellTextLayoutEditor");
 const BULLET_STYLE_FORM_SIZES = ['200px', '1fr'];
 const getTargetSummary = (target) => {
     if (target == undefined) {
@@ -55,12 +55,8 @@ const formatBulletOriginLabel = (origin) => {
     }
     return origin;
 };
-const formatBulletCellTextSummary = (cellText) => cellText
-    ?.map((t) => (t === 'CellValue' ? 'Cell Value' : 'Percent Value'))
-    .join(' + ') ?? '';
-const formatBulletToolTipSummary = (toolTipText) => toolTipText
-    ?.map((t) => (t === 'CellValue' ? 'Cell Value' : 'Percent Value'))
-    .join(' + ') ?? '';
+const formatBulletCellTextSummary = (cellText) => cellText?.map((t) => (t === 'CellValue' ? 'Cell Value' : 'Percent Value')).join(' + ') ?? '';
+const formatBulletToolTipSummary = (toolTipText) => toolTipText?.map((t) => (t === 'CellValue' ? 'Cell Value' : 'Percent Value')).join(' + ') ?? '';
 const getStyledColumnBulletRangesViewValues = (data) => {
     const bullet = data.BulletChartStyle;
     if (!bullet) {
@@ -105,10 +101,10 @@ const buildStyledColumnBulletStyleSummaryStrings = (bullet, options) => {
     if (bullet.BackColor) {
         items.push(`Back Colour: ${bullet.BackColor}`);
     }
-    if ((0, barChartCellText_1.hasBarChartCellTextConfigured)(bullet.CellTextProperties)) {
-        const tokens = (0, barChartCellText_1.getActiveBarChartCellTextTokens)(bullet.CellTextProperties);
+    if ((0, BarStylesHelper_1.hasBarStyleCellTextConfigured)(bullet.CellTextProperties)) {
+        const tokens = (0, BarStylesHelper_1.getActiveBarStyleCellTextTokens)(bullet.CellTextProperties);
         items.push(`Cell Text: ${formatBulletCellTextSummary(tokens)}`);
-        const layoutSummary = (0, barChartCellText_1.formatBarChartCellTextLayoutSummary)((0, barChartCellText_1.resolveBarChartCellTextLayout)(bullet.CellTextProperties));
+        const layoutSummary = (0, BarStylesHelper_1.formatBarStyleCellTextLayoutSummary)((0, BarStylesHelper_1.resolveBarStyleCellTextLayout)(bullet.CellTextProperties));
         if (layoutSummary) {
             items.push(`Placement: ${layoutSummary}`);
         }
@@ -300,9 +296,7 @@ const StyledColumnWizardBulletSection = (props) => {
         }
         if (mode === 'Column') {
             // Use the first available numeric column (excluding the styled column itself)
-            const candidate = api.columnApi
-                .getNumericColumns()
-                .find((c) => c.columnId !== data.ColumnId);
+            const candidate = api.columnApi.getNumericColumns().find((c) => c.columnId !== data.ColumnId);
             setTarget(candidate?.columnId ?? '');
             return;
         }
@@ -334,11 +328,11 @@ const StyledColumnWizardBulletSection = (props) => {
     };
     // -- Cell text -------------------------------------------------------------
     const toggleCellText = (token, show) => {
-        update((0, barChartCellText_1.toggleBarChartCellTextToken)(bullet.CellTextProperties, token, show));
+        update((0, BarStylesHelper_1.toggleBarStyleCellTextToken)(bullet.CellTextProperties, token, show));
     };
     const onCellTextPlacementChange = (token, patch) => {
         update({
-            CellTextProperties: (0, barChartCellText_1.patchBarChartCellTextPlacement)(bullet.CellTextProperties, token, patch),
+            CellTextProperties: (0, BarStylesHelper_1.patchBarStyleCellTextPlacement)(bullet.CellTextProperties, token, patch),
         });
     };
     const toggleToolTipText = (token, checked) => {
@@ -368,7 +362,9 @@ const StyledColumnWizardBulletSection = (props) => {
         : typeof primaryTarget?.Value === 'number'
             ? primaryTarget.Value
             : undefined;
-    const columnTargetValue = typeof primaryTarget === 'string' && primaryTarget !== 'Col-Avg' && primaryTarget !== 'Col-Median'
+    const columnTargetValue = typeof primaryTarget === 'string' &&
+        primaryTarget !== 'Col-Avg' &&
+        primaryTarget !== 'Col-Median'
         ? primaryTarget
         : typeof primaryTarget?.Value === 'string'
             ? primaryTarget.Value
@@ -380,7 +376,7 @@ const StyledColumnWizardBulletSection = (props) => {
         Size: markerCfg?.Size ?? (markerCfg?.Shape === 'Line' ? 2 : 8),
     };
     const cellTextProperties = bullet.CellTextProperties;
-    const cellTextDisabled = !(0, barChartCellText_1.hasBarChartCellTextConfigured)(cellTextProperties) || disabled;
+    const cellTextDisabled = !(0, BarStylesHelper_1.hasBarStyleCellTextConfigured)(cellTextProperties) || disabled;
     return ((0, jsx_runtime_1.jsxs)(Flex_1.Box, { children: [(0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:mb-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Target" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Select a target value for the bullet scale" })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsxs)(FormLayout_1.default, { sizes: [...BULLET_STYLE_FORM_SIZES], children: [(0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Target:", children: (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:max-w-[180px]", children: (0, jsx_runtime_1.jsx)(NewSelect_1.SingleSelect, { className: "twa:w-full", value: currentMode, onValueChange: (v) => handleTargetModeChange(v), items: [
                                                 { value: 'None', label: 'None' },
                                                 { value: 'Number', label: 'Fixed Number' },
@@ -392,7 +388,7 @@ const StyledColumnWizardBulletSection = (props) => {
                                                 { value: 'Vertical', label: 'Vertical' },
                                             ] }) }) }), bullet.Orientation === 'Vertical' && ((0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "", children: (0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:text-xs twa:text-neutral-500", children: ["Tip: vertical bullet charts need a tall row height to be readable (we recommend at least 60px). Set ", (0, jsx_runtime_1.jsx)("code", { children: "rowHeight" }), " on ", (0, jsx_runtime_1.jsx)("code", { children: " gridOptions " }), " or use", ' ', (0, jsx_runtime_1.jsx)("code", { children: "getRowHeight" }), "."] }) })), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Bar Colour:", children: (0, jsx_runtime_1.jsx)(ColorPicker_1.ColorPicker, { disabled: disabled, api: api, value: bullet.Bar?.Color, onChange: (c) => updateBar({ Color: c }) }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: bullet.Orientation === 'Vertical' ? 'Bar Width (px):' : 'Bar Height (px):', children: (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:max-w-[100px]", children: (0, jsx_runtime_1.jsx)(AdaptableInput_1.default, { type: "number", min: 1, value: bullet.Bar?.Height ?? '', onChange: (e) => updateBar({
                                                 Height: e.target.value === '' ? undefined : Number(e.target.value),
-                                            }), placeholder: "8" }) }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Origin:", children: (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:max-w-[160px]", children: (0, jsx_runtime_1.jsx)(NewSelect_1.SingleSelect, { className: "twa:w-full", value: typeof bullet.Origin === 'number' ? 'Number' : (bullet.Origin ?? 'Auto'), onValueChange: (v) => {
+                                            }), placeholder: "8" }) }) }), (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Origin:", children: (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:max-w-[160px]", children: (0, jsx_runtime_1.jsx)(NewSelect_1.SingleSelect, { className: "twa:w-full", value: typeof bullet.Origin === 'number' ? 'Number' : bullet.Origin ?? 'Auto', onValueChange: (v) => {
                                                 if (v === 'Auto' || v === 'Zero') {
                                                     update({ Origin: v });
                                                 }
@@ -402,7 +398,7 @@ const StyledColumnWizardBulletSection = (props) => {
                                             }, items: [
                                                 { value: 'Auto', label: 'Auto' },
                                                 { value: 'Zero', label: 'Zero' },
-                                            ] }) }) })] }) })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:mb-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Cell Text" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Pick which values to display and where each one sits around the bar" })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card.Body, { children: [(0, jsx_runtime_1.jsx)(FormLayout_1.default, { sizes: [...BULLET_STYLE_FORM_SIZES], children: (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Cell Text Layout:", children: (0, jsx_runtime_1.jsx)(BarChartCellTextLayoutEditor_1.BarChartCellTextLayoutEditor, { disabled: disabled, cellTextProperties: cellTextProperties, onToggle: toggleCellText, onPlacementChange: onCellTextPlacementChange }) }) }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: `twa:mt-3 twa:pt-3 twa:border-t twa:border-foreground/15 ${cellTextDisabled ? 'twa:opacity-50' : ''}`, children: (0, jsx_runtime_1.jsx)(StyledColumnSliceStyleEditors_1.StyledColumnFontStyleEditor, { api: api, disabled: cellTextDisabled, value: bullet.Font, onChange: (next) => {
+                                            ] }) }) })] }) })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:mb-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Cell Text" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: "Pick which values to display and where each one sits around the bar" })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card.Body, { children: [(0, jsx_runtime_1.jsx)(FormLayout_1.default, { sizes: [...BULLET_STYLE_FORM_SIZES], children: (0, jsx_runtime_1.jsx)(BarStyleCellTextLayoutEditor_1.BarStyleCellTextLayoutEditor, { disabled: disabled, cellTextProperties: cellTextProperties, onToggle: toggleCellText, onPlacementChange: onCellTextPlacementChange }) }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: `twa:mt-3 twa:pt-3 twa:border-t twa:border-foreground/15 ${cellTextDisabled ? 'twa:opacity-50' : ''}`, children: (0, jsx_runtime_1.jsx)(StyledColumnSliceStyleEditors_1.StyledColumnFontStyleEditor, { api: api, disabled: cellTextDisabled, value: bullet.Font, onChange: (next) => {
                                         if (next) {
                                             update({ Font: next });
                                         }

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

@@ -11,7 +11,7 @@ const Tag_1 = require("../../../components/Tag");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const Flex_1 = require("../../../components/Flex");
 const NumberInput_1 = require("../../../components/Input/NumberInput");
-const StyledColumnGradientHelper_1 = require("../../../Utilities/Helpers/StyledColumnGradientHelper");
+const GradientStyleHelper_1 = require("../../../Utilities/Helpers/StyledColumns/GradientStyleHelper");
 const StyledColumnSliceStyleEditors_1 = require("./StyledColumnSliceStyleEditors");
 const Card_1 = require("../../../components/Card");
 const SummaryColorTag_1 = require("../../Wizard/SummaryColorTag");
@@ -23,8 +23,8 @@ function formatGradientToolTipSummary(opts) {
         .join(' + ');
 }
 const buildStyledColumnGradientStyleSummaryStrings = (gs, options) => {
-    const minA = gs.MinAlpha ?? StyledColumnGradientHelper_1.DEFAULT_GRADIENT_MIN_ALPHA;
-    const maxA = gs.MaxAlpha ?? StyledColumnGradientHelper_1.DEFAULT_GRADIENT_MAX_ALPHA;
+    const minA = gs.MinAlpha ?? GradientStyleHelper_1.DEFAULT_GRADIENT_MIN_ALPHA;
+    const maxA = gs.MaxAlpha ?? GradientStyleHelper_1.DEFAULT_GRADIENT_MAX_ALPHA;
     const items = [`Alpha: ${minA} → ${maxA}`];
     if (gs.AutoContrastText) {
         items.push('Auto Contrast: On');
@@ -90,10 +90,10 @@ const StyledColumnWizardGradientSection = (props) => {
             patchGradient({ ToolTipText: next });
         }
     };
-    const minAlphaDisplay = gs.MinAlpha ?? StyledColumnGradientHelper_1.DEFAULT_GRADIENT_MIN_ALPHA;
-    const maxAlphaDisplay = gs.MaxAlpha ?? StyledColumnGradientHelper_1.DEFAULT_GRADIENT_MAX_ALPHA;
-    return ((0, jsx_runtime_1.jsxs)(Flex_1.Box, { children: [(0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:mb-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Transparency" }), (0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[480px]", children: ["Used at low and high ends of range; defaults are ", StyledColumnGradientHelper_1.DEFAULT_GRADIENT_MIN_ALPHA, " &", ' ', StyledColumnGradientHelper_1.DEFAULT_GRADIENT_MAX_ALPHA, " (Min 0 fades out lowest values)"] })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsx)(FormLayout_1.default, { sizes: [...STYLE_FORM_SIZES], children: (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Alpha range:", children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { alignItems: "center", className: "twa:ml-2 twa:flex-wrap twa:gap-3", children: [(0, jsx_runtime_1.jsxs)(Flex_1.Flex, { alignItems: "center", className: "twa:gap-1", children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-sm", children: "Min" }), (0, jsx_runtime_1.jsx)(NumberInput_1.NumberInput, { disabled: disabled, className: "twa:w-20", value: minAlphaDisplay, min: 0, max: 1, step: 0.05, onChange: (v) => {
-                                                        if (v === StyledColumnGradientHelper_1.DEFAULT_GRADIENT_MIN_ALPHA) {
+    const minAlphaDisplay = gs.MinAlpha ?? GradientStyleHelper_1.DEFAULT_GRADIENT_MIN_ALPHA;
+    const maxAlphaDisplay = gs.MaxAlpha ?? GradientStyleHelper_1.DEFAULT_GRADIENT_MAX_ALPHA;
+    return ((0, jsx_runtime_1.jsxs)(Flex_1.Box, { children: [(0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:mb-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Transparency" }), (0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[480px]", children: ["Used at low and high ends of range; defaults are ", GradientStyleHelper_1.DEFAULT_GRADIENT_MIN_ALPHA, " &", ' ', GradientStyleHelper_1.DEFAULT_GRADIENT_MAX_ALPHA, " (Min 0 fades out lowest values)"] })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsx)(FormLayout_1.default, { sizes: [...STYLE_FORM_SIZES], children: (0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Alpha range:", children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { alignItems: "center", className: "twa:ml-2 twa:flex-wrap twa:gap-3", children: [(0, jsx_runtime_1.jsxs)(Flex_1.Flex, { alignItems: "center", className: "twa:gap-1", children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-sm", children: "Min" }), (0, jsx_runtime_1.jsx)(NumberInput_1.NumberInput, { disabled: disabled, className: "twa:w-20", value: minAlphaDisplay, min: 0, max: 1, step: 0.05, onChange: (v) => {
+                                                        if (v === GradientStyleHelper_1.DEFAULT_GRADIENT_MIN_ALPHA) {
                                                             const { MinAlpha: _m, ...rest } = gs;
                                                             props.onChange({ ...data, GradientStyle: rest });
                                                         }
@@ -101,7 +101,7 @@ const StyledColumnWizardGradientSection = (props) => {
                                                             patchGradient({ MinAlpha: v });
                                                         }
                                                     } })] }), (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { alignItems: "center", className: "twa:gap-1", children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-sm", children: "Max" }), (0, jsx_runtime_1.jsx)(NumberInput_1.NumberInput, { disabled: disabled, className: "twa:w-20", value: maxAlphaDisplay, min: 0, max: 1, step: 0.05, onChange: (v) => {
-                                                        if (v === StyledColumnGradientHelper_1.DEFAULT_GRADIENT_MAX_ALPHA) {
+                                                        if (v === GradientStyleHelper_1.DEFAULT_GRADIENT_MAX_ALPHA) {
                                                             const { MaxAlpha: _m, ...rest } = gs;
                                                             props.onChange({ ...data, GradientStyle: rest });
                                                         }

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

@@ -18,7 +18,7 @@ const IconSelector_1 = require("../../../components/IconSelector");
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const AdaptableContext_1 = require("../../AdaptableContext");
 const AdaptableIconComponent_1 = require("../../Components/AdaptableIconComponent");
-const IconStylePresets_1 = require("../../../Utilities/Helpers/IconStylePresets");
+const IconStyleHelper_1 = require("../../../Utilities/Helpers/StyledColumns/IconStyleHelper");
 const IconRenderer_1 = require("../../../agGrid/cellRenderers/IconRenderer");
 const Card_1 = require("../../../components/Card");
 const SummaryColorTag_1 = require("../../Wizard/SummaryColorTag");
@@ -73,7 +73,7 @@ const getStyledColumnIconMappingsViewValues = (data) => {
     const effectiveMappings = (0, IconRenderer_1.resolveEffectiveIconStyleMappings)(ic);
     const items = [`Mappings: ${effectiveMappings.length}`];
     if (ic.Preset) {
-        items.push(`Preset: ${IconStylePresets_1.ICON_STYLE_PRESET_LABELS[ic.Preset]}`);
+        items.push(`Preset: ${IconStyleHelper_1.ICON_STYLE_PRESET_LABELS[ic.Preset]}`);
     }
     const customCount = ic.Mappings?.length ?? 0;
     if (customCount > 0) {
@@ -308,9 +308,9 @@ const StyledColumnWizardIconSection = (props) => {
     // -----------------------------------------------------------------------
     if (props.variant === 'mappings') {
         const presetMappingsPreview = iconStyle.Preset
-            ? (0, IconStylePresets_1.getIconStylePresetMappings)(iconStyle.Preset)
+            ? (0, IconStyleHelper_1.getIconStylePresetMappings)(iconStyle.Preset)
             : [];
-        return ((0, jsx_runtime_1.jsxs)(Flex_1.Box, { children: [(0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:mb-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Presets" }), (0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: ["Contains most commonly used values; add anything missing in", ' ', (0, jsx_runtime_1.jsx)("strong", { children: "Custom mappings" }), " below"] })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsxs)(FormLayout_1.default, { children: [(0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Select Preset:", children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { alignItems: "center", className: "twa:gap-2 twa:flex-wrap", children: [['Flags', 'Currencies', 'Trend', 'Status'].map((p) => ((0, jsx_runtime_1.jsx)(SimpleButton_1.default, { ...(0, wizardSelection_1.wizardSelectionSimpleButtonProps)(iconStyle.Preset === p), onClick: () => applyPreset(p), children: IconStylePresets_1.ICON_STYLE_PRESET_LABELS[p] }, p))), iconStyle.Preset && ((0, jsx_runtime_1.jsx)(SimpleButton_1.default, { variant: "text", icon: "undo", tooltip: "Stop using this preset (custom mappings are kept)", onClick: clearPreset, children: "Clear preset" }))] }) }), iconStyle.Preset && ((0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Active:", children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:gap-1 twa:max-w-[640px]", children: [(0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70", children: [IconStylePresets_1.ICON_STYLE_PRESET_DESCRIPTIONS[iconStyle.Preset], " \u2014", ' ', presetMappingsPreview.length, " mappings shipped with the preset."] }), renderMappingsPreview(presetMappingsPreview)] }) }))] }) })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:mb-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Custom Mappings" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: iconStyle.Preset
+        return ((0, jsx_runtime_1.jsxs)(Flex_1.Box, { children: [(0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:mb-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Presets" }), (0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: ["Contains most commonly used values; add anything missing in", ' ', (0, jsx_runtime_1.jsx)("strong", { children: "Custom mappings" }), " below"] })] }), (0, jsx_runtime_1.jsx)(Card_1.Card.Body, { children: (0, jsx_runtime_1.jsxs)(FormLayout_1.default, { children: [(0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Select Preset:", children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { alignItems: "center", className: "twa:gap-2 twa:flex-wrap", children: [['Flags', 'Currencies', 'Trend', 'Status'].map((p) => ((0, jsx_runtime_1.jsx)(SimpleButton_1.default, { ...(0, wizardSelection_1.wizardSelectionSimpleButtonProps)(iconStyle.Preset === p), onClick: () => applyPreset(p), children: IconStyleHelper_1.ICON_STYLE_PRESET_LABELS[p] }, p))), iconStyle.Preset && ((0, jsx_runtime_1.jsx)(SimpleButton_1.default, { variant: "text", icon: "undo", tooltip: "Stop using this preset (custom mappings are kept)", onClick: clearPreset, children: "Clear preset" }))] }) }), iconStyle.Preset && ((0, jsx_runtime_1.jsx)(FormLayout_1.FormRow, { label: "Active:", children: (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "twa:gap-1 twa:max-w-[640px]", children: [(0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70", children: [IconStyleHelper_1.ICON_STYLE_PRESET_DESCRIPTIONS[iconStyle.Preset], " \u2014", ' ', presetMappingsPreview.length, " mappings shipped with the preset."] }), renderMappingsPreview(presetMappingsPreview)] }) }))] }) })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card, { shadow: false, className: "twa:mb-3", children: [(0, jsx_runtime_1.jsxs)(Card_1.Card.Title, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: "Custom Mappings" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-70 twa:font-normal twa:max-w-[520px]", children: iconStyle.Preset
                                         ? 'Add any mappings that are not present in the selected preset'
                                         : 'Add custom mappings entries (icon, key and description)' })] }), (0, jsx_runtime_1.jsxs)(Card_1.Card.Body, { children: [mappings.length === 0 ? ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:text-xs twa:opacity-60 twa:max-w-[520px] twa:mb-2", children: iconStyle.Preset
                                         ? 'No custom mappings — the preset above is being used as-is'