@mui/x-charts 9.0.0-alpha.2 → 9.0.0-alpha.4

package/BarChart/useBarChartProps.mjs

@@ -83,7 +83,7 @@ export const useBarChartProps = props => {
       scaleType: 'band'
     }, axis)) : yAxis;
   }, [defaultYAxis, hasHorizontalSeries, yAxis]);
-  const chartContainerProps = _extends({}, other, {
+  const chartsContainerProps = _extends({}, other, {
     series: seriesWithDefault,
     width,
     height,
@@ -144,7 +144,7 @@ export const useBarChartProps = props => {
   };
   return {
     chartsWrapperProps,
-    chartContainerProps,
+    chartsContainerProps,
     barPlotProps,
     gridProps,
     clipPathProps,

package/BarChart/useRegisterItemClickHandlers.js

@@ -8,7 +8,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.useRegisterItemClickHandlers = useRegisterItemClickHandlers;
 var React = _interopRequireWildcard(require("react"));
 var _useChartsLayerContainerRef = require("../hooks/useChartsLayerContainerRef");
-var _ChartProvider = require("../context/ChartProvider");
+var _ChartsProvider = require("../context/ChartsProvider");
 var _getChartPoint = require("../internals/getChartPoint");
 var _useStore = require("../internals/store/useStore");
 var _useChartCartesianAxisPosition = require("../internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisPosition.selectors");
@@ -19,7 +19,7 @@ var _useChartCartesianAxisPosition = require("../internals/plugins/featurePlugin
 function useRegisterItemClickHandlers(onItemClick) {
   const {
     instance
-  } = (0, _ChartProvider.useChartContext)();
+  } = (0, _ChartsProvider.useChartsContext)();
   const chartsLayerContainerRef = (0, _useChartsLayerContainerRef.useChartsLayerContainerRef)();
   const store = (0, _useStore.useStore)();
   React.useEffect(() => {

package/BarChart/useRegisterItemClickHandlers.mjs

@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 import { useChartsLayerContainerRef } from "../hooks/useChartsLayerContainerRef.mjs";
-import { useChartContext } from "../context/ChartProvider/index.mjs";
+import { useChartsContext } from "../context/ChartsProvider/index.mjs";
 import { getChartPoint } from "../internals/getChartPoint.mjs";
 import { useStore } from "../internals/store/useStore.mjs";
 import { selectorBarItemAtPosition } from "../internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisPosition.selectors.mjs";
@@ -14,7 +14,7 @@ import { selectorBarItemAtPosition } from "../internals/plugins/featurePlugins/u
 export function useRegisterItemClickHandlers(onItemClick) {
   const {
     instance
-  } = useChartContext();
+  } = useChartsContext();
   const chartsLayerContainerRef = useChartsLayerContainerRef();
   const store = useStore();
   React.useEffect(() => {

package/CHANGELOG.md

@@ -1,5 +1,250 @@
 # Changelog
 
+## 9.0.0-alpha.4
+
+_Mar 19, 2026_
+
+We'd like to extend a big thank you to the 12 contributors who made this release possible. Here are some highlights ✨:
+
+- 🐞 Bugfixes and internal improvements
+
+The following team members contributed to this release:
+@aemartos, @alexfauquette, @bernardobelchior, @Janpot, @JCQuintas, @LukasTy, @mapache-salvaje, @michelengelen, @noraleonte, @rita-codes, @sai6855, @siriwatknp
+
+### Data Grid
+
+#### `@mui/x-data-grid@9.0.0-alpha.4`
+
+- [DataGrid] Mark charts integration as stable (#21764) @JCQuintas
+- [DataGrid] Move `elementOverrides` to constants and remove duplicates (#21618) @sai6855
+- [DataGrid] Migrate from deprecated Material UI APIs (#21682) @siriwatknp
+
+#### `@mui/x-data-grid-pro@9.0.0-alpha.4` [![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@9.0.0-alpha.4`.
+
+#### `@mui/x-data-grid-premium@9.0.0-alpha.4` [![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@9.0.0-alpha.4`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@9.0.0-alpha.4`
+
+- [pickers] Avoid stealing focus on click away (#13434) @LukasTy
+- [pickers] Promote `fieldRef` to stable and add `clearValue` method (#21655) @michelengelen
+
+#### `@mui/x-date-pickers-pro@9.0.0-alpha.4` [![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@9.0.0-alpha.4`.
+
+### Charts
+
+#### `@mui/x-charts@9.0.0-alpha.4`
+
+- [charts] Add v9 chart series types and helper functions migration (#21009) @bernardobelchior
+- [charts] Extract event listener to the layer container (#21751) @alexfauquette
+- [charts] Fix WebGL print export canvas stretching (#21738) @JCQuintas
+- [charts] Improve deprecation warnings (#21760) @alexfauquette
+- [charts] Improve type safety in `identifierCleaner` (#21719) @bernardobelchior
+- [charts] Make `preferStrictDomainInLineCharts` the default (#21744) @JCQuintas
+- [charts] Move title and description to the layer container (#21757) @alexfauquette
+- [charts] Refactor `FunnelChart` classes structure (#21652) @JCQuintas
+- [charts] Refactor `Heatmap` classes structure (#21653) @JCQuintas
+- [charts] Refactor `RadarChart` classes structure (#21650) @JCQuintas
+- [charts] Refactor `SankeyChart` classes structure (#21654) @JCQuintas
+- [charts] Refactor legend getters to use utility functions (#21628) @sai6855
+- [charts] Remove deprecated `ChartContainer` and `ChartDataProvider` (#21777) @alexfauquette
+- [charts] Remove deprecated `itemId` from `SeriesLegendItemContext` (#21788) @alexfauquette
+- [charts] Remove deprecated `useMouseTracker()` (#21787) @alexfauquette
+- [charts] Remove deprecated classes (#21775) @alexfauquette
+- [charts] Remove deprecated props from PieArcLabel animation (#21789) @alexfauquette
+- [charts] Remove get*UtilityClass from public exports (#21769) @JCQuintas
+- [charts] Remove the deprecated `disableHover` property (#21785) @alexfauquette
+- [charts] Remove the deprecated `message` prop (#21784) @alexfauquette
+- [charts] Remove deprecated props about voronoi (#21796) @alexfauquette
+- [charts] Remove deprecated pieArcClasses (#21795) @alexfauquette
+- [charts] Rename `data-series-id` by `data-series` (#21761) @alexfauquette
+- [charts] Rename `voronoiMaxRadius`/`disableVoronoi` to `hitAreaRadius`/`disableHitArea` (#21750) @bernardobelchior
+- [charts] Update pt-PT locale (#21296) @bernardobelchior
+- [charts] Use different shape per series by default (#21713) @alexfauquette
+- [charts] Add className prop to Radar components (#21794) @JCQuintas
+- [charts] Add className prop to shared chart components (#21792) @JCQuintas
+- [charts] Add className prop to BarPlot (#21791) @JCQuintas
+- [charts] Portal tooltip into ChartsLayerContainer (#21801) @JCQuintas
+
+#### `@mui/x-charts-pro@9.0.0-alpha.4` [![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@9.0.0-alpha.4`, plus:
+
+- [charts-pro] Allow `brush` interaction to accept `requiredKeys/pointerMode` (#21716) @JCQuintas
+- [charts-pro] Remove deprecated `onAxisClick` for Heatmap (#21786) @alexfauquette
+
+#### `@mui/x-charts-premium@9.0.0-alpha.4` [![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@9.0.0-alpha.4`, plus:
+
+- [charts-premium] Add candlestick chart (#21129) @bernardobelchior
+
+### Tree View
+
+#### `@mui/x-tree-view@9.0.0-alpha.4`
+
+Internal changes.
+
+#### `@mui/x-tree-view-pro@9.0.0-alpha.4` [![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@9.0.0-alpha.4`.
+
+### Codemod
+
+#### `@mui/x-codemod@9.0.0-alpha.4`
+
+Internal changes.
+
+### Docs
+
+- [docs-infra] Exclude `ServerSideLazyLoadingRevalidation` from argos (#21734) @sai6855
+- [docs] Update charts v9 migration guide to include premium package (#21743) @bernardobelchior
+- [docs] Update v9 migration guides to install next tag (#21741) @bernardobelchior
+- [docs] Revise the Pie chart docs (#21565) @mapache-salvaje
+- [docs] Revise the Bar Chart docs (#21482) @mapache-salvaje
+- [docs] Removed a `console.log` from an aggregation demo (#21698) @michelengelen
+
+### Core
+
+- [code-infra] Add pkg-pr-new as dev dependency (#21754) @Janpot
+- [code-infra] Prevent `combiner` to have default parameters (#21707) @JCQuintas
+- [code-infra] Remove CI coverage collection and upload to Codecov (#21671) @Janpot
+- [internal] Remove @bernardobelchior from Charts CODEOWNERS (#21776) @Copilot
+
+### Miscellaneous
+
+- [x-license] Fix process.env.MUI_VERSION not being replaced during build (#21727) @aemartos
+- [x-license] Add new watermark license status message (#21720) @aemartos
+
+## 9.0.0-alpha.3
+
+_Mar 12, 2026_
+
+We'd like to extend a big thank you to the 13 contributors who made this release possible. Here are some highlights ✨:
+
+- 🐞 Bugfixes and internal improvements
+
+The following team members contributed to this release:
+@aemartos, @alexfauquette, @bernardobelchior, @brijeshb42, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @MBilalShafi, @michelengelen, @rita-codes, @sai6855, @siriwatknp
+
+### Data Grid
+
+#### `@mui/x-data-grid@9.0.0-alpha.3`
+
+- [DataGrid] Fix crash when `rows` and `rowModesModel` are updated simultaneously (#21265) @michelengelen
+- [DataGrid] Add missing `resizablePanelHandle` classes to `gridClasses` object (#21538) @sai6855
+- [DataGrid] Refactor `headerAlign` style calls (#21541) @sai6855
+
+#### `@mui/x-data-grid-pro@9.0.0-alpha.3` [![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@9.0.0-alpha.3`, plus:
+
+- [DataGridPro] Add `role="presentation"` to detail panel toggle header content (#21634) @michelengelen
+- [DataGridPro] Fix sorting not reflected in nested server-side data (#21619) @MBilalShafi
+
+#### `@mui/x-data-grid-premium@9.0.0-alpha.3` [![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@9.0.0-alpha.3`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@9.0.0-alpha.3`
+
+- [pickers] Refactor `DateRangePickerDay` overrides to use a centralized `elementOverrides` object (#21426) @sai6855
+- [pickers] Migrate from deprecated props for `PickersModalDialog` (#21702) @siriwatknp
+
+#### `@mui/x-date-pickers-pro@9.0.0-alpha.3` [![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@9.0.0-alpha.3`.
+
+### Charts
+
+#### `@mui/x-charts@9.0.0-alpha.3`
+
+- [charts] Differentiate Line Plot roots classes (#21679) @JCQuintas
+- [charts] Enable keyboard navigation by default (#21675) @alexfauquette
+- [charts] Fix keyboard tooltip radar (#21667) @alexfauquette
+- [charts] Fix selector default parameter (#21638) @JCQuintas
+- [charts] Fix tooltip blink between node and pointer anchor (#21611) @alexfauquette
+- [charts] Let tooltip and legend reflect the line shape (#21475) @alexfauquette
+- [charts] Refactor `BarChart` classes structure (#21601) @JCQuintas
+- [charts] Refactor `LineChart` classes structure (#21648) @JCQuintas
+- [charts] Refactor `ScatterChart` classes structure (#21651) @JCQuintas
+- [charts] Refactor `PieChart` classes structure (#21649) @JCQuintas
+- [charts] Remove batch rendering checks in highlight selectors (#21646) @bernardobelchior
+- [charts] Standardize generic arg names to `SeriesType` (#21694) @alexfauquette
+- [charts] Simplify highlight hooks return types (#21695) @alexfauquette
+
+#### `@mui/x-charts-pro@9.0.0-alpha.3` [![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@9.0.0-alpha.3`, plus:
+
+- [charts-pro] Fix heatmap style override from `arc` to `cell` (#21693) @Copilot
+- [charts-pro] Fix image export truncated when page is zoomed out (#21685) @bernardobelchior
+- [charts-pro] Speed-up heatmap cell search with an index lookup (#21130) @alexfauquette
+- [charts-pro] Fix heatmap highlight not working (#21710) @Copilot
+
+#### `@mui/x-charts-premium@9.0.0-alpha.3` [![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@9.0.0-alpha.3`, plus:
+
+- [charts-premium] Re-enable WebGL tests (#21708) @bernardobelchior
+
+### Tree View
+
+#### Breaking changes
+
+- Remove `TreeViewBaseItem` type (use `TreeViewDefaultItemModelProperties` or a custom interface)
+- Remove `useTreeViewApiRef` hook (use `useRichTreeViewApiRef`, `useSimpleTreeViewApiRef`, or `useRichTreeViewProApiRef`)
+- Remove `status` from content slot props returned by `getContentProps()` (use `data-*` attributes; `status` on `useTreeItem` return value is unchanged)
+- Remove deprecated CSS state classes from `treeItemClasses`: `expanded`, `selected`, `focused`, `disabled`, `editable`, `editing` (use `[data-expanded]`, `[data-selected]`, etc.)
+- The `<RichTreeViewPro />` component has now virtualization enabled by default.
+- The items used inside the `<RichTreeViewPro />` now have a default height of `32px`.
+- The events of the `<RichTreeViewPro />` are now rendered as a flat list instead of a nested tree.
+
+#### `@mui/x-tree-view@9.0.0-alpha.3`
+
+- [tree view] Remove deprecated APIs (#21591) @flaviendelangle
+- [tree view] Fix collapsed children not selected with `selectionPropagation.descendants` in `SimpleTreeView` (#21253) @flaviendelangle
+
+#### `@mui/x-tree-view-pro@9.0.0-alpha.3` [![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@9.0.0-alpha.3`, plus:
+
+- [RichTreeViewPro] Make the virtualization opt-out and port the layout doc from the data grid (#21461) @flaviendelangle
+
+### Codemod
+
+#### `@mui/x-codemod@9.0.0-alpha.3`
+
+Internal changes.
+
+### Docs
+
+- [docs] Fix `AssistantWithDataSource` demo crashing (#21555) @sai6855
+- [docs] Remove `Preview` pill from Sankey (#21623) @bernardobelchior
+- [docs] Migrate internal Material UI deprecated APIs (#21680) @siriwatknp
+- [docs] Remove `New` flag on Tree View and Date and Time Pickers features released before v9 alpha (#21585) @flaviendelangle
+
+### Core
+
+- [code-infra] Remove checkout step (#21688) @Janpot
+- [code-infra] Fix contributor generation in changelog (#21718) @brijeshb42
+- [docs-infra] Do not point to non-existent v8 subdomain (#21640) @cherniavskii
+
+### Miscellaneous
+
+- [test] Add missing tests for forwarding props to filter operators in DataGrid (#21441) @siriwatknp
+- [x-license] Export additional license types and constants (#21625) @aemartos
+- [x-license] Refactor license verification to accept package info object and add v9 version gating (#21690) @aemartos
+
 ## 9.0.0-alpha.2
 
 _Mar 5, 2026_
@@ -92,7 +337,7 @@ Internal changes.
 
 - [docs] Add backticks and parentheses to all functions and hooks (DX-173) (#21496) @mapache-salvaje
 - [docs] Remove mentions of `mySvgRef` (#21559) @bernardobelchior
-- [docs] Update Roadmap section in the docs  (#20892) @alelthomas
+- [docs] Update Roadmap section in the docs (#20892) @alelthomas
 - [docs] Add tutorial and example app for aggregation with row grouping (DX-162) (#21102) @mapache-salvaje
 - [docs] Fix missing codemod docs (#21604) @JCQuintas
 

package/ChartsAxis/index.d.mts

@@ -1,2 +1,3 @@
 export * from "./ChartsAxis.mjs";
-export * from "./axisClasses.mjs";
+export { axisClasses } from "./axisClasses.mjs";
+export type { ChartsAxisClasses, ChartsAxisClassKey } from "./axisClasses.mjs";

package/ChartsAxis/index.d.ts

@@ -1,2 +1,3 @@
 export * from "./ChartsAxis.js";
-export * from "./axisClasses.js";
+export { axisClasses } from "./axisClasses.js";
+export type { ChartsAxisClasses, ChartsAxisClassKey } from "./axisClasses.js";

package/ChartsAxis/index.js

@@ -3,9 +3,19 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+var _exportNames = {
+  axisClasses: true
+};
+Object.defineProperty(exports, "axisClasses", {
+  enumerable: true,
+  get: function () {
+    return _axisClasses.axisClasses;
+  }
+});
 var _ChartsAxis = require("./ChartsAxis");
 Object.keys(_ChartsAxis).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
   if (key in exports && exports[key] === _ChartsAxis[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
@@ -14,14 +24,4 @@ Object.keys(_ChartsAxis).forEach(function (key) {
     }
   });
 });
-var _axisClasses = require("./axisClasses");
-Object.keys(_axisClasses).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _axisClasses[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _axisClasses[key];
-    }
-  });
-});
+var _axisClasses = require("./axisClasses");

package/ChartsAxis/index.mjs

@@ -1,2 +1,2 @@
 export * from "./ChartsAxis.mjs";
-export * from "./axisClasses.mjs";
+export { axisClasses } from "./axisClasses.mjs";

package/ChartsAxisHighlight/index.d.mts

@@ -1,4 +1,5 @@
 export * from "./ChartsAxisHighlight.mjs";
-export * from "./chartsAxisHighlightClasses.mjs";
+export { chartsAxisHighlightClasses } from "./chartsAxisHighlightClasses.mjs";
+export type { ChartsAxisHighlightClasses, ChartsAxisHighlightClassKey } from "./chartsAxisHighlightClasses.mjs";
 export * from "./ChartsAxisHighlight.types.mjs";
 export * from "./ChartsAxisHighlightPath.mjs";

package/ChartsAxisHighlight/index.d.ts

@@ -1,4 +1,5 @@
 export * from "./ChartsAxisHighlight.js";
-export * from "./chartsAxisHighlightClasses.js";
+export { chartsAxisHighlightClasses } from "./chartsAxisHighlightClasses.js";
+export type { ChartsAxisHighlightClasses, ChartsAxisHighlightClassKey } from "./chartsAxisHighlightClasses.js";
 export * from "./ChartsAxisHighlight.types.js";
 export * from "./ChartsAxisHighlightPath.js";

package/ChartsAxisHighlight/index.js

@@ -3,9 +3,19 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+var _exportNames = {
+  chartsAxisHighlightClasses: true
+};
+Object.defineProperty(exports, "chartsAxisHighlightClasses", {
+  enumerable: true,
+  get: function () {
+    return _chartsAxisHighlightClasses.chartsAxisHighlightClasses;
+  }
+});
 var _ChartsAxisHighlight = require("./ChartsAxisHighlight");
 Object.keys(_ChartsAxisHighlight).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
   if (key in exports && exports[key] === _ChartsAxisHighlight[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
@@ -15,19 +25,10 @@ Object.keys(_ChartsAxisHighlight).forEach(function (key) {
   });
 });
 var _chartsAxisHighlightClasses = require("./chartsAxisHighlightClasses");
-Object.keys(_chartsAxisHighlightClasses).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _chartsAxisHighlightClasses[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _chartsAxisHighlightClasses[key];
-    }
-  });
-});
 var _ChartsAxisHighlight2 = require("./ChartsAxisHighlight.types");
 Object.keys(_ChartsAxisHighlight2).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
   if (key in exports && exports[key] === _ChartsAxisHighlight2[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
@@ -39,6 +40,7 @@ Object.keys(_ChartsAxisHighlight2).forEach(function (key) {
 var _ChartsAxisHighlightPath = require("./ChartsAxisHighlightPath");
 Object.keys(_ChartsAxisHighlightPath).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
   if (key in exports && exports[key] === _ChartsAxisHighlightPath[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,

package/ChartsAxisHighlight/index.mjs

@@ -1,4 +1,4 @@
 export * from "./ChartsAxisHighlight.mjs";
-export * from "./chartsAxisHighlightClasses.mjs";
+export { chartsAxisHighlightClasses } from "./chartsAxisHighlightClasses.mjs";
 export * from "./ChartsAxisHighlight.types.mjs";
 export * from "./ChartsAxisHighlightPath.mjs";

package/ChartsBrushOverlay/ChartsBrushOverlay.d.mts

@@ -1,4 +1,9 @@
-export interface ChartsBrushOverlayProps {}
+export interface ChartsBrushOverlayProps {
+  /**
+   * A CSS class name applied to the root element.
+   */
+  className?: string;
+}
 /**
  * Component that renders visual feedback during brush interaction
  */

package/ChartsBrushOverlay/ChartsBrushOverlay.d.ts

@@ -1,4 +1,9 @@
-export interface ChartsBrushOverlayProps {}
+export interface ChartsBrushOverlayProps {
+  /**
+   * A CSS class name applied to the root element.
+   */
+  className?: string;
+}
 /**
  * Component that renders visual feedback during brush interaction
  */

package/ChartsBrushOverlay/ChartsBrushOverlay.js

@@ -28,6 +28,9 @@ function BrushRect(props) {
  * Component that renders visual feedback during brush interaction
  */
 function ChartsBrushOverlay(props) {
+  const {
+    className
+  } = props;
   const store = (0, _useStore.useStore)();
   const drawingArea = store.use(_useChartDimensions.selectorChartDrawingArea);
   const theme = (0, _styles.useTheme)();
@@ -60,14 +63,14 @@ function ChartsBrushOverlay(props) {
     const rectWidth = currentX - startX;
     const rectHeight = currentY - startY;
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
-      className: (0, _clsx.default)(_ChartsBrushOverlay.brushOverlayClasses.root, _ChartsBrushOverlay.brushOverlayClasses.x, _ChartsBrushOverlay.brushOverlayClasses.y),
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(BrushRect, (0, _extends2.default)({
+      className: (0, _clsx.default)(_ChartsBrushOverlay.brushOverlayClasses.root, _ChartsBrushOverlay.brushOverlayClasses.x, _ChartsBrushOverlay.brushOverlayClasses.y, className),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(BrushRect, {
         fill: rectColor,
         x: rectWidth >= 0 ? startX : currentX,
         y: rectHeight >= 0 ? startY : currentY,
         width: Math.abs(rectWidth),
         height: Math.abs(rectHeight)
-      }, props))
+      })
     });
   }
   if (brushConfig === 'y') {
@@ -75,27 +78,27 @@ function ChartsBrushOverlay(props) {
     const maxY = Math.max(startY, currentY);
     const rectHeight = maxY - minY;
     return /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
-      className: (0, _clsx.default)(_ChartsBrushOverlay.brushOverlayClasses.root, _ChartsBrushOverlay.brushOverlayClasses.y),
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(BrushRect, (0, _extends2.default)({
+      className: (0, _clsx.default)(_ChartsBrushOverlay.brushOverlayClasses.root, _ChartsBrushOverlay.brushOverlayClasses.y, className),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(BrushRect, {
         fill: rectColor,
         x: left,
         y: minY,
         width: width,
         height: rectHeight
-      }, props))
+      })
     });
   }
   const minX = Math.min(startX, currentX);
   const maxX = Math.max(startX, currentX);
   const rectWidth = maxX - minX;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
-    className: (0, _clsx.default)(_ChartsBrushOverlay.brushOverlayClasses.root, _ChartsBrushOverlay.brushOverlayClasses.x),
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(BrushRect, (0, _extends2.default)({
+    className: (0, _clsx.default)(_ChartsBrushOverlay.brushOverlayClasses.root, _ChartsBrushOverlay.brushOverlayClasses.x, className),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(BrushRect, {
       fill: rectColor,
       x: minX,
       y: top,
       width: rectWidth,
       height: height
-    }, props))
+    })
   });
 }

package/ChartsBrushOverlay/ChartsBrushOverlay.mjs

@@ -21,6 +21,9 @@ function BrushRect(props) {
  * Component that renders visual feedback during brush interaction
  */
 export function ChartsBrushOverlay(props) {
+  const {
+    className
+  } = props;
   const store = useStore();
   const drawingArea = store.use(selectorChartDrawingArea);
   const theme = useTheme();
@@ -53,14 +56,14 @@ export function ChartsBrushOverlay(props) {
     const rectWidth = currentX - startX;
     const rectHeight = currentY - startY;
     return /*#__PURE__*/_jsx("g", {
-      className: clsx(brushOverlayClasses.root, brushOverlayClasses.x, brushOverlayClasses.y),
-      children: /*#__PURE__*/_jsx(BrushRect, _extends({
+      className: clsx(brushOverlayClasses.root, brushOverlayClasses.x, brushOverlayClasses.y, className),
+      children: /*#__PURE__*/_jsx(BrushRect, {
         fill: rectColor,
         x: rectWidth >= 0 ? startX : currentX,
         y: rectHeight >= 0 ? startY : currentY,
         width: Math.abs(rectWidth),
         height: Math.abs(rectHeight)
-      }, props))
+      })
     });
   }
   if (brushConfig === 'y') {
@@ -68,27 +71,27 @@ export function ChartsBrushOverlay(props) {
     const maxY = Math.max(startY, currentY);
     const rectHeight = maxY - minY;
     return /*#__PURE__*/_jsx("g", {
-      className: clsx(brushOverlayClasses.root, brushOverlayClasses.y),
-      children: /*#__PURE__*/_jsx(BrushRect, _extends({
+      className: clsx(brushOverlayClasses.root, brushOverlayClasses.y, className),
+      children: /*#__PURE__*/_jsx(BrushRect, {
         fill: rectColor,
         x: left,
         y: minY,
         width: width,
         height: rectHeight
-      }, props))
+      })
     });
   }
   const minX = Math.min(startX, currentX);
   const maxX = Math.max(startX, currentX);
   const rectWidth = maxX - minX;
   return /*#__PURE__*/_jsx("g", {
-    className: clsx(brushOverlayClasses.root, brushOverlayClasses.x),
-    children: /*#__PURE__*/_jsx(BrushRect, _extends({
+    className: clsx(brushOverlayClasses.root, brushOverlayClasses.x, className),
+    children: /*#__PURE__*/_jsx(BrushRect, {
       fill: rectColor,
       x: minX,
       y: top,
       width: rectWidth,
       height: height
-    }, props))
+    })
   });
 }

package/ChartsContainer/ChartsContainer.d.mts

@@ -31,7 +31,7 @@ export type ChartsContainerProps<SeriesType extends ChartSeriesType = ChartSerie
  * </ChartsContainer>
  * ```
  */
-declare const ChartsContainer: <TSeries extends ChartSeriesType>(props: ChartsContainerProps<TSeries> & {
+declare const ChartsContainer: <SeriesType extends ChartSeriesType>(props: ChartsContainerProps<SeriesType> & {
   ref?: React.ForwardedRef<HTMLDivElement>;
 }) => React.JSX.Element;
 export { ChartsContainer };

package/ChartsContainer/ChartsContainer.d.ts

@@ -31,7 +31,7 @@ export type ChartsContainerProps<SeriesType extends ChartSeriesType = ChartSerie
  * </ChartsContainer>
  * ```
  */
-declare const ChartsContainer: <TSeries extends ChartSeriesType>(props: ChartsContainerProps<TSeries> & {
+declare const ChartsContainer: <SeriesType extends ChartSeriesType>(props: ChartsContainerProps<SeriesType> & {
   ref?: React.ForwardedRef<HTMLDivElement>;
 }) => React.JSX.Element;
 export { ChartsContainer };