fcr-ui-scene 3.4.5 → 3.5.0

package/lib/modules/control-bar/view.js

@@ -9,10 +9,6 @@ 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");
@@ -21,9 +17,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ControlBarView = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 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.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.find.js");
 require("core-js/modules/web.timers.js");
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _divider = _interopRequireDefault(require("agora-ui-foundation/lib/components/divider"));
 var _popover = require("agora-ui-foundation/lib/components/popover");
@@ -50,9 +51,10 @@ var _react2 = require("@use-gesture/react");
 var _useElectron = require("../dialog/hooks/useElectron");
 var _tools = require("../../utilities/tools");
 var _enums = require("./enums");
-var _type2 = require("fcr-core/lib/room-control/type");
 var _constant = require("../../utilities/constant");
+var _type2 = require("../../type");
 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 ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function () {
@@ -81,7 +83,11 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
     privilegeProvider = _useContext2.privilegeProvider,
     newMessageCount = _useContext2.newMessageCount,
     currentShareType = _useContext2.currentShareType,
-    currentShareBounds = _useContext2.currentShareBounds;
+    currentShareBounds = _useContext2.currentShareBounds,
+    recordShareBounds = _useContext2.recordShareBounds,
+    showLockedRoomToast = _useContext2.showLockedRoomToast,
+    checkedStateMap = _useContext2.checkedStateMap,
+    setCheckedStateMap = _useContext2.setCheckedStateMap;
   // 控制栏本身的高度
   var NAV_HEIGHT = 84;
   // 鼠标移开后自动隐藏的时间
@@ -248,17 +254,50 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
     setMoreVisible(false);
     setShowSecurityPopover(false);
   }
+  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 _ref2 = recordShareBounds.get(currentShareBounds),
+        ox = _ref2.x,
+        oy = _ref2.y,
+        bounds = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
+      var _ref3 = ((_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 = _ref3.x,
+        y = _ref3.y;
+      screenBounds = _objectSpread({
+        x: x,
+        y: y
+      }, bounds);
+      browserWindow.setBounds(screenBounds);
+    } else {
+      recordShareBounds.clear();
+      screenBounds = (0, _tools.getCurrentSharingWorkArea)({
+        currentShareId: currentShareId,
+        currentShareType: currentShareType,
+        allApplicationWindows: allApplicationWindows,
+        currentShareBounds: currentShareBounds
+      });
+      recordShareBounds.set(currentShareBounds, screenBounds);
+    }
+    return screenBounds;
+  }
   function checkMouseOver() {
     if (windowFocusTimerRef.current) clearInterval(windowFocusTimerRef.current);
+    var screenBounds = getScreenBounds();
     (0, _tools.handleCheckMouseOver)({
       elem: rndRef.current,
       browserWindow: browserWindow,
-      screenBounds: (0, _tools.getCurrentSharingWorkArea)({
-        currentShareId: currentShareId,
-        currentShareType: currentShareType,
-        allApplicationWindows: allApplicationWindows,
-        currentShareBounds: currentShareBounds
-      }),
+      screenBounds: screenBounds,
       newRendererWindow: newRendererWindow,
       callback: function callback(timerId) {
         windowFocusTimerRef.current = timerId;
@@ -267,10 +306,10 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
     });
   }
   (0, _react.useEffect)(function () {
-    if ((0, _platform.isWindows)()) {
-      checkMouseOver();
-      window.runtime.screen.addListener('display-metrics-changed', checkMouseOver);
-    }
+    (0, _platform.isWindows)() ? checkMouseOver() : getScreenBounds();
+    window.runtime.screen.addListener(
+    // @ts-ignore
+    'display-metrics-changed', (0, _platform.isWindows)() ? checkMouseOver : getScreenBounds);
     browserWindow.setAlwaysOnTop(false);
     handleMouseLeave();
     document.body.classList.add(_toast.TOAST_ROOT_CLASS_NAME);
@@ -280,19 +319,15 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
       browserWindow.setAlwaysOnTop(true, 'screen-saver');
     }, 500);
     return function () {
-      window.runtime.screen.removeListener('display-metrics-changed', checkMouseOver);
+      window.runtime.screen.removeListener(
+      // @ts-ignore
+      'display-metrics-changed', (0, _platform.isWindows)() ? checkMouseOver : getScreenBounds);
       window.removeEventListener('blur', handleBlur);
-      browserWindow.setIgnoreMouseEvents(true);
       clearTimeout(hideTimeout.current);
       clearTimeout(alwayOnTopTimerRef.current);
       clearInterval(windowFocusTimerRef.current);
     };
   }, [currentShareId]);
-  (0, _react.useEffect)(function () {
-    return function () {
-      return browserWindow.close();
-    };
-  }, []);
   return currentShareId ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, bind()), {}, {
     style: {
       width: 'fit-content',
@@ -330,8 +365,11 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
               borderRadius: 'var(--fcr_cornerradius_l)'
             },
             content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_securityMenu["default"], {
+              showLockedRoomToast: showLockedRoomToast,
               privilege: privilegeProvider,
-              setEnableWaitingRoom: setEnableWaitingRoom
+              setEnableWaitingRoom: setEnableWaitingRoom,
+              checkedStateMap: checkedStateMap,
+              setCheckedStateMap: setCheckedStateMap
             }),
             trigger: "click",
             visible: showSecurityPopover,
@@ -354,7 +392,7 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_shareScreenButton.ShareScreenButton, {
             onCreateNewShareButtonClick: createNewShare
           }), hasStopLiveStreamingPermission && liveStreamingState === _type.FcrLiveStreamingState.STARTED && /*#__PURE__*/(0, _jsxRuntime.jsx)(_stopLiveStreaming.StopLiveStreamingButton, {}), hasStartCloudRecordingPermission && cloudRecordingState !== _type.FcrRecordingState.Stopped && /*#__PURE__*/(0, _jsxRuntime.jsx)(_cloudRecordingButtons.CloudRecordingButtons, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_badge.FcrBadge, {
-            count: newMessageCount[_type2.FcrRoomType.Mainroom] || 0,
+            count: newMessageCount[_type2.FcrUIRoomType.MAIN_ROOM] || 0,
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_more.More, {
               visible: moreVisible,
               onButtonClick: function onButtonClick() {

package/lib/modules/device-pretest/audio-preview/microphone-detection.js

@@ -49,7 +49,7 @@ var MicrophoneDetection = exports.MicrophoneDetection = (0, _mobxReact.observer)
       trigger: "hover",
       placement: "top",
       mouseEnterDelay: 0.2,
-      content: t(disabled ? 'fmt_settings_popup_disable_while_speaker_detected' : isDetecting ? 'fmt_setting_tips_speaker_unwork' : 'fmt_setting_tips_mic'),
+      content: t(disabled ? 'fmt_settings_popup_disable_while_speaker_detected' : isDetecting ? 'fmt_setting_tips_mic' : 'fmt_premeeting_setting_label_speak_into_your_microphone'),
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
         onClick: function onClick() {
           setIsDetecting(!isDetecting);

package/lib/modules/device-pretest/context.d.ts

@@ -0,0 +1,2 @@
+import { FcrPretestStore } from './store';
+export declare const PretestStoreContext: import("react").Context<FcrPretestStore>;

package/lib/modules/device-pretest/context.js

@@ -0,0 +1,9 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PretestStoreContext = void 0;
+var _react = require("react");
+var PretestStoreContext = exports.PretestStoreContext = /*#__PURE__*/(0, _react.createContext)(null);

package/lib/modules/device-pretest/settings/beauty.js

@@ -7,7 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Beauty = void 0;
 require("core-js/modules/es.array.map.js");
-require("core-js/modules/esnext.async-iterator.map.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.map.js");
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _icon = require("agora-ui-foundation/lib/components/icon");

package/lib/modules/device-pretest/settings/virtual-background-setting.js

@@ -8,7 +8,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.VirtualBackgroundSetting = void 0;
 require("core-js/modules/es.array.map.js");
 require("core-js/modules/es.function.name.js");
-require("core-js/modules/esnext.async-iterator.map.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.map.js");
 var _useNamespace = require("../../setting/common/useNamespace");
 var _virtualBackdoundResources = require("../assets/virtual-backdound-resources");

package/lib/modules/device-pretest/store.js

@@ -49,8 +49,6 @@ require("core-js/modules/es.array.push.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/es.string.iterator.js");
 require("core-js/modules/es.weak-map.js");
-require("core-js/modules/esnext.async-iterator.for-each.js");
-require("core-js/modules/esnext.async-iterator.map.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.for-each.js");
 require("core-js/modules/esnext.iterator.map.js");

package/lib/modules/dialog/components/confirm/electron.d.ts

@@ -0,0 +1,10 @@
+import { PropsWithChildren } from 'react';
+import { ConfirmContentProps } from 'agora-ui-foundation/lib/components/confirm-content';
+declare const ConfirmElectronDialog: ({ children, params, }: PropsWithChildren<{
+    params: Partial<ConfirmContentProps> & {
+        height?: number;
+        x?: number;
+        y?: number;
+    };
+}>) => import("react/jsx-runtime").JSX.Element;
+export default ConfirmElectronDialog;

package/lib/modules/dialog/components/confirm/electron.js

@@ -0,0 +1,54 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _mobxReact = require("mobx-react");
+var _react = require("react");
+var _store = require("../../store");
+var _constant = require("../../../../utilities/constant");
+var _useElectron = require("../../hooks/useElectron");
+var _jsxRuntime = require("react/jsx-runtime");
+var ConfirmElectronDialog = (0, _mobxReact.observer)(function (_ref) {
+  var children = _ref.children,
+    params = _ref.params;
+  var store = (0, _react.useContext)(_store.StoreContext);
+  var config = {
+    frame: false,
+    fullscreen: false,
+    maximizable: false,
+    width: (params === null || params === void 0 ? void 0 : params.width) || 320,
+    height: (params === null || params === void 0 ? void 0 : params.height) || 168 + (params.closable || params.closable === undefined ? 16 : 0),
+    minWidth: 255,
+    minHeight: 160,
+    maxWidth: 620,
+    maxHeight: 700,
+    transparent: true,
+    resizable: false
+  };
+  var element = (0, _useElectron.useElectronDialog)({
+    config: config,
+    dialogKey: _constant.DialogKey.CONFIRM,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "fcr-confirm-dialog-wrapper",
+      children: children
+    }),
+    onOpened: function onOpened(_ref2) {
+      var browserWindow = _ref2.browserWindow;
+      browserWindow.setBounds({
+        width: (params === null || params === void 0 ? void 0 : params.width) || 320,
+        height: (params === null || params === void 0 ? void 0 : params.height) || 168 + (params.closable || params.closable === undefined ? 16 : 0)
+      });
+    }
+  });
+  (0, _react.useEffect)(function () {
+    var _element$browserWindo;
+    element === null || element === void 0 || (_element$browserWindo = element.browserWindow) === null || _element$browserWindo === void 0 || _element$browserWindo.setBounds({
+      height: store.currentDialogBounds.height
+    });
+  }, [store.currentDialogBounds.height]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});
+});
+var _default = exports["default"] = ConfirmElectronDialog;

package/lib/modules/dialog/components/connection-gateway/index.css

@@ -0,0 +1,25 @@
+.connection-gateway-dialog {
+  background: var(--fcr_mobile_ui_scene_color_popup_fill2);
+  border: 1px solid var(--fcr_ui_scene_line1);
+  box-shadow: var(--fcr_web_light_dropup);
+  border-radius: var(--fcr_cornerradius_xl);
+  height: 100%;
+  max-height: 560px;
+  overflow: hidden;
+}
+.connection-gateway-dialog.electron {
+  box-shadow: none;
+}
+.connection-gateway-dialog_close {
+  width: 14px;
+  height: 14px;
+  border-radius: 50%;
+  background: var(--fcr_ui_scene_ramp_red6);
+  position: absolute;
+  left: 12px;
+  top: 16px;
+  display: block;
+  cursor: pointer;
+  z-index: 600;
+  -webkit-app-region: no-drag;
+}

package/lib/modules/dialog/components/control-bar/index.js

@@ -50,6 +50,7 @@ var ControlBarDialog = exports.ControlBarDialog = (0, _mobxReact.observer)(funct
       config: config,
       children: children,
       hasCustomShadow: false,
+      disableShortcutClose: true,
       onOpened: function onOpened(_ref) {
         var browserWindow = _ref.browserWindow;
         (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {

package/lib/modules/dialog/components/device-setting/index.js

@@ -16,10 +16,11 @@ var _jsxRuntime = require("react/jsx-runtime");
 var DeviceSettingDialog = function DeviceSettingDialog(_ref) {
   var children = _ref.children;
   var t = (0, _i18n.useI18n)();
+  var height = (0, _env.isElectron)() ? 556 : 600;
   var container = /*#__PURE__*/(0, _jsxRuntime.jsx)(_dialogContainer["default"], {
     title: t('fmt_modules_labels_devicesettings'),
     width: 580,
-    height: 556,
+    height: height,
     dialogKey: _constant.FcrUIDialogKey.DEVICE_SETTINGS,
     children: children
   });

package/lib/modules/dialog/components/dialog-container/component/body.d.ts

@@ -4,4 +4,5 @@ export declare function DialogContainerBody(props: PropsWithChildren<{
     onClick: () => void;
     title?: string;
     actions?: React.ReactNode;
+    autoHeight?: boolean;
 }>): import("react/jsx-runtime").JSX.Element;

package/lib/modules/dialog/components/dialog-container/component/body.js

@@ -10,8 +10,6 @@ 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");
@@ -35,7 +33,8 @@ function DialogContainerBody(props) {
   var actions = props.actions,
     title = props.title,
     children = props.children,
-    onClick = props.onClick;
+    onClick = props.onClick,
+    autoHeight = props.autoHeight;
   var _useContext = (0, _react.useContext)(_.DialogContainerStore),
     bind = _useContext.bind;
   var _ref = (0, _env.isElectron)() ? (0, _react.useContext)(_useElectron.DialogInstanceContext) : {
@@ -63,7 +62,7 @@ function DialogContainerBody(props) {
     })), /*#__PURE__*/(0, _jsxRuntime.jsx)("section", {
       className: "fcr-dialog-container-content",
       style: title || actions ? {
-        height: resizable ? 'calc(100% - 46px)' /* 当窗口需要拉伸时，会传值为 false 的 hasCustomShadow 过来，高度不需要自适应，所以内容区高度为 100vh 减去 title 高度 46px */ : !(0, _env.isElectron)() ? 'calc(100% - 46px)' /* 浏览器不需要减去阴影，高度需要 100% 减去 46px title */ : 'calc(100vh - 76px)' /* 76px 包含 46px 的 title 高度，和 30px 的阴影 */
+        height: resizable ? 'calc(100% - 46px)' /* 当窗口需要拉伸时，会传值为 false 的 hasCustomShadow 过来，高度不需要自适应，所以内容区高度为 100vh 减去 title 高度 46px */ : (0, _env.isElectron)() ? autoHeight ? 'auto' : 'calc(100vh - 76px)' /* 76px 包含 46px 的 title 高度，和 30px 的阴影 */ : 'calc(100% - 46px)' /* 浏览器不需要减去阴影，高度需要 100% 减去 46px title */
       } : {},
       children: children
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {

package/lib/modules/dialog/components/dialog-container/index.d.ts

@@ -12,5 +12,7 @@ declare const DialogContainer: (props: PropsWithChildren<{
     onClose?: () => void;
     closeInterception?: () => boolean;
     actions?: React.ReactNode;
+    dialogId?: string;
+    autoHeight?: boolean;
 }>) => import("react/jsx-runtime").JSX.Element;
 export default DialogContainer;

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

@@ -33,12 +33,19 @@ var DialogContainer = (0, _mobxReact.observer)(function (props) {
     children = props.children,
     dialogKey = props.dialogKey,
     actions = props.actions,
-    closeInterception = props.closeInterception;
+    closeInterception = props.closeInterception,
+    dialogId = props.dialogId,
+    autoHeight = props.autoHeight;
   var _useContext = (0, _react.useContext)(_store.StoreContext),
-    closeDialogByKey = _useContext.closeDialogByKey;
+    closeDialogByKey = _useContext.closeDialogByKey,
+    closeDilaogByDialogId = _useContext.closeDilaogByDialogId;
   var handleClose = function handleClose() {
     if (!(closeInterception !== null && closeInterception !== void 0 && closeInterception())) {
-      closeDialogByKey(dialogKey);
+      if (dialogId) {
+        closeDilaogByDialogId(dialogId);
+      } else {
+        closeDialogByKey(dialogKey);
+      }
       onClose === null || onClose === void 0 || onClose();
     }
   };
@@ -46,6 +53,7 @@ var DialogContainer = (0, _mobxReact.observer)(function (props) {
     title: title,
     onClick: handleClose,
     actions: actions,
+    autoHeight: autoHeight,
     children: children
   });
   if ((0, _env.isElectron)()) return container;
@@ -57,15 +65,19 @@ var DialogContainer = (0, _mobxReact.observer)(function (props) {
       height: props.height ? props.height : ((_rndRef$current = rndRef.current) === null || _rndRef$current === void 0 ? void 0 : _rndRef$current.getBoundingClientRect().height) || 160
     };
   }, [props.height]);
+  var windowWidth = window.innerWidth;
+  var height = window.innerHeight;
+  var x = windowWidth / 2 - size.width / 2;
+  var y = height / 2 - size.height / 2;
   var windowBounds = {
-    x: 0,
-    y: 0,
+    x: x,
+    y: y,
     width: window.innerWidth,
     height: window.innerHeight
   };
   var _useState = (0, _react.useState)({
-      x: 0,
-      y: 0
+      x: x,
+      y: y
     }),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     bounds = _useState2[0],
@@ -84,12 +96,6 @@ var DialogContainer = (0, _mobxReact.observer)(function (props) {
     };
     setBounds(coord);
   });
-  (0, _react.useEffect)(function () {
-    setBounds({
-      x: windowBounds.width / 2 - size.width / 2,
-      y: windowBounds.height / 2 - size.height / 2
-    });
-  }, [rndRef.current]);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     style: {
       width: size.width,

package/lib/modules/dialog/components/live-streaming/index.js

@@ -20,6 +20,7 @@ var LiveStreamingDialog = exports.LiveStreamingDialog = function LiveStreamingDi
     dialogKey: _constant.FcrUIDialogKey.LIVE_STREAMING,
     width: 440,
     height: 434,
+    autoHeight: true,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "fcr-livestreaming-dialog-content",
       children: children
@@ -41,14 +42,15 @@ var LiveStreamingElectronDialog = function LiveStreamingElectronDialog(_ref2) {
     fullscreen: false,
     maximizable: false,
     width: 440,
-    height: 434,
+    height: 500,
     title: transI18n('fmt_actionbar__livestreaming_labels_live'),
     resizable: false
   };
   (0, _useElectron.useElectronDialog)({
     dialogKey: _constant.FcrUIDialogKey.LIVE_STREAMING,
     config: config,
-    onClose: function onClose(store) {
+    onClose: function onClose(_ref3) {
+      var store = _ref3.store;
       store.closeDialogByKey(_constant.FcrUIDialogKey.LIVE_STREAMING);
     },
     children: children

package/lib/modules/dialog/components/operation-waiting-room/electron.d.ts

@@ -0,0 +1,5 @@
+import { PropsWithChildren } from 'react';
+declare const OperationWaitingRoomDialog: ({ children, params, }: PropsWithChildren<{
+    params: any;
+}>) => null;
+export default OperationWaitingRoomDialog;

package/lib/modules/dialog/components/operation-waiting-room/electron.js

@@ -0,0 +1,42 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _mobxReact = require("mobx-react");
+var _useElectron = require("../../hooks/useElectron");
+var _constant = require("../../../../utilities/constant");
+var OperationWaitingRoomDialog = (0, _mobxReact.observer)(function (_ref) {
+  var children = _ref.children,
+    params = _ref.params;
+  var config = {
+    frame: false,
+    fullscreen: false,
+    maximizable: false,
+    width: (params === null || params === void 0 ? void 0 : params.width) || 320,
+    height: (params === null || params === void 0 ? void 0 : params.height) || 168 + (params.closable || params.closable === undefined ? 16 : 0),
+    minWidth: 255,
+    minHeight: 160,
+    maxWidth: 620,
+    maxHeight: 700,
+    x: (params === null || params === void 0 ? void 0 : params.x) || 0,
+    y: (params === null || params === void 0 ? void 0 : params.y) || 0,
+    transparent: true
+  };
+  (0, _useElectron.useElectronDialog)({
+    dialogKey: _constant.DialogKey.WAITING_ROOM_OPERATION,
+    config: config,
+    children: children,
+    onOpened: function onOpened(_ref2) {
+      var browserWindow = _ref2.browserWindow;
+      browserWindow.setBounds({
+        width: 445,
+        height: 237
+      });
+    }
+  });
+  return null;
+});
+var _default = exports["default"] = OperationWaitingRoomDialog;

package/lib/modules/dialog/components/operation-waiting-room/index.css

@@ -0,0 +1,44 @@
+.close-waiting-room-dialog {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  background-color: white;
+  width: 100%;
+  height: 100%;
+}
+
+.close-waiting-room-dialog .fcr-dialog-title {
+  font-weight: 600;
+  font-size: 16px;
+  margin-bottom: 10px;
+  color: var(--fcr_ui_scene_icontext1);
+}
+
+.close-waiting-room-dialog .fcr-dialog-content {
+  font-weight: 400;
+  font-size: 13px;
+  margin-bottom: 10px;
+  color: var(--fcr_ui_scene_icontext1);
+  width: 90%;
+}
+
+.close-waiting-room-dialog button {
+  width: 100%;
+  margin-bottom: 10px;
+}
+
+.close-waiting-room-dialog .fcr-button-white {
+  background-color: var(--fcr_ui_scene_btn2);
+  color: var(--fcr_ui_scene_icontext2);
+}
+
+.close-waiting-room-dialog .fcr-button-white:hover {
+  background-color: var(--fcr_ui_scene_btn2) !important;
+  color: var(--fcr_ui_scene_icontext2) !important;
+}
+
+.fcr-dialog-buttons {
+  width: 90%;
+}

package/lib/modules/dialog/components/operation-waiting-room/index.d.ts

@@ -0,0 +1,5 @@
+import { FC, PropsWithChildren } from 'react';
+import './index.css';
+export declare const OperationWaitingRoomDialog: FC<PropsWithChildren<{
+    params: any;
+}>>;