34 lines
990 B
JavaScript
34 lines
990 B
JavaScript
import {useState} from "react";
|
|
import {IconButton, InputAdornment, TextField} from "@mui/material";
|
|
import {Visibility, VisibilityOff} from "@mui/icons-material";
|
|
import {Field} from "formik";
|
|
|
|
const PasswordField = (props) => {
|
|
const [showPassword, setShowPassword] = useState(false);
|
|
|
|
const handleClickShowPassword = () => {
|
|
setShowPassword(!showPassword);
|
|
};
|
|
|
|
return (
|
|
<Field
|
|
variant="outlined"
|
|
fullWidth
|
|
as={TextField}
|
|
{...props}
|
|
type={showPassword ? "text" : "password"}
|
|
InputProps={{
|
|
endAdornment: (
|
|
<InputAdornment position="end">
|
|
<IconButton onClick={handleClickShowPassword}>
|
|
{showPassword ? <Visibility/> : <VisibilityOff/>}
|
|
</IconButton>
|
|
</InputAdornment>
|
|
),
|
|
}}
|
|
/>
|
|
);
|
|
};
|
|
|
|
export default PasswordField;
|