Skip to content
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

Remove validKeysDown, validKeysUp, passThroughAllKeyEvents #1615

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
59 changes: 1 addition & 58 deletions packages/react-native/Libraries/Components/Button.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,12 +12,7 @@

import type {TextStyleProp, ViewStyleProp} from '../StyleSheet/StyleSheet';
import type {PressEvent} from '../Types/CoreEventTypes';
import type {
BlurEvent,
FocusEvent,
HandledKeyEvent,
KeyEvent,
} from '../Types/CoreEventTypes'; // [macOS]
import type {BlurEvent, FocusEvent} from '../Types/CoreEventTypes'; // [macOS]
import type {
AccessibilityActionEvent,
AccessibilityActionInfo,
Expand Down Expand Up @@ -171,56 +166,6 @@ type ButtonProps = $ReadOnly<{|
*/
onFocus?: ?(e: FocusEvent) => void,

/**
* Handler to be called when a key down press is detected
*/
onKeyDown?: ?(e: KeyEvent) => void,

/**
* Handler to be called when a key up press is detected
*/
onKeyUp?: ?(e: KeyEvent) => void,

/*
* @deprecated use `keyDownEvents` or `keyUpEvents` instead
* Array of keys to receive key down events for
* For arrow keys, add "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown",
*/
validKeysDown?: ?Array<string>,

/*
* @deprecated use `keyDownEvents` or `keyUpEvents` instead
* Array of keys to receive key up events for
* For arrow keys, add "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown",
*/
validKeysUp?: ?Array<string>,

/**
* @deprecated use `keyDownEvents` or `keyUpEvents` instead
* When `true`, allows `onKeyDown` and `onKeyUp` to receive events not specified in
* `validKeysDown` and `validKeysUp`, respectively. Events matching `validKeysDown` and `validKeysUp`
* are still removed from the event queue, but the others are not.
*
* @platform macos
*/
passthroughAllKeyEvents?: ?boolean,

/**
* Array of keys to receive key down events for. These events have their default native behavior prevented.
* Overrides the props `validKeysDown`, `validKeysUp` and `passthroughAllKeyEvents`
*
* @platform macos
*/
keyDownEvents?: ?Array<HandledKeyEvent>,

/**
* Array of keys to receive key up events for. These events have their default native behavior prevented.
* Overrides the props `validKeysDown`, `validKeysUp` and `passthroughAllKeyEvents`
*
* @platform macos
*/
keyUpEvents?: ?Array<HandledKeyEvent>,

/*
* Specifies the Tooltip for the view
*/
Expand Down Expand Up @@ -402,8 +347,6 @@ const Button: React.AbstractComponent<
// [macOS
onFocus,
onBlur,
onKeyDown,
onKeyUp,
tooltip,
// macOS]
} = props;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -186,30 +186,6 @@ type Props = $ReadOnly<{|
*/
onKeyUp?: ?(event: KeyEvent) => void,

/**
* Array of keys to receive key down events for. These events have their default native behavior prevented.
*
* @platform macos
*/
validKeysDown?: ?Array<string | HandledKeyEvent>,

/**
* Array of keys to receive key up events for. These events have their default native behavior prevented.
*
* @platform macos
*/
validKeysUp?: ?Array<string | HandledKeyEvent>,

/**
* @deprecated use `keyDownEvents` or `keyUpEvents` instead
* When `true`, allows `onKeyDown` and `onKeyUp` to receive events not specified in
* `validKeysDown` and `validKeysUp`, respectively. Events matching `validKeysDown` and `validKeysUp`
* are still removed from the event queue, but the others are not.
*
* @platform macos
*/
passthroughAllKeyEvents?: ?boolean,

/**
* Array of keys to receive key down events for. These events have their default native behavior prevented.
* Overrides the props `validKeysDown`, `validKeysUp` and `passthroughAllKeyEvents`
Expand Down Expand Up @@ -377,7 +353,6 @@ function Pressable(
onBlur,
onKeyDown,
onKeyUp,
passthroughAllKeyEvents,
keyDownEvents,
keyUpEvents,
acceptsFirstMouse,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -49,9 +49,6 @@ const UIView = {
onDrop: true,
onKeyDown: true,
onKeyUp: true,
validKeysDown: true,
validKeysUp: true,
passthroughAllKeyEvents: true,
keyDownEvents: true,
keyUpEvents: true,
draggedTypes: true,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -137,11 +137,8 @@ export interface ViewPropsMacOS {
onDrop?: ((event: MouseEvent) => void) | undefined;
onKeyDown?: ((event: KeyEvent) => void) | undefined;
onKeyUp?: ((event: KeyEvent) => void) | undefined;
validKeysDown?: Array<HandledKeyEvent | string> | undefined;
validKeysUp?: Array<HandledKeyEvent | string> | undefined;
passthroughAllKeyEvents?: boolean | undefined;
keyDownEvents?: Array<HandledKeyEvent> | undefined;
keyUpEvents?: Array<HandledKeyEvent> | undefined;
keyDownEvents?: HandledKeyEvent[] | undefined;
keyUpEvents?: HandledKeyEvent[] | undefined;
draggedTypes?: DraggedTypesType | undefined;
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -111,30 +111,6 @@ export type KeyboardEventProps = $ReadOnly<{|
*/
onKeyUp?: ?(event: KeyEvent) => void,

/**
* Array of keys to receive key down events for. These events have their default native behavior prevented.
*
* @platform macos
*/
validKeysDown?: ?Array<string | HandledKeyEvent>,

/**
* Array of keys to receive key up events for. These events have their default native behavior prevented.
*
* @platform macos
*/
validKeysUp?: ?Array<string | HandledKeyEvent>,

/**
* @deprecated use `keyDownEvents` or `keyUpEvents` instead
* When `true`, allows `onKeyDown` and `onKeyUp` to receive events not specified in
* `validKeysDown` and `validKeysUp`, respectively. Events matching `validKeysDown` and `validKeysUp`
* are still removed from the event queue, but the others are not.
*
* @platform macos
*/
passthroughAllKeyEvents?: ?boolean,

/**
* Array of keys to receive key down events for. These events have their default native behavior prevented.
* Overrides the props `validKeysDown`, `validKeysUp` and `passthroughAllKeyEvents`
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -53,9 +53,6 @@ const validAttributesForNonEventProps = {
draggedTypes: true,
enableFocusRing: true,
tooltip: true,
validKeysDown: true,
validKeysUp: true,
passthroughAllKeyEvents: true,
keyDownEvents: true,
keyUpEvents: true,
mouseDownCanMoveWindow: true,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -101,11 +101,15 @@ export type PressabilityConfig = $ReadOnly<{|
// [macOS
/*
* Called after a key down event is detected.
*
* @platform macos
*/
onKeyDown?: ?(event: KeyEvent) => void,

/*
* Called after a key up event is detected.
*
* @platform macos
*/
onKeyUp?: ?(event: KeyEvent) => void,
// macOS]
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ NS_ASSUME_NONNULL_BEGIN
#if TARGET_OS_OSX // [macOS
- (BOOL)textInputShouldHandleDeleteForward:(id<RCTBackedTextInputViewProtocol>)sender; // Return `YES` to have the deleteForward event handled normally. Return `NO` to disallow it and handle it yourself.
- (BOOL)textInputShouldHandleKeyEvent:(NSEvent *)event; // Return `YES` to have the key event handled normally. Return `NO` to disallow it and handle it yourself.
- (BOOL)hasValidKeyDownOrValidKeyUp:(NSString *)key;
- (BOOL)hasKeyDownEventOrKeyUpEvent:(NSString *)key;
- (NSDragOperation)textInputDraggingEntered:(id<NSDraggingInfo>)draggingInfo;
- (void)textInputDraggingExited:(id<NSDraggingInfo>)draggingInfo;
- (BOOL)textInputShouldHandleDragOperation:(id<NSDraggingInfo>)draggingInfo;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -228,7 +228,7 @@ - (BOOL)control:(NSControl *)control textView:(NSTextView *)fieldEditor doComman
//escape
} else if (commandSelector == @selector(cancelOperation:)) {
[textInputDelegate textInputDidCancel];
if (![textInputDelegate hasValidKeyDownOrValidKeyUp:@"Escape"]) {
if (![textInputDelegate hasKeyDownEventOrKeyUpEvent:@"Escape"]) {
[[_backedTextInputView window] makeFirstResponder:nil];
}
commandHandled = YES;
Expand Down Expand Up @@ -450,7 +450,7 @@ - (BOOL)textView:(NSTextView *)textView doCommandBySelector:(SEL)commandSelector
//escape
} else if (commandSelector == @selector(cancelOperation:)) {
[textInputDelegate textInputDidCancel];
if (![textInputDelegate hasValidKeyDownOrValidKeyUp:@"Escape"]) {
if (![textInputDelegate hasKeyDownEventOrKeyUpEvent:@"Escape"]) {
[[_backedTextInputView window] makeFirstResponder:nil];
}
commandHandled = YES;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -740,9 +740,9 @@ - (BOOL)textInputShouldHandleDeleteForward:(__unused id)sender {
return YES;
}

- (BOOL)hasValidKeyDownOrValidKeyUp:(NSString *)key {
return [RCTHandledKey key:key matchesFilter:self.validKeysDown]
|| [RCTHandledKey key:key matchesFilter:self.validKeysUp];
- (BOOL)hasKeyDownEventOrKeyUpEvent:(NSString *)key {
return [RCTHandledKey key:key matchesFilter:self.keyDownEvents]
|| [RCTHandledKey key:key matchesFilter:self.keyUpEvents];
}

- (NSDragOperation)textInputDraggingEntered:(id<NSDraggingInfo>)draggingInfo
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -1706,13 +1706,6 @@ exports[`public API should not change unintentionally Libraries/Components/Butto
onAccessibilityAction?: ?(event: AccessibilityActionEvent) => mixed,
onBlur?: ?(e: BlurEvent) => void,
onFocus?: ?(e: FocusEvent) => void,
onKeyDown?: ?(e: KeyEvent) => void,
onKeyUp?: ?(e: KeyEvent) => void,
validKeysDown?: ?Array<string>,
validKeysUp?: ?Array<string>,
passthroughAllKeyEvents?: ?boolean,
keyDownEvents?: ?Array<HandledKeyEvent>,
keyUpEvents?: ?Array<HandledKeyEvent>,
tooltip?: string,
accessible?: ?boolean,
accessibilityActions?: ?$ReadOnlyArray<AccessibilityActionInfo>,
Expand Down Expand Up @@ -1875,9 +1868,6 @@ type Props = $ReadOnly<{|
onBlur?: ?(event: BlurEvent) => void,
onKeyDown?: ?(event: KeyEvent) => void,
onKeyUp?: ?(event: KeyEvent) => void,
validKeysDown?: ?Array<string | HandledKeyEvent>,
validKeysUp?: ?Array<string | HandledKeyEvent>,
passthroughAllKeyEvents?: ?boolean,
keyDownEvents?: ?Array<HandledKeyEvent>,
keyUpEvents?: ?Array<HandledKeyEvent>,
acceptsFirstMouse?: ?boolean,
Expand Down Expand Up @@ -3663,9 +3653,6 @@ exports[`public API should not change unintentionally Libraries/Components/View/
onDrop: true,
onKeyDown: true,
onKeyUp: true,
validKeysDown: true,
validKeysUp: true,
passthroughAllKeyEvents: true,
keyDownEvents: true,
keyUpEvents: true,
draggedTypes: true,
Expand Down Expand Up @@ -3855,9 +3842,6 @@ type DirectEventProps = $ReadOnly<{|
export type KeyboardEventProps = $ReadOnly<{|
onKeyDown?: ?(event: KeyEvent) => void,
onKeyUp?: ?(event: KeyEvent) => void,
validKeysDown?: ?Array<string | HandledKeyEvent>,
validKeysUp?: ?Array<string | HandledKeyEvent>,
passthroughAllKeyEvents?: ?boolean,
keyDownEvents?: ?Array<HandledKeyEvent>,
keyUpEvents?: ?Array<HandledKeyEvent>,
|}>;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -448,7 +448,7 @@ - (void)continuousSpellCheckingDidChange:(BOOL)enabled {}
- (void)grammarCheckingDidChange:(BOOL)enabled {}


- (BOOL)hasValidKeyDownOrValidKeyUp:(nonnull NSString *)key {
- (BOOL)hasKeyDownEventOrKeyUpEvent:(nonnull NSString *)key {
return YES;
}

Expand Down
2 changes: 1 addition & 1 deletion packages/react-native/React/Views/RCTHandledKey.h
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
#if TARGET_OS_OSX
#import <React/RCTConvert.h>

// This class is used for specifying key filtering e.g. for -[RCTView validKeysDown] and -[RCTView validKeysUp]
// This class is used for specifying key filtering e.g. for -[RCTView keyDownEvents] and -[RCTView keyUpEvents]
// Also see RCTViewKeyboardEvent, which is a React representation of an actual NSEvent that is dispatched to JS.
@interface RCTHandledKey : NSObject

Expand Down
8 changes: 1 addition & 7 deletions packages/react-native/React/Views/RCTHandledKey.m
Original file line number Diff line number Diff line change
Expand Up @@ -103,12 +103,6 @@ @implementation RCTConvert (RCTHandledKey)

+ (RCTHandledKey *)RCTHandledKey:(id)json
{
// legacy way of specifying validKeysDown and validKeysUp -- here we ignore the modifiers when comparing to the NSEvent
if ([json isKindOfClass:[NSString class]]) {
return [[RCTHandledKey alloc] initWithKey:(NSString *)json];
}

// modern way of specifying validKeys and validKeysUp -- here we assume missing modifiers to mean false\NO
if ([json isKindOfClass:[NSDictionary class]]) {
NSDictionary *dict = (NSDictionary *)json;
NSString *key = dict[@"key"];
Expand All @@ -122,7 +116,7 @@ + (RCTHandledKey *)RCTHandledKey:(id)json
for (NSString *key in modifiers) {
id value = dict[key];
if (value == nil) {
value = @NO; // assume NO -- instead of nil i.e. "don't care" unlike the string case above.
value = @(NO); // assume NO -- instead of nil i.e. "don't care" unlike the string case above.
}

if (![value isKindOfClass:[NSNumber class]]) {
Expand Down
6 changes: 3 additions & 3 deletions packages/react-native/React/Views/RCTView.h
Original file line number Diff line number Diff line change
Expand Up @@ -161,6 +161,7 @@ extern const UIAccessibilityTraits SwitchAccessibilityTrait;
/**
* macOS Properties
*/

@property (nonatomic, assign) CATransform3D transform3D;

// `allowsVibrancy` is readonly on NSView, so let's create a new property to make it assignable
Expand All @@ -171,11 +172,10 @@ extern const UIAccessibilityTraits SwitchAccessibilityTrait;
// NOTE does not properly work with single line text inputs (most key downs). This is because those are
// presumably handled by the window's field editor. To make it work, we'd need to look into providing
// a custom field editor for NSTextField controls.
@property (nonatomic, assign) BOOL passthroughAllKeyEvents;
@property (nonatomic, copy) RCTDirectEventBlock onKeyDown;
@property (nonatomic, copy) RCTDirectEventBlock onKeyUp;
@property (nonatomic, copy) NSArray<RCTHandledKey*> *validKeysDown;
@property (nonatomic, copy) NSArray<RCTHandledKey*> *validKeysUp;
@property (nonatomic, copy) NSArray<RCTHandledKey*> *keyDownEvents;
@property (nonatomic, copy) NSArray<RCTHandledKey*> *keyUpEvents;

// Shadow Properties
@property (nonatomic, strong) NSColor *shadowColor;
Expand Down
21 changes: 8 additions & 13 deletions packages/react-native/React/Views/RCTView.m
Original file line number Diff line number Diff line change
Expand Up @@ -1598,23 +1598,23 @@ - (BOOL)performDragOperation:(id <NSDraggingInfo>)sender

- (RCTViewKeyboardEvent*)keyboardEvent:(NSEvent*)event shouldBlock:(BOOL *)shouldBlock {
BOOL keyDown = event.type == NSEventTypeKeyDown;
NSArray<RCTHandledKey *> *validKeys = keyDown ? self.validKeysDown : self.validKeysUp;
NSArray<RCTHandledKey *> *keyEvents = keyDown ? self.keyDownEvents : self.keyUpEvents;

// If the view is focusable and the component didn't explicity set the validKeysDown or validKeysUp,
// If the view is focusable and the component didn't explicity set the keyDownEvents or keyUpEvents,
// allow enter/return and spacebar key events to mimic the behavior of native controls.
if (self.focusable && validKeys == nil) {
validKeys = @[
if (self.focusable && keyEvents == nil) {
keyEvents = @[
[[RCTHandledKey alloc] initWithKey:@"Enter"],
[[RCTHandledKey alloc] initWithKey:@" "]
];
}

// If a view specifies a key, it will always be removed from the responder chain (i.e. "handled")
*shouldBlock = [RCTHandledKey event:event matchesFilter:validKeys];
*shouldBlock = [RCTHandledKey event:event matchesFilter:keyEvents];

// If an event isn't being removed from the queue, but was requested to "passthrough" by a view,
// we want to be sure we dispatch it only once for that view. See note for GetEventDispatchStateDictionary.
if ([self passthroughAllKeyEvents] && !*shouldBlock) {
// If an event isn't being removed from the queue, we want to be sure we dispatch it
// only once for that view. See note for GetEventDispatchStateDictionary.
if (!*shouldBlock) {
NSNumber *tag = [self reactTag];
NSMutableDictionary<NSNumber *, NSNumber *> *dict = GetEventDispatchStateDictionary(event);

Expand All @@ -1625,11 +1625,6 @@ - (RCTViewKeyboardEvent*)keyboardEvent:(NSEvent*)event shouldBlock:(BOOL *)shoul
dict[tag] = @YES;
}

// Don't pass events we don't care about
if (![self passthroughAllKeyEvents] && !*shouldBlock) {
return nil;
}

return [RCTViewKeyboardEvent keyEventFromEvent:event reactTag:self.reactTag];
}

Expand Down
Loading
Loading