react-native-reanimated 2.12.0 → 2.14.0

package/lib/reanimated2/animation/util.js

@@ -1,5 +1,5 @@
 /* global _WORKLET */
-import { convertToHSVA, isColor, toRGBA } from '../Colors';
+import { isColor, convertToRGBA, rgbaArrayToRGBAColor, toGammaSpace, toLinearSpace, } from '../Colors';
 import NativeReanimatedModule from '../NativeReanimated';
 let IN_STYLE_UPDATER = false;
 export function initialUpdaterRun(updater) {
@@ -75,39 +75,39 @@ function decorateAnimation(animation) {
                 ((_b = animation.__suffix) !== null && _b !== void 0 ? _b : '');
         return res;
     };
-    const tab = ['H', 'S', 'V', 'A'];
+    const tab = ['R', 'G', 'B', 'A'];
     const colorOnStart = (animation, value, timestamp, previousAnimation) => {
-        let HSVAValue;
-        let HSVACurrent;
-        let HSVAToValue;
+        let RGBAValue;
+        let RGBACurrent;
+        let RGBAToValue;
         const res = [];
         if (isColor(value)) {
-            HSVACurrent = convertToHSVA(animation.current);
-            HSVAValue = convertToHSVA(value);
+            RGBACurrent = toLinearSpace(convertToRGBA(animation.current));
+            RGBAValue = toLinearSpace(convertToRGBA(value));
             if (animation.toValue) {
-                HSVAToValue = convertToHSVA(animation.toValue);
+                RGBAToValue = toLinearSpace(convertToRGBA(animation.toValue));
             }
         }
         tab.forEach((i, index) => {
             animation[i] = Object.assign({}, animationCopy);
-            animation[i].current = HSVACurrent[index];
-            animation[i].toValue = HSVAToValue ? HSVAToValue[index] : undefined;
-            animation[i].onStart(animation[i], HSVAValue[index], timestamp, previousAnimation ? previousAnimation[i] : undefined);
+            animation[i].current = RGBACurrent[index];
+            animation[i].toValue = RGBAToValue ? RGBAToValue[index] : undefined;
+            animation[i].onStart(animation[i], RGBAValue[index], timestamp, previousAnimation ? previousAnimation[i] : undefined);
             res.push(animation[i].current);
         });
-        animation.current = toRGBA(res);
+        animation.current = rgbaArrayToRGBAColor(toGammaSpace(res));
     };
     const colorOnFrame = (animation, timestamp) => {
-        const HSVACurrent = convertToHSVA(animation.current);
+        const RGBACurrent = toLinearSpace(convertToRGBA(animation.current));
         const res = [];
         let finished = true;
         tab.forEach((i, index) => {
-            animation[i].current = HSVACurrent[index];
+            animation[i].current = RGBACurrent[index];
             // @ts-ignore: disable-next-line
             finished &= animation[i].onFrame(animation[i], timestamp);
             res.push(animation[i].current);
         });
-        animation.current = toRGBA(res);
+        animation.current = rgbaArrayToRGBAColor(toGammaSpace(res));
         return finished;
     };
     const arrayOnStart = (animation, value, timestamp, previousAnimation) => {

package/lib/reanimated2/globals.d.ts

@@ -9,6 +9,7 @@ import type { FrameCallbackRegistryUI } from './frameCallback/FrameCallbackRegis
 
 declare global {
   const _WORKLET: boolean;
+  const _REANIMATED_VERSION_CPP: string;
   const _frameTimestamp: number | null;
   const _eventTimestamp: number;
   const __reanimatedModuleProxy: NativeReanimated;
@@ -49,6 +50,7 @@ declare global {
     interface Global {
       _WORKLET: boolean;
       _IS_FABRIC: boolean;
+      _REANIMATED_VERSION_CPP: string;
       _frameTimestamp: number | null;
       _eventTimestamp: number;
       __reanimatedModuleProxy: NativeReanimated;

package/lib/reanimated2/interpolateColor.js

@@ -4,20 +4,75 @@ import { interpolate } from './interpolation';
 // @ts-ignore JS file
 import { Extrapolate } from '../reanimated1/derived';
 import { useSharedValue } from './hook/useSharedValue';
-const interpolateColorsHSV = (value, inputRange, colors) => {
+const interpolateColorsHSV = (value, inputRange, colors, options) => {
     'worklet';
-    const h = interpolate(value, inputRange, colors.h, Extrapolate.CLAMP);
+    let h = 0;
+    const { useCorrectedHSVInterpolation = true } = options;
+    if (useCorrectedHSVInterpolation) {
+        // if the difference between hues in a range is > 180 deg
+        // then move the hue at the right end of the range +/- 360 deg
+        // and add the next point in the original place + 0.00001 with original hue
+        // to not break the next range
+        const correctedInputRange = [inputRange[0]];
+        const originalH = colors.h;
+        const correctedH = [originalH[0]];
+        for (let i = 1; i < originalH.length; ++i) {
+            const d = originalH[i] - originalH[i - 1];
+            if (originalH[i] > originalH[i - 1] && d > 0.5) {
+                correctedInputRange.push(inputRange[i]);
+                correctedInputRange.push(inputRange[i] + 0.00001);
+                correctedH.push(originalH[i] - 1);
+                correctedH.push(originalH[i]);
+            }
+            else if (originalH[i] < originalH[i - 1] && d < -0.5) {
+                correctedInputRange.push(inputRange[i]);
+                correctedInputRange.push(inputRange[i] + 0.00001);
+                correctedH.push(originalH[i] + 1);
+                correctedH.push(originalH[i]);
+            }
+            else {
+                correctedInputRange.push(inputRange[i]);
+                correctedH.push(originalH[i]);
+            }
+        }
+        h =
+            (interpolate(value, correctedInputRange, correctedH, Extrapolate.CLAMP) +
+                1) %
+                1;
+    }
+    else {
+        h = interpolate(value, inputRange, colors.h, Extrapolate.CLAMP);
+    }
     const s = interpolate(value, inputRange, colors.s, Extrapolate.CLAMP);
     const v = interpolate(value, inputRange, colors.v, Extrapolate.CLAMP);
-    return hsvToColor(h, s, v);
+    const a = interpolate(value, inputRange, colors.a, Extrapolate.CLAMP);
+    return hsvToColor(h, s, v, a);
 };
-const interpolateColorsRGB = (value, inputRange, colors) => {
+const toLinearSpace = (x, gamma) => {
     'worklet';
-    const r = interpolate(value, inputRange, colors.r, Extrapolate.CLAMP);
-    const g = interpolate(value, inputRange, colors.g, Extrapolate.CLAMP);
-    const b = interpolate(value, inputRange, colors.b, Extrapolate.CLAMP);
+    return x.map((v) => Math.pow(v / 255, gamma));
+};
+const toGammaSpace = (x, gamma) => {
+    'worklet';
+    return Math.round(Math.pow(x, 1 / gamma) * 255);
+};
+const interpolateColorsRGB = (value, inputRange, colors, options) => {
+    'worklet';
+    const { gamma = 2.2 } = options;
+    let { r: outputR, g: outputG, b: outputB } = colors;
+    if (gamma !== 1) {
+        outputR = toLinearSpace(outputR, gamma);
+        outputG = toLinearSpace(outputG, gamma);
+        outputB = toLinearSpace(outputB, gamma);
+    }
+    const r = interpolate(value, inputRange, outputR, Extrapolate.CLAMP);
+    const g = interpolate(value, inputRange, outputG, Extrapolate.CLAMP);
+    const b = interpolate(value, inputRange, outputB, Extrapolate.CLAMP);
     const a = interpolate(value, inputRange, colors.a, Extrapolate.CLAMP);
-    return rgbaColor(r, g, b, a);
+    if (gamma === 1) {
+        return rgbaColor(r, g, b, a);
+    }
+    return rgbaColor(toGammaSpace(r, gamma), toGammaSpace(g, gamma), toGammaSpace(b, gamma), a);
 };
 const getInterpolateRGB = (colors) => {
     'worklet';
@@ -43,24 +98,27 @@ const getInterpolateHSV = (colors) => {
     const h = [];
     const s = [];
     const v = [];
+    const a = [];
     for (let i = 0; i < colors.length; ++i) {
         const color = colors[i];
-        const processedColor = RGBtoHSV(processColor(color));
-        if (processedColor) {
-            h.push(processedColor.h);
-            s.push(processedColor.s);
-            v.push(processedColor.v);
+        const processedColor = processColor(color);
+        if (typeof processedColor === 'number') {
+            const processedHSVColor = RGBtoHSV(red(processedColor), green(processedColor), blue(processedColor));
+            h.push(processedHSVColor.h);
+            s.push(processedHSVColor.s);
+            v.push(processedHSVColor.v);
+            a.push(opacity(processedColor));
         }
     }
-    return { h, s, v };
+    return { h, s, v, a };
 };
-export const interpolateColor = (value, inputRange, outputRange, colorSpace = 'RGB') => {
+export const interpolateColor = (value, inputRange, outputRange, colorSpace = 'RGB', options = {}) => {
     'worklet';
     if (colorSpace === 'HSV') {
-        return interpolateColorsHSV(value, inputRange, getInterpolateHSV(outputRange));
+        return interpolateColorsHSV(value, inputRange, getInterpolateHSV(outputRange), options);
     }
     else if (colorSpace === 'RGB') {
-        return interpolateColorsRGB(value, inputRange, getInterpolateRGB(outputRange));
+        return interpolateColorsRGB(value, inputRange, getInterpolateRGB(outputRange), options);
     }
     throw new Error(`Invalid color space provided: ${colorSpace}. Supported values are: ['RGB', 'HSV']`);
 };
@@ -69,12 +127,13 @@ export var ColorSpace;
     ColorSpace[ColorSpace["RGB"] = 0] = "RGB";
     ColorSpace[ColorSpace["HSV"] = 1] = "HSV";
 })(ColorSpace || (ColorSpace = {}));
-export function useInterpolateConfig(inputRange, outputRange, colorSpace = ColorSpace.RGB) {
+export function useInterpolateConfig(inputRange, outputRange, colorSpace = ColorSpace.RGB, options = {}) {
     return useSharedValue({
         inputRange,
         outputRange,
         colorSpace,
         cache: makeMutable(null),
+        options,
     });
 }
 export const interpolateSharableColor = (value, interpolateConfig) => {
@@ -85,14 +144,14 @@ export const interpolateSharableColor = (value, interpolateConfig) => {
             colors = getInterpolateRGB(interpolateConfig.value.outputRange);
             interpolateConfig.value.cache.value = colors;
         }
-        return interpolateColorsRGB(value, interpolateConfig.value.inputRange, colors);
+        return interpolateColorsRGB(value, interpolateConfig.value.inputRange, colors, interpolateConfig.value.options);
     }
     else if (interpolateConfig.value.colorSpace === ColorSpace.HSV) {
         if (!colors) {
             colors = getInterpolateHSV(interpolateConfig.value.outputRange);
             interpolateConfig.value.cache.value = colors;
         }
-        return interpolateColorsHSV(value, interpolateConfig.value.inputRange, colors);
+        return interpolateColorsHSV(value, interpolateConfig.value.inputRange, colors, interpolateConfig.value.options);
     }
     throw new Error(`Invalid color space provided: ${interpolateConfig.value.colorSpace}. Supported values are: ['RGB', 'HSV']`);
 };

package/lib/reanimated2/jestUtils.js

@@ -145,14 +145,21 @@ export const advanceAnimationByFrame = (count) => {
     jest.advanceTimersByTime(frameTime);
 };
 export const setUpTests = (userConfig = {}) => {
-    let expect;
-    try {
-        expect = require('expect');
-    }
-    catch (_) {
-        // for Jest in version 28+
-        const { expect: expectModule } = require('@jest/globals');
+    let expect = global.expect;
+    if (expect === undefined) {
+        const expectModule = require('expect');
         expect = expectModule;
+        // Starting from Jest 28, "expect" package uses named exports instead of default export.
+        // So, requiring "expect" package doesn't give direct access to "expect" function anymore.
+        // It gives access to the module object instead.
+        // We use this info to detect if the project uses Jest 28 or higher.
+        if (typeof expect === 'object') {
+            const jestGlobals = require('@jest/globals');
+            expect = jestGlobals.expect;
+        }
+        if (expect === undefined || expect.extend === undefined) {
+            expect = expectModule.default;
+        }
     }
     require('setimmediate');
     frameTime = Math.round(1000 / config.fps);

package/lib/reanimated2/layoutReanimation/defaultAnimations/Bounce.js

@@ -1,7 +1,5 @@
 import { withSequence, withTiming } from '../../animation';
-import { Dimensions } from 'react-native';
 import { ComplexAnimationBuilder } from '../animationBuilder/ComplexAnimationBuilder';
-const { width, height } = Dimensions.get('window');
 export class BounceIn extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
@@ -47,7 +45,7 @@ export class BounceInDown extends ComplexAnimationBuilder {
             const duration = this.getDuration();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
@@ -59,7 +57,7 @@ export class BounceInDown extends ComplexAnimationBuilder {
                     },
                     initialValues: Object.assign({ transform: [
                             {
-                                translateY: height,
+                                translateY: values.windowHeight,
                             },
                         ] }, initialValues),
                     callback: callback,
@@ -87,7 +85,7 @@ export class BounceInUp extends ComplexAnimationBuilder {
             const duration = this.getDuration();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
@@ -97,7 +95,7 @@ export class BounceInUp extends ComplexAnimationBuilder {
                             },
                         ],
                     },
-                    initialValues: Object.assign({ transform: [{ translateY: -height }] }, initialValues),
+                    initialValues: Object.assign({ transform: [{ translateY: -values.windowHeight }] }, initialValues),
                     callback: callback,
                 };
             };
@@ -123,7 +121,7 @@ export class BounceInLeft extends ComplexAnimationBuilder {
             const duration = this.getDuration();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
@@ -133,7 +131,7 @@ export class BounceInLeft extends ComplexAnimationBuilder {
                             },
                         ],
                     },
-                    initialValues: Object.assign({ transform: [{ translateX: -width }] }, initialValues),
+                    initialValues: Object.assign({ transform: [{ translateX: -values.windowWidth }] }, initialValues),
                     callback: callback,
                 };
             };
@@ -159,7 +157,7 @@ export class BounceInRight extends ComplexAnimationBuilder {
             const duration = this.getDuration();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
@@ -169,7 +167,7 @@ export class BounceInRight extends ComplexAnimationBuilder {
                             },
                         ],
                     },
-                    initialValues: Object.assign({ transform: [{ translateX: width }] }, initialValues),
+                    initialValues: Object.assign({ transform: [{ translateX: values.windowWidth }] }, initialValues),
                     callback: callback,
                 };
             };
@@ -231,13 +229,13 @@ export class BounceOutDown extends ComplexAnimationBuilder {
             const duration = this.getDuration();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
                         transform: [
                             {
-                                translateY: delayFunction(delay, withSequence(withTiming(-10, { duration: duration * 0.15 }), withTiming(10, { duration: duration * 0.15 }), withTiming(-20, { duration: duration * 0.15 }), withTiming(height, {
+                                translateY: delayFunction(delay, withSequence(withTiming(-10, { duration: duration * 0.15 }), withTiming(10, { duration: duration * 0.15 }), withTiming(-20, { duration: duration * 0.15 }), withTiming(values.windowHeight, {
                                     duration: duration * 0.55,
                                 }))),
                             },
@@ -269,13 +267,13 @@ export class BounceOutUp extends ComplexAnimationBuilder {
             const duration = this.getDuration();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
                         transform: [
                             {
-                                translateY: delayFunction(delay, withSequence(withTiming(10, { duration: duration * 0.15 }), withTiming(-10, { duration: duration * 0.15 }), withTiming(20, { duration: duration * 0.15 }), withTiming(-height, {
+                                translateY: delayFunction(delay, withSequence(withTiming(10, { duration: duration * 0.15 }), withTiming(-10, { duration: duration * 0.15 }), withTiming(20, { duration: duration * 0.15 }), withTiming(-values.windowHeight, {
                                     duration: duration * 0.55,
                                 }))),
                             },
@@ -307,13 +305,13 @@ export class BounceOutLeft extends ComplexAnimationBuilder {
             const duration = this.getDuration();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
                         transform: [
                             {
-                                translateX: delayFunction(delay, withSequence(withTiming(10, { duration: duration * 0.15 }), withTiming(-10, { duration: duration * 0.15 }), withTiming(20, { duration: duration * 0.15 }), withTiming(-width, {
+                                translateX: delayFunction(delay, withSequence(withTiming(10, { duration: duration * 0.15 }), withTiming(-10, { duration: duration * 0.15 }), withTiming(20, { duration: duration * 0.15 }), withTiming(-values.windowWidth, {
                                     duration: duration * 0.55,
                                 }))),
                             },
@@ -345,13 +343,13 @@ export class BounceOutRight extends ComplexAnimationBuilder {
             const duration = this.getDuration();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
                         transform: [
                             {
-                                translateX: delayFunction(delay, withSequence(withTiming(-10, { duration: duration * 0.15 }), withTiming(10, { duration: duration * 0.15 }), withTiming(-20, { duration: duration * 0.15 }), withTiming(width, {
+                                translateX: delayFunction(delay, withSequence(withTiming(-10, { duration: duration * 0.15 }), withTiming(10, { duration: duration * 0.15 }), withTiming(-20, { duration: duration * 0.15 }), withTiming(values.windowWidth, {
                                     duration: duration * 0.55,
                                 }))),
                             },

package/lib/reanimated2/layoutReanimation/defaultAnimations/Lightspeed.js

@@ -1,7 +1,5 @@
-import { Dimensions } from 'react-native';
 import { withSequence, withTiming } from '../../animation';
 import { ComplexAnimationBuilder } from '../animationBuilder';
-const { width } = Dimensions.get('window');
 export class LightSpeedInRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
@@ -12,7 +10,7 @@ export class LightSpeedInRight extends ComplexAnimationBuilder {
             const duration = this.getDuration();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
@@ -26,7 +24,7 @@ export class LightSpeedInRight extends ComplexAnimationBuilder {
                             },
                         ],
                     },
-                    initialValues: Object.assign({ opacity: 0, transform: [{ translateX: width }, { skewX: '-45deg' }] }, initialValues),
+                    initialValues: Object.assign({ opacity: 0, transform: [{ translateX: values.windowWidth }, { skewX: '-45deg' }] }, initialValues),
                     callback: callback,
                 };
             };
@@ -46,7 +44,7 @@ export class LightSpeedInLeft extends ComplexAnimationBuilder {
             const duration = this.getDuration();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
@@ -60,7 +58,7 @@ export class LightSpeedInLeft extends ComplexAnimationBuilder {
                             },
                         ],
                     },
-                    initialValues: Object.assign({ opacity: 0, transform: [{ translateX: -width }, { skewX: '45deg' }] }, initialValues),
+                    initialValues: Object.assign({ opacity: 0, transform: [{ translateX: -values.windowWidth }, { skewX: '45deg' }] }, initialValues),
                     callback: callback,
                 };
             };
@@ -79,14 +77,14 @@ export class LightSpeedOutRight extends ComplexAnimationBuilder {
             const delay = this.getDelay();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
                         opacity: delayFunction(delay, animation(0, config)),
                         transform: [
                             {
-                                translateX: delayFunction(delay, animation(width, config)),
+                                translateX: delayFunction(delay, animation(values.windowWidth, config)),
                             },
                             {
                                 skewX: delayFunction(delay, animation('-45deg', config)),
@@ -112,14 +110,14 @@ export class LightSpeedOutLeft extends ComplexAnimationBuilder {
             const delay = this.getDelay();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
                         opacity: delayFunction(delay, animation(0, config)),
                         transform: [
                             {
-                                translateX: delayFunction(delay, animation(-width, config)),
+                                translateX: delayFunction(delay, animation(-values.windowWidth, config)),
                             },
                             {
                                 skewX: delayFunction(delay, animation('45deg', config)),

package/lib/reanimated2/layoutReanimation/defaultAnimations/Roll.js

@@ -1,6 +1,4 @@
-import { Dimensions } from 'react-native';
 import { ComplexAnimationBuilder } from '../animationBuilder';
-const { width } = Dimensions.get('window');
 export class RollInLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
@@ -10,7 +8,7 @@ export class RollInLeft extends ComplexAnimationBuilder {
             const delay = this.getDelay();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
@@ -19,7 +17,10 @@ export class RollInLeft extends ComplexAnimationBuilder {
                             { rotate: delayFunction(delay, animation('0deg', config)) },
                         ],
                     },
-                    initialValues: Object.assign({ transform: [{ translateX: -width }, { rotate: '-180deg' }] }, initialValues),
+                    initialValues: Object.assign({ transform: [
+                            { translateX: -values.windowWidth },
+                            { rotate: '-180deg' },
+                        ] }, initialValues),
                     callback: callback,
                 };
             };
@@ -38,7 +39,7 @@ export class RollInRight extends ComplexAnimationBuilder {
             const delay = this.getDelay();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
@@ -47,7 +48,7 @@ export class RollInRight extends ComplexAnimationBuilder {
                             { rotate: delayFunction(delay, animation('0deg', config)) },
                         ],
                     },
-                    initialValues: Object.assign({ transform: [{ translateX: width }, { rotate: '180deg' }] }, initialValues),
+                    initialValues: Object.assign({ transform: [{ translateX: values.windowWidth }, { rotate: '180deg' }] }, initialValues),
                     callback: callback,
                 };
             };
@@ -66,12 +67,14 @@ export class RollOutLeft extends ComplexAnimationBuilder {
             const delay = this.getDelay();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
                         transform: [
-                            { translateX: delayFunction(delay, animation(-width, config)) },
+                            {
+                                translateX: delayFunction(delay, animation(-values.windowWidth, config)),
+                            },
                             { rotate: delayFunction(delay, animation('-180deg', config)) },
                         ],
                     },
@@ -94,12 +97,14 @@ export class RollOutRight extends ComplexAnimationBuilder {
             const delay = this.getDelay();
             const callback = this.callbackV;
             const initialValues = this.initialValues;
-            return () => {
+            return (values) => {
                 'worklet';
                 return {
                     animations: {
                         transform: [
-                            { translateX: delayFunction(delay, animation(width, config)) },
+                            {
+                                translateX: delayFunction(delay, animation(values.windowWidth, config)),
+                            },
                             { rotate: delayFunction(delay, animation('180deg', config)) },
                         ],
                     },

package/lib/reanimated2/layoutReanimation/defaultAnimations/Slide.js

@@ -1,6 +1,4 @@
-import { Dimensions } from 'react-native';
 import { ComplexAnimationBuilder } from '../animationBuilder';
-const { width, height } = Dimensions.get('window');
 export class SlideInRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
@@ -16,7 +14,7 @@ export class SlideInRight extends ComplexAnimationBuilder {
                     animations: {
                         originX: delayFunction(delay, animation(values.targetOriginX, config)),
                     },
-                    initialValues: Object.assign({ originX: values.targetOriginX + width }, initialValues),
+                    initialValues: Object.assign({ originX: values.targetOriginX + values.windowWidth }, initialValues),
                     callback: callback,
                 };
             };
@@ -41,7 +39,7 @@ export class SlideInLeft extends ComplexAnimationBuilder {
                     animations: {
                         originX: delayFunction(delay, animation(values.targetOriginX, config)),
                     },
-                    initialValues: Object.assign({ originX: values.targetOriginX - width }, initialValues),
+                    initialValues: Object.assign({ originX: values.targetOriginX - values.windowWidth }, initialValues),
                     callback: callback,
                 };
             };
@@ -64,7 +62,7 @@ export class SlideOutRight extends ComplexAnimationBuilder {
                 'worklet';
                 return {
                     animations: {
-                        originX: delayFunction(delay, animation(Math.max(values.currentOriginX + width, width), config)),
+                        originX: delayFunction(delay, animation(Math.max(values.currentOriginX + values.windowWidth, values.windowWidth), config)),
                     },
                     initialValues: Object.assign({ originX: values.currentOriginX }, initialValues),
                     callback: callback,
@@ -89,7 +87,7 @@ export class SlideOutLeft extends ComplexAnimationBuilder {
                 'worklet';
                 return {
                     animations: {
-                        originX: delayFunction(delay, animation(Math.min(values.currentOriginX - width, -width), config)),
+                        originX: delayFunction(delay, animation(Math.min(values.currentOriginX - values.windowWidth, -values.windowWidth), config)),
                     },
                     initialValues: Object.assign({ originX: values.currentOriginX }, initialValues),
                     callback: callback,
@@ -116,7 +114,7 @@ export class SlideInUp extends ComplexAnimationBuilder {
                     animations: {
                         originY: delayFunction(delay, animation(values.targetOriginY, config)),
                     },
-                    initialValues: Object.assign({ originY: -height }, initialValues),
+                    initialValues: Object.assign({ originY: -values.windowHeight }, initialValues),
                     callback: callback,
                 };
             };
@@ -141,7 +139,7 @@ export class SlideInDown extends ComplexAnimationBuilder {
                     animations: {
                         originY: delayFunction(delay, animation(values.targetOriginY, config)),
                     },
-                    initialValues: Object.assign({ originY: values.targetOriginY + height }, initialValues),
+                    initialValues: Object.assign({ originY: values.targetOriginY + values.windowHeight }, initialValues),
                     callback: callback,
                 };
             };
@@ -164,7 +162,7 @@ export class SlideOutUp extends ComplexAnimationBuilder {
                 'worklet';
                 return {
                     animations: {
-                        originY: delayFunction(delay, animation(Math.min(values.currentOriginY - height, -height), config)),
+                        originY: delayFunction(delay, animation(Math.min(values.currentOriginY - values.windowHeight, -values.windowHeight), config)),
                     },
                     initialValues: Object.assign({ originY: values.currentOriginY }, initialValues),
                     callback: callback,
@@ -189,7 +187,7 @@ export class SlideOutDown extends ComplexAnimationBuilder {
                 'worklet';
                 return {
                     animations: {
-                        originY: delayFunction(delay, animation(Math.max(values.currentOriginY + height, height), config)),
+                        originY: delayFunction(delay, animation(Math.max(values.currentOriginY + values.windowHeight, values.windowHeight), config)),
                     },
                     initialValues: Object.assign({ originY: values.currentOriginY }, initialValues),
                     callback: callback,