Implement keyboard, gamepad invocation for RN-JS components

[ahimberg]

We only have mouse support today, and as you focus something pressing space/enter doesn't press a touchable, for example.

Scope:

• This work item tracks support for keyboard invocation of RN-JS components. Non-JS components mapping to native will automatically work with keyboard as intended in native UWP control behavior.
• Add Keyboard events #2469 is a precursor to this work - will need keyboarding events and routing/bubbling, threading model issues figured out before this can be implemented.
• Ensuring keyboard focus/tabbing works with appropriate focus visuals for all RN components is being tracked by Improved keyboarding behaviors for lists  #2107
• Ensuring 2d navigation using Arrow keys/Gamepad works is being tracked by Enable XYFocus behavior #2197
• FlatList and SectionList items are typically TouchableXX and hence invoking items will automatically light up once the work is done for TouchableXX. More advanced keyboarding/gamepad navigation for these JS list components like arrow-through, space for selecting items etc., can be tracked as separate issues.

Details:
Following is a list of Components that users should be able to invoke with keyboard, and which key(s) the component should respond to.

P1:

• Button - Space - onPress event fired
• Button - Enter - onPress event fired
• Button - Gamepad-A - onPress event fired
• TouchableHighlight - Space - onPress event fired
• TouchableHighlight - Enter - onPress event fired
• TouchableHighlight - Gamepad-A - onPress event fired
• TouchableOpacity - Space - onPress event fired
• TouchableOpacity - Enter - onPress event fired
• TouchableOpacity - Gamepad-A - onPress event fired
• [ ] FlatList - select items with Space - selected event on item fired
• [ ] FlatList - invoke items with Enter - onPressItem event on item fired

P2:

• [ ] SectionList - select items with Space - selected event on item fired
• [ ] SectionList - select items with Enter - onPressItem event on item fired

Implementation notes:

• The work here is to consume onKeyDown/onKeyUp events in these JS components and fire the appropriate events.
• [Gamepad] Cannot invoke TouchableHighlight or TouchableOpacity content #2182 may be solved once this is implemented. Please verify using gamepad before closing this.
• Once TouchableXX has this implemented, everything else will likely be getting it for free.
• The implementation on Button in vNext today handles this as an implementation on the specific JS component itself and introduces no new APIs using a declarative model on the JS side. Will need to redo the Button implementation here once the Key events have been implemented.
• The implementation can be done in Button.JS, TouchableXX.JS instead of forking/creating a ButtonWindows.Js component etc., since there is no new API as part of this work item.

Open questions:

• Keyboard events story needs to be figured out before we do this work. **Blocked by Add Keyboard events #2469 **
• Where is this going to be implemented? Fork Button.JS and implement this and then push the work back into react-native?
• Should we instead introduce a new WindowsFocusable API where this is implemented/proven out and then add it to touchable, button etc., ?

[kmelmon]

Touch base with Alicia Drummond who worked on this in win32