34 lines
862 B
JavaScript
34 lines
862 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;
|