@mui/x-charts 8.13.0 → 8.14.0

package/esm/SparkLineChart/SparkLineChart.js

@@ -391,8 +391,6 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
     offset: PropTypes.number,
     position: PropTypes.oneOf(['bottom', 'none', 'top']),
     reverse: PropTypes.bool,
@@ -445,8 +443,6 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
     offset: PropTypes.number,
     position: PropTypes.oneOf(['bottom', 'none', 'top']),
     reverse: PropTypes.bool,
@@ -489,8 +485,8 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.number,
+    min: PropTypes.number,
     offset: PropTypes.number,
     position: PropTypes.oneOf(['bottom', 'none', 'top']),
     reverse: PropTypes.bool,
@@ -534,8 +530,8 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.number,
+    min: PropTypes.number,
     offset: PropTypes.number,
     position: PropTypes.oneOf(['bottom', 'none', 'top']),
     reverse: PropTypes.bool,
@@ -578,8 +574,8 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.number,
+    min: PropTypes.number,
     offset: PropTypes.number,
     position: PropTypes.oneOf(['bottom', 'none', 'top']),
     reverse: PropTypes.bool,
@@ -622,8 +618,8 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.number,
+    min: PropTypes.number,
     offset: PropTypes.number,
     position: PropTypes.oneOf(['bottom', 'none', 'top']),
     reverse: PropTypes.bool,
@@ -666,8 +662,12 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+      valueOf: PropTypes.func.isRequired
+    })]),
+    min: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+      valueOf: PropTypes.func.isRequired
+    })]),
     offset: PropTypes.number,
     position: PropTypes.oneOf(['bottom', 'none', 'top']),
     reverse: PropTypes.bool,
@@ -710,8 +710,12 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+      valueOf: PropTypes.func.isRequired
+    })]),
+    min: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+      valueOf: PropTypes.func.isRequired
+    })]),
     offset: PropTypes.number,
     position: PropTypes.oneOf(['bottom', 'none', 'top']),
     reverse: PropTypes.bool,
@@ -754,8 +758,8 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.number,
+    min: PropTypes.number,
     offset: PropTypes.number,
     position: PropTypes.oneOf(['bottom', 'none', 'top']),
     reverse: PropTypes.bool,
@@ -814,8 +818,6 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
     offset: PropTypes.number,
     position: PropTypes.oneOf(['left', 'none', 'right']),
     reverse: PropTypes.bool,
@@ -867,8 +869,6 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
     offset: PropTypes.number,
     position: PropTypes.oneOf(['left', 'none', 'right']),
     reverse: PropTypes.bool,
@@ -910,8 +910,8 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.number,
+    min: PropTypes.number,
     offset: PropTypes.number,
     position: PropTypes.oneOf(['left', 'none', 'right']),
     reverse: PropTypes.bool,
@@ -954,8 +954,8 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.number,
+    min: PropTypes.number,
     offset: PropTypes.number,
     position: PropTypes.oneOf(['left', 'none', 'right']),
     reverse: PropTypes.bool,
@@ -997,8 +997,8 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.number,
+    min: PropTypes.number,
     offset: PropTypes.number,
     position: PropTypes.oneOf(['left', 'none', 'right']),
     reverse: PropTypes.bool,
@@ -1040,8 +1040,8 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.number,
+    min: PropTypes.number,
     offset: PropTypes.number,
     position: PropTypes.oneOf(['left', 'none', 'right']),
     reverse: PropTypes.bool,
@@ -1083,8 +1083,12 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+      valueOf: PropTypes.func.isRequired
+    })]),
+    min: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+      valueOf: PropTypes.func.isRequired
+    })]),
     offset: PropTypes.number,
     position: PropTypes.oneOf(['left', 'none', 'right']),
     reverse: PropTypes.bool,
@@ -1126,8 +1130,12 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+      valueOf: PropTypes.func.isRequired
+    })]),
+    min: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({
+      valueOf: PropTypes.func.isRequired
+    })]),
     offset: PropTypes.number,
     position: PropTypes.oneOf(['left', 'none', 'right']),
     reverse: PropTypes.bool,
@@ -1169,8 +1177,8 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     ignoreTooltip: PropTypes.bool,
     label: PropTypes.string,
     labelStyle: PropTypes.object,
-    max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
-    min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+    max: PropTypes.number,
+    min: PropTypes.number,
     offset: PropTypes.number,
     position: PropTypes.oneOf(['left', 'none', 'right']),
     reverse: PropTypes.bool,

package/esm/hooks/animation/useAnimate.js

@@ -1,3 +1,5 @@
+'use client';
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import useForkRef from '@mui/utils/useForkRef';
 import { useAnimateInternal } from "../../internals/animation/useAnimateInternal.js";
@@ -34,14 +36,14 @@ export function useAnimate(props, {
   ref
 }) {
   const transform = transformProps ?? (p => p);
-  const animateRef = useAnimateInternal(props, {
+  const [animateRef, lastInterpolatedProps] = useAnimateInternal(props, {
     initialProps,
     createInterpolator,
     applyProps: (element, animatedProps) => applyProps(element, transform(animatedProps)),
     skip
   });
-  const usedProps = skip ? props : initialProps;
-  return _extends({}, transformProps(usedProps), {
+  const usedProps = skip ? transformProps(props) : transformProps(lastInterpolatedProps);
+  return _extends({}, usedProps, {
     ref: useForkRef(animateRef, ref)
   });
 }

package/esm/hooks/useScale.d.ts

@@ -5,7 +5,11 @@ import { AxisId, AxisScaleConfig, D3Scale, ScaleName } from "../models/axis.js";
  * @param {D3Scale} scale The scale to use
  * @returns {(value: any) => number} A function that map value to their position
  */
-export declare function getValueToPositionMapper(scale: D3Scale): (value: any) => number;
+export declare function getValueToPositionMapper<Domain extends {
+  toString(): string;
+} = {
+  toString(): string;
+}, Range = number>(scale: D3Scale<Domain, Range>): (value: any) => number;
 /**
  * Get the X scale.
  *

package/esm/index.js

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

package/esm/internals/animation/useAnimateInternal.d.ts

@@ -18,4 +18,4 @@ export declare function useAnimateInternal<Props extends {}, Elem extends Elemen
   applyProps: (element: Elem, props: Props) => void;
   skip?: boolean;
   initialProps?: Props;
-}): (element: Elem | null) => void;
+}): readonly [(element: Elem | null) => void, Props];

package/esm/internals/animation/useAnimateInternal.js

@@ -72,5 +72,5 @@ export function useAnimateInternal(props, {
       animate(element);
     }
   }, [animate, props, skip]);
-  return setRef;
+  return [setRef, lastInterpolatedPropsRef.current];
 }

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

@@ -1,7 +1,7 @@
 'use client';
 
 import * as React from 'react';
-import { GestureManager, MoveGesture, PanGesture, PinchGesture, PressGesture, TapAndDragGesture, TapGesture, TurnWheelGesture } from '@mui/x-internal-gestures/core';
+import { GestureManager, MoveGesture, PanGesture, PinchGesture, PressAndDragGesture, PressGesture, TapAndDragGesture, TapGesture, TurnWheelGesture } from '@mui/x-internal-gestures/core';
 const preventDefault = event => event.preventDefault();
 export const useChartInteractionListener = ({
   svgRef
@@ -22,7 +22,7 @@ export const useChartInteractionListener = ({
           name: 'zoomPan',
           threshold: 0,
           maxPointers: 1,
-          preventIf: ['zoomTapAndDrag']
+          preventIf: ['zoomTapAndDrag', 'zoomPressAndDrag']
         }), new MoveGesture({
           name: 'move',
           preventIf: ['pan', 'zoomPinch', 'zoomPan'] // Prevent move gesture when pan is active
@@ -36,17 +36,17 @@ export const useChartInteractionListener = ({
           initialDelta: 1
         }), new TapGesture({
           name: 'tap',
-          maxDistance: 10,
           preventIf: ['pan', 'zoomPan', 'zoomPinch']
         }), new PressGesture({
           name: 'quickPress',
-          duration: 50,
-          maxDistance: 10
+          duration: 50
         }), new TapAndDragGesture({
           name: 'zoomTapAndDrag',
-          tapMaxDistance: 10,
+          dragThreshold: 10
+        }), new PressAndDragGesture({
+          name: 'zoomPressAndDrag',
           dragThreshold: 10,
-          dragTimeout: 1000
+          preventIf: ['zoomPinch']
         })]
       });
     }
@@ -56,7 +56,7 @@ export const useChartInteractionListener = ({
     if (!svg || !gestureManager) {
       return undefined;
     }
-    gestureManager.registerElement(['pan', 'move', 'zoomPinch', 'zoomPan', 'zoomTurnWheel', 'tap', 'quickPress', 'zoomTapAndDrag'], svg);
+    gestureManager.registerElement(['pan', 'move', 'zoomPinch', 'zoomPan', 'zoomTurnWheel', 'tap', 'quickPress', 'zoomTapAndDrag', 'zoomPressAndDrag'], 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 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 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' | 'move' | 'moveStart' | 'moveEnd' | 'quickPress' | 'quickPressEnd' | 'zoomTurnWheel' | 'tap';
+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';
 export type InteractionListenerResult = {
   cleanup: () => void;
 };
@@ -12,12 +12,14 @@ export type AddInteractionListener = {
   <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: '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;
 };
 export type UpdateZoomInteractionListeners = {
   (interaction: 'zoomPan', options?: Omit<PanGestureOptions<'zoomPan'>, 'name'>): void;
   (interaction: 'zoomPinch', options?: Omit<PinchGestureOptions<'zoomPinch'>, 'name'>): void;
   (interaction: 'zoomTurnWheel', options?: Omit<TurnWheelGestureOptions<'zoomTurnWheel'>, 'name'>): void;
   (interaction: 'zoomTapAndDrag', options?: Omit<TapAndDragGestureOptions<'zoomTapAndDrag'>, 'name'>): void;
+  (interaction: 'zoomPressAndDrag', options?: Omit<PressAndDragGestureOptions<'zoomPressAndDrag'>, 'name'>): void;
 };
 export interface UseChartInteractionListenerParameters {}
 export interface UseChartInteractionListenerState {}

package/esm/internals/plugins/featurePlugins/useChartCartesianAxis/computeAxisValue.d.ts

@@ -1,27 +1,25 @@
-import { ChartsXAxisProps, ChartsAxisProps, ChartsYAxisProps, AxisId, DefaultedXAxis, DefaultedYAxis } from "../../../../models/axis.js";
+import { NumberValue } from '@mui/x-charts-vendor/d3-scale';
+import { ChartsXAxisProps, ChartsAxisProps, ChartsYAxisProps, AxisId, DefaultedXAxis, DefaultedYAxis, D3Scale } from "../../../../models/axis.js";
 import { ChartSeriesType } from "../../../../models/seriesType/config.js";
 import type { ChartDrawingArea } from "../../../../hooks/index.js";
 import { ChartSeriesConfig } from "../../models/seriesConfig/index.js";
-import { ComputedAxisConfig, DefaultizedZoomOptions } from "./useChartCartesianAxis.types.js";
+import { ComputedAxisConfig } from "./useChartCartesianAxis.types.js";
 import { ProcessedSeries } from "../../corePlugins/useChartSeries/useChartSeries.types.js";
-import { GetZoomAxisFilters, ZoomData } from "./zoom.types.js";
-import { ScaleDefinition } from "./getAxisScale.js";
+import { ZoomData } from "./zoom.types.js";
 export type ComputeResult<T extends ChartsAxisProps> = {
   axis: ComputedAxisConfig<T>;
   axisIds: AxisId[];
 };
 type ComputeCommonParams<T extends ChartSeriesType = ChartSeriesType> = {
-  scales: Record<AxisId, ScaleDefinition>;
+  scales: Record<AxisId, D3Scale>;
   drawingArea: ChartDrawingArea;
   formattedSeries: ProcessedSeries<T>;
   seriesConfig: ChartSeriesConfig<T>;
   zoomMap?: Map<AxisId, ZoomData>;
-  zoomOptions?: Record<AxisId, DefaultizedZoomOptions>;
-  getFilters?: GetZoomAxisFilters;
-  /**
-   * @deprecated To remove in v9. This is an experimental feature to avoid breaking change.
-   */
-  preferStrictDomainInLineCharts?: boolean;
+  domains: Record<AxisId, {
+    domain: ReadonlyArray<string | NumberValue>;
+    tickNumber?: number;
+  }>;
 };
 export declare function computeAxisValue<T extends ChartSeriesType>(options: ComputeCommonParams<T> & {
   axis?: DefaultedYAxis[];

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

@@ -5,9 +5,7 @@ import { getColorScale, getOrdinalColorScale, getSequentialColorScale } from "..
 import { scaleTickNumberByRange } from "../../../ticks.js";
 import { getScale } from "../../../getScale.js";
 import { isDateData, createDateFormatter } from "../../../dateHelpers.js";
-import { getAxisExtrema } from "./getAxisExtrema.js";
 import { getAxisTriggerTooltip } from "./getAxisTriggerTooltip.js";
-import { applyDomainLimit, getActualAxisExtrema, getDomainLimit } from "./getAxisScale.js";
 import { isBandScale, isOrdinalScale } from "../../../scaleGuards.js";
 function getRange(drawingArea, axisDirection,
 // | 'rotation' | 'radius',
@@ -25,9 +23,7 @@ export function computeAxisValue({
   seriesConfig,
   axisDirection,
   zoomMap,
-  zoomOptions,
-  getFilters,
-  preferStrictDomainInLineCharts
+  domains
 }) {
   if (allAxis === undefined) {
     return {
@@ -37,11 +33,9 @@ export function computeAxisValue({
   }
   const axisIdsTriggeringTooltip = getAxisTriggerTooltip(axisDirection, seriesConfig, formattedSeries, allAxis[0].id);
   const completeAxis = {};
-  allAxis.forEach((eachAxis, axisIndex) => {
+  allAxis.forEach(eachAxis => {
     const axis = eachAxis;
-    const scaleDefinition = scales[axis.id];
-    let scale = scaleDefinition.scale;
-    const zoomOption = zoomOptions?.[axis.id];
+    const scale = scales[axis.id];
     const zoom = zoomMap?.get(axis.id);
     const zoomRange = zoom ? [zoom.start, zoom.end] : [0, 100];
     const range = getRange(drawingArea, axisDirection, axis.reverse ?? false);
@@ -92,28 +86,10 @@ export function computeAxisValue({
       // Could be merged with the two previous "if conditions" but then TS does not get that `axis.scaleType` can't be `band` or `point`.
       return;
     }
-    const rawTickNumber = scaleDefinition.tickNumber;
+    const rawTickNumber = domains[axis.id].tickNumber;
     const continuousAxis = axis;
     const scaleType = continuousAxis.scaleType ?? 'linear';
     const tickNumber = scaleTickNumberByRange(rawTickNumber, zoomRange);
-    const filter = zoom === undefined && !zoomOption ? getFilters : undefined; // Do not apply filtering if zoom is already defined.
-    if (filter) {
-      const [minData, maxData] = getAxisExtrema(axis, axisDirection, seriesConfig, axisIndex, formattedSeries, filter);
-      scale = scale.copy();
-      scale.domain([minData, maxData]);
-      const domainLimit = getDomainLimit(axis, axisDirection, axisIndex, formattedSeries, preferStrictDomainInLineCharts);
-      const axisExtrema = getActualAxisExtrema(axis, minData, maxData);
-      if (typeof domainLimit === 'function') {
-        const {
-          min,
-          max
-        } = domainLimit(minData, maxData);
-        axisExtrema[0] = min;
-        axisExtrema[1] = max;
-      }
-      scale.domain(axisExtrema);
-      applyDomainLimit(scale, axis, domainLimit, rawTickNumber);
-    }
     completeAxis[axis.id] = _extends({
       offset: 0,
       height: 0,

package/esm/internals/plugins/featurePlugins/useChartCartesianAxis/createAxisFilterMapper.d.ts

@@ -1,8 +1,7 @@
-import { AxisId, D3ContinuousScale, D3Scale } from "../../../../models/axis.js";
+import { NumberValue } from '@mui/x-charts-vendor/d3-scale';
 import { AxisConfig } from "../../../../models/index.js";
-import { DefaultizedZoomOptions, ExtremumFilter } from "./useChartCartesianAxis.types.js";
-import { GetZoomAxisFilters, ZoomAxisFilters, ZoomData } from "./zoom.types.js";
-export declare function createAxisFilterMapper(zoomMap: Map<AxisId, ZoomData>, zoomOptions: Record<AxisId, DefaultizedZoomOptions>, direction: 'x' | 'y'): (axisId: AxisId, axisData: AxisConfig['data'], scale: D3Scale) => ExtremumFilter | null;
+import { ExtremumFilter } from "./useChartCartesianAxis.types.js";
+import { GetZoomAxisFilters, ZoomAxisFilters } from "./zoom.types.js";
 export declare function createDiscreteScaleGetAxisFilter(axisData: AxisConfig['data'], zoomStart: number, zoomEnd: number, direction: 'x' | 'y'): ExtremumFilter;
-export declare function createContinuousScaleGetAxisFilter(scale: D3ContinuousScale, zoomStart: number, zoomEnd: number, direction: 'x' | 'y', axisData: AxisConfig['data']): ExtremumFilter;
+export declare function createContinuousScaleGetAxisFilter(domain: readonly NumberValue[], zoomStart: number, zoomEnd: number, direction: 'x' | 'y', axisData: AxisConfig['data']): ExtremumFilter;
 export declare const createGetAxisFilters: (filters: ZoomAxisFilters) => GetZoomAxisFilters;

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

@@ -1,22 +1,4 @@
 import { isDefined } from "../../../isDefined.js";
-import { isOrdinalScale } from "../../../scaleGuards.js";
-export function createAxisFilterMapper(zoomMap, zoomOptions, direction) {
-  return (axisId, axisData, scale) => {
-    const zoomOption = zoomOptions[axisId];
-    if (!zoomOption || zoomOption.filterMode !== 'discard') {
-      return null;
-    }
-    const zoom = zoomMap?.get(axisId);
-    if (zoom === undefined || zoom.start <= 0 && zoom.end >= 100) {
-      // No zoom, or zoom with all data visible
-      return null;
-    }
-    if (isOrdinalScale(scale)) {
-      return createDiscreteScaleGetAxisFilter(axisData, zoom.start, zoom.end, direction);
-    }
-    return createContinuousScaleGetAxisFilter(scale, zoom.start, zoom.end, direction, axisData);
-  };
-}
 export function createDiscreteScaleGetAxisFilter(axisData, zoomStart, zoomEnd, direction) {
   const maxIndex = axisData?.length ?? 0;
   const minVal = Math.floor(zoomStart * maxIndex / 100);
@@ -30,12 +12,9 @@ export function createDiscreteScaleGetAxisFilter(axisData, zoomStart, zoomEnd, d
     return dataIndex >= minVal && dataIndex < maxVal;
   };
 }
-export function createContinuousScaleGetAxisFilter(scale, zoomStart, zoomEnd, direction, axisData) {
-  let min;
-  let max;
-  [min, max] = scale.domain();
-  min = min instanceof Date ? min.getTime() : min;
-  max = max instanceof Date ? max.getTime() : max;
+export function createContinuousScaleGetAxisFilter(domain, zoomStart, zoomEnd, direction, axisData) {
+  const min = domain[0].valueOf();
+  const max = domain[1].valueOf();
   const minVal = min + zoomStart * (max - min) / 100;
   const maxVal = min + zoomEnd * (max - min) / 100;
   return function filterAxis(value, dataIndex) {

package/esm/internals/plugins/featurePlugins/useChartCartesianAxis/domain.d.ts

@@ -0,0 +1,20 @@
+import { NumberValue } from '@mui/x-charts-vendor/d3-scale';
+import { ContinuousScaleName, DefaultedAxis } from "../../../../models/axis.js";
+import { ProcessedSeries } from "../../corePlugins/useChartSeries/index.js";
+import { TickParams } from "../../../../hooks/useTicks.js";
+/**
+ * Calculates the initial domain and tick number for a given axis.
+ * The domain should still run through the zoom filterMode after this step.
+ */
+export declare function calculateInitialDomainAndTickNumber(axis: DefaultedAxis<ContinuousScaleName>, axisDirection: 'x' | 'y', axisIndex: number, formattedSeries: ProcessedSeries, [minData, maxData]: [number | Date, number | Date], defaultTickNumber: number, preferStrictDomainInLineCharts: boolean | undefined): {
+  domain: [NumberValue, NumberValue];
+  tickNumber: number;
+};
+/**
+ * Calculates the final domain for an axis.
+ * After this step, the domain can be used to create the axis scale.
+ */
+export declare function calculateFinalDomain(axis: Pick<DefaultedAxis<ContinuousScaleName>, 'id' | 'domainLimit' | 'scaleType'> & TickParams & {
+  min?: NumberValue;
+  max?: NumberValue;
+}, axisDirection: 'x' | 'y', axisIndex: number, formattedSeries: ProcessedSeries, [minData, maxData]: [number | Date, number | Date], tickNumber: number, preferStrictDomainInLineCharts: boolean | undefined): NumberValue[];

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

@@ -0,0 +1,77 @@
+import { getScale } from "../../../getScale.js";
+import { getAxisDomainLimit } from "./getAxisDomainLimit.js";
+import { getTickNumber } from "../../../ticks.js";
+function niceDomain(scaleType, domain, tickNumber) {
+  return getScale(scaleType ?? 'linear', domain, [0, 1]).nice(tickNumber).domain();
+}
+
+/**
+ * Calculates the initial domain and tick number for a given axis.
+ * The domain should still run through the zoom filterMode after this step.
+ */
+export function calculateInitialDomainAndTickNumber(axis, axisDirection, axisIndex, formattedSeries, [minData, maxData], defaultTickNumber, preferStrictDomainInLineCharts) {
+  const domainLimit = getDomainLimit(axis, axisDirection, axisIndex, formattedSeries, preferStrictDomainInLineCharts);
+  let axisExtrema = getActualAxisExtrema(axis, minData, maxData);
+  if (typeof domainLimit === 'function') {
+    const {
+      min,
+      max
+    } = domainLimit(minData.valueOf(), maxData.valueOf());
+    axisExtrema[0] = min;
+    axisExtrema[1] = max;
+  }
+  const tickNumber = getTickNumber(axis, axisExtrema, defaultTickNumber);
+  if (domainLimit === 'nice') {
+    axisExtrema = niceDomain(axis.scaleType, axisExtrema, tickNumber);
+  }
+  axisExtrema = ['min' in axis ? axis.min ?? axisExtrema[0] : axisExtrema[0], 'max' in axis ? axis.max ?? axisExtrema[1] : axisExtrema[1]];
+  return {
+    domain: axisExtrema,
+    tickNumber
+  };
+}
+
+/**
+ * Calculates the final domain for an axis.
+ * After this step, the domain can be used to create the axis scale.
+ */
+export function calculateFinalDomain(axis, axisDirection, axisIndex, formattedSeries, [minData, maxData], tickNumber, preferStrictDomainInLineCharts) {
+  const domainLimit = getDomainLimit(axis, axisDirection, axisIndex, formattedSeries, preferStrictDomainInLineCharts);
+  let axisExtrema = getActualAxisExtrema(axis, minData, maxData);
+  if (typeof domainLimit === 'function') {
+    const {
+      min,
+      max
+    } = domainLimit(minData.valueOf(), maxData.valueOf());
+    axisExtrema[0] = min;
+    axisExtrema[1] = max;
+  }
+  if (domainLimit === 'nice') {
+    axisExtrema = niceDomain(axis.scaleType, axisExtrema, tickNumber);
+  }
+  return [axis.min ?? axisExtrema[0], axis.max ?? axisExtrema[1]];
+}
+function getDomainLimit(axis, axisDirection, axisIndex, formattedSeries, preferStrictDomainInLineCharts) {
+  return preferStrictDomainInLineCharts ? getAxisDomainLimit(axis, axisDirection, axisIndex, formattedSeries) : axis.domainLimit ?? 'nice';
+}
+
+/**
+ * Get the actual axis extrema considering the user defined min and max values.
+ * @param axisExtrema User defined axis extrema.
+ * @param minData Minimum value from the data.
+ * @param maxData Maximum value from the data.
+ */
+function getActualAxisExtrema(axisExtrema, minData, maxData) {
+  let min = minData;
+  let max = maxData;
+  if ('max' in axisExtrema && axisExtrema.max != null && axisExtrema.max < minData) {
+    min = axisExtrema.max;
+  }
+  if ('min' in axisExtrema && axisExtrema.min != null && axisExtrema.min > minData) {
+    max = axisExtrema.min;
+  }
+  if (!('min' in axisExtrema) && !('max' in axisExtrema)) {
+    return [min, max];
+  }
+  return [axisExtrema.min ?? min, axisExtrema.max ?? max];
+}