qt-public-ui/es/freePop/index.js

新设计规范下业务组件库

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
var _excluded = ["offset", "onVisibleChange"];
import React from 'react';
import { render, unmountComponentAtNode } from 'react-dom';
import { Popover } from 'antd';
var getPageOffset = function getPageOffset(dom, offset) {
  if (offset === void 0) {
    offset = {
      top: 0,
      left: 0
    };
  }
  if (dom === document.body || !dom) {
    return offset;
  }

  // eslint-disable-next-line no-param-reassign
  offset.top += dom.offsetTop;
  // eslint-disable-next-line no-param-reassign
  offset.left += dom.offsetLeft;
  return getPageOffset(dom.offsetParent, offset);
};
var isHTMLElement = function isHTMLElement(value) {
  return value instanceof HTMLElement;
};
var getClientStyle = function getClientStyle(meta, offset) {
  if (offset === void 0) {
    offset = {};
  }
  var _offset = offset,
    _offset$x = _offset.x,
    x = _offset$x === void 0 ? 0 : _offset$x,
    _offset$y = _offset.y,
    y = _offset$y === void 0 ? 0 : _offset$y;
  var clientInfo = null;
  if (isHTMLElement(meta)) {
    var off = getPageOffset(meta);
    clientInfo = {
      width: meta.offsetWidth,
      height: meta.offsetHeight,
      left: off.left + x,
      top: off.top + y
    };
  } else {
    var _meta = meta;
    clientInfo = {
      width: 1,
      height: 1,
      left: _meta.pageX + x,
      top: _meta.pageY + y
    };
  }
  return clientInfo;
};
var createParent = function createParent() {
  var div = document.createElement('div');
  div.setAttribute('style', 'position: absolute; top: 0px; left: 0px; width: 100%;');
  document.body.appendChild(div);
  return div;
};
export default (function (meta, props) {
  var offset = props.offset,
    onVisibleChange = props.onVisibleChange,
    popoverProps = _objectWithoutPropertiesLoose(props, _excluded);
  var clientStyle = getClientStyle(meta, offset);
  var parent = createParent();
  var onVisChange = function onVisChange(visible) {
    if (!visible) {
      setTimeout(function () {
        unmountComponentAtNode(parent);
        parent.parentNode && parent.parentNode.removeChild(parent);
      }, 10);
    }
    onVisibleChange && onVisibleChange(visible);
  };
  var close = function close() {
    onVisChange(false);
  };
  var popOver = /*#__PURE__*/React.createElement(Popover, _extends({}, popoverProps, {
    onVisibleChange: onVisChange
  }), /*#__PURE__*/React.createElement("div", {
    style: _extends({
      position: 'absolute'
    }, clientStyle)
  }));
  render(popOver, parent);
  return {
    close: close
  };
});