@highcharts/grid-pro 2.2.0 → 2.3.0

package/es-modules/Core/Time.d.ts

@@ -63,6 +63,14 @@ declare namespace Time {
          * The count of the interval.
          */
         count: number;
+        /**
+         * A value for how well the returned tick interval fits the input
+         * interval. Ranges close to but above 1 indicate that the fit is bad,
+         * where 1 is a perfect fit for the _next_ higher interval. For example,
+         * if the algorithm lands on weekly ticks but the match is 1.01, it is
+         * very close to monthly ticks.
+         */
+        match?: number;
         /**
          * The name of the time unit.
          */

package/es-modules/Core/Time.js

@@ -10,8 +10,8 @@
  * */
 'use strict';
 import TimeBase from '../Shared/TimeBase.js';
-import U from '../Core/Utilities.js';
-const { defined, extend, timeUnits } = U;
+import { defined, extend } from '../Shared/Utilities.js';
+import { timeUnits } from './Utilities.js';
 /* *
  *
  *  Constants

package/es-modules/Core/Tooltip.d.ts

@@ -23,11 +23,6 @@ declare module './Series/SeriesBase' {
         tt?: SVGElement;
     }
 }
-declare module './Series/SeriesOptions' {
-    interface SeriesOptions {
-        tooltip?: Partial<TooltipOptions>;
-    }
-}
 /**
  * Tooltip of a chart.
  *
@@ -65,6 +60,7 @@ declare class Tooltip {
     distance: number;
     followPointer?: boolean;
     hideTimer?: number;
+    showTimer?: number;
     isSticky: boolean;
     label?: SVGElement;
     len?: number;
@@ -133,7 +129,7 @@ declare class Tooltip {
      *
      * @function Highcharts.Tooltip#defaultFormatter
      *
-     * @param {Highcharts.Tooltip} tooltip
+     * @param {Highcharts.Tooltip} tooltip The tooltip instance.
      *
      * @return {string|Array<string>}
      * Returns a string (single tooltip and shared)
@@ -221,7 +217,7 @@ declare class Tooltip {
 }
 declare namespace Tooltip {
     interface FormatterCallbackFunction {
-        (this: Point, tooltip: Tooltip): (false | string | Array<string>);
+        (this: Point, tooltip: Tooltip, ctx?: Point): (false | string | Array<string>);
     }
     interface HeaderFormatterEventObject {
         isFooter?: boolean;
@@ -229,7 +225,7 @@ declare namespace Tooltip {
         text?: string;
     }
     interface PositionerCallbackFunction {
-        (this: Tooltip, labelWidth: number, labelHeight: number, point: (Point | PositionerPointObject), anchor?: [number, number], alignLeft?: boolean): PositionObject;
+        (this: Tooltip, labelWidth: number, labelHeight: number, point: (Point | PositionerPointObject), ctx?: Tooltip, anchor?: [number, number], alignLeft?: boolean): PositionObject;
     }
     interface PositionerPointObject {
         isHeader?: boolean;

package/es-modules/Core/Tooltip.js

@@ -18,8 +18,16 @@ const { composed, dateFormats, doc, isSafari } = H;
 import R from './Renderer/RendererUtilities.js';
 const { distribute } = R;
 import RendererRegistry from './Renderer/RendererRegistry.js';
-import U from './Utilities.js';
-const { addEvent, clamp, css, clearTimeout, discardElement, extend, fireEvent, getAlignFactor, isArray, isNumber, isObject, isString, merge, pick, pushUnique, splat, syncTimeout } = U;
+import { addEvent, clamp, css, discardElement, extend, fireEvent, getAlignFactor, internalClearTimeout, isArray, isNumber, isObject, isString, merge, pick, pushUnique, splat, syncTimeout } from '../Shared/Utilities.js';
+/**
+ * Clear all timeouts for showing and hiding the tooltip.
+ *
+ * @internal
+ */
+const clearTimeouts = (tooltip) => {
+    clearTimeout(tooltip.hideTimer);
+    clearTimeout(tooltip.showTimer);
+};
 /* *
  *
  *  Class
@@ -118,7 +126,7 @@ class Tooltip {
         return points.map((point) => {
             const tooltipOptions = point.series.tooltipOptions, formatPrefix = point.formatPrefix || 'point';
             return (tooltipOptions[formatPrefix + 'Formatter'] ||
-                point.tooltipFormatter).call(point, tooltipOptions[formatPrefix + 'Format'] || '');
+                point.tooltipFormatter).call(point, tooltipOptions[formatPrefix + 'Format'] || '', point);
         });
     }
     /**
@@ -150,7 +158,7 @@ class Tooltip {
      *
      * @function Highcharts.Tooltip#defaultFormatter
      *
-     * @param {Highcharts.Tooltip} tooltip
+     * @param {Highcharts.Tooltip} tooltip The tooltip instance.
      *
      * @return {string|Array<string>}
      * Returns a string (single tooltip and shared)
@@ -187,7 +195,8 @@ class Tooltip {
             this.renderer = this.renderer.destroy();
             discardElement(this.container);
         }
-        clearTimeout(this.hideTimer);
+        internalClearTimeout(this.hideTimer);
+        clearTimeouts(this);
     }
     /**
      * Extendable method to get the anchor position of the tooltip
@@ -568,7 +577,7 @@ class Tooltip {
     hide(delay) {
         const tooltip = this;
         // Disallow duplicate timers (#1728, #1766)
-        clearTimeout(this.hideTimer);
+        clearTimeouts(this);
         delay = pick(delay, this.options.hideDelay);
         if (!this.isHidden) {
             this.hideTimer = syncTimeout(function () {
@@ -727,7 +736,7 @@ class Tooltip {
         if (!options.enabled || !point.series) { // #16820
             return;
         }
-        clearTimeout(this.hideTimer);
+        clearTimeouts(this);
         // A switch saying if this specific tooltip configuration allows shared
         // or split modes
         tooltip.allowShared = !(!isArray(pointOrPoints) &&
@@ -747,7 +756,7 @@ class Tooltip {
         this.len = points.length; // #6128
         const text = isString(formatString) ?
             format(formatString, point, chart) :
-            formatter.call(point, tooltip);
+            formatter.call(point, tooltip, point);
         // Reset the preliminary circular references
         point.points = void 0;
         // Register the current series
@@ -758,79 +767,83 @@ class Tooltip {
             this.hide();
         }
         else {
-            // Update text
-            if (tooltip.split && tooltip.allowShared) { // #13868
-                this.renderSplit(text, points);
-            }
-            else {
-                let checkX = x;
-                let checkY = y;
-                if (mouseEvent && pointer.isDirectTouch) {
-                    checkX = mouseEvent.chartX - chart.plotLeft;
-                    checkY = mouseEvent.chartY - chart.plotTop;
+            this.showTimer = syncTimeout(() => {
+                // Update text
+                if (tooltip.split && tooltip.allowShared) { // #13868
+                    tooltip.renderSplit(text, points);
                 }
-                // #11493, #13095
-                if (chart.polar ||
-                    currentSeries.options.clip === false ||
-                    points.some((p) => // #16004
-                     pointer.isDirectTouch || // ##17929
-                        p.series.shouldShowTooltip(checkX, checkY))) {
-                    const label = tooltip.getLabel(wasShared && tooltip.tt || {});
-                    // Prevent the tooltip from flowing over the chart box
-                    // (#6659)
-                    if (!options.style.width || styledMode) {
-                        label.css({
-                            width: (this.outside ?
-                                this.getPlayingField() :
-                                chart.spacingBox).width + 'px'
-                        });
+                else {
+                    let checkX = x;
+                    let checkY = y;
+                    if (mouseEvent && pointer.isDirectTouch) {
+                        checkX = mouseEvent.chartX - chart.plotLeft;
+                        checkY = mouseEvent.chartY - chart.plotTop;
                     }
-                    label.attr({
-                        // Add class before the label BBox calculation (#21035)
-                        'class': tooltip.getClassName(point),
-                        text: text && text.join ?
-                            text.join('') :
-                            text
-                    });
-                    // When the length of the label has increased, immediately
-                    // update the x position to prevent tooltip from flowing
-                    // outside the viewport during animation (#21371)
-                    if (this.outside) {
+                    // #11493, #13095
+                    if (chart.polar ||
+                        currentSeries.options.clip === false ||
+                        points.some((p) => // #16004
+                         pointer.isDirectTouch || // ##17929
+                            p.series.shouldShowTooltip(checkX, checkY))) {
+                        const label = tooltip.getLabel(wasShared && tooltip.tt || {});
+                        // Prevent the tooltip from flowing over the chart box
+                        // (#6659)
+                        if (!options.style.width || styledMode) {
+                            label.css({
+                                width: (this.outside ?
+                                    this.getPlayingField() :
+                                    chart.spacingBox).width + 'px'
+                            });
+                        }
                         label.attr({
-                            x: clamp(label.x || 0, 0, this.getPlayingField().width -
-                                (label.width || 0) -
-                                1)
+                            // Add class before the label BBox calculation
+                            // (#21035)
+                            'class': tooltip.getClassName(point),
+                            text: isArray(text) ?
+                                text.join('') :
+                                text
                         });
-                    }
-                    if (!styledMode) {
-                        label.attr({
-                            stroke: (options.borderColor ||
-                                point.color ||
-                                currentSeries.color ||
-                                "#666666" /* Palette.neutralColor60 */)
+                        // When the length of the label has increased,
+                        // immediately update the x position to prevent
+                        // tooltip from flowing outside the viewport
+                        // during animation (#21371)
+                        if (this.outside) {
+                            label.attr({
+                                x: clamp(label.x || 0, 0, this.getPlayingField().width -
+                                    (label.width || 0) -
+                                    1)
+                            });
+                        }
+                        if (!styledMode) {
+                            label.attr({
+                                stroke: (options.borderColor ||
+                                    point.color ||
+                                    currentSeries.color ||
+                                    "#666666" /* Palette.neutralColor60 */)
+                            });
+                        }
+                        tooltip.updatePosition({
+                            plotX: x,
+                            plotY: y,
+                            negative: point.negative,
+                            ttBelow: point.ttBelow,
+                            series: currentSeries,
+                            h: anchor[2] || 0
                         });
                     }
-                    tooltip.updatePosition({
-                        plotX: x,
-                        plotY: y,
-                        negative: point.negative,
-                        ttBelow: point.ttBelow,
-                        series: currentSeries,
-                        h: anchor[2] || 0
-                    });
+                    else {
+                        tooltip.hide();
+                        return;
+                    }
                 }
-                else {
-                    tooltip.hide();
-                    return;
+                // Show it
+                if (tooltip.isHidden && tooltip.label) {
+                    tooltip.label.attr({
+                        opacity: 1
+                    }).show();
                 }
-            }
-            // Show it
-            if (tooltip.isHidden && tooltip.label) {
-                tooltip.label.attr({
-                    opacity: 1
-                }).show();
-            }
-            tooltip.isHidden = false;
+                tooltip.isHidden = false;
+            }, tooltip.isHidden ? options.showDelay || 0 : 0);
         }
         fireEvent(this, 'refresh');
     }
@@ -905,7 +918,7 @@ class Tooltip {
          * Calculate the position of the partial tooltip
          * @internal
          */
-        const defaultPositioner = function (boxWidth, boxHeight, point, anchor = [0, 0], alignedLeft = true) {
+        const defaultPositioner = function (boxWidth, boxHeight, point, ctx, anchor = [0, 0], alignedLeft = true) {
             let x, y;
             if (point.isHeader) {
                 y = headerTop ? 0 : adjustedPlotHeight;
@@ -1005,7 +1018,7 @@ class Tooltip {
                 }
                 const { anchorX, anchorY } = getAnchor(point);
                 if (typeof anchorY === 'number') {
-                    const size = bBox.height + 1, boxPosition = (positioner || defaultPositioner).call(tooltip, boxWidth, size, point, [anchorX, anchorY]);
+                    const size = bBox.height + 1, boxPosition = (positioner || defaultPositioner).call(tooltip, boxWidth, size, point, tooltip, [anchorX, anchorY]);
                     boxes.push({
                         // 0-align to the top, 1-align to the bottom
                         align: hasFixedPosition ? 0 : void 0,
@@ -1043,7 +1056,7 @@ class Tooltip {
                 bounds.right - boxStart > boxStart;
         })) {
             boxes = boxes.map((box) => {
-                const { x, y } = defaultPositioner.call(this, box.boxWidth, box.size, box.point, [box.anchorX, box.anchorY], false);
+                const { x, y } = defaultPositioner.call(this, box.boxWidth, box.size, box.point, void 0, [box.anchorX, box.anchorY], false);
                 return extend(box, {
                     target: y,
                     x
@@ -1180,9 +1193,7 @@ class Tooltip {
                 .add(label);
             // For a rapid move going outside of the elements keeping the
             // tooltip visible, cancel the hide (#23512).
-            addEvent(tooltip.tracker.element, 'mouseenter', () => {
-                clearTimeout(tooltip.hideTimer);
-            });
+            addEvent(tooltip.tracker.element, 'mouseenter', () => clearTimeouts(tooltip));
             if (!chart.styledMode) {
                 tooltip.tracker.attr({
                     fill: 'rgba(0,0,0,0)'
@@ -1254,14 +1265,14 @@ class Tooltip {
      * @internal
      * @function Highcharts.Tooltip#updatePosition
      *
-     * @param {Highcharts.Point} point
+     * @param {Highcharts.Point} point The point object.
      */
     updatePosition(point) {
         const { chart, container, distance, options, pointer, renderer } = this, label = this.getLabel(), { height = 0, width = 0 } = label, { fixed, positioner } = options, 
         // Needed for outside: true (#11688)
         { left, top, scaleX, scaleY } = pointer.getChartPosition(), pos = (positioner ||
             (fixed && this.getFixedPosition) ||
-            this.getPosition).call(this, width, height, point), doc = H.doc;
+            this.getPosition).call(this, width, height, point, this), doc = H.doc;
         let anchorX = (point.plotX || 0) + chart.plotLeft, anchorY = (point.plotY || 0) + chart.plotTop, pad;
         // Set the renderer size dynamically to prevent document size to change.
         // Renderer only exists when tooltip is outside.
@@ -1360,6 +1371,10 @@ export default Tooltip;
  * @param {Highcharts.Tooltip} tooltip
  * The tooltip instance
  *
+ * @param {Highcharts.Point} [ctx]
+ * Since v12.5.0, the point context passed as an extra argument for arrow
+ * functions.
+ *
  * @return {false|string|Array<(string|null|undefined)>|null|undefined}
  * Formatted text or false
  */
@@ -1380,6 +1395,10 @@ export default Tooltip;
  * @param {Highcharts.TooltipPositionerPointObject} point
  * Point information for positioning a tooltip.
  *
+ * @param {Highcharts.Tooltip} [ctx]
+ * Since v12.5.0, the tooltip context passed as an extra argument for arrow
+ * functions.
+ *
  * @return {Highcharts.PositionObject}
  * New position for the tooltip.
  */

package/es-modules/Core/TooltipOptions.d.ts

@@ -14,9 +14,42 @@ declare module './Options' {
 }
 declare module './Series/SeriesOptions' {
     interface SeriesOptions {
-        tooltip?: Partial<TooltipOptions>;
+        /**
+         * A configuration object for the tooltip rendering of each single
+         * series. Properties are inherited from [tooltip](#tooltip), but only
+         * the following properties can be defined on a series level.
+         *
+         * @since 2.3
+         */
+        tooltip?: SeriesTooltipOptions;
     }
 }
+export interface SeriesTooltipOptions extends Partial<TooltipOptions> {
+    animation?: undefined;
+    backgroundColor?: undefined;
+    borderColor?: undefined;
+    borderRadius?: undefined;
+    borderWidth?: undefined;
+    className?: undefined;
+    crosshairs?: undefined;
+    enabled?: undefined;
+    fixed?: undefined;
+    formatter?: undefined;
+    headerShape?: undefined;
+    hideDelay?: undefined;
+    outside?: undefined;
+    padding?: undefined;
+    positioner?: undefined;
+    shadow?: undefined;
+    shape?: undefined;
+    shared?: undefined;
+    showDelay?: number;
+    snap?: undefined;
+    split?: undefined;
+    stickOnContact?: undefined;
+    style?: undefined;
+    useHTML?: undefined;
+}
 /**
  * Options for the tooltip that appears when the user hovers over a
  * series or point.
@@ -532,6 +565,16 @@ export interface TooltipOptions {
      * @product highcharts highstock
      */
     shared: boolean;
+    /**
+    * The number of milliseconds to wait until the crosshair is shown when
+    * mouse over a point. Works on initial hover.
+    *
+    * @sample {highcharts|highstock} highcharts/tooltip/showdelay/
+    *
+    * @default 0
+    * @since next
+    */
+    showDelay?: number;
     /**
      * Proximity snap for graphs or single points. It defaults to 10 for
      * mouse-powered devices and 25 for touch devices.