From dad1d2a38f0a46d1aeeac9e8f1afe39196d6408b Mon Sep 17 00:00:00 2001
From: David Neubauer <davidneub@gmail.com>
Date: Fri, 8 May 2015 20:31:11 +0200
Subject: [PATCH] added animate initial mounting section to animation docs

---
 docs/10.1-animation.md | 35 ++++++++++++++++++++++++++++++++++-
 1 file changed, 34 insertions(+), 1 deletion(-)

diff --git a/docs/10.1-animation.md b/docs/10.1-animation.md
index 4bbd4340..ed0cde5a 100644
--- a/docs/10.1-animation.md
+++ b/docs/10.1-animation.md
@@ -84,9 +84,42 @@ You'll notice that when you try to remove an item `ReactCSSTransitionGroup` keep
 }
 ```
 
+### Animate Initial Mounting
+
+`ReactCSSTransitionGroup` provides the optional prop `transitionAppear`, to add an extra transition phase at the initial mount of the component. There is generally no transition phase at the initial mount as the default value of `transitionAppear` is `false`. Following an example which passes the prop `transitionAppear` with the value `true`.
+
+```javascript{3-5}
+  render: function() {
+    return (
+      <ReactCSSTransitionGroup transitionName="example" transitionAppear="true">
+        <h1>Fading at Initial Mount</h1>
+      </ReactCSSTransitionGroup>
+    );
+  }
+```
+
+During the initial mount `ReactCSSTransitionGroup` will get the `example-appear` CSS class and the `example-appear-active` CSS class added in the next tick.
+
+```css
+.example-appear {
+  opacity: 0.01;
+  transition: opacity .5s ease-in;
+}
+
+.example-appear.example-appear-active {
+  opacity: 1;
+}
+```
+
+At the initial mount, all children of the `ReactCSSTransitionGroup` will `appear` but not `enter`. However, all children later added to an existing `ReactCSSTransitionGroup` will `enter` but not `appear`.
+
+> Note:
+>
+> The prop `transitionAppear` was added to `ReactCSSTransitionGroup` in version `0.13`. To maintain backwards compatibility, the default value is set to `false`.
+
 ### Animation Group Must Be Mounted To Work
 
-In order for it to apply transitions to its children, the `ReactCSSTransitionGroup` must already be mounted in the DOM. The example below would not work, because the `ReactCSSTransitionGroup` is being mounted along with the new item, instead of the new item being mounted within it. Compare this to the [Getting Started](#getting-started) section above to see the difference.
+In order for it to apply transitions to its children, the `ReactCSSTransitionGroup` must already be mounted in the DOM or the prop `transitionAppear` must be set to `true`. The example below would not work, because the `ReactCSSTransitionGroup` is being mounted along with the new item, instead of the new item being mounted within it. Compare this to the [Getting Started](#getting-started) section above to see the difference.
 
 ```javascript{12-15}
   render: function() {