@mui/x-charts 6.0.0-alpha.3 → 6.0.0-alpha.5

package/esm/PieChart/PieChart.js

@@ -82,7 +82,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the bottom of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * 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({
@@ -109,7 +109,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
   height: PropTypes.number,
   /**
    * Indicate which axis to display the left of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * 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({
@@ -149,7 +149,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the right of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
@@ -214,7 +214,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the top of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({

package/esm/ResponsiveChartContainer/index.js

@@ -21,8 +21,8 @@ const useChartDimensions = (inWidth, inHeight) => {
     }
     const win = ownerWindow(mainEl);
     const computedStyle = win.getComputedStyle(mainEl);
-    const newHeight = parseFloat(computedStyle.height) || 0;
-    const newWidth = parseFloat(computedStyle.width) || 0;
+    const newHeight = Math.floor(parseFloat(computedStyle.height)) || 0;
+    const newWidth = Math.floor(parseFloat(computedStyle.width)) || 0;
     setWidth(newWidth);
     setHeight(newHeight);
   }, []);

package/esm/ScatterChart/Scatter.js

@@ -16,62 +16,48 @@ function Scatter(props) {
   const {
     item
   } = React.useContext(InteractionContext);
-  const getXPosition = getValueToPositionMapper(xScale);
-  const getYPosition = getValueToPositionMapper(yScale);
   const getInteractionItemProps = useInteractionItemProps(series.highlightScope);
-  const xRange = xScale.range();
-  const yRange = yScale.range();
-  const isInRange = ({
-    x,
-    y
-  }) => {
-    if (x < Math.min(...xRange) || x > Math.max(...xRange)) {
-      return false;
-    }
-    if (y < Math.min(...yRange) || y > Math.max(...yRange)) {
-      return false;
-    }
-    return true;
-  };
-  return /*#__PURE__*/_jsx("g", {
-    children: series.data.map(({
-      x,
-      y,
-      id
-    }, index) => ({
-      x: getXPosition(x),
-      y: getYPosition(y),
-      id,
-      dataIndex: index
-    })).filter(isInRange).map(({
-      x,
-      y,
-      id,
-      dataIndex
-    }) => {
-      const isHighlighted = getIsHighlighted(item, {
-        type: 'scatter',
-        seriesId: series.id,
-        dataIndex
-      }, series.highlightScope);
-      const isFaded = !isHighlighted && getIsFaded(item, {
+  const cleanData = React.useMemo(() => {
+    const getXPosition = getValueToPositionMapper(xScale);
+    const getYPosition = getValueToPositionMapper(yScale);
+    const xRange = xScale.range();
+    const yRange = yScale.range();
+    const minXRange = Math.min(...xRange);
+    const maxXRange = Math.max(...xRange);
+    const minYRange = Math.min(...yRange);
+    const maxYRange = Math.max(...yRange);
+    const temp = [];
+    for (let i = 0; i < series.data.length; i += 1) {
+      const scatterPoint = series.data[i];
+      const x = getXPosition(scatterPoint.x);
+      const y = getYPosition(scatterPoint.y);
+      const isInRange = x >= minXRange && x <= maxXRange && y >= minYRange && y <= maxYRange;
+      const pointCtx = {
         type: 'scatter',
         seriesId: series.id,
-        dataIndex
-      }, series.highlightScope);
-      return /*#__PURE__*/_jsx("circle", _extends({
-        cx: 0,
-        cy: 0,
-        r: markerSize,
-        transform: `translate(${x}, ${y})`,
-        fill: color,
-        opacity: isFaded && 0.3 || 1
-      }, getInteractionItemProps({
-        type: 'scatter',
-        seriesId: series.id,
-        dataIndex
-      })), id);
-    })
+        dataIndex: i
+      };
+      if (isInRange) {
+        temp.push({
+          x,
+          y,
+          isFaded: !getIsHighlighted(item, pointCtx, series.highlightScope) && getIsFaded(item, pointCtx, series.highlightScope),
+          interactionProps: getInteractionItemProps(pointCtx),
+          id: scatterPoint.id
+        });
+      }
+    }
+    return temp;
+  }, [yScale, xScale, getInteractionItemProps, item, series.data, series.highlightScope, series.id]);
+  return /*#__PURE__*/_jsx("g", {
+    children: cleanData.map(dataPoint => /*#__PURE__*/_jsx("circle", _extends({
+      cx: 0,
+      cy: 0,
+      r: markerSize,
+      transform: `translate(${dataPoint.x}, ${dataPoint.y})`,
+      fill: color,
+      opacity: dataPoint.isFaded && 0.3 || 1
+    }, dataPoint.interactionProps), dataPoint.id))
   });
 }
 process.env.NODE_ENV !== "production" ? Scatter.propTypes = {

package/esm/ScatterChart/ScatterChart.js

@@ -64,7 +64,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the bottom of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * 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({
@@ -91,7 +91,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
   height: PropTypes.number,
   /**
    * Indicate which axis to display the left of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * 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({
@@ -131,7 +131,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the right of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
@@ -176,7 +176,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the top of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({

package/esm/context/DrawingProvider.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import useChartDimensions from '../hooks/useChartDimensions';
 
 /**
- * Defines the area in which it is possible to draw the charts
+ * Defines the area in which it is possible to draw the charts.
  */
 import { jsx as _jsx } from "react/jsx-runtime";
 export const DrawingContext = /*#__PURE__*/React.createContext({

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-charts v6.0.0-alpha.3
+ * @mui/x-charts v6.0.0-alpha.5
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/legacy/BarChart/BarChart.js

@@ -83,7 +83,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the bottom of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * 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({
@@ -110,7 +110,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   height: PropTypes.number,
   /**
    * Indicate which axis to display the left of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * 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({
@@ -150,7 +150,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the right of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
@@ -193,7 +193,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the top of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({

package/legacy/ChartsAxis/ChartsAxis.js

@@ -69,7 +69,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
   // ----------------------------------------------------------------------
   /**
    * Indicate which axis to display the bottom of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * 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({
@@ -87,7 +87,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
   }), PropTypes.string]),
   /**
    * Indicate which axis to display the left of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * 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({
@@ -105,7 +105,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
   }), PropTypes.string]),
   /**
    * Indicate which axis to display the right of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
@@ -123,7 +123,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
   }), PropTypes.string]),
   /**
    * Indicate which axis to display the top of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({

package/legacy/LineChart/LineChart.js

@@ -86,7 +86,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the bottom of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * 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({
@@ -113,7 +113,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
   height: PropTypes.number,
   /**
    * Indicate which axis to display the left of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * 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({
@@ -153,7 +153,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the right of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
@@ -198,7 +198,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the top of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({

package/legacy/LineChart/extremums.js

@@ -24,9 +24,9 @@ export var getExtremumY = function getExtremumY(params) {
     var _series$seriesId$stac = series[seriesId].stackedData.reduce(function (seriesAcc, stackedValue) {
         var _getValues = getValues(stackedValue),
           _getValues2 = _slicedToArray(_getValues, 2),
-          min = _getValues2[0],
-          max = _getValues2[1];
-        return [Math.min(min, seriesAcc[0]), Math.max(max, seriesAcc[1])];
+          base = _getValues2[0],
+          value = _getValues2[1];
+        return [Math.min(base, value, seriesAcc[0]), Math.max(base, value, seriesAcc[1])];
       }, getValues(series[seriesId].stackedData[0])),
       _series$seriesId$stac2 = _slicedToArray(_series$seriesId$stac, 2),
       seriesMin = _series$seriesId$stac2[0],

package/legacy/PieChart/PieChart.js

@@ -94,7 +94,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the bottom of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * 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({
@@ -121,7 +121,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
   height: PropTypes.number,
   /**
    * Indicate which axis to display the left of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * 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({
@@ -161,7 +161,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the right of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
@@ -226,7 +226,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the top of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({

package/legacy/ResponsiveChartContainer/index.js

@@ -28,8 +28,8 @@ var useChartDimensions = function useChartDimensions(inWidth, inHeight) {
     }
     var win = ownerWindow(mainEl);
     var computedStyle = win.getComputedStyle(mainEl);
-    var newHeight = parseFloat(computedStyle.height) || 0;
-    var newWidth = parseFloat(computedStyle.width) || 0;
+    var newHeight = Math.floor(parseFloat(computedStyle.height)) || 0;
+    var newWidth = Math.floor(parseFloat(computedStyle.width)) || 0;
     setWidth(newWidth);
     setHeight(newHeight);
   }, []);

package/legacy/ScatterChart/Scatter.js

@@ -14,60 +14,49 @@ function Scatter(props) {
     markerSize = props.markerSize;
   var _React$useContext = React.useContext(InteractionContext),
     item = _React$useContext.item;
-  var getXPosition = getValueToPositionMapper(xScale);
-  var getYPosition = getValueToPositionMapper(yScale);
   var getInteractionItemProps = useInteractionItemProps(series.highlightScope);
-  var xRange = xScale.range();
-  var yRange = yScale.range();
-  var isInRange = function isInRange(_ref) {
-    var x = _ref.x,
-      y = _ref.y;
-    if (x < Math.min.apply(Math, _toConsumableArray(xRange)) || x > Math.max.apply(Math, _toConsumableArray(xRange))) {
-      return false;
-    }
-    if (y < Math.min.apply(Math, _toConsumableArray(yRange)) || y > Math.max.apply(Math, _toConsumableArray(yRange))) {
-      return false;
-    }
-    return true;
-  };
-  return /*#__PURE__*/_jsx("g", {
-    children: series.data.map(function (_ref2, index) {
-      var x = _ref2.x,
-        y = _ref2.y,
-        id = _ref2.id;
-      return {
-        x: getXPosition(x),
-        y: getYPosition(y),
-        id: id,
-        dataIndex: index
-      };
-    }).filter(isInRange).map(function (_ref3) {
-      var x = _ref3.x,
-        y = _ref3.y,
-        id = _ref3.id,
-        dataIndex = _ref3.dataIndex;
-      var isHighlighted = getIsHighlighted(item, {
-        type: 'scatter',
-        seriesId: series.id,
-        dataIndex: dataIndex
-      }, series.highlightScope);
-      var isFaded = !isHighlighted && getIsFaded(item, {
+  var cleanData = React.useMemo(function () {
+    var getXPosition = getValueToPositionMapper(xScale);
+    var getYPosition = getValueToPositionMapper(yScale);
+    var xRange = xScale.range();
+    var yRange = yScale.range();
+    var minXRange = Math.min.apply(Math, _toConsumableArray(xRange));
+    var maxXRange = Math.max.apply(Math, _toConsumableArray(xRange));
+    var minYRange = Math.min.apply(Math, _toConsumableArray(yRange));
+    var maxYRange = Math.max.apply(Math, _toConsumableArray(yRange));
+    var temp = [];
+    for (var i = 0; i < series.data.length; i += 1) {
+      var scatterPoint = series.data[i];
+      var x = getXPosition(scatterPoint.x);
+      var y = getYPosition(scatterPoint.y);
+      var isInRange = x >= minXRange && x <= maxXRange && y >= minYRange && y <= maxYRange;
+      var pointCtx = {
         type: 'scatter',
         seriesId: series.id,
-        dataIndex: dataIndex
-      }, series.highlightScope);
+        dataIndex: i
+      };
+      if (isInRange) {
+        temp.push({
+          x: x,
+          y: y,
+          isFaded: !getIsHighlighted(item, pointCtx, series.highlightScope) && getIsFaded(item, pointCtx, series.highlightScope),
+          interactionProps: getInteractionItemProps(pointCtx),
+          id: scatterPoint.id
+        });
+      }
+    }
+    return temp;
+  }, [yScale, xScale, getInteractionItemProps, item, series.data, series.highlightScope, series.id]);
+  return /*#__PURE__*/_jsx("g", {
+    children: cleanData.map(function (dataPoint) {
       return /*#__PURE__*/_jsx("circle", _extends({
         cx: 0,
         cy: 0,
         r: markerSize,
-        transform: "translate(".concat(x, ", ").concat(y, ")"),
+        transform: "translate(".concat(dataPoint.x, ", ").concat(dataPoint.y, ")"),
         fill: color,
-        opacity: isFaded && 0.3 || 1
-      }, getInteractionItemProps({
-        type: 'scatter',
-        seriesId: series.id,
-        dataIndex: dataIndex
-      })), id);
+        opacity: dataPoint.isFaded && 0.3 || 1
+      }, dataPoint.interactionProps), dataPoint.id);
     })
   });
 }

package/legacy/ScatterChart/ScatterChart.js

@@ -64,7 +64,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the bottom of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * 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({
@@ -91,7 +91,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
   height: PropTypes.number,
   /**
    * Indicate which axis to display the left of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * 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({
@@ -131,7 +131,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the right of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
@@ -176,7 +176,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the top of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({

package/legacy/context/DrawingProvider.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import useChartDimensions from '../hooks/useChartDimensions';
 
 /**
- * Defines the area in which it is possible to draw the charts
+ * Defines the area in which it is possible to draw the charts.
  */
 import { jsx as _jsx } from "react/jsx-runtime";
 export var DrawingContext = /*#__PURE__*/React.createContext({

package/legacy/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-charts v6.0.0-alpha.3
+ * @mui/x-charts v6.0.0-alpha.5
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/modern/BarChart/BarChart.js

@@ -78,7 +78,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the bottom of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * 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({
@@ -105,7 +105,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   height: PropTypes.number,
   /**
    * Indicate which axis to display the left of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * 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({
@@ -145,7 +145,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the right of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
@@ -188,7 +188,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the top of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({

package/modern/ChartsAxis/ChartsAxis.js

@@ -71,7 +71,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
   // ----------------------------------------------------------------------
   /**
    * Indicate which axis to display the bottom of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * 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({
@@ -89,7 +89,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
   }), PropTypes.string]),
   /**
    * Indicate which axis to display the left of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * 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({
@@ -107,7 +107,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
   }), PropTypes.string]),
   /**
    * Indicate which axis to display the right of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
@@ -125,7 +125,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
   }), PropTypes.string]),
   /**
    * Indicate which axis to display the top of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({

package/modern/LineChart/LineChart.js

@@ -80,7 +80,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the bottom of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * 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({
@@ -107,7 +107,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
   height: PropTypes.number,
   /**
    * Indicate which axis to display the left of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * 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({
@@ -147,7 +147,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the right of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
@@ -192,7 +192,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
   }),
   /**
    * Indicate which axis to display the top of the charts.
-   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`
+   * Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({

package/modern/LineChart/extremums.js

@@ -17,8 +17,8 @@ export const getExtremumY = params => {
     const getValues = isArea ? d => d : d => [d[1], d[1]]; // Id area should go from bottom to top, without area should only consider the top
 
     const [seriesMin, seriesMax] = series[seriesId].stackedData.reduce((seriesAcc, stackedValue) => {
-      const [min, max] = getValues(stackedValue);
-      return [Math.min(min, seriesAcc[0]), Math.max(max, seriesAcc[1])];
+      const [base, value] = getValues(stackedValue);
+      return [Math.min(base, value, seriesAcc[0]), Math.max(base, value, seriesAcc[1])];
     }, getValues(series[seriesId].stackedData[0]));
     if (acc[0] === null || acc[1] === null) {
       return [seriesMin, seriesMax];