@office-iss/react-native-win32 0.69.0 → 0.70.0

package/Libraries/Alert/Alert.js

@@ -8,8 +8,9 @@
  * @flow
  */
 
-import Platform from '../Utilities/Platform';
 import type {DialogOptions} from '../NativeModules/specs/NativeDialogManagerAndroid';
+
+import Platform from '../Utilities/Platform';
 import RCTAlertManager from './RCTAlertManager';
 
 export type AlertType =
@@ -27,6 +28,7 @@ export type Buttons = Array<{
 
 type Options = {
   cancelable?: ?boolean,
+  userInterfaceStyle?: 'unspecified' | 'light' | 'dark',
   onDismiss?: ?() => void,
   ...
 };
@@ -44,7 +46,15 @@ class Alert {
     options?: Options,
   ): void {
     if (Platform.OS === 'ios') {
-      Alert.prompt(title, message, buttons, 'default');
+      Alert.prompt(
+        title,
+        message,
+        buttons,
+        'default',
+        undefined,
+        undefined,
+        options,
+      );
     } else if (Platform.OS === 'android') {
       const NativeDialogManagerAndroid =
         require('../NativeModules/specs/NativeDialogManagerAndroid').default;
@@ -82,6 +92,8 @@ class Alert {
         config.buttonPositive = buttonPositive.text || defaultPositiveText;
       }
 
+      /* $FlowFixMe[missing-local-annot] The type annotation(s) required by
+       * Flow's LTI update could not be added via codemod */
       const onAction = (action, buttonKey) => {
         if (action === constants.buttonClicked) {
           if (buttonKey === constants.buttonNeutral) {
@@ -95,7 +107,7 @@ class Alert {
           options && options.onDismiss && options.onDismiss();
         }
       };
-      const onError = errorMessage => console.warn(errorMessage);
+      const onError = (errorMessage: string) => console.warn(errorMessage);
       NativeDialogManagerAndroid.showAlert(config, onError, onAction);
     }
   }
@@ -107,6 +119,7 @@ class Alert {
     type?: ?AlertType = 'plain-text',
     defaultValue?: string,
     keyboardType?: string,
+    options?: Options,
   ): void {
     if (Platform.OS === 'ios') {
       let callbacks = [];
@@ -124,7 +137,7 @@ class Alert {
             destructiveButtonKey = String(index);
           }
           if (btn.text || index < (callbackOrButtons || []).length - 1) {
-            const btnDef = {};
+            const btnDef: {[number]: string} = {};
             btnDef[index] = btn.text || '';
             buttons.push(btnDef);
           }
@@ -141,6 +154,7 @@ class Alert {
           cancelButtonKey,
           destructiveButtonKey,
           keyboardType,
+          userInterfaceStyle: options?.userInterfaceStyle || undefined,
         },
         (id, value) => {
           const cb = callbacks[id];

package/Libraries/Alert/Alert.win32.js

@@ -28,6 +28,7 @@ export type Buttons = Array<{
 
 type Options = {
   cancelable?: ?boolean,
+  userInterfaceStyle?: 'unspecified' | 'light' | 'dark',
   onDismiss?: ?() => void,
   ...
 };
@@ -80,6 +81,7 @@ class Alert {
     type?: ?AlertType = 'plain-text',
     defaultValue?: string,
     keyboardType?: string,
+    options?: Options,
   ): void {
     // [Windows
     throw new Error(

package/Libraries/Alert/NativeAlertManager.js

@@ -20,6 +20,7 @@ export type Args = {|
   cancelButtonKey?: string,
   destructiveButtonKey?: string,
   keyboardType?: string,
+  userInterfaceStyle?: string,
 |};
 
 export interface Spec extends TurboModule {

package/Libraries/Animated/Animated.js

@@ -16,8 +16,8 @@ import typeof AnimatedSectionList from './components/AnimatedSectionList';
 import typeof AnimatedText from './components/AnimatedText';
 import typeof AnimatedView from './components/AnimatedView';
 
-const AnimatedMock = require('./AnimatedMock');
-const AnimatedImplementation = require('./AnimatedImplementation');
+import * as AnimatedMock from './AnimatedMock';
+import * as AnimatedImplementation from './AnimatedImplementation';
 
 const Animated = ((Platform.isTesting
   ? AnimatedMock

package/Libraries/Animated/AnimatedEvent.js

@@ -41,7 +41,7 @@ function attachNativeEvent(
   // key path inside the `nativeEvent` object. Ex.: ['contentOffset', 'x'].
   const eventMappings = [];
 
-  const traverse = (value, path) => {
+  const traverse = (value: mixed, path: Array<string>) => {
     if (value instanceof AnimatedValue) {
       value.__makeNative(platformConfig);
 
@@ -94,8 +94,8 @@ function attachNativeEvent(
   };
 }
 
-function validateMapping(argMapping, args) {
-  const validate = (recMapping, recEvt, key) => {
+function validateMapping(argMapping: $ReadOnlyArray<?Mapping>, args: any) {
+  const validate = (recMapping: ?Mapping, recEvt: any, key: string) => {
     if (recMapping instanceof AnimatedValue) {
       invariant(
         typeof recEvt === 'number',
@@ -223,7 +223,10 @@ class AnimatedEvent {
         validatedMapping = true;
       }
 
-      const traverse = (recMapping, recEvt) => {
+      const traverse = (
+        recMapping: ?(Mapping | AnimatedValue),
+        recEvt: any,
+      ) => {
         if (recMapping instanceof AnimatedValue) {
           if (typeof recEvt === 'number') {
             recMapping.setValue(recEvt);

package/Libraries/Animated/AnimatedImplementation.js

@@ -94,7 +94,7 @@ const _combineCallbacks = function (
   config: $ReadOnly<{...AnimationConfig, ...}>,
 ) {
   if (callback && config.onComplete) {
-    return (...args) => {
+    return (...args: Array<EndResult>) => {
       config.onComplete && config.onComplete(...args);
       callback && callback(...args);
     };
@@ -308,7 +308,7 @@ const sequence = function (
   let current = 0;
   return {
     start: function (callback?: ?EndCallback) {
-      const onComplete = function (result) {
+      const onComplete = function (result: EndResult) {
         if (!result.finished) {
           callback && callback(result);
           return;
@@ -380,7 +380,7 @@ const parallel = function (
       }
 
       animations.forEach((animation, idx) => {
-        const cb = function (endResult) {
+        const cb = function (endResult: EndResult | {finished: boolean}) {
           hasEnded[idx] = true;
           doneCount++;
           if (doneCount === animations.length) {
@@ -460,6 +460,7 @@ type LoopAnimationConfig = {
 
 const loop = function (
   animation: CompositeAnimation,
+  // $FlowFixMe[prop-missing]
   {iterations = -1, resetBeforeIteration = true}: LoopAnimationConfig = {},
 ): CompositeAnimation {
   let isFinished = false;
@@ -551,6 +552,19 @@ const event = function (
   }
 };
 
+// All types of animated nodes that represent scalar numbers and can be interpolated (etc)
+type AnimatedNumeric =
+  | AnimatedAddition
+  | AnimatedDiffClamp
+  | AnimatedDivision
+  | AnimatedInterpolation<number>
+  | AnimatedModulo
+  | AnimatedMultiplication
+  | AnimatedSubtraction
+  | AnimatedValue;
+
+export type {AnimatedNumeric as Numeric};
+
 /**
  * The `Animated` library is designed to make animations fluid, powerful, and
  * easy to build and maintain. `Animated` focuses on declarative relationships

package/Libraries/Animated/AnimatedMock.js

@@ -10,6 +10,8 @@
 
 'use strict';
 
+import type {EndResult} from './animations/Animation';
+
 const {AnimatedEvent, attachNativeEvent} = require('./AnimatedEvent');
 const AnimatedImplementation = require('./AnimatedImplementation');
 const AnimatedInterpolation = require('./nodes/AnimatedInterpolation');
@@ -23,7 +25,7 @@ import type {EndCallback} from './animations/Animation';
 import type {TimingAnimationConfig} from './animations/TimingAnimation';
 import type {DecayAnimationConfig} from './animations/DecayAnimation';
 import type {SpringAnimationConfig} from './animations/SpringAnimation';
-
+import type {Numeric as AnimatedNumeric} from './AnimatedImplementation';
 import AnimatedColor from './nodes/AnimatedColor';
 
 /**
@@ -43,7 +45,7 @@ function mockAnimationStart(
     const guardedCallback =
       callback == null
         ? callback
-        : (...args) => {
+        : (...args: Array<EndResult>) => {
             if (inAnimationCallback) {
               console.warn(
                 'Ignoring recursive animation callback when running mock animations',
@@ -158,11 +160,14 @@ type LoopAnimationConfig = {
 
 const loop = function (
   animation: CompositeAnimation,
+  // $FlowFixMe[prop-missing]
   {iterations = -1}: LoopAnimationConfig = {},
 ): CompositeAnimation {
   return emptyAnimation;
 };
 
+export type {AnimatedNumeric as Numeric};
+
 module.exports = {
   Value: AnimatedValue,
   ValueXY: AnimatedValueXY,

package/Libraries/Animated/NativeAnimatedHelper.js

@@ -20,7 +20,10 @@ import type {
 } from './NativeAnimatedModule';
 import type {AnimationConfig, EndCallback} from './animations/Animation';
 import type {InterpolationConfigType} from './nodes/AnimatedInterpolation';
+import ReactNativeFeatureFlags from '../ReactNative/ReactNativeFeatureFlags';
 import invariant from 'invariant';
+import RCTDeviceEventEmitter from '../EventEmitter/RCTDeviceEventEmitter';
+import type {EventSubscription} from '../vendor/emitter/EventEmitter';
 
 // TODO T69437152 @petetheheat - Delete this fork when Fabric ships to 100%.
 const NativeAnimatedModule =
@@ -36,24 +39,83 @@ let nativeEventEmitter;
 let waitingForQueuedOperations = new Set();
 let queueOperations = false;
 let queue: Array<() => void> = [];
+// $FlowFixMe
+let singleOpQueue: Array<any> = [];
+
+const useSingleOpBatching =
+  Platform.OS === 'android' &&
+  !!NativeAnimatedModule?.queueAndExecuteBatchedOperations &&
+  ReactNativeFeatureFlags.animatedShouldUseSingleOp();
+let flushQueueTimeout = null;
+
+const eventListenerGetValueCallbacks = {};
+const eventListenerAnimationFinishedCallbacks = {};
+let globalEventEmitterGetValueListener: ?EventSubscription = null;
+let globalEventEmitterAnimationFinishedListener: ?EventSubscription = null;
+
+const nativeOps: ?typeof NativeAnimatedModule = useSingleOpBatching
+  ? ((function () {
+      const apis = [
+        'createAnimatedNode', // 1
+        'updateAnimatedNodeConfig', // 2
+        'getValue', // 3
+        'startListeningToAnimatedNodeValue', // 4
+        'stopListeningToAnimatedNodeValue', // 5
+        'connectAnimatedNodes', // 6
+        'disconnectAnimatedNodes', // 7
+        'startAnimatingNode', // 8
+        'stopAnimation', // 9
+        'setAnimatedNodeValue', // 10
+        'setAnimatedNodeOffset', // 11
+        'flattenAnimatedNodeOffset', // 12
+        'extractAnimatedNodeOffset', // 13
+        'connectAnimatedNodeToView', // 14
+        'disconnectAnimatedNodeFromView', // 15
+        'restoreDefaultValues', // 16
+        'dropAnimatedNode', // 17
+        'addAnimatedEventToView', // 18
+        'removeAnimatedEventFromView', // 19
+        'addListener', // 20
+        'removeListener', // 21
+      ];
+      return apis.reduce((acc, functionName, i) => {
+        // These indices need to be kept in sync with the indices in native (see NativeAnimatedModule in Java, or the equivalent for any other native platform).
+        // $FlowFixMe[prop-missing]
+        acc[functionName] = i + 1;
+        return acc;
+      }, {});
+    })(): $FlowFixMe)
+  : NativeAnimatedModule;
 
 /**
- * Simple wrappers around NativeAnimatedModule to provide flow and autocomplete support for
- * the native module methods
+ * Wrappers around NativeAnimatedModule to provide flow and autocomplete support for
+ * the native module methods, and automatic queue management on Android
  */
 const API = {
   getValue: function (
     tag: number,
     saveValueCallback: (value: number) => void,
   ): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() => {
-      NativeAnimatedModule.getValue(tag, saveValueCallback);
-    });
+    invariant(nativeOps, 'Native animated module is not available');
+    if (useSingleOpBatching) {
+      if (saveValueCallback) {
+        eventListenerGetValueCallbacks[tag] = saveValueCallback;
+      }
+      // $FlowFixMe
+      API.queueOperation(nativeOps.getValue, tag);
+    } else {
+      API.queueOperation(nativeOps.getValue, tag, saveValueCallback);
+    }
   },
   setWaitingForIdentifier: function (id: string): void {
     waitingForQueuedOperations.add(id);
     queueOperations = true;
+    if (
+      ReactNativeFeatureFlags.animatedShouldDebounceQueueFlush() &&
+      flushQueueTimeout
+    ) {
+      clearTimeout(flushQueueTimeout);
+    }
   },
   unsetWaitingForIdentifier: function (id: string): void {
     waitingForQueuedOperations.delete(id);
@@ -64,70 +126,103 @@ const API = {
     }
   },
   disableQueue: function (): void {
+    invariant(nativeOps, 'Native animated module is not available');
+
+    if (ReactNativeFeatureFlags.animatedShouldDebounceQueueFlush()) {
+      const prevTimeout = flushQueueTimeout;
+      clearImmediate(prevTimeout);
+      flushQueueTimeout = setImmediate(API.flushQueue);
+    } else {
+      API.flushQueue();
+    }
+  },
+  flushQueue: function (): void {
     invariant(NativeAnimatedModule, 'Native animated module is not available');
+    flushQueueTimeout = null;
 
-    if (Platform.OS === 'android') {
-      NativeAnimatedModule.startOperationBatch();
+    // Early returns before calling any APIs
+    if (useSingleOpBatching && singleOpQueue.length === 0) {
+      return;
     }
-    for (let q = 0, l = queue.length; q < l; q++) {
-      queue[q]();
+    if (!useSingleOpBatching && queue.length === 0) {
+      return;
     }
-    queue.length = 0;
-    if (Platform.OS === 'android') {
-      NativeAnimatedModule.finishOperationBatch();
+
+    if (useSingleOpBatching) {
+      // Set up event listener for callbacks if it's not set up
+      if (
+        !globalEventEmitterGetValueListener ||
+        !globalEventEmitterAnimationFinishedListener
+      ) {
+        setupGlobalEventEmitterListeners();
+      }
+      // Single op batching doesn't use callback functions, instead we
+      // use RCTDeviceEventEmitter. This reduces overhead of sending lots of
+      // JSI functions across to native code; but also, TM infrastructure currently
+      // does not support packing a function into native arrays.
+      NativeAnimatedModule.queueAndExecuteBatchedOperations?.(singleOpQueue);
+      singleOpQueue.length = 0;
+    } else {
+      Platform.OS === 'android' && NativeAnimatedModule.startOperationBatch?.();
+      for (let q = 0, l = queue.length; q < l; q++) {
+        queue[q]();
+      }
+      queue.length = 0;
+      Platform.OS === 'android' &&
+        NativeAnimatedModule.finishOperationBatch?.();
     }
   },
-  queueOperation: (fn: () => void): void => {
-    if (queueOperations) {
-      queue.push(fn);
+  queueOperation: <Args: $ReadOnlyArray<mixed>, Fn: (...Args) => void>(
+    fn: Fn,
+    ...args: Args
+  ): void => {
+    if (useSingleOpBatching) {
+      // Get the command ID from the queued function, and push that ID and any arguments needed to execute the operation
+      // $FlowFixMe: surprise, fn is actually a number
+      singleOpQueue.push(fn, ...args);
+      return;
+    }
+
+    // If queueing is explicitly on, *or* the queue has not yet
+    // been flushed, use the queue. This is to prevent operations
+    // from being executed out of order.
+    if (queueOperations || queue.length !== 0) {
+      queue.push(() => fn(...args));
     } else {
-      fn();
+      fn(...args);
     }
   },
   createAnimatedNode: function (tag: number, config: AnimatedNodeConfig): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.createAnimatedNode(tag, config),
-    );
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.createAnimatedNode, tag, config);
   },
   updateAnimatedNodeConfig: function (
     tag: number,
     config: AnimatedNodeConfig,
   ): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    if (typeof NativeAnimatedModule.updateAnimatedNodeConfig === 'function') {
-      API.queueOperation(() =>
-        // $FlowIgnore[not-a-function] - checked above
-        NativeAnimatedModule.updateAnimatedNodeConfig(tag, config),
-      );
+    invariant(nativeOps, 'Native animated module is not available');
+    if (nativeOps.updateAnimatedNodeConfig) {
+      API.queueOperation(nativeOps.updateAnimatedNodeConfig, tag, config);
     }
   },
   startListeningToAnimatedNodeValue: function (tag: number) {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.startListeningToAnimatedNodeValue(tag),
-    );
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.startListeningToAnimatedNodeValue, tag);
   },
   stopListeningToAnimatedNodeValue: function (tag: number) {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.stopListeningToAnimatedNodeValue(tag),
-    );
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.stopListeningToAnimatedNodeValue, tag);
   },
   connectAnimatedNodes: function (parentTag: number, childTag: number): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.connectAnimatedNodes(parentTag, childTag),
-    );
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.connectAnimatedNodes, parentTag, childTag);
   },
   disconnectAnimatedNodes: function (
     parentTag: number,
     childTag: number,
   ): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.disconnectAnimatedNodes(parentTag, childTag),
-    );
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.disconnectAnimatedNodes, parentTag, childTag);
   },
   startAnimatingNode: function (
     animationId: number,
@@ -135,84 +230,85 @@ const API = {
     config: AnimatingNodeConfig,
     endCallback: EndCallback,
   ): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.startAnimatingNode(
+    invariant(nativeOps, 'Native animated module is not available');
+    if (useSingleOpBatching) {
+      if (endCallback) {
+        eventListenerAnimationFinishedCallbacks[animationId] = endCallback;
+      }
+      // $FlowFixMe
+      API.queueOperation(
+        nativeOps.startAnimatingNode,
+        animationId,
+        nodeTag,
+        config,
+      );
+    } else {
+      API.queueOperation(
+        nativeOps.startAnimatingNode,
         animationId,
         nodeTag,
         config,
         endCallback,
-      ),
-    );
+      );
+    }
   },
   stopAnimation: function (animationId: number) {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() => NativeAnimatedModule.stopAnimation(animationId));
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.stopAnimation, animationId);
   },
   setAnimatedNodeValue: function (nodeTag: number, value: number): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.setAnimatedNodeValue(nodeTag, value),
-    );
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.setAnimatedNodeValue, nodeTag, value);
   },
   setAnimatedNodeOffset: function (nodeTag: number, offset: number): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.setAnimatedNodeOffset(nodeTag, offset),
-    );
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.setAnimatedNodeOffset, nodeTag, offset);
   },
   flattenAnimatedNodeOffset: function (nodeTag: number): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.flattenAnimatedNodeOffset(nodeTag),
-    );
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.flattenAnimatedNodeOffset, nodeTag);
   },
   extractAnimatedNodeOffset: function (nodeTag: number): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.extractAnimatedNodeOffset(nodeTag),
-    );
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.extractAnimatedNodeOffset, nodeTag);
   },
   connectAnimatedNodeToView: function (nodeTag: number, viewTag: number): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.connectAnimatedNodeToView(nodeTag, viewTag),
-    );
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.connectAnimatedNodeToView, nodeTag, viewTag);
   },
   disconnectAnimatedNodeFromView: function (
     nodeTag: number,
     viewTag: number,
   ): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.disconnectAnimatedNodeFromView(nodeTag, viewTag),
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(
+      nativeOps.disconnectAnimatedNodeFromView,
+      nodeTag,
+      viewTag,
     );
   },
   restoreDefaultValues: function (nodeTag: number): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
+    invariant(nativeOps, 'Native animated module is not available');
     // Backwards compat with older native runtimes, can be removed later.
-    if (NativeAnimatedModule.restoreDefaultValues != null) {
-      API.queueOperation(() =>
-        NativeAnimatedModule.restoreDefaultValues(nodeTag),
-      );
+    if (nativeOps.restoreDefaultValues != null) {
+      API.queueOperation(nativeOps.restoreDefaultValues, nodeTag);
     }
   },
   dropAnimatedNode: function (tag: number): void {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() => NativeAnimatedModule.dropAnimatedNode(tag));
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(nativeOps.dropAnimatedNode, tag);
   },
   addAnimatedEventToView: function (
     viewTag: number,
     eventName: string,
     eventMapping: EventMapping,
   ) {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.addAnimatedEventToView(
-        viewTag,
-        eventName,
-        eventMapping,
-      ),
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(
+      nativeOps.addAnimatedEventToView,
+      viewTag,
+      eventName,
+      eventMapping,
     );
   },
   removeAnimatedEventFromView(
@@ -220,17 +316,44 @@ const API = {
     eventName: string,
     animatedNodeTag: number,
   ) {
-    invariant(NativeAnimatedModule, 'Native animated module is not available');
-    API.queueOperation(() =>
-      NativeAnimatedModule.removeAnimatedEventFromView(
-        viewTag,
-        eventName,
-        animatedNodeTag,
-      ),
+    invariant(nativeOps, 'Native animated module is not available');
+    API.queueOperation(
+      nativeOps.removeAnimatedEventFromView,
+      viewTag,
+      eventName,
+      animatedNodeTag,
     );
   },
 };
 
+function setupGlobalEventEmitterListeners() {
+  globalEventEmitterGetValueListener = RCTDeviceEventEmitter.addListener(
+    'onNativeAnimatedModuleGetValue',
+    function (params) {
+      const {tag} = params;
+      const callback = eventListenerGetValueCallbacks[tag];
+      if (!callback) {
+        return;
+      }
+      callback(params.value);
+      delete eventListenerGetValueCallbacks[tag];
+    },
+  );
+  globalEventEmitterAnimationFinishedListener =
+    RCTDeviceEventEmitter.addListener(
+      'onNativeAnimatedModuleAnimationFinished',
+      function (params) {
+        const {animationId} = params;
+        const callback = eventListenerAnimationFinishedCallbacks[animationId];
+        if (!callback) {
+          return;
+        }
+        callback(params);
+        delete eventListenerAnimationFinishedCallbacks[animationId];
+      },
+    );
+}
+
 /**
  * Styles allowed by the native animated implementation.
  *
@@ -359,7 +482,9 @@ function validateStyles(styles: {[key: string]: ?number, ...}): void {
   }
 }
 
-function validateInterpolation(config: InterpolationConfigType): void {
+function validateInterpolation<OutputT: number | string>(
+  config: InterpolationConfigType<OutputT>,
+): void {
   for (const key in config) {
     if (!isSupportedInterpolationParam(key)) {
       throw new Error(