# Textarea

> Multi-line text field.

Import from `@aspyn-io/kit`. Scaffold source: `npx shadcn@latest add https://design.aspyn.io/r/textarea.json`

## Install

```tsx
import { Textarea } from "@aspyn-io/kit";
```

### With label

```tsx
<div className="space-y-2">
  <Label htmlFor="bio">Bio</Label>
  <Textarea id="bio" placeholder="Tell us about yourself" />
</div>
```

### Feedback form

```tsx
<form className="space-y-3">
  <Label htmlFor="feedback">What can we improve?</Label>
  <Textarea id="feedback" rows={4} />
  <Button type="submit">Send feedback</Button>
</form>
```

### Disabled

```tsx
<div className="space-y-2">
  <Label htmlFor="notes">Notes</Label>
  <Textarea
    id="notes"
    disabled
    defaultValue="This field is read-only."
  />
</div>
```

### Invalid

Set aria-invalid to surface the destructive ring and border.

```tsx
<div className="space-y-2">
  <Label htmlFor="summary">Summary</Label>
  <Textarea
    id="summary"
    aria-invalid
    aria-describedby="summary-error"
    defaultValue=""
  />
  <p id="summary-error" className="text-sm text-destructive">
    A summary is required.
  </p>
</div>
```