fcr-ui-scene 3.6.0 → 3.6.2

package/lib/modules/dialog/components/host-area-container/index.js

@@ -0,0 +1,214 @@
+"use strict";
+
+require("core-js/modules/es.symbol.js");
+require("core-js/modules/es.array.filter.js");
+require("core-js/modules/es.array.for-each.js");
+require("core-js/modules/es.array.push.js");
+require("core-js/modules/es.object.define-properties.js");
+require("core-js/modules/es.object.define-property.js");
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+require("core-js/modules/es.object.keys.js");
+require("core-js/modules/esnext.async-iterator.filter.js");
+require("core-js/modules/esnext.async-iterator.for-each.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.for-each.js");
+require("core-js/modules/web.dom-collections.for-each.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HotAreaContext = exports.HotAreaContainer = void 0;
+require("core-js/modules/es.array.concat.js");
+require("core-js/modules/es.array.find.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/esnext.async-iterator.find.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.find.js");
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = require("@use-gesture/react");
+var _react2 = require("react");
+var _useElectron = require("../../hooks/useElectron");
+var _env = require("agora-foundation/lib/utilities/env");
+var _constant = require("../../../../utilities/constant");
+var _tools = require("../../../../utilities/tools");
+var _store = require("../../store");
+var _platform = require("../../../../utilities/platform");
+var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["x", "y"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var HotAreaContext = exports.HotAreaContext = /*#__PURE__*/(0, _react2.createContext)({
+  placement: 'top'
+});
+var HotAreaContainer = exports.HotAreaContainer = function HotAreaContainer(props) {
+  var children = props.children,
+    width = props.width,
+    height = props.height,
+    _props$placement = props.placement,
+    placement = _props$placement === void 0 ? 'top' : _props$placement,
+    dialogKey = props.dialogKey;
+  var _useContext = (0, _react2.useContext)(_store.StoreContext),
+    recordShareBounds = _useContext.recordShareBounds,
+    currentShareBounds = _useContext.currentShareBounds,
+    currentShareId = _useContext.currentShareId,
+    currentShareType = _useContext.currentShareType,
+    allApplicationWindows = _useContext.allApplicationWindows;
+  var _ref = (0, _env.isElectron)() ? (0, _react2.useContext)(_useElectron.DialogInstanceContext) : {},
+    browserWindow = _ref.browserWindow,
+    newRendererWindow = _ref.newRendererWindow;
+  var windowFocusTimerRef = (0, _react2.useRef)();
+  var _useState = (0, _react2.useState)(placement),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    navCurrentPosition = _useState2[0],
+    setNavCurrentPosition = _useState2[1];
+  var rndRef = (0, _react2.useRef)(null);
+  var _ref2 = (0, _react2.useMemo)(function () {
+      return (0, _tools.followCorrectDisplay)({
+        dialogKey: _constant.FcrUIDialogKey.ANNOTATION_TOOL
+      });
+    }, []) || {
+      nearDisplayBounds: {
+        width: 0,
+        height: 0
+      }
+    },
+    bounds = _ref2.nearDisplayBounds;
+  var _useState3 = (0, _react2.useState)({
+      x: bounds.width / 2 - width / 2,
+      y: bounds.height - height - 60
+    }),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    coordination = _useState4[0],
+    setCoordination = _useState4[1];
+  var bind = (0, _react.useDrag)(function (_ref3) {
+    var _rndRef$current;
+    var _ref3$delta = (0, _slicedToArray2["default"])(_ref3.delta, 2),
+      dx = _ref3$delta[0],
+      dy = _ref3$delta[1];
+    var x = coordination.x + dx;
+    var y = coordination.y + dy;
+    var maxX = bounds.width - (((_rndRef$current = rndRef.current) === null || _rndRef$current === void 0 ? void 0 : _rndRef$current.offsetWidth) || width);
+    var maxY = bounds.height - height;
+    handleDragStop({
+      lastX: Math.max(0, Math.min(maxX, x)),
+      lastY: Math.max(0, Math.min(maxY, y))
+    });
+  });
+  var handleDragStop = function handleDragStop(data) {
+    var x = data.lastX,
+      y = data.lastY;
+    setCoordination({
+      x: x,
+      y: y
+    });
+    // 控制栏左上角在屏幕Y轴的最大坐标
+    var MAX_Y = bounds.height - height;
+    if (y >= MAX_Y) {
+      setNavCurrentPosition('bottom');
+    } else if (y <= 0) {
+      setNavCurrentPosition('top');
+    }
+  };
+  var handleMouseEnter = function handleMouseEnter() {
+    browserWindow === null || browserWindow === void 0 || browserWindow.focus();
+    browserWindow === null || browserWindow === void 0 || browserWindow.setIgnoreMouseEvents(false, {
+      forward: true
+    });
+  };
+  var handleMouseLeave = function handleMouseLeave(e) {
+    browserWindow === null || browserWindow === void 0 || browserWindow.setIgnoreMouseEvents(true, {
+      forward: true
+    });
+  };
+  var handleMouseMove = function handleMouseMove() {
+    browserWindow === null || browserWindow === void 0 || browserWindow.moveTop();
+    browserWindow === null || browserWindow === void 0 || browserWindow.focus();
+    browserWindow === null || browserWindow === void 0 || browserWindow.setIgnoreMouseEvents(false, {
+      forward: true
+    });
+  };
+  function getScreenBounds() {
+    // 当电脑系统更改主屏幕为非共享屏幕时，会导致正在共享屏幕的 x, y 坐标发生改变，并触发 merics-changed 事件，去重新计算 controlbar 的热区位置
+    // 但当初分享屏幕时是通过所选择屏幕的 bounds 通过 currentShareBounds 传递到热区计算函数获知到热区应该在哪个显示器上的
+    // 因此当系统的主屏幕发生改变，再次通过这个 currentShareBounds 获取的 x, y 坐标就是错误的，以下逻辑既是对此情况做出相应处理
+    // 同一个 currentShareBounds 代表选择分享的屏幕没有发生变化，通过它作为 key 去存屏幕信息。当存在这个 key 时，取出来去拿屏幕 id 去匹配，并重新赋值 x，y
+    var screenBounds = undefined;
+    if (recordShareBounds.has(currentShareBounds)) {
+      var _window$runtime$scree;
+      var _ref4 = recordShareBounds.get(currentShareBounds),
+        ox = _ref4.x,
+        oy = _ref4.y,
+        _bounds = (0, _objectWithoutProperties2["default"])(_ref4, _excluded);
+      var _ref5 = ((_window$runtime$scree = window.runtime.screen.getAllDisplays().find(function (display) {
+          return _bounds.displayId === display.id;
+        })) === null || _window$runtime$scree === void 0 ? void 0 : _window$runtime$scree.bounds) || {
+          x: ox,
+          y: oy
+        },
+        x = _ref5.x,
+        y = _ref5.y;
+      screenBounds = _objectSpread({
+        x: x,
+        y: y
+      }, _bounds);
+      browserWindow === null || browserWindow === void 0 || browserWindow.setBounds(screenBounds);
+    } else {
+      recordShareBounds.clear();
+      screenBounds = (0, _tools.getCurrentSharingWorkArea)({
+        currentShareBounds: currentShareBounds
+      });
+      recordShareBounds.set(currentShareBounds, screenBounds);
+    }
+    return screenBounds;
+  }
+  function checkMouseOver() {
+    if (windowFocusTimerRef.current) clearInterval(windowFocusTimerRef.current);
+    var screenBounds = getScreenBounds();
+    browserWindow && newRendererWindow && (0, _tools.handleCheckMouseOver)({
+      elem: rndRef.current,
+      browserWindow: browserWindow,
+      screenBounds: screenBounds,
+      newRendererWindow: newRendererWindow,
+      callback: function callback(timerId) {
+        windowFocusTimerRef.current = timerId;
+      },
+      dialog: dialogKey
+    });
+  }
+  (0, _react2.useEffect)(function () {
+    (0, _platform.isWindows)() ? checkMouseOver() : getScreenBounds();
+    window.runtime.screen.addListener(
+    // @ts-ignore
+    'display-metrics-changed', (0, _platform.isWindows)() ? checkMouseOver : getScreenBounds);
+    handleMouseLeave();
+    return function () {
+      window.runtime.screen.removeListener(
+      // @ts-ignore
+      'display-metrics-changed', (0, _platform.isWindows)() ? checkMouseOver : getScreenBounds);
+      clearInterval(windowFocusTimerRef.current);
+    };
+  }, [currentShareId]);
+  return currentShareId ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, bind()), {}, {
+    style: {
+      width: 'fit-content',
+      transform: "translate(".concat(coordination.x, "px, ").concat(coordination.y, "px)")
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      ref: rndRef,
+      onMouseEnter: handleMouseEnter,
+      onMouseLeave: handleMouseLeave,
+      onMouseOver: handleMouseEnter,
+      onMouseMove: handleMouseMove,
+      onClick: handleMouseMove,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(HotAreaContext.Provider, {
+        value: {
+          placement: placement
+        },
+        children: children
+      })
+    })
+  })) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});
+};

package/lib/modules/dialog/components/participant/index.js

@@ -28,7 +28,7 @@ var Container = (0, _mobxReact.observer)(function (props) {
     height: 560,
     dialogKey: _constant.FcrUIDialogKey.PARTICIPANT,
     onClose: store.closeParticipantDialog,
-    actions: store.isSharingScreen ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+    actions: store.isSharingScreen && store.isSharingScreenOwner ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
       content: transI18n('fmt_uimanager_option_mergeview'),
       mouseEnterDelay: 0,
       trigger: "hover",

package/lib/modules/dialog/components/share-screen-selection/index.js

@@ -12,8 +12,7 @@ var _useElectron = require("../../hooks/useElectron");
 var _dialogContainer = _interopRequireDefault(require("../dialog-container"));
 var _jsxRuntime = require("react/jsx-runtime");
 var ShareScreenSelectronDialog = exports.ShareScreenSelectronDialog = function ShareScreenSelectronDialog(props) {
-  var children = props.children,
-    config = props.params;
+  var children = props.children;
   var transI18n = (0, _i18n.useI18n)();
   (0, _useElectron.useElectronDialog)({
     dialogKey: _constant.FcrUIDialogKey.SHARE_SCREEN,

package/lib/modules/dialog/components/system-preference/index.js

@@ -83,7 +83,7 @@ var SystemPreferenceDialogContent = function SystemPreferenceDialogContent(props
           },
           children: button.text
         })
-      });
+      }, button.text);
     })]
   });
 };

package/lib/modules/dialog/components/video-window/index.js

@@ -125,6 +125,7 @@ var VideoWindowDialog = exports.VideoWindowDialog = (0, _mobxReact.observer)(fun
             y = _window$runtime$scree2.y,
             width = _window$runtime$scree2.width;
           browserWindow.setBounds(setCalcBounds(x, y, width));
+          store.log("[VideoWindowDialog]: [onOpened],  x: ".concat(x, ", y: ").concat(y, ", width: ").concat(width));
         }
         reCalculate();
         calculateRef.current = reCalculate;

package/lib/modules/dialog/hooks/use-popover-watcher.d.ts

@@ -0,0 +1,14 @@
+export declare function usePopoverWatcher({ wrapperClass, offset, onAdded, onRemoved, }: {
+    wrapperClass: string;
+    onAdded?: () => void;
+    onRemoved?: () => void;
+    offset?: {
+        vertical: number;
+        horizontal: number;
+    };
+}): {
+    watcher: ({ browserWindow, newRendererWindow, }: {
+        browserWindow?: Electron.BrowserWindow;
+        newRendererWindow?: Window;
+    }) => void;
+};

package/lib/modules/dialog/hooks/use-popover-watcher.js

@@ -0,0 +1,112 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePopoverWatcher = usePopoverWatcher;
+require("core-js/modules/es.array.for-each.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/esnext.async-iterator.for-each.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.for-each.js");
+require("core-js/modules/web.dom-collections.for-each.js");
+var _lodash = require("lodash");
+var _react = require("react");
+function usePopoverWatcher(_ref) {
+  var wrapperClass = _ref.wrapperClass,
+    _ref$offset = _ref.offset,
+    offset = _ref$offset === void 0 ? {
+      vertical: 0,
+      horizontal: 0
+    } : _ref$offset,
+    onAdded = _ref.onAdded,
+    onRemoved = _ref.onRemoved;
+  var observerRef = (0, _react.useRef)();
+  var wrapperDomRef = (0, _react.useRef)();
+  function watcher(_ref2) {
+    var browserWindow = _ref2.browserWindow,
+      newRendererWindow = _ref2.newRendererWindow;
+    if (!newRendererWindow || !browserWindow) {
+      return console.log('newRendererWindow and browserWindow is not inital');
+    }
+    if (observerRef.current) observerRef.current.disconnect();
+    var body = newRendererWindow.document.body;
+    var browserWindowBounds = browserWindow.getBounds();
+    var threshold = calculateThreshold(browserWindow, body);
+    browserWindow.addListener(
+    // @ts-ignore
+    'custom-move', (0, _lodash.debounce)(function () {
+      threshold = calculateThreshold(browserWindow, body);
+    }, 200));
+    observerRef.current = new MutationObserver(function (mutationsList) {
+      var popover = body.querySelector('.fcr-popover');
+      wrapperDomRef.current = body.querySelector(wrapperClass);
+      var wrapper = wrapperDomRef.current;
+      mutationsList.forEach(function (mutation) {
+        if (mutation.type === 'childList') {
+          mutation.addedNodes.forEach(function (node) {
+            if (node.nodeType === Node.ELEMENT_NODE && node.contains(popover)) {
+              if (popover) {
+                var wrapperHeight = wrapper.offsetHeight,
+                  wrapperWidth = wrapper.offsetWidth;
+                var offsetHeight = popover.offsetHeight,
+                  popoverWidth = popover.offsetWidth,
+                  offsetTop = popover.offsetTop,
+                  offsetLeft = popover.offsetLeft;
+                // 如果 popover 展开，根据 popover 的尺寸调整窗口的尺寸可以正好容纳 popover
+                browserWindow.setBounds({
+                  height: wrapperHeight + offsetHeight + offset.vertical,
+                  width: wrapperWidth + offset.horizontal,
+                  y: threshold.placement === 'top' ? threshold.y - offsetHeight : threshold.y
+                });
+                // if (wrapper) {
+                //   const rect = wrapper.getBoundingClientRect();
+                //   wrapper.setAttribute('style', `height: ${rect.height}px;width: ${rect.width}px`);
+                //   // popover.setAttribute('style', `left: ${offsetLeft}px;top: ${offsetTop}px`);
+                // }
+                onAdded === null || onAdded === void 0 || onAdded();
+              }
+            }
+          });
+          mutation.removedNodes.forEach(function (node) {
+            var _classList;
+            if ((_classList = node.classList) !== null && _classList !== void 0 && _classList.contains('fcr-popover')) {
+              onRemoved === null || onRemoved === void 0 || onRemoved();
+              var width = browserWindowBounds.width,
+                height = browserWindowBounds.height;
+              browserWindow.setBounds({
+                width: width,
+                height: height,
+                y: threshold.y
+              });
+              browserWindow.setResizable(true);
+            }
+          });
+        }
+      });
+    });
+    observerRef.current.observe(newRendererWindow.document.body, {
+      childList: true,
+      subtree: true
+    });
+  }
+  return {
+    watcher: watcher
+  };
+}
+function calculateThreshold(browserWindow, body) {
+  var _body$querySelector;
+  var bounds = browserWindow.getBounds();
+  var nearDisplay = window.runtime.screen.getDisplayNearestPoint(bounds);
+  var nearDisplayBounds = nearDisplay.bounds;
+  var middleThreshold = nearDisplayBounds.height / 2;
+  var placement = bounds.y > middleThreshold ? 'top' : 'bottom';
+  console.log('custom moving', placement, bounds.y);
+  (_body$querySelector = body.querySelector('#root')) === null || _body$querySelector === void 0 || _body$querySelector.setAttribute('style', "display: flex;align-items: ".concat(placement === 'top' ? 'flex-end' : 'flex-start'));
+  return {
+    placement: placement,
+    x: bounds.x,
+    y: bounds.y
+  };
+}

package/lib/modules/dialog/hooks/useElectron.d.ts

@@ -3,6 +3,7 @@ export declare const DialogInstanceContext: import("react").Context<{
     browserWindow: Electron.BrowserWindow;
     newRendererWindow: Window;
     resizable: boolean;
+    closeDialog: () => void;
 }>;
 export declare const shadowOffset: number;
 export declare const diffPlatformHighLevelLayer: string;

package/lib/modules/dialog/hooks/useElectron.js

@@ -22,6 +22,8 @@ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers
 require("core-js/modules/es.array.concat.js");
 require("core-js/modules/es.array.for-each.js");
 require("core-js/modules/es.array.includes.js");
+require("core-js/modules/es.date.to-json.js");
+require("core-js/modules/es.json.stringify.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/es.string.includes.js");
 require("core-js/modules/esnext.async-iterator.for-each.js");
@@ -33,7 +35,7 @@ var _store = require("../store");
 var _dialogs = require("../dialogs");
 var _renderer = require("../../../utilities/renderer");
 var _reactDom = require("react-dom");
-var _constant = require("../../../utilities/constant");
+var _tools = require("../../../utilities/tools");
 var _jsxRuntime = require("react/jsx-runtime");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -67,7 +69,6 @@ function useElectronDialog(props) {
     fullScreen = props.fullScreen,
     onOpened = props.onOpened,
     onUnmounted = props.onUnmounted,
-    polyfills = props.polyfills,
     _props$hasCustomShado = props.hasCustomShadow,
     hasCustomShadow = _props$hasCustomShado === void 0 ? true : _props$hasCustomShado,
     _props$disableShortcu = props.disableShortcutClose,
@@ -92,53 +93,16 @@ function useElectronDialog(props) {
   (0, _react.useEffect)(function () {
     var node;
     window.runtime.openRendererWindow(dialogKey, function (dom, browserWindow, newRendererWindow) {
-      var _controlbar$isVisible;
       node = dom;
       windowRef.current = browserWindow;
       newRendernerWindowRef.current = newRendererWindow;
       _dialogs.dialogWindows.set(dialogKey, browserWindow);
-      var thisWindowBounds = browserWindow.getBounds();
-      var mainAppWindowBounds = window.runtime.browserWindow.getBounds();
-      var nearDisplayBounds = window.runtime.screen.getDisplayNearestPoint(mainAppWindowBounds).bounds;
-      var controlbar = _dialogs.dialogWindows.get(_constant.FcrUIDialogKey.CONTROL_BAR);
-      if (controlbar && controlbar !== null && controlbar !== void 0 && (_controlbar$isVisible = controlbar.isVisible) !== null && _controlbar$isVisible !== void 0 && _controlbar$isVisible.call(controlbar)) {
-        // 因为打开过的窗口在关闭时是用的 hide 方法，因此只判断 controlbar 是否存在会在关闭 controlbar 时失效，导致窗口依然跟随 controlbar 最后所在屏幕打开，所以要再判断一下 isVisible 状态
-        // 当屏幕共享时会打开 control bar，此时弹窗相对于 control bar 展示
-        var nearDisplay = window.runtime.screen.getDisplayNearestPoint(controlbar.getBounds());
-        var _nearDisplayBounds = nearDisplay.bounds;
-        var _thisWindowBounds = browserWindow.getBounds();
-        var centerBounds = {
-          x: Math.floor(_nearDisplayBounds.x + (_nearDisplayBounds.width - _thisWindowBounds.width) / 2),
-          y: Math.floor(_nearDisplayBounds.y + (_nearDisplayBounds.height - _thisWindowBounds.height) / 2)
-        };
-        // resizeble 为 true 的窗口在切换不同分辨率属性的显示器时，会有打开尺寸失真的情况出现，所以暂存一下其原始值，在更改坐标之后还原
-        var resizeble = browserWindow.isResizable();
-        browserWindow.setResizable(false);
-        browserWindow.setBounds(centerBounds);
-        browserWindow.setResizable(resizeble);
-      } else if (fullScreen) {
-        var _browserWindow$setBou;
-        // 当窗口的自定义设置为全屏时，让弹窗追随主窗口所在的屏幕展示
-        // 目前 fullScreen 的配置主要用于 toast 和 confirm，在应用启动时会直接初始化这两个 dialog，如果未设置 fullScreen，它们因为没有宽高将无法展示
-        var x = nearDisplayBounds.x,
-          y = nearDisplayBounds.y,
-          width = nearDisplayBounds.width,
-          height = nearDisplayBounds.height;
-        browserWindow === null || browserWindow === void 0 || (_browserWindow$setBou = browserWindow.setBounds) === null || _browserWindow$setBou === void 0 || _browserWindow$setBou.call(browserWindow, {
-          x: x,
-          y: y,
-          width: width,
-          height: height
-        });
-      } else {
-        var _browserWindow$setBou2;
-        // 如果窗口未设置全屏模式，那么新打开的弹窗相对于主窗口弹窗的水平垂直居中显示
-        var bounds = {
-          x: Math.floor(mainAppWindowBounds.x + (mainAppWindowBounds.width - thisWindowBounds.width) / 2),
-          y: Math.floor(mainAppWindowBounds.y + (mainAppWindowBounds.height - thisWindowBounds.height) / 2)
-        };
-        browserWindow === null || browserWindow === void 0 || (_browserWindow$setBou2 = browserWindow.setBounds) === null || _browserWindow$setBou2 === void 0 || _browserWindow$setBou2.call(browserWindow, bounds);
-      }
+      var _ref = (0, _tools.followCorrectDisplay)({
+          browserWindow: browserWindow,
+          alwaysFollowScreen: fullScreen
+        }),
+        nearDisplayBounds = _ref.nearDisplayBounds;
+      store === null || store === void 0 || store.log("[useElectronDialog]: dialogKey: ".concat(dialogKey, ", nearDisplayBounds: ").concat(JSON.stringify(nearDisplayBounds)));
 
       // 设置所有窗口为所有工作区可见
       browserWindow.setVisibleOnAllWorkspaces(true, {
@@ -206,7 +170,10 @@ function useElectronDialog(props) {
           value: {
             browserWindow: browserWindow,
             newRendererWindow: newRendererWindow,
-            resizable: !!customConfigs.resizable
+            resizable: !!customConfigs.resizable,
+            closeDialog: function closeDialog() {
+              return store.closeDialogByKey(dialogKey);
+            }
           },
           children: typeof children === 'function' ? children(browserWindow) : children
         })
@@ -248,7 +215,6 @@ function useElectronDialogByDialogId(props) {
     fullScreen = props.fullScreen,
     onOpened = props.onOpened,
     onUnmounted = props.onUnmounted,
-    polyfills = props.polyfills,
     _props$hasCustomShado2 = props.hasCustomShadow,
     hasCustomShadow = _props$hasCustomShado2 === void 0 ? true : _props$hasCustomShado2,
     _props$disableShortcu2 = props.disableShortcutClose,
@@ -274,52 +240,15 @@ function useElectronDialogByDialogId(props) {
   (0, _react.useEffect)(function () {
     var node;
     window.runtime.openRendererWindow(winUniqueId, function (dom, browserWindow, newRendererWindow) {
-      var _controlbar$isVisible2;
       node = dom;
       windowRef.current = browserWindow;
       newRendernerWindowRef.current = newRendererWindow;
       _dialogs.dialogIdWindows.set(winUniqueId, browserWindow);
-      var thisWindowBounds = browserWindow.getBounds();
-      var mainAppWindowBounds = window.runtime.browserWindow.getBounds();
-      var nearDisplayBounds = window.runtime.screen.getDisplayNearestPoint(mainAppWindowBounds).bounds;
-      var controlbar = _dialogs.dialogWindows.get(_constant.FcrUIDialogKey.CONTROL_BAR);
-      if (controlbar && controlbar !== null && controlbar !== void 0 && (_controlbar$isVisible2 = controlbar.isVisible) !== null && _controlbar$isVisible2 !== void 0 && _controlbar$isVisible2.call(controlbar)) {
-        // 因为打开过的窗口在关闭时是用的 hide 方法，因此只判断 controlbar 是否存在会在关闭 controlbar 时失效，导致窗口依然跟随 controlbar 最后所在屏幕打开，所以要再判断一下 isVisible 状态
-        // 当屏幕共享时会打开 control bar，此时弹窗相对于 control bar 展示
-        var nearDisplay = window.runtime.screen.getDisplayNearestPoint(controlbar.getBounds());
-        var _nearDisplayBounds2 = nearDisplay.bounds;
-        var _thisWindowBounds2 = browserWindow.getBounds();
-        var centerBounds = {
-          x: Math.floor(_nearDisplayBounds2.x + (_nearDisplayBounds2.width - _thisWindowBounds2.width) / 2),
-          y: Math.floor(_nearDisplayBounds2.y + (_nearDisplayBounds2.height - _thisWindowBounds2.height) / 2)
-        };
-        // resizeble 为 true 的窗口在切换不同分辨率属性的显示器时，会有打开尺寸失真的情况出现，所以暂存一下其原始值，在更改坐标之后还原
-        var resizeble = browserWindow.isResizable();
-        browserWindow.setResizable(false);
-        browserWindow.setBounds(centerBounds);
-        browserWindow.setResizable(resizeble);
-      } else if (fullScreen) {
-        var _browserWindow$setBou3;
-        // 当窗口的自定义设置为全屏时，让弹窗追随主窗口所在的屏幕展示
-        var x = nearDisplayBounds.x,
-          y = nearDisplayBounds.y,
-          width = nearDisplayBounds.width,
-          height = nearDisplayBounds.height;
-        browserWindow === null || browserWindow === void 0 || (_browserWindow$setBou3 = browserWindow.setBounds) === null || _browserWindow$setBou3 === void 0 || _browserWindow$setBou3.call(browserWindow, {
-          x: x,
-          y: y,
-          width: width,
-          height: height
-        });
-      } else {
-        var _browserWindow$setBou4;
-        // 如果主窗口不是全屏模式，那么新打开的弹窗相对于主窗口弹窗的水平垂直居中显示
-        var bounds = {
-          x: Math.floor(mainAppWindowBounds.x + (mainAppWindowBounds.width - thisWindowBounds.width) / 2),
-          y: Math.floor(mainAppWindowBounds.y + (mainAppWindowBounds.height - thisWindowBounds.height) / 2)
-        };
-        browserWindow === null || browserWindow === void 0 || (_browserWindow$setBou4 = browserWindow.setBounds) === null || _browserWindow$setBou4 === void 0 || _browserWindow$setBou4.call(browserWindow, bounds);
-      }
+      var _ref2 = (0, _tools.followCorrectDisplay)({
+          browserWindow: browserWindow,
+          alwaysFollowScreen: fullScreen
+        }),
+        nearDisplayBounds = _ref2.nearDisplayBounds;
 
       // 设置所有窗口为所有工作区可见
       browserWindow.setVisibleOnAllWorkspaces(true, {
@@ -374,7 +303,10 @@ function useElectronDialogByDialogId(props) {
           value: {
             browserWindow: browserWindow,
             newRendererWindow: newRendererWindow,
-            resizable: !!customConfigs.resizable
+            resizable: !!customConfigs.resizable,
+            closeDialog: function closeDialog() {
+              return store.closeDilaogByDialogId(winUniqueId);
+            }
           },
           children: typeof children === 'function' ? children(browserWindow) : children
         })

package/lib/modules/dialog/index.d.ts

@@ -16,6 +16,7 @@ import { FcrUIDialogInfo } from './type';
 import { FcrUIWidgetProvider } from '../../providers/widget-provider';
 import { FcrUIChatProvider } from '../../providers/chat-provider';
 import { FcrUIScreenShareProvider } from '../../providers/screen-share-provider';
+import { FcrUIScreenShareSharedDataSource } from '../../shared-data-source/screen-share-data';
 export declare class DialogUIModule extends UIModule {
     private _dialogsByKey;
     private _store?;
@@ -35,6 +36,7 @@ export declare class DialogUIModule extends UIModule {
     waitingRoomControlProvider?: FcrUIWaitingRoomControlProvider;
     widgetProvider?: FcrUIWidgetProvider;
     screenShareProvider: FcrUIScreenShareProvider;
+    sharedScreenShareSharedDataSource: FcrUIScreenShareSharedDataSource;
     chatProvider?: FcrUIChatProvider;
     abilityProvider?: FcrUIAbilityProviderImpl;
     onNodeWillActive(): void;

package/lib/modules/dialog/index.js

@@ -52,7 +52,6 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
 var _base = require("../../base");
 var _store = _interopRequireWildcard(require("./store"));
 var _view = require("./view");
@@ -100,7 +99,8 @@ var DialogUIModule = exports.DialogUIModule = /*#__PURE__*/function (_UIModule)
           widgetProvider: this.widgetProvider,
           chatProvider: this.chatProvider,
           abilityProvider: this.abilityProvider,
-          screenShareProvider: this.screenShareProvider
+          screenShareProvider: this.screenShareProvider,
+          sharedScreenShareSharedDataSource: this.sharedScreenShareSharedDataSource
         });
         this.eventProvider.addObserver({
           onEvent: this.onUiEvent.bind(this)