react-native-reanimated 2.3.0-alpha.3 → 2.3.0-beta.4

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

@@ -1,11 +1,11 @@
-import { BaseAnimationBuilder } from '../animationBuilder/BaseAnimationBuilder';
-export class FlipInXUp extends BaseAnimationBuilder {
+import { ComplexAnimationBuilder } from '../animationBuilder';
+export class FlipInXUp extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (targetValues) => {
                 'worklet';
@@ -33,13 +33,13 @@ export class FlipInXUp extends BaseAnimationBuilder {
         return new FlipInXUp();
     }
 }
-export class FlipInYLeft extends BaseAnimationBuilder {
+export class FlipInYLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (targetValues) => {
                 'worklet';
@@ -67,13 +67,13 @@ export class FlipInYLeft extends BaseAnimationBuilder {
         return new FlipInYLeft();
     }
 }
-export class FlipInXDown extends BaseAnimationBuilder {
+export class FlipInXDown extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (targetValues) => {
                 'worklet';
@@ -101,13 +101,13 @@ export class FlipInXDown extends BaseAnimationBuilder {
         return new FlipInXDown();
     }
 }
-export class FlipInYRight extends BaseAnimationBuilder {
+export class FlipInYRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (targetValues) => {
                 'worklet';
@@ -135,13 +135,13 @@ export class FlipInYRight extends BaseAnimationBuilder {
         return new FlipInYRight();
     }
 }
-export class FlipInEasyX extends BaseAnimationBuilder {
+export class FlipInEasyX extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return () => {
                 'worklet';
@@ -164,13 +164,13 @@ export class FlipInEasyX extends BaseAnimationBuilder {
         return new FlipInEasyX();
     }
 }
-export class FlipInEasyY extends BaseAnimationBuilder {
+export class FlipInEasyY extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return () => {
                 'worklet';
@@ -193,13 +193,13 @@ export class FlipInEasyY extends BaseAnimationBuilder {
         return new FlipInEasyY();
     }
 }
-export class FlipOutXUp extends BaseAnimationBuilder {
+export class FlipOutXUp extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (targetValues) => {
                 'worklet';
@@ -229,13 +229,13 @@ export class FlipOutXUp extends BaseAnimationBuilder {
         return new FlipOutXUp();
     }
 }
-export class FlipOutYLeft extends BaseAnimationBuilder {
+export class FlipOutYLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (targetValues) => {
                 'worklet';
@@ -265,13 +265,13 @@ export class FlipOutYLeft extends BaseAnimationBuilder {
         return new FlipOutYLeft();
     }
 }
-export class FlipOutXDown extends BaseAnimationBuilder {
+export class FlipOutXDown extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (targetValues) => {
                 'worklet';
@@ -301,13 +301,13 @@ export class FlipOutXDown extends BaseAnimationBuilder {
         return new FlipOutXDown();
     }
 }
-export class FlipOutYRight extends BaseAnimationBuilder {
+export class FlipOutYRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (targetValues) => {
                 'worklet';
@@ -337,13 +337,13 @@ export class FlipOutYRight extends BaseAnimationBuilder {
         return new FlipOutYRight();
     }
 }
-export class FlipOutEasyX extends BaseAnimationBuilder {
+export class FlipOutEasyX extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return () => {
                 'worklet';
@@ -366,13 +366,13 @@ export class FlipOutEasyX extends BaseAnimationBuilder {
         return new FlipOutEasyX();
     }
 }
-export class FlipOutEasyY extends BaseAnimationBuilder {
+export class FlipOutEasyY extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return () => {
                 'worklet';

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

@@ -1,25 +1,27 @@
 import { Dimensions } from 'react-native';
 import { withSequence, withTiming } from '../../animation';
-import { BaseAnimationBuilder } from '../animationBuilder/BaseAnimationBuilder';
+import { ComplexAnimationBuilder } from '../animationBuilder';
 const { width } = Dimensions.get('window');
-export class LightSpeedInRight extends BaseAnimationBuilder {
+export class LightSpeedInRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
-            const duration = this.durationV ? this.durationV : 250;
+            const delay = this.getDelay();
+            const duration = this.getDuration();
             const callback = this.callbackV;
             return () => {
                 'worklet';
                 return {
                     animations: {
-                        opacity: delayFunction(delay, withTiming(1, { duration: duration * 1.5 })),
+                        opacity: delayFunction(delay, withTiming(1, { duration: duration })),
                         transform: [
-                            { translateX: delayFunction(delay, animation(0, config)) },
                             {
-                                skewX: delayFunction(delay, withSequence(withTiming('10deg', { duration: duration }), withTiming('-5deg', { duration: duration / 5 }), withTiming('0deg', { duration: duration / 5 }))),
+                                translateX: delayFunction(delay, animation(0, Object.assign(Object.assign({}, config), { duration: duration * 0.7 }))),
+                            },
+                            {
+                                skewX: delayFunction(delay, withSequence(withTiming('10deg', { duration: duration * 0.7 }), withTiming('-5deg', { duration: duration * 0.15 }), withTiming('0deg', { duration: duration * 0.15 }))),
                             },
                         ],
                     },
@@ -36,26 +38,26 @@ export class LightSpeedInRight extends BaseAnimationBuilder {
         return new LightSpeedInRight();
     }
 }
-export class LightSpeedInLeft extends BaseAnimationBuilder {
+export class LightSpeedInLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
-            const duration = this.durationV ? this.durationV : 250;
+            const delay = this.getDelay();
+            const duration = this.getDuration();
             const callback = this.callbackV;
             return () => {
                 'worklet';
                 return {
                     animations: {
-                        opacity: delayFunction(delay, withTiming(1, { duration: duration * 1.5 })),
+                        opacity: delayFunction(delay, withTiming(1, { duration: duration })),
                         transform: [
                             {
-                                translateX: delayFunction(delay, animation(0, config)),
+                                translateX: delayFunction(delay, animation(0, Object.assign(Object.assign({}, config), { duration: duration * 0.7 }))),
                             },
                             {
-                                skewX: delayFunction(delay, withSequence(withTiming('-10deg', { duration: duration }), withTiming('5deg', { duration: duration / 5 }), withTiming('0deg', { duration: duration / 5 }))),
+                                skewX: delayFunction(delay, withSequence(withTiming('-10deg', { duration: duration * 0.7 }), withTiming('5deg', { duration: duration * 0.15 }), withTiming('0deg', { duration: duration * 0.15 }))),
                             },
                         ],
                     },
@@ -72,13 +74,13 @@ export class LightSpeedInLeft extends BaseAnimationBuilder {
         return new LightSpeedInLeft();
     }
 }
-export class LightSpeedOutRight extends BaseAnimationBuilder {
+export class LightSpeedOutRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return () => {
                 'worklet';
@@ -107,13 +109,13 @@ export class LightSpeedOutRight extends BaseAnimationBuilder {
         return new LightSpeedOutRight();
     }
 }
-export class LightSpeedOutLeft extends BaseAnimationBuilder {
+export class LightSpeedOutLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return () => {
                 'worklet';

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

@@ -1,11 +1,11 @@
-import { BaseAnimationBuilder } from '../animationBuilder/BaseAnimationBuilder';
-export class PinwheelIn extends BaseAnimationBuilder {
+import { ComplexAnimationBuilder } from '../animationBuilder';
+export class PinwheelIn extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (_values) => {
                 'worklet';
@@ -41,13 +41,13 @@ export class PinwheelIn extends BaseAnimationBuilder {
         return new PinwheelIn();
     }
 }
-export class PinwheelOut extends BaseAnimationBuilder {
+export class PinwheelOut extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (_values) => {
                 'worklet';

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

@@ -1,13 +1,13 @@
 import { Dimensions } from 'react-native';
-import { BaseAnimationBuilder } from '../animationBuilder/BaseAnimationBuilder';
+import { ComplexAnimationBuilder } from '../animationBuilder';
 const { width } = Dimensions.get('window');
-export class RollInLeft extends BaseAnimationBuilder {
+export class RollInLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return () => {
                 'worklet';
@@ -30,13 +30,13 @@ export class RollInLeft extends BaseAnimationBuilder {
         return new RollInLeft();
     }
 }
-export class RollInRight extends BaseAnimationBuilder {
+export class RollInRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return () => {
                 'worklet';
@@ -59,13 +59,13 @@ export class RollInRight extends BaseAnimationBuilder {
         return new RollInRight();
     }
 }
-export class RollOutLeft extends BaseAnimationBuilder {
+export class RollOutLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return () => {
                 'worklet';
@@ -88,13 +88,13 @@ export class RollOutLeft extends BaseAnimationBuilder {
         return new RollOutLeft();
     }
 }
-export class RollOutRight extends BaseAnimationBuilder {
+export class RollOutRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return () => {
                 'worklet';

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

@@ -1,11 +1,11 @@
-import { BaseAnimationBuilder } from '../animationBuilder/BaseAnimationBuilder';
-export class RotateInDownLeft extends BaseAnimationBuilder {
+import { ComplexAnimationBuilder } from '../animationBuilder';
+export class RotateInDownLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -35,13 +35,13 @@ export class RotateInDownLeft extends BaseAnimationBuilder {
         return new RotateInDownLeft();
     }
 }
-export class RotateInDownRight extends BaseAnimationBuilder {
+export class RotateInDownRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -71,13 +71,13 @@ export class RotateInDownRight extends BaseAnimationBuilder {
         return new RotateInDownRight();
     }
 }
-export class RotateInUpLeft extends BaseAnimationBuilder {
+export class RotateInUpLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -107,13 +107,13 @@ export class RotateInUpLeft extends BaseAnimationBuilder {
         return new RotateInUpLeft();
     }
 }
-export class RotateInUpRight extends BaseAnimationBuilder {
+export class RotateInUpRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -143,13 +143,13 @@ export class RotateInUpRight extends BaseAnimationBuilder {
         return new RotateInUpRight();
     }
 }
-export class RotateOutDownLeft extends BaseAnimationBuilder {
+export class RotateOutDownLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -179,13 +179,13 @@ export class RotateOutDownLeft extends BaseAnimationBuilder {
         return new RotateOutDownLeft();
     }
 }
-export class RotateOutDownRight extends BaseAnimationBuilder {
+export class RotateOutDownRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -215,13 +215,13 @@ export class RotateOutDownRight extends BaseAnimationBuilder {
         return new RotateOutDownRight();
     }
 }
-export class RotateOutUpLeft extends BaseAnimationBuilder {
+export class RotateOutUpLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -251,13 +251,13 @@ export class RotateOutUpLeft extends BaseAnimationBuilder {
         return new RotateOutUpLeft();
     }
 }
-export class RotateOutUpRight extends BaseAnimationBuilder {
+export class RotateOutUpRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';

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

@@ -1,13 +1,13 @@
-import { BaseAnimationBuilder } from '../animationBuilder/BaseAnimationBuilder';
 import { Dimensions } from 'react-native';
+import { ComplexAnimationBuilder } from '../animationBuilder';
 const { width, height } = Dimensions.get('window');
-export class SlideInRight extends BaseAnimationBuilder {
+export class SlideInRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -27,13 +27,13 @@ export class SlideInRight extends BaseAnimationBuilder {
         return new SlideInRight();
     }
 }
-export class SlideInLeft extends BaseAnimationBuilder {
+export class SlideInLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -53,13 +53,13 @@ export class SlideInLeft extends BaseAnimationBuilder {
         return new SlideInLeft();
     }
 }
-export class SlideOutRight extends BaseAnimationBuilder {
+export class SlideOutRight extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -79,13 +79,13 @@ export class SlideOutRight extends BaseAnimationBuilder {
         return new SlideOutRight();
     }
 }
-export class SlideOutLeft extends BaseAnimationBuilder {
+export class SlideOutLeft extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -105,13 +105,13 @@ export class SlideOutLeft extends BaseAnimationBuilder {
         return new SlideOutLeft();
     }
 }
-export class SlideInUp extends BaseAnimationBuilder {
+export class SlideInUp extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -120,7 +120,7 @@ export class SlideInUp extends BaseAnimationBuilder {
                         originY: delayFunction(delay, animation(values.originY, config)),
                     },
                     initialValues: {
-                        originY: height,
+                        originY: -height,
                     },
                     callback: callback,
                 };
@@ -131,13 +131,13 @@ export class SlideInUp extends BaseAnimationBuilder {
         return new SlideInUp();
     }
 }
-export class SlideInDown extends BaseAnimationBuilder {
+export class SlideInDown extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -146,7 +146,7 @@ export class SlideInDown extends BaseAnimationBuilder {
                         originY: delayFunction(delay, animation(values.originY, config)),
                     },
                     initialValues: {
-                        originY: values.originY - height,
+                        originY: values.originY + height,
                     },
                     callback: callback,
                 };
@@ -157,13 +157,13 @@ export class SlideInDown extends BaseAnimationBuilder {
         return new SlideInDown();
     }
 }
-export class SlideOutUp extends BaseAnimationBuilder {
+export class SlideOutUp extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';
@@ -181,13 +181,13 @@ export class SlideOutUp extends BaseAnimationBuilder {
         return new SlideOutUp();
     }
 }
-export class SlideOutDown extends BaseAnimationBuilder {
+export class SlideOutDown extends ComplexAnimationBuilder {
     constructor() {
         super(...arguments);
         this.build = () => {
             const delayFunction = this.getDelayFunction();
             const [animation, config] = this.getAnimationAndConfig();
-            const delay = this.delayV;
+            const delay = this.getDelay();
             const callback = this.callbackV;
             return (values) => {
                 'worklet';