You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Is your feature request related to a problem? Please describe.
A user asked for the ability to resize TextArea elements because they were to small.
So naturally I looked into adding the styling resize: vertical to no awail.
Is there a good way to make TextArea resizeable that I am missing? I would love to hear about it. If not, this is something that could be added sometime.
Describe the solution you'd like
I would like it if there was a option for the height of the TextArea component could dynamically be set. Depending on the lines added to the TextArea.
I would like to be able to set resize: vertical styling on the TextArea component or have the wrap textarea attribute exposed so that I could manipulate the height dynamically with the rows prop.
Alternatively You could also set a part attribute to make us able to do some of these changes our self. Or expose a ref as they have done with EDS-components so that we can manipulate some of these more specific stuff.
Describe alternatives you've considered
Because of the way the TextArea component is built as a shadow dom element this is impossible. So I tried a few different solutions to this but nothing really worked the way I wanted it to. I tried to manipulate the rows prop with a regex matcher so the textarea auto expands with line breaks. But that won't work when line break happens because of string length. It would have worked if the wrap attribute was exposed as a prop so I could set wrap: hard and force line breaks on line end.
I tried to make it work with eds-components. But there was another issue, resize: none was hardcoded into style on the component. however, in this case there is a ref exposed so I could manipulate the style attribute with a useEffect. But this brings another issue where the styling of the inputs are so different between fusion-react-components and eds-components that I would either have to create a wrapper component for eds-components and recreate the styling of the fusion-react-textarea component or change all input fields in the app to be eds-components. Neither option is really something I want to do.
I even tested the old fusion-components TextArea, here it seems like it is actually auto expanding depending on how much text is here. But, as far as I am aware: We shouldn't use this library.
The text was updated successfully, but these errors were encountered:
Is your feature request related to a problem? Please describe.
A user asked for the ability to resize TextArea elements because they were to small.
So naturally I looked into adding the styling resize: vertical to no awail.
Is there a good way to make TextArea resizeable that I am missing? I would love to hear about it. If not, this is something that could be added sometime.
Describe the solution you'd like
I would like it if there was a option for the height of the TextArea component could dynamically be set. Depending on the lines added to the TextArea.
I would like to be able to set resize: vertical styling on the TextArea component or have the wrap textarea attribute exposed so that I could manipulate the height dynamically with the rows prop.
Alternatively You could also set a part attribute to make us able to do some of these changes our self. Or expose a ref as they have done with EDS-components so that we can manipulate some of these more specific stuff.
Describe alternatives you've considered
Because of the way the TextArea component is built as a shadow dom element this is impossible. So I tried a few different solutions to this but nothing really worked the way I wanted it to. I tried to manipulate the rows prop with a regex matcher so the textarea auto expands with line breaks. But that won't work when line break happens because of string length. It would have worked if the wrap attribute was exposed as a prop so I could set wrap: hard and force line breaks on line end.
I tried to make it work with eds-components. But there was another issue, resize: none was hardcoded into style on the component. however, in this case there is a ref exposed so I could manipulate the style attribute with a useEffect. But this brings another issue where the styling of the inputs are so different between fusion-react-components and eds-components that I would either have to create a wrapper component for eds-components and recreate the styling of the fusion-react-textarea component or change all input fields in the app to be eds-components. Neither option is really something I want to do.
I even tested the old fusion-components TextArea, here it seems like it is actually auto expanding depending on how much text is here. But, as far as I am aware: We shouldn't use this library.
The text was updated successfully, but these errors were encountered: