fcr-ui-scene 3.8.1-beta → 3.8.2

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

@@ -0,0 +1,220 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+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) { _defineProperty(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; }
+import "core-js/modules/es.array.map.js";
+import "core-js/modules/es.symbol.js";
+import "core-js/modules/es.array.filter.js";
+import "core-js/modules/es.array.for-each.js";
+import "core-js/modules/es.array.push.js";
+import "core-js/modules/es.object.define-properties.js";
+import "core-js/modules/es.object.define-property.js";
+import "core-js/modules/es.object.get-own-property-descriptor.js";
+import "core-js/modules/es.object.get-own-property-descriptors.js";
+import "core-js/modules/es.object.keys.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/esnext.iterator.constructor.js";
+import "core-js/modules/esnext.iterator.filter.js";
+import "core-js/modules/esnext.iterator.for-each.js";
+import "core-js/modules/esnext.iterator.map.js";
+import "core-js/modules/web.dom-collections.for-each.js";
+import { FcrCard } from 'agora-ui-foundation/lib/components/card';
+import { FcrButton } from 'agora-ui-foundation/lib/components/button';
+import { observer } from 'mobx-react';
+import { useCallback, useContext, useEffect, useMemo } from 'react';
+import { uint8ArrayToImageData } from '../../../../utilities/tools';
+import { FcrToolTip } from 'agora-ui-foundation/lib/components/tooltip';
+import { useI18n } from 'agora-ui-foundation/lib/i18n';
+import { StoreContext } from '../../store.base';
+import { FcrIcon } from 'agora-ui-foundation/lib/components/icon';
+import { FcrShareScenario } from '../share-scenario';
+import { ShareAudio } from 'agora-ui-foundation/lib/components/room-screen-share-state-bar/share-audio';
+import './index.css';
+import { FcrUIShareType } from '../../type';
+import { FcrIconType } from 'agora-ui-foundation/lib/components/icon/type';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+export var ShareSelection = observer(function () {
+  var _useContext = useContext(StoreContext),
+    handleSelectionOpen = _useContext.handleSelectionOpen;
+  useEffect(function () {
+    handleSelectionOpen();
+  }, []);
+  return /*#__PURE__*/_jsxs("div", {
+    className: "share-selection-window",
+    children: [/*#__PURE__*/_jsx(ShareSelectionList, {}), /*#__PURE__*/_jsx(ShareSelectionFooter, {})]
+  });
+});
+var ShareSelectionList = observer(function () {
+  var _useContext2 = useContext(StoreContext),
+    displayList = _useContext2.displayList,
+    applicationList = _useContext2.applicationList;
+  var transI18n = useI18n();
+  var isApplicationListEmpty = applicationList.length === 0;
+  return /*#__PURE__*/_jsxs("div", {
+    className: "share-selection-window__share-content",
+    children: [/*#__PURE__*/_jsxs("div", {
+      className: "share-selection-window__share-windows share-selection-window__share-card",
+      children: [/*#__PURE__*/_jsx(WhiteboardCard, {
+        id: FcrUIShareType.WHITEBOARD
+      }), displayList.map(function (item) {
+        return /*#__PURE__*/_jsx(ScreenCard, _objectSpread({}, item), item.id);
+      })]
+    }), !isApplicationListEmpty && /*#__PURE__*/_jsxs("div", {
+      children: [/*#__PURE__*/_jsx("div", {
+        style: {
+          marginTop: '38px'
+        },
+        children: transI18n('fmt_uimanager_labels_Application')
+      }), /*#__PURE__*/_jsx("div", {
+        className: "share-selection-window__share-application share-selection-window__share-card",
+        children: applicationList.map(function (item) {
+          return /*#__PURE__*/_jsx(ScreenCard, _objectSpread({}, item), item.id);
+        })
+      })]
+    })]
+  });
+});
+var WhiteboardCard = observer(function (_ref) {
+  var id = _ref.id;
+  var _useContext3 = useContext(StoreContext),
+    startShareBoard = _useContext3.startShareBoard,
+    stopShareBoard = _useContext3.stopShareBoard,
+    selectedShareItem = _useContext3.selectedShareItem,
+    setSelectedItem = _useContext3.setSelectedItem,
+    isAlreadyOpened = _useContext3.isAlreadyOpened,
+    canStopOtherBoard = _useContext3.canStopOtherBoard;
+  var transI18n = useI18n();
+  var handleSetSelectedItem = useCallback(function () {
+    setSelectedItem({
+      id: id,
+      type: FcrUIShareType.WHITEBOARD
+    });
+  }, [id]);
+  return /*#__PURE__*/_jsx(FcrCard, {
+    title: transI18n('fmt_share_options_whiteboard'),
+    active: (selectedShareItem === null || selectedShareItem === void 0 ? void 0 : selectedShareItem.id) === id,
+    onCardClick: handleSetSelectedItem,
+    onDoubleClickCard: startShareBoard,
+    disabled: isAlreadyOpened,
+    content: canStopOtherBoard ? /*#__PURE__*/_jsx(FcrToolTip, {
+      trigger: "hover",
+      content: transI18n('fmt_screenshare_tips_alreadyopened'),
+      children: /*#__PURE__*/_jsx(FcrButton, {
+        styleType: "danger",
+        size: "XXS",
+        shape: "rounded",
+        onClick: stopShareBoard,
+        children: transI18n('fmt_screenshare_button_stopshare')
+      })
+    }) : /*#__PURE__*/_jsx(FcrIcon, {
+      type: FcrIconType.FCR_WHITEBOARD,
+      size: 48,
+      colors: {
+        iconPrimary: '#4262FF'
+      }
+    })
+  });
+});
+var ScreenCard = observer(function (_ref2) {
+  var title = _ref2.title,
+    id = _ref2.id,
+    image = _ref2.image,
+    imageWidth = _ref2.imageWidth,
+    imageHeight = _ref2.imageHeight,
+    type = _ref2.type,
+    bounds = _ref2.bounds;
+  var _useContext4 = useContext(StoreContext),
+    startShareScreen = _useContext4.startShareScreen,
+    selectedShareItem = _useContext4.selectedShareItem,
+    setSelectedItem = _useContext4.setSelectedItem;
+  var handleSetSelectedItem = useCallback(function () {
+    setSelectedItem({
+      id: id,
+      type: type,
+      bounds: bounds
+    });
+  }, [id, type, bounds]);
+  return /*#__PURE__*/_jsx(FcrCard, {
+    title: title,
+    active: (selectedShareItem === null || selectedShareItem === void 0 ? void 0 : selectedShareItem.id) === id,
+    onCardClick: handleSetSelectedItem,
+    onDoubleClickCard: startShareScreen,
+    content: /*#__PURE__*/_jsx(ThumbnailRender, {
+      image: image,
+      width: imageWidth,
+      height: imageHeight,
+      title: title
+    })
+  });
+});
+var ThumbnailRender = function ThumbnailRender(_ref3) {
+  var image = _ref3.image,
+    _ref3$width = _ref3.width,
+    width = _ref3$width === void 0 ? 100 : _ref3$width,
+    _ref3$height = _ref3.height,
+    height = _ref3$height === void 0 ? 100 : _ref3$height,
+    title = _ref3.title;
+  var data = useMemo(function () {
+    return uint8ArrayToImageData({
+      buffer: image,
+      width: width,
+      height: height
+    });
+  }, [image]);
+  return /*#__PURE__*/_jsx("img", {
+    src: data,
+    alt: title
+  });
+};
+var ShareSelectionFooter = observer(function () {
+  var _useContext5 = useContext(StoreContext),
+    startShareScreen = _useContext5.startShareScreen,
+    isSharingWithAudio = _useContext5.isSharingWithAudio,
+    isSharingInSmoothMode = _useContext5.isSharingInSmoothMode,
+    audioShareMode = _useContext5.audioShareMode,
+    setShareWithAudioState = _useContext5.setShareWithAudioState,
+    setShareInSmoothMode = _useContext5.setShareInSmoothMode,
+    setShareAudioMode = _useContext5.setShareAudioMode,
+    isWhiteboardSelected = _useContext5.isWhiteboardSelected,
+    startShareBoard = _useContext5.startShareBoard,
+    isAlreadyOpened = _useContext5.isAlreadyOpened;
+  var transI18n = useI18n();
+  var handleSwitchAudioType = function handleSwitchAudioType(mode) {
+    setShareAudioMode(mode);
+  };
+  var handleToggleShareAudio = function handleToggleShareAudio(enable) {
+    setShareWithAudioState(enable);
+  };
+  var handleToggleScenarioType = function handleToggleScenarioType(enable) {
+    setShareInSmoothMode(enable);
+  };
+  return /*#__PURE__*/_jsxs("div", {
+    className: "share-selection-window__footer",
+    children: [/*#__PURE__*/_jsx("div", {
+      className: "share-selection-window__footer-action",
+      children: !isWhiteboardSelected && /*#__PURE__*/_jsxs(_Fragment, {
+        children: [/*#__PURE__*/_jsx(ShareAudio, {
+          shareWithAudio: isSharingWithAudio,
+          toggleShareWithAudio: handleToggleShareAudio,
+          currentAudioChannel: audioShareMode,
+          onSwitchAudioChannel: handleSwitchAudioType
+        }), /*#__PURE__*/_jsx("div", {
+          className: "share-strategy-checkbox",
+          children: /*#__PURE__*/_jsx(FcrShareScenario, {
+            isSmoothMode: isSharingInSmoothMode,
+            toggleShareWithScenarioType: handleToggleScenarioType
+          })
+        })]
+      })
+    }), /*#__PURE__*/_jsx(FcrButton, {
+      type: "primary",
+      shape: "rounded",
+      size: "XS",
+      disabled: isWhiteboardSelected && isAlreadyOpened,
+      onClick: isWhiteboardSelected ? startShareBoard : startShareScreen,
+      children: /*#__PURE__*/_jsx("span", {
+        className: "share-selection-window__footer-start-share-txt",
+        children: transI18n('fmt_screenshare_window_button_start')
+      })
+    })]
+  });
+});

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

@@ -0,0 +1,40 @@
+import { useI18n } from 'agora-ui-foundation/lib/i18n';
+import { FcrCheckbox } from 'agora-ui-foundation/lib/components/checkbox';
+import { FcrToolTip } from 'agora-ui-foundation/lib/components/tooltip';
+import { FcrIcon } from 'agora-ui-foundation/lib/components/icon';
+import { FcrIconType } from 'agora-ui-foundation/lib/components/icon/type';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export var FcrShareScenario = function FcrShareScenario(props) {
+  var t = useI18n();
+  var isSmoothMode = props.isSmoothMode,
+    toggleShareWithScenarioType = props.toggleShareWithScenarioType;
+  return /*#__PURE__*/_jsx("div", {
+    className: "share-audio-checkbox",
+    children: /*#__PURE__*/_jsxs("div", {
+      className: "share-audio-action-button share-selectrion",
+      children: [/*#__PURE__*/_jsx(FcrCheckbox, {
+        checked: isSmoothMode,
+        label: t('fmt_uimanager_option_Fluencypriority'),
+        styleType: "brand",
+        onChange: toggleShareWithScenarioType
+      }), /*#__PURE__*/_jsx(FcrToolTip, {
+        mouseEnterDelay: 0,
+        trigger: "hover",
+        placement: "top",
+        content: t('fmt_screenshare_tips_video_smoothness'),
+        children: /*#__PURE__*/_jsx("button", {
+          style: {
+            marginLeft: '6px'
+          },
+          children: /*#__PURE__*/_jsx(FcrIcon, {
+            type: FcrIconType.FCR_EXCLAMATIONMASK,
+            size: 20,
+            colors: {
+              iconPrimary: 'var(--fcr_ui_scene_icontext1)'
+            }
+          })
+        })
+      })]
+    })
+  });
+};

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

@@ -0,0 +1,76 @@
+.share-state-bar {
+  background-color: var(--fcr_web_ui_scene_fill2);
+  border-radius: var(--fcr_cornerradius_s);
+  padding: 10px;
+  box-shadow: var(--fcr_web_light_dropup);
+  flex-direction: column;
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: center;
+}
+
+.share-state-bar__control {
+  gap: 10px;
+  height: 28px;
+  display: flex;
+  width: max-content;
+  align-items: center;
+}
+
+.share-state-bar__state {
+  gap: 10px;
+  display: flex;
+  align-items: center;
+  border-radius: var(--fcr_cornerradius_xs);
+  padding: 3px 5px 3px 3px;
+}
+
+.share-state-bar .divider-vertical {
+  border-left: 1px solid;
+  border-image: linear-gradient(to bottom, transparent 0%, #888 50%, #888 50%, transparent 100%) 1;
+}
+
+.share-state-bar__state:hover {
+  background: var(--fcr_web_ui_scene_hover);
+  color: var(--fcr_web_ui_scene_mainicon2);
+  cursor: pointer;
+}
+
+.share-state-bar__state:hover svg:nth-child(3) path {
+  fill: var(--fcr_web_ui_scene_mainicon2);
+}
+
+.share-state-bar__text {
+  width: 100px;
+  line-height: 1;
+}
+
+.share-state-bar__share_screen_preview {
+  width: 100%;
+  aspect-ratio: 16 / 9;
+  margin-top: 10px;
+  background-color: #d9d9d9;
+  border-radius: var(--fcr_cornerradius_xs);
+  overflow: hidden;
+}
+
+.share-state-bar__stop-share {
+  /* background-color: var(--fcr_ui_scene_ramp_red6); */
+  height: 24px;
+  color: var(--fcr_ui_scene_white10);
+  font-size: 12px;
+  border-radius: var(--fcr_cornerradius_xs);
+  cursor: pointer;
+}
+
+.share-state-bar .share-state-nav__drag-button:hover,
+.share-state-bar .share-state-nav__transfer-position:hover {
+  background-color: var(--fcr_web_ui_scene_hover);
+  height: 20px;
+  cursor: pointer;
+}
+
+.share-state-bar .share-state-nav__drag-button:hover path,
+.share-state-bar .share-state-nav__transfer-position:hover path {
+  fill: var(--fcr_web_ui_scene_mainicon2);
+}

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

@@ -0,0 +1,90 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import { FcrButton } from 'agora-ui-foundation/lib/components/button';
+import FcrDivider from 'agora-ui-foundation/lib/components/divider';
+import { FcrIcon } from 'agora-ui-foundation/lib/components/icon';
+import { FcrIconType } from 'agora-ui-foundation/lib/components/icon/type';
+import { forwardRef, useEffect, useRef, useState } from 'react';
+import { Rnd } from 'react-rnd';
+import './index.css';
+import { useI18n } from 'agora-ui-foundation/lib/i18n';
+import { DragIcon } from '../../../control-bar/components/share-state-nav';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export var ShareStateBar = /*#__PURE__*/forwardRef(function (props, ref) {
+  var shareScreenBarRef = useRef(null);
+  var rndRef = useRef(null);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    showPreview = _useState2[0],
+    setShowPreview = _useState2[1];
+  var t = useI18n();
+  useEffect(function () {
+    var _shareScreenBarRef$cu, _rndRef$current;
+    var _document$body = document.body,
+      offsetWidth = _document$body.offsetWidth,
+      offsetTop = _document$body.offsetTop;
+    var barWidth = ((_shareScreenBarRef$cu = shareScreenBarRef.current) === null || _shareScreenBarRef$cu === void 0 ? void 0 : _shareScreenBarRef$cu.offsetWidth) || 300;
+    (_rndRef$current = rndRef.current) === null || _rndRef$current === void 0 || _rndRef$current.updatePosition({
+      x: offsetWidth / 2 - barWidth / 2,
+      y: offsetTop
+    });
+  }, [rndRef]);
+  return /*#__PURE__*/_jsx(Rnd, {
+    bounds: "window",
+    ref: rndRef,
+    enableResizing: false,
+    dragHandleClassName: "share-state-nav__drag-icon",
+    children: /*#__PURE__*/_jsxs("div", {
+      className: "share-state-bar",
+      ref: shareScreenBarRef,
+      children: [/*#__PURE__*/_jsxs("div", {
+        className: "share-state-bar__control",
+        children: [/*#__PURE__*/_jsx(DragIcon, {}), /*#__PURE__*/_jsx(FcrDivider, {
+          type: "vertical"
+        }), /*#__PURE__*/_jsxs("div", {
+          className: "share-state-bar__state",
+          onClick: function onClick() {
+            return setShowPreview(!showPreview);
+          },
+          children: [/*#__PURE__*/_jsx(FcrIcon, {
+            type: FcrIconType.FCR_VIDEO_SHARESCREEN,
+            size: 22,
+            colors: {
+              iconPrimary: 'var(--fcr_ui_scene_ramp_green6)'
+            }
+          }), /*#__PURE__*/_jsx("div", {
+            className: "share-state-bar__text",
+            children: t('fmt_modules_labels_sharing')
+          }), /*#__PURE__*/_jsx(FcrIcon, {
+            size: 12,
+            type: FcrIconType.FCR_V2_CHEVRON_DOWN2,
+            style: {
+              transform: showPreview ? 'rotate(180deg)' : 'rotate(0deg)'
+            },
+            colors: {
+              iconPrimary: 'var(--fcr_ui_scene_icontext3)'
+            }
+          })]
+        }), /*#__PURE__*/_jsx(FcrButton, {
+          type: "primary",
+          styleType: "danger",
+          size: "XXS",
+          shape: "rounded",
+          onClick: props.onStopShare,
+          children: /*#__PURE__*/_jsxs("p", {
+            className: "share-state-bar__stop-share fcr-flex fcr-items-center fcr-justify-center",
+            children: [/*#__PURE__*/_jsx(FcrIcon, {
+              type: FcrIconType.FCR_RECORDING_STOP,
+              size: 20,
+              colors: {
+                iconPrimary: 'var(--fcr_ui_scene_white10)'
+              }
+            }), t('fmt_screenshare_controlbar_button_stop')]
+          })
+        })]
+      }), showPreview && /*#__PURE__*/_jsx("div", {
+        className: "share-state-bar__share_screen_preview",
+        ref: ref
+      })]
+    })
+  });
+});

package/lib-es/modules/share-screen/index.dev.js

@@ -0,0 +1,90 @@
+// import ReactDOM from 'react-dom';
+// import { hot } from 'react-hot-loader/root';
+// import { ShareScreenUIModule } from '.';
+// import { FcrStreamLatencyLevel, FcrUISceneConfig, FcrUserRole } from '../../type';
+// import { useUnmount } from '../../utilities/hooks';
+// import { FcrDeviceStreamStore } from '../../common/device-stream-store';
+// import { FcrprivilegeProvider } from '../../common/security-store';
+// import { FcreventProvider } from '../../common/event-control';
+// import { DialogUIModule } from '../dialog';
+// import { FcrDeviceStore } from '../../common/device-store';
+// import { FcrRoomStore } from '../../common/room-control';
+
+// const App = hot(() => null);
+
+// ReactDOM.render(<App />, document.querySelector('#root')!);
+
+// window.__DEV_ENGINE_IS_READY__.then(async () => {
+//   const engine = window.__DEV_ENGINE__;
+//   const roomId = window.__DEV_ROOM_ID__;
+//   const token = window.__DEV_USER_TOKEN__;
+//   await engine.login();
+
+//   const roomControl = engine.createMainRoomControl(roomId);
+
+//   const userName = 'test-user';
+
+//   const deviceStore = new FcrDeviceStore(engine.getDesktopMediaControl(), new FcreventProvider());
+
+//   await roomControl.join({
+//     userRole: FcrUserRole.HOST,
+//     userName,
+//     roomToken: token,
+//     streamLatency: FcrStreamLatencyLevel.ULTRA_LOW,
+//     createStreamConfigs: [],
+//   });
+
+//   const eventProvider = new FcreventProvider();
+//   const privilegeProvider = new FcrprivilegeProvider(
+//     roomControl.getPrivilegeControl(),
+//     roomControl.getUserControl(),
+//     roomControl.getStreamControl(),
+//     eventProvider,
+//   );
+//   const config = {
+//     mediaControl: engine.getDesktopMediaControl(),
+//     roomControl,
+//     privilegeProvider,
+//     deviceStore,
+//     eventProvider,
+//     roomStore: new FcrRoomStore(eventProvider, deviceStore, {} as FcrUISceneConfig, engine),
+//     streamControl: roomControl.getStreamControl(),
+//     userControl: roomControl.getUserControl(),
+//     privilegeControl: roomControl.getPrivilegeControl(),
+//     interpreterControl: roomControl.getInterpreterControl(),
+//     chatRoomControl: roomControl.getChatRoomControl(),
+//     engine: null as any,
+//     remoteVideoRenderManager: null as any,
+//     config: null as any,
+//     parameters: null as any,
+//     deviceStreamStore: null as any,
+//   };
+//   const dialogModule = new DialogUIModule(config);
+
+//   const uiModule = new ShareScreenUIModule({
+//     roomControl,
+//     mediaControl: engine.getDesktopMediaControl(),
+//     deviceStore,
+//     deviceStreamStore: new FcrDeviceStreamStore(config),
+//     privilegeProvider,
+//     eventProvider,
+//     config: {} as FcrUISceneConfig,
+//   });
+
+//   const App = hot(() => {
+//     useUnmount(() => {
+//       uiModule.onUnload();
+//       roomControl.leave();
+//       engine.logout();
+//     });
+
+//     return (
+//       <>
+//         {uiModule.getComponent()}
+//         {dialogModule.getComponent()}
+//       </>
+//     );
+//   });
+
+//   ReactDOM.render(<App />, document.querySelector('#root')!);
+// });

package/lib-es/modules/share-screen/index.js

@@ -0,0 +1,99 @@
+import "core-js/modules/es.reflect.construct.js";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import "core-js/modules/es.error.cause.js";
+import "core-js/modules/es.error.to-string.js";
+import "core-js/modules/es.array.concat.js";
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+import { UIModule } from '../../base';
+import './index.css';
+import { StoreContext } from './store.base';
+import { View } from './view';
+import { ShareSelection } from './components/selection';
+import FcrScreenShareControlBar from './components/control-bar';
+import { isElectron } from 'agora-foundation/lib/utilities/env';
+import ElectronShareScreenStore from './store.electron';
+import BrowserShareScreenStore from './store.browser';
+import { jsx as _jsx } from "react/jsx-runtime";
+export var ShareScreenUIModule = /*#__PURE__*/function (_UIModule) {
+  function ShareScreenUIModule() {
+    var _this;
+    _classCallCheck(this, ShareScreenUIModule);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, ShareScreenUIModule, [].concat(args));
+    _defineProperty(_this, "_store", null);
+    return _this;
+  }
+  _inherits(ShareScreenUIModule, _UIModule);
+  return _createClass(ShareScreenUIModule, [{
+    key: "store",
+    get: function get() {
+      if (!this._store) {
+        throw new Error('ShareScreenStore is not initialized');
+      }
+      return this._store;
+    }
+  }, {
+    key: "onNodeWillActive",
+    value: function onNodeWillActive() {
+      var args = {
+        objectManager: this.objectManager
+      };
+      this._store = isElectron() ? new ElectronShareScreenStore(args) : new BrowserShareScreenStore(args);
+    }
+  }, {
+    key: "onNodeWillInactive",
+    value: function onNodeWillInactive() {
+      this.store.release();
+    }
+
+    /**
+     * 控制栏（浏览器内）
+     * @returns
+     */
+  }, {
+    key: "getComponent",
+    value: function getComponent() {
+      return /*#__PURE__*/_jsx(StoreContext.Provider, {
+        value: this.store,
+        children: /*#__PURE__*/_jsx(View, {})
+      });
+    }
+
+    /**
+     * 共享时，视频窗顶部的控制按钮组
+     * @param secondaryWindowProprs
+     * @returns
+     */
+  }, {
+    key: "getControlComponent",
+    value: function getControlComponent(secondaryWindowProprs) {
+      return /*#__PURE__*/_jsx(StoreContext.Provider, {
+        value: this.store,
+        children: /*#__PURE__*/_jsx(FcrScreenShareControlBar, {
+          secondaryWindowProprs: secondaryWindowProprs
+        })
+      });
+    }
+
+    /**
+     * 共享选择组件
+     * @returns
+     */
+  }, {
+    key: "getSelectionComponent",
+    value: function getSelectionComponent() {
+      return /*#__PURE__*/_jsx(StoreContext.Provider, {
+        value: this.store,
+        children: /*#__PURE__*/_jsx(ShareSelection, {})
+      });
+    }
+  }]);
+}(UIModule);