Add CSSMotion component

[zombieJ]

• Add CSSMotion component to support mix className & style in react management by render props
• Update doc
• Add an example
• Add test case

ref discuss: #40

[yesmeck]

是在这里的。

[yesmeck]

需要 promise 要说明下。

[coveralls]

Coverage increased (+0.08%) to 99.73% when pulling 8db8a4d on csstrans into e184e9f on 3.0.0.

[afc163]

这种方式不好，更彻底的解决方式是在 ummount 之后把没触发的 raf 都 cancel 掉。

[zombieJ]

👌

[zombieJ]

这个看起来还得留着，用户如果在 onMotionEnd 的时候父组件 setState 把这个子组件删了。React 会同步执行，这个时候运行到下面的 setState 就报 warning 了。

[jljsj33]

要改名的节凑？？？还有这回调有点多。。。会晕。。。。

[zombieJ]

@jljsj33 要改名的节凑？？？还有这回调有点多。。。会晕。。。。

加了个新的组件，旧的准备慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢慢废弃掉~

其实就是 Transition 可以加自定义 style

[jljsj33]

赞！！！我很早就想整一个用 transition 来完成动画的组件，，但这写法感觉为什么跟 react-motion 差不多，，有点多。。为什么不直接把 show 写在下面，，跟 queue-anim 和原来的写法保持一致呢，，不然我 scroll-anim 里要加一种形式了。。。

<CSSMotion
 motionName="transition" 
>
{show && <div key="1">test</div>}
</CSSMotion>

还有 static isCSSMotion = true; 加一个。。。

[zombieJ]

render props 非常适合动画场景于是就天下大同了，show 放在外面元素就不用像以前一样需要写检测子元素是否变化的代码了。
CSSMotion 是一个最基本的 Transition 组件，所以把逻辑做的很薄。

[jljsj33]

我还是觉得那样写方便。。。如果这是最基本的组件，，是不是可以考虑直接 <CSSMotion>test</CSSMotion>， 逻辑的东西可以在外面套一层 group 呢。。。其实当时这做法承玉做的挺好的。。后面我整的几个动画组件都是照他的做法来实现的，，而且用起来也挺方便的。。外面的月亮不一定是最圆的。。。只是我个人的建议。。。。

[jljsj33]

当时为什么要写动效组件，，也就是这原因，，看 react-motion 逻辑太薄，写起来太麻烦，才选择自已写动画组件的。。。

[zombieJ]

这个看需求吧，目前为止 CSSMotion 可以覆盖 rc 和 antd 要用到的场景了。需求强烈就搞个 CSSMotionGroup 管理 group animation。

[jljsj33]

额，，没懂我的意思？？不是 group 的问题，，好吧，，随便你整吧。。反正这个组件是在组件里使用的。其实你这种写法我为什么不直接用 react-transition-group 和 react-motion。为毛要重写个？？有啥意义？？？

[zombieJ]

嗯？你可以再说说是什么。

CSSMotion 的主要目的是给 transition 的每个状态都提供一个接口，在 transition 每个状态切换时都有一帧用于让用户可以根据当前实际 dom 来设置 style。参考的就是 react-transition-group CSSTransition，只是多了个返回 style 的功能。