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

package/src/View/Wizard/CollapsibleWizardCard.js

@@ -55,7 +55,7 @@ const CollapsibleWizardCard = (props) => {
                     // inset so it stays inside the element and is always visible.
                     twUtils_1.targetOwn.focusOutline, 'twa:focus-visible:ring-inset'), "data-name": dataName, onClick: toggleExpanded, onKeyDown: handleTitleKeyDown, tabIndex: 0, "aria-expanded": expanded, role: "button", children: [(0, jsx_runtime_1.jsxs)(Flex_1.Box, { className: "twa:flex twa:flex-row twa:items-center twa:gap-2 twa:shrink-0 twa:cursor-pointer twa:select-none", children: [(0, jsx_runtime_1.jsx)(Icon_1.IconComponent, { icon: { name: expanded ? 'collapse' : 'expand' } }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:font-medium", children: title })] }), headerVisual ? ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:flex-1 twa:min-w-0 twa:flex twa:justify-end twa:items-center twa:overflow-hidden twa:pointer-events-none", children: headerVisual })) : headerInline ? ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: (0, utils_1.cn)('twa:flex-1 twa:min-w-0 twa:font-normal', isInteractiveCompactSummary
                                 ? 'twa:flex twa:justify-end twa:items-center twa:overflow-visible'
-                                : (0, utils_1.cn)('twa:text-xs twa:opacity-70 twa:pointer-events-none twa:cursor-default', compact ? 'twa:overflow-hidden' : 'twa:truncate')), children: headerInline })) : ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:flex-1 twa:min-w-0" })), headerActions ? ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:shrink-0", onClick: (event) => event.stopPropagation(), children: headerActions })) : null] }) }), expanded ? ((0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: (0, utils_1.cn)('twa:p-1', bodyClassName, fillAvailable && 'twa:max-h-none! twa:flex-1 twa:min-h-0'), children: children })) : showSummary ? ((0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:p-1", gap: 1, children: summary })) : null] }));
+                                : (0, utils_1.cn)('twa:text-xs twa:opacity-70 twa:pointer-events-none twa:cursor-default', compact ? 'twa:overflow-hidden' : 'twa:truncate')), children: headerInline })) : ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:flex-1 twa:min-w-0" })), headerActions ? ((0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:shrink-0 twa:gap-2 twa:flex", onClick: (event) => event.stopPropagation(), children: headerActions })) : null] }) }), expanded ? ((0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: (0, utils_1.cn)('twa:p-1', bodyClassName, fillAvailable && 'twa:max-h-none! twa:flex-1 twa:min-h-0'), children: children })) : showSummary ? ((0, jsx_runtime_1.jsx)(Card_1.Card.Body, { className: "twa:p-1", gap: 1, children: summary })) : null] }));
 };
 exports.CollapsibleWizardCard = CollapsibleWizardCard;
 function useWizardCardAccordion(initialExpandedId, options) {

package/src/View/Wizard/OnePageAdaptableWizard.d.ts

@@ -57,6 +57,13 @@ export interface OnePageAdaptableWizardProps<ENTITY> {
      * `FriendlyName`.
      */
     moduleName?: string;
+    /**
+     * Persistent preview rendered as a full-width band beneath the wizard
+     * header — visible on every step. Used by wizards (e.g. Styled Column)
+     * that want users to see a live preview of the object they're building
+     * as they progress.
+     */
+    headerPreview?: React.ReactNode;
 }
 export declare const OnePageAdaptableWizard: <ENTITY extends unknown>(props: OnePageAdaptableWizardProps<ENTITY>) => React.JSX.Element;
 export declare const OnePageWizardSummary: <ENTITY extends unknown>() => React.JSX.Element;

package/src/View/Wizard/OnePageAdaptableWizard.js

@@ -13,7 +13,7 @@ const Card_1 = require("../../components/Card");
 const ButtonEdit_1 = require("../Components/Buttons/ButtonEdit");
 const NamedQueryContext_1 = require("../../components/ExpressionEditor/NamedQueryContext");
 const OnePageWizards_1 = require("./OnePageWizards");
-const kebabCase_1 = tslib_1.__importDefault(require("../../Utilities/utils/kebabCase"));
+const StringExtensions_1 = require("../../Utilities/Extensions/StringExtensions");
 const Flex_1 = require("../../components/Flex");
 const twMerge_1 = require("../../twMerge");
 const SummaryTag = (props) => ((0, jsx_runtime_1.jsx)(Flex_1.Box, { ...props }));
@@ -38,7 +38,7 @@ const OnePageAdaptableWizard = (props) => {
     const saveNamedQuery = React.useCallback((namedQuery) => dispatch(NamedQueryRedux.NamedQueryAdd(namedQuery)), []);
     const [namedQuery, setNamedQuery] = (0, react_1.useState)(false);
     const name = props.moduleInfo.FriendlyName
-        ? `${(0, kebabCase_1.default)(props.moduleInfo.FriendlyName)}-wizard`
+        ? `${(0, StringExtensions_1.kebabCase)(props.moduleInfo.FriendlyName)}-wizard`
         : '';
     const extraContext = {
         data: props.data,

package/src/View/Wizard/OnePageWizards.d.ts

@@ -41,6 +41,14 @@ export interface OnePageWizardProps<ENTITY> {
     closeTooltip?: string;
     finishText?: React.ReactNode;
     moduleName?: string;
+    /**
+     * Optional persistent preview rendered as a full-width band beneath the
+     * header. Used by wizards (e.g. Styled Column) that want users to see a
+     * live preview of the object they're building on every step — the same
+     * card the existing Style / Summary steps render, hoisted so it is
+     * always visible.
+     */
+    headerPreview?: React.ReactNode;
 }
 export declare const OnePageWizard: <ENTITY extends unknown>(props: OnePageWizardProps<ENTITY>) => React.JSX.Element;
 export {};

package/src/View/Wizard/OnePageWizards.js

@@ -86,7 +86,7 @@ const OnePageWizard = (props) => {
         if (section === '-') {
             return (0, jsx_runtime_1.jsx)(React.Fragment, {}, index);
         }
-        return ((0, jsx_runtime_1.jsx)(Flex_1.Flex, { flexDirection: "column", "data-name": `section-${index}`, className: "twa:min-h-full twa:mr-2", children: (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "ab-OnePageWizard__section twa:flex-1 twa:rounded-standard twa:overflow-auto twa:bg-background", children: section.render(props.data, index) }) }, index));
+        return ((0, jsx_runtime_1.jsx)(Flex_1.Flex, { flexDirection: "column", "data-name": `section-${index}`, className: "twa:flex-1 twa:overflow-hidden", children: (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "ab-OnePageWizard__section twa:flex-1 twa:rounded-standard twa:overflow-auto twa:bg-background", children: section.render(props.data, index) }) }, index));
     };
     const handleNavigation = (0, useKeyboardNavigation_1.useKeyboardNavigation)(setCurrentSection, visibleSections);
     const selectedNodeRef = (0, react_1.useRef)(null);
@@ -171,7 +171,9 @@ const OnePageWizard = (props) => {
                                                         return;
                                                     }
                                                     setCurrentSection(index);
-                                                }, children: [(0, jsx_runtime_1.jsx)(KeyHint_1.KeyHint, { className: "twa:mr-2 twa:inline-block twa:text-accent-foreground", children: navIndex }), (0, jsx_runtime_1.jsx)("div", { className: "twa:flex-1", children: section.title }), (0, jsx_runtime_1.jsx)(icons_1.Icon, { name: "error", className: (0, utils_1.cn)('twa:ml-2', validSectionsMap.get(index) !== true ? 'twa:visible' : 'twa:invisible') })] }, section.title));
-                                        }), selectedFeedback, (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:flex-1" }), (0, jsx_runtime_1.jsxs)(KeyHint_1.KeyHint, { className: "ab-OnePageWizard__key-hint twa:leading-normal", children: [(0, isMacLike_1.isMacLike)() ? 'Cmd' : 'Ctrl', " + #", (0, jsx_runtime_1.jsx)("br", {}), "or arrow keys", (0, jsx_runtime_1.jsx)("br", {}), "to navigate"] })] }), (0, jsx_runtime_1.jsx)(Flex_1.Flex, { flexDirection: "column", className: "ab-OnePageWizard__section-container twa:min-h-0 twa:min-w-0 twa:flex-1", children: renderSection(currentSection) })] }), (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "row", alignItems: "center", className: "ab-WizardDialog__footer ab-OnePageWizard__footer twa:p-2", children: [(0, jsx_runtime_1.jsx)(SimpleButton_1.default, { tone: "neutral", variant: "text", "data-name": "close", onClick: () => props.onHide?.(), tooltip: props.closeTooltip ?? 'Close wizard', accessLevel: GeneralConstants_1.ACCESS_LEVEL_FULL, children: props.closeText ?? 'CLOSE' }), (0, jsx_runtime_1.jsx)(KeyHint_1.KeyHint, { className: "twa:ml-2", children: "Esc" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "ab-OnePageWizard__error twa:text-2 twa:mr-3 twa:flex-1 twa:text-destructive twa:text-end", children: firstErrorMessage }), (0, jsx_runtime_1.jsx)(SimpleButton_1.default, { tone: "accent", "data-name": "finish", variant: "raised", disabled: canFinish !== true, onClick: () => handleClickFinish(), icon: 'check', accessLevel: GeneralConstants_1.ACCESS_LEVEL_FULL, children: props.finishText ?? 'Finish' })] })] }) }) }) }));
+                                                }, children: [(0, jsx_runtime_1.jsx)(KeyHint_1.KeyHint, { className: (0, utils_1.cn)('twa:mr-2 twa:inline-block', {
+                                                            'twa:text-accent-foreground': active,
+                                                        }), children: navIndex }), (0, jsx_runtime_1.jsx)("div", { className: "twa:flex-1", children: section.title }), (0, jsx_runtime_1.jsx)(icons_1.Icon, { name: "error", className: (0, utils_1.cn)('twa:ml-2', validSectionsMap.get(index) !== true ? 'twa:visible' : 'twa:invisible') })] }, section.title));
+                                        }), selectedFeedback, (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "twa:flex-1" }), (0, jsx_runtime_1.jsxs)(KeyHint_1.KeyHint, { className: "ab-OnePageWizard__key-hint twa:leading-normal", children: [(0, isMacLike_1.isMacLike)() ? 'Cmd' : 'Ctrl', " + #", (0, jsx_runtime_1.jsx)("br", {}), "or arrow keys", (0, jsx_runtime_1.jsx)("br", {}), "to navigate"] })] }), (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "column", className: "ab-OnePageWizard__section-container twa:overflow-hidden twa:min-w-0 twa:flex-1 twa:gap-2 twa:mr-2", children: [props.headerPreview ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "ab-OnePageWizard__header-preview", children: props.headerPreview }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { as: "hr", className: "ab-OnePageWizard__header-preview-separator twa:w-full twa:border-0 twa:border-t twa:my-0 twa:border-t-input-border" })] })) : null, renderSection(currentSection)] })] }), (0, jsx_runtime_1.jsxs)(Flex_1.Flex, { flexDirection: "row", alignItems: "center", className: "ab-WizardDialog__footer ab-OnePageWizard__footer twa:p-2", children: [(0, jsx_runtime_1.jsx)(SimpleButton_1.default, { tone: "neutral", variant: "text", "data-name": "close", onClick: () => props.onHide?.(), tooltip: props.closeTooltip ?? 'Close wizard', accessLevel: GeneralConstants_1.ACCESS_LEVEL_FULL, children: props.closeText ?? 'CLOSE' }), (0, jsx_runtime_1.jsx)(KeyHint_1.KeyHint, { className: "twa:ml-2", children: "Esc" }), (0, jsx_runtime_1.jsx)(Flex_1.Box, { className: "ab-OnePageWizard__error twa:text-2 twa:mr-3 twa:flex-1 twa:text-destructive twa:text-end", children: firstErrorMessage }), (0, jsx_runtime_1.jsx)(SimpleButton_1.default, { tone: "accent", "data-name": "finish", variant: "raised", disabled: canFinish !== true, onClick: () => handleClickFinish(), icon: 'check', accessLevel: GeneralConstants_1.ACCESS_LEVEL_FULL, children: props.finishText ?? 'Finish' })] })] }) }) }) }));
 };
 exports.OnePageWizard = OnePageWizard;

package/src/agGrid/AdaptableAgGrid.js

@@ -2,12 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AdaptableAgGrid = void 0;
 const tslib_1 = require("tslib");
-const debounce_1 = tslib_1.__importDefault(require("../Utilities/utils/debounce"));
+const TimingHelper_1 = require("../Utilities/Helpers/TimingHelper");
 const ag_grid_enterprise_1 = require("ag-grid-enterprise");
 const AdaptableLogger_1 = require("./AdaptableLogger");
 const DocumentationLinkConstants_1 = require("../Utilities/Constants/DocumentationLinkConstants");
 const StringExtensions_1 = tslib_1.__importDefault(require("../Utilities/Extensions/StringExtensions"));
-const QuickSearchStyleHelper_1 = require("../Utilities/Helpers/QuickSearchStyleHelper");
+const QuickSearchHelper_1 = require("../Utilities/Helpers/QuickSearchHelper");
 const Emitter_1 = tslib_1.__importDefault(require("../Utilities/Emitter"));
 const DefaultAdaptableOptions_1 = require("../AdaptableOptions/DefaultAdaptableOptions");
 const resolveContainerElement_1 = require("../Utilities/resolveContainerElement");
@@ -24,7 +24,7 @@ const ThemeService_1 = require("../Utilities/Services/ThemeService");
 const ValidationService_1 = require("../Utilities/Services/ValidationService");
 const ModuleService_1 = require("../Utilities/Services/ModuleService");
 const CalculatedColumnExpressionService_1 = require("../Utilities/Services/CalculatedColumnExpressionService");
-const CalculatedColumnSyntheticChange_1 = require("../Utilities/Services/CalculatedColumnSyntheticChange");
+const CalculatedColumnExpressionService_2 = require("../Utilities/Services/CalculatedColumnExpressionService");
 const QueryLanguageService_1 = require("../Utilities/Services/QueryLanguageService");
 const AlertService_1 = require("../Utilities/Services/AlertService");
 const TeamSharingService_1 = require("../Utilities/Services/TeamSharingService");
@@ -90,8 +90,8 @@ const Modal_1 = require("../components/Modal");
 const AdaptableLoadingScreen_1 = require("../View/Components/Popups/AdaptableLoadingScreen");
 const react_1 = require("react");
 const createAgStatusPanelComponent_1 = require("../Utilities/createAgStatusPanelComponent");
-const only_1 = require("../Utilities/only");
-const weightedAverage_1 = require("../Utilities/weightedAverage");
+const only_1 = require("../AdaptableState/Aggregations/only");
+const weightedAverage_1 = require("../AdaptableState/Aggregations/weightedAverage");
 const RowSummary_1 = require("../AdaptableState/Common/RowSummary");
 const FlashingCellService_1 = require("../Utilities/Services/FlashingCellService");
 const AgGridExportAdapter_1 = require("./AgGridExportAdapter");
@@ -107,7 +107,7 @@ const adaptableOverrideCheck_1 = require("../Utilities/adaptableOverrideCheck");
 const AgGridModulesAdapter_1 = require("./AgGridModulesAdapter");
 const devTools_1 = require("../devTools");
 const infinite_react_1 = require("@infinite-table/infinite-react");
-const FormatHelper_1 = require("../Utilities/Helpers/FormatHelper");
+const DisplayFormatHelper_1 = require("../Utilities/Helpers/DisplayFormatHelper");
 const PredicateApiImpl_1 = require("../Api/Implementation/PredicateApiImpl");
 const AgGridFilterAdapter_1 = require("./AgGridFilterAdapter");
 const AdaptableFilterHandler_1 = require("./AdaptableFilterHandler");
@@ -1742,7 +1742,7 @@ class AdaptableAgGrid {
          * Use Case: User has selected Rows or opened a Row Group
          * Action: Set Selected Rows (on a debounce of 500ms)
          */
-        this.debouncedSetSelectedRows = (0, debounce_1.default)(() => {
+        this.debouncedSetSelectedRows = (0, TimingHelper_1.debounce)(() => {
             if (!this.isReady) {
                 return;
             }
@@ -1762,7 +1762,7 @@ class AdaptableAgGrid {
          * Use Case: User has selected a range of cells
          * Action: Set Selected Cells (on a debounce of 250ms)
          */
-        this.debouncedSetSelectedCells = (0, debounce_1.default)(() => {
+        this.debouncedSetSelectedCells = (0, TimingHelper_1.debounce)(() => {
             if (!this.isReady) {
                 return;
             }
@@ -3013,7 +3013,7 @@ class AdaptableAgGrid {
                 const monthCells = treeDeepMap.get([year, month]) || [];
                 const monthCell = this.createGridCell(rowNode, colId, {
                     rawValue: monthRawValue,
-                    displayValue: (0, FormatHelper_1.DateFormatter)(`${monthRawValue}-01`, { Pattern: 'LLLL' }),
+                    displayValue: (0, DisplayFormatHelper_1.DateFormatter)(`${monthRawValue}-01`, { Pattern: 'LLLL' }),
                     normalisedValue: monthRawValue,
                 });
                 monthCells.push(monthCell);
@@ -3585,7 +3585,7 @@ class AdaptableAgGrid {
         this.agGridAdapter.setGridOption('findSearchValue', searchText);
     }
     applyQuickSearchFindCssVars() {
-        (0, QuickSearchStyleHelper_1.applyQuickSearchFindCssVars)(this.getAgGridContainerElement(), this.api.stateApi.getQuickSearchState());
+        (0, QuickSearchHelper_1.applyQuickSearchFindCssVars)(this.getAgGridContainerElement(), this.api.stateApi.getQuickSearchState());
     }
     refreshAgGridFind() {
         if (!this.agGridModulesAdapter.isAgGridModuleRegistered('FindModule')) {
@@ -4138,7 +4138,7 @@ class AdaptableAgGrid {
      * There are a few things we need to do AFTER we edit a cell and it makes sense to put them in one place
      */
     performPostEditChecks(rowNode, cellDataChangedInfos) {
-        cellDataChangedInfos = (0, CalculatedColumnSyntheticChange_1.expandCellDataChangedInfosWithCalculatedColumns)(this.api, cellDataChangedInfos);
+        cellDataChangedInfos = (0, CalculatedColumnExpressionService_2.expandCellDataChangedInfosWithCalculatedColumns)(this.api, cellDataChangedInfos);
         cellDataChangedInfos.forEach((cellDataChangedInfo) => {
             // if a Cell Data Change is undone, log to the Console
             if (cellDataChangedInfo.trigger === 'undo') {

package/src/agGrid/AgGridColumnAdapter.js

@@ -3,13 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.AgGridColumnAdapter = void 0;
 exports.getEditorForColumnDataType = getEditorForColumnDataType;
 const tslib_1 = require("tslib");
-const kebabCase_1 = tslib_1.__importDefault(require("../Utilities/utils/kebabCase"));
+const StringExtensions_1 = require("../Utilities/Extensions/StringExtensions");
 const AdaptableFormatPresets_1 = require("../AdaptableState/Common/AdaptableFormatPresets");
-const merge_1 = tslib_1.__importDefault(require("../Utilities/utils/merge"));
-const SparklineOptionsHelper_1 = require("../Utilities/Helpers/SparklineOptionsHelper");
-const barChartCellText_1 = require("../Utilities/Helpers/barChartCellText");
+const ObjectExtensions_1 = require("../Utilities/Extensions/ObjectExtensions");
+const SparklineStyleHelper_1 = require("../Utilities/Helpers/StyledColumns/SparklineStyleHelper");
+const BarStylesHelper_1 = require("../Utilities/Helpers/StyledColumns/BarStylesHelper");
 const StyleHelper_1 = require("../Utilities/Helpers/StyleHelper");
-const StringExtensions_1 = tslib_1.__importDefault(require("../Utilities/Extensions/StringExtensions"));
+const StringExtensions_2 = tslib_1.__importDefault(require("../Utilities/Extensions/StringExtensions"));
 const AdaptableColumn_1 = require("../AdaptableState/Common/AdaptableColumn");
 const tinycolor2_1 = tslib_1.__importDefault(require("tinycolor2"));
 const UIHelper_1 = tslib_1.__importDefault(require("../View/UIHelper"));
@@ -18,11 +18,11 @@ const BadgeRenderer_1 = require("./cellRenderers/BadgeRenderer");
 const BulletChartRenderer_1 = require("./cellRenderers/BulletChartRenderer");
 const RangeBarRenderer_1 = require("./cellRenderers/RangeBarRenderer");
 const RatingRenderer_1 = require("./cellRenderers/RatingRenderer");
-const shouldRenderStyledColumnOnRow_1 = require("./cellRenderers/shouldRenderStyledColumnOnRow");
+const StyledColumnHelper_1 = require("../Utilities/Helpers/StyledColumns/StyledColumnHelper");
 const IconRenderer_1 = require("./cellRenderers/IconRenderer");
-const Helper_1 = tslib_1.__importDefault(require("../Utilities/Helpers/Helper"));
-const ScheduledAlertHelper_1 = require("../Utilities/Helpers/ScheduledAlertHelper");
-const StyledColumnGradientHelper_1 = require("../Utilities/Helpers/StyledColumnGradientHelper");
+const NumberExtensions_1 = require("../Utilities/Extensions/NumberExtensions");
+const ScheduledAlertHelper_1 = require("../Utilities/Helpers/Scheduling/ScheduledAlertHelper");
+const GradientStyleHelper_1 = require("../Utilities/Helpers/StyledColumns/GradientStyleHelper");
 const AdaptableNumberEditor_1 = require("./editors/AdaptableNumberEditor");
 const AdaptableDateEditor_1 = require("./editors/AdaptableDateEditor");
 const AgGridExportAdapter_1 = require("./AgGridExportAdapter");
@@ -32,7 +32,7 @@ const AdaptableFilterHandler_1 = require("./AdaptableFilterHandler");
 const AgGridFilterAdapter_1 = require("./AgGridFilterAdapter");
 const AgGridFloatingFilterAdapter_1 = require("./AgGridFloatingFilterAdapter");
 const AdaptableLogger_1 = require("./AdaptableLogger");
-const iconStyledColumnColumnSupport_1 = require("../Utilities/Helpers/iconStyledColumnColumnSupport");
+const IconStyleHelper_1 = require("../Utilities/Helpers/StyledColumns/IconStyleHelper");
 const AggregationColumns_1 = require("../AdaptableState/Common/AggregationColumns");
 /**
  * CSS property keys produced by `convertAdaptableStyleToCSS` from a
@@ -376,7 +376,7 @@ class AgGridColumnAdapter {
         return Object.entries(style).reduce((acc, [key, value]) => {
             // needed as AG-Grid vanilla turns all CSS props to kebab, while AG Grid React does not
             // @ts-ignore
-            acc[`--ab-dynamic-${(0, kebabCase_1.default)(key)}`] = value;
+            acc[`--ab-dynamic-${(0, StringExtensions_1.kebabCase)(key)}`] = value;
             return acc;
         }, {});
     }
@@ -559,7 +559,7 @@ class AgGridColumnAdapter {
             if (styledColumn && !styledColumn.IsSuspended) {
                 if (styledColumn.SparklineStyle) {
                     const sanitizedSparklineOptions = AdaptableHelper_1.AdaptableHelper.removeAdaptableObjectPrimitives(styledColumn.SparklineStyle.options);
-                    const sparklineOptions = (0, SparklineOptionsHelper_1.resolveSparklineOptionsForRender)((0, merge_1.default)({}, userDefined?.sparklineOptions, sanitizedSparklineOptions));
+                    const sparklineOptions = (0, SparklineStyleHelper_1.resolveSparklineOptionsForRender)((0, ObjectExtensions_1.merge)({}, userDefined?.sparklineOptions, sanitizedSparklineOptions));
                     return {
                         ...userDefined,
                         sparklineOptions,
@@ -578,7 +578,7 @@ class AgGridColumnAdapter {
             // Icon Style has its own tooltip vocabulary (`'CellValue'` /
             // `'IconDescription'`) so we handle it before falling through to the
             // numeric tooltip branch.
-            if (styledColumn.IconStyle && !(0, iconStyledColumnColumnSupport_1.isUnsupportedColumnDataTypeForIconStyle)(abColumn.dataType)) {
+            if (styledColumn.IconStyle && !(0, IconStyleHelper_1.isUnsupportedColumnDataTypeForIconStyle)(abColumn.dataType)) {
                 const iconTokens = styledColumn.IconStyle.ToolTipText ?? [];
                 if (iconTokens.length === 0) {
                     return undefined;
@@ -616,7 +616,7 @@ class AgGridColumnAdapter {
                     if (ratingToolTip.includes('PercentageValue') && ratingMax > 0) {
                         const n = Number(params.value);
                         if (!isNaN(n)) {
-                            const clamped = Helper_1.default.clamp(n, 0, ratingMax);
+                            const clamped = (0, NumberExtensions_1.clamp)(n, 0, ratingMax);
                             const percentageValue = (clamped / ratingMax) * 100;
                             const pct = `${percentageValue.toFixed(0)}%`;
                             returnValue = returnValue ? `${returnValue} (${pct})` : pct;
@@ -664,7 +664,7 @@ class AgGridColumnAdapter {
                     }
                     else {
                         const scaleSpan = max - min;
-                        const clamped = Helper_1.default.clamp(Number(params.value), min, max);
+                        const clamped = (0, NumberExtensions_1.clamp)(Number(params.value), min, max);
                         percentageValue = scaleSpan === 0 ? 0 : ((clamped - min) / scaleSpan) * 100;
                     }
                     returnValue += ` (${percentageValue.toFixed(0)}%)`;
@@ -1261,7 +1261,7 @@ class AgGridColumnAdapter {
     }
     getQuickSearchCellStyle() {
         const quickSearchStyle = this.adaptableApi.quickSearchApi.getQuickSearchCellMatchStyle();
-        if (!quickSearchStyle || StringExtensions_1.default.IsNotNullOrEmpty(quickSearchStyle.ClassName)) {
+        if (!quickSearchStyle || StringExtensions_2.default.IsNotNullOrEmpty(quickSearchStyle.ClassName)) {
             return undefined;
         }
         return (0, StyleHelper_1.convertAdaptableStyleToCSS)(quickSearchStyle);
@@ -1364,7 +1364,7 @@ class AgGridColumnAdapter {
      */
     styledColumnClaimsFontStyle(styledColumn, abColumn) {
         const iconFontClaims = !!styledColumn?.IconStyle &&
-            !(0, iconStyledColumnColumnSupport_1.isUnsupportedColumnDataTypeForIconStyle)(abColumn.dataType) &&
+            !(0, IconStyleHelper_1.isUnsupportedColumnDataTypeForIconStyle)(abColumn.dataType) &&
             (0, StyleHelper_1.hasCellFontStyle)(styledColumn.IconStyle.Font);
         return ((0, StyleHelper_1.hasCellFontStyle)(styledColumn?.GradientStyle?.Font) ||
             (0, StyleHelper_1.hasCellFontStyle)(styledColumn?.PercentBarStyle?.Font) ||
@@ -1378,7 +1378,7 @@ class AgGridColumnAdapter {
      */
     styledColumnClaimsCellBoxStyle(styledColumn, abColumn) {
         const iconCellClaims = !!styledColumn?.IconStyle &&
-            !(0, iconStyledColumnColumnSupport_1.isUnsupportedColumnDataTypeForIconStyle)(abColumn.dataType) &&
+            !(0, IconStyleHelper_1.isUnsupportedColumnDataTypeForIconStyle)(abColumn.dataType) &&
             (0, StyleHelper_1.hasCellBoxStyle)(styledColumn.IconStyle.Cell);
         return ((0, StyleHelper_1.hasCellBoxStyle)(styledColumn?.RatingStyle?.Cell) ||
             (0, StyleHelper_1.hasCellBoxStyle)(styledColumn?.SparklineStyle?.Cell) ||
@@ -1406,7 +1406,7 @@ class AgGridColumnAdapter {
         // Row-kind filtering: defer to the shared row-scope helper so the
         // cellStyle path (Gradient background, Font/Cell slots) follows the
         // same `StyledColumn.RowScope` rules as every cellRenderer.
-        if (!(0, shouldRenderStyledColumnOnRow_1.shouldRenderStyledColumnOnRow)(styledColumn, params.node, this.adaptableApi)) {
+        if (!(0, StyledColumnHelper_1.shouldRenderStyledColumnOnRow)(styledColumn, params.node, this.adaptableApi)) {
             return style;
         }
         let colValue = params.value;
@@ -1419,24 +1419,24 @@ class AgGridColumnAdapter {
                 cellBackColor = gradientStyle.ColumnComparison.Color;
             }
             else {
-                const matchingRange = this.adaptableApi.styledColumnApi.internalApi.findRangeForColumn((0, StyledColumnGradientHelper_1.expandGradientCellRanges)(gradientStyle), abColumn, (0, StyledColumnGradientHelper_1.gradientStyleRangeLookupValueType)(gradientStyle), colValue);
+                const matchingRange = this.adaptableApi.styledColumnApi.internalApi.findRangeForColumn((0, GradientStyleHelper_1.expandGradientCellRanges)(gradientStyle), abColumn, (0, GradientStyleHelper_1.gradientStyleRangeLookupValueType)(gradientStyle), colValue);
                 if (matchingRange) {
                     cellBackColor = matchingRange.Color;
                     // Flip the alpha ramp when (a) it's the negative band of a
                     // ZeroCentred diverging gradient, OR (b) the user has explicitly
                     // marked this band as `ReverseGradient` (lower-is-darker).
                     reverseGradient =
-                        (!!gradientStyle.ZeroCentred && (0, StyledColumnGradientHelper_1.isNegativeZeroCentredBand)(matchingRange)) ||
+                        (!!gradientStyle.ZeroCentred && (0, GradientStyleHelper_1.isNegativeZeroCentredBand)(matchingRange)) ||
                             !!matchingRange.ReverseGradient;
                 }
             }
-            const minAlphaBound = gradientStyle.MinAlpha ?? StyledColumnGradientHelper_1.DEFAULT_GRADIENT_MIN_ALPHA;
-            const maxAlphaBound = gradientStyle.MaxAlpha ?? StyledColumnGradientHelper_1.DEFAULT_GRADIENT_MAX_ALPHA;
-            const lo = Math.min(Helper_1.default.clamp(minAlphaBound, 0, 1), Helper_1.default.clamp(maxAlphaBound, 0, 1));
-            const hi = Math.max(Helper_1.default.clamp(minAlphaBound, 0, 1), Helper_1.default.clamp(maxAlphaBound, 0, 1));
+            const minAlphaBound = gradientStyle.MinAlpha ?? GradientStyleHelper_1.DEFAULT_GRADIENT_MIN_ALPHA;
+            const maxAlphaBound = gradientStyle.MaxAlpha ?? GradientStyleHelper_1.DEFAULT_GRADIENT_MAX_ALPHA;
+            const lo = Math.min((0, NumberExtensions_1.clamp)(minAlphaBound, 0, 1), (0, NumberExtensions_1.clamp)(maxAlphaBound, 0, 1));
+            const hi = Math.max((0, NumberExtensions_1.clamp)(minAlphaBound, 0, 1), (0, NumberExtensions_1.clamp)(maxAlphaBound, 0, 1));
             const span = Math.abs(max - min);
             let t = span === 0 ? 0.5 : (Number(colValue) - min) / span;
-            t = Helper_1.default.clamp(t, 0, 1);
+            t = (0, NumberExtensions_1.clamp)(t, 0, 1);
             if (reverseGradient) {
                 t = 1 - t;
             }
@@ -1451,7 +1451,8 @@ class AgGridColumnAdapter {
                 }
             }
         }
-        if (styledColumn.PercentBarStyle && (0, barChartCellText_1.hasBarChartCellTextConfigured)(styledColumn.PercentBarStyle.CellTextProperties)) {
+        if (styledColumn.PercentBarStyle &&
+            (0, BarStylesHelper_1.hasBarStyleCellTextConfigured)(styledColumn.PercentBarStyle.CellTextProperties)) {
             style.paddingTop = 0;
             style.paddingBottom = 0;
         }
@@ -1465,7 +1466,7 @@ class AgGridColumnAdapter {
         // basis when a Gradient cell has a tinted background, even if the user
         // also set `Font.ForeColor` as a baseline.
         const autoContrastColor = gradientStyle?.AutoContrastText && style.color ? style.color : undefined;
-        const iconStyleFontApplies = styledColumn.IconStyle && !(0, iconStyledColumnColumnSupport_1.isUnsupportedColumnDataTypeForIconStyle)(abColumn.dataType);
+        const iconStyleFontApplies = styledColumn.IconStyle && !(0, IconStyleHelper_1.isUnsupportedColumnDataTypeForIconStyle)(abColumn.dataType);
         const fontSlot = styledColumn.GradientStyle?.Font ??
             styledColumn.PercentBarStyle?.Font ??
             styledColumn.BulletChartStyle?.Font ??
@@ -1477,7 +1478,7 @@ class AgGridColumnAdapter {
         if (fontSlot) {
             style = { ...style, ...(0, StyleHelper_1.convertAdaptableStyleToCSS)(fontSlot) };
         }
-        const iconStyleCellApplies = styledColumn.IconStyle && !(0, iconStyledColumnColumnSupport_1.isUnsupportedColumnDataTypeForIconStyle)(abColumn.dataType);
+        const iconStyleCellApplies = styledColumn.IconStyle && !(0, IconStyleHelper_1.isUnsupportedColumnDataTypeForIconStyle)(abColumn.dataType);
         const cellSlot = styledColumn.RatingStyle?.Cell ??
             styledColumn.SparklineStyle?.Cell ??
             styledColumn.BadgeStyle?.Cell ??

package/src/agGrid/AgGridExportAdapter.js

@@ -9,7 +9,7 @@ const Uuid_1 = require("../AdaptableState/Uuid");
 const GeneralConstants_1 = require("../Utilities/Constants/GeneralConstants");
 const ModuleConstants_1 = require("../Utilities/Constants/ModuleConstants");
 const StringExtensions_1 = tslib_1.__importDefault(require("../Utilities/Extensions/StringExtensions"));
-const FormatHelper_1 = tslib_1.__importStar(require("../Utilities/Helpers/FormatHelper"));
+const DisplayFormatHelper_1 = tslib_1.__importStar(require("../Utilities/Helpers/DisplayFormatHelper"));
 const StyleHelper_1 = require("../Utilities/Helpers/StyleHelper");
 const waitForTimeout_1 = require("../Utilities/waitForTimeout");
 class AgGridExportAdapter {
@@ -661,7 +661,7 @@ class AgGridExportAdapter {
                             // we have to pass the date in the ISO format to Excel
                             // see https://www.ag-grid.com/javascript-data-grid/excel-export-data-types/#dates
                             // we can NOT use Date.toISOString() because we don't want the timezone corrections to kick in
-                            const isoFormattedValue = (0, FormatHelper_1.DateFormatter)(normalisedValue, {
+                            const isoFormattedValue = (0, DisplayFormatHelper_1.DateFormatter)(normalisedValue, {
                                 Pattern: `yyyy-MM-dd'T'HH:mm:ss.SSS`,
                             });
                             if (isoFormattedValue) {
@@ -900,7 +900,7 @@ class AgGridExportAdapter {
         if (isDateColumn) {
             const customExportDateFormat = this.getCustomExportDateFormat(column, exportContext);
             if (!!customExportDateFormat) {
-                return FormatHelper_1.default.DateFormatter(cellRawValue, {
+                return DisplayFormatHelper_1.default.DateFormatter(cellRawValue, {
                     Pattern: customExportDateFormat,
                 });
             }

package/src/agGrid/AgGridMenuAdapter.js

@@ -6,8 +6,133 @@ const Icon_1 = require("../components/Icon");
 const icons_1 = require("../components/icons");
 const ArrayExtensions_1 = tslib_1.__importDefault(require("../Utilities/Extensions/ArrayExtensions"));
 const GeneralConstants_1 = require("../Utilities/Constants/GeneralConstants");
-const buildValueAggregationMenuItem_1 = require("./buildValueAggregationMenuItem");
-const createAgGridIcon_1 = require("./createAgGridIcon");
+const AggregationColumns_1 = require("../AdaptableState/Common/AggregationColumns");
+/**
+ * Creates an AG Grid icon element for the given icon name.
+ *
+ * Mimics AG Grid's internal icon creation, producing a
+ * `<span class="ag-icon ag-icon-{name}" role="presentation" unselectable="on">`
+ * so the icon picks up AG Grid's own icon font/theme styling.
+ *
+ * @see https://github.com/ag-grid/ag-grid/blob/5ca14e73188f6f52fd7d545d595c067bf1b72168/packages/ag-grid-community/src/utils/icon.ts#L139
+ */
+function createAgGridIcon(name) {
+    const element = document.createElement('span');
+    element.className = `ag-icon ag-icon-${name}`;
+    element.setAttribute('role', 'presentation');
+    element.setAttribute('unselectable', 'on');
+    return element;
+}
+const toFuncLabel = (funcName) => {
+    if (funcName === 'avg') {
+        return 'Average';
+    }
+    if (funcName === 'weightedAvg') {
+        return 'Weighted Average';
+    }
+    return funcName ? funcName.charAt(0).toUpperCase() + funcName.slice(1) : funcName;
+};
+/**
+ * Builds the replacement for AG Grid's built-in `valueAggSubMenu` column menu item.
+ *
+ * AG Grid does not allow customizing the built-in submenu, so we rebuild an
+ * equivalent one: the column's existing aggregation functions plus a
+ * `Weighted Average` item whose submenu lists the numeric columns that can be
+ * used as the weight parameter.
+ *
+ * Both standard and weighted selections persist through the current Layout
+ * (`updateCurrentLayout`), so the existing `weightedAvg` aggFunc can read the
+ * chosen `weightedColumnId` back from the Layout.
+ *
+ * Weighted Average is never used in Pivot Layouts, so this only deals with the
+ * Table Layout aggregations and the caller skips it entirely in Pivot mode.
+ */
+function buildValueAggregationMenuItem(adaptableApi, menuContext) {
+    const column = menuContext.adaptableColumn;
+    const columnId = column.columnId;
+    const currentLayout = adaptableApi.layoutApi.getCurrentLayout();
+    const aggregationColumns = currentLayout.TableAggregationColumns || [];
+    const currentAggFunc = aggregationColumns.find((agg) => agg.ColumnId === columnId)?.AggFunc;
+    let activeAggFuncName;
+    if (currentAggFunc != null) {
+        const aggFuncName = (0, AggregationColumns_1.getAggFuncName)(currentAggFunc);
+        activeAggFuncName = aggFuncName === true ? column.aggregationFunction : aggFuncName;
+    }
+    const activeWeightColumnId = (0, AggregationColumns_1.isWeightedAverageAggregation)(currentAggFunc)
+        ? currentAggFunc.weightedColumnId
+        : undefined;
+    const applyAggregation = (aggFuncValue) => {
+        const upsert = (cols) => {
+            const list = cols ? [...cols] : [];
+            const index = list.findIndex((col) => col.ColumnId === columnId);
+            if (index >= 0) {
+                list[index] = { ...list[index], AggFunc: aggFuncValue };
+            }
+            else {
+                list.push({ ColumnId: columnId, AggFunc: aggFuncValue });
+            }
+            return list;
+        };
+        adaptableApi.layoutApi.updateCurrentLayout((layout) => {
+            const tableLayout = layout;
+            return {
+                ...tableLayout,
+                TableAggregationColumns: upsert(tableLayout.TableAggregationColumns),
+            };
+        });
+    };
+    const removeAggregation = () => {
+        adaptableApi.layoutApi.updateCurrentLayout((layout) => {
+            const tableLayout = layout;
+            return {
+                ...tableLayout,
+                TableAggregationColumns: (tableLayout.TableAggregationColumns || []).filter((col) => col.ColumnId !== columnId),
+            };
+        });
+    };
+    // 'None' clears any aggregation for the column and is checked when none is set
+    const subMenu = [
+        {
+            name: 'None',
+            checked: activeAggFuncName == null,
+            action: () => removeAggregation(),
+        },
+    ];
+    // getDisplayAggFuncNames already positions weightedAvg right after 'avg'
+    // (and only includes it when the column is eligible)
+    const aggFuncItems = (0, AggregationColumns_1.getDisplayAggFuncNames)(column).map((funcName) => {
+        // Weighted Average needs a weight column parameter, so instead of a plain
+        // action it gets a submenu listing the numeric columns usable as the weight.
+        if (funcName === AggregationColumns_1.WEIGHTED_AVERAGE_AGG_FN_NAME) {
+            const weightColumnItems = adaptableApi.columnApi
+                .getNumericColumns()
+                .filter((numericColumn) => numericColumn.columnId !== columnId)
+                .map((numericColumn) => ({
+                name: numericColumn.friendlyName ?? numericColumn.columnId,
+                checked: activeWeightColumnId === numericColumn.columnId,
+                action: () => applyAggregation({
+                    type: 'weightedAverage',
+                    weightedColumnId: numericColumn.columnId,
+                }),
+            }));
+            return {
+                name: 'Weighted Average',
+                checked: activeAggFuncName === AggregationColumns_1.WEIGHTED_AVERAGE_AGG_FN_NAME,
+                subMenu: weightColumnItems,
+            };
+        }
+        return {
+            name: toFuncLabel(funcName),
+            checked: activeAggFuncName === funcName,
+            action: () => applyAggregation(funcName),
+        };
+    });
+    subMenu.push(...aggFuncItems);
+    return {
+        name: 'Value Aggregation',
+        subMenu,
+    };
+}
 class AgGridMenuAdapter {
     _adaptableInstance;
     constructor(_adaptableInstance) {
@@ -67,8 +192,8 @@ class AgGridMenuAdapter {
         const isPivotLayout = this.adaptableApi.layoutApi.isCurrentLayoutPivot();
         const mappedAgGridMenuItems = agGridMenuItems.map((itemName) => itemName === 'valueAggSubMenu' && !isPivotLayout
             ? {
-                ...(0, buildValueAggregationMenuItem_1.buildValueAggregationMenuItem)(this.adaptableApi, menuContext),
-                icon: (0, createAgGridIcon_1.createAgGridIcon)('aggregation'),
+                ...buildValueAggregationMenuItem(this.adaptableApi, menuContext),
+                icon: createAgGridIcon('aggregation'),
             }
             : itemName);
         const defaultContextMenu = [

package/src/agGrid/cellRenderers/BadgeRenderer.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const Badge_1 = require("../../View/Components/Badge");
 const renderWithAdaptableContext_1 = require("../../View/renderWithAdaptableContext");
 const React = tslib_1.__importStar(require("react"));
-const shouldRenderStyledColumnOnRow_1 = require("./shouldRenderStyledColumnOnRow");
+const StyledColumnHelper_1 = require("../../Utilities/Helpers/StyledColumns/StyledColumnHelper");
 const OVERFLOW_CLASS = {
     Truncate: 'ab-Badge__wrapper--truncate',
     Wrap: 'ab-Badge__wrapper--wrap',
@@ -56,7 +56,7 @@ const getBadgeRendererForColumn = (styledColumn, abColumn, api) => {
                 this.eGui.style.setProperty('justify-content', rowJustify);
                 this.eGui.style.setProperty('width', '100%');
             }
-            if (!(0, shouldRenderStyledColumnOnRow_1.shouldRenderStyledColumnOnRow)(styledColumn, params.node, adaptableApi)) {
+            if (!(0, StyledColumnHelper_1.shouldRenderStyledColumnOnRow)(styledColumn, params.node, adaptableApi)) {
                 const formattedValue = params.formatValue?.(params.value) ?? params.value ?? '';
                 this.eGui.innerHTML = formattedValue;
                 return;

package/src/agGrid/cellRenderers/BulletChartRenderer.js

@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getBulletChartRendererForColumn = void 0;
 const tslib_1 = require("tslib");
 const Helper_1 = tslib_1.__importDefault(require("../../Utilities/Helpers/Helper"));
-const clamp_1 = tslib_1.__importDefault(require("../../Utilities/utils/clamp"));
-const barChartCellText_1 = require("../../Utilities/Helpers/barChartCellText");
-const shouldRenderStyledColumnOnRow_1 = require("./shouldRenderStyledColumnOnRow");
+const NumberExtensions_1 = require("../../Utilities/Extensions/NumberExtensions");
+const BarStylesHelper_1 = require("../../Utilities/Helpers/StyledColumns/BarStylesHelper");
+const StyledColumnHelper_1 = require("../../Utilities/Helpers/StyledColumns/StyledColumnHelper");
 const SVG_NS = 'http://www.w3.org/2000/svg';
 const DEFAULT_BAR_HEIGHT = 8;
 const DEFAULT_BAND_HEIGHT = 14;
@@ -106,7 +106,7 @@ const toFraction = (value, min, max) => {
     if (max === min) {
         return 0;
     }
-    return (0, clamp_1.default)((value - min) / (max - min), 0, 1);
+    return (0, NumberExtensions_1.clamp)((value - min) / (max - min), 0, 1);
 };
 const getBulletChartRendererForColumn = (styledColumn, abColumn, api) => {
     if (!styledColumn.BulletChartStyle) {
@@ -117,7 +117,7 @@ const getBulletChartRendererForColumn = (styledColumn, abColumn, api) => {
         eGui;
         init(params) {
             // Defer to the shared row-scope helper.
-            if (!(0, shouldRenderStyledColumnOnRow_1.shouldRenderStyledColumnOnRow)(styledColumn, params.node, api)) {
+            if (!(0, StyledColumnHelper_1.shouldRenderStyledColumnOnRow)(styledColumn, params.node, api)) {
                 if (params.value != undefined) {
                     this.eGui = document.createElement('div');
                     this.eGui.append(String(params.value));
@@ -159,7 +159,7 @@ const getBulletChartRendererForColumn = (styledColumn, abColumn, api) => {
             const barThickness = bulletStyle.Bar?.Height ?? DEFAULT_BAR_HEIGHT;
             const bandThickness = Math.max(barThickness + 6, DEFAULT_BAND_HEIGHT);
             const cellTextProperties = bulletStyle.CellTextProperties;
-            const hasCellText = (0, barChartCellText_1.hasBarChartCellTextConfigured)(cellTextProperties);
+            const hasCellText = (0, BarStylesHelper_1.hasBarStyleCellTextConfigured)(cellTextProperties);
             // Map a 0..1 value fraction onto the long-axis viewBox (0..100).
             // In horizontal: 0 -> left, 1 -> right.
             // In vertical:   0 -> bottom, 1 -> top (SVG y origin is at the top so
@@ -285,8 +285,8 @@ const getBulletChartRendererForColumn = (styledColumn, abColumn, api) => {
                 // `valueFormatter` returns the raw value (a number here), so coerce
                 // to string before it flows into the helpers.
                 const formattedCellValue = String(params.formatValue?.(cellValue) ?? cellValue);
-                const labels = (0, barChartCellText_1.buildBarChartCellTextLabels)(cellTextProperties, formattedCellValue, `${(valueFraction * 100).toFixed(0)}%`);
-                (0, barChartCellText_1.mountBarChartCellText)({
+                const labels = (0, BarStylesHelper_1.buildBarStyleCellTextLabels)(cellTextProperties, formattedCellValue, `${(valueFraction * 100).toFixed(0)}%`);
+                (0, BarStylesHelper_1.mountBarStyleCellText)({
                     wrapperEl: this.eGui,
                     mergedOverlayEl: svgContainer,
                     textClassName: 'ab-BulletChart__text',