@mui/x-charts 9.0.2 → 9.0.3

package/ChartsTooltip/useItemTooltip.mjs

@@ -3,10 +3,11 @@
 import { useSeries } from "../hooks/useSeries.mjs";
 import { selectorChartsTooltipItem } from "../internals/plugins/featurePlugins/useChartTooltip/index.mjs";
 import { useStore } from "../internals/store/useStore.mjs";
-import { useRotationAxes, useXAxes, useYAxes } from "../hooks/useAxis.mjs";
+import { useRadiusAxes, useRotationAxes, useXAxes, useYAxes } from "../hooks/useAxis.mjs";
 import { useZAxes } from "../hooks/useZAxis.mjs";
 import { selectorChartSeriesConfig } from "../internals/plugins/corePlugins/useChartSeriesConfig/index.mjs";
 import { isCartesianSeries } from "../internals/isCartesian.mjs";
+import { isPolarSeries } from "../internals/isPolar.mjs";
 export function useInternalItemTooltip() {
   const store = useStore();
   const identifier = store.use(selectorChartsTooltipItem);
@@ -28,6 +29,10 @@ export function useInternalItemTooltip() {
     rotationAxis,
     rotationAxisIds
   } = useRotationAxes();
+  const {
+    radiusAxis,
+    radiusAxisIds
+  } = useRadiusAxes();
   if (!identifier) {
     return null;
   }
@@ -37,9 +42,16 @@ export function useInternalItemTooltip() {
   }
   const xAxisId = isCartesianSeries(itemSeries) ? itemSeries.xAxisId ?? xAxisIds[0] : undefined;
   const yAxisId = isCartesianSeries(itemSeries) ? itemSeries.yAxisId ?? yAxisIds[0] : undefined;
+  const radiusAxisId = isPolarSeries(itemSeries) ? ('radiusAxisId' in itemSeries ? itemSeries.radiusAxisId : undefined) ?? radiusAxisIds[0] : undefined;
+  const rotationAxisId = isPolarSeries(itemSeries) ? ('rotationAxisId' in itemSeries ? itemSeries.rotationAxisId : undefined) ?? rotationAxisIds[0] : undefined;
   const zAxisId = 'zAxisId' in itemSeries ? itemSeries.zAxisId ?? zAxisIds[0] : zAxisIds[0];
-  const rotationAxisId = rotationAxisIds[0];
-  const getColor = seriesConfig[itemSeries.type].colorProcessor?.(itemSeries, xAxisId !== undefined ? xAxis[xAxisId] : undefined, yAxisId !== undefined ? yAxis[yAxisId] : undefined, zAxisId !== undefined ? zAxis[zAxisId] : undefined) ?? (() => '');
+  const mainAxis =
+  // eslint-disable-next-line no-nested-ternary
+  rotationAxisId !== undefined ? rotationAxis[rotationAxisId] : xAxisId !== undefined ? xAxis[xAxisId] : undefined;
+  const secondAxis =
+  // eslint-disable-next-line no-nested-ternary
+  radiusAxisId !== undefined ? radiusAxis[radiusAxisId] : yAxisId !== undefined ? yAxis[yAxisId] : undefined;
+  const getColor = seriesConfig[itemSeries.type].colorProcessor(itemSeries, mainAxis, secondAxis, zAxisId !== undefined ? zAxis[zAxisId] : undefined);
   const axesConfig = {};
   if (xAxisId !== undefined) {
     axesConfig.x = xAxis[xAxisId];
@@ -50,6 +62,9 @@ export function useInternalItemTooltip() {
   if (rotationAxisId !== undefined) {
     axesConfig.rotation = rotationAxis[rotationAxisId];
   }
+  if (radiusAxisId !== undefined) {
+    axesConfig.radius = radiusAxis[radiusAxisId];
+  }
   return seriesConfig[itemSeries.type].tooltipGetter({
     series: itemSeries,
     axesConfig,