@mui/x-charts 8.22.1 → 8.24.0

package/esm/internals/stacking/offset/offsetDiverging.js

@@ -0,0 +1,47 @@
+// Adapted from D3.js's offsetDiverging function https://github.com/d3/d3-shape/blob/main/src/offset/diverging.js
+// Hidden series (with all zero values) affect the stacking in a different way in our implementation compared to the D3 behavior.
+// The D3 stacking keep those values at the 0 "line", which creates issues when animating between hidden and visible states.
+// In our modification, we stack them on top/below already stacked items according to the sign of their original value.
+// A hidden negative value will be placed below all the already stacked negative values
+
+/**
+ * Positive values are stacked above zero, while negative values are stacked below zero.
+ *
+ * @param series A series generated by a stack generator.
+ * @param order An array of numeric indexes representing the stack order.
+ */
+export function offsetDiverging(series, order) {
+  if (series.length === 0) {
+    return;
+  }
+  const seriesCount = series.length;
+  const numericOrder = order;
+  const pointCount = series[numericOrder[0]].length;
+  for (let pointIndex = 0; pointIndex < pointCount; pointIndex += 1) {
+    let positiveSum = 0;
+    let negativeSum = 0;
+    for (let seriesIndex = 0; seriesIndex < seriesCount; seriesIndex += 1) {
+      const currentSeries = series[numericOrder[seriesIndex]];
+      const dataPoint = currentSeries[pointIndex];
+      const difference = dataPoint[1] - dataPoint[0];
+      if (difference > 0) {
+        dataPoint[0] = positiveSum;
+        positiveSum += difference;
+        dataPoint[1] = positiveSum;
+      } else if (difference < 0) {
+        dataPoint[1] = negativeSum;
+        negativeSum += difference;
+        dataPoint[0] = negativeSum;
+      } else if (dataPoint.data[currentSeries.key] > 0) {
+        dataPoint[0] = positiveSum;
+        dataPoint[1] = positiveSum;
+      } else if (dataPoint.data[currentSeries.key] < 0) {
+        dataPoint[1] = negativeSum;
+        dataPoint[0] = negativeSum;
+      } else {
+        dataPoint[0] = 0;
+        dataPoint[1] = 0;
+      }
+    }
+  }
+}

package/esm/internals/{stackSeries.d.ts → stacking/stackSeries.d.ts}

@@ -1,6 +1,6 @@
-import { stackOrderAppearance as d3StackOrderAppearance, stackOrderAscending as d3StackOrderAscending, stackOrderDescending as d3StackOrderDescending, stackOrderInsideOut as d3StackOrderInsideOut, stackOrderNone as d3StackOrderNone, stackOrderReverse as d3StackOrderReverse, stackOffsetExpand as d3StackOffsetExpand, stackOffsetDiverging as d3StackOffsetDiverging, stackOffsetNone as d3StackOffsetNone, stackOffsetSilhouette as d3StackOffsetSilhouette, stackOffsetWiggle as d3StackOffsetWiggle, type Series } from '@mui/x-charts-vendor/d3-shape';
-import type { StackOffsetType, StackOrderType } from "../models/stacking.js";
-import { type SeriesId, type StackableSeriesType } from "../models/seriesType/common.js";
+import { stackOrderNone as d3StackOrderNone, stackOrderReverse as d3StackOrderReverse, stackOrderAppearance as d3OrderAppearance, stackOrderAscending as d3OrderAscending, stackOrderDescending as d3OrderDescending, stackOrderInsideOut as d3OrderInsideOut, stackOffsetExpand as d3StackOffsetExpand, stackOffsetNone as d3StackOffsetNone, stackOffsetSilhouette as d3StackOffsetSilhouette, stackOffsetWiggle as d3StackOffsetWiggle, type Series } from '@mui/x-charts-vendor/d3-shape';
+import type { StackOffsetType, StackOrderType } from "../../models/stacking.js";
+import { type SeriesId, type StackableSeriesType } from "../../models/seriesType/common.js";
 type FormatterParams<T> = {
   series: Record<SeriesId, T>;
   seriesOrder: SeriesId[];
@@ -18,19 +18,19 @@ export declare const StackOrder: {
   /**
    * Series order such that the earliest series (according to the maximum value) is at the bottom.
    * */
-  appearance: typeof d3StackOrderAppearance;
+  appearance: typeof d3OrderAppearance;
   /**
    *  Series order such that the smallest series (according to the sum of values) is at the bottom.
    * */
-  ascending: typeof d3StackOrderAscending;
+  ascending: typeof d3OrderAscending;
   /**
    * Series order such that the largest series (according to the sum of values) is at the bottom.
    */
-  descending: typeof d3StackOrderDescending;
+  descending: typeof d3OrderDescending;
   /**
    * Series order such that the earliest series (according to the maximum value) are on the inside and the later series are on the outside. This order is recommended for streamgraphs in conjunction with the wiggle offset. See Stacked Graphs—Geometry & Aesthetics by Byron & Wattenberg for more information.
    */
-  insideOut: typeof d3StackOrderInsideOut;
+  insideOut: typeof d3OrderInsideOut;
   /**
    * Given series order [0, 1, … n - 1] where n is the number of elements in series. Thus, the stack order is given by the key accessor.
    */
@@ -48,7 +48,7 @@ export declare const StackOffset: {
   /**
    * Positive values are stacked above zero, negative values are stacked below zero, and zero values are stacked at zero.
    * */
-  diverging: typeof d3StackOffsetDiverging;
+  diverging: (series: Series<any, any>, order: Iterable<number>) => void;
   /**
    * Applies a zero baseline.
    * */

package/esm/internals/{stackSeries.js → stacking/stackSeries.js}

@@ -1,21 +1,22 @@
-import { stackOrderAppearance as d3StackOrderAppearance, stackOrderAscending as d3StackOrderAscending, stackOrderDescending as d3StackOrderDescending, stackOrderInsideOut as d3StackOrderInsideOut, stackOrderNone as d3StackOrderNone, stackOrderReverse as d3StackOrderReverse, stackOffsetExpand as d3StackOffsetExpand, stackOffsetDiverging as d3StackOffsetDiverging, stackOffsetNone as d3StackOffsetNone, stackOffsetSilhouette as d3StackOffsetSilhouette, stackOffsetWiggle as d3StackOffsetWiggle } from '@mui/x-charts-vendor/d3-shape';
+import { stackOrderNone as d3StackOrderNone, stackOrderReverse as d3StackOrderReverse, stackOrderAppearance as d3OrderAppearance, stackOrderAscending as d3OrderAscending, stackOrderDescending as d3OrderDescending, stackOrderInsideOut as d3OrderInsideOut, stackOffsetExpand as d3StackOffsetExpand, stackOffsetNone as d3StackOffsetNone, stackOffsetSilhouette as d3StackOffsetSilhouette, stackOffsetWiggle as d3StackOffsetWiggle } from '@mui/x-charts-vendor/d3-shape';
+import { offsetDiverging } from "./offset/index.js";
 export const StackOrder = {
   /**
    * Series order such that the earliest series (according to the maximum value) is at the bottom.
    * */
-  appearance: d3StackOrderAppearance,
+  appearance: d3OrderAppearance,
   /**
    *  Series order such that the smallest series (according to the sum of values) is at the bottom.
    * */
-  ascending: d3StackOrderAscending,
+  ascending: d3OrderAscending,
   /**
    * Series order such that the largest series (according to the sum of values) is at the bottom.
    */
-  descending: d3StackOrderDescending,
+  descending: d3OrderDescending,
   /**
    * Series order such that the earliest series (according to the maximum value) are on the inside and the later series are on the outside. This order is recommended for streamgraphs in conjunction with the wiggle offset. See Stacked Graphs—Geometry & Aesthetics by Byron & Wattenberg for more information.
    */
-  insideOut: d3StackOrderInsideOut,
+  insideOut: d3OrderInsideOut,
   /**
    * Given series order [0, 1, … n - 1] where n is the number of elements in series. Thus, the stack order is given by the key accessor.
    */
@@ -33,7 +34,8 @@ export const StackOffset = {
   /**
    * Positive values are stacked above zero, negative values are stacked below zero, and zero values are stacked at zero.
    * */
-  diverging: d3StackOffsetDiverging,
+  // @ts-expect-error, d3 types are wrong, our custom function implements the correct signature
+  diverging: offsetDiverging,
   /**
    * Applies a zero baseline.
    * */

package/esm/models/axis.d.ts

@@ -1,12 +1,13 @@
 import type { ScaleBand, ScaleLinear, ScaleLogarithmic, ScaleOrdinal, ScalePoint, ScalePower, ScaleSequential, ScaleThreshold, ScaleTime, ScaleSymLog, NumberValue } from '@mui/x-charts-vendor/d3-scale';
 import { type SxProps } from '@mui/system/styleFunctionSx';
-import { type MakeOptional, type MakeRequired } from '@mui/x-internals/types';
+import { type HasProperty, type MakeOptional, type MakeRequired } from '@mui/x-internals/types';
 import type { DefaultizedZoomOptions } from "../internals/plugins/featurePlugins/useChartCartesianAxis/index.js";
 import { type ChartsAxisClasses } from "../ChartsAxis/axisClasses.js";
 import type { TickParams } from "../hooks/useTicks.js";
 import type { ChartsTextProps } from "../ChartsText/index.js";
 import type { ContinuousColorConfig, OrdinalColorConfig, PiecewiseColorConfig } from "./colorMapping.js";
 import type { OrdinalTimeTicks } from "./timeTicks.js";
+import { type ChartsTypeFeatureFlags } from "./featureFlags.js";
 export type AxisId = string | number;
 export type D3Scale<Domain extends {
   toString(): string;
@@ -133,7 +134,7 @@ type AxisSideConfig<AxisProps extends ChartsAxisProps> = AxisProps extends Chart
   position?: 'top' | 'bottom' | 'none';
   /**
    * The height of the axis.
-   * @default 30
+   * @default 45 if an axis label is provided, 25 otherwise.
    */
   height?: number;
 } : AxisProps extends ChartsYAxisProps ? {
@@ -149,7 +150,7 @@ type AxisSideConfig<AxisProps extends ChartsAxisProps> = AxisProps extends Chart
   position?: 'left' | 'right' | 'none';
   /**
    * The width of the axis.
-   * @default 30
+   * @default 65 if an axis label is provided, 45 otherwise.
    */
   width?: number;
 } : {
@@ -521,7 +522,7 @@ export interface ChartsAxisData {
   /**
    * The mapping of series ids to their value for this particular axis index.
    */
-  seriesValues: Record<string, number | null | undefined>;
+  seriesValues: Record<string, HasProperty<ChartsTypeFeatureFlags, 'seriesValueOverride'> extends true ? ChartsTypeFeatureFlags['seriesValuesOverride'] : number | null | undefined>;
 }
 export type CartesianDirection = 'x' | 'y';
 export type PolarDirection = 'rotation' | 'radius';

package/esm/models/featureFlags.d.ts

@@ -0,0 +1 @@
+export interface ChartsTypeFeatureFlags {}

package/esm/models/featureFlags.js

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

package/esm/models/index.d.ts

@@ -1,6 +1,7 @@
 export * from "./seriesType/index.js";
 export * from "./stacking.js";
 export * from "./slots/index.js";
+export * from "./featureFlags.js";
 export type { AxisConfig, ChartsYAxisProps, ChartsXAxisProps, ScaleName, ContinuousScaleName, ChartsAxisData, XAxis, YAxis, RadiusAxis, RotationAxis, AxisItemIdentifier, AxisValueFormatterContext } from "./axis.js";
 export type { PropsFromSlot } from '@mui/x-internals/slots';
 export type { Position } from "./position.js";

package/esm/models/index.js

@@ -1,6 +1,7 @@
 export * from "./seriesType/index.js";
 export * from "./stacking.js";
 export * from "./slots/index.js";
+export * from "./featureFlags.js";
 
 // Utils shared across the X packages
 export {};

package/esm/models/seriesType/index.d.ts

@@ -1,4 +1,5 @@
-import { type BarSeriesType, type DefaultizedBarSeriesType } from "./bar.js";
+import type { DefaultizedProps } from '@mui/x-internals/types';
+import type { BarSeriesType, DefaultizedBarSeriesType } from "./bar.js";
 import { type CartesianChartSeriesType, type ChartSeriesType, type ChartsSeriesConfig, type StackableChartSeriesType } from "./config.js";
 type AllSeriesType<T extends ChartSeriesType = ChartSeriesType> = ChartsSeriesConfig[T]['seriesProp'];
 /**
@@ -19,6 +20,7 @@ type DefaultizedCartesianSeriesType = DefaultizedSeriesType<CartesianChartSeries
 type StackableSeriesType = DefaultizedSeriesType<StackableChartSeriesType>;
 export type SeriesItemIdentifier<T extends ChartSeriesType = ChartSeriesType> = ChartsSeriesConfig[T]['itemIdentifier'];
 export type SeriesItemIdentifierWithData<T extends ChartSeriesType = ChartSeriesType> = ChartsSeriesConfig[T]['itemIdentifierWithData'];
+export type FocusedItemIdentifier<T extends ChartSeriesType = ChartSeriesType> = T extends 'line' ? DefaultizedProps<ChartsSeriesConfig[T]['itemIdentifier'], 'dataIndex'> : ChartsSeriesConfig[T]['itemIdentifier'];
 export { type SeriesId } from "./common.js";
 export * from "./line.js";
 export * from "./bar.js";

package/esm/moduleAugmentation/barChartBatchRendererOnItemClick.d.ts

@@ -0,0 +1,13 @@
+import type * as React from 'react';
+import type { BarItemIdentifier } from "../models/index.js";
+declare module '@mui/x-charts/BarChart' {
+  interface BarPlotProps {
+    /**
+     * Callback fired when a bar item is clicked.
+     * @param {MouseEvent | React.MouseEvent<SVGElement, MouseEvent>} event The event source of the callback.
+     *        It is a native MouseEvent for `svg-batch` renderer and a React MouseEvent for `svg-single` renderer.
+     * @param {BarItemIdentifier} barItemIdentifier The bar item identifier.
+     */
+    onItemClick?(event: MouseEvent | React.MouseEvent<SVGElement, MouseEvent>, barItemIdentifier: BarItemIdentifier): void;
+  }
+}

package/esm/moduleAugmentation/barChartBatchRendererOnItemClick.js

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

package/hooks/useFocusedItem.d.ts

@@ -1,15 +1,4 @@
-import { type ChartSeriesType } from "../models/seriesType/config.js";
-import { type SeriesId } from "../models/seriesType/common.js";
-export type FocusedItemData = {
-  seriesType: ChartSeriesType;
-  seriesId: SeriesId;
-  dataIndex: number;
-};
 /**
  * Get the focused item from keyboard navigation.
  */
-export declare function useFocusedItem(): {
-  seriesType: "line" | "bar" | "scatter" | "pie";
-  seriesId: SeriesId;
-  dataIndex: number;
-} | null;
+export declare function useFocusedItem(): import("../index.js").FocusedItemIdentifier<keyof import("../internals/index.js").ChartsSeriesConfig> | null;

package/hooks/useFocusedItem.js

@@ -1,12 +1,10 @@
 "use strict";
 'use client';
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useFocusedItem = useFocusedItem;
-var React = _interopRequireWildcard(require("react"));
 var _useStore = require("../internals/store/useStore");
 var _useChartKeyboardNavigation = require("../internals/plugins/featurePlugins/useChartKeyboardNavigation");
 /**
@@ -14,12 +12,5 @@ var _useChartKeyboardNavigation = require("../internals/plugins/featurePlugins/u
  */
 function useFocusedItem() {
   const store = (0, _useStore.useStore)();
-  const focusedSeriesType = store.use(_useChartKeyboardNavigation.selectorChartsFocusedSeriesType);
-  const focusedSeriesId = store.use(_useChartKeyboardNavigation.selectorChartsFocusedSeriesId);
-  const focusedDataIndex = store.use(_useChartKeyboardNavigation.selectorChartsFocusedDataIndex);
-  return React.useMemo(() => focusedSeriesType === undefined || focusedSeriesId === undefined || focusedDataIndex === undefined ? null : {
-    seriesType: focusedSeriesType,
-    seriesId: focusedSeriesId,
-    dataIndex: focusedDataIndex
-  }, [focusedSeriesType, focusedSeriesId, focusedDataIndex]);
+  return store.use(_useChartKeyboardNavigation.selectorChartsFocusedItem);
 }

package/hooks/useIsItemFocused.d.ts

@@ -1,11 +1,12 @@
-import { type FocusedItemData } from "./useFocusedItem.js";
-type UseItemFocusedParams = FocusedItemData;
+import type { ChartSeriesType } from "../models/seriesType/config.js";
+import type { FocusedItemIdentifier } from "../models/seriesType/index.js";
+type UseItemFocusedParams = FocusedItemIdentifier<ChartSeriesType>;
 /**
  * A hook to check if an item has the focus.
  *
  * If you need to process multiple points, use the `useIsItemFocusedGetter` hook instead.
  *
- * @param {FocusedItemData} item is the item to check
+ * @param {FocusedItemIdentifier} item is the item to check
  * @returns {boolean} the focus state
  */
 export declare function useIsItemFocused(item: UseItemFocusedParams): boolean;

package/hooks/useIsItemFocused.js

@@ -12,7 +12,7 @@ var _useChartKeyboardNavigation = require("../internals/plugins/featurePlugins/u
  *
  * If you need to process multiple points, use the `useIsItemFocusedGetter` hook instead.
  *
- * @param {FocusedItemData} item is the item to check
+ * @param {FocusedItemIdentifier} item is the item to check
  * @returns {boolean} the focus state
  */
 function useIsItemFocused(item) {

package/hooks/useIsItemFocusedGetter.d.ts

@@ -1,8 +1,9 @@
-import { type FocusedItemData } from "./useFocusedItem.js";
+import type { FocusedItemIdentifier } from "../models/seriesType/index.js";
+import type { ChartSeriesType } from "../models/seriesType/config.js";
 /**
  * A hook to check focus state of multiple items.
  * If you're interested by a single one, consider using `useIsItemFocused`.
  *
  * @returns {(item: FocusedItemData) => boolean} callback to get the state of the item.
  */
-export declare function useIsItemFocusedGetter(): (item: FocusedItemData) => boolean;
+export declare function useIsItemFocusedGetter(): (item: FocusedItemIdentifier<ChartSeriesType>) => boolean;

package/hooks/useIsItemFocusedGetter.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useIsItemFocusedGetter = useIsItemFocusedGetter;
+var _fastObjectShallowCompare = require("@mui/x-internals/fastObjectShallowCompare");
 var _useFocusedItem = require("./useFocusedItem");
 /**
  * A hook to check focus state of multiple items.
@@ -14,5 +15,5 @@ var _useFocusedItem = require("./useFocusedItem");
  */
 function useIsItemFocusedGetter() {
   const focusedItem = (0, _useFocusedItem.useFocusedItem)();
-  return item => focusedItem !== null && focusedItem.seriesType === item.seriesType && focusedItem.seriesId === item.seriesId && focusedItem.dataIndex === item.dataIndex;
+  return item => focusedItem !== null && (0, _fastObjectShallowCompare.fastObjectShallowCompare)(focusedItem, item);
 }

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-charts v8.22.1
+ * @mui/x-charts v8.24.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/internals/appendAtKey.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Given a map of arrays, appends a value to the array at the given key.
+ * If no array exists at that key, one is created and the value appended.
+ * @param map Map of arrays
+ * @param key Key to append the value at
+ * @param value Value to append
+ */
+export declare function appendAtKey<K, V>(map: Map<K, V[]>, key: K, value: V): V[];

package/internals/appendAtKey.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.appendAtKey = appendAtKey;
+/**
+ * Given a map of arrays, appends a value to the array at the given key.
+ * If no array exists at that key, one is created and the value appended.
+ * @param map Map of arrays
+ * @param key Key to append the value at
+ * @param value Value to append
+ */
+function appendAtKey(map, key, value) {
+  let bucket = map.get(key);
+  if (!bucket) {
+    bucket = [value];
+    map.set(key, bucket);
+  } else {
+    bucket.push(value);
+  }
+  return bucket;
+}

package/internals/commonNextFocusItem.d.ts

@@ -0,0 +1,14 @@
+import type { UseChartKeyboardNavigationSignature } from "./plugins/featurePlugins/useChartKeyboardNavigation/index.js";
+import type { ChartState } from "./plugins/models/chart.js";
+import type { ChartSeriesType } from "../models/seriesType/config.js";
+import type { FocusedItemIdentifier, SeriesId, SeriesItemIdentifier } from "../models/seriesType/index.js";
+type ReturnedItem<OutSeriesType extends ChartSeriesType> = {
+  type: OutSeriesType;
+  seriesId: SeriesId;
+  dataIndex: number;
+} | null;
+export declare function createGetNextIndexFocusedItem<InSeriesType extends Exclude<ChartSeriesType, 'sankey'>, OutSeriesType extends Exclude<ChartSeriesType, 'sankey'> = InSeriesType>(compatibleSeriesTypes: Set<OutSeriesType>): (currentItem: FocusedItemIdentifier<InSeriesType> | null, state: ChartState<[UseChartKeyboardNavigationSignature], []>) => ReturnedItem<OutSeriesType>;
+export declare function createGetPreviousIndexFocusedItem<InSeriesType extends Exclude<ChartSeriesType, 'sankey'>, OutSeriesType extends Exclude<ChartSeriesType, 'sankey'> = InSeriesType>(compatibleSeriesTypes: Set<OutSeriesType>): (currentItem: SeriesItemIdentifier<InSeriesType> | null, state: ChartState<[UseChartKeyboardNavigationSignature], []>) => ReturnedItem<OutSeriesType>;
+export declare function createGetNextSeriesFocusedItem<InSeriesType extends Exclude<ChartSeriesType, 'sankey'>, OutSeriesType extends Exclude<ChartSeriesType, 'sankey'> = InSeriesType>(compatibleSeriesTypes: Set<OutSeriesType>): (currentItem: SeriesItemIdentifier<InSeriesType> | null, state: ChartState<[UseChartKeyboardNavigationSignature], []>) => ReturnedItem<OutSeriesType>;
+export declare function createGetPreviousSeriesFocusedItem<InSeriesType extends Exclude<ChartSeriesType, 'sankey'>, OutSeriesType extends Exclude<ChartSeriesType, 'sankey'> = InSeriesType>(compatibleSeriesTypes: Set<OutSeriesType>): (currentItem: SeriesItemIdentifier<InSeriesType> | null, state: ChartState<[UseChartKeyboardNavigationSignature], []>) => ReturnedItem<OutSeriesType>;
+export {};

package/internals/commonNextFocusItem.js

@@ -0,0 +1,97 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createGetNextIndexFocusedItem = createGetNextIndexFocusedItem;
+exports.createGetNextSeriesFocusedItem = createGetNextSeriesFocusedItem;
+exports.createGetPreviousIndexFocusedItem = createGetPreviousIndexFocusedItem;
+exports.createGetPreviousSeriesFocusedItem = createGetPreviousSeriesFocusedItem;
+var _getPreviousNonEmptySeries = require("./plugins/featurePlugins/useChartKeyboardNavigation/utils/getPreviousNonEmptySeries");
+var _getMaxSeriesLength = require("./plugins/featurePlugins/useChartKeyboardNavigation/utils/getMaxSeriesLength");
+var _useChartSeries = require("./plugins/corePlugins/useChartSeries");
+var _getNextNonEmptySeries = require("./plugins/featurePlugins/useChartKeyboardNavigation/utils/getNextNonEmptySeries");
+var _seriesHasData = require("./seriesHasData");
+function createGetNextIndexFocusedItem(compatibleSeriesTypes) {
+  return function getNextIndexFocusedItem(currentItem, state) {
+    const processedSeries = (0, _useChartSeries.selectorChartSeriesProcessed)(state);
+    let seriesId = currentItem?.seriesId;
+    let type = currentItem?.type;
+    if (!type || seriesId == null || !(0, _seriesHasData.seriesHasData)(processedSeries, type, seriesId)) {
+      const nextSeries = (0, _getNextNonEmptySeries.getNextNonEmptySeries)(processedSeries, compatibleSeriesTypes, type, seriesId);
+      if (nextSeries === null) {
+        return null;
+      }
+      type = nextSeries.type;
+      seriesId = nextSeries.seriesId;
+    }
+    const maxLength = (0, _getMaxSeriesLength.getMaxSeriesLength)(processedSeries, compatibleSeriesTypes);
+    const dataIndex = Math.min(maxLength - 1, currentItem?.dataIndex == null ? 0 : currentItem.dataIndex + 1);
+    return {
+      type,
+      seriesId,
+      dataIndex
+    };
+  };
+}
+function createGetPreviousIndexFocusedItem(compatibleSeriesTypes) {
+  return function getPreviousIndexFocusedItem(currentItem, state) {
+    const processedSeries = (0, _useChartSeries.selectorChartSeriesProcessed)(state);
+    let seriesId = currentItem?.seriesId;
+    let type = currentItem?.type;
+    if (!type || seriesId == null || !(0, _seriesHasData.seriesHasData)(processedSeries, type, seriesId)) {
+      const previousSeries = (0, _getPreviousNonEmptySeries.getPreviousNonEmptySeries)(processedSeries, compatibleSeriesTypes, type, seriesId);
+      if (previousSeries === null) {
+        return null;
+      }
+      type = previousSeries.type;
+      seriesId = previousSeries.seriesId;
+    }
+    const maxLength = (0, _getMaxSeriesLength.getMaxSeriesLength)(processedSeries, compatibleSeriesTypes);
+    const dataIndex = Math.max(0, currentItem?.dataIndex == null ? maxLength - 1 : currentItem.dataIndex - 1);
+    return {
+      type,
+      seriesId,
+      dataIndex
+    };
+  };
+}
+function createGetNextSeriesFocusedItem(compatibleSeriesTypes) {
+  return function getNextSeriesFocusedItem(currentItem, state) {
+    const processedSeries = (0, _useChartSeries.selectorChartSeriesProcessed)(state);
+    let seriesId = currentItem?.seriesId;
+    let type = currentItem?.type;
+    const nextSeries = (0, _getNextNonEmptySeries.getNextNonEmptySeries)(processedSeries, compatibleSeriesTypes, type, seriesId);
+    if (nextSeries === null) {
+      return null; // No series to move the focus to.
+    }
+    type = nextSeries.type;
+    seriesId = nextSeries.seriesId;
+    const dataIndex = currentItem?.dataIndex == null ? 0 : currentItem.dataIndex;
+    return {
+      type,
+      seriesId,
+      dataIndex
+    };
+  };
+}
+function createGetPreviousSeriesFocusedItem(compatibleSeriesTypes) {
+  return function getPreviousSeriesFocusedItem(currentItem, state) {
+    const processedSeries = (0, _useChartSeries.selectorChartSeriesProcessed)(state);
+    let seriesId = currentItem?.seriesId;
+    let type = currentItem?.type;
+    const previousSeries = (0, _getPreviousNonEmptySeries.getPreviousNonEmptySeries)(processedSeries, compatibleSeriesTypes, type, seriesId);
+    if (previousSeries === null) {
+      return null; // No series to move the focus to.
+    }
+    type = previousSeries.type;
+    seriesId = previousSeries.seriesId;
+    const data = processedSeries[type].series[seriesId].data;
+    const dataIndex = currentItem?.dataIndex == null ? data.length - 1 : currentItem.dataIndex;
+    return {
+      type,
+      seriesId,
+      dataIndex
+    };
+  };
+}

package/internals/getBarDimensions.d.ts

@@ -1,5 +1,4 @@
-import type { ScaleName, ChartsXAxisProps, ChartsYAxisProps } from "../models/index.js";
-import type { ComputedAxis } from "../models/axis.js";
+import type { ChartsXAxisProps, ChartsYAxisProps, ComputedAxis, ScaleName } from "../models/axis.js";
 import type { ChartSeriesDefaultized } from "../models/seriesType/config.js";
 export declare function getBarDimensions(params: {
   verticalLayout: boolean;

package/internals/identifierSerializer.d.ts

@@ -0,0 +1,9 @@
+import type { SeriesId } from "../models/index.js";
+export declare const typeSerializer: (type: string) => string;
+export declare const seriesIdSerializer: (id: SeriesId) => string;
+export declare const dataIndexSerializer: (dataIndex?: number) => string;
+export declare const identifierSerializerSeriesIdDataIndex: (identifier: {
+  type: string;
+  seriesId: SeriesId;
+  dataIndex?: number;
+}) => string;

package/internals/identifierSerializer.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.typeSerializer = exports.seriesIdSerializer = exports.identifierSerializerSeriesIdDataIndex = exports.dataIndexSerializer = void 0;
+const typeSerializer = type => `Type(${type})`;
+exports.typeSerializer = typeSerializer;
+const seriesIdSerializer = id => `Series(${id})`;
+exports.seriesIdSerializer = seriesIdSerializer;
+const dataIndexSerializer = dataIndex => dataIndex === undefined ? '' : `Index(${dataIndex})`;
+exports.dataIndexSerializer = dataIndexSerializer;
+const identifierSerializerSeriesIdDataIndex = identifier => {
+  return `${typeSerializer(identifier.type)}${seriesIdSerializer(identifier.seriesId)}${dataIndexSerializer(identifier.dataIndex)}`;
+};
+exports.identifierSerializerSeriesIdDataIndex = identifierSerializerSeriesIdDataIndex;

package/internals/index.d.ts

@@ -12,13 +12,14 @@ export { scatterSeriesConfig } from "../ScatterChart/seriesConfig/index.js";
 export { useLineChartProps } from "../LineChart/useLineChartProps.js";
 export { useAreaPlotData } from "../LineChart/useAreaPlotData.js";
 export { useLinePlotData } from "../LineChart/useLinePlotData.js";
-export { useBarChartProps } from "../BarChart/useBarChartProps.js";
+export * from "../BarChart/useBarChartProps.js";
 export { useBarPlotData } from "../BarChart/useBarPlotData.js";
 export { useRadarChartProps } from "../RadarChart/useRadarChartProps.js";
 export * from "../ChartContainer/useChartContainerProps.js";
 export * from "../ChartDataProvider/useChartDataProviderProps.js";
 export * from "./seriesSelectorOfType.js";
 export { useSkipAnimation } from "../hooks/useSkipAnimation.js";
+export { useRegisterPointerInteractions } from "./plugins/featurePlugins/shared/useRegisterPointerInteractions.js";
 export * from "./plugins/corePlugins/useChartId/index.js";
 export * from "./plugins/corePlugins/useChartSeries/index.js";
 export * from "./plugins/corePlugins/useChartDimensions/index.js";
@@ -29,6 +30,7 @@ export * from "./plugins/featurePlugins/useChartPolarAxis/index.js";
 export * from "./plugins/featurePlugins/useChartTooltip/index.js";
 export * from "./plugins/featurePlugins/useChartInteraction/index.js";
 export * from "./plugins/featurePlugins/useChartHighlight/index.js";
+export * from "./plugins/featurePlugins/useChartVisibilityManager/index.js";
 export * from "./plugins/featurePlugins/useChartKeyboardNavigation/index.js";
 export * from "./plugins/featurePlugins/useChartClosestPoint/index.js";
 export * from "./plugins/featurePlugins/useChartBrush/index.js";
@@ -47,7 +49,7 @@ export * from "./getLabel.js";
 export * from "./getSVGPoint.js";
 export * from "./isDefined.js";
 export * from "./getScale.js";
-export * from "./stackSeries.js";
+export * from "./stacking/index.js";
 export * from "./getCurve.js";
 export * from "./consumeSlots.js";
 export * from "./consumeThemeProps.js";
@@ -58,6 +60,7 @@ export * from "./dateHelpers.js";
 export * from "./invertScale.js";
 export * from "./scaleGuards.js";
 export * from "./findMinMax.js";
+export { getSeriesColorFn } from "./getSeriesColorFn.js";
 export { checkBarChartScaleErrors } from "../BarChart/checkBarChartScaleErrors.js";
 export { getBandSize } from "./getBandSize.js";
 export { getAxisExtrema } from "./plugins/featurePlugins/useChartCartesianAxis/getAxisExtrema.js";
@@ -71,4 +74,5 @@ export * from "./plugins/models/index.js";
 export * from "./material/index.js";
 export * from "./createSvgIcon.js";
 export * from "./constants.js";
-export * from "./scales/index.js";
+export * from "./scales/index.js";
+export * from "./identifierSerializer.js";