@mui/x-charts-premium 9.1.0 → 9.3.0

package/RadialBarChart/seriesConfig/getItemAtPosition.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = getItemAtPosition;
+var _internals = require("@mui/x-charts/internals");
+function getItemAtPosition(state, point) {
+  const {
+    axis: rotationAxes,
+    axisIds: rotationAxisIds
+  } = (0, _internals.selectorChartRotationAxis)(state);
+  const {
+    axis: radiusAxes,
+    axisIds: radiusAxisIds
+  } = (0, _internals.selectorChartRadiusAxis)(state);
+  const center = (0, _internals.selectorChartPolarCenter)(state);
+  const seriesState = (0, _internals.selectorAllSeriesOfType)(state, 'radialBar');
+  if (!seriesState || seriesState.seriesOrder.length === 0) {
+    return undefined;
+  }
+  const defaultRotationAxisId = rotationAxisIds[0];
+  const defaultRadiusAxisId = radiusAxisIds[0];
+  const polarCoordinate = {
+    rotation: (0, _internals.generateSvg2rotation)(center)(point.x, point.y),
+    radius: Math.sqrt((point.x - center.cx) ** 2 + (point.y - center.cy) ** 2)
+  };
+  for (let stackIndex = 0; stackIndex < seriesState.stackingGroups.length; stackIndex += 1) {
+    const group = seriesState.stackingGroups[stackIndex];
+    const seriesIds = group.ids;
+    for (const seriesId of seriesIds) {
+      const series = (seriesState.series ?? {})[seriesId];
+      const rotationAxisId = series.rotationAxisId ?? defaultRotationAxisId;
+      const radiusAxisId = series.radiusAxisId ?? defaultRadiusAxisId;
+      const rotationAxis = rotationAxes[rotationAxisId];
+      const radiusAxis = radiusAxes[radiusAxisId];
+      const bandAxis = series.layout === 'horizontal' ? radiusAxis : rotationAxis;
+      const continuousAxis = series.layout === 'horizontal' ? rotationAxis : radiusAxis;
+      const clampedAngle = rotationAxis.scale.range()[0] + (0, _internals.clampAngleRad)(polarCoordinate.rotation - rotationAxis.scale.range()[0]);
+      const bandCoordinate = series.layout === 'horizontal' ? polarCoordinate.radius : clampedAngle;
+      const valueCoordinate = series.layout === 'horizontal' ? clampedAngle : polarCoordinate.radius;
+      const dataIndex = (0, _internals.getBandIndex)(bandAxis, {
+        groupNumber: seriesState.stackingGroups.length,
+        groupIndex: stackIndex
+      }, bandCoordinate);
+      if (dataIndex === -1) {
+        continue;
+      }
+
+      // The point is inside the band for this series
+      const bar = series.visibleStackedData[dataIndex];
+      const start = continuousAxis.scale(bar[0]);
+      const end = continuousAxis.scale(bar[1]);
+      if (start == null || end == null) {
+        continue;
+      }
+      const continuousMin = Math.min(start, end);
+      const continuousMax = Math.max(start, end);
+      if (valueCoordinate >= continuousMin && valueCoordinate <= continuousMax) {
+        return {
+          type: 'radialBar',
+          seriesId,
+          dataIndex
+        };
+      }
+    }
+  }
+  return undefined;
+}

package/RadialBarChart/seriesConfig/getItemAtPosition.mjs

@@ -0,0 +1,63 @@
+import { selectorAllSeriesOfType, selectorChartPolarCenter, selectorChartRadiusAxis, selectorChartRotationAxis, getBandIndex, clampAngleRad, generateSvg2rotation } from '@mui/x-charts/internals';
+export default function getItemAtPosition(state, point) {
+  const {
+    axis: rotationAxes,
+    axisIds: rotationAxisIds
+  } = selectorChartRotationAxis(state);
+  const {
+    axis: radiusAxes,
+    axisIds: radiusAxisIds
+  } = selectorChartRadiusAxis(state);
+  const center = selectorChartPolarCenter(state);
+  const seriesState = selectorAllSeriesOfType(state, 'radialBar');
+  if (!seriesState || seriesState.seriesOrder.length === 0) {
+    return undefined;
+  }
+  const defaultRotationAxisId = rotationAxisIds[0];
+  const defaultRadiusAxisId = radiusAxisIds[0];
+  const polarCoordinate = {
+    rotation: generateSvg2rotation(center)(point.x, point.y),
+    radius: Math.sqrt((point.x - center.cx) ** 2 + (point.y - center.cy) ** 2)
+  };
+  for (let stackIndex = 0; stackIndex < seriesState.stackingGroups.length; stackIndex += 1) {
+    const group = seriesState.stackingGroups[stackIndex];
+    const seriesIds = group.ids;
+    for (const seriesId of seriesIds) {
+      const series = (seriesState.series ?? {})[seriesId];
+      const rotationAxisId = series.rotationAxisId ?? defaultRotationAxisId;
+      const radiusAxisId = series.radiusAxisId ?? defaultRadiusAxisId;
+      const rotationAxis = rotationAxes[rotationAxisId];
+      const radiusAxis = radiusAxes[radiusAxisId];
+      const bandAxis = series.layout === 'horizontal' ? radiusAxis : rotationAxis;
+      const continuousAxis = series.layout === 'horizontal' ? rotationAxis : radiusAxis;
+      const clampedAngle = rotationAxis.scale.range()[0] + clampAngleRad(polarCoordinate.rotation - rotationAxis.scale.range()[0]);
+      const bandCoordinate = series.layout === 'horizontal' ? polarCoordinate.radius : clampedAngle;
+      const valueCoordinate = series.layout === 'horizontal' ? clampedAngle : polarCoordinate.radius;
+      const dataIndex = getBandIndex(bandAxis, {
+        groupNumber: seriesState.stackingGroups.length,
+        groupIndex: stackIndex
+      }, bandCoordinate);
+      if (dataIndex === -1) {
+        continue;
+      }
+
+      // The point is inside the band for this series
+      const bar = series.visibleStackedData[dataIndex];
+      const start = continuousAxis.scale(bar[0]);
+      const end = continuousAxis.scale(bar[1]);
+      if (start == null || end == null) {
+        continue;
+      }
+      const continuousMin = Math.min(start, end);
+      const continuousMax = Math.max(start, end);
+      if (valueCoordinate >= continuousMin && valueCoordinate <= continuousMax) {
+        return {
+          type: 'radialBar',
+          seriesId,
+          dataIndex
+        };
+      }
+    }
+  }
+  return undefined;
+}

package/RadialBarChart/seriesConfig/index.js

@@ -14,6 +14,7 @@ var _getColor = _interopRequireDefault(require("./getColor"));
 var _seriesProcessor = _interopRequireDefault(require("./seriesProcessor"));
 var _getSeriesWithDefaultValues = _interopRequireDefault(require("./getSeriesWithDefaultValues"));
 var _descriptionGetter = _interopRequireDefault(require("./descriptionGetter"));
+var _getItemAtPosition = _interopRequireDefault(require("./getItemAtPosition"));
 var _extremums = require("./extremums");
 var _tooltip = _interopRequireDefault(require("./tooltip"));
 _internals.polarSeriesTypes.addType('radialBar');
@@ -27,7 +28,7 @@ const radialBarSeriesConfig = exports.radialBarSeriesConfig = {
   rotationExtremumGetter: _extremums.rotationExtremumGetter,
   radiusExtremumGetter: _extremums.radiusExtremumGetter,
   getSeriesWithDefaultValues: _getSeriesWithDefaultValues.default,
-  // getItemAtPosition,
+  getItemAtPosition: _getItemAtPosition.default,
   keyboardFocusHandler: _keyboardFocusHandler.default,
   identifierSerializer: _internals.identifierSerializerSeriesIdDataIndex,
   identifierCleaner: _internals.identifierCleanerSeriesIdDataIndex,

package/RadialBarChart/seriesConfig/index.mjs

@@ -7,6 +7,7 @@ import colorProcessor from "./getColor.mjs";
 import seriesProcessor from "./seriesProcessor.mjs";
 import getSeriesWithDefaultValues from "./getSeriesWithDefaultValues.mjs";
 import descriptionGetter from "./descriptionGetter.mjs";
+import getItemAtPosition from "./getItemAtPosition.mjs";
 import { radiusExtremumGetter, rotationExtremumGetter } from "./extremums.mjs";
 import tooltipGetter from "./tooltip.mjs";
 polarSeriesTypes.addType('radialBar');
@@ -20,7 +21,7 @@ export const radialBarSeriesConfig = {
   rotationExtremumGetter,
   radiusExtremumGetter,
   getSeriesWithDefaultValues,
-  // getItemAtPosition,
+  getItemAtPosition,
   keyboardFocusHandler,
   identifierSerializer: identifierSerializerSeriesIdDataIndex,
   identifierCleaner: identifierCleanerSeriesIdDataIndex,

package/RadialBarChart/seriesConfig/tooltip.js

@@ -5,30 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _internals = require("@mui/x-charts/internals");
-const tooltipGetter = params => {
-  const {
-    series,
-    getColor,
-    identifier
-  } = params;
-  if (!identifier || identifier.dataIndex === undefined) {
-    return null;
-  }
-  const label = (0, _internals.getLabel)(series.label, 'tooltip');
-  const value = series.data[identifier.dataIndex];
-  if (value == null) {
-    return null;
-  }
-  const formattedValue = series.valueFormatter(value, {
-    dataIndex: identifier.dataIndex
-  });
-  return {
-    identifier,
-    color: getColor(identifier.dataIndex),
-    label,
-    value,
-    formattedValue,
-    markType: series.labelMarkType
-  };
-};
+const tooltipGetter = params => (0, _internals.getLineLikeTooltip)(params, {
+  skipNullValues: true
+});
 var _default = exports.default = tooltipGetter;

package/RadialBarChart/seriesConfig/tooltip.mjs

@@ -1,28 +1,5 @@
-import { getLabel } from '@mui/x-charts/internals';
-const tooltipGetter = params => {
-  const {
-    series,
-    getColor,
-    identifier
-  } = params;
-  if (!identifier || identifier.dataIndex === undefined) {
-    return null;
-  }
-  const label = getLabel(series.label, 'tooltip');
-  const value = series.data[identifier.dataIndex];
-  if (value == null) {
-    return null;
-  }
-  const formattedValue = series.valueFormatter(value, {
-    dataIndex: identifier.dataIndex
-  });
-  return {
-    identifier,
-    color: getColor(identifier.dataIndex),
-    label,
-    value,
-    formattedValue,
-    markType: series.labelMarkType
-  };
-};
+import { getLineLikeTooltip } from '@mui/x-charts/internals';
+const tooltipGetter = params => getLineLikeTooltip(params, {
+  skipNullValues: true
+});
 export default tooltipGetter;

package/RadialBarChart/useRadialBarChartProps.d.mts

@@ -6,6 +6,7 @@ import { type ChartsOverlayProps } from "../ChartsOverlay/index.mjs";
 import { type ChartsRadialDataProviderProps } from "../ChartsRadialDataProvider/index.mjs";
 import type { RadialBarChartProps } from "./RadialBarChart.mjs";
 import type { ChartsWrapperProps } from "../ChartsWrapper/index.mjs";
+import type { ChartsRadialAxisHighlightProps } from "../ChartsRadialAxisHighlight/index.mjs";
 import { type RadialBarChartPluginSignatures } from "./RadialBarChart.plugins.mjs";
 /**
  * A helper function that extracts RadialBarChartProps from the input props
@@ -24,5 +25,6 @@ export declare const useRadialBarChartProps: (props: RadialBarChartProps) => {
   };
   overlayProps: ChartsOverlayProps;
   legendProps: ChartsLegendSlotExtension;
+  axisHighlightProps: ChartsRadialAxisHighlightProps;
   children: React.ReactNode;
 };

package/RadialBarChart/useRadialBarChartProps.d.ts

@@ -6,6 +6,7 @@ import { type ChartsOverlayProps } from "../ChartsOverlay/index.js";
 import { type ChartsRadialDataProviderProps } from "../ChartsRadialDataProvider/index.js";
 import type { RadialBarChartProps } from "./RadialBarChart.js";
 import type { ChartsWrapperProps } from "../ChartsWrapper/index.js";
+import type { ChartsRadialAxisHighlightProps } from "../ChartsRadialAxisHighlight/index.js";
 import { type RadialBarChartPluginSignatures } from "./RadialBarChart.plugins.js";
 /**
  * A helper function that extracts RadialBarChartProps from the input props
@@ -24,5 +25,6 @@ export declare const useRadialBarChartProps: (props: RadialBarChartProps) => {
   };
   overlayProps: ChartsOverlayProps;
   legendProps: ChartsLegendSlotExtension;
+  axisHighlightProps: ChartsRadialAxisHighlightProps;
   children: React.ReactNode;
 };

package/RadialBarChart/useRadialBarChartProps.js

@@ -13,7 +13,7 @@ var React = _interopRequireWildcard(require("react"));
 var _useId = _interopRequireDefault(require("@mui/utils/useId"));
 var _RadialBarChart = require("./RadialBarChart.plugins");
 var _constants = require("../constants");
-const _excluded = ["rotationAxis", "radiusAxis", "series", "width", "height", "margin", "colors", "dataset", "hideLegend", "grid", "children", "slots", "slotProps", "skipAnimation", "loading", "showToolbar"];
+const _excluded = ["rotationAxis", "radiusAxis", "series", "width", "height", "margin", "colors", "dataset", "hideLegend", "grid", "children", "slots", "slotProps", "skipAnimation", "loading", "showToolbar", "axisHighlight"];
 /**
  * A helper function that extracts RadialBarChartProps from the input props
  * and returns an object with props for the children components of RadialBarChart.
@@ -36,7 +36,8 @@ const useRadialBarChartProps = props => {
       slots,
       slotProps,
       skipAnimation,
-      loading
+      loading,
+      axisHighlight
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const id = (0, _useId.default)();
@@ -65,6 +66,12 @@ const useRadialBarChartProps = props => {
     skipAnimation,
     plugins: _RadialBarChart.RADIAL_BAR_CHART_PLUGINS
   });
+  const isHorizontal = series.some(s => s.layout === 'horizontal');
+  const axisHighlightProps = (0, _extends2.default)({}, isHorizontal ? {
+    radius: 'band'
+  } : {
+    rotation: 'band'
+  }, axisHighlight);
   const gridProps = grid;
   const clipPathGroupProps = {
     clipPath: `url(#${clipPathId})`
@@ -94,6 +101,7 @@ const useRadialBarChartProps = props => {
     clipPathGroupProps,
     overlayProps,
     legendProps,
+    axisHighlightProps,
     children
   };
 };

package/RadialBarChart/useRadialBarChartProps.mjs

@@ -2,7 +2,7 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["rotationAxis", "radiusAxis", "series", "width", "height", "margin", "colors", "dataset", "hideLegend", "grid", "children", "slots", "slotProps", "skipAnimation", "loading", "showToolbar"];
+const _excluded = ["rotationAxis", "radiusAxis", "series", "width", "height", "margin", "colors", "dataset", "hideLegend", "grid", "children", "slots", "slotProps", "skipAnimation", "loading", "showToolbar", "axisHighlight"];
 import * as React from 'react';
 import useId from '@mui/utils/useId';
 import { RADIAL_BAR_CHART_PLUGINS } from "./RadialBarChart.plugins.mjs";
@@ -30,7 +30,8 @@ export const useRadialBarChartProps = props => {
       slots,
       slotProps,
       skipAnimation,
-      loading
+      loading,
+      axisHighlight
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const id = useId();
@@ -59,6 +60,12 @@ export const useRadialBarChartProps = props => {
     skipAnimation,
     plugins: RADIAL_BAR_CHART_PLUGINS
   });
+  const isHorizontal = series.some(s => s.layout === 'horizontal');
+  const axisHighlightProps = _extends({}, isHorizontal ? {
+    radius: 'band'
+  } : {
+    rotation: 'band'
+  }, axisHighlight);
   const gridProps = grid;
   const clipPathGroupProps = {
     clipPath: `url(#${clipPathId})`
@@ -88,6 +95,7 @@ export const useRadialBarChartProps = props => {
     clipPathGroupProps,
     overlayProps,
     legendProps,
+    axisHighlightProps,
     children
   };
 };

package/RadialLineChart/RadialArea.d.mts

@@ -1,12 +1,3 @@
-import * as React from 'react';
-import type { CurveType, SeriesId } from '@mui/x-charts/models';
-import { type RadialLinePoint } from "./useRadialLinePlotData.mjs";
-export interface RadialAreaProps extends Omit<React.SVGProps<SVGPathElement>, 'ref' | 'points'> {
-  seriesId: SeriesId;
-  color: string;
-  hidden?: boolean;
-  curve?: CurveType;
-  points: RadialLinePoint[];
-}
-declare function RadialArea(props: RadialAreaProps): import("react/jsx-runtime").JSX.Element;
+import { type RadialLineOrAreaProps } from "./RadialLine.mjs";
+declare function RadialArea(props: RadialLineOrAreaProps): import("react/jsx-runtime").JSX.Element;
 export { RadialArea };

package/RadialLineChart/RadialArea.d.ts

@@ -1,12 +1,3 @@
-import * as React from 'react';
-import type { CurveType, SeriesId } from '@mui/x-charts/models';
-import { type RadialLinePoint } from "./useRadialLinePlotData.js";
-export interface RadialAreaProps extends Omit<React.SVGProps<SVGPathElement>, 'ref' | 'points'> {
-  seriesId: SeriesId;
-  color: string;
-  hidden?: boolean;
-  curve?: CurveType;
-  points: RadialLinePoint[];
-}
-declare function RadialArea(props: RadialAreaProps): import("react/jsx-runtime").JSX.Element;
+import { type RadialLineOrAreaProps } from "./RadialLine.js";
+declare function RadialArea(props: RadialLineOrAreaProps): import("react/jsx-runtime").JSX.Element;
 export { RadialArea };

package/RadialLineChart/RadialArea.js

@@ -13,14 +13,15 @@ var _d3Shape = require("@mui/x-charts-vendor/d3-shape");
 var _internals = require("@mui/x-charts/internals");
 var _hooks = require("../hooks");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["seriesId", "color", "hidden", "curve", "points"];
+const _excluded = ["seriesId", "color", "hidden", "curve", "points", "closePath"];
 function RadialArea(props) {
   const {
       seriesId,
       color,
       hidden,
       curve,
-      points
+      points,
+      closePath
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const identifier = React.useMemo(() => ({
@@ -30,7 +31,7 @@ function RadialArea(props) {
   const highlightState = (0, _hooks.useItemHighlightState)(identifier);
   const isHighlighted = highlightState === 'highlighted';
   const isFaded = highlightState === 'faded';
-  const d = (0, _d3Shape.areaRadial)().angle(p => p.angle).innerRadius(p => p.baseRadius).outerRadius(p => p.radius).curve((0, _internals.getCurveFactory)(curve))(points) || '';
+  const d = (0, _d3Shape.areaRadial)().angle(p => p.angle).innerRadius(p => p.baseRadius).outerRadius(p => p.radius).curve((0, _internals.getCurveFactory)(curve))(closePath ? [...points, points[0]] : points) || '';
   const fadedOpacity = isFaded ? 0.3 : 1;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("path", (0, _extends2.default)({
     "data-series": seriesId,

package/RadialLineChart/RadialArea.mjs

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["seriesId", "color", "hidden", "curve", "points"];
+const _excluded = ["seriesId", "color", "hidden", "curve", "points", "closePath"];
 import * as React from 'react';
 import { areaRadial as d3AreaRadial } from '@mui/x-charts-vendor/d3-shape';
 import { getCurveFactory } from '@mui/x-charts/internals';
@@ -12,7 +12,8 @@ function RadialArea(props) {
       color,
       hidden,
       curve,
-      points
+      points,
+      closePath
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const identifier = React.useMemo(() => ({
@@ -22,7 +23,7 @@ function RadialArea(props) {
   const highlightState = useItemHighlightState(identifier);
   const isHighlighted = highlightState === 'highlighted';
   const isFaded = highlightState === 'faded';
-  const d = d3AreaRadial().angle(p => p.angle).innerRadius(p => p.baseRadius).outerRadius(p => p.radius).curve(getCurveFactory(curve))(points) || '';
+  const d = d3AreaRadial().angle(p => p.angle).innerRadius(p => p.baseRadius).outerRadius(p => p.radius).curve(getCurveFactory(curve))(closePath ? [...points, points[0]] : points) || '';
   const fadedOpacity = isFaded ? 0.3 : 1;
   return /*#__PURE__*/_jsx("path", _extends({
     "data-series": seriesId,

package/RadialLineChart/RadialAreaPlot.js

@@ -38,13 +38,15 @@ function RadialAreaPlot(props) {
       hidden,
       area,
       curve,
-      points
+      points,
+      closePath
     }) => area && /*#__PURE__*/(0, _jsxRuntime.jsx)(_RadialArea.RadialArea, {
       seriesId: seriesId,
       color: color,
       hidden: hidden,
       curve: curve,
       points: points,
+      closePath: closePath,
       className: classes.area
     }, seriesId))
   });

package/RadialLineChart/RadialAreaPlot.mjs

@@ -32,13 +32,15 @@ export function RadialAreaPlot(props) {
       hidden,
       area,
       curve,
-      points
+      points,
+      closePath
     }) => area && /*#__PURE__*/_jsx(RadialArea, {
       seriesId: seriesId,
       color: color,
       hidden: hidden,
       curve: curve,
       points: points,
+      closePath: closePath,
       className: classes.area
     }, seriesId))
   });

package/RadialLineChart/RadialLine.d.mts

@@ -1,12 +1,13 @@
 import * as React from 'react';
 import { type CurveType, type SeriesId } from '@mui/x-charts/models';
 import { type RadialLinePoint } from "./useRadialLinePlotData.mjs";
-export interface RadialLineProps extends Omit<React.SVGProps<SVGPathElement>, 'ref' | 'points'> {
+export interface RadialLineOrAreaProps extends Omit<React.SVGProps<SVGPathElement>, 'ref' | 'points'> {
   seriesId: SeriesId;
   color: string;
   hidden?: boolean;
-  points: RadialLinePoint[];
   curve?: CurveType;
+  points: RadialLinePoint[];
+  closePath?: boolean;
 }
-declare function RadialLine(props: RadialLineProps): import("react/jsx-runtime").JSX.Element;
+declare function RadialLine(props: RadialLineOrAreaProps): import("react/jsx-runtime").JSX.Element;
 export { RadialLine };

package/RadialLineChart/RadialLine.d.ts

@@ -1,12 +1,13 @@
 import * as React from 'react';
 import { type CurveType, type SeriesId } from '@mui/x-charts/models';
 import { type RadialLinePoint } from "./useRadialLinePlotData.js";
-export interface RadialLineProps extends Omit<React.SVGProps<SVGPathElement>, 'ref' | 'points'> {
+export interface RadialLineOrAreaProps extends Omit<React.SVGProps<SVGPathElement>, 'ref' | 'points'> {
   seriesId: SeriesId;
   color: string;
   hidden?: boolean;
-  points: RadialLinePoint[];
   curve?: CurveType;
+  points: RadialLinePoint[];
+  closePath?: boolean;
 }
-declare function RadialLine(props: RadialLineProps): import("react/jsx-runtime").JSX.Element;
+declare function RadialLine(props: RadialLineOrAreaProps): import("react/jsx-runtime").JSX.Element;
 export { RadialLine };

package/RadialLineChart/RadialLine.js

@@ -13,14 +13,15 @@ var _d3Shape = require("@mui/x-charts-vendor/d3-shape");
 var _internals = require("@mui/x-charts/internals");
 var _hooks = require("../hooks");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["seriesId", "color", "hidden", "points", "curve"];
+const _excluded = ["seriesId", "color", "hidden", "points", "curve", "closePath"];
 function RadialLine(props) {
   const {
       seriesId,
       color,
       hidden,
       points,
-      curve
+      curve,
+      closePath
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const identifier = React.useMemo(() => ({
@@ -30,7 +31,7 @@ function RadialLine(props) {
   const highlightState = (0, _hooks.useItemHighlightState)(identifier);
   const isHighlighted = highlightState === 'highlighted';
   const isFaded = highlightState === 'faded';
-  const d = (0, _d3Shape.lineRadial)().angle(p => p.angle).radius(p => p.radius).curve((0, _internals.getCurveFactory)(curve))(points) || '';
+  const d = (0, _d3Shape.lineRadial)().angle(p => p.angle).radius(p => p.radius).curve((0, _internals.getCurveFactory)(curve))(closePath ? [...points, points[0]] : points) || '';
   const fadedOpacity = isFaded ? 0.3 : 1;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("path", (0, _extends2.default)({
     "data-series": seriesId,

package/RadialLineChart/RadialLine.mjs

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["seriesId", "color", "hidden", "points", "curve"];
+const _excluded = ["seriesId", "color", "hidden", "points", "curve", "closePath"];
 import * as React from 'react';
 import { lineRadial as d3LineRadial } from '@mui/x-charts-vendor/d3-shape';
 import { getCurveFactory } from '@mui/x-charts/internals';
@@ -12,7 +12,8 @@ function RadialLine(props) {
       color,
       hidden,
       points,
-      curve
+      curve,
+      closePath
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const identifier = React.useMemo(() => ({
@@ -22,7 +23,7 @@ function RadialLine(props) {
   const highlightState = useItemHighlightState(identifier);
   const isHighlighted = highlightState === 'highlighted';
   const isFaded = highlightState === 'faded';
-  const d = d3LineRadial().angle(p => p.angle).radius(p => p.radius).curve(getCurveFactory(curve))(points) || '';
+  const d = d3LineRadial().angle(p => p.angle).radius(p => p.radius).curve(getCurveFactory(curve))(closePath ? [...points, points[0]] : points) || '';
   const fadedOpacity = isFaded ? 0.3 : 1;
   return /*#__PURE__*/_jsx("path", _extends({
     "data-series": seriesId,

package/RadialLineChart/RadialLineChart.d.mts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import type { MakeOptional } from '@mui/x-internals/types';
 import { type ChartsSlots, type ChartsSlotProps } from '@mui/x-charts/internals';
 import { type ChartsRadialGridProps } from '@mui/x-charts/ChartsRadialGrid';
 import { type ChartsRadialAxisHighlightProps } from '@mui/x-charts/ChartsRadialAxisHighlight';
@@ -6,18 +7,19 @@ import { type ChartsLegendSlots, type ChartsLegendSlotProps } from "../ChartsLeg
 import { type ChartsTooltipSlots, type ChartsTooltipSlotProps } from "../ChartsTooltip/index.mjs";
 import { type RadialLineChartPluginSignatures } from "./RadialLineChart.plugins.mjs";
 import { type ChartsOverlayProps, type ChartsOverlaySlots, type ChartsOverlaySlotProps } from "../ChartsOverlay/index.mjs";
-import type { LinePlotSlots, LinePlotSlotProps, LineSeries } from "../LineChart/index.mjs";
 import { type ChartsToolbarSlots, type ChartsToolbarSlotProps } from "../Toolbar/index.mjs";
 import { type RadialLineHighlightPlotSlots, type RadialLineHighlightPlotSlotProps } from "./RadialLineHighlightPlot.mjs";
 import { type ChartsRadialDataProviderPremiumProps } from "../ChartsRadialDataProviderPremium/index.mjs";
-export interface RadialLineChartSlots extends LinePlotSlots, RadialLineHighlightPlotSlots, ChartsLegendSlots, ChartsOverlaySlots, ChartsTooltipSlots, ChartsToolbarSlots, Partial<ChartsSlots> {}
-export interface RadialLineChartSlotProps extends LinePlotSlotProps, RadialLineHighlightPlotSlotProps, ChartsLegendSlotProps, ChartsOverlaySlotProps, ChartsTooltipSlotProps, ChartsToolbarSlotProps, Partial<ChartsSlotProps> {}
+import type { RadialLineSeriesType } from "../models/seriesType/radialLine.mjs";
+export interface RadialLineChartSlots extends RadialLineHighlightPlotSlots, ChartsLegendSlots, ChartsOverlaySlots, ChartsTooltipSlots, ChartsToolbarSlots, Partial<ChartsSlots> {}
+export interface RadialLineChartSlotProps extends RadialLineHighlightPlotSlotProps, ChartsLegendSlotProps, ChartsOverlaySlotProps, ChartsTooltipSlotProps, ChartsToolbarSlotProps, Partial<ChartsSlotProps> {}
+export type RadialLineSeries = MakeOptional<RadialLineSeriesType, 'type'>;
 export interface RadialLineChartProps extends Omit<ChartsRadialDataProviderPremiumProps<'radialLine', RadialLineChartPluginSignatures>, 'series' | 'plugins' | 'zAxis' | 'slots' | 'slotProps'>, Omit<ChartsOverlayProps, 'slots' | 'slotProps'> {
   /**
    * The series to display in the line chart.
-   * An array of [[LineSeries]] objects.
+   * An array of [[RadialLineSeries]] objects.
    */
-  series: Readonly<LineSeries[]>;
+  series: Readonly<RadialLineSeries[]>;
   /**
    * Option to display a radial grid in the background.
    */

package/RadialLineChart/RadialLineChart.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import type { MakeOptional } from '@mui/x-internals/types';
 import { type ChartsSlots, type ChartsSlotProps } from '@mui/x-charts/internals';
 import { type ChartsRadialGridProps } from '@mui/x-charts/ChartsRadialGrid';
 import { type ChartsRadialAxisHighlightProps } from '@mui/x-charts/ChartsRadialAxisHighlight';
@@ -6,18 +7,19 @@ import { type ChartsLegendSlots, type ChartsLegendSlotProps } from "../ChartsLeg
 import { type ChartsTooltipSlots, type ChartsTooltipSlotProps } from "../ChartsTooltip/index.js";
 import { type RadialLineChartPluginSignatures } from "./RadialLineChart.plugins.js";
 import { type ChartsOverlayProps, type ChartsOverlaySlots, type ChartsOverlaySlotProps } from "../ChartsOverlay/index.js";
-import type { LinePlotSlots, LinePlotSlotProps, LineSeries } from "../LineChart/index.js";
 import { type ChartsToolbarSlots, type ChartsToolbarSlotProps } from "../Toolbar/index.js";
 import { type RadialLineHighlightPlotSlots, type RadialLineHighlightPlotSlotProps } from "./RadialLineHighlightPlot.js";
 import { type ChartsRadialDataProviderPremiumProps } from "../ChartsRadialDataProviderPremium/index.js";
-export interface RadialLineChartSlots extends LinePlotSlots, RadialLineHighlightPlotSlots, ChartsLegendSlots, ChartsOverlaySlots, ChartsTooltipSlots, ChartsToolbarSlots, Partial<ChartsSlots> {}
-export interface RadialLineChartSlotProps extends LinePlotSlotProps, RadialLineHighlightPlotSlotProps, ChartsLegendSlotProps, ChartsOverlaySlotProps, ChartsTooltipSlotProps, ChartsToolbarSlotProps, Partial<ChartsSlotProps> {}
+import type { RadialLineSeriesType } from "../models/seriesType/radialLine.js";
+export interface RadialLineChartSlots extends RadialLineHighlightPlotSlots, ChartsLegendSlots, ChartsOverlaySlots, ChartsTooltipSlots, ChartsToolbarSlots, Partial<ChartsSlots> {}
+export interface RadialLineChartSlotProps extends RadialLineHighlightPlotSlotProps, ChartsLegendSlotProps, ChartsOverlaySlotProps, ChartsTooltipSlotProps, ChartsToolbarSlotProps, Partial<ChartsSlotProps> {}
+export type RadialLineSeries = MakeOptional<RadialLineSeriesType, 'type'>;
 export interface RadialLineChartProps extends Omit<ChartsRadialDataProviderPremiumProps<'radialLine', RadialLineChartPluginSignatures>, 'series' | 'plugins' | 'zAxis' | 'slots' | 'slotProps'>, Omit<ChartsOverlayProps, 'slots' | 'slotProps'> {
   /**
    * The series to display in the line chart.
-   * An array of [[LineSeries]] objects.
+   * An array of [[RadialLineSeries]] objects.
    */
-  series: Readonly<LineSeries[]>;
+  series: Readonly<RadialLineSeries[]>;
   /**
    * Option to display a radial grid in the background.
    */