fcr-ui-scene 3.7.4 → 3.7.6

package/lib/modules/dialog/components/host-area-container/index.js

@@ -1,211 +1,153 @@
 "use strict";
 
-require("core-js/modules/es.symbol.js");
-require("core-js/modules/es.array.filter.js");
-require("core-js/modules/es.array.for-each.js");
-require("core-js/modules/es.array.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.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.HotAreaContext = exports.HotAreaContainer = void 0;
-require("core-js/modules/es.array.concat.js");
-require("core-js/modules/es.array.find.js");
-require("core-js/modules/es.object.to-string.js");
-require("core-js/modules/esnext.iterator.constructor.js");
-require("core-js/modules/esnext.iterator.find.js");
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = require("@use-gesture/react");
-var _react2 = require("react");
-var _useElectron = require("../../hooks/useElectron");
-var _env = require("agora-foundation/lib/utilities/env");
-var _constant = require("../../../../utilities/constant");
-var _dialogUtils = require("../../../../utilities/dialog-utils");
-var _store = require("../../store");
-var _platform = require("../../../../utilities/platform");
-var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["x", "y"];
-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 HotAreaContext = exports.HotAreaContext = /*#__PURE__*/(0, _react2.createContext)({
+var _react = require("react");
+// import renderer from '../../../../utilities/renderer';
+
+var HotAreaContext = exports.HotAreaContext = /*#__PURE__*/(0, _react.createContext)({
   placement: 'top'
 });
 var HotAreaContainer = exports.HotAreaContainer = function HotAreaContainer(props) {
-  var children = props.children,
-    width = props.width,
-    height = props.height,
-    _props$placement = props.placement,
-    placement = _props$placement === void 0 ? 'top' : _props$placement,
-    dialogKey = props.dialogKey;
-  var _useContext = (0, _react2.useContext)(_store.StoreContext),
-    recordShareBounds = _useContext.recordShareBounds,
-    currentShareBounds = _useContext.currentShareBounds,
-    currentShareId = _useContext.currentShareId,
-    currentShareType = _useContext.currentShareType,
-    allApplicationWindows = _useContext.allApplicationWindows;
-  var _ref = (0, _env.isElectron)() ? (0, _react2.useContext)(_useElectron.DialogInstanceContext) : {},
-    browserWindow = _ref.browserWindow,
-    newRendererWindow = _ref.newRendererWindow;
-  var windowFocusTimerRef = (0, _react2.useRef)();
-  var _useState = (0, _react2.useState)(placement),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    navCurrentPosition = _useState2[0],
-    setNavCurrentPosition = _useState2[1];
-  var rndRef = (0, _react2.useRef)(null);
-  var _ref2 = (0, _react2.useMemo)(function () {
-      return (0, _dialogUtils.followCorrectDisplay)({
-        dialogKey: _constant.FcrUIDialogKey.ANNOTATION_TOOL
-      });
-    }, []) || {
-      nearDisplayBounds: {
-        width: 0,
-        height: 0
-      }
-    },
-    bounds = _ref2.nearDisplayBounds;
-  var _useState3 = (0, _react2.useState)({
-      x: bounds.width / 2 - width / 2,
-      y: bounds.height - height - 60
-    }),
-    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-    coordination = _useState4[0],
-    setCoordination = _useState4[1];
-  var bind = (0, _react.useDrag)(function (_ref3) {
-    var _rndRef$current;
-    var _ref3$delta = (0, _slicedToArray2["default"])(_ref3.delta, 2),
-      dx = _ref3$delta[0],
-      dy = _ref3$delta[1];
-    var x = coordination.x + dx;
-    var y = coordination.y + dy;
-    var maxX = bounds.width - (((_rndRef$current = rndRef.current) === null || _rndRef$current === void 0 ? void 0 : _rndRef$current.offsetWidth) || width);
-    var maxY = bounds.height - height;
-    handleDragStop({
-      lastX: Math.max(0, Math.min(maxX, x)),
-      lastY: Math.max(0, Math.min(maxY, y))
-    });
-  });
-  var handleDragStop = function handleDragStop(data) {
-    var x = data.lastX,
-      y = data.lastY;
-    setCoordination({
-      x: x,
-      y: y
-    });
-    // 控制栏左上角在屏幕Y轴的最大坐标
-    var MAX_Y = bounds.height - height;
-    if (y >= MAX_Y) {
-      setNavCurrentPosition('bottom');
-    } else if (y <= 0) {
-      setNavCurrentPosition('top');
-    }
-  };
-  var handleMouseEnter = function handleMouseEnter() {
-    browserWindow === null || browserWindow === void 0 || browserWindow.focus();
-    browserWindow === null || browserWindow === void 0 || browserWindow.setIgnoreMouseEvents(false, {
-      forward: true
-    });
-  };
-  var handleMouseLeave = function handleMouseLeave(e) {
-    browserWindow === null || browserWindow === void 0 || browserWindow.setIgnoreMouseEvents(true, {
-      forward: true
-    });
-  };
-  var handleMouseMove = function handleMouseMove() {
-    browserWindow === null || browserWindow === void 0 || browserWindow.moveTop();
-    browserWindow === null || browserWindow === void 0 || browserWindow.focus();
-    browserWindow === null || browserWindow === void 0 || browserWindow.setIgnoreMouseEvents(false, {
-      forward: true
-    });
-  };
-  function getScreenBounds() {
-    // 当电脑系统更改主屏幕为非共享屏幕时，会导致正在共享屏幕的 x, y 坐标发生改变，并触发 merics-changed 事件，去重新计算 controlbar 的热区位置
-    // 但当初分享屏幕时是通过所选择屏幕的 bounds 通过 currentShareBounds 传递到热区计算函数获知到热区应该在哪个显示器上的
-    // 因此当系统的主屏幕发生改变，再次通过这个 currentShareBounds 获取的 x, y 坐标就是错误的，以下逻辑既是对此情况做出相应处理
-    // 同一个 currentShareBounds 代表选择分享的屏幕没有发生变化，通过它作为 key 去存屏幕信息。当存在这个 key 时，取出来去拿屏幕 id 去匹配，并重新赋值 x，y
-    var screenBounds = undefined;
-    if (recordShareBounds.has(currentShareBounds)) {
-      var _window$runtime$scree;
-      var _ref4 = recordShareBounds.get(currentShareBounds),
-        ox = _ref4.x,
-        oy = _ref4.y,
-        _bounds = (0, _objectWithoutProperties2["default"])(_ref4, _excluded);
-      var _ref5 = ((_window$runtime$scree = window.runtime.screen.getAllDisplays().find(function (display) {
-          return _bounds.displayId === display.id;
-        })) === null || _window$runtime$scree === void 0 ? void 0 : _window$runtime$scree.bounds) || {
-          x: ox,
-          y: oy
-        },
-        x = _ref5.x,
-        y = _ref5.y;
-      screenBounds = _objectSpread({
-        x: x,
-        y: y
-      }, _bounds);
-      browserWindow === null || browserWindow === void 0 || browserWindow.setBounds(screenBounds);
-    } else {
-      recordShareBounds.clear();
-      screenBounds = (0, _dialogUtils.getCurrentSharingWorkArea)({
-        currentShareBounds: currentShareBounds
-      });
-      recordShareBounds.set(currentShareBounds, screenBounds);
-    }
-    return screenBounds;
-  }
-  function checkMouseOver() {
-    if (windowFocusTimerRef.current) clearInterval(windowFocusTimerRef.current);
-    var screenBounds = getScreenBounds();
-    browserWindow && newRendererWindow && (0, _dialogUtils.handleCheckMouseOver)({
-      elem: rndRef.current,
-      browserWindow: browserWindow,
-      screenBounds: screenBounds,
-      newRendererWindow: newRendererWindow,
-      callback: function callback(timerId) {
-        windowFocusTimerRef.current = timerId;
-      },
-      dialog: dialogKey
-    });
-  }
-  (0, _react2.useEffect)(function () {
-    (0, _platform.isWindows)() ? checkMouseOver() : getScreenBounds();
-    window.runtime.screen.addListener(
-    // @ts-ignore
-    'display-metrics-changed', (0, _platform.isWindows)() ? checkMouseOver : getScreenBounds);
-    handleMouseLeave();
-    return function () {
-      window.runtime.screen.removeListener(
-      // @ts-ignore
-      'display-metrics-changed', (0, _platform.isWindows)() ? checkMouseOver : getScreenBounds);
-      clearInterval(windowFocusTimerRef.current);
-    };
-  }, [currentShareId]);
-  return currentShareId ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, bind()), {}, {
-    style: {
-      width: 'fit-content',
-      transform: "translate(".concat(coordination.x, "px, ").concat(coordination.y, "px)")
-    },
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      ref: rndRef,
-      onMouseEnter: handleMouseEnter,
-      onMouseLeave: handleMouseLeave,
-      onMouseOver: handleMouseEnter,
-      onMouseMove: handleMouseMove,
-      onClick: handleMouseMove,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(HotAreaContext.Provider, {
-        value: {
-          placement: placement
-        },
-        children: children
-      })
-    })
-  })) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});
+  // const { children, width, height, placement = 'top', dialogKey } = props;
+  // // const {
+  // //   recordShareBounds,
+  // //   currentShareBounds,
+  // //   currentShareId,
+  // //   currentShareType,
+  // //   allApplicationWindows,
+  // // } = useContext(StoreContext);
+  // // const { browserWindow, newRendererWindow } = isElectron()
+  // //   ? useContext(DialogInstanceContext)
+  // //   : {};
+  // const windowFocusTimerRef = useRef<NodeJS.Timeout>();
+  // const [navCurrentPosition, setNavCurrentPosition] = useState(placement);
+  // const rndRef = useRef<any>(null);
+  // const { nearDisplayBounds: bounds } = useMemo(
+  //   () => followCorrectDisplay({ dialogKey: FcrUIDialogKey.ANNOTATION_TOOL }),
+  //   [],
+  // ) || {
+  //   nearDisplayBounds: {
+  //     width: 0,
+  //     height: 0,
+  //   },
+  // };
+  // const [coordination, setCoordination] = useState({
+  //   x: bounds.width / 2 - width / 2,
+  //   y: bounds.height - height - 60,
+  // });
+  // const bind = useDrag(({ delta: [dx, dy] }) => {
+  //   const x = coordination.x + dx;
+  //   const y = coordination.y + dy;
+  //   const maxX = bounds.width - (rndRef.current?.offsetWidth || width);
+  //   const maxY = bounds.height - height;
+  //   handleDragStop({
+  //     lastX: Math.max(0, Math.min(maxX, x)),
+  //     lastY: Math.max(0, Math.min(maxY, y)),
+  //   });
+  // });
+  // const handleDragStop = (data: { lastX: number; lastY: number }) => {
+  //   const { lastX: x, lastY: y } = data;
+  //   setCoordination({ x, y });
+  //   // 控制栏左上角在屏幕Y轴的最大坐标
+  //   const MAX_Y = bounds.height - height;
+  //   if (y >= MAX_Y) {
+  //     setNavCurrentPosition('bottom');
+  //   } else if (y <= 0) {
+  //     setNavCurrentPosition('top');
+  //   }
+  // };
+  // const handleMouseEnter = () => {
+  //   browserWindow?.focus();
+  //   browserWindow?.setIgnoreMouseEvents(false, { forward: true });
+  // };
+  // const handleMouseLeave = (e?: any) => {
+  //   browserWindow?.setIgnoreMouseEvents(true, { forward: true });
+  // };
+  // const handleMouseMove = () => {
+  //   browserWindow?.moveTop();
+  //   browserWindow?.focus();
+  //   browserWindow?.setIgnoreMouseEvents(false, { forward: true });
+  // };
+  // function getScreenBounds() {
+  //   // 当电脑系统更改主屏幕为非共享屏幕时，会导致正在共享屏幕的 x, y 坐标发生改变，并触发 merics-changed 事件，去重新计算 controlbar 的热区位置
+  //   // 但当初分享屏幕时是通过所选择屏幕的 bounds 通过 currentShareBounds 传递到热区计算函数获知到热区应该在哪个显示器上的
+  //   // 因此当系统的主屏幕发生改变，再次通过这个 currentShareBounds 获取的 x, y 坐标就是错误的，以下逻辑既是对此情况做出相应处理
+  //   // 同一个 currentShareBounds 代表选择分享的屏幕没有发生变化，通过它作为 key 去存屏幕信息。当存在这个 key 时，取出来去拿屏幕 id 去匹配，并重新赋值 x，y
+  //   let screenBounds = undefined;
+  //   if (recordShareBounds.has(currentShareBounds)) {
+  //     const { x: ox, y: oy, ...bounds } = recordShareBounds.get(currentShareBounds)!;
+  //     const { x, y } = renderer.getAllDisplays().find((display) => bounds.displayId === display.id)
+  //       ?.bounds || { x: ox, y: oy };
+  //     screenBounds = { x, y, ...bounds };
+  //     browserWindow?.setBounds(screenBounds);
+  //   } else {
+  //     recordShareBounds.clear();
+  //     screenBounds = getCurrentSharingWorkArea({
+  //       currentShareBounds,
+  //     });
+  //     recordShareBounds.set(currentShareBounds, screenBounds);
+  //   }
+  //   return screenBounds;
+  // }
+  // function checkMouseOver() {
+  //   if (windowFocusTimerRef.current) clearInterval(windowFocusTimerRef.current);
+  //   const screenBounds = getScreenBounds();
+  //   browserWindow &&
+  //     newRendererWindow &&
+  //     handleCheckMouseOver({
+  //       elem: rndRef.current,
+  //       browserWindow,
+  //       screenBounds,
+  //       newRendererWindow,
+  //       callback(timerId) {
+  //         windowFocusTimerRef.current = timerId;
+  //       },
+  //       dialog: dialogKey,
+  //     });
+  // }
+  // useEffect(() => {
+  //   isWindows() ? checkMouseOver() : getScreenBounds();
+  //   // TODO: screen
+  //   // @ts-ignore
+  //   window.runtime.screen.addListener(
+  //     // @ts-ignore
+  //     'display-metrics-changed',
+  //     isWindows() ? checkMouseOver : getScreenBounds,
+  //   );
+  //   handleMouseLeave();
+  //   return () => {
+  //     // TODO: screen
+  //     // @ts-ignore
+  //     window.runtime.screen.removeListener(
+  //       // @ts-ignore
+  //       'display-metrics-changed',
+  //       isWindows() ? checkMouseOver : getScreenBounds,
+  //     );
+  //     clearInterval(windowFocusTimerRef.current);
+  //   };
+  // }, [currentShareId]);
+  // return currentShareId ? (
+  //   <div
+  //     {...bind()}
+  //     style={{
+  //       width: 'fit-content',
+  //       transform: `translate(${coordination.x}px, ${coordination.y}px)`,
+  //     }}>
+  //     <div
+  //       ref={rndRef}
+  //       onMouseEnter={handleMouseEnter}
+  //       onMouseLeave={handleMouseLeave}
+  //       onMouseOver={handleMouseEnter}
+  //       onMouseMove={handleMouseMove}
+  //       onClick={handleMouseMove}>
+  //       <HotAreaContext.Provider value={{ placement }}>{children}</HotAreaContext.Provider>
+  //     </div>
+  //   </div>
+  // ) : (
+  //   <></>
+  // );
 };

package/lib/modules/dialog/components/normal-window/index.d.ts

@@ -1,19 +1,22 @@
 import { FcrUIDialogKey } from '../../../../utilities/constant';
-import { PropsWithChildren } from 'react';
-import { FcrUIDialogHooksConfig, FcrUIDialogOnCloseProps, FcrUIDialogOnOpenedProps } from '../../type';
-export default function NormalWindow(props: PropsWithChildren<{
-    title?: string | React.ReactNode;
+import { FC } from 'react';
+type FcrUIDialogProps = {
     dialogKey: FcrUIDialogKey;
-    width?: number;
-    height?: number;
-    config: Electron.BrowserWindowConstructorOptions;
-    hooksConfig?: FcrUIDialogHooksConfig;
-    onOpened?: (props: FcrUIDialogOnOpenedProps) => void;
-    onClose?: (props?: FcrUIDialogOnCloseProps) => void;
+    dialogId: string;
+    body: React.ReactNode;
     closable?: boolean;
-    onlyElectron?: boolean;
     actions?: React.ReactNode;
-    closeInterception?: () => boolean;
-    style?: React.CSSProperties;
+    title?: string | boolean;
+    header?: React.ReactNode;
+    headerStyle?: React.CSSProperties;
+    bodyStyle?: React.CSSProperties;
     autoHeight?: boolean;
-}>): import("react/jsx-runtime").JSX.Element;
+    width?: number;
+    height?: number;
+    minWidth?: number;
+    minHeight?: number;
+    maxWidth?: number;
+    maxHeight?: number;
+};
+export declare const NormalWindow: FC<FcrUIDialogProps>;
+export {};

package/lib/modules/dialog/components/normal-window/index.js

@@ -1,73 +1,56 @@
 "use strict";
 
-require("core-js/modules/es.symbol.js");
-require("core-js/modules/es.array.filter.js");
-require("core-js/modules/es.array.for-each.js");
-require("core-js/modules/es.array.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["default"] = NormalWindow;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _dialogContainer = _interopRequireDefault(require("../dialog-container"));
+exports.NormalWindow = void 0;
+var _react = require("react");
+var _mobxReact = require("mobx-react");
+var _store = require("../../store.base");
 var _env = require("agora-foundation/lib/utilities/env");
-var _useElectron = require("../../hooks/useElectron");
+var _reactDom = require("react-dom");
+var _dialogContainer = require("../dialog-container");
 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; }
-function NormalWindow(props) {
-  var title = props.title,
-    children = props.children,
-    dialogKey = props.dialogKey,
-    width = props.width,
-    height = props.height,
-    config = props.config,
-    onOpened = props.onOpened,
-    onClose = props.onClose,
-    hooksConfig = props.hooksConfig,
-    actions = props.actions,
-    style = props.style,
-    closeInterception = props.closeInterception,
-    closable = props.closable,
-    autoHeight = props.autoHeight,
-    onlyElectron = props.onlyElectron;
-  var container = /*#__PURE__*/(0, _jsxRuntime.jsx)(_dialogContainer["default"], {
-    title: title === false || title ? title : config.title,
-    width: width || config.width,
-    height: height || config.height,
-    maxWidth: config.maxWidth,
-    maxHeight: config.maxHeight,
-    minWidth: config.minWidth,
-    minHeight: config.minHeight,
+var NormalWindow = exports.NormalWindow = (0, _mobxReact.observer)(function (_ref) {
+  var dialogKey = _ref.dialogKey,
+    dialogId = _ref.dialogId,
+    body = _ref.body,
+    title = _ref.title,
+    actions = _ref.actions,
+    closable = _ref.closable,
+    autoHeight = _ref.autoHeight,
+    width = _ref.width,
+    height = _ref.height,
+    header = _ref.header,
+    minWidth = _ref.minWidth,
+    minHeight = _ref.minHeight,
+    maxWidth = _ref.maxWidth,
+    maxHeight = _ref.maxHeight;
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
+    getDialogRootNode = _useContext.getDialogRootNode,
+    handleDialogClose = _useContext.handleDialogClose;
+  var onClose = (0, _react.useCallback)(function () {
+    handleDialogClose(dialogId);
+  }, [dialogId]);
+  var container = /*#__PURE__*/(0, _jsxRuntime.jsx)(_dialogContainer.DialogContainer, {
+    title: title || header,
     dialogKey: dialogKey,
     actions: actions,
-    style: style,
     onClose: onClose,
     closable: closable,
+    width: width,
+    height: height,
+    minWidth: minWidth,
+    minHeight: minHeight,
+    maxWidth: maxWidth,
+    maxHeight: maxHeight,
     autoHeight: autoHeight,
-    closeInterception: closeInterception,
-    children: children
+    children: body
   });
   if ((0, _env.isElectron)()) {
-    (0, _useElectron.useElectronDialog)(_objectSpread({
-      config: config,
-      dialogKey: dialogKey,
-      children: onlyElectron ? children : container,
-      onOpened: onOpened,
-      onClose: onClose
-    }, hooksConfig));
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});
+    var dialogRoot = getDialogRootNode(dialogKey, dialogId);
+    return /*#__PURE__*/(0, _reactDom.createPortal)(container, dialogRoot);
   }
-  return props.onlyElectron ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {}) : container;
-}
+  return container;
+});

package/lib/modules/dialog/dialogs/annotation-tool/index.d.ts

@@ -1,4 +1,7 @@
-import { PropsWithChildren } from 'react';
+import { FC, PropsWithChildren } from 'react';
+import { FcrUIDialogProps } from '../../type';
 export declare const title = "Annotation tool bar";
-export declare const config: Electron.BrowserWindowConstructorOptions;
-export declare const AnnotationBarDialog: (props: PropsWithChildren<{}>) => import("react/jsx-runtime").JSX.Element;
+export declare const windowConfig: Electron.BrowserWindowConstructorOptions;
+type AnnotationBarDialogProps = PropsWithChildren<FcrUIDialogProps>;
+export declare const AnnotationBarDialog: FC<AnnotationBarDialogProps>;
+export {};

package/lib/modules/dialog/dialogs/annotation-tool/index.js

@@ -1,18 +1,15 @@
 "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.title = exports.config = exports.AnnotationBarDialog = void 0;
-var _constant = require("../../../../utilities/constant");
+exports.windowConfig = exports.title = exports.AnnotationBarDialog = void 0;
 var _mobxReact = require("mobx-react");
-var _hostAreaContainer = require("../../components/host-area-container");
-var _normalWindow = _interopRequireDefault(require("../../components/normal-window"));
+var _normalWindow = require("../../components/normal-window");
 var _jsxRuntime = require("react/jsx-runtime");
 var title = exports.title = 'Annotation tool bar';
-var config = exports.config = {
+var windowConfig = exports.windowConfig = {
   y: 0,
   x: 0,
   maximizable: false,
@@ -37,19 +34,21 @@ var hooksConfig = {
   fullScreen: true,
   ignoreMouseEvents: true
 };
-var AnnotationBarDialog = exports.AnnotationBarDialog = (0, _mobxReact.observer)(function (props) {
-  var children = props.children;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_normalWindow["default"], {
+var AnnotationBarDialog = exports.AnnotationBarDialog = (0, _mobxReact.observer)(function (_ref) {
+  var dialogKey = _ref.dialogKey,
+    dialogId = _ref.dialogId,
+    children = _ref.children;
+  // const body = (
+  //   <HotAreaContainer width={800} height={90} dialogKey={FcrUIDialogKey.ANNOTATION_TOOL}>
+  //     {children}
+  //   </HotAreaContainer>
+  // );
+
+  var body = children;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_normalWindow.NormalWindow, {
+    dialogKey: dialogKey,
+    dialogId: dialogId,
     title: title,
-    dialogKey: _constant.FcrUIDialogKey.ANNOTATION_TOOL,
-    config: config,
-    hooksConfig: hooksConfig,
-    onlyElectron: true,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_hostAreaContainer.HotAreaContainer, {
-      width: 800,
-      height: 90,
-      dialogKey: _constant.FcrUIDialogKey.ANNOTATION_TOOL,
-      children: children
-    })
+    body: body
   });
 });

package/lib/modules/dialog/dialogs/chat/components/actions.d.ts

@@ -1 +1,3 @@
-export declare const ChatActions: () => import("react/jsx-runtime").JSX.Element | null;
+export declare const ChatActions: ({ dialogId }: {
+    dialogId: string;
+}) => import("react/jsx-runtime").JSX.Element | null;

package/lib/modules/dialog/dialogs/chat/components/actions.js

@@ -6,28 +6,38 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ChatActions = void 0;
 var _mobxReact = require("mobx-react");
-var _react = require("react");
-var _store = require("../../../store");
 var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _iconButton = require("agora-ui-foundation/lib/components/icon-button");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _react = require("react");
+var _store = require("../../../../chat/store");
 var _jsxRuntime = require("react/jsx-runtime");
-var ChatActions = exports.ChatActions = (0, _mobxReact.observer)(function () {
+var ChatActions = exports.ChatActions = (0, _mobxReact.observer)(function (_ref) {
+  var dialogId = _ref.dialogId;
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
+    changeChatAside = _useContext.changeChatAside;
   var transI18n = (0, _i18n.useI18n)();
-  var store = (0, _react.useContext)(_store.StoreContext);
-  var result = store.isSharingScreen && store.isSharingScreenOwner ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+
+  // TODO:
+  var isSharingScreen = false;
+  var isSharingScreenOwner = false;
+  var isMeSharingScreen = isSharingScreen && isSharingScreenOwner;
+  var handleChatWindowAttach = function handleChatWindowAttach() {
+    changeChatAside();
+  };
+  var result = !isMeSharingScreen ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
     content: transI18n('fmt_uimanager_option_mergeview'),
     mouseEnterDelay: 0,
     trigger: "hover",
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_iconButton.FcrIconButton, {
       icon: _type.FcrIconType.FCR_WINDOWPAGE_BIGGER,
-      onClick: store.moveChatFromDialogToAside,
+      onClick: handleChatWindowAttach,
       className: "frc-window-header__icon fcr-no-drag",
       iconColors: {
         iconPrimary: 'var(--fcr_ui_scene_icontext1)'
       }
     })
-  });
+  }) : null;
   return result;
 });