diff --git a/Libraries/Animated/createAnimatedComponent_EXPERIMENTAL.js b/Libraries/Animated/createAnimatedComponent_EXPERIMENTAL.js index 0e84b103b0b..a7d5f8169e5 100644 --- a/Libraries/Animated/createAnimatedComponent_EXPERIMENTAL.js +++ b/Libraries/Animated/createAnimatedComponent_EXPERIMENTAL.js @@ -10,6 +10,7 @@ import useAnimatedProps from './useAnimatedProps'; import useMergeRefs from '../Utilities/useMergeRefs'; +import StyleSheet from '../StyleSheet/StyleSheet'; import * as React from 'react'; /** @@ -25,6 +26,23 @@ export default function createAnimatedComponent( ); const ref = useMergeRefs(callbackRef, forwardedRef); - return ; + // Some components require explicit passthrough values for animation + // to work properly. For example, if an animated component is + // transformed and Pressable, onPress will not work after transform + // without these passthrough values. + // $FlowFixMe[prop-missing] + const {passthroughAnimatedPropExplicitValues, style} = reducedProps; + const {style: passthroughStyle, ...passthroughProps} = + passthroughAnimatedPropExplicitValues ?? {}; + const mergedStyle = StyleSheet.compose(style, passthroughStyle); + + return ( + + ); }); }