import React from 'react';
import clsx from 'clsx';

interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
    error?: boolean;
}

export default function Input({ className, error = false, ...props }: InputProps): JSX.Element {
    return (
        <input
            className={clsx(
                'ti-form-input',
                error && 'border-rose-300 focus:border-rose-300 focus:ring-rose-100',
                className,
            )}
            {...props}
        />
    );
}