Textarea

Displays a form textarea or a component that looks like a textarea.

No JavaScript Required

Installation

Add the component to your project:

rails generate shadcn:component textarea

Usage

<%= render Shadcn::TextareaComponent.new(placeholder: "Type your message here.") %>

Examples

Default

With Label

<div class="grid w-full gap-1.5">
  <%= render Shadcn::LabelComponent.new(for: "message") { "Your message" } %>
  <%= render Shadcn::TextareaComponent.new(id: "message", placeholder: "Type your message here.") %>
</div>

With Helper Text

You can @mention other users and organizations.

Custom Rows

Use the rows prop to set the number of visible rows.

Disabled

<%= render Shadcn::TextareaComponent.new(disabled: true, placeholder: "Disabled textarea") %>

With Button

API Reference

API Reference

Prop Type Default Description
name String nil Textarea name attribute
id String nil Textarea id attribute
value String nil Initial value
placeholder String nil Placeholder text
rows Integer 3 Number of visible rows
cols Integer nil Number of visible columns
disabled Boolean false Whether the textarea is disabled
required Boolean false Whether the textarea is required
readonly Boolean false Whether the textarea is readonly
minlength Integer nil Minimum character length
maxlength Integer nil Maximum character length

Accessibility

  • Uses native <textarea> element for proper accessibility
  • Always pair textareas with LabelComponent for accessibility
  • Disabled state uses native disabled attribute