When to Use
Example: community post comment
- Users need to enter paragraph-length text, such as product descriptions, user notes, or feedback
- Multi-line extension of TextField — both share the same core API (
stateStyle,supportingText,showCount) - Overview:
TextAreais the multi-line extension ofTextField— both share the same core API (stateStyle,supportingText,showCount, and more)
Usage Guidelines
DO
Use autoResize for dynamic content where height should grow with text. Provide maxLength with showCount for constrained inputs
Don’t
Don't use TextArea for single-line inputs — use TextField instead. Don't disable both resizable and autoResize simultaneously
Accessibility
- Label association via
<label htmlFor>+<textarea id> - Error feedback via
aria-invalid="true"+aria-describedbylinked to supporting text - Character count announced via
aria-live="polite"when approaching limit