fcr-ui-scene 3.4.2 → 3.4.4

package/lib/modules/components/member-window/components/member-actions/components/layout/index.js

@@ -0,0 +1,42 @@
+"use strict";
+
+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.to-string.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.MemberActionsLayout = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _provider = require("../../provider");
+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; }
+var MemberActionsLayout = exports.MemberActionsLayout = /*#__PURE__*/_react["default"].memo(function (_ref) {
+  var headerSlot = _ref.headerSlot,
+    topSlot = _ref.topSlot,
+    bottomSlot = _ref.bottomSlot,
+    onContextMenu = _ref.onContextMenu,
+    customClassName = _ref.customClassName;
+  var store = (0, _provider.useMemberWindowActionsStore)();
+  var handleContextMenu = (0, _react.useCallback)(function (e) {
+    e.preventDefault();
+    onContextMenu === null || onContextMenu === void 0 || onContextMenu();
+  }, [onContextMenu]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classnames["default"])('fcr-member-window__actions-container', customClassName, {
+      'fcr-member-window__actions-container-hidden': store.isOnlyShowVideoStream
+    }),
+    onContextMenu: handleContextMenu,
+    children: [headerSlot, topSlot, bottomSlot]
+  });
+});

package/lib/modules/components/member-window/components/member-actions/components/more-actions.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { FcrRoomConnectorType } from 'fcr-core';
+export declare const meetingConnectorTypes: Set<FcrRoomConnectorType>;
+export interface ActionsTopProps {
+    isShowActionAudio: boolean;
+    actionAudioTag: string;
+    hasPinnedStream: boolean;
+    meetingConnectorTypes: Set<FcrRoomConnectorType>;
+    allowedOperations: string[];
+}
+export declare const MoreActions: React.FC<ActionsTopProps>;

package/lib/modules/components/member-window/components/member-actions/components/more-actions.js

@@ -0,0 +1,159 @@
+"use strict";
+
+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.weak-map.js");
+require("core-js/modules/esnext.weak-map.delete-all.js");
+require("core-js/modules/esnext.weak-map.emplace.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.meetingConnectorTypes = exports.MoreActions = void 0;
+require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/es.set.js");
+require("core-js/modules/es.string.iterator.js");
+require("core-js/modules/esnext.set.add-all.js");
+require("core-js/modules/esnext.set.delete-all.js");
+require("core-js/modules/esnext.set.difference.v2.js");
+require("core-js/modules/esnext.set.difference.js");
+require("core-js/modules/esnext.set.every.js");
+require("core-js/modules/esnext.set.filter.js");
+require("core-js/modules/esnext.set.find.js");
+require("core-js/modules/esnext.set.intersection.v2.js");
+require("core-js/modules/esnext.set.intersection.js");
+require("core-js/modules/esnext.set.is-disjoint-from.v2.js");
+require("core-js/modules/esnext.set.is-disjoint-from.js");
+require("core-js/modules/esnext.set.is-subset-of.v2.js");
+require("core-js/modules/esnext.set.is-subset-of.js");
+require("core-js/modules/esnext.set.is-superset-of.v2.js");
+require("core-js/modules/esnext.set.is-superset-of.js");
+require("core-js/modules/esnext.set.join.js");
+require("core-js/modules/esnext.set.map.js");
+require("core-js/modules/esnext.set.reduce.js");
+require("core-js/modules/esnext.set.some.js");
+require("core-js/modules/esnext.set.symmetric-difference.v2.js");
+require("core-js/modules/esnext.set.symmetric-difference.js");
+require("core-js/modules/esnext.set.union.v2.js");
+require("core-js/modules/esnext.set.union.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+var _react = _interopRequireWildcard(require("react"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
+var _popover = require("agora-ui-foundation/lib/components/popover");
+var _icon = require("agora-ui-foundation/lib/components/icon");
+var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _participantsMore = require("agora-ui-foundation/lib/components/participants/participants-more");
+var _fcrCore = require("fcr-core");
+var _provider = require("../provider");
+var _type2 = require("fcr-core/lib/type");
+var _mobxReact = require("mobx-react");
+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; }
+var meetingConnectorTypes = exports.meetingConnectorTypes = new Set([_fcrCore.FcrRoomConnectorType.SIP, _fcrCore.FcrRoomConnectorType.H323]);
+var EMPTY_HIDE_ACTIONS = [];
+var MoreActions = exports.MoreActions = (0, _mobxReact.observer)(function (_ref) {
+  var isShowActionAudio = _ref.isShowActionAudio,
+    actionAudioTag = _ref.actionAudioTag,
+    hasPinnedStream = _ref.hasPinnedStream,
+    meetingConnectorTypes = _ref.meetingConnectorTypes,
+    allowedOperations = _ref.allowedOperations;
+  var t = (0, _i18n.useI18n)();
+  var store = (0, _provider.useMemberWindowActionsStore)();
+  var onVisibleChange = function onVisibleChange(visible) {
+    store.onVisibleChange(visible);
+  };
+  var onMuteAudio = function onMuteAudio() {
+    store.muteAudio(store.hasMicrophoneAudioStream, store.userId);
+  };
+  var userData = (0, _react.useMemo)(function () {
+    var _ref2 = store.windowData || {},
+      userId = _ref2.userId,
+      userName = _ref2.userName,
+      ownerRoleType = _ref2.ownerRoleType,
+      isMySelf = _ref2.isMySelf,
+      hasVideoStream = _ref2.hasVideoStream,
+      hasMicrophoneAudioStream = _ref2.hasMicrophoneAudioStream,
+      isPin = _ref2.isPin,
+      audioStreamConnectorType = _ref2.audioStreamConnectorType,
+      videoStreamConnectorType = _ref2.videoStreamConnectorType;
+    var connectorType = audioStreamConnectorType !== _fcrCore.FcrRoomConnectorType.NONE ? audioStreamConnectorType : videoStreamConnectorType;
+    var isPhone = connectorType === _fcrCore.FcrRoomConnectorType.PSTN;
+    var isMeeting = meetingConnectorTypes.has(connectorType);
+    var userType = audioStreamConnectorType === _fcrCore.FcrRoomConnectorType.PSTN && !hasVideoStream ? 'phone' : isMeeting ? 'meeting-system' : 'normal';
+    var isHost = ownerRoleType === _type2.FcrUserRole.HOST;
+    var audioDeviceType = isPhone ? 'phone-mic' : 'computer-mic';
+    return {
+      userId: userId,
+      userName: userName,
+      isMe: isMySelf,
+      userRole: ownerRoleType,
+      hasAudio: hasMicrophoneAudioStream,
+      hasVideo: hasVideoStream,
+      isPin: isPin,
+      audioDeviceType: audioDeviceType,
+      userType: userType,
+      isHost: isHost,
+      allowedOperations: allowedOperations
+    };
+  }, [store.windowData, allowedOperations]);
+  var onParticipantsButtonClick = (0, _react.useCallback)(function (action, userId) {
+    store.sendParticipantEvent({
+      action: action,
+      userId: userId
+    });
+  }, [store]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classnames["default"])('fcr-user-window-actions-top', {
+      'fcr-user-window-actions-top-active': store.isShowDropMenu
+    }),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+      content: t('fmt_participants_member_button_more'),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_popover.FcrPopover, {
+        showArrow: true,
+        placement: "bottomLeft",
+        trigger: "click",
+        visible: store.isShowDropMenu,
+        onVisibleChange: onVisibleChange,
+        overlayInnerStyle: {
+          border: 0,
+          boxShadow: '0px 0px 15px var(--fcr_web_light_dropup_m)',
+          borderRadius: 'var(--fcr_cornerradius_l)',
+          minWidth: '210px',
+          maxWidth: '300px',
+          width: 'fit-content'
+        },
+        overlayClassName: "member-window-actions__more-actions",
+        mouseEnterDelay: 0,
+        content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_participantsMore.FcrParticipantsMoreActions, {
+          user: userData,
+          onParticipantsButtonClick: onParticipantsButtonClick,
+          hasPinnedStream: hasPinnedStream,
+          hideActions: EMPTY_HIDE_ACTIONS
+        }),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+          className: "fcr-user-window-actions-more",
+          onClick: function onClick() {
+            onVisibleChange(true);
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+            type: _type.FcrIconType.FCR_MOBILE_MORE,
+            size: 20,
+            colors: {
+              iconPrimary: 'currentColor'
+            }
+          })
+        })
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+      className: "fcr-user-window-actions-mute",
+      disabled: !isShowActionAudio,
+      onClick: onMuteAudio,
+      children: t(actionAudioTag)
+    })]
+  });
+});

package/lib/modules/components/member-window/components/member-actions/components/share-status.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ShareStatus: React.FC;

package/lib/modules/components/member-window/components/member-actions/components/share-status.js

@@ -0,0 +1,32 @@
+"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.ShareStatus = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _provider = require("../provider");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _type = require("../../../../../../type");
+var _jsxRuntime = require("react/jsx-runtime");
+var ShareStatus = exports.ShareStatus = function ShareStatus() {
+  var store = (0, _provider.useMemberWindowActionsStore)();
+  var t = (0, _i18n.useI18n)();
+  var windowData = store.windowData,
+    hasScreenSharing = store.hasScreenSharing;
+  if (windowData.type === _type.FcrUIWindowType.BOARD) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: t('fmt_screenshare_whiteboard_tips_someonesharing', {
+        reason1: ''
+      })
+    });
+  }
+  if (hasScreenSharing && windowData.type === _type.FcrUIWindowType.VIDEO) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: t('fmt_screenshare_status_sharing')
+    });
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});
+};

package/lib/modules/components/member-window/components/member-actions/components/user-info.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+export interface UserInfoProps {
+    iconSize: number;
+    windowSize: 'large' | 'normal';
+    showActionBottomLabel: boolean;
+    showRotation: boolean;
+    renderListLength?: number;
+    allowedOperations: string[];
+    interpreterUserList: any[] | null;
+    isInterpreterEnabled: boolean;
+    setVideoOrientation: () => void;
+    meetingConnectorTypes: Set<any>;
+    id: string | undefined;
+    volume: number;
+}
+export declare const UserInfo: React.FC<UserInfoProps>;

package/lib/modules/components/member-window/components/member-actions/components/user-info.js

@@ -0,0 +1,130 @@
+"use strict";
+
+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.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.UserInfo = void 0;
+require("core-js/modules/es.array.find.js");
+require("core-js/modules/es.array.includes.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/es.string.includes.js");
+require("core-js/modules/esnext.async-iterator.find.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.find.js");
+var _react = _interopRequireWildcard(require("react"));
+var _mobxReact = require("mobx-react");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _fcrCore = require("fcr-core");
+var _localVideoPlayer = require("agora-ui-foundation/lib/components/local-video-player");
+var _provider = require("../provider");
+var _userTag = require("./user-tag");
+var _audioControl = require("./audio-control");
+var _shareStatus = require("./share-status");
+var _iconButtons = require("./icon-buttons");
+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; }
+var UserInfo = exports.UserInfo = (0, _mobxReact.observer)(function (_ref) {
+  var iconSize = _ref.iconSize,
+    windowSize = _ref.windowSize,
+    showActionBottomLabel = _ref.showActionBottomLabel,
+    showRotation = _ref.showRotation,
+    _ref$renderListLength = _ref.renderListLength,
+    renderListLength = _ref$renderListLength === void 0 ? 0 : _ref$renderListLength,
+    allowedOperations = _ref.allowedOperations,
+    interpreterUserList = _ref.interpreterUserList,
+    isInterpreterEnabled = _ref.isInterpreterEnabled,
+    _setVideoOrientation = _ref.setVideoOrientation,
+    meetingConnectorTypes = _ref.meetingConnectorTypes,
+    id = _ref.id,
+    volume = _ref.volume;
+  var t = (0, _i18n.useI18n)();
+  var store = (0, _provider.useMemberWindowActionsStore)();
+  var userId = store.userId,
+    ownerRoleType = store.ownerRoleType,
+    isMySelf = store.isMySelf,
+    connectorType = store.connectorType,
+    hasScreenSharing = store.hasScreenSharing,
+    isManager = store.isManager,
+    userName = store.userName,
+    handleRename = store.handleRename,
+    hasVideoStream = store.hasVideoStream,
+    hasLoopbackAudioStream = store.hasLoopbackAudioStream;
+  var interpreter = (0, _react.useMemo)(function () {
+    return !!(interpreterUserList !== null && interpreterUserList !== void 0 && interpreterUserList.find(function (ele) {
+      return ele.userId === userId;
+    }));
+  }, [interpreterUserList, userId]);
+  var insideShow = ![_fcrCore.FcrUserRole.COHOST, _fcrCore.FcrUserRole.HOST].includes(ownerRoleType);
+  var isShowInterpreterTag = interpreter && isInterpreterEnabled;
+  var isMeTag = isMySelf ? t('fmt_attendies_labels_setting_mine') : '';
+  var isMeeting = meetingConnectorTypes.has(connectorType);
+  var interpreterTagDom = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+    children: t('fmt_ai_transcriptions_setting_label_translator')
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classnames["default"])('fcr-user-window-actions-bottom', {
+      'fcr-user-window-actions-bottom-show': showActionBottomLabel
+    }),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: (0, _classnames["default"])('fcr-user-window-actions-bottom-layout'),
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButtons.ShareScreenIconButton, {
+        hasScreenSharing: hasScreenSharing,
+        windowSize: windowSize
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButtons.ShareSoundIconButton, {
+        hasScreenSharing: hasScreenSharing,
+        windowSize: windowSize,
+        hasLoopbackAudioStream: hasLoopbackAudioStream
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "fcr-user-window-actions-bottom-layout-info",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_userTag.UserTag, {
+          iconSize: iconSize,
+          windowSize: windowSize,
+          isShowInterpreterTag: isShowInterpreterTag,
+          meetingConnectorTypes: meetingConnectorTypes,
+          id: id,
+          volume: volume,
+          insideShow: insideShow,
+          interpreterTagDom: interpreterTagDom
+        }), windowSize !== 'large' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_audioControl.AudioControl, {
+          isMeeting: isMeeting,
+          iconSize: iconSize
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: (0, _classnames["default"])('fcr-user-window-actions-name', {
+            'ml-5': isManager || isShowInterpreterTag
+          }),
+          children: userName
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: "fcr-user-window-actions-name-isme",
+          children: isMeTag
+        }), isMeTag && allowedOperations.includes('change_name') && /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButtons.RenameTagIconButton, {
+          onClick: function onClick() {
+            return handleRename(userId);
+          }
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          className: "fcr-user-window-actions-name-doing",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_shareStatus.ShareStatus, {})
+        })]
+      })]
+    }), !insideShow && !store.isManager && /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButtons.InterpreterTag, {
+      isShow: isShowInterpreterTag,
+      className: "fcr-user-window-actions-bottom-interpreter-tag",
+      windowSize: windowSize
+    }), windowSize === 'large' && isMySelf && hasVideoStream && showRotation && renderListLength === 1 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_localVideoPlayer.VideoOrientation, {
+      setVideoOrientation: function setVideoOrientation() {
+        _setVideoOrientation();
+      }
+    })]
+  });
+});

package/lib/modules/components/member-window/components/member-actions/components/user-tag.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface UserTagProps {
+    windowSize: 'large' | 'normal';
+    iconSize: number;
+    isShowInterpreterTag: boolean;
+    meetingConnectorTypes: Set<any>;
+    id: string | undefined;
+    volume: number;
+    insideShow: boolean;
+    interpreterTagDom: React.ReactNode;
+}
+export declare const UserTag: React.FC<UserTagProps>;

package/lib/modules/components/member-window/components/member-actions/components/user-tag.js

@@ -0,0 +1,57 @@
+"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.UserTag = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _provider = require("../provider");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _iconButtons = require("./icon-buttons");
+var _fcrCore = require("fcr-core");
+var _iconStatus = require("./icon-status");
+var _jsxRuntime = require("react/jsx-runtime");
+var UserTag = exports.UserTag = function UserTag(_ref) {
+  var iconSize = _ref.iconSize,
+    windowSize = _ref.windowSize,
+    isShowInterpreterTag = _ref.isShowInterpreterTag,
+    meetingConnectorTypes = _ref.meetingConnectorTypes,
+    id = _ref.id,
+    volume = _ref.volume,
+    insideShow = _ref.insideShow,
+    interpreterTagDom = _ref.interpreterTagDom;
+  var store = (0, _provider.useMemberWindowActionsStore)();
+  var isManager = store.isManager,
+    ownerRoleType = store.ownerRoleType;
+  var t = (0, _i18n.useI18n)();
+  if (windowSize === 'large') {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_iconButtons.ActionsTagIconButton, {
+      hostTag: isManager || isShowInterpreterTag,
+      coHostTag: ownerRoleType === _fcrCore.FcrUserRole.COHOST,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_iconStatus.IconStatus, {
+        windowSize: windowSize,
+        iconSize: iconSize,
+        meetingConnectorTypes: meetingConnectorTypes,
+        id: id,
+        volume: volume
+      }), ownerRoleType === _fcrCore.FcrUserRole.HOST && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: t('fmt_role_host')
+      }), ownerRoleType === _fcrCore.FcrUserRole.COHOST && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: t('fmt_role_cohost')
+      }), insideShow && isShowInterpreterTag && interpreterTagDom]
+    });
+  }
+  return isManager ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButtons.ActionsTagIconButton, {
+    hostTag: isManager || isShowInterpreterTag,
+    coHostTag: ownerRoleType === _fcrCore.FcrUserRole.COHOST,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      children: t(ownerRoleType === _fcrCore.FcrUserRole.HOST ? 'fmt_role_host' : 'fmt_role_cohost')
+    })
+  }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButtons.InterpreterTag, {
+    isShow: isShowInterpreterTag,
+    className: "fcr-user-window-actions-tag",
+    windowSize: windowSize
+  });
+};

package/lib/modules/components/member-window/components/member-actions/index.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { MemberWindowActionsProps } from '../../types';
+export declare const MemberWindowActions: FC<MemberWindowActionsProps>;

package/lib/modules/components/member-window/components/member-actions/index.js

@@ -0,0 +1,122 @@
+"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.MemberWindowActions = void 0;
+require("core-js/modules/es.array.find.js");
+require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/es.set.js");
+require("core-js/modules/es.string.iterator.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");
+require("core-js/modules/esnext.set.add-all.js");
+require("core-js/modules/esnext.set.delete-all.js");
+require("core-js/modules/esnext.set.difference.v2.js");
+require("core-js/modules/esnext.set.difference.js");
+require("core-js/modules/esnext.set.every.js");
+require("core-js/modules/esnext.set.filter.js");
+require("core-js/modules/esnext.set.find.js");
+require("core-js/modules/esnext.set.intersection.v2.js");
+require("core-js/modules/esnext.set.intersection.js");
+require("core-js/modules/esnext.set.is-disjoint-from.v2.js");
+require("core-js/modules/esnext.set.is-disjoint-from.js");
+require("core-js/modules/esnext.set.is-subset-of.v2.js");
+require("core-js/modules/esnext.set.is-subset-of.js");
+require("core-js/modules/esnext.set.is-superset-of.v2.js");
+require("core-js/modules/esnext.set.is-superset-of.js");
+require("core-js/modules/esnext.set.join.js");
+require("core-js/modules/esnext.set.map.js");
+require("core-js/modules/esnext.set.reduce.js");
+require("core-js/modules/esnext.set.some.js");
+require("core-js/modules/esnext.set.symmetric-difference.v2.js");
+require("core-js/modules/esnext.set.symmetric-difference.js");
+require("core-js/modules/esnext.set.union.v2.js");
+require("core-js/modules/esnext.set.union.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+var _react = _interopRequireDefault(require("react"));
+var _provider = require("./provider");
+var _index = require("./components/layout/index");
+var _moreActions = require("./components/more-actions");
+var _userInfo = require("./components/user-info");
+var _iconButtons = require("./components/icon-buttons");
+var _fcrCore = require("fcr-core");
+var _jsxRuntime = require("react/jsx-runtime");
+var meetingConnectorTypes = new Set([_fcrCore.FcrRoomConnectorType.SIP, _fcrCore.FcrRoomConnectorType.H323]);
+var MemberWindowActions = exports.MemberWindowActions = function MemberWindowActions(_ref) {
+  var windowData = _ref.windowData,
+    iconSize = _ref.iconSize,
+    windowSize = _ref.windowSize,
+    sendParticipantEvent = _ref.sendParticipantEvent,
+    muteAudio = _ref.muteAudio,
+    hasPinnedStream = _ref.hasPinnedStream,
+    allowedOperations = _ref.allowedOperations,
+    setVideoOrientation = _ref.setVideoOrientation,
+    showActionBottomLabel = _ref.showActionBottomLabel,
+    isShowActionAudio = _ref.isShowActionAudio,
+    actionAudioTag = _ref.actionAudioTag,
+    onVisibleChanged = _ref.onVisibleChanged,
+    videoWindowCurrentWidth = _ref.videoWindowCurrentWidth,
+    videoWindowCurrentHeight = _ref.videoWindowCurrentHeight,
+    videoWindowPreviewType = _ref.videoWindowPreviewType,
+    _ref$showRotation = _ref.showRotation,
+    showRotation = _ref$showRotation === void 0 ? true : _ref$showRotation,
+    interpreterUserList = _ref.interpreterUserList,
+    isInterpreterEnabled = _ref.isInterpreterEnabled,
+    handleRename = _ref.handleRename,
+    renderListLength = _ref.renderListLength,
+    id = _ref.id,
+    volume = _ref.volume;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_provider.MemberWindowActionsProvider, {
+    windowData: windowData,
+    sendParticipantEvent: sendParticipantEvent,
+    muteAudio: muteAudio,
+    handleRename: handleRename,
+    onVisibleChanged: onVisibleChanged,
+    interpreterUserList: interpreterUserList,
+    isInterpreterEnabled: isInterpreterEnabled,
+    videoWindowCurrentWidth: videoWindowCurrentWidth,
+    videoWindowCurrentHeight: videoWindowCurrentHeight,
+    videoWindowPreviewType: videoWindowPreviewType,
+    renderListLength: renderListLength,
+    children: function children(store) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.MemberActionsLayout, {
+        onContextMenu: function onContextMenu() {
+          return store.onVisibleChange(true);
+        },
+        headerSlot: store.isManager && /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButtons.InterpreterTag, {
+          isShow: !!(interpreterUserList !== null && interpreterUserList !== void 0 && interpreterUserList.find(function (ele) {
+            return ele.userId === store.userId;
+          })) && !!isInterpreterEnabled,
+          showActionBottomLabel: showActionBottomLabel,
+          windowSize: windowSize
+        }),
+        topSlot: /*#__PURE__*/(0, _jsxRuntime.jsx)(_moreActions.MoreActions, {
+          isShowActionAudio: isShowActionAudio,
+          actionAudioTag: actionAudioTag,
+          hasPinnedStream: hasPinnedStream,
+          meetingConnectorTypes: meetingConnectorTypes,
+          allowedOperations: allowedOperations
+        }),
+        bottomSlot: /*#__PURE__*/(0, _jsxRuntime.jsx)(_userInfo.UserInfo, {
+          iconSize: iconSize,
+          windowSize: windowSize,
+          showActionBottomLabel: showActionBottomLabel,
+          showRotation: showRotation,
+          renderListLength: renderListLength,
+          allowedOperations: allowedOperations,
+          interpreterUserList: interpreterUserList,
+          isInterpreterEnabled: isInterpreterEnabled,
+          id: id,
+          volume: volume,
+          setVideoOrientation: setVideoOrientation,
+          meetingConnectorTypes: meetingConnectorTypes
+        })
+      });
+    }
+  });
+};

package/lib/modules/components/member-window/components/member-actions/libs/index.d.ts

@@ -0,0 +1,2 @@
+import { FcrVideoWindowPreviewType } from '../../../../../video-window/type';
+export declare const handleVideoWindowVisibleChange: (width: number | undefined, height: number | undefined, setResizable: boolean, videoWindowPreviewType?: FcrVideoWindowPreviewType) => void;

package/lib/modules/components/member-window/components/member-actions/libs/index.js

@@ -0,0 +1,24 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.handleVideoWindowVisibleChange = void 0;
+var _constant = require("../../../../../../utilities/constant");
+var _dialogs = require("../../../../../dialog/dialogs");
+var _type = require("../../../../../video-window/type");
+var handleVideoWindowVisibleChange = exports.handleVideoWindowVisibleChange = function handleVideoWindowVisibleChange(width, height, setResizable, videoWindowPreviewType) {
+  var videoWindow = _dialogs.dialogWindows.get(_constant.FcrUIDialogKey.VIDEO_WINDOW);
+  if (!videoWindow) return;
+  var nearDispaly = window.runtime.screen.getDisplayNearestPoint(videoWindow.getBounds());
+  videoWindow.setBounds({
+    width: width,
+    height: height
+  });
+  if (videoWindowPreviewType === _type.FcrVideoWindowPreviewType.SMALL && setResizable) {
+    videoWindow.setResizable(true);
+  } else {
+    videoWindow.setResizable(false);
+  }
+};

package/lib/modules/components/member-window/components/member-actions/provider.d.ts

@@ -0,0 +1,21 @@
+import React, { FC } from 'react';
+import { MemberWindowActionsStore } from './store';
+import { FcrUIVideoWindowData } from '../../../../../type';
+import { FcrVideoWindowPreviewType } from '../../../../video-window/type';
+import { FcrInterpreterUserInfo } from 'fcr-core/lib/room-control/interpreter-control/types';
+export interface MemberWindowActionsProviderProps {
+    windowData: FcrUIVideoWindowData;
+    sendParticipantEvent: (event: any) => void;
+    muteAudio: (mute: boolean, userId: string) => void;
+    handleRename: (userId: string) => void;
+    onVisibleChanged?: (visible: boolean) => void;
+    interpreterUserList?: FcrInterpreterUserInfo[] | null;
+    isInterpreterEnabled?: boolean;
+    videoWindowCurrentWidth?: number;
+    videoWindowCurrentHeight?: number;
+    videoWindowPreviewType?: FcrVideoWindowPreviewType;
+    renderListLength?: number;
+    children: React.ReactNode | ((store: MemberWindowActionsStore) => React.ReactNode);
+}
+export declare const MemberWindowActionsProvider: FC<MemberWindowActionsProviderProps>;
+export declare const useMemberWindowActionsStore: () => MemberWindowActionsStore;