# Textarea (/cloud/primitives/textarea)



```ts title="Import"
import { Textarea } from "@nyte-ai/ui";
```

Implemented in `packages/ui/src/components/ui/textarea.tsx`. This is a plain `<textarea>`; there
is no Base UI part behind it.

## Usage [#usage]

* Same naming rule as Input: label, `aria-label`, or `aria-labelledby`.
* Resize is vertical only. If a surface must not grow, set `resize: none` through `xstyle`.
* The composer in the desktop app is not this component; it is a Lexical editor. Use Textarea for
  settings and forms.

## Example [#example]

<Preview>
  <TextareaDemo />
</Preview>

```tsx
<Textarea placeholder="System prompt" aria-label="System prompt" />
```

## Props [#props]

`TextareaProps` is `React.ComponentProps<"textarea">` minus `className`/`style`, plus:

| Prop                           | Type                                      | Default | Description                  |
| ------------------------------ | ----------------------------------------- | ------- | ---------------------------- |
| `unstyled`                     | `boolean`                                 | `false` | Render with no StyleX class. |
| `className`, `style`, `xstyle` | see [Theming](/cloud/foundations/theming) |         |                              |

## Accessibility [#accessibility]

Native. `aria-invalid` switches the border to `--nyte-color-destructive`; `disabled` drops
opacity.

## Styling [#styling]

Identical to [Input](/cloud/primitives/input#styling) except the minimum height, which is
`--nyte-control-textarea-min-height` (64px).