Rev 3452 | Rev 3536 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
import React from 'react';
import { FormControl, InputAdornment, InputBase, InputLabel, Typography } from '@mui/material';
import { Controller, useFormContext } from 'react-hook-form';
export function FormInput({ icon, name, rules, label, disabled, ...props }) {
const { control } = useFormContext();
return (
<Controller
name={name}
control={control}
disabled={disabled}
rules={rules}
render={({ field, fieldState: { error } }) => (
<FormControl variant='standard' fullWidth>
{label && <InputLabel shrink>{label}</InputLabel>}
<InputBase
{...field}
startAdornment={icon && <InputAdornment>{icon}</InputAdornment>}
fullWidth
{...props}
/>
{error && (
<Typography sx={{ color: 'red', fontSize: '0.75rem' }}>{error.message}</Typography>
)}
</FormControl>
)}
/>
);
}