// ** React Imports import { ChangeEvent, forwardRef, MouseEvent, useState } from 'react' // ** MUI Imports import Card from '@mui/material/Card' import Grid from '@mui/material/Grid' import Button from '@mui/material/Button' import Divider from '@mui/material/Divider' import MenuItem from '@mui/material/MenuItem' import TextField from '@mui/material/TextField' import CardHeader from '@mui/material/CardHeader' import InputLabel from '@mui/material/InputLabel' import IconButton from '@mui/material/IconButton' import Typography from '@mui/material/Typography' import CardContent from '@mui/material/CardContent' import CardActions from '@mui/material/CardActions' import FormControl from '@mui/material/FormControl' import OutlinedInput from '@mui/material/OutlinedInput' import InputAdornment from '@mui/material/InputAdornment' import Select, { SelectChangeEvent } from '@mui/material/Select' // ** Third Party Imports import DatePicker from 'react-datepicker' // ** Icons Imports import EyeOutline from 'mdi-material-ui/EyeOutline' import EyeOffOutline from 'mdi-material-ui/EyeOffOutline' interface State { password: string password2: string showPassword: boolean showPassword2: boolean } const CustomInput = forwardRef((props, ref) => { return }) const FormLayoutsSeparator = () => { // ** States const [language, setLanguage] = useState([]) const [date, setDate] = useState(null) const [values, setValues] = useState({ password: '', password2: '', showPassword: false, showPassword2: false }) // Handle Password const handlePasswordChange = (prop: keyof State) => (event: ChangeEvent) => { setValues({ ...values, [prop]: event.target.value }) } const handleClickShowPassword = () => { setValues({ ...values, showPassword: !values.showPassword }) } const handleMouseDownPassword = (event: MouseEvent) => { event.preventDefault() } // Handle Confirm Password const handleConfirmChange = (prop: keyof State) => (event: ChangeEvent) => { setValues({ ...values, [prop]: event.target.value }) } const handleClickShowConfirmPassword = () => { setValues({ ...values, showPassword2: !values.showPassword2 }) } const handleMouseDownConfirmPassword = (event: MouseEvent) => { event.preventDefault() } // Handle Select const handleSelectChange = (event: SelectChangeEvent) => { setLanguage(event.target.value as string[]) } return (
e.preventDefault()}> 1. Account Details Password {values.showPassword ? : } } /> Confirm Password {values.showPassword2 ? : } } /> 2. Personal Info Country Language } id='form-layouts-separator-date' onChange={(date: Date) => setDate(date)} />
) } export default FormLayoutsSeparator