equinor / design-system

The Equinor design system
MIT License
121 stars 64 forks source link

Textfield multilines interaction #1155

Closed mimarz closed 2 years ago

mimarz commented 3 years ago

Currently, when using Textfield as multiline, its resize-able to any size. With new updates to Textfield in #1152, the handle for resizing an Textfield is off-set as we changed the approach for adornments.

Currently we just suggest that setting style={{resize:none}} and applying setting rows to a value for fixing this visually.

Having our users remember to set style={{resize:none}} on every Textfield that is multiline can be cumbersome

Shoudl we maybe set resize as default to none (with a default number of rows) when multiline is set? This will make it easier for our users to use, and maybe better in terms of ux aswell? Downside of this would be that users can resize the Textfield manually, but maybe they shouldn't either.

Material-ui does not allow resizing on Textfield: https://material-ui.com/components/text-fields/#multiline

akvam commented 2 years ago

Need a discussion on

mimarz commented 2 years ago

After marinating on this we suggest disabling the option for our users to resize (add resize:none; internally) as this is visually better, avoids unwanted behaviour with manual resize "flick".

Most component libraries including mui and mantine have also disabled the option for manual resize.

mimarz commented 2 years ago

We have decided to disable resize as its provides better UX and UI because users cant freely resize the textarea and break layout.