fcr-ui-scene 3.4.2 → 3.4.4

package/lib/modules/participant/attendee/index.js

@@ -18,7 +18,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ParticipantAttendee = exports.OperateWaitingRoomMemberDialog = void 0;
+exports.WaitingRoomDialogKeyMap = exports.ParticipantAttendee = exports.OperateWaitingRoomMemberDialog = void 0;
 require("core-js/modules/es.array.find.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/esnext.async-iterator.find.js");
@@ -46,26 +46,47 @@ require("./index.css");
 var _helper = require("agora-ui-foundation/lib/components/avatar/helper");
 var _fcrCore = require("fcr-core");
 var _participantsMore = require("agora-ui-foundation/lib/components/participants/participants-more");
+var _constant = require("../../../utilities/constant");
 var _checkbox = require("agora-ui-foundation/lib/components/checkbox");
+var _button = require("agora-ui-foundation/lib/components/button");
 var _useLanguageConfig = require("../../interpreter/interpreter-list/interpreter-item/components/pick-language/useLanguageConfig");
+var _type3 = require("fcr-core/lib/room-control/user-control/type");
 var _useClickAnywhere = require("agora-ui-foundation/lib/hooks/use-click-anywhere");
 var _useElectron = require("../../dialog/hooks/useElectron");
-var _type3 = require("fcr-core/lib/room-control/type");
 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; }
+var WaitingRoomDialogKeyMap = exports.WaitingRoomDialogKeyMap = {
+  remove: _constant.DialogKey.WAITING_ROOM_SINGLE_REMOVE,
+  removeAll: _constant.DialogKey.WAITING_ROOM_ALL_REMOVE,
+  admitAll: _constant.DialogKey.WAITING_ROOM_ALL_ADMIT
+};
 var OperateWaitingRoomMemberDialog = exports.OperateWaitingRoomMemberDialog = function OperateWaitingRoomMemberDialog(_ref) {
   var type = _ref.type,
     tooltip = _ref.tooltip,
-    onChecked = _ref.onChecked;
+    title = _ref.title,
+    userId = _ref.userId;
   var t = (0, _i18n.useI18n)();
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     isChecked = _useState2[0],
     setIsChecked = _useState2[1];
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
+    removeWaitingRoomUser = _useContext.removeWaitingRoomUser,
+    moveToMainRoomAllMember = _useContext.moveToMainRoomAllMember,
+    kickOutWaitingRoomAllMember = _useContext.kickOutWaitingRoomAllMember,
+    closeRemoveAdmitWaitingRoomDialog = _useContext.closeRemoveAdmitWaitingRoomDialog;
+  var buttonTextMap = {
+    removeAll: t('fmt_waitingroom_sidebar_button_removeall'),
+    admitAll: t('fmt_waitingroom_sidebar_button_admitall'),
+    remove: t('fmt_waitingroom_sidebar_popup_button_remove')
+  };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "operate-waiting-room-dialog-content",
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "operate-waiting-room-dialog-title",
+      children: title
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "operate-waiting-room-dialog-tooltip",
       children: tooltip
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -73,10 +94,7 @@ var OperateWaitingRoomMemberDialog = exports.OperateWaitingRoomMemberDialog = fu
       children: type === 'admitAll' ? null : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
           checked: isChecked,
-          onChange: function onChange(value) {
-            setIsChecked(value);
-            onChecked && onChecked(value);
-          },
+          onChange: setIsChecked,
           size: "small",
           styleType: "white"
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -86,6 +104,34 @@ var OperateWaitingRoomMemberDialog = exports.OperateWaitingRoomMemberDialog = fu
           children: t('fmt_waitingroom_sidebar_popup_option_notagain')
         })]
       })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "operate-waiting-room-dialog-btns",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
+        size: "S",
+        shape: "rounded",
+        styleType: "white",
+        onClick: function onClick() {
+          closeRemoveAdmitWaitingRoomDialog(WaitingRoomDialogKeyMap[type]);
+        },
+        children: t('fmt_waitingroom_sidebar_popup_button_cancel')
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
+        size: "S",
+        shape: "rounded",
+        styleType: type === 'admitAll' ? 'normal' : 'danger',
+        onClick: function onClick() {
+          if (type === 'remove') {
+            removeWaitingRoomUser(userId, isChecked ? _type3.FcrUserKickedOutType.Forever : _type3.FcrUserKickedOutType.Once);
+          }
+          if (type === 'removeAll') {
+            kickOutWaitingRoomAllMember(isChecked ? _type3.FcrUserKickedOutType.Forever : _type3.FcrUserKickedOutType.Once);
+          }
+          if (type === 'admitAll') {
+            moveToMainRoomAllMember();
+          }
+          closeRemoveAdmitWaitingRoomDialog(WaitingRoomDialogKeyMap[type]);
+        },
+        children: buttonTextMap[type]
+      })]
     })]
   });
 };
@@ -228,14 +274,14 @@ var ParticipantAttendee = exports.ParticipantAttendee = (0, _mobxReact.observer)
     var timeoutId = (0, _react.useRef)();
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "attendee__user-action attendee__user-action-host ".concat(isShowDropMenu ? 'attendee__user-action-hovered' : ''),
-      children: [isShowActionAudio && activeTab === _type3.FcrRoomType.Mainroom && /*#__PURE__*/(0, _jsxRuntime.jsx)(_action.FcrActionButton, {
+      children: [isShowActionAudio && activeTab === _constant.RoomType.MAIN_ROOM && /*#__PURE__*/(0, _jsxRuntime.jsx)(_action.FcrActionButton, {
         size: "small",
         onClick: handleAudioButtonClick,
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
           className: hasAudio ? 'attendee__danger-operate' : 'attendee__normal-operate',
           children: t(actionAudioTag)
         })
-      }), activeTab === _type3.FcrRoomType.Waitingroom && /*#__PURE__*/(0, _jsxRuntime.jsx)(_action.FcrActionButton, {
+      }), activeTab === _constant.RoomType.WAITING_ROOM && /*#__PURE__*/(0, _jsxRuntime.jsx)(_action.FcrActionButton, {
         size: "small",
         onClick: function onClick() {
           return moveToMainRoomByUserIds([userId]);
@@ -280,7 +326,7 @@ var ParticipantAttendee = exports.ParticipantAttendee = (0, _mobxReact.observer)
             hasAudio: hasAudio,
             userName: userName,
             audioDeviceType: audioDeviceType,
-            hideActions: activeTab === _type3.FcrRoomType.Mainroom ? mainRoomParticipateActionsNeedHiden : waitingRoomParticipateActionsNeedHiden
+            hideActions: activeTab === _constant.RoomType.MAIN_ROOM ? mainRoomParticipateActionsNeedHiden : waitingRoomParticipateActionsNeedHiden
           }))
         }),
         placement: "bottomRight",
@@ -370,12 +416,12 @@ var ParticipantAttendee = exports.ParticipantAttendee = (0, _mobxReact.observer)
         colors: {
           iconPrimary: 'var(--fcr_ui_scene_ramp_green6)'
         }
-      }), audioDeviceType !== 'none' && activeTab === _type3.FcrRoomType.Mainroom && /*#__PURE__*/(0, _jsxRuntime.jsx)(MicrophoneIndicator, {
+      }), audioDeviceType !== 'none' && activeTab === _constant.RoomType.MAIN_ROOM && /*#__PURE__*/(0, _jsxRuntime.jsx)(MicrophoneIndicator, {
         audioDeviceType: audioDeviceType,
         hasAudio: hasAudio,
         isLocal: !!isMe,
         userId: userId
-      }), videoDeviceType !== 'none' && activeTab === _type3.FcrRoomType.Mainroom && /*#__PURE__*/(0, _jsxRuntime.jsx)(_cameraState.CameraState, {
+      }), videoDeviceType !== 'none' && activeTab === _constant.RoomType.MAIN_ROOM && /*#__PURE__*/(0, _jsxRuntime.jsx)(_cameraState.CameraState, {
         isCameraMuted: !hasVideo,
         size: 28,
         renderIconType: 'surface'
@@ -388,9 +434,9 @@ var MicrophoneIndicator = (0, _mobxReact.observer)(function (_ref2) {
     hasAudio = _ref2.hasAudio,
     isLocal = _ref2.isLocal,
     userId = _ref2.userId;
-  var _useContext = (0, _react.useContext)(_store.StoreContext),
-    audioVolumeMap = _useContext.audioVolumeMap,
-    localMicVolume = _useContext.localMicVolume;
+  var _useContext2 = (0, _react.useContext)(_store.StoreContext),
+    audioVolumeMap = _useContext2.audioVolumeMap,
+    localMicVolume = _useContext2.localMicVolume;
   var volume = isLocal ? localMicVolume : audioVolumeMap.get(userId);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_microphoneState.MicrophoneState, {
     isMicrophoneMuted: !hasAudio,

package/lib/modules/participant/components/attendee/components/interpreter-tag/index.d.ts

@@ -0,0 +1,3 @@
+export declare const ParticipantAttendeeinterpreterTag: ({ userId }: {
+    userId: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/participant/components/attendee/components/interpreter-tag/index.js

@@ -0,0 +1,48 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ParticipantAttendeeinterpreterTag = void 0;
+require("core-js/modules/es.array.find.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/esnext.async-iterator.find.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.find.js");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _mobxReact = require("mobx-react");
+var _react = require("react");
+var _useLanguageConfig = require("../../../../../interpreter/interpreter-list/interpreter-item/components/pick-language/useLanguageConfig");
+var _store = require("../../../../store");
+var _jsxRuntime = require("react/jsx-runtime");
+var ParticipantAttendeeinterpreterTag = exports.ParticipantAttendeeinterpreterTag = (0, _mobxReact.observer)(function (_ref) {
+  var _interpreterInputLang;
+  var userId = _ref.userId;
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
+    interpreterUserList = _useContext.interpreterUserList,
+    isInterpreterOpened = _useContext.isInterpreterEnabled,
+    interpreterInputLanguageList = _useContext.interpreterInputLanguageList;
+  var userInterpreterInputLanguage = (_interpreterInputLang = interpreterInputLanguageList.find(function (inputLanguageByUserId) {
+    return inputLanguageByUserId.userId === userId;
+  })) === null || _interpreterInputLang === void 0 ? void 0 : _interpreterInputLang.language;
+  var t = (0, _i18n.useI18n)();
+  var isUserIdInterpreter = (0, _react.useMemo)(function () {
+    return interpreterUserList === null || interpreterUserList === void 0 ? void 0 : interpreterUserList.find(function (ele) {
+      return ele.userId === userId;
+    });
+  }, [interpreterUserList]);
+  var getLanguageConfig = (0, _useLanguageConfig.useLanguageConfig)();
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: isInterpreterOpened && isUserIdInterpreter && userInterpreterInputLanguage && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "attendee__host-badge attendee__interpreter-tag-bg",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "attendee__interpreter-tag-user",
+        children: t('fmt_ai_transcriptions_setting_label_translator')
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "attendee__interpreter-tag-language",
+        children: getLanguageConfig(userInterpreterInputLanguage).abbr
+      })]
+    })
+  });
+});

package/lib/modules/participant/components/confirm-input/index.d.ts

@@ -0,0 +1,6 @@
+declare function ConfirmInput(props: {
+    onChange: (name: string) => void;
+    placeholder?: string;
+    type?: 'number' | 'text';
+}): import("react/jsx-runtime").JSX.Element;
+export default ConfirmInput;

package/lib/modules/participant/components/confirm-input/index.js

@@ -0,0 +1,49 @@
+"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["default"] = void 0;
+require("core-js/modules/es.string.trim.js");
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _input = require("agora-ui-foundation/lib/components/input");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _react = require("react");
+var _jsxRuntime = require("react/jsx-runtime");
+function ConfirmInput(props) {
+  var onChange = props.onChange,
+    placeholder = props.placeholder,
+    _props$type = props.type,
+    type = _props$type === void 0 ? 'text' : _props$type;
+  var _useState = (0, _react.useState)(''),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    name = _useState2[0],
+    setName = _useState2[1];
+  var t = (0, _i18n.useI18n)();
+  (0, _react.useEffect)(function () {
+    onChange(name);
+  }, [name]);
+  function handleNameChange(name) {
+    setName(name.trim());
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: "participants-container-rename",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_input.FcrInput, {
+      type: type,
+      autoFocus: true,
+      style: {
+        flex: 1
+      },
+      value: name,
+      onChange: handleNameChange,
+      size: "large",
+      allowClear: true,
+      shape: "rounded",
+      maxLength: 18,
+      placeholder: placeholder || t('fmt_additional_popup_label_enter_nickname')
+    })
+  });
+}
+var _default = exports["default"] = ConfirmInput;

package/lib/modules/participant/components/drop-menu/util.d.ts

@@ -0,0 +1,5 @@
+import { FcrDropMenuOption } from 'agora-ui-foundation/lib/components/drop-menu';
+export declare const CHECKBOX_STYLE_TYPE = "white";
+export declare const UNDERLINE_CLASS = "room-control-drop-with-under-line";
+export declare const CHECKBOX_WRAPPER_CLASS = "security-drop-menu-checkbox";
+export declare const createCheckboxMenuItem: (key: string, label: string, checked: boolean | undefined, type?: "primary" | "danger" | "title" | "disabled" | "group", onButtonClick?: () => void, classNames?: string) => FcrDropMenuOption;

package/lib/modules/participant/components/drop-menu/util.js

@@ -0,0 +1,28 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createCheckboxMenuItem = exports.UNDERLINE_CLASS = exports.CHECKBOX_WRAPPER_CLASS = exports.CHECKBOX_STYLE_TYPE = void 0;
+var _checkbox = require("agora-ui-foundation/lib/components/checkbox");
+var _jsxRuntime = require("react/jsx-runtime");
+var CHECKBOX_STYLE_TYPE = exports.CHECKBOX_STYLE_TYPE = 'white';
+var UNDERLINE_CLASS = exports.UNDERLINE_CLASS = 'room-control-drop-with-under-line';
+var CHECKBOX_WRAPPER_CLASS = exports.CHECKBOX_WRAPPER_CLASS = 'security-drop-menu-checkbox';
+
+// 封装创建复选框菜单项的函数
+var createCheckboxMenuItem = exports.createCheckboxMenuItem = function createCheckboxMenuItem(key, label, checked, type, onButtonClick) {
+  var classNames = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : '';
+  return {
+    title: /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
+      checked: checked,
+      label: label,
+      styleType: CHECKBOX_STYLE_TYPE
+    }),
+    key: key,
+    type: type,
+    classNames: classNames,
+    onButtonClick: onButtonClick
+  };
+};

package/lib/modules/participant/components/participants/components/footer/components/buttons.d.ts

@@ -0,0 +1,6 @@
+import { OperateWaitingRoomMemberDialogProps } from '../../../../../type';
+type ParticipantWaitingRoomFooterBtnListProps = {
+    openRemoveAdmitWaitingRoomDialog: (params: OperateWaitingRoomMemberDialogProps) => void;
+};
+declare const ParticipantWaitingRoomFooterBtnList: ({ openRemoveAdmitWaitingRoomDialog, }: ParticipantWaitingRoomFooterBtnListProps) => import("react/jsx-runtime").JSX.Element;
+export default ParticipantWaitingRoomFooterBtnList;

package/lib/modules/participant/components/participants/components/footer/components/buttons.js

@@ -0,0 +1,52 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
+var _button = require("agora-ui-foundation/lib/components/button");
+var _jsxRuntime = require("react/jsx-runtime");
+var ParticipantWaitingRoomFooterBtnList = function ParticipantWaitingRoomFooterBtnList(_ref) {
+  var openRemoveAdmitWaitingRoomDialog = _ref.openRemoveAdmitWaitingRoomDialog;
+  var t = (0, _i18n.useI18n)();
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "fcr-participant__footer fcr-participant__footer_waiting_room",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+      content: t('fmt_waitingroom_sidebar_button_removeall'),
+      mouseEnterDelay: 0,
+      trigger: "hover",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
+        type: "secondary-bordered",
+        size: "XS",
+        onClick: function onClick() {
+          openRemoveAdmitWaitingRoomDialog({
+            title: t('fmt_waitingroom_sidebar_popup_removeall'),
+            type: 'removeAll',
+            tooltip: t('fmt_waitingroom_mobile_memberlist_popup_label_sure_to_remove_all')
+          });
+        },
+        children: t('fmt_waitingroom_sidebar_button_removeall')
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+      content: t('fmt_waitingroom_sidebar_button_admitall'),
+      mouseEnterDelay: 0,
+      trigger: "hover",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
+        type: "secondary-bordered",
+        size: "XS",
+        onClick: function onClick() {
+          openRemoveAdmitWaitingRoomDialog({
+            title: t('fmt_waitingroom_mobile_memberlist_popup_label_admit_all'),
+            type: 'admitAll',
+            tooltip: t('fmt_waitingroom_mobile_memberlist_popup_label_sure_to_admit_all')
+          });
+        },
+        children: t('fmt_waitingroom_sidebar_button_admitall')
+      })
+    })]
+  });
+};
+var _default = exports["default"] = ParticipantWaitingRoomFooterBtnList;

package/lib/modules/participant/components/participants/components/footer/components/drop-menu/index.css

@@ -0,0 +1,60 @@
+.room-control-drop-with-under-line {
+  position: relative;
+  /* margin: 8px 0; */
+}
+.room-control-options-box {
+  display: flex;
+  justify-content: space-between;
+}
+.room-control-options-box .fcr-checkbox {
+  width: fit-content;
+}
+
+.room-control-options-watermark-btns {
+  min-width: 104px;
+  height: 24px;
+  display: flex;
+  background-color: var(--fcr_mobile_ui_scene_fill1);
+  align-items: center;
+  padding: 2px;
+  margin-left: 80px;
+}
+
+.room-control-options-watermark-btn {
+  min-width: 50px;
+  height: 20px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: var(--fcr_ui_scene_icontext1);
+  font-size: 12px;
+  background-color: transparent;
+  padding: 0px 4px;
+  width: auto !important;
+  border-radius: var(--fcr_cornerradius_xxs);
+}
+.room-control-options-watermark-btn--active {
+  background-color: #ffffff;
+  color: var(--fcr_ui_scene_ramp_brand6);
+}
+
+.room-control-options-watermark-title-box {
+  display: flex;
+  align-items: center;
+  font-size: 13px;
+}
+
+.room-control-drop-with-under-line::after {
+  content: '';
+  position: absolute;
+  left: -10px;
+  right: -10px;
+  bottom: -12px;
+  border-top: 1px solid var(--fcr_ui_scene_line1);
+  margin: 8px 0;
+}
+
+.room-control-drop-disable {
+  opacity: 0.5;
+  cursor: not-allowed;
+}

package/lib/modules/participant/components/participants/components/footer/components/drop-menu/index.d.ts

@@ -0,0 +1,2 @@
+import './index.css';
+export declare const RoomControlDropMenu: () => import("react/jsx-runtime").JSX.Element;

package/lib/modules/participant/components/participants/components/footer/components/drop-menu/index.js

@@ -0,0 +1,166 @@
+"use strict";
+
+require("core-js/modules/es.symbol.js");
+require("core-js/modules/es.array.for-each.js");
+require("core-js/modules/es.array.push.js");
+require("core-js/modules/es.object.define-properties.js");
+require("core-js/modules/es.object.define-property.js");
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+require("core-js/modules/es.object.keys.js");
+require("core-js/modules/esnext.async-iterator.for-each.js");
+require("core-js/modules/esnext.iterator.for-each.js");
+require("core-js/modules/web.dom-collections.for-each.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RoomControlDropMenu = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+require("core-js/modules/es.array.filter.js");
+require("core-js/modules/es.array.map.js");
+require("core-js/modules/es.array.unshift.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.map.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.map.js");
+var _dropMenu = require("agora-ui-foundation/lib/components/drop-menu");
+var _mobxReact = require("mobx-react");
+var _react = require("react");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+require("./index.css");
+var _util = require("./util");
+var _icon = require("agora-ui-foundation/lib/components/icon");
+var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _store = require("../../../../../../store");
+var _constant = require("../../../../../../../../utilities/constant");
+var _fcrCore = require("fcr-core");
+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; }
+var RoomControlDropMenu = exports.RoomControlDropMenu = (0, _mobxReact.observer)(function () {
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
+    allowUnmuteSelfAudio = _useContext.allowUnmuteSelfAudio,
+    allowJoinWithMuteAudio = _useContext.allowJoinWithMuteAudio,
+    isLockRoomEnabled = _useContext.isLockRoomEnabled,
+    isWaitingRoomEnabled = _useContext.isWaitingRoomEnabled,
+    allowChangeSelfName = _useContext.allowChangeSelfName,
+    allowUnmuteSelfVideo = _useContext.allowUnmuteSelfVideo,
+    handlerRoomControlAction = _useContext.handlerRoomControlAction,
+    hasRevokeHostPermission = _useContext.hasRevokeHostPermission,
+    localUserRole = _useContext.localUserRole,
+    showBecomeHostButton = _useContext.showBecomeHostButton,
+    isHostKeyEnabled = _useContext.isHostKeyEnabled;
+  var t = (0, _i18n.useI18n)();
+
+  // 定义所有操作项
+  var allActions = [{
+    type: 'title',
+    title: t('fmt_internalsetting_other_join'),
+    key: ''
+  },
+  // createCheckboxMenuItem(
+  //   'mute_all',
+  //   t('fmt_security_buttons_allhandsdown'),
+  //   false,
+  //   'disabled',
+  //   () => {},
+  //   UNDERLINE_CLASS
+  // ),
+  (0, _util.createCheckboxMenuItem)('join_room_with_mute', t('fmt_security_options_silence'), allowJoinWithMuteAudio, 'primary', function () {
+    return handlerRoomControlAction(_constant.FcrUIRoomControlType.JOIN_WITH_MUTE_AUDIO, !allowJoinWithMuteAudio);
+  }, ''),
+  // createCheckboxMenuItem(
+  //   'play_join_leave_sound',
+  //   t('fmt_security_options_playnotification'),
+  //   false,
+  //   'disabled',
+  //   () => handlerRoomControlAction(FcrUIRoomControlType.PLAY_JOIN_LEAVE_SOUND),
+  //   ''
+  // ),
+  (0, _util.createCheckboxMenuItem)('lock_room', t('fmt_screenshare_controlbar_security_list_lock'), isLockRoomEnabled, 'primary', function () {
+    return handlerRoomControlAction(_constant.FcrUIRoomControlType.LOCK_ROOM, !isLockRoomEnabled);
+  }, ''),
+  // createCheckboxMenuItem(
+  //   'enable_waiting_room',
+  //   t('fmt_screenshare_options_allow'),
+  //   isWaitingRoomEnabled,
+  //   'disabled',
+  //   () =>
+  //     handlerRoomControlAction(FcrUIRoomControlType.ENABLE_WAITING_ROOM, !isWaitingRoomEnabled),
+  //   UNDERLINE_CLASS
+  // ),
+  {
+    type: 'line',
+    title: '',
+    key: ''
+  }, {
+    title: t('fmt_screenshare_options_allow'),
+    key: 'allow_attendee_title',
+    type: 'title'
+  }, (0, _util.createCheckboxMenuItem)('unmute_yourself', t('fmt_screenshare_controlbar_security_list_participant_unmute'), allowUnmuteSelfAudio, 'primary', function () {
+    return handlerRoomControlAction(_constant.FcrUIRoomControlType.ALLOW_ATTENDEE_TO_UNMUTE, !allowUnmuteSelfAudio);
+  }, ''), (0, _util.createCheckboxMenuItem)('start_video', t('fmt_security_options_openvideo'), allowUnmuteSelfVideo, 'primary', function () {
+    return handlerRoomControlAction(_constant.FcrUIRoomControlType.ALLOW_ATTENDEE_TO_OPEN_CAMERA, !allowUnmuteSelfVideo);
+  }, ''), (0, _util.createCheckboxMenuItem)('change_name', t('fmt_additional_label_change_name_self'), allowChangeSelfName, 'primary', function () {
+    return handlerRoomControlAction(_constant.FcrUIRoomControlType.RENAME, !allowChangeSelfName);
+  }, '')
+  // 移除参与者项暂时注释
+  // createCheckboxMenuItem(
+  //   'remove_participants',
+  //   'fmt_security_options_removemultiple',
+  //   false,
+  //   'danger',
+  //   () => {},
+  //   'room-control-drop-disable'
+  // )
+  ];
+
+  // 如果有撤销主持人权限，添加撤销主持人菜单项
+  if (hasRevokeHostPermission) {
+    allActions.unshift((0, _util.createCheckboxMenuItem)('revoke_host', t('fmt_security_options_restract'), false, 'primary', function () {
+      return handlerRoomControlAction(_constant.FcrUIRoomControlType.REVOKE_HOST);
+    }, _util.UNDERLINE_CLASS));
+  }
+  if (localUserRole === _fcrCore.FcrUserRole.COHOST && showBecomeHostButton && isHostKeyEnabled) {
+    allActions.unshift({
+      type: 'primary',
+      title: t('fmt_hostkey_participant_button_claim_host'),
+      key: 'become_host',
+      onButtonClick: function onButtonClick() {
+        handlerRoomControlAction(_constant.FcrUIRoomControlType.ACTION_REVOKE_HOST_BY_TICKET, !hasRevokeHostPermission);
+      },
+      icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+        type: _type.FcrIconType.FCR_HOST,
+        size: 24,
+        colors: {
+          iconPrimary: 'var(--fcr_ui_scene_icontext1)'
+        }
+      })
+    }, {
+      type: 'line',
+      title: '',
+      key: ''
+    });
+  }
+
+  // 过滤掉禁用的项，并处理主要类型的项
+  var filteredActions = allActions.filter(function (action) {
+    return action.type !== 'disabled';
+  }).map(function (action) {
+    if (action.type === 'primary') {
+      return _objectSpread(_objectSpread({}, action), {}, {
+        title: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: _util.CHECKBOX_WRAPPER_CLASS,
+          children: action.title
+        })
+      });
+    }
+    return action;
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_dropMenu.FcrDropMenu, {
+    options: filteredActions
+  });
+});

package/lib/modules/participant/components/participants/components/footer/components/drop-menu/util.d.ts

@@ -0,0 +1,5 @@
+import { FcrDropMenuOption } from 'agora-ui-foundation/lib/components/drop-menu';
+export declare const CHECKBOX_STYLE_TYPE = "white";
+export declare const UNDERLINE_CLASS = "room-control-drop-with-under-line";
+export declare const CHECKBOX_WRAPPER_CLASS = "security-drop-menu-checkbox";
+export declare const createCheckboxMenuItem: (key: string, label: string, checked: boolean | undefined, type?: "primary" | "danger" | "title" | "disabled" | "group", onButtonClick?: () => void, classNames?: string) => FcrDropMenuOption;

package/lib/modules/participant/components/participants/components/footer/components/drop-menu/util.js

@@ -0,0 +1,28 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createCheckboxMenuItem = exports.UNDERLINE_CLASS = exports.CHECKBOX_WRAPPER_CLASS = exports.CHECKBOX_STYLE_TYPE = void 0;
+var _checkbox = require("agora-ui-foundation/lib/components/checkbox");
+var _jsxRuntime = require("react/jsx-runtime");
+var CHECKBOX_STYLE_TYPE = exports.CHECKBOX_STYLE_TYPE = 'white';
+var UNDERLINE_CLASS = exports.UNDERLINE_CLASS = 'room-control-drop-with-under-line';
+var CHECKBOX_WRAPPER_CLASS = exports.CHECKBOX_WRAPPER_CLASS = 'security-drop-menu-checkbox';
+
+// 封装创建复选框菜单项的函数
+var createCheckboxMenuItem = exports.createCheckboxMenuItem = function createCheckboxMenuItem(key, label, checked, type, onButtonClick) {
+  var classNames = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : '';
+  return {
+    title: /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
+      checked: checked,
+      label: label,
+      styleType: CHECKBOX_STYLE_TYPE
+    }),
+    key: key,
+    type: type,
+    classNames: classNames,
+    onButtonClick: onButtonClick
+  };
+};

package/lib/modules/participant/components/participants/components/footer/components/footer/index.css

@@ -0,0 +1,13 @@
+.fcr-participant__footer-placeholder {
+  flex: 30%;
+}
+.footer-more-actions {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  padding: 0 1rem;
+  height: 100%;
+}
+.fcr-participant__footer-creator button {
+  flex: 1;
+}

package/lib/modules/participant/components/participants/components/footer/components/footer/index.d.ts

@@ -0,0 +1,5 @@
+import './index.css';
+import { ParticipantsFooterParticipantProps, ParticipantsHostFooterProps } from '../../../../types';
+export declare const FcrParticipantsFooter: (props: ParticipantsHostFooterProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FcrParticipantsFooterRename: ({ onRoomControlClick, }: ParticipantsFooterParticipantProps) => import("react/jsx-runtime").JSX.Element;
+export declare const FcrParticipantsFooterWithRevokeHost: ({ type, onRoomControlClick, }: ParticipantsFooterParticipantProps) => import("react/jsx-runtime").JSX.Element;