Textarea
An enhanced native <textarea> supporting auto-height and resize.
Basic Usage
Basic usage
Rows & Resize
rows / resize
resize is passed through to the native resize value (none / both / horizontal / vertical), defaulting to none.
Auto Height
autosize
autosize enables auto height: the height grows with content, returns to the minimum height when empty, and shows a scrollbar when exceeding max-rows (default 6).
Autosize Bounds
autosize + min-rows / max-rows
min-rows (default 1) controls the minimum height, max-rows (default 6) caps the height and shows a scrollbar. The legacy attribute auto-height is kept for compatibility.
auto-height Compatibility Alias
auto-height
auto-height is a compatibility alias for autosize with identical behavior: grows with content, returns to the minimum row height when empty, and shows a scrollbar beyond max-rows (default 6). Setting either one enables auto height.
Disabled & Readonly
disabled / readonly
Events
Input events
Listen to oas-input (while typing, detail: { value }):
API
Attributes
| Attribute | Description | Type | Default |
|---|---|---|---|
auto-height | Legacy name (alias of autosize) | boolean | — |
autosize | Auto height | boolean | — |
disabled | Disabled | boolean | — |
max-rows | Maximum rows in autosize | string | 6 |
min-rows | Minimum rows in autosize | string | 1 |
placeholder | Placeholder text | string | — |
readonly | Readonly | boolean | — |
resize | Resize behavior | string | — |
rows | Number of rows | string | 3 |
value | Value (controlled) | string | — |
Events
| Event | Description |
|---|---|
oas-input | While typing, detail: { value } |