@mui/x-charts 9.5.0 → 9.7.0

package/internals/plugins/allPlugins.d.ts

@@ -1,15 +1,15 @@
-import { type ChartSeriesType } from "../../models/seriesType/config.js";
-import { type UseChartCartesianAxisSignature } from "./featurePlugins/useChartCartesianAxis/index.js";
-import { type UseChartHighlightSignature } from "./featurePlugins/useChartHighlight/index.js";
-import { type UseChartInteractionSignature } from "./featurePlugins/useChartInteraction/index.js";
-import { type UseChartKeyboardNavigationSignature } from "./featurePlugins/useChartKeyboardNavigation/index.js";
-import { type UseChartPolarAxisSignature } from "./featurePlugins/useChartPolarAxis/index.js";
-import { type UseChartClosestPointSignature } from "./featurePlugins/useChartClosestPoint/index.js";
-import { type UseChartZAxisSignature } from "./featurePlugins/useChartZAxis/index.js";
-import { type UseChartBrushSignature } from "./featurePlugins/useChartBrush/index.js";
-import { type UseChartVisibilityManagerSignature } from "./featurePlugins/useChartVisibilityManager/index.js";
-import { type UseChartTooltipSignature } from "./featurePlugins/useChartTooltip/index.js";
-import { type UseProgressiveRenderingSignature } from "./featurePlugins/useProgressiveRendering/index.js";
+import type { ChartSeriesType } from "../../models/seriesType/config.js";
+import type { UseChartCartesianAxisSignature } from "./featurePlugins/useChartCartesianAxis/index.js";
+import type { UseChartHighlightSignature } from "./featurePlugins/useChartHighlight/index.js";
+import type { UseChartInteractionSignature } from "./featurePlugins/useChartInteraction/index.js";
+import type { UseChartKeyboardNavigationSignature } from "./featurePlugins/useChartKeyboardNavigation/index.js";
+import type { UseChartPolarAxisSignature } from "./featurePlugins/useChartPolarAxis/index.js";
+import type { UseChartClosestPointSignature } from "./featurePlugins/useChartClosestPoint/index.js";
+import type { UseChartZAxisSignature } from "./featurePlugins/useChartZAxis/index.js";
+import type { UseChartBrushSignature } from "./featurePlugins/useChartBrush/index.js";
+import type { UseChartVisibilityManagerSignature } from "./featurePlugins/useChartVisibilityManager/index.js";
+import type { UseChartTooltipSignature } from "./featurePlugins/useChartTooltip/index.js";
+import type { UseProgressiveRenderingSignature } from "./featurePlugins/useProgressiveRendering/index.js";
 export type AllPluginSignatures<SeriesType extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartCartesianAxisSignature<SeriesType>, UseChartPolarAxisSignature, UseChartTooltipSignature<SeriesType>, UseChartInteractionSignature, UseChartHighlightSignature<SeriesType>, UseChartVisibilityManagerSignature<SeriesType>, UseChartClosestPointSignature, UseChartKeyboardNavigationSignature, UseProgressiveRenderingSignature];
 export type DefaultPluginSignatures<SeriesType extends ChartSeriesType = ChartSeriesType> = [UseChartZAxisSignature, UseChartBrushSignature, UseChartTooltipSignature<SeriesType>, UseChartInteractionSignature, UseChartCartesianAxisSignature<SeriesType>, UseChartHighlightSignature<SeriesType>, UseChartVisibilityManagerSignature<SeriesType>, UseChartClosestPointSignature, UseChartKeyboardNavigationSignature, UseProgressiveRenderingSignature];
 export declare const DEFAULT_PLUGINS: readonly [import("./models/index.js").ChartPlugin<UseChartZAxisSignature>, import("./models/index.js").ChartPlugin<UseChartBrushSignature>, import("./models/index.js").ChartPlugin<UseChartTooltipSignature<any>>, import("./models/index.js").ChartPlugin<UseChartInteractionSignature>, import("./models/index.js").ChartPlugin<UseChartCartesianAxisSignature<any>>, import("./models/index.js").ChartPlugin<UseChartHighlightSignature<any>>, import("./models/index.js").ChartPlugin<UseChartVisibilityManagerSignature<any>>, import("./models/index.js").ChartPlugin<UseChartClosestPointSignature>, import("./models/index.js").ChartPlugin<UseChartKeyboardNavigationSignature>, import("./models/index.js").ChartPlugin<UseProgressiveRenderingSignature>];

package/internals/plugins/corePlugins/corePlugins.d.mts

@@ -1,11 +1,11 @@
-import { type UseChartAnimationSignature } from "./useChartAnimation/index.mjs";
-import { type UseChartDimensionsSignature } from "./useChartDimensions/index.mjs";
-import { type UseChartElementRefSignature } from "./useChartElementRef/index.mjs";
-import { type UseChartExperimentalFeaturesSignature } from "./useChartExperimentalFeature/index.mjs";
-import { type UseChartIdSignature, type UseChartIdParameters } from "./useChartId/index.mjs";
-import { type UseChartSeriesConfigSignature, type UseChartSeriesConfigParameters } from "./useChartSeriesConfig/index.mjs";
-import { type UseChartSeriesSignature } from "./useChartSeries/index.mjs";
-import { type UseChartInteractionListenerSignature } from "./useChartInteractionListener/index.mjs";
+import type { UseChartAnimationSignature } from "./useChartAnimation/index.mjs";
+import type { UseChartDimensionsSignature } from "./useChartDimensions/index.mjs";
+import type { UseChartElementRefSignature } from "./useChartElementRef/index.mjs";
+import type { UseChartExperimentalFeaturesSignature } from "./useChartExperimentalFeature/index.mjs";
+import type { UseChartIdSignature, UseChartIdParameters } from "./useChartId/index.mjs";
+import type { UseChartSeriesConfigSignature, UseChartSeriesConfigParameters } from "./useChartSeriesConfig/index.mjs";
+import type { UseChartSeriesSignature } from "./useChartSeries/index.mjs";
+import type { UseChartInteractionListenerSignature } from "./useChartInteractionListener/index.mjs";
 import type { ChartSeriesType } from "../../../models/seriesType/config.mjs";
 /**
  * Internal plugins that create the tools used by the other plugins.

package/internals/plugins/corePlugins/corePlugins.d.ts

@@ -1,11 +1,11 @@
-import { type UseChartAnimationSignature } from "./useChartAnimation/index.js";
-import { type UseChartDimensionsSignature } from "./useChartDimensions/index.js";
-import { type UseChartElementRefSignature } from "./useChartElementRef/index.js";
-import { type UseChartExperimentalFeaturesSignature } from "./useChartExperimentalFeature/index.js";
-import { type UseChartIdSignature, type UseChartIdParameters } from "./useChartId/index.js";
-import { type UseChartSeriesConfigSignature, type UseChartSeriesConfigParameters } from "./useChartSeriesConfig/index.js";
-import { type UseChartSeriesSignature } from "./useChartSeries/index.js";
-import { type UseChartInteractionListenerSignature } from "./useChartInteractionListener/index.js";
+import type { UseChartAnimationSignature } from "./useChartAnimation/index.js";
+import type { UseChartDimensionsSignature } from "./useChartDimensions/index.js";
+import type { UseChartElementRefSignature } from "./useChartElementRef/index.js";
+import type { UseChartExperimentalFeaturesSignature } from "./useChartExperimentalFeature/index.js";
+import type { UseChartIdSignature, UseChartIdParameters } from "./useChartId/index.js";
+import type { UseChartSeriesConfigSignature, UseChartSeriesConfigParameters } from "./useChartSeriesConfig/index.js";
+import type { UseChartSeriesSignature } from "./useChartSeries/index.js";
+import type { UseChartInteractionListenerSignature } from "./useChartInteractionListener/index.js";
 import type { ChartSeriesType } from "../../../models/seriesType/config.js";
 /**
  * Internal plugins that create the tools used by the other plugins.

package/internals/plugins/corePlugins/useChartAnimation/useChartAnimation.d.mts

@@ -1,3 +1,3 @@
-import { type ChartPlugin } from "../../models/index.mjs";
+import type { ChartPlugin } from "../../models/index.mjs";
 import type { UseChartAnimationSignature } from "./useChartAnimation.types.mjs";
 export declare const useChartAnimation: ChartPlugin<UseChartAnimationSignature>;

package/internals/plugins/corePlugins/useChartAnimation/useChartAnimation.d.ts

@@ -1,3 +1,3 @@
-import { type ChartPlugin } from "../../models/index.js";
+import type { ChartPlugin } from "../../models/index.js";
 import type { UseChartAnimationSignature } from "./useChartAnimation.types.js";
 export declare const useChartAnimation: ChartPlugin<UseChartAnimationSignature>;

package/internals/plugins/corePlugins/useChartAnimation/useChartAnimation.types.d.mts

@@ -1,4 +1,4 @@
-import { type ChartPluginSignature } from "../../models/index.mjs";
+import type { ChartPluginSignature } from "../../models/index.mjs";
 import type { UseChartCartesianAxisSignature } from "../../featurePlugins/useChartCartesianAxis/index.mjs";
 export interface UseChartAnimationParameters {
   /**

package/internals/plugins/corePlugins/useChartAnimation/useChartAnimation.types.d.ts

@@ -1,4 +1,4 @@
-import { type ChartPluginSignature } from "../../models/index.js";
+import type { ChartPluginSignature } from "../../models/index.js";
 import type { UseChartCartesianAxisSignature } from "../../featurePlugins/useChartCartesianAxis/index.js";
 export interface UseChartAnimationParameters {
   /**

package/internals/plugins/corePlugins/useChartDimensions/useChartDimensions.d.mts

@@ -1,3 +1,3 @@
-import { type ChartPlugin } from "../../models/index.mjs";
+import type { ChartPlugin } from "../../models/index.mjs";
 import type { UseChartDimensionsSignature } from "./useChartDimensions.types.mjs";
 export declare const useChartDimensions: ChartPlugin<UseChartDimensionsSignature>;

package/internals/plugins/corePlugins/useChartDimensions/useChartDimensions.d.ts

@@ -1,3 +1,3 @@
-import { type ChartPlugin } from "../../models/index.js";
+import type { ChartPlugin } from "../../models/index.js";
 import type { UseChartDimensionsSignature } from "./useChartDimensions.types.js";
 export declare const useChartDimensions: ChartPlugin<UseChartDimensionsSignature>;

package/internals/plugins/corePlugins/useChartDimensions/useChartDimensions.selectors.d.mts

@@ -1,6 +1,6 @@
-import { type ChartRootSelector } from "../../utils/selectors.mjs";
+import type { ChartRootSelector } from "../../utils/selectors.mjs";
 import type { UseChartDimensionsSignature } from "./useChartDimensions.types.mjs";
-import { type ChartState } from "../../models/chart.mjs";
+import type { ChartState } from "../../models/chart.mjs";
 export declare const selectorChartDimensionsState: ChartRootSelector<UseChartDimensionsSignature>;
 export declare const selectorChartMargin: (state: ChartState<[UseChartDimensionsSignature]>) => import("./useChartDimensions.types.mjs").ChartMargin;
 export declare const selectorChartDrawingArea: (args_0: import("../useChartId/useChartId.types.mjs").UseChartIdState & import("../useChartSeriesConfig/useChartSeriesConfig.types.mjs").UseChartSeriesConfigState<keyof import("../../../index.mjs").ChartsSeriesConfig> & import("../useChartExperimentalFeature/useChartExperimentalFeature.types.mjs").UseChartExperimentalFeaturesState & import("./useChartDimensions.types.mjs").UseChartDimensionsState & import("../useChartSeries/useChartSeries.types.mjs").UseChartSeriesState<keyof import("../../../index.mjs").ChartsSeriesConfig> & import("../useChartAnimation/useChartAnimation.types.mjs").UseChartAnimationState & import("../useChartInteractionListener/index.mjs").UseChartInteractionListenerState & Partial<{}> & {

package/internals/plugins/corePlugins/useChartDimensions/useChartDimensions.selectors.d.ts

@@ -1,6 +1,6 @@
-import { type ChartRootSelector } from "../../utils/selectors.js";
+import type { ChartRootSelector } from "../../utils/selectors.js";
 import type { UseChartDimensionsSignature } from "./useChartDimensions.types.js";
-import { type ChartState } from "../../models/chart.js";
+import type { ChartState } from "../../models/chart.js";
 export declare const selectorChartDimensionsState: ChartRootSelector<UseChartDimensionsSignature>;
 export declare const selectorChartMargin: (state: ChartState<[UseChartDimensionsSignature]>) => import("./useChartDimensions.types.js").ChartMargin;
 export declare const selectorChartDrawingArea: (args_0: import("../useChartId/useChartId.types.js").UseChartIdState & import("../useChartSeriesConfig/useChartSeriesConfig.types.js").UseChartSeriesConfigState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("./useChartDimensions.types.js").UseChartDimensionsState & import("../useChartSeries/useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../useChartInteractionListener/index.js").UseChartInteractionListenerState & Partial<{}> & {

package/internals/plugins/corePlugins/useChartDimensions/useChartDimensions.types.d.mts

@@ -1,4 +1,4 @@
-import { type ChartPluginSignature } from "../../models/index.mjs";
+import type { ChartPluginSignature } from "../../models/index.mjs";
 import type { UseChartCartesianAxisSignature } from "../../featurePlugins/useChartCartesianAxis/index.mjs";
 export interface ChartMargin {
   /**

package/internals/plugins/corePlugins/useChartDimensions/useChartDimensions.types.d.ts

@@ -1,4 +1,4 @@
-import { type ChartPluginSignature } from "../../models/index.js";
+import type { ChartPluginSignature } from "../../models/index.js";
 import type { UseChartCartesianAxisSignature } from "../../featurePlugins/useChartCartesianAxis/index.js";
 export interface ChartMargin {
   /**

package/internals/plugins/corePlugins/useChartElementRef/useChartElementRef.d.mts

@@ -1,3 +1,3 @@
-import { type ChartPlugin } from "../../models/index.mjs";
-import { type UseChartElementRefSignature } from "./useChartElementRef.types.mjs";
+import type { ChartPlugin } from "../../models/index.mjs";
+import type { UseChartElementRefSignature } from "./useChartElementRef.types.mjs";
 export declare const useChartElementRef: ChartPlugin<UseChartElementRefSignature>;

package/internals/plugins/corePlugins/useChartElementRef/useChartElementRef.d.ts

@@ -1,3 +1,3 @@
-import { type ChartPlugin } from "../../models/index.js";
-import { type UseChartElementRefSignature } from "./useChartElementRef.types.js";
+import type { ChartPlugin } from "../../models/index.js";
+import type { UseChartElementRefSignature } from "./useChartElementRef.types.js";
 export declare const useChartElementRef: ChartPlugin<UseChartElementRefSignature>;

package/internals/plugins/corePlugins/useChartElementRef/useChartElementRef.types.d.mts

@@ -1,5 +1,5 @@
 import type * as React from 'react';
-import { type ChartPluginSignature } from "../../models/index.mjs";
+import type { ChartPluginSignature } from "../../models/index.mjs";
 export interface UseChartElementRefInstance {
   /**
    * Reference to the chart surface element.

package/internals/plugins/corePlugins/useChartElementRef/useChartElementRef.types.d.ts

@@ -1,5 +1,5 @@
 import type * as React from 'react';
-import { type ChartPluginSignature } from "../../models/index.js";
+import type { ChartPluginSignature } from "../../models/index.js";
 export interface UseChartElementRefInstance {
   /**
    * Reference to the chart surface element.

package/internals/plugins/corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.d.mts

@@ -1,4 +1,4 @@
-import { type ChartPlugin } from "../../models/index.mjs";
+import type { ChartPlugin } from "../../models/index.mjs";
 import type { UseChartExperimentalFeaturesSignature } from "./useChartExperimentalFeature.types.mjs";
 import type { ChartSeriesType } from "../../../../models/seriesType/config.mjs";
 export declare const useChartExperimentalFeatures: ChartPlugin<UseChartExperimentalFeaturesSignature<ChartSeriesType>>;

package/internals/plugins/corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.d.ts

@@ -1,4 +1,4 @@
-import { type ChartPlugin } from "../../models/index.js";
+import type { ChartPlugin } from "../../models/index.js";
 import type { UseChartExperimentalFeaturesSignature } from "./useChartExperimentalFeature.types.js";
 import type { ChartSeriesType } from "../../../../models/seriesType/config.js";
 export declare const useChartExperimentalFeatures: ChartPlugin<UseChartExperimentalFeaturesSignature<ChartSeriesType>>;

package/internals/plugins/corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.selectors.d.mts

@@ -1,5 +1,5 @@
 import type { ChartSeriesType } from "../../../../models/seriesType/config.mjs";
-import { type ChartState } from "../../models/chart.mjs";
+import type { ChartState } from "../../models/chart.mjs";
 import type { ChartExperimentalFeatures, UseChartExperimentalFeaturesSignature } from "./useChartExperimentalFeature.types.mjs";
 /**
  * Reads the value of a single experimental feature flag from the store.

package/internals/plugins/corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.selectors.d.ts

@@ -1,5 +1,5 @@
 import type { ChartSeriesType } from "../../../../models/seriesType/config.js";
-import { type ChartState } from "../../models/chart.js";
+import type { ChartState } from "../../models/chart.js";
 import type { ChartExperimentalFeatures, UseChartExperimentalFeaturesSignature } from "./useChartExperimentalFeature.types.js";
 /**
  * Reads the value of a single experimental feature flag from the store.

package/internals/plugins/corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.d.mts

@@ -1,4 +1,4 @@
-import { type ChartPluginSignature } from "../../models/index.mjs";
+import type { ChartPluginSignature } from "../../models/index.mjs";
 import type { ChartSeriesType } from "../../../../models/seriesType/config.mjs";
 interface LineExperimentalFeatures {
   /**

package/internals/plugins/corePlugins/useChartExperimentalFeature/useChartExperimentalFeature.types.d.ts

@@ -1,4 +1,4 @@
-import { type ChartPluginSignature } from "../../models/index.js";
+import type { ChartPluginSignature } from "../../models/index.js";
 import type { ChartSeriesType } from "../../../../models/seriesType/config.js";
 interface LineExperimentalFeatures {
   /**

package/internals/plugins/corePlugins/useChartId/useChartId.d.mts

@@ -1,3 +1,3 @@
-import { type ChartPlugin } from "../../models/index.mjs";
-import { type UseChartIdSignature } from "./useChartId.types.mjs";
+import type { ChartPlugin } from "../../models/index.mjs";
+import type { UseChartIdSignature } from "./useChartId.types.mjs";
 export declare const useChartId: ChartPlugin<UseChartIdSignature>;

package/internals/plugins/corePlugins/useChartId/useChartId.d.ts

@@ -1,3 +1,3 @@
-import { type ChartPlugin } from "../../models/index.js";
-import { type UseChartIdSignature } from "./useChartId.types.js";
+import type { ChartPlugin } from "../../models/index.js";
+import type { UseChartIdSignature } from "./useChartId.types.js";
 export declare const useChartId: ChartPlugin<UseChartIdSignature>;

package/internals/plugins/corePlugins/useChartId/useChartId.types.d.mts

@@ -1,4 +1,4 @@
-import { type ChartPluginSignature } from "../../models/index.mjs";
+import type { ChartPluginSignature } from "../../models/index.mjs";
 export interface UseChartIdParameters {
   /**
    * This prop is used to help implement the accessibility logic.

package/internals/plugins/corePlugins/useChartId/useChartId.types.d.ts

@@ -1,4 +1,4 @@
-import { type ChartPluginSignature } from "../../models/index.js";
+import type { ChartPluginSignature } from "../../models/index.js";
 export interface UseChartIdParameters {
   /**
    * This prop is used to help implement the accessibility logic.

package/internals/plugins/corePlugins/useChartInteractionListener/useChartInteractionListener.d.mts

@@ -1,3 +1,3 @@
-import { type ChartPlugin } from "../../models/index.mjs";
-import { type UseChartInteractionListenerSignature } from "./useChartInteractionListener.types.mjs";
+import type { ChartPlugin } from "../../models/index.mjs";
+import type { UseChartInteractionListenerSignature } from "./useChartInteractionListener.types.mjs";
 export declare const useChartInteractionListener: ChartPlugin<UseChartInteractionListenerSignature>;

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

@@ -1,3 +1,3 @@
-import { type ChartPlugin } from "../../models/index.js";
-import { type UseChartInteractionListenerSignature } from "./useChartInteractionListener.types.js";
+import type { ChartPlugin } from "../../models/index.js";
+import type { UseChartInteractionListenerSignature } from "./useChartInteractionListener.types.js";
 export declare const useChartInteractionListener: ChartPlugin<UseChartInteractionListenerSignature>;

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

@@ -40,34 +40,6 @@ const useChartInteractionListener = ({
           name: 'brush',
           threshold: 0,
           maxPointers: 1
-        }),
-        // Zoom gestures
-        new _core.PanGesture({
-          name: 'zoomPan',
-          threshold: 0,
-          preventIf: ['zoomTapAndDrag', 'zoomPressAndDrag']
-        }), new _core.PinchGesture({
-          name: 'zoomPinch',
-          threshold: 5
-        }), new _core.TurnWheelGesture({
-          name: 'zoomTurnWheel',
-          sensitivity: 0.01,
-          initialDelta: 1,
-          passive: false
-        }), new _core.TurnWheelGesture({
-          name: 'panTurnWheel',
-          sensitivity: 0.5,
-          passive: false
-        }), new _core.TapAndDragGesture({
-          name: 'zoomTapAndDrag',
-          dragThreshold: 10
-        }), new _core.PressAndDragGesture({
-          name: 'zoomPressAndDrag',
-          dragThreshold: 10,
-          preventIf: ['zoomPinch']
-        }), new _core.TapGesture({
-          name: 'zoomDoubleTapReset',
-          taps: 2
         })]
       });
     }
@@ -77,7 +49,7 @@ const useChartInteractionListener = ({
     if (!svg || !gestureManager) {
       return undefined;
     }
-    gestureManager.registerElement(['pan', 'move', 'zoomPinch', 'zoomPan', 'zoomTurnWheel', 'panTurnWheel', 'tap', 'quickPress', 'zoomTapAndDrag', 'zoomPressAndDrag', 'zoomDoubleTapReset', 'brush'], svg);
+    gestureManager.registerElement(['pan', 'move', 'tap', 'quickPress', 'brush'], svg);
     return () => {
       // Cleanup gesture manager
       gestureManager.unregisterAllGestures(svg);
@@ -113,10 +85,24 @@ const useChartInteractionListener = ({
       svg?.removeEventListener('gestureend', preventDefault);
     };
   }, [chartsLayerContainerRef]);
+  const registerGestures = React.useCallback(gestures => {
+    const svg = chartsLayerContainerRef.current;
+    const gestureManager = gestureManagerRef.current;
+    if (!gestureManager || !svg) {
+      return () => {};
+    }
+    const gestureNames = gestures.map(gesture => gesture.name);
+    gestureManager.addGestures(gestures);
+    gestureManager.registerElement(gestureNames, svg);
+    return () => {
+      gestureManager.removeGestures(gestureNames);
+    };
+  }, [chartsLayerContainerRef, gestureManagerRef]);
   return {
     instance: {
       addInteractionListener,
-      updateZoomInteractionListeners
+      updateZoomInteractionListeners,
+      registerGestures
     }
   };
 };

package/internals/plugins/corePlugins/useChartInteractionListener/useChartInteractionListener.mjs

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { GestureManager, MoveGesture, PanGesture, PinchGesture, PressAndDragGesture, PressGesture, TapAndDragGesture, TapGesture, TurnWheelGesture } from '@mui/x-internal-gestures/core';
+import { GestureManager, MoveGesture, PanGesture, PressGesture, TapGesture } from '@mui/x-internal-gestures/core';
 const preventDefault = event => event.preventDefault();
 export const useChartInteractionListener = ({
   instance
@@ -34,34 +34,6 @@ export const useChartInteractionListener = ({
           name: 'brush',
           threshold: 0,
           maxPointers: 1
-        }),
-        // Zoom gestures
-        new PanGesture({
-          name: 'zoomPan',
-          threshold: 0,
-          preventIf: ['zoomTapAndDrag', 'zoomPressAndDrag']
-        }), new PinchGesture({
-          name: 'zoomPinch',
-          threshold: 5
-        }), new TurnWheelGesture({
-          name: 'zoomTurnWheel',
-          sensitivity: 0.01,
-          initialDelta: 1,
-          passive: false
-        }), new TurnWheelGesture({
-          name: 'panTurnWheel',
-          sensitivity: 0.5,
-          passive: false
-        }), new TapAndDragGesture({
-          name: 'zoomTapAndDrag',
-          dragThreshold: 10
-        }), new PressAndDragGesture({
-          name: 'zoomPressAndDrag',
-          dragThreshold: 10,
-          preventIf: ['zoomPinch']
-        }), new TapGesture({
-          name: 'zoomDoubleTapReset',
-          taps: 2
         })]
       });
     }
@@ -71,7 +43,7 @@ export const useChartInteractionListener = ({
     if (!svg || !gestureManager) {
       return undefined;
     }
-    gestureManager.registerElement(['pan', 'move', 'zoomPinch', 'zoomPan', 'zoomTurnWheel', 'panTurnWheel', 'tap', 'quickPress', 'zoomTapAndDrag', 'zoomPressAndDrag', 'zoomDoubleTapReset', 'brush'], svg);
+    gestureManager.registerElement(['pan', 'move', 'tap', 'quickPress', 'brush'], svg);
     return () => {
       // Cleanup gesture manager
       gestureManager.unregisterAllGestures(svg);
@@ -107,10 +79,24 @@ export const useChartInteractionListener = ({
       svg?.removeEventListener('gestureend', preventDefault);
     };
   }, [chartsLayerContainerRef]);
+  const registerGestures = React.useCallback(gestures => {
+    const svg = chartsLayerContainerRef.current;
+    const gestureManager = gestureManagerRef.current;
+    if (!gestureManager || !svg) {
+      return () => {};
+    }
+    const gestureNames = gestures.map(gesture => gesture.name);
+    gestureManager.addGestures(gestures);
+    gestureManager.registerElement(gestureNames, svg);
+    return () => {
+      gestureManager.removeGestures(gestureNames);
+    };
+  }, [chartsLayerContainerRef, gestureManagerRef]);
   return {
     instance: {
       addInteractionListener,
-      updateZoomInteractionListeners
+      updateZoomInteractionListeners,
+      registerGestures
     }
   };
 };

package/internals/plugins/corePlugins/useChartInteractionListener/useChartInteractionListener.types.d.mts

@@ -1,5 +1,5 @@
-import { type MoveEvent, type PanEvent, type PanGestureOptions, type PinchEvent, type PinchGestureOptions, type PressEvent, type TapEvent, type TurnWheelEvent, type PressAndDragEvent, type PressAndDragGestureOptions, type TapAndDragEvent, type TapAndDragGestureOptions, type TapGestureOptions, type TurnWheelGestureOptions } from '@mui/x-internal-gestures/core';
-import { type ChartPluginSignature } from "../../models/index.mjs";
+import type { Gesture, MoveEvent, PanEvent, PanGestureOptions, PinchEvent, PinchGestureOptions, PressEvent, TapEvent, TurnWheelEvent, PressAndDragEvent, PressAndDragGestureOptions, TapAndDragEvent, TapAndDragGestureOptions, TapGestureOptions, TurnWheelGestureOptions } from '@mui/x-internal-gestures/core';
+import type { ChartPluginSignature } from "../../models/index.mjs";
 export type ChartInteraction = 'pan' | 'panStart' | 'panEnd' | 'zoomPan' | 'zoomPanStart' | 'zoomPanEnd' | 'zoomPinch' | 'zoomPinchStart' | 'zoomPinchEnd' | 'zoomTurnWheel' | 'panTurnWheel' | 'zoomTapAndDrag' | 'zoomTapAndDragStart' | 'zoomTapAndDragEnd' | 'zoomPressAndDrag' | 'zoomPressAndDragStart' | 'zoomPressAndDragEnd' | 'move' | 'moveStart' | 'moveEnd' | 'tap' | 'quickPress' | 'quickPressEnd' | 'zoomDoubleTapReset' | 'brush' | 'brushStart' | 'brushCancel' | 'brushEnd';
 export type InteractionListenerResult = {
   cleanup: () => void;
@@ -27,6 +27,7 @@ export type UpdateZoomInteractionListeners = {
 };
 export interface UseChartInteractionListenerParameters {}
 export interface UseChartInteractionListenerState {}
+export type RegisterGestures = (gestures: Gesture<string>[]) => () => void;
 export interface UseChartInteractionListenerInstance {
   /**
    * Adds an interaction listener to the SVG element.
@@ -42,6 +43,12 @@ export interface UseChartInteractionListenerInstance {
    * @param options The options to apply to the interaction.
    */
   updateZoomInteractionListeners: UpdateZoomInteractionListeners;
+  /**
+   * Registers additional gestures on the chart interaction element.
+   *
+   * @param gestures The gestures to register.
+   */
+  registerGestures: RegisterGestures;
 }
 export type UseChartInteractionListenerSignature = ChartPluginSignature<{
   params: UseChartInteractionListenerParameters;

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

@@ -1,5 +1,5 @@
-import { type MoveEvent, type PanEvent, type PanGestureOptions, type PinchEvent, type PinchGestureOptions, type PressEvent, type TapEvent, type TurnWheelEvent, type PressAndDragEvent, type PressAndDragGestureOptions, type TapAndDragEvent, type TapAndDragGestureOptions, type TapGestureOptions, type TurnWheelGestureOptions } from '@mui/x-internal-gestures/core';
-import { type ChartPluginSignature } from "../../models/index.js";
+import type { Gesture, MoveEvent, PanEvent, PanGestureOptions, PinchEvent, PinchGestureOptions, PressEvent, TapEvent, TurnWheelEvent, PressAndDragEvent, PressAndDragGestureOptions, TapAndDragEvent, TapAndDragGestureOptions, TapGestureOptions, TurnWheelGestureOptions } from '@mui/x-internal-gestures/core';
+import type { ChartPluginSignature } from "../../models/index.js";
 export type ChartInteraction = 'pan' | 'panStart' | 'panEnd' | 'zoomPan' | 'zoomPanStart' | 'zoomPanEnd' | 'zoomPinch' | 'zoomPinchStart' | 'zoomPinchEnd' | 'zoomTurnWheel' | 'panTurnWheel' | 'zoomTapAndDrag' | 'zoomTapAndDragStart' | 'zoomTapAndDragEnd' | 'zoomPressAndDrag' | 'zoomPressAndDragStart' | 'zoomPressAndDragEnd' | 'move' | 'moveStart' | 'moveEnd' | 'tap' | 'quickPress' | 'quickPressEnd' | 'zoomDoubleTapReset' | 'brush' | 'brushStart' | 'brushCancel' | 'brushEnd';
 export type InteractionListenerResult = {
   cleanup: () => void;
@@ -27,6 +27,7 @@ export type UpdateZoomInteractionListeners = {
 };
 export interface UseChartInteractionListenerParameters {}
 export interface UseChartInteractionListenerState {}
+export type RegisterGestures = (gestures: Gesture<string>[]) => () => void;
 export interface UseChartInteractionListenerInstance {
   /**
    * Adds an interaction listener to the SVG element.
@@ -42,6 +43,12 @@ export interface UseChartInteractionListenerInstance {
    * @param options The options to apply to the interaction.
    */
   updateZoomInteractionListeners: UpdateZoomInteractionListeners;
+  /**
+   * Registers additional gestures on the chart interaction element.
+   *
+   * @param gestures The gestures to register.
+   */
+  registerGestures: RegisterGestures;
 }
 export type UseChartInteractionListenerSignature = ChartPluginSignature<{
   params: UseChartInteractionListenerParameters;

package/internals/plugins/corePlugins/useChartSeries/processSeries.d.mts

@@ -1,8 +1,8 @@
-import { type ChartDrawingArea } from "../../../../hooks/useDrawingArea.mjs";
-import { type AllSeriesType } from "../../../../models/seriesType/index.mjs";
-import { type ChartSeriesType, type DatasetType } from "../../../../models/seriesType/config.mjs";
-import { type ChartSeriesConfig } from "../useChartSeriesConfig/index.mjs";
-import { type DefaultizedSeriesGroups, type ProcessedSeries, type SeriesIdToType, type SeriesLayout } from "./useChartSeries.types.mjs";
+import type { ChartDrawingArea } from "../../../../hooks/useDrawingArea.mjs";
+import type { AllSeriesType } from "../../../../models/seriesType/index.mjs";
+import type { ChartSeriesType, DatasetType } from "../../../../models/seriesType/config.mjs";
+import type { ChartSeriesConfig } from "../useChartSeriesConfig/index.mjs";
+import type { DefaultizedSeriesGroups, ProcessedSeries, SeriesIdToType, SeriesLayout } from "./useChartSeries.types.mjs";
 import type { IsItemVisibleFunction } from "../../featurePlugins/useChartVisibilityManager/index.mjs";
 /**
  * This method groups series by type and adds defaultized values such as the ids and colors.

package/internals/plugins/corePlugins/useChartSeries/processSeries.d.ts

@@ -1,8 +1,8 @@
-import { type ChartDrawingArea } from "../../../../hooks/useDrawingArea.js";
-import { type AllSeriesType } from "../../../../models/seriesType/index.js";
-import { type ChartSeriesType, type DatasetType } from "../../../../models/seriesType/config.js";
-import { type ChartSeriesConfig } from "../useChartSeriesConfig/index.js";
-import { type DefaultizedSeriesGroups, type ProcessedSeries, type SeriesIdToType, type SeriesLayout } from "./useChartSeries.types.js";
+import type { ChartDrawingArea } from "../../../../hooks/useDrawingArea.js";
+import type { AllSeriesType } from "../../../../models/seriesType/index.js";
+import type { ChartSeriesType, DatasetType } from "../../../../models/seriesType/config.js";
+import type { ChartSeriesConfig } from "../useChartSeriesConfig/index.js";
+import type { DefaultizedSeriesGroups, ProcessedSeries, SeriesIdToType, SeriesLayout } from "./useChartSeries.types.js";
 import type { IsItemVisibleFunction } from "../../featurePlugins/useChartVisibilityManager/index.js";
 /**
  * This method groups series by type and adds defaultized values such as the ids and colors.

package/internals/plugins/corePlugins/useChartSeries/useChartSeries.d.mts

@@ -1,6 +1,6 @@
-import { type ChartPlugin } from "../../models/index.mjs";
+import type { ChartPlugin } from "../../models/index.mjs";
 import type { UseChartSeriesState, UseChartSeriesSignature } from "./useChartSeries.types.mjs";
-import { type ChartSeriesType } from "../../../../models/seriesType/config.mjs";
+import type { ChartSeriesType } from "../../../../models/seriesType/config.mjs";
 import type { SeriesItemIdentifier, SeriesItemIdentifierWithType, SeriesId } from "../../../../models/seriesType/index.mjs";
 type RetrunedType<SeriesType extends ChartSeriesType, Item> = Item extends SeriesItemIdentifier<SeriesType> ? SeriesItemIdentifierWithType<SeriesType> : Item & {
   type: SeriesType;

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

@@ -1,6 +1,6 @@
-import { type ChartPlugin } from "../../models/index.js";
+import type { ChartPlugin } from "../../models/index.js";
 import type { UseChartSeriesState, UseChartSeriesSignature } from "./useChartSeries.types.js";
-import { type ChartSeriesType } from "../../../../models/seriesType/config.js";
+import type { ChartSeriesType } from "../../../../models/seriesType/config.js";
 import type { SeriesItemIdentifier, SeriesItemIdentifierWithType, SeriesId } from "../../../../models/seriesType/index.js";
 type RetrunedType<SeriesType extends ChartSeriesType, Item> = Item extends SeriesItemIdentifier<SeriesType> ? SeriesItemIdentifierWithType<SeriesType> : Item & {
   type: SeriesType;

package/internals/plugins/corePlugins/useChartSeries/useChartSeries.selectors.d.mts

@@ -1,6 +1,6 @@
-import { type SeriesId } from "../../../../models/index.mjs";
-import { type ChartRootSelector } from "../../utils/selectors.mjs";
-import { type UseChartSeriesSignature } from "./useChartSeries.types.mjs";
+import type { SeriesId } from "../../../../models/index.mjs";
+import type { ChartRootSelector } from "../../utils/selectors.mjs";
+import type { UseChartSeriesSignature } from "./useChartSeries.types.mjs";
 export declare const selectorChartSeriesState: ChartRootSelector<UseChartSeriesSignature>;
 export declare const selectorChartDefaultizedSeries: (args_0: import("../useChartId/useChartId.types.mjs").UseChartIdState & import("../useChartSeriesConfig/useChartSeriesConfig.types.mjs").UseChartSeriesConfigState<keyof import("../../../index.mjs").ChartsSeriesConfig> & import("../useChartExperimentalFeature/useChartExperimentalFeature.types.mjs").UseChartExperimentalFeaturesState & import("../useChartDimensions/useChartDimensions.types.mjs").UseChartDimensionsState & import("./useChartSeries.types.mjs").UseChartSeriesState<keyof import("../../../index.mjs").ChartsSeriesConfig> & import("../useChartAnimation/useChartAnimation.types.mjs").UseChartAnimationState & import("../useChartInteractionListener/index.mjs").UseChartInteractionListenerState & Partial<{}> & {
   cacheKey: import("../../models/index.mjs").ChartStateCacheKey;

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

@@ -1,6 +1,6 @@
-import { type SeriesId } from "../../../../models/index.js";
-import { type ChartRootSelector } from "../../utils/selectors.js";
-import { type UseChartSeriesSignature } from "./useChartSeries.types.js";
+import type { SeriesId } from "../../../../models/index.js";
+import type { ChartRootSelector } from "../../utils/selectors.js";
+import type { UseChartSeriesSignature } from "./useChartSeries.types.js";
 export declare const selectorChartSeriesState: ChartRootSelector<UseChartSeriesSignature>;
 export declare const selectorChartDefaultizedSeries: (args_0: import("../useChartId/useChartId.types.js").UseChartIdState & import("../useChartSeriesConfig/useChartSeriesConfig.types.js").UseChartSeriesConfigState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../useChartExperimentalFeature/useChartExperimentalFeature.types.js").UseChartExperimentalFeaturesState & import("../useChartDimensions/useChartDimensions.types.js").UseChartDimensionsState & import("./useChartSeries.types.js").UseChartSeriesState<keyof import("../../../index.js").ChartsSeriesConfig> & import("../useChartAnimation/useChartAnimation.types.js").UseChartAnimationState & import("../useChartInteractionListener/index.js").UseChartInteractionListenerState & Partial<{}> & {
   cacheKey: import("../../models/index.js").ChartStateCacheKey;

package/internals/plugins/corePlugins/useChartSeries/useChartSeries.types.d.mts

@@ -1,10 +1,10 @@
 import type { AllSeriesType, HighlightItemIdentifier, HighlightItemIdentifierWithType, SeriesItemIdentifier, SeriesItemIdentifierWithType } from "../../../../models/seriesType/index.mjs";
-import { type ChartsColorPalette } from "../../../../colorPalettes/index.mjs";
-import { type ChartPluginSignature } from "../../models/index.mjs";
-import { type ChartSeriesType, type DatasetType } from "../../../../models/seriesType/config.mjs";
-import { type SeriesId } from "../../../../models/seriesType/common.mjs";
-import { type SeriesLayoutGetterResult, type SeriesProcessorParams, type SeriesProcessorResult, type UseChartSeriesConfigSignature } from "../useChartSeriesConfig/index.mjs";
-import { type VisibilityIdentifier, type VisibilityIdentifierWithType } from "../../featurePlugins/useChartVisibilityManager/useChartVisibilityManager.types.mjs";
+import type { ChartsColorPalette } from "../../../../colorPalettes/index.mjs";
+import type { ChartPluginSignature } from "../../models/index.mjs";
+import type { ChartSeriesType, DatasetType } from "../../../../models/seriesType/config.mjs";
+import type { SeriesId } from "../../../../models/seriesType/common.mjs";
+import type { SeriesLayoutGetterResult, SeriesProcessorParams, SeriesProcessorResult, UseChartSeriesConfigSignature } from "../useChartSeriesConfig/index.mjs";
+import type { VisibilityIdentifier, VisibilityIdentifierWithType } from "../../featurePlugins/useChartVisibilityManager/useChartVisibilityManager.types.mjs";
 export interface UseChartSeriesParameters<SeriesType extends ChartSeriesType = ChartSeriesType> {
   /**
    * An array of objects that can be used to populate series and axes data using their `dataKey` property.