# `LineaUI.Components.Textarea`
[🔗](https://github.com/devaction-labs/linea_ui/blob/v0.1.1/lib/linea_ui/components/textarea.ex#L1)

LineOne's textareas: outlined or filled, fixed or resizable, and framed with a header or a
footer (a title input, a toolbar, a submit button).

    <.textarea name="bio" placeholder="Enter Text" />
    <.textarea field={@form[:bio]} label="Bio" variant="filled" resizable />

    <.textarea name="post" rows={5} placeholder="Write the post">
      <:header>
        <.input name="title" variant="plain" class="p-3 text-lg font-medium" placeholder="Title" />
      </:header>
      <:footer>
        <span>…toolbar…</span>
        <.button color="primary" size="sm">Save Post</.button>
      </:footer>
    </.textarea>

# `textarea`

Renders a `<textarea>`. With a `header` or `footer` slot it sits, borderless, inside a
bordered frame that lights up while it has focus.

## Attributes

* `field` (`Phoenix.HTML.FormField`) - Defaults to `nil`.
* `id` (`:string`) - Defaults to the field's id.
* `name` (`:string`) - Defaults to the field's name.
* `value` (`:any`)
* `rows` (`:integer`) - Defaults to `4`.
* `variant` (`:string`) - Defaults to `"outlined"`. Must be one of `"outlined"`, `"filled"`, or `"plain"`.
* `resizable` (`:boolean`) - Defaults to `false`.
* `state` (`:string`) - Defaults to `nil`.Must be one of `nil`, `"success"`, or `"error"`.
* `label` (`:string`) - The caption. Defaults to `nil`.
* `label_class` (`:any`) - Classes of the caption text. Defaults to `nil`.
* `help` (`:string`) - The small line under the control. Defaults to `nil`.
* `errors` (`:list`) - Messages to show; `field` adds its own once the input was used. Defaults to `[]`.
* `disabled` (`:boolean`) - Defaults to `false`.
* `wrapper_class` (`:any`) - Classes of the outer block (grid placement, spacing). Defaults to `nil`.
* `frame_class` (`:any`) - Classes of the frame drawn around header/footer. Defaults to `nil`.
* `class` (`:any`) - Defaults to `nil`.
* Global attributes are accepted. Supports all globals plus: `["autocomplete", "autofocus", "cols", "form", "maxlength", "minlength", "placeholder", "readonly", "required", "wrap"]`.
## Slots

* `header` - Content above the text, laid out as a row.
* `footer` - Content below the text, laid out as a row with space between.

---

*Consult [api-reference.md](api-reference.md) for complete listing*