Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Set missing viewRef for animatedProps (#1819)
## Description Fixes: #1808 If someone uses `animatedProps` instead of `style`, we didn't set `viewRef` and without properly setting `viewRef` we weren't able to update any web component property. ## Test code and steps to reproduce <details> <summary>code</summary> ```js import * as React from "react"; import { StyleSheet, View, Button } from "react-native"; import Animated, { useAnimatedProps, useSharedValue, } from "react-native-reanimated"; Animated.addWhitelistedNativeProps({ pointerEvents: true, }); Animated.addWhitelistedUIProps({ pointerEvents: true, }); export default function App() { const pointerEvents = useSharedValue("auto"); const bottomProps = useAnimatedProps(() => ({ pointerEvents: pointerEvents.value, })); const toggle = () => { if (pointerEvents.value === "none") { pointerEvents.value = "auto"; } else { pointerEvents.value = "none"; } console.log("pointer events:", pointerEvents.value); }; return ( <View style={styles.container}> <View style={styles.half}> <Button color="black" title="Toggle Pointer Events" onPress={toggle} /> </View> <Animated.View style={[styles.half, styles.bottom]} animatedProps={bottomProps} > <Button color="black" title="Press me?" onPress={() => alert("has pointer events!")} /> </Animated.View> </View> ); } const styles = StyleSheet.create({ container: { flex: 1 }, half: { flex: 1, backgroundColor: "hotpink", justifyContent: "center", alignItems: "center", }, bottom: { backgroundColor: "green", }, }); ``` </details> ## Checklist - [x] Included code example that can be used to test this change - [x] Ensured that CI passes
- Loading branch information