forked from facebook/react-native
-
Notifications
You must be signed in to change notification settings - Fork 145
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Deprecate onScrollKeyDown, refactor Flatlist selection logic #1365
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
065c195
to
51956aa
Compare
remove pressable diff Remove JS handling for PageUp/Down, fix flow errors Add back "autoscroll to focused view" behavior remove commented code remove change to pressable Update documentation fix flow error fix lint issue Fix 'selectRowAtIndex' More simplification lock
51956aa
to
53ac25d
Compare
One more request from the feature team: they would like to not have the first row selected by default. I'll add an "initialSelectedIndex' prop like the existing 'initialScrollIndex' and let it be set to |
4 tasks
harrieshin
reviewed
Aug 24, 2022
harrieshin
approved these changes
Aug 24, 2022
Saadnajmi
added a commit
to Saadnajmi/react-native-macos
that referenced
this pull request
Aug 25, 2022
…ft#1365) * Deprecate onScrollKeyDown remove pressable diff Remove JS handling for PageUp/Down, fix flow errors Add back "autoscroll to focused view" behavior remove commented code remove change to pressable Update documentation fix flow error fix lint issue Fix 'selectRowAtIndex' More simplification lock * Make method public again * Add initialSelectedIndex * macOS tags * fix lint
4 tasks
Saadnajmi
added a commit
to Saadnajmi/react-native-macos
that referenced
this pull request
Aug 25, 2022
…ft#1365) * Deprecate onScrollKeyDown remove pressable diff Remove JS handling for PageUp/Down, fix flow errors Add back "autoscroll to focused view" behavior remove commented code remove change to pressable Update documentation fix flow error fix lint issue Fix 'selectRowAtIndex' More simplification lock * Make method public again * Add initialSelectedIndex * macOS tags * fix lint
4 tasks
Saadnajmi
added a commit
that referenced
this pull request
Aug 25, 2022
…1374) * Refactor handling of keyDown/keyUp (#1338) This refactors / simplifies certain keyUp|Down event handling. It will make a later change (adding textInput handling for textInput fields) easier (to review) Co-authored-by: Scott Kyle <[email protected]> * Deprecate onScrollKeyDown, refactor Flatlist selection logic (#1365) * Deprecate onScrollKeyDown remove pressable diff Remove JS handling for PageUp/Down, fix flow errors Add back "autoscroll to focused view" behavior remove commented code remove change to pressable Update documentation fix flow error fix lint issue Fix 'selectRowAtIndex' More simplification lock * Make method public again * Add initialSelectedIndex * macOS tags * fix lint * RNTester: only show the Flatlist keyboard navigation switch on macOS Co-authored-by: Christoph Purrer <[email protected]> Co-authored-by: Scott Kyle <[email protected]>
Saadnajmi
added a commit
that referenced
this pull request
Aug 26, 2022
…1375) * Revert "Revert Flatlist changes (#1306)" This reverts commit 8ce9545. * Refactor handling of keyDown/keyUp (#1338) This refactors / simplifies certain keyUp|Down event handling. It will make a later change (adding textInput handling for textInput fields) easier (to review) Co-authored-by: Scott Kyle <[email protected]> * Deprecate onScrollKeyDown, refactor Flatlist selection logic (#1365) * Deprecate onScrollKeyDown remove pressable diff Remove JS handling for PageUp/Down, fix flow errors Add back "autoscroll to focused view" behavior remove commented code remove change to pressable Update documentation fix flow error fix lint issue Fix 'selectRowAtIndex' More simplification lock * Make method public again * Add initialSelectedIndex * macOS tags * fix lint * remove one more reference * yarn lint --fix * RNTester: only show the Flatlist keyboard navigation switch on macOS Co-authored-by: Christoph Purrer <[email protected]> Co-authored-by: Scott Kyle <[email protected]>
shwanton
pushed a commit
to shwanton/react-native-macos
that referenced
this pull request
Feb 13, 2023
…ft#1365) * Deprecate onScrollKeyDown remove pressable diff Remove JS handling for PageUp/Down, fix flow errors Add back "autoscroll to focused view" behavior remove commented code remove change to pressable Update documentation fix flow error fix lint issue Fix 'selectRowAtIndex' More simplification lock * Make method public again * Add initialSelectedIndex * macOS tags * fix lint
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Please select one of the following
Summary
Closes #501
With #1258 , #1267, and (for posterity) #1270 , we "revived" the Flatlist prop
enableSelectionOnKeyPress
. This would add some custom keyboard handling to Flatlist allowing you to move through the list with arrow keys and keyboard shortcuts, and "select" a row. The prop was meant to be opt-in, meaning if it was off, then Flatlist would do no keyboard handling and let all keyboard events bubble as usual. We did this by setting a prop on the Flatlists' inner RCTScrollView:onScrollKeyDown
. When that is set, RCTScrollView will handle some keyboard events (ArrowUp, ArrowDown, PageUp, PageDown, Home, End) instead of letting them bubble up through the native hierarchy. One thing to note:onScrollKeyDown
has been marked for deprecation for a while now, since it doesn't conform to the agreed-upon RN keyboarding API that the desktop platforms set.As it turns out,
enableSelectionOnKeyPress
wasn't truly opt-in. As it was written, RCTScrollView would always block those keyboard events natively, regardless of whether the prop was set or not. This caused some bugs where come keyboard events stopped getting handled for our partner teams.How do we fix this? I chose to scrap the custom implementation of
onScrollKeyDown
altogether, and just implement that standardonKeyDown / validKeysDown
API that React Native macOS has on RCTView. This is aided by the refactor done in #1338 , which made it much easier to share the keyboarding API :) With this new API, we can conditionally passvalidKeysDown
based on whetherenableSelectionOnKeyPress
is set, and make the prop truly opt in.Changelog
[macOS] [Fixed] - Deprecate onScrollKeyDown
Test Plan
I have an (ugly..) example a View inside each FlatList row that captures ArrowUp and ArrowDown. With and without the
enableSelectionOnKeyPress
prop set, the view can still capture the arrow keys. I don't really want to commit this example, because it's ugly...Screen.Recording.2022-08-24.at.1.14.09.AM.mov