@mui/x-charts 8.15.0 → 8.16.0

package/esm/LineChart/LineChart.plugins.d.ts

@@ -5,5 +5,5 @@ import { UseChartHighlightSignature } from "../internals/plugins/featurePlugins/
 import { UseChartKeyboardNavigationSignature } from "../internals/plugins/featurePlugins/useChartKeyboardNavigation/index.js";
 import { ConvertSignaturesIntoPlugins } from "../internals/plugins/models/helpers.js";
 import { UseChartBrushSignature } from "../internals/plugins/featurePlugins/useChartBrush/index.js";
-export type LineChartPluginSignatures = [UseChartZAxisSignature, UseChartBrushSignature, UseChartCartesianAxisSignature<'line'>, UseChartInteractionSignature, UseChartHighlightSignature, UseChartKeyboardNavigationSignature];
+export type LineChartPluginSignatures = [UseChartZAxisSignature, UseChartBrushSignature, UseChartInteractionSignature, UseChartCartesianAxisSignature<'line'>, UseChartHighlightSignature, UseChartKeyboardNavigationSignature];
 export declare const LINE_CHART_PLUGINS: ConvertSignaturesIntoPlugins<LineChartPluginSignatures>;

package/esm/LineChart/LineChart.plugins.js

@@ -4,4 +4,4 @@ import { useChartInteraction } from "../internals/plugins/featurePlugins/useChar
 import { useChartHighlight } from "../internals/plugins/featurePlugins/useChartHighlight/index.js";
 import { useChartKeyboardNavigation } from "../internals/plugins/featurePlugins/useChartKeyboardNavigation/index.js";
 import { useChartBrush } from "../internals/plugins/featurePlugins/useChartBrush/index.js";
-export const LINE_CHART_PLUGINS = [useChartZAxis, useChartBrush, useChartCartesianAxis, useChartInteraction, useChartHighlight, useChartKeyboardNavigation];
+export const LINE_CHART_PLUGINS = [useChartZAxis, useChartBrush, useChartInteraction, useChartCartesianAxis, useChartHighlight, useChartKeyboardNavigation];

package/esm/LineChart/seriesConfig/getSeriesWithDefaultValues.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 const getSeriesWithDefaultValues = (seriesData, seriesIndex, colors) => {
-  return _extends({
+  return _extends({}, seriesData, {
     id: seriesData.id ?? `auto-generated-id-${seriesIndex}`,
-    color: colors[seriesIndex % colors.length]
-  }, seriesData);
+    color: seriesData.color ?? colors[seriesIndex % colors.length]
+  });
 };
 export default getSeriesWithDefaultValues;

package/esm/LineChart/seriesConfig/index.js

@@ -4,11 +4,13 @@ import getColor from "./getColor.js";
 import legendGetter from "./legend.js";
 import tooltipGetter, { axisTooltipGetter } from "./tooltip.js";
 import getSeriesWithDefaultValues from "./getSeriesWithDefaultValues.js";
+import tooltipItemPositionGetter from "./tooltipPosition.js";
 export const seriesConfig = {
   colorProcessor: getColor,
   seriesProcessor,
   legendGetter,
   tooltipGetter,
+  tooltipItemPositionGetter,
   axisTooltipGetter,
   xExtremumGetter: getExtremumX,
   yExtremumGetter: getExtremumY,

package/esm/LineChart/seriesConfig/tooltipPosition.d.ts

@@ -0,0 +1,3 @@
+import type { TooltipItemPositionGetter } from "../../internals/plugins/models/seriesConfig/tooltipItemPositionGetter.types.js";
+declare const tooltipItemPositionGetter: TooltipItemPositionGetter<'line'>;
+export default tooltipItemPositionGetter;

package/esm/LineChart/seriesConfig/tooltipPosition.js

@@ -0,0 +1,27 @@
+const tooltipItemPositionGetter = params => {
+  const {
+    series,
+    identifier,
+    axesConfig
+  } = params;
+  if (!identifier || identifier.dataIndex === undefined) {
+    return null;
+  }
+  const itemSeries = series.line?.series[identifier.seriesId];
+  if (itemSeries == null) {
+    return null;
+  }
+  if (axesConfig.x === undefined || axesConfig.y === undefined) {
+    return null;
+  }
+  const xValue = axesConfig.x.data?.[identifier.dataIndex];
+  const yValue = itemSeries.data[identifier.dataIndex];
+  if (xValue == null || yValue == null) {
+    return null;
+  }
+  return {
+    x: axesConfig.x.scale(xValue),
+    y: axesConfig.y.scale(yValue)
+  };
+};
+export default tooltipItemPositionGetter;

package/esm/PieChart/seriesConfig/getSeriesWithDefaultValues.js

@@ -1,11 +1,10 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 const getSeriesWithDefaultValues = (seriesData, seriesIndex, colors) => {
-  return _extends({
-    id: seriesData.id ?? `auto-generated-id-${seriesIndex}`
-  }, seriesData, {
-    data: seriesData.data.map((d, index) => _extends({
-      color: colors[index % colors.length]
-    }, d))
+  return _extends({}, seriesData, {
+    id: seriesData.id ?? `auto-generated-id-${seriesIndex}`,
+    data: seriesData.data.map((d, index) => _extends({}, d, {
+      color: d.color ?? colors[index % colors.length]
+    }))
   });
 };
 export default getSeriesWithDefaultValues;

package/esm/PieChart/seriesConfig/index.js

@@ -3,10 +3,12 @@ import getColor from "./getColor.js";
 import legendGetter from "./legend.js";
 import tooltipGetter from "./tooltip.js";
 import getSeriesWithDefaultValues from "./getSeriesWithDefaultValues.js";
+import tooltipItemPositionGetter from "./tooltipPosition.js";
 export const seriesConfig = {
   colorProcessor: getColor,
   seriesProcessor,
   legendGetter,
   tooltipGetter,
+  tooltipItemPositionGetter,
   getSeriesWithDefaultValues
 };

package/esm/PieChart/seriesConfig/seriesProcessor.js

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import { pie as d3Pie } from '@mui/x-charts-vendor/d3-shape';
 import { getLabel } from "../../internals/getLabel.js";
+import { deg2rad } from "../../internals/angleConversion.js";
 const getSortingComparator = (comparator = 'none') => {
   if (typeof comparator === 'function') {
     return comparator;
@@ -23,7 +24,7 @@ const seriesProcessor = params => {
   } = params;
   const defaultizedSeries = {};
   seriesOrder.forEach(seriesId => {
-    const arcs = d3Pie().startAngle(2 * Math.PI * (series[seriesId].startAngle ?? 0) / 360).endAngle(2 * Math.PI * (series[seriesId].endAngle ?? 360) / 360).padAngle(2 * Math.PI * (series[seriesId].paddingAngle ?? 0) / 360).sortValues(getSortingComparator(series[seriesId].sortingValues ?? 'none'))(series[seriesId].data.map(piePoint => piePoint.value));
+    const arcs = d3Pie().startAngle(deg2rad(series[seriesId].startAngle ?? 0)).endAngle(deg2rad(series[seriesId].endAngle ?? 360)).padAngle(deg2rad(series[seriesId].paddingAngle ?? 0)).sortValues(getSortingComparator(series[seriesId].sortingValues ?? 'none'))(series[seriesId].data.map(piePoint => piePoint.value));
     defaultizedSeries[seriesId] = _extends({
       labelMarkType: 'circle',
       valueFormatter: item => item.value.toLocaleString()

package/esm/PieChart/seriesConfig/tooltipPosition.d.ts

@@ -0,0 +1,3 @@
+import type { TooltipItemPositionGetter } from "../../internals/plugins/models/seriesConfig/tooltipItemPositionGetter.types.js";
+declare const tooltipItemPositionGetter: TooltipItemPositionGetter<'pie'>;
+export default tooltipItemPositionGetter;

package/esm/PieChart/seriesConfig/tooltipPosition.js

@@ -0,0 +1,69 @@
+import { findMinMax } from "../../internals/findMinMax.js";
+import { getPercentageValue } from "../../internals/getPercentageValue.js";
+import { getPieCoordinates } from "../getPieCoordinates.js";
+const tooltipItemPositionGetter = params => {
+  const {
+    series,
+    drawingArea,
+    identifier,
+    placement
+  } = params;
+  if (!identifier || identifier.dataIndex === undefined) {
+    return null;
+  }
+  const itemSeries = series.pie?.series[identifier.seriesId];
+  if (itemSeries == null) {
+    return null;
+  }
+  const {
+    cx,
+    cy,
+    availableRadius
+  } = getPieCoordinates({
+    cx: itemSeries.cx,
+    cy: itemSeries.cy
+  }, drawingArea);
+  const {
+    data,
+    innerRadius: baseInnerRadius = 0,
+    outerRadius: baseOuterRadius
+  } = itemSeries;
+  const innerRadius = Math.max(0, getPercentageValue(baseInnerRadius ?? 0, availableRadius));
+  const outerRadius = Math.max(0, getPercentageValue(baseOuterRadius ?? availableRadius, availableRadius));
+  const dataItem = data[identifier.dataIndex];
+  if (!dataItem) {
+    return null;
+  }
+
+  // Compute the 4 corner points of the arc to get the bounding box.
+  const points = [[innerRadius, dataItem.startAngle], [innerRadius, dataItem.endAngle], [outerRadius, dataItem.startAngle], [outerRadius, dataItem.endAngle]].map(([radius, angle]) => ({
+    x: cx + radius * Math.sin(angle),
+    y: cy - radius * Math.cos(angle)
+  }));
+  const [x0, x1] = findMinMax(points.map(p => p.x));
+  const [y0, y1] = findMinMax(points.map(p => p.y));
+  switch (placement) {
+    case 'bottom':
+      return {
+        x: (x1 + x0) / 2,
+        y: y1
+      };
+    case 'left':
+      return {
+        x: x0,
+        y: (y1 + y0) / 2
+      };
+    case 'right':
+      return {
+        x: x1,
+        y: (y1 + y0) / 2
+      };
+    case 'top':
+    default:
+      return {
+        x: (x1 + x0) / 2,
+        y: y0
+      };
+  }
+};
+export default tooltipItemPositionGetter;

package/esm/RadarChart/RadarChart.plugins.d.ts

@@ -1,5 +1,5 @@
 import { UseChartPolarAxisSignature } from "../internals/plugins/featurePlugins/useChartPolarAxis/index.js";
 import { UseChartInteractionSignature } from "../internals/plugins/featurePlugins/useChartInteraction/index.js";
 import { UseChartHighlightSignature } from "../internals/plugins/featurePlugins/useChartHighlight/index.js";
-export declare const RADAR_PLUGINS: readonly [import("../internals/index.js").ChartPlugin<UseChartPolarAxisSignature<any>>, import("../internals/index.js").ChartPlugin<UseChartInteractionSignature>, import("../internals/index.js").ChartPlugin<UseChartHighlightSignature>];
-export type RadarChartPluginSignatures = [UseChartPolarAxisSignature, UseChartInteractionSignature, UseChartHighlightSignature];
+export declare const RADAR_PLUGINS: readonly [import("../internals/index.js").ChartPlugin<UseChartInteractionSignature>, import("../internals/index.js").ChartPlugin<UseChartPolarAxisSignature<any>>, import("../internals/index.js").ChartPlugin<UseChartHighlightSignature>];
+export type RadarChartPluginSignatures = [UseChartInteractionSignature, UseChartPolarAxisSignature, UseChartHighlightSignature];

package/esm/RadarChart/RadarChart.plugins.js

@@ -1,4 +1,4 @@
 import { useChartPolarAxis } from "../internals/plugins/featurePlugins/useChartPolarAxis/index.js";
 import { useChartInteraction } from "../internals/plugins/featurePlugins/useChartInteraction/index.js";
 import { useChartHighlight } from "../internals/plugins/featurePlugins/useChartHighlight/index.js";
-export const RADAR_PLUGINS = [useChartPolarAxis, useChartInteraction, useChartHighlight];
+export const RADAR_PLUGINS = [useChartInteraction, useChartPolarAxis, useChartHighlight];

package/esm/RadarChart/RadarSeriesPlot/useRadarSeriesData.d.ts

@@ -17,8 +17,8 @@ export declare function useRadarSeriesData(querySeriesId?: SeriesId): {
   }[];
   type: "radar";
   label?: string | ((location: "tooltip" | "legend") => string) | undefined;
-  highlightScope?: import("../../index.js").HighlightScope | undefined;
   labelMarkType?: import("../../internals/index.js").ChartsLabelMarkType | undefined;
+  highlightScope?: import("../../index.js").HighlightScope | undefined;
   hideMark?: boolean | undefined;
   fillArea?: boolean | undefined;
   data: number[];

package/esm/RadarChart/seriesConfig/getSeriesWithDefaultValues.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 const getSeriesWithDefaultValues = (seriesData, seriesIndex, colors) => {
-  return _extends({
+  return _extends({}, seriesData, {
     id: seriesData.id ?? `auto-generated-id-${seriesIndex}`,
-    color: colors[seriesIndex % colors.length]
-  }, seriesData);
+    color: seriesData.color ?? colors[seriesIndex % colors.length]
+  });
 };
 export default getSeriesWithDefaultValues;

package/esm/ScatterChart/ScatterChart.plugins.d.ts

@@ -6,5 +6,5 @@ import { ConvertSignaturesIntoPlugins } from "../internals/plugins/models/helper
 import { UseChartClosestPointSignature } from "../internals/plugins/featurePlugins/useChartClosestPoint/index.js";
 import { UseChartKeyboardNavigationSignature } from "../internals/plugins/featurePlugins/useChartKeyboardNavigation/index.js";
 import { UseChartBrushSignature } from "../internals/plugins/featurePlugins/useChartBrush/index.js";
-export type ScatterChartPluginSignatures = [UseChartZAxisSignature, UseChartBrushSignature, UseChartCartesianAxisSignature<'scatter'>, UseChartInteractionSignature, UseChartHighlightSignature, UseChartClosestPointSignature, UseChartKeyboardNavigationSignature];
+export type ScatterChartPluginSignatures = [UseChartZAxisSignature, UseChartBrushSignature, UseChartInteractionSignature, UseChartCartesianAxisSignature<'scatter'>, UseChartHighlightSignature, UseChartClosestPointSignature, UseChartKeyboardNavigationSignature];
 export declare const SCATTER_CHART_PLUGINS: ConvertSignaturesIntoPlugins<ScatterChartPluginSignatures>;

package/esm/ScatterChart/ScatterChart.plugins.js

@@ -5,4 +5,4 @@ import { useChartHighlight } from "../internals/plugins/featurePlugins/useChartH
 import { useChartClosestPoint } from "../internals/plugins/featurePlugins/useChartClosestPoint/index.js";
 import { useChartKeyboardNavigation } from "../internals/plugins/featurePlugins/useChartKeyboardNavigation/index.js";
 import { useChartBrush } from "../internals/plugins/featurePlugins/useChartBrush/index.js";
-export const SCATTER_CHART_PLUGINS = [useChartZAxis, useChartBrush, useChartCartesianAxis, useChartInteraction, useChartHighlight, useChartClosestPoint, useChartKeyboardNavigation];
+export const SCATTER_CHART_PLUGINS = [useChartZAxis, useChartBrush, useChartInteraction, useChartCartesianAxis, useChartHighlight, useChartClosestPoint, useChartKeyboardNavigation];

package/esm/ScatterChart/seriesConfig/getSeriesWithDefaultValues.js

@@ -1,8 +1,8 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 const getSeriesWithDefaultValues = (seriesData, seriesIndex, colors) => {
-  return _extends({
+  return _extends({}, seriesData, {
     id: seriesData.id ?? `auto-generated-id-${seriesIndex}`,
-    color: colors[seriesIndex % colors.length]
-  }, seriesData);
+    color: seriesData.color ?? colors[seriesIndex % colors.length]
+  });
 };
 export default getSeriesWithDefaultValues;

package/esm/ScatterChart/seriesConfig/index.js

@@ -4,11 +4,13 @@ import getColor from "./getColor.js";
 import legendGetter from "./legend.js";
 import tooltipGetter from "./tooltip.js";
 import getSeriesWithDefaultValues from "./getSeriesWithDefaultValues.js";
+import tooltipItemPositionGetter from "./tooltipPosition.js";
 export const seriesConfig = {
   seriesProcessor,
   colorProcessor: getColor,
   legendGetter,
   tooltipGetter,
+  tooltipItemPositionGetter,
   xExtremumGetter: getExtremumX,
   yExtremumGetter: getExtremumY,
   getSeriesWithDefaultValues

package/esm/ScatterChart/seriesConfig/tooltipPosition.d.ts

@@ -0,0 +1,3 @@
+import type { TooltipItemPositionGetter } from "../../internals/plugins/models/seriesConfig/tooltipItemPositionGetter.types.js";
+declare const tooltipItemPositionGetter: TooltipItemPositionGetter<'scatter'>;
+export default tooltipItemPositionGetter;

package/esm/ScatterChart/seriesConfig/tooltipPosition.js

@@ -0,0 +1,27 @@
+const tooltipItemPositionGetter = params => {
+  const {
+    series,
+    identifier,
+    axesConfig
+  } = params;
+  if (!identifier || identifier.dataIndex === undefined) {
+    return null;
+  }
+  const itemSeries = series.scatter?.series[identifier.seriesId];
+  if (itemSeries == null) {
+    return null;
+  }
+  if (axesConfig.x === undefined || axesConfig.y === undefined) {
+    return null;
+  }
+  const xValue = itemSeries.data?.[identifier.dataIndex].x;
+  const yValue = itemSeries.data?.[identifier.dataIndex].y;
+  if (xValue == null || yValue == null) {
+    return null;
+  }
+  return {
+    x: axesConfig.x.scale(xValue),
+    y: axesConfig.y.scale(yValue)
+  };
+};
+export default tooltipItemPositionGetter;

package/esm/context/ChartProvider/ChartProvider.js

@@ -21,7 +21,7 @@ export const defaultSeriesConfig = {
 
 // For consistency with the v7, the cartesian axes are set by default.
 // To remove them, you can provide a `plugins` props.
-const defaultPlugins = [useChartZAxis, useChartCartesianAxis, useChartInteraction, useChartHighlight];
+const defaultPlugins = [useChartZAxis, useChartInteraction, useChartCartesianAxis, useChartHighlight];
 function ChartProvider(props) {
   const {
     children,

package/esm/hooks/useFocusedItem.d.ts

@@ -9,7 +9,7 @@ export type FocusedItemData = {
  * Get the focused item from keyboard navigation.
  */
 export declare function useFocusedItem(): {
-  seriesType: keyof import("../internals/index.js").ChartsSeriesConfig;
+  seriesType: "line" | "bar" | "scatter" | "pie";
   seriesId: SeriesId;
   dataIndex: number;
 } | null;

package/esm/hooks/useInteractionItemProps.js

@@ -15,7 +15,9 @@ export const useInteractionItemProps = (data, skip) => {
   const interactionActive = React.useRef(false);
   const onPointerEnter = useEventCallback(() => {
     interactionActive.current = true;
-    instance.setItemInteraction(data);
+    instance.setItemInteraction(data, {
+      interaction: 'pointer'
+    });
     instance.setHighlight(data);
   });
   const onPointerLeave = useEventCallback(() => {
@@ -56,7 +58,9 @@ export function getInteractionItemProps(instance, item) {
     if (!item) {
       return;
     }
-    instance.setItemInteraction(item);
+    instance.setItemInteraction(item, {
+      interaction: 'pointer'
+    });
     instance.setHighlight(item);
   }
   function onPointerLeave() {

package/esm/index.js

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

package/esm/internals/configInit.d.ts

@@ -3,7 +3,7 @@ declare class CartesianSeriesTypes {
   types: Set<CartesianChartSeriesType>;
   constructor();
   addType(value: CartesianChartSeriesType): void;
-  getTypes(): Set<"line" | "scatter" | "bar">;
+  getTypes(): Set<"line" | "bar" | "scatter">;
 }
 declare class PolarSeriesTypes {
   types: Set<PolarChartSeriesType>;

package/esm/internals/getScale.js

@@ -1,5 +1,5 @@
 import { scaleLog, scalePow, scaleSqrt, scaleTime, scaleUtc, scaleLinear } from '@mui/x-charts-vendor/d3-scale';
-import { scaleSymlog } from "./symlogScale.js";
+import { scaleSymlog } from "./scales/index.js";
 export function getScale(scaleType, domain, range) {
   switch (scaleType) {
     case 'log':

package/esm/internals/index.d.ts

@@ -66,4 +66,5 @@ export * from "../models/axis.js";
 export * from "./plugins/models/index.js";
 export * from "./material/index.js";
 export * from "./createSvgIcon.js";
-export * from "./constants.js";
+export * from "./constants.js";
+export * from "./scales/index.js";

package/esm/internals/index.js

@@ -80,4 +80,5 @@ export * from "../models/axis.js";
 export * from "./plugins/models/index.js";
 export * from "./material/index.js";
 export * from "./createSvgIcon.js";
-export * from "./constants.js";
+export * from "./constants.js";
+export * from "./scales/index.js";

package/esm/internals/isCartesian.d.ts

@@ -1,2 +1,3 @@
-import { CartesianChartSeriesType } from "../models/seriesType/config.js";
-export declare function isCartesianSeriesType(seriesType: string): seriesType is CartesianChartSeriesType;
+import { CartesianChartSeriesType, ChartSeriesDefaultized, ChartSeriesType } from "../models/seriesType/config.js";
+export declare function isCartesianSeriesType(seriesType: string): seriesType is CartesianChartSeriesType;
+export declare function isCartesianSeries(series: ChartSeriesDefaultized<ChartSeriesType>): series is ChartSeriesDefaultized<CartesianChartSeriesType>;

package/esm/internals/isCartesian.js

@@ -1,4 +1,7 @@
 import { cartesianSeriesTypes } from "./configInit.js";
 export function isCartesianSeriesType(seriesType) {
   return cartesianSeriesTypes.getTypes().has(seriesType);
+}
+export function isCartesianSeries(series) {
+  return isCartesianSeriesType(series.type);
 }

package/esm/internals/plugins/allPlugins.d.ts

@@ -8,5 +8,5 @@ import { UseChartClosestPointSignature } from "./featurePlugins/useChartClosestP
 import { UseChartZAxisSignature } from "./featurePlugins/useChartZAxis/index.js";
 import { UseChartBrushSignature } from "./featurePlugins/useChartBrush/index.js";
 export type AllPluginSignatures<TSeries extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartCartesianAxisSignature<TSeries>, UseChartPolarAxisSignature, UseChartInteractionSignature, UseChartHighlightSignature, UseChartClosestPointSignature, UseChartKeyboardNavigationSignature];
-export type DefaultPluginSignatures<TSeries extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartCartesianAxisSignature<TSeries>, UseChartInteractionSignature, UseChartHighlightSignature, UseChartClosestPointSignature, UseChartKeyboardNavigationSignature];
-export declare const DEFAULT_PLUGINS: readonly [import("./models/index.js").ChartPlugin<UseChartZAxisSignature>, import("./models/index.js").ChartPlugin<UseChartBrushSignature>, import("./models/index.js").ChartPlugin<UseChartCartesianAxisSignature<any>>, import("./models/index.js").ChartPlugin<UseChartInteractionSignature>, import("./models/index.js").ChartPlugin<UseChartHighlightSignature>, import("./models/index.js").ChartPlugin<UseChartClosestPointSignature>, import("./models/index.js").ChartPlugin<UseChartKeyboardNavigationSignature>];
+export type DefaultPluginSignatures<TSeries extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartInteractionSignature, UseChartCartesianAxisSignature<TSeries>, UseChartHighlightSignature, UseChartClosestPointSignature, UseChartKeyboardNavigationSignature];
+export declare const DEFAULT_PLUGINS: readonly [import("./models/index.js").ChartPlugin<UseChartZAxisSignature>, import("./models/index.js").ChartPlugin<UseChartBrushSignature>, import("./models/index.js").ChartPlugin<UseChartInteractionSignature>, import("./models/index.js").ChartPlugin<UseChartCartesianAxisSignature<any>>, import("./models/index.js").ChartPlugin<UseChartHighlightSignature>, import("./models/index.js").ChartPlugin<UseChartClosestPointSignature>, import("./models/index.js").ChartPlugin<UseChartKeyboardNavigationSignature>];

package/esm/internals/plugins/allPlugins.js

@@ -7,4 +7,4 @@ import { useChartKeyboardNavigation } from "./featurePlugins/useChartKeyboardNav
 import { useChartClosestPoint } from "./featurePlugins/useChartClosestPoint/index.js";
 import { useChartZAxis } from "./featurePlugins/useChartZAxis/index.js";
 import { useChartBrush } from "./featurePlugins/useChartBrush/index.js";
-export const DEFAULT_PLUGINS = [useChartZAxis, useChartBrush, useChartCartesianAxis, useChartInteraction, useChartHighlight, useChartClosestPoint, useChartKeyboardNavigation];
+export const DEFAULT_PLUGINS = [useChartZAxis, useChartBrush, useChartInteraction, useChartCartesianAxis, useChartHighlight, useChartClosestPoint, useChartKeyboardNavigation];

package/esm/internals/plugins/corePlugins/useChartInteractionListener/useChartInteractionListener.js

@@ -53,6 +53,9 @@ export const useChartInteractionListener = ({
           name: 'zoomPressAndDrag',
           dragThreshold: 10,
           preventIf: ['zoomPinch']
+        }), new TapGesture({
+          name: 'zoomDoubleTapReset',
+          taps: 2
         })]
       });
     }
@@ -62,7 +65,7 @@ export const useChartInteractionListener = ({
     if (!svg || !gestureManager) {
       return undefined;
     }
-    gestureManager.registerElement(['pan', 'move', 'zoomPinch', 'zoomPan', 'zoomTurnWheel', 'tap', 'quickPress', 'zoomTapAndDrag', 'zoomPressAndDrag', 'brush'], svg);
+    gestureManager.registerElement(['pan', 'move', 'zoomPinch', 'zoomPan', 'zoomTurnWheel', 'tap', 'quickPress', 'zoomTapAndDrag', 'zoomPressAndDrag', 'zoomDoubleTapReset', 'brush'], svg);
     return () => {
       // Cleanup gesture manager
       gestureManager.unregisterAllGestures(svg);

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

@@ -1,6 +1,6 @@
-import { MoveEvent, PanEvent, PanGestureOptions, PinchEvent, PinchGestureOptions, PressEvent, TapEvent, TurnWheelEvent, type PressAndDragEvent, type PressAndDragGestureOptions, type TapAndDragEvent, type TapAndDragGestureOptions, type TurnWheelGestureOptions } from '@mui/x-internal-gestures/core';
+import { MoveEvent, PanEvent, PanGestureOptions, PinchEvent, PinchGestureOptions, PressEvent, TapEvent, TurnWheelEvent, type PressAndDragEvent, type PressAndDragGestureOptions, type TapAndDragEvent, type TapAndDragGestureOptions, type TapGestureOptions, type TurnWheelGestureOptions } from '@mui/x-internal-gestures/core';
 import { ChartPluginSignature } from "../../models/index.js";
-export type ChartInteraction = 'pan' | 'panStart' | 'panEnd' | 'zoomPan' | 'zoomPanStart' | 'zoomPanEnd' | 'zoomPinch' | 'zoomPinchStart' | 'zoomPinchEnd' | 'zoomTurnWheel' | 'zoomTapAndDrag' | 'zoomTapAndDragStart' | 'zoomTapAndDragEnd' | 'zoomPressAndDrag' | 'zoomPressAndDragStart' | 'zoomPressAndDragEnd' | 'move' | 'moveStart' | 'moveEnd' | 'tap' | 'quickPress' | 'quickPressEnd' | 'brush' | 'brushStart' | 'brushCancel' | 'brushEnd';
+export type ChartInteraction = 'pan' | 'panStart' | 'panEnd' | 'zoomPan' | 'zoomPanStart' | 'zoomPanEnd' | 'zoomPinch' | 'zoomPinchStart' | 'zoomPinchEnd' | 'zoomTurnWheel' | 'zoomTapAndDrag' | 'zoomTapAndDragStart' | 'zoomTapAndDragEnd' | 'zoomPressAndDrag' | 'zoomPressAndDragStart' | 'zoomPressAndDragEnd' | 'move' | 'moveStart' | 'moveEnd' | 'tap' | 'quickPress' | 'quickPressEnd' | 'zoomDoubleTapReset' | 'brush' | 'brushStart' | 'brushCancel' | 'brushEnd';
 export type InteractionListenerResult = {
   cleanup: () => void;
 };
@@ -9,7 +9,7 @@ export type AddInteractionListener = {
   <CustomData extends Record<string, unknown> = Record<string, unknown>>(interaction: 'zoomPinch' | 'zoomPinchStart' | 'zoomPinchEnd', callback: (event: PinchEvent<CustomData>) => void, options?: boolean | AddEventListenerOptions): InteractionListenerResult;
   <CustomData extends Record<string, unknown> = Record<string, unknown>>(interaction: 'zoomTurnWheel', callback: (event: TurnWheelEvent<CustomData>) => void, options?: boolean | AddEventListenerOptions): InteractionListenerResult;
   <CustomData extends Record<string, unknown> = Record<string, unknown>>(interaction: 'move' | 'moveStart' | 'moveEnd', callback: (event: MoveEvent<CustomData>) => void, options?: boolean | AddEventListenerOptions): InteractionListenerResult;
-  <CustomData extends Record<string, unknown> = Record<string, unknown>>(interaction: 'tap', callback: (event: TapEvent<CustomData>) => void, options?: boolean | AddEventListenerOptions): InteractionListenerResult;
+  <CustomData extends Record<string, unknown> = Record<string, unknown>>(interaction: 'tap' | 'zoomDoubleTapReset', callback: (event: TapEvent<CustomData>) => void, options?: boolean | AddEventListenerOptions): InteractionListenerResult;
   <CustomData extends Record<string, unknown> = Record<string, unknown>>(interaction: 'quickPress' | 'quickPressEnd', callback: (event: PressEvent<CustomData>) => void, options?: boolean | AddEventListenerOptions): InteractionListenerResult;
   <CustomData extends Record<string, unknown> = Record<string, unknown>>(interaction: 'zoomTapAndDrag' | 'zoomTapAndDragStart' | 'zoomTapAndDragEnd', callback: (event: TapAndDragEvent<CustomData>) => void, options?: boolean | AddEventListenerOptions): InteractionListenerResult;
   <CustomData extends Record<string, unknown> = Record<string, unknown>>(interaction: 'zoomPressAndDrag' | 'zoomPressAndDragStart' | 'zoomPressAndDragEnd', callback: (event: PressAndDragEvent<CustomData>) => void, options?: boolean | AddEventListenerOptions): InteractionListenerResult;
@@ -20,6 +20,8 @@ export type UpdateZoomInteractionListeners = {
   (interaction: 'zoomTurnWheel', options?: Omit<TurnWheelGestureOptions<'zoomTurnWheel'>, 'name'>): void;
   (interaction: 'zoomTapAndDrag', options?: Omit<TapAndDragGestureOptions<'zoomTapAndDrag'>, 'name'>): void;
   (interaction: 'zoomPressAndDrag', options?: Omit<PressAndDragGestureOptions<'zoomPressAndDrag'>, 'name'>): void;
+  (interaction: 'zoomDoubleTapReset', options?: Omit<TapGestureOptions<'zoomDoubleTapReset'>, 'name'>): void;
+  (interaction: 'brush', options?: Omit<PanGestureOptions<'brush'>, 'name'>): void;
 };
 export interface UseChartInteractionListenerParameters {}
 export interface UseChartInteractionListenerState {}

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

@@ -5,12 +5,15 @@ import useEventCallback from '@mui/utils/useEventCallback';
 import * as React from 'react';
 import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
 import { getSVGPoint } from "../../../getSVGPoint.js";
+import { useSelector } from "../../../store/useSelector.js";
+import { selectorIsBrushEnabled } from "./useChartBrush.selectors.js";
 export const useChartBrush = ({
   store,
   svgRef,
   instance,
   params
 }) => {
+  const isEnabled = useSelector(store, selectorIsBrushEnabled);
   useEnhancedEffect(() => {
     store.update(prev => {
       return _extends({}, prev, {
@@ -42,9 +45,21 @@ export const useChartBrush = ({
       });
     });
   });
+  const setZoomBrushEnabled = useEventCallback(function setZoomBrushEnabled(enabled) {
+    store.update(prev => {
+      if (prev.brush.isZoomBrushEnabled === enabled) {
+        return prev;
+      }
+      return _extends({}, prev, {
+        brush: _extends({}, prev.brush, {
+          isZoomBrushEnabled: enabled
+        })
+      });
+    });
+  });
   React.useEffect(() => {
     const element = svgRef.current;
-    if (element === null || !store.getSnapshot().brush.enabled) {
+    if (element === null || !isEnabled) {
       return () => {};
     }
     const handleBrushStart = event => {
@@ -74,11 +89,12 @@ export const useChartBrush = ({
       brushEndHandler.cleanup();
       brushCancelHandler.cleanup();
     };
-  }, [svgRef, instance, store, clearBrush, setBrushCoordinates]);
+  }, [svgRef, instance, store, clearBrush, setBrushCoordinates, isEnabled]);
   return {
     instance: {
       setBrushCoordinates,
-      clearBrush
+      clearBrush,
+      setZoomBrushEnabled
     }
   };
 };
@@ -100,6 +116,7 @@ useChartBrush.getInitialState = params => {
   return {
     brush: {
       enabled: params.brushConfig.enabled,
+      isZoomBrushEnabled: false,
       preventTooltip: params.brushConfig.preventTooltip,
       preventHighlight: params.brushConfig.preventHighlight,
       start: null,

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

@@ -67,9 +67,9 @@ 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);
-export const selectorIsBrushSelectionActive = createSelector([selectorBrush], brush => {
-  return brush?.enabled && brush?.start !== null && brush?.current !== null;
+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);

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

@@ -9,6 +9,10 @@ export interface UseChartBrushState {
      * Whether the brush interaction is enabled.
      */
     enabled: boolean;
+    /**
+     * Whether the zoom brush interaction is enabled.
+     */
+    isZoomBrushEnabled: boolean;
     /**
      * Whether to prevent tooltip from showing during brush interaction.
      */
@@ -37,6 +41,11 @@ export interface UseChartBrushInstance {
    * Clear the brush coordinates.
    */
   clearBrush: () => void;
+  /**
+   * Enable or disable the zoom brush interaction.
+   * @param {boolean} enabled Whether to enable the zoom brush interaction.
+   */
+  setZoomBrushEnabled: (enabled: boolean) => void;
 }
 export interface BrushConfig {
   /**
@@ -46,12 +55,12 @@ export interface BrushConfig {
   enabled?: boolean;
   /**
    * Whether to prevent tooltip from showing during brush interaction.
-   * @default false
+   * @default true
    */
   preventTooltip?: boolean;
   /**
    * Whether to prevent highlighting during brush interaction.
-   * @default false
+   * @default true
    */
   preventHighlight?: boolean;
 }

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

@@ -1,6 +1,6 @@
-import { scaleBand, scalePoint } from '@mui/x-charts-vendor/d3-scale';
 import { isBandScaleConfig, isPointScaleConfig, isSymlogScaleConfig } from "../../../../models/axis.js";
 import { getScale } from "../../../getScale.js";
+import { scaleBand, scalePoint } from "../../../scales/index.js";
 const DEFAULT_CATEGORY_GAP_RATIO = 0.2;
 export function getRange(drawingArea, axisDirection, axis) {
   const range = axisDirection === 'x' ? [drawingArea.left, drawingArea.left + drawingArea.width] : [drawingArea.top + drawingArea.height, drawingArea.top];