Skip to content
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

[charts] Fix typescript error when using sx property on ChartsTooltip #12659

Merged

Conversation

JCQuintas
Copy link
Member

@JCQuintas JCQuintas commented Apr 3, 2024

The cause for this is that @mui/base/Popper doesn't seen to have the sx property.

I've re-exported a PopperProps property with the added sx prop. I decided on having the property be exported from the lib in order for users to be able to use it somewhere else.

@JCQuintas JCQuintas self-assigned this Apr 3, 2024
@mui-bot
Copy link

mui-bot commented Apr 3, 2024

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

Generated by 🚫 dangerJS against b36d046

@JCQuintas JCQuintas linked an issue Apr 3, 2024 that may be closed by this pull request
@alexfauquette
Copy link
Member

Looks like an easy solution, but it does not go in the direction of not depending on @mui/material #12219

The sx is added because we style the default component. Maube we could add the sx type like done in the core
https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Popper/Popper.tsx/#L30-L33

@JCQuintas
Copy link
Member Author

@alexfauquette good to know. I had initially added that, but saw the material Popper being used somewhere else and thought it was better to follow the pattern. I will fix it right away, thanks

@JCQuintas
Copy link
Member Author

@alexfauquette Also, how should I label this PR? And is there any docs on how labelling works?

@JCQuintas JCQuintas added bug 🐛 Something doesn't work component: charts This is the name of the generic UI component, not the React module! labels Apr 4, 2024
@JCQuintas JCQuintas enabled auto-merge (squash) April 4, 2024 14:44
@JCQuintas JCQuintas merged commit d533964 into mui:master Apr 4, 2024
15 checks passed
@@ -21,6 +21,13 @@ import { ChartsItemContentProps, ChartsItemTooltipContent } from './ChartsItemTo
import { ChartsAxisContentProps, ChartsAxisTooltipContent } from './ChartsAxisTooltipContent';
import { ChartsTooltipClasses, getChartsTooltipUtilityClass } from './chartsTooltipClasses';

export type PopperProps = BasePopperProps & {
Copy link
Member

Choose a reason for hiding this comment

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

Nitpick: IMHO, this type could have also been prefixed with Charts to avoid the conflict with base and material types.

Copy link
Member Author

Choose a reason for hiding this comment

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

That could be better indeed, is there a pattern we follow in such cases? Like, both material and base are PopperProps, so there is already some confusion there 🤔

Copy link
Member

Choose a reason for hiding this comment

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

There are no hard rules and material/base are not an examples of making types unique.
For Charts we somewhat settled on trying to prefix types (especially generic ones) with Charts to avoid further confusion.
For example, we have the ChartsGridProps instead of GridProps to avoid potential errors. 🙈
Maybe @alexfauquette has a more clear vision/direction for type naming? 🤔

Copy link
Member

Choose a reason for hiding this comment

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

Since the component name is ChartsTooltipRoot I assume we could have named it ChartsTooltipRootProps But those naming are not ideal. They would benefit an entire renaming to harmonize the notion of tooltip/popper

I do not expect user to use it, or if they do the confusion with the core type should not be a big deal since they are quite similar

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug 🐛 Something doesn't work component: charts This is the name of the generic UI component, not the React module!
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[charts] Support popper sx props with TS
4 participants