import { cn } from '@/lib/utils';
import { forwardRef, InputHTMLAttributes, useEffect, useImperativeHandle, useRef } from 'react';
import { Input } from './ui/field';

export default forwardRef(function TextInput(
    { type = 'text', className = '', isFocused = false, ...props }: InputHTMLAttributes<HTMLInputElement> & { isFocused?: boolean },
    ref,
) {
    const localRef = useRef<HTMLInputElement>(null);
    useImperativeHandle(ref, () => ({ focus: () => localRef.current?.focus() }));
    useEffect(() => {
        if (isFocused) localRef.current?.focus();
    }, [isFocused]);
    return <Input {...props} type={type} className={cn(className)} ref={localRef} />;
});