diff --git a/native/chat/swipeable-message.react.js b/native/chat/swipeable-message.react.js index ae25e7eba..ad430dba2 100644 --- a/native/chat/swipeable-message.react.js +++ b/native/chat/swipeable-message.react.js @@ -1,429 +1,444 @@ // @flow import type { IconProps } from '@expo/vector-icons'; import * as Haptics from 'expo-haptics'; import invariant from 'invariant'; import * as React from 'react'; import { View } from 'react-native'; import { PanGestureHandler, type PanGestureEvent, } from 'react-native-gesture-handler'; import Animated, { useAnimatedGestureHandler, useSharedValue, useAnimatedStyle, runOnJS, withSpring, interpolate, cancelAnimation, Extrapolate, type SharedValue, + // ESLint doesn't understand Flow comment syntax + // eslint-disable-next-line no-unused-vars + type WithSpringConfig, } from 'react-native-reanimated'; import tinycolor from 'tinycolor2'; import { useMessageListScreenWidth } from './composed-message-width.js'; import CommIcon from '../components/comm-icon.react.js'; import { colors } from '../themes/colors.js'; import type { ViewStyle } from '../types/styles.js'; const primaryThreshold = 40; const secondaryThreshold = 120; const panGestureHandlerActiveOffsetX = [-4, 4]; const panGestureHandlerFailOffsetY = [-5, 5]; -function dividePastDistance(value, distance, factor) { +function dividePastDistance( + value /*: number */, + distance /*: number */, + factor /*: number */, +) /*: number */ { 'worklet'; const absValue = Math.abs(value); if (absValue < distance) { return value; } const absFactor = value >= 0 ? 1 : -1; return absFactor * (distance + (absValue - distance) / factor); } -function makeSpringConfig(velocity) { +function makeSpringConfig(velocity /*: number */) /*: WithSpringConfig */ { 'worklet'; return { stiffness: 257.1370588235294, damping: 19.003038357561845, mass: 1, overshootClamping: true, restDisplacementThreshold: 0.001, restSpeedThreshold: 0.001, velocity, }; } -function interpolateOpacityForViewerPrimarySnake(translateX) { +function interpolateOpacityForViewerPrimarySnake( + translateX /*: number */, +) /*: number */ { 'worklet'; return interpolate(translateX, [-20, -5], [1, 0], Extrapolate.CLAMP); } -function interpolateOpacityForNonViewerPrimarySnake(translateX) { +function interpolateOpacityForNonViewerPrimarySnake( + translateX /*: number */, +) /*: number */ { 'worklet'; return interpolate(translateX, [5, 20], [0, 1], Extrapolate.CLAMP); } -function interpolateTranslateXForViewerSecondarySnake(translateX) { +function interpolateTranslateXForViewerSecondarySnake( + translateX /*: number */, +) /*: number */ { 'worklet'; return interpolate(translateX, [-130, -120, -60, 0], [-130, -120, -5, 20]); } -function interpolateTranslateXForNonViewerSecondarySnake(translateX) { +function interpolateTranslateXForNonViewerSecondarySnake( + translateX /*: number */, +) /*: number */ { 'worklet'; return interpolate(translateX, [0, 80, 120, 130], [0, 30, 120, 130]); } type SwipeSnakeProps = { +isViewer: boolean, +translateX: SharedValue, +color: string, +children: React.Element>>, +opacityInterpolator?: number => number, // must be worklet +translateXInterpolator?: number => number, // must be worklet }; function SwipeSnake( props: SwipeSnakeProps, ): React.Node { const { translateX, isViewer, opacityInterpolator, translateXInterpolator } = props; const transformStyle = useAnimatedStyle(() => { const opacity = opacityInterpolator ? opacityInterpolator(translateX.value) : undefined; const translate = translateXInterpolator ? translateXInterpolator(translateX.value) : translateX.value; return { transform: [ { translateX: translate, }, ], opacity, }; }, [isViewer, translateXInterpolator, opacityInterpolator]); const animationPosition = isViewer ? styles.right0 : styles.left0; const animationContainerStyle = React.useMemo(() => { return [styles.animationContainer, animationPosition]; }, [animationPosition]); const iconPosition = isViewer ? styles.left0 : styles.right0; const swipeSnakeContainerStyle = React.useMemo(() => { return [styles.swipeSnakeContainer, transformStyle, iconPosition]; }, [transformStyle, iconPosition]); const iconAlign = isViewer ? styles.alignStart : styles.alignEnd; const screenWidth = useMessageListScreenWidth(); const { color } = props; const swipeSnakeStyle = React.useMemo(() => { return [ styles.swipeSnake, iconAlign, { width: screenWidth, backgroundColor: color, }, ]; }, [iconAlign, screenWidth, color]); const { children } = props; const iconColor = tinycolor(color).isDark() ? colors.dark.listForegroundLabel : colors.light.listForegroundLabel; const coloredIcon = React.useMemo( () => React.cloneElement(children, { color: iconColor, }), [children, iconColor], ); const swipeSnake = React.useMemo( () => ( {coloredIcon} ), [ animationContainerStyle, coloredIcon, swipeSnakeContainerStyle, swipeSnakeStyle, ], ); return swipeSnake; } type Props = { +triggerReply?: () => mixed, +triggerSidebar?: () => mixed, +isViewer: boolean, +contentStyle: ViewStyle, +threadColor: string, +children: React.Node, }; function SwipeableMessage(props: Props): React.Node { const { isViewer, triggerReply, triggerSidebar } = props; const secondaryActionExists = triggerReply && triggerSidebar; const onPassPrimaryThreshold = React.useCallback(() => { const impactStrength = secondaryActionExists ? Haptics.ImpactFeedbackStyle.Medium : Haptics.ImpactFeedbackStyle.Heavy; Haptics.impactAsync(impactStrength); }, [secondaryActionExists]); const onPassSecondaryThreshold = React.useCallback(() => { if (secondaryActionExists) { Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Heavy); } }, [secondaryActionExists]); const primaryAction = React.useCallback(() => { if (triggerReply) { triggerReply(); } else if (triggerSidebar) { triggerSidebar(); } }, [triggerReply, triggerSidebar]); const secondaryAction = React.useCallback(() => { if (triggerReply && triggerSidebar) { triggerSidebar(); } }, [triggerReply, triggerSidebar]); const translateX = useSharedValue(0); const swipeEvent = useAnimatedGestureHandler( { onStart: ( event /*: PanGestureEvent */, ctx /*: { [string]: mixed } */, ) => { ctx.translationAtStart = translateX.value; cancelAnimation(translateX.value); }, onActive: ( event /*: PanGestureEvent */, ctx /*: { [string]: mixed } */, ) => { const { translationAtStart } = ctx; invariant( typeof translationAtStart === 'number', 'translationAtStart should be number', ); const translationX = translationAtStart + event.translationX; const baseActiveTranslation = isViewer ? Math.min(translationX, 0) : Math.max(translationX, 0); translateX.value = dividePastDistance( baseActiveTranslation, primaryThreshold, 2, ); const absValue = Math.abs(translateX.value); const pastPrimaryThreshold = absValue >= primaryThreshold; if (pastPrimaryThreshold && !ctx.prevPastPrimaryThreshold) { runOnJS(onPassPrimaryThreshold)(); } ctx.prevPastPrimaryThreshold = pastPrimaryThreshold; const pastSecondaryThreshold = absValue >= secondaryThreshold; if (pastSecondaryThreshold && !ctx.prevPastSecondaryThreshold) { runOnJS(onPassSecondaryThreshold)(); } ctx.prevPastSecondaryThreshold = pastSecondaryThreshold; }, onEnd: (event /*: PanGestureEvent */) => { const absValue = Math.abs(translateX.value); if (absValue >= secondaryThreshold && secondaryActionExists) { runOnJS(secondaryAction)(); } else if (absValue >= primaryThreshold) { runOnJS(primaryAction)(); } translateX.value = withSpring(0, makeSpringConfig(event.velocityX)); }, }, [ isViewer, onPassPrimaryThreshold, onPassSecondaryThreshold, primaryAction, secondaryAction, secondaryActionExists, ], ); const transformContentStyle = useAnimatedStyle( () => ({ transform: [{ translateX: translateX.value }], }), [], ); const { contentStyle, children } = props; const panGestureHandlerStyle = React.useMemo( () => [contentStyle, transformContentStyle], [contentStyle, transformContentStyle], ); const threadColor = `#${props.threadColor}`; const tinyThreadColor = tinycolor(threadColor); const replyIcon = React.useMemo( () => , [], ); const replySwipeSnake = React.useMemo( () => ( {replyIcon} ), [isViewer, replyIcon, threadColor, translateX], ); const sidebarIcon = React.useMemo( () => , [], ); const sidebarSwipeSnakeWithReplySwipeSnake = React.useMemo( () => ( {sidebarIcon} ), [isViewer, sidebarIcon, tinyThreadColor, translateX], ); const sidebarSwipeSnakeWithoutReplySwipeSnake = React.useMemo( () => ( {sidebarIcon} ), [isViewer, sidebarIcon, threadColor, translateX], ); const panGestureHandler = React.useMemo( () => ( {children} ), [children, isViewer, panGestureHandlerStyle, swipeEvent], ); const swipeableMessage = React.useMemo(() => { if (!triggerReply && !triggerSidebar) { return ( {children} ); } const snakes: Array = []; if (triggerReply) { snakes.push(replySwipeSnake); } if (triggerReply && triggerSidebar) { snakes.push(sidebarSwipeSnakeWithReplySwipeSnake); } else if (triggerSidebar) { snakes.push(sidebarSwipeSnakeWithoutReplySwipeSnake); } snakes.push(panGestureHandler); return snakes; }, [ children, contentStyle, panGestureHandler, replySwipeSnake, sidebarSwipeSnakeWithReplySwipeSnake, sidebarSwipeSnakeWithoutReplySwipeSnake, triggerReply, triggerSidebar, ]); return swipeableMessage; } const styles = { swipeSnakeContainer: { marginHorizontal: 20, justifyContent: 'center', position: 'absolute', top: 0, bottom: 0, }, animationContainer: { position: 'absolute', top: 0, bottom: 0, }, swipeSnake: { paddingHorizontal: 15, flex: 1, borderRadius: 25, height: 30, justifyContent: 'center', maxHeight: 50, }, left0: { left: 0, }, right0: { right: 0, }, alignStart: { alignItems: 'flex-start', }, alignEnd: { alignItems: 'flex-end', }, }; export default SwipeableMessage; diff --git a/native/flow-typed/npm/react-native-reanimated_v2.x.x.js b/native/flow-typed/npm/react-native-reanimated_v2.x.x.js index 505ddbacb..e9bf4cd76 100644 --- a/native/flow-typed/npm/react-native-reanimated_v2.x.x.js +++ b/native/flow-typed/npm/react-native-reanimated_v2.x.x.js @@ -1,651 +1,651 @@ // flow-typed signature: 3742390ed7eeeb6c96844c62149ea639 // flow-typed version: <>/react-native-reanimated_v2.2.0/flow_v0.137.0 /** * This is an autogenerated libdef stub for: * * 'react-native-reanimated' * * Fill this stub out by replacing all the `any` types. * * Once filled out, we encourage you to share your work with the * community by sending a pull request to: * https://github.com/flowtype/flow-typed */ declare module 'react-native-reanimated' { // This was taken from the flow typed library definitions of bottom-tabs_v6 declare type StyleObj = | null | void | number | false | '' | $ReadOnlyArray | { [name: string]: any, ... }; declare type ViewStyleProp = StyleObj; declare type TextStyleProp = StyleObj; declare type StyleProps = {| ...ViewStyleProp, ...TextStyleProp, +originX?: number, +originY?: number, +[key: string]: any, |}; declare class NodeImpl { } declare class ValueImpl extends NodeImpl { constructor(val: number): this; setValue(num: number): void; } declare class ClockImpl extends NodeImpl { } declare class ViewImpl extends React$Component<{ ... }> { } declare class TextImpl extends React$Component<{ ... }> { } declare class ImageImpl extends React$Component<{ ... }> { } declare class CodeImpl extends React$Component<{ +exec: NodeImpl, ... }> { } declare type NodeOrNum = NodeImpl | number; declare export type NodeParam = NodeOrNum | $ReadOnlyArray; declare type NodeOrArrayOfNodes = NodeImpl | $ReadOnlyArray; declare export type Block = ( nodes: $ReadOnlyArray, ) => NodeImpl; declare export type Set = (node: ValueImpl, val: NodeParam) => NodeImpl; declare type ToNumber = (val: mixed) => number; declare export type Call = >( nodes: N, callback: (vals: $TupleMap) => mixed, ) => NodeImpl; declare export type Cond = ( cond: NodeParam, branch1: ?NodeParam, branch2?: ?NodeParam, ) => NodeImpl; declare export type Not = NodeImpl => NodeImpl; declare export type And = (...$ReadOnlyArray) => NodeImpl; declare export type Or = (...$ReadOnlyArray) => NodeImpl; declare export type Eq = (NodeParam, NodeParam) => NodeImpl; declare export type Neq = (NodeParam, NodeParam) => NodeImpl; declare export type LessThan = (NodeParam, NodeParam) => NodeImpl; declare export type GreaterThan = (NodeParam, NodeParam) => NodeImpl; declare export type LessOrEq = (NodeParam, NodeParam) => NodeImpl; declare export type GreaterOrEq = (NodeParam, NodeParam) => NodeImpl; declare export type Add = (...$ReadOnlyArray) => NodeImpl; declare export type Sub = (...$ReadOnlyArray) => NodeImpl; declare export type Multiply = (...$ReadOnlyArray) => NodeImpl; declare export type Divide = (...$ReadOnlyArray) => NodeImpl; declare export type Pow = (...$ReadOnlyArray) => NodeImpl; declare export type Max = (NodeParam, NodeParam) => NodeImpl; declare export type Min = (NodeParam, NodeParam) => NodeImpl; declare export type Abs = (NodeParam) => NodeImpl; declare export type Ceil = (NodeParam) => NodeImpl; declare export type Floor = (NodeParam) => NodeImpl; declare export type Round = (NodeParam) => NodeImpl; declare export type StartClock = ClockImpl => NodeImpl; declare export type StopClock = ClockImpl => NodeImpl; declare export type ClockRunning = ClockImpl => NodeImpl; declare export type Debug = (string, NodeParam) => NodeImpl; declare type AnimationCallback = ( finished?: boolean, current?: AnimatableValue ) => mixed; declare type Animatable = number | string | Array; declare type AnimatableValueObject = { +[key: string]: Animatable }; declare export type AnimatableValue = Animatable | AnimatableValueObject; declare type ExtrapolateType = { ... }; declare type ExtrapolateModule = { +CLAMP: ExtrapolateType, ... }; declare export type InterpolationConfig = { +inputRange: $ReadOnlyArray, +outputRange: $ReadOnlyArray, +extrapolate?: ?ExtrapolateType, ... }; declare export type InterpolateNode = ( node: NodeParam, interpolationConfig: InterpolationConfig, ) => NodeImpl; declare export type InterpolateColorsConfig = { +inputRange: $ReadOnlyArray, +outputColorRange: $ReadOnlyArray, }; declare export type InterpolateColors = ( animationValue: NodeParam, interpolationConfig: InterpolateColorsConfig ) => NodeImpl; declare export type Interpolate = ( input: number, inputRange: $ReadOnlyArray, outputRange: $ReadOnlyArray, extrapolate?: ?ExtrapolateType, ) => number; declare export type InterpolateColorConfig = $Shape<{ +gamma: number, +useCorrectedHSVInterpolation: boolean, }>; declare export type InterpolateColor = ( input: number, inputRange: $ReadOnlyArray, outputRange: $ReadOnlyArray, colorSpace?: 'RGB' | 'HSV', interpolateColorConfig?: InterpolateColorConfig, ) => T; declare type EasingType = { ... }; declare type EasingModule = { +ease: EasingType, +quad: EasingType, +in: EasingType => EasingType, +out: EasingType => EasingType, +inOut: EasingType => EasingType, ... }; declare export var EasingNode: EasingModule; declare type EasingFn = (t: number) => number; declare type EasingFnFactory = { +factory: () => EasingFn }; declare export type TimingState = { +finished: ValueImpl, +position: ValueImpl, +frameTime: ValueImpl, +time: ValueImpl, ... }; declare export type TimingConfig = { +duration: number, +toValue: NodeOrNum, +easing?: ?EasingType, ... }; declare type Animator = { +start: () => void, ... }; declare type Timing = {| ( value: ValueImpl, config: TimingConfig, ): Animator, ( clock: ClockImpl, state: TimingState, config: TimingConfig, ): NodeImpl, |}; declare export type SpringConfig = { +overshootClamping: boolean, +damping: number, +mass: number, +toValue: NodeOrNum, ... }; declare type SpringUtilsModule = { +makeDefaultConfig: () => SpringConfig, +makeConfigFromBouncinessAndSpeed: ({ ...SpringConfig, +bounciness: ?number, +speed: ?number, ... }) => SpringConfig, ... }; declare export type SpringState = { +finished: ValueImpl, +position: ValueImpl, +velocity: ValueImpl, +time: ValueImpl, ... }; declare type Spring = {| ( value: ValueImpl, config: SpringConfig, ): Animator, ( clock: ClockImpl, state: SpringState, config: SpringConfig, ): NodeImpl, |}; declare export type DecayConfig = { +deceleration: number, ... }; declare export type DecayState = { +finished: ValueImpl, +position: ValueImpl, +velocity: ValueImpl, +time: ValueImpl, ... }; declare type Decay = {| ( value: ValueImpl, config: DecayConfig, ): Animator, ( clock: ClockImpl, state: DecayState, config: DecayConfig, ): NodeImpl, |}; declare type LayoutAnimation = {| +initialValues: StyleProps, +animations: StyleProps, +callback?: (finished: boolean) => void, |}; declare type AnimationFunction = (a?: any, b?: any, c?: any) => any; declare type EntryAnimationsValues = {| +targetOriginX: number, +targetOriginY: number, +targetWidth: number, +targetHeight: number, +targetGlobalOriginX: number, +targetGlobalOriginY: number, |}; declare type ExitAnimationsValues = {| +currentOriginX: number, +currentOriginY: number, +currentWidth: number, +currentHeight: number, +currentGlobalOriginX: number, +currentGlobalOriginY: number, |}; declare export type EntryExitAnimationFunction = ( targetValues: EntryAnimationsValues | ExitAnimationsValues, ) => LayoutAnimation; declare type AnimationConfigFunction = ( targetValues: T, ) => LayoutAnimation; declare type LayoutAnimationsValues = {| +currentOriginX: number, +currentOriginY: number, +currentWidth: number, +currentHeight: number, +currentGlobalOriginX: number, +currentGlobalOriginY: number, +targetOriginX: number, +targetOriginY: number, +targetWidth: number, +targetHeight: number, +targetGlobalOriginX: number, +argetGlobalOriginY: number, +windowWidth: number, +windowHeight: number, |}; declare type LayoutAnimationFunction = ( targetValues: LayoutAnimationsValues, ) => LayoutAnimation; declare type BaseLayoutAnimationConfig = {| +duration?: number, +easing?: EasingFn, +type?: AnimationFunction, +damping?: number, +mass?: number, +stiffness?: number, +overshootClamping?: number, +restDisplacementThreshold?: number, +restSpeedThreshold?: number, |}; declare type BaseBuilderAnimationConfig = {| ...BaseLayoutAnimationConfig, rotate?: number | string, |}; declare type LayoutAnimationAndConfig = [ AnimationFunction, BaseBuilderAnimationConfig, ]; declare export class BaseAnimationBuilder { static duration(durationMs: number): BaseAnimationBuilder; duration(durationMs: number): BaseAnimationBuilder; static delay(delayMs: number): BaseAnimationBuilder; delay(delayMs: number): BaseAnimationBuilder; static withCallback( callback: (finished: boolean) => void, ): BaseAnimationBuilder; withCallback(callback: (finished: boolean) => void): BaseAnimationBuilder; static getDuration(): number; getDuration(): number; static randomDelay(): BaseAnimationBuilder; randomDelay(): BaseAnimationBuilder; getDelay(): number; getDelayFunction(): AnimationFunction; static build(): EntryExitAnimationFunction | LayoutAnimationFunction; } declare export type ReanimatedAnimationBuilder = | Class | BaseAnimationBuilder; declare export class ComplexAnimationBuilder extends BaseAnimationBuilder { static easing(easingFunction: EasingFn): ComplexAnimationBuilder; easing(easingFunction: EasingFn): ComplexAnimationBuilder; static rotate(degree: string): ComplexAnimationBuilder; rotate(degree: string): ComplexAnimationBuilder; static springify(): ComplexAnimationBuilder; springify(): ComplexAnimationBuilder; static damping(damping: number): ComplexAnimationBuilder; damping(damping: number): ComplexAnimationBuilder; static mass(mass: number): ComplexAnimationBuilder; mass(mass: number): ComplexAnimationBuilder; static stiffness(stiffness: number): ComplexAnimationBuilder; stiffness(stiffness: number): ComplexAnimationBuilder; static overshootClamping( overshootClamping: number, ): ComplexAnimationBuilder; overshootClamping(overshootClamping: number): ComplexAnimationBuilder; static restDisplacementThreshold( restDisplacementThreshold: number, ): ComplexAnimationBuilder; restDisplacementThreshold( restDisplacementThreshold: number, ): ComplexAnimationBuilder; static restSpeedThreshold( restSpeedThreshold: number, ): ComplexAnimationBuilder; restSpeedThreshold(restSpeedThreshold: number): ComplexAnimationBuilder; static withInitialValues(values: StyleProps): BaseAnimationBuilder; withInitialValues(values: StyleProps): BaseAnimationBuilder; getAnimationAndConfig(): LayoutAnimationAndConfig; } declare export class SlideInDown extends ComplexAnimationBuilder { static createInstance(): SlideInDown; build(): AnimationConfigFunction; } declare export class SlideOutDown extends ComplexAnimationBuilder { static createInstance(): SlideOutDown; build(): AnimationConfigFunction; } declare export class FadeInDown extends ComplexAnimationBuilder { static createInstance(): FadeInDown; build(): AnimationConfigFunction; } declare export class FadeOutDown extends ComplexAnimationBuilder { static createInstance(): FadeOutDown; build(): AnimationConfigFunction; } declare type $SyntheticEvent = { +nativeEvent: $ReadOnly<$Exact>, ... }; declare type GestureStateUndetermined = 0; declare type GestureStateFailed = 1; declare type GestureStateBegan = 2; declare type GestureStateCancelled = 3; declare type GestureStateActive = 4; declare type GestureStateEnd = 5; declare type GestureState = | GestureStateUndetermined | GestureStateFailed | GestureStateBegan | GestureStateCancelled | GestureStateActive | GestureStateEnd; declare export type $Event = { handlerTag: number, numberOfPointers: number, state: GestureState, oldState: GestureState, ...$Exact, ... }; declare export type EventResult = $Event> = $SyntheticEvent => void; declare type ToValue = (val: mixed) => ValueImpl; declare type Event = = $Event>( defs: $ReadOnlyArray<{ +nativeEvent: $Shape<$ObjMap>, ... }>, ) => EventResult; declare type UseValue = (initialVal: number) => ValueImpl; declare type AnimatedGestureHandlerEventCallback> = ( event: $Shape, context: {| [name: string]: mixed |}, ) => mixed; declare type UseAnimatedGestureHandler = = $Event>( callbacks: $Shape<{| +onStart: AnimatedGestureHandlerEventCallback, +onActive: AnimatedGestureHandlerEventCallback, +onEnd: AnimatedGestureHandlerEventCallback, +onFail: AnimatedGestureHandlerEventCallback, +onCancel: AnimatedGestureHandlerEventCallback, +onFinish: AnimatedGestureHandlerEventCallback, |}>, dependencies?: $ReadOnlyArray, ) => $SyntheticEvent => mixed; declare export type SharedValue = { value: T, ... }; declare type UseSharedValue = (val: T) => SharedValue; declare type UseDerivedValue = ( updater: () => T, dependencies?: $ReadOnlyArray, ) => SharedValue; declare type UseAnimatedStyle = ( styleSelector: () => T, dependencies?: $ReadOnlyArray, ) => T; - declare type WithSpringConfig = $Shape<{| + declare export type WithSpringConfig = $Shape<{| +stiffness: number, +damping: number, +mass: number, +overshootClamping: boolean, +restDisplacementThreshold: number, +restSpeedThreshold: number, +velocity: number, |}>; // Doesn't actually return a number, but sharedValue.value has a differently // typed getter vs. setter, and Flow doesn't support that declare type WithSpring = ( toValue: number | string, springConfig?: WithSpringConfig, ) => number; declare type WithTimingConfig = $Shape<{ +duration: number, +easing: EasingFn | EasingFnFactory, }>; declare type WithTiming = ( toValue: T, timingConfig?: WithTimingConfig, callback?: AnimationCallback, ) => T; declare type RunOnJS = (func: F) => F; declare type CancelAnimation = (animation: number) => void; declare export var Node: typeof NodeImpl; declare export var Value: typeof ValueImpl; declare export var Clock: typeof ClockImpl; declare export var View: typeof ViewImpl; declare export var Text: typeof TextImpl; declare export var Image: typeof ImageImpl; declare export var Code: typeof CodeImpl; declare export var block: Block; declare export var set: Set; declare export var call: Call; declare export var cond: Cond; declare export var not: Not; declare export var and: And; declare export var or: Or; declare export var eq: Eq; declare export var neq: Neq; declare export var lessThan: LessThan; declare export var greaterThan: GreaterThan; declare export var lessOrEq: LessOrEq; declare export var greaterOrEq: GreaterOrEq; declare export var add: Add; declare export var sub: Sub; declare export var multiply: Multiply; declare export var divide: Divide; declare export var pow: Pow; declare export var max: Max; declare export var min: Min; declare export var abs: Abs; declare export var ceil: Ceil; declare export var floor: Floor; declare export var round: Round; declare export var startClock: StartClock; declare export var stopClock: StopClock; declare export var clockRunning: ClockRunning; declare export var debug: Debug; declare export var interpolateNode: InterpolateNode; declare export var interpolateColors: InterpolateColors; declare export var interpolate: Interpolate; declare export var interpolateColor: InterpolateColor; declare export var Extrapolate: ExtrapolateModule; declare export var timing: Timing; declare export var SpringUtils: SpringUtilsModule; declare export var spring: Spring; declare export var decay: Decay; declare export var event: Event; declare export var useValue: UseValue; declare export var useAnimatedGestureHandler: UseAnimatedGestureHandler; declare export var useSharedValue: UseSharedValue; declare export var useDerivedValue: UseDerivedValue; declare export var useAnimatedStyle: UseAnimatedStyle; declare export var withSpring: WithSpring; declare export var withTiming: WithTiming; declare export var runOnJS: RunOnJS; declare export var cancelAnimation: CancelAnimation; declare export default { +Node: typeof NodeImpl, +Value: typeof ValueImpl, +Clock: typeof ClockImpl, +View: typeof ViewImpl, +Text: typeof TextImpl, +Image: typeof ImageImpl, +Code: typeof CodeImpl, +block: Block, +set: Set, +call: Call, +cond: Cond, +not: Not, +and: And, +or: Or, +eq: Eq, +neq: Neq, +lessThan: LessThan, +greaterThan: GreaterThan, +lessOrEq: LessOrEq, +greaterOrEq: GreaterOrEq, +add: Add, +sub: Sub, +multiply: Multiply, +divide: Divide, +pow: Pow, +max: Max, +min: Min, +abs: Abs, +ceil: Ceil, +floor: Floor, +round: Round, +startClock: StartClock, +stopClock: StopClock, +clockRunning: ClockRunning, +debug: Debug, +interpolateNode: InterpolateNode, +interpolateColors: InterpolateColors, +interpolate: Interpolate, +interpolateColor: InterpolateColor, +Extrapolate: ExtrapolateModule, +timing: Timing, +spring: Spring, +decay: Decay, +SpringUtils: SpringUtilsModule, +event: Event, +useValue: UseValue, +useAnimatedGestureHandler: UseAnimatedGestureHandler, +useSharedValue: UseSharedValue, +useDerivedValue: UseDerivedValue, +useAnimatedStyle: UseAnimatedStyle, +withSpring: WithSpring, +withTiming: WithTiming, +runOnJS: RunOnJS, +cancelAnimation: CancelAnimation, ... }; }