@tencentcloud/roomkit-electron-vue3 2.5.0 → 2.6.0

package/es/components/Whiteboard/core/initControlsRotate.mjs

@@ -0,0 +1,97 @@
+import { fabric } from "fabric";
+function rotateIcon(angle) {
+  return `url("data:image/svg+xml,%3Csvg height='18' width='18' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg' style='color: black;'%3E%3Cg fill='none' transform='rotate(${angle} 16 16)'%3E%3Cpath d='M22.4484 0L32 9.57891L22.4484 19.1478V13.1032C17.6121 13.8563 13.7935 17.6618 13.0479 22.4914H19.2141L9.60201 32.01L0 22.4813H6.54912C7.36524 14.1073 14.0453 7.44023 22.4484 6.61688V0Z' fill='white'/%3E%3Cpath d='M24.0605 3.89587L29.7229 9.57896L24.0605 15.252V11.3562C17.0479 11.4365 11.3753 17.0895 11.3048 24.0879H15.3048L9.60201 29.7308L3.90932 24.0879H8.0806C8.14106 15.3223 15.2645 8.22345 24.0605 8.14313V3.89587Z' fill='black'/%3E%3C/g%3E%3C/svg%3E ") 12 12,crosshair`;
+}
+function initControlsRotate(canvas) {
+  fabric.Object.prototype.controls.mtr = new fabric.Control({
+    x: -0.5,
+    y: -0.5,
+    offsetY: -10,
+    offsetX: -10,
+    rotate: 20,
+    actionName: "rotate",
+    actionHandler: fabric.controlsUtils.rotationWithSnapping,
+    render: () => {
+    }
+  });
+  fabric.Object.prototype.controls.mtr2 = new fabric.Control({
+    x: 0.5,
+    y: -0.5,
+    offsetY: -10,
+    offsetX: 10,
+    rotate: 20,
+    actionName: "rotate",
+    actionHandler: fabric.controlsUtils.rotationWithSnapping,
+    render: () => {
+    }
+  });
+  fabric.Object.prototype.controls.mtr3 = new fabric.Control({
+    x: 0.5,
+    y: 0.5,
+    offsetY: 10,
+    offsetX: 10,
+    rotate: 20,
+    actionName: "rotate",
+    actionHandler: fabric.controlsUtils.rotationWithSnapping,
+    render: () => {
+    }
+  });
+  fabric.Object.prototype.controls.mtr4 = new fabric.Control({
+    x: -0.5,
+    y: 0.5,
+    offsetY: 10,
+    offsetX: -10,
+    rotate: 20,
+    actionName: "rotate",
+    actionHandler: fabric.controlsUtils.rotationWithSnapping,
+    render: () => {
+    }
+  });
+  canvas.on("after:render", () => {
+    const activeObject = canvas.getActiveObject();
+    if (!activeObject) return;
+    fabric.Object.prototype.controls.mtr.cursorStyle = rotateIcon(
+      Number(activeObject.angle.toFixed(2))
+    );
+    fabric.Object.prototype.controls.mtr2.cursorStyle = rotateIcon(
+      Number(activeObject.angle.toFixed(2)) + 90
+    );
+    fabric.Object.prototype.controls.mtr3.cursorStyle = rotateIcon(
+      Number(activeObject.angle.toFixed(2)) + 180
+    );
+    fabric.Object.prototype.controls.mtr4.cursorStyle = rotateIcon(
+      Number(activeObject.angle.toFixed(2)) + 270
+    );
+  });
+  canvas.on("object:rotating", (event) => {
+    var _a;
+    const activeObject = canvas.getActiveObject();
+    if (!activeObject) return;
+    const body = canvas.getElement().nextSibling;
+    switch ((_a = event.transform) == null ? void 0 : _a.corner) {
+      case "mtr":
+        body.style.cursor = rotateIcon(
+          Number(activeObject.angle.toFixed(2))
+        );
+        break;
+      case "mtr2":
+        body.style.cursor = rotateIcon(
+          Number(activeObject.angle.toFixed(2)) + 90
+        );
+        break;
+      case "mtr3":
+        body.style.cursor = rotateIcon(
+          Number(activeObject.angle.toFixed(2)) + 180
+        );
+        break;
+      case "mtr4":
+        body.style.cursor = rotateIcon(
+          Number(activeObject.angle.toFixed(2)) + 270
+        );
+        break;
+    }
+  });
+}
+export {
+  initControlsRotate as default
+};

package/es/components/Whiteboard/core/initHotKeys.d.ts

@@ -0,0 +1,16 @@
+import { Canvas } from 'fabric/fabric-impl';
+import { default as hotkeys } from 'hotkeys-js';
+import { default as FabricCanvas } from './index';
+
+declare const keyNames: {
+    lrdu: string;
+    backspace: string;
+    delete: string;
+    ctrlz: string;
+    ctrly: string;
+    ctrlc: string;
+    ctrlv: string;
+};
+declare function initHotkeys(canvas: Canvas, fabricCanvas: FabricCanvas): void;
+export default initHotkeys;
+export { keyNames, hotkeys };

package/es/components/Whiteboard/emitter.d.ts

@@ -0,0 +1,11 @@
+import { EventType, Handler } from 'mitt';
+
+declare class EventEmitter<T extends Record<EventType, unknown>> {
+    private emitter;
+    constructor();
+    on(eventName: keyof T, handler: Handler<T[keyof T]>): void;
+    off(eventName: keyof T, handler: Handler<T[keyof T]>): void;
+    emit(eventName: keyof T, event: T[keyof T]): void;
+    removeAllListeners(): void;
+}
+export default EventEmitter;

package/es/components/Whiteboard/emitter.mjs

@@ -0,0 +1,25 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import mitt from "mitt";
+class EventEmitter {
+  constructor() {
+    __publicField(this, "emitter");
+    this.emitter = mitt();
+  }
+  on(eventName, handler) {
+    this.emitter.on(eventName, handler);
+  }
+  off(eventName, handler) {
+    this.emitter.off(eventName, handler);
+  }
+  emit(eventName, event) {
+    this.emitter.emit(eventName, event);
+  }
+  removeAllListeners() {
+    this.emitter.all.clear();
+  }
+}
+export {
+  EventEmitter as default
+};

package/es/components/Whiteboard/index.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<{}>>, {}, {}>;
+export default _default;

package/es/components/Whiteboard/index.vue.mjs

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

package/es/components/Whiteboard/index.vue2.mjs

@@ -0,0 +1,110 @@
+import { defineComponent, ref, provide, computed, onMounted, onUnmounted, openBlock, createElementBlock, createElementVNode, withDirectives, createVNode, vShow, pushScopeId, popScopeId } from "vue";
+import { ipcRenderer } from "electron";
+import FabricCanvas from "./core/index.mjs";
+import ToolBox from "./controller/ToolBox/index.vue.mjs";
+import RedoUndo from "./controller/RedoUndo/index.vue.mjs";
+import CloseController from "./controller/CloseController/index.vue.mjs";
+import { getUrlParam } from "../../utils/utils.mjs";
+import SaveController from "./controller/SaveController/index.vue.mjs";
+const _withScopeId = (n) => (pushScopeId("data-v-ba2dec44"), n = n(), popScopeId(), n);
+const _hoisted_1 = { class: "tool-box-out" };
+const _hoisted_2 = { class: "redo-undo-box" };
+const _hoisted_3 = { class: "controller-box" };
+const _hoisted_4 = { class: "save-controller" };
+const _hoisted_5 = { class: "close-controller" };
+const _hoisted_6 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("canvas", {
+  class: "whiteboard-canvas",
+  id: "canvas"
+}, null, -1));
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "index",
+  setup(__props) {
+    const isAnnotationWin = ref(false);
+    const isAnnotationStarted = ref(false);
+    const canvas = ref();
+    const canvasWrapRef = ref();
+    provide("canvas", canvas);
+    const isControllerVisiable = computed(
+      () => !isAnnotationWin.value || isAnnotationStarted.value
+    );
+    const isSaveControllerVisiable = computed(() => !isAnnotationWin.value);
+    function init() {
+      const fabricCanvas = new FabricCanvas("canvas");
+      canvas.value = fabricCanvas;
+    }
+    function resizeCanvas() {
+      var _a, _b;
+      canvas.value.setWidth((_a = canvasWrapRef.value) == null ? void 0 : _a.offsetWidth);
+      canvas.value.setHeight((_b = canvasWrapRef.value) == null ? void 0 : _b.offsetHeight);
+    }
+    onMounted(() => {
+      var _a, _b, _c;
+      init();
+      const annotationParam = getUrlParam("isAnnotationWin");
+      if (annotationParam && annotationParam === "true") {
+        isAnnotationWin.value = true;
+      }
+      if (!isAnnotationWin.value) {
+        (_a = canvas.value) == null ? void 0 : _a.setBackgroundColor("white");
+      }
+      canvas.value.setWidth((_b = canvasWrapRef.value) == null ? void 0 : _b.offsetWidth);
+      canvas.value.setHeight((_c = canvasWrapRef.value) == null ? void 0 : _c.offsetHeight);
+      window.addEventListener("resize", resizeCanvas);
+    });
+    onUnmounted(() => {
+      window.removeEventListener("resize", resizeCanvas);
+    });
+    ipcRenderer.on("annotation:annotating-started", () => {
+      isAnnotationStarted.value = true;
+    });
+    ipcRenderer.on("annotation:annotating-stopped", () => {
+      isAnnotationStarted.value = false;
+    });
+    ipcRenderer.on("whiteboard:clear", () => {
+      if (canvas.value) {
+        canvas.value.reloadCanvas();
+      }
+    });
+    ipcRenderer.on("annotation:clear", () => {
+      if (canvas.value) {
+        canvas.value.reloadCanvas();
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", null, [
+        createElementVNode("div", {
+          class: "canvas-wrap",
+          ref_key: "canvasWrapRef",
+          ref: canvasWrapRef
+        }, [
+          withDirectives(createElementVNode("div", _hoisted_1, [
+            createVNode(ToolBox)
+          ], 512), [
+            [vShow, isControllerVisiable.value]
+          ]),
+          withDirectives(createElementVNode("div", _hoisted_2, [
+            createVNode(RedoUndo)
+          ], 512), [
+            [vShow, isControllerVisiable.value]
+          ]),
+          createElementVNode("div", _hoisted_3, [
+            withDirectives(createElementVNode("div", _hoisted_4, [
+              createVNode(SaveController)
+            ], 512), [
+              [vShow, isSaveControllerVisiable.value]
+            ]),
+            withDirectives(createElementVNode("div", _hoisted_5, [
+              createVNode(CloseController)
+            ], 512), [
+              [vShow, isControllerVisiable.value]
+            ])
+          ]),
+          _hoisted_6
+        ], 512)
+      ]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/es/components/Whiteboard/resources/editor/edgecontrol.svg.mjs

@@ -0,0 +1,4 @@
+const edgeImg = "data:image/svg+xml,%3csvg%20width='19'%20height='18'%20viewBox='0%200%2019%2018'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20filter='url(%23filter0_d)'%3e%3ccircle%20cx='9.99609'%20cy='9'%20r='5'%20fill='white'/%3e%3ccircle%20cx='9.99609'%20cy='9'%20r='4.75'%20stroke='black'%20stroke-opacity='0.3'%20stroke-width='0.5'/%3e%3c/g%3e%3cdefs%3e%3cfilter%20id='filter0_d'%20x='0.996094'%20y='0'%20width='18'%20height='18'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeColorMatrix%20in='SourceAlpha'%20type='matrix'%20values='0%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200'/%3e%3cfeOffset/%3e%3cfeGaussianBlur%20stdDeviation='2'/%3e%3cfeColorMatrix%20type='matrix'%20values='0%200%200%200%200.137674%200%200%200%200%200.190937%200%200%200%200%200.270833%200%200%200%200.15%200'/%3e%3cfeBlend%20mode='normal'%20in2='BackgroundImageFix'%20result='effect1_dropShadow'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='effect1_dropShadow'%20result='shape'/%3e%3c/filter%3e%3c/defs%3e%3c/svg%3e";
+export {
+  edgeImg as default
+};

package/es/components/Whiteboard/resources/editor/middlecontrol.svg.mjs

@@ -0,0 +1,4 @@
+const verticalImg = "data:image/svg+xml,%3csvg%20width='12'%20height='24'%20viewBox='0%200%2012%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20filter='url(%23filter0_d)'%3e%3crect%20x='4'%20y='4'%20width='4'%20height='16'%20rx='2'%20fill='white'/%3e%3crect%20x='4.25'%20y='4.25'%20width='3.5'%20height='15.5'%20rx='1.75'%20stroke='black'%20stroke-opacity='0.3'%20stroke-width='0.5'/%3e%3c/g%3e%3cdefs%3e%3cfilter%20id='filter0_d'%20x='0'%20y='0'%20width='12'%20height='24'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeColorMatrix%20in='SourceAlpha'%20type='matrix'%20values='0%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200'/%3e%3cfeOffset/%3e%3cfeGaussianBlur%20stdDeviation='2'/%3e%3cfeColorMatrix%20type='matrix'%20values='0%200%200%200%200.137674%200%200%200%200%200.190937%200%200%200%200%200.270833%200%200%200%200.15%200'/%3e%3cfeBlend%20mode='normal'%20in2='BackgroundImageFix'%20result='effect1_dropShadow'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='effect1_dropShadow'%20result='shape'/%3e%3c/filter%3e%3c/defs%3e%3c/svg%3e";
+export {
+  verticalImg as default
+};

package/es/components/Whiteboard/resources/editor/middlecontrolhoz.svg.mjs

@@ -0,0 +1,4 @@
+const horizontalImg = "data:image/svg+xml,%3csvg%20width='24'%20height='12'%20viewBox='0%200%2024%2012'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20filter='url(%23filter0_d)'%3e%3crect%20x='20'%20y='4'%20width='4'%20height='16'%20rx='2'%20transform='rotate(90%2020%204)'%20fill='white'/%3e%3crect%20x='19.75'%20y='4.25'%20width='3.5'%20height='15.5'%20rx='1.75'%20transform='rotate(90%2019.75%204.25)'%20stroke='black'%20stroke-opacity='0.3'%20stroke-width='0.5'/%3e%3c/g%3e%3cdefs%3e%3cfilter%20id='filter0_d'%20x='0'%20y='0'%20width='24'%20height='12'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeColorMatrix%20in='SourceAlpha'%20type='matrix'%20values='0%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200'/%3e%3cfeOffset/%3e%3cfeGaussianBlur%20stdDeviation='2'/%3e%3cfeColorMatrix%20type='matrix'%20values='0%200%200%200%200.137674%200%200%200%200%200.190937%200%200%200%200%200.270833%200%200%200%200.15%200'/%3e%3cfeBlend%20mode='normal'%20in2='BackgroundImageFix'%20result='effect1_dropShadow'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='effect1_dropShadow'%20result='shape'/%3e%3c/filter%3e%3c/defs%3e%3c/svg%3e";
+export {
+  horizontalImg as default
+};

package/es/components/Whiteboard/resources/editor/rotateicon.svg.mjs

@@ -0,0 +1,4 @@
+const rotateImg = "data:image/svg+xml,%3csvg%20width='18'%20height='18'%20viewBox='0%200%2018%2018'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20filter='url(%23filter0_d)'%3e%3ccircle%20cx='9'%20cy='9'%20r='5'%20fill='white'/%3e%3ccircle%20cx='9'%20cy='9'%20r='4.75'%20stroke='black'%20stroke-opacity='0.3'%20stroke-width='0.5'/%3e%3c/g%3e%3cpath%20d='M10.8047%2011.1242L9.49934%2011.1242L9.49934%209.81885'%20stroke='black'%20stroke-width='0.5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M6.94856%206.72607L8.25391%206.72607L8.25391%208.03142'%20stroke='black'%20stroke-width='0.5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M9.69517%206.92267C10.007%207.03301%2010.2858%207.22054%2010.5055%207.46776C10.7252%207.71497%2010.8787%208.01382%2010.9517%208.33642C11.0247%208.65902%2011.0148%208.99485%2010.9229%209.31258C10.831%209.63031%2010.6601%209.91958%2010.4262%2010.1534L9.49701%2011.0421M8.25792%206.72607L7.30937%207.73554C7.07543%207.96936%206.90454%208.25863%206.81264%208.57636C6.72073%208.89408%206.71081%209.22992%206.78381%209.55251C6.8568%209.87511%207.01032%2010.174%207.23005%2010.4212C7.44978%2010.6684%207.72855%2010.8559%208.04036%2010.9663'%20stroke='black'%20stroke-width='0.5'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cdefs%3e%3cfilter%20id='filter0_d'%20x='0'%20y='0'%20width='18'%20height='18'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeColorMatrix%20in='SourceAlpha'%20type='matrix'%20values='0%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200'/%3e%3cfeOffset/%3e%3cfeGaussianBlur%20stdDeviation='2'/%3e%3cfeColorMatrix%20type='matrix'%20values='0%200%200%200%200.137674%200%200%200%200%200.190937%200%200%200%200%200.270833%200%200%200%200.15%200'/%3e%3cfeBlend%20mode='normal'%20in2='BackgroundImageFix'%20result='effect1_dropShadow'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='effect1_dropShadow'%20result='shape'/%3e%3c/filter%3e%3c/defs%3e%3c/svg%3e";
+export {
+  rotateImg as default
+};

package/es/components/common/ArrowStroke.vue.d.ts

@@ -3,9 +3,9 @@ interface Props {
     arrowDirection: string;
     hasStroke: boolean;
 }
-declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "click-arrow": (...args: any[]) => void;
-}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>> & {
+}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>> & {
     "onClick-arrow"?: ((...args: any[]) => any) | undefined;
 }, {}, {}>;
 export default _default;

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

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

package/es/components/common/ArrowStroke.vue2.mjs

@@ -12,7 +12,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
-    const arrowStrokeClass = computed(() => `arrow-stroke-container-${props.strokePosition}`);
+    const arrowStrokeClass = computed(
+      () => `arrow-stroke-container-${props.strokePosition}`
+    );
     function handleClickArrow() {
       emits("click-arrow");
     }

package/es/components/common/AudioIcon.vue.d.ts

@@ -5,7 +5,7 @@ interface Props {
     size?: string;
     isDisabled?: boolean;
 }
-declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>>, {}, {}>;
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>>, {}, {}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {

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

@@ -1,7 +1,7 @@
 import _sfc_main from "./AudioIcon.vue2.mjs";
-import "./AudioIcon.vue3.mjs";
+/* empty css                */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const AudioIcon = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-09a04b4a"]]);
+const AudioIcon = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-6e9fcb9f"]]);
 export {
   AudioIcon as default
 };

package/es/components/common/AudioMediaControl.vue.d.ts

@@ -8,9 +8,9 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
     hasMore: boolean;
     isDisabled: boolean;
     audioVolume: number;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+}>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     click: (...args: any[]) => void;
-}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
     hasMore: boolean;
     isDisabled: boolean;
     audioVolume: number;

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

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

package/es/components/common/AudioSettingTab.vue.d.ts

@@ -5,7 +5,7 @@ interface Props {
     audioVolume?: number;
     theme?: string;
 }
-declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>>, {}, {}>;
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>>, {}, {}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {

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

@@ -1,7 +1,7 @@
 import _sfc_main from "./AudioSettingTab.vue2.mjs";
-import "./AudioSettingTab.vue3.mjs";
+/* empty css                      */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const AudioSettingTab = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-31046864"]]);
+const AudioSettingTab = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-4cbcecda"]]);
 export {
   AudioSettingTab as default
 };

package/es/components/common/AudioSettingTab.vue2.mjs

@@ -39,19 +39,24 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const { speakerList, userVolumeObj, currentSpeakerId } = storeToRefs(roomStore);
     const roomEngine = useGetRoomEngine();
     const trtcCloud = (_a = roomEngine.instance) == null ? void 0 : _a.getTRTCCloud();
-    const themeClass = computed(() => props.theme ? `tui-theme-${props.theme}` : "");
+    const themeClass = computed(
+      () => props.theme ? `tui-theme-${props.theme}` : ""
+    );
     const volumeTotalNum = computed(() => isDetailMode.value ? 36 : 28);
     const volumeNum = computed(() => {
       const volume = props.audioVolume || userVolumeObj.value[userId.value] || 0;
       return volume * volumeTotalNum.value / 100;
     });
-    const showVolume = computed(() => isSampleMode.value || isDetailMode.value && isTestingMicrophone.value);
+    const showVolume = computed(
+      () => isSampleMode.value || isDetailMode.value && isTestingMicrophone.value
+    );
     const isTestingMicrophone = ref(false);
     function handleMicrophoneTest() {
       isTestingMicrophone.value = !isTestingMicrophone.value;
     }
     const isTestingSpeaker = ref(false);
     const audioPlayer = document == null ? void 0 : document.createElement("audio");
+    audioPlayer.loop = true;
     const { t } = useI18n();
     async function handleSpeakerTest() {
       const SPEAKER_TEST_URL = "https://web.sdk.qcloud.com/trtc/electron/download/resources/media/TestSpeaker.mp3";
@@ -114,7 +119,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             (openBlock(true), createElementBlock(Fragment, null, renderList(new Array(volumeTotalNum.value).fill(""), (item, index) => {
               return openBlock(), createElementBlock("div", {
                 key: index,
-                class: normalizeClass(["mic-bar", `${showVolume.value && volumeNum.value > index ? "active" : ""}`])
+                class: normalizeClass([
+                  "mic-bar",
+                  `${showVolume.value && volumeNum.value > index ? "active" : ""}`
+                ])
               }, null, 2);
             }), 128))
           ])

package/es/components/common/Avatar.vue.d.ts

@@ -1,7 +1,7 @@
 interface Props {
     imgSrc?: string | undefined;
 }
-declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>>, {}, {}>;
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>>, {}, {}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {

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

@@ -1,7 +1,7 @@
 import _sfc_main from "./Avatar.vue2.mjs";
-import "./Avatar.vue3.mjs";
+/* empty css             */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const TuiAvatar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-94a403fe"]]);
+const Avatar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-460d4fdf"]]);
 export {
-  TuiAvatar as default
+  Avatar as default
 };

package/es/components/common/DeviceSelect.vue.d.ts

@@ -3,7 +3,7 @@ interface Props {
     onChange?: (id: string) => void;
     disabled?: boolean;
 }
-declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>>, {}, {}>;
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>>, {}, {}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {

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

@@ -1,7 +1,7 @@
 import _sfc_main from "./DeviceSelect.vue2.mjs";
-import "./DeviceSelect.vue3.mjs";
+/* empty css                   */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const DeviceSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-0cca651b"]]);
+const DeviceSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-86b2cd04"]]);
 export {
   DeviceSelect as default
 };

package/es/components/common/DeviceSelect.vue2.mjs

@@ -1,8 +1,8 @@
 import { defineComponent, ref, watch, openBlock, createBlock, withCtx, createElementBlock, Fragment, renderList } from "vue";
 import { useRoomStore } from "../../stores/room.mjs";
 import { storeToRefs } from "pinia";
-import TuiSelect from "./base/Select.vue.mjs";
-import TuiOption from "./base/Option.vue.mjs";
+import TuiSelect from "./base/Select/index.vue.mjs";
+import TuiOption from "./base/Option/index.vue.mjs";
 import { TUIMediaDeviceType } from "@tencentcloud/tuiroom-engine-electron";
 import useDeviceManager from "../../hooks/useDeviceManager.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -39,25 +39,37 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return "";
     }
     if (deviceType === "camera") {
-      watch(currentCameraId, (val) => {
-        if (currentDeviceId.value !== val) {
-          currentDeviceId.value = val;
-        }
-      }, { immediate: true });
+      watch(
+        currentCameraId,
+        (val) => {
+          if (currentDeviceId.value !== val) {
+            currentDeviceId.value = val;
+          }
+        },
+        { immediate: true }
+      );
     }
     if (deviceType === "microphone") {
-      watch(currentMicrophoneId, (val) => {
-        if (currentDeviceId.value !== val) {
-          currentDeviceId.value = val;
-        }
-      }, { immediate: true });
+      watch(
+        currentMicrophoneId,
+        (val) => {
+          if (currentDeviceId.value !== val) {
+            currentDeviceId.value = val;
+          }
+        },
+        { immediate: true }
+      );
     }
     if (deviceType === "speaker") {
-      watch(currentSpeakerId, (val) => {
-        if (currentDeviceId.value !== val) {
-          currentDeviceId.value = val;
-        }
-      }, { immediate: true });
+      watch(
+        currentSpeakerId,
+        (val) => {
+          if (currentDeviceId.value !== val) {
+            currentDeviceId.value = val;
+          }
+        },
+        { immediate: true }
+      );
     }
     function getDeviceList() {
       if (deviceType === "camera") {

package/es/components/common/Language.vue.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<{}>>, {}, {}>;
 export default _default;

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

@@ -13,21 +13,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Language",
   setup(__props) {
     const basicStore = useBasicStore();
-    const title = computed(() => basicStore.lang === "en-US" ? "English" : "中文");
+    const title = computed(
+      () => basicStore.lang === "en-US" ? "English" : "中文"
+    );
     const languageConfig = roomService.getComponentConfig("Language");
     const handleChange = () => {
-      switch (i18n.global.locale.value) {
-        case "en-US":
-          i18n.global.locale.value = "zh-CN";
-          basicStore.setLang("zh-CN");
-          localStorage.setItem("tuiRoom-language", "zh-CN");
-          break;
-        case "zh-CN":
-          i18n.global.locale.value = "en-US";
-          basicStore.setLang("en-US");
-          localStorage.setItem("tuiRoom-language", "en-US");
-          break;
-      }
+      roomService.setLanguage(
+        i18n.global.locale.value === "en-US" ? "zh-CN" : "en-US"
+      );
     };
     return (_ctx, _cache) => {
       return unref(languageConfig).visible ? (openBlock(), createBlock(IconButton, {

package/es/components/common/Logo.vue.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<{}>>, {}, {}>;
 export default _default;

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

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

package/es/components/common/Logo.vue2.mjs

@@ -48,7 +48,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         ])) : createCommentVNode("", true),
         isEN.value ? (openBlock(), createElementBlock("div", {
           key: 3,
-          class: normalizeClass(["pc-en-logo", { "mobile": unref(isMobile) }])
+          class: normalizeClass(["pc-en-logo", { mobile: unref(isMobile) }])
         }, [
           createElementVNode("span", _hoisted_6, [
             createVNode(SvgIcon, { icon: LogoInEnglish })