@mui/x-charts 8.16.0 → 8.17.0

package/BarChart/AnimatedBarElement.d.ts

@@ -39,4 +39,4 @@ export interface BarProps extends Omit<React.SVGProps<SVGRectElement>, 'id' | 'c
    */
   skipAnimation: boolean;
 }
-export declare function AnimatedBarElement(props: BarProps): React.JSX.Element;
+export declare function AnimatedBarElement(props: BarProps): import("react/jsx-runtime").JSX.Element;

package/BarChart/BarChart.js

@@ -90,6 +90,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     y: _propTypes.default.oneOf(['band', 'line', 'none'])
   }),
   /**
+   * @deprecated Use `barLabel` in the chart series instead.
    * If provided, the function will be used to format the label of the bar.
    * It can be set to 'value' to display the current value.
    * @param {BarItem} item The item to format.

package/BarChart/BarClipPath.d.ts

@@ -33,5 +33,5 @@ export interface BarClipPathProps {
 /**
  * @ignore - internal component.
  */
-declare function BarClipPath(props: BarClipPathProps): React.JSX.Element | null;
+declare function BarClipPath(props: BarClipPathProps): import("react/jsx-runtime").JSX.Element | null;
 export { BarClipPath };

package/BarChart/BarElement.d.ts

@@ -32,7 +32,7 @@ export type BarElementProps = Omit<BarElementOwnerState, 'isFaded' | 'isHighligh
   layout: 'horizontal' | 'vertical';
   skipAnimation: boolean;
 };
-declare function BarElement(props: BarElementProps): React.JSX.Element;
+declare function BarElement(props: BarElementProps): import("react/jsx-runtime").JSX.Element;
 declare namespace BarElement {
   var propTypes: any;
 }

package/BarChart/BarElement.js

@@ -39,23 +39,21 @@ function BarElement(props) {
       height
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-  const interactionProps = (0, _useInteractionItemProps.useInteractionItemProps)({
+  const itemIdentifier = React.useMemo(() => ({
     type: 'bar',
     seriesId: id,
     dataIndex
-  });
+  }), [id, dataIndex]);
+  const interactionProps = (0, _useInteractionItemProps.useInteractionItemProps)(itemIdentifier);
   const {
     isFaded,
     isHighlighted
-  } = (0, _useItemHighlighted.useItemHighlighted)({
-    seriesId: id,
-    dataIndex
-  });
-  const isFocused = (0, _useIsItemFocused.useIsItemFocused)({
+  } = (0, _useItemHighlighted.useItemHighlighted)(itemIdentifier);
+  const isFocused = (0, _useIsItemFocused.useIsItemFocused)(React.useMemo(() => ({
     seriesType: 'bar',
     seriesId: id,
     dataIndex
-  });
+  }), [id, dataIndex]));
   const ownerState = {
     id,
     dataIndex,

package/BarChart/BarLabel/BarLabel.d.ts

@@ -27,7 +27,7 @@ export type BarLabelProps = Omit<React.SVGProps<SVGTextElement>, 'ref' | 'id' |
    */
   height: number;
 };
-declare function BarLabel(inProps: BarLabelProps): React.JSX.Element;
+declare function BarLabel(inProps: BarLabelProps): import("react/jsx-runtime").JSX.Element;
 declare namespace BarLabel {
   var propTypes: any;
 }

package/BarChart/BarLabel/BarLabelItem.d.ts

@@ -71,7 +71,7 @@ export type BarLabelItemProps = Omit<BarLabelOwnerState, 'isFaded' | 'isHighligh
 /**
  * @ignore - internal component.
  */
-declare function BarLabelItem(props: BarLabelItemProps): React.JSX.Element | null;
+declare function BarLabelItem(props: BarLabelItemProps): import("react/jsx-runtime").JSX.Element | null;
 declare namespace BarLabelItem {
   var propTypes: any;
 }

package/BarChart/BarLabel/BarLabelPlot.d.ts

@@ -1,13 +1,12 @@
-import * as React from 'react';
 import type { ProcessedBarSeriesData } from "../types.js";
 import { BarLabelItemProps } from "./BarLabelItem.js";
 type BarLabelPlotProps = {
-  bars: ProcessedBarSeriesData[];
+  processedSeries: ProcessedBarSeriesData;
   skipAnimation?: boolean;
   barLabel?: BarLabelItemProps['barLabel'];
 };
 /**
  * @ignore - internal component.
  */
-declare function BarLabelPlot(props: BarLabelPlotProps): React.JSX.Element;
+declare function BarLabelPlot(props: BarLabelPlotProps): import("react/jsx-runtime").JSX.Element | null;
 export { BarLabelPlot };

package/BarChart/BarLabel/BarLabelPlot.js

@@ -12,49 +12,54 @@ var React = _interopRequireWildcard(require("react"));
 var _BarLabelItem = require("./BarLabelItem");
 var _barClasses = require("../barClasses");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["bars", "skipAnimation"];
+const _excluded = ["processedSeries", "skipAnimation"];
 /**
  * @ignore - internal component.
  */
 function BarLabelPlot(props) {
   const {
-      bars,
+      processedSeries,
       skipAnimation
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const {
+    seriesId,
+    data
+  } = processedSeries;
   const classes = (0, _barClasses.useUtilityClasses)();
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
-    children: bars.flatMap(({
-      seriesId,
-      data
-    }) => /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
-      className: classes.seriesLabels,
-      "data-series": seriesId,
-      children: data.map(({
-        xOrigin,
-        yOrigin,
-        x,
-        y,
-        dataIndex,
-        color,
-        value,
-        width,
-        height,
-        layout
-      }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarLabelItem.BarLabelItem, (0, _extends2.default)({
-        seriesId: seriesId,
-        dataIndex: dataIndex,
-        value: value,
-        color: color,
-        xOrigin: xOrigin,
-        yOrigin: yOrigin,
-        x: x,
-        y: y,
-        width: width,
-        height: height,
-        skipAnimation: skipAnimation ?? false,
-        layout: layout ?? 'vertical'
-      }, other), dataIndex))
-    }, seriesId))
-  });
+  const barLabel = processedSeries.barLabel ?? props.barLabel;
+  if (!barLabel) {
+    return null;
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
+    className: classes.seriesLabels,
+    "data-series": seriesId,
+    children: data.map(({
+      xOrigin,
+      yOrigin,
+      x,
+      y,
+      dataIndex,
+      color,
+      value,
+      width,
+      height,
+      layout
+    }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarLabelItem.BarLabelItem, (0, _extends2.default)({
+      seriesId: seriesId,
+      dataIndex: dataIndex,
+      value: value,
+      color: color,
+      xOrigin: xOrigin,
+      yOrigin: yOrigin,
+      x: x,
+      y: y,
+      width: width,
+      height: height,
+      skipAnimation: skipAnimation ?? false,
+      layout: layout ?? 'vertical'
+    }, other, {
+      barLabel: barLabel
+    }), dataIndex))
+  }, seriesId);
 }

package/BarChart/BarPlot.d.ts

@@ -1,10 +1,11 @@
 import * as React from 'react';
 import { BarElementSlotProps, BarElementSlots } from "./BarElement.js";
 import { BarItemIdentifier } from "../models/index.js";
-import { BarLabelItemProps, BarLabelSlotProps, BarLabelSlots } from "./BarLabel/BarLabelItem.js";
+import { BarLabelSlotProps, BarLabelSlots } from "./BarLabel/BarLabelItem.js";
+import { BarItem, BarLabelContext } from "./BarLabel/index.js";
 export interface BarPlotSlots extends BarElementSlots, BarLabelSlots {}
 export interface BarPlotSlotProps extends BarElementSlotProps, BarLabelSlotProps {}
-export interface BarPlotProps extends Pick<BarLabelItemProps, 'barLabel'> {
+export interface BarPlotProps {
   /**
    * If `true`, animations are skipped.
    * @default undefined
@@ -20,6 +21,15 @@ export interface BarPlotProps extends Pick<BarLabelItemProps, 'barLabel'> {
    * Defines the border radius of the bar element.
    */
   borderRadius?: number;
+  /**
+   * @deprecated Use `barLabel` in the chart series instead.
+   * If provided, the function will be used to format the label of the bar.
+   * It can be set to 'value' to display the current value.
+   * @param {BarItem} item The item to format.
+   * @param {BarLabelContext} context data about the bar.
+   * @returns {string} The formatted label.
+   */
+  barLabel?: 'value' | ((item: BarItem, context: BarLabelContext) => string | null | undefined);
   /**
    * The props used for each component slot.
    * @default {}
@@ -42,7 +52,7 @@ export interface BarPlotProps extends Pick<BarLabelItemProps, 'barLabel'> {
  *
  * - [BarPlot API](https://mui.com/x/api/charts/bar-plot/)
  */
-declare function BarPlot(props: BarPlotProps): React.JSX.Element;
+declare function BarPlot(props: BarPlotProps): import("react/jsx-runtime").JSX.Element;
 declare namespace BarPlot {
   var propTypes: any;
 }

package/BarChart/BarPlot.js

@@ -142,11 +142,11 @@ function BarPlot(props) {
           }, dataIndex);
         })
       }, seriesId);
-    }), barLabel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarLabelPlot.BarLabelPlot, (0, _extends2.default)({
-      bars: completedData,
+    }), completedData.map(processedSeries => /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarLabelPlot.BarLabelPlot, (0, _extends2.default)({
+      processedSeries: processedSeries,
       skipAnimation: skipAnimation,
       barLabel: barLabel
-    }, other))]
+    }, other), processedSeries.seriesId))]
   });
 }
 process.env.NODE_ENV !== "production" ? BarPlot.propTypes = {

package/BarChart/seriesConfig/{extremums.d.ts → bar/extremums.d.ts}

@@ -1,3 +1,3 @@
-import { CartesianExtremumGetter } from "../../internals/plugins/models/seriesConfig/index.js";
+import { CartesianExtremumGetter } from "../../../internals/plugins/models/seriesConfig/index.js";
 export declare const getExtremumX: CartesianExtremumGetter<'bar'>;
 export declare const getExtremumY: CartesianExtremumGetter<'bar'>;

package/BarChart/seriesConfig/{extremums.js → bar/extremums.js}

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getExtremumY = exports.getExtremumX = void 0;
-var _findMinMax = require("../../internals/findMinMax");
+var _findMinMax = require("../../../internals/findMinMax");
 const createResult = (data, direction) => {
   if (direction === 'x') {
     return {

package/BarChart/seriesConfig/bar/getColor.d.ts

@@ -0,0 +1,3 @@
+import { ColorProcessor } from "../../../internals/plugins/models/index.js";
+declare const getColor: ColorProcessor<'bar'>;
+export default getColor;

package/BarChart/seriesConfig/{getColor.js → bar/getColor.js}

@@ -4,20 +4,28 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _getSeriesColorFn = require("../../../internals/getSeriesColorFn");
 const getColor = (series, xAxis, yAxis) => {
   const verticalLayout = series.layout === 'vertical';
   const bandColorScale = verticalLayout ? xAxis?.colorScale : yAxis?.colorScale;
   const valueColorScale = verticalLayout ? yAxis?.colorScale : xAxis?.colorScale;
   const bandValues = verticalLayout ? xAxis?.data : yAxis?.data;
+  const getSeriesColor = (0, _getSeriesColorFn.getSeriesColorFn)(series);
   if (valueColorScale) {
     return dataIndex => {
       if (dataIndex === undefined) {
         return series.color;
       }
       const value = series.data[dataIndex];
-      const color = value === null ? series.color : valueColorScale(value);
+      const color = value === null ? getSeriesColor({
+        value,
+        dataIndex
+      }) : valueColorScale(value);
       if (color === null) {
-        return series.color;
+        return getSeriesColor({
+          value,
+          dataIndex
+        });
       }
       return color;
     };
@@ -28,13 +36,28 @@ const getColor = (series, xAxis, yAxis) => {
         return series.color;
       }
       const value = bandValues[dataIndex];
-      const color = value === null ? series.color : bandColorScale(value);
+      const color = value === null ? getSeriesColor({
+        value,
+        dataIndex
+      }) : bandColorScale(value);
       if (color === null) {
-        return series.color;
+        return getSeriesColor({
+          value,
+          dataIndex
+        });
       }
       return color;
     };
   }
-  return () => series.color;
+  return dataIndex => {
+    if (dataIndex === undefined) {
+      return series.color;
+    }
+    const value = series.data[dataIndex];
+    return getSeriesColor({
+      value,
+      dataIndex
+    });
+  };
 };
 var _default = exports.default = getColor;

package/BarChart/seriesConfig/bar/getSeriesWithDefaultValues.d.ts

@@ -0,0 +1,3 @@
+import type { GetSeriesWithDefaultValues } from "../../../internals/plugins/models/seriesConfig/index.js";
+declare const getSeriesWithDefaultValues: GetSeriesWithDefaultValues<'bar'>;
+export default getSeriesWithDefaultValues;

package/BarChart/seriesConfig/bar/legend.d.ts

@@ -0,0 +1,3 @@
+import { LegendGetter } from "../../../internals/plugins/models/index.js";
+declare const legendGetter: LegendGetter<'bar'>;
+export default legendGetter;

package/BarChart/seriesConfig/{legend.js → bar/legend.js}

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _getLabel = require("../../internals/getLabel");
+var _getLabel = require("../../../internals/getLabel");
 const legendGetter = params => {
   const {
     seriesOrder,

package/BarChart/seriesConfig/bar/seriesProcessor.d.ts

@@ -0,0 +1,3 @@
+import { SeriesProcessor } from "../../../internals/plugins/models/index.js";
+declare const seriesProcessor: SeriesProcessor<'bar'>;
+export default seriesProcessor;

package/BarChart/seriesConfig/{seriesProcessor.js → bar/seriesProcessor.js}

@@ -8,7 +8,7 @@ exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _d3Shape = require("@mui/x-charts-vendor/d3-shape");
 var _warning = require("@mui/x-internals/warning");
-var _stackSeries = require("../../internals/stackSeries");
+var _stackSeries = require("../../../internals/stackSeries");
 const barValueFormatter = v => v == null ? '' : v.toLocaleString();
 const seriesProcessor = (params, dataset) => {
   const {

package/BarChart/seriesConfig/bar/tooltip.d.ts

@@ -0,0 +1,4 @@
+import type { AxisTooltipGetter, TooltipGetter } from "../../../internals/plugins/models/index.js";
+declare const tooltipGetter: TooltipGetter<'bar'>;
+export declare const axisTooltipGetter: AxisTooltipGetter<'bar', 'x' | 'y'>;
+export default tooltipGetter;

package/BarChart/seriesConfig/{tooltip.js → bar/tooltip.js}

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.axisTooltipGetter = void 0;
-var _getLabel = require("../../internals/getLabel");
+var _getLabel = require("../../../internals/getLabel");
 const tooltipGetter = params => {
   const {
     series,

package/BarChart/seriesConfig/bar/tooltipPosition.d.ts

@@ -0,0 +1,3 @@
+import type { TooltipItemPositionGetter } from "../../../internals/plugins/models/seriesConfig/tooltipItemPositionGetter.types.js";
+declare const tooltipItemPositionGetter: TooltipItemPositionGetter<'bar'>;
+export default tooltipItemPositionGetter;

package/BarChart/seriesConfig/{tooltipPosition.js → bar/tooltipPosition.js}

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _useBarPlotData = require("../useBarPlotData");
+var _useBarPlotData = require("../../useBarPlotData");
 const tooltipItemPositionGetter = params => {
   const {
     series,

package/BarChart/seriesConfig/index.d.ts

@@ -1,2 +1,2 @@
 import { ChartSeriesTypeConfig } from "../../internals/plugins/models/seriesConfig/index.js";
-export declare const seriesConfig: ChartSeriesTypeConfig<'bar'>;
+export declare const barSeriesConfig: ChartSeriesTypeConfig<'bar'>;

package/BarChart/seriesConfig/index.js

@@ -5,15 +5,15 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.seriesConfig = void 0;
-var _extremums = require("./extremums");
-var _seriesProcessor = _interopRequireDefault(require("./seriesProcessor"));
-var _legend = _interopRequireDefault(require("./legend"));
-var _getColor = _interopRequireDefault(require("./getColor"));
-var _tooltip = _interopRequireWildcard(require("./tooltip"));
-var _tooltipPosition = _interopRequireDefault(require("./tooltipPosition"));
-var _getSeriesWithDefaultValues = _interopRequireDefault(require("./getSeriesWithDefaultValues"));
-const seriesConfig = exports.seriesConfig = {
+exports.barSeriesConfig = void 0;
+var _extremums = require("./bar/extremums");
+var _seriesProcessor = _interopRequireDefault(require("./bar/seriesProcessor"));
+var _legend = _interopRequireDefault(require("./bar/legend"));
+var _getColor = _interopRequireDefault(require("./bar/getColor"));
+var _tooltip = _interopRequireWildcard(require("./bar/tooltip"));
+var _tooltipPosition = _interopRequireDefault(require("./bar/tooltipPosition"));
+var _getSeriesWithDefaultValues = _interopRequireDefault(require("./bar/getSeriesWithDefaultValues"));
+const barSeriesConfig = exports.barSeriesConfig = {
   seriesProcessor: _seriesProcessor.default,
   colorProcessor: _getColor.default,
   legendGetter: _legend.default,

package/BarChart/types.d.ts

@@ -12,6 +12,7 @@ export type AnimationData = {
 export interface ProcessedBarSeriesData {
   seriesId: SeriesId;
   data: ProcessedBarData[];
+  barLabel?: BarSeriesType['barLabel'];
 }
 export interface ProcessedBarData extends AnimationData {
   seriesId: SeriesId;

package/BarChart/useBarPlotData.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.getBarDimensions = getBarDimensions;
 exports.useBarPlotData = useBarPlotData;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _getColor = _interopRequireDefault(require("./seriesConfig/getColor"));
+var _getColor = _interopRequireDefault(require("./seriesConfig/bar/getColor"));
 var _hooks = require("../hooks");
 var _checkScaleErrors = require("./checkScaleErrors");
 var _useBarSeries = require("../hooks/useBarSeries");
@@ -99,6 +99,7 @@ function useBarPlotData(drawingArea, xAxes, yAxes) {
       }
       return {
         seriesId,
+        barLabel: series[seriesId].barLabel,
         data: seriesDataPoints
       };
     });

package/CHANGELOG.md

@@ -5,6 +5,113 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 8.17.0
+
+_Nov 5, 2025_
+
+We'd like to extend a big thank you to the 13 contributors who made this release possible. Here are some highlights ✨:
+
+- Add `colorGetter` prop to cartesian charts series
+
+  <img width="400" alt="Image" src="https://github.com/user-attachments/assets/d8b1263f-794e-4939-b17e-87350fdd1746" />
+
+- 🌎 Add Catalan (ca-ES) locale on the Data Grid
+- 🌎 Add Norwegian Bokmål (nb-NO) locale on the Charts
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+Special thanks go out to these community members for their valuable contributions:
+@frncesc, @Methuselah96, @samuelwalk, @htollefsen
+
+The following team members contributed to this release:
+@alexfauquette, @bernardobelchior, @flaviendelangle, @Janpot, @JCQuintas, @mnajdova, @rita-codes, @arminmeh, @brijeshb42
+
+### Data Grid
+
+#### `@mui/x-data-grid@8.17.0`
+
+- [DataGrid] Stop event propagation on data grid action buttons (GridActionsCellItem) (#19513) @Copilot
+- [DataGrid] Update cell editable state if `editable` prop is updated in the column definition (#20147) @arminmeh
+- [DataGrid] Wait for external model updates before resetting pagination after sort/filter (#20162) @arminmeh
+- [l10n] Add Catalan (ca-ES) locale (#20154) @frncesc
+- [l10n] Improve Arabic (ar-SD) locale (#20185) @samuelwalk
+
+#### `@mui/x-data-grid-pro@8.17.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@8.17.0`.
+
+#### `@mui/x-data-grid-premium@8.17.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@8.17.0`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@8.17.0`
+
+Internal changes.
+
+#### `@mui/x-date-pickers-pro@8.17.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@8.17.0`.
+
+### Charts
+
+#### `@mui/x-charts@8.17.0`
+
+- [charts] Add `barLabel` to bar series. Deprecate `barLabel` in `BarPlot`. (#20184) @bernardobelchior
+- [charts] Add series color callback (#20084) @bernardobelchior
+- [charts] Expose `ChartsSurface` classes (#20180) @bernardobelchior
+- [charts] Fix chart cut off when inside `overflow: scroll` container (#20182) @bernardobelchior
+- [charts] Fix tick label overflow on multiple axes and series demo (#20152) @bernardobelchior
+- [charts] Organize series config (#20155) @bernardobelchior
+- [charts] Use selectors from `@mui/x-internals` (#20052) @alexfauquette
+- [charts] Use store from `@mui/x-internals` (#20121) @alexfauquette
+- [charts] Add `useDataset` hook (#20205) @JCQuintas
+- [l10n] Add Norwegian Bokmål (nb-NO) locale (#20197) @htollefsen
+
+#### `@mui/x-charts-pro@8.17.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@8.17.0`, plus:
+
+- [charts-pro] Fix zoom pan issue when controlled (#20163) @JCQuintas
+
+#### `@mui/x-charts-premium@8.17.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-charts-pro@8.17.0`.
+
+### Tree View
+
+#### `@mui/x-tree-view@8.17.0`
+
+- [tree view] Accept read only arrays in `expandedItems` prop (#20181) @Methuselah96
+- [tree view] Use `aria-checked` instead of `aria-selected` on items (#19851) @flaviendelangle
+
+#### `@mui/x-tree-view-pro@8.17.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-tree-view@8.17.0`.
+
+### Codemod
+
+#### `@mui/x-codemod@8.17.0`
+
+Internal changes.
+
+### Docs
+
+- [docs] Fix focus issues in the action column demo (#20178) @arminmeh
+- [docs] Remove hidden Tree View headless page (#20119) @flaviendelangle
+- [docs] Fix some external redirects (#20211) @Janpot
+
+### Core
+
+- [code-infra] Fix cci job timeout due to buffered test output (#20193) @Janpot
+- [code-infra] Fix publish workflow (#20140) @bernardobelchior
+- [code-infra] Increase JSDOM test parallelism (#20179) @Janpot
+- [code-infra] Remove React import requirement for jsx (#20144) @brijeshb42
+- [code-infra] Replace `getInitialProps` with `getStaticProps` (#20192) @Janpot
+- [code-infra] git-ignore next-env.d.ts (#20177) @Janpot
+- [code-infra] Stabilize screenshot testing (#19868) @Janpot
+
 ## 8.16.0
 
 _Oct 29, 2025_
@@ -39,7 +146,7 @@ Same changes as in `@mui/x-data-grid@8.16.0`, plus:
 Same changes as in `@mui/x-data-grid-pro@8.16.0`, plus:
 
 - [DataGridPremium] Export and restore chart integration state (#20079) @arminmeh
-- [DataGridPremium] Fix grouping column `valueFormatter()` crash  (#20070) @sai6855
+- [DataGridPremium] Fix grouping column `valueFormatter()` crash (#20070) @sai6855
 - [DataGridPremium] Refetch aggregation data after row update with server-side aggregation (#20039) @arminmeh
 
 ### Date and Time Pickers

package/ChartDataProvider/ChartDataProvider.d.ts

@@ -42,7 +42,7 @@ export type ChartDataProviderProps<TSeries extends ChartSeriesType = ChartSeries
  * </ChartDataProvider>
  * ```
  */
-declare function ChartDataProvider<TSeries extends ChartSeriesType = ChartSeriesType, TSignatures extends readonly ChartAnyPluginSignature[] = AllPluginSignatures<TSeries>>(props: ChartDataProviderProps<TSeries, TSignatures>): React.JSX.Element;
+declare function ChartDataProvider<TSeries extends ChartSeriesType = ChartSeriesType, TSignatures extends readonly ChartAnyPluginSignature[] = AllPluginSignatures<TSeries>>(props: ChartDataProviderProps<TSeries, TSignatures>): import("react/jsx-runtime").JSX.Element;
 declare namespace ChartDataProvider {
   var propTypes: any;
 }

package/ChartsAxis/ChartsAxis.d.ts

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ChartsAxisSlotProps, ChartsAxisSlots } from "../models/axis.js";
 export interface ChartsAxisProps {
   /**
@@ -21,7 +20,7 @@ export interface ChartsAxisProps {
  *
  * - [ChartsAxis API](https://mui.com/x/api/charts/charts-axis/)
  */
-declare function ChartsAxis(props: ChartsAxisProps): React.JSX.Element;
+declare function ChartsAxis(props: ChartsAxisProps): import("react/jsx-runtime").JSX.Element;
 declare namespace ChartsAxis {
   var propTypes: any;
 }

package/ChartsAxisHighlight/ChartsAxisHighlight.d.ts

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ChartsAxisHighlightProps } from "./ChartsAxisHighlight.types.js";
 /**
  * Demos:
@@ -9,7 +8,7 @@ import { ChartsAxisHighlightProps } from "./ChartsAxisHighlight.types.js";
  *
  * - [ChartsAxisHighlight API](https://mui.com/x/api/charts/charts-axis-highlight/)
  */
-declare function ChartsAxisHighlight(props: ChartsAxisHighlightProps): React.JSX.Element;
+declare function ChartsAxisHighlight(props: ChartsAxisHighlightProps): import("react/jsx-runtime").JSX.Element;
 declare namespace ChartsAxisHighlight {
   var propTypes: any;
 }

package/ChartsAxisHighlight/ChartsXAxisHighlight.d.ts

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ChartsAxisHighlightType } from "./ChartsAxisHighlight.types.js";
 import { ChartsAxisHighlightClasses } from "./chartsAxisHighlightClasses.js";
 /**
@@ -7,4 +6,4 @@ import { ChartsAxisHighlightClasses } from "./chartsAxisHighlightClasses.js";
 export default function ChartsXHighlight(props: {
   type: ChartsAxisHighlightType;
   classes: ChartsAxisHighlightClasses;
-}): React.JSX.Element[] | null;
+}): import("react/jsx-runtime").JSX.Element[] | null;

package/ChartsAxisHighlight/ChartsYAxisHighlight.d.ts

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { ChartsAxisHighlightType } from "./ChartsAxisHighlight.types.js";
 import { ChartsAxisHighlightClasses } from "./chartsAxisHighlightClasses.js";
 /**
@@ -7,4 +6,4 @@ import { ChartsAxisHighlightClasses } from "./chartsAxisHighlightClasses.js";
 export default function ChartsYHighlight(props: {
   type: ChartsAxisHighlightType;
   classes: ChartsAxisHighlightClasses;
-}): React.JSX.Element[] | null;
+}): import("react/jsx-runtime").JSX.Element[] | null;