Socket
Socket
Sign inDemoInstall

react-smooth

Package Overview
Dependencies
16
Maintainers
3
Versions
53
Alerts
File Explorer

Advanced tools

npm Scripts
License

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 1.0.0 to 1.0.1

12

CHANGELOG.md

@@ -0,1 +1,13 @@

1.0.1 / 2018-10-02
==================
* chore: update babel, webpack, karma, etc.
* fix: fix import error
1.0.0 / 2017-11-06
==================
* feat: support React 16
0.1.17 / 2016-12-02

@@ -2,0 +14,0 @@ ==================

266

es6/Animate.js

@@ -1,13 +0,46 @@

import _isEqual from 'lodash/isEqual';
"use strict";
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _isEqual2 = _interopRequireDefault(require("lodash/isEqual"));
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _AnimateManager = _interopRequireDefault(require("./AnimateManager"));
var _PureRender = _interopRequireDefault(require("./PureRender"));
var _easing = require("./easing");
var _configUpdate = _interopRequireDefault(require("./configUpdate"));
var _util = require("./util");
var _class, _class2, _temp;
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

@@ -17,23 +50,27 @@

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
import React, { Component, cloneElement, Children } from 'react';
import PropTypes from 'prop-types';
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
import createAnimateManager from './AnimateManager';
import pureRender from './PureRender';
import { configEasing } from './easing';
import configUpdate from './configUpdate';
import { getTransitionVal, identity, translateStyle } from './util';
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var Animate = pureRender(_class = (_temp = _class2 = function (_Component) {
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var Animate = (0, _PureRender.default)(_class = (_temp = _class2 =
/*#__PURE__*/
function (_Component) {
_inherits(Animate, _Component);
function Animate(props, context) {
var _this;
_classCallCheck(this, Animate);
var _this = _possibleConstructorReturn(this, (Animate.__proto__ || Object.getPrototypeOf(Animate)).call(this, props, context));
_this = _possibleConstructorReturn(this, _getPrototypeOf(Animate).call(this, props, context));
var _this$props = _this.props,

@@ -46,13 +83,14 @@ isActive = _this$props.isActive,

children = _this$props.children;
_this.handleStyleChange = _this.handleStyleChange.bind(_assertThisInitialized(_assertThisInitialized(_this)));
_this.changeStyle = _this.changeStyle.bind(_assertThisInitialized(_assertThisInitialized(_this)));
_this.handleStyleChange = _this.handleStyleChange.bind(_this);
_this.changeStyle = _this.changeStyle.bind(_this);
if (!isActive) {
_this.state = { style: {} };
_this.state = {
style: {}
}; // if children is a function and animation is not active, set style to 'to'
// if children is a function and animation is not active, set style to 'to'
if (typeof children === 'function') {
_this.state = { style: to };
_this.state = {
style: to
};
}

@@ -64,3 +102,5 @@

if (steps && steps.length) {
_this.state = { style: steps[0].style };
_this.state = {
style: steps[0].style
};
} else if (from) {

@@ -71,5 +111,5 @@ if (typeof children === 'function') {

};
return _possibleConstructorReturn(_this);
}
_this.state = {

@@ -79,4 +119,7 @@ style: attributeName ? _defineProperty({}, attributeName, from) : from

} else {
_this.state = { style: {} };
_this.state = {
style: {}
};
}
return _this;

@@ -86,9 +129,7 @@ }

_createClass(Animate, [{
key: 'componentDidMount',
key: "componentDidMount",
value: function componentDidMount() {
var _props = this.props,
isActive = _props.isActive,
canBegin = _props.canBegin;
var _this$props2 = this.props,
isActive = _this$props2.isActive,
canBegin = _this$props2.canBegin;
this.mounted = true;

@@ -103,3 +144,3 @@

}, {
key: 'componentWillReceiveProps',
key: "componentWillReceiveProps",
value: function componentWillReceiveProps(nextProps) {

@@ -111,3 +152,2 @@ var isActive = nextProps.isActive,

if (!canBegin) {

@@ -121,9 +161,6 @@ return;

});
return;
}
var animateProps = ['to', 'canBegin', 'isActive'];
if (_isEqual(this.props.to, nextProps.to) && this.props.canBegin && this.props.isActive) {
if ((0, _isEqual2.default)(this.props.to, nextProps.to) && this.props.canBegin && this.props.isActive) {
return;

@@ -143,8 +180,6 @@ }

var from = isTriggered || shouldReAnimate ? nextProps.from : this.props.to;
this.setState({
style: attributeName ? _defineProperty({}, attributeName, from) : from
});
this.runAnimation(_extends({}, nextProps, {
this.runAnimation(_objectSpread({}, nextProps, {
from: from,

@@ -155,3 +190,3 @@ begin: 0

}, {
key: 'componentWillUnmount',
key: "componentWillUnmount",
value: function componentWillUnmount() {

@@ -174,3 +209,3 @@ this.mounted = false;

}, {
key: 'runJSAnimation',
key: "runJSAnimation",
value: function runJSAnimation(props) {

@@ -186,5 +221,4 @@ var _this2 = this;

onAnimationStart = props.onAnimationStart;
var startAnimation = (0, _configUpdate.default)(from, to, (0, _easing.configEasing)(easing), duration, this.changeStyle);
var startAnimation = configUpdate(from, to, configEasing(easing), duration, this.changeStyle);
var finalStartAnimation = function finalStartAnimation() {

@@ -197,3 +231,3 @@ _this2.stopJSAnimation = startAnimation();

}, {
key: 'runStepAnimation',
key: "runStepAnimation",
value: function runStepAnimation(props) {

@@ -208,5 +242,4 @@ var _this3 = this;

_steps$$duration = _steps$.duration,
initialTime = _steps$$duration === undefined ? 0 : _steps$$duration;
initialTime = _steps$$duration === void 0 ? 0 : _steps$$duration;
var addStyle = function addStyle(sequence, nextItem, index) {

@@ -219,8 +252,6 @@ if (index === 0) {

_nextItem$easing = nextItem.easing,
easing = _nextItem$easing === undefined ? 'ease' : _nextItem$easing,
easing = _nextItem$easing === void 0 ? 'ease' : _nextItem$easing,
style = nextItem.style,
nextProperties = nextItem.properties,
onAnimationEnd = nextItem.onAnimationEnd;
var preItem = index > 0 ? steps[index - 1] : nextItem;

@@ -230,3 +261,3 @@ var properties = nextProperties || Object.keys(style);

if (typeof easing === 'function' || easing === 'spring') {
return [].concat(_toConsumableArray(sequence), [_this3.runJSAnimation.bind(_this3, {
return _toConsumableArray(sequence).concat([_this3.runJSAnimation.bind(_this3, {
from: preItem.style,

@@ -239,8 +270,9 @@ to: style,

var transition = getTransitionVal(properties, duration, easing);
var newStyle = _extends({}, preItem.style, style, {
var transition = (0, _util.getTransitionVal)(properties, duration, easing);
var newStyle = _objectSpread({}, preItem.style, style, {
transition: transition
});
return [].concat(_toConsumableArray(sequence), [newStyle, duration, onAnimationEnd]).filter(identity);
return _toConsumableArray(sequence).concat([newStyle, duration, onAnimationEnd]).filter(_util.identity);
};

@@ -251,11 +283,11 @@

}, {
key: 'runAnimation',
key: "runAnimation",
value: function runAnimation(props) {
if (!this.manager) {
this.manager = createAnimateManager();
this.manager = (0, _AnimateManager.default)();
}
var begin = props.begin,
duration = props.duration,
attributeName = props.attributeName,
propsFrom = props.from,
propsTo = props.to,

@@ -267,6 +299,3 @@ easing = props.easing,

children = props.children;
var manager = this.manager;
this.unSubscribe = manager.subscribe(this.handleStyleChange);

@@ -285,8 +314,9 @@

var to = attributeName ? _defineProperty({}, attributeName, propsTo) : propsTo;
var transition = getTransitionVal(Object.keys(to), duration, easing);
manager.start([onAnimationStart, begin, _extends({}, to, { transition: transition }), duration, onAnimationEnd]);
var transition = (0, _util.getTransitionVal)(Object.keys(to), duration, easing);
manager.start([onAnimationStart, begin, _objectSpread({}, to, {
transition: transition
}), duration, onAnimationEnd]);
}
}, {
key: 'handleStyleChange',
key: "handleStyleChange",
value: function handleStyleChange(style) {

@@ -296,3 +326,3 @@ this.changeStyle(style);

}, {
key: 'changeStyle',
key: "changeStyle",
value: function changeStyle(style) {

@@ -306,23 +336,24 @@ if (this.mounted) {

}, {
key: 'render',
key: "render",
value: function render() {
var _props2 = this.props,
children = _props2.children,
begin = _props2.begin,
duration = _props2.duration,
attributeName = _props2.attributeName,
easing = _props2.easing,
isActive = _props2.isActive,
steps = _props2.steps,
from = _props2.from,
to = _props2.to,
canBegin = _props2.canBegin,
onAnimationEnd = _props2.onAnimationEnd,
shouldReAnimate = _props2.shouldReAnimate,
onAnimationReStart = _props2.onAnimationReStart,
others = _objectWithoutProperties(_props2, ['children', 'begin', 'duration', 'attributeName', 'easing', 'isActive', 'steps', 'from', 'to', 'canBegin', 'onAnimationEnd', 'shouldReAnimate', 'onAnimationReStart']);
var _this$props3 = this.props,
children = _this$props3.children,
begin = _this$props3.begin,
duration = _this$props3.duration,
attributeName = _this$props3.attributeName,
easing = _this$props3.easing,
isActive = _this$props3.isActive,
steps = _this$props3.steps,
from = _this$props3.from,
to = _this$props3.to,
canBegin = _this$props3.canBegin,
onAnimationEnd = _this$props3.onAnimationEnd,
shouldReAnimate = _this$props3.shouldReAnimate,
onAnimationReStart = _this$props3.onAnimationReStart,
others = _objectWithoutProperties(_this$props3, ["children", "begin", "duration", "attributeName", "easing", "isActive", "steps", "from", "to", "canBegin", "onAnimationEnd", "shouldReAnimate", "onAnimationReStart"]);
var count = Children.count(children);
var stateStyle = translateStyle(this.state.style);
var count = _react.Children.count(children);
var stateStyle = (0, _util.translateStyle)(this.state.style);
if (typeof children === 'function') {

@@ -339,8 +370,6 @@ return children(stateStyle);

_container$props$styl = _container$props.style,
style = _container$props$styl === undefined ? {} : _container$props$styl,
style = _container$props$styl === void 0 ? {} : _container$props$styl,
className = _container$props.className;
var res = cloneElement(container, _extends({}, others, {
style: _extends({}, style, stateStyle),
var res = (0, _react.cloneElement)(container, _objectSpread({}, others, {
style: _objectSpread({}, style, stateStyle),
className: className

@@ -352,14 +381,8 @@ }));

if (count === 1) {
var onlyChild = Children.only(children);
return cloneContainer(Children.only(children));
return cloneContainer(_react.Children.only(children));
}
return React.createElement(
'div',
null,
Children.map(children, function (child) {
return cloneContainer(child);
})
);
return _react.default.createElement("div", null, _react.Children.map(children, function (child) {
return cloneContainer(child);
}));
}

@@ -369,26 +392,26 @@ }]);

return Animate;
}(Component), _class2.displayName = 'Animate', _class2.propTypes = {
from: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
to: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
attributeName: PropTypes.string,
}(_react.Component), _class2.displayName = 'Animate', _class2.propTypes = {
from: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]),
to: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.string]),
attributeName: _propTypes.default.string,
// animation duration
duration: PropTypes.number,
begin: PropTypes.number,
easing: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
steps: PropTypes.arrayOf(PropTypes.shape({
duration: PropTypes.number.isRequired,
style: PropTypes.object.isRequired,
easing: PropTypes.oneOfType([PropTypes.oneOf(['ease', 'ease-in', 'ease-out', 'ease-in-out', 'linear']), PropTypes.func]),
duration: _propTypes.default.number,
begin: _propTypes.default.number,
easing: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func]),
steps: _propTypes.default.arrayOf(_propTypes.default.shape({
duration: _propTypes.default.number.isRequired,
style: _propTypes.default.object.isRequired,
easing: _propTypes.default.oneOfType([_propTypes.default.oneOf(['ease', 'ease-in', 'ease-out', 'ease-in-out', 'linear']), _propTypes.default.func]),
// transition css properties(dash case), optional
properties: PropTypes.arrayOf('string'),
onAnimationEnd: PropTypes.func
properties: _propTypes.default.arrayOf('string'),
onAnimationEnd: _propTypes.default.func
})),
children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
isActive: PropTypes.bool,
canBegin: PropTypes.bool,
onAnimationEnd: PropTypes.func,
children: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
isActive: _propTypes.default.bool,
canBegin: _propTypes.default.bool,
onAnimationEnd: _propTypes.default.func,
// decide if it should reanimate with initial from style when props change
shouldReAnimate: PropTypes.bool,
onAnimationStart: PropTypes.func,
onAnimationReStart: PropTypes.func
shouldReAnimate: _propTypes.default.bool,
onAnimationStart: _propTypes.default.func,
onAnimationReStart: _propTypes.default.func
}, _class2.defaultProps = {

@@ -408,2 +431,3 @@ begin: 0,

export default Animate;
var _default = Animate;
exports.default = _default;

97

es6/AnimateGroup.js

@@ -1,68 +0,49 @@

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
"use strict";
var _class, _temp;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _react = _interopRequireWildcard(require("react"));
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
var _reactTransitionGroup = require("react-transition-group");
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var _propTypes = _interopRequireDefault(require("prop-types"));
import React, { Component, Children } from 'react';
import TransitionGroup from 'react-transition-group/TransitionGroup';
import PropTypes from 'prop-types';
import AnimateGroupChild from './AnimateGroupChild';
var _AnimateGroupChild = _interopRequireDefault(require("./AnimateGroupChild"));
var AnimateGroup = (_temp = _class = function (_Component) {
_inherits(AnimateGroup, _Component);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function AnimateGroup() {
_classCallCheck(this, AnimateGroup);
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
return _possibleConstructorReturn(this, (AnimateGroup.__proto__ || Object.getPrototypeOf(AnimateGroup)).apply(this, arguments));
}
function AnimateGroup(props) {
var component = props.component,
children = props.children,
appear = props.appear,
enter = props.enter,
leave = props.leave;
return _react.default.createElement(_reactTransitionGroup.TransitionGroup, {
component: component
}, _react.Children.map(children, function (child, index) {
return _react.default.createElement(_AnimateGroupChild.default, {
appearOptions: appear,
enterOptions: enter,
leaveOptions: leave,
key: "child-".concat(index)
}, child);
}));
}
_createClass(AnimateGroup, [{
key: 'render',
value: function render() {
var _props = this.props,
component = _props.component,
children = _props.children,
appear = _props.appear,
enter = _props.enter,
leave = _props.leave;
return React.createElement(
TransitionGroup,
{ component: component },
Children.map(children, function (child, index) {
return React.createElement(
AnimateGroupChild,
{
appearOptions: appear,
enterOptions: enter,
leaveOptions: leave,
key: 'child-' + index
},
child
);
})
);
}
}]);
return AnimateGroup;
}(Component), _class.propTypes = {
appear: PropTypes.object,
enter: PropTypes.object,
leave: PropTypes.object,
children: PropTypes.oneOfType([PropTypes.array, PropTypes.element]),
component: PropTypes.any
}, _class.defaultProps = {
AnimateGroup.propTypes = {
appear: _propTypes.default.object,
enter: _propTypes.default.object,
leave: _propTypes.default.object,
children: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.element]),
component: _propTypes.default.any
};
AnimateGroup.defaultProps = {
component: 'span'
}, _temp);
export default AnimateGroup;
};
var _default = AnimateGroup;
exports.default = _default;

150

es6/AnimateGroupChild.js

@@ -1,23 +0,50 @@

import _isNumber from 'lodash/isNumber';
"use strict";
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _isNumber2 = _interopRequireDefault(require("lodash/isNumber"));
var _class, _temp2;
var _react = _interopRequireWildcard(require("react"));
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
var _reactTransitionGroup = require("react-transition-group");
var _propTypes = _interopRequireDefault(require("prop-types"));
var _Animate = _interopRequireDefault(require("./Animate"));
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
import React, { Component, Children } from 'react';
import Transition from 'react-transition-group/Transition';
import PropTypes from 'prop-types';
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
import Animate from './Animate';
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
var parseDurationOfSingleTransition = function parseDurationOfSingleTransition() {

@@ -28,10 +55,9 @@ var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

if (steps && steps.length) {
return steps.reduce(function (result, entry) {
return result + (_isNumber(entry.duration) && entry.duration > 0 ? entry.duration : 0);
return result + ((0, _isNumber2.default)(entry.duration) && entry.duration > 0 ? entry.duration : 0);
}, 0);
}
if (_isNumber(duration)) {
if ((0, _isNumber2.default)(duration)) {
return duration;

@@ -43,19 +69,24 @@ }

var AnimateGroupChild = (_temp2 = _class = function (_Component) {
var AnimateGroupChild =
/*#__PURE__*/
function (_Component) {
_inherits(AnimateGroupChild, _Component);
function AnimateGroupChild() {
var _ref;
var _getPrototypeOf2;
var _temp, _this, _ret;
var _this;
_classCallCheck(this, AnimateGroupChild);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = AnimateGroupChild.__proto__ || Object.getPrototypeOf(AnimateGroupChild)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(AnimateGroupChild)).call.apply(_getPrototypeOf2, [this].concat(args)));
_this.state = {
isActive: false
}, _this.handleEnter = function (node, isAppearing) {
};
_this.handleEnter = function (node, isAppearing) {
var _this$props = _this.props,

@@ -65,11 +96,14 @@ appearOptions = _this$props.appearOptions,

_this.handleStyleActive(isAppearing ? appearOptions : enterOptions);
};
_this.handleStyleActive(isAppearing ? appearOptions : enterOptions);
}, _this.handleExit = function () {
_this.handleExit = function () {
_this.handleStyleActive(_this.props.leaveOptions);
}, _temp), _possibleConstructorReturn(_this, _ret);
};
return _this;
}
_createClass(AnimateGroupChild, [{
key: 'handleStyleActive',
key: "handleStyleActive",
value: function handleStyleActive(style) {

@@ -80,4 +114,3 @@ if (style) {

} : null;
this.setState(_extends({}, style, {
this.setState(_objectSpread({}, style, {
onAnimationEnd: onAnimationEnd,

@@ -89,39 +122,29 @@ isActive: true

}, {
key: 'parseTimeout',
key: "parseTimeout",
value: function parseTimeout() {
var _props = this.props,
appearOptions = _props.appearOptions,
enterOptions = _props.enterOptions,
leaveOptions = _props.leaveOptions;
var _this$props2 = this.props,
appearOptions = _this$props2.appearOptions,
enterOptions = _this$props2.enterOptions,
leaveOptions = _this$props2.leaveOptions;
return parseDurationOfSingleTransition(appearOptions) + parseDurationOfSingleTransition(enterOptions) + parseDurationOfSingleTransition(leaveOptions);
}
}, {
key: 'render',
key: "render",
value: function render() {
var _this2 = this;
var _props2 = this.props,
children = _props2.children,
appearOptions = _props2.appearOptions,
enterOptions = _props2.enterOptions,
leaveOptions = _props2.leaveOptions,
props = _objectWithoutProperties(_props2, ['children', 'appearOptions', 'enterOptions', 'leaveOptions']);
var _this$props3 = this.props,
children = _this$props3.children,
appearOptions = _this$props3.appearOptions,
enterOptions = _this$props3.enterOptions,
leaveOptions = _this$props3.leaveOptions,
props = _objectWithoutProperties(_this$props3, ["children", "appearOptions", "enterOptions", "leaveOptions"]);
return React.createElement(
Transition,
_extends({}, props, {
onEnter: this.handleEnter,
onExit: this.handleExit,
timeout: this.parseTimeout()
}),
function (transitionState) {
return React.createElement(
Animate,
_this2.state,
Children.only(children)
);
}
);
return _react.default.createElement(_reactTransitionGroup.Transition, _extends({}, props, {
onEnter: this.handleEnter,
onExit: this.handleExit,
timeout: this.parseTimeout()
}), function () {
return _react.default.createElement(_Animate.default, _this2.state, _react.Children.only(children));
});
}

@@ -131,10 +154,11 @@ }]);

return AnimateGroupChild;
}(Component), _class.propTypes = {
appearOptions: PropTypes.object,
enterOptions: PropTypes.object,
leaveOptions: PropTypes.object,
children: PropTypes.element
}, _temp2);
}(_react.Component);
export default AnimateGroupChild;
AnimateGroupChild.propTypes = {
appearOptions: _propTypes.default.object,
enterOptions: _propTypes.default.object,
leaveOptions: _propTypes.default.object,
children: _propTypes.default.element
};
var _default = AnimateGroupChild;
exports.default = _default;

33

es6/AnimateManager.js

@@ -1,12 +0,29 @@

var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
"use strict";
function _toArray(arr) { return Array.isArray(arr) ? arr : Array.from(arr); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = createAnimateManager;
import setRafTimeout from './setRafTimeout';
var _setRafTimeout = _interopRequireDefault(require("./setRafTimeout"));
export default function createAnimateManager() {
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _toArray(arr) { return _arrayWithHoles(arr) || _iterableToArray(arr) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
function createAnimateManager() {
var currStyle = {};
var handleChange = function handleChange() {
return null;
};
var shouldStop = false;

@@ -31,4 +48,3 @@

if (typeof curr === 'number') {
setRafTimeout(setStyle.bind(null, restStyles), curr);
(0, _setRafTimeout.default)(setStyle.bind(null, restStyles), curr);
return;

@@ -38,7 +54,7 @@ }

setStyle(curr);
setRafTimeout(setStyle.bind(null, restStyles));
(0, _setRafTimeout.default)(setStyle.bind(null, restStyles));
return;
}
if ((typeof _style === 'undefined' ? 'undefined' : _typeof(_style)) === 'object') {
if (_typeof(_style) === 'object') {
currStyle = _style;

@@ -63,3 +79,2 @@ handleChange(currStyle);

handleChange = _handleChange;
return function () {

@@ -66,0 +81,0 @@ handleChange = function handleChange() {

117

es6/configUpdate.js

@@ -1,18 +0,42 @@

import _filter from 'lodash/filter';
"use strict";
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
var _filter2 = _interopRequireDefault(require("lodash/filter"));
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
var _raf = _interopRequireWildcard(require("raf"));
var _util = require("./util");
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
import raf, { cancel as caf } from 'raf';
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
import { getIntersectionKeys, mapObject } from './util';
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
var alpha = function alpha(begin, end, k) {
return begin + (end - begin) * k;
};
var needContinue = function needContinue(_ref) {

@@ -23,3 +47,2 @@ var from = _ref.from,

};
/*

@@ -29,4 +52,6 @@ * @description: cal new from value and velocity in each stepper

*/
var calStepperVals = function calStepperVals(easing, preVals, steps) {
var nextStepVals = mapObject(function (key, val) {
var nextStepVals = (0, _util.mapObject)(function (key, val) {
if (needContinue(val)) {

@@ -38,3 +63,3 @@ var _easing = easing(val.from, val.to, val.velocity),

return _extends({}, val, {
return _objectSpread({}, val, {
from: newX,

@@ -49,5 +74,5 @@ velocity: newV

if (steps < 1) {
return mapObject(function (key, val) {
return (0, _util.mapObject)(function (key, val) {
if (needContinue(val)) {
return _extends({}, val, {
return _objectSpread({}, val, {
velocity: alpha(val.velocity, nextStepVals[key].velocity, steps),

@@ -63,13 +88,12 @@ from: alpha(val.from, nextStepVals[key].from, steps)

return calStepperVals(easing, nextStepVals, steps - 1);
};
}; // configure update function
// configure update function
export default (function (from, to, easing, duration, render) {
var interKeys = getIntersectionKeys(from, to);
var _default = function _default(from, to, easing, duration, render) {
var interKeys = (0, _util.getIntersectionKeys)(from, to);
var timingStyle = interKeys.reduce(function (res, key) {
return _extends({}, res, _defineProperty({}, key, [from[key], to[key]]));
return _objectSpread({}, res, _defineProperty({}, key, [from[key], to[key]]));
}, {});
var stepperStyle = interKeys.reduce(function (res, key) {
return _extends({}, res, _defineProperty({}, key, {
return _objectSpread({}, res, _defineProperty({}, key, {
from: from[key],

@@ -81,4 +105,5 @@ velocity: 0,

var cafId = -1;
var preTime = void 0;
var beginTime = void 0;
var preTime;
var beginTime;
var update = function update() {

@@ -89,11 +114,12 @@ return null;

var getCurrStyle = function getCurrStyle() {
return mapObject(function (key, val) {
return (0, _util.mapObject)(function (key, val) {
return val.from;
}, stepperStyle);
};
var shouldStopAnimation = function shouldStopAnimation() {
return !_filter(stepperStyle, needContinue).length;
};
return !(0, _filter2.default)(stepperStyle, needContinue).length;
}; // stepper timing function like spring
// stepper timing function like spring
var stepperUpdate = function stepperUpdate(now) {

@@ -103,17 +129,16 @@ if (!preTime) {

}
var deltaTime = now - preTime;
var steps = deltaTime / easing.dt;
stepperStyle = calStepperVals(easing, stepperStyle, steps); // get union set and add compatible prefix
stepperStyle = calStepperVals(easing, stepperStyle, steps);
// get union set and add compatible prefix
render(_extends({}, from, to, getCurrStyle(stepperStyle)));
render(_objectSpread({}, from, to, getCurrStyle(stepperStyle)));
preTime = now;
if (!shouldStopAnimation()) {
cafId = raf(update);
cafId = (0, _raf.default)(update);
}
};
}; // t => val timing function like cubic-bezier
// t => val timing function like cubic-bezier
var timingUpdate = function timingUpdate(now) {

@@ -125,31 +150,29 @@ if (!beginTime) {

var t = (now - beginTime) / duration;
var currStyle = mapObject(function (key, val) {
return alpha.apply(undefined, _toConsumableArray(val).concat([easing(t)]));
}, timingStyle);
var currStyle = (0, _util.mapObject)(function (key, val) {
return alpha.apply(void 0, _toConsumableArray(val).concat([easing(t)]));
}, timingStyle); // get union set and add compatible prefix
// get union set and add compatible prefix
render(_extends({}, from, to, currStyle));
render(_objectSpread({}, from, to, currStyle));
if (t < 1) {
cafId = raf(update);
cafId = (0, _raf.default)(update);
} else {
var finalStyle = mapObject(function (key, val) {
return alpha.apply(undefined, _toConsumableArray(val).concat([easing(1)]));
var finalStyle = (0, _util.mapObject)(function (key, val) {
return alpha.apply(void 0, _toConsumableArray(val).concat([easing(1)]));
}, timingStyle);
render(_extends({}, from, to, finalStyle));
render(_objectSpread({}, from, to, finalStyle));
}
};
update = easing.isStepper ? stepperUpdate : timingUpdate;
update = easing.isStepper ? stepperUpdate : timingUpdate; // return start animation method
// return start animation method
return function () {
raf(update);
(0, _raf.default)(update); // return stop animation method
// return stop animation method
return function () {
caf(cafId);
(0, _raf.cancel)(cafId);
};
};
});
};
exports.default = _default;

79

es6/easing.js

@@ -1,5 +0,18 @@

function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
"use strict";
import { warn } from './util';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.configEasing = exports.configSpring = exports.configBezier = void 0;
var _util = require("./util");
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
var ACCURACY = 1e-4;

@@ -22,3 +35,2 @@

var params = cubicBezierFactor(c1, c2);
return multyTime(params, t);

@@ -31,13 +43,14 @@ };

var params = cubicBezierFactor(c1, c2);
var newParams = [].concat(_toConsumableArray(params.map(function (param, i) {
var newParams = _toConsumableArray(params.map(function (param, i) {
return param * i;
}).slice(1)), [0]);
}).slice(1)).concat([0]);
return multyTime(newParams, t);
};
};
}; // calculate cubic-bezier using Newton's method
// calculate cubic-bezier using Newton's method
export var configBezier = function configBezier() {
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
var configBezier = function configBezier() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];

@@ -51,3 +64,2 @@ }

if (args.length === 1) {

@@ -60,4 +72,4 @@ switch (args[0]) {

y2 = 1.0;
break;
break;
case 'ease':

@@ -68,4 +80,4 @@ x1 = 0.25;

y2 = 1.0;
break;
break;
case 'ease-in':

@@ -76,4 +88,4 @@ x1 = 0.42;

y2 = 1.0;
break;
break;
case 'ease-out':

@@ -84,4 +96,4 @@ x1 = 0.42;

y2 = 1.0;
break;
break;
case 'ease-in-out':

@@ -92,16 +104,16 @@ x1 = 0.0;

y2 = 1.0;
break;
break;
default:
warn(false, '[configBezier]: arguments should be one of ' + 'oneOf \'linear\', \'ease\', \'ease-in\', \'ease-out\', ' + '\'ease-in-out\', instead received %s', args);
(0, _util.warn)(false, '[configBezier]: arguments should be one of ' + 'oneOf \'linear\', \'ease\', \'ease-in\', \'ease-out\', ' + '\'ease-in-out\', instead received %s', args);
}
}
warn([x1, x2, y1, y2].every(function (num) {
(0, _util.warn)([x1, x2, y1, y2].every(function (num) {
return typeof num === 'number' && num >= 0 && num <= 1;
}), '[configBezier]: arguments should be x1, y1, x2, y2 of [0, 1] instead received %s', args);
var curveX = cubicBezier(x1, x2);
var curveY = cubicBezier(y1, y2);
var derCurveX = derivativeCubicBezier(x1, x2);
var rangeValue = function rangeValue(value) {

@@ -136,14 +148,15 @@ if (value > 1) {

bezier.isStepper = false;
return bezier;
};
export var configSpring = function configSpring() {
exports.configBezier = configBezier;
var configSpring = function configSpring() {
var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var _config$stiff = config.stiff,
stiff = _config$stiff === undefined ? 100 : _config$stiff,
stiff = _config$stiff === void 0 ? 100 : _config$stiff,
_config$damping = config.damping,
damping = _config$damping === undefined ? 8 : _config$damping,
damping = _config$damping === void 0 ? 8 : _config$damping,
_config$dt = config.dt,
dt = _config$dt === undefined ? 17 : _config$dt;
dt = _config$dt === void 0 ? 17 : _config$dt;

@@ -159,2 +172,3 @@ var stepper = function stepper(currX, destX, currV) {

}
return [newX, newV];

@@ -165,8 +179,9 @@ };

stepper.dt = dt;
return stepper;
};
export var configEasing = function configEasing() {
for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
exports.configSpring = configSpring;
var configEasing = function configEasing() {
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];

@@ -177,3 +192,2 @@ }

if (typeof easing === 'string') {

@@ -187,6 +201,8 @@ switch (easing) {

return configBezier(easing);
case 'spring':
return configSpring();
default:
warn(false, '[configEasing]: first argument should be one of \'ease\', \'ease-in\', ' + '\'ease-out\', \'ease-in-out\', \'linear\' and \'spring\', instead received %s', args);
(0, _util.warn)(false, '[configEasing]: first argument should be one of \'ease\', \'ease-in\', ' + '\'ease-out\', \'ease-in-out\', \'linear\' and \'spring\', instead received %s', args);
}

@@ -199,5 +215,6 @@ }

warn(false, '[configEasing]: first argument type should be function or ' + 'string, instead received %s', args);
(0, _util.warn)(false, '[configEasing]: first argument type should be function or ' + 'string, instead received %s', args);
return null;
};
return null;
};
exports.configEasing = configEasing;

47

es6/index.js

@@ -1,8 +0,43 @@

import Animate from './Animate';
import { configBezier, configSpring } from './easing';
import { translateStyle } from './util';
import AnimateGroup from './AnimateGroup';
"use strict";
export { configSpring, configBezier, AnimateGroup, translateStyle };
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "configBezier", {
enumerable: true,
get: function get() {
return _easing.configBezier;
}
});
Object.defineProperty(exports, "configSpring", {
enumerable: true,
get: function get() {
return _easing.configSpring;
}
});
Object.defineProperty(exports, "translateStyle", {
enumerable: true,
get: function get() {
return _util.translateStyle;
}
});
Object.defineProperty(exports, "AnimateGroup", {
enumerable: true,
get: function get() {
return _AnimateGroup.default;
}
});
exports.default = void 0;
export default Animate;
var _Animate = _interopRequireDefault(require("./Animate"));
var _easing = require("./easing");
var _util = require("./util");
var _AnimateGroup = _interopRequireDefault(require("./AnimateGroup"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _default = _Animate.default;
exports.default = _default;

44

es6/PureRender.js

@@ -1,7 +0,19 @@

import _isPlainObject from 'lodash/isPlainObject';
import _isEqual from 'lodash/isEqual';
import _isArray from 'lodash/isArray';
"use strict";
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.shallowEqual = shallowEqual;
exports.default = void 0;
var _isPlainObject2 = _interopRequireDefault(require("lodash/isPlainObject"));
var _isEqual2 = _interopRequireDefault(require("lodash/isEqual"));
var _isArray2 = _interopRequireDefault(require("lodash/isArray"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function shallowEqual(objA, objB) {

@@ -12,3 +24,3 @@ if (objA === objB) {

if ((typeof objA === 'undefined' ? 'undefined' : _typeof(objA)) !== 'object' || objA === null || (typeof objB === 'undefined' ? 'undefined' : _typeof(objB)) !== 'object' || objB === null) {
if (_typeof(objA) !== 'object' || objA === null || _typeof(objB) !== 'object' || objB === null) {
return false;

@@ -25,2 +37,3 @@ }

var bHasOwnProperty = hasOwnProperty.bind(objB);
for (var i = 0; i < keysA.length; i++) {

@@ -31,13 +44,13 @@ var keyA = keysA[i];

continue;
}
} // special diff with Array or Object
// special diff with Array or Object
if (_isArray(objA[keyA])) {
if (!_isArray(objB[keyA]) || objA[keyA].length !== objB[keyA].length) {
if ((0, _isArray2.default)(objA[keyA])) {
if (!(0, _isArray2.default)(objB[keyA]) || objA[keyA].length !== objB[keyA].length) {
return false;
} else if (!_isEqual(objA[keyA], objB[keyA])) {
} else if (!(0, _isEqual2.default)(objA[keyA], objB[keyA])) {
return false;
}
} else if (_isPlainObject(objA[keyA])) {
if (!_isPlainObject(objB[keyA]) || !_isEqual(objA[keyA], objB[keyA])) {
} else if ((0, _isPlainObject2.default)(objA[keyA])) {
if (!(0, _isPlainObject2.default)(objB[keyA]) || !(0, _isEqual2.default)(objA[keyA], objB[keyA])) {
return false;

@@ -61,6 +74,9 @@ }

/* eslint-disable no-param-reassign */
function pureRenderDecorator(component) {
component.prototype.shouldComponentUpdate = shouldComponentUpdate;
}
export { shallowEqual };
export default pureRenderDecorator;
var _default = pureRenderDecorator;
exports.default = _default;

18

es6/setRafTimeout.js

@@ -1,6 +0,14 @@

import raf from 'raf';
"use strict";
export default function setRafTimeout(callback) {
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = setRafTimeout;
var _raf = _interopRequireDefault(require("raf"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function setRafTimeout(callback) {
var timeout = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
var currTime = -1;

@@ -17,7 +25,7 @@

} else {
raf(shouldUpdate);
(0, _raf.default)(shouldUpdate);
}
};
raf(shouldUpdate);
(0, _raf.default)(shouldUpdate);
}

116

es6/util.js

@@ -1,5 +0,14 @@

import _intersection from 'lodash/intersection';
"use strict";
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.warn = exports.getTransitionVal = exports.compose = exports.translateStyle = exports.mapObject = exports.debugf = exports.debug = exports.log = exports.generatePrefixStyle = exports.getDashCase = exports.identity = exports.getIntersectionKeys = void 0;
var _intersection2 = _interopRequireDefault(require("lodash/intersection"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

@@ -12,10 +21,11 @@

export var getIntersectionKeys = function getIntersectionKeys(preObj, nextObj) {
return _intersection(Object.keys(preObj), Object.keys(nextObj));
var getIntersectionKeys = function getIntersectionKeys(preObj, nextObj) {
return (0, _intersection2.default)(Object.keys(preObj), Object.keys(nextObj));
};
export var identity = function identity(param) {
exports.getIntersectionKeys = getIntersectionKeys;
var identity = function identity(param) {
return param;
};
/*

@@ -25,8 +35,11 @@ * @description: convert camel case to dash case

*/
export var getDashCase = function getDashCase(name) {
exports.identity = identity;
var getDashCase = function getDashCase(name) {
return name.replace(/([A-Z])/g, function (v) {
return '-' + v.toLowerCase();
return "-".concat(v.toLowerCase());
});
};
/*

@@ -36,3 +49,7 @@ * @description: add compatible style prefix

*/
export var generatePrefixStyle = function generatePrefixStyle(name, value) {
exports.getDashCase = getDashCase;
var generatePrefixStyle = function generatePrefixStyle(name, value) {
if (IN_COMPATIBLE_PROPERTY.indexOf(name) === -1) {

@@ -47,13 +64,14 @@ return _defineProperty({}, name, value);

var styleVal = value;
return PREFIX_LIST.reduce(function (result, property, i) {
if (isTransition) {
styleVal = value.replace(/(transform|transform-origin)/gim, IN_LINE_PREFIX_LIST[i] + '$1');
styleVal = value.replace(/(transform|transform-origin)/gim, "".concat(IN_LINE_PREFIX_LIST[i], "$1"));
}
return _extends({}, result, _defineProperty({}, property + camelName, styleVal));
return _objectSpread({}, result, _defineProperty({}, property + camelName, styleVal));
}, {});
};
export var log = function log() {
exports.generatePrefixStyle = generatePrefixStyle;
var log = function log() {
var _console;

@@ -63,3 +81,2 @@

};
/*

@@ -69,10 +86,12 @@ * @description: log the value of a varible

*/
export var debug = function debug(name) {
exports.log = log;
var debug = function debug(name) {
return function (item) {
log(name, item);
return item;
};
};
/*

@@ -82,18 +101,19 @@ * @description: log name, args, return value of a function

*/
export var debugf = function debugf(tag, f) {
exports.debug = debug;
var debugf = function debugf(tag, f) {
return function () {
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
var res = f.apply(undefined, args);
var res = f.apply(void 0, args);
var name = tag || f.name || 'anonymous function';
var argNames = '(' + args.map(JSON.stringify).join(', ') + ')';
log(name + ': ' + argNames + ' => ' + JSON.stringify(res));
var argNames = "(".concat(args.map(JSON.stringify).join(', '), ")");
log("".concat(name, ": ").concat(argNames, " => ").concat(JSON.stringify(res)));
return res;
};
};
/*

@@ -103,8 +123,11 @@ * @description: map object on every element in this object.

*/
export var mapObject = function mapObject(fn, obj) {
exports.debugf = debugf;
var mapObject = function mapObject(fn, obj) {
return Object.keys(obj).reduce(function (res, key) {
return _extends({}, res, _defineProperty({}, key, fn(key, obj[key])));
return _objectSpread({}, res, _defineProperty({}, key, fn(key, obj[key])));
}, {});
};
/*

@@ -114,10 +137,16 @@ * @description: add compatible prefix to style

*/
export var translateStyle = function translateStyle(style) {
exports.mapObject = mapObject;
var translateStyle = function translateStyle(style) {
return Object.keys(style).reduce(function (res, key) {
return _extends({}, res, generatePrefixStyle(key, res[key]));
return _objectSpread({}, res, generatePrefixStyle(key, res[key]));
}, style);
};
export var compose = function compose() {
for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
exports.translateStyle = translateStyle;
var compose = function compose() {
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];

@@ -130,23 +159,25 @@ }

var fns = args.reverse();
// first function can receive multiply arguments
var fns = args.reverse(); // first function can receive multiply arguments
var firstFn = fns[0];
var tailsFn = fns.slice(1);
return function () {
return tailsFn.reduce(function (res, fn) {
return fn(res);
}, firstFn.apply(undefined, arguments));
}, firstFn.apply(void 0, arguments));
};
};
export var getTransitionVal = function getTransitionVal(props, duration, easing) {
exports.compose = compose;
var getTransitionVal = function getTransitionVal(props, duration, easing) {
return props.map(function (prop) {
return getDashCase(prop) + ' ' + duration + 'ms ' + easing;
return "".concat(getDashCase(prop), " ").concat(duration, "ms ").concat(easing);
}).join(',');
};
exports.getTransitionVal = getTransitionVal;
var isDev = process.env.NODE_ENV !== 'production';
export var warn = function warn(condition, format, a, b, c, d, e, f) {
var warn = function warn(condition, format, a, b, c, d, e, f) {
if (isDev && typeof console !== 'undefined' && console.warn) {

@@ -163,3 +194,2 @@ if (format === undefined) {

var argIndex = 0;
console.warn(format.replace(/%s/g, function () {

@@ -171,2 +201,4 @@ return args[argIndex++];

}
};
};
exports.warn = warn;

260

lib/Animate.js

@@ -1,63 +0,58 @@

'use strict';
import _isEqual from "lodash/isEqual";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _isEqual2 = require('lodash/isEqual');
var _isEqual3 = _interopRequireDefault(_isEqual2);
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _class, _class2, _temp;
var _react = require('react');
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _react2 = _interopRequireDefault(_react);
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
var _propTypes = require('prop-types');
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
var _AnimateManager = require('./AnimateManager');
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
var _AnimateManager2 = _interopRequireDefault(_AnimateManager);
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
var _PureRender = require('./PureRender');
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
var _PureRender2 = _interopRequireDefault(_PureRender);
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
var _easing = require('./easing');
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _configUpdate = require('./configUpdate');
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _configUpdate2 = _interopRequireDefault(_configUpdate);
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _util = require('./util');
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
import React, { Component, cloneElement, Children } from 'react';
import PropTypes from 'prop-types';
import createAnimateManager from './AnimateManager';
import pureRender from './PureRender';
import { configEasing } from './easing';
import configUpdate from './configUpdate';
import { getTransitionVal, identity, translateStyle } from './util';
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var Animate = (0, _PureRender2.default)(_class = (_temp = _class2 = function (_Component) {
var Animate = pureRender(_class = (_temp = _class2 =
/*#__PURE__*/
function (_Component) {
_inherits(Animate, _Component);
function Animate(props, context) {
var _this;
_classCallCheck(this, Animate);
var _this = _possibleConstructorReturn(this, (Animate.__proto__ || Object.getPrototypeOf(Animate)).call(this, props, context));
_this = _possibleConstructorReturn(this, _getPrototypeOf(Animate).call(this, props, context));
var _this$props = _this.props,

@@ -70,13 +65,14 @@ isActive = _this$props.isActive,

children = _this$props.children;
_this.handleStyleChange = _this.handleStyleChange.bind(_assertThisInitialized(_assertThisInitialized(_this)));
_this.changeStyle = _this.changeStyle.bind(_assertThisInitialized(_assertThisInitialized(_this)));
_this.handleStyleChange = _this.handleStyleChange.bind(_this);
_this.changeStyle = _this.changeStyle.bind(_this);
if (!isActive) {
_this.state = { style: {} };
_this.state = {
style: {}
}; // if children is a function and animation is not active, set style to 'to'
// if children is a function and animation is not active, set style to 'to'
if (typeof children === 'function') {
_this.state = { style: to };
_this.state = {
style: to
};
}

@@ -88,3 +84,5 @@

if (steps && steps.length) {
_this.state = { style: steps[0].style };
_this.state = {
style: steps[0].style
};
} else if (from) {

@@ -95,5 +93,5 @@ if (typeof children === 'function') {

};
return _possibleConstructorReturn(_this);
}
_this.state = {

@@ -103,4 +101,7 @@ style: attributeName ? _defineProperty({}, attributeName, from) : from

} else {
_this.state = { style: {} };
_this.state = {
style: {}
};
}
return _this;

@@ -110,9 +111,7 @@ }

_createClass(Animate, [{
key: 'componentDidMount',
key: "componentDidMount",
value: function componentDidMount() {
var _props = this.props,
isActive = _props.isActive,
canBegin = _props.canBegin;
var _this$props2 = this.props,
isActive = _this$props2.isActive,
canBegin = _this$props2.canBegin;
this.mounted = true;

@@ -127,3 +126,3 @@

}, {
key: 'componentWillReceiveProps',
key: "componentWillReceiveProps",
value: function componentWillReceiveProps(nextProps) {

@@ -135,3 +134,2 @@ var isActive = nextProps.isActive,

if (!canBegin) {

@@ -145,9 +143,6 @@ return;

});
return;
}
var animateProps = ['to', 'canBegin', 'isActive'];
if ((0, _isEqual3.default)(this.props.to, nextProps.to) && this.props.canBegin && this.props.isActive) {
if (_isEqual(this.props.to, nextProps.to) && this.props.canBegin && this.props.isActive) {
return;

@@ -167,8 +162,6 @@ }

var from = isTriggered || shouldReAnimate ? nextProps.from : this.props.to;
this.setState({
style: attributeName ? _defineProperty({}, attributeName, from) : from
});
this.runAnimation(_extends({}, nextProps, {
this.runAnimation(_objectSpread({}, nextProps, {
from: from,

@@ -179,3 +172,3 @@ begin: 0

}, {
key: 'componentWillUnmount',
key: "componentWillUnmount",
value: function componentWillUnmount() {

@@ -198,3 +191,3 @@ this.mounted = false;

}, {
key: 'runJSAnimation',
key: "runJSAnimation",
value: function runJSAnimation(props) {

@@ -210,5 +203,4 @@ var _this2 = this;

onAnimationStart = props.onAnimationStart;
var startAnimation = configUpdate(from, to, configEasing(easing), duration, this.changeStyle);
var startAnimation = (0, _configUpdate2.default)(from, to, (0, _easing.configEasing)(easing), duration, this.changeStyle);
var finalStartAnimation = function finalStartAnimation() {

@@ -221,3 +213,3 @@ _this2.stopJSAnimation = startAnimation();

}, {
key: 'runStepAnimation',
key: "runStepAnimation",
value: function runStepAnimation(props) {

@@ -232,5 +224,4 @@ var _this3 = this;

_steps$$duration = _steps$.duration,
initialTime = _steps$$duration === undefined ? 0 : _steps$$duration;
initialTime = _steps$$duration === void 0 ? 0 : _steps$$duration;
var addStyle = function addStyle(sequence, nextItem, index) {

@@ -243,8 +234,6 @@ if (index === 0) {

_nextItem$easing = nextItem.easing,
easing = _nextItem$easing === undefined ? 'ease' : _nextItem$easing,
easing = _nextItem$easing === void 0 ? 'ease' : _nextItem$easing,
style = nextItem.style,
nextProperties = nextItem.properties,
onAnimationEnd = nextItem.onAnimationEnd;
var preItem = index > 0 ? steps[index - 1] : nextItem;

@@ -254,3 +243,3 @@ var properties = nextProperties || Object.keys(style);

if (typeof easing === 'function' || easing === 'spring') {
return [].concat(_toConsumableArray(sequence), [_this3.runJSAnimation.bind(_this3, {
return _toConsumableArray(sequence).concat([_this3.runJSAnimation.bind(_this3, {
from: preItem.style,

@@ -263,8 +252,9 @@ to: style,

var transition = (0, _util.getTransitionVal)(properties, duration, easing);
var newStyle = _extends({}, preItem.style, style, {
var transition = getTransitionVal(properties, duration, easing);
var newStyle = _objectSpread({}, preItem.style, style, {
transition: transition
});
return [].concat(_toConsumableArray(sequence), [newStyle, duration, onAnimationEnd]).filter(_util.identity);
return _toConsumableArray(sequence).concat([newStyle, duration, onAnimationEnd]).filter(identity);
};

@@ -275,11 +265,11 @@

}, {
key: 'runAnimation',
key: "runAnimation",
value: function runAnimation(props) {
if (!this.manager) {
this.manager = (0, _AnimateManager2.default)();
this.manager = createAnimateManager();
}
var begin = props.begin,
duration = props.duration,
attributeName = props.attributeName,
propsFrom = props.from,
propsTo = props.to,

@@ -291,6 +281,3 @@ easing = props.easing,

children = props.children;
var manager = this.manager;
this.unSubscribe = manager.subscribe(this.handleStyleChange);

@@ -309,8 +296,9 @@

var to = attributeName ? _defineProperty({}, attributeName, propsTo) : propsTo;
var transition = (0, _util.getTransitionVal)(Object.keys(to), duration, easing);
manager.start([onAnimationStart, begin, _extends({}, to, { transition: transition }), duration, onAnimationEnd]);
var transition = getTransitionVal(Object.keys(to), duration, easing);
manager.start([onAnimationStart, begin, _objectSpread({}, to, {
transition: transition
}), duration, onAnimationEnd]);
}
}, {
key: 'handleStyleChange',
key: "handleStyleChange",
value: function handleStyleChange(style) {

@@ -320,3 +308,3 @@ this.changeStyle(style);

}, {
key: 'changeStyle',
key: "changeStyle",
value: function changeStyle(style) {

@@ -330,22 +318,22 @@ if (this.mounted) {

}, {
key: 'render',
key: "render",
value: function render() {
var _props2 = this.props,
children = _props2.children,
begin = _props2.begin,
duration = _props2.duration,
attributeName = _props2.attributeName,
easing = _props2.easing,
isActive = _props2.isActive,
steps = _props2.steps,
from = _props2.from,
to = _props2.to,
canBegin = _props2.canBegin,
onAnimationEnd = _props2.onAnimationEnd,
shouldReAnimate = _props2.shouldReAnimate,
onAnimationReStart = _props2.onAnimationReStart,
others = _objectWithoutProperties(_props2, ['children', 'begin', 'duration', 'attributeName', 'easing', 'isActive', 'steps', 'from', 'to', 'canBegin', 'onAnimationEnd', 'shouldReAnimate', 'onAnimationReStart']);
var _this$props3 = this.props,
children = _this$props3.children,
begin = _this$props3.begin,
duration = _this$props3.duration,
attributeName = _this$props3.attributeName,
easing = _this$props3.easing,
isActive = _this$props3.isActive,
steps = _this$props3.steps,
from = _this$props3.from,
to = _this$props3.to,
canBegin = _this$props3.canBegin,
onAnimationEnd = _this$props3.onAnimationEnd,
shouldReAnimate = _this$props3.shouldReAnimate,
onAnimationReStart = _this$props3.onAnimationReStart,
others = _objectWithoutProperties(_this$props3, ["children", "begin", "duration", "attributeName", "easing", "isActive", "steps", "from", "to", "canBegin", "onAnimationEnd", "shouldReAnimate", "onAnimationReStart"]);
var count = _react.Children.count(children);
var stateStyle = (0, _util.translateStyle)(this.state.style);
var count = Children.count(children);
var stateStyle = translateStyle(this.state.style);

@@ -363,8 +351,6 @@ if (typeof children === 'function') {

_container$props$styl = _container$props.style,
style = _container$props$styl === undefined ? {} : _container$props$styl,
style = _container$props$styl === void 0 ? {} : _container$props$styl,
className = _container$props.className;
var res = (0, _react.cloneElement)(container, _extends({}, others, {
style: _extends({}, style, stateStyle),
var res = cloneElement(container, _objectSpread({}, others, {
style: _objectSpread({}, style, stateStyle),
className: className

@@ -376,14 +362,8 @@ }));

if (count === 1) {
var onlyChild = _react.Children.only(children);
return cloneContainer(_react.Children.only(children));
return cloneContainer(Children.only(children));
}
return _react2.default.createElement(
'div',
null,
_react.Children.map(children, function (child) {
return cloneContainer(child);
})
);
return React.createElement("div", null, Children.map(children, function (child) {
return cloneContainer(child);
}));
}

@@ -393,26 +373,26 @@ }]);

return Animate;
}(_react.Component), _class2.displayName = 'Animate', _class2.propTypes = {
from: _propTypes2.default.oneOfType([_propTypes2.default.object, _propTypes2.default.string]),
to: _propTypes2.default.oneOfType([_propTypes2.default.object, _propTypes2.default.string]),
attributeName: _propTypes2.default.string,
}(Component), _class2.displayName = 'Animate', _class2.propTypes = {
from: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
to: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
attributeName: PropTypes.string,
// animation duration
duration: _propTypes2.default.number,
begin: _propTypes2.default.number,
easing: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func]),
steps: _propTypes2.default.arrayOf(_propTypes2.default.shape({
duration: _propTypes2.default.number.isRequired,
style: _propTypes2.default.object.isRequired,
easing: _propTypes2.default.oneOfType([_propTypes2.default.oneOf(['ease', 'ease-in', 'ease-out', 'ease-in-out', 'linear']), _propTypes2.default.func]),
duration: PropTypes.number,
begin: PropTypes.number,
easing: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
steps: PropTypes.arrayOf(PropTypes.shape({
duration: PropTypes.number.isRequired,
style: PropTypes.object.isRequired,
easing: PropTypes.oneOfType([PropTypes.oneOf(['ease', 'ease-in', 'ease-out', 'ease-in-out', 'linear']), PropTypes.func]),
// transition css properties(dash case), optional
properties: _propTypes2.default.arrayOf('string'),
onAnimationEnd: _propTypes2.default.func
properties: PropTypes.arrayOf('string'),
onAnimationEnd: PropTypes.func
})),
children: _propTypes2.default.oneOfType([_propTypes2.default.node, _propTypes2.default.func]),
isActive: _propTypes2.default.bool,
canBegin: _propTypes2.default.bool,
onAnimationEnd: _propTypes2.default.func,
children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
isActive: PropTypes.bool,
canBegin: PropTypes.bool,
onAnimationEnd: PropTypes.func,
// decide if it should reanimate with initial from style when props change
shouldReAnimate: _propTypes2.default.bool,
onAnimationStart: _propTypes2.default.func,
onAnimationReStart: _propTypes2.default.func
shouldReAnimate: PropTypes.bool,
onAnimationStart: PropTypes.func,
onAnimationReStart: PropTypes.func
}, _class2.defaultProps = {

@@ -432,2 +412,2 @@ begin: 0,

exports.default = Animate;
export default Animate;

113

lib/AnimateGroup.js

@@ -1,85 +0,34 @@

'use strict';
import React, { Children } from 'react';
import { TransitionGroup } from 'react-transition-group';
import PropTypes from 'prop-types';
import AnimateGroupChild from './AnimateGroupChild';
Object.defineProperty(exports, "__esModule", {
value: true
});
function AnimateGroup(props) {
var component = props.component,
children = props.children,
appear = props.appear,
enter = props.enter,
leave = props.leave;
return React.createElement(TransitionGroup, {
component: component
}, Children.map(children, function (child, index) {
return React.createElement(AnimateGroupChild, {
appearOptions: appear,
enterOptions: enter,
leaveOptions: leave,
key: "child-".concat(index)
}, child);
}));
}
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _class, _temp;
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _TransitionGroup = require('react-transition-group/TransitionGroup');
var _TransitionGroup2 = _interopRequireDefault(_TransitionGroup);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
var _AnimateGroupChild = require('./AnimateGroupChild');
var _AnimateGroupChild2 = _interopRequireDefault(_AnimateGroupChild);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var AnimateGroup = (_temp = _class = function (_Component) {
_inherits(AnimateGroup, _Component);
function AnimateGroup() {
_classCallCheck(this, AnimateGroup);
return _possibleConstructorReturn(this, (AnimateGroup.__proto__ || Object.getPrototypeOf(AnimateGroup)).apply(this, arguments));
}
_createClass(AnimateGroup, [{
key: 'render',
value: function render() {
var _props = this.props,
component = _props.component,
children = _props.children,
appear = _props.appear,
enter = _props.enter,
leave = _props.leave;
return _react2.default.createElement(
_TransitionGroup2.default,
{ component: component },
_react.Children.map(children, function (child, index) {
return _react2.default.createElement(
_AnimateGroupChild2.default,
{
appearOptions: appear,
enterOptions: enter,
leaveOptions: leave,
key: 'child-' + index
},
child
);
})
);
}
}]);
return AnimateGroup;
}(_react.Component), _class.propTypes = {
appear: _propTypes2.default.object,
enter: _propTypes2.default.object,
leave: _propTypes2.default.object,
children: _propTypes2.default.oneOfType([_propTypes2.default.array, _propTypes2.default.element]),
component: _propTypes2.default.any
}, _class.defaultProps = {
AnimateGroup.propTypes = {
appear: PropTypes.object,
enter: PropTypes.object,
leave: PropTypes.object,
children: PropTypes.oneOfType([PropTypes.array, PropTypes.element]),
component: PropTypes.any
};
AnimateGroup.defaultProps = {
component: 'span'
}, _temp);
exports.default = AnimateGroup;
};
export default AnimateGroup;

145

lib/AnimateGroupChild.js

@@ -1,43 +0,36 @@

'use strict';
import _isNumber from "lodash/isNumber";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _isNumber2 = require('lodash/isNumber');
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _isNumber3 = _interopRequireDefault(_isNumber2);
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
var _class, _temp2;
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _react = require('react');
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var _react2 = _interopRequireDefault(_react);
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
var _Transition = require('react-transition-group/Transition');
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
var _Transition2 = _interopRequireDefault(_Transition);
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
var _propTypes = require('prop-types');
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
var _propTypes2 = _interopRequireDefault(_propTypes);
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var _Animate = require('./Animate');
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
var _Animate2 = _interopRequireDefault(_Animate);
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
import React, { Component, Children } from 'react';
import { Transition } from 'react-transition-group';
import PropTypes from 'prop-types';
import Animate from './Animate';
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var parseDurationOfSingleTransition = function parseDurationOfSingleTransition() {

@@ -48,10 +41,9 @@ var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

if (steps && steps.length) {
return steps.reduce(function (result, entry) {
return result + ((0, _isNumber3.default)(entry.duration) && entry.duration > 0 ? entry.duration : 0);
return result + (_isNumber(entry.duration) && entry.duration > 0 ? entry.duration : 0);
}, 0);
}
if ((0, _isNumber3.default)(duration)) {
if (_isNumber(duration)) {
return duration;

@@ -63,19 +55,24 @@ }

var AnimateGroupChild = (_temp2 = _class = function (_Component) {
var AnimateGroupChild =
/*#__PURE__*/
function (_Component) {
_inherits(AnimateGroupChild, _Component);
function AnimateGroupChild() {
var _ref;
var _getPrototypeOf2;
var _temp, _this, _ret;
var _this;
_classCallCheck(this, AnimateGroupChild);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = AnimateGroupChild.__proto__ || Object.getPrototypeOf(AnimateGroupChild)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(AnimateGroupChild)).call.apply(_getPrototypeOf2, [this].concat(args)));
_this.state = {
isActive: false
}, _this.handleEnter = function (node, isAppearing) {
};
_this.handleEnter = function (node, isAppearing) {
var _this$props = _this.props,

@@ -85,11 +82,14 @@ appearOptions = _this$props.appearOptions,

_this.handleStyleActive(isAppearing ? appearOptions : enterOptions);
};
_this.handleStyleActive(isAppearing ? appearOptions : enterOptions);
}, _this.handleExit = function () {
_this.handleExit = function () {
_this.handleStyleActive(_this.props.leaveOptions);
}, _temp), _possibleConstructorReturn(_this, _ret);
};
return _this;
}
_createClass(AnimateGroupChild, [{
key: 'handleStyleActive',
key: "handleStyleActive",
value: function handleStyleActive(style) {

@@ -100,4 +100,3 @@ if (style) {

} : null;
this.setState(_extends({}, style, {
this.setState(_objectSpread({}, style, {
onAnimationEnd: onAnimationEnd,

@@ -109,39 +108,29 @@ isActive: true

}, {
key: 'parseTimeout',
key: "parseTimeout",
value: function parseTimeout() {
var _props = this.props,
appearOptions = _props.appearOptions,
enterOptions = _props.enterOptions,
leaveOptions = _props.leaveOptions;
var _this$props2 = this.props,
appearOptions = _this$props2.appearOptions,
enterOptions = _this$props2.enterOptions,
leaveOptions = _this$props2.leaveOptions;
return parseDurationOfSingleTransition(appearOptions) + parseDurationOfSingleTransition(enterOptions) + parseDurationOfSingleTransition(leaveOptions);
}
}, {
key: 'render',
key: "render",
value: function render() {
var _this2 = this;
var _props2 = this.props,
children = _props2.children,
appearOptions = _props2.appearOptions,
enterOptions = _props2.enterOptions,
leaveOptions = _props2.leaveOptions,
props = _objectWithoutProperties(_props2, ['children', 'appearOptions', 'enterOptions', 'leaveOptions']);
var _this$props3 = this.props,
children = _this$props3.children,
appearOptions = _this$props3.appearOptions,
enterOptions = _this$props3.enterOptions,
leaveOptions = _this$props3.leaveOptions,
props = _objectWithoutProperties(_this$props3, ["children", "appearOptions", "enterOptions", "leaveOptions"]);
return _react2.default.createElement(
_Transition2.default,
_extends({}, props, {
onEnter: this.handleEnter,
onExit: this.handleExit,
timeout: this.parseTimeout()
}),
function (transitionState) {
return _react2.default.createElement(
_Animate2.default,
_this2.state,
_react.Children.only(children)
);
}
);
return React.createElement(Transition, _extends({}, props, {
onEnter: this.handleEnter,
onExit: this.handleExit,
timeout: this.parseTimeout()
}), function () {
return React.createElement(Animate, _this2.state, Children.only(children));
});
}

@@ -151,8 +140,10 @@ }]);

return AnimateGroupChild;
}(_react.Component), _class.propTypes = {
appearOptions: _propTypes2.default.object,
enterOptions: _propTypes2.default.object,
leaveOptions: _propTypes2.default.object,
children: _propTypes2.default.element
}, _temp2);
exports.default = AnimateGroupChild;
}(Component);
AnimateGroupChild.propTypes = {
appearOptions: PropTypes.object,
enterOptions: PropTypes.object,
leaveOptions: PropTypes.object,
children: PropTypes.element
};
export default AnimateGroupChild;

31

lib/AnimateManager.js

@@ -1,24 +0,19 @@

'use strict';
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
Object.defineProperty(exports, "__esModule", {
value: true
});
function _toArray(arr) { return _arrayWithHoles(arr) || _iterableToArray(arr) || _nonIterableRest(); }
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
exports.default = createAnimateManager;
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
var _setRafTimeout = require('./setRafTimeout');
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
var _setRafTimeout2 = _interopRequireDefault(_setRafTimeout);
import setRafTimeout from './setRafTimeout';
export default function createAnimateManager() {
var currStyle = {};
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _toArray(arr) { return Array.isArray(arr) ? arr : Array.from(arr); }
function createAnimateManager() {
var currStyle = {};
var handleChange = function handleChange() {
return null;
};
var shouldStop = false;

@@ -43,4 +38,3 @@

if (typeof curr === 'number') {
(0, _setRafTimeout2.default)(setStyle.bind(null, restStyles), curr);
setRafTimeout(setStyle.bind(null, restStyles), curr);
return;

@@ -50,7 +44,7 @@ }

setStyle(curr);
(0, _setRafTimeout2.default)(setStyle.bind(null, restStyles));
setRafTimeout(setStyle.bind(null, restStyles));
return;
}
if ((typeof _style === 'undefined' ? 'undefined' : _typeof(_style)) === 'object') {
if (_typeof(_style) === 'object') {
currStyle = _style;

@@ -75,3 +69,2 @@ handleChange(currStyle);

handleChange = _handleChange;
return function () {

@@ -78,0 +71,0 @@ handleChange = function handleChange() {

106

lib/configUpdate.js

@@ -1,26 +0,25 @@

'use strict';
import _filter from "lodash/filter";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
var _filter2 = require('lodash/filter');
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
var _filter3 = _interopRequireDefault(_filter2);
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
var _raf = require('raf');
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var _raf2 = _interopRequireDefault(_raf);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
var _util = require('./util');
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
import raf, { cancel as caf } from 'raf';
import { getIntersectionKeys, mapObject } from './util';

@@ -30,2 +29,3 @@ var alpha = function alpha(begin, end, k) {

};
var needContinue = function needContinue(_ref) {

@@ -36,3 +36,2 @@ var from = _ref.from,

};
/*

@@ -42,4 +41,6 @@ * @description: cal new from value and velocity in each stepper

*/
var calStepperVals = function calStepperVals(easing, preVals, steps) {
var nextStepVals = (0, _util.mapObject)(function (key, val) {
var nextStepVals = mapObject(function (key, val) {
if (needContinue(val)) {

@@ -51,3 +52,3 @@ var _easing = easing(val.from, val.to, val.velocity),

return _extends({}, val, {
return _objectSpread({}, val, {
from: newX,

@@ -62,5 +63,5 @@ velocity: newV

if (steps < 1) {
return (0, _util.mapObject)(function (key, val) {
return mapObject(function (key, val) {
if (needContinue(val)) {
return _extends({}, val, {
return _objectSpread({}, val, {
velocity: alpha(val.velocity, nextStepVals[key].velocity, steps),

@@ -76,14 +77,12 @@ from: alpha(val.from, nextStepVals[key].from, steps)

return calStepperVals(easing, nextStepVals, steps - 1);
};
}; // configure update function
// configure update function
exports.default = function (from, to, easing, duration, render) {
var interKeys = (0, _util.getIntersectionKeys)(from, to);
export default (function (from, to, easing, duration, render) {
var interKeys = getIntersectionKeys(from, to);
var timingStyle = interKeys.reduce(function (res, key) {
return _extends({}, res, _defineProperty({}, key, [from[key], to[key]]));
return _objectSpread({}, res, _defineProperty({}, key, [from[key], to[key]]));
}, {});
var stepperStyle = interKeys.reduce(function (res, key) {
return _extends({}, res, _defineProperty({}, key, {
return _objectSpread({}, res, _defineProperty({}, key, {
from: from[key],

@@ -95,4 +94,5 @@ velocity: 0,

var cafId = -1;
var preTime = void 0;
var beginTime = void 0;
var preTime;
var beginTime;
var update = function update() {

@@ -103,11 +103,12 @@ return null;

var getCurrStyle = function getCurrStyle() {
return (0, _util.mapObject)(function (key, val) {
return mapObject(function (key, val) {
return val.from;
}, stepperStyle);
};
var shouldStopAnimation = function shouldStopAnimation() {
return !(0, _filter3.default)(stepperStyle, needContinue).length;
};
return !_filter(stepperStyle, needContinue).length;
}; // stepper timing function like spring
// stepper timing function like spring
var stepperUpdate = function stepperUpdate(now) {

@@ -117,17 +118,16 @@ if (!preTime) {

}
var deltaTime = now - preTime;
var steps = deltaTime / easing.dt;
stepperStyle = calStepperVals(easing, stepperStyle, steps); // get union set and add compatible prefix
stepperStyle = calStepperVals(easing, stepperStyle, steps);
// get union set and add compatible prefix
render(_extends({}, from, to, getCurrStyle(stepperStyle)));
render(_objectSpread({}, from, to, getCurrStyle(stepperStyle)));
preTime = now;
if (!shouldStopAnimation()) {
cafId = (0, _raf2.default)(update);
cafId = raf(update);
}
};
}; // t => val timing function like cubic-bezier
// t => val timing function like cubic-bezier
var timingUpdate = function timingUpdate(now) {

@@ -139,31 +139,27 @@ if (!beginTime) {

var t = (now - beginTime) / duration;
var currStyle = (0, _util.mapObject)(function (key, val) {
return alpha.apply(undefined, _toConsumableArray(val).concat([easing(t)]));
}, timingStyle);
var currStyle = mapObject(function (key, val) {
return alpha.apply(void 0, _toConsumableArray(val).concat([easing(t)]));
}, timingStyle); // get union set and add compatible prefix
// get union set and add compatible prefix
render(_extends({}, from, to, currStyle));
render(_objectSpread({}, from, to, currStyle));
if (t < 1) {
cafId = (0, _raf2.default)(update);
cafId = raf(update);
} else {
var finalStyle = (0, _util.mapObject)(function (key, val) {
return alpha.apply(undefined, _toConsumableArray(val).concat([easing(1)]));
var finalStyle = mapObject(function (key, val) {
return alpha.apply(void 0, _toConsumableArray(val).concat([easing(1)]));
}, timingStyle);
render(_extends({}, from, to, finalStyle));
render(_objectSpread({}, from, to, finalStyle));
}
};
update = easing.isStepper ? stepperUpdate : timingUpdate;
update = easing.isStepper ? stepperUpdate : timingUpdate; // return start animation method
// return start animation method
return function () {
(0, _raf2.default)(update);
raf(update); // return stop animation method
// return stop animation method
return function () {
(0, _raf.cancel)(cafId);
caf(cafId);
};
};
};
});

68

lib/easing.js

@@ -1,12 +0,10 @@

'use strict';
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.configEasing = exports.configSpring = exports.configBezier = undefined;
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
var _util = require('./util');
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
import { warn } from './util';
var ACCURACY = 1e-4;

@@ -29,3 +27,2 @@

var params = cubicBezierFactor(c1, c2);
return multyTime(params, t);

@@ -38,13 +35,14 @@ };

var params = cubicBezierFactor(c1, c2);
var newParams = [].concat(_toConsumableArray(params.map(function (param, i) {
var newParams = _toConsumableArray(params.map(function (param, i) {
return param * i;
}).slice(1)), [0]);
}).slice(1)).concat([0]);
return multyTime(newParams, t);
};
};
}; // calculate cubic-bezier using Newton's method
// calculate cubic-bezier using Newton's method
var configBezier = exports.configBezier = function configBezier() {
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
export var configBezier = function configBezier() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];

@@ -58,3 +56,2 @@ }

if (args.length === 1) {

@@ -67,4 +64,4 @@ switch (args[0]) {

y2 = 1.0;
break;
break;
case 'ease':

@@ -75,4 +72,4 @@ x1 = 0.25;

y2 = 1.0;
break;
break;
case 'ease-in':

@@ -83,4 +80,4 @@ x1 = 0.42;

y2 = 1.0;
break;
break;
case 'ease-out':

@@ -91,4 +88,4 @@ x1 = 0.42;

y2 = 1.0;
break;
break;
case 'ease-in-out':

@@ -99,16 +96,16 @@ x1 = 0.0;

y2 = 1.0;
break;
break;
default:
(0, _util.warn)(false, '[configBezier]: arguments should be one of ' + 'oneOf \'linear\', \'ease\', \'ease-in\', \'ease-out\', ' + '\'ease-in-out\', instead received %s', args);
warn(false, '[configBezier]: arguments should be one of ' + 'oneOf \'linear\', \'ease\', \'ease-in\', \'ease-out\', ' + '\'ease-in-out\', instead received %s', args);
}
}
(0, _util.warn)([x1, x2, y1, y2].every(function (num) {
warn([x1, x2, y1, y2].every(function (num) {
return typeof num === 'number' && num >= 0 && num <= 1;
}), '[configBezier]: arguments should be x1, y1, x2, y2 of [0, 1] instead received %s', args);
var curveX = cubicBezier(x1, x2);
var curveY = cubicBezier(y1, y2);
var derCurveX = derivativeCubicBezier(x1, x2);
var rangeValue = function rangeValue(value) {

@@ -143,14 +140,12 @@ if (value > 1) {

bezier.isStepper = false;
return bezier;
};
var configSpring = exports.configSpring = function configSpring() {
export var configSpring = function configSpring() {
var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var _config$stiff = config.stiff,
stiff = _config$stiff === undefined ? 100 : _config$stiff,
stiff = _config$stiff === void 0 ? 100 : _config$stiff,
_config$damping = config.damping,
damping = _config$damping === undefined ? 8 : _config$damping,
damping = _config$damping === void 0 ? 8 : _config$damping,
_config$dt = config.dt,
dt = _config$dt === undefined ? 17 : _config$dt;
dt = _config$dt === void 0 ? 17 : _config$dt;

@@ -166,2 +161,3 @@ var stepper = function stepper(currX, destX, currV) {

}
return [newX, newV];

@@ -172,8 +168,6 @@ };

stepper.dt = dt;
return stepper;
};
var configEasing = exports.configEasing = function configEasing() {
for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
export var configEasing = function configEasing() {
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];

@@ -184,3 +178,2 @@ }

if (typeof easing === 'string') {

@@ -194,6 +187,8 @@ switch (easing) {

return configBezier(easing);
case 'spring':
return configSpring();
default:
(0, _util.warn)(false, '[configEasing]: first argument should be one of \'ease\', \'ease-in\', ' + '\'ease-out\', \'ease-in-out\', \'linear\' and \'spring\', instead received %s', args);
warn(false, '[configEasing]: first argument should be one of \'ease\', \'ease-in\', ' + '\'ease-out\', \'ease-in-out\', \'linear\' and \'spring\', instead received %s', args);
}

@@ -206,5 +201,4 @@ }

(0, _util.warn)(false, '[configEasing]: first argument type should be function or ' + 'string, instead received %s', args);
warn(false, '[configEasing]: first argument type should be function or ' + 'string, instead received %s', args);
return null;
};

32

lib/index.js

@@ -1,26 +0,6 @@

'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.translateStyle = exports.AnimateGroup = exports.configBezier = exports.configSpring = undefined;
var _Animate = require('./Animate');
var _Animate2 = _interopRequireDefault(_Animate);
var _easing = require('./easing');
var _util = require('./util');
var _AnimateGroup = require('./AnimateGroup');
var _AnimateGroup2 = _interopRequireDefault(_AnimateGroup);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.configSpring = _easing.configSpring;
exports.configBezier = _easing.configBezier;
exports.AnimateGroup = _AnimateGroup2.default;
exports.translateStyle = _util.translateStyle;
exports.default = _Animate2.default;
import Animate from './Animate';
import { configBezier, configSpring } from './easing';
import { translateStyle } from './util';
import AnimateGroup from './AnimateGroup';
export { configSpring, configBezier, AnimateGroup, translateStyle };
export default Animate;

49

lib/PureRender.js

@@ -1,24 +0,7 @@

'use strict';
import _isPlainObject from "lodash/isPlainObject";
import _isEqual from "lodash/isEqual";
import _isArray from "lodash/isArray";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.shallowEqual = undefined;
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var _isPlainObject2 = require('lodash/isPlainObject');
var _isPlainObject3 = _interopRequireDefault(_isPlainObject2);
var _isEqual2 = require('lodash/isEqual');
var _isEqual3 = _interopRequireDefault(_isEqual2);
var _isArray2 = require('lodash/isArray');
var _isArray3 = _interopRequireDefault(_isArray2);
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function shallowEqual(objA, objB) {

@@ -29,3 +12,3 @@ if (objA === objB) {

if ((typeof objA === 'undefined' ? 'undefined' : _typeof(objA)) !== 'object' || objA === null || (typeof objB === 'undefined' ? 'undefined' : _typeof(objB)) !== 'object' || objB === null) {
if (_typeof(objA) !== 'object' || objA === null || _typeof(objB) !== 'object' || objB === null) {
return false;

@@ -42,2 +25,3 @@ }

var bHasOwnProperty = hasOwnProperty.bind(objB);
for (var i = 0; i < keysA.length; i++) {

@@ -48,13 +32,13 @@ var keyA = keysA[i];

continue;
}
} // special diff with Array or Object
// special diff with Array or Object
if ((0, _isArray3.default)(objA[keyA])) {
if (!(0, _isArray3.default)(objB[keyA]) || objA[keyA].length !== objB[keyA].length) {
if (_isArray(objA[keyA])) {
if (!_isArray(objB[keyA]) || objA[keyA].length !== objB[keyA].length) {
return false;
} else if (!(0, _isEqual3.default)(objA[keyA], objB[keyA])) {
} else if (!_isEqual(objA[keyA], objB[keyA])) {
return false;
}
} else if ((0, _isPlainObject3.default)(objA[keyA])) {
if (!(0, _isPlainObject3.default)(objB[keyA]) || !(0, _isEqual3.default)(objA[keyA], objB[keyA])) {
} else if (_isPlainObject(objA[keyA])) {
if (!_isPlainObject(objB[keyA]) || !_isEqual(objA[keyA], objB[keyA])) {
return false;

@@ -78,6 +62,9 @@ }

/* eslint-disable no-param-reassign */
function pureRenderDecorator(component) {
component.prototype.shouldComponentUpdate = shouldComponentUpdate;
}
exports.shallowEqual = shallowEqual;
exports.default = pureRenderDecorator;
export { shallowEqual };
export default pureRenderDecorator;

21

lib/setRafTimeout.js

@@ -1,17 +0,4 @@

'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = setRafTimeout;
var _raf = require('raf');
var _raf2 = _interopRequireDefault(_raf);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function setRafTimeout(callback) {
import raf from 'raf';
export default function setRafTimeout(callback) {
var timeout = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
var currTime = -1;

@@ -28,7 +15,7 @@

} else {
(0, _raf2.default)(shouldUpdate);
raf(shouldUpdate);
}
};
(0, _raf2.default)(shouldUpdate);
raf(shouldUpdate);
}

94

lib/util.js

@@ -1,16 +0,5 @@

'use strict';
import _intersection from "lodash/intersection";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.warn = exports.getTransitionVal = exports.compose = exports.translateStyle = exports.mapObject = exports.debugf = exports.debug = exports.log = exports.generatePrefixStyle = exports.getDashCase = exports.identity = exports.getIntersectionKeys = undefined;
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
var _intersection2 = require('lodash/intersection');
var _intersection3 = _interopRequireDefault(_intersection2);
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

@@ -22,11 +11,8 @@

var IN_COMPATIBLE_PROPERTY = ['transform', 'transformOrigin', 'transition'];
var getIntersectionKeys = exports.getIntersectionKeys = function getIntersectionKeys(preObj, nextObj) {
return (0, _intersection3.default)(Object.keys(preObj), Object.keys(nextObj));
export var getIntersectionKeys = function getIntersectionKeys(preObj, nextObj) {
return _intersection(Object.keys(preObj), Object.keys(nextObj));
};
var identity = exports.identity = function identity(param) {
export var identity = function identity(param) {
return param;
};
/*

@@ -36,8 +22,8 @@ * @description: convert camel case to dash case

*/
var getDashCase = exports.getDashCase = function getDashCase(name) {
export var getDashCase = function getDashCase(name) {
return name.replace(/([A-Z])/g, function (v) {
return '-' + v.toLowerCase();
return "-".concat(v.toLowerCase());
});
};
/*

@@ -47,3 +33,4 @@ * @description: add compatible style prefix

*/
var generatePrefixStyle = exports.generatePrefixStyle = function generatePrefixStyle(name, value) {
export var generatePrefixStyle = function generatePrefixStyle(name, value) {
if (IN_COMPATIBLE_PROPERTY.indexOf(name) === -1) {

@@ -58,13 +45,11 @@ return _defineProperty({}, name, value);

var styleVal = value;
return PREFIX_LIST.reduce(function (result, property, i) {
if (isTransition) {
styleVal = value.replace(/(transform|transform-origin)/gim, IN_LINE_PREFIX_LIST[i] + '$1');
styleVal = value.replace(/(transform|transform-origin)/gim, "".concat(IN_LINE_PREFIX_LIST[i], "$1"));
}
return _extends({}, result, _defineProperty({}, property + camelName, styleVal));
return _objectSpread({}, result, _defineProperty({}, property + camelName, styleVal));
}, {});
};
var log = exports.log = function log() {
export var log = function log() {
var _console;

@@ -74,3 +59,2 @@

};
/*

@@ -80,10 +64,9 @@ * @description: log the value of a varible

*/
var debug = exports.debug = function debug(name) {
export var debug = function debug(name) {
return function (item) {
log(name, item);
return item;
};
};
/*

@@ -93,18 +76,16 @@ * @description: log name, args, return value of a function

*/
var debugf = exports.debugf = function debugf(tag, f) {
export var debugf = function debugf(tag, f) {
return function () {
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
var res = f.apply(undefined, args);
var res = f.apply(void 0, args);
var name = tag || f.name || 'anonymous function';
var argNames = '(' + args.map(JSON.stringify).join(', ') + ')';
log(name + ': ' + argNames + ' => ' + JSON.stringify(res));
var argNames = "(".concat(args.map(JSON.stringify).join(', '), ")");
log("".concat(name, ": ").concat(argNames, " => ").concat(JSON.stringify(res)));
return res;
};
};
/*

@@ -114,8 +95,8 @@ * @description: map object on every element in this object.

*/
var mapObject = exports.mapObject = function mapObject(fn, obj) {
export var mapObject = function mapObject(fn, obj) {
return Object.keys(obj).reduce(function (res, key) {
return _extends({}, res, _defineProperty({}, key, fn(key, obj[key])));
return _objectSpread({}, res, _defineProperty({}, key, fn(key, obj[key])));
}, {});
};
/*

@@ -125,10 +106,10 @@ * @description: add compatible prefix to style

*/
var translateStyle = exports.translateStyle = function translateStyle(style) {
export var translateStyle = function translateStyle(style) {
return Object.keys(style).reduce(function (res, key) {
return _extends({}, res, generatePrefixStyle(key, res[key]));
return _objectSpread({}, res, generatePrefixStyle(key, res[key]));
}, style);
};
var compose = exports.compose = function compose() {
for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
export var compose = function compose() {
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];

@@ -141,23 +122,19 @@ }

var fns = args.reverse();
// first function can receive multiply arguments
var fns = args.reverse(); // first function can receive multiply arguments
var firstFn = fns[0];
var tailsFn = fns.slice(1);
return function () {
return tailsFn.reduce(function (res, fn) {
return fn(res);
}, firstFn.apply(undefined, arguments));
}, firstFn.apply(void 0, arguments));
};
};
var getTransitionVal = exports.getTransitionVal = function getTransitionVal(props, duration, easing) {
export var getTransitionVal = function getTransitionVal(props, duration, easing) {
return props.map(function (prop) {
return getDashCase(prop) + ' ' + duration + 'ms ' + easing;
return "".concat(getDashCase(prop), " ").concat(duration, "ms ").concat(easing);
}).join(',');
};
var isDev = process.env.NODE_ENV !== 'production';
var warn = exports.warn = function warn(condition, format, a, b, c, d, e, f) {
export var warn = function warn(condition, format, a, b, c, d, e, f) {
if (isDev && typeof console !== 'undefined' && console.warn) {

@@ -174,3 +151,2 @@ if (format === undefined) {

var argIndex = 0;
console.warn(format.replace(/%s/g, function () {

@@ -177,0 +153,0 @@ return args[argIndex++];

63

package.json
{
"name": "react-smooth",
"version": "1.0.0",
"version": "1.0.1",
"description": "react animation library",
"main": "lib/index",
"jsnext:main": "es6/index",
"module": "es6/index",
"files": [
"*.md",
"demo",
"es6",

@@ -25,8 +24,7 @@ "lib",

"build-es6": "rimraf es6 && babel ./src -d es6",
"build-umd": "cross-env NODE_ENV=development BABEL_ENV=commonjs webpack src/index.js umd/ReactSmooth.js",
"build-min": "cross-env NODE_ENV=production BABEL_ENV=commonjs webpack src/index.js umd/ReactSmooth.min.js",
"test": "cross-env NODE_ENV=test ./node_modules/.bin/karma start --single-run",
"test-watch": "cross-env NODE_ENV=test ./node_modules/.bin/karma start",
"test-browser": "cross-env NODE_ENV=test ./node_modules/.bin/karma start",
"demo": "cross-env BABEL_ENV=commonjs webpack-dev-server --progress --port 4000 --colors --content-base demo --hot --inline --config demo/webpack.config.js",
"build-umd": "cross-env NODE_ENV=development BABEL_ENV=commonjs webpack src/index.js -o umd/ReactSmooth.js",
"build-min": "cross-env NODE_ENV=production BABEL_ENV=commonjs webpack src/index.js -o umd/ReactSmooth.min.js",
"test": "cross-env NODE_ENV=test karma start test/karma.conf.js",
"demo": "cross-env BABEL_ENV=commonjs webpack-dev-server --progress --port 4000 --colors --content-base demo --hot --inline --config demo/webpack.config.js",
"autofix": "eslint src --fix",
"lint": "eslint src"

@@ -53,18 +51,22 @@ },

"prop-types": "^15.6.0",
"raf": "^3.2.0",
"react-transition-group": "^2.2.1"
"raf": "^3.4.0",
"react-transition-group": "^2.5.0"
},
"devDependencies": {
"babel-cli": "^6.26.0",
"babel-core": "^6.26.0",
"babel-eslint": "^8.0.1",
"babel-loader": "^7.1.2",
"babel-plugin-lodash": "^3.2.0",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-export-extensions": "^6.22.0",
"babel-polyfill": "^6.26.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.5.0",
"babel-register": "^6.7.2",
"@babel/cli": "^7.1.0",
"@babel/core": "^7.0.0",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-decorators": "^7.0.0",
"@babel/plugin-proposal-export-default-from": "^7.0.0",
"@babel/plugin-proposal-export-namespace-from": "^7.0.0",
"@babel/plugin-proposal-function-bind": "^7.0.0",
"@babel/plugin-proposal-object-rest-spread": "^7.0.0",
"@babel/plugin-transform-runtime": "^7.0.0",
"@babel/polyfill": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"@babel/runtime": "^7.0.0",
"babel-eslint": "^10.0.0",
"babel-loader": "^8.0.0",
"babel-plugin-lodash": "^3.3.0",
"chai": "^4.1.2",

@@ -81,9 +83,12 @@ "chai-enzyme": "^0.8.0",

"eslint-plugin-react": "^7.4.0",
"karma": "^1.7.1",
"json-loader": "^0.5.7",
"karma": "^3.0.0",
"karma-chai": "^0.1.0",
"karma-chrome-launcher": "^2.2.0",
"karma-firefox-launcher": "^1.0.1",
"karma-coverage": "^1.1.0",
"karma-coveralls": "^2.1.0",
"karma-firefox-launcher": "^1.1.0",
"karma-mocha": "^1.3.0",
"karma-sourcemap-loader": "^0.3.7",
"karma-webpack": "^2.0.4",
"karma-webpack": "^4.0.0-rc.2",
"mocha": "^4.0.1",

@@ -94,6 +99,8 @@ "pre-commit": "^1.1.3",

"react-dom": "^16.0.0",
"webpack": "^3.6.0",
"webpack-dev-server": "^2.9.1"
"webpack": "^4.20.0",
"webpack-bundle-analyzer": "^2.11.0",
"webpack-cli": "^3.1.0",
"webpack-dev-server": "^3.1.9"
},
"license": "MIT"
}

2

README.md

@@ -19,3 +19,3 @@ # react-smooth

```jsx
<Animate to={0} from={1} attributeName="opacity">
<Animate to="0" from="1" attributeName="opacity">
<div />

@@ -22,0 +22,0 @@ </Animate>

19

src/Animate.js

@@ -60,3 +60,5 @@ import React, { Component, cloneElement, Children } from 'react';

const { isActive, attributeName, from, to, steps, children } = this.props;
const {
isActive, attributeName, from, to, steps, children,
} = this.props;

@@ -108,3 +110,5 @@ this.handleStyleChange = this.handleStyleChange.bind(this);

componentWillReceiveProps(nextProps) {
const { isActive, canBegin, attributeName, shouldReAnimate } = nextProps;
const {
isActive, canBegin, attributeName, shouldReAnimate,
} = nextProps;

@@ -123,4 +127,2 @@ if (!canBegin) {

const animateProps = ['to', 'canBegin', 'isActive'];
if (_.isEqual(this.props.to, nextProps.to) && this.props.canBegin && this.props.isActive) {

@@ -171,3 +173,5 @@ return;

runJSAnimation(props) {
const { from, to, duration, easing, begin, onAnimationEnd, onAnimationStart } = props;
const {
from, to, duration, easing, begin, onAnimationEnd, onAnimationStart,
} = props;
const startAnimation = configUpdate(from, to, configEasing(easing), duration, this.changeStyle);

@@ -242,3 +246,2 @@

attributeName,
from: propsFrom,
to: propsTo,

@@ -312,3 +315,3 @@ easing,

const cloneContainer = container => {
const cloneContainer = (container) => {
const { style = {}, className } = container.props;

@@ -328,4 +331,2 @@

if (count === 1) {
const onlyChild = Children.only(children);
return cloneContainer(Children.only(children));

@@ -332,0 +333,0 @@ }

67

src/AnimateGroup.js

@@ -1,42 +0,41 @@

import React, { Component, Children } from 'react';
import TransitionGroup from 'react-transition-group/TransitionGroup';
import React, { Children } from 'react';
import { TransitionGroup } from 'react-transition-group';
import PropTypes from 'prop-types';
import AnimateGroupChild from './AnimateGroupChild';
class AnimateGroup extends Component {
static propTypes = {
appear: PropTypes.object,
enter: PropTypes.object,
leave: PropTypes.object,
function AnimateGroup(props) {
const {
component, children, appear, enter, leave,
} = props;
children: PropTypes.oneOfType([PropTypes.array, PropTypes.element]),
component: PropTypes.any,
};
return (
<TransitionGroup component={component}>
{
Children.map(children, (child, index) => ((
<AnimateGroupChild
appearOptions={appear}
enterOptions={enter}
leaveOptions={leave}
key={`child-${index}`}
>
{child}
</AnimateGroupChild>
)))
}
</TransitionGroup>
);
}
static defaultProps = {
component: 'span',
};
AnimateGroup.propTypes = {
appear: PropTypes.object,
enter: PropTypes.object,
leave: PropTypes.object,
children: PropTypes.oneOfType([PropTypes.array, PropTypes.element]),
component: PropTypes.any,
};
render() {
const { component, children, appear, enter, leave } = this.props;
AnimateGroup.defaultProps = {
component: 'span',
};
return (
<TransitionGroup component={component}>
{
Children.map(children, (child, index) => ((
<AnimateGroupChild
appearOptions={appear}
enterOptions={enter}
leaveOptions={leave}
key={`child-${index}`}
>
{child}
</AnimateGroupChild>
)))
}
</TransitionGroup>
);
}
}
export default AnimateGroup;

10

src/AnimateGroupChild.js
import React, { Component, Children } from 'react';
import Transition from 'react-transition-group/Transition';
import { Transition } from 'react-transition-group';
import PropTypes from 'prop-types';

@@ -71,3 +71,5 @@ import _ from 'lodash';

render() {
const { children, appearOptions, enterOptions, leaveOptions, ...props } = this.props;
const {
children, appearOptions, enterOptions, leaveOptions, ...props
} = this.props;

@@ -81,7 +83,7 @@ return (

>
{transitionState => ((
{() => (
<Animate {...this.state}>
{Children.only(children)}
</Animate>
))}
)}
</Transition>

@@ -88,0 +90,0 @@ );

6

src/AnimateManager.js

@@ -8,3 +8,3 @@ import setRafTimeout from './setRafTimeout';

const setStyle = _style => {
const setStyle = (_style) => {
if (shouldStop) {

@@ -45,7 +45,7 @@ return;

},
start: style => {
start: (style) => {
shouldStop = false;
setStyle(style);
},
subscribe: _handleChange => {
subscribe: (_handleChange) => {
handleChange = _handleChange;

@@ -52,0 +52,0 @@

4

src/configUpdate.js

@@ -71,3 +71,3 @@ import raf, { cancel as caf } from 'raf';

// stepper timing function like spring
const stepperUpdate = now => {
const stepperUpdate = (now) => {
if (!preTime) {

@@ -95,3 +95,3 @@ preTime = now;

// t => val timing function like cubic-bezier
const timingUpdate = now => {
const timingUpdate = (now) => {
if (!beginTime) {

@@ -98,0 +98,0 @@ beginTime = now;

14

src/easing.js

@@ -14,6 +14,5 @@ import { warn } from './util';

params.map((param, i) =>
param * Math.pow(t, i)
).reduce((pre, curr) => pre + curr);
param * (t ** i)).reduce((pre, curr) => pre + curr);
const cubicBezier = (c1, c2) => t => {
const cubicBezier = (c1, c2) => (t) => {
const params = cubicBezierFactor(c1, c2);

@@ -24,3 +23,3 @@

const derivativeCubicBezier = (c1, c2) => t => {
const derivativeCubicBezier = (c1, c2) => (t) => {
const params = cubicBezierFactor(c1, c2);

@@ -60,3 +59,4 @@ const newParams = [...params.map((param, i) => param * i).slice(1), 0];

warn([x1, x2, y1, y2].every(num => (typeof num === 'number' && num >= 0 && num <= 1)),
warn(
[x1, x2, y1, y2].every(num => (typeof num === 'number' && num >= 0 && num <= 1)),
'[configBezier]: arguments should be x1, y1, x2, y2 of [0, 1] instead received %s',

@@ -69,3 +69,3 @@ args,

const derCurveX = derivativeCubicBezier(x1, x2);
const rangeValue = value => {
const rangeValue = (value) => {
if (value > 1) {

@@ -80,3 +80,3 @@ return 1;

const bezier = _t => {
const bezier = (_t) => {
const t = _t > 1 ? 1 : _t;

@@ -83,0 +83,0 @@ let x = t;

2

src/setRafTimeout.js

@@ -6,3 +6,3 @@ import raf from 'raf';

const shouldUpdate = now => {
const shouldUpdate = (now) => {
if (currTime < 0) {

@@ -9,0 +9,0 @@ currTime = now;

2

src/util.js

@@ -52,3 +52,3 @@ import { intersection } from 'lodash';

*/
export const debug = name => item => {
export const debug = name => (item) => {
log(name, item);

@@ -55,0 +55,0 @@ 

demo/Gossip/app.js
demo/Gossip/index.html
demo/GroupAnimation/app.js
demo/GroupAnimation/index.html
demo/index.html
demo/Pendulum/app.js
demo/Pendulum/index.html
demo/SimpleAnimation/app.js
demo/SimpleAnimation/index.html
demo/webpack.config.js
umd/ReactSmooth.js

Sorry, the diff of this file is too big to display

umd/ReactSmooth.min.js

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

About

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc