callstack / callstack/react-native-paper

TextInput mode=outline label animation was initially offset

Abierto
#4,556 3 comentarios 0 reacciones 0 asignados Ver en GitHub
bug 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
After the page/screen loads, when the TextInput mode=outline has a value, the label is initially positioned at the right which results in overlapping with the outline, then does a sliding animation to the left.

![Image](https://github.com/user-attachments/assets/0519798e-5709-40ba-b4b8-8982771c8eba)

See video:
https://github.com/user-attachments/assets/202e3c1e-3b1a-4314-900a-83d2f6e47d0f

### Expected behaviour
No sliding animation like in V4.

### How to reproduce?
a simple: ` `

"No Loops", just plain render of multiple ``

I also created a [Snack sample](https://snack.expo.dev/dczmwbv0Sg2ptnF44p4Qo)

### Preview

### What have you tried so far?
the v4 seems fine, but doesn't support MD3.

### Your Environment

| software | version
| --------------------- | -------
| react-native | 0.74.5
| react-native-paper | 5.12.5
| node | 18.20.5
| npm or yarn | npm@10.8.2
| expo sdk | 51.0.28

Guía de contribución

Abrir la guía de contribución

Línea de trabajo

Start at the TextInput implementation and reproduce the outlined input case from the linked Snack or the provided value and label. Check the initial label positioning and its transition on render; done means a populated mode="outlined" TextInput appears in its final position without a sliding animation.

Escrito por el modelo de indexación a partir del texto del issue.

Evaluación

Stack tecnológico
react-native, typescript
Área
frontend, mobile
Tipo de issue
Error
Dificultad
3/5
Tiempo estimado
1-2 días
Estado de actividad
Estancado
Claridad
Bastante claro
Aptitud para principiantes
48/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.