@gravity-ui/charts 1.51.0 → 1.51.3

package/dist/cjs/components/AxisY/utils.js

@@ -31,8 +31,13 @@ export function getTickValues({ scale, axis, labelLineHeight, series, }) {
         let result = originalTickValues;
         let availableSpaceForLabel = getMinSpaceBetween(result, (d) => d.y) - axis.labels.padding * 2;
         let ticksCount = result.length - 1;
+        let lastMultiTickResult = result;
+        const triedCounts = new Set();
         while (availableSpaceForLabel < labelLineHeight && result.length > 1) {
             ticksCount = ticksCount ? ticksCount - 1 : result.length - 1;
+            if (triedCounts.has(ticksCount))
+                break;
+            triedCounts.add(ticksCount);
             const newScaleTicks = scale.ticks(ticksCount);
             result = newScaleTicks.map((t) => ({
                 y: scale(t),
@@ -40,16 +45,23 @@ export function getTickValues({ scale, axis, labelLineHeight, series, }) {
             }));
             availableSpaceForLabel =
                 getMinSpaceBetween(result, (d) => d.y) - axis.labels.padding * 2;
+            if (result.length > 1) {
+                lastMultiTickResult = result;
+            }
         }
         // when this is not possible (for example, such values cannot be selected for the logarithmic axis with a small range)
-        // just thin out the originally proposed result
-        if (!result.length) {
-            result = originalTickValues;
+        // just thin out the last result that had multiple ticks
+        // For log scales, 1 tick is also a failure: d3 only places ticks at powers of the base,
+        // so a sub-decade range legitimately yields 1 tick despite having room for more.
+        // For linear scales, 1 tick is a valid result meaning the chart is simply too small.
+        const isLogScale = axis.type === 'logarithmic';
+        if ((isLogScale ? result.length <= 1 : !result.length) && lastMultiTickResult.length > 1) {
+            result = lastMultiTickResult;
             availableSpaceForLabel =
                 getMinSpaceBetween(result, (d) => d.y) - axis.labels.padding * 2;
             let delta = 2;
             while (availableSpaceForLabel < labelLineHeight && result.length > 1) {
-                result = thinOut(result, delta);
+                result = thinOut(lastMultiTickResult, delta);
                 if (result.length > 1) {
                     delta += 1;
                     availableSpaceForLabel =

package/dist/cjs/components/index.js

@@ -1,8 +1,6 @@
 import React from 'react';
-import { select } from 'd3-selection';
 import debounce from 'lodash/debounce';
 import { i18nFactory } from '../core/i18n';
-import { getUniqId } from '../core/utils';
 import { validateData } from '../core/validation';
 import { ChartInner } from './ChartInner';
 export * from './Tooltip/ChartTooltipContent';
@@ -17,11 +15,22 @@ export const Chart = React.forwardRef(function Chart(props, forwardedRef) {
         validateData(data);
         validatedData.current = data;
     }
-    const handleResize = React.useCallback(() => {
+    const handleResize = React.useCallback((options) => {
         var _a;
         const parentElement = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.parentElement;
         if (parentElement) {
-            setDimensions({ width: parentElement.clientWidth, height: parentElement.clientHeight });
+            const nextDimensions = {
+                width: parentElement.clientWidth,
+                height: parentElement.clientHeight,
+            };
+            setDimensions((currentDimensions) => {
+                if (!(options === null || options === void 0 ? void 0 : options.force) &&
+                    (currentDimensions === null || currentDimensions === void 0 ? void 0 : currentDimensions.width) === nextDimensions.width &&
+                    currentDimensions.height === nextDimensions.height) {
+                    return currentDimensions;
+                }
+                return nextDimensions;
+            });
         }
     }, []);
     const debuncedHandleResize = React.useMemo(() => {
@@ -33,10 +42,10 @@ export const Chart = React.forwardRef(function Chart(props, forwardedRef) {
     React.useImperativeHandle(forwardedRef, () => ({
         reflow(options) {
             if (options === null || options === void 0 ? void 0 : options.immediate) {
-                handleResize();
+                handleResize({ force: true });
             }
             else {
-                debuncedHandleResize();
+                debuncedHandleResize({ force: true });
             }
         },
     }), [debuncedHandleResize, handleResize]);
@@ -45,19 +54,18 @@ export const Chart = React.forwardRef(function Chart(props, forwardedRef) {
         handleResize();
     }, [handleResize]);
     React.useEffect(() => {
-        const selection = select(window);
-        // https://github.com/d3/d3-selection/blob/main/README.md#handling-events
-        const eventName = `resize.${getUniqId()}`;
-        selection.on(eventName, debuncedHandleResize);
-        window.addEventListener('transitionend', handleResize, { capture: true });
-        window.addEventListener('animationend', handleResize, { capture: true });
+        var _a;
+        const parentElement = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.parentElement;
+        if (!parentElement) {
+            return undefined;
+        }
+        const observer = new ResizeObserver(() => debuncedHandleResize());
+        observer.observe(parentElement);
         return () => {
-            // https://d3js.org/d3-selection/events#selection_on
-            selection.on(eventName, null);
-            window.removeEventListener('transitionend', handleResize, { capture: true });
-            window.removeEventListener('animationend', handleResize, { capture: true });
+            observer.disconnect();
+            debuncedHandleResize.cancel();
         };
-    }, [debuncedHandleResize, handleResize]);
+    }, [debuncedHandleResize]);
     React.useEffect(() => {
         if (typeof onResize === 'function') {
             onResize({ dimensions });

package/dist/cjs/core/series/plugin.d.ts

@@ -0,0 +1,14 @@
+import type { ScaleOrdinal } from 'd3-scale';
+import type { ChartSeries, ChartSeriesOptions } from '../../types';
+import type { PreparedLegend, PreparedSeries } from './types';
+export interface PrepareSeriesArgs {
+    series: ChartSeries[];
+    seriesOptions?: ChartSeriesOptions;
+    legend: PreparedLegend;
+    colorScale: ScaleOrdinal<string, string>;
+    colors: string[];
+}
+export interface SeriesPlugin<T extends ChartSeries = ChartSeries> {
+    type: T['type'];
+    prepareSeries(args: PrepareSeriesArgs): PreparedSeries[] | Promise<PreparedSeries[]>;
+}

package/dist/cjs/core/series/plugin.js

@@ -0,0 +1 @@
+export {};

package/dist/cjs/core/series/prepareSeries.d.ts

@@ -1,5 +1,5 @@
-import type { ScaleOrdinal } from 'd3-scale';
-import type { ChartData, ChartSeries, ChartSeriesOptions } from '../../types';
+import type { ChartData } from '../../types';
+import type { PrepareSeriesArgs } from './plugin';
 import type { PreparedLegend, PreparedSeries } from './types';
 export declare const getPreparedSeries: ({ seriesData, seriesOptions, colors, preparedLegend, }: {
     seriesData: ChartData["series"]["data"];
@@ -7,11 +7,4 @@ export declare const getPreparedSeries: ({ seriesData, seriesOptions, colors, pr
     colors: string[];
     preparedLegend?: PreparedLegend | null;
 }) => Promise<PreparedSeries[]>;
-export declare function prepareSeries(args: {
-    type: ChartSeries['type'];
-    series: ChartSeries[];
-    seriesOptions?: ChartSeriesOptions;
-    legend: PreparedLegend;
-    colors: string[];
-    colorScale: ScaleOrdinal<string, string>;
-}): Promise<PreparedSeries[]>;
+export declare function prepareSeries(args: PrepareSeriesArgs): Promise<PreparedSeries[]>;

package/dist/cjs/core/series/prepareSeries.js

@@ -1,20 +1,7 @@
 import { group } from 'd3-array';
 import { scaleOrdinal } from 'd3-scale';
-import { ChartError } from '../../libs';
 import { getSeriesNames } from '../utils';
-import { prepareArea } from './prepare-area';
-import { prepareBarXSeries } from './prepare-bar-x';
-import { prepareBarYSeries } from './prepare-bar-y';
-import { prepareFunnelSeries } from './prepare-funnel';
-import { prepareHeatmapSeries } from './prepare-heatmap';
-import { prepareLineSeries } from './prepare-line';
-import { preparePieSeries } from './prepare-pie';
-import { prepareRadarSeries } from './prepare-radar';
-import { prepareSankeySeries } from './prepare-sankey';
-import { prepareScatterSeries } from './prepare-scatter';
-import { prepareTreemap } from './prepare-treemap';
-import { prepareWaterfallSeries } from './prepare-waterfall';
-import { prepareXRangeSeries } from './prepare-x-range';
+import { getSeriesPlugin } from './seriesRegistry';
 export const getPreparedSeries = async ({ seriesData, seriesOptions, colors, preparedLegend, }) => {
     const seriesNames = getSeriesNames(seriesData);
     const colorScale = scaleOrdinal(seriesNames, colors);
@@ -31,9 +18,7 @@ export const getPreparedSeries = async ({ seriesData, seriesOptions, colors, pre
     const list = Array.from(groupedSeries);
     for (let i = 0; i < list.length; i++) {
         const [_groupId, seriesList] = list[i];
-        const seriesType = seriesList[0].type;
         acc.push(...(await prepareSeries({
-            type: seriesType,
             series: seriesList,
             seriesOptions,
             legend: preparedLegend,
@@ -44,114 +29,6 @@ export const getPreparedSeries = async ({ seriesData, seriesOptions, colors, pre
     return acc;
 };
 export async function prepareSeries(args) {
-    const { type, series, seriesOptions, legend, colors, colorScale } = args;
-    switch (type) {
-        case 'pie': {
-            return series.reduce((acc, singleSeries) => {
-                acc.push(...preparePieSeries({
-                    series: singleSeries,
-                    seriesOptions,
-                    legend,
-                    colors,
-                }));
-                return acc;
-            }, []);
-        }
-        case 'bar-x': {
-            return prepareBarXSeries({
-                series: series,
-                legend,
-                colorScale,
-                seriesOptions,
-            });
-        }
-        case 'bar-y': {
-            return await prepareBarYSeries({
-                series: series,
-                legend,
-                colorScale,
-                seriesOptions,
-            });
-        }
-        case 'scatter': {
-            return prepareScatterSeries({ series: series, legend, colorScale });
-        }
-        case 'line': {
-            return prepareLineSeries({
-                series: series,
-                seriesOptions,
-                legend,
-                colorScale,
-            });
-        }
-        case 'area': {
-            return prepareArea({
-                series: series,
-                seriesOptions,
-                legend,
-                colorScale,
-            });
-        }
-        case 'treemap': {
-            return prepareTreemap({
-                series: series,
-                seriesOptions,
-                legend,
-                colorScale,
-            });
-        }
-        case 'waterfall': {
-            return prepareWaterfallSeries({
-                series: series,
-                legend,
-                colorScale,
-                colors,
-            });
-        }
-        case 'sankey': {
-            return prepareSankeySeries({
-                series: series,
-                seriesOptions,
-                colorScale,
-                legend,
-            });
-        }
-        case 'radar': {
-            return prepareRadarSeries({
-                series: series,
-                seriesOptions,
-                legend,
-                colors,
-            });
-        }
-        case 'heatmap': {
-            return await prepareHeatmapSeries({
-                series: series,
-                legend,
-                colorScale,
-                seriesOptions,
-            });
-        }
-        case 'funnel': {
-            return prepareFunnelSeries({
-                series: series[0],
-                seriesOptions,
-                legend,
-                colors,
-            });
-        }
-        case 'x-range': {
-            return prepareXRangeSeries({
-                series: series,
-                seriesOptions,
-                legend,
-                colorScale,
-            });
-        }
-        default: {
-            throw new ChartError({
-                message: `Series type "${type}" does not support data preparation for series that do not support the presence of axes`,
-            });
-        }
-    }
+    const plugin = getSeriesPlugin(args.series[0].type);
+    return plugin.prepareSeries(args);
 }

package/dist/cjs/core/series/seriesRegistry.d.ts

@@ -0,0 +1,3 @@
+import type { SeriesPlugin } from './plugin';
+export declare function registerSeriesPlugin(plugin: SeriesPlugin): void;
+export declare function getSeriesPlugin(type: string): SeriesPlugin;

package/dist/cjs/core/series/seriesRegistry.js

@@ -0,0 +1,12 @@
+import { ChartError } from '../../libs';
+const registry = new Map();
+export function registerSeriesPlugin(plugin) {
+    registry.set(plugin.type, plugin);
+}
+export function getSeriesPlugin(type) {
+    const plugin = registry.get(type);
+    if (!plugin) {
+        throw new ChartError({ message: `Unknown series type: "${type}"` });
+    }
+    return plugin;
+}

package/dist/cjs/core/shapes/area/get-tooltip-data.d.ts

@@ -0,0 +1,3 @@
+import type { GetTooltipDataArgs, GetTooltipDataResult } from '../../utils/tooltip-helpers';
+import type { PreparedAreaData } from './types';
+export declare function getTooltipData(args: GetTooltipDataArgs<PreparedAreaData>): GetTooltipDataResult;

package/dist/cjs/core/shapes/area/get-tooltip-data.js

@@ -0,0 +1,19 @@
+export function getTooltipData(args) {
+    const { data } = args;
+    const xLookupPoints = data.reduce((acc, d) => {
+        for (const p of d.points) {
+            if (p.y === null || p.hiddenInLine) {
+                continue;
+            }
+            acc.push({
+                data: p.data,
+                series: p.series,
+                x: p.x,
+                y0: p.y0,
+                y1: p.y,
+            });
+        }
+        return acc;
+    }, []);
+    return { chunks: [], xLookupPoints };
+}

package/dist/cjs/core/shapes/area/types.d.ts

@@ -1,5 +1,6 @@
-import type { AreaSeriesData, HtmlItem, LabelData } from '../../../types';
+import type { AreaSeriesData, LabelData } from '../../../types';
 import type { AnnotationAnchor, PreparedAnnotation, PreparedAreaSeries } from '../../series/types';
+import type { SeriesShapeData } from '../types';
 export type PointData = {
     annotation?: PreparedAnnotation;
     color?: string;
@@ -31,5 +32,4 @@ export type PreparedAreaData = {
     hovered: boolean;
     active: boolean;
     svgLabels: LabelData[];
-    htmlLabels: HtmlItem[];
-};
+} & SeriesShapeData;

package/dist/cjs/core/shapes/bar-x/get-tooltip-data.d.ts

@@ -0,0 +1,3 @@
+import type { GetTooltipDataArgs, GetTooltipDataResult } from '../../utils/tooltip-helpers';
+import type { PreparedBarXData } from './types';
+export declare function getTooltipData(args: GetTooltipDataArgs<PreparedBarXData>): GetTooltipDataResult;

package/dist/cjs/core/shapes/bar-x/get-tooltip-data.js

@@ -0,0 +1,20 @@
+import groupBy from 'lodash/groupBy';
+export function getTooltipData(args) {
+    const { data } = args;
+    const barXGroups = groupBy(data, (d) => String(d.data.x));
+    const xLookupPoints = [];
+    for (const group of Object.values(barXGroups)) {
+        const groupCenterX = group.reduce((sum, d) => sum + d.x + d.width / 2, 0) / group.length;
+        for (const d of group) {
+            xLookupPoints.push({
+                data: d.data,
+                series: d.series,
+                x: groupCenterX,
+                y0: d.y,
+                y1: d.y + d.height,
+                sourceX: d.x + d.width / 2,
+            });
+        }
+    }
+    return { chunks: [], xLookupPoints };
+}

package/dist/cjs/core/shapes/bar-x/types.d.ts

@@ -1,5 +1,6 @@
-import type { HtmlItem, LabelData, TooltipDataChunkBarX } from '../../../types';
+import type { LabelData, TooltipDataChunkBarX } from '../../../types';
 import type { PreparedAnnotation, PreparedBarXSeries } from '../../series/types';
+import type { SeriesShapeData } from '../types';
 export type PreparedBarXData = Omit<TooltipDataChunkBarX, 'series'> & {
     annotation?: PreparedAnnotation;
     x: number;
@@ -9,11 +10,10 @@ export type PreparedBarXData = Omit<TooltipDataChunkBarX, 'series'> & {
     opacity: number | null;
     series: PreparedBarXSeries;
     svgLabels: LabelData[];
-    htmlLabels: HtmlItem[];
     isLastStackItem: boolean;
     /**
      * the utility field for storing the original height (for recalculations, etc.)
      * should not be used for displaying
      */
     _height: number;
-};
+} & SeriesShapeData;

package/dist/cjs/core/shapes/bar-y/get-tooltip-data.d.ts

@@ -0,0 +1,3 @@
+import type { GetTooltipDataArgs, GetTooltipDataResult } from '../../utils/tooltip-helpers';
+import type { PreparedBarYData } from './types';
+export declare function getTooltipData(args: GetTooltipDataArgs<PreparedBarYData>): GetTooltipDataResult;

package/dist/cjs/core/shapes/bar-y/get-tooltip-data.js

@@ -0,0 +1,32 @@
+import { bisector, sort } from 'd3-array';
+export function getTooltipData(args) {
+    var _a, _b;
+    const { data, position } = args;
+    const [pointerX, pointerY] = position;
+    const sorted = sort(data, (p) => p.y);
+    const closestYIndex = bisector((p) => p.y + p.height / 2).center(sorted, pointerY);
+    const closestYPoint = sorted[closestYIndex];
+    if (!closestYPoint) {
+        return { chunks: [] };
+    }
+    const selectedPoints = data.filter((p) => p.data.y === closestYPoint.data.y);
+    const closestPoints = sort(selectedPoints.filter((p) => p.y === closestYPoint.y), (p) => p.x);
+    let closestPointXValue;
+    const lastPoint = closestPoints[closestPoints.length - 1];
+    if (pointerX < ((_a = closestPoints[0]) === null || _a === void 0 ? void 0 : _a.x)) {
+        closestPointXValue = closestPoints[0].x;
+    }
+    else if (lastPoint && pointerX > lastPoint.x + lastPoint.width) {
+        closestPointXValue = lastPoint.x;
+    }
+    else {
+        closestPointXValue = (_b = closestPoints.find((p) => pointerX > p.x && pointerX < p.x + p.width)) === null || _b === void 0 ? void 0 : _b.x;
+    }
+    return {
+        chunks: selectedPoints.map((p) => ({
+            data: p.data,
+            series: p.series,
+            closest: p.x === closestPointXValue && p.y === closestYPoint.y,
+        })),
+    };
+}

package/dist/cjs/core/shapes/bar-y/prepare-data.js

@@ -13,7 +13,7 @@ export async function prepareBarYData(args) {
         return {
             shapes: [],
             labels: [],
-            htmlElements: [],
+            htmlLabels: [],
         };
     }
     const sortingOptions = get(seriesOptions, 'bar-y.dataSorting');
@@ -134,7 +134,7 @@ export async function prepareBarYData(args) {
         });
     });
     let labels = [];
-    let htmlElements = [];
+    let htmlLabels = [];
     const map = new Map();
     for (let i = 0; i < result.length; i++) {
         const prepared = result[i];
@@ -160,7 +160,7 @@ export async function prepareBarYData(args) {
                     x,
                     y: y - height / 2,
                 });
-                htmlElements.push({
+                htmlLabels.push({
                     content,
                     size: { width, height },
                     style: dataLabels.style,
@@ -202,12 +202,12 @@ export async function prepareBarYData(args) {
     if (labels.length && !allowOverlap) {
         labels = filterOverlappingLabels(labels);
     }
-    else if (htmlElements.length && !allowOverlap) {
-        htmlElements = filterOverlappingLabels(htmlElements);
+    else if (htmlLabels.length && !allowOverlap) {
+        htmlLabels = filterOverlappingLabels(htmlLabels);
     }
     return {
         shapes: result,
         labels,
-        htmlElements,
+        htmlLabels,
     };
 }

package/dist/cjs/core/shapes/bar-y/types.d.ts

@@ -1,5 +1,6 @@
-import type { HtmlItem, LabelData, TooltipDataChunkBarY } from '../../../types';
+import type { LabelData, TooltipDataChunkBarY } from '../../../types';
 import type { PreparedBarYSeries } from '../../series/types';
+import type { SeriesShapeData } from '../types';
 export type PreparedBarYData = Omit<TooltipDataChunkBarY, 'series'> & {
     x: number;
     y: number;
@@ -15,5 +16,4 @@ export type PreparedBarYData = Omit<TooltipDataChunkBarY, 'series'> & {
 export type BarYShapesArgs = {
     shapes: PreparedBarYData[];
     labels: LabelData[];
-    htmlElements: HtmlItem[];
-};
+} & SeriesShapeData;

package/dist/cjs/core/shapes/funnel/get-tooltip-data.d.ts

@@ -0,0 +1,3 @@
+import type { GetTooltipDataArgs, GetTooltipDataResult } from '../../utils/tooltip-helpers';
+import type { PreparedFunnelData } from './types';
+export declare function getTooltipData(args: GetTooltipDataArgs<PreparedFunnelData>): GetTooltipDataResult;

package/dist/cjs/core/shapes/funnel/get-tooltip-data.js

@@ -0,0 +1,21 @@
+export function getTooltipData(args) {
+    var _a;
+    const { data, position } = args;
+    const [pointerX, pointerY] = position;
+    const closestPoint = (_a = data[0]) === null || _a === void 0 ? void 0 : _a.items.find((item) => pointerX >= item.x &&
+        pointerX <= item.x + item.width &&
+        pointerY >= item.y &&
+        pointerY <= item.y + item.height);
+    if (!closestPoint) {
+        return { chunks: [] };
+    }
+    return {
+        chunks: [
+            {
+                data: closestPoint.data,
+                series: closestPoint.series,
+                closest: true,
+            },
+        ],
+    };
+}

package/dist/cjs/core/shapes/funnel/prepare-data.js

@@ -128,11 +128,13 @@ export async function prepareFunnelData(args) {
         const prevSeries = series[index - 1];
         const prevItem = items[index - 1];
         if (prevSeries && prevItem && ((_e = prevSeries.connectors) === null || _e === void 0 ? void 0 : _e.enabled)) {
+            // Use the actual bottom corners of the previous segment (points[3]/[2]) so that
+            // trapezoid segments (whose bottom edge differs from the top edge) are handled correctly.
             const connectorPoints = [
-                [prevItem.x, prevItem.y + prevItem.height],
-                [prevItem.x + prevItem.width, prevItem.y + prevItem.height],
-                [funnelSegment.x + funnelSegment.width, funnelSegment.y],
-                [funnelSegment.x, funnelSegment.y],
+                prevItem.points[3],
+                prevItem.points[2],
+                funnelSegment.points[1],
+                funnelSegment.points[0],
             ];
             connectors.push({
                 linePath: getLineConnectorPaths({ points: connectorPoints }),

package/dist/cjs/core/shapes/funnel/types.d.ts

@@ -1,7 +1,8 @@
 import type { Path } from 'd3-path';
-import type { FunnelSeriesData, HtmlItem, LabelData } from '../../../types';
+import type { FunnelSeriesData, LabelData } from '../../../types';
 import type { DashStyle } from '../../constants';
 import type { PreparedFunnelSeries } from '../../series/types';
+import type { SeriesShapeData } from '../types';
 export type FunnelItemData = {
     x: number;
     y: number;
@@ -30,5 +31,4 @@ export type PreparedFunnelData = {
     items: FunnelItemData[];
     connectors: FunnelConnectorData[];
     svgLabels: LabelData[];
-    htmlLabels: HtmlItem[];
-};
+} & SeriesShapeData;

package/dist/cjs/core/shapes/heatmap/get-tooltip-data.d.ts

@@ -0,0 +1,3 @@
+import type { GetTooltipDataArgs, GetTooltipDataResult } from '../../utils/tooltip-helpers';
+import type { PreparedHeatmapData } from './types';
+export declare function getTooltipData(args: GetTooltipDataArgs<PreparedHeatmapData>): GetTooltipDataResult;

package/dist/cjs/core/shapes/heatmap/get-tooltip-data.js

@@ -0,0 +1,21 @@
+export function getTooltipData(args) {
+    var _a;
+    const { data, position } = args;
+    const [pointerX, pointerY] = position;
+    const closestPoint = (_a = data[0]) === null || _a === void 0 ? void 0 : _a.items.find((cell) => pointerX >= cell.x &&
+        pointerX <= cell.x + cell.width &&
+        pointerY >= cell.y &&
+        pointerY <= cell.y + cell.height);
+    if (!closestPoint) {
+        return { chunks: [] };
+    }
+    return {
+        chunks: [
+            {
+                data: closestPoint.data,
+                series: data[0].series,
+                closest: true,
+            },
+        ],
+    };
+}

package/dist/cjs/core/shapes/heatmap/prepare-data.js

@@ -94,7 +94,7 @@ export async function prepareHeatmapData({ series, xAxis, xScale, yAxis, yScale,
     }
     const preparedData = {
         series: series,
-        htmlElements: htmlDataLabels,
+        htmlLabels: htmlDataLabels,
         items: heatmapItems,
         labels: svgDataLabels,
     };

package/dist/cjs/core/shapes/heatmap/types.d.ts

@@ -1,5 +1,6 @@
-import type { BaseTextStyle, HeatmapSeriesData, HtmlItem } from '../../../types';
+import type { BaseTextStyle, HeatmapSeriesData } from '../../../types';
 import type { PreparedHeatmapSeries } from '../../series/types';
+import type { SeriesShapeData } from '../types';
 export type HeatmapItem = {
     x: number;
     y: number;
@@ -20,6 +21,5 @@ export type HeatmapLabel = {
 export type PreparedHeatmapData = {
     series: PreparedHeatmapSeries;
     items: HeatmapItem[];
-    htmlElements: HtmlItem[];
     labels: HeatmapLabel[];
-};
+} & SeriesShapeData;

package/dist/cjs/core/shapes/line/get-tooltip-data.d.ts

@@ -0,0 +1,3 @@
+import type { GetTooltipDataArgs, GetTooltipDataResult } from '../../utils/tooltip-helpers';
+import type { PreparedLineData } from './types';
+export declare function getTooltipData(args: GetTooltipDataArgs<PreparedLineData>): GetTooltipDataResult;

package/dist/cjs/core/shapes/line/get-tooltip-data.js

@@ -0,0 +1,18 @@
+export function getTooltipData(args) {
+    const { data } = args;
+    const xLookupPoints = data.reduce((acc, d) => {
+        for (const p of d.points) {
+            if (p.y !== null && p.x !== null && !p.hiddenInLine) {
+                acc.push({
+                    data: p.data,
+                    series: p.series,
+                    x: p.x,
+                    y0: p.y,
+                    y1: p.y,
+                });
+            }
+        }
+        return acc;
+    }, []);
+    return { chunks: [], xLookupPoints };
+}