Tengo un componente de inicio de sesión como este

 const CssTextField = styled(TextField)({ "& label.Mui-focused": { color: "#71716A", }, "& .MuiInput-underline:after": { borderBottomColor: "#71716A", }, "& .MuiOutlinedInput-root": { "&.Mui-focused fieldset": { borderColor: "#71716A", }, },}); const [form, setForm] = useState({ name: "", password: ""}); const handleChange = (e) => { e.preventDefault(); setForm({ ...form, [e.target.name]: e.target.value });};

y devolver esto

 <div className="login-container"> <h3> What is your name?</h3> <FormControl> <Box sx={{ display: "flex", alignItems: "flex-end" }}> <AccountCircle sx={{ color: "action.active", mr: 1, my: 0.5 }} /> <CssTextField variant="standard" fullWidth id="name" label="Name" name="name" onChange={(e) => handleChange(e)} value={form.name} /> </Box> </FormControl> </div>

Incluso tengo el handleChange y la versión anterior del material Ui funciona bien. por favor ayúdame gracias