react-transition-group
Advanced tools
Comparing version 2.4.0 to 2.5.0
@@ -0,1 +1,8 @@ | ||
# [2.5.0](https://github.com/reactjs/react-transition-group/compare/v2.4.0...v2.5.0) (2018-09-26) | ||
### Features | ||
* update build and package dependencies ([#413](https://github.com/reactjs/react-transition-group/issues/413)) ([af3d45a](https://github.com/reactjs/react-transition-group/commit/af3d45a)) | ||
# [2.4.0](https://github.com/reactjs/react-transition-group/compare/v2.3.1...v2.4.0) (2018-06-27) | ||
@@ -2,0 +9,0 @@ |
@@ -1,52 +0,39 @@ | ||
'use strict'; | ||
"use strict"; | ||
exports.__esModule = true; | ||
exports.default = void 0; | ||
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 PropTypes = _interopRequireWildcard(require("prop-types")); | ||
var _propTypes = require('prop-types'); | ||
var _addClass = _interopRequireDefault(require("dom-helpers/class/addClass")); | ||
var PropTypes = _interopRequireWildcard(_propTypes); | ||
var _removeClass = _interopRequireDefault(require("dom-helpers/class/removeClass")); | ||
var _addClass = require('dom-helpers/class/addClass'); | ||
var _react = _interopRequireDefault(require("react")); | ||
var _addClass2 = _interopRequireDefault(_addClass); | ||
var _Transition = _interopRequireDefault(require("./Transition")); | ||
var _removeClass = require('dom-helpers/class/removeClass'); | ||
var _PropTypes = require("./utils/PropTypes"); | ||
var _removeClass2 = _interopRequireDefault(_removeClass); | ||
var _react = require('react'); | ||
var _react2 = _interopRequireDefault(_react); | ||
var _Transition = require('./Transition'); | ||
var _Transition2 = _interopRequireDefault(_Transition); | ||
var _PropTypes = require('./utils/PropTypes'); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
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)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } | ||
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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } | ||
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 _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 _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 addClass = function addClass(node, classes) { | ||
return node && classes && classes.split(' ').forEach(function (c) { | ||
return (0, _addClass2.default)(node, c); | ||
return (0, _addClass.default)(node, c); | ||
}); | ||
}; | ||
var removeClass = function removeClass(node, classes) { | ||
return node && classes && classes.split(' ').forEach(function (c) { | ||
return (0, _removeClass2.default)(node, c); | ||
return (0, _removeClass.default)(node, c); | ||
}); | ||
}; | ||
var propTypes = _extends({}, _Transition2.default.propTypes, { | ||
var propTypes = process.env.NODE_ENV !== "production" ? _extends({}, _Transition.default.propTypes, { | ||
/** | ||
@@ -145,4 +132,3 @@ * The animation classNames applied to the component as it enters, exits or has finished the transition. | ||
onExited: PropTypes.func | ||
}); | ||
}) : {};; | ||
/** | ||
@@ -160,21 +146,19 @@ * A `Transition` component using CSS transitions and animations. | ||
* added in the next tick. This is a convention based on the `classNames` prop. | ||
* | ||
* ## Example | ||
* | ||
* <iframe src="https://codesandbox.io/embed/m77l2vp00x?fontsize=14" style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;" sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"></iframe> | ||
*/ | ||
var CSSTransition = function (_React$Component) { | ||
_inherits(CSSTransition, _React$Component); | ||
var CSSTransition = | ||
/*#__PURE__*/ | ||
function (_React$Component) { | ||
_inheritsLoose(CSSTransition, _React$Component); | ||
function CSSTransition() { | ||
var _temp, _this, _ret; | ||
var _this; | ||
_classCallCheck(this, CSSTransition); | ||
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, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _this.onEnter = function (node, appearing) { | ||
_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this; | ||
_this.onEnter = function (node, appearing) { | ||
var _this$getClassNames = _this.getClassNames(appearing ? 'appear' : 'enter'), | ||
@@ -184,2 +168,3 @@ className = _this$getClassNames.className; | ||
_this.removeClasses(node, 'exit'); | ||
addClass(node, className); | ||
@@ -190,3 +175,5 @@ | ||
} | ||
}, _this.onEntering = function (node, appearing) { | ||
}; | ||
_this.onEntering = function (node, appearing) { | ||
var _this$getClassNames2 = _this.getClassNames(appearing ? 'appear' : 'enter'), | ||
@@ -200,3 +187,5 @@ activeClassName = _this$getClassNames2.activeClassName; | ||
} | ||
}, _this.onEntered = function (node, appearing) { | ||
}; | ||
_this.onEntered = function (node, appearing) { | ||
var _this$getClassNames3 = _this.getClassNames('enter'), | ||
@@ -206,2 +195,3 @@ doneClassName = _this$getClassNames3.doneClassName; | ||
_this.removeClasses(node, appearing ? 'appear' : 'enter'); | ||
addClass(node, doneClassName); | ||
@@ -212,3 +202,5 @@ | ||
} | ||
}, _this.onExit = function (node) { | ||
}; | ||
_this.onExit = function (node) { | ||
var _this$getClassNames4 = _this.getClassNames('exit'), | ||
@@ -218,3 +210,5 @@ className = _this$getClassNames4.className; | ||
_this.removeClasses(node, 'appear'); | ||
_this.removeClasses(node, 'enter'); | ||
addClass(node, className); | ||
@@ -225,3 +219,5 @@ | ||
} | ||
}, _this.onExiting = function (node) { | ||
}; | ||
_this.onExiting = function (node) { | ||
var _this$getClassNames5 = _this.getClassNames('exit'), | ||
@@ -235,3 +231,5 @@ activeClassName = _this$getClassNames5.activeClassName; | ||
} | ||
}, _this.onExited = function (node) { | ||
}; | ||
_this.onExited = function (node) { | ||
var _this$getClassNames6 = _this.getClassNames('exit'), | ||
@@ -241,2 +239,3 @@ doneClassName = _this$getClassNames6.doneClassName; | ||
_this.removeClasses(node, 'exit'); | ||
addClass(node, doneClassName); | ||
@@ -247,12 +246,9 @@ | ||
} | ||
}, _this.getClassNames = function (type) { | ||
}; | ||
_this.getClassNames = function (type) { | ||
var classNames = _this.props.classNames; | ||
var className = typeof classNames !== 'string' ? classNames[type] : classNames + '-' + type; | ||
var activeClassName = typeof classNames !== 'string' ? classNames[type + 'Active'] : className + '-active'; | ||
var doneClassName = typeof classNames !== 'string' ? classNames[type + 'Done'] : className + '-done'; | ||
return { | ||
@@ -263,11 +259,15 @@ className: className, | ||
}; | ||
}, _temp), _possibleConstructorReturn(_this, _ret); | ||
}; | ||
return _this; | ||
} | ||
CSSTransition.prototype.removeClasses = function removeClasses(node, type) { | ||
var _getClassNames = this.getClassNames(type), | ||
className = _getClassNames.className, | ||
activeClassName = _getClassNames.activeClassName, | ||
doneClassName = _getClassNames.doneClassName; | ||
var _proto = CSSTransition.prototype; | ||
_proto.removeClasses = function removeClasses(node, type) { | ||
var _this$getClassNames7 = this.getClassNames(type), | ||
className = _this$getClassNames7.className, | ||
activeClassName = _this$getClassNames7.activeClassName, | ||
doneClassName = _this$getClassNames7.doneClassName; | ||
className && removeClass(node, className); | ||
@@ -278,3 +278,3 @@ activeClassName && removeClass(node, activeClassName); | ||
CSSTransition.prototype.reflowAndAddClass = function reflowAndAddClass(node, className) { | ||
_proto.reflowAndAddClass = function reflowAndAddClass(node, className) { | ||
// This is for to force a repaint, | ||
@@ -286,2 +286,3 @@ // which is necessary in order to transition styles when adding a class name. | ||
/* eslint-enable no-unused-expressions */ | ||
addClass(node, className); | ||
@@ -291,8 +292,7 @@ } | ||
CSSTransition.prototype.render = function render() { | ||
_proto.render = function render() { | ||
var props = _extends({}, this.props); | ||
delete props.classNames; | ||
return _react2.default.createElement(_Transition2.default, _extends({}, props, { | ||
return _react.default.createElement(_Transition.default, _extends({}, props, { | ||
onEnter: this.onEnter, | ||
@@ -308,7 +308,7 @@ onEntered: this.onEntered, | ||
return CSSTransition; | ||
}(_react2.default.Component); | ||
}(_react.default.Component); | ||
CSSTransition.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {}; | ||
exports.default = CSSTransition; | ||
module.exports = exports['default']; | ||
var _default = CSSTransition; | ||
exports.default = _default; | ||
module.exports = exports["default"]; |
26
index.js
@@ -1,26 +0,18 @@ | ||
'use strict'; | ||
"use strict"; | ||
var _CSSTransition = require('./CSSTransition'); | ||
var _CSSTransition = _interopRequireDefault(require("./CSSTransition")); | ||
var _CSSTransition2 = _interopRequireDefault(_CSSTransition); | ||
var _ReplaceTransition = _interopRequireDefault(require("./ReplaceTransition")); | ||
var _ReplaceTransition = require('./ReplaceTransition'); | ||
var _TransitionGroup = _interopRequireDefault(require("./TransitionGroup")); | ||
var _ReplaceTransition2 = _interopRequireDefault(_ReplaceTransition); | ||
var _Transition = _interopRequireDefault(require("./Transition")); | ||
var _TransitionGroup = require('./TransitionGroup'); | ||
var _TransitionGroup2 = _interopRequireDefault(_TransitionGroup); | ||
var _Transition = require('./Transition'); | ||
var _Transition2 = _interopRequireDefault(_Transition); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
module.exports = { | ||
Transition: _Transition2.default, | ||
TransitionGroup: _TransitionGroup2.default, | ||
ReplaceTransition: _ReplaceTransition2.default, | ||
CSSTransition: _CSSTransition2.default | ||
Transition: _Transition.default, | ||
TransitionGroup: _TransitionGroup.default, | ||
ReplaceTransition: _ReplaceTransition.default, | ||
CSSTransition: _CSSTransition.default | ||
}; |
{ | ||
"name": "react-transition-group", | ||
"version": "2.4.0", | ||
"version": "2.5.0", | ||
"description": "A react component toolset for managing animations", | ||
@@ -40,3 +40,3 @@ "main": "index.js", | ||
"dom-helpers": "^3.3.1", | ||
"loose-envify": "^1.3.1", | ||
"loose-envify": "^1.4.0", | ||
"prop-types": "^15.6.2", | ||
@@ -43,0 +43,0 @@ "react-lifecycles-compat": "^3.0.4" |
@@ -5,5 +5,5 @@ # react-transition-group [![npm][npm-badge]][npm] | ||
> | ||
> **For a drop-in replacement for `react-addons-transition-group` and `react-addons-css-transition-group`, use the v1 release, which is still actively maintained. Documentation and code for that release are available on the [`v1-stable`](https://github.com/reactjs/react-transition-group/tree/v1-stable) branch.** | ||
> **For a drop-in replacement for `react-addons-transition-group` and `react-addons-css-transition-group`, use the v1 release. Documentation and code for that release are available on the [`v1-stable`](https://github.com/reactjs/react-transition-group/tree/v1-stable) branch.** | ||
> | ||
> You can send pull requests with v1 bugfixes against the `v1-stable` branch. | ||
> We are no longer updating the v1 codebase, please upgrade to v2 when possible | ||
@@ -10,0 +10,0 @@ A set of components for managing component states (including mounting and unmounting) over time, specifically designed with animation in mind. |
@@ -1,38 +0,27 @@ | ||
'use strict'; | ||
"use strict"; | ||
exports.__esModule = true; | ||
exports.default = void 0; | ||
var _propTypes = require('prop-types'); | ||
var _propTypes = _interopRequireDefault(require("prop-types")); | ||
var _propTypes2 = _interopRequireDefault(_propTypes); | ||
var _react = _interopRequireDefault(require("react")); | ||
var _react = require('react'); | ||
var _reactDom = require("react-dom"); | ||
var _react2 = _interopRequireDefault(_react); | ||
var _TransitionGroup = _interopRequireDefault(require("./TransitionGroup")); | ||
var _reactDom = require('react-dom'); | ||
var _TransitionGroup = require('./TransitionGroup'); | ||
var _TransitionGroup2 = _interopRequireDefault(_TransitionGroup); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
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 _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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } | ||
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 propTypes = { | ||
in: _propTypes2.default.bool.isRequired, | ||
var propTypes = process.env.NODE_ENV !== "production" ? { | ||
in: _propTypes.default.bool.isRequired, | ||
children: function children(props, propName) { | ||
if (_react2.default.Children.count(props[propName]) !== 2) return new Error('"' + propName + '" must be exactly two transition components.'); | ||
if (_react.default.Children.count(props[propName]) !== 2) return new Error("\"" + propName + "\" must be exactly two transition components."); | ||
return null; | ||
} | ||
}; | ||
} : {};; | ||
/** | ||
@@ -50,18 +39,70 @@ * The `<ReplaceTransition>` component is a specialized `Transition` component | ||
var ReplaceTransition = function (_React$Component) { | ||
_inherits(ReplaceTransition, _React$Component); | ||
var ReplaceTransition = | ||
/*#__PURE__*/ | ||
function (_React$Component) { | ||
_inheritsLoose(ReplaceTransition, _React$Component); | ||
function ReplaceTransition() { | ||
var _temp, _this, _ret; | ||
var _this; | ||
_classCallCheck(this, ReplaceTransition); | ||
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { | ||
args[_key] = arguments[_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, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _initialiseProps.call(_this), _temp), _possibleConstructorReturn(_this, _ret); | ||
_this = _React$Component.call.apply(_React$Component, [this].concat(_args)) || this; | ||
_this.handleEnter = function () { | ||
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { | ||
args[_key2] = arguments[_key2]; | ||
} | ||
return _this.handleLifecycle('onEnter', 0, args); | ||
}; | ||
_this.handleEntering = function () { | ||
for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) { | ||
args[_key3] = arguments[_key3]; | ||
} | ||
return _this.handleLifecycle('onEntering', 0, args); | ||
}; | ||
_this.handleEntered = function () { | ||
for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) { | ||
args[_key4] = arguments[_key4]; | ||
} | ||
return _this.handleLifecycle('onEntered', 0, args); | ||
}; | ||
_this.handleExit = function () { | ||
for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) { | ||
args[_key5] = arguments[_key5]; | ||
} | ||
return _this.handleLifecycle('onExit', 1, args); | ||
}; | ||
_this.handleExiting = function () { | ||
for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) { | ||
args[_key6] = arguments[_key6]; | ||
} | ||
return _this.handleLifecycle('onExiting', 1, args); | ||
}; | ||
_this.handleExited = function () { | ||
for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) { | ||
args[_key7] = arguments[_key7]; | ||
} | ||
return _this.handleLifecycle('onExited', 1, args); | ||
}; | ||
return _this; | ||
} | ||
ReplaceTransition.prototype.handleLifecycle = function handleLifecycle(handler, idx, originalArgs) { | ||
var _proto = ReplaceTransition.prototype; | ||
_proto.handleLifecycle = function handleLifecycle(handler, idx, originalArgs) { | ||
var _child$props; | ||
@@ -71,3 +112,3 @@ | ||
var child = _react2.default.Children.toArray(children)[idx]; | ||
var child = _react.default.Children.toArray(children)[idx]; | ||
@@ -78,9 +119,9 @@ if (child.props[handler]) (_child$props = child.props)[handler].apply(_child$props, originalArgs); | ||
ReplaceTransition.prototype.render = function render() { | ||
var _props = this.props, | ||
children = _props.children, | ||
inProp = _props.in, | ||
props = _objectWithoutProperties(_props, ['children', 'in']); | ||
_proto.render = function render() { | ||
var _this$props = this.props, | ||
children = _this$props.children, | ||
inProp = _this$props.in, | ||
props = _objectWithoutPropertiesLoose(_this$props, ["children", "in"]); | ||
var _React$Children$toArr = _react2.default.Children.toArray(children), | ||
var _React$Children$toArr = _react.default.Children.toArray(children), | ||
first = _React$Children$toArr[0], | ||
@@ -95,79 +136,21 @@ second = _React$Children$toArr[1]; | ||
delete props.onExited; | ||
return _react2.default.createElement( | ||
_TransitionGroup2.default, | ||
props, | ||
inProp ? _react2.default.cloneElement(first, { | ||
key: 'first', | ||
onEnter: this.handleEnter, | ||
onEntering: this.handleEntering, | ||
onEntered: this.handleEntered | ||
}) : _react2.default.cloneElement(second, { | ||
key: 'second', | ||
onEnter: this.handleExit, | ||
onEntering: this.handleExiting, | ||
onEntered: this.handleExited | ||
}) | ||
); | ||
return _react.default.createElement(_TransitionGroup.default, props, inProp ? _react.default.cloneElement(first, { | ||
key: 'first', | ||
onEnter: this.handleEnter, | ||
onEntering: this.handleEntering, | ||
onEntered: this.handleEntered | ||
}) : _react.default.cloneElement(second, { | ||
key: 'second', | ||
onEnter: this.handleExit, | ||
onEntering: this.handleExiting, | ||
onEntered: this.handleExited | ||
})); | ||
}; | ||
return ReplaceTransition; | ||
}(_react2.default.Component); | ||
}(_react.default.Component); | ||
var _initialiseProps = function _initialiseProps() { | ||
var _this2 = this; | ||
this.handleEnter = function () { | ||
for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { | ||
args[_key2] = arguments[_key2]; | ||
} | ||
return _this2.handleLifecycle('onEnter', 0, args); | ||
}; | ||
this.handleEntering = function () { | ||
for (var _len3 = arguments.length, args = Array(_len3), _key3 = 0; _key3 < _len3; _key3++) { | ||
args[_key3] = arguments[_key3]; | ||
} | ||
return _this2.handleLifecycle('onEntering', 0, args); | ||
}; | ||
this.handleEntered = function () { | ||
for (var _len4 = arguments.length, args = Array(_len4), _key4 = 0; _key4 < _len4; _key4++) { | ||
args[_key4] = arguments[_key4]; | ||
} | ||
return _this2.handleLifecycle('onEntered', 0, args); | ||
}; | ||
this.handleExit = function () { | ||
for (var _len5 = arguments.length, args = Array(_len5), _key5 = 0; _key5 < _len5; _key5++) { | ||
args[_key5] = arguments[_key5]; | ||
} | ||
return _this2.handleLifecycle('onExit', 1, args); | ||
}; | ||
this.handleExiting = function () { | ||
for (var _len6 = arguments.length, args = Array(_len6), _key6 = 0; _key6 < _len6; _key6++) { | ||
args[_key6] = arguments[_key6]; | ||
} | ||
return _this2.handleLifecycle('onExiting', 1, args); | ||
}; | ||
this.handleExited = function () { | ||
for (var _len7 = arguments.length, args = Array(_len7), _key7 = 0; _key7 < _len7; _key7++) { | ||
args[_key7] = arguments[_key7]; | ||
} | ||
return _this2.handleLifecycle('onExited', 1, args); | ||
}; | ||
}; | ||
ReplaceTransition.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {}; | ||
exports.default = ReplaceTransition; | ||
module.exports = exports['default']; | ||
var _default = ReplaceTransition; | ||
exports.default = _default; | ||
module.exports = exports["default"]; |
@@ -1,40 +0,33 @@ | ||
'use strict'; | ||
"use strict"; | ||
exports.__esModule = true; | ||
exports.EXITING = exports.ENTERED = exports.ENTERING = exports.EXITED = exports.UNMOUNTED = undefined; | ||
exports.default = exports.EXITING = exports.ENTERED = exports.ENTERING = exports.EXITED = exports.UNMOUNTED = void 0; | ||
var _propTypes = require('prop-types'); | ||
var PropTypes = _interopRequireWildcard(require("prop-types")); | ||
var PropTypes = _interopRequireWildcard(_propTypes); | ||
var _react = _interopRequireDefault(require("react")); | ||
var _react = require('react'); | ||
var _reactDom = _interopRequireDefault(require("react-dom")); | ||
var _react2 = _interopRequireDefault(_react); | ||
var _reactLifecyclesCompat = require("react-lifecycles-compat"); | ||
var _reactDom = require('react-dom'); | ||
var _PropTypes = require("./utils/PropTypes"); | ||
var _reactDom2 = _interopRequireDefault(_reactDom); | ||
var _reactLifecyclesCompat = require('react-lifecycles-compat'); | ||
var _PropTypes = require('./utils/PropTypes'); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
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)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } } | ||
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 _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 _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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } | ||
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 UNMOUNTED = exports.UNMOUNTED = 'unmounted'; | ||
var EXITED = exports.EXITED = 'exited'; | ||
var ENTERING = exports.ENTERING = 'entering'; | ||
var ENTERED = exports.ENTERED = 'entered'; | ||
var EXITING = exports.EXITING = 'exiting'; | ||
var UNMOUNTED = 'unmounted'; | ||
exports.UNMOUNTED = UNMOUNTED; | ||
var EXITED = 'exited'; | ||
exports.EXITED = EXITED; | ||
var ENTERING = 'entering'; | ||
exports.ENTERING = ENTERING; | ||
var ENTERED = 'entered'; | ||
exports.ENTERED = ENTERED; | ||
var EXITING = 'exiting'; | ||
/** | ||
@@ -134,23 +127,19 @@ * The Transition component lets you describe a transition from one component | ||
* > `CSSTransition`. | ||
* | ||
* ## Example | ||
* | ||
* <iframe src="https://codesandbox.io/embed/741op4mmj0?fontsize=14" style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;" sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"></iframe> | ||
* | ||
*/ | ||
var Transition = function (_React$Component) { | ||
_inherits(Transition, _React$Component); | ||
exports.EXITING = EXITING; | ||
var Transition = | ||
/*#__PURE__*/ | ||
function (_React$Component) { | ||
_inheritsLoose(Transition, _React$Component); | ||
function Transition(props, context) { | ||
_classCallCheck(this, Transition); | ||
var _this; | ||
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props, context)); | ||
_this = _React$Component.call(this, props, context) || this; | ||
var parentGroup = context.transitionGroup; // In the context of a TransitionGroup all enters are really appears | ||
var parentGroup = context.transitionGroup; | ||
// In the context of a TransitionGroup all enters are really appears | ||
var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear; | ||
var initialStatus = void 0; | ||
var initialStatus; | ||
_this.appearStatus = null; | ||
@@ -173,4 +162,5 @@ | ||
_this.state = { status: initialStatus }; | ||
_this.state = { | ||
status: initialStatus | ||
}; | ||
_this.nextCallback = null; | ||
@@ -180,4 +170,8 @@ return _this; | ||
Transition.prototype.getChildContext = function getChildContext() { | ||
return { transitionGroup: null // allows for nested Transitions | ||
var _proto = Transition.prototype; | ||
_proto.getChildContext = function getChildContext() { | ||
return { | ||
transitionGroup: null // allows for nested Transitions | ||
}; | ||
@@ -190,13 +184,12 @@ }; | ||
if (nextIn && prevState.status === UNMOUNTED) { | ||
return { status: EXITED }; | ||
return { | ||
status: EXITED | ||
}; | ||
} | ||
return null; | ||
}; | ||
// getSnapshotBeforeUpdate(prevProps) { | ||
}; // getSnapshotBeforeUpdate(prevProps) { | ||
// let nextStatus = null | ||
// if (prevProps !== this.props) { | ||
// const { status } = this.state | ||
// if (this.props.in) { | ||
@@ -212,16 +205,16 @@ // if (status !== ENTERING && status !== ENTERED) { | ||
// } | ||
// return { nextStatus } | ||
// } | ||
Transition.prototype.componentDidMount = function componentDidMount() { | ||
_proto.componentDidMount = function componentDidMount() { | ||
this.updateStatus(true, this.appearStatus); | ||
}; | ||
Transition.prototype.componentDidUpdate = function componentDidUpdate(prevProps) { | ||
_proto.componentDidUpdate = function componentDidUpdate(prevProps) { | ||
var nextStatus = null; | ||
if (prevProps !== this.props) { | ||
var status = this.state.status; | ||
if (this.props.in) { | ||
@@ -237,16 +230,13 @@ if (status !== ENTERING && status !== ENTERED) { | ||
} | ||
this.updateStatus(false, nextStatus); | ||
}; | ||
Transition.prototype.componentWillUnmount = function componentWillUnmount() { | ||
_proto.componentWillUnmount = function componentWillUnmount() { | ||
this.cancelNextCallback(); | ||
}; | ||
Transition.prototype.getTimeouts = function getTimeouts() { | ||
_proto.getTimeouts = function getTimeouts() { | ||
var timeout = this.props.timeout; | ||
var exit = void 0, | ||
enter = void 0, | ||
appear = void 0; | ||
var exit, enter, appear; | ||
exit = enter = appear = timeout; | ||
@@ -259,8 +249,14 @@ | ||
} | ||
return { exit: exit, enter: enter, appear: appear }; | ||
return { | ||
exit: exit, | ||
enter: enter, | ||
appear: appear | ||
}; | ||
}; | ||
Transition.prototype.updateStatus = function updateStatus() { | ||
var mounting = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false; | ||
var nextStatus = arguments[1]; | ||
_proto.updateStatus = function updateStatus(mounting, nextStatus) { | ||
if (mounting === void 0) { | ||
mounting = false; | ||
} | ||
@@ -270,4 +266,5 @@ if (nextStatus !== null) { | ||
this.cancelNextCallback(); | ||
var node = _reactDom2.default.findDOMNode(this); | ||
var node = _reactDom.default.findDOMNode(this); | ||
if (nextStatus === ENTERING) { | ||
@@ -279,19 +276,20 @@ this.performEnter(node, mounting); | ||
} else if (this.props.unmountOnExit && this.state.status === EXITED) { | ||
this.setState({ status: UNMOUNTED }); | ||
this.setState({ | ||
status: UNMOUNTED | ||
}); | ||
} | ||
}; | ||
Transition.prototype.performEnter = function performEnter(node, mounting) { | ||
_proto.performEnter = function performEnter(node, mounting) { | ||
var _this2 = this; | ||
var enter = this.props.enter; | ||
var appearing = this.context.transitionGroup ? this.context.transitionGroup.isMounting : mounting; | ||
var timeouts = this.getTimeouts(); // no enter animation skip right to ENTERED | ||
// if we are mounting and running this it means appear _must_ be set | ||
var timeouts = this.getTimeouts(); | ||
// no enter animation skip right to ENTERED | ||
// if we are mounting and running this it means appear _must_ be set | ||
if (!mounting && !enter) { | ||
this.safeSetState({ status: ENTERED }, function () { | ||
this.safeSetState({ | ||
status: ENTERED | ||
}, function () { | ||
_this2.props.onEntered(node); | ||
@@ -303,9 +301,12 @@ }); | ||
this.props.onEnter(node, appearing); | ||
this.safeSetState({ | ||
status: ENTERING | ||
}, function () { | ||
_this2.props.onEntering(node, appearing); // FIXME: appear timeout? | ||
this.safeSetState({ status: ENTERING }, function () { | ||
_this2.props.onEntering(node, appearing); | ||
// FIXME: appear timeout? | ||
_this2.onTransitionEnd(node, timeouts.enter, function () { | ||
_this2.safeSetState({ status: ENTERED }, function () { | ||
_this2.safeSetState({ | ||
status: ENTERED | ||
}, function () { | ||
_this2.props.onEntered(node, appearing); | ||
@@ -317,12 +318,12 @@ }); | ||
Transition.prototype.performExit = function performExit(node) { | ||
_proto.performExit = function performExit(node) { | ||
var _this3 = this; | ||
var exit = this.props.exit; | ||
var timeouts = this.getTimeouts(); // no exit animation skip right to EXITED | ||
var timeouts = this.getTimeouts(); | ||
// no exit animation skip right to EXITED | ||
if (!exit) { | ||
this.safeSetState({ status: EXITED }, function () { | ||
this.safeSetState({ | ||
status: EXITED | ||
}, function () { | ||
_this3.props.onExited(node); | ||
@@ -332,9 +333,13 @@ }); | ||
} | ||
this.props.onExit(node); | ||
this.safeSetState({ status: EXITING }, function () { | ||
this.safeSetState({ | ||
status: EXITING | ||
}, function () { | ||
_this3.props.onExiting(node); | ||
_this3.onTransitionEnd(node, timeouts.exit, function () { | ||
_this3.safeSetState({ status: EXITED }, function () { | ||
_this3.safeSetState({ | ||
status: EXITED | ||
}, function () { | ||
_this3.props.onExited(node); | ||
@@ -346,3 +351,3 @@ }); | ||
Transition.prototype.cancelNextCallback = function cancelNextCallback() { | ||
_proto.cancelNextCallback = function cancelNextCallback() { | ||
if (this.nextCallback !== null) { | ||
@@ -354,3 +359,3 @@ this.nextCallback.cancel(); | ||
Transition.prototype.safeSetState = function safeSetState(nextState, callback) { | ||
_proto.safeSetState = function safeSetState(nextState, callback) { | ||
// This shouldn't be necessary, but there are weird race conditions with | ||
@@ -363,3 +368,3 @@ // setState callbacks and unmounting in testing, so always make sure that | ||
Transition.prototype.setNextCallback = function setNextCallback(callback) { | ||
_proto.setNextCallback = function setNextCallback(callback) { | ||
var _this4 = this; | ||
@@ -373,3 +378,2 @@ | ||
_this4.nextCallback = null; | ||
callback(event); | ||
@@ -386,3 +390,3 @@ } | ||
Transition.prototype.onTransitionEnd = function onTransitionEnd(node, timeout, handler) { | ||
_proto.onTransitionEnd = function onTransitionEnd(node, timeout, handler) { | ||
this.setNextCallback(handler); | ||
@@ -394,2 +398,3 @@ | ||
} | ||
if (timeout != null) { | ||
@@ -403,4 +408,5 @@ setTimeout(this.nextCallback, timeout); | ||
Transition.prototype.render = function render() { | ||
_proto.render = function render() { | ||
var status = this.state.status; | ||
if (status === UNMOUNTED) { | ||
@@ -410,6 +416,5 @@ return null; | ||
var _props = this.props, | ||
children = _props.children, | ||
childProps = _objectWithoutProperties(_props, ['children']); | ||
// filter props for Transtition | ||
var _this$props = this.props, | ||
children = _this$props.children, | ||
childProps = _objectWithoutPropertiesLoose(_this$props, ["children"]); // filter props for Transtition | ||
@@ -436,8 +441,9 @@ | ||
var child = _react2.default.Children.only(children); | ||
return _react2.default.cloneElement(child, childProps); | ||
var child = _react.default.Children.only(children); | ||
return _react.default.cloneElement(child, childProps); | ||
}; | ||
return Transition; | ||
}(_react2.default.Component); | ||
}(_react.default.Component); | ||
@@ -450,4 +456,2 @@ Transition.contextTypes = { | ||
}; | ||
Transition.propTypes = process.env.NODE_ENV !== "production" ? { | ||
@@ -525,9 +529,10 @@ /** | ||
timeout: function timeout(props) { | ||
for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { | ||
var pt = process.env.NODE_ENV !== "production" ? _PropTypes.timeoutsShape : {};; | ||
if (!props.addEndListener) pt = pt.isRequired; | ||
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { | ||
args[_key - 1] = arguments[_key]; | ||
} | ||
var pt = _PropTypes.timeoutsShape; | ||
if (!props.addEndListener) pt = pt.isRequired; | ||
return pt.apply(undefined, [props].concat(args)); | ||
return pt.apply(void 0, [props].concat(args)); | ||
}, | ||
@@ -592,7 +597,8 @@ | ||
*/ | ||
onExited: PropTypes.func | ||
onExited: PropTypes.func // Name the function so it is clearer in the documentation | ||
// Name the function so it is clearer in the documentation | ||
} : {};function noop() {} | ||
} : {}; | ||
function noop() {} | ||
Transition.defaultProps = { | ||
@@ -605,7 +611,5 @@ in: false, | ||
exit: true, | ||
onEnter: noop, | ||
onEntering: noop, | ||
onEntered: noop, | ||
onExit: noop, | ||
@@ -615,3 +619,2 @@ onExiting: noop, | ||
}; | ||
Transition.UNMOUNTED = 0; | ||
@@ -623,2 +626,4 @@ Transition.EXITED = 1; | ||
exports.default = (0, _reactLifecyclesCompat.polyfill)(Transition); | ||
var _default = (0, _reactLifecyclesCompat.polyfill)(Transition); | ||
exports.default = _default; |
@@ -1,28 +0,23 @@ | ||
'use strict'; | ||
"use strict"; | ||
exports.__esModule = true; | ||
exports.default = void 0; | ||
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 _propTypes = _interopRequireDefault(require("prop-types")); | ||
var _propTypes = require('prop-types'); | ||
var _react = _interopRequireDefault(require("react")); | ||
var _propTypes2 = _interopRequireDefault(_propTypes); | ||
var _reactLifecyclesCompat = require("react-lifecycles-compat"); | ||
var _react = require('react'); | ||
var _ChildMapping = require("./utils/ChildMapping"); | ||
var _react2 = _interopRequireDefault(_react); | ||
var _reactLifecyclesCompat = require('react-lifecycles-compat'); | ||
var _ChildMapping = require('./utils/ChildMapping'); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
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 _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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
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 _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 _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } | ||
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 _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } | ||
@@ -35,3 +30,3 @@ var values = Object.values || function (obj) { | ||
var propTypes = { | ||
var propTypes = process.env.NODE_ENV !== "production" ? { | ||
/** | ||
@@ -44,3 +39,4 @@ * `<TransitionGroup>` renders a `<div>` by default. You can change this | ||
*/ | ||
component: _propTypes2.default.any, | ||
component: _propTypes.default.any, | ||
/** | ||
@@ -52,3 +48,3 @@ * A set of `<Transition>` components, that are toggled `in` and out as they | ||
*/ | ||
children: _propTypes2.default.node, | ||
children: _propTypes.default.node, | ||
@@ -60,3 +56,4 @@ /** | ||
*/ | ||
appear: _propTypes2.default.bool, | ||
appear: _propTypes.default.bool, | ||
/** | ||
@@ -67,3 +64,4 @@ * A convenience prop that enables or disables enter animations | ||
*/ | ||
enter: _propTypes2.default.bool, | ||
enter: _propTypes.default.bool, | ||
/** | ||
@@ -74,3 +72,3 @@ * A convenience prop that enables or disables exit animations | ||
*/ | ||
exit: _propTypes2.default.bool, | ||
exit: _propTypes.default.bool, | ||
@@ -87,5 +85,4 @@ /** | ||
*/ | ||
childFactory: _propTypes2.default.func | ||
}; | ||
childFactory: _propTypes.default.func | ||
} : {};; | ||
var defaultProps = { | ||
@@ -96,35 +93,32 @@ component: 'div', | ||
} | ||
/** | ||
* The `<TransitionGroup>` component manages a set of `<Transition>` components | ||
* in a list. Like with the `<Transition>` component, `<TransitionGroup>`, is a | ||
* state machine for managing the mounting and unmounting of components over | ||
* time. | ||
* The `<TransitionGroup>` component manages a set of transition components | ||
* (`<Transition>` and `<CSSTransition>`) in a list. Like with the transition | ||
* components, `<TransitionGroup>` is a state machine for managing the mounting | ||
* and unmounting of components over time. | ||
* | ||
* Consider the example below using the `Fade` CSS transition from before. | ||
* As items are removed or added to the TodoList the `in` prop is toggled | ||
* automatically by the `<TransitionGroup>`. You can use _any_ `<Transition>` | ||
* component in a `<TransitionGroup>`, not just css. | ||
* Consider the example below. As items are removed or added to the TodoList the | ||
* `in` prop is toggled automatically by the `<TransitionGroup>`. | ||
* | ||
* ## Example | ||
* | ||
* <iframe src="https://codesandbox.io/embed/00rqyo26kn?fontsize=14" style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;" sandbox="allow-modals allow-forms allow-popups allow-scripts allow-same-origin"></iframe> | ||
* | ||
* Note that `<TransitionGroup>` does not define any animation behavior! | ||
* Exactly _how_ a list item animates is up to the individual `<Transition>` | ||
* components. This means you can mix and match animations across different | ||
* list items. | ||
* Exactly _how_ a list item animates is up to the individual transition | ||
* component. This means you can mix and match animations across different list | ||
* items. | ||
*/ | ||
}; | ||
var TransitionGroup = function (_React$Component) { | ||
_inherits(TransitionGroup, _React$Component); | ||
var TransitionGroup = | ||
/*#__PURE__*/ | ||
function (_React$Component) { | ||
_inheritsLoose(TransitionGroup, _React$Component); | ||
function TransitionGroup(props, context) { | ||
_classCallCheck(this, TransitionGroup); | ||
var _this; | ||
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props, context)); | ||
_this = _React$Component.call(this, props, context) || this; | ||
var handleExited = _this.handleExited.bind(_this); | ||
var handleExited = _this.handleExited.bind(_assertThisInitialized(_assertThisInitialized(_this))); // Initial children should all be entering, dependent on appear | ||
// Initial children should all be entering, dependent on appear | ||
_this.state = { | ||
@@ -137,9 +131,13 @@ handleExited: handleExited, | ||
TransitionGroup.prototype.getChildContext = function getChildContext() { | ||
var _proto = TransitionGroup.prototype; | ||
_proto.getChildContext = function getChildContext() { | ||
return { | ||
transitionGroup: { isMounting: !this.appeared } | ||
transitionGroup: { | ||
isMounting: !this.appeared | ||
} | ||
}; | ||
}; | ||
TransitionGroup.prototype.componentDidMount = function componentDidMount() { | ||
_proto.componentDidMount = function componentDidMount() { | ||
this.appeared = true; | ||
@@ -152,3 +150,2 @@ }; | ||
firstRender = _ref.firstRender; | ||
return { | ||
@@ -160,5 +157,4 @@ children: firstRender ? (0, _ChildMapping.getInitialChildMapping)(nextProps, handleExited) : (0, _ChildMapping.getNextChildMapping)(nextProps, prevChildMapping, handleExited), | ||
TransitionGroup.prototype.handleExited = function handleExited(child, node) { | ||
_proto.handleExited = function handleExited(child, node) { | ||
var currentChildMapping = (0, _ChildMapping.getChildMapping)(this.props.children); | ||
if (child.key in currentChildMapping) return; | ||
@@ -174,14 +170,15 @@ | ||
delete children[child.key]; | ||
return { children: children }; | ||
return { | ||
children: children | ||
}; | ||
}); | ||
}; | ||
TransitionGroup.prototype.render = function render() { | ||
var _props = this.props, | ||
Component = _props.component, | ||
childFactory = _props.childFactory, | ||
props = _objectWithoutProperties(_props, ['component', 'childFactory']); | ||
_proto.render = function render() { | ||
var _this$props = this.props, | ||
Component = _this$props.component, | ||
childFactory = _this$props.childFactory, | ||
props = _objectWithoutPropertiesLoose(_this$props, ["component", "childFactory"]); | ||
var children = values(this.state.children).map(childFactory); | ||
delete props.appear; | ||
@@ -194,21 +191,18 @@ delete props.enter; | ||
} | ||
return _react2.default.createElement( | ||
Component, | ||
props, | ||
children | ||
); | ||
return _react.default.createElement(Component, props, children); | ||
}; | ||
return TransitionGroup; | ||
}(_react2.default.Component); | ||
}(_react.default.Component); | ||
TransitionGroup.childContextTypes = { | ||
transitionGroup: _propTypes2.default.object.isRequired | ||
transitionGroup: _propTypes.default.object.isRequired | ||
}; | ||
TransitionGroup.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {}; | ||
TransitionGroup.defaultProps = defaultProps; | ||
exports.default = (0, _reactLifecyclesCompat.polyfill)(TransitionGroup); | ||
module.exports = exports['default']; | ||
var _default = (0, _reactLifecyclesCompat.polyfill)(TransitionGroup); | ||
exports.default = _default; | ||
module.exports = exports["default"]; |
@@ -1,2 +0,2 @@ | ||
'use strict'; | ||
"use strict"; | ||
@@ -9,3 +9,3 @@ exports.__esModule = true; | ||
var _react = require('react'); | ||
var _react = require("react"); | ||
@@ -32,3 +32,2 @@ /** | ||
} | ||
/** | ||
@@ -51,2 +50,4 @@ * When you're adding or removing children some may be added or removed in the | ||
*/ | ||
function mergeChildMappings(prev, next) { | ||
@@ -58,9 +59,9 @@ prev = prev || {}; | ||
return key in next ? next[key] : prev[key]; | ||
} | ||
} // For each key of `next`, the list of keys to insert before that key in | ||
// the combined list | ||
// For each key of `next`, the list of keys to insert before that key in | ||
// the combined list | ||
var nextKeysPending = Object.create(null); | ||
var pendingKeys = []; | ||
var pendingKeys = []; | ||
for (var prevKey in prev) { | ||
@@ -77,4 +78,5 @@ if (prevKey in next) { | ||
var i = void 0; | ||
var i; | ||
var childMapping = {}; | ||
for (var nextKey in next) { | ||
@@ -87,6 +89,7 @@ if (nextKeysPending[nextKey]) { | ||
} | ||
childMapping[nextKey] = getValueForKey(nextKey); | ||
} | ||
} // Finally, add the keys which didn't appear before any key in `next` | ||
// Finally, add the keys which didn't appear before any key in `next` | ||
for (i = 0; i < pendingKeys.length; i++) { | ||
@@ -118,15 +121,10 @@ childMapping[pendingKeys[i]] = getValueForKey(pendingKeys[i]); | ||
var children = mergeChildMappings(prevChildMapping, nextChildMapping); | ||
Object.keys(children).forEach(function (key) { | ||
var child = children[key]; | ||
if (!(0, _react.isValidElement)(child)) return; | ||
var hasPrev = key in prevChildMapping; | ||
var hasNext = key in nextChildMapping; | ||
var prevChild = prevChildMapping[key]; | ||
var isLeaving = (0, _react.isValidElement)(prevChild) && !prevChild.props.in; | ||
var isLeaving = (0, _react.isValidElement)(prevChild) && !prevChild.props.in; // item is new (entering) | ||
// item is new (entering) | ||
if (hasNext && (!hasPrev || isLeaving)) { | ||
@@ -143,3 +141,5 @@ // console.log('entering', key) | ||
// console.log('leaving', key) | ||
children[key] = (0, _react.cloneElement)(child, { in: false }); | ||
children[key] = (0, _react.cloneElement)(child, { | ||
in: false | ||
}); | ||
} else if (hasNext && hasPrev && (0, _react.isValidElement)(prevChild)) { | ||
@@ -157,4 +157,3 @@ // item hasn't changed transition states | ||
}); | ||
return children; | ||
} |
@@ -1,11 +0,9 @@ | ||
'use strict'; | ||
"use strict"; | ||
exports.__esModule = true; | ||
exports.classNamesShape = exports.timeoutsShape = undefined; | ||
exports.transitionTimeout = transitionTimeout; | ||
exports.classNamesShape = exports.timeoutsShape = void 0; | ||
var _propTypes = require('prop-types'); | ||
var _propTypes = _interopRequireDefault(require("prop-types")); | ||
var _propTypes2 = _interopRequireDefault(_propTypes); | ||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } | ||
@@ -16,3 +14,2 @@ | ||
var enabledPropName = 'transition' + transitionType; | ||
return function (props) { | ||
@@ -23,5 +20,3 @@ // If the transition is enabled | ||
if (props[timeoutPropName] == null) { | ||
return new Error(timeoutPropName + ' wasn\'t supplied to CSSTransitionGroup: ' + 'this can cause unreliable animations and won\'t be supported in ' + 'a future version of React. See ' + 'https://fb.me/react-animation-transition-group-timeout for more ' + 'information.'); | ||
// If the duration isn't a number | ||
return new Error(timeoutPropName + ' wasn\'t supplied to CSSTransitionGroup: ' + 'this can cause unreliable animations and won\'t be supported in ' + 'a future version of React. See ' + 'https://fb.me/react-animation-transition-group-timeout for more ' + 'information.'); // If the duration isn't a number | ||
} else if (typeof props[timeoutPropName] !== 'number') { | ||
@@ -36,18 +31,22 @@ return new Error(timeoutPropName + ' must be a number (in milliseconds)'); | ||
var timeoutsShape = exports.timeoutsShape = _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.shape({ | ||
enter: _propTypes2.default.number, | ||
exit: _propTypes2.default.number | ||
var timeoutsShape = _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.shape({ | ||
enter: _propTypes.default.number, | ||
exit: _propTypes.default.number | ||
}).isRequired]); | ||
var classNamesShape = exports.classNamesShape = _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.shape({ | ||
enter: _propTypes2.default.string, | ||
exit: _propTypes2.default.string, | ||
active: _propTypes2.default.string | ||
}), _propTypes2.default.shape({ | ||
enter: _propTypes2.default.string, | ||
enterDone: _propTypes2.default.string, | ||
enterActive: _propTypes2.default.string, | ||
exit: _propTypes2.default.string, | ||
exitDone: _propTypes2.default.string, | ||
exitActive: _propTypes2.default.string | ||
})]); | ||
exports.timeoutsShape = timeoutsShape; | ||
var classNamesShape = _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.shape({ | ||
enter: _propTypes.default.string, | ||
exit: _propTypes.default.string, | ||
active: _propTypes.default.string | ||
}), _propTypes.default.shape({ | ||
enter: _propTypes.default.string, | ||
enterDone: _propTypes.default.string, | ||
enterActive: _propTypes.default.string, | ||
exit: _propTypes.default.string, | ||
exitDone: _propTypes.default.string, | ||
exitActive: _propTypes.default.string | ||
})]); | ||
exports.classNamesShape = classNamesShape; |
"use strict"; | ||
exports.__esModule = true; | ||
exports.default = void 0; | ||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
var SimpleSet = function () { | ||
var SimpleSet = | ||
/*#__PURE__*/ | ||
function () { | ||
function SimpleSet() { | ||
_classCallCheck(this, SimpleSet); | ||
this.v = []; | ||
} | ||
SimpleSet.prototype.clear = function clear() { | ||
var _proto = SimpleSet.prototype; | ||
_proto.clear = function clear() { | ||
this.v.length = 0; | ||
}; | ||
SimpleSet.prototype.has = function has(k) { | ||
_proto.has = function has(k) { | ||
return this.v.indexOf(k) !== -1; | ||
}; | ||
SimpleSet.prototype.add = function add(k) { | ||
_proto.add = function add(k) { | ||
if (this.has(k)) return; | ||
@@ -27,3 +28,3 @@ this.v.push(k); | ||
SimpleSet.prototype.delete = function _delete(k) { | ||
_proto.delete = function _delete(k) { | ||
var idx = this.v.indexOf(k); | ||
@@ -30,0 +31,0 @@ if (idx === -1) return false; |
Sorry, the diff of this file is too big to display
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
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
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
Environment variable access
Supply chain riskPackage accesses environment variables, which may be a sign of credential stuffing or data theft.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
8
76295
13
1234
1
Updatedloose-envify@^1.4.0