import type { HTMLAttributes } from 'react';
import { cn } from '@/lib/utils';
import { useTempoUi } from '@/components/tempo-brand';

export default function InputError({
    message,
    className = '',
    ...props
}: HTMLAttributes<HTMLParagraphElement> & { message?: string }) {
    const { t } = useTempoUi();
    return message ? (
        <p
            {...props}
            className={cn('text-sm text-red-600 dark:text-red-400', className)}
        >
            {t(message)}
        </p>
    ) : null;
}