Textarea

Multi-line text for comments and detailed responses.

Preview

You can @mention other users and organizations.

Usage

<FormField
control={form.control}
name="bio"
render={({ field }) => (
<FormItem>
<FormLabel>Bio</FormLabel>
<FormControl>
<Textarea
placeholder="Tell us about yourself"
className="resize-none"
maxLength={2000}
{...field}
value={typeof field.value === "string" ? field.value : ""}
onChange={(event) => field.onChange(event.target.value)}
/>
</FormControl>
<FormDescription>You can @mention other users and organizations.</FormDescription>
<FormMessage />
</FormItem>
)}
/>

Details

Copy this field block into a React Hook Form setup and swap the demo content for your own schema and labels.

form-builder/components/ui/textarea.tsx