@mui/x-charts 7.3.0 → 7.3.1

package/esm/context/ZAxisContextProvider.js

@@ -0,0 +1,89 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { getColorScale, getOrdinalColorScale } from '../internals/colorScale';
+import { jsx as _jsx } from "react/jsx-runtime";
+export const ZAxisContext = /*#__PURE__*/React.createContext({
+  zAxis: {},
+  zAxisIds: []
+});
+if (process.env.NODE_ENV !== 'production') {
+  ZAxisContext.displayName = 'ZAxisContext';
+}
+function ZAxisContextProvider(props) {
+  const {
+    zAxis: inZAxis,
+    dataset,
+    children
+  } = props;
+  const zAxis = React.useMemo(() => inZAxis?.map(axisConfig => {
+    const dataKey = axisConfig.dataKey;
+    if (dataKey === undefined || axisConfig.data !== undefined) {
+      return axisConfig;
+    }
+    if (dataset === undefined) {
+      throw Error('MUI X Charts: z-axis uses `dataKey` but no `dataset` is provided.');
+    }
+    return _extends({}, axisConfig, {
+      data: dataset.map(d => d[dataKey])
+    });
+  }), [inZAxis, dataset]);
+  const value = React.useMemo(() => {
+    const allZAxis = zAxis?.map((axis, index) => _extends({
+      id: `defaultized-z-axis-${index}`
+    }, axis)) ?? [];
+    const completedZAxis = {};
+    allZAxis.forEach(axis => {
+      completedZAxis[axis.id] = _extends({}, axis, {
+        colorScale: axis.colorMap && (axis.colorMap.type === 'ordinal' && axis.data ? getOrdinalColorScale(_extends({
+          values: axis.data
+        }, axis.colorMap)) : getColorScale(axis.colorMap))
+      });
+    });
+    return {
+      zAxis: completedZAxis,
+      zAxisIds: allZAxis.map(({
+        id
+      }) => id)
+    };
+  }, [zAxis]);
+  return /*#__PURE__*/_jsx(ZAxisContext.Provider, {
+    value: value,
+    children: children
+  });
+}
+process.env.NODE_ENV !== "production" ? ZAxisContextProvider.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  children: PropTypes.node,
+  /**
+   * An array of objects that can be used to populate series and axes data using their `dataKey` property.
+   */
+  dataset: PropTypes.arrayOf(PropTypes.object),
+  /**
+   * The configuration of the z-axes.
+   */
+  zAxis: PropTypes.arrayOf(PropTypes.shape({
+    colorMap: PropTypes.oneOfType([PropTypes.shape({
+      color: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string.isRequired), PropTypes.func]).isRequired,
+      max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+      min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+      type: PropTypes.oneOf(['continuous']).isRequired
+    }), PropTypes.shape({
+      colors: PropTypes.arrayOf(PropTypes.string).isRequired,
+      thresholds: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]).isRequired).isRequired,
+      type: PropTypes.oneOf(['piecewise']).isRequired
+    }), PropTypes.shape({
+      colors: PropTypes.arrayOf(PropTypes.string).isRequired,
+      type: PropTypes.oneOf(['ordinal']).isRequired,
+      unknownColor: PropTypes.string,
+      values: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number, PropTypes.string]).isRequired)
+    })]),
+    data: PropTypes.array,
+    dataKey: PropTypes.string,
+    id: PropTypes.string
+  }))
+} : void 0;
+export { ZAxisContextProvider };

package/esm/context/index.js

@@ -1 +1 @@
-export {};
+export { ZAxisContextProvider } from './ZAxisContextProvider';

package/esm/internals/colorGetter.js

@@ -2,7 +2,7 @@ import getBarColor from '../BarChart/getColor';
 import getLineColor from '../LineChart/getColor';
 import getScatterColor from '../ScatterChart/getColor';
 import getPieColor from '../PieChart/getColor';
-function getColor(series, xAxis, yAxis) {
+function getColor(series, xAxis, yAxis, zAxis) {
   if (xAxis !== undefined && yAxis !== undefined) {
     if (series.type === 'bar') {
       return getBarColor(series, xAxis, yAxis);
@@ -11,7 +11,7 @@ function getColor(series, xAxis, yAxis) {
       return getLineColor(series, xAxis, yAxis);
     }
     if (series.type === 'scatter') {
-      return getScatterColor(series, xAxis, yAxis);
+      return getScatterColor(series, xAxis, yAxis, zAxis);
     }
   }
   if (series.type === 'pie') {

package/esm/internals/components/ChartsAxesGradients/ChartsAxesGradients.js

@@ -4,8 +4,7 @@ import { DrawingContext } from '../../../context/DrawingProvider';
 import { useDrawingArea } from '../../../hooks';
 import ChartsPiecewiseGradient from './ChartsPiecewiseGradient';
 import ChartsContinuousGradient from './ChartsContinuousGradient';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function useChartGradient() {
   const {
     chartId

package/esm/internals/components/ChartsAxesGradients/ChartsPiecewiseGradient.js

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export default function ChartsPiecewiseGradient(props) {
   const {
     isReveresed,

package/esm/models/z-axis.js

@@ -0,0 +1 @@
+export {};

package/hooks/useAxisEvents.js

@@ -12,7 +12,7 @@ var _utils = require("../internals/utils");
 var _useSvgRef = require("./useSvgRef");
 var _useDrawingArea = require("./useDrawingArea");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function getAsANumber(value) {
   return value instanceof Date ? value.getTime() : value;
 }

package/hooks/useChartDimensions.js

@@ -9,7 +9,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var React = _interopRequireWildcard(require("react"));
 var _constants = require("../constants");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useChartDimensions = (width, height, margin) => {
   const defaultizedMargin = (0, _extends2.default)({}, _constants.DEFAULT_MARGINS, margin);
   const drawingArea = React.useMemo(() => ({

package/hooks/useChartId.js

@@ -7,7 +7,7 @@ exports.useChartId = useChartId;
 var React = _interopRequireWildcard(require("react"));
 var _DrawingProvider = require("../context/DrawingProvider");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function useChartId() {
   const {
     chartId

package/hooks/useDrawingArea.js

@@ -7,7 +7,7 @@ exports.useDrawingArea = useDrawingArea;
 var React = _interopRequireWildcard(require("react"));
 var _DrawingProvider = require("../context/DrawingProvider");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function useDrawingArea() {
   const {
     left,

package/hooks/useInteractionItemProps.js

@@ -8,7 +8,7 @@ var React = _interopRequireWildcard(require("react"));
 var _InteractionProvider = require("../context/InteractionProvider");
 var _HighlightProvider = require("../context/HighlightProvider");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useInteractionItemProps = (scope, skip) => {
   const {
     dispatch: dispatchInteraction

package/hooks/useMounted.js

@@ -8,7 +8,7 @@ exports.useMounted = useMounted;
 var React = _interopRequireWildcard(require("react"));
 var _useEnhancedEffect = _interopRequireDefault(require("@mui/utils/useEnhancedEffect"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function useMounted(defer = false) {
   const [mountedState, setMountedState] = React.useState(false);
   (0, _useEnhancedEffect.default)(() => {

package/hooks/useScale.js

@@ -10,7 +10,7 @@ var React = _interopRequireWildcard(require("react"));
 var _CartesianContextProvider = require("../context/CartesianContextProvider");
 var _isBandScale = require("../internals/isBandScale");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
  * For a given scale return a function that map value to their position.
  * Usefull when dealing with specific scale such as band.

package/hooks/useSeries.js

@@ -11,7 +11,7 @@ exports.useSeries = useSeries;
 var React = _interopRequireWildcard(require("react"));
 var _SeriesContextProvider = require("../context/SeriesContextProvider");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
  * Get access to the internal state of series.
  * Structured by type of series:

package/hooks/useSvgRef.js

@@ -7,7 +7,7 @@ exports.useSvgRef = useSvgRef;
 var React = _interopRequireWildcard(require("react"));
 var _DrawingProvider = require("../context/DrawingProvider");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function useSvgRef() {
   const svgRef = React.useContext(_DrawingProvider.SvgContext);
   if (svgRef === undefined) {

package/hooks/useTicks.js

@@ -8,7 +8,7 @@ exports.useTicks = useTicks;
 var React = _interopRequireWildcard(require("react"));
 var _isBandScale = require("../internals/isBandScale");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function getTickNumber(params) {
   const {
     tickMaxStep,

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-charts v7.3.0
+ * @mui/x-charts v7.3.1
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/internals/colorGetter.d.ts

@@ -1,5 +1,7 @@
 import { DefaultizedBarSeriesType, DefaultizedLineSeriesType, DefaultizedPieSeriesType, DefaultizedScatterSeriesType } from '../models';
 import { AxisDefaultized } from '../models/axis';
+import { ZAxisDefaultized } from '../models/z-axis';
 declare function getColor(series: DefaultizedPieSeriesType): (dataIndex: number) => string;
-declare function getColor(series: DefaultizedBarSeriesType | DefaultizedLineSeriesType | DefaultizedScatterSeriesType | DefaultizedPieSeriesType, xAxis: AxisDefaultized, yAxis: AxisDefaultized): (dataIndex: number) => string;
+declare function getColor(series: DefaultizedBarSeriesType | DefaultizedLineSeriesType, xAxis: AxisDefaultized, yAxis: AxisDefaultized): (dataIndex: number) => string;
+declare function getColor(series: DefaultizedScatterSeriesType, xAxis: AxisDefaultized, yAxis: AxisDefaultized, zAxis?: ZAxisDefaultized): (dataIndex: number) => string;
 export default getColor;

package/internals/colorGetter.js

@@ -9,7 +9,7 @@ var _getColor = _interopRequireDefault(require("../BarChart/getColor"));
 var _getColor2 = _interopRequireDefault(require("../LineChart/getColor"));
 var _getColor3 = _interopRequireDefault(require("../ScatterChart/getColor"));
 var _getColor4 = _interopRequireDefault(require("../PieChart/getColor"));
-function getColor(series, xAxis, yAxis) {
+function getColor(series, xAxis, yAxis, zAxis) {
   if (xAxis !== undefined && yAxis !== undefined) {
     if (series.type === 'bar') {
       return (0, _getColor.default)(series, xAxis, yAxis);
@@ -18,7 +18,7 @@ function getColor(series, xAxis, yAxis) {
       return (0, _getColor2.default)(series, xAxis, yAxis);
     }
     if (series.type === 'scatter') {
-      return (0, _getColor3.default)(series, xAxis, yAxis);
+      return (0, _getColor3.default)(series, xAxis, yAxis, zAxis);
     }
   }
   if (series.type === 'pie') {

package/internals/components/ChartsAxesGradients/ChartsAxesGradients.js

@@ -14,7 +14,7 @@ var _ChartsPiecewiseGradient = _interopRequireDefault(require("./ChartsPiecewise
 var _ChartsContinuousGradient = _interopRequireDefault(require("./ChartsContinuousGradient"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function useChartGradient() {
   const {
     chartId

package/internals/components/ChartsAxesGradients/ChartsContinuousGradient.js

@@ -8,7 +8,7 @@ var React = _interopRequireWildcard(require("react"));
 var _d3Interpolate = require("d3-interpolate");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const PX_PRECISION = 10;
 function ChartsContinuousGradient(props) {
   const {

package/internals/components/ChartsAxesGradients/ChartsPiecewiseGradient.js

@@ -7,7 +7,7 @@ exports.default = ChartsPiecewiseGradient;
 var React = _interopRequireWildcard(require("react"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function ChartsPiecewiseGradient(props) {
   const {
     isReveresed,

package/internals/defaultizeColor.d.ts

@@ -62,6 +62,7 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
     markerSize?: number | undefined;
     label?: string | undefined;
     disableHover?: boolean | undefined;
+    zAxisKey?: string | undefined;
     id?: import("../models/seriesType/common").SeriesId | undefined;
     color: string;
     valueFormatter?: import("../models/seriesType/common").SeriesValueFormatter<import("../models/seriesType").ScatterValueType> | undefined;

package/internals/useAnimatedPath.d.ts

@@ -1 +1,2 @@
+/// <reference types="@react-spring/core" />
 export declare const useAnimatedPath: (path: string, skipAnimation?: boolean) => import("@react-spring/core").Interpolation<string, any>;

package/internals/useAnimatedPath.js

@@ -8,7 +8,7 @@ var React = _interopRequireWildcard(require("react"));
 var _d3Interpolate = require("d3-interpolate");
 var _web = require("@react-spring/web");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function usePrevious(value) {
   const ref = React.useRef(null);
   React.useEffect(() => {

package/models/colorMapping.d.ts

@@ -11,7 +11,7 @@ export interface ContinuousColorConfig<Value = number | Date> {
      */
     max?: Value;
     /**
-     * The colors to render. Can either be and array with the extrem colors, or an interpolation function.
+     * The colors to render. It can be an array with the extremum colors, or an interpolation function.
      */
     color: [string, string] | ((t: number) => string);
 }
@@ -23,7 +23,7 @@ export interface PiecewiseColorConfig<Value = number | Date> {
     thresholds: Value[];
     /**
      * The colors used for each band defined by `thresholds`.
-     * Should contain N+1 colors with N the number of thresholds.
+     * Should contain N+1 colors, where N is the number of thresholds.
      */
     colors: string[];
 }
@@ -36,6 +36,7 @@ export interface OrdinalColorConfig<Value = number | Date | string> {
     values?: Value[];
     /**
      * The color palette.
+     * Items equal to `values[k]` will get the color of `colors[k]`.
      */
     colors: string[];
     /**

package/models/seriesType/pie.d.ts

@@ -60,6 +60,11 @@ export interface PieSeriesType<Tdata = PieValueType> extends CommonSeriesType<Td
      * @default 0
      */
     paddingAngle?: number;
+    /**
+     * The sorting strategy used to order pie slices.
+     * Can be 'none', 'asc', 'desc', or a sorting function.
+     * @default 'none'
+     */
     sortingValues?: ChartsPieSorting;
     /**
      * The label displayed into the arc.

package/models/seriesType/scatter.d.ts

@@ -3,6 +3,7 @@ import { CartesianSeriesType, CommonDefaultizedProps, CommonSeriesType, SeriesId
 export type ScatterValueType = {
     x: number;
     y: number;
+    z?: any;
     /**
      * A unique identifier for the scatter point
      */
@@ -18,6 +19,10 @@ export interface ScatterSeriesType extends CommonSeriesType<ScatterValueType>, C
      * @default false
      */
     disableHover?: boolean;
+    /**
+     * The id of the z-axis used to render the series.
+     */
+    zAxisKey?: string;
 }
 /**
  * An object that allows to identify a single scatter item.

package/models/z-axis.d.ts

@@ -0,0 +1,14 @@
+import type { ScaleOrdinal, ScaleSequential, ScaleThreshold } from 'd3-scale';
+import { ContinuousColorConfig, OrdinalColorConfig, PiecewiseColorConfig } from './colorMapping';
+export interface ZAxisConfig<V = any> {
+    id: string;
+    data?: V[];
+    /**
+     * The key used to retrieve `data` from the `dataset` prop.
+     */
+    dataKey?: string;
+    colorMap?: OrdinalColorConfig | ContinuousColorConfig | PiecewiseColorConfig;
+}
+export interface ZAxisDefaultized extends ZAxisConfig {
+    colorScale?: ScaleOrdinal<string | number | Date, string, string | null> | ScaleOrdinal<number, string, string | null> | ScaleSequential<string, string | null> | ScaleThreshold<number | Date, string | null>;
+}

package/models/z-axis.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/modern/BarChart/BarChart.js

@@ -12,8 +12,7 @@ import { ChartsAxisHighlight } from '../ChartsAxisHighlight';
 import { ChartsClipPath } from '../ChartsClipPath';
 import { ChartsGrid } from '../ChartsGrid';
 import { ChartsOnAxisClickHandler } from '../ChartsOnAxisClickHandler';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * Demos:
  *
@@ -137,30 +136,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
    * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default xAxisIds[0] The id of the first provided axis
    */
-  bottomAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-    classes: PropTypes.object,
-    disableLine: PropTypes.bool,
-    disableTicks: PropTypes.bool,
-    fill: PropTypes.string,
-    label: PropTypes.string,
-    labelFontSize: PropTypes.number,
-    labelStyle: PropTypes.object,
-    position: PropTypes.oneOf(['bottom', 'top']),
-    slotProps: PropTypes.object,
-    slots: PropTypes.object,
-    stroke: PropTypes.string,
-    tickFontSize: PropTypes.number,
-    tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
-    tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
-    tickLabelPlacement: PropTypes.oneOf(['middle', 'tick']),
-    tickLabelStyle: PropTypes.object,
-    tickMaxStep: PropTypes.number,
-    tickMinStep: PropTypes.number,
-    tickNumber: PropTypes.number,
-    tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
-    tickSize: PropTypes.number
-  }), PropTypes.string]),
+  bottomAxis: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
   children: PropTypes.node,
   className: PropTypes.string,
   /**
@@ -200,30 +176,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default yAxisIds[0] The id of the first provided axis
    */
-  leftAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-    classes: PropTypes.object,
-    disableLine: PropTypes.bool,
-    disableTicks: PropTypes.bool,
-    fill: PropTypes.string,
-    label: PropTypes.string,
-    labelFontSize: PropTypes.number,
-    labelStyle: PropTypes.object,
-    position: PropTypes.oneOf(['left', 'right']),
-    slotProps: PropTypes.object,
-    slots: PropTypes.object,
-    stroke: PropTypes.string,
-    tickFontSize: PropTypes.number,
-    tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
-    tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
-    tickLabelPlacement: PropTypes.oneOf(['middle', 'tick']),
-    tickLabelStyle: PropTypes.object,
-    tickMaxStep: PropTypes.number,
-    tickMinStep: PropTypes.number,
-    tickNumber: PropTypes.number,
-    tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
-    tickSize: PropTypes.number
-  }), PropTypes.string]),
+  leftAxis: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
   /**
    * @deprecated Consider using `slotProps.legend` instead.
    */
@@ -268,32 +221,10 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default null
    */
-  rightAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-    classes: PropTypes.object,
-    disableLine: PropTypes.bool,
-    disableTicks: PropTypes.bool,
-    fill: PropTypes.string,
-    label: PropTypes.string,
-    labelFontSize: PropTypes.number,
-    labelStyle: PropTypes.object,
-    position: PropTypes.oneOf(['left', 'right']),
-    slotProps: PropTypes.object,
-    slots: PropTypes.object,
-    stroke: PropTypes.string,
-    tickFontSize: PropTypes.number,
-    tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
-    tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
-    tickLabelPlacement: PropTypes.oneOf(['middle', 'tick']),
-    tickLabelStyle: PropTypes.object,
-    tickMaxStep: PropTypes.number,
-    tickMinStep: PropTypes.number,
-    tickNumber: PropTypes.number,
-    tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
-    tickSize: PropTypes.number
-  }), PropTypes.string]),
+  rightAxis: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
   /**
    * The series to display in the bar chart.
+   * An array of [[BarSeriesType]] objects.
    */
   series: PropTypes.arrayOf(PropTypes.object).isRequired,
   /**
@@ -330,30 +261,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
    * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default null
    */
-  topAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-    classes: PropTypes.object,
-    disableLine: PropTypes.bool,
-    disableTicks: PropTypes.bool,
-    fill: PropTypes.string,
-    label: PropTypes.string,
-    labelFontSize: PropTypes.number,
-    labelStyle: PropTypes.object,
-    position: PropTypes.oneOf(['bottom', 'top']),
-    slotProps: PropTypes.object,
-    slots: PropTypes.object,
-    stroke: PropTypes.string,
-    tickFontSize: PropTypes.number,
-    tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
-    tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
-    tickLabelPlacement: PropTypes.oneOf(['middle', 'tick']),
-    tickLabelStyle: PropTypes.object,
-    tickMaxStep: PropTypes.number,
-    tickMinStep: PropTypes.number,
-    tickNumber: PropTypes.number,
-    tickPlacement: PropTypes.oneOf(['end', 'extremities', 'middle', 'start']),
-    tickSize: PropTypes.number
-  }), PropTypes.string]),
+  topAxis: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
   viewBox: PropTypes.shape({
     height: PropTypes.number,
     width: PropTypes.number,
@@ -367,6 +275,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   /**
    * The configuration of the x-axes.
    * If not provided, a default axis config is used.
+   * An array of [[AxisConfig]] objects.
    */
   xAxis: PropTypes.arrayOf(PropTypes.shape({
     axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
@@ -419,6 +328,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   /**
    * The configuration of the y-axes.
    * If not provided, a default axis config is used.
+   * An array of [[AxisConfig]] objects.
    */
   yAxis: PropTypes.arrayOf(PropTypes.shape({
     axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),

package/modern/BarChart/BarElement.js

@@ -35,7 +35,6 @@ export const BarElementPath = styled(animated.rect, {
   ownerState
 }) => ({
   stroke: 'none',
-  shapeRendering: 'crispEdges',
   fill: ownerState.isHighlighted ? d3Color(ownerState.color).brighter(0.5).formatHex() : ownerState.color,
   transition: 'opacity 0.2s ease-in, fill 0.2s ease-in',
   opacity: ownerState.isFaded && 0.3 || 1

package/modern/BarChart/BarPlot.js

@@ -109,8 +109,8 @@ const useAggregatedData = () => {
       } = series[seriesId];
       return stackedData.map((values, dataIndex) => {
         const valueCoordinates = values.map(v => verticalLayout ? yScale(v) : xScale(v));
-        const minValueCoord = Math.min(...valueCoordinates);
-        const maxValueCoord = Math.max(...valueCoordinates);
+        const minValueCoord = Math.round(Math.min(...valueCoordinates));
+        const maxValueCoord = Math.round(Math.max(...valueCoordinates));
         return {
           seriesId,
           dataIndex,