react-native-reanimated 2.8.0 → 2.9.0

package/Common/cpp/Tools/RuntimeDecorator.cpp

@@ -71,21 +71,27 @@ void RuntimeDecorator::decorateRuntime(
           1,
           setGlobalConsole));
 
+  auto chronoNow = [](jsi::Runtime &rt,
+                      const jsi::Value &thisValue,
+                      const jsi::Value *args,
+                      size_t count) -> jsi::Value {
+    double now = std::chrono::system_clock::now().time_since_epoch() /
+        std::chrono::milliseconds(1);
+    return jsi::Value(now);
+  };
+
   rt.global().setProperty(
       rt,
       "_chronoNow",
       jsi::Function::createFromHostFunction(
-          rt,
-          jsi::PropNameID::forAscii(rt, "_chronoNow"),
-          0,
-          [](jsi::Runtime &rt,
-             const jsi::Value &thisValue,
-             const jsi::Value *args,
-             size_t count) -> jsi::Value {
-            double now = std::chrono::system_clock::now().time_since_epoch() /
-                std::chrono::milliseconds(1);
-            return jsi::Value(now);
-          }));
+          rt, jsi::PropNameID::forAscii(rt, "_chronoNow"), 0, chronoNow));
+  jsi::Object performance(rt);
+  performance.setProperty(
+      rt,
+      "now",
+      jsi::Function::createFromHostFunction(
+          rt, jsi::PropNameID::forAscii(rt, "now"), 0, chronoNow));
+  rt.global().setProperty(rt, "performance", performance);
 }
 
 void RuntimeDecorator::decorateUIRuntime(

package/android/.gradle/buildOutputCleanup/cache.properties

@@ -1,2 +1,2 @@
-#Thu Apr 21 15:44:53 UTC 2022
+#Thu Jun 30 13:53:38 UTC 2022
 gradle.version=7.2

package/android/CMakeLists.txt

@@ -119,12 +119,23 @@ find_library(
         PATHS ${LIBRN_DIR}
         NO_CMAKE_FIND_ROOT_PATH
 )
-find_library(
-        FOLLY_JSON_LIB
-        folly_json
-        PATHS ${LIBRN_DIR}
-        NO_CMAKE_FIND_ROOT_PATH
-)
+
+if(${REACT_NATIVE_TARGET_VERSION} LESS 69)
+        find_library(
+                FOLLY_LIB
+                folly_json
+                PATHS ${LIBRN_DIR}
+                NO_CMAKE_FIND_ROOT_PATH
+        )
+else()
+        find_library(
+                FOLLY_LIB
+                folly_runtime
+                PATHS ${LIBRN_DIR}
+                NO_CMAKE_FIND_ROOT_PATH
+        )
+endif()
+
 find_library(
         REACT_NATIVE_JNI_LIB
         reactnativejni
@@ -169,7 +180,7 @@ if(${FOR_HERMES})
             ${HERMES_LIB}
             ${GLOG_LIB}
             ${FBJNI_LIB}
-            ${FOLLY_JSON_LIB}
+            ${FOLLY_LIB}
             ${REACT_NATIVE_JNI_LIB}
             android
     )
@@ -181,7 +192,7 @@ else()
             ${JSEXECUTOR_LIB}
             ${GLOG_LIB}
             ${FBJNI_LIB}
-            ${FOLLY_JSON_LIB}
+            ${FOLLY_LIB}
             ${REACT_NATIVE_JNI_LIB}
             android
     )

package/android/build.gradle

@@ -149,10 +149,10 @@ def detectAAR(minor, engine) {
             println "\n\n\n"
             println "****************************************************************************************"
             println "\n\n\n"
-            println "WARNING reanimated - no version-specific reanimated AAR for react-native version $rnMinorVersion found."
+            println "WARNING reanimated - no version-specific reanimated AAR for react-native version $minor found."
             println "Falling back to AAR for react-native version $rnMinorVersionCopy."
             println "The react-native JSI interface is not ABI-safe yet, this may result in crashes."
-            println "Please post a pull request to implement support for react-native version $rnMinorVersion to the reanimated repo."
+            println "Please post a pull request to implement support for react-native version $minor to the reanimated repo."
             println "Thanks!"
             println "\n\n\n"
             println "****************************************************************************************"
@@ -351,8 +351,8 @@ buildscript {
         }
     }
     dependencies {
-        classpath "com.android.tools.build:gradle:4.2.2"
-        classpath "de.undercouch:gradle-download-task:4.1.2"
+        classpath "com.android.tools.build:gradle:7.1.1"
+        classpath "de.undercouch:gradle-download-task:5.0.1"
         classpath "com.diffplug.spotless:spotless-plugin-gradle:5.15.0"
     }
 }
@@ -381,8 +381,7 @@ android {
                         "-DBOOST_VERSION=${BOOST_VERSION}",
                         "-DBUILD_DIR=${buildDir}",
                         "-DFOR_HERMES=${FOR_HERMES}",
-                        "-DCLIENT_SIDE_BUILD=${CLIENT_SIDE_BUILD}",
-                        "--clean-first"
+                        "-DCLIENT_SIDE_BUILD=${CLIENT_SIDE_BUILD}"
                 abiFilters (*reactNativeArchitectures())
                 _stackProtectorFlag ? (cppFlags("-fstack-protector-all")) : null
             }
@@ -459,7 +458,12 @@ task createNativeDepsDirectories(dependsOn: applyJavaPatches) {
 }
 
 task downloadBoost(dependsOn: createNativeDepsDirectories, type: Download) {
-    src("https://github.com/react-native-community/boost-for-react-native/releases/download/v${BOOST_VERSION.replace("_", ".")}-0/boost_${BOOST_VERSION}.tar.gz")
+    def transformedVersion = BOOST_VERSION.replace("_", ".")
+    def srcUrl = "https://boostorg.jfrog.io/artifactory/main/release/${transformedVersion}/source/boost_${BOOST_VERSION}.tar.gz"
+    if (rnMinorVersion < 69) {
+        srcUrl = "https://github.com/react-native-community/boost-for-react-native/releases/download/v${transformedVersion}-0/boost_${BOOST_VERSION}.tar.gz"
+    }
+    src(srcUrl)
     onlyIfNewer(true)
     overwrite(false)
     dest(new File(downloadsDir, "boost_${BOOST_VERSION}.tar.gz"))
@@ -672,7 +676,17 @@ dependencies {
     extractHeaders("com.facebook.fbjni:fbjni:" + FBJNI_VERSION + ":headers")
     extractSO("com.facebook.fbjni:fbjni:" + FBJNI_VERSION)
 
-    def rnAAR = fileTree("$reactNative/android").matching({ it.include "**/**/*.aar" }).singleFile
+    def buildType = "debug"
+    tasks.all({ task ->
+        if (task.name == "buildCMakeRelease") {
+            buildType = "release"
+        }
+    })
+    def rnAarMatcher = "**/react-native/**/*${buildType}.aar"
+    if (rnMinorVersion < 69) {
+        rnAarMatcher = "**/**/*.aar"
+    }
+    def rnAAR = fileTree("$reactNative/android").matching({ it.include rnAarMatcher }).singleFile
     def jscAAR = fileTree("$reactNative/../jsc-android/dist/org/webkit/android-jsc").matching({ it.include "**/**/*.aar" }).singleFile
     extractSO(files(rnAAR, jscAAR))
 }

package/android/src/main/cpp/NativeProxy.cpp

@@ -145,11 +145,22 @@ void NativeProxy::installJSIBindings() {
   std::shared_ptr<jsi::Runtime> animatedRuntime =
       facebook::jsc::makeJSCRuntime();
 #endif
+  auto workletRuntimeValue = runtime_->global()
+    .getProperty(*runtime_, "ArrayBuffer")
+    .asObject(*runtime_)
+    .asFunction(*runtime_)
+    .callAsConstructor(*runtime_, {static_cast<double>(sizeof(void*))});
+  uintptr_t* workletRuntimeData = reinterpret_cast<uintptr_t*>(
+    workletRuntimeValue
+      .getObject(*runtime_)
+      .getArrayBuffer(*runtime_)
+      .data(*runtime_));
+  workletRuntimeData[0] = reinterpret_cast<uintptr_t>(animatedRuntime.get());
+
   runtime_->global().setProperty(
       *runtime_,
       "_WORKLET_RUNTIME",
-      static_cast<double>(
-          reinterpret_cast<std::uintptr_t>(animatedRuntime.get())));
+      workletRuntimeValue);
 
   std::shared_ptr<ErrorHandler> errorHandler =
       std::make_shared<AndroidErrorHandler>(scheduler_);

package/android/src/main/java/com/swmansion/reanimated/sensor/ReanimatedSensorListener.java

@@ -3,6 +3,7 @@ package com.swmansion.reanimated.sensor;
 import android.hardware.Sensor;
 import android.hardware.SensorEvent;
 import android.hardware.SensorEventListener;
+import android.hardware.SensorManager;
 import com.swmansion.reanimated.NativeProxy;
 
 public class ReanimatedSensorListener implements SensorEventListener {
@@ -11,6 +12,10 @@ public class ReanimatedSensorListener implements SensorEventListener {
   private double lastRead = (double) System.currentTimeMillis();
   private final double interval;
 
+  private float[] rotation = new float[9];
+  private float[] orientation = new float[3];
+  private float[] quaternion = new float[4];
+
   ReanimatedSensorListener(NativeProxy.SensorSetter setter, double interval) {
     this.setter = setter;
     this.interval = interval;
@@ -22,8 +27,26 @@ public class ReanimatedSensorListener implements SensorEventListener {
     if (current - lastRead < interval) {
       return;
     }
+    int sensorType = event.sensor.getType();
     lastRead = current;
-    setter.sensorSetter(event.values);
+    if (sensorType == Sensor.TYPE_ROTATION_VECTOR) {
+      SensorManager.getQuaternionFromVector(quaternion, event.values);
+      SensorManager.getRotationMatrixFromVector(rotation, event.values);
+      SensorManager.getOrientation(rotation, orientation);
+      float[] data =
+          new float[] {
+            quaternion[1], // qx
+            quaternion[2], // qy
+            quaternion[3], // qz
+            quaternion[0], // qw
+            orientation[0], // yaw
+            orientation[1], // pitch
+            orientation[2] // roll
+          };
+      setter.sensorSetter(data);
+    } else {
+      setter.sensorSetter(event.values);
+    }
   }
 
   @Override

package/android/src/main/java/com/swmansion/reanimated/sensor/ReanimatedSensorType.java

@@ -1,11 +1,13 @@
 package com.swmansion.reanimated.sensor;
 
+import android.hardware.Sensor;
+
 public enum ReanimatedSensorType {
-  ACCELEROMETER(1),
-  GYROSCOPE(2),
-  GRAVITY(3),
-  MAGNETIC_FIELD(4),
-  ROTATION_VECTOR(5);
+  ACCELEROMETER(Sensor.TYPE_ACCELEROMETER),
+  GYROSCOPE(Sensor.TYPE_GYROSCOPE),
+  GRAVITY(Sensor.TYPE_GRAVITY),
+  MAGNETIC_FIELD(Sensor.TYPE_MAGNETIC_FIELD),
+  ROTATION_VECTOR(Sensor.TYPE_ROTATION_VECTOR);
 
   private final int type;
 

package/ios/native/REAInitializer.mm

@@ -45,10 +45,20 @@ JSIExecutor::RuntimeInstaller REAJSIExecutorRuntimeInstaller(
     auto callInvoker = std::make_shared<react::BridgeJSCallInvoker>(bridge.reactInstance);
     auto reanimatedModule = reanimated::createReanimatedModule(bridge, callInvoker);
 #endif
+    auto workletRuntimeValue = runtime
+        .global()
+        .getProperty(runtime, "ArrayBuffer")
+        .asObject(runtime)
+        .asFunction(runtime)
+        .callAsConstructor(runtime, {static_cast<double>(sizeof(void*))});
+    uintptr_t* workletRuntimeData = reinterpret_cast<uintptr_t*>(
+        workletRuntimeValue.getObject(runtime).getArrayBuffer(runtime).data(runtime));
+    workletRuntimeData[0] = reinterpret_cast<uintptr_t>(reanimatedModule->runtime.get());
+
     runtime.global().setProperty(
         runtime,
         "_WORKLET_RUNTIME",
-        static_cast<double>(reinterpret_cast<std::uintptr_t>(reanimatedModule->runtime.get())));
+        workletRuntimeValue);
 
     runtime.global().setProperty(
         runtime,

package/ios/sensor/ReanimatedSensor.m

@@ -141,9 +141,9 @@
                                                         attitude.quaternion.y,
                                                         attitude.quaternion.z,
                                                         attitude.quaternion.w,
-                                                        attitude.pitch,
-                                                        attitude.roll,
                                                         attitude.yaw,
+                                                        attitude.pitch,
+                                                        attitude.roll
                                                     };
                                                     self->_setter(data);
                                                     self->_lastTimestamp = currentTime;

package/lib/Animated.js

@@ -1,22 +1,9 @@
-import createAnimatedComponent from './createAnimatedComponent';
-import {
-  addWhitelistedNativeProps,
-  addWhitelistedUIProps,
-} from './ConfigHelper';
-import * as reanimated1 from './reanimated1';
-import ReanimatedComponents from './reanimated2/component';
-
-const Animated = {
-  // components
-  ...ReanimatedComponents,
-  createAnimatedComponent,
-  // configuration
-  addWhitelistedNativeProps,
-  addWhitelistedUIProps,
-  // reanimated 1
-  ...reanimated1,
-};
-
-export * from './reanimated2';
+export { default as createAnimatedComponent } from './createAnimatedComponent';
+export { addWhitelistedNativeProps, addWhitelistedUIProps, } from './ConfigHelper';
+export { default as Text } from './reanimated2/component/Text';
+export { default as View } from './reanimated2/component/View';
+export { default as ScrollView } from './reanimated2/component/ScrollView';
+export { default as Image } from './reanimated2/component/Image';
+export { default as FlatList } from './reanimated2/component/FlatList';
+// @ts-ignore backward compatibility with treeshaking
 export * from './reanimated1';
-export default Animated;

package/lib/index.js

@@ -1,22 +1,6 @@
-import createAnimatedComponent from './createAnimatedComponent';
-import {
-  addWhitelistedNativeProps,
-  addWhitelistedUIProps,
-} from './ConfigHelper';
-import * as reanimated1 from './reanimated1';
-import ReanimatedComponents from './reanimated2/component';
-
-const Animated = {
-  // components
-  ...ReanimatedComponents,
-  createAnimatedComponent,
-  // configuration
-  addWhitelistedNativeProps,
-  addWhitelistedUIProps,
-  // reanimated 1
-  ...reanimated1,
-};
-
-export * from './reanimated2';
+// tree-shaken side effects
+import './reanimated2/js-reanimated/global';
+// @ts-ignore backward compatibility with treeshaking
 export * from './reanimated1';
-export default Animated;
+export * from './reanimated2';
+export * as default from './Animated';

package/lib/reanimated2/NativeReanimated/NativeReanimated.js

@@ -1,7 +1,7 @@
 import { NativeModules } from 'react-native';
 export class NativeReanimated {
     constructor(native = true) {
-        if (global.__reanimatedModuleProxy === undefined) {
+        if (global.__reanimatedModuleProxy === undefined && native) {
             const { ReanimatedModule } = NativeModules;
             ReanimatedModule === null || ReanimatedModule === void 0 ? void 0 : ReanimatedModule.installTurboModule();
         }

package/lib/reanimated2/animation/sequence.js

@@ -43,9 +43,6 @@ export function withSequence(..._animations) {
             return false;
         }
         function onStart(animation, value, now, previousAnimation) {
-            if (animations.length === 1) {
-                throw Error('withSequence() animation require more than one animation as argument');
-            }
             animation.animationIndex = 0;
             if (previousAnimation === undefined) {
                 previousAnimation = animations[animations.length - 1];

package/lib/reanimated2/component/FlatList.js

@@ -11,14 +11,14 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React from 'react';
 import { FlatList } from 'react-native';
-import WrappedComponents from './WrappedComponents';
+import ReanimatedView from './View';
 import createAnimatedComponent from '../../createAnimatedComponent';
 const AnimatedFlatList = createAnimatedComponent(FlatList);
 const createCellRenderer = (itemLayoutAnimation) => {
     const cellRenderer = (props) => {
-        return (<WrappedComponents.View layout={itemLayoutAnimation} onLayout={props.onLayout}>
+        return (<ReanimatedView layout={itemLayoutAnimation} onLayout={props.onLayout}>
         {props.children}
-      </WrappedComponents.View>);
+      </ReanimatedView>);
     };
     return cellRenderer;
 };

package/lib/reanimated2/component/Image.js

@@ -0,0 +1,4 @@
+import { Image } from 'react-native';
+import createAnimatedComponent from '../../createAnimatedComponent';
+const AnimatedImage = createAnimatedComponent(Image);
+export default AnimatedImage;

package/lib/reanimated2/component/ScrollView.js

@@ -0,0 +1,4 @@
+import { ScrollView } from 'react-native';
+import createAnimatedComponent from '../../createAnimatedComponent';
+const AnimatedScrollView = createAnimatedComponent(ScrollView);
+export default AnimatedScrollView;

package/lib/reanimated2/component/Text.js

@@ -0,0 +1,4 @@
+import { Text } from 'react-native';
+import createAnimatedComponent from '../../createAnimatedComponent';
+const AnimatedText = createAnimatedComponent(Text);
+export default AnimatedText;

package/lib/reanimated2/component/View.js

@@ -0,0 +1,4 @@
+import { View } from 'react-native';
+import createAnimatedComponent from '../../createAnimatedComponent';
+const AnimatedView = createAnimatedComponent(View);
+export default AnimatedView;

package/lib/reanimated2/core.js

@@ -238,11 +238,6 @@ if (!isWeb() && isConfigured()) {
             info: runOnJS(capturableConsole.info),
         };
         _setGlobalConsole(console);
-        if (global.performance == null) {
-            global.performance = {
-                now: global._chronoNow,
-            }; // due to conflict with lib.dom.d.ts -> Performance
-        }
     })();
 }
 let featuresConfig = {

package/lib/reanimated2/hook/utils.js

@@ -12,11 +12,6 @@ export function useEvent(handler, eventNames = [], rebuild = false) {
     else if (rebuild) {
         initRef.current.updateWorklet(handler);
     }
-    useEffect(() => {
-        return () => {
-            initRef.current = null;
-        };
-    }, []);
     return initRef;
 }
 export function useHandler(handlers, dependencies) {

package/lib/reanimated2/js-reanimated/global.js

@@ -0,0 +1,25 @@
+// In order to keep bundle size down, we treat this file as a polyfill for Web.
+import { shouldBeUseWeb } from '../PlatformChecker';
+if (shouldBeUseWeb()) {
+    global._frameTimestamp = null;
+    global._setGlobalConsole = (_val) => {
+        // noop
+    };
+    global._measure = () => {
+        console.warn("[Reanimated] You can't use `measure` with Chrome Debugger or with web version");
+        return {
+            x: 0,
+            y: 0,
+            width: 0,
+            height: 0,
+            pageX: 0,
+            pageY: 0,
+        };
+    };
+    global._scrollTo = () => {
+        console.warn("[Reanimated] You can't use `scrollTo` with Chrome Debugger or with web version");
+    };
+    global._setGestureState = () => {
+        console.warn("[Reanimated] You can't use `setGestureState` with Chrome Debugger or with web version");
+    };
+}

package/lib/reanimated2/js-reanimated/index.js

@@ -1,29 +1,5 @@
 import JSReanimated from './JSReanimated';
-import { shouldBeUseWeb } from '../PlatformChecker';
 const reanimatedJS = new JSReanimated();
-if (shouldBeUseWeb()) {
-    global._frameTimestamp = null;
-    global._setGlobalConsole = (_val) => {
-        // noop
-    };
-    global._measure = () => {
-        console.warn("[Reanimated] You can't use `measure` with Chrome Debugger or with web version");
-        return {
-            x: 0,
-            y: 0,
-            width: 0,
-            height: 0,
-            pageX: 0,
-            pageY: 0,
-        };
-    };
-    global._scrollTo = () => {
-        console.warn("[Reanimated] You can't use `scrollTo` with Chrome Debugger or with web version");
-    };
-    global._setGestureState = () => {
-        console.warn("[Reanimated] You can't use `setGestureState` with Chrome Debugger or with web version");
-    };
-}
 export const _updatePropsJS = (updates, viewRef) => {
     if (viewRef._component) {
         const component = viewRef._component;

package/lib/reanimated2/mock.js

@@ -64,6 +64,12 @@ const ReanimatedV2 = {
         out: ID,
         inOut: ID,
     },
+    Extrapolation: {
+        EXTEND: 'extend',
+        CLAMP: 'clamp',
+        IDENTITY: 'identity',
+    },
     runOnJS: (fn) => fn,
+    runOnUI: (fn) => fn,
 };
 module.exports = Object.assign({}, ReanimatedV2);

package/lib/types/lib/Animated.d.ts

@@ -0,0 +1,8 @@
+export { default as createAnimatedComponent } from './createAnimatedComponent';
+export { addWhitelistedNativeProps, addWhitelistedUIProps, } from './ConfigHelper';
+export { default as Text } from './reanimated2/component/Text';
+export { default as View } from './reanimated2/component/View';
+export { default as ScrollView } from './reanimated2/component/ScrollView';
+export { default as Image } from './reanimated2/component/Image';
+export { default as FlatList } from './reanimated2/component/FlatList';
+export * from './reanimated1';

package/lib/types/lib/index.d.ts

@@ -0,0 +1,4 @@
+import './reanimated2/js-reanimated/global';
+export * from './reanimated1';
+export * from './reanimated2';
+export * as default from './Animated';

package/lib/types/lib/reanimated2/component/Image.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const AnimatedImage: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
+export default AnimatedImage;

package/lib/types/lib/reanimated2/component/ScrollView.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const AnimatedScrollView: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
+export default AnimatedScrollView;

package/lib/types/lib/reanimated2/component/Text.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const AnimatedText: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
+export default AnimatedText;

package/lib/types/lib/reanimated2/component/View.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const AnimatedView: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
+export default AnimatedView;

package/lib/types/lib/reanimated2/js-reanimated/global.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/types/lib/reanimated2/mock.d.ts

@@ -51,5 +51,11 @@ declare const ReanimatedV2: {
         out: (t: any) => any;
         inOut: (t: any) => any;
     };
+    Extrapolation: {
+        EXTEND: string;
+        CLAMP: string;
+        IDENTITY: string;
+    };
     runOnJS: (fn: any) => any;
+    runOnUI: (fn: any) => any;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-reanimated",
-  "version": "2.8.0",
+  "version": "2.9.0",
   "description": "More powerful alternative to Animated library for React Native.",
   "scripts": {
     "start": "node node_modules/react-native/local-cli/cli.js start",
@@ -34,10 +34,10 @@
     "clean:deep": "cd android && rm -rf .cxx .gradle build && cd ../Example/android && rm -rf .gradle build app/build && cd ../.. && yarn clean",
     "reset:deep": "yarn clean:deep && yarn setup"
   },
-  "main": "lib/Animated.js",
-  "module": "lib/Animated",
-  "react-native": "src/Animated",
-  "source": "src/Animated",
+  "main": "lib/index.js",
+  "module": "lib/index",
+  "react-native": "src/index",
+  "source": "src/index",
   "types": "react-native-reanimated.d.ts",
   "files": [
     "Common/",
@@ -74,6 +74,7 @@
   },
   "homepage": "https://github.com/software-mansion/react-native-reanimated#readme",
   "dependencies": {
+    "@babel/plugin-proposal-export-namespace-from": "^7.17.12",
     "@babel/plugin-transform-object-assign": "^7.16.7",
     "@babel/preset-typescript": "^7.16.7",
     "@types/invariant": "^2.2.35",
@@ -121,11 +122,11 @@
     "lint-staged": "^11.2.0",
     "madge": "^5.0.1",
     "prettier": "^2.5.1",
-    "react": "17.0.2",
-    "react-native": "0.68.0",
+    "react": "18.0.0",
+    "react-native": "0.69.1",
     "react-native-codegen": "^0.0.7",
     "react-native-gesture-handler": "^1.6.1",
-    "react-test-renderer": "17.0.2",
+    "react-test-renderer": "18.0.0",
     "release-it": "^13.7.2",
     "typescript": "^4.1.3"
   },
@@ -154,5 +155,10 @@
       "commonjs",
       "module"
     ]
-  }
+  },
+  "sideEffects": [
+    "./lib/reanimated2/core",
+    "./lib/reanimated2/js-reanimated/global",
+    "./lib/index"
+  ]
 }

package/plugin.js

@@ -14,7 +14,6 @@ const functionArgsToWorkletize = new Map([
   ['useAnimatedScrollHandler', [0]],
   ['useAnimatedReaction', [0, 1]],
   ['useWorkletCallback', [0]],
-  ['createWorklet', [0]],
   // animations' callbacks
   ['withTiming', [2]],
   ['withSpring', [2]],
@@ -757,6 +756,16 @@ function isPossibleOptimization(fun) {
   return flags;
 }
 
+const pluginProposalExportNamespaceFrom =
+  require('@babel/plugin-proposal-export-namespace-from').default;
+const apiMock = {
+  assertVersion: () => {
+    // do nothing.
+  },
+};
+const ExportNamedDeclarationFn =
+  pluginProposalExportNamespaceFrom(apiMock).visitor.ExportNamedDeclaration;
+
 module.exports = function ({ types: t }) {
   return {
     pre() {
@@ -779,6 +788,7 @@ module.exports = function ({ types: t }) {
           processIfGestureHandlerEventCallbackFunctionNode(t, path, state);
         },
       },
+      ExportNamedDeclaration: ExportNamedDeclarationFn,
     },
   };
 };

package/react-native-reanimated.d.ts

@@ -156,7 +156,7 @@ declare module 'react-native-reanimated' {
       : Record<string, unknown>;
 
     export type AnimateProps<P extends object> = {
-      [K in keyof P]: P[K] | AnimatedNode<P[K]>;
+      [K in keyof Omit<P, 'style'>]: P[K] | AnimatedNode<P[K]>;
     } & {
       style?: StyleProp<AnimateStyle<StylesOrDefault<P>>>;
     } & {
@@ -650,9 +650,6 @@ declare module 'react-native-reanimated' {
   ): PropsAdapterFunction;
 
   export function processColor(color: number | string): number;
-  export function createWorklet<A extends any[], R>(
-    fn: (...args: A) => R
-  ): (...args: Parameters<typeof fn>) => R;
 
   export function interpolateColor<T extends string | number>(
     value: number,

package/src/Animated.ts

@@ -0,0 +1,13 @@
+export { default as createAnimatedComponent } from './createAnimatedComponent';
+export {
+  addWhitelistedNativeProps,
+  addWhitelistedUIProps,
+} from './ConfigHelper';
+
+export { default as Text } from './reanimated2/component/Text';
+export { default as View } from './reanimated2/component/View';
+export { default as ScrollView } from './reanimated2/component/ScrollView';
+export { default as Image } from './reanimated2/component/Image';
+export { default as FlatList } from './reanimated2/component/FlatList';
+// @ts-ignore backward compatibility with treeshaking
+export * from './reanimated1';

package/src/index.ts

@@ -0,0 +1,7 @@
+// tree-shaken side effects
+import './reanimated2/js-reanimated/global';
+
+// @ts-ignore backward compatibility with treeshaking
+export * from './reanimated1';
+export * from './reanimated2';
+export * as default from './Animated';

package/src/reanimated2/NativeReanimated/NativeReanimated.ts

@@ -11,7 +11,7 @@ export class NativeReanimated {
   private InnerNativeModule: any;
 
   constructor(native = true) {
-    if (global.__reanimatedModuleProxy === undefined) {
+    if (global.__reanimatedModuleProxy === undefined && native) {
       const { ReanimatedModule } = NativeModules;
       ReanimatedModule?.installTurboModule();
     }

package/src/reanimated2/animation/sequence.ts

@@ -63,11 +63,6 @@ export function withSequence(
         now: Timestamp,
         previousAnimation: SequenceAnimation
       ): void {
-        if (animations.length === 1) {
-          throw Error(
-            'withSequence() animation require more than one animation as argument'
-          );
-        }
         animation.animationIndex = 0;
         if (previousAnimation === undefined) {
           previousAnimation = animations[

package/src/reanimated2/component/FlatList.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { FlatList, FlatListProps, LayoutChangeEvent } from 'react-native';
-import WrappedComponents from './WrappedComponents';
+import ReanimatedView from './View';
 import createAnimatedComponent from '../../createAnimatedComponent';
 import { ILayoutAnimationBuilder } from '../layoutReanimation/animationBuilder/commonTypes';
 
@@ -11,12 +11,9 @@ const createCellRenderer = (itemLayoutAnimation?: ILayoutAnimationBuilder) => {
     onLayout: (event: LayoutChangeEvent) => void;
   }> = (props) => {
     return (
-      <WrappedComponents.View
-        layout={itemLayoutAnimation}
-        onLayout={props.onLayout}
-      >
+      <ReanimatedView layout={itemLayoutAnimation} onLayout={props.onLayout}>
         {props.children}
-      </WrappedComponents.View>
+      </ReanimatedView>
     );
   };
 

package/src/reanimated2/component/Image.ts

@@ -0,0 +1,6 @@
+import { Image } from 'react-native';
+import createAnimatedComponent from '../../createAnimatedComponent';
+
+const AnimatedImage = createAnimatedComponent(Image as any);
+
+export default AnimatedImage;

package/src/reanimated2/component/ScrollView.ts

@@ -0,0 +1,6 @@
+import { ScrollView } from 'react-native';
+import createAnimatedComponent from '../../createAnimatedComponent';
+
+const AnimatedScrollView = createAnimatedComponent(ScrollView);
+
+export default AnimatedScrollView;

package/src/reanimated2/component/Text.ts

@@ -0,0 +1,6 @@
+import { Text } from 'react-native';
+import createAnimatedComponent from '../../createAnimatedComponent';
+
+const AnimatedText = createAnimatedComponent(Text as any);
+
+export default AnimatedText;

package/src/reanimated2/component/View.ts

@@ -0,0 +1,6 @@
+import { View } from 'react-native';
+import createAnimatedComponent from '../../createAnimatedComponent';
+
+const AnimatedView = createAnimatedComponent(View);
+
+export default AnimatedView;

package/src/reanimated2/core.ts

@@ -333,11 +333,6 @@ if (!isWeb() && isConfigured()) {
       info: runOnJS(capturableConsole.info),
     };
     _setGlobalConsole(console);
-    if (global.performance == null) {
-      global.performance = {
-        now: global._chronoNow,
-      } as any; // due to conflict with lib.dom.d.ts -> Performance
-    }
   })();
 }
 

package/src/reanimated2/hook/utils.ts

@@ -44,12 +44,6 @@ export function useEvent<T extends NativeEvent<T>>(
     initRef.current.updateWorklet(handler);
   }
 
-  useEffect(() => {
-    return () => {
-      initRef.current = null;
-    };
-  }, []);
-
   return initRef;
 }
 

package/src/reanimated2/js-reanimated/global.ts

@@ -0,0 +1,33 @@
+// In order to keep bundle size down, we treat this file as a polyfill for Web.
+
+import { shouldBeUseWeb } from '../PlatformChecker';
+
+if (shouldBeUseWeb()) {
+  global._frameTimestamp = null;
+  global._setGlobalConsole = (_val) => {
+    // noop
+  };
+  global._measure = () => {
+    console.warn(
+      "[Reanimated] You can't use `measure` with Chrome Debugger or with web version"
+    );
+    return {
+      x: 0,
+      y: 0,
+      width: 0,
+      height: 0,
+      pageX: 0,
+      pageY: 0,
+    };
+  };
+  global._scrollTo = () => {
+    console.warn(
+      "[Reanimated] You can't use `scrollTo` with Chrome Debugger or with web version"
+    );
+  };
+  global._setGestureState = () => {
+    console.warn(
+      "[Reanimated] You can't use `setGestureState` with Chrome Debugger or with web version"
+    );
+  };
+}

package/src/reanimated2/js-reanimated/index.ts

@@ -1,5 +1,4 @@
 import JSReanimated from './JSReanimated';
-import { shouldBeUseWeb } from '../PlatformChecker';
 import { AnimatedStyle, StyleProps } from '../commonTypes';
 
 const reanimatedJS = new JSReanimated();
@@ -13,36 +12,6 @@ interface JSReanimatedComponent {
   };
 }
 
-if (shouldBeUseWeb()) {
-  global._frameTimestamp = null;
-  global._setGlobalConsole = (_val) => {
-    // noop
-  };
-  global._measure = () => {
-    console.warn(
-      "[Reanimated] You can't use `measure` with Chrome Debugger or with web version"
-    );
-    return {
-      x: 0,
-      y: 0,
-      width: 0,
-      height: 0,
-      pageX: 0,
-      pageY: 0,
-    };
-  };
-  global._scrollTo = () => {
-    console.warn(
-      "[Reanimated] You can't use `scrollTo` with Chrome Debugger or with web version"
-    );
-  };
-  global._setGestureState = () => {
-    console.warn(
-      "[Reanimated] You can't use `setGestureState` with Chrome Debugger or with web version"
-    );
-  };
-}
-
 export const _updatePropsJS = (
   updates: StyleProps | AnimatedStyle,
   viewRef: { _component?: JSReanimatedComponent }

package/src/reanimated2/mock.ts

@@ -65,8 +65,14 @@ const ReanimatedV2 = {
     out: ID,
     inOut: ID,
   },
+  Extrapolation: {
+    EXTEND: 'extend',
+    CLAMP: 'clamp',
+    IDENTITY: 'identity',
+  },
 
   runOnJS: (fn) => fn,
+  runOnUI: (fn) => fn,
 };
 
 module.exports = {

package/lib/reanimated2/component/WrappedComponents.js

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

package/lib/reanimated2/component/index.js

@@ -1,4 +0,0 @@
-import ReanimatedFlatlist from './FlatList';
-import WrappedComponents from './WrappedComponents';
-const ReanimatedComponents = Object.assign(Object.assign({}, WrappedComponents), { FlatList: ReanimatedFlatlist });
-export default ReanimatedComponents;

package/lib/types/lib/reanimated2/component/WrappedComponents.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-declare const WrappedComponents: {
-    View: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
-    Text: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
-    Image: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
-    ScrollView: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
-};
-export default WrappedComponents;

package/lib/types/lib/reanimated2/component/index.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-declare const ReanimatedComponents: {
-    FlatList: import("react").FC<import("./FlatList").ReanimatedFlatlistProps<any>>;
-    View: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
-    Text: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
-    Image: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
-    ScrollView: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
-};
-export default ReanimatedComponents;

package/src/Animated.js

@@ -1,22 +0,0 @@
-import createAnimatedComponent from './createAnimatedComponent';
-import {
-  addWhitelistedNativeProps,
-  addWhitelistedUIProps,
-} from './ConfigHelper';
-import * as reanimated1 from './reanimated1';
-import ReanimatedComponents from './reanimated2/component';
-
-const Animated = {
-  // components
-  ...ReanimatedComponents,
-  createAnimatedComponent,
-  // configuration
-  addWhitelistedNativeProps,
-  addWhitelistedUIProps,
-  // reanimated 1
-  ...reanimated1,
-};
-
-export * from './reanimated2';
-export * from './reanimated1';
-export default Animated;

package/src/reanimated2/component/WrappedComponents.ts

@@ -1,11 +0,0 @@
-import { Image, ScrollView, Text, View } from 'react-native';
-import createAnimatedComponent from '../../createAnimatedComponent';
-
-const WrappedComponents = {
-  View: createAnimatedComponent(View),
-  Text: createAnimatedComponent(Text as any),
-  Image: createAnimatedComponent(Image as any),
-  ScrollView: createAnimatedComponent(ScrollView),
-};
-
-export default WrappedComponents;

package/src/reanimated2/component/index.ts

@@ -1,9 +0,0 @@
-import ReanimatedFlatlist from './FlatList';
-import WrappedComponents from './WrappedComponents';
-
-const ReanimatedComponents = {
-  ...WrappedComponents,
-  FlatList: ReanimatedFlatlist,
-};
-
-export default ReanimatedComponents;