Height and width of text-area with max-length change with validity changes

[nwhittaker]

Check existing issues

• I have checked for existing issues to avoid duplicates

Actual Behavior

Given a <calcite-text-area> element with max-length and validation-message attributes defined, toggling the element's status between valid and invalid shrinks its width and causes the height of the textarea to ever increase.

Screen.Recording.2025-02-19.at.3.49.23.PM.mov

Expected Behavior

The textarea's height and width do not change in response to status changes.

Reproduction Sample

https://codepen.io/nwhittaker-esri/pen/MYWKPZo

Reproduction Steps

1. Visit the repro and enter a value into the text-area.
2. Clear the value and see the text-area dimensions change and an error message appears.
3. Re-enter the value and see the error message disappears.
4. Re-clear the value and see the text-area's height increases and the error message reappears.
5. Repeat from step 3.

Reproduction Version

3.0.2

Relevant Info

Possibly related to #8456.

Regression?

No response

Priority impact

impact - p2 - want for an upcoming milestone

Impact

A workaround for the likeliest use-case is to enable the limit-text attribute, however this will not work for preventing other validity errors from triggering the bug.

Calcite package

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

Esri team

ArcGIS Field Apps