@gravity-ui/charts 1.51.7 → 1.52.0

package/dist/cjs/components/ChartInner/useChartInnerHandlers.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import type { Dispatch } from 'd3-dispatch';
 import type { ChartScale } from '../../core/scales/types';
-import type { PreparedXAxis, PreparedYAxis, ShapeData } from '../../hooks';
+import type { TooltipItemData } from '../../core/shapes/types';
+import type { PreparedXAxis, PreparedYAxis } from '../../hooks';
 import type { useChartInnerState } from './useChartInnerState';
 type ChartInnerState = ReturnType<typeof useChartInnerState>;
 type Props = {
@@ -10,7 +11,7 @@ type Props = {
     boundsOffsetTop: number;
     boundsWidth: number;
     dispatcher: Dispatch<object>;
-    shapesData: ShapeData[];
+    shapesData: TooltipItemData[];
     svgContainer: SVGSVGElement | null;
     togglePinTooltip: ChartInnerState['togglePinTooltip'];
     tooltipPinned: boolean;

package/dist/cjs/components/ChartInner/useChartInnerHandlers.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import { pointer } from 'd3-selection';
-import get from 'lodash/get';
 import throttle from 'lodash/throttle';
 import { EventType } from '../../core/utils';
 import { getClosestPoints } from '../../core/utils/get-closest-data';
@@ -21,10 +20,9 @@ export function useChartInnerHandlers(props) {
             dispatcher.call(EventType.POINTERMOVE_CHART, {}, undefined, event);
             return;
         }
-        const shapesDataWithTooltipEnabled = shapesData.filter((d) => get(d, 'series.tooltip.enabled', true));
         const closest = getClosestPoints({
             position: [x, y],
-            shapesData: shapesDataWithTooltipEnabled,
+            shapesData,
             boundsHeight,
             boundsWidth,
         });

package/dist/cjs/components/ChartInner/useChartInnerProps.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import type { Dispatch } from 'd3-dispatch';
-import type { ChartScale, LegendItem, OnLegendItemClick, PreparedLegend, PreparedSeries, PreparedSplit, PreparedXAxis, PreparedYAxis, RangeSliderState, ShapeData, ZoomState } from '../../hooks';
+import type { TooltipItemData } from '../../core/shapes/types';
+import type { ChartScale, LegendItem, OnLegendItemClick, PreparedLegend, PreparedSeries, PreparedSplit, PreparedXAxis, PreparedYAxis, RangeSliderState, ZoomState } from '../../hooks';
 import type { PreparedChart, PreparedTitle } from '../../hooks/types';
 import type { LegendConfig } from '../../types';
 import type { ChartInnerProps } from './types';
@@ -22,7 +23,7 @@ export declare function useChartInnerProps(props: Props): {
     boundsWidth: number;
     xAxis: PreparedXAxis | null;
     yAxis: PreparedYAxis[];
-    shapesData: ShapeData[];
+    shapesData: TooltipItemData[];
     shapesReady: boolean;
     handleLegendItemClick: OnLegendItemClick;
     preparedTitle: PreparedTitle | undefined;

package/dist/cjs/components/ChartInner/useDefaultState.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import type { Dispatch } from 'd3-dispatch';
 import type { ChartScale } from '../../core/scales/types';
-import type { PreparedXAxis, PreparedYAxis, ShapeData } from '../../hooks';
+import type { TooltipItemData } from '../../core/shapes/types';
+import type { PreparedXAxis, PreparedYAxis } from '../../hooks';
 type Props = {
     boundsHeight: number;
     boundsOffsetLeft: number;
@@ -14,7 +15,7 @@ type Props = {
         };
     };
     dispatcher: Dispatch<object>;
-    shapesData: ShapeData[];
+    shapesData: TooltipItemData[];
     shapesReady: boolean;
     svgRef: React.RefObject<SVGSVGElement | null>;
     xAxis: PreparedXAxis | null;

package/dist/cjs/components/index.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import '../plugins';
 import type { ChartData } from '../types';
 export * from './Tooltip/ChartTooltipContent';
 export interface ChartReflowOptions {

package/dist/cjs/components/index.js

@@ -2,6 +2,7 @@ import React from 'react';
 import debounce from 'lodash/debounce';
 import { i18nFactory } from '../core/i18n';
 import { validateData } from '../core/validation';
+import '../plugins';
 import { ChartInner } from './ChartInner';
 export * from './Tooltip/ChartTooltipContent';
 export const Chart = React.forwardRef(function Chart(props, forwardedRef) {

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

@@ -1,6 +1,12 @@
+import type { Dispatch } from 'd3-dispatch';
 import type { ScaleOrdinal } from 'd3-scale';
-import type { ChartSeries, ChartSeriesOptions } from '../../types';
-import type { PreparedLegend, PreparedSeries } from './types';
+import type { ChartSeries, ChartSeriesOptions, ShapeDataWithLabels } from '../../types';
+import type { PreparedXAxis, PreparedYAxis } from '../axes/types';
+import type { PreparedSplit } from '../layout/split-types';
+import type { ChartScale } from '../scales/types';
+import type { SeriesShapeData, TooltipItemData } from '../shapes/types';
+import type { GetTooltipDataFn } from '../utils/tooltip-helpers';
+import type { PreparedLegend, PreparedSeries, PreparedSeriesOptions } from './types';
 export interface PrepareSeriesArgs {
     series: ChartSeries[];
     seriesOptions?: ChartSeriesOptions;
@@ -8,7 +14,46 @@ export interface PrepareSeriesArgs {
     colorScale: ScaleOrdinal<string, string>;
     colors: string[];
 }
+export interface PrepareShapeDataArgs {
+    series: PreparedSeries[];
+    boundsWidth: number;
+    boundsHeight: number;
+    seriesOptions: PreparedSeriesOptions;
+    xAxis?: PreparedXAxis | null;
+    yAxis?: PreparedYAxis[];
+    xScale?: ChartScale;
+    yScale?: (ChartScale | undefined)[];
+    split?: PreparedSplit;
+    isOutsideBounds?: (x: number, y: number) => boolean;
+    isRangeSlider?: boolean;
+    otherLayers?: ShapeDataWithLabels[];
+}
+export interface PrepareShapeDataResult {
+    renderData: SeriesShapeData[];
+    tooltipItems: TooltipItemData[];
+}
+export interface RenderShapesArgs {
+    plot: SVGGElement;
+    preparedData: SeriesShapeData[];
+    seriesOptions: PreparedSeriesOptions;
+    boundsWidth: number;
+    boundsHeight: number;
+    dispatcher?: Dispatch<object>;
+}
 export interface SeriesPlugin<T extends ChartSeries = ChartSeries> {
+    /** Unique series type identifier (e.g. `'line'`, `'bar-x'`). Used for plugin lookup and CSS class generation. */
     type: T['type'];
+    /**
+     * Whether the shape `<g>` element should be clipped to the chart bounds.
+     * Defaults to `true`. Set to `false` for series that render outside the plot area (e.g. pie, radar, treemap).
+     */
+    useClipPath?: boolean;
+    /** Transforms raw chart series config into prepared series objects used throughout the render pipeline. */
     prepareSeries(args: PrepareSeriesArgs): PreparedSeries[] | Promise<PreparedSeries[]>;
+    /** Computes shape data (geometry, labels, markers) from prepared series. Called once per render cycle. */
+    prepareShapeData(args: PrepareShapeDataArgs): PrepareShapeDataResult | Promise<PrepareShapeDataResult>;
+    /** Renders shapes into the provided SVG `<g>` element using D3. May return a cleanup function. */
+    renderShapes(args: RenderShapesArgs): (() => void) | void;
+    /** Returns tooltip data for a given pointer position and prepared series. */
+    getTooltipData: GetTooltipDataFn;
 }

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

@@ -369,6 +369,10 @@ export type PreparedFunnelSeries = {
         html: boolean;
         format?: ValueFormat;
         align: Required<Required<FunnelSeries>['dataLabels']>['align'];
+        inside: boolean;
+        reserveSpace: boolean;
+        padding: number;
+        anchor: Required<Required<FunnelSeries>['dataLabels']>['anchor'];
     };
     connectors: Required<FunnelSeries['connectors']>;
 } & BasePreparedSeries;

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

@@ -2,8 +2,9 @@ import { group, min, sort } from 'd3-array';
 import isNil from 'lodash/isNil';
 import round from 'lodash/round';
 import { prepareAnnotation } from '../../series/prepare-annotation';
+import { buildHoverMarkerGetter } from '../../shapes/marker';
 import { getXValue, getYValue, markHiddenPointsOutOfYRange } from '../../shapes/utils';
-import { getDataCategoryValue, preparePointDataLabels } from '../../utils';
+import { getDataCategoryValue, preparePointDataLabels, shouldPrepareSeriesDataLabels, } from '../../utils';
 function getXValues(series, xAxis, xScale) {
     const categories = xAxis.categories || [];
     const xValues = series.reduce((acc, s) => {
@@ -242,41 +243,50 @@ export const prepareAreaData = async (args) => {
                         });
                     }
                 }
-                let markers = [];
+                markHiddenPointsOutOfYRange({
+                    points,
+                    yScale: seriesYScale,
+                    yAxisTop,
+                });
+                const normalState = s.marker.states.normal;
                 const hasPerPointNormalMarkers = s.data.some((d) => { var _a, _b, _c; return (_c = (_b = (_a = d.marker) === null || _a === void 0 ? void 0 : _a.states) === null || _b === void 0 ? void 0 : _b.normal) === null || _c === void 0 ? void 0 : _c.enabled; });
-                if (s.marker.states.normal.enabled || hasPerPointNormalMarkers) {
-                    markers = points.reduce((markersAcc, p) => {
-                        var _a, _b, _c, _d;
-                        if (p.y === null) {
-                            return markersAcc;
+                const markers = s.marker.states.normal.enabled || hasPerPointNormalMarkers
+                    ? points.reduce((acc, p) => {
+                        var _a, _b, _c, _d, _e;
+                        if (p.y === null || p.hiddenInLine) {
+                            return acc;
                         }
                         const pointNormalEnabled = (_d = (_c = (_b = (_a = p.data.marker) === null || _a === void 0 ? void 0 : _a.states) === null || _b === void 0 ? void 0 : _b.normal) === null || _c === void 0 ? void 0 : _c.enabled) !== null && _d !== void 0 ? _d : false;
                         if (s.marker.states.normal.enabled || pointNormalEnabled) {
-                            markersAcc.push({
-                                point: p,
+                            acc.push({
+                                cx: p.x,
+                                cy: p.y,
+                                radius: normalState.radius,
+                                symbolType: normalState.symbol,
+                                fill: (_e = p.color) !== null && _e !== void 0 ? _e : s.color,
+                                stroke: normalState.borderColor,
+                                strokeWidth: normalState.borderWidth,
+                                opacity: 1,
                                 active: true,
-                                hovered: false,
                                 clipped: isOutsideBounds(p.x, p.y),
+                                series: { id: s.id },
+                                data: p.data,
                             });
                         }
-                        return markersAcc;
-                    }, []);
-                }
+                        return acc;
+                    }, [])
+                    : [];
                 const annotations = points.reduce((result, p) => {
                     if (p.annotation && p.y !== null) {
                         result.push({ annotation: p.annotation, x: p.x, y: p.y });
                     }
                     return result;
                 }, []);
-                markHiddenPointsOutOfYRange({
-                    points,
-                    yScale: seriesYScale,
-                    yAxisTop,
-                });
                 seriesStackData.push({
                     annotations,
                     points,
                     markers,
+                    getHoverMarkers: buildHoverMarkerGetter(points, s),
                     svgLabels: [],
                     color: s.color,
                     opacity: s.opacity,
@@ -292,7 +302,7 @@ export const prepareAreaData = async (args) => {
                 const item = seriesStackData[itemIndex];
                 const currentYAxis = yAxis[item.series.yAxis];
                 const itemYAxisTop = ((_p = split.plots[currentYAxis.plotIndex]) === null || _p === void 0 ? void 0 : _p.top) || 0;
-                if (item.series.dataLabels.enabled && !isRangeSlider) {
+                if (!isRangeSlider && shouldPrepareSeriesDataLabels(item.series)) {
                     const labelsData = await preparePointDataLabels({
                         series: item.series,
                         points: item.points,

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

@@ -3,9 +3,4 @@ import type { PreparedSeriesOptions } from '../../series/types';
 import type { PreparedAreaData } from './types';
 export declare function renderArea(elements: {
     plot: SVGGElement;
-    markers: SVGGElement;
-    hoverMarkers: SVGGElement;
-    annotations: SVGGElement;
-    boundsWidth: number;
-    boundsHeight: number;
 }, preparedData: PreparedAreaData[], seriesOptions: PreparedSeriesOptions, allowOverlapDataLabels: boolean, dispatcher?: Dispatch<object>): () => void;

package/dist/cjs/core/shapes/area/renderer.js

@@ -4,16 +4,11 @@ import { area as areaGenerator, line as lineGenerator } from 'd3-shape';
 import get from 'lodash/get';
 import { block } from '../../../utils';
 import { filterOverlappingLabels } from '../../utils';
-import { renderAnnotations } from '../annotation';
 import { renderDataLabels } from '../data-labels';
-import { getMarkerHaloVisibility, getMarkerVisibility, renderMarker, selectMarkerHalo, selectMarkerSymbol, setMarker, } from '../marker';
 import { setActiveState } from '../utils';
 const b = block('area');
 export function renderArea(elements, preparedData, seriesOptions, allowOverlapDataLabels, dispatcher) {
     const plotSvgElement = select(elements.plot);
-    const markersSvgElement = select(elements.markers);
-    const hoverMarkersSvgElement = select(elements.hoverMarkers);
-    const annotationsSvgElement = select(elements.annotations);
     const hoverOptions = get(seriesOptions, 'area.states.hover');
     const inactiveOptions = get(seriesOptions, 'area.states.inactive');
     const line = lineGenerator()
@@ -21,7 +16,6 @@ export function renderArea(elements, preparedData, seriesOptions, allowOverlapDa
         .defined((d) => d.y !== null && !d.hiddenInLine)
         .y((d) => d.y);
     plotSvgElement.selectAll('*').remove();
-    markersSvgElement.selectAll('*').remove();
     const shapeSelection = plotSvgElement
         .selectAll('shape')
         .data(preparedData)
@@ -59,23 +53,10 @@ export function renderArea(elements, preparedData, seriesOptions, allowOverlapDa
         data: dataLabels,
         className: b('label'),
     });
-    const markers = preparedData.reduce((acc, d) => acc.concat(d.markers), []);
-    const markerSelection = markersSvgElement
-        .selectAll('marker')
-        .data(markers)
-        .join('g')
-        .call(renderMarker);
-    renderAnnotations({
-        anchors: preparedData.flatMap((d) => d.annotations),
-        container: annotationsSvgElement,
-        plotHeight: elements.boundsHeight,
-        plotWidth: elements.boundsWidth,
-    });
     const hoverEnabled = hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.enabled;
     const inactiveEnabled = inactiveOptions === null || inactiveOptions === void 0 ? void 0 : inactiveOptions.enabled;
     function handleShapeHover(data) {
         const selected = (data === null || data === void 0 ? void 0 : data.filter((d) => d.series.type === 'area')) || [];
-        const selectedDataItems = selected.map((d) => d.data);
         const selectedSeriesIds = selected.map((d) => { var _a; return (_a = d.series) === null || _a === void 0 ? void 0 : _a.id; });
         shapeSelection.datum((d, index, list) => {
             var _a;
@@ -111,62 +92,6 @@ export function renderArea(elements, preparedData, seriesOptions, allowOverlapDa
                 datum: d,
             });
         });
-        markerSelection.datum((d, index, list) => {
-            const elementSelection = select(list[index]);
-            const hovered = Boolean(hoverEnabled && selectedDataItems.includes(d.point.data));
-            if (d.hovered !== hovered) {
-                d.hovered = hovered;
-                elementSelection.attr('visibility', getMarkerVisibility(d));
-                selectMarkerHalo(elementSelection).attr('visibility', getMarkerHaloVisibility);
-                selectMarkerSymbol(elementSelection).call(setMarker, hovered ? 'hover' : 'normal');
-            }
-            if (d.point.series.marker.states.normal.enabled) {
-                const isActive = Boolean(!inactiveEnabled ||
-                    !selectedSeriesIds.length ||
-                    selectedSeriesIds.includes(d.point.series.id));
-                setActiveState({
-                    element: list[index],
-                    state: inactiveOptions,
-                    active: isActive,
-                    datum: d,
-                });
-            }
-            return d;
-        });
-        hoverMarkersSvgElement.selectAll('*').remove();
-        if (hoverEnabled && selected.length > 0) {
-            const hoverOnlyMarkers = [];
-            for (const chunk of selected) {
-                const seriesData = preparedData.find((pd) => pd.id === chunk.series.id);
-                if (!seriesData) {
-                    continue;
-                }
-                const { series } = seriesData;
-                if (series.marker.states.normal.enabled || !series.marker.states.hover.enabled) {
-                    continue;
-                }
-                const point = seriesData.points.find((p) => p.data === chunk.data);
-                if (!point || point.y === null) {
-                    continue;
-                }
-                hoverOnlyMarkers.push({
-                    point: point,
-                    active: true,
-                    hovered: true,
-                    clipped: false,
-                });
-            }
-            if (hoverOnlyMarkers.length > 0) {
-                hoverMarkersSvgElement
-                    .selectAll('g')
-                    .data(hoverOnlyMarkers)
-                    .join('g')
-                    .call(renderMarker)
-                    .each((_d, i, nodes) => {
-                    selectMarkerSymbol(select(nodes[i])).call(setMarker, 'hover');
-                });
-            }
-        }
     }
     dispatcher === null || dispatcher === void 0 ? void 0 : dispatcher.on('hover-shape.area', handleShapeHover);
     return () => {

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

@@ -1,6 +1,6 @@
 import type { AreaSeriesData, LabelData } from '../../../types';
 import type { AnnotationAnchor, PreparedAnnotation, PreparedAreaSeries } from '../../series/types';
-import type { SeriesShapeData } from '../types';
+import type { MarkerItem, SeriesShapeData } from '../types';
 export type PointData = {
     annotation?: PreparedAnnotation;
     color?: string;
@@ -14,17 +14,11 @@ export type PointData = {
 export type MarkerPointData = PointData & {
     y: number;
 };
-export type MarkerData = {
-    point: MarkerPointData;
-    active: boolean;
-    hovered: boolean;
-    clipped: boolean;
-};
 export type PreparedAreaData = {
     annotations: AnnotationAnchor[];
     id: string;
     points: PointData[];
-    markers: MarkerData[];
+    markers: MarkerItem[];
     color: string;
     opacity: number;
     width: number;

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

@@ -3,15 +3,12 @@ import get from 'lodash/get';
 import { prepareAnnotation } from '../../series/prepare-annotation';
 import { getSeriesStackId } from '../../series/utils';
 import { MIN_BAR_GAP, MIN_BAR_GROUP_GAP, MIN_BAR_WIDTH } from '../../shapes/bar-constants';
-import { getDataCategoryValue, getLabelsSize, getTextSizeFn } from '../../utils';
+import { getDataCategoryValue, getLabelsSize, getTextSizeFn, isPointDataLabelEnabled, } from '../../utils';
 import { getBandSize } from '../../utils/band-size';
 import { getFormattedValue } from '../../utils/format';
 const isSeriesDataValid = (d) => d.y !== null;
 async function getLabelData(d, xMax) {
     var _a;
-    if (!d.series.dataLabels.enabled) {
-        return {};
-    }
     const text = getFormattedValue(Object.assign({ value: (_a = d.data.label) !== null && _a !== void 0 ? _a : d.data.y }, d.series.dataLabels));
     const style = d.series.dataLabels.style;
     if (d.series.dataLabels.html) {
@@ -209,6 +206,7 @@ export const prepareBarXData = async (args) => {
                                 optionsPopup: (_j = (_h = seriesOptions['bar-x']) === null || _h === void 0 ? void 0 : _h.annotation) === null || _j === void 0 ? void 0 : _j.popup,
                             })
                             : undefined,
+                        annotations: [],
                         x,
                         y: barPositionY,
                         width: rectWidth,
@@ -220,6 +218,8 @@ export const prepareBarXData = async (args) => {
                         htmlLabels: [],
                         svgLabels: [],
                         isLastStackItem,
+                        markers: [],
+                        getHoverMarkers: () => [],
                     };
                     stackItems.push(barData);
                     if (yDataValue > 0) {
@@ -243,6 +243,17 @@ export const prepareBarXData = async (args) => {
             }
         }
     }
+    for (const barData of result) {
+        if (barData.annotation) {
+            barData.annotations = [
+                {
+                    annotation: barData.annotation,
+                    x: barData.x + barData.width / 2,
+                    y: barData.y,
+                },
+            ];
+        }
+    }
     const [_xMin, xRangeMax] = xScale.range();
     const xMax = xRangeMax;
     for (let i = 0; i < result.length; i++) {
@@ -252,9 +263,9 @@ export const prepareBarXData = async (args) => {
             barData.y + barData.height <= 0 ||
             barData.y >= plotHeight;
         const isZeroValue = ((_k = barData.data.y) !== null && _k !== void 0 ? _k : 0) === 0;
-        if (barData.series.dataLabels.enabled &&
-            !isRangeSlider &&
-            (!isBarOutsideBounds || isZeroValue)) {
+        if (!isRangeSlider &&
+            (!isBarOutsideBounds || isZeroValue) &&
+            isPointDataLabelEnabled({ data: barData.data, series: barData.series })) {
             const { svgLabel, htmlLabel } = await getLabelData(barData, xMax);
             if (svgLabel) {
                 barData.svgLabels.push(svgLabel);

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

@@ -3,7 +3,6 @@ import type { PreparedSeriesOptions } from '../../series/types';
 import type { PreparedBarXData } from './types';
 export declare function renderBarX(elements: {
     plot: SVGGElement;
-    annotations: SVGGElement;
     boundsWidth: number;
     boundsHeight: number;
 }, preparedData: PreparedBarXData[], seriesOptions: PreparedSeriesOptions, allowOverlapDataLabels: boolean, dispatcher?: Dispatch<object>): () => void;

package/dist/cjs/core/shapes/bar-x/renderer.js

@@ -3,13 +3,11 @@ import { select } from 'd3-selection';
 import get from 'lodash/get';
 import { block } from '../../../utils';
 import { filterOverlappingLabels } from '../../utils';
-import { renderAnnotations } from '../annotation';
 import { renderDataLabels } from '../data-labels';
 import { getRectPath } from '../utils';
 const b = block('bar-x');
 export function renderBarX(elements, preparedData, seriesOptions, allowOverlapDataLabels, dispatcher) {
     const svgElement = select(elements.plot);
-    const annotationsSvgElement = select(elements.annotations);
     const hoverOptions = get(seriesOptions, 'bar-x.states.hover');
     const inactiveOptions = get(seriesOptions, 'bar-x.states.inactive');
     svgElement.selectAll('*').remove();
@@ -43,22 +41,6 @@ export function renderBarX(elements, preparedData, seriesOptions, allowOverlapDa
         data: dataLabels,
         className: b('label'),
     });
-    const annotationAnchors = [];
-    for (const d of preparedData) {
-        if (d.annotation) {
-            annotationAnchors.push({
-                annotation: d.annotation,
-                x: d.x + d.width / 2,
-                y: d.y,
-            });
-        }
-    }
-    renderAnnotations({
-        anchors: annotationAnchors,
-        container: annotationsSvgElement,
-        plotHeight: elements.boundsHeight,
-        plotWidth: elements.boundsWidth,
-    });
     function handleShapeHover(data) {
         const hoverEnabled = hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.enabled;
         const inactiveEnabled = inactiveOptions === null || inactiveOptions === void 0 ? void 0 : inactiveOptions.enabled;

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

@@ -1,8 +1,9 @@
 import type { LabelData, TooltipDataChunkBarX } from '../../../types';
-import type { PreparedAnnotation, PreparedBarXSeries } from '../../series/types';
+import type { AnnotationAnchor, PreparedAnnotation, PreparedBarXSeries } from '../../series/types';
 import type { SeriesShapeData } from '../types';
 export type PreparedBarXData = Omit<TooltipDataChunkBarX, 'series'> & {
     annotation?: PreparedAnnotation;
+    annotations: AnnotationAnchor[];
     x: number;
     y: number;
     width: number;

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

@@ -1,15 +1,17 @@
 import { bisector, sort } from 'd3-array';
+import { isPointTooltipEnabled } from '../../utils/tooltip-helpers';
 export function getTooltipData(args) {
     var _a, _b;
     const { data, position } = args;
     const [pointerX, pointerY] = position;
-    const sorted = sort(data, (p) => p.y);
+    const visibleData = data.filter((p) => isPointTooltipEnabled({ data: p.data, series: p.series }));
+    const sorted = sort(visibleData, (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 selectedPoints = visibleData.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];

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

@@ -1,6 +1,6 @@
 import { ascending, descending, sort } from 'd3-array';
 import get from 'lodash/get';
-import { filterOverlappingLabels, getHtmlLabelConstraintedPosition, getLabelsSize, getSvgLabelConstraintedPosition, getTextSizeFn, } from '../../utils';
+import { filterOverlappingLabels, getHtmlLabelConstraintedPosition, getLabelsSize, getSvgLabelConstraintedPosition, getTextSizeFn, isPointDataLabelEnabled, } from '../../utils';
 import { getBarYLayout, groupBarYDataByYValue } from '../../utils/bar-y';
 import { getFormattedValue } from '../../utils/format';
 export async function prepareBarYData(args) {
@@ -14,6 +14,9 @@ export async function prepareBarYData(args) {
             shapes: [],
             labels: [],
             htmlLabels: [],
+            markers: [],
+            getHoverMarkers: () => [],
+            annotations: [],
         };
     }
     const sortingOptions = get(seriesOptions, 'bar-y.dataSorting');
@@ -139,7 +142,7 @@ export async function prepareBarYData(args) {
     for (let i = 0; i < result.length; i++) {
         const prepared = result[i];
         const dataLabels = prepared.series.dataLabels;
-        if (dataLabels.enabled) {
+        if (isPointDataLabelEnabled({ data: prepared.data, series: prepared.series })) {
             const data = prepared.data;
             const content = getFormattedValue(Object.assign({ value: (_a = data.label) !== null && _a !== void 0 ? _a : data.x }, dataLabels));
             const y = prepared.y + prepared.height / 2;
@@ -209,5 +212,8 @@ export async function prepareBarYData(args) {
         shapes: result,
         labels,
         htmlLabels,
+        markers: [],
+        getHoverMarkers: () => [],
+        annotations: [],
     };
 }