Material-UI password input required

0
votes

Using MUI @Next and the TextField component.

MUI very nicely adds a little * at the end of the label when you add required as a prop, however it seems to not work out of the box when you add the endAdornment in order to enable a "show password" toggle.

I have created a codesandbox of my issue.

The regular <Texfield /> component shows the * as expected, but the also required password field doesn't.

1
textfieldmaterial-ui

1 Answers

0
votes

While making the codesandbox reproduction of my issue, I found the answer, but thought I'd leave it here for others who come across this. The required prop has to go on the <FormControl /> wrapper of the input:

<FormControl required ... >
   <InputLabel ... >Password</InputLabel>
   <Input ... />
</FormControl>