Created
April 9, 2020 06:40
-
-
Save JSteunou/5e9e96981562747f760837a1e1d1e96a to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
diff --git a/node_modules/react-transition-group/esm/ReplaceTransition.js b/node_modules/react-transition-group/esm/ReplaceTransition.js | |
index 768ef1e..c282e33 100644 | |
--- a/node_modules/react-transition-group/esm/ReplaceTransition.js | |
+++ b/node_modules/react-transition-group/esm/ReplaceTransition.js | |
@@ -2,7 +2,6 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith | |
import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose"; | |
import PropTypes from 'prop-types'; | |
import React from 'react'; | |
-import ReactDOM from 'react-dom'; | |
import TransitionGroup from './TransitionGroup'; | |
/** | |
* The `<ReplaceTransition>` component is a specialized `Transition` component | |
@@ -30,6 +29,8 @@ function (_React$Component) { | |
_this = _React$Component.call.apply(_React$Component, [this].concat(_args)) || this; | |
+ _this.nodeRef = React.createRef(); | |
+ | |
_this.handleEnter = function () { | |
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) { | |
args[_key2] = arguments[_key2]; | |
@@ -89,7 +90,7 @@ function (_React$Component) { | |
var children = this.props.children; | |
var child = React.Children.toArray(children)[idx]; | |
if (child.props[handler]) (_child$props = child.props)[handler].apply(_child$props, originalArgs); | |
- if (this.props[handler]) this.props[handler](ReactDOM.findDOMNode(this)); | |
+ if (this.props[handler]) this.props[handler](this.nodeRef.current); | |
}; | |
_proto.render = function render() { | |
@@ -108,16 +109,21 @@ function (_React$Component) { | |
delete props.onExit; | |
delete props.onExiting; | |
delete props.onExited; | |
+ | |
+ this.nodeRef = inProp ? first.ref || this.nodeRef : second.ref || this.nodeRef; | |
+ | |
return React.createElement(TransitionGroup, props, inProp ? React.cloneElement(first, { | |
key: 'first', | |
onEnter: this.handleEnter, | |
onEntering: this.handleEntering, | |
- onEntered: this.handleEntered | |
+ onEntered: this.handleEntered, | |
+ ref: this.nodeRef | |
}) : React.cloneElement(second, { | |
key: 'second', | |
onEnter: this.handleExit, | |
onEntering: this.handleExiting, | |
- onEntered: this.handleExited | |
+ onEntered: this.handleExited, | |
+ ref: this.nodeRef | |
})); | |
}; | |
diff --git a/node_modules/react-transition-group/esm/Transition.js b/node_modules/react-transition-group/esm/Transition.js | |
index ef96aed..a71dfd5 100644 | |
--- a/node_modules/react-transition-group/esm/Transition.js | |
+++ b/node_modules/react-transition-group/esm/Transition.js | |
@@ -2,7 +2,6 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWith | |
import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose"; | |
import PropTypes from 'prop-types'; | |
import React from 'react'; | |
-import ReactDOM from 'react-dom'; | |
import config from './config'; | |
import { timeoutsShape } from './utils/PropTypes'; | |
import TransitionGroupContext from './TransitionGroupContext'; | |
@@ -112,6 +111,7 @@ function (_React$Component) { | |
var _this; | |
_this = _React$Component.call(this, props, context) || this; | |
+ _this.nodeRef = React.createRef(); | |
var parentGroup = context; // In the context of a TransitionGroup all enters are really appears | |
var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear; | |
@@ -225,7 +225,7 @@ function (_React$Component) { | |
if (nextStatus !== null) { | |
// nextStatus will always be ENTERING or EXITING. | |
this.cancelNextCallback(); | |
- var node = ReactDOM.findDOMNode(this); | |
+ var node = this.nodeRef.current; | |
if (nextStatus === ENTERING) { | |
this.performEnter(node, mounting); | |
@@ -384,18 +384,19 @@ function (_React$Component) { | |
delete childProps.onExiting; | |
delete childProps.onExited; | |
- if (typeof children === 'function') { | |
- // allows for nested Transitions | |
- return React.createElement(TransitionGroupContext.Provider, { | |
- value: null | |
- }, children(status, childProps)); | |
- } | |
+ var child = typeof children === 'function' | |
+ ? children(status, childProps) | |
+ : React.Children.only(children) | |
+ ; | |
+ | |
+ // get child.ref or use internal if missing child.ref | |
+ this.nodeRef = child.ref || this.nodeRef; | |
- var child = React.Children.only(children); | |
return (// allows for nested Transitions | |
- React.createElement(TransitionGroupContext.Provider, { | |
- value: null | |
- }, React.cloneElement(child, childProps)) | |
+ React.createElement(TransitionGroupContext.Provider, | |
+ {value: null}, | |
+ React.cloneElement(child, Object.assign({}, childProps, {ref: this.nodeRef})) | |
+ ) | |
); | |
}; | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment