Remove validKeysDown, validKeysUp, passThroughAllKeyEvents

Saadnajmi · Saadnajmi · commit 38371f224ed6 · 2024-08-22T17:47:25.000-07:00
diff --git a/packages/react-native/Libraries/Components/Button.js b/packages/react-native/Libraries/Components/Button.js
@@ -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,
@@ -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
    */
@@ -396,8 +341,6 @@ const Button: React.AbstractComponent<ButtonProps> = (props: ButtonProps) => {
     // [macOS
     onFocus,
     onBlur,
-    onKeyDown,
-    onKeyUp,
     tooltip,
     // macOS]
   } = props;
diff --git a/packages/react-native/Libraries/Components/Pressable/Pressable.js b/packages/react-native/Libraries/Components/Pressable/Pressable.js
@@ -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`
@@ -374,7 +350,6 @@ function Pressable(props: Props, forwardedRef): React.Node {
     onBlur,
     onKeyDown,
     onKeyUp,
-    passthroughAllKeyEvents,
     keyDownEvents,
     keyUpEvents,
     acceptsFirstMouse,
diff --git a/packages/react-native/Libraries/Components/Touchable/TouchableWithoutFeedback.js b/packages/react-native/Libraries/Components/Touchable/TouchableWithoutFeedback.js
@@ -19,7 +19,6 @@ import type {EdgeInsetsOrSizeProp} from '../../StyleSheet/EdgeInsetsPropType';
 import type {
   BlurEvent,
   FocusEvent,
-  KeyEvent,
   LayoutEvent,
   MouseEvent,
   PressEvent,
diff --git a/packages/react-native/Libraries/Components/View/ReactNativeViewAttributes.js b/packages/react-native/Libraries/Components/View/ReactNativeViewAttributes.js
@@ -48,9 +48,6 @@ const UIView = {
   onDrop: true,
   onKeyDown: true,
   onKeyUp: true,
-  validKeysDown: true,
-  validKeysUp: true,
-  passthroughAllKeyEvents: true,
   keyDownEvents: true,
   keyUpEvents: true,
   draggedTypes: true,
diff --git a/packages/react-native/Libraries/Components/View/ViewPropTypes.d.ts b/packages/react-native/Libraries/Components/View/ViewPropTypes.d.ts
@@ -167,6 +167,14 @@ export interface ViewPropsAndroid {
 export type DraggedType = 'fileUrl';
 export type DraggedTypesType = DraggedType | DraggedType[];
 
+export type HandledKeyEvent = {
+  altKey?: boolean | undefined;
+  ctrlKey?: boolean | undefined;
+  metaKey?: boolean | undefined;
+  shiftKey?: boolean | undefined;
+  key: string;
+};
+
 export interface ViewPropsMacOS {
   acceptsFirstMouse?: boolean | undefined;
   allowsVibrancy?: boolean | undefined;
@@ -179,11 +187,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;
 }
 
diff --git a/packages/react-native/Libraries/Components/View/ViewPropTypes.js b/packages/react-native/Libraries/Components/View/ViewPropTypes.js
@@ -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`
diff --git a/packages/react-native/Libraries/NativeComponent/BaseViewConfig.macos.js b/packages/react-native/Libraries/NativeComponent/BaseViewConfig.macos.js
@@ -53,9 +53,6 @@ const validAttributesForNonEventProps = {
   draggedTypes: true,
   enableFocusRing: true,
   tooltip: true,
-  validKeysDown: true,
-  validKeysUp: true,
-  passthroughAllKeyEvents: true,
   keyDownEvents: true,
   keyUpEvents: true,
   mouseDownCanMoveWindow: true,
diff --git a/packages/react-native/Libraries/Pressability/Pressability.js b/packages/react-native/Libraries/Pressability/Pressability.js
@@ -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]
diff --git a/packages/react-native/Libraries/Text/TextInput/RCTBackedTextInputDelegate.h b/packages/react-native/Libraries/Text/TextInput/RCTBackedTextInputDelegate.h
@@ -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;
diff --git a/packages/react-native/Libraries/Text/TextInput/RCTBackedTextInputDelegateAdapter.mm b/packages/react-native/Libraries/Text/TextInput/RCTBackedTextInputDelegateAdapter.mm
@@ -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;
@@ -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;
diff --git a/packages/react-native/Libraries/Text/TextInput/RCTBaseTextInputView.mm b/packages/react-native/Libraries/Text/TextInput/RCTBaseTextInputView.mm
@@ -749,9 +749,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
diff --git a/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap b/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap
@@ -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>,
@@ -1904,9 +1897,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,
@@ -3639,9 +3629,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,
@@ -3831,9 +3818,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>,
 |}>;
diff --git a/packages/react-native/React/Fabric/Mounting/ComponentViews/TextInput/RCTTextInputComponentView.mm b/packages/react-native/React/Fabric/Mounting/ComponentViews/TextInput/RCTTextInputComponentView.mm
@@ -446,7 +446,7 @@ - (void)continuousSpellCheckingDidChange:(BOOL)enabled {}
 - (void)grammarCheckingDidChange:(BOOL)enabled {}
 
 
-- (BOOL)hasValidKeyDownOrValidKeyUp:(nonnull NSString *)key {
+- (BOOL)hasKeyDownEventOrKeyUpEvent:(nonnull NSString *)key {
   return YES;
 }
 
diff --git a/packages/react-native/React/Views/RCTHandledKey.h b/packages/react-native/React/Views/RCTHandledKey.h
@@ -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
 
diff --git a/packages/react-native/React/Views/RCTHandledKey.m b/packages/react-native/React/Views/RCTHandledKey.m
@@ -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"];
@@ -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]]) {
diff --git a/packages/react-native/React/Views/RCTView.h b/packages/react-native/React/Views/RCTView.h
@@ -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
@@ -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;
diff --git a/packages/react-native/React/Views/RCTView.m b/packages/react-native/React/Views/RCTView.m
diff --git a/packages/react-native/React/Views/RCTViewManager.m b/packages/react-native/React/Views/RCTViewManager.m
diff --git a/packages/react-native/React/Views/ScrollView/RCTScrollView.m b/packages/react-native/React/Views/ScrollView/RCTScrollView.m
diff --git a/packages/rn-tester/js/examples/KeyboardEventsExample/KeyboardEventsExample.js b/packages/rn-tester/js/examples/KeyboardEventsExample/KeyboardEventsExample.js
diff --git a/packages/rn-tester/js/examples/TextInput/TextInputSharedExamples.js b/packages/rn-tester/js/examples/TextInput/TextInputSharedExamples.js
