@tencentcloud/roomkit-electron-vue3 2.7.1 → 2.8.1

package/es/components/Stream/common/StreamList/index.vue.d.ts

@@ -0,0 +1,27 @@
+import { StreamInfo } from '../../../../stores/room';
+import { StreamPlayMode, StreamPlayQuality } from '../../../../services/manager/mediaManager';
+
+interface Props {
+    streamInfoList?: StreamInfo[];
+    column: number;
+    row: number;
+    fillMode?: 'fill' | 'contain';
+    aspectRatio?: string;
+    streamPlayQuality?: StreamPlayQuality;
+    streamPlayMode?: StreamPlayMode;
+}
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "stream-view-dblclick": (...args: any[]) => void;
+}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>> & {
+    "onStream-view-dblclick"?: ((...args: any[]) => any) | undefined;
+}, {}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/es/components/{RoomContent → Stream/common}/StreamList/index.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./index.vue2.mjs";
 /* empty css            */
-import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.mjs";
-const StreamList = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c8176dc0"]]);
+import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.mjs";
+const StreamList = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-98fb6ce5"]]);
 export {
   StreamList as default
 };

package/es/components/{RoomContent → Stream/common}/StreamList/index.vue2.mjs

@@ -1,41 +1,59 @@
-import { defineComponent, ref, computed, watch, onMounted, onBeforeUnmount, openBlock, createElementBlock, normalizeClass, createElementVNode, normalizeStyle, Fragment, renderList, createBlock } from "vue";
+import { defineComponent, ref, computed, watch, nextTick, onMounted, onBeforeUnmount, openBlock, createElementBlock, normalizeClass, createElementVNode, normalizeStyle, Fragment, renderList, createBlock } from "vue";
 import StreamRegion from "../StreamRegion/index.vue.mjs";
-import { isPC } from "../../../utils/environment.mjs";
+import { isPC } from "../../../../utils/environment.mjs";
+import { getContentSize } from "../../../../utils/domOperation.mjs";
+import { isUndefined } from "../../../../utils/utils.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: {
     streamInfoList: {},
+    column: {},
+    row: {},
+    fillMode: {},
     aspectRatio: {},
-    horizontalCount: {},
-    verticalCount: {},
-    isNeedPlayStream: { type: Boolean, default: true },
-    observerViewInVisible: { type: Boolean }
+    streamPlayQuality: {},
+    streamPlayMode: {}
   },
-  emits: ["room-dblclick"],
-  setup(__props) {
+  emits: ["stream-view-dblclick"],
+  setup(__props, { emit: __emit }) {
+    const emits = __emit;
+    const singleStreamMargin = isPC ? 8 : 4;
     const props = __props;
     const streamListContainerRef = ref();
     const streamListRef = ref();
-    const currentPageIndex = ref(0);
-    const maxCountEveryPage = computed(
-      () => props.horizontalCount * props.verticalCount
-    );
-    const isGridLayout = computed(
-      () => props.horizontalCount !== Infinity && props.verticalCount !== Infinity
+    const isEqualPointsLayout = computed(
+      () => props.column !== Infinity && props.row !== Infinity
     );
+    const isHorizontalInfinityLayout = computed(() => props.column === Infinity);
+    const isVerticalInfinityLayout = computed(() => props.row === Infinity);
     watch(
-      () => props.streamInfoList.length,
-      (val, oldVal) => {
-        if (oldVal === 0) {
-          handleLayout();
-        }
-        if (isGridLayout.value && currentPageIndex.value > Math.ceil(val / maxCountEveryPage.value) - 1) {
-          currentPageIndex.value = Math.ceil(val / maxCountEveryPage.value) - 1;
-          handleEqualPointsLayout();
-        }
-      }
+      () => [props.column, props.row],
+      async () => {
+        await nextTick();
+        handleLayout();
+      },
+      { immediate: true }
     );
-    const singleStreamMargin = isPC ? 8 : 4;
+    const validStreamInfoList = computed(() => {
+      var _a;
+      return (_a = props.streamInfoList) == null ? void 0 : _a.filter(
+        (item) => item && item.userId && !isUndefined(item.streamType)
+      );
+    });
+    function handleLayout() {
+      if (isHorizontalInfinityLayout.value) {
+        handleHorizontalInfinityLayout();
+        return;
+      }
+      if (isVerticalInfinityLayout.value) {
+        handleVerticalInfinityLayout();
+        return;
+      }
+      if (isEqualPointsLayout.value) {
+        handleEqualPointsLayout();
+        return;
+      }
+    }
     const streamListStyle = ref({
       width: "0",
       height: "0"
@@ -59,19 +77,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return Number(props.aspectRatio.split(":")[1]);
     });
     async function handleEqualPointsLayout() {
-      const number = currentPageIndex.value > 0 ? maxCountEveryPage.value : props.streamInfoList.slice(0, maxCountEveryPage.value).length;
-      if (number <= 0 || !streamListContainerRef.value) {
+      if (!props.streamInfoList || !streamListContainerRef.value) {
         return;
       }
       const containerRect = streamListContainerRef.value.getBoundingClientRect();
       const containerWidth = Math.floor(containerRect.width);
       const containerHeight = Math.floor(containerRect.height);
-      const horizontalStreamNumber = props.horizontalCount;
-      const verticalStreamNumber = props.verticalCount;
-      const contentWidth = (containerWidth - horizontalStreamNumber * singleStreamMargin) / horizontalStreamNumber;
-      const contentHeight = (containerHeight - verticalStreamNumber * singleStreamMargin) / verticalStreamNumber;
-      let width = containerWidth;
-      let height = containerWidth;
+      const contentWidth = (containerWidth - props.column * singleStreamMargin) / props.column;
+      const contentHeight = (containerHeight - props.row * singleStreamMargin) / props.row;
+      let width = contentWidth;
+      let height = contentHeight;
       if (widthRatio.value && heightRatio.value) {
         const scaleWidth = contentWidth / widthRatio.value;
         const scaleHeight = contentHeight / heightRatio.value;
@@ -86,76 +101,26 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       streamStyle.value.width = `${width}px`;
       streamStyle.value.height = `${height}px`;
-      streamListStyle.value.width = `${horizontalStreamNumber * (width + singleStreamMargin)}px`;
-      streamListStyle.value.height = `${verticalStreamNumber * (height + singleStreamMargin)}px`;
-    }
-    function getContentSize(element) {
-      const computedStyle = getComputedStyle(element);
-      const paddingTop = Number(computedStyle.paddingTop.replace("px", ""));
-      const paddingBottom = Number(computedStyle.paddingBottom.replace("px", ""));
-      const borderTop = Number(computedStyle.borderTopWidth.replace("px", ""));
-      const borderBottom = Number(
-        computedStyle.borderBottomWidth.replace("px", "")
-      );
-      const paddingLeft = Number(computedStyle.paddingLeft.replace("px", ""));
-      const paddingRight = Number(computedStyle.paddingRight.replace("px", ""));
-      const borderLeft = Number(computedStyle.borderLeftWidth.replace("px", ""));
-      const borderRight = Number(computedStyle.borderRightWidth.replace("px", ""));
-      const contentWidth = element.offsetWidth - paddingLeft - paddingRight - borderLeft - borderRight;
-      const contentHeight = element.offsetHeight - paddingTop - paddingBottom - borderTop - borderBottom;
-      return { width: contentWidth, height: contentHeight };
+      streamListStyle.value.width = `${props.column * (width + singleStreamMargin)}px`;
+      streamListStyle.value.height = `${props.row * (height + singleStreamMargin)}px`;
     }
     function handleHorizontalInfinityLayout() {
       streamListStyle.value = {};
       const contentHeight = getContentSize(streamListContainerRef.value).height;
-      const contentWidth = contentHeight * 16 / 9;
+      const contentWidth = contentHeight * widthRatio.value / heightRatio.value;
       streamStyle.value.width = `${contentWidth}px`;
       streamStyle.value.height = `${contentHeight}px`;
     }
     function handleVerticalInfinityLayout() {
       streamListStyle.value = {};
       const contentWidth = getContentSize(streamListContainerRef.value).width;
-      const contentHeight = contentWidth * 9 / 16;
+      const contentHeight = contentWidth * heightRatio.value / widthRatio.value;
       streamStyle.value.width = `${contentWidth}px`;
       streamStyle.value.height = `${contentHeight}px`;
     }
-    const isHorizontalInfinityLayout = computed(
-      () => props.horizontalCount === Infinity
-    );
-    const isVerticalInfinityLayout = computed(
-      () => props.verticalCount === Infinity
-    );
-    const isEqualPointsLayout = computed(
-      () => props.horizontalCount !== Infinity && props.verticalCount !== Infinity
-    );
-    function handleLayout() {
-      if (isHorizontalInfinityLayout.value) {
-        handleHorizontalInfinityLayout();
-        return;
-      }
-      if (isVerticalInfinityLayout.value) {
-        handleVerticalInfinityLayout();
-        return;
-      }
-      if (isEqualPointsLayout.value) {
-        handleEqualPointsLayout();
-        return;
-      }
+    function handleStreamDblClick(streamInfo) {
+      emits("stream-view-dblclick", streamInfo);
     }
-    onMounted(() => {
-      handleLayout();
-    });
-    watch(
-      () => [
-        props.horizontalCount,
-        props.verticalCount,
-        props.streamInfoList.length
-      ],
-      () => {
-        handleLayout();
-      },
-      { immediate: true }
-    );
     const resizeObserver = new ResizeObserver(() => {
       handleLayout();
     });
@@ -185,17 +150,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           style: normalizeStyle(streamListStyle.value),
           onWheel: handleWheel
         }, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.streamInfoList, (streamInfo) => {
+          (openBlock(true), createElementBlock(Fragment, null, renderList(validStreamInfoList.value, (streamInfo) => {
             return openBlock(), createBlock(StreamRegion, {
               class: "stream-list-item",
               key: `${streamInfo.userId}_${streamInfo.streamType}`,
-              onRoomDblclick: ($event) => _ctx.$emit("room-dblclick", streamInfo),
               streamInfo,
               style: normalizeStyle(streamStyle.value),
-              isNeedPlayStream: _ctx.isNeedPlayStream,
-              observerViewInVisible: _ctx.observerViewInVisible,
-              isEnlarge: false
-            }, null, 8, ["onRoomDblclick", "streamInfo", "style", "isNeedPlayStream", "observerViewInVisible"]);
+              streamPlayMode: _ctx.streamPlayMode,
+              streamPlayQuality: _ctx.streamPlayQuality,
+              onStreamViewDblclick: handleStreamDblClick
+            }, null, 8, ["streamInfo", "style", "streamPlayMode", "streamPlayQuality"]);
           }), 128))
         ], 36)
       ], 2);

package/{lib/components/RoomContent/StreamRegion → es/components/Stream/common}/StreamPlay/index.vue.d.ts

@@ -1,17 +1,20 @@
 import { StreamInfo } from '../../../../stores/room';
+import { StreamPlayMode, StreamPlayQuality } from '../../../../services/manager/mediaManager';
 
 interface Props {
     streamInfo: StreamInfo;
-    isEnlarge: boolean;
-    isNeedPlayStream?: boolean;
-    observerViewInVisible?: boolean;
+    streamPlayQuality?: StreamPlayQuality;
+    streamPlayMode?: StreamPlayMode;
 }
 declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
-    isNeedPlayStream: boolean;
+    streamPlayQuality: StreamPlayQuality;
+    streamPlayMode: StreamPlayMode;
 }>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
-    isNeedPlayStream: boolean;
+    streamPlayQuality: StreamPlayQuality;
+    streamPlayMode: StreamPlayMode;
 }>>>, {
-    isNeedPlayStream: boolean;
+    streamPlayQuality: StreamPlayQuality;
+    streamPlayMode: StreamPlayMode;
 }, {}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;

package/es/components/{RoomContent/StreamRegion → Stream/common}/StreamPlay/index.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./index.vue2.mjs";
 /* empty css            */
 import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.mjs";
-const StreamPlay = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-41b7eb08"]]);
+const StreamPlay = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-8eda9173"]]);
 export {
   StreamPlay as default
 };

package/es/components/{RoomContent/StreamRegion → Stream/common}/StreamPlay/index.vue2.mjs

@@ -2,6 +2,7 @@ import { defineComponent, ref, computed, watch, onMounted, onBeforeUnmount, open
 import { TUIVideoStreamType } from "@tencentcloud/tuiroom-engine-electron";
 import { useRoomStore } from "../../../../stores/room.mjs";
 import { roomService } from "../../../../services/roomService.mjs";
+import { StreamPlayQuality, StreamPlayMode } from "../../../../services/manager/mediaManager.mjs";
 import { useBasicStore } from "../../../../stores/basic.mjs";
 import { storeToRefs } from "pinia";
 import { getNanoId } from "../../../../utils/utils.mjs";
@@ -10,9 +11,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: {
     streamInfo: {},
-    isEnlarge: { type: Boolean },
-    isNeedPlayStream: { type: Boolean, default: true },
-    observerViewInVisible: { type: Boolean }
+    streamPlayQuality: { default: StreamPlayQuality.Default },
+    streamPlayMode: { default: StreamPlayMode.PLAY }
   },
   setup(__props) {
     const mediaManager = roomService.getMediaManager();
@@ -25,15 +25,21 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const playRegionDomId = computed(
       () => `${props.streamInfo.userId}_${props.streamInfo.streamType}_${nanoId}`
     );
+    const isNeedPlayStream = computed(
+      () => props.streamPlayMode !== StreamPlayMode.STOP && props.streamInfo.hasVideoStream
+    );
     const streamTypeToFetch = computed(() => {
       const { streamType, userId } = props.streamInfo;
       const { userId: localUserId } = basicStore;
       if (streamType === TUIVideoStreamType.kScreenStream) {
         return TUIVideoStreamType.kScreenStream;
       }
-      if (props.isEnlarge || userId === localUserId) {
+      if (props.streamPlayQuality === StreamPlayQuality.HIGH || userId === localUserId) {
         return TUIVideoStreamType.kCameraStream;
       }
+      if (props.streamPlayQuality === StreamPlayQuality.LOW) {
+        return TUIVideoStreamType.kCameraStreamLow;
+      }
       return defaultStreamType.value;
     });
     async function startPlayVideo() {
@@ -41,12 +47,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return;
       }
       await nextTick();
-      if (props.isNeedPlayStream && props.streamInfo.hasVideoStream) {
+      if (isNeedPlayStream.value) {
         await mediaManager.startPlayVideo({
           userId: props.streamInfo.userId,
           streamType: streamTypeToFetch.value,
           view: playRegionDomRef.value,
-          observerViewInVisible: props.observerViewInVisible
+          observerViewInVisible: props.streamPlayMode === StreamPlayMode.PLAY_IN_VISIBLE
         });
       }
     }
@@ -61,8 +67,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       () => [
         props.streamInfo.userId,
         props.streamInfo.streamType,
-        props.streamInfo.hasVideoStream,
-        props.isNeedPlayStream
+        isNeedPlayStream.value
       ],
       async (val, oldVal) => {
         const [oldUserId, oldStreamType] = oldVal;
@@ -73,7 +78,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             view: playRegionDomRef.value
           });
         }
-        if (props.isNeedPlayStream && props.streamInfo.hasVideoStream) {
+        if (isNeedPlayStream.value) {
           await startPlayVideo();
         } else {
           await stopPlayVideo();
@@ -83,18 +88,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     watch(
       () => streamTypeToFetch,
       async () => {
-        if (props.isNeedPlayStream && props.streamInfo.hasVideoStream) {
+        if (isNeedPlayStream.value) {
           await startPlayVideo();
         }
       }
     );
     onMounted(async () => {
-      if (props.isNeedPlayStream && props.streamInfo.hasVideoStream) {
+      if (isNeedPlayStream.value) {
         await startPlayVideo();
       }
     });
     onBeforeUnmount(async () => {
-      if (props.isNeedPlayStream && props.streamInfo.hasVideoStream) {
+      if (isNeedPlayStream.value) {
         await stopPlayVideo();
       }
     });

package/es/components/Stream/common/StreamRegion/index.vue.d.ts

@@ -0,0 +1,25 @@
+import { StreamInfo } from '../../../../stores/room';
+import { StreamPlayMode, StreamPlayQuality } from '../../../../services/manager/mediaManager';
+
+interface Props {
+    streamInfo: StreamInfo;
+    streamPlayQuality?: StreamPlayQuality;
+    streamPlayMode?: StreamPlayMode;
+    aspectRatio?: string;
+    supportTouchScale?: boolean;
+}
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "stream-view-dblclick": (...args: any[]) => void;
+}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>> & {
+    "onStream-view-dblclick"?: ((...args: any[]) => any) | undefined;
+}, {}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/es/components/{RoomContent → Stream/common}/StreamRegion/index.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./index.vue2.mjs";
 /* empty css            */
-import _export_sfc from "../../../_virtual/_plugin-vue_export-helper.mjs";
-const StreamRegion = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2fa4d966"]]);
+import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.mjs";
+const StreamRegion = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-31a2e486"]]);
 export {
   StreamRegion as default
 };

package/es/components/{RoomContent → Stream/common}/StreamRegion/index.vue2.mjs

@@ -1,24 +1,25 @@
 import { defineComponent, computed, ref, onMounted, onBeforeUnmount, openBlock, createElementBlock, withDirectives, normalizeStyle, createBlock, Fragment, createVNode, unref } from "vue";
 import { TUIVideoStreamType } from "@tencentcloud/tuiroom-engine-electron";
-import StreamPlay from "./StreamPlay/index.vue.mjs";
-import StreamCover from "./StreamCover/index.vue.mjs";
-import LocalScreenView from "./LocalScreenView/index.vue.mjs";
-import { useBasicStore } from "../../../stores/basic.mjs";
-import vDblTouch$1 from "../../../directives/vDblTouch.mjs";
-import vDblTouch from "../../../directives/vTouchScale.mjs";
+import StreamPlay from "../StreamPlay/index.vue.mjs";
+import StreamCover from "../StreamCover/index.vue.mjs";
+import LocalScreenView from "../LocalScreenView/index.vue.mjs";
+import { useBasicStore } from "../../../../stores/basic.mjs";
+import vDblTouch$1 from "../../../../directives/vDblTouch.mjs";
+import vDblTouch from "../../../../directives/vTouchScale.mjs";
+import { getContentSize } from "../../../../utils/domOperation.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: {
     streamInfo: {},
-    isEnlarge: { type: Boolean, default: false },
+    streamPlayQuality: {},
+    streamPlayMode: {},
     aspectRatio: {},
-    isNeedPlayStream: { type: Boolean, default: true },
-    observerViewInVisible: { type: Boolean },
     supportTouchScale: { type: Boolean }
   },
-  emits: ["room-dblclick"],
-  setup(__props) {
+  emits: ["stream-view-dblclick"],
+  setup(__props, { emit: __emit }) {
     const props = __props;
+    const emits = __emit;
     const basicStore = useBasicStore();
     const isLocalScreen = computed(
       () => props.streamInfo && props.streamInfo.userId === basicStore.userId && props.streamInfo.streamType === TUIVideoStreamType.kScreenStream
@@ -41,8 +42,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (!streamRegionContainerRef.value) {
         return;
       }
-      const containerWidth = streamRegionContainerRef.value.offsetWidth;
-      const containerHeight = streamRegionContainerRef.value.offsetHeight;
+      const containerWidth = getContentSize(streamRegionContainerRef.value).width;
+      const containerHeight = getContentSize(streamRegionContainerRef.value).height;
       let width = containerWidth;
       let height = containerHeight;
       if (widthRatio.value && heightRatio.value) {
@@ -60,6 +61,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       streamStyle.value.width = `${width}px`;
       streamStyle.value.height = `${height}px`;
     }
+    function handleStreamDblClick() {
+      emits("stream-view-dblclick", props.streamInfo);
+    }
     const ro = new ResizeObserver(() => {
       handleStreamRegionSize();
     });
@@ -77,31 +81,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }, [
         withDirectives((openBlock(), createElementBlock("div", {
           class: "stream-region",
-          onDblclick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("room-dblclick")),
+          onStreamViewDblclick: handleStreamDblClick,
           style: normalizeStyle(streamStyle.value)
         }, [
           isLocalScreen.value ? (openBlock(), createBlock(LocalScreenView, {
             key: 0,
-            streamInfo: _ctx.streamInfo,
-            isMiniRegion: !_ctx.isEnlarge
-          }, null, 8, ["streamInfo", "isMiniRegion"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+            streamInfo: _ctx.streamInfo
+          }, null, 8, ["streamInfo"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
             withDirectives(createVNode(StreamPlay, {
               streamInfo: _ctx.streamInfo,
-              isEnlarge: _ctx.isEnlarge,
-              isNeedPlayStream: _ctx.isNeedPlayStream,
-              observerViewInVisible: _ctx.observerViewInVisible
-            }, null, 8, ["streamInfo", "isEnlarge", "isNeedPlayStream", "observerViewInVisible"]), [
+              "stream-play-mode": _ctx.streamPlayMode,
+              "stream-play-quality": _ctx.streamPlayQuality
+            }, null, 8, ["streamInfo", "stream-play-mode", "stream-play-quality"]), [
               [unref(vDblTouch), props.supportTouchScale]
             ]),
             createVNode(StreamCover, { streamInfo: _ctx.streamInfo }, null, 8, ["streamInfo"])
           ], 64))
         ], 36)), [
-          [
-            unref(vDblTouch$1),
-            () => {
-              _ctx.$emit("room-dblclick");
-            }
-          ]
+          [unref(vDblTouch$1), handleStreamDblClick]
         ])
       ], 512);
     };

package/es/components/common/Language.vue.mjs

@@ -7,10 +7,10 @@ import i18n from "../../locales/index.mjs";
 import "../../services/main.mjs";
 import { roomService } from "../../services/roomService.mjs";
 import "@tencentcloud/tuiroom-engine-electron";
+import "../../utils/environment.mjs";
 import "mitt";
 import "../../services/manager/roomActionManager.mjs";
 import "@tencentcloud/tui-core";
-import "../../utils/environment.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Language",
   setup(__props) {

package/es/components/common/SwitchTheme.vue.mjs

@@ -7,10 +7,10 @@ import { useI18n } from "../../locales/index.mjs";
 import "../../services/main.mjs";
 import { roomService } from "../../services/roomService.mjs";
 import "@tencentcloud/tuiroom-engine-electron";
+import "../../utils/environment.mjs";
 import "mitt";
 import "../../services/manager/roomActionManager.mjs";
 import "@tencentcloud/tui-core";
-import "../../utils/environment.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "SwitchTheme",
   props: {

package/es/components/common/base/Button.vue.d.ts

@@ -37,8 +37,8 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<
     size: "large" | "default";
     type: "primary" | "success" | "warning" | "danger" | "info" | "text";
     customStyle: string | false | import('vue').CSSProperties | StyleValue[] | null;
-    loading: boolean;
     disabled: boolean;
+    loading: boolean;
     round: boolean;
     plain: boolean;
 }, {}>;

package/es/components/common/base/Checkbox/index.vue.d.ts

@@ -18,8 +18,8 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<
 }>>> & {
     onInput?: ((...args: any[]) => any) | undefined;
 }, {
-    modelValue: boolean;
     disabled: boolean;
+    modelValue: boolean;
 }, {}>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;

package/es/components/common/base/Dialog/index.vue.d.ts

@@ -33,10 +33,10 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<
     cancelButton: string;
     titleIcon: null;
 }>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    "update:modelValue": (...args: any[]) => void;
+    cancel: (...args: any[]) => void;
     close: (...args: any[]) => void;
     confirm: (...args: any[]) => void;
-    cancel: (...args: any[]) => void;
+    "update:modelValue": (...args: any[]) => void;
 }, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
     title: string;
     modelValue: boolean;
@@ -51,10 +51,10 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<
     cancelButton: string;
     titleIcon: null;
 }>>> & {
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
     onClose?: ((...args: any[]) => any) | undefined;
-    onConfirm?: ((...args: any[]) => any) | undefined;
     onCancel?: ((...args: any[]) => any) | undefined;
+    onConfirm?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
     title: string;
     width: string | number;

package/es/components/common/base/IconButton.vue.d.ts

@@ -45,13 +45,13 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<
 }, {
     title: string;
     icon: Component | null;
-    disabled: boolean;
-    theme: "white" | "black";
-    layout: IconButtonLayout;
     hasMore: boolean;
     hideHoverEffect: boolean;
+    disabled: boolean;
     isActive: boolean;
+    layout: IconButtonLayout;
     isNotSupport: boolean;
+    theme: "white" | "black";
 }, {}>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;

package/es/components/common/base/Input/index.vue.d.ts

@@ -31,9 +31,9 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<
 }>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     input: (...args: any[]) => void;
     done: (...args: any[]) => void;
-    "update:modelValue": (...args: any[]) => void;
-    focus: (...args: any[]) => void;
     blur: (...args: any[]) => void;
+    focus: (...args: any[]) => void;
+    "update:modelValue": (...args: any[]) => void;
 }, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
     theme: string;
     modelValue: string;
@@ -52,14 +52,14 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_WithDefaults<
     onDone?: ((...args: any[]) => any) | undefined;
 }, {
     type: string;
-    modelValue: string;
     disabled: boolean;
     theme: "white" | "black";
+    align: "center" | "end" | "justify" | "left" | "match-parent" | "right" | "start";
     placeholder: string;
+    modelValue: string;
     enterkeyhint: string;
     maxlength: string;
     border: boolean;
-    align: "center" | "end" | "justify" | "left" | "match-parent" | "right" | "start";
 }, {}>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;