@office-iss/react-native-win32 0.0.0-canary.289 → 0.0.0-canary.290

package/.flowconfig

@@ -31,7 +31,6 @@
 <PROJECT_ROOT>/Libraries/StyleSheet/PlatformColorValueTypes.js
 <PROJECT_ROOT>/Libraries/Text/TextProps.js
 <PROJECT_ROOT>/Libraries/Types/CoreEventTypes.js
-<PROJECT_ROOT>/Libraries/Utilities/DeviceInfo.js
 <PROJECT_ROOT>/Libraries/Utilities/Dimensions.js
 <PROJECT_ROOT>/Libraries/Utilities/Platform.flow.js
 <PROJECT_ROOT>/Libraries/LogBox/UI/LogBoxInspectorCodeFrame.js
@@ -168,4 +167,4 @@ untyped-import
 untyped-type-import
 
 [version]
-^0.265.2
+^0.266.1

package/CHANGELOG.json

@@ -2,7 +2,22 @@
   "name": "@office-iss/react-native-win32",
   "entries": [
     {
-      "date": "Thu, 19 Jun 2025 17:15:20 GMT",
+      "date": "Fri, 20 Jun 2025 05:21:03 GMT",
+      "version": "0.0.0-canary.290",
+      "tag": "@office-iss/react-native-win32_v0.0.0-canary.290",
+      "comments": {
+        "prerelease": [
+          {
+            "author": "kvineeth@microsoft.com",
+            "package": "@office-iss/react-native-win32",
+            "commit": "ca29f4ea3226621a8c1e8f9553fe55302ff6d4b9",
+            "comment": "Integrate RN Nightly Build 0.80.0-nightly-20250331-398ac1f71"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Thu, 19 Jun 2025 17:16:23 GMT",
       "version": "0.0.0-canary.289",
       "tag": "@office-iss/react-native-win32_v0.0.0-canary.289",
       "comments": {

package/CHANGELOG.md

@@ -1,18 +1,26 @@
 # Change Log - @office-iss/react-native-win32
 
-<!-- This log was last generated on Thu, 19 Jun 2025 17:15:20 GMT and should not be manually modified. -->
+<!-- This log was last generated on Fri, 20 Jun 2025 05:21:03 GMT and should not be manually modified. -->
 
 <!-- Start content -->
 
-## 0.0.0-canary.289
+## 0.0.0-canary.290
 
-Thu, 19 Jun 2025 17:15:20 GMT
+Fri, 20 Jun 2025 05:21:03 GMT
 
 ### Changes
 
-- Integrate RN Nightly Build 0.80.0-nightly-20250317-fc7385c1e (hmalothu@microsoft.com)
-- Update to @types/react 19 (30809111+acoates-ms@users.noreply.github.com)
+- Integrate RN Nightly Build 0.80.0-nightly-20250331-398ac1f71 (kvineeth@microsoft.com)
 
+## 0.0.0-canary.289
+
+Thu, 19 Jun 2025 17:16:23 GMT
+
+### Changes
+
+- Integrate RN Nightly Build 0.80.0-nightly-20250317-fc7385c1e (hmalothu@microsoft.com)
+- Update to @types/react 19 (30809111+acoates-ms@users.noreply.github.com)
+
 ## 0.0.0-canary.288
 
 Fri, 30 May 2025 05:24:59 GMT

package/Libraries/Animated/Animated.js.flow

@@ -9,7 +9,5 @@
  * @oncall react_native
  */
 
-import * as Animated from './AnimatedExports';
-
+export * as default from './AnimatedExports';
 export type {CompositeAnimation, Numeric} from './AnimatedImplementation';
-export default Animated;

package/Libraries/Animated/AnimatedExports.js.flow

@@ -24,7 +24,19 @@ export {default as Node} from './nodes/AnimatedNode';
 export {default as Value} from './nodes/AnimatedValue';
 export {default as ValueXY} from './nodes/AnimatedValueXY';
 
+/** @deprecated Use Animated.Interpolation instead */
+export type {default as AnimatedInterpolation} from './nodes/AnimatedInterpolation';
+/** @deprecated Use Animated.Color instead */
+export type {default as AnimatedColor} from './nodes/AnimatedColor';
+
 export type {AnimatedValueConfig as AnimatedConfig} from './nodes/AnimatedValue';
+export type {default as AnimatedNode} from './nodes/AnimatedNode';
+export type {default as AnimatedAddition} from './nodes/AnimatedAddition';
+export type {default as AnimatedDiffClamp} from './nodes/AnimatedDiffClamp';
+export type {default as AnimatedDivision} from './nodes/AnimatedDivision';
+export type {default as AnimatedModulo} from './nodes/AnimatedModulo';
+export type {default as AnimatedMultiplication} from './nodes/AnimatedMultiplication';
+export type {default as AnimatedSubtraction} from './nodes/AnimatedSubtraction';
 
 export const add = AnimatedImplementation.add;
 export const attachNativeEvent = AnimatedImplementation.attachNativeEvent;

package/Libraries/Animated/components/AnimatedScrollView.js

@@ -46,11 +46,12 @@ const AnimatedScrollView: AnimatedComponentType<Props, Instance> =
         props.style != null
       ) {
         return (
-          // $FlowFixMe[prop-missing]
+          // $FlowFixMe - It should return an Animated ScrollView but it returns a ScrollView with Animated props applied.
           <AnimatedScrollViewWithInvertedRefreshControl
             scrollEventThrottle={0.0001}
             {...props}
             ref={forwardedRef}
+            // $FlowFixMe[incompatible-type]
             refreshControl={props.refreshControl}
           />
         );

package/Libraries/Animated/components/AnimatedSectionList.js

@@ -18,5 +18,5 @@ import * as React from 'react';
 export default (createAnimatedComponent(SectionList): AnimatedComponentType<
   React.ElementConfig<typeof SectionList>,
   // $FlowExpectedError[unclear-type]
-  SectionList<SectionBase<any>>,
+  SectionList<any, SectionBase<any>>,
 >);

package/Libraries/Animated/createAnimatedComponent.js

@@ -8,7 +8,16 @@
  * @format
  */
 
+import type AnimatedAddition from './nodes/AnimatedAddition';
+import type AnimatedDiffClamp from './nodes/AnimatedDiffClamp';
+import type AnimatedDivision from './nodes/AnimatedDivision';
+import type AnimatedInterpolation from './nodes/AnimatedInterpolation';
+import type AnimatedModulo from './nodes/AnimatedModulo';
+import type AnimatedMultiplication from './nodes/AnimatedMultiplication';
+import type AnimatedNode from './nodes/AnimatedNode';
 import type {AnimatedPropsAllowlist} from './nodes/AnimatedProps';
+import type AnimatedSubtraction from './nodes/AnimatedSubtraction';
+import type AnimatedValue from './nodes/AnimatedValue';
 
 import createAnimatedPropsHook from '../../src/private/animated/createAnimatedPropsHook';
 import composeStyles from '../../src/private/styles/composeStyles';
@@ -17,34 +26,62 @@ import useMergeRefs from '../Utilities/useMergeRefs';
 import * as React from 'react';
 import {useMemo} from 'react';
 
-export type AnimatedProps<Props: {...}> = {
-  // eslint-disable-next-line no-unused-vars
-  +[_K in keyof (Props &
-      $ReadOnly<{
-        passthroughAnimatedPropExplicitValues?: React.ElementConfig<
-          typeof View,
-        >,
-      }>)]: any,
-};
+type Nullable = void | null;
+type Primitive = string | number | boolean | symbol | void;
+type Builtin = (...$ReadOnlyArray<empty>) => mixed | Date | Error | RegExp;
+
+export type WithAnimatedValue<+T> = T extends Builtin | Nullable
+  ? T
+  : T extends Primitive
+    ?
+        | T
+        | AnimatedNode
+        | AnimatedAddition
+        | AnimatedSubtraction
+        | AnimatedDivision
+        | AnimatedMultiplication
+        | AnimatedModulo
+        | AnimatedDiffClamp
+        | AnimatedValue
+        | AnimatedInterpolation<number | string>
+        | AnimatedInterpolation<number>
+        | AnimatedInterpolation<string>
+    : T extends $ReadOnlyArray<infer P>
+      ? $ReadOnlyArray<WithAnimatedValue<P>>
+      : T extends {...}
+        ? {+[K in keyof T]: WithAnimatedValue<T[K]>}
+        : T;
 
-// We could use a mapped type here to introduce acceptable Animated variants
-// of properties, instead of doing so in the core StyleSheetTypes
-// Inexact Props are not supported, they'll be made exact here.
-export type StrictAnimatedProps<Props: {...}> = $ReadOnly<{
-  ...$Exact<Props>,
-  passthroughAnimatedPropExplicitValues?: ?Props,
+type NonAnimatedProps =
+  | 'ref'
+  | 'innerViewRef'
+  | 'scrollViewRef'
+  | 'testID'
+  | 'disabled'
+  | 'accessibilityLabel';
+type PassThroughProps = $ReadOnly<{
+  passthroughAnimatedPropExplicitValues?: React.ElementConfig<
+    typeof View,
+  > | null,
 }>;
 
+export type AnimatedProps<Props: {...}> = {
+  [K in keyof Props]: K extends NonAnimatedProps
+    ? Props[K]
+    : WithAnimatedValue<Props[K]>,
+} & PassThroughProps;
+
+export type AnimatedBaseProps<Props: {...}> = {
+  [K in keyof Props]: K extends NonAnimatedProps
+    ? Props[K]
+    : WithAnimatedValue<Props[K]>,
+};
+
 export type AnimatedComponentType<Props: {...}, +Instance = mixed> = component(
   ref?: React.RefSetter<Instance>,
   ...AnimatedProps<Props>
 );
 
-export type StrictAnimatedComponentType<
-  Props: {...},
-  +Instance = mixed,
-> = component(ref: React.RefSetter<Instance>, ...StrictAnimatedProps<Props>);
-
 export default function createAnimatedComponent<
   TInstance: React.ComponentType<any>,
 >(
@@ -62,48 +99,47 @@ export function unstable_createAnimatedComponentWithAllowlist<
 >(
   Component: TInstance,
   allowlist: ?AnimatedPropsAllowlist,
-): StrictAnimatedComponentType<TProps, React.ElementRef<TInstance>> {
+): AnimatedComponentType<TProps, React.ElementRef<TInstance>> {
   const useAnimatedProps = createAnimatedPropsHook(allowlist);
 
-  const AnimatedComponent: StrictAnimatedComponentType<
+  const AnimatedComponent: AnimatedComponentType<
     TProps,
     React.ElementRef<TInstance>,
-  > = React.forwardRef<
-    StrictAnimatedProps<TProps>,
-    React.ElementRef<TInstance>,
-  >((props, forwardedRef) => {
-    const [reducedProps, callbackRef] = useAnimatedProps<
-      TProps,
-      React.ElementRef<TInstance>,
-    >(props);
-    const ref = useMergeRefs<React.ElementRef<TInstance>>(
-      callbackRef,
-      forwardedRef,
-    );
+  > = React.forwardRef<AnimatedProps<TProps>, React.ElementRef<TInstance>>(
+    (props, forwardedRef) => {
+      const [reducedProps, callbackRef] = useAnimatedProps<
+        TProps,
+        React.ElementRef<TInstance>,
+      >(props);
+      const ref = useMergeRefs<React.ElementRef<TInstance>>(
+        callbackRef,
+        forwardedRef,
+      );
 
-    // Some components require explicit passthrough values for animation
-    // to work properly. For example, if an animated component is
-    // transformed and Pressable, onPress will not work after transform
-    // without these passthrough values.
-    // $FlowFixMe[prop-missing]
-    const {passthroughAnimatedPropExplicitValues, style} = reducedProps;
-    const passthroughStyle = passthroughAnimatedPropExplicitValues?.style;
-    const mergedStyle = useMemo(
-      () => composeStyles(style, passthroughStyle),
-      [passthroughStyle, style],
-    );
+      // Some components require explicit passthrough values for animation
+      // to work properly. For example, if an animated component is
+      // transformed and Pressable, onPress will not work after transform
+      // without these passthrough values.
+      // $FlowFixMe[prop-missing]
+      const {passthroughAnimatedPropExplicitValues, style} = reducedProps;
+      const passthroughStyle = passthroughAnimatedPropExplicitValues?.style;
+      const mergedStyle = useMemo(
+        () => composeStyles(style, passthroughStyle),
+        [passthroughStyle, style],
+      );
 
-    // NOTE: It is important that `passthroughAnimatedPropExplicitValues` is
-    // spread after `reducedProps` but before `style`.
-    return (
-      <Component
-        {...reducedProps}
-        {...passthroughAnimatedPropExplicitValues}
-        style={mergedStyle}
-        ref={ref}
-      />
-    );
-  });
+      // NOTE: It is important that `passthroughAnimatedPropExplicitValues` is
+      // spread after `reducedProps` but before `style`.
+      return (
+        <Component
+          {...reducedProps}
+          {...passthroughAnimatedPropExplicitValues}
+          style={mergedStyle}
+          ref={ref}
+        />
+      );
+    },
+  );
 
   AnimatedComponent.displayName = `Animated(${
     Component.displayName || 'Anonymous'

package/Libraries/Animated/nodes/AnimatedProps.js

@@ -25,6 +25,12 @@ export type AnimatedPropsAllowlist = $ReadOnly<{
   [string]: true,
 }>;
 
+type TargetView = {
+  +instance: TargetViewInstance,
+  connectedViewTag: ?number,
+};
+type TargetViewInstance = React.ElementRef<React.ElementType>;
+
 function createAnimatedProps(
   inputProps: {[string]: mixed},
   allowlist: ?AnimatedPropsAllowlist,
@@ -75,11 +81,11 @@ function createAnimatedProps(
 }
 
 export default class AnimatedProps extends AnimatedNode {
-  #animatedView: any;
   #callback: () => void;
   #nodeKeys: $ReadOnlyArray<string>;
   #nodes: $ReadOnlyArray<AnimatedNode>;
   #props: {[string]: mixed};
+  #target: ?TargetView = null;
 
   constructor(
     inputProps: {[string]: mixed},
@@ -89,7 +95,6 @@ export default class AnimatedProps extends AnimatedNode {
   ) {
     super(config);
     const [nodeKeys, nodes, props] = createAnimatedProps(inputProps, allowlist);
-    this.#animatedView = null;
     this.#nodeKeys = nodeKeys;
     this.#nodes = nodes;
     this.#props = props;
@@ -181,10 +186,10 @@ export default class AnimatedProps extends AnimatedNode {
   }
 
   __detach(): void {
-    if (this.__isNative && this.#animatedView) {
-      this.__disconnectAnimatedView();
+    if (this.__isNative && this.#target != null) {
+      this.#disconnectAnimatedView(this.#target);
     }
-    this.#animatedView = null;
+    this.#target = null;
 
     const nodes = this.#nodes;
     for (let ii = 0, length = nodes.length; ii < length; ii++) {
@@ -210,56 +215,54 @@ export default class AnimatedProps extends AnimatedNode {
       this.__isNative = true;
 
       // Since this does not call the super.__makeNative, we need to store the
-      // supplied platformConfig here, before calling __connectAnimatedView
+      // supplied platformConfig here, before calling #connectAnimatedView
       // where it will be needed to traverse the graph of attached values.
       super.__setPlatformConfig(platformConfig);
 
-      if (this.#animatedView) {
-        this.__connectAnimatedView();
+      if (this.#target != null) {
+        this.#connectAnimatedView(this.#target);
       }
     }
   }
 
-  setNativeView(animatedView: any): void {
-    if (this.#animatedView === animatedView) {
+  setNativeView(instance: TargetViewInstance): void {
+    if (this.#target?.instance === instance) {
       return;
     }
-    this.#animatedView = animatedView;
+    this.#target = {instance, connectedViewTag: null};
     if (this.__isNative) {
-      this.__connectAnimatedView();
+      this.#connectAnimatedView(this.#target);
     }
   }
 
-  __connectAnimatedView(): void {
+  #connectAnimatedView(target: TargetView): void {
     invariant(this.__isNative, 'Expected node to be marked as "native"');
-    let nativeViewTag: ?number = findNodeHandle(this.#animatedView);
-    if (nativeViewTag == null) {
+    let viewTag: ?number = findNodeHandle(target.instance);
+    if (viewTag == null) {
       if (process.env.NODE_ENV === 'test') {
-        nativeViewTag = -1;
+        viewTag = -1;
       } else {
         throw new Error('Unable to locate attached view in the native tree');
       }
     }
     NativeAnimatedHelper.API.connectAnimatedNodeToView(
       this.__getNativeTag(),
-      nativeViewTag,
+      viewTag,
     );
+    target.connectedViewTag = viewTag;
   }
 
-  __disconnectAnimatedView(): void {
+  #disconnectAnimatedView(target: TargetView): void {
     invariant(this.__isNative, 'Expected node to be marked as "native"');
-    let nativeViewTag: ?number = findNodeHandle(this.#animatedView);
-    if (nativeViewTag == null) {
-      if (process.env.NODE_ENV === 'test') {
-        nativeViewTag = -1;
-      } else {
-        throw new Error('Unable to locate attached view in the native tree');
-      }
+    const viewTag = target.connectedViewTag;
+    if (viewTag == null) {
+      return;
     }
     NativeAnimatedHelper.API.disconnectAnimatedNodeFromView(
       this.__getNativeTag(),
-      nativeViewTag,
+      viewTag,
     );
+    target.connectedViewTag = null;
   }
 
   __restoreDefaultValues(): void {

package/Libraries/Animated/nodes/AnimatedValueXY.js

@@ -214,7 +214,9 @@ export default class AnimatedValueXY extends AnimatedWithChildren {
    *
    * See https://reactnative.dev/docs/animatedvaluexy#gettranslatetransform
    */
-  getTranslateTransform(): Array<{[key: string]: AnimatedValue, ...}> {
+  getTranslateTransform(): Array<
+    {translateX: AnimatedValue} | {translateY: AnimatedValue},
+  > {
     return [{translateX: this.x}, {translateY: this.y}];
   }
 

package/Libraries/AppState/AppState.js

@@ -107,7 +107,7 @@ class AppStateImpl {
    */
   addEventListener<K: AppStateEvent>(
     type: K,
-    handler: (...$ElementType<AppStateEventDefinitions, K>) => void,
+    handler: (...AppStateEventDefinitions[K]) => void,
   ): EventSubscription {
     const emitter = this._emitter;
     if (emitter == null) {

package/Libraries/Blob/URL.js

@@ -160,7 +160,7 @@ export class URL {
 
   get searchParams(): URLSearchParams {
     if (this._searchParamsInstance == null) {
-      this._searchParamsInstance = new URLSearchParams();
+      this._searchParamsInstance = new URLSearchParams(this.search);
     }
     return this._searchParamsInstance;
   }

package/Libraries/Blob/URLSearchParams.js

@@ -11,60 +11,135 @@
 // 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<[string, string]> = [];
+  _searchParams: Map<string, string[]> = new Map();
 
-  constructor(params?: Record<string, string>) {
-    if (typeof params === 'object') {
-      Object.keys(params).forEach(key => this.append(key, params[key]));
+  constructor(params?: Record<string, string> | string | [string, string][]) {
+    if (params === null) {
+      return;
+    }
+
+    if (typeof params === 'string') {
+      // URLSearchParams("key1=value1&key2=value2");
+      params
+        .replace(/^\?/, '')
+        .split('&')
+        .forEach(pair => {
+          if (!pair) {
+            return;
+          }
+          const [key, value] = pair
+            .split('=')
+            .map(part => decodeURIComponent(part.replace(/\+/g, ' ')));
+          this.append(key, value);
+        });
+    } else if (Array.isArray(params)) {
+      //URLSearchParams([["key1", "value1"], ["key2", "value2"]]);
+      params.forEach(([key, value]) => this.append(key, value));
+    } else if (typeof params === 'object') {
+      //URLSearchParams({ key1: "value1", key2: "value2" });
+      Object.entries(params).forEach(([key, value]) => this.append(key, value));
     }
   }
 
   append(key: string, value: string): void {
-    this._searchParams.push([key, value]);
+    if (!this._searchParams.has(key)) {
+      this._searchParams.set(key, [value]); // Initialize with an array if key is missing
+    } else {
+      this._searchParams.get(key)?.push(value); // Else push the value to the array
+    }
+  }
+
+  delete(name: string): void {
+    this._searchParams.delete(name);
   }
 
-  delete(name: string): empty {
-    throw new Error('URLSearchParams.delete is not implemented');
+  get(name: string): string | null {
+    const values = this._searchParams.get(name);
+    return values ? values[0] : null;
   }
 
-  get(name: string): empty {
-    throw new Error('URLSearchParams.get is not implemented');
+  getAll(name: string): string[] {
+    return this._searchParams.get(name) ?? [];
   }
 
-  getAll(name: string): empty {
-    throw new Error('URLSearchParams.getAll is not implemented');
+  has(name: string): boolean {
+    return this._searchParams.has(name);
   }
 
-  has(name: string): empty {
-    throw new Error('URLSearchParams.has is not implemented');
+  set(name: string, value: string): void {
+    this._searchParams.set(name, [value]);
   }
 
-  set(name: string, value: string): empty {
-    throw new Error('URLSearchParams.set is not implemented');
+  keys(): Iterator<string> {
+    return this._searchParams.keys();
   }
 
-  sort(): empty {
-    throw new Error('URLSearchParams.sort is not implemented');
+  values(): Iterator<string> {
+    function* generateValues(params: Map<string, string[]>): Iterator<string> {
+      for (const valueArray of params.values()) {
+        for (const value of valueArray) {
+          yield value;
+        }
+      }
+    }
+    return generateValues(this._searchParams);
+  }
+
+  entries(): Iterator<[string, string]> {
+    function* generateEntries(
+      params: Map<string, string[]>,
+    ): Iterator<[string, string]> {
+      for (const [key, values] of params) {
+        for (const value of values) {
+          yield [key, value];
+        }
+      }
+    }
+
+    return generateEntries(this._searchParams);
+  }
+
+  forEach(
+    callback: (value: string, key: string, searchParams: this) => void,
+  ): void {
+    for (const [key, values] of this._searchParams) {
+      for (const value of values) {
+        callback(value, key, this);
+      }
+    }
+  }
+
+  sort(): void {
+    this._searchParams = new Map(
+      [...this._searchParams.entries()].sort(([a], [b]) => a.localeCompare(b)),
+    );
   }
 
   // $FlowFixMe[unsupported-syntax]
   [Symbol.iterator](): Iterator<[string, string]> {
-    return this._searchParams[Symbol.iterator]();
+    const entries: [string, string][] = [];
+
+    for (const [key, values] of this._searchParams) {
+      for (const value of values) {
+        entries.push([key, value]);
+      }
+    }
+
+    return entries[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 ? '' : '&')
-      );
-    }, '');
+    return Array.from(this._searchParams.entries())
+      .map(([key, values]) =>
+        values
+          .map(
+            value =>
+              `${encodeURIComponent(key).replace(/%20/g, '+')}=${encodeURIComponent(
+                value,
+              ).replace(/%20/g, '+')}`, // Convert only spaces to '+'
+          )
+          .join('&'),
+      )
+      .join('&');
   }
 }

package/Libraries/Blob/URLSearchParams.js.flow

@@ -10,14 +10,19 @@
 
 declare export class URLSearchParams {
   _searchParams: Array<[string, string]>;
-  constructor(params?: Record<string, string>): void;
+  constructor(
+    params?: Record<string, string> | string | Array<[string, string]>,
+  ): void;
   append(key: string, value: string): void;
-  delete(name: string): empty;
-  get(name: string): empty;
-  getAll(name: string): empty;
-  has(name: string): empty;
-  set(name: string, value: string): empty;
-  sort(): empty;
+  delete(name: string): void;
+  get(name: string): string;
+  getAll(name: string): Array<string>;
+  has(name: string): boolean;
+  set(name: string, value: string): void;
+  sort(): void;
   @@iterator(): Iterator<[string, string]>;
   toString(): string;
+  keys(): Iterator<string>;
+  values(): Iterator<string>;
+  entries(): Iterator<[string, string]>;
 }