# Multiline text fields

`ASTextField multiline` renders a native textarea. Omitting `multiline` (or passing false) keeps the existing input path. The public `ASTextFieldProps` remains extendable; `ASMultilineTextFieldProps` supplies textarea-specific attributes and events.

```tsx
<ASTextField
  multiline
  aria-label="Your message"
  rows={4}
  maxLength={500}
  showCharacterCount
  value={message}
  onChange={setMessage}
/>
```

- `rows` defaults to 4. Textareas can be resized vertically; the container grows with the textarea and retains its counter below it.
- `value` makes the field controlled; `defaultValue` seeds an uncontrolled field. The counter always follows the displayed value, including parent updates. Neither path truncates supplied values.
- Native `maxLength` limits user entry. The counter uses JavaScript string length (UTF-16 code units), matching the native length convention rather than counting user-perceived characters; some emoji count as two or more units.
- `showCharacterCount` defaults to false. When enabled, it displays `length / maxLength`, or just `length` if no nonnegative limit is supplied.
- The counter is associated through `aria-describedby`, preserving caller-provided description IDs. It is not a live region, avoiding an announcement on every keystroke. Supply an ordinary label or `aria-label` for the textarea.
- Enter inserts a newline. Native `onKeyDown`, `onFocus`, and other textarea handlers are forwarded without selecting all text on focus. Input-only search/password icons and `onEnter` are not part of the multiline API.
- Disabled and invalid styles, project inheritance, and outer hover/focus glows reuse the text-field theme.

Counter properties live under `components.textfield`: `counterColor`, `counterFontSize`, and `counterFontWeight` (a CSS string). Disabled counters use `disabledColor`. Classic starts with its placeholder color; neutral derives the counter color from `tokens.color.mutedText`. See the [theme reference](./theme-reference.md) for defaults.

The Eleventheye Storybook preview includes a controlled 500-unit message, an uncontrolled 12-unit note for checking the limit, and a disabled message. Floating labels and automatic row growth based on content are not included.

The dedicated **ASUI Components → ASTextArea** Storybook category uses the modern neutral preset throughout. It includes Autodocs, size/row/value controls, disabled/read-only/invalid states, character limits, and semantic counter overrides. It demonstrates `ASTextField multiline`; no separate ASTextArea package export or legacy-theme demo is introduced.

### Validation feedback

Pass `errorMessage="Please review this message."` to show themed feedback below the field. A non-empty message sets `aria-invalid` and adds its ID to `aria-describedby`, preserving existing description and character-counter IDs. Empty or whitespace-only messages show no feedback; an explicit `aria-invalid` still works independently. Consumers own validation and clear the message when the value becomes valid.
