@mui/x-charts 9.0.3 → 9.1.0

package/ChartsRadialAxisHighlight/ChartsRotationAxisHighlight.mjs

@@ -0,0 +1,92 @@
+'use client';
+
+import * as React from 'react';
+import { isOrdinalScale } from "../internals/scaleGuards.mjs";
+import { useStore } from "../internals/store/useStore.mjs";
+import { selectorChartPolarCenter, selectorChartRadiusAxis, selectorChartRotationAxis } from "../internals/plugins/featurePlugins/useChartPolarAxis/index.mjs";
+import { selectorChartsInteractionRotationAxisIndex, selectorChartsInteractionRotationAxisValue } from "../internals/plugins/featurePlugins/useChartPolarAxis/useChartPolarInteraction.selectors.mjs";
+import { ChartsRadialAxisHighlightPath } from "./ChartsRadialAxisHighlightPath.mjs";
+import { jsx as _jsx } from "react/jsx-runtime";
+function polarToSvg(cx, cy, radius, angle) {
+  return [cx + radius * Math.sin(angle), cy - radius * Math.cos(angle)];
+}
+
+/**
+ * @ignore - internal component.
+ */
+export default function ChartsRotationAxisHighlight(props) {
+  const {
+    type,
+    classes
+  } = props;
+  const store = useStore();
+  const {
+    cx,
+    cy
+  } = store.use(selectorChartPolarCenter);
+  const {
+    axis: rotationAxes,
+    axisIds: rotationAxisIds
+  } = store.use(selectorChartRotationAxis);
+  const {
+    axis: radiusAxes,
+    axisIds: radiusAxisIds
+  } = store.use(selectorChartRadiusAxis);
+  const rotationIndex = store.use(selectorChartsInteractionRotationAxisIndex);
+  const rotationValue = store.use(selectorChartsInteractionRotationAxisValue);
+  if (rotationIndex === null || rotationIndex === -1) {
+    return null;
+  }
+  const rotationAxisId = rotationAxisIds[0];
+  const radiusAxisId = radiusAxisIds[0];
+  if (rotationAxisId === undefined || radiusAxisId === undefined) {
+    return null;
+  }
+  const rotationAxis = rotationAxes[rotationAxisId];
+  const radiusAxis = radiusAxes[radiusAxisId];
+  const rotationScale = rotationAxis.scale;
+  const radiusScale = radiusAxis.scale;
+  const innerRadius = radiusScale.range()[0];
+  const outerRadius = radiusScale.range()[1];
+  const angle = rotationScale(rotationValue);
+  if (angle === undefined) {
+    return null;
+  }
+  if (type === 'band') {
+    if (!isOrdinalScale(rotationScale)) {
+      return null;
+    }
+    const step = rotationScale.step();
+    const bandwidth = rotationScale.bandwidth();
+    // For point scale: bandwidth = 0, the band is centered on the value.
+    // For band scale: scale(value) returns the band start, the band size is bandwidth.
+    const startAngle = angle - (step - bandwidth) / 2;
+    const endAngle = startAngle + step;
+    const [x1Outer, y1Outer] = polarToSvg(cx, cy, outerRadius, startAngle);
+    const [x2Outer, y2Outer] = polarToSvg(cx, cy, outerRadius, endAngle);
+    const [x1Inner, y1Inner] = polarToSvg(cx, cy, innerRadius, startAngle);
+    const [x2Inner, y2Inner] = polarToSvg(cx, cy, innerRadius, endAngle);
+    const isLargeArc = Math.abs(endAngle - startAngle) >= Math.PI;
+    const innerArc = innerRadius > 0 ? `L ${x2Inner} ${y2Inner} A ${innerRadius} ${innerRadius} 0 ${isLargeArc ? 1 : 0} 0 ${x1Inner} ${y1Inner}` : `L ${cx} ${cy}`;
+    return /*#__PURE__*/_jsx(ChartsRadialAxisHighlightPath, {
+      d: `M ${x1Outer} ${y1Outer} A ${outerRadius} ${outerRadius} 0 ${isLargeArc ? 1 : 0} 1 ${x2Outer} ${y2Outer} ${innerArc} Z`,
+      className: classes.root,
+      ownerState: {
+        axisHighlight: 'band'
+      }
+    });
+  }
+  if (type === 'line') {
+    const lineAngle = isOrdinalScale(rotationScale) ? angle + rotationScale.bandwidth() / 2 : angle;
+    const [x1, y1] = polarToSvg(cx, cy, innerRadius, lineAngle);
+    const [x2, y2] = polarToSvg(cx, cy, outerRadius, lineAngle);
+    return /*#__PURE__*/_jsx(ChartsRadialAxisHighlightPath, {
+      d: `M ${x1} ${y1} L ${x2} ${y2}`,
+      className: classes.root,
+      ownerState: {
+        axisHighlight: 'line'
+      }
+    });
+  }
+  return null;
+}

package/ChartsRadialAxisHighlight/chartsRadialAxisHighlightClasses.d.mts

@@ -0,0 +1,7 @@
+export interface ChartsRadialAxisHighlightClasses {
+  /** Styles applied to the root element. */
+  root: string;
+}
+export type ChartsRadialAxisHighlightClassKey = keyof ChartsRadialAxisHighlightClasses;
+export declare function getRadialAxisHighlightUtilityClass(slot: string): string;
+export declare const chartsRadialAxisHighlightClasses: ChartsRadialAxisHighlightClasses;

package/ChartsRadialAxisHighlight/chartsRadialAxisHighlightClasses.d.ts

@@ -0,0 +1,7 @@
+export interface ChartsRadialAxisHighlightClasses {
+  /** Styles applied to the root element. */
+  root: string;
+}
+export type ChartsRadialAxisHighlightClassKey = keyof ChartsRadialAxisHighlightClasses;
+export declare function getRadialAxisHighlightUtilityClass(slot: string): string;
+export declare const chartsRadialAxisHighlightClasses: ChartsRadialAxisHighlightClasses;

package/ChartsRadialAxisHighlight/chartsRadialAxisHighlightClasses.js

@@ -0,0 +1,14 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.chartsRadialAxisHighlightClasses = void 0;
+exports.getRadialAxisHighlightUtilityClass = getRadialAxisHighlightUtilityClass;
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+function getRadialAxisHighlightUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiChartsRadialAxisHighlight', slot);
+}
+const chartsRadialAxisHighlightClasses = exports.chartsRadialAxisHighlightClasses = (0, _generateUtilityClasses.default)('MuiChartsRadialAxisHighlight', ['root']);

package/ChartsRadialAxisHighlight/chartsRadialAxisHighlightClasses.mjs

@@ -0,0 +1,6 @@
+import generateUtilityClass from '@mui/utils/generateUtilityClass';
+import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
+export function getRadialAxisHighlightUtilityClass(slot) {
+  return generateUtilityClass('MuiChartsRadialAxisHighlight', slot);
+}
+export const chartsRadialAxisHighlightClasses = generateUtilityClasses('MuiChartsRadialAxisHighlight', ['root']);

package/ChartsRadialAxisHighlight/index.d.mts

@@ -0,0 +1,5 @@
+export { ChartsRadialAxisHighlight as Unstable_ChartsRadialAxisHighlight } from "./ChartsRadialAxisHighlight.mjs";
+export { chartsRadialAxisHighlightClasses } from "./chartsRadialAxisHighlightClasses.mjs";
+export type { ChartsRadialAxisHighlightClasses, ChartsRadialAxisHighlightClassKey } from "./chartsRadialAxisHighlightClasses.mjs";
+export * from "./ChartsRadialAxisHighlight.types.mjs";
+export * from "./ChartsRadialAxisHighlightPath.mjs";

package/ChartsRadialAxisHighlight/index.d.ts

@@ -0,0 +1,5 @@
+export { ChartsRadialAxisHighlight as Unstable_ChartsRadialAxisHighlight } from "./ChartsRadialAxisHighlight.js";
+export { chartsRadialAxisHighlightClasses } from "./chartsRadialAxisHighlightClasses.js";
+export type { ChartsRadialAxisHighlightClasses, ChartsRadialAxisHighlightClassKey } from "./chartsRadialAxisHighlightClasses.js";
+export * from "./ChartsRadialAxisHighlight.types.js";
+export * from "./ChartsRadialAxisHighlightPath.js";

package/ChartsRadialAxisHighlight/index.js

@@ -0,0 +1,47 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  Unstable_ChartsRadialAxisHighlight: true,
+  chartsRadialAxisHighlightClasses: true
+};
+Object.defineProperty(exports, "Unstable_ChartsRadialAxisHighlight", {
+  enumerable: true,
+  get: function () {
+    return _ChartsRadialAxisHighlight.ChartsRadialAxisHighlight;
+  }
+});
+Object.defineProperty(exports, "chartsRadialAxisHighlightClasses", {
+  enumerable: true,
+  get: function () {
+    return _chartsRadialAxisHighlightClasses.chartsRadialAxisHighlightClasses;
+  }
+});
+var _ChartsRadialAxisHighlight = require("./ChartsRadialAxisHighlight");
+var _chartsRadialAxisHighlightClasses = require("./chartsRadialAxisHighlightClasses");
+var _ChartsRadialAxisHighlight2 = require("./ChartsRadialAxisHighlight.types");
+Object.keys(_ChartsRadialAxisHighlight2).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _ChartsRadialAxisHighlight2[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _ChartsRadialAxisHighlight2[key];
+    }
+  });
+});
+var _ChartsRadialAxisHighlightPath = require("./ChartsRadialAxisHighlightPath");
+Object.keys(_ChartsRadialAxisHighlightPath).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _ChartsRadialAxisHighlightPath[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _ChartsRadialAxisHighlightPath[key];
+    }
+  });
+});

package/ChartsRadialAxisHighlight/index.mjs

@@ -0,0 +1,4 @@
+export { ChartsRadialAxisHighlight as Unstable_ChartsRadialAxisHighlight } from "./ChartsRadialAxisHighlight.mjs";
+export { chartsRadialAxisHighlightClasses } from "./chartsRadialAxisHighlightClasses.mjs";
+export * from "./ChartsRadialAxisHighlight.types.mjs";
+export * from "./ChartsRadialAxisHighlightPath.mjs";

package/ChartsRadiusAxis/index.d.mts

@@ -1,3 +1,4 @@
-export { type ChartsRadiusAxisProps, ChartsRadiusAxis as Unstable_ChartsRadiusAxis } from "./ChartsRadiusAxis.mjs";
+export { ChartsRadiusAxis as Unstable_ChartsRadiusAxis } from "./ChartsRadiusAxis.mjs";
 export { chartsRadialAxisClasses } from "./chartsRadiusAxisClasses.mjs";
-export type { ChartsRadialAxisClasses, ChartsRadialAxisClassKey } from "./chartsRadiusAxisClasses.mjs";
+export type { ChartsRadialAxisClasses, ChartsRadialAxisClassKey } from "./chartsRadiusAxisClasses.mjs";
+export { type ChartsRadiusAxisProps } from "../models/axis.mjs";

package/ChartsRadiusAxis/index.d.ts

@@ -1,3 +1,4 @@
-export { type ChartsRadiusAxisProps, ChartsRadiusAxis as Unstable_ChartsRadiusAxis } from "./ChartsRadiusAxis.js";
+export { ChartsRadiusAxis as Unstable_ChartsRadiusAxis } from "./ChartsRadiusAxis.js";
 export { chartsRadialAxisClasses } from "./chartsRadiusAxisClasses.js";
-export type { ChartsRadialAxisClasses, ChartsRadialAxisClassKey } from "./chartsRadiusAxisClasses.js";
+export type { ChartsRadialAxisClasses, ChartsRadialAxisClassKey } from "./chartsRadiusAxisClasses.js";
+export { type ChartsRadiusAxisProps } from "../models/axis.js";

package/ChartsRadiusAxis/index.mjs

@@ -1,2 +1,4 @@
 export { ChartsRadiusAxis as Unstable_ChartsRadiusAxis } from "./ChartsRadiusAxis.mjs";
-export { chartsRadialAxisClasses } from "./chartsRadiusAxisClasses.mjs";
+export { chartsRadialAxisClasses } from "./chartsRadiusAxisClasses.mjs";
+
+// Re-export types

package/ChartsRotationAxis/index.d.mts

@@ -1,2 +1,3 @@
-export { type ChartsRotationAxisProps, ChartsRotationAxis as Unstable_ChartsRotationAxis } from "./ChartsRotationAxis.mjs";
-export { type ChartsRadialAxisClasses, type ChartsRadialAxisClassKey, chartsRadialAxisClasses } from "./chartsRotationAxisClasses.mjs";
+export { ChartsRotationAxis as Unstable_ChartsRotationAxis } from "./ChartsRotationAxis.mjs";
+export { type ChartsRadialAxisClasses, type ChartsRadialAxisClassKey, chartsRadialAxisClasses } from "./chartsRotationAxisClasses.mjs";
+export { type ChartsRotationAxisProps } from "../models/axis.mjs";

package/ChartsRotationAxis/index.d.ts

@@ -1,2 +1,3 @@
-export { type ChartsRotationAxisProps, ChartsRotationAxis as Unstable_ChartsRotationAxis } from "./ChartsRotationAxis.js";
-export { type ChartsRadialAxisClasses, type ChartsRadialAxisClassKey, chartsRadialAxisClasses } from "./chartsRotationAxisClasses.js";
+export { ChartsRotationAxis as Unstable_ChartsRotationAxis } from "./ChartsRotationAxis.js";
+export { type ChartsRadialAxisClasses, type ChartsRadialAxisClassKey, chartsRadialAxisClasses } from "./chartsRotationAxisClasses.js";
+export { type ChartsRotationAxisProps } from "../models/axis.js";

package/ChartsRotationAxis/index.mjs

@@ -1,2 +1,4 @@
 export { ChartsRotationAxis as Unstable_ChartsRotationAxis } from "./ChartsRotationAxis.mjs";
-export { chartsRadialAxisClasses } from "./chartsRotationAxisClasses.mjs";
+export { chartsRadialAxisClasses } from "./chartsRotationAxisClasses.mjs";
+
+// Re-export types

package/ChartsTooltip/useAxesTooltip.js

@@ -34,7 +34,15 @@ function defaultAxisTooltipConfig(axis, dataIndex, axisDirection) {
     seriesItems: []
   };
 }
-
+function getSeriesMark(series) {
+  if (!('showMark' in series) || !series.showMark) {
+    return undefined;
+  }
+  if ('shape' in series && series.shape) {
+    return series.shape;
+  }
+  return 'circle';
+}
 /**
  * Returns the axes to display in the tooltip and the series item related to them.
  */
@@ -169,7 +177,7 @@ function useAxesTooltip(params) {
           formattedValue,
           formattedLabel,
           markType: seriesToAdd.labelMarkType,
-          markShape: 'showMark' in seriesToAdd && seriesToAdd.showMark ? seriesToAdd.shape ?? 'circle' : undefined
+          markShape: getSeriesMark(seriesToAdd)
         });
       }
     });
@@ -213,7 +221,7 @@ function useAxesTooltip(params) {
           formattedValue,
           formattedLabel,
           markType: seriesToAdd.labelMarkType,
-          markShape: 'showMark' in seriesToAdd && seriesToAdd.showMark ? 'circle' : undefined
+          markShape: getSeriesMark(seriesToAdd)
         });
       }
     });

package/ChartsTooltip/useAxesTooltip.mjs

@@ -29,7 +29,15 @@ function defaultAxisTooltipConfig(axis, dataIndex, axisDirection) {
     seriesItems: []
   };
 }
-
+function getSeriesMark(series) {
+  if (!('showMark' in series) || !series.showMark) {
+    return undefined;
+  }
+  if ('shape' in series && series.shape) {
+    return series.shape;
+  }
+  return 'circle';
+}
 /**
  * Returns the axes to display in the tooltip and the series item related to them.
  */
@@ -164,7 +172,7 @@ export function useAxesTooltip(params) {
           formattedValue,
           formattedLabel,
           markType: seriesToAdd.labelMarkType,
-          markShape: 'showMark' in seriesToAdd && seriesToAdd.showMark ? seriesToAdd.shape ?? 'circle' : undefined
+          markShape: getSeriesMark(seriesToAdd)
         });
       }
     });
@@ -208,7 +216,7 @@ export function useAxesTooltip(params) {
           formattedValue,
           formattedLabel,
           markType: seriesToAdd.labelMarkType,
-          markShape: 'showMark' in seriesToAdd && seriesToAdd.showMark ? 'circle' : undefined
+          markShape: getSeriesMark(seriesToAdd)
         });
       }
     });