import React from 'react'
import { TextAreaProps } from '@/app/types'

const TextAreaInput = ({
  value,
  handleChange,
  label,
  name,
  placeholder,
  height,
}: TextAreaProps) => {
  return (
    <div>
      <label
        className="block mb-2 font-medium text-sm text-gray-500"
        htmlFor={name}
      >
        {label}
      </label>
      <textarea
        id={name}
        placeholder={placeholder}
        value={value}
        onChange={handleChange}
        style={{ minHeight: height ? `${height}px` : '160px' }}
        className="w-full px-3 py-2 border border-gray-300 text-black rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-400 focus:bg-white"
        autoComplete={name}
      />
    </div>
  )
}

export default TextAreaInput