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

interface SelectProps extends React.SelectHTMLAttributes<HTMLSelectElement> {
    error?: boolean;
}

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