@mui/x-charts 8.27.5 → 8.28.2

package/RadarChart/RadarAxisHighlight/radarAxisHighlightClasses.d.ts

@@ -1,11 +1,36 @@
+/**
+ * @deprecated Use `RadarClasses` instead.
+ */
 export interface RadarAxisHighlightClasses {
-  /** Styles applied to the root element. */
+  /**
+   * Styles applied to the root element.
+   * @deprecated Use `radarClasses.axisHighlightRoot` instead.
+   */
   root: string;
-  /** Styles applied to the highlighted axis line element. */
+  /**
+   * Styles applied to the highlighted axis line element.
+   * @deprecated Use `radarClasses.axisHighlightLine` instead.
+   */
   line: string;
-  /** Styles applied to every highlight dot. */
+  /**
+   * Styles applied to every highlight dot.
+   * @deprecated Use `radarClasses.axisHighlightDot` instead.
+   */
   dot: string;
 }
+/**
+ * @deprecated Use `RadarClassKey` instead.
+ */
 export type RadarAxisHighlightClassKey = keyof RadarAxisHighlightClasses;
+/**
+ * @deprecated Use `getRadarUtilityClass` instead.
+ */
 export declare function getRadarAxisHighlightUtilityClass(slot: string): string;
-export declare const chartsAxisHighlightClasses: RadarAxisHighlightClasses;
+/**
+ * @deprecated Use `radarClasses` instead.
+ */
+export declare const chartsAxisHighlightClasses: RadarAxisHighlightClasses;
+/**
+ * @deprecated Use `useUtilityClasses` instead.
+ */
+export declare const useUtilityClasses: (classes?: Partial<RadarAxisHighlightClasses>) => Record<"root" | "line" | "dot", string>;

package/RadarChart/RadarAxisHighlight/radarAxisHighlightClasses.js

@@ -6,9 +6,39 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.chartsAxisHighlightClasses = void 0;
 exports.getRadarAxisHighlightUtilityClass = getRadarAxisHighlightUtilityClass;
+exports.useUtilityClasses = void 0;
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
 var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+/**
+ * @deprecated Use `RadarClasses` instead.
+ */
+
+/**
+ * @deprecated Use `RadarClassKey` instead.
+ */
+
+/**
+ * @deprecated Use `getRadarUtilityClass` instead.
+ */
 function getRadarAxisHighlightUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiRadarAxisHighlight', slot);
 }
-const chartsAxisHighlightClasses = exports.chartsAxisHighlightClasses = (0, _generateUtilityClasses.default)('MuiRadarAxisHighlight', ['root', 'line', 'dot']);
+
+/**
+ * @deprecated Use `radarClasses` instead.
+ */
+const chartsAxisHighlightClasses = exports.chartsAxisHighlightClasses = (0, _generateUtilityClasses.default)('MuiRadarAxisHighlight', ['root', 'line', 'dot']);
+
+/**
+ * @deprecated Use `useUtilityClasses` instead.
+ */
+const useUtilityClasses = classes => {
+  const slots = {
+    root: ['root'],
+    line: ['line'],
+    dot: ['dot']
+  };
+  return (0, _composeClasses.default)(slots, getRadarAxisHighlightUtilityClass, classes);
+};
+exports.useUtilityClasses = useUtilityClasses;

package/RadarChart/RadarGrid/RadarGrid.js

@@ -15,6 +15,7 @@ var _CircularRadarGrid = require("./CircularRadarGrid");
 var _SharpRadarStripes = require("./SharpRadarStripes");
 var _CircularRadarStripes = require("./CircularRadarStripes");
 var _radarGridClasses = require("./radarGridClasses");
+var _radarClasses = require("../radarClasses");
 var _jsxRuntime = require("react/jsx-runtime");
 function RadarGrid(props) {
   const theme = (0, _styles.useTheme)();
@@ -24,7 +25,13 @@ function RadarGrid(props) {
     stripeColor = index => index % 2 === 1 ? (theme.vars || theme).palette.text.secondary : 'none'
   } = props;
   const gridData = (0, _useRadarGridData.useRadarGridData)();
-  const classes = (0, _radarGridClasses.useUtilityClasses)(props.classes);
+  const newClasses = (0, _radarClasses.useUtilityClasses)();
+  const deprecatedClasses = (0, _radarGridClasses.useUtilityClasses)(props.classes);
+  const classes = {
+    radial: `${newClasses.gridRadial} ${deprecatedClasses.radial}`,
+    divider: `${newClasses.gridDivider} ${deprecatedClasses.divider}`,
+    stripe: `${newClasses.gridStripe} ${deprecatedClasses.stripe}`
+  };
   if (gridData === null) {
     return null;
   }

package/RadarChart/RadarGrid/radarGridClasses.d.ts

@@ -1,12 +1,36 @@
+/**
+ * @deprecated Use `RadarClasses` instead.
+ */
 export interface RadarGridClasses {
-  /** Styles applied to every radial line element. */
+  /**
+   * Styles applied to every radial line element.
+   * @deprecated Use `radarClasses.gridRadial` instead.
+   */
   radial: string;
-  /** Styles applied to every divider element. */
+  /**
+   * Styles applied to every divider element.
+   * @deprecated Use `radarClasses.gridDivider` instead.
+   */
   divider: string;
-  /** Styles applied to every stripe element. */
+  /**
+   * Styles applied to every stripe element.
+   * @deprecated Use `radarClasses.gridStripe` instead.
+   */
   stripe: string;
 }
+/**
+ * @deprecated Use `RadarClassKey` instead.
+ */
 export type RadarGridClassKey = keyof RadarGridClasses;
+/**
+ * @deprecated Use `getRadarUtilityClass` instead.
+ */
 export declare function getRadarGridUtilityClass(slot: string): string;
+/**
+ * @deprecated Use `radarClasses` instead.
+ */
 export declare const chartsGridClasses: RadarGridClasses;
+/**
+ * @deprecated Use `useUtilityClasses` instead.
+ */
 export declare const useUtilityClasses: (classes?: Partial<RadarGridClasses>) => Record<"divider" | "radial" | "stripe", string>;

package/RadarChart/RadarGrid/radarGridClasses.js

@@ -10,10 +10,29 @@ exports.useUtilityClasses = void 0;
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
 var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+/**
+ * @deprecated Use `RadarClasses` instead.
+ */
+
+/**
+ * @deprecated Use `RadarClassKey` instead.
+ */
+
+/**
+ * @deprecated Use `getRadarUtilityClass` instead.
+ */
 function getRadarGridUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiRadarGrid', slot);
 }
+
+/**
+ * @deprecated Use `radarClasses` instead.
+ */
 const chartsGridClasses = exports.chartsGridClasses = (0, _generateUtilityClasses.default)('MuiRadarGrid', ['radial', 'divider', 'stripe']);
+
+/**
+ * @deprecated Use `useUtilityClasses` instead.
+ */
 const useUtilityClasses = classes => {
   const slots = {
     radial: ['radial'],

package/RadarChart/RadarSeriesPlot/RadarSeriesArea.js

@@ -15,6 +15,7 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _useRadarSeriesData = require("./useRadarSeriesData");
 var _getAreaPath = require("./getAreaPath");
 var _radarSeriesPlotClasses = require("./radarSeriesPlotClasses");
+var _radarClasses = require("../radarClasses");
 var _useItemHighlightedGetter = require("../../hooks/useItemHighlightedGetter");
 var _useInteractionAllItemProps = require("./useInteractionAllItemProps");
 var _useRadarRotationIndex = require("./useRadarRotationIndex");
@@ -59,7 +60,12 @@ function RadarSeriesArea(props) {
     isFaded,
     isHighlighted
   } = (0, _useItemHighlightedGetter.useItemHighlightedGetter)();
-  const classes = (0, _radarSeriesPlotClasses.useUtilityClasses)(props.classes);
+  const newClasses = (0, _radarClasses.useUtilityClasses)();
+  const deprecatedClasses = (0, _radarSeriesPlotClasses.useUtilityClasses)(props.classes);
+  const classes = (0, _extends2.default)({}, deprecatedClasses, {
+    area: `${newClasses.seriesArea} ${deprecatedClasses.area}`,
+    mark: `${newClasses.seriesMark} ${deprecatedClasses.mark}`
+  });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
     children: seriesCoordinates?.map(({
       seriesId: id,

package/RadarChart/RadarSeriesPlot/RadarSeriesMarks.js

@@ -13,8 +13,9 @@ var React = _interopRequireWildcard(require("react"));
 var _clsx = require("clsx");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _useRadarSeriesData = require("./useRadarSeriesData");
-var _useItemHighlightedGetter = require("../../hooks/useItemHighlightedGetter");
 var _radarSeriesPlotClasses = require("./radarSeriesPlotClasses");
+var _radarClasses = require("../radarClasses");
+var _useItemHighlightedGetter = require("../../hooks/useItemHighlightedGetter");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["seriesId", "onItemClick"];
 function getCircleProps(params) {
@@ -49,7 +50,12 @@ function RadarSeriesMarks(props) {
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const seriesCoordinates = (0, _useRadarSeriesData.useRadarSeriesData)(props.seriesId);
-  const classes = (0, _radarSeriesPlotClasses.useUtilityClasses)(props.classes);
+  const newClasses = (0, _radarClasses.useUtilityClasses)();
+  const deprecatedClasses = (0, _radarSeriesPlotClasses.useUtilityClasses)(props.classes);
+  const classes = (0, _extends2.default)({}, deprecatedClasses, {
+    area: `${newClasses.seriesArea} ${deprecatedClasses.area}`,
+    mark: `${newClasses.seriesMark} ${deprecatedClasses.mark}`
+  });
   const {
     isFaded,
     isHighlighted

package/RadarChart/RadarSeriesPlot/RadarSeriesPlot.js

@@ -9,8 +9,9 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _useRadarSeriesData = require("./useRadarSeriesData");
 var _useInteractionAllItemProps = require("./useInteractionAllItemProps");
-var _useItemHighlightedGetter = require("../../hooks/useItemHighlightedGetter");
 var _radarSeriesPlotClasses = require("./radarSeriesPlotClasses");
+var _radarClasses = require("../radarClasses");
+var _useItemHighlightedGetter = require("../../hooks/useItemHighlightedGetter");
 var _RadarSeriesArea = require("./RadarSeriesArea");
 var _RadarSeriesMarks = require("./RadarSeriesMarks");
 var _useRadarRotationIndex = require("./useRadarRotationIndex");
@@ -29,9 +30,14 @@ function RadarSeriesPlot(props) {
     isFaded,
     isHighlighted
   } = (0, _useItemHighlightedGetter.useItemHighlightedGetter)();
-  const classes = (0, _radarSeriesPlotClasses.useUtilityClasses)(inClasses);
+  const newClasses = (0, _radarClasses.useUtilityClasses)();
+  const deprecatedClasses = (0, _radarSeriesPlotClasses.useUtilityClasses)(inClasses);
+  const classes = (0, _extends2.default)({}, deprecatedClasses, {
+    area: `${newClasses.seriesArea} ${deprecatedClasses.area}`,
+    mark: `${newClasses.seriesMark} ${deprecatedClasses.mark}`
+  });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
-    className: classes.root,
+    className: `${newClasses.seriesRoot} ${deprecatedClasses.root}`,
     children: seriesCoordinates?.map(({
       seriesId,
       points,

package/RadarChart/RadarSeriesPlot/radarSeriesPlotClasses.d.ts

@@ -1,16 +1,39 @@
+/**
+ * @deprecated Use `RadarClasses` instead.
+ */
 export interface RadarSeriesPlotClasses {
-  /** Styles applied to the root element. */
+  /**
+   * Styles applied to the root element.
+   * @deprecated Use `radarClasses.seriesRoot` instead.
+   */
   root: string;
   /** Styles applied to the series element if it is highlighted. */
   highlighted: string;
   /** Styles applied to the series element if it is faded. */
   faded: string;
-  /** Styles applied to the series area element. */
+  /**
+   * Styles applied to the series area element.
+   * @deprecated Use `radarClasses.seriesArea` instead.
+   */
   area: string;
-  /** Styles applied to the series mark element. */
+  /** Styles applied to the series mark element.
+   * @deprecated Use `radarClasses.seriesMark` instead.
+   */
   mark: string;
 }
+/**
+ * @deprecated Use `RadarClassKey` instead.
+ */
 export type RadarSeriesPlotClassKey = keyof RadarSeriesPlotClasses;
+/**
+ * @deprecated Use `getRadarUtilityClass` instead.
+ */
 export declare function getRadarSeriesPlotUtilityClass(slot: string): string;
+/**
+ * @deprecated Use `radarClasses` instead.
+ */
 export declare const radarSeriesPlotClasses: Record<"root" | "area" | "mark" | "highlighted" | "faded", string>;
+/**
+ * @deprecated Use `useUtilityClasses` instead.
+ */
 export declare const useUtilityClasses: (classes?: Partial<RadarSeriesPlotClasses>) => Record<"root" | "area" | "mark" | "highlighted" | "faded", string>;

package/RadarChart/RadarSeriesPlot/radarSeriesPlotClasses.js

@@ -9,10 +9,29 @@ exports.useUtilityClasses = exports.radarSeriesPlotClasses = void 0;
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
 var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+/**
+ * @deprecated Use `RadarClasses` instead.
+ */
+
+/**
+ * @deprecated Use `RadarClassKey` instead.
+ */
+
+/**
+ * @deprecated Use `getRadarUtilityClass` instead.
+ */
 function getRadarSeriesPlotUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiRadarSeriesPlot', slot);
 }
+
+/**
+ * @deprecated Use `radarClasses` instead.
+ */
 const radarSeriesPlotClasses = exports.radarSeriesPlotClasses = (0, _generateUtilityClasses.default)('MuiRadarSeriesPlot', ['root', 'area', 'mark', 'highlighted', 'faded']);
+
+/**
+ * @deprecated Use `useUtilityClasses` instead.
+ */
 const useUtilityClasses = classes => {
   const slots = {
     root: ['root'],

package/RadarChart/index.d.ts

@@ -17,4 +17,6 @@ export * from "./RadarAxis/index.js";
 export * from "./RadarAxisHighlight/index.js";
 export * from "./RadarMetricLabels/index.js";
 export * from "./RadarSeriesPlot/index.js";
-export * from "./RadarChart.plugins.js";
+export * from "./RadarChart.plugins.js";
+export { radarClasses } from "./radarClasses.js";
+export type { RadarClassKey, RadarClasses } from "./radarClasses.js";

package/RadarChart/index.js

@@ -7,7 +7,8 @@ var _exportNames = {
   Unstable_RadarChart: true,
   Unstable_RadarDataProvider: true,
   RadarChart: true,
-  RadarDataProvider: true
+  RadarDataProvider: true,
+  radarClasses: true
 };
 Object.defineProperty(exports, "RadarChart", {
   enumerable: true,
@@ -22,6 +23,12 @@ Object.defineProperty(exports, "RadarDataProvider", {
   }
 });
 exports.Unstable_RadarDataProvider = exports.Unstable_RadarChart = void 0;
+Object.defineProperty(exports, "radarClasses", {
+  enumerable: true,
+  get: function () {
+    return _radarClasses.radarClasses;
+  }
+});
 var _RadarChart = require("./RadarChart");
 var _RadarDataProvider = require("./RadarDataProvider");
 var _FocusedRadarMark = require("./FocusedRadarMark");
@@ -108,6 +115,7 @@ Object.keys(_RadarChart2).forEach(function (key) {
     }
   });
 });
+var _radarClasses = require("./radarClasses");
 /**
  * @deprecated radar chart is now stable, import `RadarChart` instead
  */

package/RadarChart/radarClasses.d.ts

@@ -0,0 +1,32 @@
+export interface RadarClasses {
+  /** Styles applied to the radar axis root element. */
+  axisRoot: string;
+  /** Styles applied to the radar axis line element. */
+  axisLine: string;
+  /** Styles applied to every radar axis label element. */
+  axisLabel: string;
+  /** Styles applied to every radial line element of the grid. */
+  gridRadial: string;
+  /** Styles applied to every divider element of the grid. */
+  gridDivider: string;
+  /** Styles applied to every stripe element of the grid. */
+  gridStripe: string;
+  /** Styles applied to the series plot root element. */
+  seriesRoot: string;
+  /** Styles applied to the series area element. */
+  seriesArea: string;
+  /** Styles applied to the series mark element. */
+  seriesMark: string;
+  /** Styles applied to the axis highlight root element. */
+  axisHighlightRoot: string;
+  /** Styles applied to the axis highlight line element. */
+  axisHighlightLine: string;
+  /** Styles applied to every axis highlight dot element. */
+  axisHighlightDot: string;
+}
+export type RadarClassKey = keyof RadarClasses;
+export declare function getRadarUtilityClass(slot: string): string;
+export declare const radarClasses: RadarClasses;
+export declare const useUtilityClasses: (options?: {
+  classes?: Partial<RadarClasses>;
+}) => Record<"axisLine" | "axisLabel" | "axisRoot" | "gridRadial" | "gridDivider" | "gridStripe" | "seriesRoot" | "seriesArea" | "seriesMark" | "axisHighlightRoot" | "axisHighlightLine" | "axisHighlightDot", string>;

package/RadarChart/radarClasses.js

@@ -0,0 +1,36 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getRadarUtilityClass = getRadarUtilityClass;
+exports.useUtilityClasses = exports.radarClasses = void 0;
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+function getRadarUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiRadarChart', slot);
+}
+const radarClasses = exports.radarClasses = (0, _generateUtilityClasses.default)('MuiRadarChart', ['axisRoot', 'axisLine', 'axisLabel', 'gridRadial', 'gridDivider', 'gridStripe', 'seriesRoot', 'seriesArea', 'seriesMark', 'axisHighlightRoot', 'axisHighlightLine', 'axisHighlightDot']);
+const useUtilityClasses = options => {
+  const {
+    classes
+  } = options ?? {};
+  const slots = {
+    axisRoot: ['axisRoot'],
+    axisLine: ['axisLine'],
+    axisLabel: ['axisLabel'],
+    gridRadial: ['gridRadial'],
+    gridDivider: ['gridDivider'],
+    gridStripe: ['gridStripe'],
+    seriesRoot: ['seriesRoot'],
+    seriesArea: ['seriesArea'],
+    seriesMark: ['seriesMark'],
+    axisHighlightRoot: ['axisHighlightRoot'],
+    axisHighlightLine: ['axisHighlightLine'],
+    axisHighlightDot: ['axisHighlightDot']
+  };
+  return (0, _composeClasses.default)(slots, getRadarUtilityClass, classes);
+};
+exports.useUtilityClasses = useUtilityClasses;

package/ScatterChart/index.d.ts

@@ -5,5 +5,5 @@ export * from "./ScatterMarker.types.js";
 export * from "./ScatterMarker.js";
 export * from "./FocusedScatterMark.js";
 export * from "./ScatterChart.plugins.js";
-export { scatterClasses, getScatterUtilityClass } from "./scatterClasses.js";
+export { scatterClasses } from "./scatterClasses.js";
 export type { ScatterClassKey, ScatterClasses } from "./scatterClasses.js";

package/ScatterChart/index.js

@@ -4,15 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 var _exportNames = {
-  scatterClasses: true,
-  getScatterUtilityClass: true
+  scatterClasses: true
 };
-Object.defineProperty(exports, "getScatterUtilityClass", {
-  enumerable: true,
-  get: function () {
-    return _scatterClasses.getScatterUtilityClass;
-  }
-});
 Object.defineProperty(exports, "scatterClasses", {
   enumerable: true,
   get: function () {

package/esm/BarChart/BarLabel/barLabelClasses.d.ts

@@ -1,35 +1,40 @@
 import type { BarLabelOwnerState } from "./BarLabel.types.js";
 /**
- * @deprecated Use `BarClasses` from `../barClasses` instead.
+ * @deprecated Use `BarClasses` instead.
  */
 export interface BarLabelClasses {
-  /** Styles applied to the root element. */
+  /** Styles applied to the root element.
+   * @deprecated Use `barClasses.label` instead.
+   */
   root: string;
   /** Styles applied to the root element if it is highlighted. */
   highlighted: string;
   /** Styles applied to the root element if it is faded. */
   faded: string;
-  /** Styles applied to the root element if it is animated. */
+  /** Styles applied to the root element if it is animated.
+   * @deprecated Use `barClasses.labelAnimate` instead.
+   */
   animate: string;
   /**
    * Styles applied to the root element for a specified series.
    * Needs to be suffixed with the series ID: `.${barLabelClasses.series}-${seriesId}`.
+   * @deprecated Use `[data-series="${seriesId}"]` selector instead.
    */
   series: string;
 }
 /**
- * @deprecated Use `BarClassKey` from `../barClasses` instead.
+ * @deprecated Use `BarClassKey` instead.
  */
 export type BarLabelClassKey = keyof BarLabelClasses;
 /**
- * @deprecated Use `getBarUtilityClass` from `../barClasses` instead.
+ * @deprecated Use `getBarUtilityClass` instead.
  */
 export declare function getBarLabelUtilityClass(slot: string): string;
 /**
- * @deprecated Use `barClasses` from `../barClasses` instead.
+ * @deprecated Use `barClasses` instead.
  */
 export declare const barLabelClasses: Record<"root" | "animate" | "highlighted" | "faded", string>;
 /**
- * @deprecated Use `useBarLabelUtilityClasses` from `../barClasses` instead.
+ * @deprecated Use `useBarLabelUtilityClasses` instead.
  */
 export declare const useUtilityClasses: (ownerState: BarLabelOwnerState) => Record<"root", string>;

package/esm/BarChart/BarLabel/barLabelClasses.js

@@ -3,27 +3,27 @@ import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
 import composeClasses from '@mui/utils/composeClasses';
 
 /**
- * @deprecated Use `BarClasses` from `../barClasses` instead.
+ * @deprecated Use `BarClasses` instead.
  */
 
 /**
- * @deprecated Use `BarClassKey` from `../barClasses` instead.
+ * @deprecated Use `BarClassKey` instead.
  */
 
 /**
- * @deprecated Use `getBarUtilityClass` from `../barClasses` instead.
+ * @deprecated Use `getBarUtilityClass` instead.
  */
 export function getBarLabelUtilityClass(slot) {
   return generateUtilityClass('MuiBarLabel', slot);
 }
 
 /**
- * @deprecated Use `barClasses` from `../barClasses` instead.
+ * @deprecated Use `barClasses` instead.
  */
 export const barLabelClasses = generateUtilityClasses('MuiBarLabel', ['root', 'highlighted', 'faded', 'animate']);
 
 /**
- * @deprecated Use `useBarLabelUtilityClasses` from `../barClasses` instead.
+ * @deprecated Use `useBarLabelUtilityClasses` instead.
  */
 export const useUtilityClasses = ownerState => {
   const {

package/esm/BarChart/barElementClasses.d.ts

@@ -1,10 +1,13 @@
 import type { BarElementOwnerState } from "./barClasses.js";
 export { type BarElementOwnerState };
 /**
- * @deprecated Use `BarClasses` from `./barClasses` instead.
+ * @deprecated Use `BarClasses` instead.
  */
 export interface BarElementClasses {
-  /** Styles applied to the root element. */
+  /**
+   * Styles applied to the root element.
+   * @deprecated Use `barClasses.element` instead.
+   */
   root: string;
   /** Styles applied to the root element if it is highlighted. */
   highlighted: string;
@@ -13,22 +16,23 @@ export interface BarElementClasses {
   /**
    * Styles applied to the root element for a specified series.
    * Needs to be suffixed with the series ID: `.${barElementClasses.series}-${seriesId}`.
+   * @deprecated Use `[data-series="${seriesId}"]` selector instead.
    */
   series: string;
 }
 /**
- * @deprecated Use `BarClassKey` from `./barClasses` instead.
+ * @deprecated Use `BarClassKey` instead.
  */
 export type BarElementClassKey = keyof BarElementClasses;
 /**
- * @deprecated Use `getBarUtilityClass` from `./barClasses` instead.
+ * @deprecated Use `getBarUtilityClass` instead.
  */
 export declare function getBarElementUtilityClass(slot: string): string;
 /**
- * @deprecated Use `barClasses` from `./barClasses` instead.
+ * @deprecated Use `barClasses` instead.
  */
 export declare const barElementClasses: BarElementClasses;
 /**
- * @deprecated Use `useBarElementUtilityClasses` from `./barClasses` instead.
+ * @deprecated Use `useBarElementUtilityClasses` instead.
  */
 export declare const useUtilityClasses: (ownerState: BarElementOwnerState) => Record<"root", string>;

package/esm/BarChart/barElementClasses.js

@@ -3,27 +3,27 @@ import composeClasses from '@mui/utils/composeClasses';
 import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
 
 /**
- * @deprecated Use `BarClasses` from `./barClasses` instead.
+ * @deprecated Use `BarClasses` instead.
  */
 
 /**
- * @deprecated Use `BarClassKey` from `./barClasses` instead.
+ * @deprecated Use `BarClassKey` instead.
  */
 
 /**
- * @deprecated Use `getBarUtilityClass` from `./barClasses` instead.
+ * @deprecated Use `getBarUtilityClass` instead.
  */
 export function getBarElementUtilityClass(slot) {
   return generateUtilityClass('MuiBarElement', slot);
 }
 
 /**
- * @deprecated Use `barClasses` from `./barClasses` instead.
+ * @deprecated Use `barClasses` instead.
  */
 export const barElementClasses = generateUtilityClasses('MuiBarElement', ['root', 'highlighted', 'faded', 'series']);
 
 /**
- * @deprecated Use `useBarElementUtilityClasses` from `./barClasses` instead.
+ * @deprecated Use `useBarElementUtilityClasses` instead.
  */
 export const useUtilityClasses = ownerState => {
   const {

package/esm/BarChart/index.d.ts

@@ -6,5 +6,5 @@ export * from "./FocusedBar.js";
 export * from "./barElementClasses.js";
 export * from "./BarChart.plugins.js";
 export { type BarProps } from "./AnimatedBarElement.js";
-export { barClasses, getBarUtilityClass } from "./barClasses.js";
+export { barClasses } from "./barClasses.js";
 export type { BarClassKey, BarClasses } from "./barClasses.js";

package/esm/BarChart/index.js

@@ -5,4 +5,4 @@ export * from "./BarLabel/index.js";
 export * from "./FocusedBar.js";
 export * from "./barElementClasses.js";
 export * from "./BarChart.plugins.js";
-export { barClasses, getBarUtilityClass } from "./barClasses.js";
+export { barClasses } from "./barClasses.js";