react-spring - npm Package Compare versions

Comparing version 4.1.8-beta.1 to 4.1.8-beta.2

dist/NumericalSpring.cjs.js

@@ -9,5 +9,6 @@ 'use strict';
 var _inheritsLoose = _interopDefault(require('@babel/runtime/helpers/builtin/inheritsLoose'));
+var _extends = _interopDefault(require('@babel/runtime/helpers/builtin/extends'));
 var _objectWithoutProperties = _interopDefault(require('@babel/runtime/helpers/builtin/objectWithoutProperties'));
+var React = _interopDefault(require('react'));
 var _assertThisInitialized = _interopDefault(require('@babel/runtime/helpers/builtin/assertThisInitialized'));
-var React = _interopDefault(require('react'));
 
@@ -202,2 +203,204 @@ var Animated =
 
+var AnimatedStyle =
+/*#__PURE__*/
+function (_AnimatedWithChildren) {
+  _inheritsLoose(AnimatedStyle, _AnimatedWithChildren);
+
+  function AnimatedStyle(style) {
+    var _this;
+
+    _this = _AnimatedWithChildren.call(this) || this;
+    style = style || {};
+    _this._style = style;
+    return _this;
+  }
+
+  var _proto = AnimatedStyle.prototype;
+
+  _proto.__getValue = function __getValue() {
+    var style = {};
+
+    for (var key in this._style) {
+      var value = this._style[key];
+      if (value instanceof Animated) style[key] = value.__getValue();else style[key] = value;
+    }
+
+    return style;
+  };
+
+  _proto.__getAnimatedValue = function __getAnimatedValue() {
+    var style = {};
+
+    for (var key in this._style) {
+      var value = this._style[key];
+      if (value instanceof Animated) style[key] = value.__getAnimatedValue();
+    }
+
+    return style;
+  };
+
+  _proto.__attach = function __attach() {
+    for (var key in this._style) {
+      var value = this._style[key];
+      if (value instanceof Animated) value.__addChild(this);
+    }
+  };
+
+  _proto.__detach = function __detach() {
+    for (var key in this._style) {
+      var value = this._style[key];
+      if (value instanceof Animated) value.__removeChild(this);
+    }
+  };
+
+  return AnimatedStyle;
+}(AnimatedWithChildren);
+
+var AnimatedProps =
+/*#__PURE__*/
+function (_Animated) {
+  _inheritsLoose(AnimatedProps, _Animated);
+
+  function AnimatedProps(props, callback) {
+    var _this;
+
+    _this = _Animated.call(this) || this;
+
+    if (props.style) {
+      props = _objectSpread({}, props, {
+        style: new AnimatedStyle(props.style)
+      });
+    }
+
+    _this._props = props;
+    _this._callback = callback;
+
+    _this.__attach();
+
+    return _this;
+  }
+
+  var _proto = AnimatedProps.prototype;
+
+  _proto.__getValue = function __getValue() {
+    var props = {};
+
+    for (var key in this._props) {
+      var value = this._props[key];
+      if (value instanceof Animated) props[key] = value.__getValue();else props[key] = value;
+    }
+
+    return props;
+  };
+
+  _proto.__getAnimatedValue = function __getAnimatedValue() {
+    var props = {};
+
+    for (var key in this._props) {
+      var value = this._props[key];
+      if (value instanceof Animated) props[key] = value.__getAnimatedValue();
+    }
+
+    return props;
+  };
+
+  _proto.__attach = function __attach() {
+    for (var key in this._props) {
+      var value = this._props[key];
+      if (value instanceof Animated) value.__addChild(this);
+    }
+  };
+
+  _proto.__detach = function __detach() {
+    for (var key in this._props) {
+      var value = this._props[key];
+      if (value instanceof Animated) value.__removeChild(this);
+    }
+  };
+
+  _proto.update = function update() {
+    this._callback();
+  };
+
+  return AnimatedProps;
+}(Animated);
+
+function createAnimatedComponent(Component) {
+  return (
+    /*#__PURE__*/
+    function (_React$Component) {
+      _inheritsLoose(AnimatedComponent, _React$Component);
+
+      function AnimatedComponent() {
+        return _React$Component.apply(this, arguments) || this;
+      }
+
+      var _proto = AnimatedComponent.prototype;
+
+      _proto.componentWillUnmount = function componentWillUnmount() {
+        this._propsAnimated && this._propsAnimated.__detach();
+      };
+
+      _proto.setNativeProps = function setNativeProps(props) {
+        var didUpdate = Globals.ApplyAnimatedValues.fn(this.node, props, this);
+        if (didUpdate === false) this.forceUpdate();
+      };
+
+      _proto.componentWillMount = function componentWillMount() {
+        this.attachProps(this.props);
+      };
+
+      _proto.attachProps = function attachProps(nextProps) {
+        var _this = this;
+
+        var oldPropsAnimated = this._propsAnimated; // The system is best designed when setNativeProps is implemented. It is
+        // able to avoid re-rendering and directly set the attributes that
+        // changed. However, setNativeProps can only be implemented on leaf
+        // native components. If you want to animate a composite component, you
+        // need to re-render it. In this case, we have a fallback that uses
+        // forceUpdate.
+
+        var callback = function callback() {
+          if (_this.node) {
+            var didUpdate = Globals.ApplyAnimatedValues.fn(_this.node, _this._propsAnimated.__getAnimatedValue(), _this);
+            if (didUpdate === false) _this.forceUpdate();
+          }
+        };
+
+        this._propsAnimated = new AnimatedProps(nextProps, callback); // When you call detach, it removes the element from the parent list
+        // of children. If it goes to 0, then the parent also detaches itself
+        // and so on.
+        // An optimization is to attach the new elements and THEN detach the old
+        // ones instead of detaching and THEN attaching.
+        // This way the intermediate state isn't to go to 0 and trigger
+        // this expensive recursive detaching to then re-attach everything on
+        // the very next operation.
+
+        oldPropsAnimated && oldPropsAnimated.__detach();
+      };
+
+      _proto.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
+        this.attachProps(nextProps);
+      };
+
+      _proto.render = function render() {
+        var _this2 = this;
+
+        var _propsAnimated$__getV = this._propsAnimated.__getValue(),
+            style = _propsAnimated$__getV.style,
+            other = _objectWithoutProperties(_propsAnimated$__getV, ["style"]);
+
+        return React.createElement(Component, _extends({}, other, {
+          style: Globals.ApplyAnimatedValues.transform(style),
+          ref: function ref(node) {
+            return _this2.node = node;
+          }
+        }));
+      };
+
+      return AnimatedComponent;
+    }(React.Component)
+  );
+}
+
 var _uniqueId = 0;
@@ -497,4 +700,4 @@ /**
 
-function controller$1(value, config, impl) {
-  return maybeVectorAnim(value, config, controller$1, impl) || {
+function controller(value, config, impl) {
+  return maybeVectorAnim(value, config, controller, impl) || {
     start: function start(callback) {
@@ -512,126 +715,2 @@ var singleValue = value;
 
-var AnimatedStyle =
-/*#__PURE__*/
-function (_AnimatedWithChildren) {
-  _inheritsLoose(AnimatedStyle, _AnimatedWithChildren);
-
-  function AnimatedStyle(style) {
-    var _this;
-
-    _this = _AnimatedWithChildren.call(this) || this;
-    style = style || {};
-    _this._style = style;
-    return _this;
-  }
-
-  var _proto = AnimatedStyle.prototype;
-
-  _proto.__getValue = function __getValue() {
-    var style = {};
-
-    for (var key in this._style) {
-      var value = this._style[key];
-      if (value instanceof Animated) style[key] = value.__getValue();else style[key] = value;
-    }
-
-    return style;
-  };
-
-  _proto.__getAnimatedValue = function __getAnimatedValue() {
-    var style = {};
-
-    for (var key in this._style) {
-      var value = this._style[key];
-      if (value instanceof Animated) style[key] = value.__getAnimatedValue();
-    }
-
-    return style;
-  };
-
-  _proto.__attach = function __attach() {
-    for (var key in this._style) {
-      var value = this._style[key];
-      if (value instanceof Animated) value.__addChild(this);
-    }
-  };
-
-  _proto.__detach = function __detach() {
-    for (var key in this._style) {
-      var value = this._style[key];
-      if (value instanceof Animated) value.__removeChild(this);
-    }
-  };
-
-  return AnimatedStyle;
-}(AnimatedWithChildren);
-
-var AnimatedProps =
-/*#__PURE__*/
-function (_Animated) {
-  _inheritsLoose(AnimatedProps, _Animated);
-
-  function AnimatedProps(props, callback) {
-    var _this;
-
-    _this = _Animated.call(this) || this;
-
-    if (props.style) {
-      props = _objectSpread({}, props, {
-        style: new AnimatedStyle(props.style)
-      });
-    }
-
-    _this._props = props;
-    _this._callback = callback;
-
-    _this.__attach();
-
-    return _this;
-  }
-
-  var _proto = AnimatedProps.prototype;
-
-  _proto.__getValue = function __getValue() {
-    var props = {};
-
-    for (var key in this._props) {
-      var value = this._props[key];
-      if (value instanceof Animated) props[key] = value.__getValue();else props[key] = value;
-    }
-
-    return props;
-  };
-
-  _proto.__getAnimatedValue = function __getAnimatedValue() {
-    var props = {};
-
-    for (var key in this._props) {
-      var value = this._props[key];
-      if (value instanceof Animated) props[key] = value.__getAnimatedValue();
-    }
-
-    return props;
-  };
-
-  _proto.__attach = function __attach() {
-    for (var key in this._props) {
-      var value = this._props[key];
-      if (value instanceof Animated) value.__addChild(this);
-    }
-  };
-
-  _proto.__detach = function __detach() {
-    for (var key in this._props) {
-      var value = this._props[key];
-      if (value instanceof Animated) value.__removeChild(this);
-    }
-  };
-
-  _proto.update = function update() {
-    this._callback();
-  };
-
-  return AnimatedProps;
-}(Animated);
-
 // Important note: start() and stop() will only be called at most once.
@@ -927,5 +1006,12 @@ // Once an animation has been stopped or finished its course, it will
       var fromValue = from[name] !== undefined ? from[name] : value;
-      var toValue = isNumber || isArray ? value : 1; // Create animated value
+      var toValue = isNumber || isArray ? value : 1;
 
-      entry.animation = entry.animation || isNumber ? new AnimatedValue(fromValue) : new AnimatedArray(fromValue);
+      if (isNumber) {
+        // Create animated value
+        entry.animation = entry.interpolation = entry.animation || new AnimatedValue(fromValue);
+      } else if (isArray) {
+        // Create animated array
+        entry.animation = entry.interpolation = entry.animation || new AnimatedArray(fromValue);
+      }
+
       if (immediate && (immediate === true || immediate.indexOf(name) !== -1)) entry.animation.setValue(toValue);
@@ -935,3 +1021,3 @@ entry.stopped = false;
       entry.start = function (cb) {
-        controller$1(entry.animation, _objectSpread({
+        controller(entry.animation, _objectSpread({
           toValue: toValue
@@ -942,4 +1028,4 @@ }, config), impl).start(function (props) {
 
-            if (Object.values(_this3.animations).every(function (a) {
-              return a.stopped;
+            if (Object.values(_this3.animations).every(function (animation) {
+              return animation.stopped;
             })) {
@@ -960,3 +1046,3 @@ var current = _objectSpread({}, _this3.props.from, _this3.props.to);
 
-      _this3.interpolators[name] = entry.animation;
+      _this3.interpolators[name] = entry.interpolation;
       return _objectSpread({}, acc, (_objectSpread2 = {}, _objectSpread2[name] = entry, _objectSpread2));
@@ -1053,2 +1139,2 @@ }, {});
 exports.interpolate = interpolate;
-exports.controller = controller;
+exports.createAnimatedComponent = createAnimatedComponent;

dist/NumericalSpring.js

 import _objectSpread from '@babel/runtime/helpers/builtin/es6/objectSpread';
 import _inheritsLoose from '@babel/runtime/helpers/builtin/es6/inheritsLoose';
+import _extends from '@babel/runtime/helpers/builtin/es6/extends';
 import _objectWithoutProperties from '@babel/runtime/helpers/builtin/es6/objectWithoutProperties';
+import React from 'react';
 import _assertThisInitialized from '@babel/runtime/helpers/builtin/es6/assertThisInitialized';
-import React from 'react';
 
@@ -195,2 +196,204 @@ var Animated =
 
+var AnimatedStyle =
+/*#__PURE__*/
+function (_AnimatedWithChildren) {
+  _inheritsLoose(AnimatedStyle, _AnimatedWithChildren);
+
+  function AnimatedStyle(style) {
+    var _this;
+
+    _this = _AnimatedWithChildren.call(this) || this;
+    style = style || {};
+    _this._style = style;
+    return _this;
+  }
+
+  var _proto = AnimatedStyle.prototype;
+
+  _proto.__getValue = function __getValue() {
+    var style = {};
+
+    for (var key in this._style) {
+      var value = this._style[key];
+      if (value instanceof Animated) style[key] = value.__getValue();else style[key] = value;
+    }
+
+    return style;
+  };
+
+  _proto.__getAnimatedValue = function __getAnimatedValue() {
+    var style = {};
+
+    for (var key in this._style) {
+      var value = this._style[key];
+      if (value instanceof Animated) style[key] = value.__getAnimatedValue();
+    }
+
+    return style;
+  };
+
+  _proto.__attach = function __attach() {
+    for (var key in this._style) {
+      var value = this._style[key];
+      if (value instanceof Animated) value.__addChild(this);
+    }
+  };
+
+  _proto.__detach = function __detach() {
+    for (var key in this._style) {
+      var value = this._style[key];
+      if (value instanceof Animated) value.__removeChild(this);
+    }
+  };
+
+  return AnimatedStyle;
+}(AnimatedWithChildren);
+
+var AnimatedProps =
+/*#__PURE__*/
+function (_Animated) {
+  _inheritsLoose(AnimatedProps, _Animated);
+
+  function AnimatedProps(props, callback) {
+    var _this;
+
+    _this = _Animated.call(this) || this;
+
+    if (props.style) {
+      props = _objectSpread({}, props, {
+        style: new AnimatedStyle(props.style)
+      });
+    }
+
+    _this._props = props;
+    _this._callback = callback;
+
+    _this.__attach();
+
+    return _this;
+  }
+
+  var _proto = AnimatedProps.prototype;
+
+  _proto.__getValue = function __getValue() {
+    var props = {};
+
+    for (var key in this._props) {
+      var value = this._props[key];
+      if (value instanceof Animated) props[key] = value.__getValue();else props[key] = value;
+    }
+
+    return props;
+  };
+
+  _proto.__getAnimatedValue = function __getAnimatedValue() {
+    var props = {};
+
+    for (var key in this._props) {
+      var value = this._props[key];
+      if (value instanceof Animated) props[key] = value.__getAnimatedValue();
+    }
+
+    return props;
+  };
+
+  _proto.__attach = function __attach() {
+    for (var key in this._props) {
+      var value = this._props[key];
+      if (value instanceof Animated) value.__addChild(this);
+    }
+  };
+
+  _proto.__detach = function __detach() {
+    for (var key in this._props) {
+      var value = this._props[key];
+      if (value instanceof Animated) value.__removeChild(this);
+    }
+  };
+
+  _proto.update = function update() {
+    this._callback();
+  };
+
+  return AnimatedProps;
+}(Animated);
+
+function createAnimatedComponent(Component) {
+  return (
+    /*#__PURE__*/
+    function (_React$Component) {
+      _inheritsLoose(AnimatedComponent, _React$Component);
+
+      function AnimatedComponent() {
+        return _React$Component.apply(this, arguments) || this;
+      }
+
+      var _proto = AnimatedComponent.prototype;
+
+      _proto.componentWillUnmount = function componentWillUnmount() {
+        this._propsAnimated && this._propsAnimated.__detach();
+      };
+
+      _proto.setNativeProps = function setNativeProps(props) {
+        var didUpdate = Globals.ApplyAnimatedValues.fn(this.node, props, this);
+        if (didUpdate === false) this.forceUpdate();
+      };
+
+      _proto.componentWillMount = function componentWillMount() {
+        this.attachProps(this.props);
+      };
+
+      _proto.attachProps = function attachProps(nextProps) {
+        var _this = this;
+
+        var oldPropsAnimated = this._propsAnimated; // The system is best designed when setNativeProps is implemented. It is
+        // able to avoid re-rendering and directly set the attributes that
+        // changed. However, setNativeProps can only be implemented on leaf
+        // native components. If you want to animate a composite component, you
+        // need to re-render it. In this case, we have a fallback that uses
+        // forceUpdate.
+
+        var callback = function callback() {
+          if (_this.node) {
+            var didUpdate = Globals.ApplyAnimatedValues.fn(_this.node, _this._propsAnimated.__getAnimatedValue(), _this);
+            if (didUpdate === false) _this.forceUpdate();
+          }
+        };
+
+        this._propsAnimated = new AnimatedProps(nextProps, callback); // When you call detach, it removes the element from the parent list
+        // of children. If it goes to 0, then the parent also detaches itself
+        // and so on.
+        // An optimization is to attach the new elements and THEN detach the old
+        // ones instead of detaching and THEN attaching.
+        // This way the intermediate state isn't to go to 0 and trigger
+        // this expensive recursive detaching to then re-attach everything on
+        // the very next operation.
+
+        oldPropsAnimated && oldPropsAnimated.__detach();
+      };
+
+      _proto.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
+        this.attachProps(nextProps);
+      };
+
+      _proto.render = function render() {
+        var _this2 = this;
+
+        var _propsAnimated$__getV = this._propsAnimated.__getValue(),
+            style = _propsAnimated$__getV.style,
+            other = _objectWithoutProperties(_propsAnimated$__getV, ["style"]);
+
+        return React.createElement(Component, _extends({}, other, {
+          style: Globals.ApplyAnimatedValues.transform(style),
+          ref: function ref(node) {
+            return _this2.node = node;
+          }
+        }));
+      };
+
+      return AnimatedComponent;
+    }(React.Component)
+  );
+}
+
 var _uniqueId = 0;
@@ -490,4 +693,4 @@ /**
 
-function controller$1(value, config, impl) {
-  return maybeVectorAnim(value, config, controller$1, impl) || {
+function controller(value, config, impl) {
+  return maybeVectorAnim(value, config, controller, impl) || {
     start: function start(callback) {
@@ -505,126 +708,2 @@ var singleValue = value;
 
-var AnimatedStyle =
-/*#__PURE__*/
-function (_AnimatedWithChildren) {
-  _inheritsLoose(AnimatedStyle, _AnimatedWithChildren);
-
-  function AnimatedStyle(style) {
-    var _this;
-
-    _this = _AnimatedWithChildren.call(this) || this;
-    style = style || {};
-    _this._style = style;
-    return _this;
-  }
-
-  var _proto = AnimatedStyle.prototype;
-
-  _proto.__getValue = function __getValue() {
-    var style = {};
-
-    for (var key in this._style) {
-      var value = this._style[key];
-      if (value instanceof Animated) style[key] = value.__getValue();else style[key] = value;
-    }
-
-    return style;
-  };
-
-  _proto.__getAnimatedValue = function __getAnimatedValue() {
-    var style = {};
-
-    for (var key in this._style) {
-      var value = this._style[key];
-      if (value instanceof Animated) style[key] = value.__getAnimatedValue();
-    }
-
-    return style;
-  };
-
-  _proto.__attach = function __attach() {
-    for (var key in this._style) {
-      var value = this._style[key];
-      if (value instanceof Animated) value.__addChild(this);
-    }
-  };
-
-  _proto.__detach = function __detach() {
-    for (var key in this._style) {
-      var value = this._style[key];
-      if (value instanceof Animated) value.__removeChild(this);
-    }
-  };
-
-  return AnimatedStyle;
-}(AnimatedWithChildren);
-
-var AnimatedProps =
-/*#__PURE__*/
-function (_Animated) {
-  _inheritsLoose(AnimatedProps, _Animated);
-
-  function AnimatedProps(props, callback) {
-    var _this;
-
-    _this = _Animated.call(this) || this;
-
-    if (props.style) {
-      props = _objectSpread({}, props, {
-        style: new AnimatedStyle(props.style)
-      });
-    }
-
-    _this._props = props;
-    _this._callback = callback;
-
-    _this.__attach();
-
-    return _this;
-  }
-
-  var _proto = AnimatedProps.prototype;
-
-  _proto.__getValue = function __getValue() {
-    var props = {};
-
-    for (var key in this._props) {
-      var value = this._props[key];
-      if (value instanceof Animated) props[key] = value.__getValue();else props[key] = value;
-    }
-
-    return props;
-  };
-
-  _proto.__getAnimatedValue = function __getAnimatedValue() {
-    var props = {};
-
-    for (var key in this._props) {
-      var value = this._props[key];
-      if (value instanceof Animated) props[key] = value.__getAnimatedValue();
-    }
-
-    return props;
-  };
-
-  _proto.__attach = function __attach() {
-    for (var key in this._props) {
-      var value = this._props[key];
-      if (value instanceof Animated) value.__addChild(this);
-    }
-  };
-
-  _proto.__detach = function __detach() {
-    for (var key in this._props) {
-      var value = this._props[key];
-      if (value instanceof Animated) value.__removeChild(this);
-    }
-  };
-
-  _proto.update = function update() {
-    this._callback();
-  };
-
-  return AnimatedProps;
-}(Animated);
-
 // Important note: start() and stop() will only be called at most once.
@@ -920,5 +999,12 @@ // Once an animation has been stopped or finished its course, it will
       var fromValue = from[name] !== undefined ? from[name] : value;
-      var toValue = isNumber || isArray ? value : 1; // Create animated value
+      var toValue = isNumber || isArray ? value : 1;
 
-      entry.animation = entry.animation || isNumber ? new AnimatedValue(fromValue) : new AnimatedArray(fromValue);
+      if (isNumber) {
+        // Create animated value
+        entry.animation = entry.interpolation = entry.animation || new AnimatedValue(fromValue);
+      } else if (isArray) {
+        // Create animated array
+        entry.animation = entry.interpolation = entry.animation || new AnimatedArray(fromValue);
+      }
+
       if (immediate && (immediate === true || immediate.indexOf(name) !== -1)) entry.animation.setValue(toValue);
@@ -928,3 +1014,3 @@ entry.stopped = false;
       entry.start = function (cb) {
-        controller$1(entry.animation, _objectSpread({
+        controller(entry.animation, _objectSpread({
           toValue: toValue
@@ -935,4 +1021,4 @@ }, config), impl).start(function (props) {
 
-            if (Object.values(_this3.animations).every(function (a) {
-              return a.stopped;
+            if (Object.values(_this3.animations).every(function (animation) {
+              return animation.stopped;
             })) {
@@ -953,3 +1039,3 @@ var current = _objectSpread({}, _this3.props.from, _this3.props.to);
 
-      _this3.interpolators[name] = entry.animation;
+      _this3.interpolators[name] = entry.interpolation;
       return _objectSpread({}, acc, (_objectSpread2 = {}, _objectSpread2[name] = entry, _objectSpread2));
@@ -1044,2 +1130,2 @@ }, {});
 export default Spring;
-export { config, interpolate, controller };
+export { config, interpolate, createAnimatedComponent };

dist/NumericalSpring.umd.js

@@ -1,1 +0,1 @@
-!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],n):n(t.ReactSpringNumerical={},t.React)}(this,function(t,n){"use strict";n=n&&n.hasOwnProperty("default")?n.default:n;var i=function(t,n){if(null==t)return{};var i,e,o={},a=Object.keys(t);for(e=0;e<a.length;e++)i=a[e],n.indexOf(i)>=0||(o[i]=t[i]);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);for(e=0;e<r.length;e++)i=r[e],n.indexOf(i)>=0||Object.prototype.propertyIsEnumerable.call(t,i)&&(o[i]=t[i])}return o};var e=function(t,n,i){return n in t?Object.defineProperty(t,n,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[n]=i,t};var o=function(t){for(var n=1;n<arguments.length;n++){var i=null!=arguments[n]?arguments[n]:{},o=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(i).filter(function(t){return Object.getOwnPropertyDescriptor(i,t).enumerable}))),o.forEach(function(n){e(t,n,i[n])})}return t};var a=function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t};var r=function(t,n){t.prototype=Object.create(n.prototype),t.prototype.constructor=t,t.__proto__=n},s=function(){function t(){}var n=t.prototype;return n.__attach=function(){},n.__detach=function(){},n.__getValue=function(){},n.__getAnimatedValue=function(){return this.__getValue()},n.__addChild=function(t){},n.__removeChild=function(t){},n.__getChildren=function(){return[]},t}(),u=function(t){function n(n,i,e,o,a){var r;return(r=t.call(this)||this)._value=n,r._parent=i,r._animationClass=e,r._animationConfig=o,r._callback=a,r.__attach(),r._hey=1,r}r(n,t);var i=n.prototype;return i.__getValue=function(){return this._parent.__getValue()},i.__attach=function(){this._parent.__addChild(this)},i.__detach=function(){this._parent.__removeChild(this)},i.update=function(){this._value.animate(new this._animationClass(o({},this._animationConfig,{toValue:this._animationConfig.toValue.__getValue()})),this._callback)},n}(s),c=function(t){function n(){var n;return(n=t.call(this)||this)._children=[],n}r(n,t);var i=n.prototype;return i.__addChild=function(t){t instanceof u&&(this._tracked=!0),0===this._children.length&&this.__attach(),this._children.push(t)},i.__removeChild=function(t){var n=this._children.indexOf(t);-1!==n?(this._children.splice(n,1),0===this._children.length&&this.__detach()):console.warn("Trying to remove a child that doesn't exist")},i.__getChildren=function(){return this._children},n}(s),l={ApplyAnimatedValues:void 0,Bugfixes:void 0,Interpolation:function(){function t(){}return t.create=function(t){return function(){return t.apply(void 0,arguments)}},t}(),injectApplyAnimatedValues:function(t,n){return l.ApplyAnimatedValues={fn:t,transform:n}},injectBugfixes:function(t){return l.Bugfixes=t},injectInterpolation:function(t){return l.Interpolation=t}},_=function(t){function n(n,i){var e;return(e=t.call(this)||this)._parents=Array.isArray(n)?n:[n],e._interpolation=l.Interpolation.create(i),e}r(n,t);var i=n.prototype;return i.__getValue=function(){return this._interpolation.apply(this,this._parents.map(function(t){return t.__getValue()}))},i.__attach=function(){for(var t=0;t<this._parents.length;++t)this._parents[t]instanceof s&&this._parents[t].__addChild(this)},i.__detach=function(){for(var t=0;t<this._parents.length;++t)this._parents[t]instanceof s&&this._parents[t].__removeChild(this)},i.interpolate=function(t){return new n(this,t)},n}(c),h=0;var f=function(t){function n(n){var i;return(i=t.call(this)||this)._value=n,i._animation=null,i._animatedStyles=new Set,i._listeners={},i}r(n,t);var i=n.prototype;return i.__detach=function(){this.stopAnimation()},i.__getValue=function(){return this._value},i._flush=function(){!function t(n,i){"function"==typeof n.update?i.add(n):n.__getChildren().forEach(function(n){return t(n,i)})}(this,this._animatedStyles),this._animatedStyles.forEach(function(t){return t.update()})},i._updateValue=function(t){for(var n in this._value=t,this._flush(),this._listeners)this._listeners[n]({value:this.__getValue()})},i.setValue=function(t){this._animation&&(this._animation.stop(),this._animation=null),this._animatedStyles.clear(),this._updateValue(t)},i.stopAnimation=function(t){this.stopTracking(),this._animation&&this._animation.stop(),this._animation=null,t&&t(this.__getValue())},i.interpolate=function(t){return new _(this,t)},i.animate=function(t,n){var i=this,e=this._animation;this._animation&&this._animation.stop(),this._animation=t,this._animatedStyles.clear(),t.start(this._value,function(t){return i._updateValue(t)},function(t){i._animation=null,n&&n(t)},e)},i.addListener=function(t){var n=String(h++);return this._listeners[n]=t,n},i.removeListener=function(t){delete this._listeners[t]},i.removeAllListeners=function(){this._listeners={}},i.stopTracking=function(){this._tracking&&this._tracking.__detach(),this._tracking=null},i.track=function(t){this.stopTracking(),this._tracking=t},n}(c),p=function(t){function n(n){var i;return(i=t.call(this)||this)._values=n.map(function(t){return new f(t)}),i}r(n,t);var i=n.prototype;return i.setValue=function(t){var n=this;t.forEach(function(t,i){return n._values[i].setValue(t)})},i.__getValue=function(){return this._values.map(function(t){return t.__getValue()})},i.stopAnimation=function(t){this._values.forEach(function(t){return t.stopAnimation()}),t&&t(this.__getValue())},i.__attach=function(){for(var t=0;t<this._values.length;++t)this._values[t]instanceof s&&this._values[t].__addChild(this)},i.__detach=function(){for(var t=0;t<this._values.length;++t)this._values[t]instanceof s&&this._values[t].__removeChild(this)},n}(c);function d(t,n,i){return function(t,n,i,e){var o,a,r,s,u,c,l=n.tension,_=n.friction,h=n.toValue;return t instanceof p?(o=t._values.map(function(t,n){return i(t,{tension:l,friction:_,toValue:h[n]},e)}),r=0,s={},u=!((a={stopTogether:!1})&&!1===a.stopTogether),c={start:function(t){if(r===o.length)return t&&t({finished:!0});o.forEach(function(n,i){var e=function(n){if(s[i]=!0,++r===o.length)return r=0,t&&t(n);!n.finished&&u&&c.stop()};n?n.start(e):e({finished:!0})})},stop:function(){o.forEach(function(t,n){!s[n]&&t.stop(),s[n]=!0})}}):null}(t,n,d,i)||{start:function(e){var o=t,a=n;o.stopTracking(),n.toValue instanceof s?o.track(new u(o,n.toValue,i,a,e)):o.animate(new i(a),e)},stop:function(){t.stopAnimation()}}}var m=function(t){function n(n){var i;return i=t.call(this)||this,n=n||{},i._style=n,i}r(n,t);var i=n.prototype;return i.__getValue=function(){var t={};for(var n in this._style){var i=this._style[n];t[n]=i instanceof s?i.__getValue():i}return t},i.__getAnimatedValue=function(){var t={};for(var n in this._style){var i=this._style[n];i instanceof s&&(t[n]=i.__getAnimatedValue())}return t},i.__attach=function(){for(var t in this._style){var n=this._style[t];n instanceof s&&n.__addChild(this)}},i.__detach=function(){for(var t in this._style){var n=this._style[t];n instanceof s&&n.__removeChild(this)}},n}(c),v=function(t){function n(n,i){var e;return e=t.call(this)||this,n.style&&(n=o({},n,{style:new m(n.style)})),e._props=n,e._callback=i,e.__attach(),e}r(n,t);var i=n.prototype;return i.__getValue=function(){var t={};for(var n in this._props){var i=this._props[n];t[n]=i instanceof s?i.__getValue():i}return t},i.__getAnimatedValue=function(){var t={};for(var n in this._props){var i=this._props[n];i instanceof s&&(t[n]=i.__getAnimatedValue())}return t},i.__attach=function(){for(var t in this._props){var n=this._props[t];n instanceof s&&n.__addChild(this)}},i.__detach=function(){for(var t in this._props){var n=this._props[t];n instanceof s&&n.__removeChild(this)}},i.update=function(){this._callback()},n}(s),y=function(t,n){return void 0===t||null===t?n:t},g=function(t,n){return{tension:(i=t,3.62*(i-30)+194),friction:function(t){return 3*(t-8)+25}(n)};var i},V=function(t){function n(n){var i;(i=t.call(this)||this).onUpdate=function(){var t=i._lastPosition,n=i._lastVelocity,e=i._lastPosition,o=i._lastVelocity,a=Date.now();a>i._lastTime+64&&(a=i._lastTime+64);for(var r=Math.floor((a-i._lastTime)/1),s=0;s<r;++s){var u=n,c=i._tension*(i._toValue-e)-i._friction*o,l=(e=t+.001*u/2,o=n+.001*c/2),_=i._tension*(i._toValue-e)-i._friction*o;e=t+.001*l/2;var h=o=n+.001*_/2,f=i._tension*(i._toValue-e)-i._friction*o;e=t+.001*h/2;var p=o=n+.001*f/2,d=i._tension*(i._toValue-e)-i._friction*o;e=t+.001*h/2,o=n+.001*f/2,t+=.001*((u+2*(l+h)+p)/6),n+=.001*((c+2*(_+f)+d)/6)}if(i._lastTime=a,i._lastPosition=t,i._lastVelocity=n,i._onUpdate(t),i.__active){var m=!1;i._overshootClamping&&0!==i._tension&&(m=i._startPosition<i._toValue?t>i._toValue:t<i._toValue);var v=Math.abs(n)<=i._restSpeedThreshold,y=!0;if(0!==i._tension&&(y=Math.abs(i._toValue-t)<=i._restDisplacementThreshold),m||v&&y)return 0!==i._tension&&i._onUpdate(i._toValue),void i.__debouncedOnEnd({finished:!0});i._animationFrame=requestAnimationFrame(i.onUpdate)}},i._overshootClamping=y(n.overshootClamping,!1),i._restDisplacementThreshold=y(n.restDisplacementThreshold,.001),i._restSpeedThreshold=y(n.restSpeedThreshold,.001),i._initialVelocity=n.velocity,i._lastVelocity=y(n.velocity,0),i._toValue=n.toValue,i.__isInteraction=void 0===n.isInteraction||n.isInteraction;var e=g(y(n.tension,40),y(n.friction,7));return i._tension=e.tension,i._friction=e.friction,i._delay=void 0!==n.delay?n.delay:0,i}r(n,t);var i=n.prototype;return i.start=function(t,i,e,o){if(this.__active=!0,this._startPosition=t,this._lastPosition=this._startPosition,this._onUpdate=i,this.__onEnd=e,this._lastTime=Date.now(),o instanceof n){var a=o.getInternalState();this._lastPosition=a.lastPosition,this._lastVelocity=a.lastVelocity,this._lastTime=a.lastTime}void 0!==this._initialVelocity&&null!==this._initialVelocity&&(this._lastVelocity=this._initialVelocity),this._delay?this._timeout=setTimeout(this.onUpdate,this._delay):this.onUpdate()},i.getInternalState=function(){return{lastPosition:this._lastPosition,lastVelocity:this._lastVelocity,lastTime:this._lastTime}},i.stop=function(){this.__active=!1,clearTimeout(this._timeout),cancelAnimationFrame(this._animationFrame),this.__debouncedOnEnd({finished:!1})},n}(function(){function t(){}var n=t.prototype;return n.start=function(t,n,i,e){},n.stop=function(){},n.__debouncedOnEnd=function(t){var n=this.__onEnd;this.__onEnd=null,n&&n(t)},t}()),b={default:{tension:170,friction:26},gentle:{tension:120,friction:14},wobbly:{tension:180,friction:12},stiff:{tension:210,friction:20},slow:{tension:280,friction:60}},P=function(t){function n(){for(var n,i,e=arguments.length,o=new Array(e),r=0;r<e;r++)o[r]=arguments[r];return n=i=t.call.apply(t,[this].concat(o))||this,i.state={props:void 0},i.animations={},i.callback=function(){i.props.onFrame&&i.props.onFrame(i.animatedProps.__getValue()),!i.props.native&&i.forceUpdate()},n||a(i)}r(n,t);var e=n.prototype;return e.componentWillUnmount=function(){this.stop()},e.componentWillMount=function(){this.updatePropsAsync(this.props)},e.componentWillReceiveProps=function(t){this.updatePropsAsync(t)},e.updatePropsAsync=function(t){var n=this;if(t.inject&&(t=t.inject(this,t)).then)return t.then(function(t){return n.updateProps(t,!0)});this.updateProps(t)},e.updateProps=function(t,n){var i=this;void 0===n&&(n=!1);var e=t.impl,a=t.from,r=t.to,s=t.config,u=(t.attach,t.immediate),c=t.reset,l=(t.onFrame,t.onRest),_=Object.entries(o({},a,r));this.interpolators={},this.animations=_.reduce(function(t,n,r){var _,h=n[0],m=n[1],v=!1===c&&i.animations[h]||(i.animations[h]={}),y="number"==typeof m,g=!y&&Array.isArray(m),V=void 0!==a[h]?a[h]:m,b=y||g?m:1;return v.animation=v.animation||y?new f(V):new p(V),!u||!0!==u&&-1===u.indexOf(h)||v.animation.setValue(b),v.stopped=!1,v.start=function(t){d(v.animation,o({toValue:b},s),e).start(function(n){if(n.finished&&(i.animations[h].stopped=!0,Object.values(i.animations).every(function(t){return t.stopped}))){var e=o({},i.props.from,i.props.to);l&&l(e),t&&t(e)}})},v.stop=function(){v.stopped=!0,v.animation.stopAnimation()},i.interpolators[h]=v.animation,o({},t,((_={})[h]=v,_))},{});var h=this.animatedProps;this.animatedProps=new v(this.interpolators,this.callback),h&&h.__detach(),n&&this.forceUpdate(),this.start()},e.start=function(){var t=this;return new Promise(function(n){return t.getAnimations().forEach(function(t){return t.start(n)})})},e.stop=function(){this.getAnimations().forEach(function(t){return t.stop()})},e.getAnimations=function(){return Object.values(this.animations)},e.getValues=function(){return this.animatedProps?this.animatedProps.__getValue():{}},e.getAnimatedValues=function(){return this.props.native?this.interpolators:this.getValues()},e.getForwardProps=function(t){void 0===t&&(t=this.props);var n=t;n.to,n.from,n.config,n.native,n.onRest,n.onFrame,n.children,n.render,n.reset,n.immediate,n.impl,n.inject;return i(n,["to","from","config","native","onRest","onFrame","children","render","reset","immediate","impl","inject"])},e.render=function(){var t=this.props,n=t.children,i=t.render,e=this.getAnimatedValues();if(e&&Object.keys(e).length){var a=o({},this.getAnimatedValues(),this.getForwardProps());return i?i(o({},a,{children:n})):n(a)}return null},n}(n.PureComponent);P.defaultProps={from:{},to:{},config:b.default,native:!1,immediate:!1,reset:!1,impl:V},t.config=b,t.default=P,t.interpolate=function(t,n){return new _(t,n)},t.controller=controller,Object.defineProperty(t,"__esModule",{value:!0})});
+!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],n):n(t.ReactSpringNumerical={},t.React)}(this,function(t,n){"use strict";n=n&&n.hasOwnProperty("default")?n.default:n;var i=function(t,n){if(null==t)return{};var i,e,o={},a=Object.keys(t);for(e=0;e<a.length;e++)i=a[e],n.indexOf(i)>=0||(o[i]=t[i]);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);for(e=0;e<r.length;e++)i=r[e],n.indexOf(i)>=0||Object.prototype.propertyIsEnumerable.call(t,i)&&(o[i]=t[i])}return o};var e=function(t,n,i){return n in t?Object.defineProperty(t,n,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[n]=i,t};var o=function(t){for(var n=1;n<arguments.length;n++){var i=null!=arguments[n]?arguments[n]:{},o=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(i).filter(function(t){return Object.getOwnPropertyDescriptor(i,t).enumerable}))),o.forEach(function(n){e(t,n,i[n])})}return t};var a=function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t};var r=function(t,n){t.prototype=Object.create(n.prototype),t.prototype.constructor=t,t.__proto__=n},s=function(){function t(){}var n=t.prototype;return n.__attach=function(){},n.__detach=function(){},n.__getValue=function(){},n.__getAnimatedValue=function(){return this.__getValue()},n.__addChild=function(t){},n.__removeChild=function(t){},n.__getChildren=function(){return[]},t}(),u=function(t){function n(n,i,e,o,a){var r;return(r=t.call(this)||this)._value=n,r._parent=i,r._animationClass=e,r._animationConfig=o,r._callback=a,r.__attach(),r._hey=1,r}r(n,t);var i=n.prototype;return i.__getValue=function(){return this._parent.__getValue()},i.__attach=function(){this._parent.__addChild(this)},i.__detach=function(){this._parent.__removeChild(this)},i.update=function(){this._value.animate(new this._animationClass(o({},this._animationConfig,{toValue:this._animationConfig.toValue.__getValue()})),this._callback)},n}(s),c=function(t){function n(){var n;return(n=t.call(this)||this)._children=[],n}r(n,t);var i=n.prototype;return i.__addChild=function(t){t instanceof u&&(this._tracked=!0),0===this._children.length&&this.__attach(),this._children.push(t)},i.__removeChild=function(t){var n=this._children.indexOf(t);-1!==n?(this._children.splice(n,1),0===this._children.length&&this.__detach()):console.warn("Trying to remove a child that doesn't exist")},i.__getChildren=function(){return this._children},n}(s),l={ApplyAnimatedValues:void 0,Bugfixes:void 0,Interpolation:function(){function t(){}return t.create=function(t){return function(){return t.apply(void 0,arguments)}},t}(),injectApplyAnimatedValues:function(t,n){return l.ApplyAnimatedValues={fn:t,transform:n}},injectBugfixes:function(t){return l.Bugfixes=t},injectInterpolation:function(t){return l.Interpolation=t}},_=function(t){function n(n,i){var e;return(e=t.call(this)||this)._parents=Array.isArray(n)?n:[n],e._interpolation=l.Interpolation.create(i),e}r(n,t);var i=n.prototype;return i.__getValue=function(){return this._interpolation.apply(this,this._parents.map(function(t){return t.__getValue()}))},i.__attach=function(){for(var t=0;t<this._parents.length;++t)this._parents[t]instanceof s&&this._parents[t].__addChild(this)},i.__detach=function(){for(var t=0;t<this._parents.length;++t)this._parents[t]instanceof s&&this._parents[t].__removeChild(this)},i.interpolate=function(t){return new n(this,t)},n}(c);var h,f=(function(t){function n(){return t.exports=n=Object.assign||function(t){for(var n=1;n<arguments.length;n++){var i=arguments[n];for(var e in i)Object.prototype.hasOwnProperty.call(i,e)&&(t[e]=i[e])}return t},n.apply(this,arguments)}t.exports=n}(h={exports:{}},h.exports),h.exports),p=function(t){function n(n){var i;return i=t.call(this)||this,n=n||{},i._style=n,i}r(n,t);var i=n.prototype;return i.__getValue=function(){var t={};for(var n in this._style){var i=this._style[n];t[n]=i instanceof s?i.__getValue():i}return t},i.__getAnimatedValue=function(){var t={};for(var n in this._style){var i=this._style[n];i instanceof s&&(t[n]=i.__getAnimatedValue())}return t},i.__attach=function(){for(var t in this._style){var n=this._style[t];n instanceof s&&n.__addChild(this)}},i.__detach=function(){for(var t in this._style){var n=this._style[t];n instanceof s&&n.__removeChild(this)}},n}(c),d=function(t){function n(n,i){var e;return e=t.call(this)||this,n.style&&(n=o({},n,{style:new p(n.style)})),e._props=n,e._callback=i,e.__attach(),e}r(n,t);var i=n.prototype;return i.__getValue=function(){var t={};for(var n in this._props){var i=this._props[n];t[n]=i instanceof s?i.__getValue():i}return t},i.__getAnimatedValue=function(){var t={};for(var n in this._props){var i=this._props[n];i instanceof s&&(t[n]=i.__getAnimatedValue())}return t},i.__attach=function(){for(var t in this._props){var n=this._props[t];n instanceof s&&n.__addChild(this)}},i.__detach=function(){for(var t in this._props){var n=this._props[t];n instanceof s&&n.__removeChild(this)}},i.update=function(){this._callback()},n}(s);var m=0;var v=function(t){function n(n){var i;return(i=t.call(this)||this)._value=n,i._animation=null,i._animatedStyles=new Set,i._listeners={},i}r(n,t);var i=n.prototype;return i.__detach=function(){this.stopAnimation()},i.__getValue=function(){return this._value},i._flush=function(){!function t(n,i){"function"==typeof n.update?i.add(n):n.__getChildren().forEach(function(n){return t(n,i)})}(this,this._animatedStyles),this._animatedStyles.forEach(function(t){return t.update()})},i._updateValue=function(t){for(var n in this._value=t,this._flush(),this._listeners)this._listeners[n]({value:this.__getValue()})},i.setValue=function(t){this._animation&&(this._animation.stop(),this._animation=null),this._animatedStyles.clear(),this._updateValue(t)},i.stopAnimation=function(t){this.stopTracking(),this._animation&&this._animation.stop(),this._animation=null,t&&t(this.__getValue())},i.interpolate=function(t){return new _(this,t)},i.animate=function(t,n){var i=this,e=this._animation;this._animation&&this._animation.stop(),this._animation=t,this._animatedStyles.clear(),t.start(this._value,function(t){return i._updateValue(t)},function(t){i._animation=null,n&&n(t)},e)},i.addListener=function(t){var n=String(m++);return this._listeners[n]=t,n},i.removeListener=function(t){delete this._listeners[t]},i.removeAllListeners=function(){this._listeners={}},i.stopTracking=function(){this._tracking&&this._tracking.__detach(),this._tracking=null},i.track=function(t){this.stopTracking(),this._tracking=t},n}(c),y=function(t){function n(n){var i;return(i=t.call(this)||this)._values=n.map(function(t){return new v(t)}),i}r(n,t);var i=n.prototype;return i.setValue=function(t){var n=this;t.forEach(function(t,i){return n._values[i].setValue(t)})},i.__getValue=function(){return this._values.map(function(t){return t.__getValue()})},i.stopAnimation=function(t){this._values.forEach(function(t){return t.stopAnimation()}),t&&t(this.__getValue())},i.__attach=function(){for(var t=0;t<this._values.length;++t)this._values[t]instanceof s&&this._values[t].__addChild(this)},i.__detach=function(){for(var t=0;t<this._values.length;++t)this._values[t]instanceof s&&this._values[t].__removeChild(this)},n}(c);function g(t,n,i){return function(t,n,i,e){var o,a,r,s,u,c,l=n.tension,_=n.friction,h=n.toValue;return t instanceof y?(o=t._values.map(function(t,n){return i(t,{tension:l,friction:_,toValue:h[n]},e)}),r=0,s={},u=!((a={stopTogether:!1})&&!1===a.stopTogether),c={start:function(t){if(r===o.length)return t&&t({finished:!0});o.forEach(function(n,i){var e=function(n){if(s[i]=!0,++r===o.length)return r=0,t&&t(n);!n.finished&&u&&c.stop()};n?n.start(e):e({finished:!0})})},stop:function(){o.forEach(function(t,n){!s[n]&&t.stop(),s[n]=!0})}}):null}(t,n,g,i)||{start:function(e){var o=t,a=n;o.stopTracking(),n.toValue instanceof s?o.track(new u(o,n.toValue,i,a,e)):o.animate(new i(a),e)},stop:function(){t.stopAnimation()}}}var V=function(t,n){return void 0===t||null===t?n:t},A=function(t,n){return{tension:(i=t,3.62*(i-30)+194),friction:function(t){return 3*(t-8)+25}(n)};var i},b=function(t){function n(n){var i;(i=t.call(this)||this).onUpdate=function(){var t=i._lastPosition,n=i._lastVelocity,e=i._lastPosition,o=i._lastVelocity,a=Date.now();a>i._lastTime+64&&(a=i._lastTime+64);for(var r=Math.floor((a-i._lastTime)/1),s=0;s<r;++s){var u=n,c=i._tension*(i._toValue-e)-i._friction*o,l=(e=t+.001*u/2,o=n+.001*c/2),_=i._tension*(i._toValue-e)-i._friction*o;e=t+.001*l/2;var h=o=n+.001*_/2,f=i._tension*(i._toValue-e)-i._friction*o;e=t+.001*h/2;var p=o=n+.001*f/2,d=i._tension*(i._toValue-e)-i._friction*o;e=t+.001*h/2,o=n+.001*f/2,t+=.001*((u+2*(l+h)+p)/6),n+=.001*((c+2*(_+f)+d)/6)}if(i._lastTime=a,i._lastPosition=t,i._lastVelocity=n,i._onUpdate(t),i.__active){var m=!1;i._overshootClamping&&0!==i._tension&&(m=i._startPosition<i._toValue?t>i._toValue:t<i._toValue);var v=Math.abs(n)<=i._restSpeedThreshold,y=!0;if(0!==i._tension&&(y=Math.abs(i._toValue-t)<=i._restDisplacementThreshold),m||v&&y)return 0!==i._tension&&i._onUpdate(i._toValue),void i.__debouncedOnEnd({finished:!0});i._animationFrame=requestAnimationFrame(i.onUpdate)}},i._overshootClamping=V(n.overshootClamping,!1),i._restDisplacementThreshold=V(n.restDisplacementThreshold,.001),i._restSpeedThreshold=V(n.restSpeedThreshold,.001),i._initialVelocity=n.velocity,i._lastVelocity=V(n.velocity,0),i._toValue=n.toValue,i.__isInteraction=void 0===n.isInteraction||n.isInteraction;var e=A(V(n.tension,40),V(n.friction,7));return i._tension=e.tension,i._friction=e.friction,i._delay=void 0!==n.delay?n.delay:0,i}r(n,t);var i=n.prototype;return i.start=function(t,i,e,o){if(this.__active=!0,this._startPosition=t,this._lastPosition=this._startPosition,this._onUpdate=i,this.__onEnd=e,this._lastTime=Date.now(),o instanceof n){var a=o.getInternalState();this._lastPosition=a.lastPosition,this._lastVelocity=a.lastVelocity,this._lastTime=a.lastTime}void 0!==this._initialVelocity&&null!==this._initialVelocity&&(this._lastVelocity=this._initialVelocity),this._delay?this._timeout=setTimeout(this.onUpdate,this._delay):this.onUpdate()},i.getInternalState=function(){return{lastPosition:this._lastPosition,lastVelocity:this._lastVelocity,lastTime:this._lastTime}},i.stop=function(){this.__active=!1,clearTimeout(this._timeout),cancelAnimationFrame(this._animationFrame),this.__debouncedOnEnd({finished:!1})},n}(function(){function t(){}var n=t.prototype;return n.start=function(t,n,i,e){},n.stop=function(){},n.__debouncedOnEnd=function(t){var n=this.__onEnd;this.__onEnd=null,n&&n(t)},t}()),P={default:{tension:170,friction:26},gentle:{tension:120,friction:14},wobbly:{tension:180,friction:12},stiff:{tension:210,friction:20},slow:{tension:280,friction:60}},w=function(t){function n(){for(var n,i,e=arguments.length,o=new Array(e),r=0;r<e;r++)o[r]=arguments[r];return n=i=t.call.apply(t,[this].concat(o))||this,i.state={props:void 0},i.animations={},i.callback=function(){i.props.onFrame&&i.props.onFrame(i.animatedProps.__getValue()),!i.props.native&&i.forceUpdate()},n||a(i)}r(n,t);var e=n.prototype;return e.componentWillUnmount=function(){this.stop()},e.componentWillMount=function(){this.updatePropsAsync(this.props)},e.componentWillReceiveProps=function(t){this.updatePropsAsync(t)},e.updatePropsAsync=function(t){var n=this;if(t.inject&&(t=t.inject(this,t)).then)return t.then(function(t){return n.updateProps(t,!0)});this.updateProps(t)},e.updateProps=function(t,n){var i=this;void 0===n&&(n=!1);var e=t.impl,a=t.from,r=t.to,s=t.config,u=(t.attach,t.immediate),c=t.reset,l=(t.onFrame,t.onRest),_=Object.entries(o({},a,r));this.interpolators={},this.animations=_.reduce(function(t,n,r){var _,h=n[0],f=n[1],p=!1===c&&i.animations[h]||(i.animations[h]={}),d="number"==typeof f,m=!d&&Array.isArray(f),V=void 0!==a[h]?a[h]:f,A=d||m?f:1;return d?p.animation=p.interpolation=p.animation||new v(V):m&&(p.animation=p.interpolation=p.animation||new y(V)),!u||!0!==u&&-1===u.indexOf(h)||p.animation.setValue(A),p.stopped=!1,p.start=function(t){g(p.animation,o({toValue:A},s),e).start(function(n){if(n.finished&&(i.animations[h].stopped=!0,Object.values(i.animations).every(function(t){return t.stopped}))){var e=o({},i.props.from,i.props.to);l&&l(e),t&&t(e)}})},p.stop=function(){p.stopped=!0,p.animation.stopAnimation()},i.interpolators[h]=p.interpolation,o({},t,((_={})[h]=p,_))},{});var h=this.animatedProps;this.animatedProps=new d(this.interpolators,this.callback),h&&h.__detach(),n&&this.forceUpdate(),this.start()},e.start=function(){var t=this;return new Promise(function(n){return t.getAnimations().forEach(function(t){return t.start(n)})})},e.stop=function(){this.getAnimations().forEach(function(t){return t.stop()})},e.getAnimations=function(){return Object.values(this.animations)},e.getValues=function(){return this.animatedProps?this.animatedProps.__getValue():{}},e.getAnimatedValues=function(){return this.props.native?this.interpolators:this.getValues()},e.getForwardProps=function(t){void 0===t&&(t=this.props);var n=t;n.to,n.from,n.config,n.native,n.onRest,n.onFrame,n.children,n.render,n.reset,n.immediate,n.impl,n.inject;return i(n,["to","from","config","native","onRest","onFrame","children","render","reset","immediate","impl","inject"])},e.render=function(){var t=this.props,n=t.children,i=t.render,e=this.getAnimatedValues();if(e&&Object.keys(e).length){var a=o({},this.getAnimatedValues(),this.getForwardProps());return i?i(o({},a,{children:n})):n(a)}return null},n}(n.PureComponent);w.defaultProps={from:{},to:{},config:P.default,native:!1,immediate:!1,reset:!1,impl:b},t.config=P,t.default=w,t.interpolate=function(t,n){return new _(t,n)},t.createAnimatedComponent=function(t){return function(e){function o(){return e.apply(this,arguments)||this}r(o,e);var a=o.prototype;return a.componentWillUnmount=function(){this._propsAnimated&&this._propsAnimated.__detach()},a.setNativeProps=function(t){!1===l.ApplyAnimatedValues.fn(this.node,t,this)&&this.forceUpdate()},a.componentWillMount=function(){this.attachProps(this.props)},a.attachProps=function(t){var n=this,i=this._propsAnimated;this._propsAnimated=new d(t,function(){n.node&&!1===l.ApplyAnimatedValues.fn(n.node,n._propsAnimated.__getAnimatedValue(),n)&&n.forceUpdate()}),i&&i.__detach()},a.componentWillReceiveProps=function(t){this.attachProps(t)},a.render=function(){var e=this,o=this._propsAnimated.__getValue(),a=o.style,r=i(o,["style"]);return n.createElement(t,f({},r,{style:l.ApplyAnimatedValues.transform(a),ref:function(t){return e.node=t}}))},o}(n.Component)},Object.defineProperty(t,"__esModule",{value:!0})});

package.json

 {
   "name": "react-spring",
-  "version": "4.1.8-beta.1",
+  "version": "4.1.8-beta.2",
   "description": "Animate React with ease",
@@ -5,0 +5,0 @@ "main": "dist/react-spring",

src/addons/NumericalSpring.js

 import React from 'react'
 import PropTypes from 'prop-types'
 import { interpolate } from '../animated/AnimatedInterpolation'
+import createAnimatedComponent from '../animated/createAnimatedComponent'
 import AnimatedController from '../animated/AnimatedController'
@@ -99,7 +100,11 @@ import AnimatedValue from '../animated/AnimatedValue'
 
-      // Create animated value
-      entry.animation =
-        entry.animation || isNumber
-          ? new AnimatedValue(fromValue)
-          : new AnimatedArray(fromValue)
+      if (isNumber) {
+        // Create animated value
+        entry.animation = entry.interpolation =
+          entry.animation || new AnimatedValue(fromValue)
+      } else if (isArray) {
+        // Create animated array
+        entry.animation = entry.interpolation =
+          entry.animation || new AnimatedArray(fromValue)
+      }
 
@@ -115,3 +120,7 @@ if (immediate && (immediate === true || immediate.indexOf(name) !== -1))
               this.animations[name].stopped = true
-              if (Object.values(this.animations).every(a => a.stopped)) {
+              if (
+                Object.values(this.animations).every(
+                  animation => animation.stopped
+                )
+              ) {
                 const current = { ...this.props.from, ...this.props.to }
@@ -130,3 +139,3 @@ onRest && onRest(current)
 
-      this.interpolators[name] = entry.animation
+      this.interpolators[name] = entry.interpolation
       return { ...acc, [name]: entry }
@@ -202,2 +211,2 @@ }, {})
 
-export { interpolate, controller }
+export { interpolate, createAnimatedComponent }

No alert changes

Improved metrics

Total package byte prevSize

438085

increased by1.87%

Lines of code

9946

increased by1.55%

No dependency changes