react-native-tvos 0.79.2-0 → 0.80.0-0

package/Libraries/Components/View/ViewAccessibility.js

@@ -53,7 +53,8 @@ export type AccessibilityRole =
   | 'webview'
   | 'drawerlayout'
   | 'slidingdrawer'
-  | 'iconmenu';
+  | 'iconmenu'
+  | string;
 
 // Role types for web
 export type Role =
@@ -257,6 +258,14 @@ export type AccessibilityPropsAndroid = $ReadOnly<{
    * See https://reactnative.dev/docs/view#importantforaccessibility
    */
   importantForAccessibility?: ?('auto' | 'yes' | 'no' | 'no-hide-descendants'),
+
+  /**
+   * Enables the view to be screen reader focusable, not keyboard focusable. This has lower priority
+   * than focusable or accessible props.
+   *
+   * @platform android
+   */
+  screenReaderFocusable?: boolean,
 }>;
 
 export type AccessibilityPropsIOS = $ReadOnly<{
@@ -319,6 +328,14 @@ export type AccessibilityPropsIOS = $ReadOnly<{
    * @platform ios
    */
   accessibilityLanguage?: ?Stringish,
+
+  /**
+   * Blocks the user from interacting with the component through keyboard while still allowing
+   * screen reader to interact with it if this View is still accessible.
+   *
+   * @platform ios
+   */
+  accessibilityRespondsToUserInteraction?: ?boolean,
 }>;
 
 export type AccessibilityProps = $ReadOnly<{
@@ -357,6 +374,13 @@ export type AccessibilityProps = $ReadOnly<{
    */
   'aria-label'?: ?Stringish,
 
+  /**
+   * Defines the order in which descendant elements receive accessibility focus.
+   * The elements in the array represent nativeID values for the respective
+   * descendant elements.
+   */
+  experimental_accessibilityOrder?: ?Array<string>,
+
   /**
    * Indicates to accessibility services to treat UI component like a specific role.
    */

package/Libraries/Components/View/ViewNativeComponent.js

@@ -25,10 +25,10 @@ interface NativeCommands {
   +setPressed: (viewRef: HostInstance, pressed: boolean) => void;
   // Focus Guide API
   +setDestinations: (
-    viewRef: $FlowFixMe,
+    viewRef: React.ElementRef<HostComponent<mixed>>,
     destinations: Array<number>, // Node handles are basically integers
   ) => void;
-  +requestTVFocus: (viewRef: $FlowFixMe) => void;
+  +requestTVFocus: (viewRef: React.ElementRef<HostComponent<mixed>>) => void;
 }
 
 export const Commands: NativeCommands = codegenNativeCommands<NativeCommands>({

package/Libraries/Components/View/ViewPropTypes.d.ts

@@ -17,6 +17,8 @@ import {
   PointerEvents,
   FocusEvents,
   PressEvents,
+  BlurEvent,
+  FocusEvent,
   NativeFocusEvent,
   NativeBlurEvent,
 } from '../../Types/CoreEventTypes';
@@ -84,6 +86,20 @@ export interface ViewPropsIOS extends TVViewPropsIOS {
 }
 
 export interface ViewPropsAndroid {
+  /**
+   * Callback that is called when the view is blurred.
+   *
+   * Note: This will only be called if the view is focusable.
+   */
+  onBlur?: ((e: BlurEvent) => void) | null | undefined;
+
+  /**
+   * Callback that is called when the view is focused.
+   *
+   * Note: This will only be called if the view is focusable.
+   */
+  onFocus?: ((e: FocusEvent) => void) | null | undefined;
+
   /**
    * Whether this view should render itself (and all of its children) into a single hardware texture on the GPU.
    *

package/Libraries/Components/View/ViewPropTypes.js

@@ -15,11 +15,11 @@ import type {ViewStyleProp} from '../../StyleSheet/StyleSheet';
 import type {
   BlurEvent,
   FocusEvent,
+  GestureResponderEvent,
   LayoutChangeEvent,
   LayoutRectangle,
   MouseEvent,
   PointerEvent,
-  GestureResponderEvent,
   RemotePressEvent,
 } from '../../Types/CoreEventTypes';
 import type {TVViewProps} from '../TV/TVViewPropTypes';
@@ -27,7 +27,8 @@ import type {
   AccessibilityActionEvent,
   AccessibilityProps,
 } from './ViewAccessibility';
-import type {Node} from 'react';
+
+import * as React from 'react';
 
 export type ViewLayout = LayoutRectangle;
 export type ViewLayoutEvent = LayoutChangeEvent;
@@ -317,6 +318,51 @@ export type ViewPropsAndroid = $ReadOnly<{
   onClick?: ?(event: GestureResponderEvent) => mixed,
 }>;
 
+export type TVViewPropsIOS = $ReadOnly<{
+  /**
+   * *(Apple TV only)* When set to true, this view will be focusable
+   * and navigable using the Apple TV remote.
+   *
+   * @platform ios
+   */
+  isTVSelectable?: boolean,
+
+  /**
+   * *(Apple TV only)* May be set to true to force the Apple TV focus engine to move focus to this view.
+   *
+   * @platform ios
+   */
+  hasTVPreferredFocus?: boolean,
+
+  /**
+   * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus.  Defaults to 2.0.
+   *
+   * @platform ios
+   */
+  tvParallaxShiftDistanceX?: number,
+
+  /**
+   * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus.  Defaults to 2.0.
+   *
+   * @platform ios
+   */
+  tvParallaxShiftDistanceY?: number,
+
+  /**
+   * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus.  Defaults to 0.05.
+   *
+   * @platform ios
+   */
+  tvParallaxTiltAngle?: number,
+
+  /**
+   * *(Apple TV only)* May be used to change the appearance of the Apple TV parallax effect when this view goes in or out of focus.  Defaults to 1.0.
+   *
+   * @platform ios
+   */
+  tvParallaxMagnification?: number,
+}>;
+
 export type ViewPropsIOS = $ReadOnly<{
   /**
    * Whether this `View` should be rendered as a bitmap before compositing.
@@ -355,7 +401,7 @@ type NextFocusProps = $ReadOnly<{
 }>;
 
 type ViewBaseProps = $ReadOnly<{
-  children?: Node,
+  children?: React.Node,
   style?: ?ViewStyleProp,
 
   /**

package/Libraries/Core/ReactNativeVersion.js

@@ -15,8 +15,8 @@ const version: $ReadOnly<{
   prerelease: string | null,
 }> = {
   major: 0,
-  minor: 79,
-  patch: 2,
+  minor: 80,
+  patch: 0,
   prerelease: '0',
 };
 

package/Libraries/Core/setUpReactDevTools.js

@@ -10,8 +10,8 @@
 
 'use strict';
 
-import type {Domain} from '../../src/private/debugging/setUpFuseboxReactDevToolsDispatcher';
-import type {Spec as NativeReactDevToolsRuntimeSettingsModuleSpec} from '../../src/private/fusebox/specs/NativeReactDevToolsRuntimeSettingsModule';
+import type {Domain} from '../../src/private/devsupport/rndevtools/setUpFuseboxReactDevToolsDispatcher';
+import type {Spec as NativeReactDevToolsRuntimeSettingsModuleSpec} from '../../src/private/devsupport/rndevtools/specs/NativeReactDevToolsRuntimeSettingsModule';
 
 if (__DEV__) {
   if (typeof global.queueMicrotask !== 'function') {
@@ -31,18 +31,18 @@ if (__DEV__) {
 
 if (__DEV__) {
   // Register dispatcher on global, which can be used later by Chrome DevTools frontend
-  require('../../src/private/debugging/setUpFuseboxReactDevToolsDispatcher');
+  require('../../src/private/devsupport/rndevtools/setUpFuseboxReactDevToolsDispatcher');
   const {
     initialize,
     connectToDevTools,
     connectWithCustomMessagingProtocol,
   } = require('react-devtools-core');
 
-  const reactDevToolsSettingsManager = require('../../src/private/debugging/ReactDevToolsSettingsManager');
+  const reactDevToolsSettingsManager = require('../../src/private/devsupport/rndevtools/ReactDevToolsSettingsManager');
   const serializedHookSettings =
     reactDevToolsSettingsManager.getGlobalHookSettings();
   const maybeReactDevToolsRuntimeSettingsModuleModule =
-    require('../../src/private/fusebox/specs/NativeReactDevToolsRuntimeSettingsModule').default;
+    require('../../src/private/devsupport/rndevtools/specs/NativeReactDevToolsRuntimeSettingsModule').default;
 
   let hookSettings = null;
   if (serializedHookSettings != null) {

package/Libraries/Debugging/DebuggingOverlayRegistry.js

@@ -35,8 +35,8 @@ import processColor from '../StyleSheet/processColor';
 
 // TODO(T171193075): __REACT_DEVTOOLS_GLOBAL_HOOK__ is always injected in dev-bundles,
 // but it is not mocked in some Jest tests. We should update Jest tests setup, so it would be the same as expected testing environment.
-const reactDevToolsHook: ?ReactDevToolsGlobalHook =
-  window.__REACT_DEVTOOLS_GLOBAL_HOOK__;
+const reactDevToolsHook: ?ReactDevToolsGlobalHook = (window: $FlowFixMe)
+  .__REACT_DEVTOOLS_GLOBAL_HOOK__;
 
 export type DebuggingOverlayRegistrySubscriberProtocol = {
   rootViewRef: AppContainerRootViewRef,
@@ -226,7 +226,7 @@ class DebuggingOverlayRegistry {
         return;
       }
 
-      const instanceReactTag = findNodeHandle(node);
+      const instanceReactTag = findNodeHandle<$FlowFixMe>(node);
       if (instanceReactTag == null) {
         return;
       }

package/Libraries/EventEmitter/NativeEventEmitter.js

@@ -24,7 +24,12 @@ interface NativeModule {
   removeListeners(count: number): void;
 }
 
-export type {EventSubscription};
+/** @deprecated Use `EventSubscription` instead. */
+type EmitterSubscription = EventSubscription;
+
+export type {EventSubscription, EmitterSubscription};
+/** @deprecated Use `EventSubscription` instead. */
+export type NativeEventSubscription = EventSubscription;
 
 // $FlowFixMe[unclear-type] unclear type of events
 type UnsafeObject = Object;
@@ -47,7 +52,7 @@ export default class NativeEventEmitter<
 {
   _nativeModule: ?NativeModule;
 
-  constructor(nativeModule: ?NativeModule) {
+  constructor(nativeModule?: ?NativeModule) {
     if (Platform.OS === 'ios') {
       invariant(
         nativeModule != null,
@@ -80,7 +85,7 @@ export default class NativeEventEmitter<
 
   addListener<TEvent: $Keys<TEventToArgsMap>>(
     eventType: TEvent,
-    listener: (...args: $ElementType<TEventToArgsMap, TEvent>) => mixed,
+    listener: (...args: TEventToArgsMap[TEvent]) => mixed,
     context?: mixed,
   ): EventSubscription {
     this._nativeModule?.addListener(eventType);
@@ -104,7 +109,7 @@ export default class NativeEventEmitter<
 
   emit<TEvent: $Keys<TEventToArgsMap>>(
     eventType: TEvent,
-    ...args: $ElementType<TEventToArgsMap, TEvent>
+    ...args: TEventToArgsMap[TEvent]
   ): void {
     // Generally, `RCTDeviceEventEmitter` is directly invoked. But this is
     // included for completeness.

package/Libraries/Image/AssetSourceResolver.js

@@ -18,10 +18,23 @@ export type ResolvedAssetSource = {
   +scale: number,
 };
 
-import type {
-  AssetDestPathResolver,
-  PackagerAsset,
-} from '@react-native/assets-registry/registry';
+// From @react-native/assets-registry
+type AssetDestPathResolver = 'android' | 'generic';
+
+// From @react-native/assets-registry
+type PackagerAsset = $ReadOnly<{
+  __packager_asset: boolean,
+  fileSystemLocation: string,
+  httpServerLocation: string,
+  width: ?number,
+  height: ?number,
+  scales: Array<number>,
+  hash: string,
+  name: string,
+  type: string,
+  resolver?: AssetDestPathResolver,
+  ...
+}>;
 
 const PixelRatio = require('../Utilities/PixelRatio').default;
 const Platform = require('../Utilities/Platform').default;

package/Libraries/Image/Image.d.ts

@@ -19,13 +19,19 @@ import {ImageResizeMode} from './ImageResizeMode';
 import {ImageRequireSource, ImageURISource} from './ImageSource';
 
 /**
- * @see ImagePropsIOS.onProgress
+ * @deprecated Use `ImageProgressEventIOS` instead.
  */
 export interface ImageProgressEventDataIOS {
   loaded: number;
   total: number;
 }
 
+/**
+ * @see https://reactnative.dev/docs/image#onprogress
+ */
+export type ImageProgressEventIOS =
+  NativeSyntheticEvent<ImageProgressEventDataIOS>;
+
 export interface ImagePropsIOS {
   /**
    * blurRadius: the blur radius of the blur filter added to the image
@@ -44,9 +50,7 @@ export interface ImagePropsIOS {
   /**
    * Invoked on download progress with {nativeEvent: {loaded, total}}
    */
-  onProgress?:
-    | ((event: NativeSyntheticEvent<ImageProgressEventDataIOS>) => void)
-    | undefined;
+  onProgress?: ((event: ImageProgressEventIOS) => void) | undefined;
 
   /**
    * Invoked when a partial load of the image is complete. The definition of
@@ -99,6 +103,9 @@ export type ImageSourcePropType =
   | ImageURISource[]
   | ImageRequireSource;
 
+/**
+ * @deprecated Use `ImageLoadEvent` instead.
+ */
 export interface ImageLoadEventData {
   source: {
     height: number;
@@ -107,10 +114,23 @@ export interface ImageLoadEventData {
   };
 }
 
+/**
+ * @see https://reactnative.dev/docs/image#onload
+ */
+export type ImageLoadEvent = NativeSyntheticEvent<ImageLoadEventData>;
+
+/**
+ * @deprecated Use `ImageErrorEvent` instead.
+ */
 export interface ImageErrorEventData {
   error: any;
 }
 
+/**
+ * @see https://reactnative.dev/docs/image#onerror
+ */
+export type ImageErrorEvent = NativeSyntheticEvent<ImageErrorEventData>;
+
 /**
  * @see https://reactnative.dev/docs/image#resolveassetsource
  */
@@ -145,17 +165,13 @@ export interface ImagePropsBase
   /**
    * Invoked on load error with {nativeEvent: {error}}
    */
-  onError?:
-    | ((error: NativeSyntheticEvent<ImageErrorEventData>) => void)
-    | undefined;
+  onError?: ((error: ImageErrorEvent) => void) | undefined;
 
   /**
    * Invoked when load completes successfully
    * { source: { uri, height, width } }.
    */
-  onLoad?:
-    | ((event: NativeSyntheticEvent<ImageLoadEventData>) => void)
-    | undefined;
+  onLoad?: ((event: ImageLoadEvent) => void) | undefined;
 
   /**
    * Invoked when load either succeeds or fails

package/Libraries/Image/Image.js

@@ -0,0 +1,17 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict-local
+ * @format
+ */
+
+// NOTE: This file supports backwards compatibility of subpath (deep) imports
+// from 'react-native' with platform-specific extensions. It can be deleted
+// once we remove the "./*" mapping from package.json "exports".
+
+import Image from './Image';
+
+export default Image;

package/Libraries/Image/Image.js.flow

@@ -8,15 +8,15 @@
  * @format
  */
 
-import type {Image} from './ImageTypes.flow';
+import type {ImageType} from './ImageTypes.flow';
 
 export type {
-  ImageProgressEventDataIOS,
+  ImageProgressEventIOS,
   ImagePropsIOS,
   ImagePropsAndroid,
   ImageSourcePropType,
-  ImageLoadEventData,
-  ImageErrorEventData,
+  ImageLoadEvent,
+  ImageErrorEvent,
   ImagePropsBase,
   ImageProps,
   ImageBackgroundProps,
@@ -24,4 +24,4 @@ export type {
 
 export type {ImageResolvedAssetSource, ImageSize} from './ImageTypes.flow';
 
-declare export default Image;
+declare export default ImageType;

package/Libraries/Image/ImageBackground.js

@@ -17,6 +17,8 @@ import StyleSheet from '../StyleSheet/StyleSheet';
 import Image from './Image';
 import * as React from 'react';
 
+export type {ImageBackgroundProps} from './ImageProps';
+
 /**
  * Very simple drop-in replacement for <Image> which supports nesting views.
  *

package/Libraries/Image/ImageInjection.js

@@ -11,7 +11,7 @@
 import type {
   AbstractImageAndroid,
   AbstractImageIOS,
-  Image as ImageComponent,
+  ImageType as ImageComponent,
 } from './ImageTypes.flow';
 
 import useMergeRefs from '../Utilities/useMergeRefs';

package/Libraries/Image/ImageProps.js

@@ -21,26 +21,35 @@ import type {
   LayoutChangeEvent,
   NativeSyntheticEvent,
 } from '../Types/CoreEventTypes';
-import typeof Image from './Image';
 import type {ImageResizeMode} from './ImageResizeMode';
 import type {ImageSource, ImageURISource} from './ImageSource';
-import type {ElementRef, Node, RefSetter} from 'react';
+import type {ImageType} from './ImageTypes.flow';
+
+import * as React from 'react';
 
 export type ImageSourcePropType = ImageSource;
 
-/**
- * @see ImagePropsIOS.onProgress
- */
-export type ImageProgressEventDataIOS = {
+type ImageProgressEventDataIOS = {
   loaded: number,
   total: number,
 };
 
-export type ImageErrorEventData = {
+/**
+ * @see ImagePropsIOS.onProgress
+ */
+export type ImageProgressEventIOS = NativeSyntheticEvent<
+  $ReadOnly<ImageProgressEventDataIOS>,
+>;
+
+type ImageErrorEventData = {
   error: string,
 };
 
-export type ImageLoadEventData = {
+export type ImageErrorEvent = NativeSyntheticEvent<
+  $ReadOnly<ImageErrorEventData>,
+>;
+
+type ImageLoadEventData = {
   source: {
     height: number,
     width: number,
@@ -70,9 +79,7 @@ export type ImagePropsIOS = $ReadOnly<{
    *
    * See https://reactnative.dev/docs/image#onprogress
    */
-  onProgress?: ?(
-    event: NativeSyntheticEvent<$ReadOnly<ImageProgressEventDataIOS>>,
-  ) => void,
+  onProgress?: ?(event: ImageProgressEventIOS) => void,
 }>;
 
 export type ImagePropsAndroid = $ReadOnly<{
@@ -121,7 +128,7 @@ export type ImagePropsAndroid = $ReadOnly<{
 }>;
 
 export type ImagePropsBase = $ReadOnly<{
-  ...$Diff<ViewProps, $ReadOnly<{style: ?ViewStyleProp}>>,
+  ...Omit<ViewProps, 'style'>,
   /**
    * When true, indicates the image is an accessibility element.
    *
@@ -201,9 +208,7 @@ export type ImagePropsBase = $ReadOnly<{
    *
    * See https://reactnative.dev/docs/image#onerror
    */
-  onError?: ?(
-    event: NativeSyntheticEvent<$ReadOnly<ImageErrorEventData>>,
-  ) => void,
+  onError?: ?(event: ImageErrorEvent) => void,
 
   /**
    * onLayout function
@@ -341,7 +346,7 @@ export type ImageProps = $ReadOnly<{
 
 export type ImageBackgroundProps = $ReadOnly<{
   ...ImageProps,
-  children?: Node,
+  children?: React.Node,
 
   /**
    * Style applied to the outer View component
@@ -362,5 +367,5 @@ export type ImageBackgroundProps = $ReadOnly<{
    *
    * See https://reactnative.dev/docs/imagebackground#imageref
    */
-  imageRef?: RefSetter<ElementRef<Image>>,
+  imageRef?: React.RefSetter<React.ElementRef<ImageType>>,
 }>;

package/Libraries/Image/ImageSource.js

@@ -82,8 +82,10 @@ export interface ImageURISource {
   +scale?: ?number;
 }
 
+export type ImageRequireSource = number;
+
 export type ImageSource =
-  | number
+  | ImageRequireSource
   | ImageURISource
   | $ReadOnlyArray<ImageURISource>;
 

package/Libraries/Image/ImageSourceUtils.js

@@ -52,14 +52,14 @@ export function getImageSourcesFromImageProps(
           // 1x scale is provided in `srcSet` prop so ignore the `src` prop if provided.
           shouldUseSrcForDefaultScale =
             scale === 1 ? false : shouldUseSrcForDefaultScale;
-          sourceList.push({headers: headers, scale, uri, width, height});
+          sourceList.push({headers, scale, uri, width, height});
         }
       }
     });
 
     if (shouldUseSrcForDefaultScale && src != null) {
       sourceList.push({
-        headers: headers,
+        headers,
         scale: 1,
         uri: src,
         width,
@@ -73,6 +73,8 @@ export function getImageSourcesFromImageProps(
     sources = sourceList;
   } else if (src != null) {
     sources = [{uri: src, headers: headers, width, height}];
+  } else if (source != null && source.uri && Object.keys(headers).length > 0) {
+    sources = [{...source, headers}];
   } else {
     sources = source;
   }

package/Libraries/Image/ImageTypes.flow.js

@@ -83,6 +83,6 @@ export type AbstractImageIOS = component(
 
 export type ImageIOS = AbstractImageIOS & ImageComponentStaticsIOS;
 
-export type Image = ImageIOS | ImageAndroid;
+export type ImageType = ImageIOS | ImageAndroid;
 
 export type {ImageProps} from './ImageProps';