@office-iss/react-native-win32 0.0.0-canary.282 → 0.0.0-canary.284

package/Libraries/Components/View/ViewPropTypes.js

@@ -34,7 +34,7 @@ import type {Node} from 'react';
 export type ViewLayout = Layout;
 export type ViewLayoutEvent = LayoutEvent;
 
-type DirectEventProps = $ReadOnly<{|
+type DirectEventProps = $ReadOnly<{
   /**
    * When `accessible` is true, the system will try to invoke this function
    * when the user performs an accessibility custom action.
@@ -78,15 +78,15 @@ type DirectEventProps = $ReadOnly<{|
    * See https://reactnative.dev/docs/view#onaccessibilityescape
    */
   onAccessibilityEscape?: ?() => mixed,
-|}>;
+}>;
 
-type MouseEventProps = $ReadOnly<{|
+type MouseEventProps = $ReadOnly<{
   onMouseEnter?: ?(event: MouseEvent) => void,
   onMouseLeave?: ?(event: MouseEvent) => void,
-|}>;
+}>;
 
 // Experimental/Work in Progress Pointer Event Callbacks (not yet ready for use)
-type PointerEventProps = $ReadOnly<{|
+type PointerEventProps = $ReadOnly<{
   onClick?: ?(event: PointerEvent) => void,
   onClickCapture?: ?(event: PointerEvent) => void,
   onPointerEnter?: ?(event: PointerEvent) => void,
@@ -109,16 +109,16 @@ type PointerEventProps = $ReadOnly<{|
   onGotPointerCaptureCapture?: ?(e: PointerEvent) => void,
   onLostPointerCapture?: ?(e: PointerEvent) => void,
   onLostPointerCaptureCapture?: ?(e: PointerEvent) => void,
-|}>;
+}>;
 
-type FocusEventProps = $ReadOnly<{|
+type FocusEventProps = $ReadOnly<{
   onBlur?: ?(event: BlurEvent) => void,
   onBlurCapture?: ?(event: BlurEvent) => void,
   onFocus?: ?(event: FocusEvent) => void,
   onFocusCapture?: ?(event: FocusEvent) => void,
-|}>;
+}>;
 
-type TouchEventProps = $ReadOnly<{|
+type TouchEventProps = $ReadOnly<{
   onTouchCancel?: ?(e: PressEvent) => void,
   onTouchCancelCapture?: ?(e: PressEvent) => void,
   onTouchEnd?: ?(e: PressEvent) => void,
@@ -127,14 +127,14 @@ type TouchEventProps = $ReadOnly<{|
   onTouchMoveCapture?: ?(e: PressEvent) => void,
   onTouchStart?: ?(e: PressEvent) => void,
   onTouchStartCapture?: ?(e: PressEvent) => void,
-|}>;
+}>;
 
 /**
  * For most touch interactions, you'll simply want to wrap your component in
  * `TouchableHighlight` or `TouchableOpacity`. Check out `Touchable.js`,
  * `ScrollResponder.js` and `ResponderEventPlugin.js` for more discussion.
  */
-type GestureResponderEventProps = $ReadOnly<{|
+type GestureResponderEventProps = $ReadOnly<{
   /**
    * Does this view want to "claim" touch responsiveness? This is called for
    * every touch move on the `View` when it is not the responder.
@@ -249,23 +249,23 @@ type GestureResponderEventProps = $ReadOnly<{|
    * See https://reactnative.dev/docs/view#onstartshouldsetrespondercapture
    */
   onStartShouldSetResponderCapture?: ?(e: PressEvent) => boolean,
-|}>;
+}>;
 
-type AndroidDrawableThemeAttr = $ReadOnly<{|
+type AndroidDrawableThemeAttr = $ReadOnly<{
   type: 'ThemeAttrAndroid',
   attribute: string,
-|}>;
+}>;
 
-type AndroidDrawableRipple = $ReadOnly<{|
+type AndroidDrawableRipple = $ReadOnly<{
   type: 'RippleAndroid',
   color?: ?number,
   borderless?: ?boolean,
   rippleRadius?: ?number,
-|}>;
+}>;
 
 type AndroidDrawable = AndroidDrawableThemeAttr | AndroidDrawableRipple;
 
-type AndroidViewProps = $ReadOnly<{|
+type AndroidViewProps = $ReadOnly<{
   /**
    * Identifies the element that labels the element it is applied to. When the assistive technology focuses on the component with this props,
    * the text is read aloud. The value should should match the nativeID of the related element.
@@ -394,9 +394,9 @@ type AndroidViewProps = $ReadOnly<{|
    * @platform android
    */
   onClick?: ?(event: PressEvent) => mixed,
-|}>;
+}>;
 
-type IOSViewProps = $ReadOnly<{|
+type IOSViewProps = $ReadOnly<{
   /**
    * Prevents view from being inverted if set to true and color inversion is turned on.
    *
@@ -465,9 +465,9 @@ type IOSViewProps = $ReadOnly<{|
    * See https://reactnative.dev/docs/view#shouldrasterizeios
    */
   shouldRasterizeIOS?: ?boolean,
-|}>;
+}>;
 
-export type ViewProps = $ReadOnly<{|
+export type ViewProps = $ReadOnly<{
   ...DirectEventProps,
   ...GestureResponderEventProps,
   ...MouseEventProps,
@@ -644,4 +644,4 @@ export type ViewProps = $ReadOnly<{|
    * See https://reactnative.dev/docs/view#removeclippedsubviews
    */
   removeClippedSubviews?: ?boolean,
-|}>;
+}>;

package/Libraries/Components/View/ViewPropTypes.win32.js

@@ -35,7 +35,7 @@ import type {Node} from 'react';
 export type ViewLayout = Layout;
 export type ViewLayoutEvent = LayoutEvent;
 
-type DirectEventProps = $ReadOnly<{|
+type DirectEventProps = $ReadOnly<{
   /**
    * When `accessible` is true, the system will try to invoke this function
    * when the user performs an accessibility custom action.
@@ -79,15 +79,15 @@ type DirectEventProps = $ReadOnly<{|
    * See https://reactnative.dev/docs/view#onaccessibilityescape
    */
   onAccessibilityEscape?: ?() => mixed,
-|}>;
+}>;
 
-type MouseEventProps = $ReadOnly<{|
+type MouseEventProps = $ReadOnly<{
   onMouseEnter?: ?(event: MouseEvent) => void,
   onMouseLeave?: ?(event: MouseEvent) => void,
-|}>;
+}>;
 
 // Experimental/Work in Progress Pointer Event Callbacks (not yet ready for use)
-type PointerEventProps = $ReadOnly<{|
+type PointerEventProps = $ReadOnly<{
   onClick?: ?(event: PointerEvent) => void,
   onClickCapture?: ?(event: PointerEvent) => void,
   onPointerEnter?: ?(event: PointerEvent) => void,
@@ -110,16 +110,16 @@ type PointerEventProps = $ReadOnly<{|
   onGotPointerCaptureCapture?: ?(e: PointerEvent) => void,
   onLostPointerCapture?: ?(e: PointerEvent) => void,
   onLostPointerCaptureCapture?: ?(e: PointerEvent) => void,
-|}>;
+}>;
 
-type FocusEventProps = $ReadOnly<{|
+type FocusEventProps = $ReadOnly<{
   onBlur?: ?(event: BlurEvent) => void,
   onBlurCapture?: ?(event: BlurEvent) => void,
   onFocus?: ?(event: FocusEvent) => void,
   onFocusCapture?: ?(event: FocusEvent) => void,
-|}>;
+}>;
 
-type TouchEventProps = $ReadOnly<{|
+type TouchEventProps = $ReadOnly<{
   onTouchCancel?: ?(e: PressEvent) => void,
   onTouchCancelCapture?: ?(e: PressEvent) => void,
   onTouchEnd?: ?(e: PressEvent) => void,
@@ -128,14 +128,14 @@ type TouchEventProps = $ReadOnly<{|
   onTouchMoveCapture?: ?(e: PressEvent) => void,
   onTouchStart?: ?(e: PressEvent) => void,
   onTouchStartCapture?: ?(e: PressEvent) => void,
-|}>;
+}>;
 
 /**
  * For most touch interactions, you'll simply want to wrap your component in
  * `TouchableHighlight` or `TouchableOpacity`. Check out `Touchable.js`,
  * `ScrollResponder.js` and `ResponderEventPlugin.js` for more discussion.
  */
-type GestureResponderEventProps = $ReadOnly<{|
+type GestureResponderEventProps = $ReadOnly<{
   /**
    * Does this view want to "claim" touch responsiveness? This is called for
    * every touch move on the `View` when it is not the responder.
@@ -250,23 +250,23 @@ type GestureResponderEventProps = $ReadOnly<{|
    * See https://reactnative.dev/docs/view#onstartshouldsetrespondercapture
    */
   onStartShouldSetResponderCapture?: ?(e: PressEvent) => boolean,
-|}>;
+}>;
 
-type AndroidDrawableThemeAttr = $ReadOnly<{|
+type AndroidDrawableThemeAttr = $ReadOnly<{
   type: 'ThemeAttrAndroid',
   attribute: string,
-|}>;
+}>;
 
-type AndroidDrawableRipple = $ReadOnly<{|
+type AndroidDrawableRipple = $ReadOnly<{
   type: 'RippleAndroid',
   color?: ?number,
   borderless?: ?boolean,
   rippleRadius?: ?number,
-|}>;
+}>;
 
 type AndroidDrawable = AndroidDrawableThemeAttr | AndroidDrawableRipple;
 
-type AndroidViewProps = $ReadOnly<{|
+type AndroidViewProps = $ReadOnly<{
   /**
    * Identifies the element that labels the element it is applied to. When the assistive technology focuses on the component with this props,
    * the text is read aloud. The value should should match the nativeID of the related element.
@@ -395,9 +395,9 @@ type AndroidViewProps = $ReadOnly<{|
    * @platform android
    */
   onClick?: ?(event: PressEvent) => mixed,
-|}>;
+}>;
 
-type IOSViewProps = $ReadOnly<{|
+type IOSViewProps = $ReadOnly<{
   /**
    * Prevents view from being inverted if set to true and color inversion is turned on.
    *
@@ -466,7 +466,7 @@ type IOSViewProps = $ReadOnly<{|
    * See https://reactnative.dev/docs/view#shouldrasterizeios
    */
   shouldRasterizeIOS?: ?boolean,
-|}>;
+}>;
 
 // [Windows
 
@@ -527,7 +527,7 @@ type WindowsViewProps = $ReadOnly<{|
 |}>;
 // Windows]
 
-export type ViewProps = $ReadOnly<{|
+export type ViewProps = $ReadOnly<{
   ...DirectEventProps,
   ...GestureResponderEventProps,
   ...MouseEventProps,
@@ -728,4 +728,4 @@ export type ViewProps = $ReadOnly<{|
    * @platform win32
    */
   accessibilityControls?: ?string,
-|}>;
+}>;

package/Libraries/Core/RawEventEmitter.js

@@ -12,13 +12,13 @@ import type {IEventEmitter} from '../vendor/emitter/EventEmitter';
 
 import EventEmitter from '../vendor/emitter/EventEmitter';
 
-export type RawEventEmitterEvent = $ReadOnly<{|
+export type RawEventEmitterEvent = $ReadOnly<{
   eventName: string,
   // We expect, but do not/cannot require, that nativeEvent is an object
   // with the properties: key, elementType (string), type (string), tag (numeric),
   // and a stateNode of the native element/Fiber the event was emitted to.
   nativeEvent: {[string]: mixed},
-|}>;
+}>;
 
 type RawEventDefinitions = {
   [eventChannel: string]: [RawEventEmitterEvent],

package/Libraries/Core/ReactNativeVersion.js

@@ -8,16 +8,14 @@
  * @generated by scripts/releases/set-version.js
  */
 
-const version: $ReadOnly<{
+export const version: $ReadOnly<{
   major: number,
   minor: number,
   patch: number,
   prerelease: string | null,
 }> = {
   major: 0,
-  minor: 78,
+  minor: 79,
   patch: 0,
-  prerelease: 'nightly-20250113-d4407d6f7',
+  prerelease: 'nightly-20250123-d1028885e',
 };
-
-module.exports = {version};

package/Libraries/Core/Timers/JSTimers.js

@@ -10,7 +10,7 @@
 
 import NativeTiming from './NativeTiming';
 
-const BatchedBridge = require('../../BatchedBridge/BatchedBridge');
+const BatchedBridge = require('../../BatchedBridge/BatchedBridge').default;
 const Systrace = require('../../Performance/Systrace');
 const invariant = require('invariant');
 
@@ -452,7 +452,7 @@ function setSendIdleEvents(sendIdleEvents: boolean): void {
   NativeTiming.setSendIdleEvents(sendIdleEvents);
 }
 
-let ExportedJSTimers: {|
+let ExportedJSTimers: {
   callIdleCallbacks: (frameTime: number) => any | void,
   callReactNativeMicrotasks: () => void,
   callTimers: (timersToCall: Array<number>) => any | void,
@@ -467,7 +467,7 @@ let ExportedJSTimers: {|
   queueReactNativeMicrotask: (func: any, ...args: any) => number,
   setInterval: (func: any, duration: number, ...args: any) => number,
   setTimeout: (func: any, duration: number, ...args: any) => number,
-|};
+};
 
 if (!NativeTiming) {
   console.warn("Timing native module is not available, can't set timers.");

package/Libraries/Core/polyfillPromise.js

@@ -34,5 +34,5 @@ if (global?.HermesInternal?.hasPromise?.()) {
     );
   }
 } else {
-  polyfillGlobal('Promise', () => require('../Promise'));
+  polyfillGlobal('Promise', () => require('../Promise').default);
 }

package/Libraries/Core/registerCallableModule.js

@@ -28,7 +28,7 @@ const registerCallableModule: RegisterCallableModule = (function () {
     };
   }
 
-  const BatchedBridge = require('../BatchedBridge/BatchedBridge');
+  const BatchedBridge = require('../BatchedBridge/BatchedBridge').default;
   return (name, moduleOrFactory) => {
     if (typeof moduleOrFactory === 'function') {
       BatchedBridge.registerLazyCallableModule(name, moduleOrFactory);

package/Libraries/Core/setUpAlert.js

@@ -18,6 +18,6 @@ if (!global.alert) {
   global.alert = function (text: string) {
     // Require Alert on demand. Requiring it too early can lead to issues
     // with things like Platform not being fully initialized.
-    require('../Alert/Alert').alert('Alert', '' + text);
+    require('../Alert/Alert').default.alert('Alert', '' + text);
   };
 }

package/Libraries/Core/setUpDeveloperTools.js

@@ -17,8 +17,6 @@ declare var console: {[string]: $FlowFixMe};
  * You can use this module directly, or just require InitializeCore.
  */
 if (__DEV__) {
-  require('./setUpReactDevTools');
-
   // Set up inspector
   const JSInspector = require('../JSInspector/JSInspector');
   JSInspector.registerAgent(require('../JSInspector/NetworkAgent'));

package/Libraries/Core/setUpErrorHandling.js

@@ -10,6 +10,11 @@
 
 'use strict';
 
+if (__DEV__) {
+  // React DevTools need to be set up before the console.error patch.
+  require('./setUpReactDevTools');
+}
+
 if (global.RN$useAlwaysAvailableJSErrorHandling !== true) {
   /**
    * Sets up the console and exception handling (redbox) for React Native.
@@ -29,7 +34,7 @@ if (global.RN$useAlwaysAvailableJSErrorHandling !== true) {
       }
     };
 
-    const ErrorUtils = require('../vendor/core/ErrorUtils');
+    const ErrorUtils = require('../vendor/core/ErrorUtils').default;
     ErrorUtils.setGlobalHandler(handleError);
   }
 }

package/Libraries/Core/setUpReactDevTools.js

@@ -114,7 +114,7 @@ if (__DEV__) {
     // not when debugging in chrome
     // TODO(t12832058) This check is broken
     if (!window.document) {
-      const AppState = require('../AppState/AppState');
+      const AppState = require('../AppState/AppState').default;
       const getDevServer = require('./Devtools/getDevServer');
 
       // Don't steal the DevTools from currently active app.

package/Libraries/Core/setUpTimers.js

@@ -10,9 +10,6 @@
 
 'use strict';
 
-const ReactNativeFeatureFlags = require('../../src/private/featureflags/ReactNativeFeatureFlags');
-const NativeReactNativeFeatureFlags =
-  require('../../src/private/featureflags/specs/NativeReactNativeFeatureFlags').default;
 const {polyfillGlobal} = require('../Utilities/PolyfillFunctions');
 
 if (__DEV__) {
@@ -21,45 +18,8 @@ if (__DEV__) {
   }
 }
 
-const isEventLoopEnabled = (() => {
-  if (NativeReactNativeFeatureFlags == null) {
-    return false;
-  }
-
-  return (
-    ReactNativeFeatureFlags.enableBridgelessArchitecture() &&
-    !ReactNativeFeatureFlags.disableEventLoopOnBridgeless()
-  );
-})();
-
 // In bridgeless mode, timers are host functions installed from cpp.
-if (global.RN$Bridgeless !== true) {
-  /**
-   * Set up timers.
-   * You can use this module directly, or just require InitializeCore.
-   */
-  const defineLazyTimer = (
-    name:
-      | 'cancelAnimationFrame'
-      | 'cancelIdleCallback'
-      | 'clearInterval'
-      | 'clearTimeout'
-      | 'requestAnimationFrame'
-      | 'requestIdleCallback'
-      | 'setInterval'
-      | 'setTimeout',
-  ) => {
-    polyfillGlobal(name, () => require('./Timers/JSTimers')[name]);
-  };
-  defineLazyTimer('setTimeout');
-  defineLazyTimer('clearTimeout');
-  defineLazyTimer('setInterval');
-  defineLazyTimer('clearInterval');
-  defineLazyTimer('requestAnimationFrame');
-  defineLazyTimer('cancelAnimationFrame');
-  defineLazyTimer('requestIdleCallback');
-  defineLazyTimer('cancelIdleCallback');
-} else if (isEventLoopEnabled) {
+if (global.RN$Bridgeless === true) {
   polyfillGlobal(
     'requestIdleCallback',
     () =>
@@ -73,12 +33,7 @@ if (global.RN$Bridgeless !== true) {
       require('../../src/private/webapis/idlecallbacks/specs/NativeIdleCallbacks')
         .default.cancelIdleCallback,
   );
-}
 
-// We need to check if the native module is available before accessing the
-// feature flag, because otherwise the API would throw an error in the legacy
-// architecture in OSS, where the native module isn't available.
-if (isEventLoopEnabled) {
   // This is the flag that tells React to use `queueMicrotask` to batch state
   // updates, instead of using the scheduler to schedule a regular task.
   // We use a global variable because we don't currently have any other
@@ -103,6 +58,32 @@ if (isEventLoopEnabled) {
     () => require('./Timers/immediateShim').clearImmediate,
   );
 } else {
+  /**
+   * Set up timers.
+   * You can use this module directly, or just require InitializeCore.
+   */
+  const defineLazyTimer = (
+    name:
+      | 'cancelAnimationFrame'
+      | 'cancelIdleCallback'
+      | 'clearInterval'
+      | 'clearTimeout'
+      | 'requestAnimationFrame'
+      | 'requestIdleCallback'
+      | 'setInterval'
+      | 'setTimeout',
+  ) => {
+    polyfillGlobal(name, () => require('./Timers/JSTimers')[name]);
+  };
+  defineLazyTimer('setTimeout');
+  defineLazyTimer('clearTimeout');
+  defineLazyTimer('setInterval');
+  defineLazyTimer('clearInterval');
+  defineLazyTimer('requestAnimationFrame');
+  defineLazyTimer('cancelAnimationFrame');
+  defineLazyTimer('requestIdleCallback');
+  defineLazyTimer('cancelIdleCallback');
+
   // Polyfill it with promise (regardless it's polyfilled or native) otherwise.
   polyfillGlobal(
     'queueMicrotask',
@@ -112,14 +93,12 @@ if (isEventLoopEnabled) {
   // When promise was polyfilled hence is queued to the RN microtask queue,
   // we polyfill the immediate APIs as aliases to the ReactNativeMicrotask APIs.
   // Note that in bridgeless mode, immediate APIs are installed from cpp.
-  if (global.RN$Bridgeless !== true) {
-    polyfillGlobal(
-      'setImmediate',
-      () => require('./Timers/JSTimers').queueReactNativeMicrotask,
-    );
-    polyfillGlobal(
-      'clearImmediate',
-      () => require('./Timers/JSTimers').clearReactNativeMicrotask,
-    );
-  }
+  polyfillGlobal(
+    'setImmediate',
+    () => require('./Timers/JSTimers').queueReactNativeMicrotask,
+  );
+  polyfillGlobal(
+    'clearImmediate',
+    () => require('./Timers/JSTimers').clearReactNativeMicrotask,
+  );
 }

package/Libraries/Core/setUpXHR.js

@@ -26,11 +26,11 @@ polyfillGlobal('Headers', () => require('../Network/fetch').Headers);
 polyfillGlobal('Request', () => require('../Network/fetch').Request);
 polyfillGlobal('Response', () => require('../Network/fetch').Response);
 polyfillGlobal('WebSocket', () => require('../WebSocket/WebSocket'));
-polyfillGlobal('Blob', () => require('../Blob/Blob'));
-polyfillGlobal('File', () => require('../Blob/File'));
-polyfillGlobal('FileReader', () => require('../Blob/FileReader'));
-polyfillGlobal('URL', () => require('../Blob/URL').URL); // flowlint-line untyped-import:off
-polyfillGlobal('URLSearchParams', () => require('../Blob/URL').URLSearchParams); // flowlint-line untyped-import:off
+polyfillGlobal('Blob', () => require('../Blob/Blob').default);
+polyfillGlobal('File', () => require('../Blob/File').default);
+polyfillGlobal('FileReader', () => require('../Blob/FileReader').default);
+polyfillGlobal('URL', () => require('../Blob/URL').URL);
+polyfillGlobal('URLSearchParams', () => require('../Blob/URL').URLSearchParams);
 polyfillGlobal(
   'AbortController',
   () => require('abort-controller/dist/abort-controller').AbortController, // flowlint-line untyped-import:off

package/Libraries/EventEmitter/RCTDeviceEventEmitter.js

@@ -14,7 +14,8 @@ import {beginEvent, endEvent} from '../Performance/Systrace';
 import EventEmitter from '../vendor/emitter/EventEmitter';
 
 // FIXME: use typed events
-type RCTDeviceEventDefinitions = $FlowFixMe;
+/* $FlowFixMe[unclear-type] unclear type of events */
+type RCTDeviceEventDefinitions = {[name: string]: Array<any>};
 
 /**
  * Global EventEmitter used by the native platform to emit events to JavaScript.

package/Libraries/Events/CustomEvent.js

@@ -11,12 +11,12 @@
 // Make sure global Event is defined
 import EventPolyfill from './EventPolyfill';
 
-type CustomEvent$Options = $ReadOnly<{|
+type CustomEvent$Options = $ReadOnly<{
   bubbles?: boolean,
   cancelable?: boolean,
   composed?: boolean,
   detail?: {...},
-|}>;
+}>;
 
 class CustomEvent extends EventPolyfill {
   detail: ?{...};

package/Libraries/Image/AssetRegistry.js

@@ -10,4 +10,9 @@
 
 'use strict';
 
-module.exports = require('@react-native/assets-registry/registry');
+import type {PackagerAsset} from '@react-native/assets-registry/registry';
+
+module.exports = require('@react-native/assets-registry/registry') as {
+  registerAsset: (asset: PackagerAsset) => number,
+  getAssetByID: (assetId: number) => PackagerAsset,
+};

package/Libraries/Image/AssetSourceResolver.js

@@ -10,13 +10,13 @@
 
 'use strict';
 
-export type ResolvedAssetSource = {|
+export type ResolvedAssetSource = {
   +__packager_asset: boolean,
   +width: ?number,
   +height: ?number,
   +uri: string,
   +scale: number,
-|};
+};
 
 import type {
   AssetDestPathResolver,

package/Libraries/Image/ImageProps.js

@@ -24,16 +24,16 @@ import type {ImageSource} from './ImageSource';
 import type {ElementRef, Node, RefSetter} from 'react';
 
 export type ImageLoadEvent = SyntheticEvent<
-  $ReadOnly<{|
-    source: $ReadOnly<{|
+  $ReadOnly<{
+    source: $ReadOnly<{
       width: number,
       height: number,
       uri: string,
-    |}>,
-  |}>,
+    }>,
+  }>,
 >;
 
-type IOSImageProps = $ReadOnly<{|
+type IOSImageProps = $ReadOnly<{
   /**
    * A static image to display while loading the image source.
    *
@@ -52,12 +52,12 @@ type IOSImageProps = $ReadOnly<{|
    * See https://reactnative.dev/docs/image#onprogress
    */
   onProgress?: ?(
-    event: SyntheticEvent<$ReadOnly<{|loaded: number, total: number|}>>,
+    event: SyntheticEvent<$ReadOnly<{loaded: number, total: number}>>,
   ) => void,
-|}>;
+}>;
 
-type AndroidImageProps = $ReadOnly<{|
-  loadingIndicatorSource?: ?(number | $ReadOnly<{|uri: string|}>),
+type AndroidImageProps = $ReadOnly<{
+  loadingIndicatorSource?: ?(number | $ReadOnly<{uri: string}>),
   progressiveRenderingEnabled?: ?boolean,
   fadeDuration?: ?number,
 
@@ -76,10 +76,10 @@ type AndroidImageProps = $ReadOnly<{|
    * Defaults to 1.0.
    */
   resizeMultiplier?: ?number,
-|}>;
+}>;
 
-export type ImageProps = $ReadOnly<{|
-  ...$Diff<ViewProps, $ReadOnly<{|style: ?ViewStyleProp|}>>,
+export type ImageProps = $ReadOnly<{
+  ...$Diff<ViewProps, $ReadOnly<{style: ?ViewStyleProp}>>,
   ...IOSImageProps,
   ...AndroidImageProps,
 
@@ -164,9 +164,9 @@ export type ImageProps = $ReadOnly<{|
    */
   onError?: ?(
     event: SyntheticEvent<
-      $ReadOnly<{|
+      $ReadOnly<{
         error: string,
-      |}>,
+      }>,
     >,
   ) => void,
 
@@ -267,9 +267,9 @@ export type ImageProps = $ReadOnly<{|
    */
   srcSet?: ?string,
   children?: empty,
-|}>;
+}>;
 
-export type ImageBackgroundProps = $ReadOnly<{|
+export type ImageBackgroundProps = $ReadOnly<{
   ...ImageProps,
   children?: Node,
 
@@ -293,4 +293,4 @@ export type ImageBackgroundProps = $ReadOnly<{|
    * See https://reactnative.dev/docs/imagebackground#imageref
    */
   imageRef?: RefSetter<ElementRef<Image>>,
-|}>;
+}>;