react-native-reanimated 2.15.0 → 2.16.0

package/lib/reanimated2/hook/useAnimatedStyle.js

@@ -1,402 +0,0 @@
-/* global _frameTimestamp */
-import { useEffect, useRef } from 'react';
-import { startMapper, stopMapper, makeRemote, requestFrame, getTimestamp, makeMutable, } from '../core';
-import updateProps, { updatePropsJestWrapper } from '../UpdateProps';
-import { initialUpdaterRun } from '../animation';
-import NativeReanimatedModule from '../NativeReanimated';
-import { useSharedValue } from './useSharedValue';
-import { buildWorkletsHash, canApplyOptimalisation, getStyleWithoutAnimations, hasColorProps, isAnimated, parseColors, styleDiff, validateAnimatedStyles, } from './utils';
-import { makeViewDescriptorsSet, makeViewsRefSet, } from '../ViewDescriptorsSet';
-import { isJest, shouldBeUseWeb } from '../PlatformChecker';
-function prepareAnimation(animatedProp, lastAnimation, lastValue) {
-    'worklet';
-    if (Array.isArray(animatedProp)) {
-        animatedProp.forEach((prop, index) => prepareAnimation(prop, lastAnimation && lastAnimation[index], lastValue && lastValue[index]));
-        // return animatedProp;
-    }
-    if (typeof animatedProp === 'object' && animatedProp.onFrame) {
-        const animation = animatedProp;
-        let value = animation.current;
-        if (lastValue !== undefined) {
-            if (typeof lastValue === 'object') {
-                if (lastValue.value !== undefined) {
-                    // previously it was a shared value
-                    value = lastValue.value;
-                }
-                else if (lastValue.onFrame !== undefined) {
-                    if ((lastAnimation === null || lastAnimation === void 0 ? void 0 : lastAnimation.current) !== undefined) {
-                        // it was an animation before, copy its state
-                        value = lastAnimation.current;
-                    }
-                    else if ((lastValue === null || lastValue === void 0 ? void 0 : lastValue.current) !== undefined) {
-                        // it was initialized
-                        value = lastValue.current;
-                    }
-                }
-            }
-            else {
-                // previously it was a plain value, just set it as starting point
-                value = lastValue;
-            }
-        }
-        animation.callStart = (timestamp) => {
-            animation.onStart(animation, value, timestamp, lastAnimation);
-        };
-        animation.callStart(getTimestamp());
-        animation.callStart = null;
-    }
-    else if (typeof animatedProp === 'object') {
-        // it is an object
-        Object.keys(animatedProp).forEach((key) => prepareAnimation(animatedProp[key], lastAnimation && lastAnimation[key], lastValue && lastValue[key]));
-    }
-}
-function runAnimations(animation, timestamp, key, result, animationsActive) {
-    'worklet';
-    if (!animationsActive.value) {
-        return true;
-    }
-    if (Array.isArray(animation)) {
-        result[key] = [];
-        let allFinished = true;
-        animation.forEach((entry, index) => {
-            if (!runAnimations(entry, timestamp, index, result[key], animationsActive)) {
-                allFinished = false;
-            }
-        });
-        return allFinished;
-    }
-    else if (typeof animation === 'object' && animation.onFrame) {
-        let finished = true;
-        if (!animation.finished) {
-            if (animation.callStart) {
-                animation.callStart(timestamp);
-                animation.callStart = null;
-            }
-            finished = animation.onFrame(animation, timestamp);
-            animation.timestamp = timestamp;
-            if (finished) {
-                animation.finished = true;
-                animation.callback && animation.callback(true /* finished */);
-            }
-        }
-        result[key] = animation.current;
-        return finished;
-    }
-    else if (typeof animation === 'object') {
-        result[key] = {};
-        let allFinished = true;
-        Object.keys(animation).forEach((k) => {
-            if (!runAnimations(animation[k], timestamp, k, result[key], animationsActive)) {
-                allFinished = false;
-            }
-        });
-        return allFinished;
-    }
-    else {
-        result[key] = animation;
-        return true;
-    }
-}
-function styleUpdater(viewDescriptors, updater, state, maybeViewRef, animationsActive) {
-    'worklet';
-    var _a, _b;
-    const animations = (_a = state.animations) !== null && _a !== void 0 ? _a : {};
-    const newValues = (_b = updater()) !== null && _b !== void 0 ? _b : {};
-    const oldValues = state.last;
-    let hasAnimations = false;
-    for (const key in newValues) {
-        const value = newValues[key];
-        if (isAnimated(value)) {
-            prepareAnimation(value, animations[key], oldValues[key]);
-            animations[key] = value;
-            hasAnimations = true;
-        }
-        else {
-            delete animations[key];
-        }
-    }
-    if (hasAnimations) {
-        const frame = (timestamp) => {
-            const { animations, last, isAnimationCancelled } = state;
-            if (isAnimationCancelled) {
-                state.isAnimationRunning = false;
-                return;
-            }
-            const updates = {};
-            let allFinished = true;
-            for (const propName in animations) {
-                const finished = runAnimations(animations[propName], timestamp, propName, updates, animationsActive);
-                if (finished) {
-                    last[propName] = updates[propName];
-                    delete animations[propName];
-                }
-                else {
-                    allFinished = false;
-                }
-            }
-            if (updates) {
-                updateProps(viewDescriptors, updates, maybeViewRef);
-            }
-            if (!allFinished) {
-                requestFrame(frame);
-            }
-            else {
-                state.isAnimationRunning = false;
-            }
-        };
-        state.animations = animations;
-        if (!state.isAnimationRunning) {
-            state.isAnimationCancelled = false;
-            state.isAnimationRunning = true;
-            if (_frameTimestamp) {
-                frame(_frameTimestamp);
-            }
-            else {
-                requestFrame(frame);
-            }
-        }
-        state.last = Object.assign({}, oldValues, newValues);
-        const style = getStyleWithoutAnimations(state.last);
-        if (style) {
-            updateProps(viewDescriptors, style, maybeViewRef);
-        }
-    }
-    else {
-        state.isAnimationCancelled = true;
-        state.animations = [];
-        const diff = styleDiff(oldValues, newValues);
-        state.last = Object.assign({}, oldValues, newValues);
-        if (diff) {
-            updateProps(viewDescriptors, newValues, maybeViewRef);
-        }
-    }
-}
-function jestStyleUpdater(viewDescriptors, updater, state, maybeViewRef, animationsActive, animatedStyle, adapters = []) {
-    'worklet';
-    var _a, _b;
-    const animations = (_a = state.animations) !== null && _a !== void 0 ? _a : {};
-    const newValues = (_b = updater()) !== null && _b !== void 0 ? _b : {};
-    const oldValues = state.last;
-    // extract animated props
-    let hasAnimations = false;
-    Object.keys(animations).forEach((key) => {
-        const value = newValues[key];
-        if (!isAnimated(value)) {
-            delete animations[key];
-        }
-    });
-    Object.keys(newValues).forEach((key) => {
-        const value = newValues[key];
-        if (isAnimated(value)) {
-            prepareAnimation(value, animations[key], oldValues[key]);
-            animations[key] = value;
-            hasAnimations = true;
-        }
-    });
-    function frame(timestamp) {
-        const { animations, last, isAnimationCancelled } = state;
-        if (isAnimationCancelled) {
-            state.isAnimationRunning = false;
-            return;
-        }
-        const updates = {};
-        let allFinished = true;
-        Object.keys(animations).forEach((propName) => {
-            const finished = runAnimations(animations[propName], timestamp, propName, updates, animationsActive);
-            if (finished) {
-                last[propName] = updates[propName];
-                delete animations[propName];
-            }
-            else {
-                allFinished = false;
-            }
-        });
-        if (Object.keys(updates).length) {
-            updatePropsJestWrapper(viewDescriptors, updates, maybeViewRef, animatedStyle, adapters);
-        }
-        if (!allFinished) {
-            requestFrame(frame);
-        }
-        else {
-            state.isAnimationRunning = false;
-        }
-    }
-    if (hasAnimations) {
-        state.animations = animations;
-        if (!state.isAnimationRunning) {
-            state.isAnimationCancelled = false;
-            state.isAnimationRunning = true;
-            if (_frameTimestamp) {
-                frame(_frameTimestamp);
-            }
-            else {
-                requestFrame(frame);
-            }
-        }
-    }
-    else {
-        state.isAnimationCancelled = true;
-        state.animations = [];
-    }
-    // calculate diff
-    const diff = styleDiff(oldValues, newValues);
-    state.last = Object.assign({}, oldValues, newValues);
-    if (Object.keys(diff).length !== 0) {
-        updatePropsJestWrapper(viewDescriptors, diff, maybeViewRef, animatedStyle, adapters);
-    }
-}
-// check for invalid usage of shared values in returned object
-function checkSharedValueUsage(prop, currentKey) {
-    if (Array.isArray(prop)) {
-        // if it's an array (i.ex. transform) validate all its elements
-        for (const element of prop) {
-            checkSharedValueUsage(element, currentKey);
-        }
-    }
-    else if (typeof prop === 'object' && prop.value === undefined) {
-        // if it's a nested object, run validation for all its props
-        for (const key of Object.keys(prop)) {
-            checkSharedValueUsage(prop[key], key);
-        }
-    }
-    else if (currentKey !== undefined &&
-        typeof prop === 'object' &&
-        prop.value !== undefined) {
-        // if shared value is passed insted of its value, throw an error
-        throw new Error(`invalid value passed to \`${currentKey}\`, maybe you forgot to use \`.value\`?`);
-    }
-}
-export function useAnimatedStyle(updater, dependencies, adapters) {
-    var _a, _b;
-    const viewsRef = makeViewsRefSet();
-    const viewDescriptors = makeViewDescriptorsSet();
-    const initRef = useRef();
-    let inputs = Object.values((_a = updater._closure) !== null && _a !== void 0 ? _a : {});
-    if (shouldBeUseWeb()) {
-        if (!inputs.length && (dependencies === null || dependencies === void 0 ? void 0 : dependencies.length)) {
-            // let web work without a Babel/SWC plugin
-            inputs = dependencies;
-        }
-        if (__DEV__ && !inputs.length && !dependencies && !updater.__workletHash) {
-            console.error(`useAnimatedStyle was used without a dependency array or Babel plugin. Please explicitly pass a dependency array, or enable the Babel/SWC plugin. For more, see the docs: https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/web-support#web-without-a-babel-plugin`);
-        }
-    }
-    const adaptersArray = adapters
-        ? Array.isArray(adapters)
-            ? adapters
-            : [adapters]
-        : [];
-    const adaptersHash = adapters ? buildWorkletsHash(adaptersArray) : null;
-    const animationsActive = useSharedValue(true);
-    const animatedStyle = useRef({});
-    // build dependencies
-    if (!dependencies) {
-        dependencies = [...inputs, updater.__workletHash];
-    }
-    else {
-        dependencies.push(updater.__workletHash);
-    }
-    adaptersHash && dependencies.push(adaptersHash);
-    if (!initRef.current) {
-        const initialStyle = initialUpdaterRun(updater);
-        validateAnimatedStyles(initialStyle);
-        initRef.current = {
-            initial: {
-                value: initialStyle,
-                updater: updater,
-            },
-            remoteState: makeRemote({ last: initialStyle }),
-            sharableViewDescriptors: makeMutable([]),
-        };
-        viewDescriptors.rebuildsharableViewDescriptors(
-        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-        initRef.current.sharableViewDescriptors);
-    }
-    dependencies.push((_b = initRef.current) === null || _b === void 0 ? void 0 : _b.sharableViewDescriptors.value);
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    const { initial, remoteState, sharableViewDescriptors } = initRef.current;
-    const maybeViewRef = NativeReanimatedModule.native ? undefined : viewsRef;
-    useEffect(() => {
-        let fun;
-        let updaterFn = updater;
-        let optimalization = updater.__optimalization;
-        if (adapters) {
-            updaterFn = () => {
-                'worklet';
-                const newValues = updater();
-                adaptersArray.forEach((adapter) => {
-                    adapter(newValues);
-                });
-                return newValues;
-            };
-        }
-        if (canApplyOptimalisation(updaterFn) && !shouldBeUseWeb()) {
-            if (hasColorProps(updaterFn())) {
-                updaterFn = () => {
-                    'worklet';
-                    const newValues = updaterFn();
-                    const oldValues = remoteState.last;
-                    const diff = styleDiff(oldValues, newValues);
-                    remoteState.last = Object.assign({}, oldValues, newValues);
-                    parseColors(diff);
-                    return diff;
-                };
-            }
-            else {
-                updaterFn = () => {
-                    'worklet';
-                    const newValues = updaterFn();
-                    const oldValues = remoteState.last;
-                    const diff = styleDiff(oldValues, newValues);
-                    remoteState.last = Object.assign({}, oldValues, newValues);
-                    return diff;
-                };
-            }
-        }
-        else if (!shouldBeUseWeb()) {
-            optimalization = 0;
-            updaterFn = () => {
-                'worklet';
-                const style = updaterFn();
-                parseColors(style);
-                return style;
-            };
-        }
-        if (typeof updater.__optimalization !== undefined) {
-            updaterFn.__optimalization = optimalization;
-        }
-        if (isJest()) {
-            fun = () => {
-                'worklet';
-                jestStyleUpdater(sharableViewDescriptors, updater, remoteState, maybeViewRef, animationsActive, animatedStyle, adaptersArray);
-            };
-        }
-        else {
-            fun = () => {
-                'worklet';
-                styleUpdater(sharableViewDescriptors, updaterFn, remoteState, maybeViewRef, animationsActive);
-            };
-        }
-        const mapperId = startMapper(fun, inputs, [], updaterFn, 
-        // TODO fix this
-        sharableViewDescriptors);
-        return () => {
-            stopMapper(mapperId);
-        };
-    }, dependencies);
-    useEffect(() => {
-        animationsActive.value = true;
-        return () => {
-            // initRef.current = null;
-            // viewsRef = null;
-            animationsActive.value = false;
-        };
-    }, []);
-    checkSharedValueUsage(initial.value);
-    if (process.env.JEST_WORKER_ID) {
-        return { viewDescriptors, initial: initial, viewsRef, animatedStyle };
-    }
-    else {
-        return { viewDescriptors, initial: initial, viewsRef };
-    }
-}

package/lib/reanimated2/hook/useDerivedValue.js

@@ -1,43 +0,0 @@
-import { useEffect, useRef } from 'react';
-import { initialUpdaterRun } from '../animation';
-import { makeMutable, startMapper, stopMapper } from '../core';
-import { shouldBeUseWeb } from '../PlatformChecker';
-export function useDerivedValue(processor, dependencies) {
-    var _a;
-    const initRef = useRef(null);
-    let inputs = Object.values((_a = processor._closure) !== null && _a !== void 0 ? _a : {});
-    if (shouldBeUseWeb()) {
-        if (!inputs.length && (dependencies === null || dependencies === void 0 ? void 0 : dependencies.length)) {
-            // let web work without a Babel/SWC plugin
-            inputs = dependencies;
-        }
-    }
-    // build dependencies
-    if (dependencies === undefined) {
-        dependencies = [...inputs, processor.__workletHash];
-    }
-    else {
-        dependencies.push(processor.__workletHash);
-    }
-    if (initRef.current === null) {
-        initRef.current = makeMutable(initialUpdaterRun(processor));
-    }
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    const sharedValue = initRef.current;
-    useEffect(() => {
-        const fun = () => {
-            'worklet';
-            sharedValue.value = processor();
-        };
-        const mapperId = startMapper(fun, inputs, [sharedValue]);
-        return () => {
-            stopMapper(mapperId);
-        };
-    }, dependencies);
-    useEffect(() => {
-        return () => {
-            initRef.current = null;
-        };
-    }, []);
-    return sharedValue;
-}

package/lib/reanimated2/hook/useFrameCallback.js

@@ -1,23 +0,0 @@
-import { useEffect, useRef } from 'react';
-import FrameCallbackRegistryJS from '../frameCallback/FrameCallbackRegistryJS';
-const frameCallbackRegistry = new FrameCallbackRegistryJS();
-export function useFrameCallback(callback, autostart = true) {
-    const ref = useRef({
-        setActive: (isActive) => {
-            frameCallbackRegistry.manageStateFrameCallback(ref.current.callbackId, isActive);
-            ref.current.isActive = isActive;
-        },
-        isActive: autostart,
-        callbackId: -1,
-    });
-    useEffect(() => {
-        ref.current.callbackId =
-            frameCallbackRegistry.registerFrameCallback(callback);
-        ref.current.setActive(ref.current.isActive);
-        return () => {
-            frameCallbackRegistry.unregisterFrameCallback(ref.current.callbackId);
-            ref.current.callbackId = -1;
-        };
-    }, [callback, autostart]);
-    return ref.current;
-}

package/lib/reanimated2/hook/useScrollViewOffset.js

@@ -1,27 +0,0 @@
-import { useEffect, useRef } from 'react';
-import { findNodeHandle } from 'react-native';
-import { useEvent } from './utils';
-import { useSharedValue } from './useSharedValue';
-const subscribeForEvents = [
-    'onScroll',
-    'onScrollBeginDrag',
-    'onScrollEndDrag',
-    'onMomentumScrollBegin',
-    'onMomentumScrollEnd',
-];
-export function useScrollViewOffset(aref) {
-    const offsetRef = useRef(useSharedValue(0));
-    const event = useEvent((event) => {
-        'worklet';
-        offsetRef.current.value =
-            event.contentOffset.x === 0
-                ? event.contentOffset.y
-                : event.contentOffset.x;
-    }, subscribeForEvents);
-    useEffect(() => {
-        var _a;
-        const viewTag = findNodeHandle(aref.current);
-        (_a = event.current) === null || _a === void 0 ? void 0 : _a.registerForEvents(viewTag);
-    }, [aref.current]);
-    return offsetRef.current;
-}

package/lib/reanimated2/hook/useSharedValue.js

@@ -1,17 +0,0 @@
-import { useEffect, useRef } from 'react';
-import { cancelAnimation } from '../animation';
-import { makeMutable } from '../core';
-export function useSharedValue(init) {
-    const ref = useRef(makeMutable(init));
-    if (ref.current === null) {
-        ref.current = makeMutable(init);
-    }
-    useEffect(() => {
-        return () => {
-            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-            cancelAnimation(ref.current);
-        };
-    }, []);
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    return ref.current;
-}

package/lib/reanimated2/hook/utils.js

@@ -1,165 +0,0 @@
-import { useEffect, useRef } from 'react';
-import { processColor } from '../Colors';
-import { makeRemote } from '../core';
-import { isWeb, isJest } from '../PlatformChecker';
-import { colorProps } from '../UpdateProps';
-import WorkletEventHandler from '../WorkletEventHandler';
-export function useEvent(handler, eventNames = [], rebuild = false) {
-    const initRef = useRef(null);
-    if (initRef.current === null) {
-        initRef.current = new WorkletEventHandler(handler, eventNames);
-    }
-    else if (rebuild) {
-        initRef.current.updateWorklet(handler);
-    }
-    return initRef;
-}
-export function useHandler(handlers, dependencies) {
-    const initRef = useRef(null);
-    if (initRef.current === null) {
-        initRef.current = {
-            context: makeRemote({}),
-            savedDependencies: [],
-        };
-    }
-    useEffect(() => {
-        return () => {
-            initRef.current = null;
-        };
-    }, []);
-    const { context, savedDependencies } = initRef.current;
-    dependencies = buildDependencies(dependencies, handlers);
-    const doDependenciesDiffer = !areDependenciesEqual(dependencies, savedDependencies);
-    initRef.current.savedDependencies = dependencies;
-    const useWeb = isWeb() || isJest();
-    return { context, doDependenciesDiffer, useWeb };
-}
-// builds one big hash from multiple worklets' hashes
-export function buildWorkletsHash(handlers) {
-    return Object.values(handlers).reduce((acc, worklet) => 
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    acc + worklet.__workletHash.toString(), '');
-}
-// builds dependencies array for gesture handlers
-export function buildDependencies(dependencies, handlers) {
-    const handlersList = Object.values(handlers).filter((handler) => handler !== undefined);
-    if (!dependencies) {
-        dependencies = handlersList.map((handler) => {
-            return {
-                workletHash: handler.__workletHash,
-                closure: handler._closure,
-            };
-        });
-    }
-    else {
-        dependencies.push(buildWorkletsHash(handlersList));
-    }
-    return dependencies;
-}
-// this is supposed to work as useEffect comparison
-export function areDependenciesEqual(nextDeps, prevDeps) {
-    function is(x, y) {
-        /* eslint-disable no-self-compare */
-        return (x === y && (x !== 0 || 1 / x === 1 / y)) || (x !== x && y !== y);
-        /* eslint-enable no-self-compare */
-    }
-    const objectIs = typeof Object.is === 'function' ? Object.is : is;
-    function areHookInputsEqual(nextDeps, prevDeps) {
-        if (!nextDeps || !prevDeps || prevDeps.length !== nextDeps.length) {
-            return false;
-        }
-        for (let i = 0; i < prevDeps.length; ++i) {
-            if (!objectIs(nextDeps[i], prevDeps[i])) {
-                return false;
-            }
-        }
-        return true;
-    }
-    return areHookInputsEqual(nextDeps, prevDeps);
-}
-export function hasColorProps(updates) {
-    const colorPropsSet = new Set(colorProps);
-    for (const key in updates) {
-        if (colorPropsSet.has(key)) {
-            return true;
-        }
-    }
-    return false;
-}
-export function parseColors(updates) {
-    'worklet';
-    for (const key in updates) {
-        if (colorProps.indexOf(key) !== -1) {
-            // value could be an animation in which case processColor will recognize it and will return undefined
-            // -> in such a case we don't want to override style of that key
-            const processedColor = processColor(updates[key]);
-            if (processedColor !== undefined) {
-                updates[key] = processedColor;
-            }
-        }
-    }
-}
-export function canApplyOptimalisation(upadterFn) {
-    const FUNCTIONLESS_FLAG = 0b00000001;
-    const STATEMENTLESS_FLAG = 0b00000010;
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    const optimalization = upadterFn.__optimalization;
-    return (optimalization & FUNCTIONLESS_FLAG && optimalization & STATEMENTLESS_FLAG);
-}
-export function isAnimated(prop) {
-    'worklet';
-    if (Array.isArray(prop)) {
-        return prop.some(isAnimated);
-    }
-    else if (typeof prop === 'object') {
-        if (prop.onFrame !== undefined) {
-            return true;
-        }
-        else {
-            return Object.values(prop).some(isAnimated);
-        }
-    }
-    return false;
-}
-export function styleDiff(oldStyle, newStyle) {
-    'worklet';
-    const diff = {};
-    for (const key in oldStyle) {
-        if (newStyle[key] === undefined) {
-            diff[key] = null;
-        }
-    }
-    for (const key in newStyle) {
-        const value = newStyle[key];
-        const oldValue = oldStyle[key];
-        if (isAnimated(value)) {
-            // do nothing
-            continue;
-        }
-        if (oldValue !== value) {
-            diff[key] = value;
-        }
-    }
-    return diff;
-}
-export function getStyleWithoutAnimations(newStyle) {
-    'worklet';
-    const diff = {};
-    for (const key in newStyle) {
-        const value = newStyle[key];
-        if (isAnimated(value)) {
-            continue;
-        }
-        diff[key] = value;
-    }
-    return diff;
-}
-export const validateAnimatedStyles = (styles) => {
-    'worklet';
-    if (typeof styles !== 'object') {
-        throw new Error(`useAnimatedStyle has to return an object, found ${typeof styles} instead`);
-    }
-    else if (Array.isArray(styles)) {
-        throw new Error('useAnimatedStyle has to return an object and cannot return static styles combined with dynamic ones. Please do merging where a component receives props.');
-    }
-};

package/lib/reanimated2/index.js

@@ -1,12 +0,0 @@
-export * from './core';
-export * from './hook';
-export * from './animation';
-export * from './interpolation';
-export * from './interpolateColor';
-export * from './Easing';
-export * from './NativeMethods';
-export * from './Colors';
-export * from './PropAdapters';
-export * from './layoutReanimation';
-export * from './utils';
-export * from './commonTypes';