mui / material-ui

Material UI: Ready-to-use foundational React components, free forever. It includes Material UI, which implements Google's Material Design.
https://mui.com/material-ui/
MIT License
91.86k stars 31.57k forks source link

[codemod] Add `theme-v6` migration #42056

Closed siriwatknp closed 2 weeks ago

siriwatknp commented 2 weeks ago

Most of the code comes from #41743 because the style conversion is the same.

Templates: https://deploy-preview-42056--material-ui.netlify.app/material-ui/getting-started/templates/ Docs: https://github.com/siriwatknp/material-ui/tree/codemod/theme-sx/packages/mui-codemod#theme-v6

Tested by transforming all the template themes.

mui-bot commented 2 weeks ago

Netlify deploy preview

https://deploy-preview-42056--material-ui.netlify.app/

Bundle size report

No bundle size changes (Toolpad) No bundle size changes

Generated by :no_entry_sign: dangerJS against a2c0967668b5cffc1861c9f3a49e6dac87b7c36b

brijeshb42 commented 2 weeks ago

@zanivan Yes. What you have proposed is already possible. It might be a limitation on the codemod side that the output is like that. But if you are writing the variants manually, you can do the above.

siriwatknp commented 2 weeks ago

Is it possible to have something like this instead?

Good point. I'd say it's good to have because matching the props and merging the styles with codemod is a lot of work (for sure it can be done). I will improve it when I have time but at least it works at the moment.

zanivan commented 2 weeks ago

@zanivan Yes. What you have proposed is already possible. It might be a limitation on the codemod side that the output is like that. But if you are writing the variants manually, you can do the above.

Since it was an issue with the codemod, I went ahead and merged the duplicated props—there weren't so many, actually. Let me know if that's ok, or if anything needs to be corrected