fcr-ui-scene 3.4.1 → 3.4.2

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

@@ -0,0 +1,148 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.VideoWindowDialog = void 0;
+var _react = require("react");
+var _mobxReact = require("mobx-react");
+var _env = require("agora-foundation/lib/utilities/env");
+var _reactDom = require("react-dom");
+var _debounce = _interopRequireDefault(require("lodash/debounce"));
+var _constant = require("../../../../utilities/constant");
+var _renderer = require("../../../../utilities/renderer");
+var _videoTrackRenderContext = require("../../../../utilities/video-track-render-context");
+var _type = require("../../../video-window/type");
+var _store = require("../../store");
+var _dialogs = require("../../dialogs");
+var _jsxRuntime = require("react/jsx-runtime");
+function changeVideoWindowConfig(browserWindow) {
+  var resizeble = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+  browserWindow.setResizable(resizeble);
+  browserWindow.setAspectRatio(resizeble ? _type.VideoWindowRadio : 0);
+  browserWindow.setMinimumSize(resizeble ? _type.DefaultVideoWindowWidth : 0, resizeble ? _type.DefaultVideoWindowSmallTypeHeight : 0);
+  browserWindow.setMaximumSize(resizeble ? _type.VideoWindowZoomMaxWidth : 0, resizeble ? _type.VideoWindowZoomMaxHeight : 0);
+}
+var VideoWindowElectronDialog = (0, _mobxReact.observer)(function (_ref) {
+  var children = _ref.children;
+  var store = (0, _react.useContext)(_store.StoreContext);
+  var _store$videoWindowBou = store.videoWindowBounds,
+    videoWindowHeight = _store$videoWindowBou.videoWindowHeight,
+    videoWindowPreviewType = _store$videoWindowBou.videoWindowPreviewType,
+    workareaX = _store$videoWindowBou.workareaX,
+    workareaY = _store$videoWindowBou.workareaY,
+    workareaWidth = _store$videoWindowBou.workareaWidth,
+    workareaHeight = _store$videoWindowBou.workareaHeight;
+  var initalBounds = {
+    x: workareaX + workareaWidth - _type.DefaultVideoWindowWidth - 220,
+    y: workareaY + 80,
+    width: _type.DefaultVideoWindowWidth,
+    height: _type.DefaultVideoWindowSmallTypeHeight
+  };
+  var videoWindowRef = (0, _react.useRef)();
+  var handleBounds = function handleBounds(newBounds) {
+    var height = newBounds.height;
+    var width = newBounds.width;
+    store.resizeVideoWindow(width < _type.DefaultVideoWindowWidth || !width ? _type.DefaultVideoWindowWidth : width, height < _type.DefaultVideoWindowSmallTypeHeight || !height ? _type.DefaultVideoWindowSmallTypeHeight : height);
+  };
+  (0, _react.useEffect)(function () {
+    var node;
+    window.runtime.openRendererWindow('video-window', function (dom, browserWindow, rendererWindow) {
+      var _head$querySelector;
+      node = dom;
+      var style = document.createElement('style');
+      style.id = 'video-window-scrollbar-style';
+      style.textContent = "\n            ::-webkit-scrollbar {\n                width: 0;\n                height: 0;\n            }\n        ";
+      var head = rendererWindow.window.document.head;
+      (_head$querySelector = head.querySelector('#video-window-scrollbar-style')) === null || _head$querySelector === void 0 || _head$querySelector.remove();
+      head.appendChild(style);
+      videoWindowRef.current = browserWindow;
+      browserWindow.setTitle('Video Window');
+      browserWindow.setResizable(false); // 修复分享窗口切换时导致的大小失真的情况，所以要在修改 bounds 之前先设置为不可修改大小
+
+      browserWindow.setBounds(initalBounds);
+      changeVideoWindowConfig(browserWindow);
+      browserWindow.setBackgroundColor('#00000000');
+      browserWindow.setVisibleOnAllWorkspaces(true, {
+        visibleOnFullScreen: true,
+        skipTransformProcessType: true
+      });
+      browserWindow.setAlwaysOnTop(true, 'screen-saver');
+      _dialogs.dialogWindows.set(_constant.FcrUIDialogKey.VIDEO_WINDOW, browserWindow);
+      (0, _renderer.handleWillClose)(browserWindow, function () {
+        (0, _reactDom.unmountComponentAtNode)(node);
+        _dialogs.dialogWindows["delete"](_constant.FcrUIDialogKey.VIDEO_WINDOW);
+        if (!browserWindow.isDestroyed()) {
+          browserWindow.removeAllListeners('will-resize');
+          changeVideoWindowConfig(browserWindow);
+          browserWindow.setResizable(false);
+          browserWindow.setBounds(initalBounds);
+        }
+      });
+      if (browserWindow) {
+        browserWindow.addListener('will-resize', (0, _debounce["default"])(function (event, newBounds) {
+          handleBounds(newBounds);
+        }, 100));
+      }
+      (0, _reactDom.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_videoTrackRenderContext.FcrVideoTrackRenderContext.Provider, {
+        value: {
+          localVideoRenderProvider: store.localVideoRenderProvider,
+          remoteVideoRenderProvider: store.remoteVideoRenderManager
+        },
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_store.StoreContext.Provider, {
+          value: store,
+          children: children
+        })
+      }), dom);
+    }, {
+      type: 'panel',
+      frame: false,
+      fullscreen: false,
+      maximizable: false,
+      x: workareaX + workareaWidth - _type.DefaultVideoWindowWidth - 220,
+      y: workareaY + 80,
+      width: _type.DefaultVideoWindowWidth,
+      height: _type.DefaultVideoWindowSmallTypeHeight,
+      minWidth: _type.DefaultVideoWindowWidth,
+      transparent: true,
+      alwaysOnTop: true,
+      hasShadow: false,
+      resizable: true,
+      skipTaskbar: true
+    });
+    return function () {
+      node && (0, _reactDom.unmountComponentAtNode)(node);
+      window.runtime.closeRendererWindow('video-window');
+    };
+  }, []);
+  (0, _react.useEffect)(function () {
+    if (!videoWindowRef.current) return;
+    var x = initalBounds.x,
+      y = initalBounds.y;
+    videoWindowRef.current.setBounds({
+      x: x,
+      y: y
+    });
+  }, [workareaX, workareaY]);
+  (0, _react.useEffect)(function () {
+    if (!videoWindowRef.current) return;
+    videoWindowRef.current.setResizable(false);
+    videoWindowRef.current.setBounds({
+      width: _type.DefaultVideoWindowWidth,
+      height: videoWindowHeight
+    });
+    changeVideoWindowConfig(videoWindowRef.current, videoWindowPreviewType === 'small');
+  }, [videoWindowHeight, videoWindowPreviewType]);
+  return null;
+});
+var VideoWindowDialog = exports.VideoWindowDialog = (0, _mobxReact.observer)(function (_ref2) {
+  var children = _ref2.children;
+  if ((0, _env.isElectron)()) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(VideoWindowElectronDialog, {
+      children: children
+    });
+  }
+  return null;
+});

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

@@ -48,7 +48,7 @@ var WhiteboardElectronDialog = exports.WhiteboardElectronDialog = (0, _mobxReact
         //   // });
         // }
 
-        _dialogs.dialogWindows.set(_constant.DialogKey.WHITEBOARD, browserWindow);
+        _dialogs.dialogWindows.set(_constant.FcrUIDialogKey.WHITEBOARD, browserWindow);
       }
       module.getComponent(dom);
       // render(<div className="fcr-whiteboard-wrapper">{children}</div>, dom);
@@ -66,7 +66,7 @@ var WhiteboardElectronDialog = exports.WhiteboardElectronDialog = (0, _mobxReact
       transparent: true
     });
     return function () {
-      _dialogs.dialogWindows["delete"](_constant.DialogKey.WHITEBOARD);
+      _dialogs.dialogWindows["delete"](_constant.FcrUIDialogKey.WHITEBOARD);
       node && (0, _reactDom.unmountComponentAtNode)(node);
       window.runtime.closeRendererWindow('whiteboard');
     };

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

@@ -1,5 +1,2 @@
-import { PropsWithChildren } from 'react';
-import { DialogKey } from '../../utilities/constant';
-export declare let dialogWindows: Map<DialogKey, Electron.BrowserWindow>;
-export declare const setDialogBounds: (browserWindow: Electron.BrowserWindow, currentDialogBounds: Partial<Electron.Rectangle>) => void;
-export declare const VideoWindowDialog: ({ children }: PropsWithChildren<{}>) => import("react/jsx-runtime").JSX.Element | null;
+import { FcrUIDialogKey } from '../../utilities/constant';
+export declare let dialogWindows: Map<FcrUIDialogKey, Electron.BrowserWindow>;

package/lib/modules/dialog/dialogs.js

@@ -1,11 +1,10 @@
 "use strict";
 
 require("core-js/modules/es.object.define-property.js");
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.setDialogBounds = exports.dialogWindows = exports.VideoWindowDialog = void 0;
+exports.dialogWindows = void 0;
 require("core-js/modules/es.array.iterator.js");
 require("core-js/modules/es.map.js");
 require("core-js/modules/es.object.to-string.js");
@@ -25,158 +24,4 @@ require("core-js/modules/esnext.map.reduce.js");
 require("core-js/modules/esnext.map.some.js");
 require("core-js/modules/esnext.map.update.js");
 require("core-js/modules/web.dom-collections.iterator.js");
-var _react = require("react");
-var _store = require("./store");
-var _mobxReact = require("mobx-react");
-var _env = require("agora-foundation/lib/utilities/env");
-var _reactDom = require("react-dom");
-var _debounce = _interopRequireDefault(require("lodash/debounce"));
-var _constant = require("../../utilities/constant");
-var _renderer = require("../../utilities/renderer");
-var _videoTrackRenderContext = require("../../utilities/video-track-render-context");
-var _type = require("./../video-window/type");
-var _jsxRuntime = require("react/jsx-runtime");
-var dialogWindows = exports.dialogWindows = new Map();
-var setDialogBounds = exports.setDialogBounds = function setDialogBounds(browserWindow, currentDialogBounds) {
-  browserWindow.setBounds(currentDialogBounds, true);
-  browserWindow.center();
-  browserWindow.setVisibleOnAllWorkspaces(false, {
-    visibleOnFullScreen: true,
-    skipTransformProcessType: true
-  });
-  browserWindow.setSkipTaskbar(false);
-};
-var VideoWindowElectronDialog = (0, _mobxReact.observer)(function (_ref) {
-  var children = _ref.children;
-  var store = (0, _react.useContext)(_store.StoreContext);
-  var _store$videoWindowBou = store.videoWindowBounds,
-    videoWindowHeight = _store$videoWindowBou.videoWindowHeight,
-    videoWindowPreviewType = _store$videoWindowBou.videoWindowPreviewType,
-    workareaX = _store$videoWindowBou.workareaX,
-    workareaY = _store$videoWindowBou.workareaY,
-    workareaWidth = _store$videoWindowBou.workareaWidth,
-    workareaHeight = _store$videoWindowBou.workareaHeight;
-  var videoWindowRef = (0, _react.useRef)();
-  var handleBounds = function handleBounds(newBounds) {
-    var height = newBounds.height;
-    var width = newBounds.width;
-    store.resizeVideoWindow(width < _type.DefaultVideoWindowWidth || !width ? _type.DefaultVideoWindowWidth : width, height < _type.DefaultVideoWindowSmallTypeHeight || !height ? _type.DefaultVideoWindowSmallTypeHeight : height);
-  };
-  (0, _react.useEffect)(function () {
-    var node;
-    window.runtime.openRendererWindow('video-window', function (dom, browserWindow) {
-      node = dom;
-      videoWindowRef.current = browserWindow;
-      browserWindow.setTitle('Video Window');
-      var initVideoWindow = function initVideoWindow() {
-        browserWindow.setResizable(true);
-        browserWindow.setAspectRatio(_type.VideoWindowRadio);
-        browserWindow.setMinimumSize(_type.DefaultVideoWindowWidth, _type.DefaultVideoWindowSmallTypeHeight);
-        browserWindow.setMaximumSize(_type.VideoWindowZoomMaxWidth, _type.VideoWindowZoomMaxHeight);
-      };
-      initVideoWindow();
-      browserWindow.setBackgroundColor('#00000000');
-      browserWindow.setVisibleOnAllWorkspaces(true, {
-        visibleOnFullScreen: true,
-        skipTransformProcessType: true
-      });
-      browserWindow.setAlwaysOnTop(true, 'screen-saver');
-      dialogWindows.set(_constant.DialogKey.VIDEO_WINDOW, browserWindow);
-      (0, _renderer.handleWillClose)(browserWindow, function () {
-        (0, _reactDom.unmountComponentAtNode)(node);
-        dialogWindows["delete"](_constant.DialogKey.VIDEO_WINDOW);
-        if (!browserWindow.isDestroyed()) {
-          browserWindow.removeAllListeners('will-resize');
-          browserWindow.removeAllListeners('show');
-          initVideoWindow();
-          browserWindow.setBounds({
-            x: workareaX + workareaWidth - _type.DefaultVideoWindowWidth - 168,
-            y: workareaY + 80,
-            width: _type.DefaultVideoWindowWidth,
-            height: _type.DefaultVideoWindowSmallTypeHeight
-          });
-        }
-      });
-      if (browserWindow) {
-        browserWindow.addListener('will-resize', (0, _debounce["default"])(function (event, newBounds) {
-          handleBounds(newBounds);
-        }, 100));
-        browserWindow.addListener('show', function () {
-          browserWindow.setBounds({
-            x: workareaX + workareaWidth - _type.DefaultVideoWindowWidth - 168,
-            y: workareaY + 80
-          });
-        });
-      }
-      (0, _reactDom.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_videoTrackRenderContext.FcrVideoTrackRenderContext.Provider, {
-        value: {
-          deviceStore: store.deviceStore,
-          remoteVideoRenderManager: store.remoteVideoRenderManager
-        },
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_store.StoreContext.Provider, {
-          value: store,
-          children: children
-        })
-      }), dom);
-    }, {
-      type: 'panel',
-      frame: false,
-      fullscreen: false,
-      maximizable: false,
-      x: workareaX + workareaWidth - _type.DefaultVideoWindowWidth - 168,
-      y: workareaY + 80,
-      width: _type.DefaultVideoWindowWidth,
-      height: _type.DefaultVideoWindowSmallTypeHeight,
-      minWidth: _type.DefaultVideoWindowWidth,
-      transparent: true,
-      alwaysOnTop: true,
-      hasShadow: false,
-      resizable: true,
-      skipTaskbar: true
-    });
-    return function () {
-      node && (0, _reactDom.unmountComponentAtNode)(node);
-      window.runtime.closeRendererWindow('video-window');
-    };
-  }, []);
-  (0, _react.useEffect)(function () {
-    if (!videoWindowRef.current) return;
-    videoWindowRef.current.setBounds({
-      x: workareaX + workareaWidth - _type.DefaultVideoWindowWidth - 168,
-      y: workareaY + 80
-    });
-  }, [workareaX, workareaY]);
-  (0, _react.useEffect)(function () {
-    if (!videoWindowRef.current) return;
-    if (videoWindowPreviewType === 'small') {
-      videoWindowRef.current.setResizable(true);
-      videoWindowRef.current.setAspectRatio(_type.VideoWindowRadio);
-      videoWindowRef.current.setMinimumSize(_type.DefaultVideoWindowWidth, _type.DefaultVideoWindowSmallTypeHeight);
-      videoWindowRef.current.setMaximumSize(_type.VideoWindowZoomMaxWidth, _type.VideoWindowZoomMaxHeight);
-    } else if (videoWindowPreviewType === 'mix') {
-      videoWindowRef.current.setResizable(false);
-      videoWindowRef.current.setAspectRatio(0);
-      videoWindowRef.current.setMinimumSize(0, 0);
-      videoWindowRef.current.setMaximumSize(0, 0);
-    } else {
-      videoWindowRef.current.setResizable(false);
-      videoWindowRef.current.setAspectRatio(0);
-      videoWindowRef.current.setMinimumSize(0, 0);
-      videoWindowRef.current.setMaximumSize(0, 0);
-    }
-    videoWindowRef.current.setBounds({
-      width: _type.DefaultVideoWindowWidth,
-      height: videoWindowHeight
-    });
-  }, [videoWindowHeight, videoWindowPreviewType]);
-  return null;
-});
-var VideoWindowDialog = exports.VideoWindowDialog = (0, _mobxReact.observer)(function (_ref2) {
-  var children = _ref2.children;
-  if ((0, _env.isElectron)()) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(VideoWindowElectronDialog, {
-      children: children
-    });
-  }
-  return null;
-});
+var dialogWindows = exports.dialogWindows = new Map();

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

@@ -1,32 +1,10 @@
-import { DialogKey } from '../../../utilities/constant';
-import DialogStore from '../store';
 export declare const DialogInstanceContext: import("react").Context<{
     browserWindow: Electron.BrowserWindow;
     newRendererWindow: Window;
+    resizable: boolean;
 }>;
 export declare const shadowOffset: number;
-export declare function useElectronDialog(props: {
-    dialogKey: DialogKey;
-    /**
-     * @param height - The height value should be based on the maximum content height of the tab
-     */
-    config: Electron.BrowserWindowConstructorOptions;
-    onClose?: (store: DialogStore) => void;
-    onOpened?: (props: {
-        browserWindow: Electron.BrowserWindow;
-        store: DialogStore;
-        setBounds: (bounds: Partial<Electron.Rectangle>, animate?: boolean) => void;
-    }) => void;
-    onUnmounted?: (store: DialogStore) => void;
-    children: React.ReactNode;
-    scroll?: boolean;
-    focus?: boolean;
-    ignoreMouseEvents?: boolean | Electron.IgnoreMouseEventsOptions;
-    alwaysOnTop?: boolean;
-    fullScreen?: boolean;
-    polyfills?: string[];
-    hasCustomShadow?: boolean;
-}): {
-    store: DialogStore;
+export declare function useElectronDialog(props: FcrUIDialogHooksProps): {
+    store: import("../store").default;
     browserWindow: Electron.BrowserWindow | undefined;
 };

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

@@ -2,20 +2,14 @@
 
 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/es.object.to-string.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.constructor.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
@@ -23,14 +17,22 @@ Object.defineProperty(exports, "__esModule", {
 exports.shadowOffset = exports.DialogInstanceContext = void 0;
 exports.useElectronDialog = useElectronDialog;
 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.object.to-string.js");
 require("core-js/modules/es.string.includes.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 _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
 var _store = require("../store");
 var _dialogs = require("../dialogs");
 var _renderer = require("../../../utilities/renderer");
 var _reactDom = require("react-dom");
+var _constant = require("../../../utilities/constant");
 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; }
@@ -47,7 +49,7 @@ function useElectronDialog(props) {
     children = props.children,
     ignoreMouseEvents = props.ignoreMouseEvents,
     _props$alwaysOnTop = props.alwaysOnTop,
-    alwaysOnTop = _props$alwaysOnTop === void 0 ? true : _props$alwaysOnTop,
+    alwaysOnTop = _props$alwaysOnTop === void 0 ? false : _props$alwaysOnTop,
     fullScreen = props.fullScreen,
     onOpened = props.onOpened,
     onUnmounted = props.onUnmounted,
@@ -60,6 +62,7 @@ function useElectronDialog(props) {
     _customConfigs$height = customConfigs.height,
     h = _customConfigs$height === void 0 ? 0 : _customConfigs$height;
   var config = _objectSpread(_objectSpread({
+    type: 'panel',
     hasShadow: false,
     frame: false,
     transparent: true,
@@ -72,51 +75,91 @@ function useElectronDialog(props) {
   (0, _react.useEffect)(function () {
     var node;
     window.runtime.openRendererWindow(dialogKey, function (dom, browserWindow, newRendererWindow) {
-      var _browserWindow$setBou2;
+      var _window$runtime, _controlbar$isVisible;
       node = dom;
       windowRef.current = browserWindow;
       _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);
+      var isFullScreen = (_window$runtime = window.runtime) === null || _window$runtime === void 0 ? void 0 : _window$runtime.browserWindow.isFullScreen();
+      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();
+        console.log({
+          thisWindowBounds: _thisWindowBounds
+        });
+        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 (isFullScreen) {
+        var _browserWindow$setBou;
+        // 当窗口的自定义设置为全屏时，让弹窗追随主窗口所在的屏幕展示
+        browserWindow === null || browserWindow === void 0 || (_browserWindow$setBou = browserWindow.setBounds) === null || _browserWindow$setBou === void 0 || _browserWindow$setBou.call(browserWindow, {
+          x: nearDisplayBounds.x,
+          y: (0, _renderer.isWindows)() && polyfills !== null && polyfills !== void 0 && polyfills.includes('fix-toast-window-flash') ? -100 : nearDisplayBounds.y,
+          width: nearDisplayBounds.width,
+          height: (0, _renderer.isWindows)() && polyfills !== null && polyfills !== void 0 && polyfills.includes('fix-toast-window-flash') ? 0 : nearDisplayBounds.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);
+      }
+
+      // 设置所有窗口为所有工作区可见
+      browserWindow.setVisibleOnAllWorkspaces(true, {
+        visibleOnFullScreen: true,
+        skipTransformProcessType: true
+      });
+
+      // @ts-ignore
+      // window._browserWindows = window._browserWindows || {};
+      // @ts-ignore
+      // window._browserWindows[dialogKey] = browserWindow;
+      // @ts-ignore
+      // window._windows = window._windows || {};
+      // @ts-ignore
+      // window._windows[dialogKey] = newRendererWindow;
+
+      // 因为窗口有可能需要单独设置位置，所以，窗口打开的回调需要放置在默认的位置设置之后
       onOpened === null || onOpened === void 0 || onOpened({
         browserWindow: browserWindow,
         store: store,
+        // 重写 setBounds 方法，使得设置 bounds 时，自动加上阴影的宽度
         setBounds: function setBounds(bounds, animate) {
           var b = _objectSpread({}, bounds);
           if (b.width && hasCustomShadow) b.width = b.width + shadowOffset;
           if (b.height && hasCustomShadow) b.height = b.height + shadowOffset;
           browserWindow.setBounds(b, animate);
-        }
+        },
+        nearDisplayBounds: nearDisplayBounds
       });
-      var mainAppWindowBounds = window.runtime.browserWindow.getBounds();
-      var thisWindowBounds = browserWindow.getBounds();
-      var nearDisplayBounds = window.runtime.screen.getDisplayNearestPoint(mainAppWindowBounds).bounds;
-      var isFullScreen = window.runtime.browserWindow.isFullScreen();
-      if (!isFullScreen && browserWindow) {
-        var _browserWindow$setBou;
-        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$setBou = browserWindow.setBounds) === null || _browserWindow$setBou === void 0 || _browserWindow$setBou.call(browserWindow, bounds);
-      } else {
-        browserWindow.setVisibleOnAllWorkspaces(true, {
-          visibleOnFullScreen: true,
-          skipTransformProcessType: true
-        });
-      }
-      fullScreen && (browserWindow === null || browserWindow === void 0 || (_browserWindow$setBou2 = browserWindow.setBounds) === null || _browserWindow$setBou2 === void 0 ? void 0 : _browserWindow$setBou2.call(browserWindow, {
-        x: nearDisplayBounds.x,
-        y: (0, _renderer.isWindows)() && polyfills !== null && polyfills !== void 0 && polyfills.includes('fix-toast-window-flash') ? -100 : nearDisplayBounds.y,
-        width: nearDisplayBounds.width,
-        height: (0, _renderer.isWindows)() && polyfills !== null && polyfills !== void 0 && polyfills.includes('fix-toast-window-flash') ? 0 : nearDisplayBounds.height
-      }));
+
+      // 同原生 electron 的 ignoreMouseEvents 一样，设置为 true 时，窗口将不再接收鼠标事件
       if (ignoreMouseEvents) {
         browserWindow.setIgnoreMouseEvents(true, typeof ignoreMouseEvents === 'boolean' ? {
           forward: true
         } : ignoreMouseEvents);
       }
-      alwaysOnTop && browserWindow.setAlwaysOnTop(true, 'screen-saver');
+      browserWindow.setAlwaysOnTop(typeof alwaysOnTop === 'boolean' ? alwaysOnTop : typeof alwaysOnTop === 'string', typeof alwaysOnTop === 'string' ? alwaysOnTop : 'pop-up-menu');
+      _store.HIGH_LEVEL_DIALOG_LAYER.includes(dialogKey) && browserWindow.setAlwaysOnTop(true, 'pop-up-menu');
       if (!scroll) {
-        browserWindow.webContents.insertCSS("\n            ::-webkit-scrollbar {\n              display: none;\n            }\n            #root {\n              padding: ".concat(hasCustomShadow ? shadowOffset / 2 : 0, "px;\n              display: ").concat(hasCustomShadow ? 'flex' : 'block', ";\n              align-items: center\n            }\n          "));
+        browserWindow.webContents.insertCSS("\n            ::-webkit-scrollbar {\n              display: none;\n            }\n            #root {\n              padding: ".concat(hasCustomShadow ? shadowOffset / 2 : 0, "px;\n              display: ").concat(hasCustomShadow ? 'flex' : 'block', ";\n              align-items: center;\n            }\n          "));
       }
       focus && browserWindow.focus();
       (0, _renderer.handleWillClose)(browserWindow, function () {
@@ -129,7 +172,8 @@ function useElectronDialog(props) {
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(DialogInstanceContext.Provider, {
           value: {
             browserWindow: browserWindow,
-            newRendererWindow: newRendererWindow
+            newRendererWindow: newRendererWindow,
+            resizable: !!customConfigs.resizable
           },
           children: typeof children === 'function' ? children(browserWindow) : children
         })
@@ -144,6 +188,18 @@ function useElectronDialog(props) {
       onUnmounted === null || onUnmounted === void 0 || onUnmounted(store);
     };
   }, []);
+
+  // 这组监听是为了处理 mac 全屏模式下，弹窗会因为主窗口全屏而变成独立窗口的问题
+  window.runtime.browserWindow.addListener('enter-full-screen', function () {
+    _dialogs.dialogWindows.forEach(function (win, k) {
+      !_store.TOP_LEVEL_DIALOG_LAYER.includes(k) && win.setAlwaysOnTop(true, 'pop-up-menu');
+    });
+  });
+  window.runtime.browserWindow.addListener('leave-full-screen', function () {
+    _dialogs.dialogWindows.forEach(function (win, k) {
+      ![].concat((0, _toConsumableArray2["default"])(_store.TOP_LEVEL_DIALOG_LAYER), (0, _toConsumableArray2["default"])(_store.HIGH_LEVEL_DIALOG_LAYER)).includes(k) && win.setAlwaysOnTop(true, 'normal');
+    });
+  });
   return {
     store: store,
     browserWindow: windowRef.current

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

@@ -1,14 +1,40 @@
 import React from 'react';
 import { UIModule } from '../../base';
-import { StoreConfig } from '../../type';
+import { FcrUIDeviceProvider } from '../../providers/device-provider';
+import { FcrStreamControl, FcrUserControl } from 'fcr-core';
+import { FcrChatRoomControl } from 'fcr-core/lib/room-control/chatroom-control/type';
+import { FcrUIEventProvider } from '../../providers/event-provider';
+import { FcrUICurrentRoomControlProvider, FcrUIMainRoomControlProvider, FcrUIWaitingRoomControlProvider } from '../../providers/room-provider';
+import { FcrUISharedLayoutDataSource } from '../../shared-data-source/layout-data';
+import { FcrUILocalVideoRenderProvider, FcrUIRemoteVideoRenderProvider } from '../../providers/renderer-provider';
+import { FcrUIPrivilegeProvider } from '../../providers/privilege-provider';
+import { FcrUIDialogProvider } from '../../providers/dialog-provider';
+import { FcrUIPhoneAudioConnectorProvider } from '../../providers/phone-audio-provider';
+import { FcrUIAction } from '../../utilities/constant';
+import { CurrentShareScreenTypes } from '../share-screen/types';
 export declare class DialogUIModule extends UIModule {
     private _dialogs;
-    private _store;
-    constructor(args: StoreConfig);
-    protected onUnload(): void;
+    private _store?;
+    deviceProvider?: FcrUIDeviceProvider;
+    streamControl?: FcrStreamControl;
+    eventProvider?: FcrUIEventProvider;
+    userControl?: FcrUserControl;
+    remoteVideoRenderProvider?: FcrUIRemoteVideoRenderProvider;
+    localVideoRenderProvider?: FcrUILocalVideoRenderProvider;
+    privilegeProvider?: FcrUIPrivilegeProvider;
+    chatRoomControl?: FcrChatRoomControl;
+    currentRoomControlProvider?: FcrUICurrentRoomControlProvider;
+    sharedLayoutDataSource?: FcrUISharedLayoutDataSource;
+    dialogProvider?: FcrUIDialogProvider;
+    phoneAudioConnectorProvider?: FcrUIPhoneAudioConnectorProvider;
+    mainRoomControlProvider?: FcrUIMainRoomControlProvider;
+    waitingRoomControlProvider?: FcrUIWaitingRoomControlProvider;
+    onNodeWillActive(): void;
+    onNodeWillInactive(): void;
     getComponent(): import("react/jsx-runtime").JSX.Element;
     addDialogs(dialogs: {
         key: string;
         component: (params?: any) => React.JSX.Element;
     }[]): void;
+    onUiEvent(event: FcrUIAction, payload: CurrentShareScreenTypes): void;
 }