@mui/x-charts 6.0.0-alpha.7 → 6.0.0-alpha.8

package/BarChart/BarChart.d.ts

@@ -27,6 +27,7 @@ export interface BarChartProps extends Omit<ResponsiveChartContainerProps, 'seri
      * @default {}
      */
     slotProps?: BarChartSlotComponentProps;
+    layout?: BarSeriesType['layout'];
 }
 declare const BarChart: React.ForwardRefExoticComponent<BarChartProps & React.RefAttributes<unknown>>;
 export { BarChart };

package/BarChart/BarChart.js

@@ -31,6 +31,7 @@ const BarChart = /*#__PURE__*/React.forwardRef(function BarChart(props, ref) {
     colors,
     dataset,
     sx,
+    layout,
     tooltip,
     axisHighlight,
     legend,
@@ -44,22 +45,34 @@ const BarChart = /*#__PURE__*/React.forwardRef(function BarChart(props, ref) {
   } = props;
   const id = (0, _useId.default)();
   const clipPathId = `${id}-clip-path`;
+  const hasHorizontalSeries = layout === 'horizontal' || layout === undefined && series.some(item => item.layout === 'horizontal');
+  const defaultAxisConfig = {
+    scaleType: 'band',
+    data: Array.from({
+      length: Math.max(...series.map(s => (s.data ?? dataset ?? []).length))
+    }, (_, index) => index)
+  };
+  const defaultizedAxisHighlight = (0, _extends2.default)({}, hasHorizontalSeries ? {
+    y: 'band'
+  } : {
+    x: 'band'
+  }, axisHighlight);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ResponsiveChartContainer.ResponsiveChartContainer, {
     ref: ref,
     series: series.map(s => (0, _extends2.default)({
       type: 'bar'
-    }, s)),
+    }, s, {
+      layout: hasHorizontalSeries ? 'horizontal' : 'vertical'
+    })),
     width: width,
     height: height,
     margin: margin,
-    xAxis: xAxis ?? [{
-      id: _constants.DEFAULT_X_AXIS_KEY,
-      scaleType: 'band',
-      data: Array.from({
-        length: Math.max(...series.map(s => (s.data ?? dataset ?? []).length))
-      }, (_, index) => index)
-    }],
-    yAxis: yAxis,
+    xAxis: xAxis ?? (hasHorizontalSeries ? undefined : [(0, _extends2.default)({
+      id: _constants.DEFAULT_X_AXIS_KEY
+    }, defaultAxisConfig)]),
+    yAxis: yAxis ?? (hasHorizontalSeries ? [(0, _extends2.default)({
+      id: _constants.DEFAULT_Y_AXIS_KEY
+    }, defaultAxisConfig)] : undefined),
     colors: colors,
     dataset: dataset,
     sx: sx,
@@ -80,9 +93,7 @@ const BarChart = /*#__PURE__*/React.forwardRef(function BarChart(props, ref) {
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsLegend.ChartsLegend, (0, _extends2.default)({}, legend, {
       slots: slots,
       slotProps: slotProps
-    })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsAxisHighlight.ChartsAxisHighlight, (0, _extends2.default)({
-      x: "band"
-    }, axisHighlight)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltip.ChartsTooltip, (0, _extends2.default)({}, tooltip, {
+    })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsAxisHighlight.ChartsAxisHighlight, (0, _extends2.default)({}, defaultizedAxisHighlight)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltip.ChartsTooltip, (0, _extends2.default)({}, tooltip, {
       slots: slots,
       slotProps: slotProps
     })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsClipPath.ChartsClipPath, {
@@ -98,7 +109,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   // ----------------------------------------------------------------------
   axisHighlight: _propTypes.default.shape({
     x: _propTypes.default.oneOf(['band', 'line', 'none']),
-    y: _propTypes.default.oneOf(['line', 'none'])
+    y: _propTypes.default.oneOf(['band', 'line', 'none'])
   }),
   /**
    * Indicate which axis to display the bottom of the charts.
@@ -133,6 +144,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
   desc: _propTypes.default.string,
   disableAxisListener: _propTypes.default.bool,
   height: _propTypes.default.number,
+  layout: _propTypes.default.oneOf(['horizontal', 'vertical']),
   /**
    * Indicate which axis to display the left of the charts.
    * Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
@@ -213,6 +225,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     }),
     id: _propTypes.default.string,
     label: _propTypes.default.string,
+    layout: _propTypes.default.oneOf(['horizontal', 'vertical']),
     stack: _propTypes.default.string,
     stackOffset: _propTypes.default.oneOf(['diverging', 'expand', 'none', 'silhouette', 'wiggle']),
     stackOrder: _propTypes.default.oneOf(['appearance', 'ascending', 'descending', 'insideOut', 'none', 'reverse']),

package/BarChart/BarPlot.js

@@ -68,27 +68,37 @@ function BarPlot(props) {
         const yAxisKey = series[seriesId].yAxisKey ?? defaultYAxisId;
         const xAxisConfig = xAxis[xAxisKey];
         const yAxisConfig = yAxis[yAxisKey];
-        if (!(0, _axis.isBandScaleConfig)(xAxisConfig)) {
-          throw new Error(`Axis with id "${xAxisKey}" shoud be of type "band" to display the bar series of id "${seriesId}"`);
-        }
-        if (xAxis[xAxisKey].data === undefined) {
-          throw new Error(`Axis with id "${xAxisKey}" shoud have data property`);
+        const verticalLayout = series[seriesId].layout === 'vertical';
+        let baseScaleConfig;
+        if (verticalLayout) {
+          if (!(0, _axis.isBandScaleConfig)(xAxisConfig)) {
+            throw new Error(`Axis with id "${xAxisKey}" shoud be of type "band" to display the bar series of id "${seriesId}"`);
+          }
+          if (xAxis[xAxisKey].data === undefined) {
+            throw new Error(`Axis with id "${xAxisKey}" shoud have data property`);
+          }
+          baseScaleConfig = xAxisConfig;
+        } else {
+          if (!(0, _axis.isBandScaleConfig)(yAxisConfig)) {
+            throw new Error(`Axis with id "${yAxisKey}" shoud be of type "band" to display the bar series of id "${seriesId}"`);
+          }
+          if (yAxis[yAxisKey].data === undefined) {
+            throw new Error(`Axis with id "${xAxisKey}" shoud have data property`);
+          }
+          baseScaleConfig = yAxisConfig;
         }
         const xScale = xAxisConfig.scale;
         const yScale = yAxisConfig.scale;
-
-        // Currently assuming all bars are vertical
-        const bandWidth = xScale.bandwidth();
+        const bandWidth = baseScaleConfig.scale.bandwidth();
         const {
           barWidth,
           offset
         } = getBandSize({
           bandWidth,
           numberOfGroups: stackingGroups.length,
-          gapRatio: xAxisConfig.barGapRatio
+          gapRatio: baseScaleConfig.barGapRatio
         });
-
-        // @ts-ignore TODO: fix when adding a correct API for customisation
+        const barOffset = groupIndex * (barWidth + offset);
         const {
           stackedData,
           color
@@ -99,10 +109,10 @@ function BarPlot(props) {
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarElement.BarElement, (0, _extends2.default)({
             id: seriesId,
             dataIndex: dataIndex,
-            x: xScale(xAxis[xAxisKey].data?.[dataIndex]) + groupIndex * (barWidth + offset),
-            y: yScale(value),
-            height: yScale(baseline) - yScale(value),
-            width: barWidth,
+            x: verticalLayout ? xScale(xAxis[xAxisKey].data?.[dataIndex]) + barOffset : xScale(baseline),
+            y: verticalLayout ? yScale(value) : yScale(yAxis[yAxisKey].data?.[dataIndex]) + barOffset,
+            height: verticalLayout ? Math.abs(yScale(baseline) - yScale(value)) : barWidth,
+            width: verticalLayout ? barWidth : Math.abs(xScale(baseline) - xScale(value)),
             color: color,
             highlightScope: series[seriesId].highlightScope
           }, props), `${seriesId}-${dataIndex}`);

package/BarChart/extremums.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getExtremumY = exports.getExtremumX = void 0;
-const getExtremumX = params => {
+const getBaseExtremum = params => {
   const {
     axis
   } = params;
@@ -12,8 +12,7 @@ const getExtremumX = params => {
   const maxX = Math.max(...(axis.data ?? []));
   return [minX, maxX];
 };
-exports.getExtremumX = getExtremumX;
-const getExtremumY = params => {
+const getValueExtremum = params => {
   const {
     series,
     axis,
@@ -24,4 +23,21 @@ const getExtremumY = params => {
     return [acc[0] === null ? seriesMin : Math.min(seriesMin, acc[0]), acc[1] === null ? seriesMax : Math.max(seriesMax, acc[1])];
   }, [null, null]);
 };
+const getExtremumX = params => {
+  // Notice that bar should be all horizontal or all vertical.
+  // Don't think it's a problem for now
+  const isHorizontal = Object.keys(params.series).some(seriesId => params.series[seriesId].layout === 'horizontal');
+  if (isHorizontal) {
+    return getValueExtremum(params);
+  }
+  return getBaseExtremum(params);
+};
+exports.getExtremumX = getExtremumX;
+const getExtremumY = params => {
+  const isHorizontal = Object.keys(params.series).some(seriesId => params.series[seriesId].layout === 'horizontal');
+  if (isHorizontal) {
+    return getBaseExtremum(params);
+  }
+  return getValueExtremum(params);
+};
 exports.getExtremumY = getExtremumY;

package/BarChart/formatter.js

@@ -49,7 +49,9 @@ const formatter = (params, dataset) => {
     })).order(stackingOrder).offset(stackingOffset)(d3Dataset);
     ids.forEach((id, index) => {
       const dataKey = series[id].dataKey;
-      completedSeries[id] = (0, _extends2.default)({}, series[id], {
+      completedSeries[id] = (0, _extends2.default)({
+        layout: 'vertical'
+      }, series[id], {
         data: dataKey ? dataset.map(d => d[dataKey]) : series[id].data,
         stackedData: stackedSeries[index].map(([a, b]) => [a, b])
       });

package/CHANGELOG.md

@@ -3,6 +3,129 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 6.12.0
+
+_Aug 25, 2023_
+
+We'd like to offer a big thanks to the 10 contributors who made this release possible. Here are some highlights ✨:
+
+- 📊 Support horizontal bar chart
+- 💫 Improved animations on Android devices
+- 🌍 Improve Ukrainian (uk-UA) locale on the data grid
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+### Data Grid
+
+#### `@mui/x-data-grid@v6.12.0`
+
+- [DataGrid] Allow print export for more than 100 rows (#10045) @MBilalShafi
+- [l10n] Improve Ukrainian (uk-UA) locale (#10076) @mkundos
+
+#### `@mui/x-data-grid-pro@v6.12.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@v6.12.0`.
+
+#### `@mui/x-data-grid-premium@v6.12.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@v6.12.0`.
+
+### Date Pickers
+
+#### `@mui/x-date-pickers@v6.12.0`
+
+- [fields] Do not clamp day of month (#9973) @flaviendelangle
+- [pickers] Fix `ownerState` on `desktopPaper` slot props (#10103) @LukasTy
+- [pickers] Fix to `transform-origin` when popper opens to `top` (#10069) @LukasTy
+- [pickers] Fix `YearCalendar` scrolling (#10135) @LukasTy
+- [pickers] Improve the typing of the adapter `dateWithTimezone` method (#10029) @flaviendelangle
+- [pickers] Make `openPickerButton` toggle picker (#10109) @noraleonte
+- [pickers] Update `reduceAnimations` default rule (#9864) @LukasTy
+
+#### `@mui/x-date-pickers-pro@v6.12.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@v6.12.0`.
+
+### Charts / `@mui/x-charts@6.12.0`
+
+- [charts] Fix import issue (#10111) @alexfauquette
+- [charts] Fix `slotProps` propagation (#10105) @alexfauquette
+- [charts] Support horizontal bar chart (#9992) @alexfauquette
+
+### Docs
+
+- [docs] Address charts docs feedback (#10119) @alexfauquette
+- [docs] Capitalization convention pickers @oliviertassinari
+- [docs] Fix a11y issue on plan links (#10026) @oliviertassinari
+- [docs] Fix some charts horizontal overflow on mobile devices (#10082) @cupok
+- [docs] Fix typo in quick filter @oliviertassinari
+- [docs] Fix typo in the timezone page (#10073) @flaviendelangle
+
+### Core
+
+- [core] Bump monorepo (#10129) @LukasTy
+- [core] Document a bit `useLazyRef` @oliviertassinari
+- [core] Enable strict type checking options in the top-level tsconfig (#9925) @cherniavskii
+- [core] Increase global e2e timeout (#10134) @LukasTy
+- [core] Remove outdated link (#10125) @oliviertassinari
+- [core] Update `no-response` workflow (#10102) @DanailH
+
+## 6.11.2
+
+_Aug 17, 2023_
+
+We'd like to offer a big thanks to the 8 contributors who made this release possible. Here are some highlights ✨:
+
+- 🏎️ Lower the filtering delay in the grid
+- 🌍 Improve Spanish (es-ES) locale on the data grid
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+### Data Grid
+
+#### `@mui/x-data-grid@v6.11.2`
+
+- [DataGrid] Fix `eval` blocked by CSP (#9863) @romgrk
+- [DataGrid] Fix row id bug (#10051) @romgrk
+- [DataGrid] Honor `disableExport` flag in Print Export (#10044) @MBilalShafi
+- [DataGrid] Lower filter debounce delay (#9712) @romgrk
+- [DataGrid] Unhide potential ref binding issue (#9965) @oliviertassinari
+- [l10n] Improve Chinese (zh-CN) and Chinese(traditional) (zh-TW) locales (#9999) @MyNameIsTakenOMG
+- [l10n] Improve Spanish (es-ES) locale (#10037) @Macampu420
+
+#### `@mui/x-data-grid-pro@v6.11.2` [![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@v6.11.2`.
+
+#### `@mui/x-data-grid-premium@v6.11.2` [![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@v6.11.2`.
+
+### Date Pickers
+
+#### `@mui/x-date-pickers@v6.11.2`
+
+- [pickers] Fix month switcher RTL (#10003) @alexfauquette
+- [pickers] Follow-up on using device motion reduction preference (#9858) @LukasTy
+- [pickers] Pass the shortcut information in the `onChange` context (#9985) @flaviendelangle
+- [pickers] Replace `Grid` toolbar component with a styled `div` (#10052) @LukasTy
+
+#### `@mui/x-date-pickers-pro@v6.11.2` [![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@v6.11.2`.
+
+### Docs
+
+- [docs] Add migration guide for the Tree View (#9987) @flaviendelangle
+- [docs] Fix en-US changelog @oliviertassinari
+- [docs] Update column types (#10040) @romgrk
+
+### Core
+
+- [core] Remove unnecessary Box (#9831) @oliviertassinari
+- [core] Set GitHub Action top level permission @oliviertassinari
+- [core] Split the pickers test utils (#9976) @flaviendelangle
+
 ## 6.11.1
 
 _Aug 11, 2023_
@@ -21,11 +144,11 @@ We'd like to offer a big thanks to the 8 contributors who made this release poss
 
 - [DataGrid] `getCellAggregationResult`: Handle `null` `rowNode` case (#9915) @romgrk
 
-#### `@mui/x-data-grid-pro@6.11.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-data-grid-pro@6.11.1` [![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@6.11.1`.
 
-#### `@mui/x-data-grid-premium@6.11.1` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link)
+#### `@mui/x-data-grid-premium@6.11.1` [![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@6.11.1`.
 
@@ -40,7 +163,7 @@ Same changes as in `@mui/x-data-grid-pro@6.11.1`.
 - [l10n] Improve Finnish (fi-FI) locale (#9795) @kurkle
 - [l10n] Improve Icelandic (is-IS) locale (#9639) @magnimarels
 
-#### `@mui/x-date-pickers-pro@6.11.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-date-pickers-pro@6.11.1` [![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@6.11.1`.
 
@@ -90,11 +213,11 @@ We'd like to offer a big thanks to the 12 contributors who made this release pos
 - [l10n] Improve Finnish (fi-FI) locale (#9848) @sambbaahh
 - [l10n] Improve Italian (it-IT) locale (#9627) @fabio-rizzello-omnia
 
-#### `@mui/x-data-grid-pro@v6.11.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-data-grid-pro@v6.11.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@v6.11.0`.
 
-#### `@mui/x-data-grid-premium@v6.11.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link)
+#### `@mui/x-data-grid-premium@v6.11.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@v6.11.0`.
 
@@ -113,7 +236,7 @@ Same changes as in `@mui/x-data-grid-pro@v6.11.0`.
 - [pickers] Fix offset management on dayjs adapter (#9884) @flaviendelangle
 - [pickers] Use device motion reduction preference (#9823) @LukasTy
 
-#### `@mui/x-date-pickers-pro@v6.11.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-date-pickers-pro@v6.11.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@v6.11.0`.
 
@@ -176,11 +299,11 @@ We'd like to offer a big thanks to the 13 contributors who made this release pos
 - [DataGrid] Keep focused cell in the DOM (#7357) @yaredtsy
 - [l10n] Improve Finnish (fi-FI) locale (#9746) @sambbaahh
 
-#### `@mui/x-data-grid-pro@v6.10.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-data-grid-pro@v6.10.2` [![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@v6.10.2`.
 
-#### `@mui/x-data-grid-premium@v6.10.2` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link)
+#### `@mui/x-data-grid-premium@v6.10.2` [![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@v6.10.2`, plus:
 
@@ -192,7 +315,7 @@ Same changes as in `@mui/x-data-grid-pro@v6.10.2`, plus:
 
 - [pickers] Remove the `endOfDate` from `DigitalClock` timeOptions (#9800) @noraleonte
 
-#### `@mui/x-date-pickers-pro@v6.10.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-date-pickers-pro@v6.10.2` [![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@v6.10.2`.
 
@@ -244,14 +367,14 @@ We'd like to offer a big thanks to the 11 contributors who made this release pos
 - [DataGrid] Update focused cell on page change via keyboard (#9203) @m4theushw
 - [DataGrid] Wait for remote stylesheets to load before print (#9665) @cherniavskii
 
-#### `@mui/x-data-grid-pro@v6.10.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-data-grid-pro@v6.10.1` [![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@v6.10.1`, plus:
 
 - [DataGridPro] Improve tree data performance (#9682) @cherniavskii
 - [DataGridPro] Prevent affecting cells from child DataGrid when resizing a column (#9670) @m4theushw
 
-#### `@mui/x-data-grid-premium@v6.10.1` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link)
+#### `@mui/x-data-grid-premium@v6.10.1` [![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@v6.10.1`.
 
@@ -262,7 +385,7 @@ Same changes as in `@mui/x-data-grid-pro@v6.10.1`.
 - [fields] Fix `format` and `value` update order (#9715) @LukasTy
 - [pickers] Remove `require` usage in comment (#9675) @LukasTy
 
-#### `@mui/x-date-pickers-pro@v6.10.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-date-pickers-pro@v6.10.1` [![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@v6.10.1`.
 
@@ -313,11 +436,11 @@ We'd like to offer a big thanks to the 10 contributors who made this release pos
 - [DataGrid] Make `rowExpansionChange` event public (#9611) @MBilalShafi
 - [l10n] Improve Polish (pl-PL) locale (#9625) @ch1llysense
 
-#### `@mui/x-data-grid-pro@6.10.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-data-grid-pro@6.10.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@6.10.0`.
 
-#### `@mui/x-data-grid-premium@6.10.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link)
+#### `@mui/x-data-grid-premium@6.10.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@6.10.0`.
 
@@ -328,7 +451,7 @@ Same changes as in `@mui/x-data-grid-pro@6.10.0`.
 - [pickers] Fix date calendar issues (#9652) @LukasTy
 - [l10n] Improve Norwegian (nb-NO) locale (#9608) @JosteinBrevik
 
-#### `@mui/x-date-pickers-pro@6.10.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-date-pickers-pro@6.10.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@6.10.0`.
 
@@ -381,11 +504,11 @@ We'd like to offer a big thanks to the 11 contributors who made this release pos
 - [DataGrid] Correctly reflect `TablePagination`'s `rowsPerPageOptions` shape to `pageSizeOptions` (#9438) @burakkgunduzz
 - [l10n] Improve Spanish (es-ES) locale (#9500) @fufex
 
-#### `@mui/x-data-grid-pro@6.9.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-data-grid-pro@6.9.2` [![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@6.9.2`.
 
-#### `@mui/x-data-grid-premium@6.9.2` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link)
+#### `@mui/x-data-grid-premium@6.9.2` [![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@6.9.2`, plus:
 
@@ -398,7 +521,7 @@ Same changes as in `@mui/x-data-grid-pro@6.9.2`, plus:
 - [pickers] Forward digital clock classes (#9555) @YoonjiJang
 - [pickers] Rename `internal` folder to `internals` on `@mui/x-date-picker-pro` (#9571) @flaviendelangle
 
-#### `@mui/x-date-pickers-pro@6.9.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-date-pickers-pro@6.9.2` [![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@6.9.2`.
 
@@ -446,14 +569,14 @@ We'd like to offer a big thanks to the 13 contributors who made this release pos
 - [DataGrid] Fix `Maximum call stack size exceeded` error when using fractional width (#9516) @cherniavskii
 - [l10n] Improve Romanian (ro-RO) and Hungarian (hu-HU) translations (#9436) @noraleonte
 
-#### `@mui/x-data-grid-pro@6.9.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-data-grid-pro@6.9.1` [![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@6.9.1`, plus:
 
 - [DataGridPro] Don't throw error in column pinning (#9507) @romgrk
 - [DataGridPro] Fix bug with `checkboxSelection` and treeData/grouping (#9418) @romgrk
 
-#### `@mui/x-data-grid-premium@6.9.1` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link)
+#### `@mui/x-data-grid-premium@6.9.1` [![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@6.9.1`.
 
@@ -467,7 +590,7 @@ Same changes as in `@mui/x-data-grid-pro@6.9.1`.
 - [l10n] Add Chinese (Hong Kong) (zh-HK) locale (#9468) @samchiu90
 - [l10n] Improve Romanian (ro-RO) translations (#9436) @noraleonte
 
-#### `@mui/x-date-pickers-pro@6.9.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-date-pickers-pro@6.9.1` [![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@6.9.1`.
 
@@ -531,11 +654,11 @@ We'd like to offer a big thanks to the 11 contributors who made this release pos
 - [DataGrid] Use container dimensions from `getComputedStyle` (#9236) @m4theushw
 - [l10n] Improve Brazilian Portuguese (pt-BR) locale (#9404) @julioAz
 
-#### `@mui/x-data-grid-pro@6.9.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-data-grid-pro@6.9.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@6.9.0`.
 
-#### `@mui/x-data-grid-premium@6.9.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link)
+#### `@mui/x-data-grid-premium@6.9.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@6.9.0`.
 
@@ -551,7 +674,7 @@ Same changes as in `@mui/x-data-grid-pro@6.9.0`.
 - [pickers] Reduce date range calendar vertical border width (#9368) @oliviertassinari
 - [pickers] Reset fields internal state when pasting value (#9385) @alexfauquette
 
-#### `@mui/x-date-pickers-pro@6.9.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-date-pickers-pro@6.9.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@6.9.0`.
 
@@ -607,11 +730,11 @@ We'd like to offer a big thanks to the 13 contributors who made this release pos
 - [DataGrid] Scroll performance improvements (#9037) @romgrk
 - [l10n] Improve Greek (el-GR) locale (#9292) @clytras
 
-#### `@mui/x-data-grid-pro@6.8.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-data-grid-pro@6.8.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@6.8.0`.
 
-#### `@mui/x-data-grid-premium@6.8.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link)
+#### `@mui/x-data-grid-premium@6.8.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@6.8.0`.
 
@@ -624,7 +747,7 @@ Same changes as in `@mui/x-data-grid-pro@6.8.0`.
 - [pickers] Close the calendar when a shortcut is selected (#9080) @flaviendelangle
 - [pickers] Fix disabling for digital clock (#9300) @alexfauquette
 
-#### `@mui/x-date-pickers-pro@6.8.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-date-pickers-pro@6.8.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@6.8.0`.
 
@@ -700,13 +823,13 @@ We'd like to offer a big thanks to the 12 contributors who made this release pos
 - [l10n] Improve German (de-DE) locale (#9259) @ximex
 - [l10n] Improve Turkish (tr-TR) locale (#9237) @MCErtan
 
-#### `@mui/x-data-grid-pro@6.7.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-data-grid-pro@6.7.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@6.7.0`, plus:
 
 - [DataGridPro] Improve header filter menu visuals (#9181) @MBilalShafi
 
-#### `@mui/x-data-grid-premium@6.7.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link)
+#### `@mui/x-data-grid-premium@6.7.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@6.7.0`, plus:
 
@@ -720,7 +843,7 @@ Same changes as in `@mui/x-data-grid-pro@6.7.0`, plus:
 - [l10n] Improve German (de-DE) locale (#9258) @ximex
 - [pickers] Apply dynamic default format depending on views for all desktop and mobile pickers (#9126) @flaviendelangle
 
-#### `@mui/x-date-pickers-pro@6.7.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link)
+#### `@mui/x-date-pickers-pro@6.7.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@6.7.0`, plus:
 
@@ -2872,7 +2995,7 @@ We'd like to offer a big thanks to the 8 contributors who made this release poss
 
 #### Changes
 
-- [DateRangePicker] Fix input focused style and mobile behaviour (#6645) @LukasTy
+- [DateRangePicker] Fix input focused style and mobile behavior (#6645) @LukasTy
 - [fields] Update sections when the locale changes (#6649) @flaviendelangle
 - [pickers] Add Ukrainian (uk-UA) locale (#6661) @Dufran
 - [pickers] Allow non-controlled usage of the calendar components (#6643) @flaviendelangle

package/ChartsAxisHighlight/ChartsAxisHighlight.d.ts

@@ -1,7 +1,8 @@
 import * as React from 'react';
+type AxisHighlight = 'none' | 'line' | 'band';
 export type ChartsAxisHighlightProps = {
-    x?: 'none' | 'line' | 'band';
-    y?: 'none' | 'line';
+    x?: AxisHighlight;
+    y?: AxisHighlight;
 };
 declare function ChartsAxisHighlight(props: ChartsAxisHighlightProps): React.JSX.Element;
 declare namespace ChartsAxisHighlight {

package/ChartsAxisHighlight/ChartsAxisHighlight.js

@@ -33,6 +33,7 @@ function ChartsAxisHighlight(props) {
     axis
   } = React.useContext(_InteractionProvider.InteractionContext);
   const getXPosition = (0, _useScale.getValueToPositionMapper)(xScale);
+  const getYPosition = (0, _useScale.getValueToPositionMapper)(yScale);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
     children: [xAxisHighlight === 'band' && axis.x !== null && (0, _isBandScale.isBandScale)(xScale) && /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
       d: `M ${xScale(axis.x.value) - (xScale.step() - xScale.bandwidth()) / 2} ${yScale.range()[0]} l ${xScale.step()} 0 l 0 ${yScale.range()[1] - yScale.range()[0]} l ${-xScale.step()} 0 Z`,
@@ -41,15 +42,22 @@ function ChartsAxisHighlight(props) {
       style: {
         pointerEvents: 'none'
       }
+    }), yAxisHighlight === 'band' && axis.y !== null && (0, _isBandScale.isBandScale)(yScale) && /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+      d: `M ${xScale.range()[0]} ${yScale(axis.y.value) - (yScale.step() - yScale.bandwidth()) / 2} l 0 ${yScale.step()} l ${xScale.range()[1] - xScale.range()[0]} 0 l 0 ${-yScale.step()} Z`,
+      fill: "gray",
+      fillOpacity: 0.1,
+      style: {
+        pointerEvents: 'none'
+      }
     }), xAxisHighlight === 'line' && axis.x !== null && /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-      d: `M ${getXPosition(axis.x.value)} ${yScale(yScale.domain()[0])} L ${getXPosition(axis.x.value)} ${yScale(yScale.domain().at(-1))}`,
+      d: `M ${getXPosition(axis.x.value)} ${yScale.range()[0]} L ${getXPosition(axis.x.value)} ${yScale.range()[1]}`,
       stroke: "black",
       strokeDasharray: "5 2",
       style: {
         pointerEvents: 'none'
       }
     }), yAxisHighlight === 'line' && axis.y !== null && /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-      d: `M ${xScale.range()[0]} ${yScale(axis.y.value)} L ${xScale.range()[1]} ${yScale(axis.y.value)}`,
+      d: `M ${xScale.range()[0]} ${getYPosition(axis.y.value)} L ${xScale.range()[1]} ${getYPosition(axis.y.value)}`,
       stroke: "black",
       strokeDasharray: "5 2",
       style: {
@@ -64,5 +72,5 @@ process.env.NODE_ENV !== "production" ? ChartsAxisHighlight.propTypes = {
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
   x: _propTypes.default.oneOf(['band', 'line', 'none']),
-  y: _propTypes.default.oneOf(['line', 'none'])
+  y: _propTypes.default.oneOf(['band', 'line', 'none'])
 } : void 0;