react-native-reanimated 2.4.0 → 2.6.0

package/lib/{src/ConfigHelper.js → ConfigHelper.js}

@@ -1,4 +1,4 @@
-import ReanimatedModule from './ReanimatedModule';
+import { configureProps as jsiConfigureProps } from './reanimated2/core';
 /**
  * Styles allowed to be direcly updated in UI thread
  */
@@ -104,7 +104,7 @@ let NATIVE_THREAD_PROPS_WHITELIST = {
     placeholderTextColor: true,
 };
 function configureProps() {
-    ReanimatedModule.configureProps(Object.keys(NATIVE_THREAD_PROPS_WHITELIST), Object.keys(UI_THREAD_PROPS_WHITELIST));
+    jsiConfigureProps(Object.keys(UI_THREAD_PROPS_WHITELIST), Object.keys(NATIVE_THREAD_PROPS_WHITELIST));
 }
 export function addWhitelistedNativeProps(props) {
     const oldSize = Object.keys(NATIVE_THREAD_PROPS_WHITELIST).length;

package/lib/{src/createAnimatedComponent.js → createAnimatedComponent.js}

@@ -90,6 +90,7 @@ export default function createAnimatedComponent(Component, options) {
             this._viewTag = -1;
             this._isFirstRender = true;
             this.animatedStyle = { value: {} };
+            this.initialStyle = {};
             this._component = null;
             // The system is best designed when setNativeProps is implemented. It is
             // able to avoid re-rendering and directly set the attributes that changed.
@@ -438,11 +439,9 @@ export default function createAnimatedComponent(Component, options) {
                             // this is how we recognize styles returned by useAnimatedStyle
                             style.viewsRef.add(this);
                             if (this._isFirstRender) {
-                                return Object.assign(Object.assign({}, style.initial.value), initialUpdaterRun(style.initial.updater));
-                            }
-                            else {
-                                return style.initial.value;
+                                this.initialStyle = Object.assign(Object.assign({}, style.initial.value), initialUpdaterRun(style.initial.updater));
                             }
+                            return this.initialStyle;
                         }
                         else {
                             return style;

package/lib/{src/reanimated1 → reanimated1}/core/AnimatedFunction.js

@@ -37,7 +37,7 @@ export function createAnimatedFunction(cb) {
   for (let i = 0; i < params.length; i++) {
     params[i] = createAnimatedParam();
   }
-  // eslint-disable-next-line standard/no-callback-literal
+  // eslint-disable-next-line node/no-callback-literal
   const what = cb(...params);
   const func = new AnimatedFunction(what, ...params);
   return (...args) => {

package/lib/{src/reanimated1 → reanimated1}/derived/interpolate.js

@@ -128,15 +128,13 @@ export default function interpolate(value, config) {
   const right = extrapolateRight || extrapolate;
   let output = interpolateInternal(value, inputRange, outputRange);
 
-  if (left === Extrapolate.EXTEND) {
-  } else if (left === Extrapolate.CLAMP) {
+  if (left === Extrapolate.CLAMP) {
     output = cond(lessThan(value, inputRange[0]), outputRange[0], output);
   } else if (left === Extrapolate.IDENTITY) {
     output = cond(lessThan(value, inputRange[0]), value, output);
   }
 
-  if (right === Extrapolate.EXTEND) {
-  } else if (right === Extrapolate.CLAMP) {
+  if (right === Extrapolate.CLAMP) {
     output = cond(
       greaterThan(value, inputRange[inputRange.length - 1]),
       outputRange[outputRange.length - 1],

package/lib/{src/reanimated2 → reanimated2}/Colors.js

@@ -31,7 +31,8 @@ function getMatchers() {
         cachedMatchers.hsl = new RegExp('hsl' + call(NUMBER, PERCENTAGE, PERCENTAGE));
         cachedMatchers.hsla = new RegExp('hsla' + call(NUMBER, PERCENTAGE, PERCENTAGE, NUMBER));
         cachedMatchers.hex3 = /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/;
-        cachedMatchers.hex4 = /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/;
+        cachedMatchers.hex4 =
+            /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/;
         cachedMatchers.hex6 = /^#([0-9a-fA-F]{6})$/;
         cachedMatchers.hex8 = /^#([0-9a-fA-F]{8})$/;
     }

package/lib/reanimated2/NativeReanimated/NativeReanimated.js

@@ -0,0 +1,50 @@
+import { NativeModules } from 'react-native';
+export class NativeReanimated {
+    constructor(native = true) {
+        if (global.__reanimatedModuleProxy === undefined) {
+            const { ReanimatedModule } = NativeModules;
+            ReanimatedModule === null || ReanimatedModule === void 0 ? void 0 : ReanimatedModule.installTurboModule();
+        }
+        this.InnerNativeModule = global.__reanimatedModuleProxy;
+        this.native = native;
+    }
+    installCoreFunctions(valueSetter) {
+        return this.InnerNativeModule.installCoreFunctions(valueSetter);
+    }
+    makeShareable(value) {
+        return this.InnerNativeModule.makeShareable(value);
+    }
+    makeMutable(value) {
+        return this.InnerNativeModule.makeMutable(value);
+    }
+    makeRemote(object = {}) {
+        return this.InnerNativeModule.makeRemote(object);
+    }
+    registerSensor(sensorType, interval, sensorData) {
+        return this.InnerNativeModule.registerSensor(sensorType, interval, sensorData);
+    }
+    unregisterSensor(sensorId) {
+        return this.InnerNativeModule.unregisterSensor(sensorId);
+    }
+    startMapper(mapper, inputs = [], outputs = [], updater, viewDescriptors) {
+        return this.InnerNativeModule.startMapper(mapper, inputs, outputs, updater, viewDescriptors);
+    }
+    stopMapper(mapperId) {
+        return this.InnerNativeModule.stopMapper(mapperId);
+    }
+    registerEventHandler(eventHash, eventHandler) {
+        return this.InnerNativeModule.registerEventHandler(eventHash, eventHandler);
+    }
+    unregisterEventHandler(id) {
+        return this.InnerNativeModule.unregisterEventHandler(id);
+    }
+    getViewProp(viewTag, propName, callback) {
+        return this.InnerNativeModule.getViewProp(viewTag, propName, callback);
+    }
+    enableLayoutAnimations(flag) {
+        this.InnerNativeModule.enableLayoutAnimations(flag);
+    }
+    configureProps(uiProps, nativeProps) {
+        this.InnerNativeModule.configureProps(uiProps, nativeProps);
+    }
+}

package/lib/{src/reanimated2 → reanimated2}/NativeReanimated/index.js

@@ -1,6 +1,5 @@
 import reanimatedJS from '../js-reanimated';
 import { shouldBeUseWeb } from '../PlatformChecker';
-import { Platform } from 'react-native';
 import { NativeReanimated } from './NativeReanimated';
 let exportedModule;
 if (shouldBeUseWeb()) {
@@ -8,8 +7,5 @@ if (shouldBeUseWeb()) {
 }
 else {
     exportedModule = new NativeReanimated();
-    if (exportedModule.useOnlyV1 && Platform.OS === 'android') {
-        console.warn(`If you want to use Reanimated 2 then go through our installation steps https://docs.swmansion.com/react-native-reanimated/docs/installation`);
-    }
 }
 export default exportedModule;

package/lib/{src/reanimated2 → reanimated2}/ViewDescriptorsSet.js

@@ -1,7 +1,7 @@
 import { useRef } from 'react';
 import { makeMutable } from './core';
-import { Platform } from 'react-native';
-const scheduleUpdates = Platform.OS === 'web' ? requestAnimationFrame : setImmediate;
+import { shouldBeUseWeb } from './PlatformChecker';
+const scheduleUpdates = shouldBeUseWeb() ? requestAnimationFrame : setImmediate;
 export function makeViewDescriptorsSet() {
     const ref = useRef(null);
     if (ref.current === null) {

package/lib/{src/reanimated2 → reanimated2}/animation/styleAnimation.js

@@ -35,7 +35,8 @@ export function setPath(obj, path, value) {
         }
         currObj = currObj[keys[i]];
     }
-    currObj[keys[keys.length - 1]] = value;
+    currObj[keys[keys.length - 1]] =
+        value;
 }
 export function withStyleAnimation(styleAnimations) {
     'worklet';

package/lib/{src/reanimated2 → reanimated2}/core.js

@@ -24,7 +24,7 @@ export const checkPluginState = (throwError = true) => {
     return true;
 };
 export const isConfigured = (throwError = false) => {
-    return checkPluginState(throwError) && !NativeReanimatedModule.useOnlyV1;
+    return checkPluginState(throwError);
 };
 export const isConfiguredCheck = () => {
     if (!isConfigured(true)) {
@@ -259,29 +259,27 @@ export function runOnJS(fun) {
         return fun.__callAsync;
     }
 }
-if (!NativeReanimatedModule.useOnlyV1) {
-    NativeReanimatedModule.installCoreFunctions(NativeReanimatedModule.native
-        ? workletValueSetter
-        : workletValueSetterJS);
-    if (!isWeb() && isConfigured()) {
-        const capturableConsole = console;
-        runOnUI(() => {
-            'worklet';
-            const console = {
-                debug: runOnJS(capturableConsole.debug),
-                log: runOnJS(capturableConsole.log),
-                warn: runOnJS(capturableConsole.warn),
-                error: runOnJS(capturableConsole.error),
-                info: runOnJS(capturableConsole.info),
-            };
-            _setGlobalConsole(console);
-            if (global.performance == null) {
-                global.performance = {
-                    now: global._chronoNow,
-                };
-            }
-        })();
-    }
+NativeReanimatedModule.installCoreFunctions(NativeReanimatedModule.native
+    ? workletValueSetter
+    : workletValueSetterJS);
+if (!isWeb() && isConfigured()) {
+    const capturableConsole = console;
+    runOnUI(() => {
+        'worklet';
+        const console = {
+            debug: runOnJS(capturableConsole.debug),
+            log: runOnJS(capturableConsole.log),
+            warn: runOnJS(capturableConsole.warn),
+            error: runOnJS(capturableConsole.error),
+            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 = {
     enableLayoutAnimations: false,
@@ -301,3 +299,11 @@ export function enableLayoutAnimations(flag, isCallByUser = true) {
         NativeReanimatedModule.enableLayoutAnimations(flag);
     }
 }
+export function configureProps(uiProps, nativeProps) {
+    if (!nativeShouldBeMock()) {
+        NativeReanimatedModule.configureProps(uiProps, nativeProps);
+    }
+}
+export function jestResetJsReanimatedModule() {
+    NativeReanimatedModule.jestResetModule();
+}

package/lib/{src/reanimated2 → reanimated2}/globals.d.ts

@@ -27,6 +27,9 @@ declare global {
     animated: boolean
   ) => void;
   const _chronoNow: () => number;
+  const ReanimatedDataMock: {
+    now: () => number;
+  };
   namespace NodeJS {
     interface Global {
       __reanimatedWorkletInit: (worklet: WorkletFunction) => void;
@@ -50,6 +53,9 @@ declare global {
           yogaValues: unknown
         ): void;
       };
+      ReanimatedDataMock: {
+        now: () => number;
+      };
     }
   }
 }

package/lib/{src/reanimated2 → reanimated2}/hook/index.js

@@ -6,3 +6,4 @@ export { useAnimatedReaction, } from './useAnimatedReaction';
 export { useAnimatedRef } from './useAnimatedRef';
 export { useAnimatedScrollHandler, } from './useAnimatedScrollHandler';
 export { useDerivedValue } from './useDerivedValue';
+export { useAnimatedSensor, SensorType } from './useAnimatedSensor';

package/lib/reanimated2/hook/useAnimatedSensor.js

@@ -0,0 +1,66 @@
+import { useEffect, useRef } from 'react';
+import { makeMutable } from '../core';
+import NativeReanimated from '../NativeReanimated';
+export var SensorType;
+(function (SensorType) {
+    SensorType[SensorType["ACCELEROMETER"] = 1] = "ACCELEROMETER";
+    SensorType[SensorType["GYROSCOPE"] = 2] = "GYROSCOPE";
+    SensorType[SensorType["GRAVITY"] = 3] = "GRAVITY";
+    SensorType[SensorType["MAGNETIC_FIELD"] = 4] = "MAGNETIC_FIELD";
+    SensorType[SensorType["ROTATION"] = 5] = "ROTATION";
+})(SensorType || (SensorType = {}));
+export function useAnimatedSensor(sensorType, userConfig) {
+    const ref = useRef({
+        sensor: null,
+        unregister: () => {
+            // NOOP
+        },
+        isAvailable: false,
+        config: {
+            interval: 0,
+        },
+    });
+    if (ref.current.sensor === null) {
+        ref.current.config = Object.assign({ interval: 10 }, userConfig);
+        let sensorData;
+        if (sensorType === SensorType.ROTATION) {
+            sensorData = {
+                qw: 0,
+                qx: 0,
+                qy: 0,
+                qz: 0,
+                yaw: 0,
+                pitch: 0,
+                roll: 0,
+            };
+        }
+        else {
+            sensorData = {
+                x: 0,
+                y: 0,
+                z: 0,
+            };
+        }
+        ref.current.sensor = makeMutable(sensorData);
+    }
+    useEffect(() => {
+        ref.current.config = Object.assign({ interval: 10 }, userConfig);
+        const id = NativeReanimated.registerSensor(sensorType, ref.current.config.interval, ref.current.sensor);
+        if (id !== -1) {
+            // if sensor is available
+            ref.current.unregister = () => NativeReanimated.unregisterSensor(id);
+            ref.current.isAvailable = true;
+        }
+        else {
+            // if sensor is unavailable
+            ref.current.unregister = () => {
+                // NOOP
+            };
+            ref.current.isAvailable = false;
+        }
+        return () => {
+            ref.current.unregister();
+        };
+    }, [sensorType, userConfig]);
+    return ref.current;
+}

package/lib/{src/reanimated2 → reanimated2}/interpolateColor.js

@@ -27,13 +27,13 @@ const getInterpolateRGB = (colors) => {
     const a = [];
     for (let i = 0; i < colors.length; ++i) {
         const color = colors[i];
-        const proocessedColor = processColor(color);
+        const processedColor = processColor(color);
         // explicit check in case if processedColor is 0
-        if (proocessedColor !== null && proocessedColor !== undefined) {
-            r.push(red(proocessedColor));
-            g.push(green(proocessedColor));
-            b.push(blue(proocessedColor));
-            a.push(opacity(proocessedColor));
+        if (processedColor !== null && processedColor !== undefined) {
+            r.push(red(processedColor));
+            g.push(green(processedColor));
+            b.push(blue(processedColor));
+            a.push(opacity(processedColor));
         }
     }
     return { r, g, b, a };
@@ -45,11 +45,11 @@ const getInterpolateHSV = (colors) => {
     const v = [];
     for (let i = 0; i < colors.length; ++i) {
         const color = colors[i];
-        const proocessedColor = RGBtoHSV(processColor(color));
-        if (proocessedColor) {
-            h.push(proocessedColor.h);
-            s.push(proocessedColor.s);
-            v.push(proocessedColor.v);
+        const processedColor = RGBtoHSV(processColor(color));
+        if (processedColor) {
+            h.push(processedColor.h);
+            s.push(processedColor.s);
+            v.push(processedColor.v);
         }
     }
     return { h, s, v };

package/lib/{src/reanimated2 → reanimated2}/interpolation.js

@@ -66,7 +66,7 @@ function validateType(type) {
 }
 function internalInterpolate(x, narrowedInput, extrapolationConfig) {
     'worklet';
-    const { leftEdgeInput, rightEdgeInput, leftEdgeOutput, rightEdgeOutput, } = narrowedInput;
+    const { leftEdgeInput, rightEdgeInput, leftEdgeOutput, rightEdgeOutput } = narrowedInput;
     if (rightEdgeInput - leftEdgeInput === 0)
         return leftEdgeOutput;
     const progress = (x - leftEdgeInput) / (rightEdgeInput - leftEdgeInput);