fcr-ui-scene 3.6.4-rc.1 → 3.7.0

package/lib/modules/setting/translate-settings/language-select.js

@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.LanguageSelect = void 0;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _i18n = require("agora-ui-foundation/lib/i18n");
 var _select = require("agora-ui-foundation/lib/components/select");
 var _mobxReact = require("mobx-react");
 var _icon = require("agora-ui-foundation/lib/components/icon");
@@ -20,7 +19,6 @@ var LanguageSelect = exports.LanguageSelect = (0, _mobxReact.observer)(function
     languageId = _ref.languageId,
     setLanguage = _ref.setLanguage,
     languageList = _ref.languageList;
-  var t = (0, _i18n.useI18n)();
   return languageList.length > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_select.FcrSelect, {
     options: (0, _toConsumableArray2["default"])(languageList),
     value: languageId,

package/lib/modules/setting/video-settings/video-settings-basic.js

@@ -29,11 +29,11 @@ var VideoSettingsBasic = exports.VideoSettingsBasic = (0, _mobxReact.observer)(f
     setting = _useContext.setting,
     setSetting = _useContext.setSetting,
     dialogConfig = _useContext.dialogConfig,
-    settingConfig = _useContext.settingConfig,
+    media = _useContext.media,
     changeMediaSetting = _useContext.changeMediaSetting;
   var activeTab = dialogConfig.activeTab,
     highlightSelector = dialogConfig.highlightSelector;
-  var _useState = (0, _react.useState)(settingConfig.media.cameraExpectedOff),
+  var _useState = (0, _react.useState)(media.cameraExpectedOff),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     cameraExpectedOff = _useState2[0],
     setCameraExpectedOff = _useState2[1];
@@ -96,11 +96,11 @@ var VideoSettingsBasic = exports.VideoSettingsBasic = (0, _mobxReact.observer)(f
       id: _constant.FcrUIHighlightElement.VIDEO_BASIC,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
         size: "small",
-        label: t('fmt_internalsetting_options_closevideojoin'),
-        checked: cameraExpectedOff,
+        label: t('fmt_premeeting_setting_label_turn_on_camera'),
+        checked: !cameraExpectedOff,
         onChange: function onChange(v) {
-          setCameraExpectedOff(v);
-          changeMediaSetting('cameraExpectedOff', v);
+          setCameraExpectedOff(!v);
+          changeMediaSetting('cameraExpectedOff', !v);
         }
       })
     }), (0, _env.isElectron)() && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {

package/lib/modules/setting/video-settings/video-settings.js

@@ -43,7 +43,7 @@ var VideoSettings = exports.VideoSettings = (0, _mobxReact.observer)(function (p
     containerDom = _useState2[0],
     setContainerDom = _useState2[1];
   var _useContext = (0, _react.useContext)(_store.StoreContext),
-    config = _useContext.config,
+    sceneConfig = _useContext.sceneConfig,
     toggleLocalMirror = _useContext.toggleLocalMirror,
     isLocalMirrorEnabled = _useContext.isLocalMirrorEnabled,
     isLocalEditBeautyOptions = _useContext.isLocalEditBeautyOptions,
@@ -115,7 +115,7 @@ var VideoSettings = exports.VideoSettings = (0, _mobxReact.observer)(function (p
       ref: containerRef,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_localVideoPlayer["default"], {
         isLocalMirrorEnabled: isLocalMirrorEnabled,
-        userName: (config === null || config === void 0 ? void 0 : config.userName) || '',
+        userName: sceneConfig.userName || '',
         showSlider: activeTab === 'beauty-filter' && isLocalEditBeautyOptions,
         handleResetBeautyValueChange: handleResetBeautyValueChange,
         currentEditValue: currentEditValue,

package/lib/modules/setting/view.js

@@ -30,7 +30,7 @@ var _state = _interopRequireDefault(require("./state"));
 var _audioSettings = _interopRequireDefault(require("./audio-settings/audio-settings"));
 var _videoSettings = _interopRequireDefault(require("./video-settings/video-settings"));
 var _generalSettings = _interopRequireDefault(require("./general-settings/general-settings"));
-var _preSetting = _interopRequireDefault(require("../dialog/components/pre-setting"));
+var _preSetting = _interopRequireDefault(require("../dialog/dialogs/pre-setting"));
 var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
 var _jsxRuntime = require("react/jsx-runtime");
 // import StorageSettings from './storage-settings/storage-settings';

package/lib/modules/share-screen/components/control-bar/index.css

@@ -0,0 +1,75 @@
+.fcr-screen-share-controlbar {
+  /* position: absolute;
+  top: 0;
+  left: 0; */
+  width: 100%;
+  height: 28px;
+  background-color: var(--fcr_web_ui_scene_fill2);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+  border-top: 2px solid var(--fcr_web_ui_scene_border1);
+  border-bottom: 4px solid var(--fcr_web_ui_scene_border1);
+  padding: 10px;
+}
+
+.fcr-screen-share-controlbar-left {
+  flex: 1;
+  justify-content: flex-end;
+  align-items: center;
+  display: flex;
+  font-weight: 400;
+  color: var(--fcr_ui_scene_icontext1);
+  font-size: 12px;
+}
+
+.fcr-screen-share-controlbar-center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  column-gap: 12px;
+  height: 20px;
+}
+
+.fcr-screen-share-controlbar-right {
+  flex: 1;
+}
+
+.fcr-screen-share-controlbar-right .fcr-button-XXS {
+  height: 20px;
+  padding: 0 5px;
+}
+
+.fcr-screen-share-controlbar-username {
+  margin-right: 10px;
+}
+
+.fcr-screen-share-annotation-exit-draw-btn {
+  margin-left: 12px;
+}
+
+.fcr-screen-share-annotation-exit-draw-btn p,
+.fcr-screen-share-annotation-exit-draw-btn div {
+  min-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.fcr-screen-share-controlbar-without-exit {
+  margin-left: 12px;
+  width: 20px;
+}
+
+.fcr-screen-share-annotation-toolbar-btn {
+  margin-left: 0px !important;
+  width: 80px !important;
+}
+
+.fcr-screen-share-annotation-toolbar-btn p {
+  width: 80px !important;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}

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

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

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

@@ -0,0 +1,88 @@
+"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;
+var _react = require("react");
+var _fcrCore = require("fcr-core");
+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 _mobxReact = require("mobx-react");
+var _store = require("../../store");
+var _zoomOutBtn = _interopRequireDefault(require("./items/zoom-out-btn"));
+var _zoomInBtn = _interopRequireDefault(require("./items/zoom-in-btn"));
+var _fullContainerBtn = _interopRequireDefault(require("./items/full-container-btn"));
+var _originalSizeBtn = _interopRequireDefault(require("./items/original-size-btn"));
+var _annotationEditBtn = _interopRequireDefault(require("./items/annotation-edit-btn"));
+require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
+var FcrScreenShareControlBar = (0, _mobxReact.observer)(function () {
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
+    screenShareWindowData = _useContext.screenShareWindowData,
+    zoomIn = _useContext.zoomIn,
+    zoomOut = _useContext.zoomOut,
+    fullContainer = _useContext.fullContainer,
+    setOriginScalc = _useContext.setOriginScalc,
+    toggleIsShowToolbar = _useContext.toggleIsShowToolbar,
+    annotationHasStart = _useContext.annotationHasStart,
+    isShowToolbar = _useContext.isShowToolbar,
+    isZoomMaxmum = _useContext.isZoomMaxmum,
+    isZoomMinimum = _useContext.isZoomMinimum,
+    isCurrentOriginal = _useContext.isCurrentOriginal,
+    isAspectRatioPreserved = _useContext.isAspectRatioPreserved,
+    isAnnotationSupported = _useContext.isAnnotationSupported,
+    allowAnnotationSelfWriteState = _useContext.allowAnnotationSelfWriteState,
+    participantShareCanWeAnnotation = _useContext.participantShareCanWeAnnotation;
+  var transI18n = (0, _i18n.useI18n)();
+  var hasScreenSharing = screenShareWindowData && screenShareWindowData.videoSourceType === _fcrCore.FcrVideoSourceType.SCREEN;
+  var hasLoopbackAudioStream = hasScreenSharing && screenShareWindowData.hasLoopbackSharing && screenShareWindowData.hasMicrophoneAudioStream;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "fcr-screen-share-controlbar",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "fcr-screen-share-controlbar-left",
+      children: screenShareWindowData ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "fcr-screen-share-controlbar-username",
+          children: [screenShareWindowData.userName, transI18n('fmt_uimanager_labels_sharing')]
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+          type: !!hasLoopbackAudioStream ? _type.FcrIconType.FCR_DEVICEAUDIOON : _type.FcrIconType.FCR_DEVICEAUDIOOFF,
+          size: 22,
+          colors: {
+            iconPrimary: 'var(--fcr_ui_scene_ramp_green6)'
+          },
+          style: {
+            marginRight: '10px'
+          }
+        })]
+      }) : null
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "fcr-screen-share-controlbar-center",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_zoomInBtn["default"], {
+        isMinimum: isZoomMinimum,
+        zoomIn: zoomIn
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_zoomOutBtn["default"], {
+        isMaxmum: isZoomMaxmum,
+        zoomOut: zoomOut
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_fullContainerBtn["default"], {
+        isAdaptived: isAspectRatioPreserved,
+        fullContainer: fullContainer
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_originalSizeBtn["default"], {
+        isOriginal: isCurrentOriginal,
+        setOriginScalc: setOriginScalc
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "fcr-screen-share-controlbar-right",
+      children: isAnnotationSupported() && annotationHasStart && participantShareCanWeAnnotation() && /*#__PURE__*/(0, _jsxRuntime.jsx)(_annotationEditBtn["default"], {
+        visible: annotationHasStart,
+        disable: !allowAnnotationSelfWriteState,
+        isShowToolbar: isShowToolbar,
+        clickFn: toggleIsShowToolbar
+      })
+    })]
+  });
+});
+var _default = exports["default"] = FcrScreenShareControlBar;

package/lib/modules/share-screen/components/control-bar/items/annotation-edit-btn/index.d.ts

@@ -0,0 +1,8 @@
+interface FcrScreenShareAnnotationBtnPropsType {
+    visible: boolean;
+    disable: boolean;
+    isShowToolbar: boolean;
+    clickFn: () => void;
+}
+declare const FcrScreenShareAnnotationBtn: (props: FcrScreenShareAnnotationBtnPropsType) => import("react/jsx-runtime").JSX.Element | null;
+export default FcrScreenShareAnnotationBtn;

package/lib/modules/share-screen/components/control-bar/items/annotation-edit-btn/index.js

@@ -0,0 +1,46 @@
+"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;
+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 _tooltip = require("agora-ui-foundation/lib/components/tooltip");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _mobxReact = require("mobx-react");
+var _jsxRuntime = require("react/jsx-runtime");
+var FcrScreenShareAnnotationBtn = (0, _mobxReact.observer)(function (props) {
+  var visible = props.visible,
+    disable = props.disable,
+    clickFn = props.clickFn,
+    isShowToolbar = props.isShowToolbar;
+  return visible ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+    content: !disable ? (0, _i18n.transI18n)('fmt_screenshare_toast_host_enabled_annotations') : (0, _i18n.transI18n)('fmt_screenshare_toast_host_disabled_annotations'),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _classnames["default"])('whiteboard-controlbar-item', 'fcr-screen-share-controlbar-without-exit', {
+        'fcr-screen-share-annotation-toolbar-btn': isShowToolbar
+      }),
+      children: isShowToolbar ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
+        size: "XXS",
+        styleType: "normal",
+        shape: "rounded",
+        className: "fcr-screen-share-annotation-exit-draw-btn",
+        onClick: clickFn,
+        children: (0, _i18n.transI18n)('fmt_screenshare_whiteboard_button_exitdrawing')
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+        onClick: clickFn,
+        type: _type.FcrIconType.FCR_WHITEBOARD2,
+        size: 22,
+        colors: {
+          iconPrimary: !disable ? 'var(--fcr_ui_scene_icontext1)' : 'gray'
+        }
+      })
+    })
+  }) : null;
+});
+var _default = exports["default"] = FcrScreenShareAnnotationBtn;

package/lib/modules/share-screen/components/control-bar/items/full-container-btn/index.d.ts

@@ -0,0 +1,6 @@
+interface FcrScreenShareFullContainerBtnPropsType {
+    isAdaptived: boolean;
+    fullContainer: () => void;
+}
+declare const FcrScreenShareFullContainerBtn: (props: FcrScreenShareFullContainerBtnPropsType) => import("react/jsx-runtime").JSX.Element;
+export default FcrScreenShareFullContainerBtn;

package/lib/modules/share-screen/components/control-bar/items/full-container-btn/index.js

@@ -0,0 +1,32 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _icon = require("agora-ui-foundation/lib/components/icon");
+var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _mobxReact = require("mobx-react");
+var _jsxRuntime = require("react/jsx-runtime");
+var FcrScreenShareFullContainerBtn = (0, _mobxReact.observer)(function (props) {
+  var isAdaptived = props.isAdaptived,
+    fullContainer = props.fullContainer;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+    content: isAdaptived ? (0, _i18n.transI18n)('fmt_screenshare_whiteboard_tips_alreadyadaptionsize') : (0, _i18n.transI18n)('fmt_screenshare_lables_adaptionlsize'),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "whiteboard-controlbar-item",
+      onClick: fullContainer,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+        type: _type.FcrIconType.FCR_FULLCOVERAGE,
+        size: 22,
+        colors: {
+          iconPrimary: isAdaptived ? 'gray' : 'var(--fcr_ui_scene_icontext1)'
+        }
+      })
+    })
+  });
+});
+var _default = exports["default"] = FcrScreenShareFullContainerBtn;

package/lib/modules/share-screen/components/control-bar/items/original-size-btn/index.d.ts

@@ -0,0 +1,6 @@
+interface FcrScreenShareOrgSizeBtnPropsType {
+    isOriginal: boolean;
+    setOriginScalc: () => void;
+}
+declare const FcrScreenShareOrgSizeBtn: (props: FcrScreenShareOrgSizeBtnPropsType) => import("react/jsx-runtime").JSX.Element;
+export default FcrScreenShareOrgSizeBtn;

package/lib/modules/share-screen/components/control-bar/items/original-size-btn/index.js

@@ -0,0 +1,32 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _icon = require("agora-ui-foundation/lib/components/icon");
+var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _mobxReact = require("mobx-react");
+var _jsxRuntime = require("react/jsx-runtime");
+var FcrScreenShareOrgSizeBtn = (0, _mobxReact.observer)(function (props) {
+  var isOriginal = props.isOriginal,
+    setOriginScalc = props.setOriginScalc;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+    content: isOriginal ? (0, _i18n.transI18n)('fmt_screenshare_tips_alreadyoriginalsize') : (0, _i18n.transI18n)('fmt_screenshare_lables_originalsize'),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "whiteboard-controlbar-item",
+      onClick: setOriginScalc,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+        type: _type.FcrIconType.FCR_EQUALRATIO,
+        size: 22,
+        colors: {
+          iconPrimary: isOriginal ? 'gray' : 'var(--fcr_ui_scene_icontext1)'
+        }
+      })
+    })
+  });
+});
+var _default = exports["default"] = FcrScreenShareOrgSizeBtn;

package/lib/modules/share-screen/components/control-bar/items/zoom-in-btn/index.d.ts

@@ -0,0 +1,6 @@
+interface FcrScreenShareZoomInBtnPropsType {
+    isMinimum: boolean;
+    zoomIn: () => void;
+}
+declare const FcrScreenShareZoomInBtn: (props: FcrScreenShareZoomInBtnPropsType) => import("react/jsx-runtime").JSX.Element;
+export default FcrScreenShareZoomInBtn;

package/lib/modules/share-screen/components/control-bar/items/zoom-in-btn/index.js

@@ -0,0 +1,32 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _icon = require("agora-ui-foundation/lib/components/icon");
+var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _mobxReact = require("mobx-react");
+var _jsxRuntime = require("react/jsx-runtime");
+var FcrScreenShareZoomInBtn = (0, _mobxReact.observer)(function (props) {
+  var isMinimum = props.isMinimum,
+    zoomIn = props.zoomIn;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+    content: isMinimum ? (0, _i18n.transI18n)('fmt_screenshare_whiteboard_tips_alreadyminumumsize') : (0, _i18n.transI18n)('fmt_screenshare_whiteboard_button_narrow'),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "whiteboard-controlbar-item",
+      onClick: zoomIn,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+        type: _type.FcrIconType.FCR_ZOOMIN,
+        size: 22,
+        colors: {
+          iconPrimary: isMinimum ? 'gray' : 'var(--fcr_ui_scene_icontext1)'
+        }
+      })
+    })
+  });
+});
+var _default = exports["default"] = FcrScreenShareZoomInBtn;

package/lib/modules/share-screen/components/control-bar/items/zoom-out-btn/index.d.ts

@@ -0,0 +1,6 @@
+interface FcrScreenShareZoomOutBtnPropsType {
+    isMaxmum: boolean;
+    zoomOut: () => void;
+}
+declare const FcrScreenShareZoomOutBtn: (props: FcrScreenShareZoomOutBtnPropsType) => import("react/jsx-runtime").JSX.Element;
+export default FcrScreenShareZoomOutBtn;

package/lib/modules/share-screen/components/control-bar/items/zoom-out-btn/index.js

@@ -0,0 +1,32 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _icon = require("agora-ui-foundation/lib/components/icon");
+var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _mobxReact = require("mobx-react");
+var _jsxRuntime = require("react/jsx-runtime");
+var FcrScreenShareZoomOutBtn = (0, _mobxReact.observer)(function (props) {
+  var isMaxmum = props.isMaxmum,
+    zoomOut = props.zoomOut;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+    content: isMaxmum ? (0, _i18n.transI18n)('fmt_screenshare_whiteboard_tips_alreadymaximumsize') : (0, _i18n.transI18n)('fmt_screenshare_whiteboard_button_enlarge'),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "whiteboard-controlbar-item",
+      onClick: zoomOut,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+        type: _type.FcrIconType.FCR_ZOOMOUT,
+        size: 22,
+        colors: {
+          iconPrimary: isMaxmum ? 'gray' : 'var(--fcr_ui_scene_icontext1)'
+        }
+      })
+    })
+  });
+});
+var _default = exports["default"] = FcrScreenShareZoomOutBtn;

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

@@ -69,12 +69,8 @@ var _i18n = require("agora-ui-foundation/lib/i18n");
 require("./index.css");
 var _store = require("../../store");
 var _icon = require("agora-ui-foundation/lib/components/icon");
+var _shareScenario = require("../share-scenario");
 var _jsxRuntime = require("react/jsx-runtime");
-var ShareSelectionWindowType = /*#__PURE__*/function (ShareSelectionWindowType) {
-  ShareSelectionWindowType["BASIC"] = "basic";
-  ShareSelectionWindowType["ADVANCED"] = "advanced";
-  return ShareSelectionWindowType;
-}(ShareSelectionWindowType || {});
 var ShareSelection = exports.ShareSelection = (0, _mobxReact.observer)(function () {
   var _useContext = (0, _react.useContext)(_store.StoreContext),
     currentSelectionId = _useContext.currentSelectionId,
@@ -92,12 +88,21 @@ var ShareSelection = exports.ShareSelection = (0, _mobxReact.observer)(function
     shareWithAudio = _useContext.shareWithAudio,
     setShareWithAudioState = _useContext.setShareWithAudioState,
     handleToggleScreenShareWithAudio = _useContext.handleToggleScreenShareWithAudio,
+    isCurrentScreenShareInSmoothType = _useContext.isCurrentScreenShareInSmoothType,
+    toggleShareWithScenarioType = _useContext.toggleShareWithScenarioType,
     cardChooseBounds = _useContext.cardChooseBounds,
     setCardChooseBounds = _useContext.setCardChooseBounds;
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    loading = _useState2[0],
-    setLoading = _useState2[1];
+    currentInAudio = _useState2[0],
+    setCurrentInAudio = _useState2[1];
+  var handleToggleScreenShareWithAudioBeforeShare = function handleToggleScreenShareWithAudioBeforeShare() {
+    setCurrentInAudio(!currentInAudio);
+  };
+  var _useState3 = (0, _react.useState)(false),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    loading = _useState4[0],
+    setLoading = _useState4[1];
   var t = (0, _i18n.useI18n)();
   (0, _react.useEffect)(function () {
     setLoading(false);
@@ -111,12 +116,13 @@ var ShareSelection = exports.ShareSelection = (0, _mobxReact.observer)(function
     // 注意此处 case 应该覆盖双击共享屏幕和选择共享屏幕后点击 “开始共享” 按钮，同时在屏幕共享时，能双击和点击“开始共享“按钮发起白板共享”
     // 测试标注时，发起端和接收端都需要可绘制，尺寸一致，并可同步画笔轨迹
     if (currentSelectionId) {
+      handleToggleScreenShareWithAudio(currentInAudio);
       setLoading(true);
-      handleStartShare(currentSelectionId, currentSelectionType, shareWithAudio, _shareAudio.AudioProcessingChannel.MONO, cardChooseBounds)["finally"](function () {
+      handleStartShare(currentSelectionId, currentSelectionType, currentInAudio, _shareAudio.AudioProcessingChannel.MONO, cardChooseBounds)["finally"](function () {
         setLoading(false);
       });
     }
-  }, 300), [currentSelectionId, currentSelectionType, shareWithAudio, handleStartShare]);
+  }, 300), [currentSelectionId, currentSelectionType, shareWithAudio, handleStartShare, currentInAudio]);
   var transI18n = (0, _i18n.useI18n)();
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "share-selection-window",
@@ -202,11 +208,19 @@ var ShareSelection = exports.ShareSelection = (0, _mobxReact.observer)(function
       className: "share-selection-window__footer",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "share-selection-window__footer-action",
-        children: currentSelectionId.split('-')[0] !== 'whiteboard' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_shareAudio.ShareAudio, {
-          shareWithAudio: shareWithAudio,
-          toggleShareWithAudio: handleToggleScreenShareWithAudio,
-          currentAudioChannel: currentShareAudioProcessingChannel,
-          onSwitchAudioChannel: setShareAudioProcessingChannel
+        children: currentSelectionId.split('-')[0] !== 'whiteboard' && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_shareAudio.ShareAudio, {
+            shareWithAudio: currentInAudio,
+            toggleShareWithAudio: handleToggleScreenShareWithAudioBeforeShare,
+            currentAudioChannel: currentShareAudioProcessingChannel,
+            onSwitchAudioChannel: setShareAudioProcessingChannel
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: "share-strategy-checkbox",
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_shareScenario.FcrShareScenario, {
+              isSmoothMode: isCurrentScreenShareInSmoothType,
+              toggleShareWithScenarioType: toggleShareWithScenarioType
+            })
+          })]
         })
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
         disabled: currentSelectionId.split('-')[0] === 'whiteboard' && !!(boardOwnerUser !== null && boardOwnerUser !== void 0 && boardOwnerUser.userId) || loading,

package/lib/modules/share-screen/components/share-scenario/index.d.ts

@@ -0,0 +1,5 @@
+export interface FcrShareScenarioProps {
+    isSmoothMode: boolean;
+    toggleShareWithScenarioType?: (target: boolean) => void;
+}
+export declare const FcrShareScenario: (props: FcrShareScenarioProps) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/share-screen/components/share-scenario/index.js

@@ -0,0 +1,47 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FcrShareScenario = void 0;
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _checkbox = require("agora-ui-foundation/lib/components/checkbox");
+var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
+var _icon = require("agora-ui-foundation/lib/components/icon");
+var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _jsxRuntime = require("react/jsx-runtime");
+var FcrShareScenario = exports.FcrShareScenario = function FcrShareScenario(props) {
+  var t = (0, _i18n.useI18n)();
+  var isSmoothMode = props.isSmoothMode,
+    toggleShareWithScenarioType = props.toggleShareWithScenarioType;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: "share-audio-checkbox",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "share-audio-action-button share-selectrion",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
+        checked: isSmoothMode,
+        label: t('fmt_uimanager_option_Fluencypriority'),
+        styleType: "brand",
+        onChange: toggleShareWithScenarioType
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+        mouseEnterDelay: 0,
+        trigger: "hover",
+        placement: "top",
+        content: t('fmt_screenshare_tips_video_smoothness'),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+          style: {
+            marginLeft: '6px'
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+            type: _type.FcrIconType.FCR_EXCLAMATIONMASK,
+            size: 20,
+            colors: {
+              iconPrimary: 'var(--fcr_ui_scene_icontext1)'
+            }
+          })
+        })
+      })]
+    })
+  });
+};

package/lib/modules/share-screen/index.d.ts

@@ -2,7 +2,7 @@ import { UIModule } from '../../base';
 import './index.css';
 import { FcrUIEventProvider } from '../../providers/event-provider';
 import { FcrUIPrivilegeProvider } from '../../providers/privilege-provider';
-import { FcrUIConnectionProvider, FcrUIMainRoomControlProvider, FcrUIRoomProvider } from '../../providers/room-provider';
+import { FcrUIMainRoomControlProvider, FcrUIRoomProvider } from '../../providers/room-provider';
 import { FcrUIDeviceProvider } from '../../providers/device-provider';
 import { FcrUIMessageProvider } from '../../providers/message-provider';
 import { FcrUIDialogProvider } from '../../providers/dialog-provider';
@@ -12,6 +12,7 @@ import { FcrUIScreenShareProvider } from '../../providers/screen-share-provider'
 import { FcrUIAnnotationProvider } from '../../providers/annotation-provider';
 import { FcrUIScreenShareSharedDataSource } from '../../shared-data-source/screen-share-data';
 import { FcrUIAbilityProviderImpl } from '../../providers/ability-provider';
+import { FcrUISharedAnnotationSource } from '../../shared-data-source/annotation-data';
 export declare class ShareScreenUIModule extends UIModule {
     private _store?;
     mainRoomControlProvider?: FcrUIMainRoomControlProvider;
@@ -23,13 +24,14 @@ export declare class ShareScreenUIModule extends UIModule {
     sharedMemberDataSource?: FcrUIMemberSharedDataSource;
     roomProvider?: FcrUIRoomProvider;
     sharedConfigDataSource?: FcrUISharedConfigDataSource;
-    connectionProvider?: FcrUIConnectionProvider;
     screenShareProvider?: FcrUIScreenShareProvider;
     annotationProvider?: FcrUIAnnotationProvider;
     sharedScreenShareSharedDataSource?: FcrUIScreenShareSharedDataSource;
     abilityProvider?: FcrUIAbilityProviderImpl;
+    sharedAnnotationDataSource?: FcrUISharedAnnotationSource;
     onNodeWillActive(): void;
     onNodeWillInactive(): void;
     getComponent(): import("react/jsx-runtime").JSX.Element;
+    getControlComponent(): import("react/jsx-runtime").JSX.Element;
     getSelectionComponent(): import("react/jsx-runtime").JSX.Element;
 }