86 lines
2.7 KiB
JavaScript

import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
var _class, _temp2;
import React, { Component, Children } from 'react';
import { findDOMNode, createPortal } from 'react-dom';
import PropTypes from 'prop-types';
import { func } from '../util';
import findNode from './utils/find-node';
var makeChain = func.makeChain;
var Gateway = (_temp2 = _class = function (_Component) {
_inherits(Gateway, _Component);
function Gateway() {
var _temp, _this, _ret;
_classCallCheck(this, Gateway);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.saveChildRef = function (ref) {
_this.child = ref;
}, _temp), _possibleConstructorReturn(_this, _ret);
}
Gateway.prototype.componentDidMount = function componentDidMount() {
this.containerNode = this.getContainerNode(this.props);
this.forceUpdate();
};
Gateway.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
this.containerNode = this.getContainerNode(nextProps);
};
Gateway.prototype.getContainerNode = function getContainerNode(props) {
var targetNode = findNode(props.target);
return findNode(props.container, targetNode);
};
Gateway.prototype.getChildNode = function getChildNode() {
try {
return findDOMNode(this.child);
} catch (err) {
return null;
}
};
Gateway.prototype.render = function render() {
if (!this.containerNode) {
return null;
}
var children = this.props.children;
var child = children ? Children.only(children) : null;
if (!child) {
return null;
}
if (typeof child.ref === 'string') {
throw new Error('Can not set ref by string in Gateway, use function instead.');
}
child = React.cloneElement(child, {
ref: makeChain(this.saveChildRef, child.ref)
});
return createPortal(child, this.containerNode);
};
return Gateway;
}(Component), _class.propTypes = {
children: PropTypes.node,
container: PropTypes.any,
target: PropTypes.any
}, _class.defaultProps = {
container: function container() {
return document.body;
}
}, _temp2);
Gateway.displayName = 'Gateway';
export { Gateway as default };