callstack / callstack/react-native-paper

TextInput multiline on web should expand when entering long text

Abierto
#3,124 2 comentarios 3 reacciones 0 asignados Ver en GitHub
repro provided TextInput
Lenguaje dominante
TypeScript
Estrellas
14.5k
Forks
2.2k
Merge medio
5 d 23 h
PR fusionados (30 d)
12

Descripción

### 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)

Screenshot 2022-03-19 at 12 18 15

### What have you tried

Adapting the height through `onContentSizeChange`, however the textarea never shrinks in size when deleting text:
```javascript
const [height, setHeight] = useState(undefined)
{
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

Guía de contribución

Abrir la guía de contribución

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.