@office-iss/react-native-win32 0.84.0-preview.2 → 0.85.0-preview.1

package/Libraries/Text/TextNativeComponent.js

@@ -13,11 +13,12 @@ import type {ProcessedColorValue} from '../StyleSheet/processColor';
 import type {GestureResponderEvent} from '../Types/CoreEventTypes';
 import type {TextProps} from './TextProps';
 
+import {enablePreparedTextLayout} from '../../src/private/featureflags/ReactNativeFeatureFlags';
 import {createViewConfig} from '../NativeComponent/ViewConfig';
 import UIManager from '../ReactNative/UIManager';
 import createReactNativeComponentClass from '../Renderer/shims/createReactNativeComponentClass';
 
-export type NativeTextProps = $ReadOnly<{
+export type NativeTextProps = Readonly<{
   ...TextProps,
   isHighlighted?: ?boolean,
   selectionColor?: ?ProcessedColorValue,
@@ -54,7 +55,7 @@ const textViewConfig = {
     },
   },
   uiViewClassName: 'RCTText',
-};
+} as const;
 
 const virtualTextViewConfig = {
   validAttributes: {
@@ -63,7 +64,7 @@ const virtualTextViewConfig = {
     maxFontSizeMultiplier: true,
   },
   uiViewClassName: 'RCTVirtualText',
-};
+} as const;
 
 /**
  * `NativeText` is an internal React Native host component, and is exported to
@@ -77,8 +78,6 @@ const virtualTextViewConfig = {
 // and <View> wrappers so that we no longer have any reason to export these APIs.
 export const NativeText: HostComponent<NativeTextProps> =
   (createReactNativeComponentClass('RCTText', () =>
-    /* $FlowFixMe[incompatible-type] Natural Inference rollout. See
-     * https://fburl.com/workplace/6291gfvu */
     createViewConfig(textViewConfig),
   ): any);
 
@@ -86,7 +85,15 @@ export const NativeVirtualText: HostComponent<NativeTextProps> =
   !global.RN$Bridgeless && !UIManager.hasViewManagerConfig('RCTVirtualText')
     ? NativeText
     : (createReactNativeComponentClass('RCTVirtualText', () =>
-        /* $FlowFixMe[incompatible-type] Natural Inference rollout. See
-         * https://fburl.com/workplace/6291gfvu */
         createViewConfig(virtualTextViewConfig),
       ): any);
+
+export const NativeSelectableText: HostComponent<NativeTextProps> =
+  enablePreparedTextLayout()
+    ? (createReactNativeComponentClass('RCTSelectableText', () =>
+        createViewConfig({
+          ...textViewConfig,
+          uiViewClassName: 'RCTSelectableText',
+        }),
+      ): any)
+    : NativeText;

package/Libraries/Text/TextNativeComponent.win32.js

@@ -13,11 +13,12 @@ import type {ProcessedColorValue} from '../StyleSheet/processColor';
 import type {GestureResponderEvent} from '../Types/CoreEventTypes';
 import type {TextProps} from './TextProps';
 
+import {enablePreparedTextLayout} from '../../src/private/featureflags/ReactNativeFeatureFlags';
 import {createViewConfig} from '../NativeComponent/ViewConfig';
 import UIManager from '../ReactNative/UIManager';
 import createReactNativeComponentClass from '../Renderer/shims/createReactNativeComponentClass';
 
-export type NativeTextProps = $ReadOnly<{
+export type NativeTextProps = Readonly<{
   ...TextProps,
   isHighlighted?: ?boolean,
   selectionColor?: ?ProcessedColorValue,
@@ -88,7 +89,7 @@ const textViewConfig = {
     },
   },
   uiViewClassName: 'RCTText',
-};
+} as const;
 
 const virtualTextViewConfig = {
   validAttributes: {
@@ -97,7 +98,7 @@ const virtualTextViewConfig = {
     maxFontSizeMultiplier: true,
   },
   uiViewClassName: 'RCTVirtualText',
-};
+} as const;
 
 /**
  * `NativeText` is an internal React Native host component, and is exported to
@@ -111,8 +112,6 @@ const virtualTextViewConfig = {
 // and <View> wrappers so that we no longer have any reason to export these APIs.
 export const NativeText: HostComponent<NativeTextProps> =
   (createReactNativeComponentClass('RCTText', () =>
-    /* $FlowFixMe[incompatible-type] Natural Inference rollout. See
-     * https://fburl.com/workplace/6291gfvu */
     createViewConfig(textViewConfig),
   ): any);
 
@@ -121,7 +120,15 @@ export const NativeVirtualText: HostComponent<NativeTextProps> =
   UIManager.getViewManagerConfig('RCTVirtualText') == null
     ? NativeText
     : (createReactNativeComponentClass('RCTVirtualText', () =>
-        /* $FlowFixMe[incompatible-type] Natural Inference rollout. See
-         * https://fburl.com/workplace/6291gfvu */
         createViewConfig(virtualTextViewConfig),
       ): any);
+
+export const NativeSelectableText: HostComponent<NativeTextProps> =
+  enablePreparedTextLayout()
+    ? (createReactNativeComponentClass('RCTSelectableText', () =>
+        createViewConfig({
+          ...textViewConfig,
+          uiViewClassName: 'RCTSelectableText',
+        }),
+      ): any)
+    : NativeText;

package/Libraries/Text/TextProps.js

@@ -25,14 +25,14 @@ import type {
 
 import * as React from 'react';
 
-export type PressRetentionOffset = $ReadOnly<{
+export type PressRetentionOffset = Readonly<{
   top: number,
   left: number,
   bottom: number,
   right: number,
 }>;
 
-type TextPointerEventProps = $ReadOnly<{
+type TextPointerEventProps = Readonly<{
   onPointerEnter?: (event: PointerEvent) => void,
   onPointerLeave?: (event: PointerEvent) => void,
   onPointerMove?: (event: PointerEvent) => void,
@@ -121,7 +121,7 @@ export type TextPropsAndroid = {
   minimumFontScale?: ?number,
 };
 
-type TextBaseProps = $ReadOnly<{
+type TextBaseProps = Readonly<{
   onAccessibilityAction?: ?(event: AccessibilityActionEvent) => unknown,
 
   /**
@@ -268,7 +268,7 @@ type TextBaseProps = $ReadOnly<{
 /**
  * @see https://reactnative.dev/docs/text#reference
  */
-export type TextProps = $ReadOnly<{
+export type TextProps = Readonly<{
   ...TextPointerEventProps,
   ...TextPropsIOS,
   ...TextPropsAndroid,

package/Libraries/Text/TextProps.win32.js

@@ -25,14 +25,14 @@ import type {
 
 import * as React from 'react';
 
-export type PressRetentionOffset = $ReadOnly<{
+export type PressRetentionOffset = Readonly<{
   top: number,
   left: number,
   bottom: number,
   right: number,
 }>;
 
-type TextPointerEventProps = $ReadOnly<{
+type TextPointerEventProps = Readonly<{
   onPointerEnter?: (event: PointerEvent) => void,
   onPointerLeave?: (event: PointerEvent) => void,
   onPointerMove?: (event: PointerEvent) => void,
@@ -121,7 +121,7 @@ export type TextPropsAndroid = {
   minimumFontScale?: ?number,
 };
 
-type TextBaseProps = $ReadOnly<{
+type TextBaseProps = Readonly<{
   onAccessibilityAction?: ?(event: AccessibilityActionEvent) => unknown,
   accessibilityControls?: ?Stringish, // Win32
   accessibilityDescribedBy?: ?Stringish, // Win32
@@ -282,7 +282,7 @@ type TextBaseProps = $ReadOnly<{
 /**
  * @see https://reactnative.dev/docs/text#reference
  */
-export type TextProps = $ReadOnly<{
+export type TextProps = Readonly<{
   ...TextPointerEventProps,
   ...TextPropsIOS,
   ...TextPropsAndroid,

package/Libraries/Types/CodegenTypes.js

@@ -33,7 +33,7 @@ export type Int32 = number;
 export type UnsafeObject = Object;
 export type UnsafeMixed = unknown;
 
-type DefaultTypes = number | boolean | string | $ReadOnlyArray<string>;
+type DefaultTypes = number | boolean | string | ReadonlyArray<string>;
 // Default handling, ignore the unused value
 // we're only using it for type checking
 //

package/Libraries/Types/CoreEventTypes.js

@@ -10,12 +10,12 @@
 
 import type {HostInstance} from '../../src/private/types/HostInstance';
 
-export type NativeSyntheticEvent<+T> = $ReadOnly<{
+export type NativeSyntheticEvent<+T> = Readonly<{
   bubbles: ?boolean,
   cancelable: ?boolean,
   currentTarget: number | HostInstance,
   defaultPrevented: ?boolean,
-  dispatchConfig: $ReadOnly<{
+  dispatchConfig: Readonly<{
     registrationName: string,
   }>,
   eventPhase: ?number,
@@ -31,14 +31,14 @@ export type NativeSyntheticEvent<+T> = $ReadOnly<{
   type: ?string,
 }>;
 
-export type ResponderSyntheticEvent<T> = $ReadOnly<{
+export type ResponderSyntheticEvent<T> = Readonly<{
   ...NativeSyntheticEvent<T>,
-  touchHistory: $ReadOnly<{
+  touchHistory: Readonly<{
     indexOfSingleActiveTouch: number,
     mostRecentTimeStamp: number,
     numberActiveTouches: number,
-    touchBank: $ReadOnlyArray<
-      $ReadOnly<{
+    touchBank: ReadonlyArray<
+      Readonly<{
         touchActive: boolean,
         startPageX: number,
         startPageY: number,
@@ -54,14 +54,14 @@ export type ResponderSyntheticEvent<T> = $ReadOnly<{
   }>,
 }>;
 
-export type LayoutRectangle = $ReadOnly<{
+export type LayoutRectangle = Readonly<{
   x: number,
   y: number,
   width: number,
   height: number,
 }>;
 
-export type TextLayoutLine = $ReadOnly<{
+export type TextLayoutLine = Readonly<{
   ...LayoutRectangle,
   ascender: number,
   capHeight: number,
@@ -71,12 +71,12 @@ export type TextLayoutLine = $ReadOnly<{
 }>;
 
 export type LayoutChangeEvent = NativeSyntheticEvent<
-  $ReadOnly<{
+  Readonly<{
     layout: LayoutRectangle,
   }>,
 >;
 
-type TextLayoutEventData = $ReadOnly<{
+type TextLayoutEventData = Readonly<{
   lines: Array<TextLayoutLine>,
 }>;
 
@@ -220,11 +220,11 @@ export interface NativePointerEvent extends NativeMouseEvent {
 
 export type PointerEvent = NativeSyntheticEvent<NativePointerEvent>;
 
-export type NativeTouchEvent = $ReadOnly<{
+export type NativeTouchEvent = Readonly<{
   /**
    * Array of all touch events that have changed since the last event
    */
-  changedTouches: $ReadOnlyArray<NativeTouchEvent>,
+  changedTouches: ReadonlyArray<NativeTouchEvent>,
   /**
    * 3D Touch reported force
    * @platform ios
@@ -261,34 +261,34 @@ export type NativeTouchEvent = $ReadOnly<{
   /**
    * Array of all current touches on the screen
    */
-  touches: $ReadOnlyArray<NativeTouchEvent>,
+  touches: ReadonlyArray<NativeTouchEvent>,
 }>;
 
 export type GestureResponderEvent = ResponderSyntheticEvent<NativeTouchEvent>;
 
-export type NativeScrollRectangle = $ReadOnly<{
+export type NativeScrollRectangle = Readonly<{
   bottom: number,
   left: number,
   right: number,
   top: number,
 }>;
 
-export type NativeScrollPoint = $ReadOnly<{
+export type NativeScrollPoint = Readonly<{
   y: number,
   x: number,
 }>;
 
-export type NativeScrollVelocity = $ReadOnly<{
+export type NativeScrollVelocity = Readonly<{
   y: number,
   x: number,
 }>;
 
-export type NativeScrollSize = $ReadOnly<{
+export type NativeScrollSize = Readonly<{
   height: number,
   width: number,
 }>;
 
-export type NativeScrollEvent = $ReadOnly<{
+export type NativeScrollEvent = Readonly<{
   contentInset: NativeScrollRectangle,
   contentOffset: NativeScrollPoint,
   contentSize: NativeScrollSize,
@@ -304,7 +304,7 @@ export type NativeScrollEvent = $ReadOnly<{
 
 export type ScrollEvent = NativeSyntheticEvent<NativeScrollEvent>;
 
-export type TargetedEvent = $ReadOnly<{
+export type TargetedEvent = Readonly<{
   target: number,
   ...
 }>;
@@ -314,7 +314,7 @@ export type BlurEvent = NativeSyntheticEvent<TargetedEvent>;
 export type FocusEvent = NativeSyntheticEvent<TargetedEvent>;
 
 export type MouseEvent = NativeSyntheticEvent<
-  $ReadOnly<{
+  Readonly<{
     clientX: number,
     clientY: number,
     pageX: number,
@@ -323,7 +323,7 @@ export type MouseEvent = NativeSyntheticEvent<
   }>,
 >;
 
-export type KeyEvent = $ReadOnly<{
+export type KeyEvent = Readonly<{
   /**
    * The actual key that was pressed. For example, F would be "f" or "F" depending on the shift key.
    * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key

package/Libraries/Types/CoreEventTypes.win32.js

@@ -10,12 +10,12 @@
 
 import type {HostInstance} from '../../src/private/types/HostInstance';
 
-export type NativeSyntheticEvent<+T> = $ReadOnly<{
+export type NativeSyntheticEvent<+T> = Readonly<{
   bubbles: ?boolean,
   cancelable: ?boolean,
   currentTarget: number | HostInstance,
   defaultPrevented: ?boolean,
-  dispatchConfig: $ReadOnly<{
+  dispatchConfig: Readonly<{
     registrationName: string,
   }>,
   eventPhase: ?number,
@@ -31,14 +31,14 @@ export type NativeSyntheticEvent<+T> = $ReadOnly<{
   type: ?string,
 }>;
 
-export type ResponderSyntheticEvent<T> = $ReadOnly<{
+export type ResponderSyntheticEvent<T> = Readonly<{
   ...NativeSyntheticEvent<T>,
-  touchHistory: $ReadOnly<{
+  touchHistory: Readonly<{
     indexOfSingleActiveTouch: number,
     mostRecentTimeStamp: number,
     numberActiveTouches: number,
-    touchBank: $ReadOnlyArray<
-      $ReadOnly<{
+    touchBank: ReadonlyArray<
+      Readonly<{
         touchActive: boolean,
         startPageX: number,
         startPageY: number,
@@ -54,14 +54,14 @@ export type ResponderSyntheticEvent<T> = $ReadOnly<{
   }>,
 }>;
 
-export type LayoutRectangle = $ReadOnly<{
+export type LayoutRectangle = Readonly<{
   x: number,
   y: number,
   width: number,
   height: number,
 }>;
 
-export type TextLayoutLine = $ReadOnly<{
+export type TextLayoutLine = Readonly<{
   ...LayoutRectangle,
   ascender: number,
   capHeight: number,
@@ -71,12 +71,12 @@ export type TextLayoutLine = $ReadOnly<{
 }>;
 
 export type LayoutChangeEvent = NativeSyntheticEvent<
-  $ReadOnly<{
+  Readonly<{
     layout: LayoutRectangle,
   }>,
 >;
 
-type TextLayoutEventData = $ReadOnly<{
+type TextLayoutEventData = Readonly<{
   lines: Array<TextLayoutLine>,
 }>;
 
@@ -230,17 +230,18 @@ export interface NativePointerEvent extends NativeMouseEvent {
 
 export type PointerEvent = NativeSyntheticEvent<NativePointerEvent>;
 
-export type NativeTouchEvent = $ReadOnly<{
+export type NativeTouchEvent = Readonly<{
   altKey: ?boolean, // TODO(macOS)
 
   button: ?number, // TODO(macOS)
   /**
    * Array of all touch events that have changed since the last event
    */
-  changedTouches: $ReadOnlyArray<NativeTouchEvent>,
+  changedTouches: ReadonlyArray<NativeTouchEvent>,
 
   ctrlKey: ?boolean, // TODO(macOS)
 
+
   /**
    * 3D Touch reported force
    * @platform ios
@@ -282,34 +283,34 @@ export type NativeTouchEvent = $ReadOnly<{
   /**
    * Array of all current touches on the screen
    */
-  touches: $ReadOnlyArray<NativeTouchEvent>,
+  touches: ReadonlyArray<NativeTouchEvent>,
 }>;
 
 export type GestureResponderEvent = ResponderSyntheticEvent<NativeTouchEvent>;
 
-export type NativeScrollRectangle = $ReadOnly<{
+export type NativeScrollRectangle = Readonly<{
   bottom: number,
   left: number,
   right: number,
   top: number,
 }>;
 
-export type NativeScrollPoint = $ReadOnly<{
+export type NativeScrollPoint = Readonly<{
   y: number,
   x: number,
 }>;
 
-export type NativeScrollVelocity = $ReadOnly<{
+export type NativeScrollVelocity = Readonly<{
   y: number,
   x: number,
 }>;
 
-export type NativeScrollSize = $ReadOnly<{
+export type NativeScrollSize = Readonly<{
   height: number,
   width: number,
 }>;
 
-export type NativeScrollEvent = $ReadOnly<{
+export type NativeScrollEvent = Readonly<{
   contentInset: NativeScrollRectangle,
   contentOffset: NativeScrollPoint,
   contentSize: NativeScrollSize,
@@ -325,7 +326,7 @@ export type NativeScrollEvent = $ReadOnly<{
 
 export type ScrollEvent = NativeSyntheticEvent<NativeScrollEvent>;
 
-export type TargetedEvent = $ReadOnly<{
+export type TargetedEvent = Readonly<{
   target: number,
   ...
 }>;
@@ -338,7 +339,7 @@ export type FocusEvent = NativeSyntheticEvent<TargetedEvent>;
 // introduced for react-native-web. Replace typings with our values to catch
 // anything dependent on react-native-web specific values
 export type MouseEvent = NativeSyntheticEvent<
-  $ReadOnly<{
+  Readonly<{
     target: number,
     identifier: number,
     clientX: number,
@@ -362,7 +363,7 @@ export type MouseEvent = NativeSyntheticEvent<
   }>,
 >;
 // Windows]
-export type KeyEvent = $ReadOnly<{
+export type KeyEvent = Readonly<{
   /**
    * The actual key that was pressed. For example, F would be "f" or "F" depending on the shift key.
    * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key

package/Libraries/Types/ReactDevToolsTypes.js

@@ -34,12 +34,12 @@ export type ReactDevToolsAgentEvents = {
 export type ReactDevToolsAgent = {
   selectNode(node: unknown): void,
   stopInspectingNative(value: boolean): void,
-  addListener<Event: $Keys<ReactDevToolsAgentEvents>>(
+  addListener<Event: keyof ReactDevToolsAgentEvents>(
     event: Event,
     listener: (...ReactDevToolsAgentEvents[Event]) => void,
   ): void,
   removeListener(
-    event: $Keys<ReactDevToolsAgentEvents>,
+    event: keyof ReactDevToolsAgentEvents,
     listener: () => void,
   ): void,
 };

package/Libraries/Utilities/Appearance.js

@@ -99,7 +99,12 @@ export function setColorScheme(colorScheme: ColorSchemeName): void {
   if (NativeAppearance != null) {
     NativeAppearance.setColorScheme(colorScheme);
     state.appearance = {
-      colorScheme,
+      // When setting to 'unspecified', get the actual system color scheme.
+      // Fall back to the passed value if getColorScheme() returns null.
+      colorScheme:
+        colorScheme === 'unspecified'
+          ? (NativeAppearance.getColorScheme() ?? colorScheme)
+          : colorScheme,
     };
   }
 }

package/Libraries/Utilities/Dimensions.js

@@ -60,7 +60,7 @@ class Dimensions {
    *
    * @param {DimensionsPayload} dims Simple string-keyed object of dimensions to set
    */
-  static set(dims: $ReadOnly<DimensionsPayload>): void {
+  static set(dims: Readonly<DimensionsPayload>): void {
     // We calculate the window dimensions in JS so that we don't encounter loss of
     // precision in transferring the dimensions (which could be non-integers) over
     // the bridge.

package/Libraries/Utilities/Dimensions.win32.js

@@ -64,7 +64,7 @@ class Dimensions {
    *
    * @param {DimensionsPayload} dims Simple string-keyed object of dimensions to set
    */
-  static set(dims: $ReadOnly<DimensionsPayload>): void {
+  static set(dims: Readonly<DimensionsPayload>): void {
     let {screen, window} = dims;
     const {windowPhysicalPixels} = dims;
     if (windowPhysicalPixels) {

package/Libraries/Utilities/HMRClient.js

@@ -26,7 +26,7 @@ let hmrUnavailableReason: string | null = null;
 let hmrOrigin: string | null = null;
 let currentCompileErrorMessage: string | null = null;
 let didConnect: boolean = false;
-let pendingLogs: Array<[LogLevel, $ReadOnlyArray<unknown>]> = [];
+let pendingLogs: Array<[LogLevel, ReadonlyArray<unknown>]> = [];
 
 type LogLevel =
   | 'trace'
@@ -43,7 +43,7 @@ export type HMRClientNativeInterface = {
   enable(): void,
   disable(): void,
   registerBundle(requestUrl: string): void,
-  log(level: LogLevel, data: $ReadOnlyArray<unknown>): void,
+  log(level: LogLevel, data: ReadonlyArray<unknown>): void,
   setup(
     platform: string,
     bundleEntry: string,
@@ -113,7 +113,7 @@ const HMRClient: HMRClientNativeInterface = {
     registerBundleEntryPoints(hmrClient);
   },
 
-  log(level: LogLevel, data: $ReadOnlyArray<unknown>) {
+  log(level: LogLevel, data: ReadonlyArray<unknown>) {
     if (!hmrClient) {
       // Catch a reasonable number of early logs
       // in case hmrClient gets initialized later.
@@ -141,7 +141,7 @@ const HMRClient: HMRClientNativeInterface = {
           ),
         }),
       );
-    } catch (error) {
+    } catch {
       // If sending logs causes any failures we want to silently ignore them
       // to ensure we do not cause infinite-logging loops.
     }
@@ -212,6 +212,7 @@ Error: ${e.message}`;
     });
 
     let pendingUpdatesCount = 0;
+    let lastMarkerChangeId: string | null = null;
     client.on('update-start', ({isInitialUpdate}) => {
       pendingUpdatesCount++;
       currentCompileErrorMessage = null;
@@ -229,10 +230,15 @@ Error: ${e.message}`;
       }
     });
 
-    client.on('update-done', () => {
+    client.on('update-done', body => {
       pendingUpdatesCount--;
       if (pendingUpdatesCount === 0) {
         DevLoadingView.hide();
+        const changeId = body?.changeId;
+        if (changeId != null && changeId !== lastMarkerChangeId) {
+          lastMarkerChangeId = changeId;
+          emitFastRefreshCompleteEvents();
+        }
       }
     });
 
@@ -379,4 +385,25 @@ function showCompileError() {
   throw error;
 }
 
+function emitFastRefreshCompleteEvents() {
+  // Add marker entry in performance timeline
+  performance.mark('Fast Refresh - Update done', {
+    detail: {
+      devtools: {
+        dataType: 'marker',
+        color: 'primary',
+        tooltipText: 'Fast Refresh \u269b',
+      },
+    },
+  });
+
+  // Notify CDP clients via internal binding
+  if (
+    // $FlowFixMe[prop-missing] - Injected by RuntimeTarget
+    typeof globalThis.__notifyFastRefreshComplete === 'function'
+  ) {
+    globalThis.__notifyFastRefreshComplete();
+  }
+}
+
 export default HMRClient;

package/Libraries/Utilities/IPerformanceLogger.js

@@ -34,10 +34,10 @@ export interface IPerformanceLogger {
   clearCompleted(): void;
   close(): void;
   currentTimestamp(): number;
-  getExtras(): $ReadOnly<{[key: string]: ?ExtraValue, ...}>;
-  getPoints(): $ReadOnly<{[key: string]: ?number, ...}>;
-  getPointExtras(): $ReadOnly<{[key: string]: ?Extras, ...}>;
-  getTimespans(): $ReadOnly<{[key: string]: ?Timespan, ...}>;
+  getExtras(): Readonly<{[key: string]: ?ExtraValue, ...}>;
+  getPoints(): Readonly<{[key: string]: ?number, ...}>;
+  getPointExtras(): Readonly<{[key: string]: ?Extras, ...}>;
+  getTimespans(): Readonly<{[key: string]: ?Timespan, ...}>;
   hasTimespan(key: string): boolean;
   isClosed(): boolean;
   logEverything(): void;

package/Libraries/Utilities/codegenNativeCommands.js

@@ -10,14 +10,14 @@
 
 const {dispatchCommand} = require('../ReactNative/RendererProxy');
 
-type NativeCommandsOptions<T = string> = $ReadOnly<{
-  supportedCommands: $ReadOnlyArray<T>,
+type NativeCommandsOptions<T = string> = Readonly<{
+  supportedCommands: ReadonlyArray<T>,
 }>;
 
 function codegenNativeCommands<T: interface {}>(
-  options: NativeCommandsOptions<$Keys<T>>,
+  options: NativeCommandsOptions<keyof T>,
 ): T {
-  const commandObj: {[$Keys<T>]: (...$ReadOnlyArray<unknown>) => void} = {};
+  const commandObj: {[keyof T]: (...ReadonlyArray<unknown>) => void} = {};
 
   options.supportedCommands.forEach(command => {
     // $FlowFixMe[missing-local-annot]

package/Libraries/Utilities/codegenNativeComponent.d.ts

@@ -14,6 +14,8 @@ interface Options {
   readonly paperComponentName?: string | undefined;
   readonly paperComponentNameDeprecated?: string | undefined;
   readonly excludedPlatforms?: ReadonlyArray<'iOS' | 'android'> | undefined;
+  readonly generateOptionalProperties?: boolean | undefined;
+  readonly generateOptionalObjectProperties?: boolean | undefined;
 }
 
 type NativeComponentType<T> = HostComponent<T>;