react-native-windows 0.70.9 → 0.71.0-preview.2

package/Libraries/Animated/components/AnimatedImage.js

@@ -8,14 +8,13 @@
  * @format
  */
 
-import * as React from 'react';
-
-const Image = require('../../Image/Image');
-const createAnimatedComponent = require('../createAnimatedComponent');
-
 import type {AnimatedComponentType} from '../createAnimatedComponent';
 
-module.exports = (createAnimatedComponent(
+import Image from '../../Image/Image';
+import createAnimatedComponent from '../createAnimatedComponent';
+import * as React from 'react';
+
+export default (createAnimatedComponent(
   (Image: $FlowFixMe),
 ): AnimatedComponentType<
   React.ElementConfig<typeof Image>,

package/Libraries/Animated/components/AnimatedScrollView.js

@@ -8,23 +8,119 @@
  * @format
  */
 
+import type {____ViewStyle_Internal} from '../../StyleSheet/StyleSheetTypes';
+import type {AnimatedComponentType} from '../createAnimatedComponent';
+
+import RefreshControl from '../../Components/RefreshControl/RefreshControl';
+import ScrollView from '../../Components/ScrollView/ScrollView';
+import flattenStyle from '../../StyleSheet/flattenStyle';
+import splitLayoutProps from '../../StyleSheet/splitLayoutProps';
+import StyleSheet from '../../StyleSheet/StyleSheet';
+import Platform from '../../Utilities/Platform';
+import useMergeRefs from '../../Utilities/useMergeRefs';
+import createAnimatedComponent from '../createAnimatedComponent';
+import useAnimatedProps from '../useAnimatedProps';
 import * as React from 'react';
+import {useMemo} from 'react';
 
-const ScrollView = require('../../Components/ScrollView/ScrollView');
-const createAnimatedComponent = require('../createAnimatedComponent');
-
-import type {AnimatedComponentType} from '../createAnimatedComponent';
+type Props = React.ElementConfig<typeof ScrollView>;
+type Instance = React.ElementRef<typeof ScrollView>;
 
 /**
  * @see https://github.com/facebook/react-native/commit/b8c8562
  */
-const ScrollViewWithEventThrottle = React.forwardRef((props, ref) => (
-  <ScrollView scrollEventThrottle={0.0001} {...props} ref={ref} />
-));
-
-module.exports = (createAnimatedComponent(
-  ScrollViewWithEventThrottle,
-): AnimatedComponentType<
-  React.ElementConfig<typeof ScrollView>,
-  React.ElementRef<typeof ScrollView>,
->);
+const AnimatedScrollView: AnimatedComponentType<Props, Instance> =
+  React.forwardRef((props, forwardedRef) => {
+    // (Android only) When a ScrollView has a RefreshControl and
+    // any `style` property set with an Animated.Value, the CSS
+    // gets incorrectly applied twice. This is because ScrollView
+    // swaps the parent/child relationship of itself and the
+    // RefreshControl component (see ScrollView.js for more details).
+    if (
+      Platform.OS === 'android' &&
+      props.refreshControl != null &&
+      props.style != null
+    ) {
+      return (
+        <AnimatedScrollViewWithInvertedRefreshControl
+          scrollEventThrottle={0.0001}
+          {...props}
+          ref={forwardedRef}
+          refreshControl={props.refreshControl}
+        />
+      );
+    } else {
+      return (
+        <AnimatedScrollViewWithoutInvertedRefreshControl
+          scrollEventThrottle={0.0001}
+          {...props}
+          ref={forwardedRef}
+        />
+      );
+    }
+  });
+
+const AnimatedScrollViewWithInvertedRefreshControl = React.forwardRef(
+  (
+    props: {
+      ...React.ElementConfig<typeof ScrollView>,
+      // $FlowFixMe[unclear-type] Same Flow type as `refreshControl` in ScrollView
+      refreshControl: React.Element<any>,
+    },
+    forwardedRef,
+  ) => {
+    // Split `props` into the animate-able props for the parent (RefreshControl)
+    // and child (ScrollView).
+    const {intermediatePropsForRefreshControl, intermediatePropsForScrollView} =
+      useMemo(() => {
+        const {outer, inner} = splitLayoutProps(flattenStyle(props.style));
+        return {
+          intermediatePropsForRefreshControl: {style: outer},
+          intermediatePropsForScrollView: {...props, style: inner},
+        };
+      }, [props]);
+
+    // Handle animated props on `refreshControl`.
+    const [refreshControlAnimatedProps, refreshControlRef] = useAnimatedProps<
+      {style: ?____ViewStyle_Internal},
+      $FlowFixMe,
+    >(intermediatePropsForRefreshControl);
+    // NOTE: Assumes that refreshControl.ref` and `refreshControl.style` can be
+    // safely clobbered.
+    const refreshControl: React.Element<typeof RefreshControl> =
+      React.cloneElement(props.refreshControl, {
+        ...refreshControlAnimatedProps,
+        ref: refreshControlRef,
+      });
+
+    // Handle animated props on `NativeDirectionalScrollView`.
+    const [scrollViewAnimatedProps, scrollViewRef] = useAnimatedProps<
+      Props,
+      Instance,
+    >(intermediatePropsForScrollView);
+    const ref = useMergeRefs<Instance | null>(scrollViewRef, forwardedRef);
+
+    return (
+      // $FlowFixMe[incompatible-use] Investigate useAnimatedProps return value
+      <ScrollView
+        {...scrollViewAnimatedProps}
+        ref={ref}
+        refreshControl={refreshControl}
+        // Because `refreshControl` is a clone of `props.refreshControl` with
+        // `refreshControlAnimatedProps` added, we need to pass ScrollView.js
+        // the combined styles since it also splits the outer/inner styles for
+        // its parent/child, respectively. Without this, the refreshControl
+        // styles would be ignored.
+        style={StyleSheet.compose(
+          scrollViewAnimatedProps.style,
+          refreshControlAnimatedProps.style,
+        )}
+      />
+    );
+  },
+);
+
+const AnimatedScrollViewWithoutInvertedRefreshControl =
+  createAnimatedComponent(ScrollView);
+
+export default AnimatedScrollView;

package/Libraries/Animated/components/AnimatedSectionList.js

@@ -8,12 +8,11 @@
  * @format
  */
 
-import * as React from 'react';
+import type {AnimatedComponentType} from '../createAnimatedComponent';
 
 import SectionList from '../../Lists/SectionList';
-const createAnimatedComponent = require('../createAnimatedComponent');
-
-import type {AnimatedComponentType} from '../createAnimatedComponent';
+import createAnimatedComponent from '../createAnimatedComponent';
+import * as React from 'react';
 
 /**
  * @see https://github.com/facebook/react-native/commit/b8c8562
@@ -22,7 +21,7 @@ const SectionListWithEventThrottle = React.forwardRef((props, ref) => (
   <SectionList scrollEventThrottle={0.0001} {...props} ref={ref} />
 ));
 
-module.exports = (createAnimatedComponent(
+export default (createAnimatedComponent(
   SectionListWithEventThrottle,
 ): AnimatedComponentType<
   React.ElementConfig<typeof SectionList>,

package/Libraries/Animated/components/AnimatedText.js

@@ -8,14 +8,13 @@
  * @format
  */
 
-import * as React from 'react';
-
-const Text = require('../../Text/Text');
-const createAnimatedComponent = require('../createAnimatedComponent');
-
 import type {AnimatedComponentType} from '../createAnimatedComponent';
 
-module.exports = (createAnimatedComponent(
+import Text from '../../Text/Text';
+import createAnimatedComponent from '../createAnimatedComponent';
+import * as React from 'react';
+
+export default (createAnimatedComponent(
   (Text: $FlowFixMe),
 ): AnimatedComponentType<
   React.ElementConfig<typeof Text>,

package/Libraries/Animated/components/AnimatedView.js

@@ -8,14 +8,13 @@
  * @format
  */
 
-import * as React from 'react';
-
-const View = require('../../Components/View/View');
-const createAnimatedComponent = require('../createAnimatedComponent');
-
 import type {AnimatedComponentType} from '../createAnimatedComponent';
 
-module.exports = (createAnimatedComponent(View): AnimatedComponentType<
+import View from '../../Components/View/View';
+import createAnimatedComponent from '../createAnimatedComponent';
+import * as React from 'react';
+
+export default (createAnimatedComponent(View): AnimatedComponentType<
   React.ElementConfig<typeof View>,
   React.ElementRef<typeof View>,
 >);

package/Libraries/Animated/createAnimatedComponent.js

@@ -10,16 +10,14 @@
 
 'use strict';
 
+import View from '../Components/View/View';
+import setAndForwardRef from '../Utilities/setAndForwardRef';
+import {AnimatedEvent} from './AnimatedEvent';
 import * as createAnimatedComponentInjection from './createAnimatedComponentInjection';
-
-const View = require('../Components/View/View');
-const {AnimatedEvent} = require('./AnimatedEvent');
-const AnimatedProps = require('./nodes/AnimatedProps');
-const React = require('react');
-const NativeAnimatedHelper = require('./NativeAnimatedHelper');
-
-const invariant = require('invariant');
-const setAndForwardRef = require('../Utilities/setAndForwardRef');
+import NativeAnimatedHelper from './NativeAnimatedHelper';
+import AnimatedProps from './nodes/AnimatedProps';
+import invariant from 'invariant';
+import * as React from 'react';
 
 let animatedComponentNextId = 1;
 
@@ -55,7 +53,6 @@ function createAnimatedComponent<Props: {+[string]: mixed, ...}, Instance>(
     _prevComponent: any;
     _propsAnimated: AnimatedProps;
     _eventDetachers: Array<Function> = [];
-    _initialAnimatedProps: Object;
 
     // Only to be used in this file, and only in Fabric.
     _animatedComponentId: string = `${animatedComponentNextId++}:animatedComponent`;
@@ -140,7 +137,7 @@ function createAnimatedComponent<Props: {+[string]: mixed, ...}, Instance>(
     // components. If you want to animate a composite component, you need to
     // re-render it. In this case, we have a fallback that uses forceUpdate.
     // This fallback is also called in Fabric.
-    _animatedPropsCallback = () => {
+    _animatedPropsCallback = (): void => {
       if (this._component == null) {
         // AnimatedProps is created in will-mount because it's used in render.
         // But this callback may be invoked before mount in async mode,
@@ -192,7 +189,7 @@ function createAnimatedComponent<Props: {+[string]: mixed, ...}, Instance>(
       }
     }
 
-    _setComponentRef = setAndForwardRef({
+    _setComponentRef: (ref: React.ElementRef<any>) => void = setAndForwardRef({
       getForwardedRef: () => this.props.forwardedRef,
       setLocalRef: ref => {
         this._prevComponent = this._component;
@@ -200,18 +197,14 @@ function createAnimatedComponent<Props: {+[string]: mixed, ...}, Instance>(
       },
     });
 
-    render() {
-      const animatedProps =
-        this._propsAnimated.__getValue(this._initialAnimatedProps) || {};
+    render(): React.Node {
+      const animatedProps = this._propsAnimated.__getValue() || {};
+
       const {style = {}, ...props} = animatedProps;
       const {style: passthruStyle = {}, ...passthruProps} =
         this.props.passthroughAnimatedPropExplicitValues || {};
       const mergedStyle = {...style, ...passthruStyle};
 
-      if (!this._initialAnimatedProps) {
-        this._initialAnimatedProps = animatedProps;
-      }
-
       // Force `collapsable` to be false so that native view is not flattened.
       // Flattened views cannot be accurately referenced by a native driver.
       return (
@@ -277,5 +270,5 @@ function createAnimatedComponent<Props: {+[string]: mixed, ...}, Instance>(
 }
 
 // $FlowIgnore[incompatible-cast] - Will be compatible after refactors.
-module.exports = (createAnimatedComponentInjection.recordAndRetrieve() ??
+export default (createAnimatedComponentInjection.recordAndRetrieve() ??
   createAnimatedComponent: typeof createAnimatedComponent);

package/Libraries/Animated/createAnimatedComponent_EXPERIMENTAL.js

@@ -8,9 +8,9 @@
  * @format
  */
 
-import useAnimatedProps from './useAnimatedProps';
-import useMergeRefs from '../Utilities/useMergeRefs';
 import StyleSheet from '../StyleSheet/StyleSheet';
+import useMergeRefs from '../Utilities/useMergeRefs';
+import useAnimatedProps from './useAnimatedProps';
 import * as React from 'react';
 
 /**

package/Libraries/Animated/nodes/AnimatedAddition.js

@@ -10,15 +10,15 @@
 
 'use strict';
 
-const AnimatedInterpolation = require('./AnimatedInterpolation');
-const AnimatedNode = require('./AnimatedNode');
-const AnimatedValue = require('./AnimatedValue');
-const AnimatedWithChildren = require('./AnimatedWithChildren');
-
 import type {PlatformConfig} from '../AnimatedPlatformConfig';
 import type {InterpolationConfigType} from './AnimatedInterpolation';
+import type AnimatedNode from './AnimatedNode';
+
+import AnimatedInterpolation from './AnimatedInterpolation';
+import AnimatedValue from './AnimatedValue';
+import AnimatedWithChildren from './AnimatedWithChildren';
 
-class AnimatedAddition extends AnimatedWithChildren {
+export default class AnimatedAddition extends AnimatedWithChildren {
   _a: AnimatedNode;
   _b: AnimatedNode;
 
@@ -62,5 +62,3 @@ class AnimatedAddition extends AnimatedWithChildren {
     };
   }
 }
-
-module.exports = AnimatedAddition;

package/Libraries/Animated/nodes/AnimatedColor.js

@@ -10,16 +10,16 @@
 
 'use strict';
 
-import AnimatedValue from './AnimatedValue';
-import AnimatedWithChildren from './AnimatedWithChildren';
+import type {NativeColorValue} from '../../StyleSheet/PlatformColorValueTypes';
+import type {ProcessedColorValue} from '../../StyleSheet/processColor';
+import type {ColorValue} from '../../StyleSheet/StyleSheet';
+import type {PlatformConfig} from '../AnimatedPlatformConfig';
+
 import normalizeColor from '../../StyleSheet/normalizeColor';
 import {processColorObject} from '../../StyleSheet/PlatformColorValueTypes';
 import NativeAnimatedHelper from '../NativeAnimatedHelper';
-
-import type {PlatformConfig} from '../AnimatedPlatformConfig';
-import type {ColorValue} from '../../StyleSheet/StyleSheet';
-import type {NativeColorValue} from '../../StyleSheet/PlatformColorValueTypes';
-import type {ProcessedColorValue} from '../../StyleSheet/processColor';
+import AnimatedValue from './AnimatedValue';
+import AnimatedWithChildren from './AnimatedWithChildren';
 
 export type AnimatedColorConfig = $ReadOnly<{
   useNativeDriver: boolean,

package/Libraries/Animated/nodes/AnimatedDiffClamp.js

@@ -10,14 +10,14 @@
 
 'use strict';
 
-const AnimatedInterpolation = require('./AnimatedInterpolation');
-const AnimatedNode = require('./AnimatedNode');
-const AnimatedWithChildren = require('./AnimatedWithChildren');
-
-import type {InterpolationConfigType} from './AnimatedInterpolation';
 import type {PlatformConfig} from '../AnimatedPlatformConfig';
+import type {InterpolationConfigType} from './AnimatedInterpolation';
+import type AnimatedNode from './AnimatedNode';
 
-class AnimatedDiffClamp extends AnimatedWithChildren {
+import AnimatedInterpolation from './AnimatedInterpolation';
+import AnimatedWithChildren from './AnimatedWithChildren';
+
+export default class AnimatedDiffClamp extends AnimatedWithChildren {
   _a: AnimatedNode;
   _min: number;
   _max: number;
@@ -70,5 +70,3 @@ class AnimatedDiffClamp extends AnimatedWithChildren {
     };
   }
 }
-
-module.exports = AnimatedDiffClamp;

package/Libraries/Animated/nodes/AnimatedDivision.js

@@ -10,15 +10,15 @@
 
 'use strict';
 
-const AnimatedInterpolation = require('./AnimatedInterpolation');
-const AnimatedNode = require('./AnimatedNode');
-const AnimatedValue = require('./AnimatedValue');
-const AnimatedWithChildren = require('./AnimatedWithChildren');
-
-import type {InterpolationConfigType} from './AnimatedInterpolation';
 import type {PlatformConfig} from '../AnimatedPlatformConfig';
+import type {InterpolationConfigType} from './AnimatedInterpolation';
 
-class AnimatedDivision extends AnimatedWithChildren {
+import AnimatedInterpolation from './AnimatedInterpolation';
+import AnimatedNode from './AnimatedNode';
+import AnimatedValue from './AnimatedValue';
+import AnimatedWithChildren from './AnimatedWithChildren';
+
+export default class AnimatedDivision extends AnimatedWithChildren {
   _a: AnimatedNode;
   _b: AnimatedNode;
   _warnedAboutDivideByZero: boolean = false;
@@ -78,5 +78,3 @@ class AnimatedDivision extends AnimatedWithChildren {
     };
   }
 }
-
-module.exports = AnimatedDivision;

package/Libraries/Animated/nodes/AnimatedInterpolation.js

@@ -12,14 +12,13 @@
 
 'use strict';
 
-const AnimatedNode = require('./AnimatedNode');
-const AnimatedWithChildren = require('./AnimatedWithChildren');
-const NativeAnimatedHelper = require('../NativeAnimatedHelper');
-
-const invariant = require('invariant');
-const normalizeColor = require('../../StyleSheet/normalizeColor');
-
 import type {PlatformConfig} from '../AnimatedPlatformConfig';
+import type AnimatedNode from './AnimatedNode';
+
+import normalizeColor from '../../StyleSheet/normalizeColor';
+import NativeAnimatedHelper from '../NativeAnimatedHelper';
+import AnimatedWithChildren from './AnimatedWithChildren';
+import invariant from 'invariant';
 
 type ExtrapolateType = 'extend' | 'identity' | 'clamp';
 
@@ -299,7 +298,7 @@ function checkInfiniteRange(name: string, arr: $ReadOnlyArray<number>) {
   );
 }
 
-class AnimatedInterpolation<
+export default class AnimatedInterpolation<
   OutputT: number | string,
 > extends AnimatedWithChildren {
   // Export for testing.
@@ -368,5 +367,3 @@ class AnimatedInterpolation<
     };
   }
 }
-
-module.exports = AnimatedInterpolation;

package/Libraries/Animated/nodes/AnimatedModulo.js

@@ -10,14 +10,14 @@
 
 'use strict';
 
-const AnimatedInterpolation = require('./AnimatedInterpolation');
-const AnimatedNode = require('./AnimatedNode');
-const AnimatedWithChildren = require('./AnimatedWithChildren');
-
-import type {InterpolationConfigType} from './AnimatedInterpolation';
 import type {PlatformConfig} from '../AnimatedPlatformConfig';
+import type {InterpolationConfigType} from './AnimatedInterpolation';
+import type AnimatedNode from './AnimatedNode';
 
-class AnimatedModulo extends AnimatedWithChildren {
+import AnimatedInterpolation from './AnimatedInterpolation';
+import AnimatedWithChildren from './AnimatedWithChildren';
+
+export default class AnimatedModulo extends AnimatedWithChildren {
   _a: AnimatedNode;
   _modulus: number;
 
@@ -61,5 +61,3 @@ class AnimatedModulo extends AnimatedWithChildren {
     };
   }
 }
-
-module.exports = AnimatedModulo;

package/Libraries/Animated/nodes/AnimatedMultiplication.js

@@ -10,15 +10,15 @@
 
 'use strict';
 
-const AnimatedInterpolation = require('./AnimatedInterpolation');
-const AnimatedNode = require('./AnimatedNode');
-const AnimatedValue = require('./AnimatedValue');
-const AnimatedWithChildren = require('./AnimatedWithChildren');
-
-import type {InterpolationConfigType} from './AnimatedInterpolation';
 import type {PlatformConfig} from '../AnimatedPlatformConfig';
+import type {InterpolationConfigType} from './AnimatedInterpolation';
+import type AnimatedNode from './AnimatedNode';
 
-class AnimatedMultiplication extends AnimatedWithChildren {
+import AnimatedInterpolation from './AnimatedInterpolation';
+import AnimatedValue from './AnimatedValue';
+import AnimatedWithChildren from './AnimatedWithChildren';
+
+export default class AnimatedMultiplication extends AnimatedWithChildren {
   _a: AnimatedNode;
   _b: AnimatedNode;
 
@@ -61,5 +61,3 @@ class AnimatedMultiplication extends AnimatedWithChildren {
     };
   }
 }
-
-module.exports = AnimatedMultiplication;

package/Libraries/Animated/nodes/AnimatedNode.js

@@ -10,12 +10,13 @@
 
 'use strict';
 
-const NativeAnimatedHelper = require('../NativeAnimatedHelper');
+import type {PlatformConfig} from '../AnimatedPlatformConfig';
 
-const NativeAnimatedAPI = NativeAnimatedHelper.API;
-const invariant = require('invariant');
+import ReactNativeFeatureFlags from '../../ReactNative/ReactNativeFeatureFlags';
+import NativeAnimatedHelper from '../NativeAnimatedHelper';
+import invariant from 'invariant';
 
-import type {PlatformConfig} from '../AnimatedPlatformConfig';
+const NativeAnimatedAPI = NativeAnimatedHelper.API;
 
 type ValueListenerCallback = (state: {value: number, ...}) => mixed;
 
@@ -23,12 +24,15 @@ let _uniqueId = 1;
 
 // Note(vjeux): this would be better as an interface but flow doesn't
 // support them yet
-class AnimatedNode {
+export default class AnimatedNode {
   _listeners: {[key: string]: ValueListenerCallback, ...};
   _platformConfig: ?PlatformConfig;
   __nativeAnimatedValueListener: ?any;
   __attach(): void {}
   __detach(): void {
+    if (ReactNativeFeatureFlags.removeListenersOnDetach()) {
+      this.removeAllListeners();
+    }
     if (this.__isNative && this.__nativeTag != null) {
       NativeAnimatedHelper.API.dropAnimatedNode(this.__nativeTag);
       this.__nativeTag = undefined;
@@ -53,7 +57,7 @@ class AnimatedNode {
     this._listeners = {};
   }
 
-  __makeNative(platformConfig: ?PlatformConfig) {
+  __makeNative(platformConfig: ?PlatformConfig): void {
     if (!this.__isNative) {
       throw new Error('This node cannot be made a "native" animated node');
     }
@@ -193,5 +197,3 @@ class AnimatedNode {
     this._platformConfig = platformConfig;
   }
 }
-
-module.exports = AnimatedNode;

package/Libraries/Animated/nodes/AnimatedProps.js

@@ -12,14 +12,14 @@
 
 import type {PlatformConfig} from '../AnimatedPlatformConfig';
 
-const ReactNative = require('../../Renderer/shims/ReactNative');
-const {AnimatedEvent} = require('../AnimatedEvent');
-const NativeAnimatedHelper = require('../NativeAnimatedHelper');
-const AnimatedNode = require('./AnimatedNode');
-const AnimatedStyle = require('./AnimatedStyle');
-const invariant = require('invariant');
-
-class AnimatedProps extends AnimatedNode {
+import {findNodeHandle} from '../../ReactNative/RendererProxy';
+import {AnimatedEvent} from '../AnimatedEvent';
+import NativeAnimatedHelper from '../NativeAnimatedHelper';
+import AnimatedNode from './AnimatedNode';
+import AnimatedStyle from './AnimatedStyle';
+import invariant from 'invariant';
+
+export default class AnimatedProps extends AnimatedNode {
   _props: Object;
   _animatedView: any;
   _callback: () => void;
@@ -36,24 +36,12 @@ class AnimatedProps extends AnimatedNode {
     this._callback = callback;
   }
 
-  __getValue(initialProps: ?Object): Object {
+  __getValue(): Object {
     const props: {[string]: any | ((...args: any) => void)} = {};
     for (const key in this._props) {
       const value = this._props[key];
       if (value instanceof AnimatedNode) {
-        // During initial render we want to use the initial value of both natively and non-natively
-        // driven nodes. On subsequent renders, we cannot use the value of natively driven nodes
-        // as they may not be up to date, so we use the initial value to ensure that values of
-        // native animated nodes do not impact rerenders.
-        if (value instanceof AnimatedStyle) {
-          props[key] = value.__getValue(
-            initialProps ? initialProps.style : null,
-          );
-        } else if (!initialProps || !value.__isNative) {
-          props[key] = value.__getValue();
-        } else if (initialProps.hasOwnProperty(key)) {
-          props[key] = initialProps[key];
-        }
+        props[key] = value.__getValue();
       } else if (value instanceof AnimatedEvent) {
         props[key] = value.__getHandler();
       } else {
@@ -134,9 +122,7 @@ class AnimatedProps extends AnimatedNode {
 
   __connectAnimatedView(): void {
     invariant(this.__isNative, 'Expected node to be marked as "native"');
-    const nativeViewTag: ?number = ReactNative.findNodeHandle(
-      this._animatedView,
-    );
+    const nativeViewTag: ?number = findNodeHandle(this._animatedView);
     invariant(
       nativeViewTag != null,
       'Unable to locate attached view in the native tree',
@@ -149,9 +135,7 @@ class AnimatedProps extends AnimatedNode {
 
   __disconnectAnimatedView(): void {
     invariant(this.__isNative, 'Expected node to be marked as "native"');
-    const nativeViewTag: ?number = ReactNative.findNodeHandle(
-      this._animatedView,
-    );
+    const nativeViewTag: ?number = findNodeHandle(this._animatedView);
     invariant(
       nativeViewTag != null,
       'Unable to locate attached view in the native tree',
@@ -187,5 +171,3 @@ class AnimatedProps extends AnimatedNode {
     };
   }
 }
-
-module.exports = AnimatedProps;