callstack / callstack/react-native-paper
bug: outlined TextInput labels resizing with imperatively set value
- 主要语言
- TypeScript
- 星标
- 14.5k
- 派生
- 2.2k
- 平均合并
- 5 天 23 小时
- 30 天内合并 PR
- 12
描述
### Current behaviour
There is a visual bug introduced in [5.11.0](https://github.com/callstack/react-native-paper/compare/v5.10.6...v5.11.0) related to the`outlined` styled `TextInput` that is causing inputs with their values set imperatively, either via `defaultValue` or `value` render the label and then snap to the left margin.
https://github.com/callstack/react-native-paper/assets/5914225/408f84ae-38e5-4364-bc03-0144d31ef09b
### Expected behaviour
Prior to 5.11.0, labels rendered in the expected position.
https://github.com/callstack/react-native-paper/assets/5914225/fff05db6-9270-4533-83c5-6985c27e37b7
### How to reproduce?
Added a `TextInput` components with `mode="outlined"` and an imperatively set value. `value` and `defaultValue` will both result in the behavior. Expect the input to display the label snapping behavior on initial render.
``
### Preview
- Video examples above
### What have you tried so far?
- [Expo Snack](https://snack.expo.dev/@awalker00/outlined-input-label)
### Your Environment
| software | version
| --------------------- | -------
| ios | 16, 17
| android | 32, 33
| react-native | 0.71, 0.72
| react-native-paper | 5.11.x
| node | 18.7.0
| npm or yarn | npm
| expo sdk | 49.0.0
贡献指南
调研方向
首先,使用提供的 outlined TextInput 代码片段,分别通过 value 和 defaultValue 重现该问题,然后比较 react-native-paper 5.10.6 与 5.11.x 之间的行为。跟踪 outlined TextInput 的实现,并验证在列出的 iOS 和 Android 环境中,标签在初始渲染时仍保持在预期位置。
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- react-native, typescript
- 领域
- mobile
- Issue 类型
- 缺陷
- 难度
- 3/5
- 预计耗时
- 1-2 天
- 活跃度
- 停滞
- 描述清晰度
- 基本清楚
- 新手友好度
- 48/100