All changes pre 0.77 merge (#2394)

Contains all the internal changes pre 0.77.

Squash of diffs D66828387..D69614635

Author: sbuggay

RNPrefixHeader.h

@@ -0,0 +1,5 @@
+// (c) Meta Platforms, Inc. and affiliates. Confidential and proprietary.
+
+#ifdef __OBJC__
+  #import <Foundation/Foundation.h>
+#endif

packages/react-native/Libraries/ActionSheetIOS/ActionSheetIOS.js

@@ -49,6 +49,7 @@ const ActionSheetIOS = {
       +anchor?: ?number,
       +tintColor?: ColorValue | ProcessedColorValue,
       +cancelButtonTintColor?: ColorValue | ProcessedColorValue,
+      +disabledButtonTintColor?: ColorValue | ProcessedColorValue,
       +userInterfaceStyle?: string,
       +disabledButtonIndices?: Array<number>,
     |},
@@ -64,6 +65,7 @@ const ActionSheetIOS = {
     const {
       tintColor,
       cancelButtonTintColor,
+      disabledButtonTintColor,
       destructiveButtonIndex,
       ...remainingOptions
     } = options;
@@ -77,6 +79,10 @@ const ActionSheetIOS = {
 
     const processedTintColor = processColor(tintColor);
     const processedCancelButtonTintColor = processColor(cancelButtonTintColor);
+    const processedDisabledButtonTintColor = processColor(
+      disabledButtonTintColor,
+    );
+
     invariant(
       processedTintColor == null || typeof processedTintColor === 'number',
       'Unexpected color given for ActionSheetIOS.showActionSheetWithOptions tintColor',
@@ -86,13 +92,20 @@ const ActionSheetIOS = {
         typeof processedCancelButtonTintColor === 'number',
       'Unexpected color given for ActionSheetIOS.showActionSheetWithOptions cancelButtonTintColor',
     );
+    invariant(
+      processedDisabledButtonTintColor == null ||
+        typeof processedDisabledButtonTintColor === 'number',
+      'Unexpected color given for ActionSheetIOS.showActionSheetWithOptions disabledButtonTintColor',
+    );
     RCTActionSheetManager.showActionSheetWithOptions(
       {
         ...remainingOptions,
         // $FlowFixMe[incompatible-call]
         tintColor: processedTintColor,
         // $FlowFixMe[incompatible-call]
         cancelButtonTintColor: processedCancelButtonTintColor,
+        // $FlowFixMe[incompatible-call]
+        disabledButtonTintColor: processedDisabledButtonTintColor,
         destructiveButtonIndices,
       },
       callback,

packages/react-native/Libraries/Alert/Alert.js

@@ -9,53 +9,17 @@
  */
 
 import type {DialogOptions} from '../NativeModules/specs/NativeDialogManagerAndroid';
+import type {AlertButtons, AlertOptions, AlertType} from './AlertTypes.flow';
 
 import Platform from '../Utilities/Platform';
 import RCTAlertManager from './RCTAlertManager';
 
-export type AlertType =
-  | 'default'
-  | 'plain-text'
-  | 'secure-text'
-  | 'login-password';
-export type AlertButtonStyle = 'default' | 'cancel' | 'destructive';
-export type Buttons = Array<{
-  text?: string,
-  onPress?: ?Function,
-  isPreferred?: boolean,
-  style?: AlertButtonStyle,
-  ...
-}>;
-// [macOS
-export type DefaultInputsArray = Array<{
-  default?: string,
-  placeholder?: string,
-  style?: AlertButtonStyle,
-}>;
-// macOS]
-
-type Options = {
-  cancelable?: ?boolean,
-  userInterfaceStyle?: 'unspecified' | 'light' | 'dark',
-  onDismiss?: ?() => void,
-  // [macOS
-  modal?: ?boolean,
-  critical?: ?boolean,
-  // macOS]
-  ...
-};
-
-/**
- * Launches an alert dialog with the specified title and message.
- *
- * See https://reactnative.dev/docs/alert
- */
 class Alert {
   static alert(
     title: ?string,
     message?: ?string,
-    buttons?: Buttons,
-    options?: Options,
+    buttons?: AlertButtons,
+    options?: AlertOptions,
   ): void {
     if (Platform.OS === 'ios') {
       Alert.prompt(
@@ -99,7 +63,7 @@ class Alert {
       // At most three buttons (neutral, negative, positive). Ignore rest.
       // The text 'OK' should be probably localized. iOS Alert does that in native.
       const defaultPositiveText = 'OK';
-      const validButtons: Buttons = buttons
+      const validButtons: AlertButtons = buttons
         ? buttons.slice(0, 3)
         : [{text: defaultPositiveText}];
       const buttonPositive = validButtons.pop();
@@ -142,11 +106,11 @@ class Alert {
   static prompt(
     title: ?string,
     message?: ?string,
-    callbackOrButtons?: ?(((text: string) => void) | Buttons),
+    callbackOrButtons?: ?(((text: string) => void) | AlertButtons),
     type?: ?AlertType = 'plain-text',
     defaultValue?: string,
     keyboardType?: string,
-    options?: Options,
+    options?: AlertOptions,
   ): void {
     if (Platform.OS === 'ios') {
       let callbacks: Array<?any> = [];
@@ -252,7 +216,7 @@ class Alert {
   static promptMacOS(
     title: ?string,
     message?: ?string,
-    callbackOrButtons?: ?((text: string) => void) | Buttons,
+    callbackOrButtons?: ?((text: string) => void) | AlertButtons,
     type?: ?AlertType = 'plain-text',
     defaultInputs?: DefaultInputsArray,
     modal?: ?boolean,
@@ -292,4 +256,4 @@ class Alert {
   // macOS]
 }
 
-module.exports = Alert;
+export default Alert;

packages/react-native/Libraries/Alert/RCTAlertManager.ios.js

@@ -12,7 +12,7 @@ import type {Args} from './NativeAlertManager';
 
 import NativeAlertManager from './NativeAlertManager';
 
-module.exports = {
+export default {
   alertWithArgs(
     args: Args,
     callback: (id: number, value: string) => void,

packages/react-native/Libraries/Alert/RCTAlertManager.macos.js

@@ -1,5 +1,5 @@
 /**
- * Copyright (c) 2015-present, Facebook, Inc.
+ * 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.
@@ -8,9 +8,18 @@
  * @flow strict-local
  */
 
-// [macOS]
+import type {Args} from './NativeAlertManager';
 
-/* $FlowFixMe allow macOS to share iOS file */
-const alertWithArgs = require('./RCTAlertManager.ios');
+import NativeAlertManager from './NativeAlertManager';
 
-module.exports = alertWithArgs;
+module.exports = {
+  alertWithArgs(
+    args: Args,
+    callback: (id: number, value: string) => void,
+  ): void {
+    if (NativeAlertManager == null) {
+      return;
+    }
+    NativeAlertManager.alertWithArgs(args, callback);
+  },
+};

packages/react-native/Libraries/Animated/AnimatedEvent.js

@@ -12,8 +12,8 @@
 
 import type {PlatformConfig} from './AnimatedPlatformConfig';
 
-import {findNodeHandle} from '../ReactNative/RendererProxy';
 import NativeAnimatedHelper from '../../src/private/animated/NativeAnimatedHelper';
+import {findNodeHandle} from '../ReactNative/RendererProxy';
 import AnimatedValue from './nodes/AnimatedValue';
 import AnimatedValueXY from './nodes/AnimatedValueXY';
 import invariant from 'invariant';

packages/react-native/Libraries/Animated/AnimatedImplementation.js

@@ -373,7 +373,7 @@ const parallel = function (
   const stopTogether = !(config && config.stopTogether === false);
 
   const result = {
-    start: function (callback?: ?EndCallback) {
+    start: function (callback?: ?EndCallback, isLooping?: boolean) {
       if (doneCount === animations.length) {
         callback && callback({finished: true});
         return;
@@ -397,7 +397,7 @@ const parallel = function (
         if (!animation) {
           cb({finished: true});
         } else {
-          animation.start(cb);
+          animation.start(cb, isLooping);
         }
       });
     },

packages/react-native/Libraries/Animated/NativeAnimatedAllowlist.js

@@ -8,6 +8,8 @@
  * @format
  */
 
+import type {AnimatedPropsAllowlist} from './nodes/AnimatedProps';
+
 import * as ReactNativeFeatureFlags from '../../src/private/featureflags/ReactNativeFeatureFlags';
 
 /**
@@ -16,7 +18,7 @@ import * as ReactNativeFeatureFlags from '../../src/private/featureflags/ReactNa
  * In general native animated implementation should support any numeric or color property that
  * doesn't need to be updated through the shadow view hierarchy (all non-layout properties).
  */
-const SUPPORTED_COLOR_STYLES: {[string]: boolean} = {
+const SUPPORTED_COLOR_STYLES: {[string]: true} = {
   backgroundColor: true,
   borderBottomColor: true,
   borderColor: true,
@@ -29,7 +31,7 @@ const SUPPORTED_COLOR_STYLES: {[string]: boolean} = {
   tintColor: true,
 };
 
-const SUPPORTED_STYLES: {[string]: boolean} = {
+const SUPPORTED_STYLES: {[string]: true} = {
   ...SUPPORTED_COLOR_STYLES,
   borderBottomEndRadius: true,
   borderBottomLeftRadius: true,
@@ -58,7 +60,7 @@ const SUPPORTED_STYLES: {[string]: boolean} = {
   translateY: true,
 };
 
-const SUPPORTED_TRANSFORMS: {[string]: boolean} = {
+const SUPPORTED_TRANSFORMS: {[string]: true} = {
   translateX: true,
   translateY: true,
   scale: true,
@@ -71,17 +73,26 @@ const SUPPORTED_TRANSFORMS: {[string]: boolean} = {
   perspective: true,
   skewX: true,
   skewY: true,
-  matrix: ReactNativeFeatureFlags.shouldUseAnimatedObjectForTransform(),
+  ...(ReactNativeFeatureFlags.shouldUseAnimatedObjectForTransform()
+    ? {matrix: true}
+    : {}),
 };
 
-const SUPPORTED_INTERPOLATION_PARAMS: {[string]: boolean} = {
+const SUPPORTED_INTERPOLATION_PARAMS: {[string]: true} = {
   inputRange: true,
   outputRange: true,
   extrapolate: true,
   extrapolateRight: true,
   extrapolateLeft: true,
 };
 
+/**
+ * Default allowlist for component props that support native animated values.
+ */
+export default {
+  style: SUPPORTED_STYLES,
+} as AnimatedPropsAllowlist;
+
 export function allowInterpolationParam(param: string): void {
   SUPPORTED_INTERPOLATION_PARAMS[param] = true;
 }
@@ -95,17 +106,17 @@ export function allowTransformProp(prop: string): void {
 }
 
 export function isSupportedColorStyleProp(prop: string): boolean {
-  return SUPPORTED_COLOR_STYLES[prop] === true;
+  return SUPPORTED_COLOR_STYLES.hasOwnProperty(prop);
 }
 
 export function isSupportedInterpolationParam(param: string): boolean {
-  return SUPPORTED_INTERPOLATION_PARAMS[param] === true;
+  return SUPPORTED_INTERPOLATION_PARAMS.hasOwnProperty(param);
 }
 
 export function isSupportedStyleProp(prop: string): boolean {
-  return SUPPORTED_STYLES[prop] === true;
+  return SUPPORTED_STYLES.hasOwnProperty(prop);
 }
 
 export function isSupportedTransformProp(prop: string): boolean {
-  return SUPPORTED_TRANSFORMS[prop] === true;
+  return SUPPORTED_TRANSFORMS.hasOwnProperty(prop);
 }