// Project: https://github.com/software-mansion/react-native-reanimated // TypeScript Version: 2.8 declare module 'react-native-reanimated' { import { ComponentClass, ReactNode, Component, RefObject, ComponentType, ComponentProps, FunctionComponent, } from 'react'; import { ViewProps, TextProps, ImageProps, ScrollViewProps, StyleProp, RegisteredStyle, ViewStyle, TextStyle, ImageStyle, TransformsStyle, View as ReactNativeView, Text as ReactNativeText, Image as ReactNativeImage, ScrollView as ReactNativeScrollView, NativeScrollEvent, NativeSyntheticEvent, ColorValue, OpaqueColorValue, } from 'react-native'; import { GestureHandlerGestureEvent, PanGestureHandlerGestureEvent, } from 'react-native-gesture-handler'; namespace Animated { type Nullable = T | null | undefined; class AnimatedNode { constructor( nodeConfig: object, inputNodes?: ReadonlyArray> ); isNativelyInitialized(): boolean; /** * ' __value' is not available at runtime on AnimatedNode. It is * necessary to have some discriminating property on a type to know that * an AnimatedNode and AnimatedNode are not compatible types. */ ' __value': T; } class AnimatedClock extends AnimatedNode { constructor(); } export enum Extrapolate { EXTEND = 'extend', CLAMP = 'clamp', IDENTITY = 'identity', } type ExtrapolateParameter = | Extrapolate | { extrapolateLeft?: Extrapolate; extrapolateRight?: Extrapolate }; interface InterpolationConfig { inputRange: ReadonlyArray>; outputRange: ReadonlyArray>; extrapolate?: ExtrapolateParameter; extrapolateLeft?: Extrapolate; extrapolateRight?: Extrapolate; } type Value = string | number | boolean; class AnimatedValue extends AnimatedNode { constructor(value?: T); setValue(value: Adaptable): void; interpolate(config: InterpolationConfig): AnimatedNode; } export type SharedValue = { value: T }; export type DerivedValue = Readonly>; export type Mapping = { [key: string]: Mapping } | Adaptable; export type Adaptable = | T | AnimatedNode | ReadonlyArray | ReadonlyArray>>; type BinaryOperator = ( left: Adaptable, right: Adaptable ) => AnimatedNode; type UnaryOperator = (value: Adaptable) => AnimatedNode; type MultiOperator = ( a: Adaptable, b: Adaptable, ...others: Adaptable[] ) => AnimatedNode; export interface AnimationState { finished: AnimatedValue; position: AnimatedValue; time: AnimatedValue; } export interface PhysicsAnimationState extends AnimationState { velocity: AnimatedValue; } export type DecayState = PhysicsAnimationState; export interface DecayConfig { deceleration: Adaptable; } export interface WithDecayConfig { deceleration?: number; velocity?: number; clamp?: [number, number]; } export interface BackwardCompatibleWrapper { start: (callback?: (data: { finished: boolean }) => any) => void; stop: () => void; } export interface TimingState extends AnimationState { frameTime: AnimatedValue; } export type EasingNodeFunction = ( value: Adaptable ) => AnimatedNode; export type EasingFunction = (value: number) => number; export interface TimingConfig { toValue: Adaptable; duration: Adaptable; easing: EasingNodeFunction; } export type SpringState = PhysicsAnimationState; export interface SpringConfig { damping: Adaptable; mass: Adaptable; stiffness: Adaptable; overshootClamping: Adaptable | boolean; restSpeedThreshold: Adaptable; restDisplacementThreshold: Adaptable; toValue: Adaptable; } export interface WithSpringConfig { damping?: number; mass?: number; stiffness?: number; overshootClamping?: boolean; restSpeedThreshold?: number; restDisplacementThreshold?: number; velocity?: number; } interface SpringConfigWithOrigamiTensionAndFriction { tension: Adaptable; mass: Adaptable; friction: Adaptable; overshootClamping: Adaptable | boolean; restSpeedThreshold: Adaptable; restDisplacementThreshold: Adaptable; toValue: Adaptable; } interface SpringConfigWithBouncinessAndSpeed { bounciness: Adaptable; mass: Adaptable; speed: Adaptable; overshootClamping: Adaptable | boolean; restSpeedThreshold: Adaptable; restDisplacementThreshold: Adaptable; toValue: Adaptable; } type SpringUtils = { makeDefaultConfig: () => SpringConfig; makeConfigFromBouncinessAndSpeed: ( prevConfig: SpringConfigWithBouncinessAndSpeed ) => SpringConfig; makeConfigFromOrigamiTensionAndFriction: ( prevConfig: SpringConfigWithOrigamiTensionAndFriction ) => SpringConfig; }; export const SpringUtils: SpringUtils; export type TransformStyleTypes = TransformsStyle['transform'] extends | readonly (infer T)[] | undefined ? T : never; export type AdaptTransforms = { [P in keyof T]: Adaptable; }; export type AnimatedTransform = AdaptTransforms[]; export type AnimateStyle = { [K in keyof S]: K extends 'transform' ? AnimatedTransform : S[K] extends ReadonlyArray ? ReadonlyArray> : S[K] extends object ? AnimateStyle // allow `number` where `string` normally is to support colors : S[K] extends ColorValue | undefined ? S[K] | number : | S[K] | AnimatedNode< // allow `number` where `string` normally is to support colors S[K] extends ColorValue | undefined ? S[K] | number : S[K] >; }; export type AnimateProps

= { [K in keyof P]: K extends 'style' ? StyleProp> : P[K] | AnimatedNode; } & { animatedProps?: AnimateProps

}; type CodeProps = { exec?: AnimatedNode; children?: () => AnimatedNode; dependencies?: Array; }; // components export class View extends Component> { getNode(): ReactNativeView; } export class Text extends Component> { getNode(): ReactNativeText; } export class Image extends Component> { getNode(): ReactNativeImage; } export class ScrollView extends Component> { getNode(): ReactNativeScrollView; } export class Code extends Component {} export function createAnimatedComponent

( component: ComponentClass

): ComponentClass>; export function createAnimatedComponent

( component: FunctionComponent

): FunctionComponent>; // classes export { AnimatedClock as Clock, AnimatedNode as Node, AnimatedValue as Value, }; // base operations export const add: MultiOperator; export const sub: MultiOperator; export const multiply: MultiOperator; export const divide: MultiOperator; export const pow: MultiOperator; export const modulo: MultiOperator; export const sqrt: UnaryOperator; export const log: UnaryOperator; export const sin: UnaryOperator; export const cos: UnaryOperator; export const tan: UnaryOperator; export const acos: UnaryOperator; export const asin: UnaryOperator; export const atan: UnaryOperator; export const exp: UnaryOperator; export const round: UnaryOperator; export const floor: UnaryOperator; export const ceil: UnaryOperator; export const lessThan: BinaryOperator<0 | 1>; export const eq: BinaryOperator<0 | 1>; export const greaterThan: BinaryOperator<0 | 1>; export const lessOrEq: BinaryOperator<0 | 1>; export const greaterOrEq: BinaryOperator<0 | 1>; export const neq: BinaryOperator<0 | 1>; export const and: MultiOperator<0 | 1>; export const or: MultiOperator<0 | 1>; export function proc | undefined)[]>( func: (...args: T) => AnimatedNode ): typeof func; export function defined(value: Adaptable): AnimatedNode<0 | 1>; export function not(value: Adaptable): AnimatedNode<0 | 1>; export function set( valueToBeUpdated: AnimatedValue, sourceNode: Adaptable ): AnimatedNode; export function concat( ...args: Array | Adaptable> ): AnimatedNode; export function cond( conditionNode: Adaptable, ifNode: Adaptable, elseNode?: Adaptable ): AnimatedNode; export function block( items: ReadonlyArray> ): AnimatedNode; export function call( args: ReadonlyArray>, callback: (args: ReadonlyArray) => void ): AnimatedNode<0>; export function debug( message: string, value: AnimatedNode ): AnimatedNode; export function onChange( value: Adaptable, action: Adaptable ): AnimatedNode; export function startClock(clock: AnimatedClock): AnimatedNode<0>; export function stopClock(clock: AnimatedClock): AnimatedNode<0>; export function clockRunning(clock: AnimatedClock): AnimatedNode<0 | 1>; // the return type for `event` is a lie, but it's the same lie that // react-native makes within Animated type EventArgFunc = (arg: T) => AnimatedNode; type EventMapping = T extends object ? { [K in keyof T]?: EventMapping | EventArgFunc } : Adaptable | EventArgFunc; type EventMappingArray = T extends Array ? { [I in keyof T]: EventMapping } : [EventMapping]; export function event( argMapping: T extends never ? ReadonlyArray : Readonly>, config?: {} ): (...args: any[]) => void; // derived operations export function abs(value: Adaptable): AnimatedNode; export function acc(value: Adaptable): AnimatedNode; export function color( r: Adaptable, g: Adaptable, b: Adaptable, a?: Adaptable ): AnimatedNode; export function diff(value: Adaptable): AnimatedNode; export function diffClamp( value: Adaptable, minVal: Adaptable, maxVal: Adaptable ): AnimatedNode; export function interpolateNode( value: Adaptable, config: InterpolationConfig ): AnimatedNode; export function interpolateColors( animationValue: Adaptable, { inputRange, outputColorRange, }: { inputRange: ReadonlyArray>; outputColorRange: ReadonlyArray>; } ): AnimatedNode; export const max: BinaryOperator; export const min: BinaryOperator; // reanimated2 derived operations export function interpolate( x: number, input: Array, output: Array, type?: ExtrapolateParameter ): number; // animations export function decay( clock: AnimatedClock, state: DecayState, config: DecayConfig ): AnimatedNode; export function timing( clock: AnimatedClock, state: TimingState, config: TimingConfig ): AnimatedNode; export function spring( clock: AnimatedClock, state: SpringState, config: SpringConfig ): AnimatedNode; // backward compatible API export function spring( node: AnimatedNode, config: SpringConfig ): BackwardCompatibleWrapper; export function timing( node: AnimatedNode, config: TimingConfig ): BackwardCompatibleWrapper; export function decay( node: AnimatedNode, config: DecayConfig ): BackwardCompatibleWrapper; // reanimated2 animations export interface WithTimingConfig { duration?: number; easing?: EasingFunction; } export function withTiming( toValue: number | Exclude, // string as a color value like `"rgba(20,20,20,0)"` userConfig?: WithTimingConfig, callback?: (isFinished: boolean) => void ): number; export function withSpring( toValue: number | Exclude, // string as a color value like `"rgba(20,20,20,0)"` userConfig?: WithSpringConfig, callback?: (isFinished: boolean) => void ): number; export function withDecay( userConfig: WithDecayConfig, callback?: (isFinished: boolean) => void ): number; export function cancelAnimation(sharedValue: SharedValue): void; export function withDelay( delayMS: number, delayedAnimation: number ): number; export function withRepeat( animation: number, numberOfReps?: number, reverse?: boolean, callback?: (isFinished: boolean) => void ): number; export function withSequence(...animations: [number, ...number[]]): number; // hooks export function useCode( exec: () => | Nullable[] | AnimatedNode> | boolean, deps: Array ): void; export function useValue( initialValue: T ): AnimatedValue; // reanimated2 functions export function runOnUI( fn: (...args: A) => R ): (...args: Parameters) => void; export function runOnJS( fn: (...args: A) => R ): (...args: Parameters) => void; type PropsAdapterFunction = (props: Record) => void; export function createAnimatedPropAdapter( adapter: PropsAdapterFunction, nativeProps?: string[] ): PropsAdapterFunction; export function processColor(color: number | string): number; export function createWorklet( fn: (...args: A) => R ): (...args: Parameters) => R; export function interpolateColor( value: number, inputRange: readonly number[], outputRange: readonly (string | number)[], colorSpace?: 'RGB' | 'HSV' ): string | number; export function makeMutable(initialValue: T): SharedValue; type DependencyList = ReadonlyArray; // reanimated2 hooks export function useSharedValue(initialValue: T): SharedValue; export function useDerivedValue( processor: () => T, deps?: DependencyList ): DerivedValue; export function useAnimatedReaction( prepare: () => D, react: (prepareResult: D, preparePreviousResult: D | null) => void, deps?: DependencyList ): void; export type AnimatedStyleProp = | AnimateStyle | RegisteredStyle>; export function useAnimatedStyle< T extends AnimatedStyleProp >(updater: () => T, deps?: DependencyList | null): T; export function useAnimatedProps( updater: () => T, deps?: DependencyList | null, adapters?: PropsAdapterFunction | PropsAdapterFunction[] | null ): T; export function useAnimatedGestureHandler< T extends GestureHandlerGestureEvent = PanGestureHandlerGestureEvent, TContext extends Context = {} >( handlers: GestureHandlers, deps?: DependencyList ): OnGestureEvent; export function useAnimatedScrollHandler( handler: ScrollHandler, deps?: DependencyList ): OnScroll; export function useAnimatedScrollHandler( handlers: ScrollHandlers, deps?: DependencyList ): OnScroll; export function useWorkletCallback( fn: (...args: A) => R, deps?: DependencyList ): (...args: Parameters) => R; export function useAnimatedRef(): RefObject; export function defineAnimation(starting: any, factory: () => T): number; export function measure( ref: RefObject ): { width: number; height: number; x: number; y: number; pageX: number; pageY: number; }; export function scrollTo( ref: RefObject, x: number, y: number, animated: boolean ): void; // gesture-handler type OnGestureEvent = ( event: T ) => void; type Context = Record; type Handler = ( event: T, context: TContext ) => void; export interface GestureHandlers { onStart?: Handler; onActive?: Handler; onEnd?: Handler; onFail?: Handler; onCancel?: Handler; onFinish?: ( event: T, context: TContext, isCanceledOrFailed: boolean ) => void; } // scroll view type OnScroll = (event: NativeSyntheticEvent) => void; type ScrollHandler = ( event: NativeScrollEvent, context: TContext ) => void; export interface ScrollHandlers { onScroll?: ScrollHandler; onBeginDrag?: ScrollHandler; onEndDrag?: ScrollHandler; onMomentumBegin?: ScrollHandler; onMomentumEnd?: ScrollHandler; } // configuration export function addWhitelistedNativeProps(props: { [key: string]: true; }): void; export function addWhitelistedUIProps(props: { [key: string]: true }): void; } export default Animated; interface EasingNodeStatic { linear: Animated.EasingNodeFunction; ease: Animated.EasingNodeFunction; quad: Animated.EasingNodeFunction; cubic: Animated.EasingNodeFunction; poly(n: Animated.Adaptable): Animated.EasingNodeFunction; sin: Animated.EasingNodeFunction; circle: Animated.EasingNodeFunction; exp: Animated.EasingNodeFunction; elastic( bounciness?: Animated.Adaptable ): Animated.EasingNodeFunction; back(s?: Animated.Adaptable): Animated.EasingNodeFunction; bounce: Animated.EasingNodeFunction; bezier( x1: number, y1: number, x2: number, y2: number ): Animated.EasingNodeFunction; in(easing: Animated.EasingNodeFunction): Animated.EasingNodeFunction; out(easing: Animated.EasingNodeFunction): Animated.EasingNodeFunction; inOut(easing: Animated.EasingNodeFunction): Animated.EasingNodeFunction; } export const EasingNode: EasingNodeStatic; interface EasingStatic { linear: Animated.EasingFunction; ease: Animated.EasingFunction; quad: Animated.EasingFunction; cubic: Animated.EasingFunction; poly(n: number): Animated.EasingFunction; sin: Animated.EasingFunction; circle: Animated.EasingFunction; exp: Animated.EasingFunction; elastic(bounciness?: number): Animated.EasingFunction; back(s?: number): Animated.EasingFunction; bounce: Animated.EasingFunction; bezier( x1: number, y1: number, x2: number, y2: number ): Animated.EasingFunction; in(easing: Animated.EasingFunction): Animated.EasingFunction; out(easing: Animated.EasingFunction): Animated.EasingFunction; inOut(easing: Animated.EasingFunction): Animated.EasingFunction; } export const Easing: EasingStatic; export interface TransitioningViewProps extends ViewProps { transition: ReactNode; } export class TransitioningView extends Component { animateNextTransition(): void; } export class Transitioning extends Component { static View: typeof TransitioningView; } export interface TransitionProps { delayMs?: number; durationMs?: number; interpolation?: 'linear' | 'easeIn' | 'easeOut' | 'easeInOut'; propagation?: 'top' | 'bottom' | 'left' | 'right'; } export interface TransitionInOutProps extends TransitionProps { type?: | 'fade' | 'scale' | 'slide-top' | 'slide-bottom' | 'slide-right' | 'slide-left'; } export class Transition extends Component { static In: ComponentClass; static Out: ComponentClass; static Change: ComponentClass; static Together: ComponentClass<{}>; static Sequence: ComponentClass<{}>; } export class Clock extends Animated.Clock {} export class Value< T extends string | number | boolean > extends Animated.Value {} export class Node extends Animated.Node {} export const add: typeof Animated.add; export const sub: typeof Animated.sub; export const multiply: typeof Animated.multiply; export const divide: typeof Animated.divide; export const pow: typeof Animated.pow; export const modulo: typeof Animated.modulo; export const sqrt: typeof Animated.sqrt; export const log: typeof Animated.log; export const sin: typeof Animated.sin; export const cos: typeof Animated.cos; export const exp: typeof Animated.exp; export const round: typeof Animated.round; export const lessThan: typeof Animated.lessThan; export const eq: typeof Animated.eq; export const greaterThan: typeof Animated.greaterThan; export const lessOrEq: typeof Animated.lessOrEq; export const greaterOrEq: typeof Animated.greaterOrEq; export const neq: typeof Animated.neq; export const and: typeof Animated.and; export const or: typeof Animated.or; export const defined: typeof Animated.defined; export const not: typeof Animated.not; export const tan: typeof Animated.tan; export const acos: typeof Animated.acos; export const asin: typeof Animated.asin; export const atan: typeof Animated.atan; export const proc: typeof Animated.proc; export const block: typeof Animated.block; export const concat: typeof Animated.concat; export const event: typeof Animated.event; export const call: typeof Animated.call; export const debug: typeof Animated.debug; export const clockRunning: typeof Animated.clockRunning; export const stopClock: typeof Animated.stopClock; export const startClock: typeof Animated.startClock; export const set: typeof Animated.set; export const cond: typeof Animated.cond; export const abs: typeof Animated.abs; export const acc: typeof Animated.acc; export const color: typeof Animated.color; export const interpolateColors: typeof Animated.interpolateColors; export const diff: typeof Animated.diff; export const diffClamp: typeof Animated.diffClamp; export const interpolateNode: typeof Animated.interpolateNode; export const Extrapolate: typeof Animated.Extrapolate; export const max: typeof Animated.max; export const min: typeof Animated.min; export const onChange: typeof Animated.onChange; export const floor: typeof Animated.floor; export const ceil: typeof Animated.ceil; export const useCode: typeof Animated.useCode; export const decay: typeof Animated.decay; export const timing: typeof Animated.timing; export const spring: typeof Animated.spring; export const SpringUtils: typeof Animated.SpringUtils; export const runOnUI: typeof Animated.runOnUI; export const runOnJS: typeof Animated.runOnJS; export const createAnimatedPropAdapter: typeof Animated.createAnimatedPropAdapter; export const processColor: typeof Animated.processColor; export const makeMutable: typeof Animated.makeMutable; export const useValue: typeof Animated.useValue; export const useSharedValue: typeof Animated.useSharedValue; export const useAnimatedStyle: typeof Animated.useAnimatedStyle; export const useAnimatedReaction: typeof Animated.useAnimatedReaction; export const useAnimatedProps: typeof Animated.useAnimatedProps; export const useDerivedValue: typeof Animated.useDerivedValue; export const useWorkletCallback: typeof Animated.useWorkletCallback; export const createWorklet: typeof Animated.createWorklet; export const interpolateColor: typeof Animated.interpolateColor; export const useAnimatedGestureHandler: typeof Animated.useAnimatedGestureHandler; export const useAnimatedScrollHandler: typeof Animated.useAnimatedScrollHandler; export const useAnimatedRef: typeof Animated.useAnimatedRef; export const defineAnimation: typeof Animated.defineAnimation; export const measure: typeof Animated.measure; export const scrollTo: typeof Animated.scrollTo; export const withTiming: typeof Animated.withTiming; export const withSpring: typeof Animated.withSpring; export const withDecay: typeof Animated.withDecay; export const cancelAnimation: typeof Animated.cancelAnimation; export const withDelay: typeof Animated.withDelay; export const withRepeat: typeof Animated.withRepeat; export const withSequence: typeof Animated.withSequence; export const interpolate: typeof Animated.interpolate; }