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.

Sign up for GitHub

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

Jump to bottom

[material-ui][StepLabel] Component displayed in the correct direction #41357

Closed
Yedidya10 opened this issue Mar 4, 2024 · 2 comments
Closed

[material-ui][StepLabel] Component displayed in the correct direction #41357

Yedidya10 opened this issue Mar 4, 2024 · 2 comments
Labels
component: stepper This is the name of the generic UI component, not the React module! package: material-ui Specific to @mui/material status: expected behavior Does not imply the behavior is intended. Just that we know about it and can't work around it support: question Community support but can be turned into an improvement

Comments

@Yedidya10
Copy link

Yedidya10 commented Mar 4, 2024 •
edited by github-actions bot

Steps to reproduce

Link to live example:

Steps:
Just change the direction in the main div from RTL to LTR and vice versa and you will see that all the components change direction as expected except for StepLabel which remains in the same place (on the right side).

Current behavior

No response

Expected behavior

No response

Context

No response

Your environment

npx @mui/envinfo 
  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Search keywords: StepLabel not displayed in the correct direction
@Yedidya10 Yedidya10 added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Mar 4, 2024
@DiegoAndai DiegoAndai self-assigned this Mar 4, 2024
@danilo-leal danilo-leal changed the title [material-ui][StepLabel] [material-ui][StepLabel] Component displayed in the correct direction Mar 5, 2024
@danilo-leal danilo-leal added component: stepper This is the name of the generic UI component, not the React module! package: material-ui Specific to @mui/material and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Mar 5, 2024
@samuelsycamore
Copy link
Member

In order to get LTR to function correctly in your CSB example, you need to remove the <CacheProvider />—here's a fork that shows the Step Labels behaving as expected: https://codesandbox.io/p/sandbox/green-http-gf5dxl?file=%2Fsrc%2FDemo.tsx%3A113%2C13

@samuelsycamore samuelsycamore added support: question Community support but can be turned into an improvement status: expected behavior Does not imply the behavior is intended. Just that we know about it and can't work around it labels Mar 5, 2024
@Yedidya10
Copy link
Author

Thanks.

It helped me understand that if I want to support both rtl and ltr, I also need to change the cache accordingly 🤟

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
component: stepper This is the name of the generic UI component, not the React module! package: material-ui Specific to @mui/material status: expected behavior Does not imply the behavior is intended. Just that we know about it and can't work around it support: question Community support but can be turned into an improvement
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@DiegoAndai @danilo-leal @samuelsycamore @Yedidya10