@mui/x-charts-pro 8.19.0 → 8.21.0

package/ScatterChartPro/ScatterChartPro.js

@@ -332,6 +332,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
       filterMode: _propTypes.default.oneOf(['discard', 'keep']),
@@ -399,6 +400,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
       filterMode: _propTypes.default.oneOf(['discard', 'keep']),
@@ -458,6 +460,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
       filterMode: _propTypes.default.oneOf(['discard', 'keep']),
@@ -518,6 +521,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
       filterMode: _propTypes.default.oneOf(['discard', 'keep']),
@@ -577,6 +581,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
       filterMode: _propTypes.default.oneOf(['discard', 'keep']),
@@ -636,6 +641,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
       filterMode: _propTypes.default.oneOf(['discard', 'keep']),
@@ -699,6 +705,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
       filterMode: _propTypes.default.oneOf(['discard', 'keep']),
@@ -762,6 +769,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
       filterMode: _propTypes.default.oneOf(['discard', 'keep']),
@@ -821,6 +829,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
       filterMode: _propTypes.default.oneOf(['discard', 'keep']),
@@ -894,6 +903,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
@@ -960,6 +970,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
@@ -1018,6 +1029,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
@@ -1077,6 +1089,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
@@ -1135,6 +1148,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
@@ -1193,6 +1207,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
@@ -1255,6 +1270,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
@@ -1317,6 +1333,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({
@@ -1375,6 +1392,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number,
     zoom: _propTypes.default.oneOfType([_propTypes.default.shape({

package/esm/BarChartPro/BarChartPro.js

@@ -341,6 +341,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -408,6 +409,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -467,6 +469,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -527,6 +530,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -586,6 +590,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -645,6 +650,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -708,6 +714,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -771,6 +778,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -830,6 +838,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -903,6 +912,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -969,6 +979,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1027,6 +1038,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1086,6 +1098,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1144,6 +1157,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1202,6 +1216,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1264,6 +1279,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1326,6 +1342,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1384,6 +1401,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({

package/esm/ChartDataProviderPro/ChartDataProviderPro.js

@@ -10,7 +10,7 @@ import { defaultSlotsMaterial } from "../internals/material/index.js";
 import { DEFAULT_PLUGINS } from "../internals/plugins/allPlugins.js";
 import { useChartDataProviderProProps } from "./useChartDataProviderProProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const releaseInfo = "MTc2MzU5NjgwMDAwMA==";
+const releaseInfo = "MTc2NDgwNjQwMDAwMA==";
 const packageIdentifier = 'x-charts-pro';
 /**
  * Orchestrates the data providers for the chart components and hooks.

package/esm/ChartZoomSlider/internals/ChartAxisZoomSliderThumb.js

@@ -28,6 +28,10 @@ const Rect = styled('rect')(({
     cursor: 'ns-resize'
   }
 }));
+function preventDefault(event) {
+  event.preventDefault();
+}
+
 /**
  * Renders the zoom slider thumb, which is responsible for resizing the zoom range.
  * @internal
@@ -53,28 +57,38 @@ export const ChartAxisZoomSliderThumb = /*#__PURE__*/React.forwardRef(function C
   React.useEffect(() => {
     const thumb = thumbRef.current;
     if (!thumb) {
-      return;
+      return () => {};
     }
+
+    // Prevent scrolling on touch devices when dragging the thumb
+    thumb.addEventListener('touchmove', preventDefault, {
+      passive: false
+    });
     const onPointerMove = rafThrottle(event => {
       onMoveEvent(event);
     });
-    const onPointerUp = () => {
+    const onPointerEnd = event => {
       thumb.removeEventListener('pointermove', onPointerMove);
-      thumb.removeEventListener('pointerup', onPointerUp);
+      thumb.removeEventListener('pointerup', onPointerEnd);
+      thumb.removeEventListener('pointercancel', onPointerEnd);
+      thumb.releasePointerCapture(event.pointerId);
     };
     const onPointerDown = event => {
       // Prevent text selection when dragging the thumb
       event.preventDefault();
       event.stopPropagation();
       thumb.setPointerCapture(event.pointerId);
-      thumb.addEventListener('pointerup', onPointerUp);
       thumb.addEventListener('pointermove', onPointerMove);
+      thumb.addEventListener('pointercancel', onPointerEnd);
+      thumb.addEventListener('pointerup', onPointerEnd);
     };
     thumb.addEventListener('pointerdown', onPointerDown);
-
-    // eslint-disable-next-line consistent-return
     return () => {
       thumb.removeEventListener('pointerdown', onPointerDown);
+      thumb.removeEventListener('pointermove', onPointerMove);
+      thumb.removeEventListener('pointercancel', onPointerEnd);
+      thumb.removeEventListener('pointerup', onPointerEnd);
+      thumb.removeEventListener('touchmove', preventDefault);
       onPointerMove.clear();
     };
   }, [onMoveEvent, orientation]);

package/esm/ChartZoomSlider/internals/previews/AreaPreviewPlot.js

@@ -8,7 +8,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 const AreaPlotRoot = styled('g', {
   name: 'MuiAreaPlot',
   slot: 'Root'
-})();
+})({});
 export function AreaPreviewPlot({
   axisId
 }) {

package/esm/ChartZoomSlider/internals/previews/BarPreviewPlot.js

@@ -16,16 +16,16 @@ export function BarPreviewPlot(props) {
   return /*#__PURE__*/_jsx("g", {
     children: completedData.map(({
       seriesId,
+      layout,
+      xOrigin,
+      yOrigin,
       data
     }) => /*#__PURE__*/_jsx("g", {
       children: data.map(({
         dataIndex,
         color,
-        layout,
         x,
-        xOrigin,
         y,
-        yOrigin,
         width,
         height
       }) => {

package/esm/Heatmap/Heatmap.js

@@ -333,6 +333,7 @@ process.env.NODE_ENV !== "production" ? Heatmap.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func
   })).isRequired,
   /**
@@ -391,6 +392,7 @@ process.env.NODE_ENV !== "production" ? Heatmap.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number
   })).isRequired,

package/esm/LineChartPro/LineChartPro.js

@@ -343,6 +343,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -410,6 +411,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -469,6 +471,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -529,6 +532,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -588,6 +592,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -647,6 +652,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -710,6 +716,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -773,6 +780,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -832,6 +840,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     zoom: PropTypes.oneOfType([PropTypes.shape({
       filterMode: PropTypes.oneOf(['discard', 'keep']),
@@ -905,6 +914,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -971,6 +981,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1029,6 +1040,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1088,6 +1100,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1146,6 +1159,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1204,6 +1218,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1266,6 +1281,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1328,6 +1344,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({
@@ -1386,6 +1403,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
     tickNumber: PropTypes.number,
     tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: PropTypes.number,
+    tickSpacing: PropTypes.number,
     valueFormatter: PropTypes.func,
     width: PropTypes.number,
     zoom: PropTypes.oneOfType([PropTypes.shape({

package/esm/SankeyChart/SankeyPlot.js

@@ -2,13 +2,11 @@
 
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { styled, useTheme } from '@mui/material/styles';
-import { useDrawingArea } from '@mui/x-charts/hooks';
-import { calculateSankeyLayout } from "./calculateSankeyLayout.js";
+import { styled } from '@mui/material/styles';
 import { SankeyNodeElement } from "./SankeyNodeElement.js";
 import { SankeyLinkElement } from "./SankeyLinkElement.js";
 import { SankeyLinkLabel } from "./SankeyLinkLabel.js";
-import { useSankeySeriesContext } from "../hooks/useSankeySeries.js";
+import { useSankeyLayout, useSankeySeriesContext } from "../hooks/useSankeySeries.js";
 import { sankeyPlotClasses, useUtilityClasses } from "./sankeyClasses.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const SankeyPlotRoot = styled('g')({
@@ -32,25 +30,23 @@ function SankeyPlot(props) {
     onLinkClick,
     onNodeClick
   } = props;
-  const seriesContext = useSankeySeriesContext();
-  if (!seriesContext) {
-    throw new Error(`MUI X Charts: Sankey series context is missing. Ensure the SankeyPlot is used inside a properly configured ChartDataProviderPro.`);
-  }
-  const series = seriesContext.series[seriesContext.seriesOrder?.[0]];
   const classes = useUtilityClasses({
     classes: inputClasses
   });
-  const drawingArea = useDrawingArea();
+  const sankeyContext = useSankeySeriesContext();
+  const sankeySeries = sankeyContext?.series[sankeyContext?.seriesOrder[0]];
+  const layout = useSankeyLayout();
+  if (!sankeySeries) {
+    throw new Error(`MUI X Charts: Sankey series context is missing. Ensure the SankeyPlot is used inside a properly configured ChartDataProviderPro.`);
+  }
+  if (!layout) {
+    return null;
+  }
   const {
     data,
     linkOptions,
     nodeOptions
-  } = series;
-  const theme = useTheme();
-
-  // Calculate layout based on data and dimensions
-  const layout = React.useMemo(() => calculateSankeyLayout(data, drawingArea, theme, series), [drawingArea, data, series, theme]);
-
+  } = sankeySeries;
   // Early return if no data or dimensions
   if (!data || !data.links) {
     return null;
@@ -60,7 +56,7 @@ function SankeyPlot(props) {
     children: [/*#__PURE__*/_jsx("g", {
       className: classes.links,
       children: layout.links.map(link => /*#__PURE__*/_jsx(SankeyLinkElement, {
-        seriesId: series.id,
+        seriesId: sankeySeries.id,
         link: link,
         opacity: linkOptions?.opacity,
         onClick: onLinkClick
@@ -68,7 +64,7 @@ function SankeyPlot(props) {
     }), /*#__PURE__*/_jsx("g", {
       className: classes.nodes,
       children: layout.nodes.map(node => /*#__PURE__*/_jsx(SankeyNodeElement, {
-        seriesId: series.id,
+        seriesId: sankeySeries.id,
         node: node,
         showLabel: nodeOptions?.showLabels,
         onClick: onNodeClick

package/esm/SankeyChart/calculateSankeyLayout.d.ts

@@ -1,6 +1,5 @@
 import type { ChartDrawingArea } from '@mui/x-charts/hooks';
-import type { Theme } from '@mui/material/styles';
-import type { SankeySeriesType, SankeyLayout, SankeyLayoutLink, DefaultizedSankeySeriesType } from "./sankey.types.js";
+import type { SankeyLayout, SankeyLayoutLink, DefaultizedSankeySeriesType } from "./sankey.types.js";
 /**
  * Calculates the layout for a Sankey diagram using d3-sankey
  *
@@ -9,5 +8,5 @@ import type { SankeySeriesType, SankeyLayout, SankeyLayoutLink, DefaultizedSanke
  * @param options Layout configuration options
  * @returns The calculated layout
  */
-export declare function calculateSankeyLayout(data: DefaultizedSankeySeriesType['data'], drawingArea: ChartDrawingArea, theme: Theme, series?: Pick<SankeySeriesType, 'nodeOptions' | 'linkOptions' | 'iterations'>): SankeyLayout;
+export declare function calculateSankeyLayout(series: DefaultizedSankeySeriesType, drawingArea: ChartDrawingArea): SankeyLayout;
 export declare function improvedNaiveSankeyLinkPathHorizontal(link: SankeyLayoutLink, curveCorrection?: number): string;

package/esm/SankeyChart/calculateSankeyLayout.js

@@ -1,8 +1,8 @@
 'use client';
 
 import _extends from "@babel/runtime/helpers/esm/extends";
-import { sankey } from '@mui/x-charts-vendor/d3-sankey';
 import { path } from '@mui/x-charts-vendor/d3-path';
+import { sankey } from "./d3Sankey/index.js";
 import { getNodeAlignFunction } from "./utils.js";
 
 /**
@@ -14,8 +14,9 @@ import { getNodeAlignFunction } from "./utils.js";
  * @returns The calculated layout
  */
 
-export function calculateSankeyLayout(data, drawingArea, theme, series = {}) {
+export function calculateSankeyLayout(series, drawingArea) {
   const {
+    data,
     iterations = 6,
     nodeOptions,
     linkOptions