react-native-reanimated 2.16.0 → 2.17.0

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

@@ -0,0 +1,457 @@
+import { ComplexAnimationBuilder } from '../animationBuilder';
+export class ZoomIn extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return () => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [{ scale: delayFunction(delay, animation(1, config)) }],
+                    },
+                    initialValues: Object.assign({ transform: [{ scale: 0 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomIn();
+    }
+}
+export class ZoomInRotate extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const rotate = this.rotateV ? this.rotateV : '0.3';
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return () => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            { scale: delayFunction(delay, animation(1, config)) },
+                            { rotate: delayFunction(delay, animation(0, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ scale: 0 }, { rotate: rotate }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomInRotate();
+    }
+}
+export class ZoomInLeft extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            { translateX: delayFunction(delay, animation(0, config)) },
+                            { scale: delayFunction(delay, animation(1, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateX: -values.windowWidth }, { scale: 0 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomInLeft();
+    }
+}
+export class ZoomInRight extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            { translateX: delayFunction(delay, animation(0, config)) },
+                            { scale: delayFunction(delay, animation(1, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateX: values.windowWidth }, { scale: 0 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomInRight();
+    }
+}
+export class ZoomInUp extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            { translateY: delayFunction(delay, animation(0, config)) },
+                            { scale: delayFunction(delay, animation(1, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateY: -values.windowHeight }, { scale: 0 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomInUp();
+    }
+}
+export class ZoomInDown extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            { translateY: delayFunction(delay, animation(0, config)) },
+                            { scale: delayFunction(delay, animation(1, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateY: values.windowHeight }, { scale: 0 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomInDown();
+    }
+}
+export class ZoomInEasyUp extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            { translateY: delayFunction(delay, animation(0, config)) },
+                            { scale: delayFunction(delay, animation(1, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateY: -values.targetHeight }, { scale: 0 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomInEasyUp();
+    }
+}
+export class ZoomInEasyDown extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            { translateY: delayFunction(delay, animation(0, config)) },
+                            { scale: delayFunction(delay, animation(1, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateY: values.targetHeight }, { scale: 0 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomInEasyDown();
+    }
+}
+export class ZoomOut extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return () => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [{ scale: delayFunction(delay, animation(0, config)) }],
+                    },
+                    initialValues: Object.assign({ transform: [{ scale: 1 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomOut();
+    }
+}
+export class ZoomOutRotate extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const rotate = this.rotateV ? this.rotateV : '0.3';
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return () => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            { scale: delayFunction(delay, animation(0, config)) },
+                            { rotate: delayFunction(delay, animation(rotate, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ scale: 1 }, { rotate: '0' }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomOutRotate();
+    }
+}
+export class ZoomOutLeft extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            {
+                                translateX: delayFunction(delay, animation(-values.windowWidth, config)),
+                            },
+                            { scale: delayFunction(delay, animation(0, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateX: 0 }, { scale: 1 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomOutLeft();
+    }
+}
+export class ZoomOutRight extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            {
+                                translateX: delayFunction(delay, animation(values.windowWidth, config)),
+                            },
+                            { scale: delayFunction(delay, animation(0, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateX: 0 }, { scale: 1 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomOutRight();
+    }
+}
+export class ZoomOutUp extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            {
+                                translateY: delayFunction(delay, animation(-values.windowHeight, config)),
+                            },
+                            { scale: delayFunction(delay, animation(0, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateY: 0 }, { scale: 1 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomOutUp();
+    }
+}
+export class ZoomOutDown extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            {
+                                translateY: delayFunction(delay, animation(values.windowHeight, config)),
+                            },
+                            { scale: delayFunction(delay, animation(0, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateY: 0 }, { scale: 1 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomOutDown();
+    }
+}
+export class ZoomOutEasyUp extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            {
+                                translateY: delayFunction(delay, animation(-values.currentHeight, config)),
+                            },
+                            { scale: delayFunction(delay, animation(0, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateY: 0 }, { scale: 1 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomOutEasyUp();
+    }
+}
+export class ZoomOutEasyDown extends ComplexAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const [animation, config] = this.getAnimationAndConfig();
+            const delay = this.getDelay();
+            const callback = this.callbackV;
+            const initialValues = this.initialValues;
+            return (values) => {
+                'worklet';
+                return {
+                    animations: {
+                        transform: [
+                            {
+                                translateY: delayFunction(delay, animation(values.currentHeight, config)),
+                            },
+                            { scale: delayFunction(delay, animation(0, config)) },
+                        ],
+                    },
+                    initialValues: Object.assign({ transform: [{ translateY: 0 }, { scale: 1 }] }, initialValues),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new ZoomOutEasyDown();
+    }
+}

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

@@ -0,0 +1,10 @@
+export * from './Flip';
+export * from './Stretch';
+export * from './Fade';
+export * from './Slide';
+export * from './Zoom';
+export * from './Bounce';
+export * from './Lightspeed';
+export * from './Pinwheel';
+export * from './Rotate';
+export * from './Roll';

package/lib/reanimated2/layoutReanimation/defaultTransitions/CurvedTransition.js

@@ -0,0 +1,90 @@
+import { BaseAnimationBuilder } from '../animationBuilder';
+import { Easing } from '../../Easing';
+import { withTiming } from '../../animation';
+export class CurvedTransition extends BaseAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.easingXV = Easing.in(Easing.ease);
+        this.easingYV = Easing.out(Easing.ease);
+        this.easingWidthV = Easing.in(Easing.exp);
+        this.easingHeightV = Easing.out(Easing.exp);
+        this.build = () => {
+            var _a;
+            const delayFunction = this.getDelayFunction();
+            const callback = this.callbackV;
+            const delay = this.getDelay();
+            const duration = (_a = this.durationV) !== null && _a !== void 0 ? _a : 300;
+            const easing = {
+                easingX: this.easingXV,
+                easingY: this.easingYV,
+                easingWidth: this.easingWidthV,
+                easingHeight: this.easingHeightV,
+            };
+            return (values) => {
+                'worklet';
+                return {
+                    initialValues: {
+                        originX: values.currentOriginX,
+                        originY: values.currentOriginY,
+                        width: values.currentWidth,
+                        height: values.currentHeight,
+                    },
+                    animations: {
+                        originX: delayFunction(delay, withTiming(values.targetOriginX, {
+                            duration,
+                            easing: easing.easingX,
+                        })),
+                        originY: delayFunction(delay, withTiming(values.targetOriginY, {
+                            duration,
+                            easing: easing.easingY,
+                        })),
+                        width: delayFunction(delay, withTiming(values.targetWidth, {
+                            duration,
+                            easing: easing.easingWidth,
+                        })),
+                        height: delayFunction(delay, withTiming(values.targetHeight, {
+                            duration,
+                            easing: easing.easingHeight,
+                        })),
+                    },
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new CurvedTransition();
+    }
+    static easingX(easing) {
+        const instance = this.createInstance();
+        return instance.easingX(easing);
+    }
+    easingX(easing) {
+        this.easingXV = easing;
+        return this;
+    }
+    static easingY(easing) {
+        const instance = this.createInstance();
+        return instance.easingY(easing);
+    }
+    easingY(easing) {
+        this.easingYV = easing;
+        return this;
+    }
+    static easingWidth(easing) {
+        const instance = this.createInstance();
+        return instance.easingWidth(easing);
+    }
+    easingWidth(easing) {
+        this.easingWidthV = easing;
+        return this;
+    }
+    static easingHeight(easing) {
+        const instance = this.createInstance();
+        return instance.easingHeight(easing);
+    }
+    easingHeight(easing) {
+        this.easingHeightV = easing;
+        return this;
+    }
+}

package/lib/reanimated2/layoutReanimation/defaultTransitions/EntryExitTransition.js

@@ -0,0 +1,132 @@
+import { BaseAnimationBuilder } from '../animationBuilder';
+import { withSequence, withTiming } from '../../animation';
+import { FadeIn, FadeOut } from '../defaultAnimations/Fade';
+export class EntryExitTransition extends BaseAnimationBuilder {
+    constructor() {
+        super(...arguments);
+        this.enteringV = FadeIn;
+        this.exitingV = FadeOut;
+        this.build = () => {
+            const delayFunction = this.getDelayFunction();
+            const callback = this.callbackV;
+            const delay = this.getDelay();
+            const enteringAnimation = this.enteringV.build();
+            const exitingAnimation = this.exitingV.build();
+            const exitingDuration = this.exitingV.getDuration();
+            return (values) => {
+                'worklet';
+                var _a, _b, _c, _d;
+                const enteringValues = enteringAnimation(values);
+                const exitingValues = exitingAnimation(values);
+                const animations = {
+                    transform: [],
+                };
+                for (const prop of Object.keys(exitingValues.animations)) {
+                    if (prop === 'transform') {
+                        (_a = exitingValues.animations[prop]) === null || _a === void 0 ? void 0 : _a.forEach((value, index) => {
+                            var _a;
+                            for (const transformProp of Object.keys(value)) {
+                                (_a = animations.transform) === null || _a === void 0 ? void 0 : _a.push({
+                                    [transformProp]: delayFunction(delay, withSequence(value[transformProp], withTiming(exitingValues.initialValues.transform
+                                        ? exitingValues.initialValues.transform[index][transformProp]
+                                        : 0, { duration: 0 }))),
+                                });
+                            }
+                        });
+                    }
+                    else {
+                        const sequence = enteringValues.animations[prop] !== undefined
+                            ? [
+                                exitingValues.animations[prop],
+                                withTiming(enteringValues.initialValues[prop], {
+                                    duration: 0,
+                                }),
+                                enteringValues.animations[prop],
+                            ]
+                            : [
+                                exitingValues.animations[prop],
+                                withTiming(Object.keys(values).includes(prop)
+                                    ? values[prop]
+                                    : exitingValues.initialValues[prop], { duration: 0 }),
+                            ];
+                        animations[prop] = delayFunction(delay, withSequence(...sequence));
+                    }
+                }
+                for (const prop of Object.keys(enteringValues.animations)) {
+                    if (prop === 'transform') {
+                        (_b = enteringValues.animations[prop]) === null || _b === void 0 ? void 0 : _b.forEach((value, index) => {
+                            var _a;
+                            for (const transformProp of Object.keys(value)) {
+                                (_a = animations.transform) === null || _a === void 0 ? void 0 : _a.push({
+                                    [transformProp]: delayFunction(delay + exitingDuration, withSequence(withTiming(enteringValues.initialValues.transform
+                                        ? enteringValues.initialValues.transform[index][transformProp]
+                                        : 0, { duration: exitingDuration }), value[transformProp])),
+                                });
+                            }
+                        });
+                    }
+                    else if (animations[prop] !== undefined) {
+                        // it was already added in the previous loop
+                        continue;
+                    }
+                    else {
+                        animations[prop] = delayFunction(delay, withSequence(withTiming(enteringValues.initialValues[prop], { duration: 0 }), enteringValues.animations[prop]));
+                    }
+                }
+                const mergedTransform = ((_c = exitingValues.initialValues.transform) !== null && _c !== void 0 ? _c : []).concat(((_d = enteringValues.animations.transform) !== null && _d !== void 0 ? _d : []).map((value) => {
+                    const objectKeys = Object.keys(value);
+                    if ((objectKeys === null || objectKeys === void 0 ? void 0 : objectKeys.length) < 1) {
+                        console.error(`[Reanimated]: \${value} is not a valid Transform object`);
+                        return value;
+                    }
+                    const transformProp = objectKeys[0];
+                    const current = value[transformProp].current;
+                    if (typeof current === 'string') {
+                        if (current.includes('deg'))
+                            return {
+                                [transformProp]: '0deg',
+                            };
+                        else
+                            return {
+                                [transformProp]: '0',
+                            };
+                    }
+                    else if (transformProp.includes('translate')) {
+                        return { [transformProp]: 0 };
+                    }
+                    else {
+                        return { [transformProp]: 1 };
+                    }
+                    return value;
+                }));
+                return {
+                    initialValues: Object.assign(Object.assign({}, exitingValues.initialValues), { originX: values.currentOriginX, originY: values.currentOriginY, width: values.currentWidth, height: values.currentHeight, transform: mergedTransform }),
+                    animations: Object.assign({ originX: delayFunction(delay + exitingDuration, withTiming(values.targetOriginX, { duration: exitingDuration })), originY: delayFunction(delay + exitingDuration, withTiming(values.targetOriginY, { duration: exitingDuration })), width: delayFunction(delay + exitingDuration, withTiming(values.targetWidth, { duration: exitingDuration })), height: delayFunction(delay + exitingDuration, withTiming(values.targetHeight, { duration: exitingDuration })) }, animations),
+                    callback: callback,
+                };
+            };
+        };
+    }
+    static createInstance() {
+        return new EntryExitTransition();
+    }
+    static entering(animation) {
+        const instance = this.createInstance();
+        return instance.entering(animation);
+    }
+    entering(animation) {
+        this.enteringV = animation;
+        return this;
+    }
+    static exiting(animation) {
+        const instance = this.createInstance();
+        return instance.exiting(animation);
+    }
+    exiting(animation) {
+        this.exitingV = animation;
+        return this;
+    }
+}
+export function combineTransition(exiting, entering) {
+    return EntryExitTransition.entering(entering).exiting(exiting);
+}