TextInput multiline on web should expand when entering long text

[raphaelmerx]

Current behaviour

A multiline TextInput element expands to adapt to text content on mobile, but it doesn't on web. Instead a scrollbar appears inside the textarea

Expected behaviour

TextInput expands on web to adapt to text length, like it does on mobile. This is expected under the material guidelines: https://material.io/archive/guidelines/components/text-fields.html#text-fields-field-types

Code sample

https://snack.expo.dev/@raphaelmerx/textinput

Screenshots (if applicable)

What have you tried

Adapting the height through onContentSizeChange, however the textarea never shrinks in size when deleting text:

const [height, setHeight] = useState(undefined)
    <TextInput
	multiline={true}
	onContentSizeChange={(event) => {
		setHeight(event.nativeEvent.contentSize.height)
	}}
	style={{ height }} 
    />

Your Environment

software	version
ios or android	web
react-native	0.64.3
react-native-paper	4.11.2
node	v14.18.1
npm or yarn	yarn
expo sdk	43

[github-actions[bot]]

Couldn't find version numbers for the following packages in the issue:

• react-native-vector-icons
• npm
• yarn
• expo

Can you update the issue to include version numbers for those packages? The version numbers must match the format 1.2.3.

The versions mentioned in the issue for the following packages differ from the latest versions on npm:

• react-native (found: 0.64.3, latest: 0.67.4)

Can you verify that the issue still exists after upgrading to the latest versions of these packages?

[CodingItWrong]

I am experiencing this issue with the following versions (adding the missing version numbers from above):

software	version
ios or android	web
react-native	0.70.5
react-native-paper	5.1.3
node	16.19.0
npm or yarn	yarn
npm	9.2.0
yarn	1.22.19
expo sdk	47.0.13
react-native-vector-icons	does not appear in package.json or yarn.lock

Would love to see this fixed for consistency in my app across web and mobile!