[Bug]: TextArea shows scrollbar when resized to its minimum height

[davidbmaier]

Package

@carbon/react

Browser

Chrome

Package version

v1.71.0

React version

v18.2.0

Description

When resizing a textarea to its smallest allowed height (40px), it shows a small scrollbar on the right of the element even though the text inside is centered without any visible overflow.

This scrollbar only appears in Chrome/Edge - in Firefox no scrollbar is visible, but I can still scroll up and down a little inside the textarea with my scrollwheel.

I would expect the minimum allowed size to perfectly fit one row of text (which is especially useful when aligning it with other input/select elements that are also 40px tall) without any scrollbars.

Reproduction/example

https://react.carbondesignsystem.com/?path=/story/components-textarea--playground

Steps to reproduce

1. Open the storybook page in Chrome or Edge.
2. Use the resize handle to make the textarea's height as small as possible.
3. Observe the textarea getting a small scrollbar on the right that lets you move the content around even though it's just a single line of text.

Suggested Severity

None

Application/PAL

CP4AIOps

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate problems