import { forwardRef } from 'react'

import { cn } from '@/lib/utils'

import type { TextareaHTMLAttributes } from 'react'

type Props = TextareaHTMLAttributes<HTMLTextAreaElement> & { invalid?: boolean }


export default forwardRef<HTMLTextAreaElement, Props> (
    ({ className, invalid = false, ...props }, ref) => (
	<textarea
	    ref={ref}
	    aria-invalid={invalid}
	    className={cn ('rounded border w-full p-2 h-32',
			   (invalid
			    ? ['border-red-500 bg-red-50 text-red-900',
			       'focus:border-red-500 focus:outline-none focus:ring-2',
			       'foucs:ring-red-200',
			       'dark:border-red-500 dark:bg-red-950/30 dark:text-red-100']
			    : ['border-gray-300',
			       'focus:border-blue-500 focus:outline-none focus:ring-2',
			       'focus:ring-blue-200']),
			   className)}
	    {...props}/>))