react-motion
Advanced tools
Comparing version 0.2.3 to 0.2.4
@@ -7,3 +7,3 @@ Legend: | ||
### 0.2.3 (July 29th 2015) | ||
### 0.2.4 (July 29th 2015) | ||
- [I] React-native support! | ||
@@ -13,3 +13,3 @@ - [I] Allow returning `null` from children function. #101 | ||
- [I] `TransitionSpring`'s `willLeave` API got simplified and now asks for an object as a return value instead of `null`. `null` is still supported, but is deprecated and will be removed in the next version. See the new docs on it [here](https://github.com/chenglou/react-motion/blob/24d6a7284ef61268c0ead67fe43d7e40bf45d381/README.md#transitionspring-). | ||
- [I] Exposed a few tasteful default spring constants under the new exported `constants`. | ||
- [I] Exposed a few tasteful default spring configurations under the new exported `presets`. | ||
@@ -16,0 +16,0 @@ ### 0.2.2 (July 24th 2015) |
@@ -16,7 +16,7 @@ 'use strict'; | ||
var _constants2 = require('./constants'); | ||
var _presets2 = require('./presets'); | ||
var _constants3 = _interopRequireDefault(_constants2); | ||
var _presets3 = _interopRequireDefault(_presets2); | ||
exports.constants = _constants3['default']; | ||
exports.presets = _presets3['default']; | ||
var utils = { | ||
@@ -23,0 +23,0 @@ reorderKeys: _reorderKeys2['default'] |
@@ -14,3 +14,3 @@ "use strict"; | ||
// Damping constant, in kg / s | ||
// Damping, in kg / s | ||
var Fdamper = -b * v; | ||
@@ -17,0 +17,0 @@ |
@@ -26,7 +26,7 @@ 'use strict'; | ||
var _constants = require('./constants'); | ||
var _presets = require('./presets'); | ||
// TODO: refactor common logic with updateCurrValue and updateCurrVelocity | ||
var _constants2 = _interopRequireDefault(_constants); | ||
var _presets2 = _interopRequireDefault(_presets); | ||
@@ -87,3 +87,3 @@ function interpolateValue(alpha, nextValue, prevValue) { | ||
if (endValue.val != null) { | ||
var _ref = endValue.config || _constants2['default'].noWobble; | ||
var _ref = endValue.config || _presets2['default'].noWobble; | ||
@@ -130,3 +130,3 @@ var _k = _ref[0]; | ||
if (endValue.val != null) { | ||
var _ref2 = endValue.config || _constants2['default'].noWobble; | ||
var _ref2 = endValue.config || _presets2['default'].noWobble; | ||
@@ -133,0 +133,0 @@ var _k = _ref2[0]; |
{ | ||
"name": "react-motion", | ||
"version": "0.2.3", | ||
"version": "0.2.4", | ||
"description": "A spring that solves your animation problems.", | ||
@@ -5,0 +5,0 @@ "main": "lib/react-motion.js", |
@@ -13,3 +13,3 @@ # React-Motion | ||
Animate a counter to `10`, from whatever value it currently is. For more advanced usage, see [below](#constants). | ||
Animate a counter to `10`, from whatever value it currently is. For more advanced usage, see [below](#presets). | ||
@@ -28,3 +28,3 @@ Npm: | ||
[Check](https://cdn.rawgit.com/chenglou/react-motion/3b5be548cd08630a836562a053576ff91f94b93f/demo0/index.html) [Out](https://cdn.rawgit.com/chenglou/react-motion/3b5be548cd08630a836562a053576ff91f94b93f/demo1/index.html) [The](https://cdn.rawgit.com/chenglou/react-motion/3b5be548cd08630a836562a053576ff91f94b93f/demo2/index.html) [Cool](https://cdn.rawgit.com/chenglou/react-motion/3b5be548cd08630a836562a053576ff91f94b93f/demo3/index.html) [Demos](https://cdn.rawgit.com/chenglou/react-motion/3b5be548cd08630a836562a053576ff91f94b93f/demo4/index.html) [Here](https://cdn.rawgit.com/chenglou/react-motion/2a5f89bee700c6bbb0560eee0c8f9ad66d111bdd/demos/demo5/index.html). | ||
[Check](https://cdn.rawgit.com/chenglou/react-motion/c3c5403b6821b7a8954e3c379057ae7d9bbc39d5/demos/demo0/index.html) [Out](https://cdn.rawgit.com/chenglou/react-motion/c3c5403b6821b7a8954e3c379057ae7d9bbc39d5/demos/demo1/index.html) [The](https://cdn.rawgit.com/chenglou/react-motion/c3c5403b6821b7a8954e3c379057ae7d9bbc39d5/demos/demo2/index.html) [Cool](https://cdn.rawgit.com/chenglou/react-motion/c3c5403b6821b7a8954e3c379057ae7d9bbc39d5/demos/demo3/index.html) [Demos](https://cdn.rawgit.com/chenglou/react-motion/c3c5403b6821b7a8954e3c379057ae7d9bbc39d5/demos/demo4/index.html) [Here](https://cdn.rawgit.com/chenglou/react-motion/c3c5403b6821b7a8954e3c379057ae7d9bbc39d5/demos/demo5/index.html). | ||
@@ -35,3 +35,3 @@ ## What does this library try to solve? | ||
For 95% of use-cases of animating components, we don't have to resort to using hard-coded easing curves and duration. Set up a stiffness and damping constant for your UI element, and let the magic of physics take care of the rest. This way, you don't have to worry about the more petty questions such as "what if the item's currently animating and is a position `x`? How do I adjust my time and curve?". It also greatly simplifies an animation API since there's really not that much to set up. | ||
For 95% of use-cases of animating components, we don't have to resort to using hard-coded easing curves and duration. Set up a stiffness and damping for your UI element, and let the magic of physics take care of the rest. This way, you don't have to worry about the more petty questions such as "what if the item's currently animating and is a position `x`? How do I adjust my time and curve?". It also greatly simplifies an animation API since there's really not that much to set up. | ||
@@ -71,3 +71,3 @@ This library also provides an alternative, more powerful API for React's `TransitionGroup`. | ||
The library exports a `Spring`, a `TransitionSpring`, `constants` `utils`. | ||
The library exports `Spring`, `TransitionSpring`, `presets` and `utils`. | ||
@@ -122,3 +122,3 @@ ### <Spring /> | ||
A stiffness of `120` and damping of `17` gives the spring a slight bounce effect. The library exports a `constants` object that contains the commonly used stiffness and damping. See the `constants` section below. | ||
A stiffness of `120` and damping of `17` gives the spring a slight bounce effect. The library exports a `presets` object that contains the commonly used stiffness and damping. See the `presets` section below. | ||
@@ -286,4 +286,4 @@ You can nest `val` wrappers; the innermost takes priority: | ||
### `constants` | ||
Some tasteful, commonly used spring constants you can plug into your `endValue` like so: `{val: 10, config: constants.wobbly}`. [See here](https://github.com/chenglou/react-motion/blob/372446fc8679dcdbf4de2e983d53709ab40ce88c/src/constants.js). | ||
### `presets` | ||
Some tasteful, commonly used spring presets you can plug into your `endValue` like so: `{val: 10, config: presets.wobbly}`. [See here](https://github.com/chenglou/react-motion/blob/bae579994bb9090847776f449ba38494a730ebc9/src/presets.js). | ||
@@ -304,3 +304,3 @@ ### Little Extras | ||
- How do I do staggering/chained animation where items animate in one after another? | ||
In most cases, what you want to express here is a relationship between animations, e.g. item 2 appears after item 1. Staggering/chained animation have hard-coded values and go against the spirit of a physics system. Check out [demo 1](https://cdn.rawgit.com/chenglou/react-motion/3b5be548cd08630a836562a053576ff91f94b93f/demo1/index.html); each ball follows the one in front of it, creating a natural staggering animation. The code in `endValue` looks roughly so: | ||
In most cases, what you want to express here is a relationship between animations, e.g. item 2 appears after item 1. Staggering/chained animation have hard-coded values and go against the spirit of a physics system. Check out [demo 1](https://cdn.rawgit.com/chenglou/react-motion/c3c5403b6821b7a8954e3c379057ae7d9bbc39d5/demos/demo1/index.html); each ball follows the one in front of it, creating a natural staggering animation. The code in `endValue` looks roughly so: | ||
@@ -307,0 +307,0 @@ ```jsx |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
46803
23
860