react-component-transition
Version:
Easy animations between react component transitions.
37 lines (36 loc) • 2.15 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.ComponentTransition = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importStar(require("react"));
var context_1 = require("./context");
var transition_1 = require("../transition");
var ComponentTransition = function (props) {
var context = react_1.useContext(context_1.ComponentTransitionContext);
var forceExit = (context === null || context === void 0 ? void 0 : context.exitKeys.indexOf(context.contextId)) > -1;
var forceEnter = (context === null || context === void 0 ? void 0 : context.enterKeys.indexOf(context.contextId)) > -1;
var animateOnMount = props.animateOnMount, children = props.children, lazy = props.lazy, onEnterFinished = props.onEnterFinished, onExitFinished = props.onExitFinished;
var handleEnterFinished = function () {
if (onEnterFinished) {
onEnterFinished();
}
if ((context === null || context === void 0 ? void 0 : context.contextId) && (context === null || context === void 0 ? void 0 : context.onEnterFinished)) {
context.onEnterFinished(context.contextId);
}
};
var handleExitFinished = function () {
if (onExitFinished) {
onExitFinished();
}
if ((context === null || context === void 0 ? void 0 : context.contextId) && (context === null || context === void 0 ? void 0 : context.onExitFinished)) {
context.onExitFinished(context.contextId);
}
};
var Component = lazy ? transition_1.LazyTransition : transition_1.Transition;
return (
// Clear context for nested transitions
react_1.default.createElement(context_1.ComponentTransitionContext.Provider, { value: null },
react_1.default.createElement(Component, tslib_1.__assign({}, props, { animateOnMount: forceEnter || animateOnMount, onEnterFinished: handleEnterFinished, onExitFinished: handleExitFinished }), forceExit ? null : children)));
};
exports.ComponentTransition = ComponentTransition;
exports.ComponentTransition.displayName = "ComponentTransition";