[material-ui][Text Field] Right-to-left icon issue

[Lalliche]

Related page

https://mui.com/material-ui/customization/right-to-left/

Kind of issue

Unclear explanations

Issue description

I had an issue whie trying to style an input field using TextField.
when I tried to add an icon to the field it appears always on the right because i am using rtl direction in my react app
I tried to adjust it whith styling , when I set the margin to the left the input field disappeared because the icon took all the space
this document didnt show how to fix that

Context

I had an issue whie trying to style an input field using TextField.
when I tried to add an icon to the field it appears always on the right because i am using rtl direction in my react app
I tried to adjust it whith styling , when I set the margin to the left the input field disappeared because the icon took all the space
this document didnt show how to fix that

<TextField
fullWidth
label="Email"
variant="outlined"
size="small"
dir="rtl" // Right-to-left direction
style={{ marginBottom: 10 }}
InputProps={{
startAdornment: <EmailIcon style={{ marginLeft: 5 }} />,
}}

    />

Search keywords: Forms, RTL, icons, textfield

[ZeeshanTamboli]

It doesn't look like this bug report has enough info for one of us to reproduce it. Just having code snippet won't help us.
Please provide a Stackblitz (https://stackblitz.com/edit/stackblitz-starters-maxhor?file=src%2FApp.tsx), a link to a repository on GitHub, or provide a minimal code example that reproduces the problem.
Here are some tips for providing a minimal example: https://stackoverflow.com/help/mcve.

[github-actions]

Since the issue is missing key information and has been inactive for 7 days, it has been automatically closed. If you wish to see the issue reopened, please provide the missing information.