Textarea

A multi-line text input with optional label, hint, and error messaging.

Installation

npx @obi/ui add textarea

Preview

Message

Max 500 characters.

Usage

import Textarea from '@/src/components/Textarea/Textarea';

export default function Example() {
  return (
    <div className="flex flex-col gap-4 max-w-sm">
      <Textarea label="Message" placeholder="Write your message here…" hint="Maximum 500 characters." />
      <Textarea label="Feedback" placeholder="Something went wrong…" error="This field is required." />
    </div>
  );
}

Props

Name	Type	Default	Description
label	string	—	Visible label rendered above the textarea.
placeholder	string	—	Placeholder text shown when the textarea is empty.
hint	string	—	Helper text rendered below the textarea when there is no error.
error	string	—	Error message; switches the textarea to error state.
disabled	boolean	false	Disables the textarea.
className	string	""	Additional classes merged onto the textarea element.