tuikit-atomicx-vue3 0.1.1 → 3.3.0-beta.3

package/dist/components/StreamMixer/LocalMixer/index.js

@@ -1,10 +1,11 @@
-import { defineComponent, computed, ref, watch, onMounted, onUnmounted, createElementBlock, openBlock, createElementVNode, createCommentVNode, unref, normalizeStyle, createVNode, toDisplayString } from "vue";
+import { defineComponent, ref, computed, watch, nextTick, onMounted, onUnmounted, createElementBlock, openBlock, createElementVNode, createBlock, createCommentVNode, unref, normalizeStyle, toDisplayString } from "vue";
+import TUIRoomEngine, { TUIVideoQuality, TRTCVideoResolutionMode, TRTCVideoRotation } from "@tencentcloud/tuiroom-engine-js";
+import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
 import { useRoomEngine } from "../../../hooks/useRoomEngine.js";
-import { useVideoMixerState } from "../../../states/VideoMixerState.js";
-import TUIRoomEngine, { TRTCVideoRotation, TUIVideoQuality, TRTCVideoResolutionMode } from "@tencentcloud/tuiroom-engine-js";
 import { useLiveState } from "../../../states/LiveState/index.js";
+import { useVideoMixerState } from "../../../states/VideoMixerState.js";
+import { debounce } from "../../../utils/utils.js";
 import MixerControl from "./MixerControl.js";
-import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
 import { LiveOrientation, LiveStatus } from "../../../types/live.js";
 import { _ as _export_sfc } from "../../../_plugin-vue_export-helper-1tPrXgE0.js";
 const _hoisted_1 = {
@@ -12,11 +13,13 @@ const _hoisted_1 = {
   class: "local-mixer-placeholder"
 };
 const _hoisted_2 = { class: "placeholder-text" };
+const CONTROL_MARGIN_WITH_MEDIA_SOURCE = 6;
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   setup(__props) {
     const { t } = useUIKit();
     const { currentLive } = useLiveState();
+    const mixControlRef = ref(null);
     const { publishVideoQuality, activeMediaSource, enableLocalVideoMixer, mediaSourceList } = useVideoMixerState();
     enableLocalVideoMixer();
     const currentLiveOrientation = computed(() => {
@@ -42,16 +45,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       return { width, height };
     }
-    const mixControlContainerStyle = ref({
-      top: "0px",
-      left: "0px",
-      width: "0px",
-      height: "0px"
-    });
     const mixControlStyle = ref({
-      top: "-6px",
-      transform: "translate(-50%, -100%)"
+      position: "absolute",
+      transform: "translate(0px, 0px)"
     });
+    let mixControlWidth;
+    let mixControlHeight;
     function getMixControlStyle() {
       if (!localMixerRef.value || !activeMediaSource.value) {
         return;
@@ -60,48 +59,77 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         publishVideoQuality.value,
         currentLiveOrientation.value === LiveOrientation.Landscape ? TRTCVideoResolutionMode.TRTCVideoResolutionModeLandscape : TRTCVideoResolutionMode.TRTCVideoResolutionModePortrait
       );
-      const { width: realWidth, height: realHeight } = localMixerRef.value.getBoundingClientRect();
-      const scale = Math.max(realWidth / canvasWidth, realHeight / canvasHeight);
+      const { width: viewportWidth, height: viewportHeight } = localMixerRef.value.getBoundingClientRect();
+      const scale = Math.max(viewportWidth / canvasWidth, viewportHeight / canvasHeight);
       const previewWidth = canvasWidth * scale;
       const previewHeight = canvasHeight * scale;
       const { top, left, right, bottom } = activeMediaSource.value.layout.rect;
       const mediaSourceWidth = right - left;
       const mediaSourceHeight = bottom - top;
       const rotation = activeMediaSource.value.layout.rotation || TRTCVideoRotation.TRTCVideoRotation0;
+      const mediaSourceTop = top * scale - (previewHeight - viewportHeight) / 2;
+      const mediaSourceLeft = left * scale - (previewWidth - viewportWidth) / 2;
+      let mediaSourceDisplayWidth;
+      let mediaSourceDisplayHeight;
       if (rotation === TRTCVideoRotation.TRTCVideoRotation0 || rotation === TRTCVideoRotation.TRTCVideoRotation180) {
-        mixControlContainerStyle.value = {
-          top: `${top * scale - (previewHeight - realHeight) / 2}px`,
-          left: `${left * scale - (previewWidth - realWidth) / 2}px`,
-          width: `${mediaSourceWidth * scale}px`,
-          height: `${mediaSourceHeight * scale}px`
-        };
+        mediaSourceDisplayWidth = mediaSourceWidth * scale;
+        mediaSourceDisplayHeight = mediaSourceHeight * scale;
       } else {
-        mixControlContainerStyle.value = {
-          top: `${top * scale - (previewHeight - realHeight) / 2}px`,
-          left: `${left * scale - (previewWidth - realWidth) / 2}px`,
-          width: `${mediaSourceHeight * scale}px`,
-          height: `${mediaSourceWidth * scale}px`
-        };
+        mediaSourceDisplayWidth = mediaSourceHeight * scale;
+        mediaSourceDisplayHeight = mediaSourceWidth * scale;
       }
-      if (top < 60) {
-        mixControlStyle.value = {
-          bottom: "-6px",
-          transform: "translate(-50%, 100%)"
-        };
+      const controlPosition = calculateOptimalControlPosition(
+        mediaSourceLeft,
+        mediaSourceTop,
+        mediaSourceDisplayWidth,
+        mediaSourceDisplayHeight,
+        viewportWidth,
+        viewportHeight
+      );
+      mixControlStyle.value = {
+        ...controlPosition,
+        position: "absolute"
+      };
+    }
+    function calculateOptimalControlPosition(mediaSourceLeft, mediaSourceTop, mediaSourceWidth, mediaSourceHeight, viewportWidth, viewportHeight) {
+      const mediaSourceBottom = mediaSourceTop + mediaSourceHeight;
+      const mediaSourceCenterX = mediaSourceLeft + mediaSourceWidth / 2;
+      let controlLeft = mediaSourceCenterX - mixControlWidth / 2;
+      let controlTop = mediaSourceTop - CONTROL_MARGIN_WITH_MEDIA_SOURCE - mixControlHeight;
+      if (controlLeft < 0) {
+        controlLeft = 0;
+      } else if (controlLeft + mixControlWidth > viewportWidth) {
+        controlLeft = viewportWidth - mixControlWidth;
+      }
+      const topSpaceAvailable = mediaSourceTop;
+      const bottomSpaceAvailable = viewportHeight - mediaSourceBottom;
+      if (controlTop >= 0 && topSpaceAvailable >= mixControlHeight + CONTROL_MARGIN_WITH_MEDIA_SOURCE) {
+        controlTop = Math.min(controlTop, viewportHeight - mixControlHeight);
+      } else if (bottomSpaceAvailable >= mixControlHeight + CONTROL_MARGIN_WITH_MEDIA_SOURCE) {
+        controlTop = Math.max(0, mediaSourceBottom + CONTROL_MARGIN_WITH_MEDIA_SOURCE);
       } else {
-        mixControlStyle.value = {
-          top: "-6px",
-          transform: "translate(-50%, -100%)"
-        };
+        controlTop = Math.max(0, mediaSourceTop - mixControlHeight - CONTROL_MARGIN_WITH_MEDIA_SOURCE);
       }
+      return {
+        transform: `translate(${controlLeft}px, ${controlTop}px)`
+      };
     }
+    const debouncedGetMixControlStyle = debounce(getMixControlStyle, 16);
+    watch(() => activeMediaSource.value, async (newVal, oldVal) => {
+      var _a;
+      if (!oldVal && newVal) {
+        await nextTick();
+        const mixControlElement = (_a = mixControlRef.value) == null ? void 0 : _a.$el;
+        const { width, height } = (mixControlElement == null ? void 0 : mixControlElement.getBoundingClientRect()) || { width: 0, height: 0 };
+        mixControlWidth = width;
+        mixControlHeight = height;
+      }
+      getMixControlStyle();
+    }, { immediate: true, deep: true });
     watch(
-      () => {
-        var _a;
-        return [publishVideoQuality.value, currentLiveOrientation.value, (_a = activeMediaSource.value) == null ? void 0 : _a.layout];
-      },
-      ([newVideoQuality, newOrientation, newLayout]) => {
-        if (!newVideoQuality || !newOrientation || !newLayout) {
+      () => [publishVideoQuality.value, currentLiveOrientation.value],
+      ([newVideoQuality, newOrientation]) => {
+        if (!newVideoQuality || !newOrientation) {
           return;
         }
         getMixControlStyle();
@@ -109,7 +137,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       { immediate: true, deep: true }
     );
     const re = new ResizeObserver(() => {
-      getMixControlStyle();
+      debouncedGetMixControlStyle();
     });
     onMounted(() => {
       re.observe(localMixerRef.value);
@@ -132,24 +160,21 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: "local-mixer-container",
         ref_key: "localMixerRef",
-        ref: localMixerRef
+        ref: localMixerRef,
+        class: "local-mixer-container"
       }, [
         _cache[0] || (_cache[0] = createElementVNode("div", {
-          class: "local-mixer-content",
-          id: "local-video-mixer"
+          id: "local-video-mixer",
+          class: "local-mixer-content"
         }, null, -1)),
-        unref(activeMediaSource) ? (openBlock(), createElementBlock("div", {
+        unref(activeMediaSource) ? (openBlock(), createBlock(MixerControl, {
           key: 0,
-          class: "mixer-control-container",
-          style: normalizeStyle(mixControlContainerStyle.value)
-        }, [
-          createVNode(MixerControl, {
-            class: "mixer-control",
-            style: normalizeStyle(mixControlStyle.value)
-          }, null, 8, ["style"])
-        ], 4)) : createCommentVNode("", true),
+          ref_key: "mixControlRef",
+          ref: mixControlRef,
+          class: "mixer-control",
+          style: normalizeStyle(mixControlStyle.value)
+        }, null, 8, ["style"])) : createCommentVNode("", true),
         unref(mediaSourceList).length === 0 ? (openBlock(), createElementBlock("div", _hoisted_1, [
           createElementVNode("span", _hoisted_2, toDisplayString(unref(t)("No video")), 1)
         ])) : createCommentVNode("", true)
@@ -157,7 +182,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const LocalMixer = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-d5530943"]]);
+const LocalMixer = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-efcb7caf"]]);
 export {
   LocalMixer as default
 };

package/dist/components/StreamMixer/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": "black", "fill-opacity": "0.9" }
     }, null, -1)
-  ]));
+  ])]);
 }
 const CameraMirror = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {

package/dist/components/StreamMixer/icons/Delete.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: "M6 12V6H7V12H6Z",
       "fill-opacity": "0.9",
@@ -25,7 +25,7 @@ function _sfc_render(_ctx, _cache) {
       "fill-opacity": "0.9",
       style: { "fill": "currentColor", "fill-opacity": "0.9" }
     }, null, -1)
-  ]));
+  ])]);
 }
 const Delete = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {

package/dist/components/StreamMixer/icons/Down.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: "M9.00342 12.8867V2.1575",
       stroke: "currentcolor",
@@ -31,7 +31,7 @@ function _sfc_render(_ctx, _cache) {
       "stroke-linecap": "round",
       "stroke-linejoin": "round"
     }, null, -1)
-  ]));
+  ])]);
 }
 const Down = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {

package/dist/components/StreamMixer/icons/Rotation.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.00016 2.71134C10.8965 2.71134 13.2534 5.0736 13.2534 7.99868H14.2148C14.2148 4.54763 11.4324 1.75 8.00016 1.75C5.76382 1.75 3.80336 2.93771 2.7087 4.72001L2.7087 2.64252H1.75V5.74894C1.75 6.02508 1.97386 6.24894 2.25 6.24894L5.33676 6.24894V5.28498L3.49045 5.28498C4.40906 3.74211 6.08692 2.71134 8.00016 2.71134Z",
       fill: "black",
@@ -22,7 +22,7 @@ function _sfc_render(_ctx, _cache) {
       "fill-opacity": "0.9",
       style: { "fill": "black", "fill-opacity": "0.9" }
     }, null, -1)
-  ]));
+  ])]);
 }
 const Rotation = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {

package/dist/components/StreamMixer/icons/Up.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: "M9.00342 5.11328V15.8425",
       stroke: "currentcolor",
@@ -31,7 +31,7 @@ function _sfc_render(_ctx, _cache) {
       "stroke-linecap": "round",
       "stroke-linejoin": "round"
     }, null, -1)
-  ]));
+  ])]);
 }
 const Up = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 export {

package/dist/components/StreamMixer/index.js

@@ -1,6 +1,6 @@
 import { defineComponent, createBlock, openBlock, unref, withCtx, createVNode, normalizeStyle } from "vue";
+import { LiveCoreView as LiveCoreViewComponent } from "../LiveCoreView/index.js";
 import LocalMixer from "./LocalMixer/index.js";
-import { LiveStreamView as LiveStreamViewComponent } from "../LiveStreamView/index.js";
 import { addI18n } from "../../i18n/index.js";
 import { resource } from "./i18n/en-US/index.js";
 import { resource as resource$1 } from "./i18n/zh-CN/index.js";
@@ -8,7 +8,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(LiveStreamViewComponent), { "ignore-local-video": true }, {
+      return openBlock(), createBlock(unref(LiveCoreViewComponent), { "ignore-local-video": true }, {
         localVideo: withCtx(({ style }) => [
           createVNode(LocalMixer, {
             style: normalizeStyle(style)

package/dist/components/StreamView/common/StreamCover/index.js

@@ -59,9 +59,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         createElementVNode("div", _hoisted_5, [
           createElementVNode("span", {
             class: normalizeClass(["audio-status", { "audio-on": isAudioAvailable.value, "audio-off": !isAudioAvailable.value }])
-          }, _cache[0] || (_cache[0] = [
+          }, [..._cache[0] || (_cache[0] = [
             createElementVNode("i", { class: "audio-icon" }, null, -1)
-          ]), 2),
+          ])], 2),
           createElementVNode("div", _hoisted_6, toDisplayString(displayName.value), 1)
         ])
       ]);

package/dist/components/UserPicker/components/TreeMode/TreeNode.js

@@ -82,9 +82,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   }
                 ])
               }, [
-                isHalfSelected.value ? (openBlock(), createElementBlock("svg", _hoisted_2, _cache[2] || (_cache[2] = [
+                isHalfSelected.value ? (openBlock(), createElementBlock("svg", _hoisted_2, [..._cache[2] || (_cache[2] = [
                   createElementVNode("path", { d: "M19 13H5v-2h14v2z" }, null, -1)
-                ]))) : isSelected.value ? (openBlock(), createBlock(unref(IconCheckSm), {
+                ])])) : isSelected.value ? (openBlock(), createBlock(unref(IconCheckSm), {
                   key: 1,
                   name: "check"
                 })) : createCommentVNode("", true)

package/dist/components/UserPicker/i18n/index.d.ts

@@ -1 +1,15 @@
-export {};
+declare const resources: {
+    'en-US': {
+        search: string;
+        no_result: string;
+        no_data_available: string;
+        selected: string;
+    };
+    'zh-CN': {
+        search: string;
+        no_result: string;
+        no_data_available: string;
+        selected: string;
+    };
+};
+export { resources };

package/dist/components/UserPicker/i18n/index.js

@@ -1,10 +1,9 @@
-import { i18next } from "@tencentcloud/uikit-base-component-vue3";
 import UserPicker$1 from "./en-US.js";
 import UserPicker from "./zh-CN.js";
 const resources = {
   "en-US": UserPicker$1,
   "zh-CN": UserPicker
 };
-Object.entries(resources).forEach(([lng, resource]) => {
-  i18next.addResourceBundle(lng, "translation", { UserPicker: resource }, true, false);
-});
+export {
+  resources
+};

package/dist/components/UserPicker/index.d.ts

@@ -3,4 +3,3 @@ import { IUserPickerProps, IUserPickerRef, IUserPickerRow, IUserPickerNode, IUse
 
 export type { IUserPickerProps, IUserPickerRef, IUserPickerRow, IUserPickerNode, IUserPickerDataSource, IUserPickerResult, };
 export { UserPicker };
-export default UserPicker;

package/dist/components/UserPicker/index.js

@@ -1,5 +1,8 @@
-import UserPicker from "./UserPicker.js";
+import { default as default2 } from "./UserPicker.js";
+import { addI18n } from "../../i18n/index.js";
+import { resources } from "./i18n/index.js";
+addI18n("en-US", { translation: { UserPicker: resources["en-US"] } });
+addI18n("zh-CN", { translation: { UserPicker: resources["zh-CN"] } });
 export {
-  UserPicker,
-  UserPicker as default
+  default2 as UserPicker
 };

package/dist/components/VideoSettingPanel/VideoPreview.js

@@ -1,7 +1,6 @@
 import { defineComponent, onMounted, onUnmounted, createElementBlock, openBlock, createElementVNode, createCommentVNode, createBlock, unref, toDisplayString } from "vue";
-import { IconLoading } from "@tencentcloud/uikit-base-component-vue3";
-import { useI18n } from "../../locales/index.js";
 import TUIRoomEngine from "@tencentcloud/tuiroom-engine-js";
+import { useUIKit, IconLoading } from "@tencentcloud/uikit-base-component-vue3";
 import { useDeviceState } from "../../states/DeviceState.js";
 import { _ as _export_sfc } from "../../_plugin-vue_export-helper-1tPrXgE0.js";
 const _hoisted_1 = { class: "video-preview-container" };
@@ -13,7 +12,7 @@ const _hoisted_3 = {
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "VideoPreview",
   setup(__props) {
-    const { t } = useI18n();
+    const { t } = useUIKit();
     const { isCameraTesting, isCameraTestLoading, startCameraDeviceTest, stopCameraDeviceTest } = useDeviceState();
     onMounted(async () => {
       TUIRoomEngine.once("ready", () => {
@@ -41,7 +40,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const VideoPreview = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-33b33ca9"]]);
+const VideoPreview = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-773a253c"]]);
 export {
   VideoPreview as default
 };

package/dist/components/VideoSettingPanel/VideoProfile.js

@@ -1,13 +1,12 @@
 import { defineComponent, computed, watch, createBlock, openBlock, unref, isRef, withCtx, createElementBlock, Fragment, renderList } from "vue";
-import { TUISelect, TUIOption } from "@tencentcloud/uikit-base-component-vue3";
-import { useI18n } from "../../locales/index.js";
 import { TUIVideoQuality } from "@tencentcloud/tuiroom-engine-js";
+import { useUIKit, TUISelect, TUIOption } from "@tencentcloud/uikit-base-component-vue3";
 import { useDeviceState } from "../../states/DeviceState.js";
 import { _ as _export_sfc } from "../../_plugin-vue_export-helper-1tPrXgE0.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "VideoProfile",
   setup(__props) {
-    const { t } = useI18n();
+    const { t } = useUIKit();
     const videoQualityList = computed(() => [
       { label: t("Low Definition"), value: TUIVideoQuality.kVideoQuality_360p },
       {
@@ -47,7 +46,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const VideoProfile = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a2b6951d"]]);
+const VideoProfile = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-cbbcc0aa"]]);
 export {
   VideoProfile as default
 };

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

@@ -4,4 +4,9 @@ export declare const resource: {
     Preview: string;
     'Video profile': string;
     Resolution: string;
+    'Low Definition': string;
+    'Standard Definition': string;
+    'High Definition': string;
+    'Super Definition': string;
+    'Off Camera': string;
 };

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

@@ -1,9 +1,14 @@
 const resource = {
-  Camera: "Camera",
+  "Camera": "Camera",
   "Select device": "Select device",
-  Preview: "Preview",
+  "Preview": "Preview",
   "Video profile": "Video profile",
-  Resolution: "Resolution"
+  "Resolution": "Resolution",
+  "Low Definition": "Low Definition",
+  "Standard Definition": "Standard Definition",
+  "High Definition": "High Definition",
+  "Super Definition": "Super Definition",
+  "Off Camera": "Off Camera"
 };
 export {
   resource

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

@@ -4,4 +4,9 @@ export declare const resource: {
     Preview: string;
     'Video profile': string;
     Resolution: string;
+    'Low Definition': string;
+    'Standard Definition': string;
+    'High Definition': string;
+    'Super Definition': string;
+    'Off Camera': string;
 };

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

@@ -1,9 +1,14 @@
 const resource = {
-  Camera: "摄像头",
+  "Camera": "摄像头",
   "Select device": "选择设备",
-  Preview: "预览",
+  "Preview": "预览",
   "Video profile": "视频设置",
-  Resolution: "分辨率"
+  "Resolution": "分辨率",
+  "Low Definition": "流畅",
+  "Standard Definition": "标清",
+  "High Definition": "高清",
+  "Super Definition": "超清",
+  "Off Camera": "摄像头已关闭"
 };
 export {
   resource

package/dist/components/VideoSettingPanel/index.js

@@ -1,8 +1,8 @@
 import { defineComponent, createElementBlock, openBlock, createCommentVNode, Fragment, createElementVNode, toDisplayString, unref, createVNode } from "vue";
+import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
 import CameraSelect from "./CameraSelect.js";
-import VideoProfile from "./VideoProfile.js";
 import VideoPreview from "./VideoPreview.js";
-import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
+import VideoProfile from "./VideoProfile.js";
 import { _ as _export_sfc } from "../../_plugin-vue_export-helper-1tPrXgE0.js";
 import { addI18n } from "../../i18n/index.js";
 import { resource } from "./i18n/en-US/index.js";
@@ -72,7 +72,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const VideoSettingPanelPC = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-01c8fe83"]]);
+const VideoSettingPanelPC = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c4df466f"]]);
 addI18n("en-US", { translation: resource });
 addI18n("zh-CN", { translation: resource$1 });
 const VideoSettingPanel = VideoSettingPanelPC;

package/dist/hooks/useLongPress.d.ts

@@ -6,10 +6,10 @@ interface UseLongPressOptions {
     onContextMenu?: (event: PointerEvent) => void;
 }
 /**
- * Vue3长按事件hook
- * @param onLongPress - 长按触发时的回调函数
- * @param options - 长按配置选项
- * @returns 事件处理器对象
+ * Vue3 long press hook
+ * @param onLongPress - long press callback function
+ * @param options - configuration options for long press behavior
+ * @returns event handlers and state for long press
  */
 export declare function useLongPress(onLongPress: ((event: PointerEvent) => void) | null, options?: UseLongPressOptions): {
     getEventHandlers: () => Record<string, (event: PointerEvent) => void>;

package/dist/hooks/useMessageActions.js

@@ -6,31 +6,31 @@ import { useMessageActionState } from "../states/MessageActionState/MessageActio
 const DEFAULT_ACTIONS = {
   copy: {
     key: "copy",
-    label: "Copy",
+    label: "copy",
     visible: (message) => message.type === TUIChatEngine.TYPES.MSG_TEXT,
     icon: IconCopy
   },
   recall: {
     key: "recall",
-    label: "Recall",
+    label: "recall",
     visible: (message) => !isCallMessage(message) && message.flow === "out" && message.status === "success" && Date.now() - message.time * 1e3 < 60 * 2 * 1e3,
     icon: IconMsgRevoke
   },
   quote: {
     key: "quote",
-    label: "Quote",
+    label: "quote",
     visible: (message) => !isCallMessage(message),
     icon: IconMsgQuote
   },
   forward: {
     key: "forward",
-    label: "Forward",
+    label: "forward",
     visible: (message) => !isCallMessage(message),
     icon: IconMsgForward
   },
   delete: {
     key: "delete",
-    label: "Delete",
+    label: "delete",
     icon: IconMsgDel,
     visible: true,
     style: {

package/dist/hooks/useMouseHover.d.ts

@@ -1,9 +1,11 @@
 /**
- * Vue3鼠标悬停检测hook
- * @param elementRef - 目标元素的ref
- * @returns 是否悬停的状态
+ * Vue3 mouse hover hook
+ * @param elementRef - ref of the target element to monitor hover state
+ * @returns isHovered - reactive state indicating whether the mouse is hovering over the element
  */
 export declare function useMouseHover<T extends HTMLElement = HTMLElement>(elementRef: {
-    value: T | null;
-}): import('vue').Ref<boolean, boolean>;
+    value: T | undefined;
+}): {
+    isHovered: import('vue').Ref<boolean, boolean>;
+};
 export default useMouseHover;

package/dist/hooks/useMouseHover.js

@@ -21,7 +21,9 @@ function useMouseHover(elementRef) {
       element.removeEventListener("mouseleave", handleMouseLeave);
     }
   });
-  return isHovered;
+  return {
+    isHovered
+  };
 }
 export {
   useMouseHover as default,