34 lines
1.1 KiB
TypeScript
34 lines
1.1 KiB
TypeScript
"use client";
|
|
import React, { forwardRef } from "react";
|
|
|
|
interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
|
|
label: string;
|
|
error?: string;
|
|
}
|
|
|
|
export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
|
|
({ label, error, className = "", ...props }, ref) => {
|
|
return (
|
|
<div className="flex flex-col gap-2 w-full">
|
|
<label className="text-[13px] font-extrabold text-navy uppercase tracking-widest">
|
|
{label}
|
|
</label>
|
|
<textarea
|
|
ref={ref}
|
|
className={`
|
|
w-full bg-ice/10 border rounded-[12px] px-4 py-3.5 text-[15px]
|
|
font-medium text-navy transition-all duration-200 resize-none
|
|
placeholder:text-navy/30 outline-none
|
|
focus:border-ocean focus:bg-white
|
|
${error ? "border-red-500" : "border-crisp"}
|
|
${className}
|
|
`}
|
|
{...props}
|
|
/>
|
|
{error && <span className="text-red-500 text-xs font-bold">{error}</span>}
|
|
</div>
|
|
);
|
|
}
|
|
);
|
|
|
|
Textarea.displayName = "Textarea"; |