Skip to content

[WC-3215]: fix(atlas-core): use --suggested-height CSS variable for textarea auto-grow [v3] - #337

Open
r0b1n wants to merge 1 commit into
lts/mx/9.24from
fix/textarea-suggested-height-lts
Open

r0b1n wants to merge 1 commit into
lts/mx/9.24from
fix/textarea-suggested-height-lts

Conversation

@r0b1n

@r0b1n r0b1n commented Sep 15, 2026

Copy link
Copy Markdown
Contributor

Problem

The auto-grow textarea library controls height via an inline height: <value>!important style, which prevents customers from overriding textarea height in their own stylesheets.

Solution

The library is patched (via npm patch) to set a CSS custom property instead:

// before
node.style.setProperty('height', height + 'px', 'important');
// after
node.style.setProperty('--suggested-height', height + 'px');

This PR adds the Atlas CSS side of the fix:

.mx-textarea textarea.form-control {
    min-height: var(--suggested-height);
}

Why this approach

  • min-height not height — preserves grow-automatically behavior; the textarea can still expand beyond the suggested height.
  • Scoped to .mx-textarea — only affects the Mendix textarea widget, not any other widget using textarea.form-control.
  • Backwards compatible — when --suggested-height is not set (projects without the library patch), min-height resolves to its initial value and has no effect.
  • Customer override — customers can set min-height: 0 or any value on .mx-textarea textarea to fully opt out.

Backport of #336 to lts/mx/9.24 (Atlas 3).

Test plan

  • Textarea with Grow automatically = ON: verify it still grows as user types
  • Textarea with Grow automatically = OFF: verify it renders at the configured row height
  • Customer override: verify setting min-height in custom CSS takes effect

…o-grow

Replace the library's inline height!important with a CSS variable approach.
The auto-grow library now sets --suggested-height on the textarea node; Atlas
picks it up via min-height so customers can override sizing in their own styles
without fighting inline !important declarations.
@r0b1n r0b1n changed the title fix(atlas-core): use --suggested-height CSS variable for textarea auto-grow fix(atlas-core): use --suggested-height CSS variable for textarea auto-grow [v3] Sep 15, 2026
@r0b1n r0b1n changed the title fix(atlas-core): use --suggested-height CSS variable for textarea auto-grow [v3] [WC-3215]: fix(atlas-core): use --suggested-height CSS variable for textarea auto-grow [v3] Sep 15, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant