fcr-ui-scene 3.7.4-rc.1 → 3.7.5

package/lib/modules/control-bar/components/meeting-details/index.js

@@ -14,7 +14,6 @@ var _button = require("agora-ui-foundation/lib/components/button");
 var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
 var _i18n = require("agora-ui-foundation/lib/i18n");
-var _copyText = require("../../../../utilities/copyText");
 var _tools = require("../../../../utilities/tools");
 var _mobxReact = require("mobx-react");
 var _react = require("react");
@@ -22,6 +21,7 @@ require("./index.css");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _store = require("../../store");
 var _enums = require("../../enums");
+var _browserApi = require("../../../../utilities/browser-api");
 var _jsxRuntime = require("react/jsx-runtime");
 var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function () {
   var t = (0, _i18n.useI18n)();
@@ -40,37 +40,29 @@ var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function
     password = _useContext$roomInfo.password,
     roomId = _useContext$roomInfo.roomId,
     roomName = _useContext$roomInfo.roomName,
-    userName = _useContext.localUser.userName,
-    setShowMeetingDetailPortal = _useContext.setShowMeetingDetailPortal,
+    localUserName = _useContext.localUserName,
     showToast = _useContext.showToast,
     meetingId = _useContext.meetingId,
     meetingTime = _useContext.meetingTime,
     roomDetailCopyText = _useContext.roomDetailCopyText;
   var getShareLink = function getShareLink() {
-    var info = {
-      roomId: roomId,
-      roomName: roomName,
-      userName: userName
-    };
     var baseLink = "".concat(inviteLink);
     return baseLink;
   };
   var shareLink = (0, _react.useMemo)(function () {
     return getShareLink();
   }, []);
-  if (!roomName || !userName) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});
+  if (!roomName || !localUserName) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});
   var displayMeetingId = (0, _tools.renderMeetingId)(meetingId, roomId);
   function handleCopyMeetingId(copyContent) {
     if (!copyContent) return;
     var content = meetingId ? copyContent : copyContent.replace(/\s+/g, '');
-    (0, _copyText.copyText)(content).then(function () {
-      setShowMeetingDetailPortal(false);
+    (0, _browserApi.copyText)(content).then(function () {
       showToast({
         type: 'info',
         content: t('fmt_statusbar_status_coppied')
       });
     })["catch"](function () {
-      setShowMeetingDetailPortal(false);
       showToast({
         type: 'warn',
         content: t('fmt_information_tips_numbercopyfailed')
@@ -78,14 +70,12 @@ var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function
     });
   }
   function handlerCopyMeetingShareLink(shareLink) {
-    (0, _copyText.copyText)(shareLink).then(function () {
-      setShowMeetingDetailPortal(false);
+    (0, _browserApi.copyText)(shareLink).then(function () {
       showToast({
         type: 'info',
         content: t('fmt_additional_tips_invitation')
       });
     })["catch"](function () {
-      setShowMeetingDetailPortal(false);
       showToast({
         type: 'warn',
         content: t('fmt_additional_tips_invitationfailed')
@@ -93,7 +83,7 @@ var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function
     });
   }
   function handleCopyMeetingPassword(password) {
-    (0, _copyText.copyText)(password).then(function () {
+    (0, _browserApi.copyText)(password).then(function () {
       showToast({
         type: 'info',
         content: t('fmt_uimanager_tips_passwordcopied')
@@ -117,7 +107,7 @@ var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function
       copyIcon: _type.FcrIconType.FCR_RESET,
       copyText: t('fmt_meeting_call_voice_call_button_copy_info')
     });
-    (0, _copyText.copyText)(roomDetailCopyText).then(function () {
+    (0, _browserApi.copyText)(roomDetailCopyText).then(function () {
       copyTimer = setTimeout(function () {
         setCopyInfoState({
           copyState: _enums.CopyState.COPIED,

package/lib/modules/control-bar/components/microphone/index.d.ts

@@ -0,0 +1,6 @@
+import { FcrUIMicrophoneState } from '../../../../type';
+export declare const AudioRecordinDeviceIcon: ({ size, state, }: {
+    size?: number;
+    state?: FcrUIMicrophoneState;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const MicrophoneControl: () => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,233 @@
+"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.MicrophoneControl = exports.AudioRecordinDeviceIcon = void 0;
+var _mobxReact = require("mobx-react");
+var _react = require("react");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _icon = require("agora-ui-foundation/lib/components/icon");
+var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _iconPhoneCall = require("agora-ui-foundation/lib/components/icon-phone-call");
+var _popover = require("agora-ui-foundation/lib/components/popover");
+var _mic = require("agora-ui-foundation/lib/components/icon/mic");
+var _micLoading = _interopRequireDefault(require("../../../../assets/mic-loading.gif"));
+var _type2 = require("../../../../type");
+var _audioMenu = _interopRequireDefault(require("../../../components/device-control/components/audio-menu"));
+var _noneMenu = _interopRequireDefault(require("../../../components/device-control/components/none-menu"));
+var _phoneMenu = _interopRequireDefault(require("../../../components/device-control/components/phone-menu"));
+var _hooks = _interopRequireDefault(require("../../../components/device-control/hooks"));
+var _store = require("../../../components/device-control/store.base");
+var _boundaryDetector = require("../boundary-detector");
+var _store2 = require("../../store");
+var _context = require("../../context");
+var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
+var _jsxRuntime = require("react/jsx-runtime");
+var AudioRecordinDeviceIcon = exports.AudioRecordinDeviceIcon = (0, _mobxReact.observer)(function (_ref) {
+  var _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 32 : _ref$size,
+    _ref$state = _ref.state,
+    state = _ref$state === void 0 ? _type2.FcrUIMicrophoneState.MUTE : _ref$state;
+  var _useContext = (0, _react.useContext)(_store.DeviceControlStoreContext),
+    microphoneVolumeLevel = _useContext.microphoneVolumeLevel;
+  var muteColor = {
+    iconPrimary: "var(--fcr_ui_scene_ramp_red6)",
+    iconSecondary: 'var(--fcr_ui_scene_ramp_red6)'
+  };
+  if (state === _type2.FcrUIMicrophoneState.MUTE) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+      type: _type.FcrIconType.FCR_NOMUTE,
+      colors: muteColor,
+      size: size
+    });
+  } else if (state === _type2.FcrUIMicrophoneState.UNMUTE) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_mic.FcrMicrophoneIndicator, {
+      size: size,
+      voicePercent: microphoneVolumeLevel
+    });
+  } else {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+      src: _micLoading["default"],
+      alt: "mic-loading",
+      width: size
+    });
+  }
+});
+var MicrophoneControl = exports.MicrophoneControl = (0, _mobxReact.observer)(function () {
+  var _useContext2 = (0, _react.useContext)(_store.DeviceControlStoreContext),
+    microphoneEnabled = _useContext2.microphoneEnabled,
+    enableMicrophone = _useContext2.enableMicrophone,
+    openConnection = _useContext2.openConnection,
+    microphoneList = _useContext2.microphoneList,
+    phoneMicEnabled = _useContext2.phoneMicEnabled,
+    checkMediaPermission = _useContext2.checkMediaPermission,
+    connectType = _useContext2.connectType,
+    microphoneState = _useContext2.microphoneState;
+  var _useContext3 = (0, _react.useContext)(_store2.StoreContext),
+    setPopoverArea = _useContext3.setPopoverArea;
+  var _useContext4 = (0, _react.useContext)(_context.ControlBarCalculationContext),
+    isShareActionNavHidden = _useContext4.isShareActionNavHidden;
+  var _useDeviceTooltipVisi = (0, _hooks["default"])(),
+    popoverOpened = _useDeviceTooltipVisi.popoverOpened,
+    _setPopoverOpened = _useDeviceTooltipVisi.setPopoverOpened,
+    handlePopoverVisibleChanged = _useDeviceTooltipVisi.handlePopoverVisibleChanged;
+  var transI18n = (0, _i18n.useI18n)();
+  var microphoneStateMapToTitle = (0, _react.useMemo)(function () {
+    if (microphoneState === _type2.FcrUIMicrophoneState.UNMUTE) {
+      return transI18n('fmt_device_label_audio_unmute');
+    }
+    if (microphoneState === _type2.FcrUIMicrophoneState.MUTE) {
+      return transI18n('fmt_device_label_audio_mute');
+    } else {
+      return transI18n('fmt_audio_popup_button_turning_on');
+    }
+  }, [microphoneState]);
+  var noMic = microphoneList.length === 0;
+  var noMicColor = {
+    iconPrimary: "var(--fcr_web_ui_scene_mainicon1)",
+    iconSecondary: 'var(--fcr_ui_scene_ramp_red6)'
+  };
+  var handleBoundariesChanged = (0, _react.useCallback)(function (boundaries) {
+    setPopoverArea(boundaries);
+  }, []);
+  (0, _react.useEffect)(function () {
+    if (isShareActionNavHidden) {
+      _setPopoverOpened(false);
+      setPopoverArea({
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+      });
+    }
+  }, [isShareActionNavHidden]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: "device-control-item-wrapper",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "device-control ".concat(popoverOpened ? 'active' : ''),
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "device-control-inner",
+        children: [connectType === _type2.FcrUIConnectType.NONE && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          onClick: function onClick() {
+            return openConnection('computer');
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+            content: transI18n('fmt_toolbar_label_connectaudio'),
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+                type: _type.FcrIconType.FCR_WEB_CONNECTSOUND,
+                size: 32,
+                colors: {
+                  iconPrimary: "var(--fcr_web_ui_scene_mainicon1)",
+                  iconSecondary: 'var(--fcr_ui_scene_ramp_green6)'
+                }
+              })
+            })
+          })
+        }), connectType === _type2.FcrUIConnectType.COMPUTER && (!noMic ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          onClick: function onClick() {
+            enableMicrophone(!microphoneEnabled);
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+            content: microphoneStateMapToTitle,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(AudioRecordinDeviceIcon, {
+                state: microphoneState
+              })
+            })
+          })
+        }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          onClick: function onClick() {
+            return checkMediaPermission('microphone');
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+            content: transI18n('fmt_internalsetting_status_nodevice'),
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+                type: _type.FcrIconType.FCR_MUTECRASH,
+                colors: noMicColor,
+                size: 32
+              })
+            })
+          })
+        })), connectType === _type2.FcrUIConnectType.PHONE && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+            content: transI18n('fmt_device_label_audio_unmute'),
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconPhoneCall.FcrIconPhoneCall, {
+                isMuted: !phoneMicEnabled
+              })
+            })
+          })
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_popover.FcrPopover, {
+        showArrow: false,
+        overlayClassName: "device-control--device-popover",
+        visible: popoverOpened,
+        onVisibleChange: handlePopoverVisibleChanged,
+        trigger: "click",
+        content: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_boundaryDetector.BoundaryDetector, {
+          onBoundariesChanged: handleBoundariesChanged,
+          children: [connectType === _type2.FcrUIConnectType.NONE && /*#__PURE__*/(0, _jsxRuntime.jsx)(_noneMenu["default"], {
+            onItemClick: function onItemClick() {
+              handlePopoverVisibleChanged(false);
+              setPopoverArea({
+                x: 0,
+                y: 0,
+                width: 0,
+                height: 0
+              });
+            }
+          }), connectType === _type2.FcrUIConnectType.COMPUTER && /*#__PURE__*/(0, _jsxRuntime.jsx)(_audioMenu["default"], {
+            setPopoverOpened: function setPopoverOpened(opened) {
+              _setPopoverOpened(opened);
+              if (!opened) {
+                setPopoverArea({
+                  x: 0,
+                  y: 0,
+                  width: 0,
+                  height: 0
+                });
+              }
+            },
+            onConnectClick: function onConnectClick() {
+              handlePopoverVisibleChanged(false);
+              setPopoverArea({
+                x: 0,
+                y: 0,
+                width: 0,
+                height: 0
+              });
+            }
+          }), connectType === _type2.FcrUIConnectType.PHONE && /*#__PURE__*/(0, _jsxRuntime.jsx)(_phoneMenu["default"], {
+            onItemClick: function onItemClick() {
+              handlePopoverVisibleChanged(false);
+              setPopoverArea({
+                x: 0,
+                y: 0,
+                width: 0,
+                height: 0
+              });
+            }
+          })]
+        }),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          onClick: function onClick(e) {
+            e.stopPropagation();
+          },
+          className: "device-control-extra ".concat(popoverOpened ? 'active' : ''),
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+            type: _type.FcrIconType.FCR_DROPUP4,
+            colors: {
+              iconPrimary: 'var(--fcr_web_ui_scene_mainicon1)'
+            },
+            size: 24
+          })
+        })
+      })]
+    })
+  });
+});

package/lib/modules/control-bar/components/more-actions/index.d.ts

@@ -1,3 +1,3 @@
 import './index.css';
-import { MorePopoverContentProps } from '../../types';
+import { MorePopoverContentProps } from '../../type';
 export declare const MorePopoverContent: (props: MorePopoverContentProps) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/control-bar/components/more-actions/index.js

@@ -18,11 +18,9 @@ var _react = require("react");
 var _store = require("../../store");
 require("./index.css");
 var _type2 = require("fcr-core/lib/type");
-var _copyText = require("../../../../utilities/copyText");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _enums = require("../../enums");
-var _type3 = require("../../../../type");
 var _jsxRuntime = require("react/jsx-runtime");
 var MorePopoverContent = exports.MorePopoverContent = (0, _mobxReact.observer)(function (props) {
   var ref = (0, _react.useRef)(null);
@@ -30,36 +28,20 @@ var MorePopoverContent = exports.MorePopoverContent = (0, _mobxReact.observer)(f
     _props$closePopover = props.closePopover,
     closePopover = _props$closePopover === void 0 ? function () {} : _props$closePopover;
   var _useContext = (0, _react.useContext)(_store.StoreContext),
-    isHost = _useContext.isHost,
     handleMoreClick = _useContext.handleMoreClick,
     liveStreamingState = _useContext.liveStreamingState,
-    playUrl = _useContext.playUrl,
     cloudRecordingState = _useContext.cloudRecordingState,
     hasStartCloudRecordingPermission = _useContext.hasStartCloudRecordingPermission,
     hasStartLiveStreamingPermission = _useContext.hasStartLiveStreamingPermission,
     hasGetLiveStreamingUrlPermission = _useContext.hasGetLiveStreamingUrlPermission,
-    handleLeaveRoom = _useContext.handleLeaveRoom,
-    showToast = _useContext.showToast,
+    hasEndRoomPermission = _useContext.hasEndRoomPermission,
     newMessageCount = _useContext.newMessageCount,
-    isRoomDetailSupported = _useContext.isRoomDetailSupported,
-    roomDetailCopyText = _useContext.roomDetailCopyText;
+    isRoomDetailSupported = _useContext.isRoomDetailSupported;
   var transI18n = (0, _i18n.useI18n)();
   var onItemClick = function onItemClick(item) {
-    if (item.onClick) {
-      item.onClick();
-      return;
-    }
     closePopover();
     handleMoreClick(item.key);
   };
-  var handleCopyMeetingDetail = (0, _react.useCallback)(function () {
-    (0, _copyText.copyText)(roomDetailCopyText).then(function () {
-      showToast({
-        type: 'info',
-        content: transI18n('fmt_meeting_mainwindow_topbar_left_popup_toast_copy_done')
-      });
-    });
-  }, []);
 
   // 分割线
   var moreOptions = [{
@@ -69,13 +51,15 @@ var MorePopoverContent = exports.MorePopoverContent = (0, _mobxReact.observer)(f
     key: _enums.MoreAction.OPEN_CHAT,
     hasPermission: hasChatPermission,
     classNames: 'share-action-nav__media-list-item-with-divider'
-  }, {
-    icon: _type.FcrIconType.FCR_EMO,
-    text: transI18n('fmt_popup_label_expression'),
-    displayWhenNoPermission: 'hidden',
-    key: 'emoji',
-    hasPermission: false
-  }, {
+  },
+  // {
+  //   icon: FcrIconType.FCR_EMO,
+  //   text: transI18n('fmt_popup_label_expression'),
+  //   displayWhenNoPermission: 'hidden',
+  //   key: 'emoji',
+  //   hasPermission: false,
+  // },
+  {
     icon: _type.FcrIconType.FCR_CLOUDRECORD,
     classNames: 'share-action-nav__media-list-item-with-divider',
     text: transI18n('fmt_screenshare_controlbar_button_more_cloudRecord'),
@@ -92,25 +76,19 @@ var MorePopoverContent = exports.MorePopoverContent = (0, _mobxReact.observer)(f
   //     hasStartCloudRecordingPermission && cloudRecordingState === FcrRecordingState.Stopped,
   // },
   {
-    classNames: 'share-action-nav__media-list-item-with-divider',
     icon: _type.FcrIconType.FCR_LIVE,
+    classNames: 'share-action-nav__media-list-item-with-divider',
     text: transI18n('fmt_screenshare_controlbar_button_more_live'),
     displayWhenNoPermission: 'hidden',
-    key: 'liveStreaming',
-    hasPermission: hasStartLiveStreamingPermission && liveStreamingState === _type2.FcrLiveStreamingState.STOPPED,
-    onClick: function onClick() {
-      handleMoreClick(_enums.MoreAction.OPEN_LIVE_STEAMING_DIALOG);
-    }
+    key: _enums.MoreAction.OPEN_LIVE_STEAMING_DIALOG,
+    hasPermission: hasStartLiveStreamingPermission && liveStreamingState === _type2.FcrLiveStreamingState.STOPPED
   }, {
     icon: _type.FcrIconType.FCR_EXCLAMATIONMASK,
     text: transI18n('fmt_popup_button_meetinginfor'),
     classNames: 'share-action-nav__media-list-item-with-divider',
     displayWhenNoPermission: 'hidden',
-    key: 'copyMeetingInfo',
-    hasPermission: isRoomDetailSupported,
-    onClick: function onClick() {
-      handleCopyMeetingDetail();
-    }
+    key: _enums.MoreAction.COPY_MEETING_INFO,
+    hasPermission: isRoomDetailSupported
   }, {
     icon: _type.FcrIconType.FCR_SETTING,
     classNames: 'share-action-nav__media-list-item-with-divider',
@@ -123,28 +101,14 @@ var MorePopoverContent = exports.MorePopoverContent = (0, _mobxReact.observer)(f
     classNames: 'share-action-nav__media-list-item-with-divider',
     text: transI18n('fmt_live_label_copylink'),
     displayWhenNoPermission: 'hidden',
-    key: 'copyLiveLink',
-    hasPermission: liveStreamingState === _type2.FcrLiveStreamingState.STARTED && hasGetLiveStreamingUrlPermission,
-    onClick: function onClick() {
-      closePopover();
-      (0, _copyText.copyText)(playUrl).then(function () {
-        showToast({
-          type: 'info',
-          content: transI18n('fmt_statusbar_status_coppied')
-        });
-      });
-    }
+    key: _enums.MoreAction.COPY_INVITE_LINK,
+    hasPermission: liveStreamingState === _type2.FcrLiveStreamingState.STARTED && hasGetLiveStreamingUrlPermission
   }, {
     icon: _type.FcrIconType.FCR_ENDMEETING,
     key: _enums.MoreAction.LEAVE_ROOM,
     classNames: 'share-action-nav__popover-inner-content-leave-option',
-    text: isHost ? transI18n('fmt_popup_button_endmeeting') : transI18n('fmt_popup_button_leavemeeting'),
-    hasPermission: true,
-    onClick: function onClick() {
-      var _window$runtime$brows;
-      (_window$runtime$brows = window.runtime.browserWindow) === null || _window$runtime$brows === void 0 || _window$runtime$brows.setIgnoreMouseEvents(false);
-      handleLeaveRoom();
-    }
+    text: hasEndRoomPermission ? transI18n('fmt_popup_button_endmeeting') : transI18n('fmt_popup_button_leavemeeting'),
+    hasPermission: true
   }];
   (0, _react.useEffect)(function () {
     function handleClickOutside(event) {
@@ -160,7 +124,6 @@ var MorePopoverContent = exports.MorePopoverContent = (0, _mobxReact.observer)(f
   var moreOptionsFilter = moreOptions.filter(function (item) {
     return item.hasPermission;
   });
-  var count = newMessageCount[_type3.FcrUIRoomType.MAIN_ROOM] || 0;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     ref: ref,
     className: "share-action-nav__popover-inner-content share-action-nav__not-draggable",
@@ -184,9 +147,9 @@ var MorePopoverContent = exports.MorePopoverContent = (0, _mobxReact.observer)(f
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
             className: "share-action-nav__popover-inner-content-text",
             children: item.text
-          }), item.key === _enums.MoreAction.OPEN_CHAT && count > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          }), item.key === _enums.MoreAction.OPEN_CHAT && newMessageCount > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
             className: "share-action-nav__popover-inner-content-chat-count",
-            children: count > 0 ? count : count > 99 ? '99+' : count
+            children: newMessageCount > 0 ? newMessageCount : newMessageCount > 99 ? '99+' : newMessageCount
           })]
         })
       }, item.key);

package/lib/modules/control-bar/components/share-audio/index.d.ts

@@ -1,5 +1,4 @@
 import './index.css';
-import { BrowserWindow } from 'electron';
 export declare enum AudioProcessingChannel {
     MONO = "1",
     STEREO = "2"
@@ -10,6 +9,5 @@ export interface ShareAudioProps {
     onSwitchAudioChannel?: (target: AudioProcessingChannel) => void;
     toggleShareWithAudio?: (target: boolean) => void;
     showInfoTip?: boolean;
-    browserWindow: BrowserWindow;
 }
 export declare const ShareAudio: (props: ShareAudioProps) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/control-bar/components/share-audio/index.js

@@ -3,7 +3,6 @@
 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");
@@ -11,24 +10,18 @@ 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.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.ShareAudio = exports.AudioProcessingChannel = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 require("./index.css");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
@@ -38,7 +31,6 @@ var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
 var _radio = require("agora-ui-foundation/lib/components/radio");
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 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 AudioProcessingChannel = exports.AudioProcessingChannel = /*#__PURE__*/function (AudioProcessingChannel) {
@@ -53,24 +45,14 @@ var ShareAudio = exports.ShareAudio = function ShareAudio(props) {
     currentAudioChannel = _props$currentAudioCh === void 0 ? AudioProcessingChannel.MONO : _props$currentAudioCh,
     toggleShareWithAudio = props.toggleShareWithAudio,
     _props$showInfoTip = props.showInfoTip,
-    showInfoTip = _props$showInfoTip === void 0 ? false : _props$showInfoTip,
-    browserWindow = props.browserWindow;
-  var _React$useState = _react["default"].useState(false),
-    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
-    popoverVisible = _React$useState2[0],
-    setVisible = _React$useState2[1];
+    showInfoTip = _props$showInfoTip === void 0 ? false : _props$showInfoTip;
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    popoverVisible = _useState2[0],
+    setVisible = _useState2[1];
   var handlerVisibleChange = function handlerVisibleChange(visible) {
     setVisible(visible);
   };
-  function handleBlur(event) {
-    setVisible(false);
-  }
-  (0, _react.useEffect)(function () {
-    browserWindow.on('blur', handleBlur);
-    return function () {
-      browserWindow.off('blur', handleBlur);
-    };
-  }, []);
   var shareAudioTips = (0, _react.useMemo)(function () {
     if (!shareWithAudio) {
       return t('fmt_screenshare_window_checkbox_shareAudio');

package/lib/modules/control-bar/components/share-state-nav/index.d.ts

@@ -1,4 +1,4 @@
 import './index.css';
-import { IShareStateNav } from '../../types';
+import { IShareStateNav } from '../../type';
 export declare const DragIcon: () => import("react/jsx-runtime").JSX.Element;
 export declare const ShareStateNav: (props: IShareStateNav) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/control-bar/components/share-state-nav/index.js

@@ -41,23 +41,27 @@ var DragIcon = exports.DragIcon = function DragIcon() {
 };
 var ShareStateNav = exports.ShareStateNav = (0, _mobxReact.observer)(function (props) {
   var onShareStateNavTransferPosition = props.onShareStateNavTransferPosition,
-    currentPosition = props.currentPosition;
+    currentPosition = props.currentPosition,
+    onMouseEnter = props.onMouseEnter,
+    onMouseLeave = props.onMouseLeave;
   var _useContext = (0, _react.useContext)(_store.StoreContext),
     isMuteAudio = _useContext.isMuteAudio,
+    isInSmoothMode = _useContext.isInSmoothMode,
     cloudRecordingState = _useContext.cloudRecordingState,
     meetingTime = _useContext.meetingTime,
-    isCurrentScreenShareInSmoothType = _useContext.isCurrentScreenShareInSmoothType,
-    isEngineConnected = _useContext.isEngineConnected;
+    isConnecting = _useContext.isConnecting;
   var transI18n = (0, _i18n.useI18n)();
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave,
     className: "share-state-nav fcr-flex fcr-items-center \n                 fcr-justify-center share-action-nav__can-draggable \n                ".concat(currentPosition === _enums.TransferPosition.TOP ? 'share-state-nav-top' : 'share-state-nav-bottom'),
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(DragIcon, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_transferPositionIcon.TransferPositionIcon, {
       onTransferPositionButtonClick: onShareStateNavTransferPosition,
       currentPosition: currentPosition
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "share-state-nav__state-text",
-      children: isEngineConnected ? transI18n('fmt_settings_tips_sharing') : transI18n('fmt_screenshare_toolbar_label_reconnecting')
-    }), isCurrentScreenShareInSmoothType ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      children: isConnecting ? transI18n('fmt_screenshare_toolbar_label_reconnecting') : transI18n('fmt_settings_tips_sharing')
+    }), isInSmoothMode ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "share-state-nav__meeting-scenario-type",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
         type: _type.FcrIconType.FCR_HOME_QUICKSTART,

package/lib/modules/control-bar/components/transfer-position-icon/index.d.ts

@@ -1,2 +1,2 @@
-import { ITransferPositionIconProps } from '../../types';
+import { ITransferPositionIconProps } from '../../type';
 export declare const TransferPositionIcon: (props: ITransferPositionIconProps) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/control-bar/context.d.ts

@@ -0,0 +1,5 @@
+import { ControlBarCalculation, ControlBarCalculationUpdaterType, DragState } from './type';
+export declare const DragContext: import("react").Context<DragState>;
+export declare const ControlBarCalculationContext: import("react").Context<ControlBarCalculation>;
+export declare const ControlBarCalculationUpdaterContext: import("react").Context<ControlBarCalculationUpdaterType>;
+export declare const DragStateUpdaterContext: import("react").Context<(state: Partial<DragState>) => void>;

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

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

package/lib/modules/control-bar/enums.d.ts

@@ -17,5 +17,7 @@ export declare enum MoreAction {
     OPEN_SETTING = 5,
     CLOUD_RECORDING_START = 6,
     CLOUD_RECORDING_STOP = 7,
-    LEAVE_ROOM = 8
+    LEAVE_ROOM = 8,
+    COPY_INVITE_LINK = 9,
+    COPY_MEETING_INFO = 10
 }