tuikit-atomicx-vue3 0.1.0 → 0.1.1

package/dist/components/ConversationList/index.js

@@ -1,4 +1,34 @@
-import { default as default2 } from "./ConversationList.js";
+import { addI18n } from "../../i18n/index.js";
+import ConversationListComponent from "./ConversationList.js";
+import ConversationPlaceHolder$1 from "./ConversationPlaceHolder/ConversationPlaceHolder.js";
+import enResource from "./i18n/en-US.js";
+import zhResource from "./i18n/zh-CN.js";
+import ConversationActionsComponent from "./ConversationActions/ConversationActions.js";
+import ConversationListHeaderComponent from "./ConversationListHeader/ConversationListHeader.js";
+import ConversationListContentComponent from "./ConversationListContent/ConversationListContent.js";
+import { ConversationPreview as _sfc_main } from "./ConversationPreview/index.js";
+import ConversationCreateComponent from "./ConversationCreate/ConversationCreate.js";
+import ConversationPreviewUIComponent from "./ConversationPreview/ConversationPreviewUI.js";
+import ConversationSearchComponent from "./ConversationSearch/ConversationSearch.js";
+addI18n("en-US", { translation: enResource });
+addI18n("zh-CN", { translation: zhResource });
+const ConversationList = ConversationListComponent;
+const ConversationActions = ConversationActionsComponent;
+const ConversationCreate = ConversationCreateComponent;
+const ConversationListHeader = ConversationListHeaderComponent;
+const ConversationListContent = ConversationListContentComponent;
+const ConversationPlaceHolder = ConversationPlaceHolder$1;
+const ConversationPreview = _sfc_main;
+const ConversationPreviewUI = ConversationPreviewUIComponent;
+const ConversationSearch = ConversationSearchComponent;
 export {
-  default2 as ConversationList
+  ConversationActions,
+  ConversationCreate,
+  ConversationList,
+  ConversationListContent,
+  ConversationListHeader,
+  ConversationPlaceHolder,
+  ConversationPreview,
+  ConversationPreviewUI,
+  ConversationSearch
 };

package/dist/components/LiveAudienceList/LiveAudienceList.js

@@ -3,9 +3,9 @@ import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
 import { useLiveAudienceState } from "../../states/LiveAudienceState.js";
 import { useLiveState } from "../../states/LiveState/index.js";
 import { useLoginState } from "../../states/LoginState.js";
-import { LiveStatus } from "../../types/live.js";
 import UserActionMenu from "./UserActionMenu.js";
 import Avatar from "../Avatar/Avatar.js";
+import { LiveStatus } from "../../types/live.js";
 import { _ as _export_sfc } from "../../_plugin-vue_export-helper-1tPrXgE0.js";
 const _hoisted_1 = ["onClick"];
 const _hoisted_2 = { class: "viewer-info" };
@@ -138,7 +138,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             createElementVNode("p", null, toDisplayString(unref(t)("No audience yet")), 1)
           ])) : createCommentVNode("", true)
         ], 512),
-        unref(loginUserInfo) && unref(localLiveStatus) === unref(LiveStatus).Live ? (openBlock(), createElementBlock("div", _hoisted_7, [
+        unref(loginUserInfo) && unref(localLiveStatus) === unref(LiveStatus).Live && !isOwner.value ? (openBlock(), createElementBlock("div", _hoisted_7, [
           _cache[1] || (_cache[1] = createElementVNode("span", { class: "rank" }, "-", -1)),
           createVNode(unref(Avatar), {
             src: unref(loginUserInfo).avatarUrl,
@@ -161,7 +161,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const LiveAudienceListPC = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-62951863"]]);
+const LiveAudienceListPC = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-51062739"]]);
 export {
   LiveAudienceListPC as default
 };

package/dist/components/LiveAudienceList/UserActionMenu.js

@@ -35,10 +35,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       receivedCoGuestUserList,
       sentCoGuestUserList,
       availableCoGuestUserList,
-      sendCoGuestRequest,
-      cancelCoGuestRequest,
-      acceptCoGuestRequest,
-      rejectCoGuestRequest,
       disconnect
     } = useCoGuestState();
     const { disableSendMessage, audienceList, kickUserOutOfRoom } = useLiveAudienceState();
@@ -55,9 +51,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return [];
       }
       const isInCoGuest = userListInCoGuest.value.some((user) => user.userId === props.userId);
-      const isSentCoGuest = sentCoGuestUserList.value.some((user) => user.userId === props.userId);
-      const isAvailableCoGuest = availableCoGuestUserList.value.some((user) => user.userId === props.userId);
-      const isReceivedCoGuest = receivedCoGuestUserList.value.some((user) => user.userId === props.userId);
+      sentCoGuestUserList.value.some((user) => user.userId === props.userId);
+      availableCoGuestUserList.value.some((user) => user.userId === props.userId);
+      receivedCoGuestUserList.value.some((user) => user.userId === props.userId);
       const isDisableSendMessage = (_a = currentUserInfo.value) == null ? void 0 : _a.isMessageDisabled;
       if (!isDisableSendMessage) {
         tempActions.push({
@@ -76,35 +72,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (isInCoGuest) {
         tempActions.push({ label: t("Kick out"), action: "disconnect", actionFn: () => disconnect(props.userId) });
       }
-      if (isAvailableCoGuest) {
-        tempActions.push({
-          label: t("Invite to seat"),
-          action: "takeSeat",
-          actionFn: () => sendCoGuestRequest({
-            userId: props.userId,
-            seatIndex: -1
-          })
-        });
-      }
-      if (isSentCoGuest) {
-        tempActions.push({
-          label: t("Cancel invitation"),
-          action: "cancelCoGuestRequest",
-          actionFn: () => cancelCoGuestRequest({ userId: props.userId })
-        });
-      }
-      if (isReceivedCoGuest) {
-        tempActions.push({
-          label: t("Accept invitation"),
-          action: "acceptCoGuestRequest",
-          actionFn: () => acceptCoGuestRequest({ userId: props.userId })
-        });
-        tempActions.push({
-          label: t("Reject invitation"),
-          action: "rejectCoGuestRequest",
-          actionFn: () => rejectCoGuestRequest({ userId: props.userId })
-        });
-      }
       tempActions.push({
         label: t("Kick out of room"),
         action: "kickUserOutOfRoom",
@@ -171,7 +138,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const UserActionMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-edae413d"]]);
+const UserActionMenu = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-8fb62a68"]]);
 export {
   UserActionMenu as default
 };

package/dist/components/LiveList/LiveList.js

@@ -43,26 +43,30 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LiveList",
   emits: ["live-room-click"],
   setup(__props, { emit: __emit }) {
-    const { liveList, hasMoreLive, isLoadingLiveList, isLoadingMore, fetchLiveList } = useLiveState();
+    const { liveList, currentCursor, fetchLiveList } = useLiveState();
     const { loginUserInfo } = useLoginState();
     const { t } = useUIKit();
     const scrollContainerRef = ref(null);
+    const isLoadingMore = ref(false);
+    const hasMoreLive = computed(() => currentCursor.value !== "");
     const shouldFetchMoreLiveList = computed(() => {
-      return hasMoreLive.value && !isLoadingMore.value && !isLoadingLiveList.value;
+      return hasMoreLive.value && !isLoadingMore.value;
     });
     const isShowMoreVisible = computed(() => {
       return shouldFetchMoreLiveList.value && !scrollContainerRef.value;
     });
-    const emit = __emit;
     watch(
       loginUserInfo,
-      (user) => {
+      async (user) => {
         if (user && user.userId) {
-          fetchLiveList({});
+          isLoadingMore.value = true;
+          await fetchLiveList({});
+          isLoadingMore.value = false;
         }
       },
       { immediate: true }
     );
+    const emit = __emit;
     function liveRoomClick(liveInfo) {
       console.log("liveRoomClick,liveInfo:", liveInfo);
       emit("live-room-click", liveInfo);
@@ -78,7 +82,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return;
       }
       if (event.deltaY > 0 && isScrollAtBottom() && shouldFetchMoreLiveList.value) {
-        fetchLiveList({ append: true });
+        fetchMoreLives();
+      }
+    }
+    async function fetchMoreLives() {
+      if (!hasMoreLive.value || isLoadingMore.value) return;
+      try {
+        isLoadingMore.value = true;
+        await fetchLiveList({ cursor: currentCursor.value });
+      } finally {
+        isLoadingMore.value = false;
       }
     }
     function handleCoverImageError(event) {
@@ -131,22 +144,22 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               ], 8, _hoisted_3);
             }), 128))
           ]),
-          !unref(hasMoreLive) ? (openBlock(), createElementBlock("div", _hoisted_12, [
+          !hasMoreLive.value ? (openBlock(), createElementBlock("div", _hoisted_12, [
             createElementVNode("span", null, toDisplayString(unref(t)("No More")), 1)
           ])) : createCommentVNode("", true)
-        ], 544)) : !unref(isLoadingLiveList) ? (openBlock(), createElementBlock("div", _hoisted_13, [
+        ], 544)) : !isLoadingMore.value ? (openBlock(), createElementBlock("div", _hoisted_13, [
           createVNode(unref(IconNoLiveRoom), { size: 60 }),
           createElementVNode("span", null, toDisplayString(unref(t)("No Live")), 1)
         ])) : createCommentVNode("", true),
-        unref(liveList).length > 0 && (isShowMoreVisible.value || unref(isLoadingMore)) ? (openBlock(), createElementBlock("div", _hoisted_14, [
+        unref(liveList).length > 0 && (isShowMoreVisible.value || isLoadingMore.value) ? (openBlock(), createElementBlock("div", _hoisted_14, [
           isShowMoreVisible.value ? (openBlock(), createElementBlock("span", _hoisted_15, toDisplayString(unref(t)("Load More")), 1)) : createCommentVNode("", true),
-          unref(isLoadingMore) ? (openBlock(), createElementBlock("span", _hoisted_16, toDisplayString(unref(t)("Loading...")), 1)) : createCommentVNode("", true)
+          isLoadingMore.value ? (openBlock(), createElementBlock("span", _hoisted_16, toDisplayString(unref(t)("Loading...")), 1)) : createCommentVNode("", true)
         ])) : createCommentVNode("", true)
       ])) : createCommentVNode("", true);
     };
   }
 });
-const LiveListPC = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-b70b7281"]]);
+const LiveListPC = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-30bab3d5"]]);
 export {
   LiveListPC as default
 };

package/dist/components/LiveList/LiveListH5.js

@@ -37,17 +37,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: ["live-room-click"],
   setup(__props, { emit: __emit }) {
     useCssVars((_ctx) => ({
-      "b23aa27c": liveItemWidth.value,
-      "1ba42fab": liveItemHeight.value
+      "2ddc729c": liveItemWidth.value,
+      "1f5815bb": liveItemHeight.value
     }));
-    const { liveList, hasMoreLive, isLoadingLiveList, isLoadingMore, fetchLiveList } = useLiveState();
+    const { liveList, currentCursor, fetchLiveList } = useLiveState();
     const { loginUserInfo } = useLoginState();
     const { t } = useUIKit();
     const scrollContainerRef = ref(null);
+    const isLoadingMore = ref(false);
+    const hasMoreLive = computed(() => currentCursor.value !== "");
     const liveItemWidth = ref("168px");
     const liveItemHeight = ref("262px");
     const shouldFetchMoreLiveList = computed(() => {
-      return hasMoreLive.value && !isLoadingMore.value && !isLoadingLiveList.value;
+      return hasMoreLive.value && !isLoadingMore.value;
     });
     const isShowMoreVisible = computed(() => {
       return shouldFetchMoreLiveList.value && !scrollContainerRef.value;
@@ -55,9 +57,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const emit = __emit;
     watch(
       loginUserInfo,
-      (user) => {
+      async (user) => {
         if (user && user.userId) {
-          fetchLiveList({});
+          isLoadingMore.value = true;
+          await fetchLiveList({});
+          isLoadingMore.value = false;
         }
       },
       { immediate: true }
@@ -87,7 +91,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return;
       }
       if (event.deltaY > 0 && isScrollAtBottom() && shouldFetchMoreLiveList.value) {
-        fetchLiveList({ append: true });
+        fetchMoreLives();
       }
     }
     function handleScroll() {
@@ -95,7 +99,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return;
       }
       if (isScrollAtBottom() && shouldFetchMoreLiveList.value) {
-        fetchLiveList({ append: true });
+        fetchMoreLives();
+      }
+    }
+    async function fetchMoreLives() {
+      if (!hasMoreLive.value || isLoadingMore.value) return;
+      try {
+        isLoadingMore.value = true;
+        await fetchLiveList({ cursor: currentCursor.value });
+      } finally {
+        isLoadingMore.value = false;
       }
     }
     function handleCoverImageError(event) {
@@ -154,22 +167,22 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               ], 8, _hoisted_3);
             }), 128))
           ]),
-          !unref(hasMoreLive) ? (openBlock(), createElementBlock("div", _hoisted_11, [
+          !hasMoreLive.value ? (openBlock(), createElementBlock("div", _hoisted_11, [
             createElementVNode("span", null, toDisplayString(unref(t)("No More")), 1)
           ])) : createCommentVNode("", true)
-        ], 544)) : !unref(isLoadingLiveList) ? (openBlock(), createElementBlock("div", _hoisted_12, [
+        ], 544)) : !isLoadingMore.value ? (openBlock(), createElementBlock("div", _hoisted_12, [
           createVNode(unref(IconNoLiveRoom), { size: 60 }),
           createElementVNode("span", null, toDisplayString(unref(t)("No Live")), 1)
         ])) : createCommentVNode("", true),
-        unref(liveList).length > 0 && (isShowMoreVisible.value || unref(isLoadingMore)) ? (openBlock(), createElementBlock("div", _hoisted_13, [
+        unref(liveList).length > 0 && (isShowMoreVisible.value || isLoadingMore.value) ? (openBlock(), createElementBlock("div", _hoisted_13, [
           isShowMoreVisible.value ? (openBlock(), createElementBlock("span", _hoisted_14, toDisplayString(unref(t)("Load More")), 1)) : createCommentVNode("", true),
-          unref(isLoadingMore) ? (openBlock(), createElementBlock("span", _hoisted_15, toDisplayString(unref(t)("Loading...")), 1)) : createCommentVNode("", true)
+          isLoadingMore.value ? (openBlock(), createElementBlock("span", _hoisted_15, toDisplayString(unref(t)("Loading...")), 1)) : createCommentVNode("", true)
         ])) : createCommentVNode("", true)
       ])) : createCommentVNode("", true);
     };
   }
 });
-const LiveListH5 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-4c5148ff"]]);
+const LiveListH5 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2aa05875"]]);
 export {
   LiveListH5 as default
 };

package/dist/components/LiveMonitorView/LiveMonitorView.js

@@ -1,5 +1,5 @@
-import { defineComponent, ref, computed, onMounted, onUnmounted, watch, createElementBlock, openBlock, createElementVNode, Fragment, renderList, normalizeStyle, normalizeClass, toDisplayString, unref, createVNode, createBlock } from "vue";
-import { useUIKit, IconEndLive, IconMute, IconSpeakerPhone } from "@tencentcloud/uikit-base-component-vue3";
+import { defineComponent, ref, computed, onMounted, onUnmounted, watch, withDirectives, createElementBlock, openBlock, normalizeClass, createElementVNode, Fragment, renderList, normalizeStyle, toDisplayString, unref, createVNode, vShow } from "vue";
+import { useUIKit, IconEndLive } from "@tencentcloud/uikit-base-component-vue3";
 import { useLiveMonitorState } from "../../states/LiveMonitorState/index.js";
 import { exitFullScreen } from "../../utils/utils.js";
 import { _ as _export_sfc } from "../../_plugin-vue_export-helper-1tPrXgE0.js";
@@ -12,69 +12,72 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     liveInfo: {}
   },
   setup(__props) {
-    const { monitorLiveInfoList, closeRoom, muteLiveAudio } = useLiveMonitorState();
+    const props = __props;
+    const { monitorLiveInfoList, closeRoom } = useLiveMonitorState();
     const { t } = useUIKit();
     const isFullscreen = ref(false);
-    const isMuted = ref(true);
+    const isCrossRoomConnection = ref(false);
     const styleList = ref({});
-    const props = __props;
     const liveContainerRef = ref();
-    const viewId = computed(() => {
-      return `live_monitor_view_${props.liveInfo.liveId}`;
-    });
+    const viewId = computed(() => `live_monitor_view_${props.liveInfo.liveId}`);
+    const currentLiveInfo = computed(
+      () => monitorLiveInfoList.value.find((liveInfo) => liveInfo.liveId === props.liveInfo.liveId)
+    );
     const regionList = computed(() => {
       var _a;
-      return (_a = monitorLiveInfoList.value.find((liveInfo) => liveInfo.liveId === props.liveInfo.liveId)) == null ? void 0 : _a.regionList;
+      return (_a = currentLiveInfo.value) == null ? void 0 : _a.regionList;
+    });
+    const isLandscape = computed(() => {
+      var _a;
+      return ((_a = currentLiveInfo.value) == null ? void 0 : _a.orientation) === "landscape";
+    });
+    const isSingleStream = computed(() => {
+      var _a;
+      return (((_a = regionList.value) == null ? void 0 : _a.length) ?? 0) === 1;
     });
-    const toggleMuteAudio = () => {
-      muteLiveAudio(props.liveInfo.liveId, !isMuted.value);
-      isMuted.value = !isMuted.value;
-    };
     const handleForceClose = () => {
       closeRoom(props.liveInfo.liveId);
       if (isFullscreen.value) {
         exitFullScreen();
       }
     };
-    const handleFullscreenChange = () => {
+    const onFullscreenChange = () => {
       if (document.fullscreenElement) {
         isFullscreen.value = true;
       } else {
         isFullscreen.value = false;
-        muteLiveAudio(props.liveInfo.liveId, true);
-        isMuted.value = true;
       }
     };
+    const updateStyleList = () => {
+      if (!liveContainerRef.value || !regionList.value) return;
+      const containerWidth = liveContainerRef.value.clientWidth;
+      const containerHeight = liveContainerRef.value.clientHeight;
+      const newStyleList = {};
+      regionList.value.forEach((region) => {
+        if (region.liveId !== props.liveInfo.liveId) {
+          isCrossRoomConnection.value = true;
+        }
+        newStyleList[region.userInfo.userId] = {
+          left: `${region.rect.x * containerWidth}px`,
+          top: `${region.rect.y * containerHeight}px`,
+          width: isSingleStream.value ? "100%" : `${region.rect.w * containerWidth}px`,
+          height: isSingleStream.value ? "100%" : `${region.rect.h * containerHeight}px`
+        };
+      });
+      styleList.value = newStyleList;
+    };
     onMounted(() => {
-      addEventListener("fullscreenchange", handleFullscreenChange);
+      addEventListener("fullscreenchange", onFullscreenChange);
     });
     onUnmounted(() => {
-      removeEventListener("fullscreenchange", handleFullscreenChange);
+      removeEventListener("fullscreenchange", onFullscreenChange);
     });
-    watch(
-      regionList,
-      () => {
-        var _a, _b;
-        if (!liveContainerRef.value) return;
-        const containerWidth = liveContainerRef.value.clientWidth;
-        const containerHeight = liveContainerRef.value.clientHeight;
-        const isSingleStream = ((_a = regionList.value) == null ? void 0 : _a.length) === 1;
-        (_b = regionList.value) == null ? void 0 : _b.forEach((region) => {
-          styleList.value[region.userInfo.userId] = {
-            left: `${region.rect.x * containerWidth}px`,
-            top: `${region.rect.y * containerHeight}px`,
-            width: `${isSingleStream ? "100%" : region.rect.w * containerWidth + "px"}`,
-            height: `${isSingleStream ? "100%" : region.rect.h * containerHeight + "px"}`
-          };
-        });
-      },
-      { immediate: true }
-    );
+    watch(regionList, updateStyleList, { immediate: true });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
+      return withDirectives((openBlock(), createElementBlock("div", {
         ref_key: "liveContainerRef",
         ref: liveContainerRef,
-        class: "live-monitor-container"
+        class: normalizeClass(["live-monitor-container", { landscape: isLandscape.value }])
       }, [
         createElementVNode("div", {
           id: viewId.value,
@@ -82,32 +85,39 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         }, null, 8, _hoisted_1),
         (openBlock(true), createElementBlock(Fragment, null, renderList(regionList.value, (region) => {
           return openBlock(), createElementBlock("div", {
+            key: region.userInfo.userId,
             class: normalizeClass(["live-tag-mask", { "hide-tag": !isFullscreen.value }]),
             style: normalizeStyle(styleList.value[region.userInfo.userId])
           }, [
             createElementVNode("div", _hoisted_2, toDisplayString(`${unref(t)("RoomId")}: ${region.liveId}`), 1),
             createElementVNode("div", _hoisted_3, toDisplayString(`${unref(t)("UserId")}: ${region.userInfo.userId}`), 1),
-            createElementVNode("div", {
-              class: "force-close live-tag",
+            withDirectives(createElementVNode("div", {
+              class: "destroy-button live-tag",
               onClick: handleForceClose
             }, [
               createVNode(unref(IconEndLive)),
               createElementVNode("span", null, toDisplayString(unref(t)("Force Close")), 1)
-            ]),
-            createElementVNode("div", {
-              class: normalizeClass(["toggle-audio-state", " live-tag", { "is-unmuted": !isMuted.value }]),
-              onClick: toggleMuteAudio
-            }, [
-              isMuted.value ? (openBlock(), createBlock(unref(IconMute), { key: 0 })) : (openBlock(), createBlock(unref(IconSpeakerPhone), { key: 1 })),
-              createElementVNode("span", null, toDisplayString(isMuted.value ? unref(t)("Unmute Audio") : unref(t)("Mute Audio")), 1)
-            ], 2)
+            ], 512), [
+              [vShow, isCrossRoomConnection.value]
+            ])
           ], 6);
-        }), 256))
-      ], 512);
+        }), 128)),
+        withDirectives(createElementVNode("div", {
+          class: "non-cross-room-destroy-button destroy-button live-tag",
+          onClick: handleForceClose
+        }, [
+          createVNode(unref(IconEndLive)),
+          createElementVNode("span", null, toDisplayString(unref(t)("Force Close")), 1)
+        ], 512), [
+          [vShow, !isCrossRoomConnection.value && isFullscreen.value]
+        ])
+      ], 2)), [
+        [vShow, props.liveInfo.orientation]
+      ]);
     };
   }
 });
-const LiveMonitorView = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-d34ebb11"]]);
+const LiveMonitorViewComponent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9abcdb76"]]);
 export {
-  LiveMonitorView as default
+  LiveMonitorViewComponent as default
 };

package/dist/components/LiveScenePanel/MaterialRenameDialog.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../../MaterialRenameDialog.vue_vue_type_script_setup_true_lang-Cmhf2QX4.js";
+import { _ as _sfc_main } from "../../MaterialRenameDialog.vue_vue_type_script_setup_true_lang-CVh4Regz.js";
 export {
   _sfc_main as default
 };

package/dist/components/LiveScenePanel/i18n/en-US/index.d.ts

@@ -32,4 +32,6 @@ export declare const resource: {
     'External Devices': string;
     Multimedia: string;
     'Screen Capture': string;
+    'Save as new name': string;
+    'Please check the current browser camera permission': string;
 };

package/dist/components/LiveScenePanel/i18n/en-US/index.js

@@ -38,7 +38,9 @@ const resource = {
   "Add Material": "Add Material",
   "External Devices": "External Devices",
   Multimedia: "Multimedia",
-  "Screen Capture": "Screen Capture"
+  "Screen Capture": "Screen Capture",
+  "Save as new name": "Save as new name",
+  "Please check the current browser camera permission": "Please check the current browser camera permission"
 };
 export {
   resource

package/dist/components/LiveScenePanel/i18n/zh-CN/index.d.ts

@@ -32,4 +32,6 @@ export declare const resource: {
     'External Devices': string;
     Multimedia: string;
     'Screen Capture': string;
+    'Save as new name': string;
+    'Please check the current browser camera permission': string;
 };

package/dist/components/LiveScenePanel/i18n/zh-CN/index.js

@@ -38,7 +38,9 @@ const resource = {
   "Add Material": "添加素材",
   "External Devices": "外接设备",
   Multimedia: "多媒体",
-  "Screen Capture": "画面捕捉"
+  "Screen Capture": "画面捕捉",
+  "Save as new name": "保存为新名称",
+  "Please check the current browser camera permission": "请检查当前浏览器摄像头权限"
 };
 export {
   resource

package/dist/components/LiveScenePanel/index.js

@@ -1,9 +1,9 @@
-import { defineComponent, ref, computed, onUnmounted, createElementBlock, openBlock, normalizeClass, unref, createVNode, createElementVNode, createBlock, createCommentVNode, Fragment, renderList } from "vue";
-import TUIRoomEngine, { TRTCMediaSourceType, TRTCVideoResolution, TRTCVideoResolutionMode, TUIVideoQuality } from "@tencentcloud/tuiroom-engine-js";
+import { defineComponent, computed, ref, onUnmounted, createElementBlock, openBlock, normalizeClass, unref, createVNode, createElementVNode, createBlock, createCommentVNode, Fragment, renderList } from "vue";
+import TUIRoomEngine, { TRTCMediaSourceType, TRTCVideoResolution, TUIVideoQuality, TRTCVideoResolutionMode } from "@tencentcloud/tuiroom-engine-js";
 import LiveSceneSelect from "./LiveSceneSelect.js";
 import { useUIKit, TUIToast, TOAST_TYPE } from "@tencentcloud/uikit-base-component-vue3";
 import CameraSettingDialog from "./CameraSettingDialog.js";
-import { _ as _sfc_main$1 } from "../../MaterialRenameDialog.vue_vue_type_script_setup_true_lang-Cmhf2QX4.js";
+import { _ as _sfc_main$1 } from "../../MaterialRenameDialog.vue_vue_type_script_setup_true_lang-CVh4Regz.js";
 import MaterialItem from "./MaterialItem.js";
 import { useVideoMixerState } from "../../states/VideoMixerState.js";
 import { useDeviceState } from "../../states/DeviceState.js";
@@ -25,6 +25,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     TUIRoomEngine.once("ready", async () => {
       await getCameraList();
     });
+    const mediaSourceListWithZOrderSort = computed(
+      () => [...mediaSourceList.value].sort(
+        (item1, item2) => {
+          var _a, _b;
+          return ((_a = item2.layout) == null ? void 0 : _a.zOrder) - ((_b = item1.layout) == null ? void 0 : _b.zOrder);
+        }
+      )
+    );
     const showMaterialDialog = ref(false);
     const showCameraSettingDialog = ref(false);
     const showMaterialRenameDialog = ref(false);
@@ -197,7 +205,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           onAddMaterial: selectMaterial
         }, null, 8, ["displayMode"]),
         createElementVNode("div", _hoisted_1, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(mediaSourceList), (material) => {
+          (openBlock(true), createElementBlock(Fragment, null, renderList(mediaSourceListWithZOrderSort.value, (material) => {
             return openBlock(), createBlock(MaterialItem, {
               key: material.id,
               material,
@@ -223,9 +231,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const index = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-869f88f0"]]);
+const LiveScenePanelComponent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-68776105"]]);
 addI18n("en-US", { translation: resource });
 addI18n("zh-CN", { translation: resource$1 });
 export {
-  index as LiveScenePanel
+  LiveScenePanelComponent as LiveScenePanel
 };