tuikit-atomicx-vue3 0.1.1 → 3.3.0

package/dist/components/LiveList/LiveListH5.js

@@ -1,8 +1,9 @@
-import { defineComponent, useCssVars, ref, computed, watch, onMounted, onUnmounted, createElementBlock, createCommentVNode, unref, openBlock, createElementVNode, Fragment, renderList, createVNode, toDisplayString } from "vue";
+import { defineComponent, useCssVars, ref, computed, watch, onMounted, onUnmounted, createElementBlock, createCommentVNode, unref, openBlock, createVNode, withCtx, createElementVNode, Fragment, renderList, toDisplayString } from "vue";
 import { useUIKit, IconLiveCoverHeader, IconNoLiveRoom } from "@tencentcloud/uikit-base-component-vue3";
 import { useLiveState } from "../../states/LiveState/index.js";
 import { useLoginState } from "../../states/LoginState.js";
 import Avatar from "../Avatar/Avatar.js";
+import PullToRefresh from "./pullToRefresh.js";
 import { _ as _export_sfc } from "../../_plugin-vue_export-helper-1tPrXgE0.js";
 const _hoisted_1 = {
   key: 0,
@@ -30,37 +31,34 @@ const _hoisted_13 = {
   class: "bottom-text"
 };
 const _hoisted_14 = { key: 0 };
-const _hoisted_15 = { key: 1 };
 const DEFAULT_COVER = "https://liteav-test-1252463788.cos.ap-guangzhou.myqcloud.com/voice_room/voice_room_cover1.png";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "LiveListH5",
   emits: ["live-room-click"],
   setup(__props, { emit: __emit }) {
     useCssVars((_ctx) => ({
-      "2ddc729c": liveItemWidth.value,
-      "1f5815bb": liveItemHeight.value
+      "0a6e1f16": liveItemWidth.value,
+      "44862458": liveItemHeight.value
     }));
     const { liveList, currentCursor, fetchLiveList } = useLiveState();
     const { loginUserInfo } = useLoginState();
     const { t } = useUIKit();
+    const showLiveList = ref([]);
     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;
-    });
-    const isShowMoreVisible = computed(() => {
-      return shouldFetchMoreLiveList.value && !scrollContainerRef.value;
-    });
     const emit = __emit;
     watch(
       loginUserInfo,
       async (user) => {
         if (user && user.userId) {
           isLoadingMore.value = true;
+          currentCursor.value = "";
+          liveList.value.length = 0;
           await fetchLiveList({});
+          showLiveList.value = liveList.value.slice();
           isLoadingMore.value = false;
         }
       },
@@ -76,37 +74,31 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         liveItemHeight.value = `${newItemHeight}px`;
       }
     });
+    async function handleRefresh(completeRefresh) {
+      try {
+        isLoadingMore.value = true;
+        currentCursor.value = "";
+        liveList.value.length = 0;
+        await fetchLiveList({});
+        showLiveList.value = liveList.value.slice();
+        isLoadingMore.value = false;
+        completeRefresh(true);
+      } catch (error) {
+        completeRefresh(false);
+      }
+    }
     function liveRoomClick(liveInfo) {
       console.log("liveRoomClick,liveInfo:", liveInfo);
       emit("live-room-click", liveInfo);
     }
-    function isScrollAtBottom(threshold = 50) {
-      if (!scrollContainerRef.value) {
-        return false;
-      }
-      return scrollContainerRef.value.scrollTop + scrollContainerRef.value.clientHeight >= scrollContainerRef.value.scrollHeight - threshold;
-    }
-    function handleWheel(event) {
-      if (!scrollContainerRef.value) {
-        return;
-      }
-      if (event.deltaY > 0 && isScrollAtBottom() && shouldFetchMoreLiveList.value) {
-        fetchMoreLives();
-      }
-    }
-    function handleScroll() {
-      if (!scrollContainerRef.value) {
+    async function fetchMoreLives() {
+      if (!hasMoreLive.value || isLoadingMore.value) {
         return;
       }
-      if (isScrollAtBottom() && shouldFetchMoreLiveList.value) {
-        fetchMoreLives();
-      }
-    }
-    async function fetchMoreLives() {
-      if (!hasMoreLive.value || isLoadingMore.value) return;
       try {
         isLoadingMore.value = true;
         await fetchLiveList({ cursor: currentCursor.value });
+        showLiveList.value = liveList.value.slice();
       } finally {
         isLoadingMore.value = false;
       }
@@ -129,60 +121,73 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return unref(loginUserInfo) ? (openBlock(), createElementBlock("div", _hoisted_1, [
-        unref(liveList).length > 0 ? (openBlock(), createElementBlock("div", {
+        showLiveList.value.length > 0 ? (openBlock(), createElementBlock("div", {
           key: 0,
-          class: "live-list",
-          onScroll: handleScroll,
-          onWheel: handleWheel,
           ref_key: "scrollContainerRef",
-          ref: scrollContainerRef
+          ref: scrollContainerRef,
+          class: "live-list"
         }, [
-          createElementVNode("div", _hoisted_2, [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(unref(liveList), (item) => {
-              return openBlock(), createElementBlock("div", {
-                class: "live-item",
-                key: item.liveId,
-                onClick: ($event) => liveRoomClick(item)
-              }, [
-                createElementVNode("div", _hoisted_4, [
-                  createElementVNode("div", _hoisted_5, [
-                    createVNode(unref(IconLiveCoverHeader), { size: 10 }),
-                    createElementVNode("span", _hoisted_6, toDisplayString(item.currentViewerCount || 0), 1),
-                    createElementVNode("span", null, toDisplayString(unref(t)("people have watched the live")), 1)
-                  ]),
-                  createElementVNode("img", {
-                    src: item.coverUrl || DEFAULT_COVER,
-                    alt: "",
-                    onError: handleCoverImageError
-                  }, null, 40, _hoisted_7)
-                ]),
-                createElementVNode("span", _hoisted_8, toDisplayString(item.liveName), 1),
-                createElementVNode("div", _hoisted_9, [
-                  createVNode(unref(Avatar), {
-                    src: item.liveOwner.avatarUrl,
-                    size: 16
-                  }, null, 8, ["src"]),
-                  createElementVNode("span", _hoisted_10, toDisplayString(item.liveOwner.userName || item.liveOwner.userId), 1)
-                ])
-              ], 8, _hoisted_3);
-            }), 128))
-          ]),
-          !hasMoreLive.value ? (openBlock(), createElementBlock("div", _hoisted_11, [
-            createElementVNode("span", null, toDisplayString(unref(t)("No More")), 1)
-          ])) : createCommentVNode("", true)
-        ], 544)) : !isLoadingMore.value ? (openBlock(), createElementBlock("div", _hoisted_12, [
+          createVNode(PullToRefresh, {
+            text: {
+              pull: unref(t)("Pull to refresh"),
+              release: unref(t)("Release to refresh"),
+              loading: unref(t)("Loading"),
+              success: unref(t)("Refresh success"),
+              error: unref(t)("Refresh failed")
+            },
+            onRefresh: handleRefresh,
+            onLoadMore: fetchMoreLives
+          }, {
+            default: withCtx(() => [
+              createElementVNode("div", _hoisted_2, [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(showLiveList.value, (item) => {
+                  return openBlock(), createElementBlock("div", {
+                    key: item.liveId,
+                    class: "live-item",
+                    onClick: ($event) => liveRoomClick(item)
+                  }, [
+                    createElementVNode("div", _hoisted_4, [
+                      createElementVNode("div", _hoisted_5, [
+                        createVNode(unref(IconLiveCoverHeader), { size: 10 }),
+                        createElementVNode("span", _hoisted_6, toDisplayString(item.currentViewerCount || 0), 1),
+                        createElementVNode("span", null, toDisplayString(unref(t)("people have watched the live")), 1)
+                      ]),
+                      createElementVNode("img", {
+                        src: item.coverUrl || DEFAULT_COVER,
+                        alt: "",
+                        onError: handleCoverImageError
+                      }, null, 40, _hoisted_7)
+                    ]),
+                    createElementVNode("span", _hoisted_8, toDisplayString(item.liveName), 1),
+                    createElementVNode("div", _hoisted_9, [
+                      createVNode(unref(Avatar), {
+                        src: item.liveOwner.avatarUrl,
+                        size: 16,
+                        style: { border: "1px solid var(--uikit-color-white-7)" }
+                      }, null, 8, ["src"]),
+                      createElementVNode("span", _hoisted_10, toDisplayString(item.liveOwner.userName || item.liveOwner.userId), 1)
+                    ])
+                  ], 8, _hoisted_3);
+                }), 128))
+              ]),
+              !hasMoreLive.value ? (openBlock(), createElementBlock("div", _hoisted_11, [
+                createElementVNode("span", null, toDisplayString(unref(t)("No More")), 1)
+              ])) : createCommentVNode("", true)
+            ]),
+            _: 1
+          }, 8, ["text"])
+        ], 512)) : !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 || isLoadingMore.value) ? (openBlock(), createElementBlock("div", _hoisted_13, [
-          isShowMoreVisible.value ? (openBlock(), createElementBlock("span", _hoisted_14, toDisplayString(unref(t)("Load More")), 1)) : createCommentVNode("", true),
-          isLoadingMore.value ? (openBlock(), createElementBlock("span", _hoisted_15, toDisplayString(unref(t)("Loading...")), 1)) : createCommentVNode("", true)
+        unref(liveList).length > 0 && isLoadingMore.value ? (openBlock(), createElementBlock("div", _hoisted_13, [
+          isLoadingMore.value ? (openBlock(), createElementBlock("span", _hoisted_14, toDisplayString(unref(t)("Loading...")), 1)) : createCommentVNode("", true)
         ])) : createCommentVNode("", true)
       ])) : createCommentVNode("", true);
     };
   }
 });
-const LiveListH5 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2aa05875"]]);
+const LiveListH5 = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-96626ee9"]]);
 export {
   LiveListH5 as default
 };

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

@@ -3,6 +3,11 @@ export declare const resource: {
     'people have watched the live': string;
     'Load More': string;
     'Loading...': string;
+    Loading: string;
     'No More': string;
     'No Live': string;
+    'Pull down to refresh': string;
+    'Release to refresh': string;
+    'Refresh success': string;
+    'Refresh failed': string;
 };

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

@@ -3,8 +3,13 @@ const resource = {
   "people have watched the live": "people have watched the live",
   "Load More": "Load More",
   "Loading...": "Loading...",
+  "Loading": "Loading",
   "No More": "No More",
-  "No Live": "No Live"
+  "No Live": "No Live",
+  "Pull down to refresh": "Pull down to refresh",
+  "Release to refresh": "Release to refresh",
+  "Refresh success": "Refresh success",
+  "Refresh failed": "Refresh failed"
 };
 export {
   resource

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

@@ -3,6 +3,11 @@ export declare const resource: {
     'people have watched the live': string;
     'Load More': string;
     'Loading...': string;
+    Loading: string;
     'No More': string;
     'No Live': string;
+    'Pull to refresh': string;
+    'Release to refresh': string;
+    'Refresh success': string;
+    'Refresh failed': string;
 };

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

@@ -3,8 +3,13 @@ const resource = {
   "people have watched the live": "人看过",
   "Load More": "加载更多",
   "Loading...": "加载中...",
+  "Loading": "正在加载...",
   "No More": "没有更多",
-  "No Live": "暂无直播间"
+  "No Live": "暂无直播间",
+  "Pull to refresh": "下拉刷新",
+  "Release to refresh": "松开刷新",
+  "Refresh success": "刷新成功",
+  "Refresh failed": "刷新失败"
 };
 export {
   resource

package/dist/components/LiveList/pullToRefresh.js

@@ -0,0 +1,204 @@
+import { defineComponent, useCssVars, ref, computed, createElementBlock, openBlock, createElementVNode, normalizeStyle, normalizeClass, createBlock, createCommentVNode, unref, toDisplayString, renderSlot } from "vue";
+import { IconArrowUpNew, IconCheck, IconErrorToast } from "@tencentcloud/uikit-base-component-vue3";
+import { _ as _export_sfc } from "../../_plugin-vue_export-helper-1tPrXgE0.js";
+const _hoisted_1 = {
+  key: 1,
+  class: "refresh-loading"
+};
+const _hoisted_2 = { class: "refresh-text" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "pullToRefresh",
+  props: {
+    threshold: { default: 60 },
+    resistance: { default: 2.5 },
+    disabled: { type: Boolean, default: false },
+    resultDuration: { default: 500 },
+    text: { default: () => ({
+      pull: "Pull to refresh",
+      release: "Release to refresh",
+      loading: "Loading...",
+      success: "Refresh success",
+      error: "Refresh failed"
+    }) }
+  },
+  emits: ["refresh", "loadMore"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    useCssVars((_ctx) => ({
+      "38f9ff2f": props.threshold + "px"
+    }));
+    const refreshState = ref(
+      "pulling"
+      /* Pulling */
+    );
+    const startY = ref(0);
+    const currentY = ref(0);
+    const isTouching = ref(false);
+    const contentRef = ref(null);
+    let timer = null;
+    const props = __props;
+    const emit = __emit;
+    __expose({
+      completeRefresh
+    });
+    const pullDistance = computed(() => {
+      if (refreshState.value === "loading") {
+        return props.threshold;
+      }
+      if (!isTouching.value) return 0;
+      return Math.max(0, (currentY.value - startY.value) / props.resistance);
+    });
+    const contentTranslateY = computed(() => {
+      if (refreshState.value === "loading" || refreshState.value === "success" || refreshState.value === "error") {
+        return props.threshold;
+      }
+      return Math.min(pullDistance.value, props.threshold);
+    });
+    const translateY = computed(() => {
+      if (refreshState.value === "loading" || refreshState.value === "success" || refreshState.value === "error") {
+        return 0;
+      }
+      return Math.min(pullDistance.value, props.threshold) - props.threshold;
+    });
+    const isIndicatorVisible = computed(() => {
+      if (refreshState.value === "loading" || refreshState.value === "success" || refreshState.value === "error") {
+        return true;
+      }
+      return pullDistance.value > 10;
+    });
+    const statusText = computed(() => {
+      switch (refreshState.value) {
+        case "releasing":
+          return props.text.release;
+        case "loading":
+          return props.text.loading;
+        case "success":
+          return props.text.success;
+        case "error":
+          return props.text.error;
+        default:
+          return props.text.pull;
+      }
+    });
+    function isScrollAtBottom(threshold = 50) {
+      if (!contentRef.value) {
+        return false;
+      }
+      return contentRef.value.scrollTop + contentRef.value.clientHeight >= contentRef.value.scrollHeight - threshold;
+    }
+    function handleWheel(event) {
+      if (!contentRef.value) {
+        return;
+      }
+      if (event.deltaY > 0 && isScrollAtBottom()) {
+        emit("loadMore");
+      }
+    }
+    function handleScroll() {
+      if (!contentRef.value) {
+        return;
+      }
+      if (isScrollAtBottom()) {
+        emit("loadMore");
+      }
+    }
+    function checkIsAtTop() {
+      if (!contentRef.value) return true;
+      return contentRef.value.scrollTop === 0;
+    }
+    function onTouchStart(event) {
+      if (props.disabled || refreshState.value === "loading") return;
+      if (!checkIsAtTop()) return;
+      isTouching.value = true;
+      startY.value = event.touches[0].clientY;
+      currentY.value = startY.value;
+      refreshState.value = "pulling";
+    }
+    function onTouchMove(event) {
+      if (!isTouching.value || props.disabled || refreshState.value === "loading") return;
+      currentY.value = event.touches[0].clientY;
+      if (pullDistance.value > 0 && checkIsAtTop()) {
+        event.preventDefault();
+      }
+      refreshState.value = pullDistance.value > props.threshold ? "releasing" : "pulling";
+    }
+    function onTouchEnd() {
+      if (!isTouching.value || props.disabled) return;
+      isTouching.value = false;
+      if (refreshState.value === "loading") return;
+      if (refreshState.value === "releasing") {
+        startRefresh();
+      } else {
+        resetPullState();
+      }
+    }
+    function startRefresh() {
+      refreshState.value = "loading";
+      emit("refresh", completeRefresh);
+    }
+    function completeRefresh(success = true) {
+      refreshState.value = success ? "success" : "error";
+      if (timer) {
+        clearTimeout(timer);
+      }
+      timer = setTimeout(() => {
+        resetPullState();
+      }, props.resultDuration);
+    }
+    function resetPullState() {
+      startY.value = 0;
+      currentY.value = 0;
+      if (refreshState.value !== "loading") {
+        refreshState.value = "pulling";
+      }
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "pull-to-refresh",
+        onTouchstart: onTouchStart,
+        onTouchmove: onTouchMove,
+        onTouchend: onTouchEnd,
+        onTouchcancel: onTouchEnd
+      }, [
+        createElementVNode("div", {
+          class: normalizeClass(["refresh-indicator", [refreshState.value, { visible: isIndicatorVisible.value }]]),
+          style: normalizeStyle({ transform: `translateY(${translateY.value}px)` })
+        }, [
+          refreshState.value !== "loading" && refreshState.value !== "success" && refreshState.value !== "error" ? (openBlock(), createBlock(unref(IconArrowUpNew), {
+            key: 0,
+            class: normalizeClass(["refresh-arrow", {
+              releasing: refreshState.value === "releasing"
+              /* Releasing */
+            }]),
+            size: 16
+          }, null, 8, ["class"])) : createCommentVNode("", true),
+          refreshState.value === "loading" ? (openBlock(), createElementBlock("div", _hoisted_1)) : createCommentVNode("", true),
+          refreshState.value === "success" ? (openBlock(), createBlock(unref(IconCheck), {
+            key: 2,
+            class: "refresh-success",
+            size: 16
+          })) : createCommentVNode("", true),
+          refreshState.value === "error" ? (openBlock(), createBlock(unref(IconErrorToast), {
+            key: 3,
+            class: "refresh-error",
+            size: 16
+          })) : createCommentVNode("", true),
+          createElementVNode("span", _hoisted_2, toDisplayString(statusText.value), 1)
+        ], 6),
+        createElementVNode("div", {
+          ref_key: "contentRef",
+          ref: contentRef,
+          class: "refresh-content",
+          style: normalizeStyle({ transform: `translateY(${contentTranslateY.value}px)` }),
+          onScroll: handleScroll,
+          onWheel: handleWheel
+        }, [
+          renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ], 36)
+      ], 32);
+    };
+  }
+});
+const PullToRefresh = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-4886b108"]]);
+export {
+  PullToRefresh as default
+};

package/dist/components/LiveList/pullToRefresh.vue.d.ts

@@ -0,0 +1,86 @@
+interface Props {
+    threshold?: number;
+    resistance?: number;
+    disabled?: boolean;
+    resultDuration?: number;
+    text?: {
+        pull: string;
+        release: string;
+        loading: string;
+        success: string;
+        error: string;
+    };
+}
+declare function completeRefresh(success?: boolean): void;
+declare function __VLS_template(): {
+    default?(_: {}): any;
+};
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+    threshold: number;
+    resistance: number;
+    disabled: boolean;
+    resultDuration: number;
+    text: () => {
+        pull: string;
+        release: string;
+        loading: string;
+        success: string;
+        error: string;
+    };
+}>>, {
+    completeRefresh: typeof completeRefresh;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    loadMore: () => void;
+    refresh: (completeRefresh: (success?: boolean) => void) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+    threshold: number;
+    resistance: number;
+    disabled: boolean;
+    resultDuration: number;
+    text: () => {
+        pull: string;
+        release: string;
+        loading: string;
+        success: string;
+        error: string;
+    };
+}>>> & Readonly<{
+    onLoadMore?: (() => any) | undefined;
+    onRefresh?: ((completeRefresh: (success?: boolean) => void) => any) | undefined;
+}>, {
+    text: {
+        pull: string;
+        release: string;
+        loading: string;
+        success: string;
+        error: string;
+    };
+    disabled: boolean;
+    threshold: number;
+    resistance: number;
+    resultDuration: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+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;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/LiveScenePanel/CameraSettingDialog.js

@@ -1,4 +1,4 @@
-import { defineComponent, onUnmounted, computed, ref, watch, onMounted, createBlock, openBlock, unref, withCtx, createElementVNode, createVNode, toDisplayString, createElementBlock, Fragment, renderList } from "vue";
+import { defineComponent, computed, ref, watch, onMounted, onBeforeUnmount, createBlock, openBlock, unref, withCtx, createElementVNode, createVNode, toDisplayString, createElementBlock, Fragment, renderList } from "vue";
 import { useDeviceState } from "../../states/DeviceState.js";
 import { TRTCCloud, TRTCVideoResolution, TRTCVideoMirrorType, TRTCVideoFillMode, TRTCVideoRotation } from "@tencentcloud/tuiroom-engine-js";
 import { useUIKit, TUIDialog, TUISelect, TUIOption } from "@tencentcloud/uikit-base-component-vue3";
@@ -24,9 +24,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const { cameraList } = useDeviceState();
     const props = __props;
     const emits = __emit;
-    onUnmounted(async () => {
-      await previewTRTCCloud.stopCameraDeviceTest();
-    });
     const title = computed(() => {
       return props.mediaSource ? t("Update Camera") : t("Add Camera");
     });
@@ -63,6 +60,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       await previewTRTCCloud.startCameraDeviceTest("video-preview");
     });
+    onBeforeUnmount(async () => {
+      await previewTRTCCloud.stopCameraDeviceTest();
+      previewTRTCCloud.destroy();
+    });
     watch(
       () => props.mediaSource,
       async (mediaSource) => {
@@ -203,13 +204,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ])
           ])
         ]),
-        _: 1,
-        __: [2]
+        _: 1
       }, 8, ["confirmText", "confirmDisabled", "title"]);
     };
   }
 });
-const CameraSettingDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-5e98e054"]]);
+const CameraSettingDialog = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-cbd9ccf2"]]);
 export {
   CameraSettingDialog as default
 };

package/dist/components/LiveScenePanel/icons/AddIcon.js

@@ -9,7 +9,7 @@ const _hoisted_1 = {
   fill: "none"
 };
 function _sfc_render(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1, _cache[0] || (_cache[0] = [
+  return openBlock(), createElementBlock("svg", _hoisted_1, [..._cache[0] || (_cache[0] = [
     createElementVNode("path", {
       d: "M8 5V11",
       stroke: "currentColor",
@@ -27,7 +27,7 @@ function _sfc_render(_ctx, _cache) {
       stroke: "currentColor",
       "stroke-width": "1.2"
     }, null, -1)
-  ]));
+  ])]);
 }
 const AddIcon = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {

package/dist/components/LiveScenePanel/icons/CameraIcon.js

@@ -9,7 +9,7 @@ const _hoisted_1 = {
   fill: "none"
 };
 function _sfc_render(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1, _cache[0] || (_cache[0] = [
+  return openBlock(), createElementBlock("svg", _hoisted_1, [..._cache[0] || (_cache[0] = [
     createElementVNode("path", {
       d: "M2.66667 6H5.33333V4.66667H2.66667V6Z",
       fill: "#D1D4DE"
@@ -20,7 +20,7 @@ function _sfc_render(_ctx, _cache) {
       d: "M12.6667 4.87037L16 3.66667V12.3333L12.6667 11.1296V14H0V2H12.6667V4.87037ZM14.6667 5.56575V10.4342L11.3333 9.23054V12.6667H1.33333V3.33333H11.3333V6.76946L14.6667 5.56575Z",
       fill: "#D1D4DE"
     }, null, -1)
-  ]));
+  ])]);
 }
 const CameraIcon = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {

package/dist/components/LiveScenePanel/icons/CameraMirror.js

@@ -9,7 +9,7 @@ const _hoisted_1 = {
   fill: "none"
 };
 function _sfc_render(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1, _cache[0] || (_cache[0] = [
+  return openBlock(), createElementBlock("svg", _hoisted_1, [..._cache[0] || (_cache[0] = [
     createElementVNode("path", {
       d: "M7.5 1H8.5V15H7.5V1Z",
       fill: "black",
@@ -28,7 +28,7 @@ function _sfc_render(_ctx, _cache) {
       "fill-opacity": "0.9",
       style: { "fill": "#ffffff", "fill-opacity": "0.9" }
     }, null, -1)
-  ]));
+  ])]);
 }
 const CameraMirror = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {