@mui/x-charts 9.0.3 → 9.1.0

package/LineChart/seriesConfig/curveEvaluation.d.mts

@@ -8,4 +8,22 @@ import type { CurveType } from "../../models/curve.mjs";
 export declare function evaluateCurveY(points: Array<{
   x: number;
   y: number;
-}>, targetX: number, curveType?: CurveType): number | null;
+}>, targetX: number, curveType?: CurveType): number | null;
+/**
+ * Build the curve segments for a set of pixel-coordinate points using d3's curve factory,
+ * then evaluate the point on the curve at the given angle.
+ *
+ * Returns null if no point on the curve matches the target angle.
+ */
+export declare function evaluateCurveAtAngle(
+/**
+ * The points only uses the x/y coordinate system, because internally curve factory only works with x/y coordinates.
+ * So angles/radius are lost during the curve generation.
+ */
+points: Array<{
+  x: number;
+  y: number;
+}>, targetAngle: number, curveType?: CurveType): {
+  x: number;
+  y: number;
+} | null;

package/LineChart/seriesConfig/curveEvaluation.d.ts

@@ -8,4 +8,22 @@ import type { CurveType } from "../../models/curve.js";
 export declare function evaluateCurveY(points: Array<{
   x: number;
   y: number;
-}>, targetX: number, curveType?: CurveType): number | null;
+}>, targetX: number, curveType?: CurveType): number | null;
+/**
+ * Build the curve segments for a set of pixel-coordinate points using d3's curve factory,
+ * then evaluate the point on the curve at the given angle.
+ *
+ * Returns null if no point on the curve matches the target angle.
+ */
+export declare function evaluateCurveAtAngle(
+/**
+ * The points only uses the x/y coordinate system, because internally curve factory only works with x/y coordinates.
+ * So angles/radius are lost during the curve generation.
+ */
+points: Array<{
+  x: number;
+  y: number;
+}>, targetAngle: number, curveType?: CurveType): {
+  x: number;
+  y: number;
+} | null;

package/LineChart/seriesConfig/curveEvaluation.js

@@ -3,8 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.evaluateCurveAtAngle = evaluateCurveAtAngle;
 exports.evaluateCurveY = evaluateCurveY;
+var _epsilon = require("../../utils/epsilon");
 var _getCurve = require("../../internals/getCurve");
+var _clampAngle = require("../../internals/clampAngle");
 var _cubiqSolver = require("../../internals/cubiqSolver");
 /**
  * A straight line segment.
@@ -90,6 +93,42 @@ function findTForX(segment, targetX) {
   return -1;
 }
 
+/**
+ * Find parameter t such that the segment's x(t) ≈ targetX using cubic roots.
+ */
+function findTForAngle(segment, targetAngle) {
+  if (!isBezierSegment(segment)) {
+    // Linear segment.
+    const DeltaY = segment.y1 - segment.y0;
+    const DeltaX = segment.x1 - segment.x0;
+    const dx = Math.sin(targetAngle);
+    const dy = -Math.cos(targetAngle);
+    if (Math.abs(dx) < _epsilon.EPSILON) {
+      if (Math.abs(DeltaX) < _epsilon.EPSILON) {
+        return -1;
+      }
+      return -segment.x0 / DeltaX;
+    }
+    if (Math.abs(dy) < _epsilon.EPSILON) {
+      if (Math.abs(DeltaY) < _epsilon.EPSILON) {
+        return -1;
+      }
+      return -segment.y0 / DeltaY;
+    }
+    return (segment.y0 / dy - segment.x0 / dx) / (DeltaX / dx - DeltaY / dy);
+  }
+  const xBezierCoeffs = cubicBezierCoeffs(segment.x0, segment.cpx1, segment.cpx2, segment.x1);
+  const yBezierCoeffs = cubicBezierCoeffs(segment.y0, segment.cpy1, segment.cpy2, segment.y1);
+  const targetX = Math.sin(targetAngle);
+  const targetY = -Math.cos(targetAngle);
+  const polyToSolve = [targetY * xBezierCoeffs[0] - targetX * yBezierCoeffs[0], targetY * xBezierCoeffs[1] - targetX * yBezierCoeffs[1], targetY * xBezierCoeffs[2] - targetX * yBezierCoeffs[2], targetY * xBezierCoeffs[3] - targetX * yBezierCoeffs[3]];
+  const roots = (0, _cubiqSolver.cubicRoots)(polyToSolve);
+  if (roots.length > 0) {
+    return roots[0];
+  }
+  return -1;
+}
+
 /** Evaluate the segment's y at parameter t. */
 function evaluateSegmentY(segment, t) {
   if (!isBezierSegment(segment)) {
@@ -98,6 +137,14 @@ function evaluateSegmentY(segment, t) {
   return cubicBezier(t, segment.y0, segment.cpy1, segment.cpy2, segment.y1);
 }
 
+/** Evaluate the segment's x at parameter t. */
+function evaluateSegmentX(segment, t) {
+  if (!isBezierSegment(segment)) {
+    return segment.x0 + t * (segment.x1 - segment.x0);
+  }
+  return cubicBezier(t, segment.x0, segment.cpx1, segment.cpx2, segment.x1);
+}
+
 /**
  * Build the curve segments for a set of pixel-coordinate points
  * using d3's curve factory, then evaluate y at the given pixel x.
@@ -136,4 +183,89 @@ function evaluateCurveY(points, targetX, curveType) {
     }
   }
   return null;
+}
+const vectorProduct = (a, b) => a.x * b.y - a.y * b.x;
+
+/**
+ * Build the curve segments for a set of pixel-coordinate points using d3's curve factory,
+ * then evaluate the point on the curve at the given angle.
+ *
+ * Returns null if no point on the curve matches the target angle.
+ */
+function evaluateCurveAtAngle(
+/**
+ * The points only uses the x/y coordinate system, because internally curve factory only works with x/y coordinates.
+ * So angles/radius are lost during the curve generation.
+ */
+points, targetAngle, curveType) {
+  if (points.length === 0) {
+    return null;
+  }
+  if (points.length === 1) {
+    return points[0];
+  }
+  const capture = new SegmentCapture();
+  const factory = (0, _getCurve.getCurveFactory)(curveType);
+  const curveInstance = factory(capture);
+  let pointsContainsOrigin = false;
+  curveInstance.lineStart();
+  for (const p of points) {
+    curveInstance.point(p.x, p.y);
+    if (p.x === 0 && p.y === 0) {
+      pointsContainsOrigin = true;
+    }
+  }
+  curveInstance.lineEnd();
+  const xTarget = Math.sin(targetAngle);
+  const yTarget = -Math.cos(targetAngle);
+  const pointTarget = {
+    x: xTarget,
+    y: yTarget
+  };
+
+  // Find the segment containing targetAngle.
+  for (const segment of capture.segments) {
+    const directionX0Target = vectorProduct({
+      x: segment.x0,
+      y: segment.y0
+    }, pointTarget);
+    const directionTargetX1 = vectorProduct(pointTarget, {
+      x: segment.x1,
+      y: segment.y1
+    });
+
+    // Test if target angle is between x0 and x1. To do so we check the sign of the vector product.
+    if (directionX0Target >= 0 && directionTargetX1 >= 0) {
+      const angle0 = Math.atan2(segment.x0, -segment.y0);
+      const angle1 = Math.atan2(segment.x1, -segment.y1);
+      const clampedAngleGap0 = (0, _clampAngle.clampAngleRad)(targetAngle - angle0);
+      if (clampedAngleGap0 < _epsilon.EPSILON || clampedAngleGap0 > Math.PI * 2 - _epsilon.EPSILON) {
+        return {
+          x: segment.x0,
+          y: segment.y0
+        };
+      }
+      const clampedAngleGap1 = (0, _clampAngle.clampAngleRad)(targetAngle - angle1);
+      if (clampedAngleGap1 < _epsilon.EPSILON || clampedAngleGap1 > Math.PI * 2 - _epsilon.EPSILON) {
+        return {
+          x: segment.x1,
+          y: segment.y1
+        };
+      }
+      const t = findTForAngle(segment, targetAngle);
+      return {
+        x: evaluateSegmentX(segment, t),
+        y: evaluateSegmentY(segment, t)
+      };
+    }
+  }
+  if (pointsContainsOrigin) {
+    // Frequent edge case when handling area with minRadius set to 0.
+    // The only point on the curve is at the origin, so we can return (0, 0) for any angle.
+    return {
+      x: 0,
+      y: 0
+    };
+  }
+  return null;
 }

package/LineChart/seriesConfig/curveEvaluation.mjs

@@ -1,4 +1,6 @@
+import { EPSILON } from "../../utils/epsilon.mjs";
 import { getCurveFactory } from "../../internals/getCurve.mjs";
+import { clampAngleRad } from "../../internals/clampAngle.mjs";
 import { cubicRoots } from "../../internals/cubiqSolver.mjs";
 
 /**
@@ -85,6 +87,42 @@ function findTForX(segment, targetX) {
   return -1;
 }
 
+/**
+ * Find parameter t such that the segment's x(t) ≈ targetX using cubic roots.
+ */
+function findTForAngle(segment, targetAngle) {
+  if (!isBezierSegment(segment)) {
+    // Linear segment.
+    const DeltaY = segment.y1 - segment.y0;
+    const DeltaX = segment.x1 - segment.x0;
+    const dx = Math.sin(targetAngle);
+    const dy = -Math.cos(targetAngle);
+    if (Math.abs(dx) < EPSILON) {
+      if (Math.abs(DeltaX) < EPSILON) {
+        return -1;
+      }
+      return -segment.x0 / DeltaX;
+    }
+    if (Math.abs(dy) < EPSILON) {
+      if (Math.abs(DeltaY) < EPSILON) {
+        return -1;
+      }
+      return -segment.y0 / DeltaY;
+    }
+    return (segment.y0 / dy - segment.x0 / dx) / (DeltaX / dx - DeltaY / dy);
+  }
+  const xBezierCoeffs = cubicBezierCoeffs(segment.x0, segment.cpx1, segment.cpx2, segment.x1);
+  const yBezierCoeffs = cubicBezierCoeffs(segment.y0, segment.cpy1, segment.cpy2, segment.y1);
+  const targetX = Math.sin(targetAngle);
+  const targetY = -Math.cos(targetAngle);
+  const polyToSolve = [targetY * xBezierCoeffs[0] - targetX * yBezierCoeffs[0], targetY * xBezierCoeffs[1] - targetX * yBezierCoeffs[1], targetY * xBezierCoeffs[2] - targetX * yBezierCoeffs[2], targetY * xBezierCoeffs[3] - targetX * yBezierCoeffs[3]];
+  const roots = cubicRoots(polyToSolve);
+  if (roots.length > 0) {
+    return roots[0];
+  }
+  return -1;
+}
+
 /** Evaluate the segment's y at parameter t. */
 function evaluateSegmentY(segment, t) {
   if (!isBezierSegment(segment)) {
@@ -93,6 +131,14 @@ function evaluateSegmentY(segment, t) {
   return cubicBezier(t, segment.y0, segment.cpy1, segment.cpy2, segment.y1);
 }
 
+/** Evaluate the segment's x at parameter t. */
+function evaluateSegmentX(segment, t) {
+  if (!isBezierSegment(segment)) {
+    return segment.x0 + t * (segment.x1 - segment.x0);
+  }
+  return cubicBezier(t, segment.x0, segment.cpx1, segment.cpx2, segment.x1);
+}
+
 /**
  * Build the curve segments for a set of pixel-coordinate points
  * using d3's curve factory, then evaluate y at the given pixel x.
@@ -131,4 +177,89 @@ export function evaluateCurveY(points, targetX, curveType) {
     }
   }
   return null;
+}
+const vectorProduct = (a, b) => a.x * b.y - a.y * b.x;
+
+/**
+ * Build the curve segments for a set of pixel-coordinate points using d3's curve factory,
+ * then evaluate the point on the curve at the given angle.
+ *
+ * Returns null if no point on the curve matches the target angle.
+ */
+export function evaluateCurveAtAngle(
+/**
+ * The points only uses the x/y coordinate system, because internally curve factory only works with x/y coordinates.
+ * So angles/radius are lost during the curve generation.
+ */
+points, targetAngle, curveType) {
+  if (points.length === 0) {
+    return null;
+  }
+  if (points.length === 1) {
+    return points[0];
+  }
+  const capture = new SegmentCapture();
+  const factory = getCurveFactory(curveType);
+  const curveInstance = factory(capture);
+  let pointsContainsOrigin = false;
+  curveInstance.lineStart();
+  for (const p of points) {
+    curveInstance.point(p.x, p.y);
+    if (p.x === 0 && p.y === 0) {
+      pointsContainsOrigin = true;
+    }
+  }
+  curveInstance.lineEnd();
+  const xTarget = Math.sin(targetAngle);
+  const yTarget = -Math.cos(targetAngle);
+  const pointTarget = {
+    x: xTarget,
+    y: yTarget
+  };
+
+  // Find the segment containing targetAngle.
+  for (const segment of capture.segments) {
+    const directionX0Target = vectorProduct({
+      x: segment.x0,
+      y: segment.y0
+    }, pointTarget);
+    const directionTargetX1 = vectorProduct(pointTarget, {
+      x: segment.x1,
+      y: segment.y1
+    });
+
+    // Test if target angle is between x0 and x1. To do so we check the sign of the vector product.
+    if (directionX0Target >= 0 && directionTargetX1 >= 0) {
+      const angle0 = Math.atan2(segment.x0, -segment.y0);
+      const angle1 = Math.atan2(segment.x1, -segment.y1);
+      const clampedAngleGap0 = clampAngleRad(targetAngle - angle0);
+      if (clampedAngleGap0 < EPSILON || clampedAngleGap0 > Math.PI * 2 - EPSILON) {
+        return {
+          x: segment.x0,
+          y: segment.y0
+        };
+      }
+      const clampedAngleGap1 = clampAngleRad(targetAngle - angle1);
+      if (clampedAngleGap1 < EPSILON || clampedAngleGap1 > Math.PI * 2 - EPSILON) {
+        return {
+          x: segment.x1,
+          y: segment.y1
+        };
+      }
+      const t = findTForAngle(segment, targetAngle);
+      return {
+        x: evaluateSegmentX(segment, t),
+        y: evaluateSegmentY(segment, t)
+      };
+    }
+  }
+  if (pointsContainsOrigin) {
+    // Frequent edge case when handling area with minRadius set to 0.
+    // The only point on the curve is at the origin, so we can return (0, 0) for any angle.
+    return {
+      x: 0,
+      y: 0
+    };
+  }
+  return null;
 }

package/LineChart/seriesConfig/getItemAtPosition.js

@@ -8,6 +8,7 @@ var _useChartCartesianAxisRendering = require("../../internals/plugins/featurePl
 var _seriesSelectorOfType = require("../../internals/seriesSelectorOfType");
 var _getAxisValue = require("../../internals/plugins/featurePlugins/useChartCartesianAxis/getAxisValue");
 var _scaleGuards = require("../../internals/scaleGuards");
+var _getAsNumber = require("../../internals/getAsNumber");
 var _getValueToPositionMapper = require("../../hooks/getValueToPositionMapper");
 var _curveEvaluation = require("./curveEvaluation");
 /**
@@ -43,13 +44,12 @@ function getBracketIndices(xAxis, pointX) {
 
   // For continuous axes, find the two adjacent data points surrounding pointX.
   const xValue = scale.invert(pointX);
-  const xAsNumber = xValue instanceof Date ? xValue.getTime() : xValue;
-  const getAsNumber = v => v instanceof Date ? v.getTime() : v;
+  const xAsNumber = (0, _getAsNumber.getAsNumber)(xValue);
 
   // Find the rightmost index where data[i] <= xValue.
   let leftIndex = -1;
   for (let i = 0; i < axisData.length; i += 1) {
-    if (getAsNumber(axisData[i]) <= xAsNumber) {
+    if ((0, _getAsNumber.getAsNumber)(axisData[i]) <= xAsNumber) {
       leftIndex = i;
     } else {
       break;
@@ -60,7 +60,7 @@ function getBracketIndices(xAxis, pointX) {
     return null;
   }
   if (leftIndex === axisData.length - 1) {
-    if (getAsNumber(axisData[leftIndex]) < xAsNumber) {
+    if ((0, _getAsNumber.getAsNumber)(axisData[leftIndex]) < xAsNumber) {
       // Pointer is strictly past the last data point — out of range.
       return null;
     }
@@ -90,6 +90,7 @@ function getBaselinePixelY(baseline, yScale, stackedY0) {
   if (baseline === 'min') {
     return yScale.range()[0];
   }
+
   // Default: use the stacked baseline value.
   const value = yScale(stackedY0);
   if (Number.isNaN(value)) {
@@ -192,6 +193,9 @@ function getItemAtPosition(state, point) {
       connectNulls,
       curve
     } = seriesItem;
+    if (!connectNulls && (data[left] == null || data[right] == null)) {
+      continue;
+    }
     const dataIndex = (0, _getAxisValue.getAxisIndex)(xAxis, point.x);
     if (dataIndex === -1) {
       continue;
@@ -249,7 +253,7 @@ function getItemAtPosition(state, point) {
   }
 
   // Step 2: If the closest line is within the proximity threshold, pick it.
-  if (closestItem && closestDistance <= LINE_PROXIMITY_THRESHOLD) {
+  if (closestItem && closestDistance <= LINE_PROXIMITY_THRESHOLD && !series.series[closestItem.seriesId].area) {
     return closestItem;
   }
 
@@ -261,8 +265,8 @@ function getItemAtPosition(state, point) {
   for (let g = stackingGroups.length - 1; g >= 0; g -= 1) {
     const groupIds = stackingGroups[g].ids;
 
-    // Iterate in reverse so the topmost stacked area is checked first.
-    for (let i = groupIds.length - 1; i >= 0; i -= 1) {
+    // Iterate in direct order cause the `useAreaPlotData` is already doing a reverse order.
+    for (let i = 0; i < groupIds.length; i += 1) {
       const seriesId = groupIds[i];
       const seriesItem = series.series[seriesId];
       if (seriesItem.hidden || !seriesItem.area) {
@@ -292,12 +296,7 @@ function getItemAtPosition(state, point) {
       } = seriesItem;
 
       // Check for null gaps at bracket points.
-      const leftIsNull = data[left] == null;
-      const rightIsNull = data[right] == null;
-      if (leftIsNull && rightIsNull) {
-        continue;
-      }
-      if ((leftIsNull || rightIsNull) && !connectNulls) {
+      if ((data[left] == null || data[right] == null) && !connectNulls) {
         continue;
       }
       const xScale = xAxis.scale;
@@ -308,28 +307,6 @@ function getItemAtPosition(state, point) {
         continue;
       }
       const getPixelX = idx => xPosition(xData[idx]);
-      if (left === right) {
-        // Ordinal axis or pointer exactly on a data point.
-        const stacked = visibleStackedData[left];
-        if (!stacked) {
-          continue;
-        }
-        const yBottom = getBaselinePixelY(baseline, yScale, stacked[0]);
-        const yTop = yScale(stacked[1]);
-        if ([yBottom, yTop].some(v => v == null || Number.isNaN(v))) {
-          continue;
-        }
-        const yMin = Math.min(yBottom, yTop);
-        const yMax = Math.max(yBottom, yTop);
-        if (point.y >= yMin && point.y <= yMax) {
-          return {
-            type: 'line',
-            seriesId,
-            dataIndex: left
-          };
-        }
-        continue;
-      }
 
       // Build pixel-coordinate points for the top and bottom curves,
       // then evaluate them at the pointer's x using the actual d3 curve.

package/LineChart/seriesConfig/getItemAtPosition.mjs

@@ -2,6 +2,7 @@ import { selectorChartXAxis, selectorChartYAxis } from "../../internals/plugins/
 import { selectorAllSeriesOfType } from "../../internals/seriesSelectorOfType.mjs";
 import { getAxisIndex } from "../../internals/plugins/featurePlugins/useChartCartesianAxis/getAxisValue.mjs";
 import { isOrdinalScale } from "../../internals/scaleGuards.mjs";
+import { getAsNumber } from "../../internals/getAsNumber.mjs";
 import { getValueToPositionMapper } from "../../hooks/getValueToPositionMapper.mjs";
 import { evaluateCurveY } from "./curveEvaluation.mjs";
 
@@ -38,8 +39,7 @@ function getBracketIndices(xAxis, pointX) {
 
   // For continuous axes, find the two adjacent data points surrounding pointX.
   const xValue = scale.invert(pointX);
-  const xAsNumber = xValue instanceof Date ? xValue.getTime() : xValue;
-  const getAsNumber = v => v instanceof Date ? v.getTime() : v;
+  const xAsNumber = getAsNumber(xValue);
 
   // Find the rightmost index where data[i] <= xValue.
   let leftIndex = -1;
@@ -85,6 +85,7 @@ function getBaselinePixelY(baseline, yScale, stackedY0) {
   if (baseline === 'min') {
     return yScale.range()[0];
   }
+
   // Default: use the stacked baseline value.
   const value = yScale(stackedY0);
   if (Number.isNaN(value)) {
@@ -187,6 +188,9 @@ export default function getItemAtPosition(state, point) {
       connectNulls,
       curve
     } = seriesItem;
+    if (!connectNulls && (data[left] == null || data[right] == null)) {
+      continue;
+    }
     const dataIndex = getAxisIndex(xAxis, point.x);
     if (dataIndex === -1) {
       continue;
@@ -244,7 +248,7 @@ export default function getItemAtPosition(state, point) {
   }
 
   // Step 2: If the closest line is within the proximity threshold, pick it.
-  if (closestItem && closestDistance <= LINE_PROXIMITY_THRESHOLD) {
+  if (closestItem && closestDistance <= LINE_PROXIMITY_THRESHOLD && !series.series[closestItem.seriesId].area) {
     return closestItem;
   }
 
@@ -256,8 +260,8 @@ export default function getItemAtPosition(state, point) {
   for (let g = stackingGroups.length - 1; g >= 0; g -= 1) {
     const groupIds = stackingGroups[g].ids;
 
-    // Iterate in reverse so the topmost stacked area is checked first.
-    for (let i = groupIds.length - 1; i >= 0; i -= 1) {
+    // Iterate in direct order cause the `useAreaPlotData` is already doing a reverse order.
+    for (let i = 0; i < groupIds.length; i += 1) {
       const seriesId = groupIds[i];
       const seriesItem = series.series[seriesId];
       if (seriesItem.hidden || !seriesItem.area) {
@@ -287,12 +291,7 @@ export default function getItemAtPosition(state, point) {
       } = seriesItem;
 
       // Check for null gaps at bracket points.
-      const leftIsNull = data[left] == null;
-      const rightIsNull = data[right] == null;
-      if (leftIsNull && rightIsNull) {
-        continue;
-      }
-      if ((leftIsNull || rightIsNull) && !connectNulls) {
+      if ((data[left] == null || data[right] == null) && !connectNulls) {
         continue;
       }
       const xScale = xAxis.scale;
@@ -303,28 +302,6 @@ export default function getItemAtPosition(state, point) {
         continue;
       }
       const getPixelX = idx => xPosition(xData[idx]);
-      if (left === right) {
-        // Ordinal axis or pointer exactly on a data point.
-        const stacked = visibleStackedData[left];
-        if (!stacked) {
-          continue;
-        }
-        const yBottom = getBaselinePixelY(baseline, yScale, stacked[0]);
-        const yTop = yScale(stacked[1]);
-        if ([yBottom, yTop].some(v => v == null || Number.isNaN(v))) {
-          continue;
-        }
-        const yMin = Math.min(yBottom, yTop);
-        const yMax = Math.max(yBottom, yTop);
-        if (point.y >= yMin && point.y <= yMax) {
-          return {
-            type: 'line',
-            seriesId,
-            dataIndex: left
-          };
-        }
-        continue;
-      }
 
       // Build pixel-coordinate points for the top and bottom curves,
       // then evaluate them at the pointer's x using the actual d3 curve.

package/LineChart/seriesConfig/getSeriesWithDefaultValues.js

@@ -8,6 +8,7 @@ exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 const getSeriesWithDefaultValues = (seriesData, seriesIndex, colors) => (0, _extends2.default)({}, seriesData, {
   id: seriesData.id ?? `auto-generated-id-${seriesIndex}`,
-  color: seriesData.color ?? colors[seriesIndex % colors.length]
+  color: seriesData.color ?? colors[seriesIndex % colors.length],
+  curve: seriesData.curve ?? 'monotoneX'
 });
 var _default = exports.default = getSeriesWithDefaultValues;

package/LineChart/seriesConfig/getSeriesWithDefaultValues.mjs

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 const getSeriesWithDefaultValues = (seriesData, seriesIndex, colors) => _extends({}, seriesData, {
   id: seriesData.id ?? `auto-generated-id-${seriesIndex}`,
-  color: seriesData.color ?? colors[seriesIndex % colors.length]
+  color: seriesData.color ?? colors[seriesIndex % colors.length],
+  curve: seriesData.curve ?? 'monotoneX'
 });
 export default getSeriesWithDefaultValues;

package/LineChart/seriesConfig/seriesProcessor.js

@@ -51,12 +51,16 @@ function seriesProcessor(params, dataset, isItemVisible) {
         }
       });
     } else if (dataset === undefined && process.env.NODE_ENV !== 'production') {
+      // TODO: fix mui/no-guarded-throw
+      // eslint-disable-next-line mui/no-guarded-throw
       throw new Error(process.env.NODE_ENV !== "production" ? `MUI X Charts: Line series with id="${id}" has no data. ` + 'The chart cannot render this series without data. ' + 'Provide a data property to the series or use the dataset prop.' : (0, _formatErrorMessage2.default)(27, id));
     }
     if (process.env.NODE_ENV !== 'production') {
       if (!data && dataset) {
         const dataKey = series[id].dataKey;
         if (!dataKey && !series[id].valueGetter) {
+          // TODO: fix mui/no-guarded-throw
+          // eslint-disable-next-line mui/no-guarded-throw
           throw new Error(`MUI X Charts: Line series with id="${id}" has no data, no dataKey, and no valueGetter. ` + 'When using the dataset prop, each series must have a dataKey or valueGetter to identify which dataset values to use. ' + 'Add a dataKey or valueGetter property to the series configuration.');
         }
         if (dataKey) {

package/LineChart/seriesConfig/seriesProcessor.mjs

@@ -44,12 +44,16 @@ function seriesProcessor(params, dataset, isItemVisible) {
         }
       });
     } else if (dataset === undefined && process.env.NODE_ENV !== 'production') {
+      // TODO: fix mui/no-guarded-throw
+      // eslint-disable-next-line mui/no-guarded-throw
       throw new Error(process.env.NODE_ENV !== "production" ? `MUI X Charts: Line series with id="${id}" has no data. ` + 'The chart cannot render this series without data. ' + 'Provide a data property to the series or use the dataset prop.' : _formatErrorMessage(27, id));
     }
     if (process.env.NODE_ENV !== 'production') {
       if (!data && dataset) {
         const dataKey = series[id].dataKey;
         if (!dataKey && !series[id].valueGetter) {
+          // TODO: fix mui/no-guarded-throw
+          // eslint-disable-next-line mui/no-guarded-throw
           throw new Error(`MUI X Charts: Line series with id="${id}" has no data, no dataKey, and no valueGetter. ` + 'When using the dataset prop, each series must have a dataKey or valueGetter to identify which dataset values to use. ' + 'Add a dataKey or valueGetter property to the series configuration.');
         }
         if (dataKey) {

package/LineChart/useAreaPlotData.js

@@ -54,9 +54,13 @@ function useAreaPlotData(xAxes, yAxes) {
         const gradientId = yAxes[yAxisId].colorScale && getGradientId(yAxisId) || xAxes[xAxisId].colorScale && getGradientId(xAxisId) || undefined;
         if (process.env.NODE_ENV !== 'production') {
           if (xData === undefined) {
+            // TODO: fix mui/no-guarded-throw
+            // eslint-disable-next-line mui/no-guarded-throw
             throw new Error(`MUI X Charts: ${xAxisId === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisId}"`} should have a data property to be able to display a line plot. ` + 'The x-axis data defines the positions for each point in the line. ' + 'Provide a data array to the x-axis configuration.');
           }
           if (xData.length < stackedData.length) {
+            // TODO: fix mui/no-guarded-throw
+            // eslint-disable-next-line mui/no-guarded-throw
             throw new Error(`MUI X Charts: The data length of the x-axis (${xData.length} items) is less than the length of series data (${stackedData.length} items). ` + 'Some data points will not be displayed because they have no corresponding x-axis value. ' + 'Ensure the x-axis data has at least as many items as the series data.');
           }
         }

package/LineChart/useAreaPlotData.mjs

@@ -47,9 +47,13 @@ export function useAreaPlotData(xAxes, yAxes) {
         const gradientId = yAxes[yAxisId].colorScale && getGradientId(yAxisId) || xAxes[xAxisId].colorScale && getGradientId(xAxisId) || undefined;
         if (process.env.NODE_ENV !== 'production') {
           if (xData === undefined) {
+            // TODO: fix mui/no-guarded-throw
+            // eslint-disable-next-line mui/no-guarded-throw
             throw new Error(`MUI X Charts: ${xAxisId === DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisId}"`} should have a data property to be able to display a line plot. ` + 'The x-axis data defines the positions for each point in the line. ' + 'Provide a data array to the x-axis configuration.');
           }
           if (xData.length < stackedData.length) {
+            // TODO: fix mui/no-guarded-throw
+            // eslint-disable-next-line mui/no-guarded-throw
             throw new Error(`MUI X Charts: The data length of the x-axis (${xData.length} items) is less than the length of series data (${stackedData.length} items). ` + 'Some data points will not be displayed because they have no corresponding x-axis value. ' + 'Ensure the x-axis data has at least as many items as the series data.');
           }
         }

package/LineChart/useLinePlotData.js

@@ -52,6 +52,8 @@ function useLinePlotData(xAxes, yAxes) {
         const gradientId = yAxes[yAxisId].colorScale && getGradientId(yAxisId) || xAxes[xAxisId].colorScale && getGradientId(xAxisId) || undefined;
         if (process.env.NODE_ENV !== 'production') {
           if (xData === undefined) {
+            // TODO: fix mui/no-guarded-throw
+            // eslint-disable-next-line mui/no-guarded-throw
             throw new Error(`MUI X Charts: ${xAxisId === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisId}"`} should have a data property to be able to display a line plot. ` + 'The x-axis data defines the positions for each point in the line. ' + 'Provide a data array to the x-axis configuration.');
           }
           if (xData.length < stackedData.length) {