react-native-windows 0.81.3 → 0.82.0-preview.10

package/.flowconfig

@@ -7,9 +7,6 @@
 ; Ignore fb_internal modules
 <PROJECT_ROOT>/packages/react-native/src/fb_internal/.*
 
-; Ignore all flow directory contents in node_modules
-.*/flow/.*
-
 ; These modules have base components and Windows versions.
 ; Ideally we'd delete the base versions of files that had .windows overrides as part of the
 ; initRNLibraries build step
@@ -33,6 +30,9 @@
 <PROJECT_ROOT>/Libraries/Image/resolveAssetSource.js
 <PROJECT_ROOT>/Libraries/Network/RCTNetworking.js
 <PROJECT_ROOT>/Libraries/Pressability/Pressability.js
+<PROJECT_ROOT>/Libraries/Components/Pressable/Pressable.js
+<PROJECT_ROOT>/Libraries/Image/Image.android.js
+
 <PROJECT_ROOT>/Libraries/Renderer/shims/ReactNativeTypes.js
 <PROJECT_ROOT>/Libraries/Text/TextProps.js
 <PROJECT_ROOT>/Libraries/Types/CoreEventTypes.js
@@ -52,6 +52,9 @@
 ; Ignore react-native files in node_modules since they are copied into project root
 .*/node_modules/react-native/.*
 
+; Ignore all flow directory contents in node_modules
+.*/flow/.*
+
 ; Ignore react-native-windows' build output. Flow is not compiled with long path support and after running unittests these folders have long paths
 .*/node_modules/react-native-windows/build/.*
 .*/node_modules/react-native-windows/target/.*
@@ -61,7 +64,6 @@
 
 ; These files dont need to be checked and just increase the build time
 .*/node_modules/e2etest/.*
-.*/node_modules/sample-apps/.*
 .*/node_modules/playground/.*
 
 <PROJECT_ROOT>/packages/react-native/sdks/.*
@@ -147,11 +149,10 @@ module.system.haste.module_ref_prefix=m#
 
 react.runtime=automatic
 
-suppress_type=$FlowIssue
-suppress_type=$FlowFixMe
-suppress_type=$FlowFixMeProps
-suppress_type=$FlowFixMeState
-suppress_type=$FlowFixMeEmpty
+experimental.only_support_flow_fixme_and_expected_error=true
+experimental.require_suppression_with_error_code=true
+experimental.invariant_subtyping_error_message_improvement=true
+experimental.natural_inference.local_object_literals.followup_fix=true
 
 ban_spread_key_props=true
 sharedmemory.hash_table_pow=21
@@ -177,4 +178,4 @@ untyped-import
 untyped-type-import
 
 [version]
-^0.274.2
+^0.280.0

package/Directory.Build.props

@@ -31,10 +31,10 @@
     <FollyCommitHash>ad90720829db5ba0c3d0e44994856dcce33d7940</FollyCommitHash>
     <FastFloatCommitHash>77cc847c842c49e7e3477c1e95da2b6540166d66</FastFloatCommitHash>
     <!-- When bumping the fmt version, be sure to bump the git hash of that version's commit and build fmt.vcxproj (to update its cgmanifest.json) too. -->
-    <FmtVersion>10.1.0</FmtVersion>
-    <FmtCommitHash>ca2e3685b160617d3d95fcd9e789c4e06ca88</FmtCommitHash>
+    <FmtVersion>11.0.2</FmtVersion>
+    <FmtCommitHash>0c9fce2ffefecfdce794e1859584e25877b7b592</FmtCommitHash>
     <!-- Commit hash for https://github.com/microsoft/node-api-jsi code. -->
-    <NodeApiJsiCommitHash>21b47f08b762b21b1d4d970940ab23f59f43249c</NodeApiJsiCommitHash>
+    <NodeApiJsiCommitHash>4b8a4a59c4e1b7b988b809dedffd89a7662aa785</NodeApiJsiCommitHash>
   </PropertyGroup>
 
   <!--

package/Folly/Folly.vcxproj

@@ -49,7 +49,7 @@
   <PropertyGroup>
     <ConfigurationType>StaticLibrary</ConfigurationType>
   </PropertyGroup>
-  <ItemGroup Condition="'$(UseFabric)' == 'true'">
+  <ItemGroup>
     <ClCompile Include="$(MSBuildThisFileDirectory)\ThreadNameStub.cpp" />
     <ClCompile Include="$(FollyDir)\folly\SharedMutex.cpp" />
     <ClCompile Include="$(FollyDir)\folly\concurrency\CacheLocality.cpp" />
@@ -58,8 +58,6 @@
     <ClCompile Include="$(FollyDir)\folly\synchronization\SanitizeThread.cpp" />
     <ClCompile Include="$(FollyDir)\folly\portability\SysResource.cpp" />
     <ClCompile Include="$(FollyDir)\folly\portability\Unistd.cpp" />
-  </ItemGroup>
-  <ItemGroup>
     <ClCompile Include="$(FollyDir)\folly\system\AtFork.cpp" />
     <ClCompile Include="$(FollyDir)\folly\system\ThreadId.cpp" />
     <ClCompile Include="$(FollyDir)\folly\lang\SafeAssert.cpp" />

package/Libraries/ActionSheetIOS/ActionSheetIOS.js

@@ -77,6 +77,8 @@ const ActionSheetIOS = {
     callback: (buttonIndex: number) => void,
   ) {
     invariant(
+      /* $FlowFixMe[invalid-compare] Error discovered during Constant Condition
+       * roll out. See https://fburl.com/workplace/5whu3i34. */
       typeof options === 'object' && options !== null,
       'Options must be a valid object',
     );
@@ -121,11 +123,11 @@ const ActionSheetIOS = {
     RCTActionSheetManager.showActionSheetWithOptions(
       {
         ...remainingOptions,
-        // $FlowFixMe[incompatible-call]
+        // $FlowFixMe[incompatible-type]
         tintColor: processedTintColor,
-        // $FlowFixMe[incompatible-call]
+        // $FlowFixMe[incompatible-type]
         cancelButtonTintColor: processedCancelButtonTintColor,
-        // $FlowFixMe[incompatible-call]
+        // $FlowFixMe[incompatible-type]
         disabledButtonTintColor: processedDisabledButtonTintColor,
         destructiveButtonIndices,
       },
@@ -162,6 +164,8 @@ const ActionSheetIOS = {
     successCallback: Function | ((success: boolean, method: ?string) => void),
   ) {
     invariant(
+      /* $FlowFixMe[invalid-compare] Error discovered during Constant Condition
+       * roll out. See https://fburl.com/workplace/5whu3i34. */
       typeof options === 'object' && options !== null,
       'Options must be a valid object',
     );

package/Libraries/Alert/RCTAlertManager.android.js

@@ -24,10 +24,12 @@ export function alertWithArgs(
   }
 
   NativeDialogManagerAndroid.showAlert(
-    // $FlowFixMe[prop-missing] - Mismatched platform interfaces.
+    // $FlowFixMe[incompatible-type] - Mismatched platform interfaces.
     args,
     emptyCallback,
-    // $FlowFixMe[incompatible-call] - Mismatched platform interfaces.
+    // $FlowFixMe[incompatible-type] - Mismatched platform interfaces.
+    /* $FlowFixMe[constant-condition] Error discovered during Constant
+     * Condition roll out. See https://fburl.com/workplace/1v97vimq. */
     callback || emptyCallback,
   );
 }

package/Libraries/Animated/Animated.d.ts

@@ -551,6 +551,7 @@ export namespace Animated {
     [K in keyof T]: WithAnimatedValue<T[K]>;
   };
 
+  // prettier-ignore
   export type WithAnimatedValue<T> = T extends Builtin | Nullable
     ? T
     : T extends Primitive
@@ -563,6 +564,7 @@ export namespace Animated {
 
   type NonAnimatedProps = 'key' | 'ref';
 
+  // prettier-ignore
   type TAugmentRef<T> = T extends React.Ref<infer R>
     ? unknown extends R
       ? never

package/Libraries/Animated/AnimatedEvent.js

@@ -84,7 +84,7 @@ export function attachNativeEventImpl(
           NativeAnimatedHelper.API.removeAnimatedEventFromView(
             viewTag,
             eventName,
-            // $FlowFixMe[incompatible-call]
+            // $FlowFixMe[incompatible-type]
             mapping.animatedValueTag,
           );
         });

package/Libraries/Animated/AnimatedExports.js.flow

@@ -10,6 +10,7 @@
 
 import AnimatedImplementation from './AnimatedImplementation';
 
+export type {CompositeAnimation} from './AnimatedImplementation';
 export type {DecayAnimationConfig} from './animations/DecayAnimation';
 export type {SpringAnimationConfig} from './animations/SpringAnimation';
 export type {TimingAnimationConfig} from './animations/TimingAnimation';

package/Libraries/Animated/AnimatedImplementation.js

@@ -94,6 +94,8 @@ const _combineCallbacks = function (
   if (callback && config.onComplete) {
     return (...args: Array<EndResult>) => {
       config.onComplete && config.onComplete(...args);
+      /* $FlowFixMe[constant-condition] Error discovered during Constant
+       * Condition roll out. See https://fburl.com/workplace/1v97vimq. */
       callback && callback(...args);
     };
   } else {
@@ -372,7 +374,7 @@ const parallelImpl = function (
   const hasEnded: {[number]: boolean} = {};
   const stopTogether = !(config && config.stopTogether === false);
 
-  const result = {
+  const result: CompositeAnimation = {
     start: function (callback?: ?EndCallback, isLooping?: boolean) {
       if (doneCount === animations.length) {
         callback && callback({finished: true});
@@ -460,7 +462,7 @@ type LoopAnimationConfig = {
 
 const loopImpl = function (
   animation: CompositeAnimation,
-  // $FlowFixMe[prop-missing]
+  // $FlowFixMe[incompatible-type]
   {iterations = -1, resetBeforeIteration = true}: LoopAnimationConfig = {},
 ): CompositeAnimation {
   let isFinished = false;

package/Libraries/Animated/AnimatedMock.js

@@ -158,7 +158,7 @@ type LoopAnimationConfig = {
 
 const loop = function (
   animation: CompositeAnimation,
-  // $FlowFixMe[prop-missing]
+  // $FlowFixMe[incompatible-type]
   {iterations = -1}: LoopAnimationConfig = {},
 ): CompositeAnimation {
   return emptyAnimation;

package/Libraries/Animated/Easing.js

@@ -91,6 +91,8 @@ const EasingStatic = {
    * http://cubic-bezier.com/#.42,0,1,1
    */
   ease(t: number): number {
+    /* $FlowFixMe[constant-condition] Error discovered during Constant
+     * Condition roll out. See https://fburl.com/workplace/1v97vimq. */
     if (!ease) {
       ease = EasingStatic.bezier(0.42, 0, 1, 1);
     }

package/Libraries/Animated/NativeAnimatedAllowlist.js

@@ -48,6 +48,7 @@ const SUPPORTED_STYLES: {[string]: true} = {
   borderStartStartRadius: true,
   elevation: true,
   opacity: true,
+  filter: true,
   transform: true,
   zIndex: true,
   /* ios styles */

package/Libraries/Animated/animations/Animation.js

@@ -41,9 +41,9 @@ let startNativeAnimationNextId = 1;
 // Once an animation has been stopped or finished its course, it will
 // not be reused.
 export default class Animation {
-  #nativeID: ?number;
-  #onEnd: ?EndCallback;
-  #useNativeDriver: boolean;
+  _nativeID: ?number;
+  _onEnd: ?EndCallback;
+  _useNativeDriver: boolean;
 
   __active: boolean;
   __isInteraction: boolean;
@@ -52,10 +52,10 @@ export default class Animation {
   __debugID: ?string;
 
   constructor(config: AnimationConfig) {
-    this.#useNativeDriver = NativeAnimatedHelper.shouldUseNativeDriver(config);
+    this._useNativeDriver = NativeAnimatedHelper.shouldUseNativeDriver(config);
 
     this.__active = false;
-    this.__isInteraction = config.isInteraction ?? !this.#useNativeDriver;
+    this.__isInteraction = config.isInteraction ?? !this._useNativeDriver;
     this.__isLooping = config.isLooping;
     this.__iterations = config.iterations ?? 1;
     if (__DEV__) {
@@ -70,7 +70,7 @@ export default class Animation {
     previousAnimation: ?Animation,
     animatedValue: AnimatedValue,
   ): void {
-    if (!this.#useNativeDriver && animatedValue.__isNative === true) {
+    if (!this._useNativeDriver && animatedValue.__isNative === true) {
       throw new Error(
         'Attempting to run JS driven animation on animated node ' +
           'that has been moved to "native" earlier by starting an ' +
@@ -78,13 +78,13 @@ export default class Animation {
       );
     }
 
-    this.#onEnd = onEnd;
+    this._onEnd = onEnd;
     this.__active = true;
   }
 
   stop(): void {
-    if (this.#nativeID != null) {
-      const nativeID = this.#nativeID;
+    if (this._nativeID != null) {
+      const nativeID = this._nativeID;
       const identifier = `${nativeID}:stopAnimation`;
       try {
         // This is only required when singleOpBatching is used, as otherwise
@@ -123,7 +123,7 @@ export default class Animation {
   }
 
   __startAnimationIfNative(animatedValue: AnimatedValue): boolean {
-    if (!this.#useNativeDriver) {
+    if (!this._useNativeDriver) {
       return false;
     }
 
@@ -135,9 +135,9 @@ export default class Animation {
     try {
       const config = this.__getNativeAnimationConfig();
       animatedValue.__makeNative(config.platformConfig);
-      this.#nativeID = NativeAnimatedHelper.generateNewAnimationId();
+      this._nativeID = NativeAnimatedHelper.generateNewAnimationId();
       NativeAnimatedHelper.API.startAnimatingNode(
-        this.#nativeID,
+        this._nativeID,
         animatedValue.__getNativeTag(),
         config,
         result => {
@@ -150,12 +150,11 @@ export default class Animation {
           if (value != null) {
             animatedValue.__onAnimatedValueUpdateReceived(value, offset);
 
-            if (
-              !(
-                ReactNativeFeatureFlags.cxxNativeAnimatedEnabled() &&
-                ReactNativeFeatureFlags.cxxNativeAnimatedRemoveJsSync()
-              )
-            ) {
+            const isJsSyncRemoved =
+              ReactNativeFeatureFlags.cxxNativeAnimatedEnabled() &&
+              !ReactNativeFeatureFlags.disableFabricCommitInCXXAnimated() &&
+              ReactNativeFeatureFlags.cxxNativeAnimatedRemoveJsSync();
+            if (!isJsSyncRemoved) {
               if (this.__isLooping === true) {
                 return;
               }
@@ -185,9 +184,9 @@ export default class Animation {
    * callback will never be called more than once.
    */
   __notifyAnimationEnd(result: EndResult): void {
-    const callback = this.#onEnd;
+    const callback = this._onEnd;
     if (callback != null) {
-      this.#onEnd = null;
+      this._onEnd = null;
       callback(result);
     }
   }

package/Libraries/Animated/animations/TimingAnimation.js

@@ -49,6 +49,8 @@ export type TimingAnimationConfigSingle = $ReadOnly<{
 
 let _easeInOut;
 function easeInOut() {
+  /* $FlowFixMe[constant-condition] Error discovered during Constant Condition
+   * roll out. See https://fburl.com/workplace/1v97vimq. */
   if (!_easeInOut) {
     const Easing = require('../Easing').default;
     _easeInOut = Easing.inOut(Easing.ease);

package/Libraries/Animated/components/AnimatedScrollView.js

@@ -54,7 +54,8 @@ const AnimatedScrollView: AnimatedComponentType<
     props.style != null
   ) {
     return (
-      // $FlowFixMe - It should return an Animated ScrollView but it returns a ScrollView with Animated props applied.
+      // $FlowFixMe[incompatible-type] - It should return an Animated ScrollView but it returns a ScrollView with Animated props applied.
+      // $FlowFixMe[incompatible-variance]
       <AnimatedScrollViewWithInvertedRefreshControl
         scrollEventThrottle={0.0001}
         {...props}
@@ -89,7 +90,7 @@ const AnimatedScrollViewWithInvertedRefreshControl =
     const {intermediatePropsForRefreshControl, intermediatePropsForScrollView} =
       useMemo(() => {
         // $FlowFixMe[underconstrained-implicit-instantiation]
-        // $FlowFixMe[incompatible-call]
+        // $FlowFixMe[incompatible-type]
         const {outer, inner} = splitLayoutProps(flattenStyle(props.style));
         return {
           intermediatePropsForRefreshControl: {style: outer},

package/Libraries/Animated/components/AnimatedSectionList.js

@@ -14,7 +14,7 @@ import SectionList, {type SectionListProps} from '../../Lists/SectionList';
 import createAnimatedComponent from '../createAnimatedComponent';
 import * as React from 'react';
 
-// $FlowFixMe
+// $FlowFixMe[incompatible-type]
 export default (createAnimatedComponent(SectionList): component<
   // $FlowExpectedError[unclear-type]
   ItemT = any,

package/Libraries/Animated/nodes/AnimatedColor.js

@@ -60,12 +60,12 @@ function processColor(
   }
 
   if (isRgbaValue(color)) {
-    // $FlowIgnore[incompatible-cast] - Type is verified above
+    // $FlowFixMe[incompatible-type] - Type is verified above
     return (color: RgbaValue);
   }
 
   let normalizedColor: ?ProcessedColorValue = normalizeColor(
-    // $FlowIgnore[incompatible-cast] - Type is verified above
+    // $FlowFixMe[incompatible-type] - Type is verified above
     (color: ColorValue),
   );
   if (normalizedColor === undefined || normalizedColor === null) {
@@ -125,7 +125,7 @@ export default class AnimatedColor extends AnimatedWithChildren {
     let value: RgbaValue | RgbaAnimatedValue | ColorValue =
       valueIn ?? defaultColor;
     if (isRgbaAnimatedValue(value)) {
-      // $FlowIgnore[incompatible-cast] - Type is verified above
+      // $FlowFixMe[incompatible-type] - Type is verified above
       const rgbaAnimatedValue: RgbaAnimatedValue = (value: RgbaAnimatedValue);
       this.r = rgbaAnimatedValue.r;
       this.g = rgbaAnimatedValue.g;
@@ -133,14 +133,14 @@ export default class AnimatedColor extends AnimatedWithChildren {
       this.a = rgbaAnimatedValue.a;
     } else {
       const processedColor: RgbaValue | NativeColorValue =
-        // $FlowIgnore[incompatible-cast] - Type is verified above
+        // $FlowFixMe[incompatible-type] - Type is verified above
         processColor((value: ColorValue | RgbaValue)) ?? defaultColor;
       let initColor: RgbaValue = defaultColor;
       if (isRgbaValue(processedColor)) {
-        // $FlowIgnore[incompatible-cast] - Type is verified above
+        // $FlowFixMe[incompatible-type] - Type is verified above
         initColor = (processedColor: RgbaValue);
       } else {
-        // $FlowIgnore[incompatible-cast] - Type is verified above
+        // $FlowFixMe[incompatible-type] - Type is verified above
         this.nativeColor = (processedColor: NativeColorValue);
       }
 
@@ -170,7 +170,7 @@ export default class AnimatedColor extends AnimatedWithChildren {
       processColor(value) ?? defaultColor;
     this._withSuspendedCallbacks(() => {
       if (isRgbaValue(processedColor)) {
-        // $FlowIgnore[incompatible-type] - Type is verified above
+        // $FlowFixMe[incompatible-type] - Type is verified above
         const rgbaValue: RgbaValue = processedColor;
         this.r.setValue(rgbaValue.r);
         this.g.setValue(rgbaValue.g);
@@ -181,7 +181,7 @@ export default class AnimatedColor extends AnimatedWithChildren {
           shouldUpdateNodeConfig = true;
         }
       } else {
-        // $FlowIgnore[incompatible-type] - Type is verified above
+        // $FlowFixMe[incompatible-type] - Type is verified above
         const nativeColor: NativeColorValue = processedColor;
         if (this.nativeColor !== nativeColor) {
           this.nativeColor = nativeColor;
@@ -203,7 +203,7 @@ export default class AnimatedColor extends AnimatedWithChildren {
       flushValue(this);
     }
 
-    // $FlowFixMe[incompatible-call]
+    // $FlowFixMe[incompatible-type]
     this.__callListeners(this.__getValue());
   }
 

package/Libraries/Animated/nodes/AnimatedInterpolation.js

@@ -224,7 +224,7 @@ function createStringInterpolation(
       outputRange.every(output =>
         output.components.every(
           (component, i) =>
-            // $FlowIgnoreMe[invalid-compare]
+            // $FlowFixMe[invalid-compare]
             typeof component === 'number' || component === firstOutput[i],
         ),
       ),
@@ -235,9 +235,9 @@ function createStringInterpolation(
   const numericComponents: $ReadOnlyArray<$ReadOnlyArray<number>> =
     outputRange.map(output =>
       isColor
-        ? // $FlowIgnoreMe[incompatible-call]
+        ? // $FlowFixMe[incompatible-type]
           output.components
-        : // $FlowIgnoreMe[incompatible-call]
+        : // $FlowFixMe[incompatible-call]
           output.components.filter(c => typeof c === 'number'),
     );
   const interpolations = numericComponents[0].map((_, i) =>
@@ -393,7 +393,7 @@ export default class AnimatedInterpolation<
     let outputRange = this._config.outputRange;
     let outputType = null;
     if (typeof outputRange[0] === 'string') {
-      // $FlowIgnoreMe[incompatible-cast]
+      // $FlowFixMe[incompatible-type]
       outputRange = ((outputRange: $ReadOnlyArray<string>).map(value => {
         const processedColor = processColor(value);
         if (typeof processedColor === 'number') {

package/Libraries/Animated/nodes/AnimatedNode.js

@@ -17,6 +17,7 @@ type ValueListenerCallback = (state: {value: number, ...}) => mixed;
 
 export type AnimatedNodeConfig = $ReadOnly<{
   debugID?: string,
+  unstable_disableBatchingForNativeCreate?: boolean,
 }>;
 
 let _uniqueId = 1;
@@ -28,7 +29,7 @@ let _assertNativeAnimatedModule: ?() => void = () => {
 };
 
 export default class AnimatedNode {
-  #listeners: Map<string, ValueListenerCallback>;
+  _listeners: Map<string, ValueListenerCallback>;
 
   _platformConfig: ?PlatformConfig = undefined;
 
@@ -38,10 +39,12 @@ export default class AnimatedNode {
       ...
     }>,
   ) {
-    this.#listeners = new Map();
+    this._listeners = new Map();
     if (__DEV__) {
       this.__debugID = config?.debugID;
     }
+    this.__disableBatchingForNativeCreate =
+      config?.unstable_disableBatchingForNativeCreate;
   }
 
   __attach(): void {}
@@ -65,6 +68,7 @@ export default class AnimatedNode {
   /* Methods and props used by native Animated impl */
   __isNative: boolean = false;
   __nativeTag: ?number = undefined;
+  __disableBatchingForNativeCreate: ?boolean = undefined;
 
   __makeNative(platformConfig: ?PlatformConfig): void {
     // Subclasses are expected to set `__isNative` to true before this.
@@ -85,7 +89,7 @@ export default class AnimatedNode {
    */
   addListener(callback: (value: any) => mixed): string {
     const id = String(_uniqueId++);
-    this.#listeners.set(id, callback);
+    this._listeners.set(id, callback);
     return id;
   }
 
@@ -96,7 +100,7 @@ export default class AnimatedNode {
    * See https://reactnative.dev/docs/animatedvalue#removelistener
    */
   removeListener(id: string): void {
-    this.#listeners.delete(id);
+    this._listeners.delete(id);
   }
 
   /**
@@ -105,11 +109,11 @@ export default class AnimatedNode {
    * See https://reactnative.dev/docs/animatedvalue#removealllisteners
    */
   removeAllListeners(): void {
-    this.#listeners.clear();
+    this._listeners.clear();
   }
 
   hasListeners(): boolean {
-    return this.#listeners.size > 0;
+    return this._listeners.size > 0;
   }
 
   __onAnimatedValueUpdateReceived(value: number, offset: number): void {
@@ -118,7 +122,7 @@ export default class AnimatedNode {
 
   __callListeners(value: number): void {
     const event = {value};
-    this.#listeners.forEach(listener => {
+    this._listeners.forEach(listener => {
       listener(event);
     });
   }
@@ -142,6 +146,9 @@ export default class AnimatedNode {
       if (this._platformConfig) {
         config.platformConfig = this._platformConfig;
       }
+      if (this.__disableBatchingForNativeCreate) {
+        config.disableBatchingForNativeCreate = true;
+      }
       NativeAnimatedHelper.API.createAnimatedNode(nativeTag, config);
     }
     return nativeTag;

package/Libraries/Animated/nodes/AnimatedObject.js

@@ -21,7 +21,7 @@ const MAX_DEPTH = 5;
 
 export function isPlainObject(
   value: mixed,
-  /* $FlowIssue[incompatible-type-guard] - Flow does not know that the prototype
+  /* $FlowFixMe[incompatible-type-guard] - Flow does not know that the prototype
      and ReactElement checks preserve the type refinement of `value`. */
 ): value is $ReadOnly<{[string]: mixed}> {
   return (
@@ -82,7 +82,7 @@ function mapAnimatedNodes(value: any, fn: any => any, depth: number = 0): any {
 }
 
 export default class AnimatedObject extends AnimatedWithChildren {
-  #nodes: $ReadOnlyArray<AnimatedNode>;
+  _nodes: $ReadOnlyArray<AnimatedNode>;
   _value: mixed;
 
   /**
@@ -106,7 +106,7 @@ export default class AnimatedObject extends AnimatedWithChildren {
     config?: ?AnimatedNodeConfig,
   ) {
     super(config);
-    this.#nodes = nodes;
+    this._nodes = nodes;
     this._value = value;
   }
 
@@ -117,7 +117,7 @@ export default class AnimatedObject extends AnimatedWithChildren {
   }
 
   __getValueWithStaticObject(staticObject: mixed): any {
-    const nodes = this.#nodes;
+    const nodes = this._nodes;
     let index = 0;
     // NOTE: We can depend on `this._value` and `staticObject` sharing a
     // structure because of `useAnimatedPropsMemo`.
@@ -131,7 +131,7 @@ export default class AnimatedObject extends AnimatedWithChildren {
   }
 
   __attach(): void {
-    const nodes = this.#nodes;
+    const nodes = this._nodes;
     for (let ii = 0, length = nodes.length; ii < length; ii++) {
       const node = nodes[ii];
       node.__addChild(this);
@@ -140,7 +140,7 @@ export default class AnimatedObject extends AnimatedWithChildren {
   }
 
   __detach(): void {
-    const nodes = this.#nodes;
+    const nodes = this._nodes;
     for (let ii = 0, length = nodes.length; ii < length; ii++) {
       const node = nodes[ii];
       node.__removeChild(this);
@@ -149,7 +149,7 @@ export default class AnimatedObject extends AnimatedWithChildren {
   }
 
   __makeNative(platformConfig: ?PlatformConfig): void {
-    const nodes = this.#nodes;
+    const nodes = this._nodes;
     for (let ii = 0, length = nodes.length; ii < length; ii++) {
       const node = nodes[ii];
       node.__makeNative(platformConfig);