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

package/src/agGrid/cellRenderers/PercentBarRenderer.js

@@ -3,8 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getPercentBarRendererForColumn = 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 shouldRenderStyledColumnOnRow_1 = require("./shouldRenderStyledColumnOnRow");
+const NumberExtensions_1 = require("../../Utilities/Extensions/NumberExtensions");
+const StyledColumnHelper_1 = require("../../Utilities/Helpers/StyledColumns/StyledColumnHelper");
+const BarStylesHelper_1 = require("../../Utilities/Helpers/StyledColumns/BarStylesHelper");
 /**
  * Resolve the origin value (in the same numeric space as `min`/`max`) the bar
  * should grow from.
@@ -35,7 +36,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);
 };
 /** Column-comparison mode: centred 50% axis when Origin is Auto or Zero. */
 const columnComparisonUsesCentredAxis = (origin) => {
@@ -45,58 +46,6 @@ const columnComparisonUsesCentredAxis = (origin) => {
     }
     return o === 'Zero' || o === 'Auto';
 };
-/**
- * Linear (non-comparison) mode: bar grows from an interior point of the scale
- * (so positives / negatives can diverge left and right).
- */
-const linearScaleUsesCentredAxis = (percentBarStyle, cellValue, min, max) => {
-    const origin = percentBarStyle.Origin ?? 'Auto';
-    if (origin === 'Zero') {
-        return true;
-    }
-    if (origin === 'Min') {
-        return false;
-    }
-    if (typeof origin === 'number') {
-        if (max === min) {
-            return false;
-        }
-        const f = toFraction(origin, min, max);
-        return f > 0 && f < 1;
-    }
-    // Auto — same condition as resolveOrigin using 0 as the pivot.
-    return min < 0 || max < 0 || cellValue < 0;
-};
-const resolveCellTextAlignCss = (percentBarStyle, args) => {
-    const mode = percentBarStyle.CellTextAlignment;
-    if (mode == undefined) {
-        return undefined;
-    }
-    if (mode === 'Left') {
-        return 'left';
-    }
-    if (mode === 'Right') {
-        return 'right';
-    }
-    if (mode === 'Center') {
-        return 'center';
-    }
-    // Auto
-    const centred = args.hasColumnComparison
-        ? columnComparisonUsesCentredAxis(percentBarStyle.Origin)
-        : linearScaleUsesCentredAxis(percentBarStyle, args.numericValue, args.min, args.max);
-    if (!centred) {
-        return undefined;
-    }
-    const v = args.hasColumnComparison ? args.percentageValue : args.numericValue;
-    if (v > 0) {
-        return 'right';
-    }
-    if (v < 0) {
-        return 'left';
-    }
-    return 'center';
-};
 const getPercentBarRendererForColumn = (styledColumn, abColumn, api) => {
     if (!styledColumn.PercentBarStyle) {
         return;
@@ -107,7 +56,7 @@ const getPercentBarRendererForColumn = (styledColumn, abColumn, api) => {
             // Defer to the shared row-scope helper. Default behaviour
             // ("group rows fall back to plain text") is preserved when
             // `RowScope` is unset.
-            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));
@@ -174,7 +123,7 @@ const getPercentBarRendererForColumn = (styledColumn, abColumn, api) => {
             }
             else {
                 // Linear value-on-scale.
-                percentageValue = (((0, clamp_1.default)(numericValue, min, max) - min) / (max - min)) * 100;
+                percentageValue = (((0, NumberExtensions_1.clamp)(numericValue, min, max) - min) / (max - min)) * 100;
                 const origin = resolveOrigin(percentBarStyle, numericValue, min, max);
                 const valueFrac = toFraction(numericValue, min, max);
                 const originFrac = toFraction(origin, min, max);
@@ -195,11 +144,14 @@ const getPercentBarRendererForColumn = (styledColumn, abColumn, api) => {
                 }
             }
             // ----- Build the DOM -------------------------------------------------
-            const hasCellText = percentBarStyle.CellText && percentBarStyle.CellText.length > 0;
-            const isTextPositionMerged = percentBarStyle.CellTextPosition === 'Merged';
+            const cellTextProperties = percentBarStyle.CellTextProperties;
+            const hasCellText = (0, BarStylesHelper_1.hasBarStyleCellTextConfigured)(cellTextProperties);
+            // Wrapper always fills the cell. The bar is the flex-grow child so it
+            // claims whatever space the (compact) text rows leave, with a small
+            // floor to stay visible even on short rows.
             this.eGui = document.createElement('div');
             this.eGui.className = 'ab-PercentBar__wrapper';
-            this.eGui.style.height = hasCellText && !isTextPositionMerged ? '80%' : '100%';
+            this.eGui.style.height = '100%';
             this.eGui.style.display = 'flex';
             this.eGui.style.flexDirection = 'column';
             this.eGui.style.justifyContent = 'center';
@@ -212,7 +164,10 @@ const getPercentBarRendererForColumn = (styledColumn, abColumn, api) => {
             if (percentBarStyle.BackColor) {
                 barEl.style.background = percentBarStyle.BackColor;
             }
-            barEl.style.flex = '1';
+            barEl.style.flex = '1 1 0';
+            // Floor so the bar can't be squeezed out of existence when both
+            // `Above` and `Below` bands are populated on a short row.
+            barEl.style.minHeight = '6px';
             // Render the inside bar whenever a colour has been resolved, even at
             // 0% width. A zero-width div is visually identical to skipping the
             // element but keeps the DOM consistent so tests / tooling can still
@@ -233,47 +188,20 @@ const getPercentBarRendererForColumn = (styledColumn, abColumn, api) => {
             }
             this.eGui.append(barEl);
             if (hasCellText) {
-                const textEl = document.createElement('div');
-                textEl.className = 'ab-PercentBar__text';
-                textEl.style.lineHeight = '1.2';
-                const parts = [];
-                if (percentBarStyle.CellText.includes('CellValue')) {
-                    parts.push(params.formatValue?.(rawCellValue) ?? String(rawCellValue));
-                }
-                if (percentBarStyle.CellText.includes('PercentageValue')) {
-                    parts.push(`${percentageValue.toFixed(0)}%`);
-                }
-                textEl.innerText = parts.join(' ');
-                const textAlignCss = resolveCellTextAlignCss(percentBarStyle, {
-                    numericValue,
-                    percentageValue,
-                    min,
-                    max,
-                    hasColumnComparison: !!percentBarStyle.ColumnComparison,
+                // Coerce to string: when no `valueFormatter` is set on the column,
+                // `params.formatValue` returns the raw value (a number for numeric
+                // columns), which then propagates through the helpers as a non-string
+                // and breaks string-only operations (e.g. `.length` checks).
+                const formattedCellValue = String(params.formatValue?.(rawCellValue) ?? rawCellValue);
+                const labels = (0, BarStylesHelper_1.buildBarStyleCellTextLabels)(cellTextProperties, formattedCellValue, `${percentageValue.toFixed(0)}%`);
+                (0, BarStylesHelper_1.mountBarStyleCellText)({
+                    wrapperEl: this.eGui,
+                    mergedOverlayEl: barEl,
+                    textClassName: 'ab-PercentBar__text',
+                    cellTextProperties,
+                    labels,
+                    mergedPointerEventsNone: false,
                 });
-                if (textAlignCss) {
-                    textEl.style.textAlign = textAlignCss;
-                }
-                switch (percentBarStyle.CellTextPosition) {
-                    case 'Above':
-                        this.eGui.prepend(textEl);
-                        break;
-                    case 'Merged':
-                        textEl.style.position = 'absolute';
-                        // Centre vertically without knowing the row height
-                        textEl.style.top = '50%';
-                        textEl.style.transform = 'translateY(-50%)';
-                        textEl.style.left = '0';
-                        textEl.style.right = '0';
-                        textEl.style.paddingLeft = '5px';
-                        textEl.style.paddingRight = '5px';
-                        barEl.append(textEl);
-                        break;
-                    case 'Below':
-                    default:
-                        this.eGui.append(textEl);
-                        break;
-                }
             }
         }
         getGui() {

package/src/agGrid/cellRenderers/RangeBarRenderer.js

@@ -3,8 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getRangeBarRendererForColumn = 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 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_TRACK_HEIGHT = 4;
 const DEFAULT_BAND_HEIGHT = 14;
@@ -50,8 +51,7 @@ const normaliseMarker = (override, defaults) => {
     return {
         Shape: shape,
         Color: override?.Color ?? defaults.Color,
-        Size: override?.Size ??
-            (shape === 'Line' ? DEFAULT_LINE_MARKER_THICKNESS : defaults.Size),
+        Size: override?.Size ?? (shape === 'Line' ? DEFAULT_LINE_MARKER_THICKNESS : defaults.Size),
     };
 };
 /**
@@ -63,7 +63,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 getRangeBarRendererForColumn = (styledColumn, abColumn, api) => {
     if (!styledColumn.RangeBarStyle) {
@@ -74,7 +74,7 @@ const getRangeBarRendererForColumn = (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));
@@ -100,8 +100,9 @@ const getRangeBarRendererForColumn = (styledColumn, abColumn, api) => {
                 this.eGui.append(params.formatValue?.(rawCellValue) ?? String(rawCellValue));
                 return;
             }
-            const referenceValue = rangeStyle.Reference != undefined
-                ? resolveBoundValue(rangeStyle.Reference, abColumn, params.node, api)
+            const referenceProperties = rangeStyle.Reference;
+            const referenceValue = referenceProperties?.Value != undefined
+                ? resolveBoundValue(referenceProperties.Value, abColumn, params.node, api)
                 : undefined;
             // Markers - resolve user overrides against per-marker defaults.
             const valueMarker = normaliseMarker(rangeStyle.Marker, {
@@ -109,21 +110,24 @@ const getRangeBarRendererForColumn = (styledColumn, abColumn, api) => {
                 Color: DEFAULT_VALUE_MARKER_COLOR,
                 Size: DEFAULT_VALUE_MARKER_SIZE,
             });
-            const referenceMarker = normaliseMarker(rangeStyle.ReferenceMarker, {
+            const referenceMarker = normaliseMarker(referenceProperties?.Marker, {
                 Shape: 'Line',
                 Color: DEFAULT_REFERENCE_MARKER_COLOR,
                 Size: DEFAULT_LINE_MARKER_THICKNESS,
             });
             // Out-of-range handling
-            const outOfRangeMode = rangeStyle.OutOfRangeMode ?? 'Clamp';
+            const outOfRangeProperties = rangeStyle.OutOfRange;
+            const outOfRangeMode = outOfRangeProperties?.Mode ?? 'Clamp';
+            const outOfRangeColor = outOfRangeProperties?.Color;
             const isOutOfRange = numericValue < min || numericValue > max;
             const hideValueMarker = isOutOfRange && outOfRangeMode === 'Hide';
             // Layout
             const isVertical = rangeStyle.Orientation === 'Vertical';
-            const trackThickness = rangeStyle.TrackHeight ?? DEFAULT_TRACK_HEIGHT;
+            const trackProperties = rangeStyle.Track;
+            const trackThickness = trackProperties?.Height ?? DEFAULT_TRACK_HEIGHT;
             const bandThickness = Math.max(trackThickness + 6, DEFAULT_BAND_HEIGHT);
-            const hasCellText = rangeStyle.CellText && rangeStyle.CellText.length > 0;
-            const isTextMerged = rangeStyle.CellTextPosition === 'Merged';
+            const cellTextProperties = rangeStyle.CellTextProperties;
+            const hasCellText = (0, BarStylesHelper_1.hasBarStyleCellTextConfigured)(cellTextProperties);
             // Map a 0..1 fraction onto the long-axis viewBox (0..100). Vertical
             // orientation inverts so that lower values appear at the bottom of
             // the cell, matching user expectation.
@@ -136,7 +140,7 @@ const getRangeBarRendererForColumn = (styledColumn, abColumn, api) => {
             this.eGui.style.alignItems = isVertical ? 'center' : 'stretch';
             this.eGui.style.justifyContent = 'center';
             this.eGui.style.position = 'relative';
-            this.eGui.style.height = hasCellText && !isTextMerged ? '80%' : '100%';
+            this.eGui.style.height = '100%';
             const svg = document.createElementNS(SVG_NS, 'svg');
             svg.setAttribute('class', 'ab-RangeBar__svg');
             svg.setAttribute('preserveAspectRatio', 'none');
@@ -195,11 +199,11 @@ const getRangeBarRendererForColumn = (styledColumn, abColumn, api) => {
             const trackCrossOffset = (bandThickness - trackThickness) / 2;
             const track = document.createElementNS(SVG_NS, 'rect');
             setRectAxes(track, 0, 100, trackCrossOffset, trackThickness);
-            track.setAttribute('fill', rangeStyle.TrackColor ?? DEFAULT_TRACK_COLOR);
+            track.setAttribute('fill', trackProperties?.Color ?? DEFAULT_TRACK_COLOR);
             track.setAttribute('class', 'ab-RangeBar__track');
             // Slight transparency by default so the track doesn't drown out the
-            // band colours; honour explicit user TrackColor as-is.
-            if (rangeStyle.TrackColor == undefined) {
+            // band colours; honour explicit user Track.Color as-is.
+            if (trackProperties?.Color == undefined) {
                 // With no bands the cell background is often plain — the same muted
                 // foreground at 0.35 opacity can disappear (only the accent marker reads).
                 // Bands provide contrast underneath, so keep the subtle blend there.
@@ -228,8 +232,8 @@ const getRangeBarRendererForColumn = (styledColumn, abColumn, api) => {
                     valueFraction = toFraction(numericValue, min, max);
                 }
                 const valueCoord = valueAxisCoord(valueFraction);
-                const effectiveMarker = isOutOfRange && outOfRangeMode === 'Clamp' && rangeStyle.OutOfRangeColor
-                    ? { ...valueMarker, Color: rangeStyle.OutOfRangeColor }
+                const effectiveMarker = isOutOfRange && outOfRangeMode === 'Clamp' && outOfRangeColor
+                    ? { ...valueMarker, Color: outOfRangeColor }
                     : valueMarker;
                 const markerEl = createMarkerElement(effectiveMarker, valueCoord, bandThickness, isVertical);
                 if (markerEl) {
@@ -237,40 +241,38 @@ const getRangeBarRendererForColumn = (styledColumn, abColumn, api) => {
                     svg.appendChild(markerEl);
                 }
             }
-            this.eGui.appendChild(svg);
+            // Wrap the SVG in a positioned container so a `Merged` text row sits
+            // centred on the *bar*, not on the cell — see BulletChartRenderer for
+            // the same fix and Percent Bar for the matching behaviour via its
+            // `barEl`.
+            const svgContainer = document.createElement('div');
+            svgContainer.style.position = 'relative';
+            svgContainer.style.display = 'flex';
+            svgContainer.style.alignItems = 'center';
+            svgContainer.style.justifyContent = 'center';
+            if (isVertical) {
+                svgContainer.style.flex = '1 1 auto';
+                svgContainer.style.minHeight = '0';
+            }
+            else {
+                svgContainer.style.flex = '0 0 auto';
+            }
+            svgContainer.appendChild(svg);
+            this.eGui.appendChild(svgContainer);
             if (hasCellText) {
-                const textEl = document.createElement('div');
-                textEl.className = 'ab-RangeBar__text';
-                textEl.style.lineHeight = '1.2';
-                const parts = [];
-                if (rangeStyle.CellText.includes('CellValue')) {
-                    parts.push(params.formatValue?.(numericValue) ?? String(numericValue));
-                }
-                if (rangeStyle.CellText.includes('PercentageValue')) {
-                    const pct = (0, clamp_1.default)((numericValue - min) / (max - min), 0, 1) * 100;
-                    parts.push(`${pct.toFixed(0)}%`);
-                }
-                textEl.innerText = parts.join(' ');
-                switch (rangeStyle.CellTextPosition) {
-                    case 'Above':
-                        this.eGui.prepend(textEl);
-                        break;
-                    case 'Merged':
-                        textEl.style.position = 'absolute';
-                        textEl.style.top = '50%';
-                        textEl.style.transform = 'translateY(-50%)';
-                        textEl.style.left = '0';
-                        textEl.style.right = '0';
-                        textEl.style.paddingLeft = '5px';
-                        textEl.style.paddingRight = '5px';
-                        textEl.style.pointerEvents = 'none';
-                        this.eGui.appendChild(textEl);
-                        break;
-                    case 'Below':
-                    default:
-                        this.eGui.appendChild(textEl);
-                        break;
-                }
+                const pct = (0, NumberExtensions_1.clamp)((numericValue - min) / (max - min), 0, 1) * 100;
+                // See PercentBarRenderer: `params.formatValue` on a column without a
+                // `valueFormatter` returns the raw value (a number here), so coerce
+                // to string before it flows into the helpers.
+                const formattedCellValue = String(params.formatValue?.(numericValue) ?? numericValue);
+                const labels = (0, BarStylesHelper_1.buildBarStyleCellTextLabels)(cellTextProperties, formattedCellValue, `${pct.toFixed(0)}%`);
+                (0, BarStylesHelper_1.mountBarStyleCellText)({
+                    wrapperEl: this.eGui,
+                    mergedOverlayEl: svgContainer,
+                    textClassName: 'ab-RangeBar__text',
+                    cellTextProperties,
+                    labels,
+                });
             }
         }
         getGui() {

package/src/agGrid/cellRenderers/RatingRenderer.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getRatingRendererForColumn = 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 shouldRenderStyledColumnOnRow_1 = require("./shouldRenderStyledColumnOnRow");
+const NumberExtensions_1 = require("../../Utilities/Extensions/NumberExtensions");
+const StyledColumnHelper_1 = require("../../Utilities/Helpers/StyledColumns/StyledColumnHelper");
 const SVG_NS = 'http://www.w3.org/2000/svg';
 const DEFAULT_MAX = 5;
 const DEFAULT_SIZE = 14;
@@ -71,7 +71,7 @@ const createIconElement = (shape, fill, filledColor, emptyColor, size, uid) => {
         const clipRect = document.createElementNS(SVG_NS, 'rect');
         clipRect.setAttribute('x', '0');
         clipRect.setAttribute('y', '0');
-        clipRect.setAttribute('width', String(24 * (0, clamp_1.default)(fill, 0, 1)));
+        clipRect.setAttribute('width', String(24 * (0, NumberExtensions_1.clamp)(fill, 0, 1)));
         clipRect.setAttribute('height', '24');
         clipPath.appendChild(clipRect);
         defs.appendChild(clipPath);
@@ -95,7 +95,7 @@ const getRatingRendererForColumn = (styledColumn, _abColumn, api) => {
             // Defer to the shared row-scope helper. Default (no `RowScope`)
             // matches the previous "group rows only fall back to plain text"
             // behaviour; users can opt other row kinds in / out explicitly.
-            if (!(0, shouldRenderStyledColumnOnRow_1.shouldRenderStyledColumnOnRow)(styledColumn, params.node, api)) {
+            if (!(0, StyledColumnHelper_1.shouldRenderStyledColumnOnRow)(styledColumn, params.node, api)) {
                 this.eGui = document.createElement('div');
                 if (params.value != undefined) {
                     this.eGui.append(String(params.value));
@@ -118,7 +118,7 @@ const getRatingRendererForColumn = (styledColumn, _abColumn, api) => {
             const emptyColor = ratingStyle.EmptyColor ?? DEFAULT_EMPTY_COLOR;
             const showValue = ratingStyle.ShowValue ?? false;
             // Quantise the value if half-icons aren't allowed.
-            const clampedValue = (0, clamp_1.default)(value, 0, max);
+            const clampedValue = (0, NumberExtensions_1.clamp)(value, 0, max);
             const effectiveValue = allowHalf
                 ? clampedValue
                 : Math.round(clampedValue);
@@ -136,7 +136,7 @@ const getRatingRendererForColumn = (styledColumn, _abColumn, api) => {
             for (let i = 0; i < max; i++) {
                 // Fill ratio for icon `i`: full when value >= i+1, partial when
                 // value falls between i and i+1, empty otherwise.
-                const fill = (0, clamp_1.default)(effectiveValue - i, 0, 1);
+                const fill = (0, NumberExtensions_1.clamp)(effectiveValue - i, 0, 1);
                 const iconEl = createIconElement(icon, fill, filledColor, emptyColor, size, `${uid}-${i}`);
                 iconEl.setAttribute('class', 'ab-Rating__icon');
                 this.eGui.appendChild(iconEl);

package/src/agGrid/editors/AdaptableDateEditor/index.js

@@ -6,7 +6,7 @@ const renderWithAdaptableContext_1 = require("../../../View/renderWithAdaptableC
 const InternalAdaptableDateEditor_1 = require("./InternalAdaptableDateEditor");
 const ag_grid_enterprise_1 = require("ag-grid-enterprise");
 const react_1 = require("react");
-const FormatHelper_1 = require("../../../Utilities/Helpers/FormatHelper");
+const DisplayFormatHelper_1 = require("../../../Utilities/Helpers/DisplayFormatHelper");
 function shouldClearExistingValue(params) {
     return params.eventKey === ag_grid_enterprise_1.KeyCode.BACKSPACE || params.eventKey === ag_grid_enterprise_1.KeyCode.DELETE;
 }
@@ -56,7 +56,7 @@ exports.AdaptableReactDateEditor = (0, react_1.forwardRef)((props, ref) => {
                         if (!Pattern) {
                             return value;
                         }
-                        return (0, FormatHelper_1.DateFormatter)(value, {
+                        return (0, DisplayFormatHelper_1.DateFormatter)(value, {
                             Pattern,
                         });
                     },
@@ -149,7 +149,7 @@ class AdaptableDateEditor {
                             if (!Pattern) {
                                 return value;
                             }
-                            return (0, FormatHelper_1.DateFormatter)(value, {
+                            return (0, DisplayFormatHelper_1.DateFormatter)(value, {
                                 Pattern,
                             });
                         },

package/src/components/ColorPicker/ColorPicker.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const react_1 = require("react");
-const debounce_1 = tslib_1.__importDefault(require("../../Utilities/utils/debounce"));
+const TimingHelper_1 = require("../../Utilities/Helpers/TimingHelper");
 const utils_1 = require("../../lib/utils");
 const Input_1 = tslib_1.__importDefault(require("../Input"));
 const StyleHelper_1 = require("../../Utilities/Helpers/StyleHelper");
@@ -17,7 +17,7 @@ exports.ColorPicker = React.forwardRef((props, ref) => {
     let { value, includeAlpha = true, className, ...restProps } = props;
     // Create a debounced version of onChange
     // we need this because moving the mouse A LOT in the custom color picker can break the React rendering
-    const debouncedOnChange = (0, react_1.useCallback)((0, debounce_1.default)((color) => {
+    const debouncedOnChange = (0, react_1.useCallback)((0, TimingHelper_1.debounce)((color) => {
         props.onChange(color);
     }, 30), [props.onChange]);
     // Clean up the debounce on unmount

package/src/components/Datepicker/index.js

@@ -8,7 +8,7 @@ const react_1 = require("react");
 const useProperty_1 = tslib_1.__importDefault(require("../utils/useProperty"));
 const SimpleButton_1 = tslib_1.__importDefault(require("../SimpleButton"));
 const GeneralConstants_1 = require("../../Utilities/Constants/GeneralConstants");
-const FormatHelper_1 = require("../../Utilities/Helpers/FormatHelper");
+const DisplayFormatHelper_1 = require("../../Utilities/Helpers/DisplayFormatHelper");
 const DatepickerContext_1 = require("./DatepickerContext");
 const AdaptableDateInlineInput_1 = require("../../View/Components/AdaptableInput/AdaptableDateInlineInput");
 const date_fns_1 = require("date-fns");
@@ -66,7 +66,7 @@ exports.Datepicker = React.forwardRef((props, ref) => {
         setValue(next);
         setMonth(next ?? new Date());
     };
-    const inputValue = (0, FormatHelper_1.DateFormatter)(value, { Pattern: dateProps.format }) ?? '';
+    const inputValue = (0, DisplayFormatHelper_1.DateFormatter)(value, { Pattern: dateProps.format }) ?? '';
     // ── DOM refs for focus ownership ────────────────────────────────
     const triggerRef = React.useRef(null);
     const popupRef = React.useRef(null);

package/src/components/FormLayout/index.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const react_1 = require("react");
-const merge_1 = tslib_1.__importDefault(require("../../Utilities/utils/merge"));
+const ObjectExtensions_1 = require("../../Utilities/Extensions/ObjectExtensions");
 const join_1 = tslib_1.__importDefault(require("../utils/join"));
 const Flex_1 = require("../Flex");
 const FormLayoutContext = (0, react_1.createContext)(null);
@@ -27,7 +27,7 @@ const FormLayout = (props) => {
             };
         }
         if (defaultColumns[c.name]) {
-            c = (0, merge_1.default)({}, defaultColumns[c.name], c);
+            c = (0, ObjectExtensions_1.merge)({}, defaultColumns[c.name], c);
         }
         c.component = c.component === undefined ? defaultComponent : c.component;
         return c;

package/src/components/OverlayTrigger/index.js

@@ -5,7 +5,7 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const react_1 = require("react");
-const debounce_1 = tslib_1.__importDefault(require("../../Utilities/utils/debounce"));
+const TimingHelper_1 = require("../../Utilities/Helpers/TimingHelper");
 const batchUpdate_1 = tslib_1.__importDefault(require("../utils/batchUpdate"));
 const selectParent_1 = tslib_1.__importDefault(require("../utils/selectParent"));
 const useProperty_1 = tslib_1.__importDefault(require("../utils/useProperty"));
@@ -100,7 +100,7 @@ const OverlayTrigger = React.forwardRef((givenProps, ref) => {
     // visible state may quickly change from true -> false -> true
     // when moving the mouse cursor from the trigger to the overlay
     // for this case we debounce the visible change for a very small amount of time
-    (0, debounce_1.default)((visible) => {
+    (0, TimingHelper_1.debounce)((visible) => {
         // if (!visible) {
         //   return;
         // }

package/src/env.js

@@ -2,6 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = {
     NEXT_PUBLIC_INFINITE_TABLE_LICENSE_KEY: "StartDate=2021-06-29|EndDate=2030-01-01|Owner=Adaptable|Type=distribution|TS=1624971462479|C=137829811,1004007071,2756196225,1839832928,3994409405,636616862" || '',
-    PUBLISH_TIMESTAMP: 1781796455481 || Date.now(),
-    VERSION: "23.0.0-canary.7" || '--current-version--',
+    PUBLISH_TIMESTAMP: 1782138914072 || Date.now(),
+    VERSION: "23.0.0-canary.9" || '--current-version--',
 };

package/src/layout-manager/src/isLayoutEqual.js

@@ -4,8 +4,7 @@ exports.logChanges = exports.getChanges = void 0;
 exports.isTableLayoutEqual = isTableLayoutEqual;
 exports.isPivotLayoutEqual = isPivotLayoutEqual;
 exports.isLayoutEqual = isLayoutEqual;
-const tslib_1 = require("tslib");
-const isEqual_1 = tslib_1.__importDefault(require("../../Utilities/utils/isEqual"));
+const ObjectExtensions_1 = require("../../Utilities/Extensions/ObjectExtensions");
 const infinite_react_1 = require("@infinite-table/infinite-react");
 const isPivotLayoutModel_1 = require("./isPivotLayoutModel");
 const normalizeLayoutModel_1 = require("./normalizeLayoutModel");
@@ -25,7 +24,7 @@ const getChanges = (l1, l2) => {
     const allKeys = new Set([...k1, ...k2]);
     const changes = [];
     for (const key of allKeys) {
-        if (!(0, isEqual_1.default)(l1[key], l2[key])) {
+        if (!(0, ObjectExtensions_1.isEqual)(l1[key], l2[key])) {
             changes.push({ key, value1: l1[key], value2: l2[key] });
         }
     }
@@ -48,7 +47,7 @@ function isTableLayoutEqual(l1, l2) {
     l2 = (0, normalizeLayoutModel_1.normalizeTableLayoutModel)(l2);
     clearIgnoredProperties(l1);
     clearIgnoredProperties(l2);
-    const res = (0, isEqual_1.default)(l1, l2);
+    const res = (0, ObjectExtensions_1.isEqual)(l1, l2);
     if (!res) {
         (0, exports.logChanges)(l1, l2);
     }
@@ -73,7 +72,7 @@ function isPivotLayoutEqual(l1, l2) {
     l2 = (0, normalizeLayoutModel_1.normalizePivotLayoutModel)(l2);
     clearIgnoredProperties(l1);
     clearIgnoredProperties(l2);
-    const res = (0, isEqual_1.default)(l1, l2);
+    const res = (0, ObjectExtensions_1.isEqual)(l1, l2);
     if (!res) {
         (0, exports.logChanges)(l1, l2);
     }