Update to support horizontal overflow

[chrisdrackett]

This is useful for textarea elements that contain code, but with line lengths greater than the textarea's width

[Andarist]

hey @chrisdrackett , is original behaviour preserved after ur change? Did u test it doesnt break any other assumptions? Would like to incorporate your fix, but with such changes we need to be cautious. Do u use ur fork in ur projects and everything is working like expected?

[chrisdrackett]

@Andarist I missed your note somehow, sorry about that. We are using this fork in our project without any issues. I did test this with our use of the package, but I'm not sure if I'm running the same tests that others are!

[Andarist]

@chrisdrackett Could u showcase ur use case on smth like codesandbox.io? I could then experiment with ur use case and some other ones - unfortunately this package has no tests 😭 so I'm really cautious about introducing changes, especially related to those particular properties lists as they seem fragile.

[jangxyz]

I'm a few years behind, but I came up with a similar problem.

demo: simply copy & paste the url to the demo page.

I see that the code has changed a bit since, so we can't just merge the PR right away.

I'm curious whether solving this issue is still of interest?

OBS. It's 100% coincidence that the original author and I have a similar avatar

[Andarist]

From the given screenshot im not sure what the problem is. Could u describe it?

[jangxyz]

I'd expect the textarea to resize in accordance with word wrapping as well, so having a single long line of text wouldn't create any vertical scroll bars.

[Andarist]

Well, you don't have a horizontal overflow there - you get a vertical scrollbar. And this is expected as this particular textarea has maxRows set to 3:

react-textarea-autosize/example/index.tsx

Line 11 in 58c9807

maxRows={3}

[jangxyz]

You're right. Sorry I didn't check the source for other props.

For some reason I do keep encountering vertical sidebars, especially when I work with long urls. That's how I reached here in the first place.
Not sure what the exact reason is though (yet). I'll try to come up with a more evident example next time.

[chrisdrackett]

I don't have an example at this time as I ended up just moving to react-expanding-textarea some time ago. I know it was partially due to this issue that I moved, but its been so long as this point that I don't remember any of the details. I think this PR is still valid, as I do remember it fixed some of the style issues we were having with this library, but as I no longer have skin in the game I understand and have no issues if it needs to be closed!

[piotrkulpinski]

Any chance for this PR to still be merged?

I'm using this lib for a custom code input and the calculated height is incorrect when I set white-space: pre;.

[piotrkulpinski]

Actually, I don't think this will work as the PR adds white-space: pre; to every field, instead of checking the original textarea style.