react-native-reanimated 2.8.0 → 2.10.0

package/lib/reanimated2/frameCallback/FrameCallbackRegistryUI.js

@@ -0,0 +1,47 @@
+import { runOnUI } from '../core';
+export const prepareUIRegistry = runOnUI(() => {
+    'worklet';
+    const frameCallbackRegistry = {
+        frameCallbackRegistry: new Map(),
+        frameCallbackActive: new Set(),
+        isFrameCallbackRunning: false,
+        runCallbacks() {
+            const loop = () => {
+                this.frameCallbackActive.forEach((key) => {
+                    const callback = this.frameCallbackRegistry.get(key);
+                    callback();
+                });
+                if (this.frameCallbackActive.size > 0) {
+                    requestAnimationFrame(loop);
+                }
+                else {
+                    this.isFrameCallbackRunning = false;
+                }
+            };
+            if (!this.isFrameCallbackRunning) {
+                requestAnimationFrame(loop);
+                this.isFrameCallbackRunning = true;
+            }
+        },
+        registerFrameCallback(callback, callbackId) {
+            this.frameCallbackRegistry.set(callbackId, callback);
+        },
+        unregisterFrameCallback(frameCallbackId) {
+            this.manageStateFrameCallback(frameCallbackId, false);
+            this.frameCallbackRegistry.delete(frameCallbackId);
+        },
+        manageStateFrameCallback(frameCallbackId, state) {
+            if (frameCallbackId === -1) {
+                return;
+            }
+            if (state) {
+                this.frameCallbackActive.add(frameCallbackId);
+                this.runCallbacks();
+            }
+            else {
+                this.frameCallbackActive.delete(frameCallbackId);
+            }
+        },
+    };
+    global._frameCallbackRegistry = frameCallbackRegistry;
+});

package/lib/reanimated2/globals.d.ts

@@ -1,5 +1,6 @@
 import { AnimatedStyle, StyleProps } from './commonTypes';
 import { ReanimatedConsole } from './core';
+import FrameCallbackRegistryUI from './frameCallback/FrameCallbackRegistryUI';
 import { MeasuredDimensions } from './NativeMethods';
 import { NativeReanimated } from './NativeReanimated/NativeReanimated';
 declare global {
@@ -30,6 +31,7 @@ declare global {
   const ReanimatedDataMock: {
     now: () => number;
   };
+  const _frameCallbackRegistry: FrameCallbackRegistryUI;
   namespace NodeJS {
     interface Global {
       _setGlobalConsole: (console?: ReanimatedConsole) => void;
@@ -55,6 +57,7 @@ declare global {
       ReanimatedDataMock: {
         now: () => number;
       };
+      _frameCallbackRegistry: FrameCallbackRegistryUI;
     }
   }
 }

package/lib/reanimated2/hook/index.js

@@ -7,3 +7,5 @@ export { useAnimatedRef } from './useAnimatedRef';
 export { useAnimatedScrollHandler, } from './useAnimatedScrollHandler';
 export { useDerivedValue } from './useDerivedValue';
 export { useAnimatedSensor, SensorType } from './useAnimatedSensor';
+export { useFrameCallback } from './useFrameCallback';
+export { useAnimatedKeyboard } from './useAnimatedKeyboard';

package/lib/reanimated2/hook/useAnimatedKeyboard.js

@@ -0,0 +1,31 @@
+import { useEffect, useRef } from 'react';
+import NativeReanimated from '../NativeReanimated';
+import { makeMutable } from '../core';
+import { KeyboardState } from '../commonTypes';
+export function useAnimatedKeyboard() {
+    const ref = useRef(null);
+    const listenerId = useRef(-1);
+    const isSubscribed = useRef(false);
+    if (ref.current === null) {
+        const keyboardEventData = {
+            state: makeMutable(KeyboardState.UNKNOWN),
+            height: makeMutable(0),
+        };
+        listenerId.current =
+            NativeReanimated.subscribeForKeyboardEvents(keyboardEventData);
+        ref.current = keyboardEventData;
+        isSubscribed.current = true;
+    }
+    useEffect(() => {
+        if (isSubscribed.current === false && ref.current !== null) {
+            // subscribe again after Fast Refresh
+            listenerId.current = NativeReanimated.subscribeForKeyboardEvents(ref.current);
+            isSubscribed.current = true;
+        }
+        return () => {
+            NativeReanimated.unsubscribeFromKeyboardEvents(listenerId.current);
+            isSubscribed.current = false;
+        };
+    }, []);
+    return ref.current;
+}

package/lib/reanimated2/hook/useAnimatedSensor.js

@@ -21,7 +21,7 @@ export function useAnimatedSensor(sensorType, userConfig) {
         },
     });
     if (ref.current.sensor === null) {
-        ref.current.config = Object.assign({ interval: 10 }, userConfig);
+        ref.current.config = Object.assign({ interval: 'auto' }, userConfig);
         let sensorData;
         if (sensorType === SensorType.ROTATION) {
             sensorData = {
@@ -44,8 +44,8 @@ export function useAnimatedSensor(sensorType, userConfig) {
         ref.current.sensor = makeMutable(sensorData);
     }
     useEffect(() => {
-        ref.current.config = Object.assign({ interval: 10 }, userConfig);
-        const id = NativeReanimated.registerSensor(sensorType, ref.current.config.interval, ref.current.sensor);
+        ref.current.config = Object.assign({ interval: 'auto' }, userConfig);
+        const id = NativeReanimated.registerSensor(sensorType, ref.current.config.interval === 'auto' ? -1 : ref.current.config.interval, ref.current.sensor);
         if (id !== -1) {
             // if sensor is available
             ref.current.unregister = () => NativeReanimated.unregisterSensor(id);

package/lib/reanimated2/hook/useFrameCallback.js

@@ -0,0 +1,23 @@
+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/utils.js

@@ -12,11 +12,6 @@ export function useEvent(handler, eventNames = [], rebuild = false) {
     else if (rebuild) {
         initRef.current.updateWorklet(handler);
     }
-    useEffect(() => {
-        return () => {
-            initRef.current = null;
-        };
-    }, []);
     return initRef;
 }
 export function useHandler(handlers, dependencies) {

package/lib/reanimated2/jestUtils.js

@@ -127,9 +127,9 @@ const tickTravel = () => {
     currentTimestamp += frameTime;
     jest.advanceTimersByTime(frameTime);
 };
-export const withReanimatedTimer = (animatonTest) => {
+export const withReanimatedTimer = (animationTest) => {
     beforeTest();
-    animatonTest();
+    animationTest();
     afterTest();
 };
 export const advanceAnimationByTime = (time = frameTime) => {
@@ -145,7 +145,15 @@ export const advanceAnimationByFrame = (count) => {
     jest.advanceTimersByTime(frameTime);
 };
 export const setUpTests = (userConfig = {}) => {
-    const expect = require('expect');
+    let expect;
+    try {
+        expect = require('expect');
+    }
+    catch (_) {
+        // for Jest in version 28+
+        const { expect: expectModule } = require('@jest/globals');
+        expect = expectModule;
+    }
     require('setimmediate');
     frameTime = Math.round(1000 / config.fps);
     config = Object.assign(Object.assign({}, config), userConfig);

package/lib/reanimated2/js-reanimated/JSReanimated.js

@@ -96,4 +96,11 @@ export default class JSReanimated extends NativeReanimated {
             throw Error('This method can be only use in Jest testing.');
         }
     }
+    subscribeForKeyboardEvents(_) {
+        console.warn('[Reanimated] useAnimatedKeyboard is not available on web yet.');
+        return -1;
+    }
+    unsubscribeFromKeyboardEvents(_) {
+        // noop
+    }
 }

package/lib/reanimated2/js-reanimated/global.js

@@ -0,0 +1,36 @@
+// In order to keep bundle size down, we treat this file as a polyfill for Web.
+import { shouldBeUseWeb } from '../PlatformChecker';
+const initializeGlobalsForWeb = () => {
+    if (shouldBeUseWeb()) {
+        global._frameTimestamp = null;
+        global._setGlobalConsole = (_val) => {
+            // noop
+        };
+        global._measure = () => {
+            console.warn("[Reanimated] You can't use `measure` with Chrome Debugger or with web version");
+            return {
+                x: 0,
+                y: 0,
+                width: 0,
+                height: 0,
+                pageX: 0,
+                pageY: 0,
+            };
+        };
+        global._scrollTo = () => {
+            console.warn("[Reanimated] You can't use `scrollTo` with Chrome Debugger or with web version");
+        };
+        global._setGestureState = () => {
+            console.warn("[Reanimated] You can't use `setGestureState` with Chrome Debugger or with web version");
+        };
+    }
+    return true;
+};
+/*
+  If a file doesn't export anything, tree shaking doesn't pack
+  it into the JS bundle. In effect, the code inside of this file
+  will never execute. That is why we wrapped initialization code
+  into a function, and we call this one during creating
+  the module export object.
+*/
+export default initializeGlobalsForWeb();

package/lib/reanimated2/js-reanimated/index.js

@@ -1,29 +1,5 @@
 import JSReanimated from './JSReanimated';
-import { shouldBeUseWeb } from '../PlatformChecker';
 const reanimatedJS = new JSReanimated();
-if (shouldBeUseWeb()) {
-    global._frameTimestamp = null;
-    global._setGlobalConsole = (_val) => {
-        // noop
-    };
-    global._measure = () => {
-        console.warn("[Reanimated] You can't use `measure` with Chrome Debugger or with web version");
-        return {
-            x: 0,
-            y: 0,
-            width: 0,
-            height: 0,
-            pageX: 0,
-            pageY: 0,
-        };
-    };
-    global._scrollTo = () => {
-        console.warn("[Reanimated] You can't use `scrollTo` with Chrome Debugger or with web version");
-    };
-    global._setGestureState = () => {
-        console.warn("[Reanimated] You can't use `setGestureState` with Chrome Debugger or with web version");
-    };
-}
 export const _updatePropsJS = (updates, viewRef) => {
     if (viewRef._component) {
         const component = viewRef._component;

package/lib/reanimated2/layoutReanimation/LayoutAnimationRepository.js

@@ -5,7 +5,7 @@ import { ColorProperties } from '../UpdateProps';
 import { processColor } from '../Colors';
 runOnUI(() => {
     'worklet';
-    const configs = {};
+    const configs = Object.create(null);
     const enteringAnimationForTag = {};
     global.LayoutAnimationRepository = {
         configs,

package/lib/reanimated2/mock.js

@@ -64,6 +64,12 @@ const ReanimatedV2 = {
         out: ID,
         inOut: ID,
     },
+    Extrapolation: {
+        EXTEND: 'extend',
+        CLAMP: 'clamp',
+        IDENTITY: 'identity',
+    },
     runOnJS: (fn) => fn,
+    runOnUI: (fn) => fn,
 };
 module.exports = Object.assign({}, ReanimatedV2);

package/lib/types/Animated.d.ts

@@ -0,0 +1,8 @@
+export { default as createAnimatedComponent } from './createAnimatedComponent';
+export { addWhitelistedNativeProps, addWhitelistedUIProps, } from './ConfigHelper';
+export { default as Text } from './reanimated2/component/Text';
+export { default as View } from './reanimated2/component/View';
+export { default as ScrollView } from './reanimated2/component/ScrollView';
+export { default as Image } from './reanimated2/component/Image';
+export { default as FlatList } from './reanimated2/component/FlatList';
+export * from './reanimated1';

package/lib/types/index.d.ts

@@ -0,0 +1,4 @@
+import * as Animated from './Animated';
+export * from './reanimated1';
+export * from './reanimated2';
+export default Animated;

package/lib/types/index.web.d.ts

@@ -0,0 +1,3 @@
+import './reanimated2/js-reanimated/global';
+export * from './reanimated2';
+export * as default from './Animated';

package/lib/types/{lib/reanimated2 → reanimated2}/NativeReanimated/NativeReanimated.d.ts

@@ -1,4 +1,4 @@
-import { SharedValue, SensorValue3D, SensorValueRotation } from '../commonTypes';
+import { SharedValue, SensorValue3D, SensorValueRotation, AnimatedKeyboardInfo } from '../commonTypes';
 import { Descriptor } from '../hook/commonTypes';
 export declare class NativeReanimated {
     native: boolean;
@@ -17,4 +17,6 @@ export declare class NativeReanimated {
     getViewProp<T>(viewTag: string, propName: string, callback?: (result: T) => void): Promise<T>;
     enableLayoutAnimations(flag: boolean): void;
     configureProps(uiProps: string[], nativeProps: string[]): void;
+    subscribeForKeyboardEvents(keyboardEventData: AnimatedKeyboardInfo): number;
+    unsubscribeFromKeyboardEvents(listenerId: number): void;
 }

package/lib/types/{lib/reanimated2 → reanimated2}/commonTypes.d.ts

@@ -77,3 +77,15 @@ export declare type ValueRotation = {
     roll: number;
 };
 export declare type SensorValueRotation = SharedValue<ValueRotation>;
+export declare type ShadowNodeWrapper = object;
+export declare enum KeyboardState {
+    UNKNOWN = 0,
+    OPENING = 1,
+    OPEN = 2,
+    CLOSING = 3,
+    CLOSED = 4
+}
+export declare type AnimatedKeyboardInfo = {
+    height: SharedValue<number>;
+    state: SharedValue<KeyboardState>;
+};

package/lib/types/{lib/reanimated2 → reanimated2}/component/FlatList.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
 import { FlatListProps } from 'react-native';
 import { ILayoutAnimationBuilder } from '../layoutReanimation/animationBuilder/commonTypes';
-export interface ReanimatedFlatlistProps<ItemT> extends FlatListProps<ItemT> {
+export interface ReanimatedFlatListProps<ItemT> extends FlatListProps<ItemT> {
     itemLayoutAnimation?: ILayoutAnimationBuilder;
 }
-declare type ReanimatedFlatListFC<T = any> = React.FC<ReanimatedFlatlistProps<T>>;
+declare type ReanimatedFlatListFC<T = any> = React.FC<ReanimatedFlatListProps<T>>;
 declare const ReanimatedFlatlist: ReanimatedFlatListFC;
 export default ReanimatedFlatlist;

package/lib/types/reanimated2/component/Image.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const AnimatedImage: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
+export default AnimatedImage;

package/lib/types/reanimated2/component/ScrollView.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const AnimatedScrollView: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
+export default AnimatedScrollView;

package/lib/types/reanimated2/component/Text.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const AnimatedText: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
+export default AnimatedText;

package/lib/types/reanimated2/component/View.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const AnimatedView: import("react").ComponentType<import("../../createAnimatedComponent").AnimatedComponentProps<import("../../createAnimatedComponent").InitialComponentProps>>;
+export default AnimatedView;

package/lib/types/reanimated2/frameCallback/FrameCallbackRegistryJS.d.ts

@@ -0,0 +1,7 @@
+export default class FrameCallbackRegistryJS {
+    private nextCallbackId;
+    constructor();
+    registerFrameCallback(callback: () => void): number;
+    unregisterFrameCallback(frameCallbackId: number): void;
+    manageStateFrameCallback(frameCallbackId: number, state: boolean): void;
+}

package/lib/types/reanimated2/frameCallback/FrameCallbackRegistryUI.d.ts

@@ -0,0 +1,10 @@
+export default interface FrameCallbackRegistryUI {
+    frameCallbackRegistry: Map<number, () => void>;
+    frameCallbackActive: Set<number>;
+    isFrameCallbackRunning: boolean;
+    runCallbacks: () => void;
+    registerFrameCallback: (callback: () => void, callbackId: number) => void;
+    unregisterFrameCallback: (frameCallbackId: number) => void;
+    manageStateFrameCallback: (frameCallbackId: number, state: boolean) => void;
+}
+export declare const prepareUIRegistry: () => void;

package/lib/types/{lib/reanimated2 → reanimated2}/hook/index.d.ts

@@ -8,3 +8,6 @@ export { useAnimatedRef } from './useAnimatedRef';
 export { useAnimatedScrollHandler, ScrollHandler, ScrollHandlers, } from './useAnimatedScrollHandler';
 export { useDerivedValue, DerivedValue } from './useDerivedValue';
 export { useAnimatedSensor, SensorType } from './useAnimatedSensor';
+export { useFrameCallback } from './useFrameCallback';
+export type { FrameCallback } from './useFrameCallback';
+export { useAnimatedKeyboard } from './useAnimatedKeyboard';

package/lib/types/reanimated2/hook/useAnimatedKeyboard.d.ts

@@ -0,0 +1,2 @@
+import { AnimatedKeyboardInfo } from '../commonTypes';
+export declare function useAnimatedKeyboard(): AnimatedKeyboardInfo;

package/lib/types/{lib/reanimated2 → reanimated2}/hook/useAnimatedSensor.d.ts

@@ -7,7 +7,7 @@ export declare enum SensorType {
     ROTATION = 5
 }
 export declare type SensorConfig = {
-    interval: number;
+    interval: number | 'auto';
 };
 export declare type AnimatedSensor = {
     sensor: SensorValue3D | SensorValueRotation | null;

package/lib/types/reanimated2/hook/useFrameCallback.d.ts

@@ -0,0 +1,6 @@
+export declare type FrameCallback = {
+    setActive: (isActive: boolean) => void;
+    isActive: boolean;
+    callbackId: number;
+};
+export declare function useFrameCallback(callback: () => void, autostart?: boolean): FrameCallback;

package/lib/types/{lib/reanimated2 → reanimated2}/jestUtils.d.ts

@@ -5,7 +5,7 @@ declare global {
         }
     }
 }
-export declare const withReanimatedTimer: (animatonTest: any) => void;
+export declare const withReanimatedTimer: (animationTest: any) => void;
 export declare const advanceAnimationByTime: (time?: number) => void;
 export declare const advanceAnimationByFrame: (count: any) => void;
 export declare const setUpTests: (userConfig?: {}) => void;

package/lib/types/{lib/reanimated2 → reanimated2}/js-reanimated/JSReanimated.d.ts

@@ -1,7 +1,7 @@
 import MapperRegistry from './MapperRegistry';
 import MutableValue from './MutableValue';
 import { NativeReanimated } from '../NativeReanimated/NativeReanimated';
-import { Timestamp, NestedObjectValues } from '../commonTypes';
+import { Timestamp, NestedObjectValues, AnimatedKeyboardInfo } from '../commonTypes';
 export default class JSReanimated extends NativeReanimated {
     _valueSetter?: <T>(value: T) => void;
     _renderRequested: boolean;
@@ -27,4 +27,6 @@ export default class JSReanimated extends NativeReanimated {
     registerSensor(): number;
     unregisterSensor(): void;
     jestResetModule(): void;
+    subscribeForKeyboardEvents(_: AnimatedKeyboardInfo): number;
+    unsubscribeFromKeyboardEvents(_: number): void;
 }

package/lib/types/reanimated2/js-reanimated/global.d.ts

@@ -0,0 +1,2 @@
+declare const _default: boolean;
+export default _default;