amis-rpc-design/node_modules/rc-util/es/PortalWrapper.js

213 lines
8.0 KiB
JavaScript
Raw Normal View History

2023-10-07 19:42:30 +08:00
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _typeof from "@babel/runtime/helpers/esm/typeof";
/* eslint-disable no-underscore-dangle,react/require-default-props */
import * as React from 'react';
import raf from "./raf";
import Portal from "./Portal";
import canUseDom from "./Dom/canUseDom";
import switchScrollingEffect from "./switchScrollingEffect";
import setStyle from "./setStyle";
import ScrollLocker from "./Dom/scrollLocker";
var openCount = 0;
var supportDom = canUseDom();
/** @private Test usage only */
export function getOpenCount() {
return process.env.NODE_ENV === 'test' ? openCount : 0;
}
// https://github.com/ant-design/ant-design/issues/19340
// https://github.com/ant-design/ant-design/issues/19332
var cacheOverflow = {};
var getParent = function getParent(getContainer) {
if (!supportDom) {
return null;
}
if (getContainer) {
if (typeof getContainer === 'string') {
return document.querySelectorAll(getContainer)[0];
}
if (typeof getContainer === 'function') {
return getContainer();
}
if (_typeof(getContainer) === 'object' && getContainer instanceof window.HTMLElement) {
return getContainer;
}
}
return document.body;
};
var PortalWrapper = /*#__PURE__*/function (_React$Component) {
_inherits(PortalWrapper, _React$Component);
var _super = _createSuper(PortalWrapper);
function PortalWrapper(props) {
var _this;
_classCallCheck(this, PortalWrapper);
_this = _super.call(this, props);
_defineProperty(_assertThisInitialized(_this), "container", void 0);
_defineProperty(_assertThisInitialized(_this), "componentRef", /*#__PURE__*/React.createRef());
_defineProperty(_assertThisInitialized(_this), "rafId", void 0);
_defineProperty(_assertThisInitialized(_this), "scrollLocker", void 0);
_defineProperty(_assertThisInitialized(_this), "renderComponent", void 0);
_defineProperty(_assertThisInitialized(_this), "updateScrollLocker", function (prevProps) {
var _ref = prevProps || {},
prevVisible = _ref.visible;
var _this$props = _this.props,
getContainer = _this$props.getContainer,
visible = _this$props.visible;
if (visible && visible !== prevVisible && supportDom && getParent(getContainer) !== _this.scrollLocker.getContainer()) {
_this.scrollLocker.reLock({
container: getParent(getContainer)
});
}
});
_defineProperty(_assertThisInitialized(_this), "updateOpenCount", function (prevProps) {
var _ref2 = prevProps || {},
prevVisible = _ref2.visible,
prevGetContainer = _ref2.getContainer;
var _this$props2 = _this.props,
visible = _this$props2.visible,
getContainer = _this$props2.getContainer;
// Update count
if (visible !== prevVisible && supportDom && getParent(getContainer) === document.body) {
if (visible && !prevVisible) {
openCount += 1;
} else if (prevProps) {
openCount -= 1;
}
}
// Clean up container if needed
var getContainerIsFunc = typeof getContainer === 'function' && typeof prevGetContainer === 'function';
if (getContainerIsFunc ? getContainer.toString() !== prevGetContainer.toString() : getContainer !== prevGetContainer) {
_this.removeCurrentContainer();
}
});
_defineProperty(_assertThisInitialized(_this), "attachToParent", function () {
var force = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
if (force || _this.container && !_this.container.parentNode) {
var parent = getParent(_this.props.getContainer);
if (parent) {
parent.appendChild(_this.container);
return true;
}
return false;
}
return true;
});
_defineProperty(_assertThisInitialized(_this), "getContainer", function () {
if (!supportDom) {
return null;
}
if (!_this.container) {
_this.container = document.createElement('div');
_this.attachToParent(true);
}
_this.setWrapperClassName();
return _this.container;
});
_defineProperty(_assertThisInitialized(_this), "setWrapperClassName", function () {
var wrapperClassName = _this.props.wrapperClassName;
if (_this.container && wrapperClassName && wrapperClassName !== _this.container.className) {
_this.container.className = wrapperClassName;
}
});
_defineProperty(_assertThisInitialized(_this), "removeCurrentContainer", function () {
var _this$container, _this$container$paren;
// Portal will remove from `parentNode`.
// Let's handle this again to avoid refactor issue.
(_this$container = _this.container) === null || _this$container === void 0 ? void 0 : (_this$container$paren = _this$container.parentNode) === null || _this$container$paren === void 0 ? void 0 : _this$container$paren.removeChild(_this.container);
});
/**
* Enhance ./switchScrollingEffect
* 1. Simulate document body scroll bar with
* 2. Record body has overflow style and recover when all of PortalWrapper invisible
* 3. Disable body scroll when PortalWrapper has open
*
* @memberof PortalWrapper
*/
_defineProperty(_assertThisInitialized(_this), "switchScrollingEffect", function () {
if (openCount === 1 && !Object.keys(cacheOverflow).length) {
switchScrollingEffect();
// Must be set after switchScrollingEffect
cacheOverflow = setStyle({
overflow: 'hidden',
overflowX: 'hidden',
overflowY: 'hidden'
});
} else if (!openCount) {
setStyle(cacheOverflow);
cacheOverflow = {};
switchScrollingEffect(true);
}
});
_this.scrollLocker = new ScrollLocker({
container: getParent(props.getContainer)
});
return _this;
}
_createClass(PortalWrapper, [{
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
this.updateOpenCount();
if (!this.attachToParent()) {
this.rafId = raf(function () {
_this2.forceUpdate();
});
}
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
this.updateOpenCount(prevProps);
this.updateScrollLocker(prevProps);
this.setWrapperClassName();
this.attachToParent();
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
var _this$props3 = this.props,
visible = _this$props3.visible,
getContainer = _this$props3.getContainer;
if (supportDom && getParent(getContainer) === document.body) {
// 离开时不会 render 导到离开时数值不变,改用 func 。。
openCount = visible && openCount ? openCount - 1 : openCount;
}
this.removeCurrentContainer();
raf.cancel(this.rafId);
}
}, {
key: "render",
value: function render() {
var _this$props4 = this.props,
children = _this$props4.children,
forceRender = _this$props4.forceRender,
visible = _this$props4.visible;
var portal = null;
var childProps = {
getOpenCount: function getOpenCount() {
return openCount;
},
getContainer: this.getContainer,
switchScrollingEffect: this.switchScrollingEffect,
scrollLocker: this.scrollLocker
};
if (forceRender || visible || this.componentRef.current) {
portal = /*#__PURE__*/React.createElement(Portal, {
getContainer: this.getContainer,
ref: this.componentRef
}, children(childProps));
}
return portal;
}
}]);
return PortalWrapper;
}(React.Component);
export default PortalWrapper;