diff --git a/native/calendar/calendar-input-bar.react.js b/native/calendar/calendar-input-bar.react.js
--- a/native/calendar/calendar-input-bar.react.js
+++ b/native/calendar/calendar-input-bar.react.js
@@ -1,10 +1,12 @@
 // @flow
 
 import * as React from 'react';
-import { View, Text } from 'react-native';
+import { Text } from 'react-native';
+import { FadeIn, FadeOut } from 'react-native-reanimated';
 
 import Button from '../components/button.react.js';
 import { useStyles } from '../themes/colors.js';
+import { AnimatedView } from '../types/styles.js';
 
 type Props = {
   +onSave: () => void,
@@ -13,15 +15,21 @@
 function CalendarInputBar(props: Props): React.Node {
   const styles = useStyles(unboundStyles);
   const inactiveStyle = props.disabled ? styles.inactiveContainer : undefined;
+  const style = React.useMemo(
+    () => [styles.container, inactiveStyle],
+    [styles.container, inactiveStyle],
+  );
   return (
-    <View
-      style={[styles.container, inactiveStyle]}
+    <AnimatedView
+      style={style}
       pointerEvents={props.disabled ? 'none' : 'auto'}
+      entering={FadeIn}
+      exiting={FadeOut}
     >
       <Button onPress={props.onSave} iosActiveOpacity={0.5}>
         <Text style={styles.saveButtonText}>Save</Text>
       </Button>
-    </View>
+    </AnimatedView>
   );
 }
 
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
--- a/native/flow-typed/npm/react-native-reanimated_v2.x.x.js
+++ b/native/flow-typed/npm/react-native-reanimated_v2.x.x.js
@@ -44,9 +44,40 @@
 
   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 ViewImpl extends React$Component<{
+    +entering?:
+      | ReanimatedAnimationBuilder
+      | EntryExitAnimationFunction
+      | Keyframe,
+    +exiting?:
+      | ReanimatedAnimationBuilder
+      | EntryExitAnimationFunction
+      | Keyframe,
+    ...
+  }> { }
+  declare class TextImpl extends React$Component<{
+    +entering?:
+      | ReanimatedAnimationBuilder
+      | EntryExitAnimationFunction
+      | Keyframe,
+    +exiting?:
+      | ReanimatedAnimationBuilder
+      | EntryExitAnimationFunction
+      | Keyframe,
+    ...
+  }> { }
+  declare class ImageImpl extends React$Component<{
+    +entering?:
+      | ReanimatedAnimationBuilder
+      | EntryExitAnimationFunction
+      | Keyframe,
+    +exiting?:
+      | ReanimatedAnimationBuilder
+      | EntryExitAnimationFunction
+      | Keyframe,
+    ...
+  }> { }
+
   declare class CodeImpl extends React$Component<{
     +exec: NodeImpl,
     ...
@@ -336,7 +367,7 @@
 
   declare type BaseBuilderAnimationConfig = {|
     ...BaseLayoutAnimationConfig,
-    rotate?: number | string,
+    +rotate?: number | string,
   |};
 
   declare type LayoutAnimationAndConfig = [
@@ -438,6 +469,18 @@
     build(): AnimationConfigFunction<ExitAnimationsValues>;
   }
 
+  declare export class FadeIn extends ComplexAnimationBuilder {
+    static createInstance(): FadeIn;
+
+    build(): AnimationConfigFunction<EntryAnimationsValues>;
+  }
+
+  declare export class FadeOut extends ComplexAnimationBuilder {
+    static createInstance(): FadeOut;
+
+    build(): AnimationConfigFunction<ExitAnimationsValues>;
+  }
+
   declare type $SyntheticEvent<T: { ... }> = {
     +nativeEvent: $ReadOnly<$Exact<T>>,
     ...