TextArea
Anatomy
How to use
When to use
- Use the Text Area component when users need to input or edit multi-line text, such as comments, descriptions, or messages.
- Use it when you expect users to enter longer passages of text that may exceed the length of a single line input field.
When not to use
- Avoid using the Text Area component for single-line inputs, such as names or email addresses, where a single-line input field is more appropriate.
- Avoid using it for inputs with fixed or limited length text, as it may encourage excessive user input.
Consider to use in alternative
- For short, single-line inputs, consider using the Text Input component.
- For inputs requiring structured data, consider using specialized components like Date Picker or Select Menu.
Accessibility
- Ensure the Text Area component is keyboard accessible, allowing users to navigate, select, and edit text using only keyboard inputs.
- Implement proper labeling using
<label>elements to associate the Text Area with its purpose, enhancing screen reader usability. - Provide clear and concise instructions or hints within or near the Text Area to assist users in understanding its purpose and expected input format.