@mui/x-charts 8.11.2 → 8.12.0

package/esm/internals/plugins/featurePlugins/useChartCartesianAxis/getAxisValue.js

@@ -1,4 +1,4 @@
-import { isBandScale } from "../../../isBandScale.js";
+import { isOrdinalScale } from "../../../scaleGuards.js";
 function getAsANumber(value) {
   return value instanceof Date ? value.getTime() : value;
 }
@@ -13,7 +13,7 @@ export function getAxisIndex(axisConfig, pointerValue) {
     data: axisData,
     reverse
   } = axisConfig;
-  if (!isBandScale(scale)) {
+  if (!isOrdinalScale(scale)) {
     const value = scale.invert(pointerValue);
     if (axisData === undefined) {
       return -1;
@@ -51,7 +51,7 @@ export function getAxisValue(axisConfig, pointerValue, dataIndex) {
     scale,
     data: axisData
   } = axisConfig;
-  if (!isBandScale(scale)) {
+  if (!isOrdinalScale(scale)) {
     if (dataIndex === null) {
       return scale.invert(pointerValue);
     }

package/esm/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.js

@@ -16,6 +16,7 @@ import { getSVGPoint } from "../../../getSVGPoint.js";
 import { selectorChartsInteractionIsInitialized } from "../useChartInteraction/index.js";
 import { selectorChartAxisInteraction } from "./useChartCartesianInteraction.selectors.js";
 import { useLazySelectorEffect } from "../../utils/useLazySelectorEffect.js";
+import { checkHasInteractionPlugin } from "../useChartInteraction/checkHasInteractionPlugin.js";
 export const useChartCartesianAxis = ({
   params,
   store,
@@ -99,26 +100,27 @@ export const useChartCartesianAxis = ({
       onHighlightedAxisChange(nextAxisInteraction);
     }
   }, !onHighlightedAxisChange);
+  const hasInteractionPlugin = checkHasInteractionPlugin(instance);
   React.useEffect(() => {
     const element = svgRef.current;
-    if (!isInteractionEnabled || !element || params.disableAxisListener) {
+    if (!isInteractionEnabled || !hasInteractionPlugin || !element || params.disableAxisListener) {
       return () => {};
     }
 
     // Clean the interaction when the mouse leaves the chart.
     const moveEndHandler = instance.addInteractionListener('moveEnd', event => {
       if (!event.detail.activeGestures.pan) {
-        instance.cleanInteraction?.();
+        instance.cleanInteraction();
       }
     });
     const panEndHandler = instance.addInteractionListener('panEnd', event => {
       if (!event.detail.activeGestures.move) {
-        instance.cleanInteraction?.();
+        instance.cleanInteraction();
       }
     });
     const pressEndHandler = instance.addInteractionListener('quickPressEnd', event => {
       if (!event.detail.activeGestures.move && !event.detail.activeGestures.pan) {
-        instance.cleanInteraction?.();
+        instance.cleanInteraction();
       }
     });
     const gestureHandler = event => {
@@ -135,7 +137,7 @@ export const useChartCartesianAxis = ({
         instance.cleanInteraction?.();
         return;
       }
-      instance.setPointerCoordinate?.(svgPoint);
+      instance.setPointerCoordinate(svgPoint);
     };
     const moveHandler = instance.addInteractionListener('move', gestureHandler);
     const panHandler = instance.addInteractionListener('pan', gestureHandler);
@@ -148,7 +150,7 @@ export const useChartCartesianAxis = ({
       pressHandler.cleanup();
       pressEndHandler.cleanup();
     };
-  }, [svgRef, store, xAxisWithScale, usedXAxis, yAxisWithScale, usedYAxis, instance, params.disableAxisListener, isInteractionEnabled]);
+  }, [svgRef, store, xAxisWithScale, usedXAxis, yAxisWithScale, usedYAxis, instance, params.disableAxisListener, isInteractionEnabled, hasInteractionPlugin]);
   React.useEffect(() => {
     const element = svgRef.current;
     const onAxisClick = params.onAxisClick;

package/esm/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisPreview.selectors.d.ts

@@ -1,3 +1,5 @@
 import { AxisId } from "../../../../models/axis.js";
+export declare const selectorChartPreviewXScales: import("reselect").Selector<any, Record<AxisId, import("./getAxisScale.js").ScaleDefinition>, [axisId: AxisId]>;
 export declare const selectorChartPreviewComputedXAxis: import("reselect").Selector<any, import("./useChartCartesianAxis.types.js").ComputedAxisConfig<import("../../../index.js").ChartsXAxisProps>, [axisId: AxisId]>;
+export declare const selectorChartPreviewYScales: import("reselect").Selector<any, Record<AxisId, import("./getAxisScale.js").ScaleDefinition>, [axisId: AxisId]>;
 export declare const selectorChartPreviewComputedYAxis: import("reselect").Selector<any, import("./useChartCartesianAxis.types.js").ComputedAxisConfig<import("../../../index.js").ChartsYAxisProps>, [axisId: AxisId]>;

package/esm/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisPreview.selectors.js

@@ -5,6 +5,8 @@ import { computeAxisValue } from "./computeAxisValue.js";
 import { selectorChartZoomAxisFilters, selectorChartZoomOptionsLookup } from "./useChartCartesianAxisRendering.selectors.js";
 import { selectorChartDrawingArea } from "../../corePlugins/useChartDimensions/index.js";
 import { ZOOM_SLIDER_PREVIEW_SIZE } from "../../../constants.js";
+import { selectorPreferStrictDomainInLineCharts } from "../../corePlugins/useChartExperimentalFeature/index.js";
+import { getXAxesScales, getYAxesScales } from "./getAxisScale.js";
 function createPreviewDrawingArea(axisDirection, mainChartDrawingArea) {
   return axisDirection === 'x' ? {
     left: 0,
@@ -22,7 +24,25 @@ function createPreviewDrawingArea(axisDirection, mainChartDrawingArea) {
     bottom: mainChartDrawingArea.height
   };
 }
-export const selectorChartPreviewComputedXAxis = createSelector([selectorChartRawXAxis, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomOptionsLookup, selectorChartZoomAxisFilters, selectorChartDrawingArea, (_, axisId) => axisId], (xAxes, formattedSeries, seriesConfig, zoomOptions, getFilters, chartDrawingArea, axisId) => {
+export const selectorChartPreviewXScales = createSelector([selectorChartRawXAxis, selectorChartDrawingArea, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomOptionsLookup, selectorPreferStrictDomainInLineCharts, (_, axisId) => axisId], function selectorChartPreviewXScales(xAxes, chartDrawingArea, formattedSeries, seriesConfig, zoomOptions, preferStrictDomainInLineCharts, axisId) {
+  const hasAxis = xAxes?.some(axis => axis.id === axisId);
+  const drawingArea = createPreviewDrawingArea(hasAxis ? 'x' : 'y', chartDrawingArea);
+  const options = zoomOptions[axisId];
+  const zoomMap = new Map([[axisId, {
+    axisId,
+    start: options.minStart,
+    end: options.maxEnd
+  }]]);
+  return getXAxesScales({
+    drawingArea,
+    formattedSeries,
+    axis: xAxes,
+    seriesConfig,
+    zoomMap,
+    preferStrictDomainInLineCharts
+  });
+});
+export const selectorChartPreviewComputedXAxis = createSelector([selectorChartRawXAxis, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomOptionsLookup, selectorChartZoomAxisFilters, selectorChartDrawingArea, selectorPreferStrictDomainInLineCharts, selectorChartPreviewXScales, (_, axisId) => axisId], (xAxes, formattedSeries, seriesConfig, zoomOptions, getFilters, chartDrawingArea, preferStrictDomainInLineCharts, scales, axisId) => {
   const hasAxis = xAxes?.some(axis => axis.id === axisId);
   const drawingArea = createPreviewDrawingArea(hasAxis ? 'x' : 'y', chartDrawingArea);
   const options = zoomOptions[axisId];
@@ -32,6 +52,7 @@ export const selectorChartPreviewComputedXAxis = createSelector([selectorChartRa
     end: options.maxEnd
   }]]);
   const computedAxes = computeAxisValue({
+    scales,
     drawingArea,
     formattedSeries,
     axis: xAxes,
@@ -39,7 +60,8 @@ export const selectorChartPreviewComputedXAxis = createSelector([selectorChartRa
     axisDirection: 'x',
     zoomMap,
     zoomOptions,
-    getFilters
+    getFilters,
+    preferStrictDomainInLineCharts
   });
   if (computedAxes.axis[axisId]) {
     return {
@@ -48,7 +70,25 @@ export const selectorChartPreviewComputedXAxis = createSelector([selectorChartRa
   }
   return computedAxes.axis;
 });
-export const selectorChartPreviewComputedYAxis = createSelector([selectorChartRawYAxis, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomOptionsLookup, selectorChartZoomAxisFilters, selectorChartDrawingArea, (_, axisId) => axisId], (yAxes, formattedSeries, seriesConfig, zoomOptions, getFilters, chartDrawingArea, axisId) => {
+export const selectorChartPreviewYScales = createSelector([selectorChartRawYAxis, selectorChartDrawingArea, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomOptionsLookup, selectorPreferStrictDomainInLineCharts, (_, axisId) => axisId], function selectorChartPreviewYScales(yAxes, chartDrawingArea, formattedSeries, seriesConfig, zoomOptions, preferStrictDomainInLineCharts, axisId) {
+  const hasAxis = yAxes?.some(axis => axis.id === axisId);
+  const drawingArea = createPreviewDrawingArea(hasAxis ? 'y' : 'x', chartDrawingArea);
+  const options = zoomOptions[axisId];
+  const zoomMap = new Map([[axisId, {
+    axisId,
+    start: options.minStart,
+    end: options.maxEnd
+  }]]);
+  return getYAxesScales({
+    drawingArea,
+    formattedSeries,
+    axis: yAxes,
+    seriesConfig,
+    zoomMap,
+    preferStrictDomainInLineCharts
+  });
+});
+export const selectorChartPreviewComputedYAxis = createSelector([selectorChartRawYAxis, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomOptionsLookup, selectorChartZoomAxisFilters, selectorChartDrawingArea, selectorPreferStrictDomainInLineCharts, selectorChartPreviewYScales, (_, axisId) => axisId], (yAxes, formattedSeries, seriesConfig, zoomOptions, getFilters, chartDrawingArea, preferStrictDomainInLineCharts, scales, axisId) => {
   const hasAxis = yAxes?.some(axis => axis.id === axisId);
   const drawingArea = createPreviewDrawingArea(hasAxis ? 'y' : 'x', chartDrawingArea);
   const options = zoomOptions[axisId];
@@ -58,6 +98,7 @@ export const selectorChartPreviewComputedYAxis = createSelector([selectorChartRa
     end: options.maxEnd
   }]]);
   const computedAxes = computeAxisValue({
+    scales,
     drawingArea,
     formattedSeries,
     axis: yAxes,
@@ -65,7 +106,8 @@ export const selectorChartPreviewComputedYAxis = createSelector([selectorChartRa
     axisDirection: 'y',
     zoomMap,
     zoomOptions,
-    getFilters
+    getFilters,
+    preferStrictDomainInLineCharts
   });
   if (computedAxes.axis[axisId]) {
     return {

package/esm/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisRendering.selectors.d.ts

@@ -23,6 +23,16 @@ export declare const selectorChartZoomOptionsLookup: import("reselect").Selector
   [x: number]: import("./useChartCartesianAxis.types.js").DefaultizedZoomOptions;
 }, []>;
 export declare const selectorChartAxisZoomOptionsLookup: import("reselect").Selector<any, import("./useChartCartesianAxis.types.js").DefaultizedZoomOptions, [axisId: AxisId]>;
+export declare const selectorChartXScales: import("reselect").Selector<import("../../corePlugins/useChartId/useChartId.types.js").UseChartIdState & import("../../corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../../corePlugins/useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("../../corePlugins/useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../../corePlugins/useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../../../index.js").UseChartInteractionListenerState & Partial<import("./useChartCartesianAxis.types.js").UseChartCartesianAxisState> & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+} & Partial<{}> & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+}, Record<AxisId, import("./getAxisScale.js").ScaleDefinition>, []>;
+export declare const selectorChartYScales: import("reselect").Selector<import("../../corePlugins/useChartId/useChartId.types.js").UseChartIdState & import("../../corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../../corePlugins/useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("../../corePlugins/useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../../corePlugins/useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../../../index.js").UseChartInteractionListenerState & Partial<import("./useChartCartesianAxis.types.js").UseChartCartesianAxisState> & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+} & Partial<{}> & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+}, Record<AxisId, import("./getAxisScale.js").ScaleDefinition>, []>;
 export declare const selectorChartZoomAxisFilters: import("reselect").Selector<import("../../corePlugins/useChartId/useChartId.types.js").UseChartIdState & import("../../corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../../corePlugins/useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("../../corePlugins/useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../../corePlugins/useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../../../index.js").UseChartInteractionListenerState & Partial<import("./useChartCartesianAxis.types.js").UseChartCartesianAxisState> & {
   cacheKey: import("../../models/index.js").ChartStateCacheKey;
 } & {

package/esm/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisRendering.selectors.js

@@ -7,6 +7,7 @@ import { createAxisFilterMapper, createGetAxisFilters } from "./createAxisFilter
 import { createZoomLookup } from "./createZoomLookup.js";
 import { selectorChartRawXAxis, selectorChartRawYAxis } from "./useChartCartesianAxisLayout.selectors.js";
 import { selectorPreferStrictDomainInLineCharts } from "../../corePlugins/useChartExperimentalFeature/index.js";
+import { getXAxesScales, getYAxesScales } from "./getAxisScale.js";
 export const createZoomMap = zoom => {
   const zoomItemMap = new Map();
   zoom.forEach(zoomItem => {
@@ -24,34 +25,42 @@ export const selectorChartZoomIsInteracting = createSelector([selectorChartZoomS
 export const selectorChartZoomMap = createSelector([selectorChartZoomState], zoom => zoom?.zoomData && createZoomMap(zoom?.zoomData));
 export const selectorChartZoomOptionsLookup = createSelector([selectorChartRawXAxis, selectorChartRawYAxis], (xAxis, yAxis) => _extends({}, createZoomLookup('x')(xAxis), createZoomLookup('y')(yAxis)));
 export const selectorChartAxisZoomOptionsLookup = createSelector([selectorChartZoomOptionsLookup, (_, axisId) => axisId], (axisLookup, axisId) => axisLookup[axisId]);
-const selectorChartXFilter = createSelector([selectorChartZoomMap, selectorChartZoomOptionsLookup, selectorChartSeriesConfig, selectorChartSeriesProcessed], (zoomMap, zoomOptions, seriesConfig, formattedSeries) => zoomMap && zoomOptions && createAxisFilterMapper({
-  zoomMap,
-  zoomOptions,
-  seriesConfig,
-  formattedSeries,
-  direction: 'x'
-}));
-const selectorChartYFilter = createSelector([selectorChartZoomMap, selectorChartZoomOptionsLookup, selectorChartSeriesConfig, selectorChartSeriesProcessed], (zoomMap, zoomOptions, seriesConfig, formattedSeries) => zoomMap && zoomOptions && createAxisFilterMapper({
-  zoomMap,
-  zoomOptions,
-  seriesConfig,
-  formattedSeries,
-  direction: 'y'
-}));
-export const selectorChartZoomAxisFilters = createSelector([selectorChartXFilter, selectorChartYFilter, selectorChartRawXAxis, selectorChartRawYAxis], (xMapper, yMapper, xAxis, yAxis) => {
+const selectorChartXFilter = createSelector([selectorChartZoomMap, selectorChartZoomOptionsLookup], (zoomMap, zoomOptions) => zoomMap && zoomOptions && createAxisFilterMapper(zoomMap, zoomOptions, 'x'));
+const selectorChartYFilter = createSelector([selectorChartZoomMap, selectorChartZoomOptionsLookup], (zoomMap, zoomOptions) => zoomMap && zoomOptions && createAxisFilterMapper(zoomMap, zoomOptions, 'y'));
+export const selectorChartXScales = createSelector([selectorChartRawXAxis, selectorChartDrawingArea, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomMap, selectorPreferStrictDomainInLineCharts], function selectorChartXScales(axis, drawingArea, formattedSeries, seriesConfig, zoomMap, preferStrictDomainInLineCharts) {
+  return getXAxesScales({
+    drawingArea,
+    formattedSeries,
+    axis,
+    seriesConfig,
+    zoomMap,
+    preferStrictDomainInLineCharts
+  });
+});
+export const selectorChartYScales = createSelector([selectorChartRawYAxis, selectorChartDrawingArea, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomMap, selectorPreferStrictDomainInLineCharts], function selectorChartYScales(axis, drawingArea, formattedSeries, seriesConfig, zoomMap, preferStrictDomainInLineCharts) {
+  return getYAxesScales({
+    drawingArea,
+    formattedSeries,
+    axis,
+    seriesConfig,
+    zoomMap,
+    preferStrictDomainInLineCharts
+  });
+});
+export const selectorChartZoomAxisFilters = createSelector([selectorChartXFilter, selectorChartYFilter, selectorChartRawXAxis, selectorChartRawYAxis, selectorChartXScales, selectorChartYScales], (xMapper, yMapper, xAxis, yAxis, xScales, yScales) => {
   if (xMapper === undefined || yMapper === undefined) {
     // Early return if there is no zoom.
     return undefined;
   }
-  const xFilters = xAxis?.reduce((acc, axis, index) => {
-    const filter = xMapper(axis, index);
+  const xFilters = xAxis?.reduce((acc, axis) => {
+    const filter = xMapper(axis.id, axis.data, xScales[axis.id].scale);
     if (filter !== null) {
       acc[axis.id] = filter;
     }
     return acc;
   }, {});
-  const yFilters = yAxis?.reduce((acc, axis, index) => {
-    const filter = yMapper(axis, index);
+  const yFilters = yAxis?.reduce((acc, axis) => {
+    const filter = yMapper(axis.id, axis.data, yScales[axis.id].scale);
     if (filter !== null) {
       acc[axis.id] = filter;
     }
@@ -67,7 +76,8 @@ export const selectorChartZoomAxisFilters = createSelector([selectorChartXFilter
  * The only interesting selectors that merge axis data and zoom if provided.
  */
 
-export const selectorChartXAxis = createSelector([selectorChartRawXAxis, selectorChartDrawingArea, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomMap, selectorChartZoomOptionsLookup, selectorChartZoomAxisFilters, selectorPreferStrictDomainInLineCharts], (axis, drawingArea, formattedSeries, seriesConfig, zoomMap, zoomOptions, getFilters, preferStrictDomainInLineCharts) => computeAxisValue({
+export const selectorChartXAxis = createSelector([selectorChartRawXAxis, selectorChartDrawingArea, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomMap, selectorChartZoomOptionsLookup, selectorChartZoomAxisFilters, selectorPreferStrictDomainInLineCharts, selectorChartXScales], (axis, drawingArea, formattedSeries, seriesConfig, zoomMap, zoomOptions, getFilters, preferStrictDomainInLineCharts, scales) => computeAxisValue({
+  scales,
   drawingArea,
   formattedSeries,
   axis,
@@ -78,7 +88,8 @@ export const selectorChartXAxis = createSelector([selectorChartRawXAxis, selecto
   getFilters,
   preferStrictDomainInLineCharts
 }));
-export const selectorChartYAxis = createSelector([selectorChartRawYAxis, selectorChartDrawingArea, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomMap, selectorChartZoomOptionsLookup, selectorChartZoomAxisFilters, selectorPreferStrictDomainInLineCharts], (axis, drawingArea, formattedSeries, seriesConfig, zoomMap, zoomOptions, getFilters, preferStrictDomainInLineCharts) => computeAxisValue({
+export const selectorChartYAxis = createSelector([selectorChartRawYAxis, selectorChartDrawingArea, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomMap, selectorChartZoomOptionsLookup, selectorChartZoomAxisFilters, selectorPreferStrictDomainInLineCharts, selectorChartYScales], (axis, drawingArea, formattedSeries, seriesConfig, zoomMap, zoomOptions, getFilters, preferStrictDomainInLineCharts, scales) => computeAxisValue({
+  scales,
   drawingArea,
   formattedSeries,
   axis,

package/esm/internals/plugins/featurePlugins/useChartClosestPoint/index.d.ts

@@ -0,0 +1,3 @@
+export { useChartClosestPoint } from "./useChartClosestPoint.js";
+export * from "./useChartClosestPoint.selectors.js";
+export type { UseChartClosestPointSignature } from "./useChartClosestPoint.types.js";

package/esm/internals/plugins/featurePlugins/useChartClosestPoint/index.js

@@ -0,0 +1,2 @@
+export { useChartClosestPoint } from "./useChartClosestPoint.js";
+export * from "./useChartClosestPoint.selectors.js";

package/esm/internals/plugins/featurePlugins/useChartClosestPoint/useChartClosestPoint.d.ts

@@ -0,0 +1,3 @@
+import { ChartPlugin } from "../../models/index.js";
+import { UseChartClosestPointSignature } from "./useChartClosestPoint.types.js";
+export declare const useChartClosestPoint: ChartPlugin<UseChartClosestPointSignature>;

package/esm/internals/plugins/featurePlugins/{useChartVoronoi/useChartVoronoi.js → useChartClosestPoint/useChartClosestPoint.js}

@@ -11,7 +11,7 @@ import { useSelector } from "../../../store/useSelector.js";
 import { selectorChartXAxis, selectorChartYAxis, selectorChartZoomIsInteracting } from "../useChartCartesianAxis/index.js";
 import { selectorChartSeriesProcessed } from "../../corePlugins/useChartSeries/useChartSeries.selectors.js";
 import { selectorChartDrawingArea } from "../../corePlugins/useChartDimensions/index.js";
-export const useChartVoronoi = ({
+export const useChartClosestPoint = ({
   svgRef,
   params,
   store,
@@ -86,7 +86,8 @@ export const useChartVoronoi = ({
         seriesId,
         seriesIndexes,
         startIndex: points.length,
-        endIndex: points.length + seriesPoints.length
+        endIndex: points.length + seriesPoints.length,
+        markerSize: series[seriesId].markerSize
       };
       points = points.concat(seriesPoints);
     });
@@ -123,11 +124,12 @@ export const useChartVoronoi = ({
       // The point index in the series with id=closestSeries.seriesId.
       const seriesPointIndex = (2 * closestPointIndex - voronoiRef.current[closestSeries.seriesId].startIndex) / 2;
       const dataIndex = voronoiRef.current[closestSeries.seriesId].seriesIndexes[seriesPointIndex];
-      if (voronoiMaxRadius !== undefined) {
+      const maxRadius = voronoiMaxRadius === 'item' ? closestSeries.markerSize : voronoiMaxRadius;
+      if (maxRadius !== undefined) {
         const pointX = delauneyRef.current.points[2 * closestPointIndex];
         const pointY = delauneyRef.current.points[2 * closestPointIndex + 1];
         const dist2 = (pointX - svgPoint.x) ** 2 + (pointY - svgPoint.y) ** 2;
-        if (dist2 > voronoiMaxRadius ** 2) {
+        if (dist2 > maxRadius ** 2) {
           // The closest point is too far to be considered.
           return 'outside-voronoi-max-radius';
         }
@@ -233,17 +235,17 @@ export const useChartVoronoi = ({
     }
   };
 };
-useChartVoronoi.getDefaultizedParams = ({
+useChartClosestPoint.getDefaultizedParams = ({
   params
 }) => _extends({}, params, {
   disableVoronoi: params.disableVoronoi ?? !params.series.some(item => item.type === 'scatter')
 });
-useChartVoronoi.getInitialState = params => ({
+useChartClosestPoint.getInitialState = params => ({
   voronoi: {
     isVoronoiEnabled: !params.disableVoronoi
   }
 });
-useChartVoronoi.params = {
+useChartClosestPoint.params = {
   disableVoronoi: true,
   voronoiMaxRadius: true,
   onItemClick: true

package/esm/internals/plugins/featurePlugins/useChartClosestPoint/useChartClosestPoint.selectors.d.ts

@@ -0,0 +1,5 @@
+export declare const selectorChartsIsVoronoiEnabled: import("reselect").Selector<import("../../corePlugins/useChartId/useChartId.types.js").UseChartIdState & import("../../corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../../corePlugins/useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("../../corePlugins/useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../../corePlugins/useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../../../index.js").UseChartInteractionListenerState & import("./useChartClosestPoint.types.js").UseChartVoronoiState & Partial<{}> & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+} & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+}, boolean | undefined, any[]>;

package/esm/internals/plugins/featurePlugins/useChartClosestPoint/useChartClosestPoint.selectors.js

@@ -0,0 +1,3 @@
+import { createSelector } from "../../utils/selectors.js";
+const selectVoronoi = state => state.voronoi;
+export const selectorChartsIsVoronoiEnabled = createSelector([selectVoronoi], voronoi => voronoi?.isVoronoiEnabled);

package/esm/internals/plugins/featurePlugins/{useChartVoronoi/useChartVoronoi.types.d.ts → useChartClosestPoint/useChartClosestPoint.types.d.ts}

@@ -29,10 +29,11 @@ export interface UseChartVoronoiParameters {
    */
   disableVoronoi?: boolean;
   /**
-   * Defines the maximal distance between a scatter point and the pointer that triggers the interaction.
+   * Defines the maximum distance between a scatter point and the pointer that triggers the interaction.
+   * If set to `'item'`, the radius is the `markerSize`.
    * If `undefined`, the radius is assumed to be infinite.
    */
-  voronoiMaxRadius?: number | undefined;
+  voronoiMaxRadius?: 'item' | number | undefined;
   /**
    * Callback fired when clicking close to an item.
    * This is only available for scatter plot for now.
@@ -41,10 +42,13 @@ export interface UseChartVoronoiParameters {
    */
   onItemClick?: (event: MouseEvent, scatterItemIdentifier: ScatterItemIdentifier) => void;
 }
-export type UseChartVoronoiDefaultizedParameters = UseChartVoronoiParameters & {
+export type UseChartVoronoiDefaultizedParameters = Pick<UseChartVoronoiParameters, 'voronoiMaxRadius' | 'onItemClick'> & {
+  /**
+   * If true, the voronoi plugin is disabled.
+   */
   disableVoronoi: boolean;
 };
-export type UseChartVoronoiSignature = ChartPluginSignature<{
+export type UseChartClosestPointSignature = ChartPluginSignature<{
   instance: UseChartVoronoiInstance;
   state: UseChartVoronoiState;
   params: UseChartVoronoiParameters;

package/esm/internals/plugins/featurePlugins/useChartHighlight/highlightStates.d.ts

@@ -0,0 +1,16 @@
+import { HighlightItemData } from "./useChartHighlight.types.js";
+import { HighlightScope } from "./highlightConfig.types.js";
+import { SeriesId } from "../../../../models/seriesType/common.js";
+export declare function isSeriesHighlighted(scope: Partial<HighlightScope> | null, item: HighlightItemData | null, seriesId: SeriesId): boolean;
+export declare function isSeriesFaded(scope: Partial<HighlightScope> | null, item: HighlightItemData | null, seriesId: SeriesId): boolean;
+/**
+ * Returns the data index of the highlighted item for a specific series.
+ * If the item is not highlighted, it returns `null`.
+ */
+export declare function getSeriesHighlightedItem(scope: Partial<HighlightScope> | null, item: HighlightItemData | null, seriesId: SeriesId): number | null | undefined;
+/**
+ * Returns the data index of the "unfaded item" for a specific series.
+ * An "unfaded item" is the only item of a faded series that shouldn't be faded.
+ * If the series is not faded or if there is no highlighted item, it returns `null`.
+ */
+export declare function getSeriesUnfadedItem(scope: Partial<HighlightScope> | null, item: HighlightItemData | null, seriesId: SeriesId): number | null | undefined;

package/esm/internals/plugins/featurePlugins/useChartHighlight/highlightStates.js

@@ -0,0 +1,32 @@
+export function isSeriesHighlighted(scope, item, seriesId) {
+  return scope?.highlight === 'series' && item?.seriesId === seriesId;
+}
+export function isSeriesFaded(scope, item, seriesId) {
+  if (isSeriesHighlighted(scope, item, seriesId)) {
+    return false;
+  }
+  return scope?.fade === 'global' && item != null || scope?.fade === 'series' && item?.seriesId === seriesId;
+}
+
+/**
+ * Returns the data index of the highlighted item for a specific series.
+ * If the item is not highlighted, it returns `null`.
+ */
+export function getSeriesHighlightedItem(scope, item, seriesId) {
+  return scope?.highlight === 'item' && item?.seriesId === seriesId ? item.dataIndex : null;
+}
+
+/**
+ * Returns the data index of the "unfaded item" for a specific series.
+ * An "unfaded item" is the only item of a faded series that shouldn't be faded.
+ * If the series is not faded or if there is no highlighted item, it returns `null`.
+ */
+export function getSeriesUnfadedItem(scope, item, seriesId) {
+  if (isSeriesHighlighted(scope, item, seriesId)) {
+    return null;
+  }
+  if (getSeriesHighlightedItem(scope, item, seriesId) === item?.dataIndex) {
+    return null;
+  }
+  return (scope?.fade === 'series' || scope?.fade === 'global') && item?.seriesId === seriesId ? item.dataIndex : null;
+}

package/esm/internals/plugins/featurePlugins/useChartHighlight/useChartHighlight.selectors.d.ts

@@ -27,4 +27,8 @@ export declare const selectorChartsIsFadedCallback: import("reselect").Selector<
   cacheKey: import("../../models/index.js").ChartStateCacheKey;
 } & import("./useChartHighlight.types.js").UseChartHighlightState, (item: HighlightItemData | null) => boolean, any[]>;
 export declare const selectorChartsIsHighlighted: import("reselect").Selector<any, boolean, [item: HighlightItemData | null]>;
+export declare const selectorChartIsSeriesHighlighted: import("reselect").Selector<any, boolean, [seriesId: SeriesId]>;
+export declare const selectorChartIsSeriesFaded: import("reselect").Selector<any, boolean, [seriesId: SeriesId]>;
+export declare const selectorChartSeriesUnfadedItem: import("reselect").Selector<any, number | null | undefined, [seriesId: SeriesId]>;
+export declare const selectorChartSeriesHighlightedItem: import("reselect").Selector<any, number | null | undefined, [seriesId: SeriesId]>;
 export declare const selectorChartsIsFaded: import("reselect").Selector<any, boolean, [item: HighlightItemData | null]>;

package/esm/internals/plugins/featurePlugins/useChartHighlight/useChartHighlight.selectors.js

@@ -1,6 +1,7 @@
 import { createSelector } from "../../utils/selectors.js";
 import { createIsHighlighted } from "./createIsHighlighted.js";
 import { createIsFaded } from "./createIsFaded.js";
+import { getSeriesHighlightedItem, getSeriesUnfadedItem, isSeriesFaded, isSeriesHighlighted } from "./highlightStates.js";
 const selectHighlight = state => state.highlight;
 const selectSeries = state => state.series;
 export const selectorChartsHighlightScopePerSeriesId = createSelector([selectSeries], series => {
@@ -32,6 +33,10 @@ export const selectorChartsIsFadedCallback = createSelector([selectorChartsHighl
 export const selectorChartsIsHighlighted = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem, (_, item) => item], function selectorChartsIsHighlighted(highlightScope, highlightedItem, item) {
   return createIsHighlighted(highlightScope, highlightedItem)(item);
 });
+export const selectorChartIsSeriesHighlighted = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem, (_, seriesId) => seriesId], isSeriesHighlighted);
+export const selectorChartIsSeriesFaded = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem, (_, seriesId) => seriesId], isSeriesFaded);
+export const selectorChartSeriesUnfadedItem = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem, (_, seriesId) => seriesId], getSeriesUnfadedItem);
+export const selectorChartSeriesHighlightedItem = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem, (_, seriesId) => seriesId], getSeriesHighlightedItem);
 export const selectorChartsIsFaded = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem, (_, item) => item], function selectorChartsIsFaded(highlightScope, highlightedItem, item) {
   return createIsFaded(highlightScope, highlightedItem)(item);
 });

package/esm/internals/plugins/featurePlugins/useChartInteraction/checkHasInteractionPlugin.d.ts

@@ -0,0 +1,3 @@
+import { ChartAnyPluginSignature, ChartUsedInstance } from "../../models/plugin.js";
+import { UseChartInteractionInstance } from "./useChartInteraction.types.js";
+export declare function checkHasInteractionPlugin<T extends ChartAnyPluginSignature>(instance: ChartUsedInstance<T>): instance is ChartUsedInstance<T> & UseChartInteractionInstance;

package/esm/internals/plugins/featurePlugins/useChartInteraction/checkHasInteractionPlugin.js

@@ -0,0 +1,3 @@
+export function checkHasInteractionPlugin(instance) {
+  return instance.setPointerCoordinate !== undefined;
+}

package/esm/internals/plugins/featurePlugins/useChartKeyboardNavigation/index.d.ts

@@ -0,0 +1,3 @@
+export { useChartKeyboardNavigation } from "./useChartKeyboardNavigation.js";
+export * from "./useChartKeyboardNavigation.selectors.js";
+export type { UseChartKeyboardNavigationSignature } from "./useChartKeyboardNavigation.types.js";

package/esm/internals/plugins/featurePlugins/useChartKeyboardNavigation/index.js

@@ -0,0 +1,2 @@
+export { useChartKeyboardNavigation } from "./useChartKeyboardNavigation.js";
+export * from "./useChartKeyboardNavigation.selectors.js";

package/esm/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.d.ts

@@ -0,0 +1,3 @@
+import { ChartPlugin } from "../../models/index.js";
+import { UseChartKeyboardNavigationSignature } from "./useChartKeyboardNavigation.types.js";
+export declare const useChartKeyboardNavigation: ChartPlugin<UseChartKeyboardNavigationSignature>;

package/esm/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.helpers.d.ts

@@ -0,0 +1,20 @@
+import { ChartSeriesType, ChartsSeriesConfig } from "../../../../models/seriesType/config.js";
+import { SeriesId } from "../../../../models/seriesType/common.js";
+import { ProcessedSeries } from "../../corePlugins/useChartSeries/index.js";
+/**
+ * Returns the next series type and id that contains some data.
+ * Returns `null` if no other series have data.
+ */
+export declare function getNextSeriesWithData(series: ProcessedSeries<keyof ChartsSeriesConfig>, type?: ChartSeriesType, seriesId?: SeriesId): {
+  type: Exclude<ChartSeriesType, 'sankey'>;
+  seriesId: SeriesId;
+} | null;
+/**
+ * Returns the previous series type and id that contains some data.
+ * Returns `null` if no other series have data.
+ */
+export declare function getPreviousSeriesWithData(series: ProcessedSeries<keyof ChartsSeriesConfig>, type?: ChartSeriesType, seriesId?: SeriesId): {
+  type: Exclude<ChartSeriesType, 'sankey'>;
+  seriesId: SeriesId;
+} | null;
+export declare function seriesHasData(series: ProcessedSeries<keyof ChartsSeriesConfig>, type: ChartSeriesType, seriesId: SeriesId): boolean | undefined;

package/esm/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.helpers.js

@@ -0,0 +1,88 @@
+/**
+ * Returns the next series type and id that contains some data.
+ * Returns `null` if no other series have data.
+ */
+export function getNextSeriesWithData(series, type, seriesId) {
+  const startingTypeIndex = type !== undefined && series[type] ? Object.keys(series).indexOf(type) : 0;
+  const currentSeriesIndex = type !== undefined && seriesId !== undefined && series[type] && series[type].series[seriesId] ? series[type].seriesOrder.indexOf(seriesId) : -1;
+  const typesAvailable = Object.keys(series).filter(t => t !== 'sankey');
+
+  // Loop over all series types starting with the current seriesType
+  for (let typeGap = 0; typeGap < typesAvailable.length; typeGap += 1) {
+    const typeIndex = (startingTypeIndex + typeGap) % typesAvailable.length;
+    const seriesOfType = series[typesAvailable[typeIndex]];
+
+    // Edge case for the current series type: we don't loop on previous series of the same type.
+    const startingSeriesIndex = typeGap === 0 ? currentSeriesIndex + 1 : 0;
+    for (let seriesIndex = startingSeriesIndex; seriesIndex < seriesOfType.seriesOrder.length; seriesIndex += 1) {
+      if (seriesOfType.series[seriesOfType.seriesOrder[seriesIndex]].data.length > 0) {
+        return {
+          type: typesAvailable[typeIndex],
+          seriesId: seriesOfType.seriesOrder[seriesIndex]
+        };
+      }
+    }
+  }
+
+  // End looping on the initial type up to the initial series (excluded)
+  const typeIndex = startingTypeIndex;
+  const seriesOfType = series[typesAvailable[typeIndex]];
+  const endingSeriesIndex = currentSeriesIndex;
+  for (let seriesIndex = 0; seriesIndex < endingSeriesIndex; seriesIndex += 1) {
+    if (seriesOfType.series[seriesOfType.seriesOrder[seriesIndex]].data.length > 0) {
+      return {
+        type: typesAvailable[typeIndex],
+        seriesId: seriesOfType.seriesOrder[seriesIndex]
+      };
+    }
+  }
+  return null;
+}
+
+/**
+ * Returns the previous series type and id that contains some data.
+ * Returns `null` if no other series have data.
+ */
+export function getPreviousSeriesWithData(series, type, seriesId) {
+  const startingTypeIndex = type !== undefined && series[type] ? Object.keys(series).indexOf(type) : 0;
+  const startingSeriesIndex = type !== undefined && seriesId !== undefined && series[type] && series[type].series[seriesId] ? series[type].seriesOrder.indexOf(seriesId) : 1;
+  const typesAvailable = Object.keys(series).filter(t => t !== 'sankey');
+
+  // Loop over all series types starting with the current seriesType
+  for (let typeGap = 0; typeGap < typesAvailable.length; typeGap += 1) {
+    const typeIndex = (typesAvailable.length + startingTypeIndex - typeGap) % typesAvailable.length;
+    const seriesOfType = series[typesAvailable[typeIndex]];
+    const maxGap = typeGap === 0 ? startingSeriesIndex + 1 : seriesOfType.seriesOrder.length;
+    for (let seriesGap = 1; seriesGap < maxGap; seriesGap += 1) {
+      const seriesIndex = (seriesOfType.seriesOrder.length + startingSeriesIndex - seriesGap) % seriesOfType.seriesOrder.length;
+      if (seriesOfType.series[seriesOfType.seriesOrder[seriesIndex]].data.length > 0) {
+        return {
+          type: typesAvailable[typeIndex],
+          seriesId: seriesOfType.seriesOrder[seriesIndex]
+        };
+      }
+    }
+  }
+
+  // End looping on the initial type down to the initial series (excluded)
+  const typeIndex = startingTypeIndex;
+  const seriesOfType = series[typesAvailable[typeIndex]];
+  const availableSeriesIds = seriesOfType.seriesOrder;
+  for (let seriesIndex = availableSeriesIds.length - 1; seriesIndex > startingSeriesIndex; seriesIndex -= 1) {
+    if (seriesOfType.series[seriesOfType.seriesOrder[seriesIndex]].data.length > 0) {
+      return {
+        type: typesAvailable[typeIndex],
+        seriesId: seriesOfType.seriesOrder[seriesIndex]
+      };
+    }
+  }
+  return null;
+}
+export function seriesHasData(series, type, seriesId) {
+  // @ts-ignore snakey is not in MIT version
+  if (type === 'sankey') {
+    return false;
+  }
+  const data = series[type]?.series[seriesId]?.data;
+  return data && data.length > 0;
+}