Textarea
v1.0.16Updated 19 Oct 2026Multi-line text input. Resizable by default; pairs with FormField for long-form input. Adds autosize, character counter, markdown preview (DOMPurify-sanitised), mentions autocomplete, a floating formatting toolbar, and s
Preview
Live · 15 storiesDefaultOpen ↗
▸Why this is recommendedformtextareamultilinetext+4
The default, out-of-the-box Textarea.
Recommended for+14
- ✓Notes / comments fields
- ✓Description editors
- ✓Free-form input
- ✓Comment composers
- ✓Markdown-aware fields
- ✓Chat composers
Tags+6
formtextareamultilinetextmarkdownmentionsautosizedefault
Features+4
- Auto sizing via className
- Disabled / read-only
- Native attributes pass-through
- Autosize to content
- Character counter
- Markdown preview (rendered via the Markdown composite, sanitised by DOMPurify)
- Mentions autocomplete (@user)
- Floating formatting toolbar (bold / italic / code / link)
- Submit-on-enter (with shift+enter for newline)
- i18n: labels prop overrides mode tabs, floating-toolbar and mention-listbox strings
Not recommended for−2
- ✕Short single-line input (use Input)
- ✕Long-form WYSIWYG (use a dedicated editor)
Install
Ask your agent, or call the MCP tool directly. The resolved bundle is written into your project.
Usage
Tick variants in the left menu — each adds a tab with that variant’s real story source, the same code the preview above renders.
Props
PropTypeRequired
autosizeAuto-grow with content
—showCountShow character counter
—markdownPreviewRender a sanitised preview tab
—mentionsMention autocomplete list
—submitOnEnterSubmit on Enter (Shift+Enter for newline)
—toolbarShow floating toolbar
—labelsOverride built-in UI strings (i18n)
—