From 59d7678fad966cb4036c59511d1f2b2f4a111203 Mon Sep 17 00:00:00 2001
From: dielduarte <magdiel.kesller@gmail.com>
Date: Fri, 12 May 2017 19:56:18 -0300
Subject: [PATCH 1/3] export BaseAnimation Component

---
 src/index.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/index.js b/src/index.js
index b72da56..e23940e 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,3 +1,4 @@
+import BaseAnimation from './BaseAnimation';
 import Flash from './Attention/Flash';
 import HeadShake from './Attention/HeadShake';
 import Jello from './Attention/Jello';
@@ -164,5 +165,6 @@ export {
   ZoomOutDown,
   ZoomOutLeft,
   ZoomOutRight,
-  ZoomOutUp
+  ZoomOutUp,
+  BaseAnimation
 };

From 1d404b1263118ff10ee4cd78f9bd324f8c4de07e Mon Sep 17 00:00:00 2001
From: dielduarte <magdiel.kesller@gmail.com>
Date: Fri, 12 May 2017 20:07:12 -0300
Subject: [PATCH 2/3] create documentation for how extend BaseAnimation

---
 README.md | 34 ++++++++++++++++++++++++++++++++++
 1 file changed, 34 insertions(+)

diff --git a/README.md b/README.md
index d12fe2e..5a78d84 100644
--- a/README.md
+++ b/README.md
@@ -65,6 +65,40 @@ Example:
 
 See all examples [here](https://dielduarte.github.io/animate-css-styled-components/)
 
+## How to create custom styled animations
+
+You can import BaseAnimation component and create your custom animation
+
+Example:
+
+```
+  import { BaseAnimation } from 'animate-css-styled-components';
+  
+  //create your custom animation
+  const SlideOutDownAnimation = keyframes`
+    from {
+      transform: translate3d(0, 0, 0);
+    }
+  
+    to {
+      visibility: hidden;
+      transform: translate3d(0, 100%, 0);
+    }
+  `;
+  
+  //extend BaseAnimation component and create 
+  //your custom styled animation
+  const SlideOutDown = styled(BaseAnimation)`
+    animation-name: ${SlideOutDownAnimation};
+  `;
+   
+  //export your custom styled animation  
+  export default SlideOutDown;
+```
+
+now your animation is a styled-component and you can use this like any other styled-component, 
+passing the all BaseAnimation [props](https://github.com/dielduarte/animate-css-styled-components#props).
+
 # WIP
  - tests with jest
  - `animate` component, wrapper for all animations with a only component.

From a80707bea9d3514da48ae4a02c805a03ed23d566 Mon Sep 17 00:00:00 2001
From: dielduarte <magdiel.kesller@gmail.com>
Date: Fri, 12 May 2017 20:08:05 -0300
Subject: [PATCH 3/3] Extend base animation feature close #3

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index fb4e907..0360c73 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "animate-css-styled-components",
-  "version": "0.0.13",
+  "version": "0.0.14",
   "description": "port of animate.css for styled-components",
   "main": "./lib/index.js",
   "scripts": {