fcr-ui-scene 3.8.1 → 3.9.0-alpha

package/lib/modules/chat/view.js

@@ -49,9 +49,7 @@ var _type3 = require("fcr-core/lib/room-control/chatroom-control/type");
 var _fcrCore = require("fcr-core");
 var _types = require("./types");
 var _chatTabs = _interopRequireDefault(require("./components/chat-tabs"));
-var _browserApi = require("../../utilities/browser-api");
-var _classnames = _interopRequireDefault(require("classnames"));
-var _env = require("agora-foundation/lib/utilities/env");
+var _copyText = require("agora-ui-foundation/lib/utilities/copy-text");
 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; }
@@ -147,7 +145,7 @@ var Chat = exports.Chat = (0, _mobxReact.observer)(function (_ref) {
             }
             msg = messageList[msgIndex[0]].msg;
             _context.next = 1;
-            return (0, _browserApi.copyText)(msg);
+            return (0, _copyText.copyText)(msg);
           case 1:
             return _context.abrupt("return");
           case 2:
@@ -171,7 +169,7 @@ var Chat = exports.Chat = (0, _mobxReact.observer)(function (_ref) {
               }
             });
             _context.next = 3;
-            return (0, _browserApi.copyText)(msgHandled);
+            return (0, _copyText.copyText)(msgHandled);
           case 3:
           case "end":
             return _context.stop();
@@ -197,10 +195,7 @@ var Chat = exports.Chat = (0, _mobxReact.observer)(function (_ref) {
     });
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: (0, _classnames["default"])({
-      'fcr-chat-container-box-web': !(0, _env.isElectron)(),
-      'fcr-chat-container-box-electron': (0, _env.isElectron)()
-    }),
+    className: "fcr-chat-container-box",
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_chatTabs["default"], {}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       style: _objectSpread({}, styles),
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_chatWrapper.ChatWrapper, {

package/lib/modules/components/annotation-menu/index.d.ts

@@ -1,7 +1,9 @@
-declare const AnnotationMenu: ({ hasAnnotationAllowWritePermission, allowAnnotationWriteState, showClear, setAllowAnnotationWrite, }: {
+type Props = {
+    className?: string;
     hasAnnotationAllowWritePermission: boolean;
     allowAnnotationWriteState: boolean;
-    showClear?: boolean;
     setAllowAnnotationWrite: (allow: boolean) => void;
-}) => import("react/jsx-runtime").JSX.Element;
+    onCleanAnnotationClick?: () => void;
+};
+declare const AnnotationMenu: ({ className, hasAnnotationAllowWritePermission, allowAnnotationWriteState, setAllowAnnotationWrite, onCleanAnnotationClick, }: Props) => import("react/jsx-runtime").JSX.Element;
 export default AnnotationMenu;

package/lib/modules/components/annotation-menu/index.js

@@ -2,6 +2,7 @@
 
 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");
@@ -18,7 +19,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 require("core-js/modules/es.array.concat.js");
 require("core-js/modules/es.array.filter.js");
 require("core-js/modules/es.array.map.js");
-require("core-js/modules/es.array.push.js");
+require("core-js/modules/es.array.unshift.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.filter.js");
@@ -28,19 +29,18 @@ var _dropMenu = require("agora-ui-foundation/lib/components/drop-menu");
 var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
 var _i18n = require("agora-ui-foundation/lib/i18n");
+var _classnames = _interopRequireDefault(require("classnames"));
 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 AnnotationMenu = function AnnotationMenu(_ref) {
-  var hasAnnotationAllowWritePermission = _ref.hasAnnotationAllowWritePermission,
+  var className = _ref.className,
+    hasAnnotationAllowWritePermission = _ref.hasAnnotationAllowWritePermission,
     allowAnnotationWriteState = _ref.allowAnnotationWriteState,
-    showClear = _ref.showClear,
-    setAllowAnnotationWrite = _ref.setAllowAnnotationWrite;
+    setAllowAnnotationWrite = _ref.setAllowAnnotationWrite,
+    onCleanAnnotationClick = _ref.onCleanAnnotationClick;
   var transI18n = (0, _i18n.useI18n)();
-  function onClearAllAnnotation() {
-    // renderer.sendEvent({ action: ToolbarEvents.CLEAN, payload: null });
-  }
-  var hostMenu = hasAnnotationAllowWritePermission ? [{
+  var settings = hasAnnotationAllowWritePermission ? [{
     title: transI18n('fmt_screenshare_controlbar_settings_label_annotation_settings'),
     key: 'annotation_setting_title',
     type: 'title'
@@ -55,45 +55,39 @@ var AnnotationMenu = function AnnotationMenu(_ref) {
     onButtonClick: function onButtonClick() {
       return setAllowAnnotationWrite(!allowAnnotationWriteState);
     }
-  }
-  // {
-  //   title: (
-  //     <FcrCheckbox
-  //       checked={false}
-  //       label={transI18n('fmt_screenshare_controlbar_annotations_options_show_name')}
-  //       styleType="white"
-  //     />
-  //   ),
-  //   key: 'allow_other_member_add_annotation',
-  //   type: 'primary',
-  // },
-  ] : [];
-  showClear && hasAnnotationAllowWritePermission && hostMenu.push({
-    type: 'line',
-    title: '',
-    key: 'annotation_operation_line'
-  });
-  var ownerMenu = showClear ? [{
+  }] : [];
+  var operations = onCleanAnnotationClick ? [{
     title: transI18n('fmt_screenshare_controlbar_settings_label_annotation_controls'),
     key: 'annotation_operation_title',
     type: 'title'
   }, {
     icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-      type: _type.FcrIconType.FCR_DELETE3,
       size: 24,
       colors: {
         iconPrimary: 'var(--fcr_ui_scene_icontext1)'
-      }
+      },
+      type: _type.FcrIconType.FCR_DELETE3
     }),
     title: transI18n('fmt_screenshare_controlbar_options_clear_all'),
     key: 'clear_all_annotation',
     type: 'primary',
-    onButtonClick: onClearAllAnnotation
+    onButtonClick: function onButtonClick() {
+      onCleanAnnotationClick();
+    }
   }] : [];
-  var allActions = [].concat(hostMenu, ownerMenu);
+
+  // 在设置和操作之间添加分隔线（如果两者都有的话）
+  if (settings.length > 0 && operations.length > 0) {
+    operations.unshift({
+      key: 'divider_between_settings_and_operations',
+      title: '',
+      type: 'line'
+    });
+  }
+  var options = [].concat(settings, operations);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_dropMenu.FcrDropMenu, {
-    className: "security-menu",
-    options: allActions.filter(function (action) {
+    className: (0, _classnames["default"])('security-menu', className),
+    options: options.filter(function (action) {
       return action.type !== 'disabled';
     }).map(function (action) {
       if (action.type === 'primary') {
@@ -105,7 +99,8 @@ var AnnotationMenu = function AnnotationMenu(_ref) {
         });
       }
       return _objectSpread({}, action);
-    })
+    }),
+    isOptionIconAlignsToLeft: true
   });
 };
 var _default = exports["default"] = AnnotationMenu;

package/lib/modules/components/apps/index.css

@@ -1,9 +1,10 @@
 .action-bar-apps-container {
   display: flex;
   padding: 2px 6px 24px;
-  width: 372px;
+  max-width: 372px;
+  max-height: 468px;
+  overflow-y: auto;
   flex-wrap: wrap;
   justify-content: left;
-  width: 100%;
   align-items: start;
 }

package/lib/modules/components/caption-menu/translation-setting-options.js

@@ -110,7 +110,7 @@ var useTranslationMenuOptions = function useTranslationMenuOptions() {
     };
   });
   return [{
-    title: transI18n('fmt_ai_subtitles_setting_label_translation_setting'),
+    title: transI18n('fmt_ai_subtitles_setting_label_translations_display'),
     key: 'traslation_settings_title',
     type: 'title',
     onButtonClick: function onButtonClick(e) {
@@ -144,7 +144,7 @@ var useTranslationSettingOptions = exports.useTranslationSettingOptions = functi
   };
   return [{
     key: 'translate_settings_title',
-    title: transI18n('fmt_ai_subtitles_setting_label_translation_setting'),
+    title: transI18n(menuType === FcrUICaptionMenuType.CAPTION ? 'fmt_ai_subtitles_setting_label_translation_setting' : 'fmt_ai_rtt_label_transcription_setting'),
     type: 'title'
   }, {
     title: transI18n('fmt_ai_subtitles_setting_label_source_language'),

package/lib/modules/components/confirm-wrapper/index.css

@@ -0,0 +1,48 @@
+.fcr-confirm-wrapper {
+  padding: 20px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 15px;
+  width: 255px;
+}
+
+.fcr-confirm-header {
+  font-weight: 700;
+  font-style: Bold;
+  font-size: 14px;
+  line-height: 130%;
+  letter-spacing: 0%;
+  text-align: center;
+  vertical-align: middle;
+  color: var(--fcr_ui_scene_icontext1);
+}
+
+.fcr-confirm-secondary-btn {
+  width: 100%;
+  height: 36px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--fcr_ui_scene_ramp_red6, rgba(251, 88, 78, 1));
+  border-radius: var(--fcr_cornerradius_l);
+  border: 1px solid var(--fcr_ui_scene_ramp_red6);
+  font-family: Verdana;
+  font-size: 13px;
+  font-weight: 400;
+  line-height: 24px;
+  text-align: center;
+  cursor: pointer;
+}
+
+.fcr-confirm-description {
+  color: var(--fcr_ui_scene_icontext1);
+  font-weight: 400;
+  font-style: Regular;
+  font-size: 14px;
+  line-height: 130%;
+  letter-spacing: 0%;
+  text-align: center;
+  vertical-align: middle;
+}

package/lib/modules/components/confirm-wrapper/index.d.ts

@@ -0,0 +1,25 @@
+import { ButtonProps } from 'agora-ui-foundation/lib/components/button';
+import { CheckboxProps } from 'agora-ui-foundation/lib/components/checkbox';
+import './index.css';
+interface ConfirmWrapperBtn extends ButtonProps {
+    text: string;
+    isHidden?: boolean;
+}
+interface ConfirmWrapperCheckboxProps extends CheckboxProps {
+    isHidden?: boolean;
+}
+export interface ConfirmWrapperProps {
+    title: string;
+    checkboxProps?: ConfirmWrapperCheckboxProps;
+    confirmBtnProps?: ConfirmWrapperBtn;
+    cancelBtnProps?: ConfirmWrapperBtn;
+    secondaryConfirmBtnProps?: {
+        text: string;
+        onClick: (e: React.MouseEvent<HTMLDivElement>) => void;
+        isHidden?: boolean;
+    };
+    onBlur?: () => void;
+    description?: string;
+}
+export declare const ConfirmWrapper: (props: ConfirmWrapperProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/modules/components/confirm-wrapper/index.js

@@ -0,0 +1,87 @@
+"use strict";
+
+require("core-js/modules/es.array.filter.js");
+require("core-js/modules/es.array.for-each.js");
+require("core-js/modules/es.array.push.js");
+require("core-js/modules/es.object.define-properties.js");
+require("core-js/modules/es.object.define-property.js");
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+require("core-js/modules/es.object.keys.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
+require("core-js/modules/esnext.iterator.for-each.js");
+require("core-js/modules/web.dom-collections.for-each.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ConfirmWrapper = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+require("core-js/modules/es.symbol.js");
+require("core-js/modules/es.symbol.description.js");
+var _button = require("agora-ui-foundation/lib/components/button");
+var _checkbox = require("agora-ui-foundation/lib/components/checkbox");
+require("./index.css");
+var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["isHidden"],
+  _excluded2 = ["isHidden"],
+  _excluded3 = ["isHidden"],
+  _excluded4 = ["isHidden"];
+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 ConfirmWrapper = exports.ConfirmWrapper = function ConfirmWrapper(props) {
+  var title = props.title,
+    confirmBtnProps = props.confirmBtnProps,
+    cancelBtnProps = props.cancelBtnProps,
+    secondaryConfirmBtnProps = props.secondaryConfirmBtnProps,
+    checkboxProps = props.checkboxProps,
+    onBlur = props.onBlur,
+    description = props.description;
+  var _ref = secondaryConfirmBtnProps || {},
+    isSecondaryConfirmBtnHidden = _ref.isHidden,
+    restSecondaryConfirmBtnProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var _ref2 = checkboxProps || {},
+    isCheckboxHidden = _ref2.isHidden,
+    restCheckboxProps = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
+  var _ref3 = confirmBtnProps || {},
+    isConfirmBtnHidden = _ref3.isHidden,
+    restConfirmBtnProps = (0, _objectWithoutProperties2["default"])(_ref3, _excluded3);
+  var _ref4 = cancelBtnProps || {},
+    isCancelBtnHidden = _ref4.isHidden,
+    restCancelBtnProps = (0, _objectWithoutProperties2["default"])(_ref4, _excluded4);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "fcr-confirm-wrapper",
+    onBlur: onBlur,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("header", {
+      className: "fcr-confirm-header",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
+        children: title
+      })
+    }), description && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "fcr-confirm-description",
+      children: description
+    }), checkboxProps && !isCheckboxHidden && /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, _objectSpread({}, restCheckboxProps)), confirmBtnProps && !isConfirmBtnHidden && /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, _objectSpread(_objectSpread({
+      size: "S",
+      styleType: "danger",
+      type: "primary",
+      shape: "rounded",
+      block: true
+    }, restConfirmBtnProps), {}, {
+      children: confirmBtnProps.text
+    })), secondaryConfirmBtnProps && !isSecondaryConfirmBtnHidden && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({
+      className: "fcr-confirm-secondary-btn"
+    }, restSecondaryConfirmBtnProps), {}, {
+      children: secondaryConfirmBtnProps.text
+    })), cancelBtnProps && !isCancelBtnHidden && /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, _objectSpread(_objectSpread({
+      size: "S",
+      type: "secondary",
+      shape: "rounded",
+      block: true
+    }, restCancelBtnProps), {}, {
+      children: cancelBtnProps.text
+    }))]
+  });
+};

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

@@ -1,8 +1,35 @@
-import { PropsWithChildren } from 'react';
+import { CSSProperties, ReactNode } from 'react';
 import { WhiteboardThemeType } from '../../whiteboard/type';
-import { FcrBoardToolType } from 'fcr-core';
+import { FcrBoardToolType } from 'fcr-core/lib/room-control/whiteboard-control-v2/enum';
 import './index.css';
-type WhiteboardProps = {
+type BaseControlBarProps = {
+    className: string;
+    title: string;
+    canWriteBoard?: boolean;
+    onEnable?: (enable: boolean) => void;
+    onClose?: () => void;
+    showControlBar?: boolean;
+    showAudioIndicator?: boolean;
+    isSharingAudio?: boolean;
+    showThemeSwitch?: boolean;
+    currentTheme?: WhiteboardThemeType;
+    setTheme?: (theme: WhiteboardThemeType) => void;
+    showEnterBoardEdit?: boolean;
+    showExitBoardEdit?: boolean;
+    showStopShare?: boolean;
+    onZoomOut?: () => void;
+    onZoomIn?: () => void;
+    onAdaptive?: () => void;
+    onOrigin?: () => void;
+    isMinimum?: boolean;
+    isMaxmum?: boolean;
+    isAdaptived?: boolean;
+    isOriginal?: boolean;
+    style?: CSSProperties;
+    children?: ReactNode;
+};
+export declare const BaseControlBar: ({ title, canWriteBoard, onEnable, onClose, showControlBar, showAudioIndicator, isSharingAudio, showThemeSwitch, setTheme, currentTheme, showEnterBoardEdit, showExitBoardEdit, showStopShare, onZoomOut, onZoomIn, onAdaptive, onOrigin, isMinimum, isMaxmum, isAdaptived, isOriginal, style, children, className, }: BaseControlBarProps) => import("react/jsx-runtime").JSX.Element;
+type WhiteboardControlbarProps = {
     onClose: () => void;
     onEnable: (enable: boolean) => void;
     setTheme: (theme: WhiteboardThemeType) => void;
@@ -10,19 +37,24 @@ type WhiteboardProps = {
     controlEnabled: boolean;
     isHost: boolean;
     currentTheme: WhiteboardThemeType;
-    sharingType: 'whiteboard' | 'annotation';
     currentTool?: FcrBoardToolType;
+    onBoardDomLoaded?: (dom: HTMLDivElement) => void;
     onZoomIn?: () => boolean;
     onZoomOut?: () => boolean;
     onAdaptive?: () => boolean;
     onOrigin?: () => boolean;
-    onBoardDomLoaded?: (dom: HTMLDivElement) => void;
-    isSharingAudio?: boolean;
     ownerUserName: string;
     isMyBoard: boolean;
     showControlBar?: boolean;
+    children?: ReactNode;
 };
 type PickRequired<T extends object, K extends keyof T> = Required<Pick<T, K>> & Omit<T, K>;
-type SharingType<T extends 'whiteboard' | 'screenshare' | undefined> = T extends 'whiteboard' ? WhiteboardProps : PickRequired<Partial<WhiteboardProps>, 'onZoomIn' | 'onZoomOut' | 'onAdaptive' | 'onOrigin' | 'isSharingAudio'>;
-export declare const WhiteboardControlbar: <T extends "whiteboard" | "screenshare">(props: PropsWithChildren<SharingType<T>>) => import("react/jsx-runtime").JSX.Element;
+type ScreenShareProps = PickRequired<Partial<WhiteboardControlbarProps>, 'onZoomIn' | 'onZoomOut' | 'onAdaptive' | 'onOrigin'> & {
+    isSharingAudio?: boolean;
+    showControlBar?: boolean;
+    showEnterBoardEdit?: boolean;
+    showExitBoardEdit?: boolean;
+};
+export declare const WhiteboardControlbar: ({ onClose, onEnable, setTheme, canWriteBoard, controlEnabled, isHost, currentTheme, currentTool, onBoardDomLoaded, onZoomIn, onZoomOut, onAdaptive, onOrigin, ownerUserName, isMyBoard, showControlBar, children, }: WhiteboardControlbarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ScreenShareControlbar: ({ onZoomIn, onZoomOut, onAdaptive, onOrigin, ownerUserName, isSharingAudio, canWriteBoard, controlEnabled, isMyBoard, onEnable, onClose, showControlBar, showEnterBoardEdit, showExitBoardEdit, }: ScreenShareProps) => import("react/jsx-runtime").JSX.Element;
 export {};