callstack / callstack/react-native-paper
Opening a Menu from a TextInput anchor on the web unfocuses the anchor
- Dominant language
- TypeScript
- Stars
- 14.5k
- Forks
- 2.2k
- Avg merge
- 5d 23h
- Merged PRs (30d)
- 12
Description
### Current behaviour
When a Menu has a TextInput as an anchor, if that input's onFocus is used to open the menu, it becomes unfocused.
### Expected behaviour
This is not consistent with Android, where it keeps focus. It would be nice if it worked this way on the web too, so that a searchable dropdown can be implemented.
### Code sample
https://snack.expo.dev/@pta2002/eb79e2
### What have you tried
I have tried using a separate component (not the anchor) to trigger the menu, but it got unfocused as well. Either way, I think the behaviour should at least be consistent.
### Your Environment
| software | version
| --------------------- | -------
| ios or android | Android 11
| react-native | 0.63.2
| react-native-paper | 4.9.2
| node | 14.17.6
| npm or yarn | npm 6.14.15
| expo sdk | 42.0.1
Contributor guide
Research direction
Start with the linked Expo Snack and reproduce the focus loss when a Menu is opened from a TextInput on the web. Then trace the Menu anchor and focus behavior, compare it with Android, and verify that a searchable dropdown keeps the TextInput focused on the web.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native, typescript
- Domain
- frontend, mobile
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100