Add zoomOutLeft animation

Author: Brandon Dail

src/components/zoomOutLeft.js

@@ -0,0 +1,31 @@
+// @flow
+import {
+  compose,
+  scale3d,
+  scale,
+  translate3d,
+} from '../utils';
+import type { Animation } from '../types';
+
+const scale3dAndTranslate = compose(scale3d, translate3d);
+const scaleAndTranslate = compose(scale, translate3d);
+
+const zoomOutLeft: Animation = {
+  '40%': {
+    opacity: 1,
+    transform: scale3dAndTranslate(
+      [0.475, 0.475, 0.475],
+      ['42px', 0, 0]
+    ),
+  },
+  to: {
+    opacity: 0,
+    transform: scaleAndTranslate(
+      0.1,
+      ['-2000px', 0, 0]
+    ),
+    transformOrigin: 'left center',
+  },
+};
+
+export default zoomOutLeft;

src/index.js

@@ -101,3 +101,4 @@ export zoomInUp from './components/zoomInUp';
 /* Zooming exits */
 export zoomOut from './components/zoomOut';
 export zoomOutDown from './components/zoomOutDown';
+export zoomOutLeft from './components/zoomOutLeft';

src/utils.js

@@ -43,6 +43,8 @@ export const scale3d = (
   c: number
 ): string => `scale3d(${a}, ${b}, ${c})`;
 
+export const scale = (a: number) => `scale(${a})`;
+
 export const skewX = (
   deg: number
 ): string => `skewX(${deg}deg)`;