react-native-windows 0.76.3 → 0.77.0-preview.2

package/index.js

@@ -71,7 +71,10 @@ import typeof I18nManager from './Libraries/ReactNative/I18nManager';
 import typeof {RootTagContext} from './Libraries/ReactNative/RootTag';
 import typeof UIManager from './Libraries/ReactNative/UIManager';
 import typeof ReactNative from './Libraries/Renderer/shims/ReactNative';
-import type {HostComponent as _HostComponentInternal} from './Libraries/Renderer/shims/ReactNativeTypes';
+import type {
+  HostComponent,
+  HostInstance,
+} from './Libraries/Renderer/shims/ReactNativeTypes';
 import typeof Settings from './Libraries/Settings/Settings';
 import typeof Share from './Libraries/Share/Share';
 import typeof {PlatformColor} from './Libraries/StyleSheet/PlatformColorValueTypes';
@@ -93,11 +96,12 @@ import typeof useColorScheme from './Libraries/Utilities/useColorScheme';
 import typeof useWindowDimensions from './Libraries/Utilities/useWindowDimensions';
 import typeof Vibration from './Libraries/Vibration/Vibration';
 import typeof YellowBox from './Libraries/YellowBox/YellowBoxDeprecated';
+import typeof DevMenu from './src/private/devmenu/DevMenu';
 
 const warnOnce = require('./Libraries/Utilities/warnOnce');
 const invariant = require('invariant');
 
-export type HostComponent<T> = _HostComponentInternal<T>;
+export type {HostComponent, HostInstance};
 
 module.exports = {
   get registerCallableModule(): RegisterCallableModule {
@@ -238,6 +242,9 @@ module.exports = {
   get DeviceInfo(): DeviceInfo {
     return require('./Libraries/Utilities/DeviceInfo');
   },
+  get DevMenu(): DevMenu {
+    return require('./src/private/devmenu/DevMenu');
+  },
   get DevSettings(): DevSettings {
     return require('./Libraries/Utilities/DevSettings');
   },
@@ -368,7 +375,7 @@ module.exports = {
   get processColor(): processColor {
     return require('./Libraries/StyleSheet/processColor').default;
   },
-  get requireNativeComponent(): <T>(
+  get requireNativeComponent(): <T: {...}>(
     uiViewClassName: string,
   ) => HostComponent<T> {
     return require('./Libraries/ReactNative/requireNativeComponent').default;

package/index.windows.js

@@ -73,7 +73,10 @@ import typeof I18nManager from './Libraries/ReactNative/I18nManager';
 import typeof {RootTagContext} from './Libraries/ReactNative/RootTag';
 import typeof UIManager from './Libraries/ReactNative/UIManager';
 import typeof ReactNative from './Libraries/Renderer/shims/ReactNative';
-import type {HostComponent as _HostComponentInternal} from './Libraries/Renderer/shims/ReactNativeTypes';
+import type {
+  HostComponent,
+  HostInstance,
+} from './Libraries/Renderer/shims/ReactNativeTypes';
 import typeof Settings from './Libraries/Settings/Settings';
 import typeof Share from './Libraries/Share/Share';
 import typeof {PlatformColor} from './Libraries/StyleSheet/PlatformColorValueTypes';
@@ -95,11 +98,12 @@ import typeof useColorScheme from './Libraries/Utilities/useColorScheme';
 import typeof useWindowDimensions from './Libraries/Utilities/useWindowDimensions';
 import typeof Vibration from './Libraries/Vibration/Vibration';
 import typeof YellowBox from './Libraries/YellowBox/YellowBoxDeprecated';
+import typeof DevMenu from './src/private/devmenu/DevMenu';
 
 const warnOnce = require('./Libraries/Utilities/warnOnce');
 const invariant = require('invariant');
 
-export type HostComponent<T> = _HostComponentInternal<T>;
+export type {HostComponent, HostInstance};
 
 module.exports = {
   // Components
@@ -237,6 +241,9 @@ module.exports = {
   get DeviceInfo(): DeviceInfo {
     return require('./Libraries/Utilities/DeviceInfo');
   },
+  get DevMenu(): DevMenu {
+    return require('./src/private/devmenu/DevMenu');
+  },
   get DevSettings(): DevSettings {
     return require('./Libraries/Utilities/DevSettings');
   },
@@ -369,7 +376,7 @@ module.exports = {
   get processColor(): processColor {
     return require('./Libraries/StyleSheet/processColor').default;
   },
-  get requireNativeComponent(): <T>(
+  get requireNativeComponent(): <T: {...}>(
     uiViewClassName: string,
   ) => HostComponent<T> {
     return require('./Libraries/ReactNative/requireNativeComponent').default;

package/jest/setup.js

@@ -146,11 +146,14 @@ jest
         remove: jest.fn(),
       })),
       announceForAccessibility: jest.fn(),
+      announceForAccessibilityWithOptions: jest.fn(),
       isAccessibilityServiceEnabled: jest.fn(() => Promise.resolve(false)),
       isBoldTextEnabled: jest.fn(() => Promise.resolve(false)),
       isGrayscaleEnabled: jest.fn(() => Promise.resolve(false)),
       isInvertColorsEnabled: jest.fn(() => Promise.resolve(false)),
       isReduceMotionEnabled: jest.fn(() => Promise.resolve(false)),
+      isHighTextContrastEnabled: jest.fn(() => Promise.resolve(false)),
+      isDarkerSystemColorsEnabled: jest.fn(() => Promise.resolve(false)),
       prefersCrossFadeTransitions: jest.fn(() => Promise.resolve(false)),
       isReduceTransparencyEnabled: jest.fn(() => Promise.resolve(false)),
       isScreenReaderEnabled: jest.fn(() => Promise.resolve(false)),
@@ -279,6 +282,34 @@ jest
       addListener: jest.fn(),
       removeListeners: jest.fn(),
     },
+    NativeAnimatedModule: {
+      createAnimatedNode: jest.fn(),
+      updateAnimatedNodeConfig: jest.fn(),
+      getValue: jest.fn(),
+      startListeningToAnimatedNodeValue: jest.fn(),
+      stopListeningToAnimatedNodeValue: jest.fn(),
+      connectAnimatedNodes: jest.fn(),
+      disconnectAnimatedNodes: jest.fn(),
+      startAnimatingNode: jest.fn(
+        (animationId, nodeTag, config, endCallback) => {
+          setTimeout(() => endCallback({finished: true}), 16);
+        },
+      ),
+      stopAnimation: jest.fn(),
+      setAnimatedNodeValue: jest.fn(),
+      setAnimatedNodeOffset: jest.fn(),
+      flattenAnimatedNodeOffset: jest.fn(),
+      extractAnimatedNodeOffset: jest.fn(),
+      connectAnimatedNodeToView: jest.fn(),
+      disconnectAnimatedNodeFromView: jest.fn(),
+      restoreDefaultValues: jest.fn(),
+      dropAnimatedNode: jest.fn(),
+      addAnimatedEventToView: jest.fn(),
+      removeAnimatedEventFromView: jest.fn(),
+      addListener: jest.fn(),
+      removeListener: jest.fn(),
+      removeListeners: jest.fn(),
+    },
     Networking: {
       sendRequest: jest.fn(),
       abortRequest: jest.fn(),
@@ -417,4 +448,8 @@ jest
     return jest.requireActual(
       '../Libraries/ReactNative/RendererImplementation',
     );
-  });
+  })
+  .mock('../Libraries/Utilities/useColorScheme', () => ({
+    __esModule: true,
+    default: jest.fn().mockReturnValue('light'),
+  }));

package/just-task.js

@@ -41,6 +41,20 @@ function codegen(test) {
   );
 }
 
+function layoutMSRNCxx() {
+  if (require('os').platform() === 'win32') {
+    const powershell = `${process.env.SystemRoot}\\System32\\WindowsPowerShell\\v1.0\\powershell.exe`;
+    execSync(
+      `${powershell} -NoProfile .\\Scripts\\Tfs\\Layout-MSRN-Headers.ps1 -GenerateLocalCxx`,
+      {
+        env: process.env,
+      },
+    );
+  }
+}
+
+task('layoutMSRNCxx', layoutMSRNCxx);
+
 task('codegen', () => codegen(false));
 task('codegen:check', () => codegen(true));
 
@@ -63,6 +77,7 @@ task(
     condition('clean', () => argv().clean),
     'copyRNLibraries',
     'copyReadmeAndLicenseFromRoot',
+    'layoutMSRNCxx',
     'compileTsPlatformOverrides',
     'codegen',
   ),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-windows",
-  "version": "0.76.3",
+  "version": "0.77.0-preview.2",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -26,20 +26,20 @@
     "@react-native-community/cli": "15.0.0-alpha.2",
     "@react-native-community/cli-platform-android": "15.0.0-alpha.2",
     "@react-native-community/cli-platform-ios": "15.0.0-alpha.2",
-    "@react-native-windows/cli": "0.76.1",
+    "@react-native-windows/cli": "0.77.0-preview.1",
     "@react-native/assets": "1.0.0",
-    "@react-native/assets-registry": "0.76.2",
-    "@react-native/codegen": "0.76.2",
-    "@react-native/community-cli-plugin": "0.76.2",
-    "@react-native/gradle-plugin": "0.76.2",
-    "@react-native/js-polyfills": "0.76.2",
-    "@react-native/normalize-colors": "0.76.2",
-    "@react-native/virtualized-lists": "0.76.2",
+    "@react-native/assets-registry": "0.77.0-rc.4",
+    "@react-native/codegen": "0.77.0-rc.4",
+    "@react-native/community-cli-plugin": "0.77.0-rc.4",
+    "@react-native/gradle-plugin": "0.77.0-rc.4",
+    "@react-native/js-polyfills": "0.77.0-rc.4",
+    "@react-native/normalize-colors": "0.77.0-rc.4",
+    "@react-native/virtualized-lists": "0.77.0-rc.4",
     "abort-controller": "^3.0.0",
     "anser": "^1.4.9",
     "ansi-regex": "^5.0.0",
     "babel-jest": "^29.7.0",
-    "babel-plugin-syntax-hermes-parser": "^0.23.1",
+    "babel-plugin-syntax-hermes-parser": "0.25.1",
     "base64-js": "^1.5.1",
     "chalk": "^4.0.0",
     "commander": "^12.0.0",
@@ -56,7 +56,7 @@
     "nullthrows": "^1.1.1",
     "pretty-format": "^29.7.0",
     "promise": "^8.3.0",
-    "react-devtools-core": "^5.3.1",
+    "react-devtools-core": "^6.0.1",
     "react-refresh": "^0.14.0",
     "react-shallow-renderer": "^16.15.0",
     "regenerator-runtime": "^0.13.2",
@@ -69,38 +69,38 @@
     "yargs": "^17.6.2"
   },
   "devDependencies": {
-    "@react-native-windows/codegen": "0.76.1",
-    "@react-native/metro-config": "0.76.2",
+    "@react-native-windows/codegen": "0.77.0-preview.1",
+    "@react-native/metro-config": "0.77.0-nightly-20241001-223e98cc4",
     "@rnw-scripts/babel-react-native-config": "0.0.0",
-    "@rnw-scripts/eslint-config": "1.2.27",
-    "@rnw-scripts/jest-out-of-tree-snapshot-resolver": "^1.1.31",
-    "@rnw-scripts/just-task": "2.3.44",
+    "@rnw-scripts/eslint-config": "1.2.30",
+    "@rnw-scripts/jest-out-of-tree-snapshot-resolver": "^1.1.34",
+    "@rnw-scripts/just-task": "2.3.47",
     "@rnw-scripts/metro-dev-config": "0.0.0",
     "@rnx-kit/jest-preset": "^0.1.17",
     "@types/node": "^18.0.0",
     "@types/react": "^18.2.6",
     "eslint": "^8.19.0",
-    "flow-bin": "^0.245.2",
+    "flow-bin": "^0.250.0",
     "jscodeshift": "^0.14.0",
     "just-scripts": "^1.3.3",
     "prettier": "2.8.8",
     "react": "18.3.1",
-    "react-native": "0.76.2",
-    "react-native-platform-override": "^1.9.46",
+    "react-native": "0.77.0-rc.4",
+    "react-native-platform-override": "^1.9.49",
     "react-refresh": "^0.14.0",
     "typescript": "5.0.4"
   },
   "peerDependencies": {
     "@types/react": "^18.2.6",
     "react": "^18.2.0",
-    "react-native": "^0.76.0"
+    "react-native": "0.77.0-rc.4"
   },
   "beachball": {
-    "defaultNpmTag": "latest",
+    "defaultNpmTag": "preview",
     "disallowedChangeTypes": [
       "major",
       "minor",
-      "prerelease",
+      "patch",
       "premajor",
       "preminor",
       "prepatch"

package/src/private/animated/NativeAnimatedHelper.js

@@ -8,7 +8,6 @@
  * @format
  */
 
-import type {EventSubscription} from '../../../Libraries/vendor/emitter/EventEmitter';
 import type {EventConfig} from '../../../Libraries/Animated/AnimatedEvent';
 import type {
   AnimationConfig,
@@ -18,13 +17,14 @@ import type {
   AnimatedNodeConfig,
   EventMapping,
 } from '../../../Libraries/Animated/NativeAnimatedModule';
+import type {EventSubscription} from '../../../Libraries/vendor/emitter/EventEmitter';
 
-import * as ReactNativeFeatureFlags from '../featureflags/ReactNativeFeatureFlags';
+import NativeAnimatedNonTurboModule from '../../../Libraries/Animated/NativeAnimatedModule';
+import NativeAnimatedTurboModule from '../../../Libraries/Animated/NativeAnimatedTurboModule';
 import NativeEventEmitter from '../../../Libraries/EventEmitter/NativeEventEmitter';
 import RCTDeviceEventEmitter from '../../../Libraries/EventEmitter/RCTDeviceEventEmitter';
 import Platform from '../../../Libraries/Utilities/Platform';
-import NativeAnimatedNonTurboModule from '../../../Libraries/Animated/NativeAnimatedModule';
-import NativeAnimatedTurboModule from '../../../Libraries/Animated/NativeAnimatedTurboModule';
+import * as ReactNativeFeatureFlags from '../featureflags/ReactNativeFeatureFlags';
 import invariant from 'invariant';
 import nullthrows from 'nullthrows';
 
@@ -46,7 +46,7 @@ const isSingleOpBatching =
   Platform.OS === 'android' &&
   NativeAnimatedModule?.queueAndExecuteBatchedOperations != null &&
   ReactNativeFeatureFlags.animatedShouldUseSingleOp();
-let flushQueueTimeout = null;
+let flushQueueImmediate = null;
 
 const eventListenerGetValueCallbacks: {
   [number]: (value: number) => void,
@@ -142,9 +142,13 @@ const API = {
     queueOperations = true;
     if (
       ReactNativeFeatureFlags.animatedShouldDebounceQueueFlush() &&
-      flushQueueTimeout
+      flushQueueImmediate
     ) {
-      clearTimeout(flushQueueTimeout);
+      if (ReactNativeFeatureFlags.enableAnimatedClearImmediateFix()) {
+        clearImmediate(flushQueueImmediate);
+      } else {
+        clearTimeout(flushQueueImmediate);
+      }
     }
   },
 
@@ -161,9 +165,9 @@ const API = {
     invariant(NativeAnimatedModule, 'Native animated module is not available');
 
     if (ReactNativeFeatureFlags.animatedShouldDebounceQueueFlush()) {
-      const prevTimeout = flushQueueTimeout;
-      clearImmediate(prevTimeout);
-      flushQueueTimeout = setImmediate(API.flushQueue);
+      const prevImmediate = flushQueueImmediate;
+      clearImmediate(prevImmediate);
+      flushQueueImmediate = setImmediate(API.flushQueue);
     } else {
       API.flushQueue();
     }
@@ -171,12 +175,11 @@ const API = {
 
   flushQueue: (isSingleOpBatching
     ? (): void => {
-        // TODO: (T136971132)
         invariant(
-          NativeAnimatedModule || process.env.NODE_ENV === 'test',
+          NativeAnimatedModule,
           'Native animated module is not available',
         );
-        flushQueueTimeout = null;
+        flushQueueImmediate = null;
 
         if (singleOpQueue.length === 0) {
           return;
@@ -193,12 +196,11 @@ const API = {
         singleOpQueue.length = 0;
       }
     : (): void => {
-        // TODO: (T136971132)
         invariant(
-          NativeAnimatedModule || process.env.NODE_ENV === 'test',
+          NativeAnimatedModule,
           'Native animated module is not available',
         );
-        flushQueueTimeout = null;
+        flushQueueImmediate = null;
 
         if (queue.length === 0) {
           return;