fixes pmndrs#11

API.md

@@ -36,7 +36,7 @@ class Spring extends React.PureComponent {
         // Frame by frame callback, first argument passed is the animated value
         onFrame: PropTypes.func,
         // Takes a function that receives interpolated styles
-        children: PropTypes.func,
+        children: PropTypes.oneOfType([PropTypes.func, PropTypes.arrayOf(PropTypes.func)]),
         // Same as children, but takes precedence if present
         render: PropTypes.func,
         // Prevents animation if true, you can also pass individual keys
@@ -65,7 +65,7 @@ class Transition extends React.PureComponent {
         enter: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
         // Unmpount styles
         leave: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
-        // 
+        //
         update: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
         // A collectiomn of unique keys that must match with the childrens order
         // Can be omitted if children/render aren't an array
@@ -149,3 +149,17 @@ class Parallax extends React.PureComponent {
     }
 }
 ```
+
+# Keyframes
+
+```jsx
+export default class Keyframes extends React.Component {
+    static propTypes = {
+        // Callback which receives a function that that takes two arguments:
+        //     script={async next => {
+        //         next(primitive, props)
+        //     }}
+        script: PropTypes.func,
+    }
+}
+```

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 4.0.2
+
+Keyframe api, various bugfixes
+
 ## 3.1.0
 
 Breaking changes:

examples/webpack.config.js

@@ -52,6 +52,7 @@ module.exports = mode => {
             modules: [path.resolve('./'), 'node_modules'],
             extensions: ['.js', '.jsx'],
             alias: {
+                //'react': path.resolve('node_modules/react'),
                 //'react-spring': path.resolve('../src'),
                 lodash: path.resolve(__dirname, 'node_modules/lodash-es'),
             },

package.json

@@ -1,6 +1,6 @@
 {
     "name": "react-spring",
-    "version": "4.0.1-beta.1",
+    "version": "4.0.2",
     "description": "Animate React with ease",
     "main": "dist/react-spring",
     "module": "dist/react-spring.es",

readme.md

@@ -138,7 +138,7 @@ import { Parallax } from 'react-spring'
 
 <img src="assets/keyframes-trail.gif" width="285" />
 
-`Keyframes` orchestrates animations in a script that you provide. Theoretically you can even switch between primitives, for instance going from a Spring, to a Trail, to a Transition. It tries its best to remember the last state so that animations are additive. Animation can be awaited and return current props. The API is still experiemental and only available under the `@beta` tag.
+`Keyframes` orchestrates animations in a script that you provide. Theoretically you can even switch between primitives, for instance going from a Spring, to a Trail, to a Transition. It tries its best to remember the last state so that animations are additive. Animation can be awaited and return current props. Be warned: the keyframe API is still highly experiemental and can be subject to changes.
 
 ```jsx
 import { Keyframes, Spring } from 'react-spring'

src/Transition.js

@@ -110,10 +110,9 @@ export default class Transition extends React.PureComponent {
 
         // Re-order list
         let ordered = keys.map(key => transitions.find(child => child.key === key))
-        deleted.forEach(key => {
-            let index = transitions.findIndex(child => child.key === key)
-            let child = transitions.find(child => child.key === key)
-            if (child) ordered = [...ordered.slice(0, index), child, ...ordered.slice(index)]
+        transitions.forEach((transition, index) => {
+            if (transition.destroy && !ordered.find(t => t.key === transition.key))
+                ordered = [...ordered.slice(0, index), transition, ...ordered.slice(index)]
         })
 
         // Push new state