[Text Area] Add support for "auto-height" - expanding height as needed based on input length.

[macandcheese]

Check existing issues

• I have checked for existing issues to avoid duplicates

Description

Currently, the Text Area height can only be controlled with min / max height css properties. There are many use cases where there is a need to increase the size of the Text Area, to grow along with user entry.

Acceptance Criteria

I'd like a configuration option for the component to handle this. I'd expect the component, in this mode, to still abide by the min and max height css properties, if set. So - for instance, it would increase in size as the user enters content, until it reaches the specified max height, after which it would scroll.

Relevant Info

No response

Which Component

Text Area

Example Use Case

Screen.Recording.2025-03-05.at.1.49.50.PM.mov

The above is a pretty fragile implementation on the user-side - using some magic numbers for expected character width and number of characters per line... but it illustrates the desired design more or less.

Priority impact

impact - p2 - want for an upcoming milestone

Calcite package

• @esri/calcite-components
• @esri/calcite-components-react
• @esri/calcite-design-tokens
• @esri/calcite-ui-icons
• @esri/eslint-plugin-calcite-components

Esri team

Calcite (design)