callstack / callstack/react-native-paper

Weird UI behavior of Text Input with Dark Mode

Open
#3,122 14 comments 1 reaction 0 assignees View on GitHub
repro provided TextInput
Dominant language
TypeScript
Stars
14.5k
Forks
2.2k
Avg merge
5d 23h
Merged PRs (30d)
12

Description

### Current behaviour

With Dark Mode on, some Text Input outlined are ok, others with same code have a white line on the label.
![photo5879971770990180747](https://user-images.githubusercontent.com/30288622/158751699-fd016729-c370-4d06-9b77-54ef7ca59dd5.jpg)
![photo5879971770990180746](https://user-images.githubusercontent.com/30288622/158751706-9841bbc1-22b8-4e0d-a2bb-3547eca67a15.jpg)

The code is the same for "Nome Garage*" and "Email":
```
setGarageDoc({...garageDoc, name: text})}
/>
```
```
setGarageDoc({ ...garageDoc, email: text })}
/>
```

The started value is undefined for both, I tried to change the order, modify the style, change the label name with so many tries and I still can't understand what is causing this behaviour.

This behaviour is shared in all part of my application where there is a Text Input oulined.

### Expected behaviour

I'd expect to not have a white line on Text Input label outlined in dark mode.

### Code sample

```




setGarageDoc({...garageDoc, name: text})}
/>
setGarageDoc({ ...garageDoc, email: text })}
/>


```
### What have you tried

This behaviour is all
### Your Environment

| software | version
| --------------------- | -------
| ios or android | android
| react-native | 0..67.3
| react-native-paper | 4.11.2
| node | 14.x
| npm or yarn | yarn
| expo sdk | no

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.