[charts] Charts don't pass className to root element

[Janpot]

Steps to reproduce

Link to live example: (required)

Steps:

1. Open https://mui.com/x/react-charts/line-demo/#simplelinechart
2. Add className='foo' as a jsx attribute
3. Inspect the dom

Current behavior

No class attribute in the dom:

Expected behavior

Just like with e.g. Box or DataGrid, the root element has a foo class

Context

No response

Your environment

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Search keywords: className chart

[flaviendelangle]

This would be a good occasion to add describeConformance on the charts components
It checks this kind of things

[Janpot]

It checks this kind of things

👍 Same for things like lineChartClasses I suppose? This was what I was initially looking for. To target the root class.

[flaviendelangle]

I think that it also checks if the root class (lineChartClasses.root) is passed to the root DOM element yes.
But tbh I did not touch this for a long time.

[alexfauquette]

About lineChartClasses it's a bit special because the root element is the chart container which is common to all components.

Kind of related to that issue: ResponsiveChartContainer has the <svg /> wrapped into a <div /> whereas the ChartContainer just renders the <svg />.

[Janpot]

What I meant was that lineChartClasses (and responsiveChartContainerClasses ) is not exported from @mui/x-charts.

[alexfauquette]

Passing the className to the root component should be straight forward. Having all the lineChartClasses, barChartClasses, ... might need more reflexion. Not sure it suit well with the charts set of components

[github-actions]

⚠️ This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

@Janpot: How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.