From 04ef0262af6f77b898d307d87a49488afda0059a Mon Sep 17 00:00:00 2001
From: Richard van der Hoff <richard@matrix.org>
Date: Wed, 20 Apr 2016 22:21:07 +0100
Subject: [PATCH] Various fixes to the velociraptor

* handle having a single child, rather than an array of children

* Correctly animate children which are added at the same time as the
  Velociraptor, rather than added afterwards

* Set the child to hidden at the end of the initial animation, if that is
  required by the style property.
---
 src/Velociraptor.js | 30 +++++++++++++++---------------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/Velociraptor.js b/src/Velociraptor.js
index 066b1e2d05..a3e013a2b4 100644
--- a/src/Velociraptor.js
+++ b/src/Velociraptor.js
@@ -13,25 +13,24 @@ module.exports = React.createClass({
     displayName: 'Velociraptor',
 
     propTypes: {
-        children: React.PropTypes.array,
+        // either a list of child nodes, or a single child.
+        children: React.PropTypes.any,
+
+        // optional transition information for changing existing children
         transition: React.PropTypes.object,
-        container: React.PropTypes.string
     },
 
     componentWillMount: function() {
         this.children = {};
         this.nodes = {};
-        var self = this;
-        React.Children.map(this.props.children, function(c) {
-            self.children[c.key] = c;
-        });
+        this.componentWillReceiveProps(this.props);
     },
 
     componentWillReceiveProps: function(nextProps) {
         var self = this;
         var oldChildren = this.children;
         this.children = {};
-        React.Children.map(nextProps.children, function(c) {
+        React.Children.toArray(nextProps.children).forEach(function(c) {
             if (oldChildren[c.key]) {
                 var old = oldChildren[c.key];
                 var oldNode = ReactDom.findDOMNode(self.nodes[old.key]);
@@ -92,22 +91,23 @@ module.exports = React.createClass({
                 //console.log("start: "+JSON.stringify(startStyles[i]));
             }
             // and then we animate to the resting state
-            Velocity(domNode, node.props._restingStyle, transitionOpts[i-1]);
+            Velocity(domNode, node.props._restingStyle,
+                     transitionOpts[i-1])
+            .then(() => {
+                // once we've reached the resting state, hide the element if
+                // appropriate
+                domNode.style.visibility = node.props._restingStyle.visibility;
+            });
+
             //console.log("enter: "+JSON.stringify(node.props._restingStyle));
         }
         this.nodes[k] = node;
     },
 
     render: function() {
-        var self = this;
-        var childList = Object.keys(this.children).map(function(k) {
-            return React.cloneElement(self.children[k], {
-                ref: self.collectNode.bind(self, self.children[k].key)
-            });
-        });
         return (
             <span>
-                {childList}
+                {Object.values(this.children)}
             </span>
         );
     },