At the moment, new pages are just appearing. There's no subtle animation to ease them in. Let's change that!
We will use a new React component for this, and we can find it in the add-ons build of React. Go back to the React scripts you downloaded in the first chapter and replace all references to react.js with react-with-addons.js.
This gives us access to a new component called CSSTransitionGroup:
render() {
var itemStyle = this.props.itemStyle || {
"minHeight": "40px",
"lineHeight": "40px",
"fontSize": "18px",
"fontFamily": "Helvetica"
};
return <div>
<div>
<button
onClick={this.onInsert}>
create new page
</button>
</div>
<ol>
<React.addons.CSSTransitionGroup
transitionName="page"
transitionEnterTimeout={150}
transitionLeaveTimeout={150}>
...
