react-native-worklets 0.0.1-alpha → 0.1.0

package/src/threads.ts

@@ -0,0 +1,275 @@
+'use strict';
+import { isJest, shouldBeUseWeb } from './PlatformChecker';
+import {
+  makeShareableCloneOnUIRecursive,
+  makeShareableCloneRecursive,
+} from './shareables';
+import { isWorkletFunction } from './workletFunction';
+import { WorkletsError } from './WorkletsError';
+import { WorkletsModule } from './WorkletsModule';
+import type { WorkletFunction } from './workletTypes';
+
+const IS_JEST = isJest();
+const SHOULD_BE_USE_WEB = shouldBeUseWeb();
+
+/** An array of [worklet, args] pairs. */
+let _runOnUIQueue: Array<[WorkletFunction<unknown[], unknown>, unknown[]]> = [];
+
+export function setupMicrotasks() {
+  'worklet';
+
+  let microtasksQueue: Array<() => void> = [];
+  let isExecutingMicrotasksQueue = false;
+  global.queueMicrotask = (callback: () => void) => {
+    microtasksQueue.push(callback);
+  };
+  global._microtaskQueueFinalizers = [];
+
+  global.__callMicrotasks = () => {
+    if (isExecutingMicrotasksQueue) {
+      return;
+    }
+    try {
+      isExecutingMicrotasksQueue = true;
+      for (let index = 0; index < microtasksQueue.length; index += 1) {
+        // we use classic 'for' loop because the size of the currentTasks array may change while executing some of the callbacks due to queueMicrotask calls
+        microtasksQueue[index]();
+      }
+      microtasksQueue = [];
+      global._microtaskQueueFinalizers.forEach((finalizer) => finalizer());
+    } finally {
+      isExecutingMicrotasksQueue = false;
+    }
+  };
+}
+
+function callMicrotasksOnUIThread() {
+  'worklet';
+  global.__callMicrotasks();
+}
+
+export const callMicrotasks = SHOULD_BE_USE_WEB
+  ? () => {
+      // on web flushing is a noop as immediates are handled by the browser
+    }
+  : callMicrotasksOnUIThread;
+
+/**
+ * Lets you asynchronously run
+ * [workletized](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/glossary#to-workletize)
+ * functions on the [UI
+ * thread](https://docs.swmansion.com/react-native-reanimated/docs/threading/runOnUI).
+ *
+ * This method does not schedule the work immediately but instead waits for
+ * other worklets to be scheduled within the same JS loop. It uses
+ * queueMicrotask to schedule all the worklets at once making sure they will run
+ * within the same frame boundaries on the UI thread.
+ *
+ * @param fun - A reference to a function you want to execute on the [UI
+ *   thread](https://docs.swmansion.com/react-native-reanimated/docs/threading/runOnUI)
+ *   from the [JavaScript
+ *   thread](https://docs.swmansion.com/react-native-reanimated/docs/threading/runOnUI).
+ * @returns A function that accepts arguments for the function passed as the
+ *   first argument.
+ * @see https://docs.swmansion.com/react-native-reanimated/docs/threading/runOnUI
+ */
+// @ts-expect-error This overload is correct since it's what user sees in his code
+// before it's transformed by Reanimated Babel plugin.
+export function runOnUI<Args extends unknown[], ReturnValue>(
+  worklet: (...args: Args) => ReturnValue
+): (...args: Args) => void;
+
+export function runOnUI<Args extends unknown[], ReturnValue>(
+  worklet: WorkletFunction<Args, ReturnValue>
+): (...args: Args) => void {
+  'worklet';
+  if (__DEV__ && !SHOULD_BE_USE_WEB && _WORKLET) {
+    throw new WorkletsError(
+      '`runOnUI` cannot be called on the UI runtime. Please call the function synchronously or use `queueMicrotask` or `requestAnimationFrame` instead.'
+    );
+  }
+  if (__DEV__ && !SHOULD_BE_USE_WEB && !isWorkletFunction(worklet)) {
+    throw new WorkletsError('`runOnUI` can only be used with worklets.');
+  }
+  return (...args) => {
+    if (IS_JEST) {
+      // Mocking time in Jest is tricky as both requestAnimationFrame and queueMicrotask
+      // callbacks run on the same queue and can be interleaved. There is no way
+      // to flush particular queue in Jest and the only control over mocked timers
+      // is by using jest.advanceTimersByTime() method which advances all types
+      // of timers including immediate and animation callbacks. Ideally we'd like
+      // to have some way here to schedule work along with React updates, but
+      // that's not possible, and hence in Jest environment instead of using scheduling
+      // mechanism we just schedule the work ommiting the queue. This is ok for the
+      // uses that we currently have but may not be ok for future tests that we write.
+      WorkletsModule.scheduleOnUI(
+        makeShareableCloneRecursive(() => {
+          'worklet';
+          worklet(...args);
+        })
+      );
+      return;
+    }
+    if (__DEV__) {
+      // in DEV mode we call shareable conversion here because in case the object
+      // can't be converted, we will get a meaningful stack-trace as opposed to the
+      // situation when conversion is only done via microtask queue. This does not
+      // make the app particularily less efficient as converted objects are cached
+      // and for a given worklet the conversion only happens once.
+      makeShareableCloneRecursive(worklet);
+      makeShareableCloneRecursive(args);
+    }
+    _runOnUIQueue.push([worklet as WorkletFunction, args]);
+    if (_runOnUIQueue.length === 1) {
+      queueMicrotask(() => {
+        const queue = _runOnUIQueue;
+        _runOnUIQueue = [];
+        WorkletsModule.scheduleOnUI(
+          makeShareableCloneRecursive(() => {
+            'worklet';
+            // eslint-disable-next-line @typescript-eslint/no-shadow
+            queue.forEach(([worklet, args]) => {
+              worklet(...args);
+            });
+            callMicrotasks();
+          })
+        );
+      });
+    }
+  };
+}
+
+// @ts-expect-error Check `executeOnUIRuntimeSync` overload above.
+export function executeOnUIRuntimeSync<Args extends unknown[], ReturnValue>(
+  worklet: (...args: Args) => ReturnValue
+): (...args: Args) => ReturnValue;
+
+export function executeOnUIRuntimeSync<Args extends unknown[], ReturnValue>(
+  worklet: WorkletFunction<Args, ReturnValue>
+): (...args: Args) => ReturnValue {
+  return (...args) => {
+    return WorkletsModule.executeOnUIRuntimeSync(
+      makeShareableCloneRecursive(() => {
+        'worklet';
+        const result = worklet(...args);
+        return makeShareableCloneOnUIRecursive(result);
+      })
+    );
+  };
+}
+
+// @ts-expect-error Check `runOnUI` overload above.
+export function runOnUIImmediately<Args extends unknown[], ReturnValue>(
+  worklet: (...args: Args) => ReturnValue
+): WorkletFunction<Args, ReturnValue>;
+/** Schedule a worklet to execute on the UI runtime skipping batching mechanism. */
+export function runOnUIImmediately<Args extends unknown[], ReturnValue>(
+  worklet: WorkletFunction<Args, ReturnValue>
+): (...args: Args) => void {
+  'worklet';
+  if (__DEV__ && !SHOULD_BE_USE_WEB && _WORKLET) {
+    throw new WorkletsError(
+      '`runOnUIImmediately` cannot be called on the UI runtime. Please call the function synchronously or use `queueMicrotask` or `requestAnimationFrame` instead.'
+    );
+  }
+  if (__DEV__ && !SHOULD_BE_USE_WEB && !isWorkletFunction(worklet)) {
+    throw new WorkletsError(
+      '`runOnUIImmediately` can only be used with worklets.'
+    );
+  }
+  return (...args) => {
+    WorkletsModule.scheduleOnUI(
+      makeShareableCloneRecursive(() => {
+        'worklet';
+        worklet(...args);
+      })
+    );
+  };
+}
+
+type ReleaseRemoteFunction<Args extends unknown[], ReturnValue> = {
+  (...args: Args): ReturnValue;
+};
+
+type DevRemoteFunction<Args extends unknown[], ReturnValue> = {
+  __remoteFunction: (...args: Args) => ReturnValue;
+};
+
+type RemoteFunction<Args extends unknown[], ReturnValue> =
+  | ReleaseRemoteFunction<Args, ReturnValue>
+  | DevRemoteFunction<Args, ReturnValue>;
+
+function runWorkletOnJS<Args extends unknown[], ReturnValue>(
+  worklet: WorkletFunction<Args, ReturnValue>,
+  ...args: Args
+): void {
+  // remote function that calls a worklet synchronously on the JS runtime
+  worklet(...args);
+}
+
+/**
+ * Lets you asynchronously run
+ * non-[workletized](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/glossary#to-workletize)
+ * functions that couldn't otherwise run on the [UI
+ * thread](https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/glossary#ui-thread).
+ * This applies to most external libraries as they don't have their functions
+ * marked with "worklet"; directive.
+ *
+ * @param fun - A reference to a function you want to execute on the JavaScript
+ *   thread from the UI thread.
+ * @returns A function that accepts arguments for the function passed as the
+ *   first argument.
+ * @see https://docs.swmansion.com/react-native-reanimated/docs/threading/runOnJS
+ */
+export function runOnJS<Args extends unknown[], ReturnValue>(
+  fun:
+    | ((...args: Args) => ReturnValue)
+    | RemoteFunction<Args, ReturnValue>
+    | WorkletFunction<Args, ReturnValue>
+): (...args: Args) => void {
+  'worklet';
+  type FunDevRemote = Extract<typeof fun, DevRemoteFunction<Args, ReturnValue>>;
+  if (SHOULD_BE_USE_WEB || !_WORKLET) {
+    // if we are already on the JS thread, we just schedule the worklet on the JS queue
+    return (...args) =>
+      queueMicrotask(
+        args.length
+          ? () => (fun as (...args: Args) => ReturnValue)(...args)
+          : (fun as () => ReturnValue)
+      );
+  }
+  if (isWorkletFunction<Args, ReturnValue>(fun)) {
+    // If `fun` is a worklet, we schedule a call of a remote function `runWorkletOnJS`
+    // and pass the worklet as a first argument followed by original arguments.
+
+    return (...args) =>
+      runOnJS(runWorkletOnJS<Args, ReturnValue>)(
+        fun as WorkletFunction<Args, ReturnValue>,
+        ...args
+      );
+  }
+  if ((fun as FunDevRemote).__remoteFunction) {
+    // In development mode the function provided as `fun` throws an error message
+    // such that when someone accidentally calls it directly on the UI runtime, they
+    // see that they should use `runOnJS` instead. To facilitate that we put the
+    // reference to the original remote function in the `__remoteFunction` property.
+    fun = (fun as FunDevRemote).__remoteFunction;
+  }
+
+  const scheduleOnJS =
+    typeof fun === 'function'
+      ? global._scheduleHostFunctionOnJS
+      : global._scheduleRemoteFunctionOnJS;
+
+  return (...args) => {
+    scheduleOnJS(
+      fun as
+        | ((...args: Args) => ReturnValue)
+        | WorkletFunction<Args, ReturnValue>,
+      args.length > 0
+        ? // TODO TYPESCRIPT this cast is terrible but will be fixed
+          (makeShareableCloneOnUIRecursive(args) as unknown as unknown[])
+        : undefined
+    );
+  };
+}

package/src/valueUnpacker.ts

@@ -0,0 +1,110 @@
+/* eslint-disable reanimated/use-worklets-error */
+'use strict';
+import { shouldBeUseWeb } from './PlatformChecker';
+import { isWorkletFunction } from './workletFunction';
+import type { WorkletFunction } from './workletTypes';
+
+function valueUnpacker(
+  objectToUnpack: any,
+  category?: string,
+  remoteFunctionName?: string
+): any {
+  'worklet';
+  let workletsCache = global.__workletsCache;
+  let handleCache = global.__handleCache;
+  if (workletsCache === undefined) {
+    // init
+    workletsCache = global.__workletsCache = new Map();
+    handleCache = global.__handleCache = new WeakMap();
+  }
+  const workletHash = objectToUnpack.__workletHash;
+  if (workletHash !== undefined) {
+    let workletFun = workletsCache.get(workletHash);
+    if (workletFun === undefined) {
+      const initData = objectToUnpack.__initData;
+      if (global.evalWithSourceMap) {
+        // if the runtime (hermes only for now) supports loading source maps
+        // we want to use the proper filename for the location as it guarantees
+        // that debugger understands and loads the source code of the file where
+        // the worklet is defined.
+        workletFun = global.evalWithSourceMap(
+          '(' + initData.code + '\n)',
+          initData.location,
+          initData.sourceMap
+        ) as (...args: any[]) => any;
+      } else if (global.evalWithSourceUrl) {
+        // if the runtime doesn't support loading source maps, in dev mode we
+        // can pass source url when evaluating the worklet. Now, instead of using
+        // the actual file location we use worklet hash, as it the allows us to
+        // properly symbolicate traces (see errors.ts for details)
+        workletFun = global.evalWithSourceUrl(
+          '(' + initData.code + '\n)',
+          `worklet_${workletHash}`
+        ) as (...args: any[]) => any;
+      } else {
+        // in release we use the regular eval to save on JSI calls
+        // eslint-disable-next-line no-eval
+        workletFun = eval('(' + initData.code + '\n)') as (
+          ...args: any[]
+        ) => any;
+      }
+      workletsCache.set(workletHash, workletFun);
+    }
+    const functionInstance = workletFun.bind(objectToUnpack);
+    objectToUnpack._recur = functionInstance;
+    return functionInstance;
+  } else if (objectToUnpack.__init !== undefined) {
+    let value = handleCache.get(objectToUnpack);
+    if (value === undefined) {
+      value = objectToUnpack.__init();
+      handleCache.set(objectToUnpack, value);
+    }
+    return value;
+  } else if (category === 'RemoteFunction') {
+    const fun = () => {
+      const label = remoteFunctionName
+        ? `function \`${remoteFunctionName}\``
+        : 'anonymous function';
+      throw new Error(`[Worklets] Tried to synchronously call a non-worklet ${label} on the UI thread.
+See https://docs.swmansion.com/react-native-reanimated/docs/guides/troubleshooting#tried-to-synchronously-call-a-non-worklet-function-on-the-ui-thread for more details.`);
+    };
+    fun.__remoteFunction = objectToUnpack;
+    return fun;
+  } else {
+    throw new Error(
+      `[Worklets] Data type in category "${category}" not recognized by value unpacker: "${_toString(
+        objectToUnpack
+      )}".`
+    );
+  }
+}
+
+type ValueUnpacker = WorkletFunction<
+  [objectToUnpack: any, category?: string],
+  any
+>;
+
+if (__DEV__ && !shouldBeUseWeb()) {
+  const testWorklet = (() => {
+    'worklet';
+  }) as WorkletFunction<[], void>;
+  if (!isWorkletFunction(testWorklet)) {
+    throw new Error(
+      `[Worklets] Failed to create a worklet. See https://docs.swmansion.com/react-native-reanimated/docs/guides/troubleshooting#failed-to-create-a-worklet for more details.`
+    );
+  }
+  if (!isWorkletFunction(valueUnpacker)) {
+    throw new Error('[Worklets] `valueUnpacker` is not a worklet');
+  }
+  const closure = (valueUnpacker as ValueUnpacker).__closure;
+  if (closure === undefined) {
+    throw new Error('[Worklets] `valueUnpacker` closure is undefined');
+  }
+  if (Object.keys(closure).length !== 0) {
+    throw new Error('[Worklets] `valueUnpacker` must have empty closure');
+  }
+}
+
+export function getValueUnpackerCode() {
+  return (valueUnpacker as ValueUnpacker).__initData.code;
+}

package/src/workletFunction.ts

@@ -0,0 +1,47 @@
+'use strict';
+
+import type {
+  WorkletBaseDev,
+  WorkletBaseRelease,
+  WorkletFunction,
+} from './workletTypes';
+
+/**
+ * This function allows you to determine if a given function is a worklet. It
+ * only works with Reanimated Babel plugin enabled. Unless you are doing
+ * something with internals of Reanimated you shouldn't need to use this
+ * function.
+ *
+ * ### Note
+ *
+ * Do not call it before the worklet is declared, as it will always return false
+ * then. E.g.:
+ *
+ * ```ts
+ * isWorkletFunction(myWorklet); // Will always return false.
+ *
+ * function myWorklet() {
+ *   'worklet';
+ * }
+ * ```
+ *
+ * ### Maintainer note
+ *
+ * This function is supposed to be used only in the React Runtime. It always
+ * returns `false` in Worklet Runtimes.
+ */
+export function isWorkletFunction<
+  Args extends unknown[] = unknown[],
+  ReturnValue = unknown,
+  BuildType extends WorkletBaseDev | WorkletBaseRelease = WorkletBaseDev,
+>(value: unknown): value is WorkletFunction<Args, ReturnValue> & BuildType {
+  'worklet';
+  // Since host objects always return true for `in` operator, we have to use dot notation to check if the property exists.
+  // See https://github.com/facebook/hermes/blob/340726ef8cf666a7cce75bc60b02fa56b3e54560/lib/VM/JSObject.cpp#L1276.
+
+  return (
+    // `__workletHash` isn't extracted in Worklet Runtimes.
+    typeof value === 'function' &&
+    !!(value as unknown as Record<string, unknown>).__workletHash
+  );
+}

package/src/workletTypes.ts

@@ -0,0 +1,76 @@
+'use strict';
+
+/**
+ * The below type is used for HostObjects returned by the JSI API that don't
+ * have any accessible fields or methods but can carry data that is accessed
+ * from the c++ side. We add a field to the type to make it possible for
+ * typescript to recognize which JSI methods accept those types as arguments and
+ * to be able to correctly type check other methods that may use them. However,
+ * this field is not actually defined nor should be used for anything else as
+ * assigning any data to those objects will throw an error.
+ */
+export type ShareableRef<T = unknown> = {
+  __hostObjectShareableJSRef: T;
+};
+
+// In case of objects with depth or arrays of objects or arrays of arrays etc.
+// we add this utility type that makes it a `SharaebleRef` of the outermost type.
+export type FlatShareableRef<T> =
+  T extends ShareableRef<infer U> ? ShareableRef<U> : ShareableRef<T>;
+
+export type WorkletRuntime = {
+  __hostObjectWorkletRuntime: never;
+  readonly name: string;
+};
+
+export type WorkletStackDetails = [
+  error: Error,
+  lineOffset: number,
+  columnOffset: number,
+];
+
+type WorkletClosure = Record<string, unknown>;
+
+interface WorkletInitDataCommon {
+  code: string;
+}
+
+type WorkletInitDataRelease = WorkletInitDataCommon;
+
+interface WorkletInitDataDev extends WorkletInitDataCommon {
+  location: string;
+  sourceMap: string;
+  version: string;
+}
+
+interface WorkletBaseCommon {
+  __closure: WorkletClosure;
+  __workletHash: number;
+}
+
+export interface WorkletBaseRelease extends WorkletBaseCommon {
+  __initData: WorkletInitDataRelease;
+}
+
+export interface WorkletBaseDev extends WorkletBaseCommon {
+  __initData: WorkletInitDataDev;
+  /** `__stackDetails` is removed after parsing. */
+  __stackDetails?: WorkletStackDetails;
+}
+
+export type WorkletFunctionDev<
+  Args extends unknown[] = unknown[],
+  ReturnValue = unknown,
+> = ((...args: Args) => ReturnValue) & WorkletBaseDev;
+
+type WorkletFunctionRelease<
+  Args extends unknown[] = unknown[],
+  ReturnValue = unknown,
+> = ((...args: Args) => ReturnValue) & WorkletBaseRelease;
+
+export type WorkletFunction<
+  Args extends unknown[] = unknown[],
+  ReturnValue = unknown,
+> =
+  | WorkletFunctionDev<Args, ReturnValue>
+  | WorkletFunctionRelease<Args, ReturnValue>;

package/Animated.js

@@ -1,13 +0,0 @@
-import { Image, Text, View, ScrollView } from 'react-native';
-import AnimatedImplementation from './AnimatedImplementation';
-
-const Animated = {
-  View: AnimatedImplementation.createAnimatedComponent(View),
-  Text: AnimatedImplementation.createAnimatedComponent(Text),
-  Image: AnimatedImplementation.createAnimatedComponent(Image),
-  ScrollView: AnimatedImplementation.createAnimatedComponent(ScrollView),
-};
-
-Object.assign(Animated, AnimatedImplementation);
-
-export default Animated;

package/AnimatedEvent.js

@@ -1,167 +0,0 @@
-import AnimatedValue from './nodes/AnimatedValue';
-import NativeAnimatedHelper, {
-  shouldUseNativeDriver,
-} from './NativeAnimatedHelper';
-import ReactNative from 'ReactNative';
-
-import invariant from 'fbjs/lib/invariant';
-
-function attachNativeEvent(viewRef, eventName, argMapping) {
-  // Find animated values in `argMapping` and create an array representing their
-  // key path inside the `nativeEvent` object. Ex.: ['contentOffset', 'x'].
-  const eventMappings = [];
-
-  const traverse = (value, path) => {
-    if (value instanceof AnimatedValue) {
-      value.__makeNative();
-
-      eventMappings.push({
-        nativeEventPath: path,
-        animatedValueTag: value.__getNativeTag(),
-      });
-    } else if (typeof value === 'object') {
-      for (const key in value) {
-        traverse(value[key], path.concat(key));
-      }
-    }
-  };
-
-  invariant(
-    argMapping[0] && argMapping[0].nativeEvent,
-    'Native driven events only support animated values contained inside `nativeEvent`.'
-  );
-
-  // Assume that the event containing `nativeEvent` is always the first argument.
-  traverse(argMapping[0].nativeEvent, []);
-
-  const viewTag = ReactNative.findNodeHandle(viewRef);
-
-  eventMappings.forEach(mapping => {
-    NativeAnimatedHelper.API.addAnimatedEventToView(
-      viewTag,
-      eventName,
-      mapping
-    );
-  });
-
-  return {
-    detach() {
-      eventMappings.forEach(mapping => {
-        NativeAnimatedHelper.API.removeAnimatedEventFromView(
-          viewTag,
-          eventName,
-          mapping.animatedValueTag
-        );
-      });
-    },
-  };
-}
-
-class AnimatedEvent {
-  _listeners = [];
-
-  constructor(argMapping, config = {}) {
-    this._argMapping = argMapping;
-    if (config.listener) {
-      this.__addListener(config.listener);
-    }
-    this._callListeners = this._callListeners.bind(this);
-    this._attachedEvent = null;
-    this.__isNative = shouldUseNativeDriver(config);
-
-    if (__DEV__) {
-      this._validateMapping();
-    }
-  }
-
-  __addListener(callback) {
-    this._listeners.push(callback);
-  }
-
-  __removeListener(callback) {
-    this._listeners = this._listeners.filter(listener => listener !== callback);
-  }
-
-  __attach(viewRef, eventName) {
-    invariant(
-      this.__isNative,
-      'Only native driven events need to be attached.'
-    );
-
-    this._attachedEvent = attachNativeEvent(
-      viewRef,
-      eventName,
-      this._argMapping
-    );
-  }
-
-  __detach(viewTag, eventName) {
-    invariant(
-      this.__isNative,
-      'Only native driven events need to be detached.'
-    );
-
-    this._attachedEvent && this._attachedEvent.detach();
-  }
-
-  __getHandler() {
-    if (this.__isNative) {
-      return this._callListeners;
-    }
-
-    return (...args) => {
-      const traverse = (recMapping, recEvt, key) => {
-        if (typeof recEvt === 'number' && recMapping instanceof AnimatedValue) {
-          recMapping.setValue(recEvt);
-        } else if (typeof recMapping === 'object') {
-          for (const mappingKey in recMapping) {
-            /* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This
-             * comment suppresses an error when upgrading Flow's support for
-             * React. To see the error delete this comment and run Flow. */
-            traverse(recMapping[mappingKey], recEvt[mappingKey], mappingKey);
-          }
-        }
-      };
-
-      if (!this.__isNative) {
-        this._argMapping.forEach((mapping, idx) => {
-          traverse(mapping, args[idx], 'arg' + idx);
-        });
-      }
-      this._callListeners(...args);
-    };
-  }
-
-  _callListeners(...args) {
-    this._listeners.forEach(listener => listener(...args));
-  }
-
-  _validateMapping() {
-    const traverse = (recMapping, recEvt, key) => {
-      if (typeof recEvt === 'number') {
-        invariant(
-          recMapping instanceof AnimatedValue,
-          'Bad mapping of type ' +
-            typeof recMapping +
-            ' for key ' +
-            key +
-            ', event value must map to AnimatedValue'
-        );
-        return;
-      }
-      invariant(
-        typeof recMapping === 'object',
-        'Bad mapping of type ' + typeof recMapping + ' for key ' + key
-      );
-      invariant(
-        typeof recEvt === 'object',
-        'Bad event of type ' + typeof recEvt + ' for key ' + key
-      );
-      for (const mappingKey in recMapping) {
-        traverse(recMapping[mappingKey], recEvt[mappingKey], mappingKey);
-      }
-    };
-  }
-}
-
-export { AnimatedEvent, attachNativeEvent };