You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
monitor-doc/resources/js/Components/TextInput.jsx

39 lines
930 B
JavaScript

import React, { useEffect, useRef } from 'react';
export default function TextInput({
type = 'text',
name,
value,
className,
autoComplete,
required,
isFocused,
handleChange,
}) {
const input = useRef();
useEffect(() => {
if (isFocused) {
input.current.focus();
}
}, []);
return (
<div className="flex flex-col items-start">
<input
type={type}
name={name}
value={value}
className={
`border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm ` +
className
}
ref={input}
autoComplete={autoComplete}
required={required}
onChange={(e) => handleChange(e)}
/>
</div>
);
}