import type { TextareaHTMLAttributes } from "react";

import { cn, inputClass, type InputState } from "@/lib/ui/variants";

interface TextAreaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
  controlSize?: "sm" | "md";
  state?: InputState;
}

const textAreaSizes: Record<NonNullable<TextAreaProps["controlSize"]>, string> = {
  sm: "px-2 py-1 text-xs leading-5",
  md: "px-3 py-2 text-sm leading-6",
};

export function TextArea({
  className,
  controlSize = "md",
  state,
  ...props
}: TextAreaProps) {
  return (
    <textarea
      className={inputClass({
        state,
        className: cn("resize-y", textAreaSizes[controlSize], className),
      })}
      {...props}
    />
  );
}