react-native-tvos 0.75.4-0 → 0.76.0-0

package/Libraries/Text/TextInput/RCTBaseTextInputView.mm

@@ -301,6 +301,14 @@ RCT_NOT_IMPLEMENTED(-(instancetype)initWithFrame : (CGRect)frame)
       @"oneTimeCode" : UITextContentTypeOneTimeCode,
     }];
 
+    if (@available(iOS 15.0, *)) {
+      [mutableContentTypeMap addEntriesFromDictionary:@{
+        @"dateTime" : UITextContentTypeDateTime,
+        @"flightNumber" : UITextContentTypeFlightNumber,
+        @"shipmentTrackingNumber" : UITextContentTypeShipmentTrackingNumber,
+      }];
+    }
+
 #if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && __IPHONE_OS_VERSION_MAX_ALLOWED >= 170000 /* __IPHONE_17_0 */
     if (@available(iOS 17.0, tvOS 17.0, *)) {
       [mutableContentTypeMap addEntriesFromDictionary:@{
@@ -379,14 +387,6 @@ RCT_NOT_IMPLEMENTED(-(instancetype)initWithFrame : (CGRect)frame)
 
 - (void)textInputDidBeginEditing
 {
-  if (_clearTextOnFocus) {
-    self.backedTextInputView.attributedText = [NSAttributedString new];
-  }
-
-  if (_selectTextOnFocus) {
-    [self.backedTextInputView selectAll:nil];
-  }
-
   [_eventDispatcher sendTextEventWithType:RCTTextEventTypeFocus
                                  reactTag:self.reactTag
                                      text:[self.backedTextInputView.attributedText.string copy]
@@ -460,7 +460,7 @@ RCT_NOT_IMPLEMENTED(-(instancetype)initWithFrame : (CGRect)frame)
         _maxLength.integerValue - (NSInteger)backedTextInputView.attributedText.string.length + (NSInteger)range.length,
         0);
 
-    if (text.length > allowedLength) {
+    if (text.length > _maxLength.integerValue) {
       // If we typed/pasted more than one character, limit the text inputted.
       if (text.length > 1) {
         if (allowedLength > 0) {
@@ -471,6 +471,9 @@ RCT_NOT_IMPLEMENTED(-(instancetype)initWithFrame : (CGRect)frame)
             allowedLength = cutOffCharacterRange.location;
           }
         }
+        if (allowedLength <= 0) {
+          return nil;
+        }
         // Truncate the input string so the result is exactly maxLength
         NSString *limitedString = [text substringToIndex:allowedLength];
         NSMutableAttributedString *newAttributedText = [backedTextInputView.attributedText mutableCopy];
@@ -604,6 +607,14 @@ RCT_NOT_IMPLEMENTED(-(instancetype)initWithFrame : (CGRect)frame)
 - (void)reactFocus
 {
   [self.backedTextInputView reactFocus];
+
+  if (_clearTextOnFocus) {
+    self.backedTextInputView.attributedText = [NSAttributedString new];
+  }
+
+  if (_selectTextOnFocus) {
+    [self.backedTextInputView selectAll:nil];
+  }
 }
 
 - (void)reactBlur

package/Libraries/Text/TextNativeComponent.js

@@ -16,8 +16,9 @@ import type {TextProps} from './TextProps';
 import {createViewConfig} from '../NativeComponent/ViewConfig';
 import UIManager from '../ReactNative/UIManager';
 import createReactNativeComponentClass from '../Renderer/shims/createReactNativeComponentClass';
+import Platform from '../Utilities/Platform';
 
-type NativeTextProps = $ReadOnly<{
+export type NativeTextProps = $ReadOnly<{
   ...TextProps,
   isHighlighted?: ?boolean,
   selectionColor?: ?ProcessedColorValue,

package/Libraries/TurboModule/TurboModuleRegistry.js

@@ -16,52 +16,25 @@ const NativeModules = require('../BatchedBridge/NativeModules');
 
 const turboModuleProxy = global.__turboModuleProxy;
 
-const moduleLoadHistory = {
-  NativeModules: ([]: Array<string>),
-  TurboModules: ([]: Array<string>),
-  NotFound: ([]: Array<string>),
-};
+const useLegacyNativeModuleInterop =
+  global.RN$Bridgeless !== true || global.RN$TurboInterop === true;
 
-function isBridgeless() {
-  return global.RN$Bridgeless === true;
-}
-
-function isTurboModuleInteropEnabled() {
-  return global.RN$TurboInterop === true;
-}
-
-// TODO(154308585): Remove "module not found" debug info logging
-function shouldReportDebugInfo() {
-  return true;
-}
-
-// TODO(148943970): Consider reversing the lookup here:
-// Lookup on __turboModuleProxy, then lookup on nativeModuleProxy
 function requireModule<T: TurboModule>(name: string): ?T {
-  if (!isBridgeless() || isTurboModuleInteropEnabled()) {
-    // Backward compatibility layer during migration.
-    const legacyModule = NativeModules[name];
-    if (legacyModule != null) {
-      if (shouldReportDebugInfo()) {
-        moduleLoadHistory.NativeModules.push(name);
-      }
-      return ((legacyModule: $FlowFixMe): T);
-    }
-  }
-
   if (turboModuleProxy != null) {
     const module: ?T = turboModuleProxy(name);
     if (module != null) {
-      if (shouldReportDebugInfo()) {
-        moduleLoadHistory.TurboModules.push(name);
-      }
       return module;
     }
   }
 
-  if (shouldReportDebugInfo() && !moduleLoadHistory.NotFound.includes(name)) {
-    moduleLoadHistory.NotFound.push(name);
+  if (useLegacyNativeModuleInterop) {
+    // Backward compatibility layer during migration.
+    const legacyModule: ?T = NativeModules[name];
+    if (legacyModule != null) {
+      return legacyModule;
+    }
   }
+
   return null;
 }
 
@@ -71,20 +44,10 @@ export function get<T: TurboModule>(name: string): ?T {
 
 export function getEnforcing<T: TurboModule>(name: string): T {
   const module = requireModule<T>(name);
-  let message =
+  invariant(
+    module != null,
     `TurboModuleRegistry.getEnforcing(...): '${name}' could not be found. ` +
-    'Verify that a module by this name is registered in the native binary.';
-
-  if (shouldReportDebugInfo()) {
-    message +=
-      ' Bridgeless mode: ' + (isBridgeless() ? 'true' : 'false') + '. ';
-    message +=
-      'TurboModule interop: ' +
-      (isTurboModuleInteropEnabled() ? 'true' : 'false') +
-      '. ';
-    message += 'Modules loaded: ' + JSON.stringify(moduleLoadHistory);
-  }
-
-  invariant(module != null, message);
+      'Verify that a module by this name is registered in the native binary.',
+  );
   return module;
 }

package/Libraries/Types/CodegenTypes.js

@@ -42,4 +42,6 @@ type DefaultTypes = number | boolean | string | $ReadOnlyArray<string>;
 // eslint-disable-next-line no-unused-vars
 export type WithDefault<Type: DefaultTypes, Value: ?Type | string> = ?Type;
 
-export type EventEmitter<T> = (handler: (T) => mixed) => EventSubscription;
+export type EventEmitter<T> = (
+  handler: (T) => void | Promise<void>,
+) => EventSubscription;

package/Libraries/Utilities/Appearance.js

@@ -8,100 +8,124 @@
  * @flow strict-local
  */
 
+import type {EventSubscription} from '../vendor/emitter/EventEmitter';
+import type {AppearancePreferences, ColorSchemeName} from './NativeAppearance';
+import typeof INativeAppearance from './NativeAppearance';
+
 import NativeEventEmitter from '../EventEmitter/NativeEventEmitter';
-import Platform from '../Utilities/Platform';
-import EventEmitter, {
-  type EventSubscription,
-} from '../vendor/emitter/EventEmitter';
+import EventEmitter from '../vendor/emitter/EventEmitter';
 import {isAsyncDebugging} from './DebugEnvironment';
-import NativeAppearance, {
-  type AppearancePreferences,
-  type ColorSchemeName,
-} from './NativeAppearance';
 import invariant from 'invariant';
 
-type AppearanceListener = (preferences: AppearancePreferences) => void;
-const eventEmitter = new EventEmitter<{
-  change: [AppearancePreferences],
-}>();
+type Appearance = {
+  colorScheme: ?ColorSchemeName,
+};
 
-type NativeAppearanceEventDefinitions = {
-  appearanceChanged: [AppearancePreferences],
+let lazyState: ?{
+  +NativeAppearance: INativeAppearance,
+  // Cache the color scheme to reduce the cost of reading it between changes.
+  // NOTE: If `NativeAppearance` is null, this will always be null.
+  appearance: ?Appearance,
+  // NOTE: This is non-nullable to make it easier for `onChangedListener` to
+  // return a non-nullable `EventSubscription` value. This is not the common
+  // path, so we do not have to over-optimize it.
+  +eventEmitter: EventEmitter<{change: [Appearance]}>,
 };
 
-if (NativeAppearance) {
-  const nativeEventEmitter =
-    new NativeEventEmitter<NativeAppearanceEventDefinitions>(
-      // T88715063: NativeEventEmitter only used this parameter on iOS. Now it uses it on all platforms, so this code was modified automatically to preserve its behavior
-      // If you want to use the native module on other platforms, please remove this condition and test its behavior
-      Platform.OS !== 'ios' ? null : NativeAppearance,
-    );
-  nativeEventEmitter.addListener(
-    'appearanceChanged',
-    (newAppearance: AppearancePreferences) => {
-      const {colorScheme} = newAppearance;
-      invariant(
-        colorScheme === 'dark' ||
-          colorScheme === 'light' ||
-          colorScheme == null,
-        "Unrecognized color scheme. Did you mean 'dark' or 'light'?",
-      );
-      eventEmitter.emit('change', {colorScheme});
-    },
-  );
+/**
+ * Ensures that all state and listeners are lazily initialized correctly.
+ */
+function getState(): $NonMaybeType<typeof lazyState> {
+  if (lazyState != null) {
+    return lazyState;
+  }
+  const eventEmitter = new EventEmitter<{change: [Appearance]}>();
+  // NOTE: Avoid initializing `NativeAppearance` until it is actually used.
+  const NativeAppearance = require('./NativeAppearance').default;
+  if (NativeAppearance == null) {
+    // Assign `null` to avoid re-initializing on subsequent invocations.
+    lazyState = {
+      NativeAppearance: null,
+      appearance: null,
+      eventEmitter,
+    };
+  } else {
+    const state: $NonMaybeType<typeof lazyState> = {
+      NativeAppearance,
+      appearance: null,
+      eventEmitter,
+    };
+    new NativeEventEmitter<{
+      appearanceChanged: [AppearancePreferences],
+    }>(NativeAppearance).addListener('appearanceChanged', newAppearance => {
+      state.appearance = {
+        colorScheme: toColorScheme(newAppearance.colorScheme),
+      };
+      eventEmitter.emit('change', state.appearance);
+    });
+    lazyState = state;
+  }
+  return lazyState;
 }
 
-module.exports = {
-  /**
-   * Note: Although color scheme is available immediately, it may change at any
-   * time. Any rendering logic or styles that depend on this should try to call
-   * this function on every render, rather than caching the value (for example,
-   * using inline styles rather than setting a value in a `StyleSheet`).
-   *
-   * Example: `const colorScheme = Appearance.getColorScheme();`
-   *
-   * @returns {?ColorSchemeName} Value for the color scheme preference.
-   */
-  getColorScheme(): ?ColorSchemeName {
-    if (__DEV__) {
-      if (isAsyncDebugging) {
-        // Hard code light theme when using the async debugger as
-        // sync calls aren't supported
-        return 'light';
-      }
+/**
+ * Returns the current color scheme preference. This value may change, so the
+ * value should not be cached without either listening to changes or using
+ * the `useColorScheme` hook.
+ */
+export function getColorScheme(): ?ColorSchemeName {
+  if (__DEV__) {
+    if (isAsyncDebugging) {
+      // Hard code light theme when using the async debugger as
+      // sync calls aren't supported
+      return 'light';
     }
+  }
+  let colorScheme = null;
+  const state = getState();
+  const {NativeAppearance} = state;
+  if (NativeAppearance != null) {
+    if (state.appearance == null) {
+      // Lazily initialize `state.appearance`. This should only
+      // happen once because we never reassign a null value to it.
+      state.appearance = {
+        colorScheme: toColorScheme(NativeAppearance.getColorScheme()),
+      };
+    }
+    colorScheme = state.appearance.colorScheme;
+  }
+  return colorScheme;
+}
 
-    // TODO: (hramos) T52919652 Use ?ColorSchemeName once codegen supports union
-    const nativeColorScheme: ?string =
-      NativeAppearance == null
-        ? null
-        : NativeAppearance.getColorScheme() || null;
-    invariant(
-      nativeColorScheme === 'dark' ||
-        nativeColorScheme === 'light' ||
-        nativeColorScheme == null,
-      "Unrecognized color scheme. Did you mean 'dark' or 'light'?",
-    );
-    return nativeColorScheme;
-  },
-
-  setColorScheme(colorScheme: ?ColorSchemeName): void {
-    const nativeColorScheme = colorScheme == null ? 'unspecified' : colorScheme;
-
-    invariant(
-      colorScheme === 'dark' || colorScheme === 'light' || colorScheme == null,
-      "Unrecognized color scheme. Did you mean 'dark', 'light' or null?",
-    );
+/**
+ * Updates the current color scheme to the supplied value.
+ */
+export function setColorScheme(colorScheme: ?ColorSchemeName): void {
+  const state = getState();
+  const {NativeAppearance} = state;
+  if (NativeAppearance != null) {
+    NativeAppearance.setColorScheme(colorScheme ?? 'unspecified');
+    state.appearance = {colorScheme};
+  }
+}
 
-    if (NativeAppearance != null && NativeAppearance.setColorScheme != null) {
-      NativeAppearance.setColorScheme(nativeColorScheme);
-    }
-  },
+/**
+ * Add an event handler that is fired when appearance preferences change.
+ */
+export function addChangeListener(
+  listener: ({colorScheme: ?ColorSchemeName}) => void,
+): EventSubscription {
+  const {eventEmitter} = getState();
+  return eventEmitter.addListener('change', listener);
+}
 
-  /**
-   * Add an event handler that is fired when appearance preferences change.
-   */
-  addChangeListener(listener: AppearanceListener): EventSubscription {
-    return eventEmitter.addListener('change', listener);
-  },
-};
+/**
+ * TODO: (hramos) T52919652 Use ?ColorSchemeName once codegen supports union
+ */
+function toColorScheme(colorScheme: ?string): ?ColorSchemeName {
+  invariant(
+    colorScheme === 'dark' || colorScheme === 'light' || colorScheme == null,
+    "Unrecognized color scheme. Did you mean 'dark', 'light' or null?",
+  );
+  return colorScheme;
+}

package/Libraries/Utilities/DevLoadingView.js

@@ -9,7 +9,7 @@
  */
 
 import processColor from '../StyleSheet/processColor';
-import Appearance from './Appearance';
+import {getColorScheme} from './Appearance';
 import NativeDevLoadingView from './NativeDevLoadingView';
 
 const COLOR_SCHEME = {
@@ -39,9 +39,7 @@ module.exports = {
   showMessage(message: string, type: 'load' | 'refresh') {
     if (NativeDevLoadingView) {
       const colorScheme =
-        Appearance.getColorScheme() === 'dark'
-          ? COLOR_SCHEME.dark
-          : COLOR_SCHEME.default;
+        getColorScheme() === 'dark' ? COLOR_SCHEME.dark : COLOR_SCHEME.default;
 
       const colorSet = colorScheme[type];
 

package/Libraries/Utilities/HMRClient.js

@@ -126,7 +126,7 @@ const HMRClient: HMRClientNativeInterface = {
           data: data.map(item =>
             typeof item === 'string'
               ? item
-              : prettyFormat(item, {
+              : prettyFormat.format(item, {
                   escapeString: true,
                   highlight: true,
                   maxDepth: 3,
@@ -153,11 +153,12 @@ const HMRClient: HMRClientNativeInterface = {
         level: 'info',
         data: [
           '\n' +
-            '\x1b[7m' +
-            ' \x1b[1mJavaScript logs have moved!\x1b[22m They will now appear in the debugger console. ' +
-            'Tip: Type \x1b[1mj\x1b[22m in the terminal to open the debugger (requires Google Chrome ' +
-            'or Microsoft Edge).' +
-            '\x1b[27m' +
+            '\u001B[7m' +
+            ' \u001B[1m💡 JavaScript logs will be removed from Metro in React ' +
+            'Native 0.77!\u001B[22m Please use React Native DevTools as your ' +
+            'default tool. Tip: Type \u001B[1mj\u001B[22m in the terminal to ' +
+            'open (requires Google Chrome or Microsoft Edge).' +
+            '\u001B[27m' +
             '\n',
         ],
       }),
@@ -379,6 +380,7 @@ function showCompileError() {
 
   /* $FlowFixMe[class-object-subtyping] added when improving typing for this
    * parameters */
+  // $FlowFixMe[incompatible-type]
   const error: ExtendedError = new Error(message);
   // Symbolicating compile errors is wasted effort
   // because the stack trace is meaningless:

package/Libraries/Utilities/ReactNativeTestTools.js

@@ -115,7 +115,7 @@ function expectNoConsoleError() {
 
 async function expectRendersMatchingSnapshot(
   name: string,
-  ComponentProvider: () => React.Element<any>,
+  ComponentProvider: () => React.MixedElement,
   unmockComponent: () => mixed,
 ) {
   let instance;

package/Libraries/Utilities/createPerformanceLogger.js

@@ -15,11 +15,8 @@ import type {
   Timespan,
 } from './IPerformanceLogger';
 
-import * as Systrace from '../Performance/Systrace';
 import infoLog from './infoLog';
 
-const _cookies: {[key: string]: number, ...} = {};
-
 const PRINT_TO_CONSOLE: false = false; // Type as false to prevent accidentally committing `true`;
 
 export const getCurrentTimestamp: () => number =
@@ -233,7 +230,6 @@ class PerformanceLogger implements IPerformanceLogger {
       startTime: timestamp,
       startExtras: extras,
     };
-    _cookies[key] = Systrace.beginAsyncEvent(key);
     if (PRINT_TO_CONSOLE) {
       infoLog('PerformanceLogger.js', 'start: ' + key);
     }
@@ -277,11 +273,6 @@ class PerformanceLogger implements IPerformanceLogger {
     if (PRINT_TO_CONSOLE) {
       infoLog('PerformanceLogger.js', 'end: ' + key);
     }
-
-    if (_cookies[key] != null) {
-      Systrace.endAsyncEvent(key, _cookies[key]);
-      delete _cookies[key];
-    }
   }
 }
 

package/Libraries/Utilities/stringifyViewConfig.js

@@ -0,0 +1,22 @@
+/**
+ * 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.
+ *
+ * @format
+ * @flow
+ */
+
+export default function stringifyViewConfig(viewConfig: any): string {
+  return JSON.stringify(
+    viewConfig,
+    (key, val) => {
+      if (typeof val === 'function') {
+        return `ƒ ${val.name}`;
+      }
+      return val;
+    },
+    2,
+  );
+}

package/Libraries/Utilities/useColorScheme.js

@@ -12,14 +12,14 @@
 
 import type {ColorSchemeName} from './NativeAppearance';
 
-import Appearance from './Appearance';
+import {addChangeListener, getColorScheme} from './Appearance';
 import {useSyncExternalStore} from 'react';
 
 const subscribe = (onStoreChange: () => void) => {
-  const appearanceSubscription = Appearance.addChangeListener(onStoreChange);
+  const appearanceSubscription = addChangeListener(onStoreChange);
   return () => appearanceSubscription.remove();
 };
 
 export default function useColorScheme(): ?ColorSchemeName {
-  return useSyncExternalStore(subscribe, Appearance.getColorScheme);
+  return useSyncExternalStore(subscribe, getColorScheme);
 }

package/Libraries/WebSocket/WebSocket.js

@@ -68,7 +68,7 @@ type WebSocketEventDefinitions = {
  * See https://developer.mozilla.org/en-US/docs/Web/API/WebSocket
  * See https://github.com/websockets/ws
  */
-class WebSocket extends (EventTarget(...WEBSOCKET_EVENTS): any) {
+class WebSocket extends (EventTarget(...WEBSOCKET_EVENTS): typeof EventTarget) {
   static CONNECTING: number = CONNECTING;
   static OPEN: number = OPEN;
   static CLOSING: number = CLOSING;

package/Libraries/promiseRejectionTrackingOptions.js

@@ -27,7 +27,7 @@ let rejectionTrackingOptions: $NonMaybeType<Parameters<enable>[0]> = {
       stack = error.stack;
     } else {
       try {
-        message = require('pretty-format')(rejection);
+        message = require('pretty-format').format(rejection);
       } catch {
         message =
           typeof rejection === 'string'

package/Libraries/vendor/emitter/EventEmitter.js

@@ -35,11 +35,9 @@ interface Registration<TArgs> {
   +remove: () => void;
 }
 
-// $FlowFixMe[deprecated-type]
-type Registry<TEventToArgsMap: {...}> = $ObjMap<
-  TEventToArgsMap,
-  <TArgs>(TArgs) => Set<Registration<TArgs>>,
->;
+type Registry<TEventToArgsMap: {...}> = {
+  [K in keyof TEventToArgsMap]: Set<Registration<TEventToArgsMap[K]>>,
+};
 
 /**
  * EventEmitter manages listeners and publishes events to them.
@@ -64,6 +62,7 @@ type Registry<TEventToArgsMap: {...}> = $ObjMap<
 export default class EventEmitter<TEventToArgsMap: {...}>
   implements IEventEmitter<TEventToArgsMap>
 {
+  // $FlowFixMe[incompatible-type]
   #registry: Registry<TEventToArgsMap> = {};
 
   /**
@@ -113,6 +112,7 @@ export default class EventEmitter<TEventToArgsMap: {...}>
       // Copy `registrations` to take a snapshot when we invoke `emit`, in case
       // registrations are added or removed when listeners are invoked.
       for (const registration of Array.from(registrations)) {
+        // $FlowFixMe[incompatible-call]
         registration.listener.apply(registration.context, args);
       }
     }
@@ -125,6 +125,7 @@ export default class EventEmitter<TEventToArgsMap: {...}>
     eventType?: ?TEvent,
   ): void {
     if (eventType == null) {
+      // $FlowFixMe[incompatible-type]
       this.#registry = {};
     } else {
       delete this.#registry[eventType];