{"commit":{"authorName":"petehunt","shortRevision":"cadd6cbb6c","revision":"cadd6cbb6c8bf33e87f6d85d97aff2cd5e83f87e","authorEmail":"floydophone@gmail.com","authoredAt":"2014-02-12T11:13:23-08:00","subject":"add ReactCSSTransitionGroup to addons and document it"},"parents":["c0660ea6e03ed7cbdcb85aa72e0641a0a15af0e1"],"body":"","files":[{"path":"docs\/docs\/09.1-animation.md","status":"M"},{"path":"src\/browser\/ReactWithAddons.js","status":"M"}],"patch":"diff --git a\/docs\/docs\/09.1-animation.md b\/docs\/docs\/09.1-animation.md\nindex c3d6c23f5d..a08968ecc9 100644\n--- a\/docs\/docs\/09.1-animation.md\n+++ b\/docs\/docs\/09.1-animation.md\n@@ -7,16 +7,20 @@ prev: addons.html\n next: two-way-binding-helpers.html\n ---\n \n-`ReactTransitions` is an easy way to perform CSS transitions and animations when a React component enters or leaves the DOM. It's inspired by the excellent [ng-animate](http:\/\/www.nganimate.org\/) library.\n+React provides a `ReactTransitionGroup` addon component as a low-level API for animation, and a `ReactCSSTransitionGroup` for easily implementing basic CSS animations and transitions.\n \n-## Getting Started\n+## High-level API: `ReactCSSTransitionGroup`\n \n-`ReactTransitionGroup` is the interface to `ReactTransitions`. This is a simple element that wraps all of the components you are interested in animating. Here's an example where we fade list items in and out.\n+`ReactCSSTransitionGroup` is based on `ReactTransitionGroup` and is an easy way to perform CSS transitions and animations when a React component enters or leaves the DOM. It's inspired by the excellent [ng-animate](http:\/\/www.nganimate.org\/) library.\n+\n+### Getting Started\n+\n+`ReactCSSTransitionGroup` is the interface to `ReactTransitions`. This is a simple element that wraps all of the components you are interested in animating. Here's an example where we fade list items in and out.\n \n ```javascript{22-24}\n \/** @jsx React.DOM *\/\n \n-var ReactTransitionGroup = React.addons.TransitionGroup;\n+var ReactCSSTransitionGroup = React.addons.TransitionGroup;\n \n var TodoList = React.createClass({\n getInitialState: function() {\n@@ -43,16 +47,16 @@ var TodoList = React.createClass({\n return (\n

dillon1000/react

Files changed