@office-iss/react-native-win32 0.0.0-canary.258 → 0.0.0-canary.260

package/.flowconfig

@@ -127,9 +127,7 @@ module.name_mapper='^@office-iss/react-native-win32$' -> '<PROJECT_ROOT>/index.w
 module.name_mapper='^react-native/\(.*\)$' -> '<PROJECT_ROOT>/\1'
 module.name_mapper='^@office-iss/react-native-win32/\(.*\)$' -> '<PROJECT_ROOT>\/1'
 module.name_mapper='^@react-native/dev-middleware$' -> '<PROJECT_ROOT>/\1'
-module.name_mapper='^@?[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '<PROJECT_ROOT>/Libraries/Image/RelativeImageStub'
-
-one_sided_type_guards=true
+module.name_mapper='^@?[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\|xml\)$' -> '<PROJECT_ROOT>/Libraries/Image/RelativeImageStub'
 
 suppress_type=$FlowIssue
 suppress_type=$FlowFixMe
@@ -161,4 +159,4 @@ untyped-import
 untyped-type-import
 
 [version]
-^0.238.3
+^0.243.0

package/CHANGELOG.json

@@ -2,7 +2,37 @@
   "name": "@office-iss/react-native-win32",
   "entries": [
     {
-      "date": "Thu, 08 Aug 2024 05:14:50 GMT",
+      "date": "Wed, 28 Aug 2024 05:14:05 GMT",
+      "version": "0.0.0-canary.260",
+      "tag": "@office-iss/react-native-win32_v0.0.0-canary.260",
+      "comments": {
+        "prerelease": [
+          {
+            "author": "tatianakapos@microsoft.com",
+            "package": "@office-iss/react-native-win32",
+            "commit": "98197a259f5e7c97c877e361dd70b048343e65a8",
+            "comment": "integrate 0.76.0-nightly-20240816-17017d2b8"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Thu, 22 Aug 2024 05:24:27 GMT",
+      "version": "0.0.0-canary.259",
+      "tag": "@office-iss/react-native-win32_v0.0.0-canary.259",
+      "comments": {
+        "prerelease": [
+          {
+            "author": "tatianakapos@microsoft.com",
+            "package": "@office-iss/react-native-win32",
+            "commit": "bccbec07eeeda80b870765f2b207a6616b69732b",
+            "comment": "integrate react native nightly 7-19"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Thu, 08 Aug 2024 05:16:47 GMT",
       "version": "0.0.0-canary.258",
       "tag": "@office-iss/react-native-win32_v0.0.0-canary.258",
       "comments": {

package/CHANGELOG.md

@@ -1,21 +1,37 @@
 # Change Log - @office-iss/react-native-win32
 
-This log was last generated on Thu, 08 Aug 2024 05:14:50 GMT and should not be manually modified.
+This log was last generated on Wed, 28 Aug 2024 05:14:05 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## 0.0.0-canary.258
+## 0.0.0-canary.260
 
-Thu, 08 Aug 2024 05:14:50 GMT
+Wed, 28 Aug 2024 05:14:05 GMT
 
 ### Changes
 
-- Integrate 7/1 (jthysell@microsoft.com)
-- Bump @rnw-scripts/eslint-config to v1.2.26
-- Bump @rnw-scripts/jest-out-of-tree-snapshot-resolver to v1.1.30
-- Bump @rnw-scripts/just-task to v2.3.43
-- Bump react-native-platform-override to v1.9.45
+- integrate 0.76.0-nightly-20240816-17017d2b8 (tatianakapos@microsoft.com)
 
+## 0.0.0-canary.259
+
+Thu, 22 Aug 2024 05:24:27 GMT
+
+### Changes
+
+- integrate react native nightly 7-19 (tatianakapos@microsoft.com)
+
+## 0.0.0-canary.258
+
+Thu, 08 Aug 2024 05:16:47 GMT
+
+### Changes
+
+- Integrate 7/1 (jthysell@microsoft.com)
+- Bump @rnw-scripts/eslint-config to v1.2.26
+- Bump @rnw-scripts/jest-out-of-tree-snapshot-resolver to v1.1.30
+- Bump @rnw-scripts/just-task to v2.3.43
+- Bump react-native-platform-override to v1.9.45
+
 ## 0.0.0-canary.257
 
 Wed, 24 Jul 2024 05:24:34 GMT

package/Libraries/Alert/Alert.js

@@ -98,10 +98,13 @@ class Alert {
       const onAction = (action, buttonKey) => {
         if (action === constants.buttonClicked) {
           if (buttonKey === constants.buttonNeutral) {
+            // $FlowFixMe[incompatible-type]
             buttonNeutral.onPress && buttonNeutral.onPress();
           } else if (buttonKey === constants.buttonNegative) {
+            // $FlowFixMe[incompatible-type]
             buttonNegative.onPress && buttonNegative.onPress();
           } else if (buttonKey === constants.buttonPositive) {
+            // $FlowFixMe[incompatible-type]
             buttonPositive.onPress && buttonPositive.onPress();
           }
         } else if (action === constants.dismissed) {

package/Libraries/Animated/AnimatedImplementation.js

@@ -39,7 +39,7 @@ import AnimatedValue from './nodes/AnimatedValue';
 import AnimatedValueXY from './nodes/AnimatedValueXY';
 
 export type CompositeAnimation = {
-  start: (callback?: ?EndCallback) => void,
+  start: (callback?: ?EndCallback, isLooping?: boolean) => void,
   stop: () => void,
   reset: () => void,
   _startNativeLoop: (iterations?: number) => void,
@@ -234,8 +234,8 @@ const timing = function (
 
   return (
     maybeVectorAnim(value, config, timing) || {
-      start: function (callback?: ?EndCallback): void {
-        start(value, config, callback);
+      start: function (callback?: ?EndCallback, isLooping?: boolean): void {
+        start(value, {...config, isLooping}, callback);
       },
 
       stop: function (): void {
@@ -305,7 +305,7 @@ const sequence = function (
 ): CompositeAnimation {
   let current = 0;
   return {
-    start: function (callback?: ?EndCallback) {
+    start: function (callback?: ?EndCallback, isLooping?: boolean) {
       const onComplete = function (result: EndResult) {
         if (!result.finished) {
           callback && callback(result);
@@ -321,13 +321,13 @@ const sequence = function (
           return;
         }
 
-        animations[current].start(onComplete);
+        animations[current].start(onComplete, isLooping);
       };
 
       if (animations.length === 0) {
         callback && callback({finished: true});
       } else {
-        animations[current].start(onComplete);
+        animations[current].start(onComplete, isLooping);
       }
     },
 
@@ -477,7 +477,7 @@ const loop = function (
         } else {
           iterationsSoFar++;
           resetBeforeIteration && animation.reset();
-          animation.start(restart);
+          animation.start(restart, iterations === -1);
         }
       };
       if (!animation || iterations === 0) {

package/Libraries/Animated/animations/Animation.js

@@ -14,6 +14,7 @@ import type {PlatformConfig} from '../AnimatedPlatformConfig';
 import type AnimatedNode from '../nodes/AnimatedNode';
 import type AnimatedValue from '../nodes/AnimatedValue';
 
+import * as ReactNativeFeatureFlags from '../../../src/private/featureflags/ReactNativeFeatureFlags';
 import NativeAnimatedHelper from '../NativeAnimatedHelper';
 import AnimatedProps from '../nodes/AnimatedProps';
 
@@ -26,6 +27,7 @@ export type AnimationConfig = {
   platformConfig?: PlatformConfig,
   onComplete?: ?EndCallback,
   iterations?: number,
+  isLooping?: boolean,
 };
 
 let startNativeAnimationNextId = 1;
@@ -38,6 +40,7 @@ export default class Animation {
   __isInteraction: boolean;
   __onEnd: ?EndCallback;
   __iterations: number;
+  __isLooping: ?boolean;
 
   _nativeId: number;
 
@@ -107,6 +110,13 @@ export default class Animation {
           if (value != null) {
             animatedValue.__onAnimatedValueUpdateReceived(value);
 
+            if (
+              ReactNativeFeatureFlags.shouldSkipStateUpdatesForLoopingAnimations() &&
+              this.__isLooping
+            ) {
+              return;
+            }
+
             // Once the JS side node is synced with the updated values, trigger an
             // update on the AnimatedProps nodes to call any registered callbacks.
             this.__findAnimatedPropsNodes(animatedValue).forEach(node =>

package/Libraries/Animated/animations/TimingAnimation.js

@@ -80,6 +80,7 @@ export default class TimingAnimation extends Animation {
     this._useNativeDriver = NativeAnimatedHelper.shouldUseNativeDriver(config);
     this._platformConfig = config.platformConfig;
     this.__isInteraction = config.isInteraction ?? !this._useNativeDriver;
+    this.__isLooping = config.isLooping;
   }
 
   __getNativeAnimationConfig(): any {

package/Libraries/Animated/components/AnimatedScrollView.js

@@ -71,7 +71,7 @@ const AnimatedScrollViewWithInvertedRefreshControl = React.forwardRef(
     props: {
       ...React.ElementConfig<typeof ScrollView>,
       // $FlowFixMe[unclear-type] Same Flow type as `refreshControl` in ScrollView
-      refreshControl: React.Element<any>,
+      refreshControl: ExactReactElement_DEPRECATED<any>,
     },
     forwardedRef:
       | {current: Instance | null, ...}
@@ -97,7 +97,7 @@ const AnimatedScrollViewWithInvertedRefreshControl = React.forwardRef(
     >(intermediatePropsForRefreshControl);
     // NOTE: Assumes that refreshControl.ref` and `refreshControl.style` can be
     // safely clobbered.
-    const refreshControl: React.Element<typeof RefreshControl> =
+    const refreshControl: ExactReactElement_DEPRECATED<typeof RefreshControl> =
       React.cloneElement(props.refreshControl, {
         ...refreshControlAnimatedProps,
         ref: refreshControlRef,

package/Libraries/Animated/createAnimatedComponent.js

@@ -8,7 +8,7 @@
  * @format
  */
 
-import composeStyles from '../../src/private/core/composeStyles';
+import composeStyles from '../../src/private/styles/composeStyles';
 import View from '../Components/View/View';
 import useMergeRefs from '../Utilities/useMergeRefs';
 import useAnimatedProps from './useAnimatedProps';

package/Libraries/Animated/nodes/AnimatedValue.js

@@ -49,6 +49,7 @@ const NativeAnimatedAPI = NativeAnimatedHelper.API;
  * transform which can receive values from multiple parents.
  */
 export function flushValue(rootNode: AnimatedNode): void {
+  // eslint-disable-next-line func-call-spacing
   const leaves = new Set<{update: () => void, ...}>();
   function findAnimatedStyles(node: AnimatedNode) {
     // $FlowFixMe[prop-missing]

package/Libraries/Animated/useAnimatedProps.js

@@ -10,12 +10,17 @@
 
 'use strict';
 
+import type {EventSubscription} from '../EventEmitter/NativeEventEmitter';
+
 import * as ReactNativeFeatureFlags from '../../src/private/featureflags/ReactNativeFeatureFlags';
+import useDebouncedEffect from '../../src/private/hooks/useDebouncedEffect';
 import {isPublicInstance as isFabricPublicInstance} from '../ReactNative/ReactFabricPublicInstance/ReactFabricPublicInstanceUtils';
 import useRefEffect from '../Utilities/useRefEffect';
 import {AnimatedEvent} from './AnimatedEvent';
 import NativeAnimatedHelper from './NativeAnimatedHelper';
+import AnimatedNode from './nodes/AnimatedNode';
 import AnimatedProps from './nodes/AnimatedProps';
+import AnimatedValue from './nodes/AnimatedValue';
 import {
   useCallback,
   useEffect,
@@ -32,6 +37,11 @@ type ReducedProps<TProps> = {
 };
 type CallbackRef<T> = T => mixed;
 
+type AnimatedValueListeners = Array<{
+  propValue: AnimatedValue,
+  listenerId: string,
+}>;
+
 export default function useAnimatedProps<TProps: {...}, TInstance>(
   props: TProps,
 ): [ReducedProps<TProps>, CallbackRef<TInstance | null>] {
@@ -49,6 +59,14 @@ export default function useAnimatedProps<TProps: {...}, TInstance>(
   );
   const useNativePropsInFabric =
     ReactNativeFeatureFlags.shouldUseSetNativePropsInFabric();
+  const useSetNativePropsInNativeAnimationsInFabric =
+    ReactNativeFeatureFlags.shouldUseSetNativePropsInNativeAnimationsInFabric();
+
+  const useAnimatedPropsLifecycle =
+    ReactNativeFeatureFlags.usePassiveEffectsForAnimations()
+      ? useAnimatedPropsLifecycle_passiveEffects
+      : useAnimatedPropsLifecycle_layoutEffects;
+
   useAnimatedPropsLifecycle(node);
 
   // TODO: This "effect" does three things:
@@ -87,7 +105,12 @@ export default function useAnimatedProps<TProps: {...}, TInstance>(
           if (isFabricNode) {
             // Call `scheduleUpdate` to synchronise Fiber and Shadow tree.
             // Must not be called in Paper.
-            scheduleUpdate();
+            if (useSetNativePropsInNativeAnimationsInFabric) {
+              // $FlowFixMe[incompatible-use]
+              instance.setNativeProps(node.__getAnimatedValue());
+            } else {
+              scheduleUpdate();
+            }
           }
           return;
         }
@@ -139,6 +162,7 @@ export default function useAnimatedProps<TProps: {...}, TInstance>(
 
       const target = getEventTarget(instance);
       const events = [];
+      const animatedValueListeners: AnimatedValueListeners = [];
 
       for (const propName in props) {
         // $FlowFixMe[invalid-computed-prop]
@@ -146,6 +170,8 @@ export default function useAnimatedProps<TProps: {...}, TInstance>(
         if (propValue instanceof AnimatedEvent && propValue.__isNative) {
           propValue.__attach(target, propName);
           events.push([propName, propValue]);
+          // $FlowFixMe[incompatible-call] - the `addListenersToPropsValue` drills down the propValue.
+          addListenersToPropsValue(propValue, animatedValueListeners);
         }
       }
 
@@ -155,18 +181,25 @@ export default function useAnimatedProps<TProps: {...}, TInstance>(
         for (const [propName, propValue] of events) {
           propValue.__detach(target, propName);
         }
+
+        for (const {propValue, listenerId} of animatedValueListeners) {
+          propValue.removeListener(listenerId);
+        }
       };
     },
-    [props, node, useNativePropsInFabric],
+    [
+      node,
+      useNativePropsInFabric,
+      useSetNativePropsInNativeAnimationsInFabric,
+      props,
+    ],
   );
   const callbackRef = useRefEffect<TInstance>(refEffect);
 
   return [reduceAnimatedProps<TProps>(node), callbackRef];
 }
 
-function reduceAnimatedProps<TProps>(
-  node: AnimatedProps,
-): ReducedProps<TProps> {
+function reduceAnimatedProps<TProps>(node: AnimatedNode): ReducedProps<TProps> {
   // Force `collapsable` to be false so that the native view is not flattened.
   // Flattened views cannot be accurately referenced by the native driver.
   return {
@@ -175,6 +208,35 @@ function reduceAnimatedProps<TProps>(
   };
 }
 
+function addListenersToPropsValue(
+  propValue: AnimatedValue,
+  accumulator: AnimatedValueListeners,
+) {
+  // propValue can be a scalar value, an array or an object.
+  if (propValue instanceof AnimatedValue) {
+    const listenerId = propValue.addListener(() => {});
+    accumulator.push({propValue, listenerId});
+  } else if (Array.isArray(propValue)) {
+    // An array can be an array of scalar values, arrays of arrays, or arrays of objects
+    for (const prop of propValue) {
+      addListenersToPropsValue(prop, accumulator);
+    }
+  } else if (propValue instanceof Object) {
+    addAnimatedValuesListenersToProps(propValue, accumulator);
+  }
+}
+
+function addAnimatedValuesListenersToProps(
+  props: AnimatedNode,
+  accumulator: AnimatedValueListeners,
+) {
+  for (const propName in props) {
+    // $FlowFixMe[prop-missing] - This is an object contained in a prop, but we don't know the exact type.
+    const propValue = props[propName];
+    addListenersToPropsValue(propValue, accumulator);
+  }
+}
+
 /**
  * Manages the lifecycle of the supplied `AnimatedProps` by invoking `__attach`
  * and `__detach`. However, this is more complicated because `AnimatedProps`
@@ -182,15 +244,33 @@ function reduceAnimatedProps<TProps>(
  * nodes. So in order to optimize this, we avoid detaching until the next attach
  * unless we are unmounting.
  */
-function useAnimatedPropsLifecycle(node: AnimatedProps): void {
+function useAnimatedPropsLifecycle_layoutEffects(node: AnimatedProps): void {
   const prevNodeRef = useRef<?AnimatedProps>(null);
   const isUnmountingRef = useRef<boolean>(false);
+  const userDrivenAnimationEndedListener = useRef<?EventSubscription>(null);
 
   useEffect(() => {
     // It is ok for multiple components to call `flushQueue` because it noops
     // if the queue is empty. When multiple animated components are mounted at
     // the same time. Only first component flushes the queue and the others will noop.
     NativeAnimatedHelper.API.flushQueue();
+
+    if (node.__isNative) {
+      userDrivenAnimationEndedListener.current =
+        NativeAnimatedHelper.nativeEventEmitter.addListener(
+          'onUserDrivenAnimationEnded',
+          data => {
+            node.update();
+          },
+        );
+    }
+
+    return () => {
+      if (userDrivenAnimationEndedListener.current) {
+        userDrivenAnimationEndedListener.current?.remove();
+        userDrivenAnimationEndedListener.current = null;
+      }
+    };
   });
 
   useLayoutEffect(() => {
@@ -220,6 +300,58 @@ function useAnimatedPropsLifecycle(node: AnimatedProps): void {
   }, [node]);
 }
 
+/**
+ * Manages the lifecycle of the supplied `AnimatedProps` by invoking `__attach`
+ * and `__detach`. However, this is more complicated because `AnimatedProps`
+ * uses reference counting to determine when to recursively detach its children
+ * nodes. So in order to optimize this, we avoid detaching until the next attach
+ * unless we are unmounting.
+ *
+ * NOTE: unlike `useAnimatedPropsLifecycle_layoutEffects`, this version uses passive effects to setup animation graph.
+ */
+function useAnimatedPropsLifecycle_passiveEffects(node: AnimatedProps): void {
+  const prevNodeRef = useRef<?AnimatedProps>(null);
+  const isUnmountingRef = useRef<boolean>(false);
+
+  useEffect(() => {
+    // It is ok for multiple components to call `flushQueue` because it noops
+    // if the queue is empty. When multiple animated components are mounted at
+    // the same time. Only first component flushes the queue and the others will noop.
+    NativeAnimatedHelper.API.flushQueue();
+  });
+
+  useEffect(() => {
+    isUnmountingRef.current = false;
+    return () => {
+      isUnmountingRef.current = true;
+    };
+  }, []);
+
+  const useEffectImpl =
+    ReactNativeFeatureFlags.shouldUseDebouncedEffectsForAnimated()
+      ? useDebouncedEffect
+      : useEffect;
+
+  useEffectImpl(() => {
+    node.__attach();
+    if (prevNodeRef.current != null) {
+      const prevNode = prevNodeRef.current;
+      // TODO: Stop restoring default values (unless `reset` is called).
+      prevNode.__restoreDefaultValues();
+      prevNode.__detach();
+      prevNodeRef.current = null;
+    }
+    return () => {
+      if (isUnmountingRef.current) {
+        // NOTE: Do not restore default values on unmount, see D18197735.
+        node.__detach();
+      } else {
+        prevNodeRef.current = node;
+      }
+    };
+  }, [node]);
+}
+
 function getEventTarget<TInstance>(instance: TInstance): TInstance {
   return typeof instance === 'object' &&
     typeof instance?.getScrollableNode === 'function'

package/Libraries/BatchedBridge/NativeModules.js

@@ -102,6 +102,7 @@ function genMethod(moduleID: number, methodID: number, type: MethodType) {
       // In case we reject, capture a useful stack trace here.
       /* $FlowFixMe[class-object-subtyping] added when improving typing for
        * this parameters */
+      // $FlowFixMe[incompatible-type]
       const enqueueingFrameError: ExtendedError = new Error();
       return new Promise((resolve, reject) => {
         BatchedBridge.enqueueNativeCall(
@@ -171,6 +172,7 @@ function updateErrorWithErrorData(
 ): ExtendedError {
   /* $FlowFixMe[class-object-subtyping] added when improving typing for this
    * parameters */
+  // $FlowFixMe[incompatible-return]
   return Object.assign(error, errorData || {});
 }
 

package/Libraries/Blob/FileReader.js

@@ -34,7 +34,7 @@ const EMPTY = 0;
 const LOADING = 1;
 const DONE = 2;
 
-class FileReader extends (EventTarget(...READER_EVENTS): any) {
+class FileReader extends (EventTarget(...READER_EVENTS): typeof EventTarget) {
   static EMPTY: number = EMPTY;
   static LOADING: number = LOADING;
   static DONE: number = DONE;

package/Libraries/Blob/URL.js

@@ -27,7 +27,7 @@ if (
   }
 }
 
-/**
+/*
  * To allow Blobs be accessed via `content://` URIs,
  * you need to register `BlobProvider` as a ContentProvider in your app's `AndroidManifest.xml`:
  *
@@ -52,67 +52,7 @@ if (
  * ```
  */
 
-// Small subset from whatwg-url: https://github.com/jsdom/whatwg-url/tree/master/src
-// The reference code bloat comes from Unicode issues with URLs, so those won't work here.
-export class URLSearchParams {
-  _searchParams: Array<Array<string>> = [];
-
-  constructor(params: any) {
-    if (typeof params === 'object') {
-      Object.keys(params).forEach(key => this.append(key, params[key]));
-    }
-  }
-
-  append(key: string, value: string): void {
-    this._searchParams.push([key, value]);
-  }
-
-  delete(name: string): void {
-    throw new Error('URLSearchParams.delete is not implemented');
-  }
-
-  get(name: string): void {
-    throw new Error('URLSearchParams.get is not implemented');
-  }
-
-  getAll(name: string): void {
-    throw new Error('URLSearchParams.getAll is not implemented');
-  }
-
-  has(name: string): void {
-    throw new Error('URLSearchParams.has is not implemented');
-  }
-
-  set(name: string, value: string): void {
-    throw new Error('URLSearchParams.set is not implemented');
-  }
-
-  sort(): void {
-    throw new Error('URLSearchParams.sort is not implemented');
-  }
-
-  // $FlowFixMe[unsupported-syntax]
-  // $FlowFixMe[missing-local-annot]
-  [Symbol.iterator]() {
-    return this._searchParams[Symbol.iterator]();
-  }
-
-  toString(): string {
-    if (this._searchParams.length === 0) {
-      return '';
-    }
-    const last = this._searchParams.length - 1;
-    return this._searchParams.reduce((acc, curr, index) => {
-      return (
-        acc +
-        encodeURIComponent(curr[0]) +
-        '=' +
-        encodeURIComponent(curr[1]) +
-        (index === last ? '' : '&')
-      );
-    }, '');
-  }
-}
+export {URLSearchParams} from './URLSearchParams';
 
 function validateBaseUrl(url: string) {
   // from this MIT-licensed gist: https://gist.github.com/dperini/729294

package/Libraries/Blob/URLSearchParams.js

@@ -0,0 +1,71 @@
+/**
+ * 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
+ */
+
+// Small subset from whatwg-url: https://github.com/jsdom/whatwg-url/tree/master/src
+// The reference code bloat comes from Unicode issues with URLs, so those won't work here.
+export class URLSearchParams {
+  _searchParams: Array<Array<string>> = [];
+
+  constructor(params: any) {
+    if (typeof params === 'object') {
+      Object.keys(params).forEach(key => this.append(key, params[key]));
+    }
+  }
+
+  append(key: string, value: string): void {
+    this._searchParams.push([key, value]);
+  }
+
+  delete(name: string): void {
+    throw new Error('URLSearchParams.delete is not implemented');
+  }
+
+  get(name: string): void {
+    throw new Error('URLSearchParams.get is not implemented');
+  }
+
+  getAll(name: string): void {
+    throw new Error('URLSearchParams.getAll is not implemented');
+  }
+
+  has(name: string): void {
+    throw new Error('URLSearchParams.has is not implemented');
+  }
+
+  set(name: string, value: string): void {
+    throw new Error('URLSearchParams.set is not implemented');
+  }
+
+  sort(): void {
+    throw new Error('URLSearchParams.sort is not implemented');
+  }
+
+  // $FlowFixMe[unsupported-syntax]
+  // $FlowFixMe[missing-local-annot]
+  [Symbol.iterator]() {
+    return this._searchParams[Symbol.iterator]();
+  }
+
+  toString(): string {
+    if (this._searchParams.length === 0) {
+      return '';
+    }
+    const last = this._searchParams.length - 1;
+    return this._searchParams.reduce((acc, curr, index) => {
+      return (
+        acc +
+        encodeURIComponent(curr[0]) +
+        '=' +
+        encodeURIComponent(curr[1]) +
+        (index === last ? '' : '&')
+      );
+    }, '');
+  }
+}

package/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js

@@ -105,7 +105,7 @@ type Props = $ReadOnly<{|
   /**
    * The navigation view that will be rendered to the side of the screen and can be pulled in.
    */
-  renderNavigationView: () => React.Element<any>,
+  renderNavigationView: () => React.MixedElement,
 
   /**
    * Make the drawer take the entire screen and draw the background of the