Textarea — Componentes

Comparación entre la versión Astro (Saastro) y React (shadcn/ui)

🚀 saastro/ui (Astro)

⚛️ shadcn/ui (React)

Installation

pnpm dlx saastro add textarea

Development (local registry):

cd apps/ui
REGISTRY_URL=http://localhost:3456/r node ../../packages/saastro/dist/index.js add textarea --yes

Usage

---
import { Textarea } from "@/components/ui-saastro/textarea"
---

<Textarea placeholder="Type your message here." />

Examples

Default

<Textarea placeholder="Type your message here." />

With Label

---
import { Label } from "@/components/ui-saastro/label"
import { Textarea } from "@/components/ui-saastro/textarea"
---

<div class="grid w-full gap-1.5">
  <Label for="message">Your message</Label>
  <Textarea placeholder="Type your message here." id="message" />
</div>

Disabled

<Textarea disabled placeholder="Disabled" />

Props

Prop	Type	Default	Description
`placeholder`	`string`	-	Placeholder text
`disabled`	`boolean`	`false`	Whether the textarea is disabled
`rows`	`number`	-	Number of visible text lines
`class`	`string`	-	Additional CSS classes

Accessibility

Uses native <textarea> element for built-in accessibility
Associate with <Label> using matching id and for attributes
Supports keyboard navigation
Use aria-invalid for validation states