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
[docs][material-ui][theme] Add documentation on migrating JSS's alternative, array-based syntax to syntax supported by Emotion #42053
base: next
Are you sure you want to change the base?
Conversation
… array-based syntax to syntax supported by Emotion
Netlify deploy previewBundle size report |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@cjl750 Thanks for the pull request. It looks good to me! We need another review from @DiegoAndai to confirm whether we should consider documenting this, as it wasn't requested before and doesn't seem to be a common use case. However, I see no issue with documenting it.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hey @cjl750! Thanks for working on this
Correct me if I'm wrong, but the usage in v4 would be:
const theme = createTheme({
overrides: {
MuiOutlinedInput: {
root: {
padding: [[20, 10]],
},
},
},
});
If so, we should include this as the starting point.
Hi @DiegoAndai
You're right, that would be what you'd have in your v4 theme. I was keeping the pattern in the diff for the local rule overrides in that same section of the page, which shows the theme already converted to use Looks like converting to |
Added a section to the page on breaking style and theme changes in v5 about migrating the alternative, array-based syntax for space- and comma-separated values to string-based values necessary for use with Emotion.
Since everything under the heading "Migrate theme styleOverrides to Emotion" was about refactoring local rule references, I opted to take the content in that section and put it under a new sub-header (so the existing h3s became h4s), then I added a second sub-header for the new section about migrating the alternative, array-based syntax.
This is to resolve #41971