@office-iss/react-native-win32 0.0.0-canary.277 → 0.0.0-canary.278

package/Libraries/Core/ReactNativeVersion.js

@@ -17,7 +17,7 @@ const version: $ReadOnly<{
   major: 0,
   minor: 78,
   patch: 0,
-  prerelease: 'nightly-20241201-91e217ff5',
+  prerelease: 'nightly-20241210-6d235853f',
 };
 
 module.exports = {version};

package/Libraries/Network/FormData.js

@@ -28,6 +28,15 @@ type FormDataPart =
       ...
     };
 
+/**
+ * Encode a FormData filename compliant with RFC 2183
+ *
+ * https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Disposition#directives
+ */
+function encodeFilename(filename: string): string {
+  return encodeURIComponent(filename.replace(/\//g, '_'));
+}
+
 /**
  * Polyfill for XMLHttpRequest2 FormData API, allowing multipart POST requests
  * with mixed data (string, native files) to be submitted via XMLHttpRequest.
@@ -82,9 +91,8 @@ class FormData {
       // content type (cf. web Blob interface.)
       if (typeof value === 'object' && !Array.isArray(value) && value) {
         if (typeof value.name === 'string') {
-          headers['content-disposition'] += `; filename="${
-            value.name
-          }"; filename*=utf-8''${encodeURI(value.name)}`;
+          headers['content-disposition'] +=
+            `; filename="${encodeFilename(value.name)}"`;
         }
         if (typeof value.type === 'string') {
           headers['content-type'] = value.type;

package/Libraries/Text/Text.d.ts

@@ -12,7 +12,7 @@ import {Constructor} from '../../types/private/Utilities';
 import {AccessibilityProps} from '../Components/View/ViewAccessibility';
 import {NativeMethods} from '../../types/public/ReactNativeTypes';
 import {ColorValue, StyleProp} from '../StyleSheet/StyleSheet';
-import {TextStyle} from '../StyleSheet/StyleSheetTypes';
+import {TextStyle, ViewStyle} from '../StyleSheet/StyleSheetTypes';
 import {
   GestureResponderEvent,
   LayoutChangeEvent,
@@ -294,6 +294,11 @@ export interface TextProps
    * Specifies smallest possible scale a font can reach when adjustsFontSizeToFit is enabled. (values 0.01-1.0).
    */
   minimumFontScale?: number | undefined;
+
+  /**
+   * Controls how touch events are handled. Similar to `View`'s `pointerEvents`.
+   */
+  pointerEvents?: ViewStyle['pointerEvents'] | undefined;
 }
 
 /**

package/Libraries/Text/TextProps.js

@@ -17,7 +17,7 @@ import type {
   AccessibilityState,
   Role,
 } from '../Components/View/ViewAccessibility';
-import type {TextStyleProp} from '../StyleSheet/StyleSheet';
+import type {ColorValue, TextStyleProp} from '../StyleSheet/StyleSheet';
 import type {
   LayoutEvent,
   PointerEvent,
@@ -212,7 +212,7 @@ export type TextProps = $ReadOnly<{
    *
    * See https://reactnative.dev/docs/text#selectioncolor
    */
-  selectionColor?: ?string,
+  selectionColor?: ?ColorValue,
 
   dataDetectorType?: ?('phoneNumber' | 'link' | 'email' | 'none' | 'all'),
 

package/Libraries/Text/TextProps.win32.js

@@ -17,7 +17,7 @@ import type {
   AccessibilityState,
   Role,
 } from '../Components/View/ViewAccessibility';
-import type {TextStyleProp} from '../StyleSheet/StyleSheet';
+import type {ColorValue, TextStyleProp} from '../StyleSheet/StyleSheet';
 import type {
   LayoutEvent,
   PointerEvent,
@@ -225,7 +225,7 @@ export type TextProps = $ReadOnly<{
    *
    * See https://reactnative.dev/docs/text#selectioncolor
    */
-  selectionColor?: ?string,
+  selectionColor?: ?ColorValue,
 
   dataDetectorType?: ?('phoneNumber' | 'link' | 'email' | 'none' | 'all'),
 

package/overrides.json

@@ -7,7 +7,7 @@
     "**/__snapshots__/**",
     "src-win/rntypes/**"
   ],
-  "baseVersion": "0.78.0-nightly-20241201-91e217ff5",
+  "baseVersion": "0.78.0-nightly-20241210-6d235853f",
   "overrides": [
     {
       "type": "derived",
@@ -420,7 +420,7 @@
       "type": "derived",
       "file": "src-win/Libraries/Text/Text.d.ts",
       "baseFile": "packages/react-native/Libraries/Text/Text.d.ts",
-      "baseHash": "4b523469a5c8dcfe53749d1739ccf77c0106375e"
+      "baseHash": "21dab7f71254c429d592827ab313f77c18baeda1"
     },
     {
       "type": "derived",
@@ -439,7 +439,7 @@
       "type": "derived",
       "file": "src-win/Libraries/Text/TextProps.win32.js",
       "baseFile": "packages/react-native/Libraries/Text/TextProps.js",
-      "baseHash": "8e56a028dee989ebb8b06f4c01a1d038f074597d"
+      "baseHash": "ef1efdc0fb302273cd98be71aef2986677dda184"
     },
     {
       "type": "patch",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@office-iss/react-native-win32",
-  "version": "0.0.0-canary.277",
+  "version": "0.0.0-canary.278",
   "description": "Implementation of react native on top of Office's Win32 platform.",
   "repository": {
     "type": "git",
@@ -30,13 +30,13 @@
     "@react-native-community/cli-platform-android": "15.0.0-alpha.2",
     "@react-native-community/cli-platform-ios": "15.0.0-alpha.2",
     "@react-native/assets": "1.0.0",
-    "@react-native/assets-registry": "0.78.0-nightly-20241201-91e217ff5",
-    "@react-native/codegen": "0.78.0-nightly-20241201-91e217ff5",
-    "@react-native/community-cli-plugin": "0.78.0-nightly-20241201-91e217ff5",
-    "@react-native/gradle-plugin": "0.78.0-nightly-20241201-91e217ff5",
-    "@react-native/js-polyfills": "0.78.0-nightly-20241201-91e217ff5",
-    "@react-native/normalize-colors": "0.78.0-nightly-20241201-91e217ff5",
-    "@react-native/virtualized-lists": "0.78.0-nightly-20241201-91e217ff5",
+    "@react-native/assets-registry": "0.78.0-nightly-20241210-6d235853f",
+    "@react-native/codegen": "0.78.0-nightly-20241210-6d235853f",
+    "@react-native/community-cli-plugin": "0.78.0-nightly-20241210-6d235853f",
+    "@react-native/gradle-plugin": "0.78.0-nightly-20241210-6d235853f",
+    "@react-native/js-polyfills": "0.78.0-nightly-20241210-6d235853f",
+    "@react-native/normalize-colors": "0.78.0-nightly-20241210-6d235853f",
+    "@react-native/virtualized-lists": "0.78.0-nightly-20241210-6d235853f",
     "abort-controller": "^3.0.0",
     "anser": "^1.4.9",
     "ansi-regex": "^5.0.0",
@@ -51,7 +51,6 @@
     "glob": "^7.1.1",
     "invariant": "^2.2.4",
     "jest-environment-node": "^29.6.3",
-    "jsc-android": "^250231.0.0",
     "memoize-one": "^5.0.0",
     "metro-runtime": "^0.81.0",
     "metro-source-map": "^0.81.0",
@@ -90,14 +89,14 @@
     "just-scripts": "^1.3.3",
     "prettier": "2.8.8",
     "react": "18.3.1",
-    "react-native": "0.78.0-nightly-20241201-91e217ff5",
+    "react-native": "0.78.0-nightly-20241210-6d235853f",
     "react-native-platform-override": "^1.9.49",
     "typescript": "5.0.4"
   },
   "peerDependencies": {
     "@types/react": "^18.2.6",
     "react": "^18.2.0",
-    "react-native": "0.78.0-nightly-20241201-91e217ff5"
+    "react-native": "0.78.0-nightly-20241210-6d235853f"
   },
   "beachball": {
     "defaultNpmTag": "canary",

package/src/private/animated/useAnimatedPropsMemo.js

@@ -113,7 +113,7 @@ export function createCompositeKeyForProps(
     const key = keys[ii];
     const value = props[key];
 
-    if (allowlist == null || Object.hasOwn(allowlist, key)) {
+    if (allowlist == null || hasOwn(allowlist, key)) {
       let compositeKeyComponent;
       if (key === 'style') {
         // $FlowFixMe[incompatible-call] - `style` is a valid argument.
@@ -205,7 +205,7 @@ function createCompositeKeyForObject(
   for (let ii = 0, length = keys.length; ii < length; ii++) {
     const key = keys[ii];
 
-    if (allowlist == null || Object.hasOwn(allowlist, key)) {
+    if (allowlist == null || hasOwn(allowlist, key)) {
       const value = object[key];
 
       let compositeKeyComponent;
@@ -250,7 +250,7 @@ export function areCompositeKeysEqual(
   }
   for (let ii = 0; ii < length; ii++) {
     const key = keys[ii];
-    if (!Object.hasOwn(next, key)) {
+    if (!hasOwn(next, key)) {
       return false;
     }
     const prevComponent = prev[key];
@@ -336,7 +336,7 @@ function areCompositeKeyComponentsEqual(
     for (let ii = 0; ii < length; ii++) {
       const key = keys[ii];
       if (
-        !Object.hasOwn(nullthrows(next), key) ||
+        !hasOwn(nullthrows(next), key) ||
         !areCompositeKeyComponentsEqual(prev[key], next[key])
       ) {
         return false;
@@ -346,3 +346,11 @@ function areCompositeKeyComponentsEqual(
   }
   return false;
 }
+
+// Supported versions of JSC do not implement the newer Object.hasOwn. Remove
+// this shim when they do.
+// $FlowIgnore[method-unbinding]
+const _hasOwnProp = Object.prototype.hasOwnProperty;
+const hasOwn: (obj: $ReadOnly<{...}>, prop: string) => boolean =
+  // $FlowIgnore[method-unbinding]
+  Object.hasOwn ?? ((obj, prop) => _hasOwnProp.call(obj, prop));

package/src/private/featureflags/ReactNativeFeatureFlags.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<38ad29621eeb29a9f82735dc187c13d4>>
+ * @generated SignedSource<<67e1f8c80caedcbf7b28a089a2744b9a>>
  * @flow strict
  */
 
@@ -64,7 +64,6 @@ export type ReactNativeFeatureFlags = {
   enableEventEmitterRetentionDuringGesturesOnAndroid: Getter<boolean>,
   enableFabricLogs: Getter<boolean>,
   enableFabricRenderer: Getter<boolean>,
-  enableFabricRendererExclusively: Getter<boolean>,
   enableFixForViewCommandRace: Getter<boolean>,
   enableGranularShadowTreeStateReconciliation: Getter<boolean>,
   enableIOSViewClipToPaddingBox: Getter<boolean>,
@@ -80,6 +79,7 @@ export type ReactNativeFeatureFlags = {
   enableUIConsistency: Getter<boolean>,
   enableViewRecycling: Getter<boolean>,
   excludeYogaFromRawProps: Getter<boolean>,
+  fixDifferentiatorEmittingUpdatesWithWrongParentTag: Getter<boolean>,
   fixMappingOfEventPrioritiesBetweenFabricAndReact: Getter<boolean>,
   fixMountingCoordinatorReportedPendingTransactionsOnAndroid: Getter<boolean>,
   fuseboxEnabledDebug: Getter<boolean>,
@@ -240,10 +240,6 @@ export const enableFabricLogs: Getter<boolean> = createNativeFlagGetter('enableF
  * Enables the use of the Fabric renderer in the whole app.
  */
 export const enableFabricRenderer: Getter<boolean> = createNativeFlagGetter('enableFabricRenderer', false);
-/**
- * When the app is completely migrated to Fabric, set this flag to true to disable parts of Paper infrastructure that are not needed anymore but consume memory and CPU. Specifically, UIViewOperationQueue and EventDispatcherImpl will no longer work as they will not subscribe to ReactChoreographer for updates.
- */
-export const enableFabricRendererExclusively: Getter<boolean> = createNativeFlagGetter('enableFabricRendererExclusively', false);
 /**
  * Synchronise the view command dispatching with mounting of new transaction
  */
@@ -304,6 +300,10 @@ export const enableViewRecycling: Getter<boolean> = createNativeFlagGetter('enab
  * When enabled, rawProps in Props will not include Yoga specific props.
  */
 export const excludeYogaFromRawProps: Getter<boolean> = createNativeFlagGetter('excludeYogaFromRawProps', false);
+/**
+ * Fixes a bug in Differentiator where parent views may be referenced before they're created
+ */
+export const fixDifferentiatorEmittingUpdatesWithWrongParentTag: Getter<boolean> = createNativeFlagGetter('fixDifferentiatorEmittingUpdatesWithWrongParentTag', true);
 /**
  * Uses the default event priority instead of the discreet event priority by default when dispatching events from Fabric to React.
  */
@@ -363,7 +363,7 @@ export const useOptimizedEventBatchingOnAndroid: Getter<boolean> = createNativeF
 /**
  * When enabled, cloning shadow nodes within react native will update the reference held by the current JS fiber tree.
  */
-export const useRuntimeShadowNodeReferenceUpdate: Getter<boolean> = createNativeFlagGetter('useRuntimeShadowNodeReferenceUpdate', false);
+export const useRuntimeShadowNodeReferenceUpdate: Getter<boolean> = createNativeFlagGetter('useRuntimeShadowNodeReferenceUpdate', true);
 /**
  * In Bridgeless mode, should legacy NativeModules use the TurboModule system?
  */

package/src/private/featureflags/specs/NativeReactNativeFeatureFlags.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<17c0e677f7b308795e836c558b15d1d1>>
+ * @generated SignedSource<<fa9dcd18f2e50de520995ce1f26b111e>>
  * @flow strict
  */
 
@@ -37,7 +37,6 @@ export interface Spec extends TurboModule {
   +enableEventEmitterRetentionDuringGesturesOnAndroid?: () => boolean;
   +enableFabricLogs?: () => boolean;
   +enableFabricRenderer?: () => boolean;
-  +enableFabricRendererExclusively?: () => boolean;
   +enableFixForViewCommandRace?: () => boolean;
   +enableGranularShadowTreeStateReconciliation?: () => boolean;
   +enableIOSViewClipToPaddingBox?: () => boolean;
@@ -53,6 +52,7 @@ export interface Spec extends TurboModule {
   +enableUIConsistency?: () => boolean;
   +enableViewRecycling?: () => boolean;
   +excludeYogaFromRawProps?: () => boolean;
+  +fixDifferentiatorEmittingUpdatesWithWrongParentTag?: () => boolean;
   +fixMappingOfEventPrioritiesBetweenFabricAndReact?: () => boolean;
   +fixMountingCoordinatorReportedPendingTransactionsOnAndroid?: () => boolean;
   +fuseboxEnabledDebug?: () => boolean;

package/src/private/webapis/intersectionobserver/IntersectionObserver.js

@@ -33,10 +33,10 @@ type IntersectionObserverInit = {
    * If set, it will either be a singular ratio value between 0-1 (inclusive)
    * or an array of such ratios.
    *
-   * Note: If `rn_rootThreshold` is set, and `threshold` is not set,
+   * Note: If `rnRootThreshold` is set, and `threshold` is not set,
    * `threshold` will not default to [0] (as per spec)
    */
-  rn_rootThreshold?: number | $ReadOnlyArray<number>,
+  rnRootThreshold?: number | $ReadOnlyArray<number>,
 };
 
 /**
@@ -57,7 +57,7 @@ type IntersectionObserverInit = {
  *
  * This implementation only supports the `threshold` option at the moment
  * (`root` and `rootMargin` are not supported) and provides a React Native specific
- * option `rn_rootThreshold`.
+ * option `rnRootThreshold`.
  *
  */
 export default class IntersectionObserver {
@@ -99,7 +99,7 @@ export default class IntersectionObserver {
 
     this._callback = callback;
 
-    this._rootThresholds = normalizeRootThreshold(options?.rn_rootThreshold);
+    this._rootThresholds = normalizeRootThreshold(options?.rnRootThreshold);
     this._thresholds = normalizeThreshold(
       options?.threshold,
       this._rootThresholds != null, // only provide default if no rootThreshold
@@ -136,9 +136,9 @@ export default class IntersectionObserver {
    * threshold is a ratio of intersection area to bounding box area of an
    * observed target.
    * Notifications for a target are generated when any of the thresholds specified
-   * in `rn_rootThreshold` or `threshold` are crossed for that target.
+   * in `rnRootThreshold` or `threshold` are crossed for that target.
    *
-   * If no value was passed to the constructor, and no `rn_rootThreshold`
+   * If no value was passed to the constructor, and no `rnRootThreshold`
    * is set, `0` is used.
    */
   get thresholds(): $ReadOnlyArray<number> {
@@ -150,9 +150,9 @@ export default class IntersectionObserver {
    * threshold is a ratio of intersection area to bounding box area of the specified
    * root view, which defaults to the viewport.
    * Notifications for a target are generated when any of the thresholds specified
-   * in `rn_rootThreshold` or `threshold` are crossed for that target.
+   * in `rnRootThreshold` or `threshold` are crossed for that target.
    */
-  get rootThresholds(): $ReadOnlyArray<number> | null {
+  get rnRootThresholds(): $ReadOnlyArray<number> | null {
     return this._rootThresholds;
   }
 
@@ -293,7 +293,7 @@ function normalizeThreshold(
 }
 
 /**
- * Converts the user defined `rn_rootThreshold` value into an array of sorted valid
+ * Converts the user defined `rnRootThreshold` value into an array of sorted valid
  * threshold options for `IntersectionObserver` (double ∈ [0, 1]).
  *
  * If invalid array or null, returns null.
@@ -310,13 +310,13 @@ function normalizeRootThreshold(
 ): null | $ReadOnlyArray<number> {
   if (Array.isArray(rootThreshold)) {
     const normalizedArr = rootThreshold
-      .map(rt => normalizeThresholdValue(rt, 'rn_rootThreshold'))
+      .map(rt => normalizeThresholdValue(rt, 'rnRootThreshold'))
       .filter((rt): rt is number => rt != null)
       .sort();
     return normalizedArr.length === 0 ? null : normalizedArr;
   }
 
-  const normalized = normalizeThresholdValue(rootThreshold, 'rn_rootThreshold');
+  const normalized = normalizeThresholdValue(rootThreshold, 'rnRootThreshold');
   return normalized == null ? null : [normalized];
 }
 

package/src/private/webapis/intersectionobserver/IntersectionObserverEntry.js

@@ -77,7 +77,7 @@ export default class IntersectionObserverEntry {
   /**
    * Returns the ratio of the `intersectionRect` to the `boundingRootRect`.
    */
-  get rn_intersectionRootRatio(): number {
+  get rnRootIntersectionRatio(): number {
     const intersectionRect = this.intersectionRect;
 
     const rootRect = this._nativeEntry.rootRect;

package/src/private/webapis/intersectionobserver/IntersectionObserverManager.js

@@ -162,7 +162,7 @@ export function observe({
     intersectionObserverId,
     targetShadowNode,
     thresholds: registeredObserver.observer.thresholds,
-    rootThresholds: registeredObserver.observer.rootThresholds,
+    rootThresholds: registeredObserver.observer.rnRootThresholds,
   });
 
   return true;

package/src/private/webapis/intersectionobserver/specs/NativeIntersectionObserver.js

@@ -17,6 +17,7 @@ export type NativeIntersectionObserverEntry = {
   targetInstanceHandle: mixed,
   targetRect: $ReadOnlyArray<number>, // It's actually a tuple with x, y, width and height
   rootRect: $ReadOnlyArray<number>, // It's actually a tuple with x, y, width and height
+  // TODO(T209328432) - Remove optionality of intersectionRect when native changes are released
   intersectionRect: ?$ReadOnlyArray<number>, // It's actually a tuple with x, y, width and height
   isIntersectingAboveThresholds: boolean,
   time: number,

package/src/private/webapis/performance/Performance.js

@@ -115,9 +115,6 @@ export default class Performance {
         markName,
         markOptions?.startTime,
       );
-    } else if (NativePerformance?.mark) {
-      computedStartTime = markOptions?.startTime ?? performance.now();
-      NativePerformance?.mark?.(markName, computedStartTime);
     } else {
       warnNoNativePerformance();
       computedStartTime = performance.now();
@@ -203,15 +200,6 @@ export default class Performance {
           startMarkName,
           endMarkName,
         );
-    } else if (NativePerformance?.measure) {
-      NativePerformance.measure(
-        measureName,
-        startTime,
-        endTime,
-        duration,
-        startMarkName,
-        endMarkName,
-      );
     } else {
       warnNoNativePerformance();
     }

package/src/private/webapis/performance/specs/NativePerformance.js

@@ -45,17 +45,6 @@ export type PerformanceObserverInit = {
 
 export interface Spec extends TurboModule {
   +now?: () => number;
-  // TODO: remove when `markWithResult` is fully rolled out.
-  +mark?: (name: string, startTime: number) => void;
-  // TODO: remove when `measureWithResult` is fully rolled out.
-  +measure?: (
-    name: string,
-    startTime: number,
-    endTime: number,
-    duration?: number,
-    startMark?: string,
-    endMark?: string,
-  ) => void;
   +markWithResult?: (
     name: string,
     startTime?: number,

package/src-win/Libraries/Text/Text.d.ts

@@ -12,7 +12,7 @@ import {Constructor} from '../../types/private/Utilities';
 import {AccessibilityProps} from '../Components/View/ViewAccessibility';
 import {NativeMethods} from '../../types/public/ReactNativeTypes';
 import {ColorValue, StyleProp} from '../StyleSheet/StyleSheet';
-import {TextStyle} from '../StyleSheet/StyleSheetTypes';
+import {TextStyle, ViewStyle} from '../StyleSheet/StyleSheetTypes';
 import {
   GestureResponderEvent,
   LayoutChangeEvent,
@@ -294,6 +294,11 @@ export interface TextProps
    * Specifies smallest possible scale a font can reach when adjustsFontSizeToFit is enabled. (values 0.01-1.0).
    */
   minimumFontScale?: number | undefined;
+
+  /**
+   * Controls how touch events are handled. Similar to `View`'s `pointerEvents`.
+   */
+  pointerEvents?: ViewStyle['pointerEvents'] | undefined;
 }
 
 /**