rc-animate
Advanced tools
Comparing version 2.7.0 to 2.8.0
@@ -198,3 +198,3 @@ import _defineProperty from 'babel-runtime/helpers/defineProperty'; | ||
leavedClassName = _props.leavedClassName, | ||
eventKey = _props.eventKey; | ||
eventProps = _props.eventProps; | ||
@@ -206,5 +206,5 @@ | ||
if (visible) { | ||
return children({ key: eventKey }); | ||
return children(_extends({}, eventProps)); | ||
} else if (!removeOnLeave) { | ||
return children({ key: eventKey, className: leavedClassName }); | ||
return children(_extends({}, eventProps, { className: leavedClassName })); | ||
} | ||
@@ -215,7 +215,6 @@ | ||
return children({ | ||
key: eventKey, | ||
return children(_extends({}, eventProps, { | ||
className: classNames((_classNames = {}, _defineProperty(_classNames, getTransitionName(motionName, status), status !== STATUS_NONE), _defineProperty(_classNames, getTransitionName(motionName, status + '-active'), status !== STATUS_NONE && statusActive), _defineProperty(_classNames, motionName, typeof motionName === 'string'), _classNames)), | ||
style: statusStyle | ||
}); | ||
})); | ||
} | ||
@@ -268,3 +267,3 @@ }], [{ | ||
CSSMotion.propTypes = { | ||
eventKey: PropTypes.any, // Internal usage. Only pass by CSSMotionList | ||
eventProps: PropTypes.object, // Internal usage. Only pass by CSSMotionList | ||
visible: PropTypes.bool, | ||
@@ -271,0 +270,0 @@ children: PropTypes.func, |
@@ -12,3 +12,3 @@ import _objectWithoutProperties from 'babel-runtime/helpers/objectWithoutProperties'; | ||
import { supportTransition } from './util/motion'; | ||
import { diffKeys } from './util/diff'; | ||
import { STATUS_ADD, STATUS_KEEP, STATUS_REMOVE, STATUS_REMOVED, diffKeys, parseKeys } from './util/diff'; | ||
@@ -41,3 +41,3 @@ var MOTION_PROP_NAMES = Object.keys(CSSMotion.propTypes); | ||
return _extends({}, entity, { | ||
removed: true | ||
status: STATUS_REMOVED | ||
}); | ||
@@ -72,13 +72,12 @@ }) | ||
keyEntities.map(function (_ref3) { | ||
var key = _ref3.key, | ||
add = _ref3.add, | ||
keep = _ref3.keep; | ||
var status = _ref3.status, | ||
eventProps = _objectWithoutProperties(_ref3, ['status']); | ||
var visible = !!(add || keep); | ||
var visible = status === STATUS_ADD || status === STATUS_KEEP; | ||
return React.createElement( | ||
CSSMotion, | ||
_extends({}, motionProps, { | ||
key: key, | ||
key: eventProps.key, | ||
visible: visible, | ||
eventKey: key, | ||
eventProps: eventProps, | ||
onLeaveEnd: function onLeaveEnd() { | ||
@@ -88,3 +87,3 @@ if (motionProps.onLeaveEnd) { | ||
} | ||
_this2.removeKey(key); | ||
_this2.removeKey(eventProps.key); | ||
} | ||
@@ -103,7 +102,9 @@ }), | ||
var parsedKeyObjects = parseKeys(keys); | ||
// Always as keep when motion not support | ||
if (!transitionSupport) { | ||
return { | ||
keyEntities: keys.map(function (key) { | ||
return { key: key, keep: true }; | ||
keyEntities: parsedKeyObjects.map(function (obj) { | ||
return _extends({}, obj, { status: STATUS_KEEP }); | ||
}) | ||
@@ -113,7 +114,3 @@ }; | ||
var prevKeys = keyEntities.map(function (_ref6) { | ||
var key = _ref6.key; | ||
return key; | ||
}); | ||
var mixedKeyEntities = diffKeys(prevKeys, keys); | ||
var mixedKeyEntities = diffKeys(keyEntities, parsedKeyObjects); | ||
@@ -134,3 +131,3 @@ var keyEntitiesLen = keyEntities.length; | ||
// Remove if already mark as removed | ||
if (prevEntity && prevEntity.removed && entity.remove) { | ||
if (prevEntity && prevEntity.status === STATUS_REMOVED && entity.status === STATUS_REMOVE) { | ||
return false; | ||
@@ -137,0 +134,0 @@ } |
@@ -0,1 +1,20 @@ | ||
import _extends from 'babel-runtime/helpers/extends'; | ||
export var STATUS_ADD = 'add'; | ||
export var STATUS_KEEP = 'keep'; | ||
export var STATUS_REMOVE = 'remove'; | ||
export var STATUS_REMOVED = 'removed'; | ||
export function wrapKeyToObject(key) { | ||
if (key && typeof key === 'object' && 'key' in key) { | ||
return key; | ||
} | ||
return { key: key }; | ||
} | ||
export function parseKeys() { | ||
var keys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : []; | ||
return keys.map(wrapKeyToObject); | ||
} | ||
export function diffKeys() { | ||
@@ -9,20 +28,22 @@ var prevKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : []; | ||
var prevKeyObjects = parseKeys(prevKeys); | ||
var currentKeyObjects = parseKeys(currentKeys); | ||
// Check prev keys to insert or keep | ||
prevKeys.forEach(function (key) { | ||
prevKeyObjects.forEach(function (keyObj) { | ||
var hit = false; | ||
for (var i = currentIndex; i < currentLen; i += 1) { | ||
var currentKey = currentKeys[i]; | ||
if (currentKey === key) { | ||
var currentKeyObj = currentKeyObjects[i]; | ||
if (currentKeyObj.key === keyObj.key) { | ||
// New added keys should add before current key | ||
if (currentIndex < i) { | ||
list = list.concat(currentKeys.slice(currentIndex, i).map(function (addKey) { | ||
return { key: addKey, add: true }; | ||
list = list.concat(currentKeyObjects.slice(currentIndex, i).map(function (obj) { | ||
return _extends({}, obj, { status: STATUS_ADD }); | ||
})); | ||
currentIndex = i; | ||
} | ||
list.push({ | ||
key: key, | ||
keep: true | ||
}); | ||
list.push(_extends({}, currentKeyObj, { | ||
status: STATUS_KEEP | ||
})); | ||
currentIndex += 1; | ||
@@ -37,6 +58,5 @@ | ||
if (!hit) { | ||
list.push({ | ||
key: key, | ||
remove: true | ||
}); | ||
list.push(_extends({}, keyObj, { | ||
status: STATUS_REMOVE | ||
})); | ||
} | ||
@@ -47,4 +67,4 @@ }); | ||
if (currentIndex < currentLen) { | ||
list = list.concat(currentKeys.slice(currentIndex).map(function (addKey) { | ||
return { key: addKey, add: true }; | ||
list = list.concat(currentKeyObjects.slice(currentIndex).map(function (obj) { | ||
return _extends({}, obj, { status: STATUS_ADD }); | ||
})); | ||
@@ -54,4 +74,2 @@ } | ||
return list; | ||
} | ||
export default diffKeys; | ||
} |
# History | ||
---- | ||
## 2.8.0 / 2019-04-29 | ||
- `keys` on CSSMotionList can be an object | ||
## 2.7.0 / 2019-04-29 | ||
@@ -5,0 +9,0 @@ |
@@ -242,3 +242,3 @@ 'use strict'; | ||
leavedClassName = _props.leavedClassName, | ||
eventKey = _props.eventKey; | ||
eventProps = _props.eventProps; | ||
@@ -250,5 +250,5 @@ | ||
if (visible) { | ||
return children({ key: eventKey }); | ||
return children((0, _extends3['default'])({}, eventProps)); | ||
} else if (!removeOnLeave) { | ||
return children({ key: eventKey, className: leavedClassName }); | ||
return children((0, _extends3['default'])({}, eventProps, { className: leavedClassName })); | ||
} | ||
@@ -259,7 +259,6 @@ | ||
return children({ | ||
key: eventKey, | ||
return children((0, _extends3['default'])({}, eventProps, { | ||
className: (0, _classnames2['default'])((_classNames = {}, (0, _defineProperty3['default'])(_classNames, (0, _motion.getTransitionName)(motionName, status), status !== STATUS_NONE), (0, _defineProperty3['default'])(_classNames, (0, _motion.getTransitionName)(motionName, status + '-active'), status !== STATUS_NONE && statusActive), (0, _defineProperty3['default'])(_classNames, motionName, typeof motionName === 'string'), _classNames)), | ||
style: statusStyle | ||
}); | ||
})); | ||
} | ||
@@ -311,3 +310,3 @@ }], [{ | ||
CSSMotion.propTypes = { | ||
eventKey: _propTypes2['default'].any, // Internal usage. Only pass by CSSMotionList | ||
eventProps: _propTypes2['default'].object, // Internal usage. Only pass by CSSMotionList | ||
visible: _propTypes2['default'].bool, | ||
@@ -314,0 +313,0 @@ children: _propTypes2['default'].func, |
@@ -79,3 +79,3 @@ 'use strict'; | ||
return (0, _extends3['default'])({}, entity, { | ||
removed: true | ||
status: _diff.STATUS_REMOVED | ||
}); | ||
@@ -110,13 +110,12 @@ }) | ||
keyEntities.map(function (_ref3) { | ||
var key = _ref3.key, | ||
add = _ref3.add, | ||
keep = _ref3.keep; | ||
var status = _ref3.status, | ||
eventProps = (0, _objectWithoutProperties3['default'])(_ref3, ['status']); | ||
var visible = !!(add || keep); | ||
var visible = status === _diff.STATUS_ADD || status === _diff.STATUS_KEEP; | ||
return _react2['default'].createElement( | ||
_CSSMotion2['default'], | ||
(0, _extends3['default'])({}, motionProps, { | ||
key: key, | ||
key: eventProps.key, | ||
visible: visible, | ||
eventKey: key, | ||
eventProps: eventProps, | ||
onLeaveEnd: function onLeaveEnd() { | ||
@@ -126,3 +125,3 @@ if (motionProps.onLeaveEnd) { | ||
} | ||
_this2.removeKey(key); | ||
_this2.removeKey(eventProps.key); | ||
} | ||
@@ -141,7 +140,9 @@ }), | ||
var parsedKeyObjects = (0, _diff.parseKeys)(keys); | ||
// Always as keep when motion not support | ||
if (!transitionSupport) { | ||
return { | ||
keyEntities: keys.map(function (key) { | ||
return { key: key, keep: true }; | ||
keyEntities: parsedKeyObjects.map(function (obj) { | ||
return (0, _extends3['default'])({}, obj, { status: _diff.STATUS_KEEP }); | ||
}) | ||
@@ -151,7 +152,3 @@ }; | ||
var prevKeys = keyEntities.map(function (_ref6) { | ||
var key = _ref6.key; | ||
return key; | ||
}); | ||
var mixedKeyEntities = (0, _diff.diffKeys)(prevKeys, keys); | ||
var mixedKeyEntities = (0, _diff.diffKeys)(keyEntities, parsedKeyObjects); | ||
@@ -172,3 +169,3 @@ var keyEntitiesLen = keyEntities.length; | ||
// Remove if already mark as removed | ||
if (prevEntity && prevEntity.removed && entity.remove) { | ||
if (prevEntity && prevEntity.status === _diff.STATUS_REMOVED && entity.status === _diff.STATUS_REMOVE) { | ||
return false; | ||
@@ -175,0 +172,0 @@ } |
@@ -1,2 +0,2 @@ | ||
"use strict"; | ||
'use strict'; | ||
@@ -6,3 +6,32 @@ Object.defineProperty(exports, "__esModule", { | ||
}); | ||
exports.STATUS_REMOVED = exports.STATUS_REMOVE = exports.STATUS_KEEP = exports.STATUS_ADD = undefined; | ||
var _extends2 = require('babel-runtime/helpers/extends'); | ||
var _extends3 = _interopRequireDefault(_extends2); | ||
exports.wrapKeyToObject = wrapKeyToObject; | ||
exports.parseKeys = parseKeys; | ||
exports.diffKeys = diffKeys; | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; } | ||
var STATUS_ADD = exports.STATUS_ADD = 'add'; | ||
var STATUS_KEEP = exports.STATUS_KEEP = 'keep'; | ||
var STATUS_REMOVE = exports.STATUS_REMOVE = 'remove'; | ||
var STATUS_REMOVED = exports.STATUS_REMOVED = 'removed'; | ||
function wrapKeyToObject(key) { | ||
if (key && typeof key === 'object' && 'key' in key) { | ||
return key; | ||
} | ||
return { key: key }; | ||
} | ||
function parseKeys() { | ||
var keys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : []; | ||
return keys.map(wrapKeyToObject); | ||
} | ||
function diffKeys() { | ||
@@ -16,20 +45,22 @@ var prevKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : []; | ||
var prevKeyObjects = parseKeys(prevKeys); | ||
var currentKeyObjects = parseKeys(currentKeys); | ||
// Check prev keys to insert or keep | ||
prevKeys.forEach(function (key) { | ||
prevKeyObjects.forEach(function (keyObj) { | ||
var hit = false; | ||
for (var i = currentIndex; i < currentLen; i += 1) { | ||
var currentKey = currentKeys[i]; | ||
if (currentKey === key) { | ||
var currentKeyObj = currentKeyObjects[i]; | ||
if (currentKeyObj.key === keyObj.key) { | ||
// New added keys should add before current key | ||
if (currentIndex < i) { | ||
list = list.concat(currentKeys.slice(currentIndex, i).map(function (addKey) { | ||
return { key: addKey, add: true }; | ||
list = list.concat(currentKeyObjects.slice(currentIndex, i).map(function (obj) { | ||
return (0, _extends3['default'])({}, obj, { status: STATUS_ADD }); | ||
})); | ||
currentIndex = i; | ||
} | ||
list.push({ | ||
key: key, | ||
keep: true | ||
}); | ||
list.push((0, _extends3['default'])({}, currentKeyObj, { | ||
status: STATUS_KEEP | ||
})); | ||
currentIndex += 1; | ||
@@ -44,6 +75,5 @@ | ||
if (!hit) { | ||
list.push({ | ||
key: key, | ||
remove: true | ||
}); | ||
list.push((0, _extends3['default'])({}, keyObj, { | ||
status: STATUS_REMOVE | ||
})); | ||
} | ||
@@ -54,4 +84,4 @@ }); | ||
if (currentIndex < currentLen) { | ||
list = list.concat(currentKeys.slice(currentIndex).map(function (addKey) { | ||
return { key: addKey, add: true }; | ||
list = list.concat(currentKeyObjects.slice(currentIndex).map(function (obj) { | ||
return (0, _extends3['default'])({}, obj, { status: STATUS_ADD }); | ||
})); | ||
@@ -61,4 +91,2 @@ } | ||
return list; | ||
} | ||
exports["default"] = diffKeys; | ||
} |
{ | ||
"name": "rc-animate", | ||
"version": "2.7.0", | ||
"version": "2.8.0", | ||
"description": "css-transition ui component for react", | ||
@@ -5,0 +5,0 @@ "keywords": [ |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
88299
2165