{"commit":{"authorEmail":"chenglou92@gmail.com","revision":"3c1e0f0a8cf693c0e510ff8749b201d14f7ab9b8","authoredAt":"2013-10-31T21:10:19-04:00","subject":"split add-ons into subsections","shortRevision":"3c1e0f0a8c","authorName":"Cheng Lou"},"files":[{"status":"M","path":"docs\/_config.yml"},{"status":"M","path":"docs\/docs\/09-addons.md"},{"status":"A","path":"docs\/docs\/09.1-animation.md"},{"status":"A","path":"docs\/docs\/09.2-form-input-binding-sugar.md"}],"patch":"diff --git a\/docs\/_config.yml b\/docs\/_config.yml\nindex 7e26caf05b..2ad77dcc7f 100644\n--- a\/docs\/_config.yml\n+++ b\/docs\/_config.yml\n@@ -53,6 +53,11 @@ nav_docs_sections:\n title: Tooling Integration\n - id: addons\n title: Add-ons\n+ subitems:\n+ - id: animation\n+ title: Animation\n+ - id: form-input-binding-sugar\n+ title: Form Input Binding Sugar\n - id: examples\n title: Examples\n - title: Reference\ndiff --git a\/docs\/docs\/09-addons.md b\/docs\/docs\/09-addons.md\nindex 30bacadc77..26edf99fbd 100644\n--- a\/docs\/docs\/09-addons.md\n+++ b\/docs\/docs\/09-addons.md\n@@ -4,207 +4,9 @@ title: Add-ons\n layout: docs\n permalink: addons.html\n prev: tooling-integration.html\n-next: examples.html\n+next: animation.html\n ---\n \n `React.addons` is where we park some useful utilities for building React apps. **These should be considered experimental** but will eventually be rolled into core or a blessed utilities library.\n \n-## CSS Animation and Transitions\n-\n-`ReactTransitions` is an easy way to perform CSS transitions and animations when a React component enters or leaves the DOM. `ReactTransitions` is inspired by the excellent [ng-animate](http:\/\/www.nganimate.org\/) library.\n-\n-### Getting Started\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-\n-```javascript{22-24}\n-\/** @jsx React.DOM *\/\n-\n-var ReactTransitionGroup = React.addons.TransitionGroup;\n-\n-var TodoList = React.createClass({\n- getInitialState: function() {\n- return {items: ['hello', 'world', 'click', 'me']};\n- },\n- handleAdd: function() {\n- var newItems =\n- this.state.items.concat([prompt('Enter some text')]);\n- this.setState({items: newItems});\n- },\n- handleRemove: function(i) {\n- var newItems = this.state.items;\n- newItems.splice(i, 1)\n- this.setState({items: newItems});\n- },\n- render: function() {\n- var items = this.state.items.map(function(item, i) {\n- return (\n-

\n- {item}\n- <\/div>\n- );\n- }.bind(this));\n- return (\n-

\n-

dillon1000/react

Files changed