@mui/x-charts 8.18.0 → 8.20.0

package/esm/internals/plugins/corePlugins/useChartSeries/useChartSeries.selectors.d.ts

@@ -1,17 +1,24 @@
 import { ChartRootSelector } from "../../utils/selectors.js";
 import { UseChartSeriesSignature } from "./useChartSeries.types.js";
 export declare const selectorChartSeriesState: ChartRootSelector<UseChartSeriesSignature>;
-export declare const selectorChartSeriesProcessed: (args_0: import("../useChartId/useChartId.types.js").UseChartIdState & import("../useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("./useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../useChartInteractionListener/index.js").UseChartInteractionListenerState & Partial<{}> & {
+export declare const selectorChartDefaultizedSeries: (args_0: import("../useChartId/useChartId.types.js").UseChartIdState & import("../useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("./useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../useChartInteractionListener/index.js").UseChartInteractionListenerState & Partial<{}> & {
   cacheKey: import("../../models/index.js").ChartStateCacheKey;
-}) => import("./useChartSeries.types.js").ProcessedSeries<keyof import("../../../index.js").ChartsSeriesConfig>;
+}) => import("./useChartSeries.types.js").DefaultizedSeriesGroups<keyof import("../../../index.js").ChartsSeriesConfig>;
 export declare const selectorChartSeriesConfig: (args_0: import("../useChartId/useChartId.types.js").UseChartIdState & import("../useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("./useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../useChartInteractionListener/index.js").UseChartInteractionListenerState & Partial<{}> & {
   cacheKey: import("../../models/index.js").ChartStateCacheKey;
 }) => import("../../models/index.js").ChartSeriesConfig<keyof import("../../../index.js").ChartsSeriesConfig>;
 /**
  * Get the dataset from the series state.
- * @param {ChartState<[UseChartSeriesSignature]>} state The state of the chart.
  * @returns {DatasetType | undefined} The dataset.
  */
 export declare const selectorChartDataset: (args_0: import("../useChartId/useChartId.types.js").UseChartIdState & import("../useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("./useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../useChartInteractionListener/index.js").UseChartInteractionListenerState & Partial<{}> & {
   cacheKey: import("../../models/index.js").ChartStateCacheKey;
-}) => readonly import("../../../index.js").DatasetElementType<string | number | Date | null | undefined>[] | undefined;
+}) => readonly import("../../../index.js").DatasetElementType<unknown>[] | undefined;
+/**
+ * Get the processed series after applying series processors.
+ * This selector computes the processed series on-demand from the defaultized series.
+ * @returns {ProcessedSeries} The processed series.
+ */
+export declare const selectorChartSeriesProcessed: (args_0: import("../useChartId/useChartId.types.js").UseChartIdState & import("../useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("./useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../useChartInteractionListener/index.js").UseChartInteractionListenerState & Partial<{}> & {
+  cacheKey: import("../../models/index.js").ChartStateCacheKey;
+}) => import("./useChartSeries.types.js").ProcessedSeries<keyof import("../../../index.js").ChartsSeriesConfig>;

package/esm/internals/plugins/corePlugins/useChartSeries/useChartSeries.selectors.js

@@ -1,11 +1,20 @@
-import { createSelector } from "../../utils/selectors.js";
+import { createSelectorMemoized, createSelector } from '@mui/x-internals/store';
+import { applySeriesProcessors } from "./processSeries.js";
 export const selectorChartSeriesState = state => state.series;
-export const selectorChartSeriesProcessed = createSelector([selectorChartSeriesState], seriesState => seriesState.processedSeries);
-export const selectorChartSeriesConfig = createSelector([selectorChartSeriesState], seriesState => seriesState.seriesConfig);
+export const selectorChartDefaultizedSeries = createSelector(selectorChartSeriesState, seriesState => seriesState.defaultizedSeries);
+export const selectorChartSeriesConfig = createSelector(selectorChartSeriesState, seriesState => seriesState.seriesConfig);
 
 /**
  * Get the dataset from the series state.
- * @param {ChartState<[UseChartSeriesSignature]>} state The state of the chart.
  * @returns {DatasetType | undefined} The dataset.
  */
-export const selectorChartDataset = createSelector([selectorChartSeriesState], seriesState => seriesState.dataset);
+export const selectorChartDataset = createSelector(selectorChartSeriesState, seriesState => seriesState.dataset);
+
+/**
+ * Get the processed series after applying series processors.
+ * This selector computes the processed series on-demand from the defaultized series.
+ * @returns {ProcessedSeries} The processed series.
+ */
+export const selectorChartSeriesProcessed = createSelectorMemoized(selectorChartDefaultizedSeries, selectorChartSeriesConfig, selectorChartDataset, function selectorChartSeriesProcessed(defaultizedSeries, seriesConfig, dataset) {
+  return applySeriesProcessors(defaultizedSeries, seriesConfig, dataset);
+});

package/esm/internals/plugins/corePlugins/useChartSeries/useChartSeries.types.d.ts

@@ -2,7 +2,7 @@ import { AllSeriesType } from "../../../../models/seriesType/index.js";
 import { ChartsColorPalette } from "../../../../colorPalettes/index.js";
 import { ChartPluginSignature, ChartSeriesConfig } from "../../models/index.js";
 import { ChartSeriesType, DatasetType } from "../../../../models/seriesType/config.js";
-import { SeriesProcessorResult } from "../../models/seriesConfig/seriesProcessor.types.js";
+import { SeriesProcessorParams, SeriesProcessorResult } from "../../models/seriesConfig/seriesProcessor.types.js";
 export interface UseChartSeriesParameters<T extends ChartSeriesType = ChartSeriesType> {
   /**
    * An array of objects that can be used to populate series and axes data using their `dataKey` property.
@@ -36,9 +36,10 @@ export type UseChartSeriesDefaultizedParameters<T extends ChartSeriesType = Char
   theme: 'light' | 'dark';
 };
 export type ProcessedSeries<TSeriesTypes extends ChartSeriesType = ChartSeriesType> = { [type in TSeriesTypes]?: SeriesProcessorResult<type> };
+export type DefaultizedSeriesGroups<TSeriesTypes extends ChartSeriesType = ChartSeriesType> = { [type in TSeriesTypes]?: SeriesProcessorParams<type> };
 export interface UseChartSeriesState<T extends ChartSeriesType = ChartSeriesType> {
   series: {
-    processedSeries: ProcessedSeries<T>;
+    defaultizedSeries: DefaultizedSeriesGroups<T>;
     seriesConfig: ChartSeriesConfig<T>;
     dataset?: Readonly<DatasetType>;
   };

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

@@ -1,4 +1,4 @@
-import { type ChartOptionalRootSelector } from "../../utils/selectors.js";
+import type { ChartOptionalRootSelector } from "../../utils/selectors.js";
 import type { UseChartBrushSignature } from "./useChartBrush.types.js";
 export declare const selectorBrush: ChartOptionalRootSelector<UseChartBrushSignature>;
 export declare const selectorBrushStart: (args_0: 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("./useChartBrush.types.js").UseChartBrushState> & {

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

@@ -1,14 +1,14 @@
-import { createSelector } from "../../utils/selectors.js";
+import { createSelector } from '@mui/x-internals/store';
 import { selectorChartZoomOptionsLookup } from "../useChartCartesianAxis/useChartCartesianAxisRendering.selectors.js";
 import { selectorChartSeriesProcessed } from "../../corePlugins/useChartSeries/index.js";
 export const selectorBrush = state => state.brush;
-export const selectorBrushStart = createSelector([selectorBrush], brush => brush?.start);
-export const selectorBrushCurrent = createSelector([selectorBrush], brush => brush?.current);
-export const selectorBrushStartX = createSelector([selectorBrush], brush => brush?.start?.x ?? null);
-export const selectorBrushStartY = createSelector([selectorBrush], brush => brush?.start?.y ?? null);
-export const selectorBrushCurrentX = createSelector([selectorBrush], brush => brush?.current?.x ?? null);
-export const selectorBrushCurrentY = createSelector([selectorBrush], brush => brush?.current?.y ?? null);
-export const selectorBrushState = createSelector([selectorBrushStartX, selectorBrushStartY, selectorBrushCurrentX, selectorBrushCurrentY], (startX, startY, currentX, currentY) => {
+export const selectorBrushStart = createSelector(selectorBrush, brush => brush?.start);
+export const selectorBrushCurrent = createSelector(selectorBrush, brush => brush?.current);
+export const selectorBrushStartX = createSelector(selectorBrush, brush => brush?.start?.x ?? null);
+export const selectorBrushStartY = createSelector(selectorBrush, brush => brush?.start?.y ?? null);
+export const selectorBrushCurrentX = createSelector(selectorBrush, brush => brush?.current?.x ?? null);
+export const selectorBrushCurrentY = createSelector(selectorBrush, brush => brush?.current?.y ?? null);
+export const selectorBrushState = createSelector(selectorBrushStartX, selectorBrushStartY, selectorBrushCurrentX, selectorBrushCurrentY, (startX, startY, currentX, currentY) => {
   if (startX === null || startY === null || currentX === null || currentY === null) {
     return null;
   }
@@ -23,7 +23,7 @@ export const selectorBrushState = createSelector([selectorBrushStartX, selectorB
     }
   };
 });
-export const selectorBrushConfigNoZoom = createSelector([selectorChartSeriesProcessed], series => {
+export const selectorBrushConfigNoZoom = createSelector(selectorChartSeriesProcessed, series => {
   let hasHorizontal = false;
   let isBothDirections = false;
   if (series) {
@@ -44,7 +44,7 @@ export const selectorBrushConfigNoZoom = createSelector([selectorChartSeriesProc
   }
   return 'x';
 });
-export const selectorBrushConfigZoom = createSelector([selectorChartZoomOptionsLookup], function selectorBrushConfigZoom(optionsLookup) {
+export const selectorBrushConfigZoom = createSelector(selectorChartZoomOptionsLookup, function selectorBrushConfigZoom(optionsLookup) {
   let hasX = false;
   let hasY = false;
   Object.values(optionsLookup).forEach(options => {
@@ -66,10 +66,10 @@ export const selectorBrushConfigZoom = createSelector([selectorChartZoomOptionsL
   }
   return null;
 });
-export const selectorBrushConfig = createSelector([selectorBrushConfigNoZoom, selectorBrushConfigZoom], (configNoZoom, configZoom) => configZoom ?? configNoZoom);
-export const selectorIsBrushEnabled = createSelector([selectorBrush], brush => brush?.enabled || brush?.isZoomBrushEnabled);
-export const selectorIsBrushSelectionActive = createSelector([selectorIsBrushEnabled, selectorBrush], (isBrushEnabled, brush) => {
+export const selectorBrushConfig = createSelector(selectorBrushConfigNoZoom, selectorBrushConfigZoom, (configNoZoom, configZoom) => configZoom ?? configNoZoom);
+export const selectorIsBrushEnabled = createSelector(selectorBrush, brush => brush?.enabled || brush?.isZoomBrushEnabled);
+export const selectorIsBrushSelectionActive = createSelector(selectorIsBrushEnabled, selectorBrush, (isBrushEnabled, brush) => {
   return isBrushEnabled && brush?.start !== null && brush?.current !== null;
 });
-export const selectorBrushShouldPreventAxisHighlight = createSelector([selectorBrush, selectorIsBrushSelectionActive], (brush, isBrushSelectionActive) => isBrushSelectionActive && brush?.preventHighlight);
-export const selectorBrushShouldPreventTooltip = createSelector([selectorBrush, selectorIsBrushSelectionActive], (brush, isBrushSelectionActive) => isBrushSelectionActive && brush?.preventTooltip);
+export const selectorBrushShouldPreventAxisHighlight = createSelector(selectorBrush, selectorIsBrushSelectionActive, (brush, isBrushSelectionActive) => isBrushSelectionActive && brush?.preventHighlight);
+export const selectorBrushShouldPreventTooltip = createSelector(selectorBrush, selectorIsBrushSelectionActive, (brush, isBrushSelectionActive) => isBrushSelectionActive && brush?.preventTooltip);

package/esm/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.types.d.ts

@@ -72,7 +72,7 @@ export interface DefaultizedZoomOptions extends Required<Omit<ZoomOptions, 'slid
 }
 export interface UseChartCartesianAxisState {
   /**
-   * @ignore - state populated by the useChartProZoomPlugin
+   * @ignore - state populated by the useChartProZoom plugin
    */
   zoom?: {
     isInteracting: boolean;

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

@@ -1,4 +1,4 @@
-import { createSelector } from "../../utils/selectors.js";
+import { createSelector } from '@mui/x-internals/store';
 import { selectorChartRawXAxis, selectorChartRawYAxis } from "./useChartCartesianAxisLayout.selectors.js";
 import { selectorChartSeriesConfig, selectorChartSeriesProcessed } from "../../corePlugins/useChartSeries/index.js";
 import { computeAxisValue } from "./computeAxisValue.js";
@@ -25,7 +25,7 @@ function createPreviewDrawingArea(axisDirection, mainChartDrawingArea) {
     bottom: mainChartDrawingArea.height
   };
 }
-export const selectorChartPreviewXScales = createSelector([selectorChartRawXAxis, selectorChartDrawingArea, selectorChartZoomOptionsLookup, selectorChartNormalizedXScales], function selectorChartPreviewXScales(xAxes, chartDrawingArea, zoomOptions, normalizedXScales, axisId) {
+export const selectorChartPreviewXScales = createSelector(selectorChartRawXAxis, selectorChartDrawingArea, selectorChartZoomOptionsLookup, selectorChartNormalizedXScales, function selectorChartPreviewXScales(xAxes, chartDrawingArea, zoomOptions, normalizedXScales, axisId) {
   const hasAxis = xAxes?.some(axis => axis.id === axisId);
   const drawingArea = createPreviewDrawingArea(hasAxis ? 'x' : 'y', chartDrawingArea);
   const options = zoomOptions[axisId];
@@ -40,7 +40,7 @@ export const selectorChartPreviewXScales = createSelector([selectorChartRawXAxis
   });
   return scales;
 });
-export const selectorChartPreviewComputedXAxis = createSelector([selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomOptionsLookup, selectorChartDrawingArea, selectorChartPreviewXScales, selectorChartXAxisWithDomains], (formattedSeries, seriesConfig, zoomOptions, chartDrawingArea, scales, {
+export const selectorChartPreviewComputedXAxis = createSelector(selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomOptionsLookup, selectorChartDrawingArea, selectorChartPreviewXScales, selectorChartXAxisWithDomains, (formattedSeries, seriesConfig, zoomOptions, chartDrawingArea, scales, {
   axes,
   domains
 }, axisId) => {
@@ -69,7 +69,7 @@ export const selectorChartPreviewComputedXAxis = createSelector([selectorChartSe
   }
   return computedAxes.axis;
 });
-export const selectorChartPreviewYScales = createSelector([selectorChartRawYAxis, selectorChartDrawingArea, selectorChartZoomOptionsLookup, selectorChartNormalizedYScales], function selectorChartPreviewYScales(yAxes, chartDrawingArea, zoomOptions, normalizedYScales, axisId) {
+export const selectorChartPreviewYScales = createSelector(selectorChartRawYAxis, selectorChartDrawingArea, selectorChartZoomOptionsLookup, selectorChartNormalizedYScales, function selectorChartPreviewYScales(yAxes, chartDrawingArea, zoomOptions, normalizedYScales, axisId) {
   const hasAxis = yAxes?.some(axis => axis.id === axisId);
   const drawingArea = createPreviewDrawingArea(hasAxis ? 'y' : 'x', chartDrawingArea);
   const options = zoomOptions[axisId];
@@ -87,7 +87,7 @@ export const selectorChartPreviewYScales = createSelector([selectorChartRawYAxis
   });
   return scales;
 });
-export const selectorChartPreviewComputedYAxis = createSelector([selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomOptionsLookup, selectorChartDrawingArea, selectorChartPreviewYScales, selectorChartYAxisWithDomains], (formattedSeries, seriesConfig, zoomOptions, chartDrawingArea, scales, {
+export const selectorChartPreviewComputedYAxis = createSelector(selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorChartZoomOptionsLookup, selectorChartDrawingArea, selectorChartPreviewYScales, selectorChartYAxisWithDomains, (formattedSeries, seriesConfig, zoomOptions, chartDrawingArea, scales, {
   axes,
   domains
 }, axisId) => {

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

@@ -4,6 +4,9 @@ import { AxisId, D3Scale } from "../../../../models/axis.js";
 import { SeriesId } from "../../../../models/seriesType/common.js";
 import { Flatbush } from "../../../Flatbush.js";
 export declare const createZoomMap: (zoom: readonly ZoomData[]) => Map<AxisId, ZoomData>;
+export declare const selectorChartHasZoom: (args_0: 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;
+}) => boolean;
 /**
  * Following selectors are not exported because they exist in the MIT chart only to ba able to reuse the Zoom state from the pro.
  */

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

@@ -1,8 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-import { createSelectorMemoized } from '@mui/x-internals/store';
+import { createSelector, createSelectorMemoized } from '@mui/x-internals/store';
 import { selectorChartDrawingArea } from "../../corePlugins/useChartDimensions/index.js";
 import { selectorChartSeriesConfig, selectorChartSeriesProcessed } from "../../corePlugins/useChartSeries/index.js";
-import { createSelector } from "../../utils/selectors.js";
 import { computeAxisValue } from "./computeAxisValue.js";
 import { createContinuousScaleGetAxisFilter, createDiscreteScaleGetAxisFilter, createGetAxisFilters } from "./createAxisFilterMapper.js";
 import { createZoomLookup } from "./createZoomLookup.js";
@@ -24,24 +23,25 @@ export const createZoomMap = zoom => {
   return zoomItemMap;
 };
 const selectorChartZoomState = state => state.zoom;
+export const selectorChartHasZoom = createSelector(selectorChartRawXAxis, selectorChartRawYAxis, (xAxes, yAxes) => xAxes?.some(axis => Boolean(axis.zoom)) || yAxes?.some(axis => Boolean(axis.zoom)) || false);
 
 /**
  * Following selectors are not exported because they exist in the MIT chart only to ba able to reuse the Zoom state from the pro.
  */
 
-export const selectorChartZoomIsInteracting = createSelector([selectorChartZoomState], zoom => zoom?.isInteracting);
+export const selectorChartZoomIsInteracting = createSelector(selectorChartZoomState, zoom => zoom?.isInteracting);
 export const selectorChartZoomMap = createSelectorMemoized(selectorChartZoomState, function selectorChartZoomMap(zoom) {
   return zoom?.zoomData && createZoomMap(zoom?.zoomData);
 });
-export const selectorChartAxisZoomData = createSelector([selectorChartZoomMap], (zoomMap, axisId) => zoomMap?.get(axisId));
+export const selectorChartAxisZoomData = createSelector(selectorChartZoomMap, (zoomMap, axisId) => zoomMap?.get(axisId));
 export const selectorChartZoomOptionsLookup = createSelectorMemoized(selectorChartRawXAxis, selectorChartRawYAxis, function selectorChartZoomOptionsLookup(xAxis, yAxis) {
   return _extends({}, createZoomLookup('x')(xAxis), createZoomLookup('y')(yAxis));
 });
-export const selectorChartAxisZoomOptionsLookup = createSelector([selectorChartZoomOptionsLookup], (axisLookup, axisId) => axisLookup[axisId]);
-export const selectorDefaultXAxisTickNumber = createSelector([selectorChartDrawingArea], function selectorDefaultXAxisTickNumber(drawingArea) {
+export const selectorChartAxisZoomOptionsLookup = createSelector(selectorChartZoomOptionsLookup, (axisLookup, axisId) => axisLookup[axisId]);
+export const selectorDefaultXAxisTickNumber = createSelector(selectorChartDrawingArea, function selectorDefaultXAxisTickNumber(drawingArea) {
   return getDefaultTickNumber(drawingArea.width);
 });
-export const selectorDefaultYAxisTickNumber = createSelector([selectorChartDrawingArea], function selectorDefaultYAxisTickNumber(drawingArea) {
+export const selectorDefaultYAxisTickNumber = createSelector(selectorChartDrawingArea, function selectorDefaultYAxisTickNumber(drawingArea) {
   return getDefaultTickNumber(drawingArea.height);
 });
 export const selectorChartXAxisWithDomains = createSelectorMemoized(selectorChartRawXAxis, selectorChartSeriesProcessed, selectorChartSeriesConfig, selectorPreferStrictDomainInLineCharts, selectorDefaultXAxisTickNumber, function selectorChartXAxisWithDomains(axes, formattedSeries, seriesConfig, preferStrictDomainInLineCharts, defaultTickNumber) {
@@ -255,16 +255,16 @@ export const selectorChartYAxis = createSelectorMemoized(selectorChartDrawingAre
     domains
   });
 });
-export const selectorChartAxis = createSelector([selectorChartXAxis, selectorChartYAxis], (xAxes, yAxes, axisId) => xAxes?.axis[axisId] ?? yAxes?.axis[axisId]);
-export const selectorChartRawAxis = createSelector([selectorChartRawXAxis, selectorChartRawYAxis], (xAxes, yAxes, axisId) => {
+export const selectorChartAxis = createSelector(selectorChartXAxis, selectorChartYAxis, (xAxes, yAxes, axisId) => xAxes?.axis[axisId] ?? yAxes?.axis[axisId]);
+export const selectorChartRawAxis = createSelector(selectorChartRawXAxis, selectorChartRawYAxis, (xAxes, yAxes, axisId) => {
   const axis = xAxes?.find(a => a.id === axisId) ?? yAxes?.find(a => a.id === axisId) ?? null;
   if (!axis) {
     return undefined;
   }
   return axis;
 });
-export const selectorChartDefaultXAxisId = createSelector([selectorChartRawXAxis], xAxes => xAxes[0].id);
-export const selectorChartDefaultYAxisId = createSelector([selectorChartRawYAxis], yAxes => yAxes[0].id);
+export const selectorChartDefaultXAxisId = createSelector(selectorChartRawXAxis, xAxes => xAxes[0].id);
+export const selectorChartDefaultYAxisId = createSelector(selectorChartRawYAxis, yAxes => yAxes[0].id);
 const EMPTY_MAP = new Map();
 export const selectorChartSeriesEmptyFlatbushMap = () => EMPTY_MAP;
 export const selectorChartSeriesFlatbushMap = createSelectorMemoized(selectorChartSeriesProcessed, selectorChartNormalizedXScales, selectorChartNormalizedYScales, selectorChartDefaultXAxisId, selectorChartDefaultYAxisId, function selectChartSeriesFlatbushMap(allSeries, xAxesScaleMap, yAxesScaleMap, defaultXAxisId, defaultYAxisId) {

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

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-import { createSelectorMemoized } from '@mui/x-internals/store';
-import { createSelector } from "../../utils/selectors.js";
+import { createSelector, createSelectorMemoized } from '@mui/x-internals/store';
 import { selectorChartXAxis, selectorChartYAxis } from "./useChartCartesianAxisRendering.selectors.js";
 import { selectorChartsInteractionXAxisIndex, selectorChartsInteractionXAxisValue, selectorChartsInteractionYAxisIndex, selectorChartsInteractionYAxisValue } from "./useChartCartesianInteraction.selectors.js";
 import { selectorChartsKeyboardXAxisIndex, selectorChartsKeyboardYAxisIndex } from "../useChartKeyboardNavigation/useChartKeyboardNavigation.selectors.js";
@@ -59,8 +58,8 @@ const selectAxisHighlightWithValue = (computedIndex, computedValue, axis, contro
   }
   return [];
 };
-export const selectorChartsHighlightXAxisValue = createSelector([selectorChartsInteractionXAxisIndex, selectorChartsInteractionXAxisValue, selectorChartXAxis, selectorChartControlledCartesianAxisHighlight, selectorChartsKeyboardXAxisIndex, selectorChartsLastInteraction, selectorBrushShouldPreventAxisHighlight], selectAxisHighlightWithValue);
-export const selectorChartsHighlightYAxisValue = createSelector([selectorChartsInteractionYAxisIndex, selectorChartsInteractionYAxisValue, selectorChartYAxis, selectorChartControlledCartesianAxisHighlight, selectorChartsKeyboardYAxisIndex, selectorChartsLastInteraction, selectorBrushShouldPreventAxisHighlight], selectAxisHighlightWithValue);
+export const selectorChartsHighlightXAxisValue = createSelector(selectorChartsInteractionXAxisIndex, selectorChartsInteractionXAxisValue, selectorChartXAxis, selectorChartControlledCartesianAxisHighlight, selectorChartsKeyboardXAxisIndex, selectorChartsLastInteraction, selectorBrushShouldPreventAxisHighlight, selectAxisHighlightWithValue);
+export const selectorChartsHighlightYAxisValue = createSelector(selectorChartsInteractionYAxisIndex, selectorChartsInteractionYAxisValue, selectorChartYAxis, selectorChartControlledCartesianAxisHighlight, selectorChartsKeyboardYAxisIndex, selectorChartsLastInteraction, selectorBrushShouldPreventAxisHighlight, selectAxisHighlightWithValue);
 
 /**
  * Get the scale of the axis with highlight if controlled. The default axis otherwise.
@@ -75,5 +74,5 @@ const selectAxis = (axisItems, axis) => {
   const filteredAxes = axisItems.map(item => axis.axis[item.axisId] ?? null).filter(item => item !== null);
   return filteredAxes;
 };
-export const selectorChartsHighlightXAxis = createSelector([selectorChartControlledCartesianAxisHighlight, selectorChartXAxis], selectAxis);
-export const selectorChartsHighlightYAxis = createSelector([selectorChartControlledCartesianAxisHighlight, selectorChartYAxis], selectAxis);
+export const selectorChartsHighlightXAxis = createSelector(selectorChartControlledCartesianAxisHighlight, selectorChartXAxis, selectAxis);
+export const selectorChartsHighlightYAxis = createSelector(selectorChartControlledCartesianAxisHighlight, selectorChartYAxis, selectAxis);

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

@@ -1,6 +1,5 @@
 import { isDeepEqual } from '@mui/x-internals/isDeepEqual';
-import { createSelectorMemoizedWithOptions } from '@mui/x-internals/store';
-import { createSelector } from "../../utils/selectors.js";
+import { createSelector, createSelectorMemoizedWithOptions } from '@mui/x-internals/store';
 import { selectorChartsInteractionPointerX, selectorChartsInteractionPointerY } from "../useChartInteraction/useChartInteraction.selectors.js";
 import { getAxisIndex, getAxisValue } from "./getAxisValue.js";
 import { selectorChartXAxis, selectorChartYAxis } from "./useChartCartesianAxisRendering.selectors.js";
@@ -19,9 +18,9 @@ export const selectChartsInteractionAxisIndex = (value, axes, id) => {
   const index = indexGetter(value, axes, id);
   return index === -1 ? null : index;
 };
-export const selectorChartsInteractionXAxisIndex = createSelector([selectorChartsInteractionPointerX, selectorChartXAxis], selectChartsInteractionAxisIndex);
-export const selectorChartsInteractionYAxisIndex = createSelector([selectorChartsInteractionPointerY, selectorChartYAxis], selectChartsInteractionAxisIndex);
-export const selectorChartAxisInteraction = createSelector([selectorChartsInteractionPointerX, selectorChartsInteractionPointerY, selectorChartXAxis, selectorChartYAxis], (x, y, xAxis, yAxis) => [...(x === null ? [] : xAxis.axisIds.map(axisId => ({
+export const selectorChartsInteractionXAxisIndex = createSelector(selectorChartsInteractionPointerX, selectorChartXAxis, selectChartsInteractionAxisIndex);
+export const selectorChartsInteractionYAxisIndex = createSelector(selectorChartsInteractionPointerY, selectorChartYAxis, selectChartsInteractionAxisIndex);
+export const selectorChartAxisInteraction = createSelector(selectorChartsInteractionPointerX, selectorChartsInteractionPointerY, selectorChartXAxis, selectorChartYAxis, (x, y, xAxis, yAxis) => [...(x === null ? [] : xAxis.axisIds.map(axisId => ({
   axisId,
   dataIndex: indexGetter(x, xAxis, axisId)
 }))), ...(y === null ? [] : yAxis.axisIds.map(axisId => ({
@@ -39,13 +38,13 @@ function valueGetter(value, axes, indexes, ids = axes.axisIds[0]) {
     return getAxisValue(axis.scale, axis.data, value, indexes[axisIndex]);
   }) : getAxisValue(axes.axis[ids].scale, axes.axis[ids].data, value, indexes);
 }
-export const selectorChartsInteractionXAxisValue = createSelector([selectorChartsInteractionPointerX, selectorChartXAxis, selectorChartsInteractionXAxisIndex], (x, xAxes, xIndex, id) => {
+export const selectorChartsInteractionXAxisValue = createSelector(selectorChartsInteractionPointerX, selectorChartXAxis, selectorChartsInteractionXAxisIndex, (x, xAxes, xIndex, id) => {
   if (x === null || xAxes.axisIds.length === 0) {
     return null;
   }
   return valueGetter(x, xAxes, xIndex, id);
 });
-export const selectorChartsInteractionYAxisValue = createSelector([selectorChartsInteractionPointerY, selectorChartYAxis, selectorChartsInteractionYAxisIndex], (y, yAxes, yIndex, id) => {
+export const selectorChartsInteractionYAxisValue = createSelector(selectorChartsInteractionPointerY, selectorChartYAxis, selectorChartsInteractionYAxisIndex, (y, yAxes, yIndex, id) => {
   if (y === null || yAxes.axisIds.length === 0) {
     return null;
   }
@@ -100,4 +99,4 @@ export const selectorChartsInteractionTooltipYAxes = createSelectorMemoizedWithO
 /**
  * Return `true` if the axis tooltip has something to display.
  */
-export const selectorChartsInteractionAxisTooltip = createSelector([selectorChartsInteractionTooltipXAxes, selectorChartsInteractionTooltipYAxes], (xTooltip, yTooltip) => xTooltip.length > 0 || yTooltip.length > 0);
+export const selectorChartsInteractionAxisTooltip = createSelector(selectorChartsInteractionTooltipXAxes, selectorChartsInteractionTooltipYAxes, (xTooltip, yTooltip) => xTooltip.length > 0 || yTooltip.length > 0);

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

@@ -20,8 +20,8 @@ export function findClosestPoints(flatbush, drawingArea, seriesData, xScale, ySc
   function sqDistFn(dx, dy) {
     return fxSq * dx * dx + fySq * dy * dy;
   }
-  const pointX = originalXScale(invertScale(xScale, svgPointX, dataIndex => seriesData[dataIndex].x));
-  const pointY = originalYScale(invertScale(yScale, svgPointY, dataIndex => seriesData[dataIndex].y));
+  const pointX = originalXScale(invertScale(xScale, svgPointX, dataIndex => seriesData[dataIndex]?.x));
+  const pointY = originalYScale(invertScale(yScale, svgPointY, dataIndex => seriesData[dataIndex]?.y));
   return flatbush.neighbors(pointX, pointY, maxResults, maxRadius != null ? maxRadius * maxRadius : Infinity, excludeIfOutsideDrawingArea, sqDistFn);
 }
 function invertScale(scale, value, getDataPoint) {

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

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

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

@@ -1,4 +1,5 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
+import { warnOnce } from '@mui/x-internals/warning';
 import { useAssertModelConsistency } from '@mui/x-internals/useAssertModelConsistency';
 import useEventCallback from '@mui/utils/useEventCallback';
 import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
@@ -20,27 +21,34 @@ export const useChartHighlight = ({
         item: params.highlightedItem
       }));
     }
+    if (process.env.NODE_ENV !== 'production') {
+      if (params.highlightedItem !== undefined && !store.state.highlight.isControlled) {
+        warnOnce(['MUI X Charts: The `highlightedItem` switched between controlled and uncontrolled state.', 'To remove the highlight when using controlled state, you must provide `null` to the `highlightedItem` prop instead of `undefined`.'].join('\n'));
+      }
+    }
   }, [store, params.highlightedItem]);
   const clearHighlight = useEventCallback(() => {
     params.onHighlightChange?.(null);
-    const prevItem = store.getSnapshot().highlight.item;
-    if (prevItem === null) {
+    const prevHighlight = store.getSnapshot().highlight;
+    if (prevHighlight.item === null || prevHighlight.isControlled) {
       return;
     }
     store.set('highlight', {
       item: null,
-      lastUpdate: 'pointer'
+      lastUpdate: 'pointer',
+      isControlled: false
     });
   });
   const setHighlight = useEventCallback(newItem => {
-    const prevItem = store.getSnapshot().highlight.item;
-    if (fastObjectShallowCompare(prevItem, newItem)) {
+    const prevHighlight = store.getSnapshot().highlight;
+    if (prevHighlight.isControlled || fastObjectShallowCompare(prevHighlight.item, newItem)) {
       return;
     }
     params.onHighlightChange?.(newItem);
     store.set('highlight', {
       item: newItem,
-      lastUpdate: 'pointer'
+      lastUpdate: 'pointer',
+      isControlled: false
     });
   });
   return {
@@ -50,15 +58,11 @@ export const useChartHighlight = ({
     }
   };
 };
-useChartHighlight.getDefaultizedParams = ({
-  params
-}) => _extends({}, params, {
-  highlightedItem: params.highlightedItem ?? null
-});
 useChartHighlight.getInitialState = params => ({
   highlight: {
     item: params.highlightedItem,
-    lastUpdate: 'pointer'
+    lastUpdate: 'pointer',
+    isControlled: params.highlightedItem !== undefined
   }
 });
 useChartHighlight.params = {

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

@@ -1,15 +1,14 @@
-import { createSelectorMemoized } from '@mui/x-internals/store';
-import { createSelector } from "../../utils/selectors.js";
+import { createSelector, createSelectorMemoized } from '@mui/x-internals/store';
 import { createIsHighlighted } from "./createIsHighlighted.js";
 import { createIsFaded } from "./createIsFaded.js";
 import { getSeriesHighlightedItem, getSeriesUnfadedItem, isSeriesFaded, isSeriesHighlighted } from "./highlightStates.js";
 import { selectorChartsKeyboardItem } from "../useChartKeyboardNavigation/index.js";
+import { selectorChartSeriesProcessed } from "../../corePlugins/useChartSeries/useChartSeries.selectors.js";
 const selectHighlight = state => state.highlight;
-const selectSeries = state => state.series;
-export const selectorChartsHighlightScopePerSeriesId = createSelector([selectSeries], series => {
+export const selectorChartsHighlightScopePerSeriesId = createSelector(selectorChartSeriesProcessed, processedSeries => {
   const map = new Map();
-  Object.keys(series.processedSeries).forEach(seriesType => {
-    const seriesData = series.processedSeries[seriesType];
+  Object.keys(processedSeries).forEach(seriesType => {
+    const seriesData = processedSeries[seriesType];
     seriesData?.seriesOrder?.forEach(seriesId => {
       const seriesItem = seriesData?.series[seriesId];
       map.set(seriesId, seriesItem?.highlightScope);
@@ -18,9 +17,9 @@ export const selectorChartsHighlightScopePerSeriesId = createSelector([selectSer
   return map;
 });
 export const selectorChartsHighlightedItem = createSelectorMemoized(selectHighlight, selectorChartsKeyboardItem, function selectorChartsHighlightedItem(highlight, keyboardItem) {
-  return highlight.lastUpdate === 'pointer' ? highlight.item : keyboardItem;
+  return highlight.isControlled || highlight.lastUpdate === 'pointer' ? highlight.item : keyboardItem;
 });
-export const selectorChartsHighlightScope = createSelector([selectorChartsHighlightScopePerSeriesId, selectorChartsHighlightedItem], function selectorChartsHighlightScope(seriesIdToHighlightScope, highlightedItem) {
+export const selectorChartsHighlightScope = createSelector(selectorChartsHighlightScopePerSeriesId, selectorChartsHighlightedItem, function selectorChartsHighlightScope(seriesIdToHighlightScope, highlightedItem) {
   if (!highlightedItem) {
     return null;
   }
@@ -30,15 +29,15 @@ export const selectorChartsHighlightScope = createSelector([selectorChartsHighli
   }
   return highlightScope;
 });
-export const selectorChartsIsHighlightedCallback = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem], createIsHighlighted);
-export const selectorChartsIsFadedCallback = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem], createIsFaded);
-export const selectorChartsIsHighlighted = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem], function selectorChartsIsHighlighted(highlightScope, highlightedItem, item) {
+export const selectorChartsIsHighlightedCallback = createSelector(selectorChartsHighlightScope, selectorChartsHighlightedItem, createIsHighlighted);
+export const selectorChartsIsFadedCallback = createSelector(selectorChartsHighlightScope, selectorChartsHighlightedItem, createIsFaded);
+export const selectorChartsIsHighlighted = createSelector(selectorChartsHighlightScope, selectorChartsHighlightedItem, function selectorChartsIsHighlighted(highlightScope, highlightedItem, item) {
   return createIsHighlighted(highlightScope, highlightedItem)(item);
 });
-export const selectorChartIsSeriesHighlighted = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem], isSeriesHighlighted);
-export const selectorChartIsSeriesFaded = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem], isSeriesFaded);
-export const selectorChartSeriesUnfadedItem = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem], getSeriesUnfadedItem);
-export const selectorChartSeriesHighlightedItem = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem], getSeriesHighlightedItem);
-export const selectorChartsIsFaded = createSelector([selectorChartsHighlightScope, selectorChartsHighlightedItem], function selectorChartsIsFaded(highlightScope, highlightedItem, item) {
+export const selectorChartIsSeriesHighlighted = createSelector(selectorChartsHighlightScope, selectorChartsHighlightedItem, isSeriesHighlighted);
+export const selectorChartIsSeriesFaded = createSelector(selectorChartsHighlightScope, selectorChartsHighlightedItem, isSeriesFaded);
+export const selectorChartSeriesUnfadedItem = createSelector(selectorChartsHighlightScope, selectorChartsHighlightedItem, getSeriesUnfadedItem);
+export const selectorChartSeriesHighlightedItem = createSelector(selectorChartsHighlightScope, selectorChartsHighlightedItem, getSeriesHighlightedItem);
+export const selectorChartsIsFaded = createSelector(selectorChartsHighlightScope, selectorChartsHighlightedItem, function selectorChartsIsFaded(highlightScope, highlightedItem, item) {
   return createIsFaded(highlightScope, highlightedItem)(item);
 });

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

@@ -56,6 +56,10 @@ export interface UseChartHighlightParameters {
 export type UseChartHighlightDefaultizedParameters = DefaultizedProps<UseChartHighlightParameters, 'highlightedItem'>;
 export interface UseChartHighlightState {
   highlight: {
+    /**
+     * Indicates if the highlighted item is controlled.
+     */
+    isControlled: boolean;
     /**
      * The item currently highlighted.
      */

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

@@ -1,9 +1,9 @@
-import { createSelector } from "../../utils/selectors.js";
+import { createSelector } from '@mui/x-internals/store';
 const selectInteraction = state => state.interaction;
-export const selectorChartsInteractionIsInitialized = createSelector([selectInteraction], interaction => interaction !== undefined);
-export const selectorChartsInteractionItem = createSelector([selectInteraction], interaction => interaction?.item ?? null);
-export const selectorChartsInteractionPointer = createSelector([selectInteraction], interaction => interaction?.pointer ?? null);
-export const selectorChartsInteractionPointerX = createSelector([selectorChartsInteractionPointer], pointer => pointer && pointer.x);
-export const selectorChartsInteractionPointerY = createSelector([selectorChartsInteractionPointer], pointer => pointer && pointer.y);
-export const selectorChartsInteractionItemIsDefined = createSelector([selectorChartsInteractionItem], item => item !== null);
-export const selectorChartsLastInteraction = createSelector([selectInteraction], interaction => interaction?.lastUpdate);
+export const selectorChartsInteractionIsInitialized = createSelector(selectInteraction, interaction => interaction !== undefined);
+export const selectorChartsInteractionItem = createSelector(selectInteraction, interaction => interaction?.item ?? null);
+export const selectorChartsInteractionPointer = createSelector(selectInteraction, interaction => interaction?.pointer ?? null);
+export const selectorChartsInteractionPointerX = createSelector(selectorChartsInteractionPointer, pointer => pointer && pointer.x);
+export const selectorChartsInteractionPointerY = createSelector(selectorChartsInteractionPointer, pointer => pointer && pointer.y);
+export const selectorChartsInteractionItemIsDefined = createSelector(selectorChartsInteractionItem, item => item !== null);
+export const selectorChartsLastInteraction = createSelector(selectInteraction, interaction => interaction?.lastUpdate);

package/esm/internals/plugins/featurePlugins/useChartInteraction/useChartTooltip.selectors.d.ts

@@ -6,7 +6,7 @@ export declare const selectorChartsTooltipItemIsDefined: (args_0: import("../../
 }) => boolean;
 export declare const selectorChartsTooltipItemPosition: (args_0: 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("./useChartInteraction.types.js").UseChartInteractionState> & {
   cacheKey: import("../../models/index.js").ChartStateCacheKey;
-}) => {
+}, placement?: "bottom" | "left" | "right" | "top" | undefined) => {
   x: number;
   y: number;
 } | null;

package/esm/internals/plugins/featurePlugins/useChartInteraction/useChartTooltip.selectors.js

@@ -1,13 +1,13 @@
+import { createSelector } from '@mui/x-internals/store';
 import { selectorChartSeriesConfig, selectorChartSeriesProcessed } from "../../corePlugins/useChartSeries/index.js";
-import { createSelector } from "../../utils/selectors.js";
 import { selectorChartXAxis, selectorChartYAxis } from "../useChartCartesianAxis/useChartCartesianAxisRendering.selectors.js";
 import { selectorChartsKeyboardItem, selectorChartsKeyboardItemIsDefined } from "../useChartKeyboardNavigation/index.js";
 import { selectorChartsInteractionItem, selectorChartsInteractionItemIsDefined, selectorChartsLastInteraction } from "./useChartInteraction.selectors.js";
 import { selectorChartDrawingArea } from "../../corePlugins/useChartDimensions/useChartDimensions.selectors.js";
 import { isCartesianSeries } from "../../../isCartesian.js";
-export const selectorChartsTooltipItem = createSelector([selectorChartsLastInteraction, selectorChartsInteractionItem, selectorChartsKeyboardItem], (lastInteraction, interactionItem, keyboardItem) => lastInteraction === 'keyboard' ? keyboardItem : interactionItem ?? null);
-export const selectorChartsTooltipItemIsDefined = createSelector([selectorChartsLastInteraction, selectorChartsInteractionItemIsDefined, selectorChartsKeyboardItemIsDefined], (lastInteraction, interactionItemIsDefined, keyboardItemIsDefined) => lastInteraction === 'keyboard' ? keyboardItemIsDefined : interactionItemIsDefined);
-export const selectorChartsTooltipItemPosition = createSelector([selectorChartsTooltipItem, selectorChartDrawingArea, selectorChartSeriesConfig, selectorChartXAxis, selectorChartYAxis, selectorChartSeriesProcessed, (_, placement) => placement], function selectorChartsTooltipItemPosition(identifier, drawingArea, seriesConfig, {
+export const selectorChartsTooltipItem = createSelector(selectorChartsLastInteraction, selectorChartsInteractionItem, selectorChartsKeyboardItem, (lastInteraction, interactionItem, keyboardItem) => lastInteraction === 'keyboard' ? keyboardItem : interactionItem ?? null);
+export const selectorChartsTooltipItemIsDefined = createSelector(selectorChartsLastInteraction, selectorChartsInteractionItemIsDefined, selectorChartsKeyboardItemIsDefined, (lastInteraction, interactionItemIsDefined, keyboardItemIsDefined) => lastInteraction === 'keyboard' ? keyboardItemIsDefined : interactionItemIsDefined);
+export const selectorChartsTooltipItemPosition = createSelector(selectorChartsTooltipItem, selectorChartDrawingArea, selectorChartSeriesConfig, selectorChartXAxis, selectorChartYAxis, selectorChartSeriesProcessed, function selectorChartsTooltipItemPosition(identifier, drawingArea, seriesConfig, {
   axis: xAxis,
   axisIds: xAxisIds
 }, {