@mui/x-charts 9.0.0-alpha.3 → 9.0.0-beta.0

package/SparkLineChart/SparkLineChart.mjs

@@ -9,7 +9,7 @@ import useId from '@mui/utils/useId';
 import { ChartsClipPath } from "../ChartsClipPath/index.mjs";
 import { BarPlot } from "../BarChart/index.mjs";
 import { LinePlot, AreaPlot, LineHighlightPlot } from "../LineChart/index.mjs";
-import { ChartDataProvider } from "../ChartDataProvider/index.mjs";
+import { ChartsDataProvider } from "../ChartsDataProvider/index.mjs";
 import { ChartsSurface } from "../ChartsSurface/index.mjs";
 import { DEFAULT_X_AXIS_KEY, DEFAULT_Y_AXIS_KEY } from "../constants/index.mjs";
 import { ChartsTooltip } from "../ChartsTooltip/index.mjs";
@@ -103,7 +103,7 @@ const SparkLineChart = /*#__PURE__*/React.forwardRef(function SparkLineChart(pro
   }, yAxisProps, {
     position: 'none'
   })], [yAxisProps]);
-  return /*#__PURE__*/_jsxs(ChartDataProvider, {
+  return /*#__PURE__*/_jsxs(ChartsDataProvider, {
     series: series,
     width: width,
     height: height,
@@ -219,6 +219,10 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
    * An array of objects that can be used to populate series and axes data using their `dataKey` property.
    */
   dataset: PropTypes.arrayOf(PropTypes.object),
+  /**
+   * The description of the chart.
+   * Used to provide an accessible description for the chart.
+   */
   desc: PropTypes.string,
   /**
    * If `true`, the charts will not listen to the mouse move event.
@@ -232,14 +236,20 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
    * @default false
    */
   disableClipping: PropTypes.bool,
+  /**
+   * If true, the hit area interaction is disabled and falls back to hover events.
+   */
+  disableHitArea: PropTypes.bool,
   /**
    * If `true`, disables keyboard navigation for the chart.
    */
   disableKeyboardNavigation: PropTypes.bool,
   /**
-   * If true, the voronoi interaction are ignored.
+   * Options to enable features planned for the next major.
    */
-  disableVoronoi: PropTypes.bool,
+  experimentalFeatures: PropTypes.shape({
+    enablePositionBasedPointerInteraction: PropTypes.bool
+  }),
   /**
    * The height of the chart in px. If not defined, it takes the height of the parent element.
    */
@@ -341,6 +351,12 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     seriesId: PropTypes.string.isRequired,
     type: PropTypes.oneOf(['radar']).isRequired
   })]),
+  /**
+   * 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.
+   */
+  hitAreaRadius: PropTypes.oneOfType([PropTypes.oneOf(['item']), PropTypes.number]),
   /**
    * This prop is used to help implement the accessibility logic.
    * If you don't provide this prop. It falls back to a randomly generated id.
@@ -506,6 +522,10 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
   slots: PropTypes.object,
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   theme: PropTypes.oneOf(['dark', 'light']),
+  /**
+   * The title of the chart.
+   * Used to provide an accessible label for the chart.
+   */
   title: PropTypes.string,
   /**
    * The controlled axis tooltip.
@@ -553,12 +573,6 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
    * @default (value: number | null) => (value === null ? '' : value.toString())
    */
   valueFormatter: PropTypes.func,
-  /**
-   * 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: PropTypes.oneOfType([PropTypes.oneOf(['item']), PropTypes.number]),
   /**
    * The width of the chart in px. If not defined, it takes the width of the parent element.
    */
@@ -572,6 +586,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     barGapRatio: PropTypes.number,
     categoryGapRatio: PropTypes.number,
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       colors: PropTypes.arrayOf(PropTypes.string).isRequired,
       type: PropTypes.oneOf(['ordinal']).isRequired,
@@ -597,7 +612,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
       tickLabelStyle: PropTypes.object,
       tickSize: PropTypes.number
     })),
-    height: PropTypes.number,
+    height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,
@@ -630,6 +645,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       colors: PropTypes.arrayOf(PropTypes.string).isRequired,
       type: PropTypes.oneOf(['ordinal']).isRequired,
@@ -655,7 +671,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
       tickLabelStyle: PropTypes.object,
       tickSize: PropTypes.number
     })),
-    height: PropTypes.number,
+    height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,
@@ -688,6 +704,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -703,7 +720,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
-    height: PropTypes.number,
+    height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,
@@ -733,6 +750,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -749,7 +767,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
-    height: PropTypes.number,
+    height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,
@@ -779,6 +797,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -794,7 +813,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
-    height: PropTypes.number,
+    height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,
@@ -824,6 +843,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -839,7 +859,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
-    height: PropTypes.number,
+    height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,
@@ -869,6 +889,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -884,7 +905,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
-    height: PropTypes.number,
+    height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,
@@ -918,6 +939,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -933,7 +955,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
-    height: PropTypes.number,
+    height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,
@@ -967,6 +989,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['x']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -982,7 +1005,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
     domainLimit: PropTypes.oneOfType([PropTypes.oneOf(['nice', 'strict']), PropTypes.func]),
-    height: PropTypes.number,
+    height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]),
     hideTooltip: PropTypes.bool,
     id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     ignoreTooltip: PropTypes.bool,
@@ -1019,6 +1042,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     barGapRatio: PropTypes.number,
     categoryGapRatio: PropTypes.number,
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       colors: PropTypes.arrayOf(PropTypes.string).isRequired,
       type: PropTypes.oneOf(['ordinal']).isRequired,
@@ -1072,10 +1096,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickSize: PropTypes.number,
     tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
-    width: PropTypes.number
+    width: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number])
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['y']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       colors: PropTypes.arrayOf(PropTypes.string).isRequired,
       type: PropTypes.oneOf(['ordinal']).isRequired,
@@ -1129,10 +1154,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickSize: PropTypes.number,
     tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
-    width: PropTypes.number
+    width: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number])
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['y']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -1173,10 +1199,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickSize: PropTypes.number,
     tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
-    width: PropTypes.number
+    width: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number])
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['y']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -1218,10 +1245,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickSize: PropTypes.number,
     tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
-    width: PropTypes.number
+    width: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number])
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['y']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -1262,10 +1290,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickSize: PropTypes.number,
     tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
-    width: PropTypes.number
+    width: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number])
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['y']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -1306,10 +1335,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickSize: PropTypes.number,
     tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
-    width: PropTypes.number
+    width: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number])
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['y']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -1354,10 +1384,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickSize: PropTypes.number,
     tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
-    width: PropTypes.number
+    width: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number])
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['y']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -1402,10 +1433,11 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickSize: PropTypes.number,
     tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
-    width: PropTypes.number
+    width: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number])
   }), PropTypes.shape({
     axis: PropTypes.oneOf(['y']),
     classes: PropTypes.object,
+    className: PropTypes.string,
     colorMap: PropTypes.oneOfType([PropTypes.shape({
       color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
       max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
@@ -1446,7 +1478,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     tickSize: PropTypes.number,
     tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
-    width: PropTypes.number
+    width: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number])
   })])
 } : void 0;
 export { SparkLineChart };

package/constants/index.js

@@ -16,6 +16,4 @@ const DEFAULT_MARGINS = exports.DEFAULT_MARGINS = {
 };
 const DEFAULT_AXIS_SIZE_WIDTH = exports.DEFAULT_AXIS_SIZE_WIDTH = 45;
 const DEFAULT_AXIS_SIZE_HEIGHT = exports.DEFAULT_AXIS_SIZE_HEIGHT = 25;
-
-// How many pixels to add to the default axis size if that axis has a label
 const AXIS_LABEL_DEFAULT_HEIGHT = exports.AXIS_LABEL_DEFAULT_HEIGHT = 20;

package/constants/index.mjs

@@ -10,6 +10,4 @@ export const DEFAULT_MARGINS = {
 };
 export const DEFAULT_AXIS_SIZE_WIDTH = 45;
 export const DEFAULT_AXIS_SIZE_HEIGHT = 25;
-
-// How many pixels to add to the default axis size if that axis has a label
 export const AXIS_LABEL_DEFAULT_HEIGHT = 20;

package/context/useChartApiContext.d.mts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { type ChartApi } from "./ChartApi.mjs";
 /**
  * The `useChartApiContext` hook provides access to the chart API.
- * This is only available when the chart is rendered within a chart or a `ChartDataProvider` component.
+ * This is only available when the chart is rendered within a chart or a `ChartsDataProvider` component.
  * If you want to access the chart API outside those components, you should use the `apiRef` prop instead.
  * @example
  * const apiRef = useChartApiContext<ChartApi<'bar'>>();

package/context/useChartApiContext.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { type ChartApi } from "./ChartApi.js";
 /**
  * The `useChartApiContext` hook provides access to the chart API.
- * This is only available when the chart is rendered within a chart or a `ChartDataProvider` component.
+ * This is only available when the chart is rendered within a chart or a `ChartsDataProvider` component.
  * If you want to access the chart API outside those components, you should use the `apiRef` prop instead.
  * @example
  * const apiRef = useChartApiContext<ChartApi<'bar'>>();

package/context/useChartApiContext.js

@@ -7,10 +7,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useChartApiContext = useChartApiContext;
 var React = _interopRequireWildcard(require("react"));
-var _ChartProvider = require("./ChartProvider");
+var _ChartsProvider = require("./ChartsProvider");
 /**
  * The `useChartApiContext` hook provides access to the chart API.
- * This is only available when the chart is rendered within a chart or a `ChartDataProvider` component.
+ * This is only available when the chart is rendered within a chart or a `ChartsDataProvider` component.
  * If you want to access the chart API outside those components, you should use the `apiRef` prop instead.
  * @example
  * const apiRef = useChartApiContext<ChartApi<'bar'>>();
@@ -18,7 +18,7 @@ var _ChartProvider = require("./ChartProvider");
 function useChartApiContext() {
   const {
     publicAPI
-  } = (0, _ChartProvider.useChartContext)();
+  } = (0, _ChartsProvider.useChartsContext)();
   const apiRef = React.useRef(publicAPI);
   React.useEffect(() => {
     apiRef.current = publicAPI;

package/context/useChartApiContext.mjs

@@ -1,10 +1,10 @@
 'use client';
 
 import * as React from 'react';
-import { useChartContext } from "./ChartProvider/index.mjs";
+import { useChartsContext } from "./ChartsProvider/index.mjs";
 /**
  * The `useChartApiContext` hook provides access to the chart API.
- * This is only available when the chart is rendered within a chart or a `ChartDataProvider` component.
+ * This is only available when the chart is rendered within a chart or a `ChartsDataProvider` component.
  * If you want to access the chart API outside those components, you should use the `apiRef` prop instead.
  * @example
  * const apiRef = useChartApiContext<ChartApi<'bar'>>();
@@ -12,7 +12,7 @@ import { useChartContext } from "./ChartProvider/index.mjs";
 export function useChartApiContext() {
   const {
     publicAPI
-  } = useChartContext();
+  } = useChartsContext();
   const apiRef = React.useRef(publicAPI);
   React.useEffect(() => {
     apiRef.current = publicAPI;

package/hooks/animation/useAnimatePieArcLabel.d.mts

@@ -1,16 +1,7 @@
 import type * as React from 'react';
 import type { PieArcLabelProps } from "../../PieChart/index.mjs";
-type UseAnimatePieArcLabelParams = Pick<PieArcLabelProps, 'startAngle' | 'endAngle' | 'cornerRadius' | 'paddingAngle' | 'skipAnimation'> & {
+type UseAnimatePieArcLabelParams = Pick<PieArcLabelProps, 'startAngle' | 'endAngle' | 'arcLabelRadius' | 'cornerRadius' | 'paddingAngle' | 'skipAnimation'> & {
   ref?: React.Ref<SVGTextElement>;
-  arcLabelRadius?: number;
-  /**
-   * @deprecated Use `arcLabelRadius` instead. This prop will be removed in the next major version.
-   */
-  innerRadius: PieArcLabelProps['innerRadius'];
-  /**
-   * @deprecated Use `arcLabelRadius` instead. This prop will be removed in the next major version.
-   */
-  outerRadius: PieArcLabelProps['outerRadius'];
 };
 type UseAnimatePieArcLabelReturn = {
   ref: React.Ref<SVGTextElement>;

package/hooks/animation/useAnimatePieArcLabel.d.ts

@@ -1,16 +1,7 @@
 import type * as React from 'react';
 import type { PieArcLabelProps } from "../../PieChart/index.js";
-type UseAnimatePieArcLabelParams = Pick<PieArcLabelProps, 'startAngle' | 'endAngle' | 'cornerRadius' | 'paddingAngle' | 'skipAnimation'> & {
+type UseAnimatePieArcLabelParams = Pick<PieArcLabelProps, 'startAngle' | 'endAngle' | 'arcLabelRadius' | 'cornerRadius' | 'paddingAngle' | 'skipAnimation'> & {
   ref?: React.Ref<SVGTextElement>;
-  arcLabelRadius?: number;
-  /**
-   * @deprecated Use `arcLabelRadius` instead. This prop will be removed in the next major version.
-   */
-  innerRadius: PieArcLabelProps['innerRadius'];
-  /**
-   * @deprecated Use `arcLabelRadius` instead. This prop will be removed in the next major version.
-   */
-  outerRadius: PieArcLabelProps['outerRadius'];
 };
 type UseAnimatePieArcLabelReturn = {
   ref: React.Ref<SVGTextElement>;

package/hooks/animation/useAnimatePieArcLabel.js

@@ -10,16 +10,14 @@ var _useAnimate = require("./useAnimate");
 function pieArcLabelPropsInterpolator(from, to) {
   const interpolateStartAngle = (0, _d3Interpolate.interpolateNumber)(from.startAngle, to.startAngle);
   const interpolateEndAngle = (0, _d3Interpolate.interpolateNumber)(from.endAngle, to.endAngle);
-  const interpolateInnerRadius = (0, _d3Interpolate.interpolateNumber)(from.innerRadius, to.innerRadius);
-  const interpolateOuterRadius = (0, _d3Interpolate.interpolateNumber)(from.outerRadius, to.outerRadius);
+  const interpolateArcLabelRadius = (0, _d3Interpolate.interpolateNumber)(from.arcLabelRadius, to.arcLabelRadius);
   const interpolatePaddingAngle = (0, _d3Interpolate.interpolateNumber)(from.paddingAngle, to.paddingAngle);
   const interpolateCornerRadius = (0, _d3Interpolate.interpolateNumber)(from.cornerRadius, to.cornerRadius);
   return t => {
     return {
       startAngle: interpolateStartAngle(t),
       endAngle: interpolateEndAngle(t),
-      innerRadius: interpolateInnerRadius(t),
-      outerRadius: interpolateOuterRadius(t),
+      arcLabelRadius: interpolateArcLabelRadius(t),
       paddingAngle: interpolatePaddingAngle(t),
       cornerRadius: interpolateCornerRadius(t)
     };
@@ -33,16 +31,14 @@ function useAnimatePieArcLabel(props) {
   const initialProps = {
     startAngle: (props.startAngle + props.endAngle) / 2,
     endAngle: (props.startAngle + props.endAngle) / 2,
-    innerRadius: props.arcLabelRadius ?? props.innerRadius,
-    outerRadius: props.arcLabelRadius ?? props.outerRadius,
+    arcLabelRadius: props.arcLabelRadius,
     paddingAngle: props.paddingAngle,
     cornerRadius: props.cornerRadius
   };
   return (0, _useAnimate.useAnimate)({
     startAngle: props.startAngle,
     endAngle: props.endAngle,
-    innerRadius: props.arcLabelRadius ?? props.innerRadius,
-    outerRadius: props.arcLabelRadius ?? props.outerRadius,
+    arcLabelRadius: props.arcLabelRadius,
     paddingAngle: props.paddingAngle,
     cornerRadius: props.cornerRadius
   }, {
@@ -52,8 +48,8 @@ function useAnimatePieArcLabel(props) {
         padAngle: animatedProps.paddingAngle,
         startAngle: animatedProps.startAngle,
         endAngle: animatedProps.endAngle,
-        innerRadius: animatedProps.innerRadius,
-        outerRadius: animatedProps.outerRadius
+        innerRadius: animatedProps.arcLabelRadius,
+        outerRadius: animatedProps.arcLabelRadius
       });
       return {
         x,

package/hooks/animation/useAnimatePieArcLabel.mjs

@@ -4,16 +4,14 @@ import { useAnimate } from "./useAnimate.mjs";
 function pieArcLabelPropsInterpolator(from, to) {
   const interpolateStartAngle = interpolateNumber(from.startAngle, to.startAngle);
   const interpolateEndAngle = interpolateNumber(from.endAngle, to.endAngle);
-  const interpolateInnerRadius = interpolateNumber(from.innerRadius, to.innerRadius);
-  const interpolateOuterRadius = interpolateNumber(from.outerRadius, to.outerRadius);
+  const interpolateArcLabelRadius = interpolateNumber(from.arcLabelRadius, to.arcLabelRadius);
   const interpolatePaddingAngle = interpolateNumber(from.paddingAngle, to.paddingAngle);
   const interpolateCornerRadius = interpolateNumber(from.cornerRadius, to.cornerRadius);
   return t => {
     return {
       startAngle: interpolateStartAngle(t),
       endAngle: interpolateEndAngle(t),
-      innerRadius: interpolateInnerRadius(t),
-      outerRadius: interpolateOuterRadius(t),
+      arcLabelRadius: interpolateArcLabelRadius(t),
       paddingAngle: interpolatePaddingAngle(t),
       cornerRadius: interpolateCornerRadius(t)
     };
@@ -27,16 +25,14 @@ export function useAnimatePieArcLabel(props) {
   const initialProps = {
     startAngle: (props.startAngle + props.endAngle) / 2,
     endAngle: (props.startAngle + props.endAngle) / 2,
-    innerRadius: props.arcLabelRadius ?? props.innerRadius,
-    outerRadius: props.arcLabelRadius ?? props.outerRadius,
+    arcLabelRadius: props.arcLabelRadius,
     paddingAngle: props.paddingAngle,
     cornerRadius: props.cornerRadius
   };
   return useAnimate({
     startAngle: props.startAngle,
     endAngle: props.endAngle,
-    innerRadius: props.arcLabelRadius ?? props.innerRadius,
-    outerRadius: props.arcLabelRadius ?? props.outerRadius,
+    arcLabelRadius: props.arcLabelRadius,
     paddingAngle: props.paddingAngle,
     cornerRadius: props.cornerRadius
   }, {
@@ -46,8 +42,8 @@ export function useAnimatePieArcLabel(props) {
         padAngle: animatedProps.paddingAngle,
         startAngle: animatedProps.startAngle,
         endAngle: animatedProps.endAngle,
-        innerRadius: animatedProps.innerRadius,
-        outerRadius: animatedProps.outerRadius
+        innerRadius: animatedProps.arcLabelRadius,
+        outerRadius: animatedProps.arcLabelRadius
       });
       return {
         x,

package/hooks/useChartRootRef.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useChartRootRef = useChartRootRef;
-var _ChartProvider = require("../context/ChartProvider");
+var _ChartsProvider = require("../context/ChartsProvider");
 /**
  * Get the ref for the root chart element.
  * @returns The root chart element ref.
@@ -13,6 +13,6 @@ var _ChartProvider = require("../context/ChartProvider");
 function useChartRootRef() {
   const {
     instance
-  } = (0, _ChartProvider.useChartContext)();
+  } = (0, _ChartsProvider.useChartsContext)();
   return instance.chartRootRef;
 }

package/hooks/useChartRootRef.mjs

@@ -1,6 +1,6 @@
 'use client';
 
-import { useChartContext } from "../context/ChartProvider/index.mjs";
+import { useChartsContext } from "../context/ChartsProvider/index.mjs";
 
 /**
  * Get the ref for the root chart element.
@@ -9,6 +9,6 @@ import { useChartContext } from "../context/ChartProvider/index.mjs";
 export function useChartRootRef() {
   const {
     instance
-  } = useChartContext();
+  } = useChartsContext();
   return instance.chartRootRef;
 }

package/hooks/useChartsLayerContainerRef.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useChartsLayerContainerRef = useChartsLayerContainerRef;
-var _ChartProvider = require("../context/ChartProvider");
+var _ChartsProvider = require("../context/ChartsProvider");
 /**
  * Get the ref for the chart surface element.
  * @returns The chart surface ref.
@@ -13,6 +13,6 @@ var _ChartProvider = require("../context/ChartProvider");
 function useChartsLayerContainerRef() {
   const {
     instance
-  } = (0, _ChartProvider.useChartContext)();
+  } = (0, _ChartsProvider.useChartsContext)();
   return instance.chartsLayerContainerRef;
 }

package/hooks/useChartsLayerContainerRef.mjs

@@ -1,6 +1,6 @@
 'use client';
 
-import { useChartContext } from "../context/ChartProvider/index.mjs";
+import { useChartsContext } from "../context/ChartsProvider/index.mjs";
 
 /**
  * Get the ref for the chart surface element.
@@ -9,6 +9,6 @@ import { useChartContext } from "../context/ChartProvider/index.mjs";
 export function useChartsLayerContainerRef() {
   const {
     instance
-  } = useChartContext();
+  } = useChartsContext();
   return instance.chartsLayerContainerRef;
 }

package/hooks/useDataset.js

@@ -13,5 +13,5 @@ var _useChartSeries = require("../internals/plugins/corePlugins/useChartSeries/u
  */
 function useDataset() {
   const store = (0, _useStore.useStore)();
-  return store.use(_useChartSeries.selectorChartDataset);
+  return store.use(_useChartSeries.selectorChartsDataset);
 }