fcr-ui-scene 3.7.4-rc.1 → 3.7.5

package/lib/modules/device-pretest/audio-preview/microphone-detection.js

@@ -13,8 +13,8 @@ var _i18n = require("agora-ui-foundation/lib/i18n");
 var _select = require("agora-ui-foundation/lib/components/select");
 var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
 var _button = require("agora-ui-foundation/lib/components/button");
-var _useNamespace = require("../../setting/common/useNamespace");
 var _mobxReact = require("mobx-react");
+var _useNamespace = require("../../../utilities/useNamespace");
 var _jsxRuntime = require("react/jsx-runtime");
 var MicrophoneDetection = exports.MicrophoneDetection = (0, _mobxReact.observer)(function (_ref) {
   var microphoneDeviceId = _ref.microphoneDeviceId,

package/lib/modules/device-pretest/audio-preview/speaker-control.js

@@ -50,6 +50,9 @@ var SpeakerControl = exports.SpeakerControl = (0, _mobxReact.observer)(function
       })
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: 'fcr-speaker-control__slider',
+      onMouseDown: function onMouseDown(e) {
+        return e.stopPropagation();
+      },
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_slider.FcrSlider, {
         value: speakerVolume,
         min: 0,

package/lib/modules/device-pretest/audio-preview/speaker-detection.js

@@ -13,8 +13,8 @@ var _i18n = require("agora-ui-foundation/lib/i18n");
 var _select = require("agora-ui-foundation/lib/components/select");
 var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
 var _button = require("agora-ui-foundation/lib/components/button");
-var _useNamespace = require("../../setting/common/useNamespace");
 var _mobxReact = require("mobx-react");
+var _useNamespace = require("../../../utilities/useNamespace");
 var _jsxRuntime = require("react/jsx-runtime");
 var SpeakerDetection = exports.SpeakerDetection = (0, _mobxReact.observer)(function (_ref) {
   var speakerDeviceId = _ref.speakerDeviceId,

package/lib/modules/device-pretest/index.d.ts

@@ -1,5 +1,4 @@
 import './index.css';
-import 'agora-ui-foundation/lib/components/local-video-player/index.css';
 import '../setting/video-settings/index.css';
 export declare const FcrMeetingPreview: React.FC<{
     nickName: string;

package/lib/modules/device-pretest/index.js

@@ -9,13 +9,12 @@ exports.FcrMeetingPreview = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _devicePretest = require("agora-ui-foundation/lib/components/device-pretest");
-var _useNamespace = require("../../utilities/useNamespace");
-require("./index.css");
 var _react = require("react");
-var _store = require("./store");
 var _localVideoPlayer = require("agora-ui-foundation/lib/components/local-video-player");
 var _mobxReact = require("mobx-react");
-require("agora-ui-foundation/lib/components/local-video-player/index.css");
+var _useNamespace = require("../../utilities/useNamespace");
+require("./index.css");
+var _store = require("./store");
 require("../setting/video-settings/index.css");
 var _videoEffect = require("./settings/video-effect");
 var _env = require("agora-foundation/lib/utilities/env");

package/lib/modules/device-pretest/settings/beauty.d.ts

@@ -1,6 +1,6 @@
 import { FC, PropsWithChildren } from 'react';
-import { BeautyKey } from '../../setting/store';
 import { FcrBeautyOptions } from 'fcr-core/lib/media-control/type';
+import { BeautyKey } from '../../setting/type';
 export declare const Beauty: FC<PropsWithChildren<{
     enableBeauty: boolean;
     setEditBeautyKey: (key: BeautyKey) => void;

package/lib/modules/device-pretest/settings/beauty.js

@@ -15,10 +15,10 @@ var _switch = require("agora-ui-foundation/lib/components/switch");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _mobxReact = require("mobx-react");
 var _react = require("react");
-var _useNamespace = require("../../setting/common/useNamespace");
-var _store = require("../../setting/store");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
+var _localVideoPlayer = require("agora-ui-foundation/lib/components/local-video-player");
+var _useNamespace = require("../../../utilities/useNamespace");
 var _jsxRuntime = require("react/jsx-runtime");
 var BeautyOptionsCard = function BeautyOptionsCard(props) {
   var ns = (0, _useNamespace.useNamespace)('beauty-setting');
@@ -104,7 +104,7 @@ var Beauty = exports.Beauty = (0, _mobxReact.observer)(function (_ref) {
           isDisabled: !enableBeauty,
           card: item.card,
           isActive: item.key === currentBeautyKey,
-          isHightLight: item.key !== 'none' && beautySettingOption[item.key] !== _store.DEFAULT_BEAUTY_VALUE,
+          isHightLight: item.key !== 'none' && beautySettingOption[item.key] !== _localVideoPlayer.DEFAULT_BEAUTY_VALUE,
           onCardClick: function onCardClick() {
             return handleCardClick(item.key);
           }

package/lib/modules/device-pretest/settings/video-effect.js

@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.VideoEffect = void 0;
 var _tabs = require("agora-ui-foundation/lib/components/tabs");
 var _mobxReact = require("mobx-react");
-var _useNamespace = require("../../setting/common/useNamespace");
 var _i18n = require("agora-ui-foundation/lib/i18n");
+var _useNamespace = require("../../../utilities/useNamespace");
 var _jsxRuntime = require("react/jsx-runtime");
 // import './index.css';
 

package/lib/modules/device-pretest/settings/video-settings-basic.js

@@ -8,7 +8,6 @@ exports.VideoSettingsBasic4Custom = void 0;
 require("core-js/modules/es.array.concat.js");
 var _react = require("react");
 var _i18n = require("agora-ui-foundation/lib/i18n");
-var _useNamespace = require("../../setting/common/useNamespace");
 var _mobxReact = require("mobx-react");
 var _cameraSelect = require("./camera-select");
 var _microphoneDetection = require("../audio-preview/microphone-detection");
@@ -16,6 +15,7 @@ var _store = require("../store");
 var _volumeIndicator = require("agora-ui-foundation/lib/components/volume-indicator");
 var _speakerDetection = require("../audio-preview/speaker-detection");
 var _constant = require("../../../utilities/constant");
+var _useNamespace = require("../../../utilities/useNamespace");
 var _jsxRuntime = require("react/jsx-runtime");
 var VideoSettingsBasic4Custom = exports.VideoSettingsBasic4Custom = (0, _mobxReact.observer)(function () {
   var ns = (0, _useNamespace.useNamespace)('video-settings-basic_preview');

package/lib/modules/device-pretest/settings/virtual-background-setting.js

@@ -11,7 +11,6 @@ require("core-js/modules/es.function.name.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.map.js");
-var _useNamespace = require("../../setting/common/useNamespace");
 var _virtualBackdoundResources = require("../assets/virtual-backdound-resources");
 var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
 var _icon = require("agora-ui-foundation/lib/components/icon");
@@ -20,6 +19,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _mobxReact = require("mobx-react");
 var _lodash = require("lodash");
 var _i18n = require("agora-ui-foundation/lib/i18n");
+var _useNamespace = require("../../../utilities/useNamespace");
 var _jsxRuntime = require("react/jsx-runtime");
 var VirtualBackgroundSetting = exports.VirtualBackgroundSetting = (0, _mobxReact.observer)(function (_ref) {
   var currentVirtualBackgroundName = _ref.currentVirtualBackgroundName,

package/lib/modules/device-pretest/store.d.ts

@@ -1,10 +1,11 @@
 import { FcrBeautyOptions } from 'fcr-core/lib/media-control/type';
 import { TabKeyType } from './settings/video-effect';
 import { VirtualBackground } from './assets/virtual-backdound-resources';
-import { BeautyKey, DeviceItem } from '../setting/store';
 import { FcrUIBeautyKey } from '../../type';
 import { FcrUIDeviceProvider } from '../../providers/device-provider';
-export declare class FcrPretestStore {
+import { BeautyKey, DeviceItem } from '../setting/type';
+import { FcrUIManagedObject } from '../../object-manager';
+export declare class FcrPretestStore implements FcrUIManagedObject {
     accessor previewCameraEnabled: boolean;
     accessor activeTab: TabKeyType;
     accessor currentBeautyKey: FcrUIBeautyKey;

package/lib/modules/dialog/components/confirm/index.d.ts

@@ -0,0 +1,5 @@
+import { ConfirmContentProps } from 'agora-ui-foundation/lib/components/confirm-content';
+export declare const ConfirmWindow: ({ id, confirm }: {
+    confirm: ConfirmContentProps;
+    id: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/dialog/components/confirm/index.js

@@ -0,0 +1,180 @@
+"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.ConfirmWindow = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _mobxReact = require("mobx-react");
+var _confirmContent = require("agora-ui-foundation/lib/components/confirm-content");
+var _react = require("@use-gesture/react");
+var _react2 = require("react");
+var _store = require("../../store.base");
+var _env = require("agora-foundation/lib/utilities/env");
+var _dialogUtils = require("../../../../utilities/dialog-utils");
+var _platform = require("../../../../utilities/platform");
+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 ConfirmWindow = exports.ConfirmWindow = (0, _mobxReact.observer)(function (_ref) {
+  var _confirmBodyRef$curre;
+  var id = _ref.id,
+    confirm = _ref.confirm;
+  var _confirm$width = confirm.width,
+    width = _confirm$width === void 0 ? 320 : _confirm$width,
+    heightInProps = confirm.height,
+    icon = confirm.icon;
+  var _useContext = (0, _react2.useContext)(_store.StoreContext),
+    handleConfirmMouseover = _useContext.handleConfirmMouseover,
+    handleConfirmMouseout = _useContext.handleConfirmMouseout,
+    removeObserverWindow = _useContext.removeObserverWindow,
+    setObserverWindow = _useContext.setObserverWindow,
+    addScreenObserver = _useContext.addScreenObserver,
+    removeScreenObserver = _useContext.removeScreenObserver,
+    log = _useContext.log,
+    screenBounds = _useContext.screenBounds,
+    calculateMethods = _useContext.calculateMethods;
+  var confirmBodyRef = (0, _react2.useRef)(null);
+  var windowFocusTimerRef = (0, _react2.useRef)();
+  var _useState = (0, _react2.useState)({
+      x: 0,
+      y: 0
+    }),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    bounds = _useState2[0],
+    setBounds = _useState2[1];
+  var heightWithIcon = icon ? 160 : 150;
+  var rectHeight = (_confirmBodyRef$curre = confirmBodyRef.current) === null || _confirmBodyRef$curre === void 0 ? void 0 : _confirmBodyRef$curre.getBoundingClientRect().height;
+  var height = heightInProps || rectHeight || heightWithIcon;
+  var defaultSize = {
+    width: width,
+    height: height
+  };
+  var baseBounds = (0, _react2.useMemo)(function () {
+    var _ref2 = screenBounds || {
+        width: window.innerWidth,
+        height: window.innerHeight
+      },
+      width = _ref2.width,
+      height = _ref2.height;
+    return {
+      x: width / 2 - defaultSize.width / 2,
+      y: height / 2 - defaultSize.height / 2,
+      width: width,
+      height: height
+    };
+  }, [screenBounds]);
+  var bind = (0, _react.useDrag)(function (_ref3) {
+    var _ref3$delta = (0, _slicedToArray2["default"])(_ref3.delta, 2),
+      dx = _ref3$delta[0],
+      dy = _ref3$delta[1];
+    var x = bounds.x + dx;
+    var y = bounds.y + dy;
+    var maxX = baseBounds.width - defaultSize.width;
+    var maxY = baseBounds.height - defaultSize.height;
+    var coord = {
+      x: Math.max(0, Math.min(maxX, x)),
+      y: Math.max(0, Math.min(maxY, y))
+    };
+    if (rectHeight) {
+      setObserverWindow(id, _objectSpread({
+        width: defaultSize.width,
+        height: rectHeight
+      }, coord));
+    } else {
+      log.error('[view]: confirm rect size is undefined');
+    }
+    setBounds(coord);
+  });
+  (0, _react2.useEffect)(function () {
+    setBounds({
+      x: baseBounds.x,
+      y: baseBounds.y
+    });
+  }, [screenBounds]);
+  function recalculate(bounds) {
+    if (windowFocusTimerRef.current) {
+      clearTimeout(windowFocusTimerRef.current);
+      windowFocusTimerRef.current = undefined;
+    }
+    if ((0, _env.isElectron)() && (0, _platform.isWindows)() && confirmBodyRef.current && screenBounds) {
+      (0, _dialogUtils.handleCheckMouseOver)({
+        elem: confirmBodyRef.current,
+        screenBounds: bounds || screenBounds,
+        callback: function callback(timerId) {
+          windowFocusTimerRef.current = timerId;
+        },
+        setIgnoreMouse: handleConfirmMouseout,
+        setUnignoreMouse: handleConfirmMouseover
+      });
+    }
+  }
+  (0, _react2.useEffect)(function () {
+    if ((0, _env.isElectron)() && (0, _platform.isMac)()) {
+      if (confirm.className === 'confirm-mouseover') {
+        handleConfirmMouseover();
+      } else {
+        handleConfirmMouseout();
+      }
+    }
+    return function () {
+      removeObserverWindow(id);
+    };
+  }, [confirm.className]);
+  (0, _react2.useEffect)(function () {
+    recalculate();
+    !calculateMethods.has(confirm) && calculateMethods.set(confirm, recalculate);
+    addScreenObserver(recalculate);
+    return function () {
+      clearTimeout(windowFocusTimerRef.current);
+      calculateMethods["delete"](confirm);
+      removeScreenObserver(recalculate);
+      handleConfirmMouseout();
+    };
+  }, []);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, bind()), {}, {
+    onMouseLeave: handleConfirmMouseout,
+    onMouseEnter: handleConfirmMouseover,
+    onMouseMove: handleConfirmMouseover,
+    onMouseOver: handleConfirmMouseover,
+    onClick: handleConfirmMouseover,
+    style: {
+      width: defaultSize.width,
+      height: confirm.height || 'auto',
+      left: "".concat(bounds.x, "px"),
+      top: "".concat(bounds.y, "px"),
+      position: 'absolute',
+      touchAction: 'none'
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      ref: confirmBodyRef,
+      onClick: function onClick(e) {
+        return e.stopPropagation();
+      },
+      onKeyUp: function onKeyUp(e) {
+        return e.stopPropagation();
+      },
+      onKeyDown: function onKeyDown(e) {
+        return e.stopPropagation();
+      },
+      className: "fcr-confirm-dialog-wrapper_web",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_confirmContent.ConfirmContent, _objectSpread({}, confirm))
+    })
+  }));
+});

package/lib/modules/dialog/components/dialog-container/component/body.d.ts

@@ -1,9 +1,11 @@
-import { PropsWithChildren } from 'react';
+import { FC, PropsWithChildren } from 'react';
 import '../index.css';
-export declare function DialogContainerBody(props: PropsWithChildren<{
-    onClick: () => void;
-    title?: string | React.ReactNode;
-    actions?: React.ReactNode;
-    autoHeight?: boolean;
-    closable?: boolean;
-}>): import("react/jsx-runtime").JSX.Element;
+type DialogBodyProps = PropsWithChildren<{
+    title: string | React.ReactNode;
+    actions: React.ReactNode;
+    autoHeight: boolean;
+    closable: boolean;
+    onClose?: () => void;
+}>;
+export declare const DialogContainerBody: FC<DialogBodyProps>;
+export {};

package/lib/modules/dialog/components/dialog-container/component/body.js

@@ -1,35 +1,51 @@
 "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.DialogContainerBody = DialogContainerBody;
-var _react = require("react");
+exports.DialogContainerBody = void 0;
 require("../index.css");
 var _env = require("agora-foundation/lib/utilities/env");
-var _useElectron = require("../../../hooks/useElectron");
-var _isBoolean = _interopRequireDefault(require("lodash/isBoolean"));
 var _jsxRuntime = require("react/jsx-runtime");
-function DialogContainerBody(props) {
-  var actions = props.actions,
-    title = props.title,
-    children = props.children,
-    onClick = props.onClick,
-    autoHeight = props.autoHeight,
-    closable = props.closable;
-  var _ref = (0, _env.isElectron)() ? (0, _react.useContext)(_useElectron.DialogInstanceContext) : {
-      resizable: false
-    },
-    resizable = _ref.resizable;
+var DialogContainerBody = exports.DialogContainerBody = function DialogContainerBody(_ref) {
+  var actions = _ref.actions,
+    title = _ref.title,
+    children = _ref.children,
+    onClose = _ref.onClose,
+    autoHeight = _ref.autoHeight,
+    closable = _ref.closable;
+  // const { bind } = useContext(DialogContainerStore);
+
+  // const { resizable } = isElectron() ? useContext(DialogInstanceContext) : { resizable: false };
+
+  var hasTitleOrActions = title || actions;
+  var resizable = false;
+  var electronContentHeight = 'calc(100vh - 76px)'; /* 76px 包含 46px 的 title 高度，和 30px 的阴影 */
+  var contentHeight = 'calc(100% - 46px)'; /* 浏览器不需要减去阴影，高度需要 100% 减去 46px title */
+
+  if (autoHeight) {
+    electronContentHeight = 'auto';
+  }
+  if ((0, _env.isElectron)()) {
+    contentHeight = electronContentHeight;
+  }
+  if (resizable) {
+    contentHeight = 'calc(100% - 46px)'; /* 当窗口需要拉伸时，会传值为 false 的 hasCustomShadow 过来，高度不需要自适应，所以内容区高度为 100vh 减去 title 高度 46px */
+  }
+  var contentStyle = hasTitleOrActions ? {
+    height: contentHeight
+  } : {};
+  var hasClose = closable;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "fcr-dialog-container ".concat(!resizable && 'fcr-dialog-container_shadow'),
     onClick: function onClick(e) {
       return e.stopPropagation();
     },
-    children: [(title || actions) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("header", {
-      className: "fcr-dialog-container-header",
+    children: [hasTitleOrActions ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("header", {
+      className: "fcr-dialog-container-header"
+      // {...bind?.()}
+      ,
       children: [actions && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         style: {
           flex: 1
@@ -40,18 +56,16 @@ function DialogContainerBody(props) {
         className: "fcr-dialog-container-actions",
         children: actions
       })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("section", {
+    }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)("section", {
       className: "fcr-dialog-container-content",
-      style: title || actions ? {
-        height: resizable ? 'calc(100% - 46px)' /* 当窗口需要拉伸时，会传值为 false 的 hasCustomShadow 过来，高度不需要自适应，所以内容区高度为 100vh 减去 title 高度 46px */ : (0, _env.isElectron)() ? autoHeight ? 'auto' : 'calc(100vh - 76px)' /* 76px 包含 46px 的 title 高度，和 30px 的阴影 */ : 'calc(100% - 46px)' /* 浏览器不需要减去阴影，高度需要 100% 减去 46px title */
-      } : {},
+      style: contentStyle,
       children: children
-    }), (!(0, _isBoolean["default"])(closable) || closable) && /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
+    }), hasClose ? /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
       className: "fcr-dialog-container-close",
-      onClick: onClick,
+      onClick: onClose,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         children: "\xD7"
       })
-    })]
+    }) : null]
   });
-}
+};

package/lib/modules/dialog/components/dialog-container/index.css

@@ -3,6 +3,9 @@
   position: relative;
   flex: 1;
   width: 100%;
+  /* height: 100%; 此处设置 100% 会影响自适应高度布局 */
+  box-sizing: border-box;
+  overflow: hidden;
   font-family:
     ui-sans-serif,
     system-ui,

package/lib/modules/dialog/components/dialog-container/index.d.ts

@@ -1,10 +1,7 @@
+import React, { FC } from 'react';
 import { PropsWithChildren } from 'react';
 import { FcrUIDialogKey } from '../../../../utilities/constant';
-import React from 'react';
-export declare const DialogContainerStore: React.Context<{
-    bind: () => object;
-}>;
-declare const DialogContainer: (props: PropsWithChildren<{
+type DialogContainerProps = PropsWithChildren<{
     width?: number;
     height?: number;
     dialogKey: FcrUIDialogKey;
@@ -20,5 +17,6 @@ declare const DialogContainer: (props: PropsWithChildren<{
     maxHeight?: number;
     minWidth?: number;
     minHeight?: number;
-}>) => import("react/jsx-runtime").JSX.Element;
-export default DialogContainer;
+}>;
+export declare const DialogContainer: FC<DialogContainerProps>;
+export {};

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

@@ -25,65 +25,61 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.DialogContainerStore = void 0;
+exports.DialogContainer = void 0;
 require("core-js/modules/es.parse-int.js");
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _mobxReact = require("mobx-react");
 var _env = require("agora-foundation/lib/utilities/env");
-var _store = require("../../store");
 var _body = require("./component/body");
 var _reactRnd = require("react-rnd");
+var _levelConfig = require("../../level-config");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 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 DialogContainerStore = exports.DialogContainerStore = /*#__PURE__*/(0, _react.createContext)({});
-var DialogContainer = (0, _mobxReact.observer)(function (props) {
-  var width = props.width,
-    height = props.height,
-    title = props.title,
-    onClose = props.onClose,
-    children = props.children,
-    dialogKey = props.dialogKey,
-    actions = props.actions,
-    closeInterception = props.closeInterception,
-    dialogId = props.dialogId,
-    autoHeight = props.autoHeight,
-    closable = props.closable,
-    style = props.style,
-    maxWidth = props.maxWidth,
-    maxHeight = props.maxHeight,
-    minWidth = props.minWidth,
-    minHeight = props.minHeight;
-  var _ref = (0, _react.useContext)(_store.StoreContext) || {
-      closeDialogByKey: onClose
-    },
-    closeDialogByKey = _ref.closeDialogByKey,
-    closeDilaogByDialogId = _ref.closeDilaogByDialogId;
-  var handleClose = function handleClose() {
-    if (!(closeInterception !== null && closeInterception !== void 0 && closeInterception())) {
-      if (dialogId) {
-        closeDilaogByDialogId(dialogId);
-      } else {
-        closeDialogByKey(dialogKey);
-      }
-      onClose === null || onClose === void 0 || onClose();
-    }
-  };
-  var container = /*#__PURE__*/(0, _jsxRuntime.jsx)(_body.DialogContainerBody, {
+var DialogContainer = exports.DialogContainer = (0, _mobxReact.observer)(function (_ref) {
+  var width = _ref.width,
+    height = _ref.height,
+    title = _ref.title,
+    _onClose = _ref.onClose,
+    children = _ref.children,
+    actions = _ref.actions,
+    autoHeight = _ref.autoHeight,
+    closable = _ref.closable,
+    style = _ref.style,
+    maxWidth = _ref.maxWidth,
+    maxHeight = _ref.maxHeight,
+    minWidth = _ref.minWidth,
+    minHeight = _ref.minHeight;
+  var dialogBody = /*#__PURE__*/(0, _jsxRuntime.jsx)(_body.DialogContainerBody, {
     title: title,
-    onClick: handleClose,
     actions: actions,
-    closable: closable,
-    autoHeight: autoHeight,
+    autoHeight: autoHeight !== null && autoHeight !== void 0 ? autoHeight : true,
+    closable: closable !== null && closable !== void 0 ? closable : true,
+    onClose: _onClose,
     children: children
   });
-  if ((0, _env.isElectron)()) return container;
-  var rndRef = (0, _react.useRef)(null);
+  if ((0, _env.isElectron)()) return dialogBody;
+  var _useState = (0, _react.useState)({
+      width: width || 400,
+      height: height || 160
+    }),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    webSize = _useState2[0],
+    updateSize = _useState2[1];
   var windowWidth = window.innerWidth;
   var windowHeight = window.innerHeight;
+  var x = windowWidth / 2 - webSize.width / 2;
+  var y = windowHeight / 2 - webSize.height / 2;
+  var _useState3 = (0, _react.useState)({
+      x: x,
+      y: y
+    }),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    position = _useState4[0],
+    updatePosition = _useState4[1];
 
   // 应用尺寸限制的辅助函数
   var constrainSize = function constrainSize(newSize) {
@@ -110,30 +106,15 @@ var DialogContainer = (0, _mobxReact.observer)(function (props) {
       height: constrainedHeight
     };
   };
-  var _useState = (0, _react.useState)({
-      width: width || 400,
-      height: height || 160
-    }),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    size = _useState2[0],
-    updateSize = _useState2[1];
-  var x = windowWidth / 2 - size.width / 2;
-  var y = windowHeight / 2 - size.height / 2;
-  var _useState3 = (0, _react.useState)({
-      x: x,
-      y: y
-    }),
-    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-    position = _useState4[0],
-    updatePosition = _useState4[1];
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRnd.Rnd, {
     style: _objectSpread({
       position: 'absolute',
       touchAction: 'none',
       display: 'flex',
-      flexDirection: 'column'
+      flexDirection: 'column',
+      zIndex: _levelConfig.WEB_DIALOG_LAYER.NORMAL_DIALOG
     }, style),
-    size: size,
+    size: webSize,
     position: position,
     minWidth: minWidth,
     minHeight: minHeight,
@@ -153,7 +134,6 @@ var DialogContainer = (0, _mobxReact.observer)(function (props) {
       updateSize(newSize);
       updatePosition(position);
     },
-    children: container
+    children: dialogBody
   });
-});
-var _default = exports["default"] = DialogContainer;
+});

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

@@ -9,4 +9,4 @@ export declare const HotAreaContainer: (props: PropsWithChildren<{
     height: number;
     dialogKey: FcrUIDialogKey;
     placement?: ToolTipProps["placement"];
-}>) => import("react/jsx-runtime").JSX.Element;
+}>) => void;