[mui-plugin-rtl] fix RTL does not work with CSS layer with a new package

[siriwatknp]

Preview: https://deploy-preview-46230--material-ui.netlify.app/material-ui/getting-started/

Issue

The current docs RTL is broken.

Screen.Recording.2568-05-29.at.10.50.01.mov

The root cause comes from stylis-plugin-rtl does not work with CSS Layer.

Fix

There is no response from the PR I open to fix the issue (last commit on the repo was 4 yrs ago) so I copy the source code and put it under our repo using package name @mui/plugin-rtl.

I also update all the docs to point to the new package instead.

Screen.Recording.2568-05-29.at.11.09.46.mov

• I have followed (at least) the PR section of the contributing guide.

[mui-bot]

Netlify deploy preview

• docs/data/joy/customization/right-to-left/right-to-left.md
• docs/data/material/customization/right-to-left/right-to-left.md

Bundle size report

No bundle size changes (Toolpad)
No bundle size changes

Generated by 🚫 dangerJS against ae0fc29

[Janpot]

Would it make sense to just take the plugin code and test and put it as a file straight in the docs? Feels quite overkill and harder to maintain to create a whole package for these 60 LOC.

[siriwatknp]

Would it make sense to just take the plugin code and test and put it as a file straight in the docs? Feels quite overkill and harder to maintain to create a whole package for these 60 LOC.

I thought of it as well but our docs is mentioning the package that does not work with one of our feature. That's the main reason I came up with a new package.

Would it make sense to just take the plugin code and test and put it as a file straight in the docs?

I feel it's much more work to do:

• need to update the docs to use the dependencies of the package (e.g. cssjanus)
• the existing tests would not work with our test infra

harder to maintain to create a whole package for these 60 LOC

The process is simple, I just fork and change the package name, finally run yarn publish. I think MUI could own the repo so that anyone can merge a bug fix if needed in the future.

[Janpot]

I don't think we should adopt this repository. If we're going to maintain a fork then we should adopt it as a package in this repo and update the build and tests to work with our setup. That should be quite straightforward to do, we've done it with some babel plugins as well. Sure setting this up is quick and easy. Having repos for packages of 60LOC in our org is not a maintenance burden we should take on.

[siriwatknp]

I don't think we should adopt this repository. If we're going to maintain a fork then we should adopt it as a package in this repo and update the build and tests to work with our setup. That should be quite straightforward to do, we've done it with some babel plugins as well. Sure setting this up is quick and easy. Having repos for packages of 60LOC in our org is not a maintenance burden we should take on.

I'll try it out under packages/mui-plugin-rtl folder.

[siriwatknp]

@Janpot Ready for review. I put it under @mui/plugin-rtl package name with folder packages/mui-plugin-rtl/*.

[Janpot]

Looks good to me overall, just seeing it now, I feel like this should be called @mui/stylis-plugin-rtl 🤔

[siriwatknp]

Looks good to me overall, just seeing it now, I feel like this should be called @mui/stylis-plugin-rtl 🤔

I'm good with the name. Updating

[Janpot]

Looks good as far as I'm concerned. @DiegoAndai any thoughts?

[DiegoAndai]

LGTM