fcr-ui-scene 3.4.1 → 3.4.3

package/lib/modules/{components → dialog/components}/dialog-container/index.js

@@ -1,49 +1,46 @@
 "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.array.iterator.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");
+require("core-js/modules/es.string.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/esnext.weak-map.delete-all.js");
+require("core-js/modules/esnext.weak-map.emplace.js");
+require("core-js/modules/web.dom-collections.iterator.js");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+exports["default"] = exports.DialogContainerStore = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = require("react");
+var _react = _interopRequireWildcard(require("react"));
 var _mobxReact = require("mobx-react");
 var _react2 = require("@use-gesture/react");
 var _env = require("agora-foundation/lib/utilities/env");
-var _store = require("../../dialog/store");
+var _store = require("../../store");
 var _body = require("./component/body");
 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; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+var DialogContainerStore = exports.DialogContainerStore = /*#__PURE__*/(0, _react.createContext)({});
 var DialogContainer = (0, _mobxReact.observer)(function (props) {
   var width = props.width,
     title = props.title,
     onClose = props.onClose,
     children = props.children,
     dialogKey = props.dialogKey,
-    actions = props.actions;
+    actions = props.actions,
+    closeInterception = props.closeInterception;
   var _useContext = (0, _react.useContext)(_store.StoreContext),
     closeDialogByKey = _useContext.closeDialogByKey;
   var handleClose = function handleClose() {
-    closeDialogByKey(dialogKey);
-    onClose === null || onClose === void 0 || onClose();
+    if (!(closeInterception !== null && closeInterception !== void 0 && closeInterception())) {
+      closeDialogByKey(dialogKey);
+      onClose === null || onClose === void 0 || onClose();
+    }
   };
   var container = /*#__PURE__*/(0, _jsxRuntime.jsx)(_body.DialogContainerBody, {
     title: title,
@@ -93,7 +90,7 @@ var DialogContainer = (0, _mobxReact.observer)(function (props) {
       y: windowBounds.height / 2 - size.height / 2
     });
   }, [rndRef.current]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, bind()), {}, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     style: {
       width: size.width,
       height: size.height,
@@ -104,7 +101,12 @@ var DialogContainer = (0, _mobxReact.observer)(function (props) {
       display: 'flex',
       flexDirection: 'column'
     },
-    children: container
-  }));
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(DialogContainerStore.Provider, {
+      value: {
+        bind: bind
+      },
+      children: container
+    })
+  });
 });
 var _default = exports["default"] = DialogContainer;

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

@@ -0,0 +1,37 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InterpreterElectronDialog = void 0;
+var _constant = require("../../../../utilities/constant");
+var _useElectron = require("../../hooks/useElectron");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var InterpreterElectronDialog = exports.InterpreterElectronDialog = function InterpreterElectronDialog(_ref) {
+  var children = _ref.children;
+  var transI18n = (0, _i18n.useI18n)();
+  var config = {
+    fullscreen: false,
+    maximizable: false,
+    trafficLightPosition: {
+      x: 10,
+      y: 60
+    },
+    width: 684,
+    height: 438,
+    minWidth: 620,
+    minHeight: 300,
+    maxWidth: 1020,
+    maxHeight: 900,
+    title: transI18n('fmt_ai_transcriptions_setting_label_translator'),
+    resizable: true
+  };
+  (0, _useElectron.useElectronDialog)({
+    config: config,
+    dialogKey: _constant.FcrUIDialogKey.INTERPRETER,
+    children: children,
+    hasCustomShadow: false
+  });
+  return null;
+};

package/lib/modules/dialog/components/{Interpreter → interpreter}/index.js

@@ -10,7 +10,7 @@ var _env = require("agora-foundation/lib/utilities/env");
 var _electron = require("./electron");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 require("./index.css");
-var _dialogContainer = _interopRequireDefault(require("../../../components/dialog-container"));
+var _dialogContainer = _interopRequireDefault(require("../dialog-container"));
 var _constant = require("../../../../utilities/constant");
 var _jsxRuntime = require("react/jsx-runtime");
 var InterpreterDialog = function InterpreterDialog(_ref) {
@@ -20,7 +20,7 @@ var InterpreterDialog = function InterpreterDialog(_ref) {
     title: t('fmt_interpretation_setting_controller_option_simultaneous_interpretation'),
     width: 684,
     height: 438,
-    dialogKey: _constant.DialogKey.INTERPRETER,
+    dialogKey: _constant.FcrUIDialogKey.INTERPRETER,
     children: children
   });
   if ((0, _env.isElectron)()) {

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

@@ -10,10 +10,13 @@ var _env = require("agora-foundation/lib/utilities/env");
 var _constant = require("../../../../utilities/constant");
 var _useElectron = require("../../hooks/useElectron");
 require("../../index.css");
-var _dialogContainer = _interopRequireDefault(require("../../../components/dialog-container"));
+var _dialogContainer = _interopRequireDefault(require("../dialog-container"));
+var _dialogs = require("../../dialogs");
+var _i18n = require("agora-ui-foundation/lib/i18n");
 var _jsxRuntime = require("react/jsx-runtime");
 var InviteElectronDialog = function InviteElectronDialog(_ref) {
   var children = _ref.children;
+  var transI18n = (0, _i18n.useI18n)();
   var config = {
     maximizable: false,
     minimizable: false,
@@ -23,19 +26,41 @@ var InviteElectronDialog = function InviteElectronDialog(_ref) {
     trafficLightPosition: {
       x: 0,
       y: 0
-    }
+    },
+    title: transI18n('fmt_participants_button_invite'),
+    resizable: false
   };
   (0, _useElectron.useElectronDialog)({
-    dialogKey: _constant.DialogKey.INVITE,
+    dialogKey: _constant.FcrUIDialogKey.INVITE,
     config: config,
-    children: children
+    children: children,
+    onOpened: function onOpened(_ref2) {
+      var _dialogWindows$get;
+      var browserWindow = _ref2.browserWindow,
+        nearDisplayBounds = _ref2.nearDisplayBounds;
+      var _browserWindow$getBou = browserWindow.getBounds(),
+        y = _browserWindow$getBou.y;
+      var _ref3 = ((_dialogWindows$get = _dialogs.dialogWindows.get(_constant.FcrUIDialogKey.PARTICIPANT)) === null || _dialogWindows$get === void 0 ? void 0 : _dialogWindows$get.getBounds()) || {
+          width: 0,
+          x: 0
+        },
+        part_w = _ref3.width,
+        part_x = _ref3.x;
+      var offsetInLeft = part_x - config.width - _useElectron.shadowOffset;
+      var offsetInRight = part_x + part_w;
+      var x = nearDisplayBounds.width / 2 < part_x ? offsetInLeft : offsetInRight;
+      part_w > 0 && browserWindow.setBounds({
+        x: x,
+        y: y
+      });
+    }
   });
   return null;
 };
-var InviteDialog = exports.InviteDialog = function InviteDialog(_ref2) {
-  var children = _ref2.children;
+var InviteDialog = exports.InviteDialog = function InviteDialog(_ref4) {
+  var children = _ref4.children;
   var container = /*#__PURE__*/(0, _jsxRuntime.jsx)(_dialogContainer["default"], {
-    dialogKey: _constant.DialogKey.INVITE,
+    dialogKey: _constant.FcrUIDialogKey.INVITE,
     width: 400,
     height: 400,
     children: children

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

@@ -9,14 +9,15 @@ exports.LiveStreamingDialog = void 0;
 var _env = require("agora-foundation/lib/utilities/env");
 var _constant = require("../../../../utilities/constant");
 var _useElectron = require("../../hooks/useElectron");
-var _dialogContainer = _interopRequireDefault(require("../../../components/dialog-container"));
+var _dialogContainer = _interopRequireDefault(require("../dialog-container"));
+var _i18n = require("agora-ui-foundation/lib/i18n");
 var _jsxRuntime = require("react/jsx-runtime");
 var LiveStreamingDialog = exports.LiveStreamingDialog = function LiveStreamingDialog(_ref) {
   var children = _ref.children,
     title = _ref.title;
   var container = /*#__PURE__*/(0, _jsxRuntime.jsx)(_dialogContainer["default"], {
     title: title,
-    dialogKey: _constant.DialogKey.LIVE_STREAMING,
+    dialogKey: _constant.FcrUIDialogKey.LIVE_STREAMING,
     width: 440,
     height: 434,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -35,17 +36,20 @@ var LiveStreamingDialog = exports.LiveStreamingDialog = function LiveStreamingDi
 var LiveStreamingElectronDialog = function LiveStreamingElectronDialog(_ref2) {
   var children = _ref2.children,
     title = _ref2.title;
+  var transI18n = (0, _i18n.useI18n)();
   var config = {
     fullscreen: false,
     maximizable: false,
     width: 440,
-    height: 434
+    height: 434,
+    title: transI18n('fmt_actionbar__livestreaming_labels_live'),
+    resizable: false
   };
   (0, _useElectron.useElectronDialog)({
-    dialogKey: _constant.DialogKey.LIVE_STREAMING,
+    dialogKey: _constant.FcrUIDialogKey.LIVE_STREAMING,
     config: config,
     onClose: function onClose(store) {
-      store.closeDialogByKey(_constant.DialogKey.LIVE_STREAMING);
+      store.closeDialogByKey(_constant.FcrUIDialogKey.LIVE_STREAMING);
     },
     children: children
   });

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

@@ -7,23 +7,29 @@ Object.defineProperty(exports, "__esModule", {
 exports.ParticipantElectronDialog = void 0;
 var _constant = require("../../../../utilities/constant");
 var _useElectron = require("../../hooks/useElectron");
+var _i18n = require("agora-ui-foundation/lib/i18n");
 var ParticipantElectronDialog = exports.ParticipantElectronDialog = function ParticipantElectronDialog(_ref) {
   var children = _ref.children;
+  var transI18n = (0, _i18n.useI18n)();
   var config = {
     fullscreen: false,
     maximizable: false,
     width: 320,
     height: 560,
     minWidth: 320,
-    minHeight: 560,
+    minHeight: 400,
     maxWidth: 620,
-    maxHeight: 700,
-    center: true
+    maxHeight: 900,
+    center: true,
+    title: transI18n('fmt_meeting_creatpage_label_join_attendee'),
+    resizable: true,
+    hasShadow: true
   };
   (0, _useElectron.useElectronDialog)({
     config: config,
-    dialogKey: _constant.DialogKey.PARTICIPANT,
-    children: children
+    dialogKey: _constant.FcrUIDialogKey.PARTICIPANT,
+    children: children,
+    hasCustomShadow: false
   });
   return null;
 };

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

@@ -14,7 +14,7 @@ var _react = require("react");
 var _store = require("../../store");
 var _electron = require("./electron");
 var _constant = require("../../../../utilities/constant");
-var _dialogContainer = _interopRequireDefault(require("../../../components/dialog-container"));
+var _dialogContainer = _interopRequireDefault(require("../dialog-container"));
 var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
 var _iconButton = require("agora-ui-foundation/lib/components/icon-button");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
@@ -31,7 +31,7 @@ var ParticipantDialogContent = exports.ParticipantDialogContent = function Parti
       type: _windowHeader.WindowType.WINDOW,
       onTypeChange: store.moveParticipantFromDialogToAside,
       onClose: function onClose() {
-        return store.closeDialogByKey(_constant.DialogKey.PARTICIPANT);
+        return store.closeDialogByKey(_constant.FcrUIDialogKey.PARTICIPANT);
       },
       rootClassName: 'participant-can-draggable'
     }), children]
@@ -45,7 +45,8 @@ var ParticipantDialog = exports.ParticipantDialog = function ParticipantDialog(_
     title: "".concat(transI18n('fmt_role_participant'), "(").concat(store.participantCount, ")"),
     width: 320,
     height: 560,
-    dialogKey: _constant.DialogKey.PARTICIPANT,
+    dialogKey: _constant.FcrUIDialogKey.PARTICIPANT,
+    onClose: store.closeParticipantDialog,
     actions: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
       content: transI18n('fmt_uimanager_option_mergeview'),
       mouseEnterDelay: 0,

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

@@ -5,12 +5,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+var _mobxReact = require("mobx-react");
 var _useElectron = require("../../hooks/useElectron");
 var _attendee = require("../../../participant/attendee");
-var DialogContent = function DialogContent(_ref) {
+var DialogContent = (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,
@@ -20,7 +22,8 @@ var DialogContent = function DialogContent(_ref) {
     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
+    y: (params === null || params === void 0 ? void 0 : params.y) || 0,
+    transparent: true
   };
   (0, _useElectron.useElectronDialog)({
     config: config,
@@ -29,5 +32,5 @@ var DialogContent = function DialogContent(_ref) {
     children: children
   });
   return null;
-};
+});
 var _default = exports["default"] = DialogContent;

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

@@ -1,5 +1,5 @@
 import { PropsWithChildren } from 'react';
 import './index.css';
-export declare const RemoveAdmitWaitingRoomDialog: ({ children, params, }: PropsWithChildren<{
+export declare const RemoveAdmitWaitingRoomDialog: ({ children, params }: PropsWithChildren<{
     params: any;
 }>) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/dialog/components/remove-admit-waiting-room/index.js

@@ -3,6 +3,7 @@
 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.iterator.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");
@@ -10,19 +11,26 @@ 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/es.string.iterator.js");
+require("core-js/modules/es.weak-map.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/esnext.weak-map.delete-all.js");
+require("core-js/modules/esnext.weak-map.emplace.js");
 require("core-js/modules/web.dom-collections.for-each.js");
+require("core-js/modules/web.dom-collections.iterator.js");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.RemoveAdmitWaitingRoomDialog = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = require("react");
+var _mobxReact = require("mobx-react");
+var _react = _interopRequireWildcard(require("react"));
 var _store = require("../../store");
 var _reactRnd = require("react-rnd");
 var _electron = _interopRequireDefault(require("./electron"));
@@ -30,9 +38,11 @@ var _platform = require("../../../../utilities/platform");
 require("./index.css");
 var _env = require("agora-foundation/lib/utilities/env");
 var _jsxRuntime = require("react/jsx-runtime");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 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 RemoveAdmitWaitingRoomDialog = exports.RemoveAdmitWaitingRoomDialog = function RemoveAdmitWaitingRoomDialog(_ref) {
+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; } // import { ConfirmContentProps } from 'agora-ui-foundation/lib/components/confirm-content';
+var RemoveAdmitWaitingRoomDialog = exports.RemoveAdmitWaitingRoomDialog = (0, _mobxReact.observer)(function (_ref) {
   var children = _ref.children,
     params = _ref.params;
   var store = (0, _react.useContext)(_store.StoreContext);
@@ -77,4 +87,4 @@ var RemoveAdmitWaitingRoomDialog = exports.RemoveAdmitWaitingRoomDialog = functi
       })
     })
   });
-};
+});

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

@@ -6,15 +6,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ShareScreenSelectronDialog = void 0;
+var _i18n = require("agora-ui-foundation/lib/i18n");
 var _constant = require("../../../../utilities/constant");
 var _useElectron = require("../../hooks/useElectron");
-var _dialogContainer = _interopRequireDefault(require("../../../components/dialog-container"));
+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 transI18n = (0, _i18n.useI18n)();
   (0, _useElectron.useElectronDialog)({
-    dialogKey: _constant.DialogKey.SHARE_SCREEN,
+    dialogKey: _constant.FcrUIDialogKey.SHARE_SCREEN,
     config: {
       width: 790,
       height: 550,
@@ -23,16 +25,18 @@ var ShareScreenSelectronDialog = exports.ShareScreenSelectronDialog = function S
       trafficLightPosition: {
         x: 0,
         y: 0
-      }
+      },
+      title: transI18n('fmt_screenshare_label_screenshare'),
+      resizable: false
     },
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_dialogContainer["default"], {
       width: 790,
       height: 550,
-      dialogKey: _constant.DialogKey.SHARE_SCREEN,
+      dialogKey: _constant.FcrUIDialogKey.SHARE_SCREEN,
       children: children
     }),
     onClose: function onClose(store) {
-      store.closeDialogByKey(_constant.DialogKey.SHARE_SCREEN);
+      store.closeDialogByKey(_constant.FcrUIDialogKey.SHARE_SCREEN);
     }
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});

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

@@ -23,7 +23,7 @@ var DialogContent = function DialogContent(_ref) {
     y: (params === null || params === void 0 ? void 0 : params.y) || 0
   };
   (0, _useElectron.useElectronDialog)({
-    dialogKey: _constant.DialogKey.SYSTEM_PREFERENCE,
+    dialogKey: _constant.FcrUIDialogKey.SYSTEM_PREFERENCE,
     config: config,
     children: children,
     onOpened: function onOpened(_ref2) {

package/lib/modules/dialog/components/system-preference/index.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");

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

@@ -29,7 +29,7 @@ var config = {
 var ToastElectron = function ToastElectron(_ref) {
   var children = _ref.children;
   (0, _useElectron.useElectronDialog)({
-    dialogKey: _constant.DialogKey.SHOW_TOAST,
+    dialogKey: _constant.FcrUIDialogKey.SHOW_TOAST,
     config: config,
     children: children,
     ignoreMouseEvents: true,

package/lib/modules/dialog/components/video-window/index.d.ts

@@ -0,0 +1,2 @@
+import { PropsWithChildren } from 'react';
+export declare const VideoWindowDialog: ({ children }: PropsWithChildren<{}>) => import("react/jsx-runtime").JSX.Element | null;

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;
+});