Skip to content

[charts] Add docs on tooltip style #17601

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Apr 29, 2025

Conversation

bernardobelchior
Copy link
Member

Fixes #17594.

The tooltip has the particularity that it cannot be styled directly with sx. This PR adds a docs section to explain how to style it.

@bernardobelchior bernardobelchior added docs Improvements or additions to the documentation scope: charts Changes or issues related to the charts product labels Apr 29, 2025
Copy link

github-actions bot commented Apr 29, 2025

Thanks for adding a type label to the PR! 👍

Copy link

Please add one type label to categorize the purpose of this PR appropriately:

bug, regression, enhancement, new feature, release or dependencies

@mui-bot
Copy link

mui-bot commented Apr 29, 2025

Deploy preview: https://deploy-preview-17601--material-ui-x.netlify.app/

Updated pages:

Generated by 🚫 dangerJS against 4cae24d

@bernardobelchior bernardobelchior added the type: enhancement This is not a bug, nor a new feature label Apr 29, 2025
Copy link

codspeed-hq bot commented Apr 29, 2025

CodSpeed Performance Report

Merging #17601 will not alter performance

Comparing bernardobelchior:clarify-tooltip-style (4cae24d) with master (bfb69bb)

Summary

✅ 8 untouched benchmarks

Copy link
Member

@alexfauquette alexfauquette left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm ok with the idea. I propose a modification to have a working demo ;)

slotProps={{
tooltip: {
sx: {
[`.${chartsTooltipClasses.valueCell}`]: {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
[`.${chartsTooltipClasses.valueCell}`]: {
[`& .${chartsTooltipClasses.valueCell}`]: {

Otherwise it's equivalent to `&.${chartsTooltipClasses.valueCell}`

@bernardobelchior
Copy link
Member Author

I'm ok with the idea. I propose a modification to have a working demo ;)

Oops 😛

@bernardobelchior bernardobelchior merged commit 7485dd3 into mui:master Apr 29, 2025
22 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
docs Improvements or additions to the documentation scope: charts Changes or issues related to the charts product type: enhancement This is not a bug, nor a new feature
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[charts] Is there any way to easily customize the label in the tooltip?
3 participants