React Native: How to use the Animated API for a flip-out animation?

1import { Animated } from "react-native";
2
3function FlipOutView({ visible, children }) {
4  const flipAnim = useRef(new Animated.Value(1)).current;
5
6  useEffect(() => {
7    Animated.timing(flipAnim, {
8      toValue: visible ? 1 : 0,
9      duration: 300,
10      useNativeDriver: true,
11    }).start();
12  }, [visible]);
13
14  const rotateY = flipAnim.interpolate({
15    inputRange: [0, 1],
16    outputRange: ["-180deg", "0deg"],
17  });
18
19  return (
20    <Animated.View style={{
21      opacity: flipAnim,
22      transform: [{ perspective: 1000 }, { rotateY }],
23    }}>
24      {children}
25    </Animated.View>
26  );
27}