@gravity-ui/chartkit 5.3.3 → 5.5.0

package/build/plugins/d3/renderer/hooks/useShapes/line/index.js

@@ -61,13 +61,12 @@ export const LineSeriesShapes = (args) => {
         const hoverEnabled = hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.enabled;
         const inactiveEnabled = inactiveOptions === null || inactiveOptions === void 0 ? void 0 : inactiveOptions.enabled;
         dispatcher.on('hover-shape.line', (data) => {
-            var _a;
-            const selected = data === null || data === void 0 ? void 0 : data.find((d) => d.series.type === 'line');
-            const selectedDataItem = selected === null || selected === void 0 ? void 0 : selected.data;
-            const selectedSeriesId = (_a = selected === null || selected === void 0 ? void 0 : selected.series) === null || _a === void 0 ? void 0 : _a.id;
+            const selected = (data === null || data === void 0 ? void 0 : data.filter((d) => d.series.type === 'line')) || [];
+            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; });
             lineSelection.datum((d, index, list) => {
                 const elementSelection = select(list[index]);
-                const hovered = Boolean(hoverEnabled && d.id === selectedSeriesId);
+                const hovered = Boolean(hoverEnabled && selectedSeriesIds.includes(d.id));
                 if (d.hovered !== hovered) {
                     d.hovered = hovered;
                     elementSelection.attr('stroke', (d) => {
@@ -82,7 +81,9 @@ export const LineSeriesShapes = (args) => {
                 return setActiveState({
                     element: list[index],
                     state: inactiveOptions,
-                    active: Boolean(!inactiveEnabled || !selectedSeriesId || selectedSeriesId === d.id),
+                    active: Boolean(!inactiveEnabled ||
+                        !selectedSeriesIds.length ||
+                        selectedSeriesIds.includes(d.id)),
                     datum: d,
                 });
             });
@@ -90,13 +91,15 @@ export const LineSeriesShapes = (args) => {
                 return setActiveState({
                     element: list[index],
                     state: inactiveOptions,
-                    active: Boolean(!inactiveEnabled || !selectedSeriesId || selectedSeriesId === d.series.id),
+                    active: Boolean(!inactiveEnabled ||
+                        !selectedSeriesIds.length ||
+                        selectedSeriesIds.includes(d.series.id)),
                     datum: d,
                 });
             });
             markerSelection.datum((d, index, list) => {
                 const elementSelection = select(list[index]);
-                const hovered = Boolean(hoverEnabled && d.point.data === selectedDataItem);
+                const hovered = Boolean(hoverEnabled && selectedDataItems.includes(d.point.data));
                 if (d.hovered !== hovered) {
                     d.hovered = hovered;
                     elementSelection.attr('visibility', getMarkerVisibility(d));
@@ -105,8 +108,8 @@ export const LineSeriesShapes = (args) => {
                 }
                 if (d.point.series.marker.states.normal.enabled) {
                     const isActive = Boolean(!inactiveEnabled ||
-                        !selectedSeriesId ||
-                        selectedSeriesId === d.point.series.id);
+                        !selectedSeriesIds.length ||
+                        selectedSeriesIds.includes(d.point.series.id));
                     setActiveState({
                         element: list[index],
                         state: inactiveOptions,

package/build/plugins/d3/renderer/hooks/useShapes/pie/index.d.ts

@@ -6,7 +6,6 @@ type PreparePieSeriesArgs = {
     dispatcher: Dispatch<object>;
     preparedData: PreparedPieData[];
     seriesOptions: PreparedSeriesOptions;
-    svgContainer: SVGSVGElement | null;
 };
 export declare function getHaloVisibility(d: PieArcDatum<SegmentData>): "" | "hidden";
 export declare function PieSeriesShapes(args: PreparePieSeriesArgs): React.JSX.Element;

package/build/plugins/d3/renderer/hooks/useShapes/pie/index.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { arc, color, line as lineGenerator, pointer, select } from 'd3';
+import { arc, color, line as lineGenerator, select } from 'd3';
 import get from 'lodash/get';
 import { block } from '../../../../../../utils/cn';
 import { setEllipsisForOverflowTexts } from '../../../utils';
@@ -11,7 +11,7 @@ export function getHaloVisibility(d) {
     return enabled ? '' : 'hidden';
 }
 export function PieSeriesShapes(args) {
-    const { dispatcher, preparedData, seriesOptions, svgContainer } = args;
+    const { dispatcher, preparedData, seriesOptions } = args;
     const ref = React.useRef(null);
     React.useEffect(() => {
         if (!ref.current) {
@@ -127,32 +127,15 @@ export function PieSeriesShapes(args) {
         const eventName = `hover-shape.pie`;
         const hoverOptions = get(seriesOptions, 'pie.states.hover');
         const inactiveOptions = get(seriesOptions, 'pie.states.inactive');
-        svgElement
-            .on('mousemove', (e) => {
-            const currentSegment = getSelectedSegment(e.target);
-            if (currentSegment) {
-                const data = {
-                    series: {
-                        id: currentSegment.series.id,
-                        type: 'pie',
-                        name: currentSegment.series.name,
-                    },
-                    data: currentSegment.series.data,
-                };
-                dispatcher.call('hover-shape', {}, [data], pointer(e, svgContainer));
-            }
-        })
-            .on('mouseleave', () => {
-            dispatcher.call('hover-shape', {}, undefined);
-        })
-            .on('click', (e) => {
+        svgElement.on('click', (e) => {
             const selectedSegment = getSelectedSegment(e.target);
             if (selectedSegment) {
                 dispatcher.call('click-chart', undefined, { point: selectedSegment.series.data, series: selectedSegment.series }, e);
             }
         });
         dispatcher.on(eventName, (data) => {
-            const selectedSeriesId = data === null || data === void 0 ? void 0 : data[0].series.id;
+            var _a, _b;
+            const selectedSeriesId = (_b = (_a = data === null || data === void 0 ? void 0 : data[0]) === null || _a === void 0 ? void 0 : _a.series) === null || _b === void 0 ? void 0 : _b.id;
             const hoverEnabled = hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.enabled;
             const inactiveEnabled = inactiveOptions === null || inactiveOptions === void 0 ? void 0 : inactiveOptions.enabled;
             shapesSelection.datum((_d, index, list) => {
@@ -202,6 +185,6 @@ export function PieSeriesShapes(args) {
         return () => {
             dispatcher.on(eventName, null);
         };
-    }, [dispatcher, preparedData, seriesOptions, svgContainer]);
+    }, [dispatcher, preparedData, seriesOptions]);
     return React.createElement("g", { ref: ref, className: b(), style: { zIndex: 9 } });
 }

package/build/plugins/d3/renderer/hooks/useShapes/scatter/index.d.ts

@@ -7,6 +7,5 @@ type ScatterSeriesShapeProps = {
     dispatcher: Dispatch<object>;
     preparedData: PreparedScatterData[];
     seriesOptions: PreparedSeriesOptions;
-    svgContainer: SVGSVGElement | null;
 };
 export declare function ScatterSeriesShape(props: ScatterSeriesShapeProps): React.JSX.Element;

package/build/plugins/d3/renderer/hooks/useShapes/scatter/index.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { pointer, select } from 'd3';
+import { select } from 'd3';
 import get from 'lodash/get';
 import { block } from '../../../../../../utils/cn';
 import { getMarkerHaloVisibility, renderMarker, selectMarkerHalo, selectMarkerSymbol, setMarker, } from '../marker';
@@ -7,7 +7,7 @@ import { setActiveState, shapeKey } from '../utils';
 export { prepareScatterData } from './prepare-data';
 const b = block('d3-scatter');
 export function ScatterSeriesShape(props) {
-    const { dispatcher, preparedData, seriesOptions, svgContainer } = props;
+    const { dispatcher, preparedData, seriesOptions } = props;
     const ref = React.useRef(null);
     React.useEffect(() => {
         if (!ref.current) {
@@ -28,27 +28,7 @@ export function ScatterSeriesShape(props) {
         const getSelectedPoint = (element) => {
             return select(element).datum();
         };
-        svgElement
-            .on('mousemove', (e) => {
-            const datum = getSelectedPoint(e.target);
-            if (!datum) {
-                return;
-            }
-            const [pointerX, pointerY] = pointer(e, svgContainer);
-            const data = {
-                series: {
-                    id: datum.point.series.id,
-                    type: 'scatter',
-                    name: datum.point.series.name,
-                },
-                data: datum.point.data,
-            };
-            dispatcher.call('hover-shape', {}, [data], [pointerX, pointerY]);
-        })
-            .on('mouseleave', () => {
-            dispatcher.call('hover-shape', {}, undefined);
-        })
-            .on('click', (e) => {
+        svgElement.on('click', (e) => {
             const datum = getSelectedPoint(e.target);
             if (datum) {
                 dispatcher.call('click-chart', undefined, { point: datum.point.data, series: datum.point.series }, e);
@@ -90,6 +70,6 @@ export function ScatterSeriesShape(props) {
         return () => {
             dispatcher.on('hover-shape.scatter', null);
         };
-    }, [dispatcher, preparedData, seriesOptions, svgContainer]);
+    }, [dispatcher, preparedData, seriesOptions]);
     return React.createElement("g", { ref: ref, className: b() });
 }

package/build/plugins/d3/renderer/hooks/useShapes/styles.css

@@ -29,4 +29,8 @@
   alignment-baseline: text-before-edge;
   user-select: none;
   pointer-events: none;
+}
+
+.chartkit-d3-waterfall__connector {
+  stroke: var(--g-color-line-generic-active);
 }

package/build/plugins/d3/renderer/hooks/useShapes/treemap/index.d.ts

@@ -6,7 +6,6 @@ type ShapeProps = {
     dispatcher: Dispatch<object>;
     preparedData: PreparedTreemapData;
     seriesOptions: PreparedSeriesOptions;
-    svgContainer: SVGSVGElement | null;
 };
 export declare const TreemapSeriesShape: (props: ShapeProps) => React.JSX.Element;
 export {};

package/build/plugins/d3/renderer/hooks/useShapes/treemap/index.js

@@ -1,11 +1,11 @@
 import React from 'react';
-import { color, pointer, select } from 'd3';
+import { color, select } from 'd3';
 import get from 'lodash/get';
 import { block } from '../../../../../../utils/cn';
 import { setEllipsisForOverflowTexts } from '../../../utils';
 const b = block('d3-treemap');
 export const TreemapSeriesShape = (props) => {
-    const { dispatcher, preparedData, seriesOptions, svgContainer } = props;
+    const { dispatcher, preparedData, seriesOptions } = props;
     const ref = React.useRef(null);
     React.useEffect(() => {
         if (!ref.current) {
@@ -52,22 +52,15 @@ export const TreemapSeriesShape = (props) => {
         const eventName = `hover-shape.treemap`;
         const hoverOptions = get(seriesOptions, 'treemap.states.hover');
         const inactiveOptions = get(seriesOptions, 'treemap.states.inactive');
-        svgElement
-            .on('mousemove', (e) => {
-            const datum = getSelectedPart(e.target);
-            dispatcher.call('hover-shape', {}, [{ data: datum.data, series }], pointer(e, svgContainer));
-        })
-            .on('mouseleave', () => {
-            dispatcher.call('hover-shape', {}, undefined);
-        })
-            .on('click', (e) => {
+        svgElement.on('click', (e) => {
             const datum = getSelectedPart(e.target);
             dispatcher.call('click-chart', undefined, { point: datum.data, series }, e);
         });
         dispatcher.on(eventName, (data) => {
+            var _a;
             const hoverEnabled = hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.enabled;
             const inactiveEnabled = inactiveOptions === null || inactiveOptions === void 0 ? void 0 : inactiveOptions.enabled;
-            const hoveredData = data === null || data === void 0 ? void 0 : data[0].data;
+            const hoveredData = (_a = data === null || data === void 0 ? void 0 : data[0]) === null || _a === void 0 ? void 0 : _a.data;
             rectSelection.datum((d, index, list) => {
                 const currentRect = select(list[index]);
                 const hovered = Boolean(hoverEnabled && hoveredData === d.data);
@@ -106,6 +99,6 @@ export const TreemapSeriesShape = (props) => {
         return () => {
             dispatcher.on(eventName, null);
         };
-    }, [dispatcher, preparedData, seriesOptions, svgContainer]);
+    }, [dispatcher, preparedData, seriesOptions]);
     return React.createElement("g", { ref: ref, className: b() });
 };

package/build/plugins/d3/renderer/hooks/useShapes/waterfall/index.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { Dispatch } from 'd3';
+import type { PreparedSeriesOptions } from '../../useSeries/types';
+import type { PreparedWaterfallData } from './types';
+export { prepareWaterfallData } from './prepare-data';
+export * from './types';
+type Args = {
+    dispatcher: Dispatch<object>;
+    preparedData: PreparedWaterfallData[];
+    seriesOptions: PreparedSeriesOptions;
+};
+export declare const WaterfallSeriesShapes: (args: Args) => React.JSX.Element;

package/build/plugins/d3/renderer/hooks/useShapes/waterfall/index.js

@@ -0,0 +1,125 @@
+import React from 'react';
+import { color, line as lineGenerator, select } from 'd3';
+import get from 'lodash/get';
+import { DashStyle } from '../../../../../../constants';
+import { block } from '../../../../../../utils/cn';
+import { filterOverlappingLabels, getWaterfallPointColor } from '../../../utils';
+import { getLineDashArray } from '../utils';
+export { prepareWaterfallData } from './prepare-data';
+export * from './types';
+const b = block('d3-waterfall');
+export const WaterfallSeriesShapes = (args) => {
+    const { dispatcher, preparedData, seriesOptions } = args;
+    const ref = React.useRef(null);
+    const connectorSelector = `.${b('connector')}`;
+    React.useEffect(() => {
+        var _a;
+        if (!ref.current) {
+            return () => { };
+        }
+        const svgElement = select(ref.current);
+        const hoverOptions = get(seriesOptions, 'waterfall.states.hover');
+        const inactiveOptions = get(seriesOptions, 'waterfall.states.inactive');
+        svgElement.selectAll('*').remove();
+        const rectSelection = svgElement
+            .selectAll('allRects')
+            .data(preparedData)
+            .join('rect')
+            .attr('class', b('segment'))
+            .attr('x', (d) => d.x)
+            .attr('y', (d) => d.y)
+            .attr('height', (d) => d.height)
+            .attr('width', (d) => d.width)
+            .attr('fill', (d) => getWaterfallPointColor(d.data, d.series))
+            .attr('opacity', (d) => d.opacity)
+            .attr('cursor', (d) => d.series.cursor);
+        let dataLabels = preparedData.map((d) => d.label).filter(Boolean);
+        if (!((_a = preparedData[0]) === null || _a === void 0 ? void 0 : _a.series.dataLabels.allowOverlap)) {
+            dataLabels = filterOverlappingLabels(dataLabels);
+        }
+        const labelSelection = svgElement
+            .selectAll('text')
+            .data(dataLabels)
+            .join('text')
+            .text((d) => d.text)
+            .attr('class', b('label'))
+            .attr('x', (d) => d.x)
+            .attr('y', (d) => d.y)
+            .attr('text-anchor', (d) => d.textAnchor)
+            .style('font-size', (d) => d.style.fontSize)
+            .style('font-weight', (d) => d.style.fontWeight || null)
+            .style('fill', (d) => d.style.fontColor || null);
+        // Add the connector line between bars
+        svgElement
+            .selectAll(connectorSelector)
+            .data(preparedData)
+            .join('path')
+            .attr('class', b('connector'))
+            .attr('d', (d, index) => {
+            const line = lineGenerator();
+            const prev = preparedData[index - 1];
+            if (!prev) {
+                return null;
+            }
+            const points = [];
+            if (Number(prev.data.y) > 0) {
+                points.push([prev.x, prev.y]);
+            }
+            else {
+                points.push([prev.x, prev.y + prev.height]);
+            }
+            if (Number(d.data.y) > 0 && !d.data.total) {
+                points.push([d.x + d.width, d.y + d.height]);
+            }
+            else {
+                points.push([d.x + d.width, d.y]);
+            }
+            return line(points);
+        })
+            .attr('stroke-width', 1)
+            .attr('stroke-dasharray', () => getLineDashArray(DashStyle.Dash, 1));
+        dispatcher.on('hover-shape.waterfall', (data) => {
+            const hoverEnabled = hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.enabled;
+            const inactiveEnabled = inactiveOptions === null || inactiveOptions === void 0 ? void 0 : inactiveOptions.enabled;
+            if (!data) {
+                if (hoverEnabled) {
+                    rectSelection.attr('fill', (d) => getWaterfallPointColor(d.data, d.series));
+                }
+                if (inactiveEnabled) {
+                    rectSelection.attr('opacity', null);
+                    labelSelection.attr('opacity', null);
+                }
+                return;
+            }
+            if (hoverEnabled) {
+                const hoveredValues = data.map((d) => d.data.x);
+                rectSelection.attr('fill', (d) => {
+                    var _a;
+                    const fillColor = getWaterfallPointColor(d.data, d.series);
+                    if (hoveredValues.includes(d.data.x)) {
+                        const brightness = hoverOptions === null || hoverOptions === void 0 ? void 0 : hoverOptions.brightness;
+                        return ((_a = color(fillColor)) === null || _a === void 0 ? void 0 : _a.brighter(brightness).toString()) || fillColor;
+                    }
+                    return fillColor;
+                });
+            }
+            if (inactiveEnabled) {
+                const hoveredSeries = data.map((d) => d.series.id);
+                rectSelection.attr('opacity', (d) => {
+                    return hoveredSeries.includes(d.series.id)
+                        ? null
+                        : (inactiveOptions === null || inactiveOptions === void 0 ? void 0 : inactiveOptions.opacity) || null;
+                });
+                labelSelection.attr('opacity', (d) => {
+                    return hoveredSeries.includes(d.series.id)
+                        ? null
+                        : (inactiveOptions === null || inactiveOptions === void 0 ? void 0 : inactiveOptions.opacity) || null;
+                });
+            }
+        });
+        return () => {
+            dispatcher.on('hover-shape.waterfall', null);
+        };
+    }, [dispatcher, preparedData, seriesOptions]);
+    return React.createElement("g", { ref: ref, className: b() });
+};

package/build/plugins/d3/renderer/hooks/useShapes/waterfall/prepare-data.d.ts

@@ -0,0 +1,12 @@
+import type { ChartScale } from '../../useAxisScales';
+import type { PreparedAxis } from '../../useChartOptions/types';
+import type { PreparedSeriesOptions, PreparedWaterfallSeries } from '../../useSeries/types';
+import type { PreparedWaterfallData } from './types';
+export declare const prepareWaterfallData: (args: {
+    series: PreparedWaterfallSeries[];
+    seriesOptions: PreparedSeriesOptions;
+    xAxis: PreparedAxis;
+    xScale: ChartScale;
+    yAxis: PreparedAxis[];
+    yScale: ChartScale;
+}) => PreparedWaterfallData[];

package/build/plugins/d3/renderer/hooks/useShapes/waterfall/prepare-data.js

@@ -0,0 +1,132 @@
+import get from 'lodash/get';
+import sortBy from 'lodash/sortBy';
+import { getLabelsSize } from '../../../utils';
+import { MIN_BAR_GAP, MIN_BAR_WIDTH } from '../constants';
+import { getXValue, getYValue } from '../utils';
+function getLabelData(d, plotHeight) {
+    if (!d.series.dataLabels.enabled) {
+        return undefined;
+    }
+    const text = String(d.data.label || d.subTotal);
+    const style = d.series.dataLabels.style;
+    const { maxHeight: height, maxWidth: width } = getLabelsSize({ labels: [text], style });
+    let y;
+    if (Number(d.data.y) > 0 || d.data.total) {
+        y = Math.max(height, d.y - d.series.dataLabels.padding);
+    }
+    else {
+        y = Math.min(plotHeight - d.series.dataLabels.padding, d.y + d.height + d.series.dataLabels.padding + height);
+    }
+    return {
+        text,
+        x: d.x + d.width / 2,
+        y,
+        style,
+        size: { width, height },
+        textAnchor: 'middle',
+        series: d.series,
+    };
+}
+function getBandWidth(args) {
+    const { series, xAxis, xScale } = args;
+    if (xAxis.type === 'category') {
+        const xBandScale = xScale;
+        return xBandScale.bandwidth();
+    }
+    const xLinearScale = xScale;
+    const xValues = series.reduce((acc, s) => {
+        s.data.forEach((dataItem) => acc.push(Number(dataItem.x)));
+        return acc;
+    }, []);
+    let bandWidth = Infinity;
+    xValues.sort().forEach((xValue, index) => {
+        if (index > 0 && xValue !== xValues[index - 1]) {
+            const dist = xLinearScale(xValue) - xLinearScale(xValues[index - 1]);
+            if (dist < bandWidth) {
+                bandWidth = dist;
+            }
+        }
+    });
+    return bandWidth;
+}
+export const prepareWaterfallData = (args) => {
+    const { series, seriesOptions, xAxis, xScale, yAxis: [yAxis], yScale, } = args;
+    const yLinearScale = yScale;
+    const plotHeight = yLinearScale(yLinearScale.domain()[0]);
+    const barMaxWidth = get(seriesOptions, 'waterfall.barMaxWidth');
+    const barPadding = get(seriesOptions, 'waterfall.barPadding');
+    const flattenData = series.reduce((acc, s) => {
+        acc.push(...s.data.map((d) => ({ data: d, series: s })));
+        return acc;
+    }, []);
+    const data = sortBy(flattenData, (d) => d.data.x);
+    const bandWidth = getBandWidth({
+        series,
+        xAxis,
+        xScale,
+    });
+    const rectGap = Math.max(bandWidth * barPadding, MIN_BAR_GAP);
+    const rectWidth = Math.max(MIN_BAR_WIDTH, Math.min(bandWidth - rectGap, barMaxWidth));
+    const yZero = getYValue({
+        point: { y: 0 },
+        yScale,
+        yAxis,
+    });
+    let totalValue = 0;
+    const result = [];
+    data.forEach((item, _index) => {
+        if (typeof item.data.y !== 'number' && !item.data.total) {
+            return;
+        }
+        if (!item.data.total) {
+            totalValue += Number(item.data.y);
+        }
+        const prevPoint = result[result.length - 1];
+        const xCenter = getXValue({ point: item.data, xAxis, xScale });
+        const x = xCenter - rectWidth / 2;
+        const yValue = Number(item.data.total ? totalValue : item.data.y);
+        const height = yZero -
+            getYValue({
+                point: { y: Math.abs(yValue) },
+                yScale,
+                yAxis,
+            });
+        let y;
+        if (!prevPoint || item.data.total) {
+            y = getYValue({
+                point: {
+                    y: yValue > 0 ? yValue : 0,
+                },
+                yScale,
+                yAxis,
+            });
+        }
+        else if (Number(prevPoint.data.y) < 0) {
+            if (Number(item.data.y) > 0) {
+                y = prevPoint.y + prevPoint.height - height;
+            }
+            else {
+                y = prevPoint.y + prevPoint.height;
+            }
+        }
+        else if (Number(item.data.y) < 0) {
+            y = prevPoint.y;
+        }
+        else {
+            y = prevPoint.y - height;
+        }
+        const preparedData = {
+            x,
+            y,
+            width: rectWidth,
+            height,
+            opacity: get(item.data, 'opacity', null),
+            data: item.data,
+            series: item.series,
+            subTotal: totalValue,
+        };
+        preparedData.label = getLabelData(preparedData, plotHeight);
+        result.push(preparedData);
+    });
+    return result;
+};

package/build/plugins/d3/renderer/hooks/useShapes/waterfall/types.d.ts

@@ -0,0 +1,14 @@
+import { WaterfallSeriesData } from '../../../../../../types';
+import { LabelData } from '../../../types';
+import { PreparedWaterfallSeries } from '../../useSeries/types';
+export type PreparedWaterfallData = {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    opacity: number | null;
+    series: PreparedWaterfallSeries;
+    data: WaterfallSeriesData;
+    label?: LabelData;
+    subTotal: number;
+};

package/build/plugins/d3/renderer/hooks/useShapes/waterfall/types.js

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

package/build/plugins/d3/renderer/utils/get-closest-data.d.ts

@@ -0,0 +1,15 @@
+import type { ChartKitWidgetSeries, ChartKitWidgetSeriesData, TooltipDataChunk } from '../../../../types';
+import type { ShapeData } from '../hooks';
+type GetClosestPointsArgs = {
+    position: [number, number];
+    shapesData: ShapeData[];
+};
+export type ShapePoint = {
+    x: number;
+    y0: number;
+    y1: number;
+    data: ChartKitWidgetSeriesData;
+    series: ChartKitWidgetSeries;
+};
+export declare function getClosestPoints(args: GetClosestPointsArgs): TooltipDataChunk[];
+export {};