Resizable text area?

<vaadin-text-area> contains a <textarea>, but this has been set to resize:none.
When I try to enable it, it doesn’t play well with the parent <vaadin-text-area>

Resizable text area is something that I expect in 2024. Can it be done within a web component, or do I have to use the native element and lose the vaadin goodies?

There is a Cookbook recipe: How do I enable users to resize components - Vaadin Cookbook. If memory serves this solution also comes with its own weirdness, though, so thorough testing is advisable.

Well, that was easy. Thanks :grinning:
I see that visually it is a bit off, but it is better than not being able to resize:

This is how it looks on a plain <textarea>
image

And here is <vaadin-text-area>:
image

I’ll try it out

The logic in not having text-area resizable is that the field will grow in height as you enter text unless a fixed height is defined. You can also combine that with min and max heights.

Does your use case really require resizing?

That is an open question. For now I’m just surprised that Vaadin has opted to disable a standard browser behavior, and I’m happy it was so easy to enable it again, even if it looks a bit off.

If it breaks anything we might reconsider, but until then I don’t see why I should limit what the user can do.

Personally, whenever I encounter an input form on the web, I appreciate the option to resize its textareas, and more generally; It annoys me when I’m forced to enter data in a tiny area on my huge screen.