@mui/x-charts 7.9.0 → 7.11.0

package/ScatterChart/useScatterChartProps.js

@@ -6,6 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useScatterChartProps = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+const _excluded = ["xAxis", "yAxis", "zAxis", "series", "tooltip", "axisHighlight", "voronoiMaxRadius", "disableVoronoi", "legend", "width", "height", "margin", "colors", "sx", "grid", "topAxis", "leftAxis", "rightAxis", "bottomAxis", "onItemClick", "children", "slots", "slotProps", "loading", "highlightedItem", "onHighlightChange", "className"];
 /**
  * A helper function that extracts ScatterChartProps from the input props
  * and returns an object with props for the children components of ScatterChart.
@@ -15,34 +17,36 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
  */
 const useScatterChartProps = props => {
   const {
-    xAxis,
-    yAxis,
-    zAxis,
-    series,
-    tooltip,
-    axisHighlight,
-    voronoiMaxRadius,
-    disableVoronoi,
-    legend,
-    width,
-    height,
-    margin,
-    colors,
-    sx,
-    grid,
-    topAxis,
-    leftAxis,
-    rightAxis,
-    bottomAxis,
-    onItemClick,
-    children,
-    slots,
-    slotProps,
-    loading,
-    highlightedItem,
-    onHighlightChange
-  } = props;
-  const chartContainerProps = {
+      xAxis,
+      yAxis,
+      zAxis,
+      series,
+      tooltip,
+      axisHighlight,
+      voronoiMaxRadius,
+      disableVoronoi,
+      legend,
+      width,
+      height,
+      margin,
+      colors,
+      sx,
+      grid,
+      topAxis,
+      leftAxis,
+      rightAxis,
+      bottomAxis,
+      onItemClick,
+      children,
+      slots,
+      slotProps,
+      loading,
+      highlightedItem,
+      onHighlightChange,
+      className
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const chartContainerProps = (0, _extends2.default)({}, other, {
     series: series.map(s => (0, _extends2.default)({
       type: 'scatter'
     }, s)),
@@ -54,8 +58,9 @@ const useScatterChartProps = props => {
     yAxis,
     sx,
     highlightedItem,
-    onHighlightChange
-  };
+    onHighlightChange,
+    className
+  });
   const zAxisProps = {
     zAxis
   };

package/SparkLineChart/SparkLineChart.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.SparkLineChart = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _BarChart = require("../BarChart");
@@ -15,6 +16,7 @@ var _constants = require("../constants");
 var _ChartsTooltip = require("../ChartsTooltip");
 var _ChartsAxisHighlight = require("../ChartsAxisHighlight");
 var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["xAxis", "yAxis", "width", "height", "margin", "colors", "sx", "showTooltip", "tooltip", "showHighlight", "axisHighlight", "children", "slots", "slotProps", "data", "plotType", "valueFormatter", "area", "curve", "className"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const SPARKLINE_DEFAULT_MARGIN = {
@@ -35,33 +37,35 @@ const SPARKLINE_DEFAULT_MARGIN = {
  */
 const SparkLineChart = exports.SparkLineChart = /*#__PURE__*/React.forwardRef(function SparkLineChart(props, ref) {
   const {
-    xAxis,
-    yAxis,
-    width,
-    height,
-    margin = SPARKLINE_DEFAULT_MARGIN,
-    colors,
-    sx,
-    showTooltip,
-    tooltip,
-    showHighlight,
-    axisHighlight: inAxisHighlight,
-    children,
-    slots,
-    slotProps,
-    data,
-    plotType = 'line',
-    valueFormatter = value => value === null ? '' : value.toString(),
-    area,
-    curve = 'linear'
-  } = props;
+      xAxis,
+      yAxis,
+      width,
+      height,
+      margin = SPARKLINE_DEFAULT_MARGIN,
+      colors,
+      sx,
+      showTooltip,
+      tooltip,
+      showHighlight,
+      axisHighlight: inAxisHighlight,
+      children,
+      slots,
+      slotProps,
+      data,
+      plotType = 'line',
+      valueFormatter = value => value === null ? '' : value.toString(),
+      area,
+      curve = 'linear',
+      className
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const defaultXHighlight = showHighlight && plotType === 'bar' ? {
     x: 'band'
   } : {
     x: 'none'
   };
   const axisHighlight = (0, _extends2.default)({}, defaultXHighlight, inAxisHighlight);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ResponsiveChartContainer.ResponsiveChartContainer, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ResponsiveChartContainer.ResponsiveChartContainer, (0, _extends2.default)({}, other, {
     ref: ref,
     series: [(0, _extends2.default)({
       type: plotType,
@@ -75,6 +79,7 @@ const SparkLineChart = exports.SparkLineChart = /*#__PURE__*/React.forwardRef(fu
     width: width,
     height: height,
     margin: margin,
+    className: className,
     xAxis: [(0, _extends2.default)({
       id: _constants.DEFAULT_X_AXIS_KEY,
       scaleType: plotType === 'bar' ? 'band' : 'point',
@@ -113,7 +118,7 @@ const SparkLineChart = exports.SparkLineChart = /*#__PURE__*/React.forwardRef(fu
       slotProps: slotProps,
       slots: slots
     })), children]
-  });
+  }));
 });
 process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
   // ----------------------------- Warning --------------------------------

package/context/CartesianProvider/CartesianProvider.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { AxisConfig, ChartsXAxisProps, ChartsYAxisProps, ScaleName } from '../../models/axis';
 import { DatasetType } from '../../models/seriesType/config';
-import { MakeOptional } from '../../models/helpers';
 import { ExtremumGettersConfig } from '../../models';
 export type CartesianContextProviderProps = {
     /**
@@ -9,13 +8,13 @@ export type CartesianContextProviderProps = {
      * If not provided, a default axis config is used.
      * An array of [[AxisConfig]] objects.
      */
-    xAxis?: MakeOptional<AxisConfig<ScaleName, any, ChartsXAxisProps>, 'id'>[];
+    xAxis: AxisConfig<ScaleName, any, ChartsXAxisProps>[];
     /**
      * The configuration of the y-axes.
      * If not provided, a default axis config is used.
      * An array of [[AxisConfig]] objects.
      */
-    yAxis?: MakeOptional<AxisConfig<ScaleName, any, ChartsYAxisProps>, 'id'>[];
+    yAxis: AxisConfig<ScaleName, any, ChartsYAxisProps>[];
     /**
      * An array of objects that can be used to populate series and axes data using their `dataKey` property.
      */

package/context/CartesianProvider/CartesianProvider.js

@@ -8,15 +8,14 @@ var React = _interopRequireWildcard(require("react"));
 var _useDrawingArea = require("../../hooks/useDrawingArea");
 var _useSeries = require("../../hooks/useSeries");
 var _CartesianContext = require("./CartesianContext");
-var _normalizeAxis = require("./normalizeAxis");
 var _computeValue = require("./computeValue");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function CartesianContextProvider(props) {
   const {
-    xAxis: inXAxis,
-    yAxis: inYAxis,
+    xAxis,
+    yAxis,
     dataset,
     xExtremumGetters,
     yExtremumGetters,
@@ -24,10 +23,22 @@ function CartesianContextProvider(props) {
   } = props;
   const formattedSeries = (0, _useSeries.useSeries)();
   const drawingArea = (0, _useDrawingArea.useDrawingArea)();
-  const xAxis = React.useMemo(() => (0, _normalizeAxis.normalizeAxis)(inXAxis, dataset, 'x'), [inXAxis, dataset]);
-  const yAxis = React.useMemo(() => (0, _normalizeAxis.normalizeAxis)(inYAxis, dataset, 'y'), [inYAxis, dataset]);
-  const xValues = React.useMemo(() => (0, _computeValue.computeValue)(drawingArea, formattedSeries, xAxis, xExtremumGetters, 'x'), [drawingArea, formattedSeries, xAxis, xExtremumGetters]);
-  const yValues = React.useMemo(() => (0, _computeValue.computeValue)(drawingArea, formattedSeries, yAxis, yExtremumGetters, 'y'), [drawingArea, formattedSeries, yAxis, yExtremumGetters]);
+  const xValues = React.useMemo(() => (0, _computeValue.computeValue)({
+    drawingArea,
+    formattedSeries,
+    axis: xAxis,
+    extremumGetters: xExtremumGetters,
+    dataset,
+    axisDirection: 'x'
+  }), [drawingArea, formattedSeries, xAxis, xExtremumGetters, dataset]);
+  const yValues = React.useMemo(() => (0, _computeValue.computeValue)({
+    drawingArea,
+    formattedSeries,
+    axis: yAxis,
+    extremumGetters: yExtremumGetters,
+    dataset,
+    axisDirection: 'y'
+  }), [drawingArea, formattedSeries, yAxis, yExtremumGetters, dataset]);
   const value = React.useMemo(() => ({
     isInitialized: true,
     data: {

package/context/CartesianProvider/computeValue.d.ts

@@ -1,19 +1,42 @@
 import { AxisConfig, ScaleName } from '../../models';
-import { ChartsXAxisProps, ChartsAxisProps, ChartsYAxisProps } from '../../models/axis';
-import { CartesianChartSeriesType, ExtremumGetter } from '../../models/seriesType/config';
+import { ChartsXAxisProps, ChartsAxisProps, ChartsYAxisProps, AxisId } from '../../models/axis';
+import { CartesianChartSeriesType, DatasetType, ExtremumGetter } from '../../models/seriesType/config';
 import { DefaultizedAxisConfig } from './CartesianContext';
 import { DrawingArea } from '../DrawingProvider';
 import { FormattedSeries } from '../SeriesContextProvider';
-import { MakeOptional } from '../../models/helpers';
-export declare function computeValue(drawingArea: DrawingArea, formattedSeries: FormattedSeries, axis: MakeOptional<AxisConfig<ScaleName, any, ChartsYAxisProps>, 'id'>[] | undefined, extremumGetters: {
-    [K in CartesianChartSeriesType]?: ExtremumGetter<K>;
-}, axisName: 'y', zoomRange?: [number, number]): {
+export declare function computeValue(options: {
+    drawingArea: DrawingArea;
+    formattedSeries: FormattedSeries;
+    axis: AxisConfig<ScaleName, any, ChartsYAxisProps>[] | undefined;
+    extremumGetters: {
+        [K in CartesianChartSeriesType]?: ExtremumGetter<K>;
+    };
+    axisDirection: 'y';
+    dataset: DatasetType | undefined;
+    zoomData?: {
+        axisId: AxisId;
+        start: number;
+        end: number;
+    }[];
+}): {
     axis: DefaultizedAxisConfig<ChartsYAxisProps>;
     axisIds: string[];
 };
-export declare function computeValue(drawingArea: DrawingArea, formattedSeries: FormattedSeries, inAxis: MakeOptional<AxisConfig<ScaleName, any, ChartsXAxisProps>, 'id'>[] | undefined, extremumGetters: {
-    [K in CartesianChartSeriesType]?: ExtremumGetter<K>;
-}, axisName: 'x', zoomRange?: [number, number]): {
+export declare function computeValue(options: {
+    drawingArea: DrawingArea;
+    formattedSeries: FormattedSeries;
+    axis: AxisConfig<ScaleName, any, ChartsXAxisProps>[] | undefined;
+    extremumGetters: {
+        [K in CartesianChartSeriesType]?: ExtremumGetter<K>;
+    };
+    axisDirection: 'x';
+    dataset: DatasetType | undefined;
+    zoomData?: {
+        axisId: AxisId;
+        start: number;
+        end: number;
+    }[];
+}): {
     axis: DefaultizedAxisConfig<ChartsAxisProps>;
     axisIds: string[];
 };

package/context/CartesianProvider/computeValue.js

@@ -7,14 +7,14 @@ Object.defineProperty(exports, "__esModule", {
 exports.computeValue = computeValue;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _d3Scale = require("d3-scale");
-var _constants = require("../../constants");
 var _axis = require("../../models/axis");
 var _colorScale = require("../../internals/colorScale");
 var _useTicks = require("../../hooks/useTicks");
 var _getScale = require("../../internals/getScale");
 var _getAxisExtremum = require("./getAxisExtremum");
-const getRange = (drawingArea, axisName, isReverse) => {
-  const range = axisName === 'x' ? [drawingArea.left, drawingArea.left + drawingArea.width] : [drawingArea.top + drawingArea.height, drawingArea.top];
+var _normalizeAxis = require("./normalizeAxis");
+const getRange = (drawingArea, axisDirection, isReverse) => {
+  const range = axisDirection === 'x' ? [drawingArea.left, drawingArea.left + drawingArea.width] : [drawingArea.top + drawingArea.height, drawingArea.top];
   return isReverse ? range.reverse() : range;
 };
 const zoomedScaleRange = (scaleRange, zoomRange) => {
@@ -36,26 +36,30 @@ function createDateFormatter(axis, range) {
 }
 const DEFAULT_CATEGORY_GAP_RATIO = 0.2;
 const DEFAULT_BAR_GAP_RATIO = 0.1;
-function computeValue(drawingArea, formattedSeries, inAxis, extremumGetters, axisName, zoomRange = [0, 100]) {
-  const DEFAULT_AXIS_KEY = axisName === 'x' ? _constants.DEFAULT_X_AXIS_KEY : _constants.DEFAULT_Y_AXIS_KEY;
-  const allAxis = [...(inAxis?.map((axis, index) => (0, _extends2.default)({
-    id: `defaultized-${axisName}-axis-${index}`
-  }, axis)) ?? []), ...(inAxis === undefined || inAxis.findIndex(({
-    id
-  }) => id === DEFAULT_AXIS_KEY) === -1 ? [{
-    id: DEFAULT_AXIS_KEY,
-    scaleType: 'linear'
-  }] : [])];
+function computeValue({
+  drawingArea,
+  formattedSeries,
+  axis: inAxis,
+  extremumGetters,
+  dataset,
+  axisDirection,
+  zoomData
+}) {
+  const allAxis = (0, _normalizeAxis.normalizeAxis)(inAxis, dataset, axisDirection);
   const completeAxis = {};
   allAxis.forEach((axis, axisIndex) => {
     const isDefaultAxis = axisIndex === 0;
     const [minData, maxData] = (0, _getAxisExtremum.getAxisExtremum)(axis, extremumGetters, isDefaultAxis, formattedSeries);
-    const range = getRange(drawingArea, axisName, axis.reverse);
+    const zoom = zoomData?.find(({
+      axisId
+    }) => axisId === axis.id);
+    const zoomRange = zoom ? [zoom.start, zoom.end] : [0, 100];
+    const range = getRange(drawingArea, axisDirection, axis.reverse);
     if ((0, _axis.isBandScaleConfig)(axis)) {
       const categoryGapRatio = axis.categoryGapRatio ?? DEFAULT_CATEGORY_GAP_RATIO;
       const barGapRatio = axis.barGapRatio ?? DEFAULT_BAR_GAP_RATIO;
       // Reverse range because ordinal scales are presented from top to bottom on y-axis
-      const scaleRange = axisName === 'x' ? range : [range[1], range[0]];
+      const scaleRange = axisDirection === 'x' ? range : [range[1], range[0]];
       const zoomedRange = zoomedScaleRange(scaleRange, zoomRange);
       completeAxis[axis.id] = (0, _extends2.default)({
         categoryGapRatio,
@@ -73,7 +77,7 @@ function computeValue(drawingArea, formattedSeries, inAxis, extremumGetters, axi
       }
     }
     if ((0, _axis.isPointScaleConfig)(axis)) {
-      const scaleRange = axisName === 'x' ? range : [...range].reverse();
+      const scaleRange = axisDirection === 'x' ? range : [...range].reverse();
       const zoomedRange = zoomedScaleRange(scaleRange, zoomRange);
       completeAxis[axis.id] = (0, _extends2.default)({}, axis, {
         scale: (0, _d3Scale.scalePoint)(axis.data, zoomedRange),

package/context/CartesianProvider/defaultizeAxis.d.ts

@@ -0,0 +1,36 @@
+import { MakeOptional } from '../../models/helpers';
+import { AxisConfig, ScaleName } from '../../models';
+import { ChartsAxisProps } from '../../models/axis';
+export declare const defaultizeAxis: (inAxis: MakeOptional<AxisConfig<ScaleName, any, ChartsAxisProps>, "id">[] | undefined, axisName: "x" | "y") => {
+    reverse?: boolean;
+    fill?: string;
+    stroke?: string;
+    data?: any[] | undefined;
+    label?: string;
+    max?: number | Date;
+    min?: number | Date;
+    classes?: Partial<import("../..").ChartsAxisClasses>;
+    slots?: Partial<import("../../models/axis").ChartsAxisSlots>;
+    slotProps?: Partial<import("../../models/axis").ChartsAxisSlotProps>;
+    dataKey?: string;
+    valueFormatter?: ((value: any, context: import("../../models/axis").AxisValueFormatterContext) => string) | undefined;
+    colorMap?: import("../../models/colorMapping").ContinuousColorConfig<number | Date> | import("../../models/colorMapping").PiecewiseColorConfig<number | Date> | import("../../models/colorMapping").OrdinalColorConfig<string | number | Date> | undefined;
+    tickMaxStep?: number;
+    tickMinStep?: number;
+    tickNumber?: number;
+    tickPlacement?: "start" | "end" | "middle" | "extremities";
+    tickLabelPlacement?: "middle" | "tick";
+    scaleType?: "linear" | "time" | "log" | "band" | "point" | "pow" | "sqrt" | "utc" | undefined;
+    axisId?: import("../../models/axis").AxisId;
+    disableLine?: boolean;
+    disableTicks?: boolean;
+    tickFontSize?: number;
+    tickLabelStyle?: import("../..").ChartsTextProps["style"];
+    labelStyle?: import("../..").ChartsTextProps["style"];
+    tickLabelInterval?: "auto" | ((value: any, index: number) => boolean);
+    labelFontSize?: number;
+    tickSize?: number;
+    tickInterval?: "auto" | ((value: any, index: number) => boolean) | any[];
+    hideTooltip?: boolean;
+    id: import("../../models/axis").AxisId;
+}[];

package/context/CartesianProvider/defaultizeAxis.js

@@ -0,0 +1,21 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultizeAxis = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _constants = require("../../constants");
+const defaultizeAxis = (inAxis, axisName) => {
+  const DEFAULT_AXIS_KEY = axisName === 'x' ? _constants.DEFAULT_X_AXIS_KEY : _constants.DEFAULT_Y_AXIS_KEY;
+  return [...(inAxis?.map((axis, index) => (0, _extends2.default)({
+    id: `defaultized-${axisName}-axis-${index}`
+  }, axis)) ?? []), ...(inAxis === undefined || inAxis.findIndex(({
+    id
+  }) => id === DEFAULT_AXIS_KEY) === -1 ? [{
+    id: DEFAULT_AXIS_KEY,
+    scaleType: 'linear'
+  }] : [])];
+};
+exports.defaultizeAxis = defaultizeAxis;

package/context/CartesianProvider/index.d.ts

@@ -4,6 +4,5 @@ export * from './CartesianContext';
 export * from './useCartesianContext';
 declare const cartesianProviderUtils: {
     computeValue: typeof computeValue;
-    normalizeAxis: <T extends import("../../internals").ChartsAxisProps, R extends import("../../internals").MakeOptional<import("../..").AxisConfig<import("../..").ScaleName, any, T>, "id">>(axis: R[] | undefined, dataset: import("../../internals").DatasetType | undefined, axisName: "x" | "y") => R[] | undefined;
 };
 export { cartesianProviderUtils };

package/context/CartesianProvider/index.js

@@ -8,7 +8,6 @@ var _exportNames = {
 };
 exports.cartesianProviderUtils = void 0;
 var _computeValue = require("./computeValue");
-var _normalizeAxis = require("./normalizeAxis");
 var _CartesianProvider = require("./CartesianProvider");
 Object.keys(_CartesianProvider).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -46,6 +45,5 @@ Object.keys(_useCartesianContext).forEach(function (key) {
   });
 });
 const cartesianProviderUtils = exports.cartesianProviderUtils = {
-  computeValue: _computeValue.computeValue,
-  normalizeAxis: _normalizeAxis.normalizeAxis
+  computeValue: _computeValue.computeValue
 };

package/context/CartesianProvider/normalizeAxis.d.ts

@@ -2,4 +2,4 @@ import type { AxisConfig, ScaleName } from '../../models';
 import { ChartsAxisProps } from '../../models/axis';
 import { MakeOptional } from '../../models/helpers';
 import { DatasetType } from '../../models/seriesType/config';
-export declare const normalizeAxis: <T extends ChartsAxisProps, R extends MakeOptional<AxisConfig<ScaleName, any, T>, "id">>(axis: R[] | undefined, dataset: DatasetType | undefined, axisName: "x" | "y") => R[] | undefined;
+export declare const normalizeAxis: <T extends ChartsAxisProps, R extends MakeOptional<AxisConfig<ScaleName, any, T>, "id">>(axis: R[] | undefined, dataset: DatasetType | undefined, axisName: "x" | "y") => R[];

package/context/CartesianProvider/normalizeAxis.js

@@ -18,6 +18,6 @@ const normalizeAxis = (axis, dataset, axisName) => {
     return (0, _extends2.default)({}, axisConfig, {
       data: dataset.map(d => d[dataKey])
     });
-  });
+  }) ?? [];
 };
 exports.normalizeAxis = normalizeAxis;

package/context/DrawingProvider.d.ts

@@ -33,6 +33,17 @@ export type DrawingArea = {
      * The height of the drawing area.
      */
     height: number;
+    /**
+     * Checks if a point is inside the drawing area.
+     * @param {Object} point The point to check.
+     * @param {number} point.x The x coordinate of the point.
+     * @param {number} point.y The y coordinate of the point.
+     * @returns {boolean} `true` if the point is inside the drawing area, `false` otherwise.
+     */
+    isPointInside: (point: {
+        x: number;
+        y: number;
+    }) => boolean;
 };
 export declare const DrawingContext: React.Context<DrawingArea & {
     /**

package/context/DrawingProvider.js

@@ -25,7 +25,8 @@ const DrawingContext = exports.DrawingContext = /*#__PURE__*/React.createContext
   right: 0,
   height: 300,
   width: 400,
-  chartId: ''
+  chartId: '',
+  isPointInside: () => false
 });
 if (process.env.NODE_ENV !== 'production') {
   DrawingContext.displayName = 'DrawingContext';
@@ -49,9 +50,15 @@ function DrawingProvider(props) {
   } = props;
   const drawingArea = (0, _useChartDimensions.default)(width, height, margin);
   const chartId = (0, _useId.default)();
+  const isPointInside = React.useCallback(({
+    x,
+    y
+  }) => x >= drawingArea.left && x <= drawingArea.left + drawingArea.width && y >= drawingArea.top && y <= drawingArea.top + drawingArea.height, [drawingArea]);
   const value = React.useMemo(() => (0, _extends2.default)({
     chartId: chartId ?? ''
-  }, drawingArea), [chartId, drawingArea]);
+  }, drawingArea, {
+    isPointInside
+  }), [chartId, drawingArea, isPointInside]);
   const refValue = React.useMemo(() => ({
     isInitialized: true,
     data: svgRef

package/context/HighlightedProvider/HighlightedProvider.js

@@ -24,11 +24,11 @@ const mergeDeprecatedOptions = options => {
       highlighted,
       faded
     } = _ref,
-    rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
+    other = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
   return (0, _extends2.default)({
     highlight: highlighted,
     fade: faded
-  }, rest);
+  }, other);
 };
 function HighlightedProvider({
   children,

package/esm/BarChart/BarChart.js

@@ -43,8 +43,8 @@ const BarChart = /*#__PURE__*/React.forwardRef(function BarChart(props, ref) {
     ref: ref
   }, chartContainerProps, {
     children: [props.onAxisClick && /*#__PURE__*/_jsx(ChartsOnAxisClickHandler, _extends({}, axisClickHandlerProps)), props.grid && /*#__PURE__*/_jsx(ChartsGrid, _extends({}, gridProps)), /*#__PURE__*/_jsxs("g", _extends({}, clipPathGroupProps, {
-      children: [/*#__PURE__*/_jsx(BarPlot, _extends({}, barPlotProps)), /*#__PURE__*/_jsx(ChartsOverlay, _extends({}, overlayProps))]
-    })), /*#__PURE__*/_jsx(ChartsAxis, _extends({}, chartsAxisProps)), /*#__PURE__*/_jsx(ChartsLegend, _extends({}, legendProps)), /*#__PURE__*/_jsx(ChartsAxisHighlight, _extends({}, axisHighlightProps)), !props.loading && /*#__PURE__*/_jsx(ChartsTooltip, _extends({}, tooltipProps)), /*#__PURE__*/_jsx(ChartsClipPath, _extends({}, clipPathProps)), children]
+      children: [/*#__PURE__*/_jsx(BarPlot, _extends({}, barPlotProps)), /*#__PURE__*/_jsx(ChartsOverlay, _extends({}, overlayProps)), /*#__PURE__*/_jsx(ChartsAxisHighlight, _extends({}, axisHighlightProps))]
+    })), /*#__PURE__*/_jsx(ChartsAxis, _extends({}, chartsAxisProps)), /*#__PURE__*/_jsx(ChartsLegend, _extends({}, legendProps)), !props.loading && /*#__PURE__*/_jsx(ChartsTooltip, _extends({}, tooltipProps)), /*#__PURE__*/_jsx(ChartsClipPath, _extends({}, clipPathProps)), children]
   }));
 });
 process.env.NODE_ENV !== "production" ? BarChart.propTypes = {

package/esm/BarChart/formatter.js

@@ -52,7 +52,7 @@ const formatter = (params, dataset) => {
           if (typeof value !== 'number') {
             if (process.env.NODE_ENV !== 'production' && !warnOnce && value !== null) {
               warnOnce = true;
-              console.error([`MUI-X charts: your dataset key "${dataKey}" is used for plotting bars, but contains nonnumerical elements.`, 'Bar plots only support numbers and null values.']);
+              console.error([`MUI X charts: your dataset key "${dataKey}" is used for plotting bars, but contains nonnumerical elements.`, 'Bar plots only support numbers and null values.']);
             }
             return 0;
           }