react-native-tvos 0.76.1-1 → 0.76.2-0

package/Libraries/AppDelegate/React-RCTAppDelegate.podspec

@@ -63,7 +63,7 @@ Pod::Spec.new do |s|
     "CLANG_CXX_LANGUAGE_STANDARD" => rct_cxx_language_standard(),
     "DEFINES_MODULE" => "YES"
   }
-  s.user_target_xcconfig   = { "HEADER_SEARCH_PATHS" => "\"$(PODS_ROOT)/Headers/Private/React-Core\""}
+  s.user_target_xcconfig   = { "HEADER_SEARCH_PATHS" => "\"$(PODS_ROOT)/Headers/Private/React-Core\" \"$(PODS_ROOT)/Headers/Private/Yoga\""}
 
   s.dependency "React-Core"
   s.dependency "RCT-Folly", folly_version

package/Libraries/Components/Pressable/Pressable.d.ts

@@ -20,6 +20,7 @@ import {
 import {View} from '../View/View';
 import {AccessibilityProps} from '../View/ViewAccessibility';
 import {ViewProps} from '../View/ViewPropTypes';
+import {TVParallaxProperties} from '../../../types/public/ReactNativeTVTypes';
 
 export interface PressableStateCallbackType {
   readonly pressed: boolean;
@@ -159,6 +160,13 @@ export interface PressableProps
    * Duration (in milliseconds) to wait after press down before calling onPressIn.
    */
   unstable_pressDelay?: number | undefined;
+
+  /**
+   * *(Apple TV only)* Object with properties to control Apple TV parallax effects.
+   *
+   * @platform ios
+   */
+  tvParallaxProperties?: TVParallaxProperties;
 }
 
 // TODO use React.AbstractComponent when available

package/Libraries/Components/Pressable/Pressable.js

@@ -10,6 +10,7 @@
 
 import type {
   FocusEvent,
+  BlurEvent,
   LayoutEvent,
   MouseEvent,
   PressEvent,
@@ -52,7 +53,9 @@ type TVProps = $ReadOnly<{|
   nextFocusRight?: ?number,
   nextFocusUp?: ?number,
   onFocus?: ?(event: FocusEvent) => mixed,
-  onBlur?: ?(event: FocusEvent) => mixed,
+  onBlur?: ?(event: BlurEvent) => mixed,
+  onFocusCapture?: ?(event: FocusEvent) => void,
+  onBlurCapture?: ?(event: BlurEvent) => void,
 |}>;
 
 type Props = $ReadOnly<{|

package/Libraries/Core/ReactNativeVersion.js

@@ -16,8 +16,8 @@ const version: $ReadOnly<{
 }> = {
   major: 0,
   minor: 76,
-  patch: 1,
-  prerelease: '1',
+  patch: 2,
+  prerelease: '0',
 };
 
 module.exports = {version};

package/Libraries/Core/setUpErrorHandling.js

@@ -21,13 +21,7 @@ ExceptionsManager.installConsoleErrorReporter();
 if (!global.__fbDisableExceptionsManager) {
   const handleError = (e: mixed, isFatal: boolean) => {
     try {
-      // TODO(T196834299): We should really use a c++ turbomodule for this
-      if (
-        !global.RN$handleException ||
-        !global.RN$handleException(e, isFatal)
-      ) {
-        ExceptionsManager.handleException(e, isFatal);
-      }
+      ExceptionsManager.handleException(e, isFatal);
     } catch (ee) {
       console.log('Failed to print error: ', ee.message);
       throw e;

package/Libraries/LogBox/Data/LogBoxData.js

@@ -82,9 +82,9 @@ let warningFilter: WarningFilter = function (format) {
   return {
     finalFormat: format,
     forceDialogImmediately: false,
-    suppressDialog_LEGACY: true,
+    suppressDialog_LEGACY: false,
     suppressCompletely: false,
-    monitorEvent: 'unknown',
+    monitorEvent: 'warning_unhandled',
     monitorListVersion: 0,
     monitorSampleRate: 1,
   };

package/Libraries/Text/TextInput/RCTBackedTextInputViewProtocol.h

@@ -35,6 +35,7 @@ NS_ASSUME_NONNULL_BEGIN
 @property (nonatomic, assign, readonly) CGFloat zoomScale;
 @property (nonatomic, assign, readonly) CGPoint contentOffset;
 @property (nonatomic, assign, readonly) UIEdgeInsets contentInset;
+@property (nullable, nonatomic, copy) NSDictionary<NSAttributedStringKey, id> *typingAttributes;
 
 // This protocol disallows direct access to `selectedTextRange` property because
 // unwise usage of it can break the `delegate` behavior. So, we always have to

package/Libraries/Types/CoreEventTypes.d.ts

@@ -246,13 +246,13 @@ export interface GestureResponderEvent
 
 export interface MouseEvent extends NativeSyntheticEvent<NativeMouseEvent> {}
 
-export interface NativeFocusEvent {}
+export interface NativeFocusEvent extends TargetedEvent {}
 export interface FocusEvent extends NativeSyntheticEvent<NativeFocusEvent> {}
 
-export interface NativeBlurEvent {}
+export interface NativeBlurEvent extends TargetedEvent {}
 export interface BlurEvent extends NativeSyntheticEvent<NativeBlurEvent> {}
 
-export interface NativePressEvent {}
+export interface NativePressEvent extends TargetedEvent {}
 export interface PressEvent extends NativeSyntheticEvent<NativePressEvent> {}
 
 export interface TargetedEvent {

package/README.md

@@ -176,19 +176,21 @@ var running_on_apple_tv = Platform.isTVOS;
 
 - _Common codebase for Android phone and Android TV_: Apps built for Android using this repo will run on both Android phone and Android TV. Most of the changes for TV are specific to handling focus-based navigation on a TV using the D-Pad on the remote control.
 
-- _Access to touchable controls_:  The `Touchable` mixin has code added to detect focus changes and use existing methods to style the components properly and initiate the proper actions when the view is selected using the TV remote, so `TouchableWithoutFeedback`, `TouchableHighlight` and `TouchableOpacity` will "just work" on both Apple TV and Android TV. In particular:
+- _Pressable and Touchable controls_:  In RNTV 0.76.1-1 and later, TV controls are supported with fully native events.
+Code has been added to detect focus changes and use existing methods to style the components properly and initiate the proper actions when the view is selected using the TV remote, so `Pressable`, `TouchableHighlight` and `TouchableOpacity` will "just work" on both Apple TV and Android TV. In particular:
 
   - `onFocus()` will be executed when the touchable view goes into focus
   - `onBlur()` will be executed when the touchable view goes out of focus
   - `onPress()` will be executed when the touchable view is actually selected by pressing the "select" button on the TV remote (center button on Apple TV remote, or center button on Android TV DPad).
-  - `onLongPress()` will be executed twice if the "select" button is held down for a length of time. The two events passed into `onLongPress()` will have different values for their `eventKeyAction` property, 0 for key down (start) and 1 for key up (end).
+  - `onPressIn()` will be executed when the TV remote "select" button is pressed down (center button on Apple TV remote, or center button on Android TV DPad)
+  - `onPressOut()` will be executed when the TV remote "select" button is released
+  - `onLongPress()` will be executed if the "select" button is held down for a length of time (this event is generated in the `Pressability` module, the same as for touchscreen long press events).
 
-- _Pressable controls_: The `Pressable` API works with TV.  Additional `onFocus` and `onBlur` props are provided to allow you to customize behavior when a Pressable enters or leaves focus. Similar to the `pressed` state that is true while a user is pressing the component on a touchscreen, the `focused` state will be true when it is focused on TV.  `PressableExample` in RNTester has been modified appropriately. The `onPress()` and `onLongPress()` methods work the same way as with `Touchable` components.
+  `TouchableNativeFeedback` and `TouchableWithoutFeedback` respond to press events, but do not respond to focus and blur events, and are not recommended for TV.
 
-- _Tailwind styles for Pressable controls_: For the 0.76 release, the `Pressable` component also generates the `onPressIn()` and `onPressOut()` events needed to support the [`active:` pseudo class for Tailwind styles](https://www.nativewind.dev/v4/core-concepts/states#hover-focus-and-active-).
-  - For `onPress()` events (the "select" button on the remote is pressed once), `onPressIn()` is generated, then `onPressOut()` is generated a short time later.
-  - For `onLongPress()` events (the "select" button on the remote is held down for a length of time), `onPressIn()` is generated once the press down is detected, and `onPressOut()` is generated when the button is released.
-  - The `focus:` pseudo class is also supported via the `onFocus()` and `onBlur()` events.
+Because focus and blur events are now fully native core events, they will respond correctly to capturing and bubbling event handlers in `View` components. A demo of this has been added to the TVEventHandlerExample in RNTester.
+
+- _Tailwind styles for Pressable and Touchable controls_: The above events allow RNTV to support the [`focus:` and `active:` pseudo classes for Tailwind styles](https://www.nativewind.dev/v4/core-concepts/states#hover-focus-and-active-).
 
 - _TV remote/keyboard input_: Application code that needs to implement custom handling of TV remote events can create an instance of `TVEventHandler` and listen for these events.  For a more convenient API, we provide `useTVEventHandler`.
 

package/React/Base/RCTTVRemoteHandler.m

@@ -119,11 +119,6 @@ static __volatile BOOL __gestureHandlersCancelTouches = YES;
                                   pressType:UIPressTypePlayPause
                                        name:RCTTVRemoteEventPlayPause];
 
-  // Select
-  [self addTapGestureRecognizerWithSelector:@selector(selectPressed:)
-                                  pressType:UIPressTypeSelect
-                                       name:RCTTVRemoteEventSelect];
-    
   // Page Up/Down
   if (@available(tvOS 14.3, *)) {
       [self addTapGestureRecognizerWithSelector:@selector(tappedPageUp:)
@@ -162,10 +157,6 @@ static __volatile BOOL __gestureHandlersCancelTouches = YES;
                                         pressType:UIPressTypePlayPause
                                              name:RCTTVRemoteEventLongPlayPause];
 
-  [self addLongPressGestureRecognizerWithSelector:@selector(longSelectPressed:)
-                                        pressType:UIPressTypeSelect
-                                             name:RCTTVRemoteEventLongSelect];
-
   [self addLongPressGestureRecognizerWithSelector:@selector(longUpPressed:)
                                         pressType:UIPressTypeUpArrow
                                              name:RCTTVRemoteEventLongUp];
@@ -355,11 +346,6 @@ static __volatile BOOL __gestureHandlersCancelTouches = YES;
     [[NSNotificationCenter defaultCenter] postNavigationPressEventWithType:RCTTVRemoteEventMenu keyAction:r.eventKeyAction tag:nil target:nil];
 }
 
-- (void)selectPressed:(UIGestureRecognizer *)r
-{
-    [[NSNotificationCenter defaultCenter] postNavigationPressEventWithType:RCTTVRemoteEventSelect keyAction:r.eventKeyAction tag:nil target:nil];
-}
-
 - (void)longPlayPausePressed:(UIGestureRecognizer *)r
 {
     [[NSNotificationCenter defaultCenter] postNavigationPressEventWithType:RCTTVRemoteEventLongPlayPause keyAction:r.eventKeyAction tag:nil target:nil];
@@ -370,11 +356,6 @@ static __volatile BOOL __gestureHandlersCancelTouches = YES;
 #endif
 }
 
-- (void)longSelectPressed:(UIGestureRecognizer *)r
-{
-    [[NSNotificationCenter defaultCenter] postNavigationPressEventWithType:RCTTVRemoteEventLongSelect keyAction:r.eventKeyAction tag:nil target:nil];
-}
-
 - (void)longUpPressed:(UIGestureRecognizer *)r
 {
     [[NSNotificationCenter defaultCenter] postNavigationPressEventWithType:RCTTVRemoteEventLongUp keyAction:r.eventKeyAction tag:nil target:nil];

package/React/Base/RCTTVRemoteSelectHandler.h

@@ -0,0 +1,27 @@
+#import <UIKit/UIKit.h>
+#import <Foundation/Foundation.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@protocol RCTTVRemoteSelectHandlerDelegate <NSObject>
+
+- (void)animatePressIn;
+- (void)animatePressOut;
+
+- (void)emitPressInEvent;
+- (void)emitPressOutEvent;
+
+- (void)sendSelectNotification;
+- (void)sendLongSelectBeganNotification;
+- (void)sendLongSelectEndedNotification;
+
+@end
+
+@interface RCTTVRemoteSelectHandler : NSObject <UIGestureRecognizerDelegate>
+
+- (instancetype _Nonnull )initWithView:(UIView<RCTTVRemoteSelectHandlerDelegate> * _Nonnull)view;
+- (instancetype _Nonnull )init __attribute__((unavailable("init not available, use initWithView:")));
+
+@end
+
+NS_ASSUME_NONNULL_END

package/React/Base/RCTTVRemoteSelectHandler.m

@@ -0,0 +1,120 @@
+#import "RCTTVRemoteSelectHandler.h"
+
+@interface RCTTVRemoteSelectHandler()
+
+@property (nonatomic, strong) UILongPressGestureRecognizer * pressRecognizer;
+@property (nonatomic, strong) UILongPressGestureRecognizer * longPressRecognizer;
+
+@property (nonatomic, weak) UIView<RCTTVRemoteSelectHandlerDelegate> *view;
+
+@end
+
+@implementation RCTTVRemoteSelectHandler {
+  NSMutableDictionary<NSString *, UIGestureRecognizer *> *_tvRemoteGestureRecognizers;
+}
+
+#pragma mark -
+#pragma mark Public methods
+
+- (instancetype)initWithView:(UIView <RCTTVRemoteSelectHandlerDelegate> *)view
+{
+  if ((self = [super init])) {
+      _view = view;
+      [self attachToView];
+  }
+  return self;
+}
+
+- (void)dealloc
+{
+  [self detachFromView];
+  _view = nil;
+}
+
+#pragma mark -
+#pragma UIGestureRecognizerDelegate method
+
+// Press recognizer should allow long press recognizer to work (but not the reverse)
+- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer {
+  return gestureRecognizer == _pressRecognizer;
+}
+
+#pragma mark -
+#pragma mark Private methods
+
+- (void)attachToView {
+  UILongPressGestureRecognizer *pressRecognizer = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(handlePress:)];
+  pressRecognizer.allowedPressTypes = @[ @(UIPressTypeSelect) ];
+  pressRecognizer.minimumPressDuration = 0.0;
+  pressRecognizer.delegate = self; // Press recognizer allows other recognizers to run
+
+  [self.view addGestureRecognizer:pressRecognizer];
+  self.pressRecognizer = pressRecognizer;
+
+  UILongPressGestureRecognizer *longPressRecognizer = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(handleLongPress:)];
+  longPressRecognizer.allowedPressTypes = @[ @(UIPressTypeSelect) ];
+  longPressRecognizer.minimumPressDuration = 0.5;
+
+  [self.view addGestureRecognizer:longPressRecognizer];
+  self.longPressRecognizer = longPressRecognizer;
+}
+
+- (void)detachFromView {
+  if (_pressRecognizer) {
+    [self.view removeGestureRecognizer:_pressRecognizer];
+    self.pressRecognizer = nil;
+  }
+  if (_longPressRecognizer) {
+    [self.view removeGestureRecognizer:_longPressRecognizer];
+    self.longPressRecognizer = nil;
+  }
+}
+
+- (void)handlePress:(UIGestureRecognizer *)r
+{
+  switch (r.state) {
+    case UIGestureRecognizerStateBegan:
+      [self.view emitPressInEvent];
+      [self.view animatePressIn];
+      break;
+    case UIGestureRecognizerStateCancelled:
+    case UIGestureRecognizerStateEnded:
+      if (r.enabled) {
+        [self.view animatePressOut];
+        [self.view emitPressOutEvent];
+        [self.view sendSelectNotification];
+      }
+      break;
+    default:
+      break;
+  }
+}
+
+/*
+ When a long press starts, the press recognizer has already started
+ and called selectGestureBegan(). We disable the press recognizer
+ when the long press starts. At the end of the gesture, we execute the
+ code for pressOut (since the press recognizer cannot), and then reenable
+ the press recgonizer. This guarantees
+ only one pressIn and one pressOut, and only longSelect notifications.
+ */
+- (void)handleLongPress:(UIGestureRecognizer *)r
+{
+  switch (r.state) {
+    case UIGestureRecognizerStateBegan:
+      self.pressRecognizer.enabled = NO;
+      [self.view sendLongSelectBeganNotification];
+      break;
+    case UIGestureRecognizerStateEnded:
+    case UIGestureRecognizerStateCancelled:
+      [self.view animatePressOut];
+      [self.view emitPressOutEvent];
+      [self.view sendLongSelectEndedNotification];
+      self.pressRecognizer.enabled = YES;
+      break;
+    default:
+      break;
+  }
+}
+
+@end

package/React/Base/RCTVersion.m

@@ -23,8 +23,8 @@ NSDictionary* RCTGetReactNativeVersion(void)
     __rnVersion = @{
                   RCTVersionMajor: @(0),
                   RCTVersionMinor: @(76),
-                  RCTVersionPatch: @(1),
-                  RCTVersionPrerelease: @"1",
+                  RCTVersionPatch: @(2),
+                  RCTVersionPrerelease: @"0",
                   };
   });
   return __rnVersion;

package/React/Fabric/Mounting/ComponentViews/ScrollView/RCTScrollViewComponentView.mm

@@ -27,6 +27,7 @@
 #if TARGET_OS_TV
 #import <React/RCTTVRemoteHandler.h>
 #import <React/RCTTVNavigationEventNotification.h>
+#import "React/RCTI18nUtil.h"
 #endif
 
 using namespace facebook::react;
@@ -1100,22 +1101,25 @@ static inline UIViewAnimationOptions animationOptionsWithCurve(UIViewAnimationCu
 
 - (BOOL)shouldUpdateFocusInContext:(UIFocusUpdateContext *)context
 {
+    // Determine if the layout is Right-to-Left
+    BOOL isRTL = [[RCTI18nUtil sharedInstance] isRTL];
     BOOL isHorizontal = _scrollView.contentSize.width > self.frame.size.width;
-    // Keep focus inside the scroll view till the end of the content
+    // Adjust for horizontal scrolling with RTL support
     if (isHorizontal) {
-        if ((context.focusHeading == UIFocusHeadingLeft && self.scrollView.contentOffset.x > 0)
-            || (context.focusHeading == UIFocusHeadingRight && self.scrollView.contentOffset.x < self.scrollView.contentSize.width - self.scrollView.visibleSize.width)
-        ) {
+        BOOL isNavigatingToEnd = (isRTL ? context.focusHeading == UIFocusHeadingLeft : context.focusHeading == UIFocusHeadingRight);
+        BOOL isNavigatingToStart = (isRTL ? context.focusHeading == UIFocusHeadingRight : context.focusHeading == UIFocusHeadingLeft);
+
+        if ((isNavigatingToEnd && self.scrollView.contentOffset.x < self.scrollView.contentSize.width - self.scrollView.visibleSize.width) ||
+            (isNavigatingToStart && self.scrollView.contentOffset.x > 0)) {
             return [UIFocusSystem environment:self containsEnvironment:context.nextFocusedItem];
         }
     } else {
-        if ((context.focusHeading == UIFocusHeadingUp && self.scrollView.contentOffset.y > 0)
-            || (context.focusHeading == UIFocusHeadingDown && self.scrollView.contentOffset.y < self.scrollView.contentSize.height - self.scrollView.visibleSize.height)
-        ) {
+        // Handle vertical scrolling as before
+        if ((context.focusHeading == UIFocusHeadingUp && self.scrollView.contentOffset.y > 0) ||
+            (context.focusHeading == UIFocusHeadingDown && self.scrollView.contentOffset.y < self.scrollView.contentSize.height - self.scrollView.visibleSize.height)) {
             return [UIFocusSystem environment:self containsEnvironment:context.nextFocusedItem];
         }
     }
-
     return [super shouldUpdateFocusInContext:context];
 }
 

package/React/Fabric/Mounting/ComponentViews/TextInput/RCTTextInputComponentView.mm

@@ -61,6 +61,13 @@ static NSSet<NSNumber *> *returnKeyTypesSet;
    */
   BOOL _comingFromJS;
   BOOL _didMoveToWindow;
+
+  /*
+   * Newly initialized default typing attributes contain a no-op NSParagraphStyle and NSShadow. These cause inequality
+   * between the AttributedString backing the input and those generated from state. We store these attributes to make
+   * later comparison insensitive to them.
+   */
+  NSDictionary<NSAttributedStringKey, id> *_originalTypingAttributes;
 }
 
 #pragma mark - UIView overrides
@@ -76,6 +83,7 @@ static NSSet<NSNumber *> *returnKeyTypesSet;
     _ignoreNextTextInputCall = NO;
     _comingFromJS = NO;
     _didMoveToWindow = NO;
+    _originalTypingAttributes = [_backedTextInputView.typingAttributes copy];
 
     [self addSubview:_backedTextInputView];
     [self initializeReturnKeyType];
@@ -84,6 +92,20 @@ static NSSet<NSNumber *> *returnKeyTypesSet;
   return self;
 }
 
+- (void)updateEventEmitter:(const EventEmitter::Shared &)eventEmitter
+{
+  [super updateEventEmitter:eventEmitter];
+
+  NSMutableDictionary<NSAttributedStringKey, id> *defaultAttributes =
+      [_backedTextInputView.defaultTextAttributes mutableCopy];
+
+  RCTWeakEventEmitterWrapper *eventEmitterWrapper = [RCTWeakEventEmitterWrapper new];
+  eventEmitterWrapper.eventEmitter = _eventEmitter;
+  defaultAttributes[RCTAttributedStringEventEmitterKey] = eventEmitterWrapper;
+
+  _backedTextInputView.defaultTextAttributes = defaultAttributes;
+}
+
 - (void)didMoveToWindow
 {
   [super didMoveToWindow];
@@ -236,8 +258,11 @@ static NSSet<NSNumber *> *returnKeyTypesSet;
   }
 
   if (newTextInputProps.textAttributes != oldTextInputProps.textAttributes) {
-    _backedTextInputView.defaultTextAttributes =
+    NSMutableDictionary<NSAttributedStringKey, id> *defaultAttributes =
         RCTNSTextAttributesFromTextAttributes(newTextInputProps.getEffectiveTextAttributes(RCTFontSizeMultiplier()));
+    defaultAttributes[RCTAttributedStringEventEmitterKey] =
+        _backedTextInputView.defaultTextAttributes[RCTAttributedStringEventEmitterKey];
+    _backedTextInputView.defaultTextAttributes = defaultAttributes;
   }
 
   if (newTextInputProps.selectionColor != oldTextInputProps.selectionColor) {
@@ -418,6 +443,7 @@ static NSSet<NSNumber *> *returnKeyTypesSet;
 
 - (void)textInputDidChangeSelection
 {
+  [self _updateTypingAttributes];
   if (_comingFromJS) {
     return;
   }
@@ -680,9 +706,26 @@ static NSSet<NSNumber *> *returnKeyTypesSet;
     [_backedTextInputView scrollRangeToVisible:NSMakeRange(offsetStart, 0)];
   }
   [self _restoreTextSelection];
+  [self _updateTypingAttributes];
   _lastStringStateWasUpdatedWith = attributedString;
 }
 
+// Ensure that newly typed text will inherit any custom attributes. We follow the logic of RN Android, where attributes
+// to the left of the cursor are copied into new text, unless we are at the start of the field, in which case we will
+// copy the attributes from text to the right. This allows consistency between backed input and new AttributedText
+// https://github.com/facebook/react-native/blob/3102a58df38d96f3dacef0530e4dbb399037fcd2/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/views/text/internal/span/SetSpanOperation.kt#L30
+- (void)_updateTypingAttributes
+{
+  if (_backedTextInputView.attributedText.length > 0) {
+    NSUInteger offsetStart = [_backedTextInputView offsetFromPosition:_backedTextInputView.beginningOfDocument
+                                                           toPosition:_backedTextInputView.selectedTextRange.start];
+
+    NSUInteger samplePoint = offsetStart == 0 ? 0 : offsetStart - 1;
+    _backedTextInputView.typingAttributes = [_backedTextInputView.attributedText attributesAtIndex:samplePoint
+                                                                                    effectiveRange:NULL];
+  }
+}
+
 - (void)_setMultiline:(BOOL)multiline
 {
   [_backedTextInputView removeFromSuperview];
@@ -738,9 +781,10 @@ static NSSet<NSNumber *> *returnKeyTypesSet;
       _backedTextInputView.markedTextRange || _backedTextInputView.isSecureTextEntry || fontHasBeenUpdatedBySystem;
 
   if (shouldFallbackToBareTextComparison) {
-    return ([newText.string isEqualToString:oldText.string]);
+    return [newText.string isEqualToString:oldText.string];
   } else {
-    return ([newText isEqualToAttributedString:oldText]);
+    return RCTIsAttributedStringEffectivelySame(
+        newText, oldText, _originalTypingAttributes, static_cast<const TextInputProps &>(*_props).textAttributes);
   }
 }
 

package/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.h

@@ -11,6 +11,9 @@
 #import <React/RCTConstants.h>
 #import <React/RCTTouchableComponentViewProtocol.h>
 #import <React/UIView+ComponentViewProtocol.h>
+#if TARGET_OS_TV
+#import <React/RCTTVRemoteSelectHandler.h>
+#endif
 #import <react/renderer/components/view/ViewEventEmitter.h>
 #import <react/renderer/components/view/ViewProps.h>
 #import <react/renderer/core/EventEmitter.h>
@@ -25,7 +28,11 @@ NS_ASSUME_NONNULL_BEGIN
 /**
  * UIView class for <View> component.
  */
+#if TARGET_OS_TV
+@interface RCTViewComponentView : UIView <RCTComponentViewProtocol, RCTTouchableComponentViewProtocol, RCTTVRemoteSelectHandlerDelegate> {
+#else
 @interface RCTViewComponentView : UIView <RCTComponentViewProtocol, RCTTouchableComponentViewProtocol> {
+#endif
  @protected
   facebook::react::LayoutMetrics _layoutMetrics;
   facebook::react::SharedViewProps _props;
@@ -72,6 +79,7 @@ NS_ASSUME_NONNULL_BEGIN
 @property(nonatomic, nullable) UIFocusGuide *focusGuideDown;
 @property(nonatomic, nullable) UIFocusGuide *focusGuideLeft;
 @property(nonatomic, nullable) UIFocusGuide *focusGuideRight;
+@property(nonatomic, nullable, strong) RCTTVRemoteSelectHandler *tvRemoteSelectHandler;
 #endif
 
 /**

package/React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm

@@ -63,7 +63,6 @@ const CGFloat BACKGROUND_COLOR_ZPOSITION = -1024.0f;
   BOOL _removeClippedSubviews;
   NSMutableArray<UIView *> *_reactSubviews;
   BOOL _motionEffectsAdded;
-  UILongPressGestureRecognizer * _pressRecognizer;
   NSSet<NSString *> *_Nullable _propKeysManagedByAnimated_DO_NOT_USE_THIS_IS_BROKEN;
   UIView *_containerView;
   BOOL _useCustomContainerView;
@@ -267,62 +266,63 @@ const CGFloat BACKGROUND_COLOR_ZPOSITION = -1024.0f;
     [[NSNotificationCenter defaultCenter] postNavigationBlurEventWithTag:@(self.tag) target:@(self.tag)];
 }
 
-- (void)sendSelectNotification:(UIGestureRecognizer *)recognizer
+- (void)sendSelectNotification
 {
-    [[NSNotificationCenter defaultCenter] postNavigationPressEventWithType:RCTTVRemoteEventSelect keyAction:RCTTVRemoteEventKeyActionUp tag:@(self.tag) target:@(self.tag)];
+  [[NSNotificationCenter defaultCenter] postNavigationPressEventWithType:RCTTVRemoteEventSelect keyAction:RCTTVRemoteEventKeyActionUp tag:@(self.tag) target:@(self.tag)];
 }
 
-- (void)sendLongSelectNotification:(UIGestureRecognizer *)recognizer
+- (void)sendLongSelectBeganNotification
 {
-    [[NSNotificationCenter defaultCenter] postNavigationPressEventWithType:RCTTVRemoteEventLongSelect keyAction:recognizer.eventKeyAction tag:@(self.tag) target:@(self.tag)];
+    [[NSNotificationCenter defaultCenter] postNavigationPressEventWithType:RCTTVRemoteEventLongSelect keyAction:RCTTVRemoteEventKeyActionDown tag:@(self.tag) target:@(self.tag)];
 }
 
-- (void)animatePress
+- (void)sendLongSelectEndedNotification
+{
+    [[NSNotificationCenter defaultCenter] postNavigationPressEventWithType:RCTTVRemoteEventLongSelect keyAction:RCTTVRemoteEventKeyActionUp tag:@(self.tag) target:@(self.tag)];
+}
+
+- (void)animatePressIn
 {
   if (_tvParallaxProperties.enabled == YES) {
-    float magnification = _tvParallaxProperties.magnification;
     float pressMagnification = _tvParallaxProperties.pressMagnification;
 
     // Duration of press animation
     float pressDuration = _tvParallaxProperties.pressDuration;
 
-    // Delay of press animation
-    float pressDelay = _tvParallaxProperties.pressDelay;
-
-    [[NSRunLoop currentRunLoop] runUntilDate:[NSDate dateWithTimeIntervalSinceNow:pressDelay]];
-
     [UIView animateWithDuration:(pressDuration/2)
                      animations:^{
       self.transform = CGAffineTransformMakeScale(pressMagnification, pressMagnification);
     }
-                     completion:^(__unused BOOL finished1){
-      [UIView animateWithDuration:(pressDuration/2)
-                       animations:^{
-        self.transform = CGAffineTransformMakeScale(magnification, magnification);
-      }
-                       completion:^(__unused BOOL finished2) {
-      }];
-    }];
-
+                     completion:^(__unused BOOL finished){}];
   }
 }
 
-- (void)handlePress:(UIGestureRecognizer *)r
+- (void) animatePressOut
 {
-  switch (r.state) {
-      case UIGestureRecognizerStateBegan:
-      _eventEmitter->onPressIn();
-          break;
-      case UIGestureRecognizerStateEnded:
-      case UIGestureRecognizerStateCancelled:
-      [self animatePress];
-      _eventEmitter->onPressOut();
-          break;
-      default:
-          break;
+  if (_tvParallaxProperties.enabled == YES) {
+    float magnification = _tvParallaxProperties.magnification;
+
+    // Duration of press animation
+    float pressDuration = _tvParallaxProperties.pressDuration;
+
+    [UIView animateWithDuration:(pressDuration/2)
+                     animations:^{
+      self.transform = CGAffineTransformMakeScale(magnification, magnification);
+    }
+                     completion:^(__unused BOOL finished){}];
   }
 }
 
+- (void)emitPressInEvent
+{
+  _eventEmitter->onPressIn();
+}
+
+- (void)emitPressOutEvent
+{
+  _eventEmitter->onPressOut();
+}
+
 - (void)addParallaxMotionEffects
 {
   if(!_tvParallaxProperties.enabled) {
@@ -1040,16 +1040,9 @@ const CGFloat BACKGROUND_COLOR_ZPOSITION = -1024.0f;
   // `isTVSelectable`
   if (oldViewProps.isTVSelectable != newViewProps.isTVSelectable) {
     if (newViewProps.isTVSelectable && ![self isTVFocusGuide]) {
-      UILongPressGestureRecognizer *pressRecognizer = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(handlePress:)];
-      pressRecognizer.allowedPressTypes = @[ @(UIPressTypeSelect) ];
-      pressRecognizer.minimumPressDuration = 0;
-      
-      [self addGestureRecognizer:pressRecognizer];
-      _pressRecognizer = pressRecognizer;
+      self.tvRemoteSelectHandler = [[RCTTVRemoteSelectHandler alloc]initWithView:self];
     } else {
-      if (_pressRecognizer) {
-        [self removeGestureRecognizer:_pressRecognizer];
-      }
+      self.tvRemoteSelectHandler = nil;
     }
   }
   // `tvParallaxProperties