Merge pull request pmndrs#123 from Cryrivers/master

Add onStart callback

.size-snapshot.json

@@ -10,8 +10,8 @@
     "gzipped": 2141
   },
   "dist/web.umd.js": {
-    "bundled": 86570,
-    "minified": 35738,
-    "gzipped": 12088
+    "bundled": 86671,
+    "minified": 35777,
+    "gzipped": 12100
   }
 }

API.md

@@ -38,6 +38,8 @@ class Spring extends React.PureComponent {
     from: PropTypes.object,
     // Animates to ...
     to: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
+    // Callback when the animation starts to animate
+    onStart: PropTypes.func,
     // Callback when the animation comes to a still-stand
     onRest: PropTypes.func,
     // Frame by frame callback, first argument passed is the animated value

index.d.ts

@@ -27,6 +27,10 @@ declare module 'react-spring' {
      * @default {}
      */
     to: DS;
+    /**
+     * Callback when the animation starts to animate
+     */
+    onStart?: () => void;
     /**
      * Callback when the animation comes to a still-stand
      */

package.json

@@ -60,6 +60,7 @@
     "@babel/preset-env": "7.0.0-beta.49",
     "@babel/preset-react": "7.0.0-beta.49",
     "@babel/preset-stage-3": "^7.0.0-beta.49",
+    "@types/react": "^16.4.0",
     "babel-core": "7.0.0-bridge.0",
     "babel-jest": "^23.0.1",
     "babel-plugin-transform-react-remove-prop-types": "0.4.13",

src/Spring.js

@@ -32,6 +32,7 @@ export default class Spring extends React.Component {
     to: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
     from: PropTypes.object,
     native: PropTypes.bool,
+    onStart: PropTypes.func,
     onRest: PropTypes.func,
     onFrame: PropTypes.func,
     children: PropTypes.oneOfType([
@@ -197,6 +198,8 @@ export default class Spring extends React.Component {
   }
 
   start() {
+    const { onStart } = this.props
+
     let fn = () =>
       this.getAnimations().forEach(animation => animation.start(resolve))
     let resolve,
@@ -206,6 +209,8 @@ export default class Spring extends React.Component {
       return (this.timeout = setTimeout(() => fn(), this.props.delay))
     }
 
+    if (onStart) onStart()
+
     fn()
     return promise
   }

yarn.lock

@@ -658,6 +658,12 @@
   version "10.1.2"
   resolved "https://registry.yarnpkg.com/@types/node/-/node-10.1.2.tgz#1b928a0baa408fc8ae3ac012cc81375addc147c6"
 
+"@types/react@^16.4.0":
+  version "16.4.0"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-16.4.0.tgz#f7f639837bf1f8635f57616b12a1b0d193b6343a"
+  dependencies:
+    csstype "^2.2.0"
+
 "@webassemblyjs/[email protected]":
   version "1.4.3"
   resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.4.3.tgz#3b3f6fced944d8660273347533e6d4d315b5934a"
@@ -1711,6 +1717,10 @@ [email protected], "cssom@>= 0.3.2 < 0.4.0":
   dependencies:
     cssom "0.3.x"
 
+csstype@^2.2.0:
+  version "2.5.4"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.5.4.tgz#93850187209b6d0a71d30a85abc95a6ae3f3e8cd"
+
 cyclist@~0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-0.2.2.tgz#1b33792e11e914a2fd6d6ed6447464444e5fa640"