Add zoomInUp animation

Also fixes a cubic-bezier value in the other zoom animations

Author: Brandon Dail

src/components/zoomInDown.js

@@ -31,7 +31,7 @@ const zoomInDown: Animation = {
     ),
     animationTimingFunction: cubicBezier(
       0.175,
-      0.855,
+      0.885,
       0.320,
       1
     ),

src/components/zoomInLeft.js

@@ -31,7 +31,7 @@ const zoomInLeft: Animation = {
     ),
     animationTimingFunction: cubicBezier(
       0.175,
-      0.855,
+      0.885,
       0.320,
       1
     ),

src/components/zoomInRight.js

@@ -31,7 +31,7 @@ const zoomInRight: Animation = {
     ),
     animationTimingFunction: cubicBezier(
       0.175,
-      0.855,
+      0.885,
       0.320,
       1
     ),

src/components/zoomInUp.js

@@ -0,0 +1,41 @@
+// @flow
+import {
+  compose,
+  scale3d,
+  translate3d,
+  cubicBezier,
+} from '../utils';
+import type { Animation } from '../types';
+
+const scaleAndTranslate = compose(scale3d, translate3d);
+
+const zoomInUp: Animation = {
+  from: {
+    opacity: 0,
+    transform: scaleAndTranslate(
+      [0.1, 0.1, 0.1],
+      [0, '1000px', 0]
+    ),
+    animationTimingFunction: cubicBezier(
+      0.550,
+      0.055,
+      0.675,
+      0.190
+    ),
+  },
+  '60%': {
+    opacity: 1,
+    transform: scaleAndTranslate(
+      [0.475, 0.475, 0.475],
+      [0, '-60px', 0]
+    ),
+    animationTimingFunction: cubicBezier(
+      0.175,
+      0.885,
+      0.320,
+      1
+    ),
+  },
+};
+
+export default zoomInUp;

src/index.js

@@ -96,3 +96,4 @@ export zoomIn from './components/zoomIn';
 export zoomInDown from './components/zoomInDown';
 export zoomInLeft from './components/zoomInLeft';
 export zoomInRight from './components/zoomInRight';
+export zoomInUp from './components/zoomInUp';