@tencentcloud/roomkit-electron-vue3 2.4.2 → 2.5.0

package/es/components/RoomHome/RoomControl/index.vue2.mjs

@@ -1,57 +1,66 @@
-import { defineComponent, ref, watch, onBeforeUnmount, openBlock, createElementBlock, withDirectives, createVNode, vShow, createElementVNode, toDisplayString, unref, createCommentVNode, createBlock, withModifiers, withCtx, withKeys, vModelText, normalizeClass, pushScopeId, popScopeId } from "vue";
+import { defineComponent, ref, watch, onBeforeUnmount, openBlock, createElementBlock, createElementVNode, toDisplayString, unref, createCommentVNode, createBlock, createVNode, withModifiers, withCtx, withDirectives, withKeys, vModelText, normalizeClass, pushScopeId, popScopeId } from "vue";
 import SvgIcon from "../../common/base/SvgIcon.vue.mjs";
 import LoadingIcon from "../../common/icons/LoadingIcon.vue.mjs";
 import NextIcon from "../../common/icons/NextIcon.vue.mjs";
 import TuiButton from "../../common/base/Button.vue.mjs";
-import Logo from "../../common/Logo.vue.mjs";
 import useRoomControl from "./useRoomControlHooks.mjs";
 import CreateRoomIcon from "../../common/icons/CreateRoomIcon.vue.mjs";
 import EnterRoomIcon from "../../common/icons/EnterRoomIcon.vue.mjs";
+import ScheduleRoomIcon from "../../common/icons/ScheduleRoomIcon.vue.mjs";
 import useGetRoomEngine from "../../../hooks/useRoomEngine.mjs";
 import { useBasicStore } from "../../../stores/basic.mjs";
 import { useRoomStore } from "../../../stores/room.mjs";
 import AudioMediaControl from "../../common/AudioMediaControl.vue.mjs";
 import VideoMediaControl from "../../common/VideoMediaControl.vue.mjs";
-import TUIRoomEngine, { TUIRoomDeviceMangerEvents, TRTCVideoMirrorType, TRTCVideoRotation, TRTCVideoFillMode } from "@tencentcloud/tuiroom-engine-electron";
+import ScheduleConferencePanel from "../../ScheduleConference/ScheduleConferencePanel.vue.mjs";
+import TUIRoomEngine__default, { TUIRoomDeviceMangerEvents, TRTCVideoMirrorType, TRTCVideoRotation, TRTCVideoFillMode } from "@tencentcloud/tuiroom-engine-electron";
 import vClickOutside from "../../../directives/vClickOutside.mjs";
 import { isEnumerateDevicesSupported, isGetUserMediaSupported } from "../../../utils/mediaAbility.mjs";
 import useDeviceManager from "../../../hooks/useDeviceManager.mjs";
-const _withScopeId = (n) => (pushScopeId("data-v-08aec5e4"), n = n(), popScopeId(), n);
+const _withScopeId = (n) => (pushScopeId("data-v-d6c2f9cf"), n = n(), popScopeId(), n);
 const _hoisted_1 = { class: "room-control-container" };
-const _hoisted_2 = { class: "control-container" };
-const _hoisted_3 = { class: "stream-preview-container" };
-const _hoisted_4 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("div", {
+const _hoisted_2 = { class: "room-control-main" };
+const _hoisted_3 = { class: "control-container" };
+const _hoisted_4 = { class: "stream-preview-container" };
+const _hoisted_5 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("div", {
   id: "stream-preview",
   class: "stream-preview"
 }, null, -1));
-const _hoisted_5 = { class: "attention-info" };
-const _hoisted_6 = {
+const _hoisted_6 = { class: "attention-info" };
+const _hoisted_7 = {
   key: 0,
   class: "off-camera-info"
 };
-const _hoisted_7 = { class: "control-region" };
-const _hoisted_8 = { class: "media-control-region" };
-const _hoisted_9 = { class: "room-control-region" };
-const _hoisted_10 = { class: "create-room-region" };
-const _hoisted_11 = { class: "button-text" };
-const _hoisted_12 = {
+const _hoisted_8 = { class: "control-region" };
+const _hoisted_9 = { class: "media-control-region" };
+const _hoisted_10 = { class: "room-control-region" };
+const _hoisted_11 = { class: "create-room-region" };
+const _hoisted_12 = { class: "button-text" };
+const _hoisted_13 = {
   key: 0,
   class: "create-room-items"
 };
-const _hoisted_13 = ["title"];
 const _hoisted_14 = ["title"];
-const _hoisted_15 = { class: "enter-room-region" };
-const _hoisted_16 = { class: "button-text" };
-const _hoisted_17 = {
+const _hoisted_15 = ["title"];
+const _hoisted_16 = { class: "enter-room-region" };
+const _hoisted_17 = { class: "button-text" };
+const _hoisted_18 = {
   key: 1,
   class: "enter-room-action"
 };
-const _hoisted_18 = ["placeholder"];
+const _hoisted_19 = ["placeholder"];
+const _hoisted_20 = {
+  key: 0,
+  class: "schedule-room-region"
+};
+const _hoisted_21 = { class: "button-text" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: {
+    userName: { default: "" },
     showLogo: { type: Boolean, default: true },
-    givenRoomId: {}
+    givenRoomId: {},
+    enableScheduledConference: { type: Boolean, default: true }
   },
   emits: ["create-room", "enter-room"],
   setup(__props, { expose: __expose, emit: __emit }) {
@@ -73,6 +82,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const isCameraMuted = ref(false);
     const showCreateRoomItems = ref(false);
     const showEnterRoomAction = ref(Boolean(props.givenRoomId));
+    const scheduleConferenceDialogVisible = ref(false);
+    const scheduleConference = () => {
+      scheduleConferenceDialogVisible.value = true;
+    };
     const tuiRoomParam = {
       isOpenCamera: true,
       isOpenMicrophone: true,
@@ -119,6 +132,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       tuiRoomParam.isOpenCamera = !isCameraMuted.value;
       if (isCameraMuted.value) {
         await closeCamera();
+        isCameraLoading.value = false;
       } else {
         isCameraLoading.value = true;
         await openCamera();
@@ -187,7 +201,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         roomParam
       });
     }
-    TUIRoomEngine.once("ready", () => {
+    TUIRoomEngine__default.once("ready", () => {
       var _a;
       startStreamPreview();
       (_a = deviceManager.instance) == null ? void 0 : _a.on(TUIRoomDeviceMangerEvents.onTestMicVolume, onUserVoiceVolume);
@@ -200,112 +214,131 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [
-        withDirectives(createVNode(Logo, { class: "logo" }, null, 512), [
-          [vShow, _ctx.showLogo]
-        ]),
         createElementVNode("div", _hoisted_2, [
           createElementVNode("div", _hoisted_3, [
-            _hoisted_4,
-            createElementVNode("div", _hoisted_5, [
-              isCameraMuted.value ? (openBlock(), createElementBlock("span", _hoisted_6, toDisplayString(unref(t)("Off Camera")), 1)) : createCommentVNode("", true),
-              isCameraLoading.value ? (openBlock(), createBlock(SvgIcon, {
-                key: 1,
-                icon: LoadingIcon,
-                class: "loading"
-              })) : createCommentVNode("", true)
-            ])
-          ]),
-          createElementVNode("div", _hoisted_7, [
-            createElementVNode("div", _hoisted_8, [
-              createVNode(AudioMediaControl, {
-                class: "media-control-item",
-                "has-more": true,
-                "is-muted": isMicMuted.value,
-                "audio-volume": audioVolume.value,
-                onClick: toggleMuteAudio
-              }, null, 8, ["is-muted", "audio-volume"]),
-              createVNode(VideoMediaControl, {
-                class: "media-control-item",
-                "has-more": true,
-                "is-muted": isCameraMuted.value,
-                onClick: toggleMuteVideo
-              }, null, 8, ["is-muted"])
+            createElementVNode("div", _hoisted_4, [
+              _hoisted_5,
+              createElementVNode("div", _hoisted_6, [
+                isCameraMuted.value ? (openBlock(), createElementBlock("span", _hoisted_7, toDisplayString(unref(t)("Off Camera")), 1)) : createCommentVNode("", true),
+                isCameraLoading.value ? (openBlock(), createBlock(SvgIcon, {
+                  key: 1,
+                  icon: LoadingIcon,
+                  class: "loading"
+                })) : createCommentVNode("", true)
+              ])
             ]),
-            createElementVNode("div", _hoisted_9, [
-              createElementVNode("div", _hoisted_10, [
-                createVNode(TuiButton, {
-                  class: "button-item",
-                  onClick: withModifiers(handleCreateRoom, ["stop"])
-                }, {
-                  default: withCtx(() => [
-                    createVNode(SvgIcon, { icon: CreateRoomIcon }),
-                    createElementVNode("span", _hoisted_11, toDisplayString(unref(t)("New Room")), 1)
-                  ]),
-                  _: 1
-                }),
-                showCreateRoomItems.value ? withDirectives((openBlock(), createElementBlock("div", _hoisted_12, [
-                  createElementVNode("div", {
-                    class: "create-room-item",
-                    onClick: _cache[0] || (_cache[0] = ($event) => createRoom("SpeakAfterTakingSeat"))
-                  }, [
-                    createElementVNode("span", {
-                      title: unref(t)("On-stage Speaking Room"),
-                      class: "create-room-option"
-                    }, toDisplayString(unref(t)("On-stage Speaking Room")), 9, _hoisted_13),
-                    createVNode(SvgIcon, {
-                      class: "create-room-icon",
-                      icon: NextIcon
-                    })
-                  ]),
-                  createElementVNode("div", {
-                    class: "create-room-item",
-                    onClick: _cache[1] || (_cache[1] = ($event) => createRoom("FreeToSpeak"))
-                  }, [
-                    createElementVNode("span", {
-                      title: unref(t)("Free Speech Room"),
-                      class: "create-room-option"
-                    }, toDisplayString(unref(t)("Free Speech Room")), 9, _hoisted_14),
-                    createVNode(SvgIcon, {
-                      class: "create-room-icon",
-                      icon: NextIcon
-                    })
-                  ])
-                ])), [
-                  [unref(vClickOutside), handleClickOutsideCreateRoomItems]
-                ]) : createCommentVNode("", true)
+            createElementVNode("div", _hoisted_8, [
+              createElementVNode("div", _hoisted_9, [
+                createVNode(AudioMediaControl, {
+                  class: "media-control-item",
+                  "has-more": true,
+                  "is-muted": isMicMuted.value,
+                  "audio-volume": audioVolume.value,
+                  onClick: toggleMuteAudio
+                }, null, 8, ["is-muted", "audio-volume"]),
+                createVNode(VideoMediaControl, {
+                  class: "media-control-item",
+                  "has-more": true,
+                  "is-muted": isCameraMuted.value,
+                  onClick: toggleMuteVideo
+                }, null, 8, ["is-muted"])
               ]),
-              createElementVNode("div", _hoisted_15, [
-                !showEnterRoomAction.value ? (openBlock(), createBlock(TuiButton, {
-                  key: 0,
-                  class: "button-item",
-                  onClick: handleEnterRoom
-                }, {
-                  default: withCtx(() => [
-                    createVNode(SvgIcon, { icon: EnterRoomIcon }),
-                    createElementVNode("span", _hoisted_16, toDisplayString(unref(t)("Join Room")), 1)
-                  ]),
-                  _: 1
-                })) : createCommentVNode("", true),
-                showEnterRoomAction.value ? (openBlock(), createElementBlock("div", _hoisted_17, [
-                  withDirectives(createElementVNode("input", {
-                    "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => roomId.value = $event),
-                    class: "input",
-                    placeholder: unref(t)("Enter room ID"),
-                    onKeyup: withKeys(enterRoom, ["enter"])
-                  }, null, 40, _hoisted_18), [
-                    [vModelText, roomId.value]
-                  ]),
-                  createElementVNode("div", {
-                    class: normalizeClass(["enter-button", { "active": roomId.value.length > 0 }]),
-                    onClick: enterRoom
-                  }, [
-                    createVNode(SvgIcon, { icon: EnterRoomIcon })
-                  ], 2)
+              createElementVNode("div", _hoisted_10, [
+                createElementVNode("div", _hoisted_11, [
+                  createVNode(TuiButton, {
+                    class: "button-item",
+                    style: { "width": "170px" },
+                    onClick: withModifiers(handleCreateRoom, ["stop"])
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(SvgIcon, { icon: CreateRoomIcon }),
+                      createElementVNode("span", _hoisted_12, toDisplayString(unref(t)("New Room")), 1)
+                    ]),
+                    _: 1
+                  }),
+                  showCreateRoomItems.value ? withDirectives((openBlock(), createElementBlock("div", _hoisted_13, [
+                    createElementVNode("div", {
+                      class: "create-room-item",
+                      onClick: _cache[0] || (_cache[0] = ($event) => createRoom("SpeakAfterTakingSeat"))
+                    }, [
+                      createElementVNode("span", {
+                        title: unref(t)("On-stage Speaking Room"),
+                        class: "create-room-option"
+                      }, toDisplayString(unref(t)("On-stage Speaking Room")), 9, _hoisted_14),
+                      createVNode(SvgIcon, {
+                        class: "create-room-icon",
+                        icon: NextIcon
+                      })
+                    ]),
+                    createElementVNode("div", {
+                      class: "create-room-item",
+                      onClick: _cache[1] || (_cache[1] = ($event) => createRoom("FreeToSpeak"))
+                    }, [
+                      createElementVNode("span", {
+                        title: unref(t)("Free Speech Room"),
+                        class: "create-room-option"
+                      }, toDisplayString(unref(t)("Free Speech Room")), 9, _hoisted_15),
+                      createVNode(SvgIcon, {
+                        class: "create-room-icon",
+                        icon: NextIcon
+                      })
+                    ])
+                  ])), [
+                    [unref(vClickOutside), handleClickOutsideCreateRoomItems]
+                  ]) : createCommentVNode("", true)
+                ]),
+                createElementVNode("div", _hoisted_16, [
+                  !showEnterRoomAction.value ? (openBlock(), createBlock(TuiButton, {
+                    key: 0,
+                    class: "button-item",
+                    style: { "width": "170px" },
+                    onClick: handleEnterRoom
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(SvgIcon, { icon: EnterRoomIcon }),
+                      createElementVNode("span", _hoisted_17, toDisplayString(unref(t)("Join Room")), 1)
+                    ]),
+                    _: 1
+                  })) : createCommentVNode("", true),
+                  showEnterRoomAction.value ? (openBlock(), createElementBlock("div", _hoisted_18, [
+                    withDirectives(createElementVNode("input", {
+                      "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => roomId.value = $event),
+                      class: "input",
+                      placeholder: unref(t)("Enter room ID"),
+                      onKeyup: withKeys(enterRoom, ["enter"])
+                    }, null, 40, _hoisted_19), [
+                      [vModelText, roomId.value]
+                    ]),
+                    createElementVNode("div", {
+                      class: normalizeClass(["enter-button", { "active": roomId.value.length > 0 }]),
+                      onClick: enterRoom
+                    }, [
+                      createVNode(SvgIcon, { icon: EnterRoomIcon })
+                    ], 2)
+                  ])) : createCommentVNode("", true)
+                ]),
+                props.enableScheduledConference ? (openBlock(), createElementBlock("div", _hoisted_20, [
+                  createVNode(TuiButton, {
+                    class: "button-item",
+                    style: { "width": "170px" },
+                    onClick: scheduleConference
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(SvgIcon, { icon: ScheduleRoomIcon }),
+                      createElementVNode("span", _hoisted_21, toDisplayString(unref(t)("Schedule")), 1)
+                    ]),
+                    _: 1
+                  })
                 ])) : createCommentVNode("", true)
               ])
             ])
           ])
-        ])
+        ]),
+        createVNode(ScheduleConferencePanel, {
+          visible: scheduleConferenceDialogVisible.value,
+          "user-name": props.userName,
+          onInput: _cache[3] || (_cache[3] = ($event) => scheduleConferenceDialogVisible.value = $event)
+        }, null, 8, ["visible", "user-name"])
       ]);
     };
   }

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

@@ -1,7 +1,7 @@
 import { defineComponent, openBlock, createElementBlock, Fragment, renderList, unref, createElementVNode, toDisplayString, createVNode, withCtx } from "vue";
 import useRoomInvite from "./useRoomInviteHooks.mjs";
 import SvgIcon from "../common/base/SvgIcon.vue.mjs";
-import CopyIcon from "../common/icons/CopyIcon.vue.mjs";
+import copyIcon from "../common/icons/CopyIcon.vue.mjs";
 const _hoisted_1 = { class: "invite-container" };
 const _hoisted_2 = { class: "invite-title" };
 const _hoisted_3 = { class: "invite-content" };
@@ -23,7 +23,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               onClick: ($event) => unref(onCopy)(item.copyLink)
             }, {
               default: withCtx(() => [
-                createVNode(CopyIcon)
+                createVNode(copyIcon)
               ]),
               _: 2
             }, 1032, ["onClick"])

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

@@ -1,7 +1,7 @@
 import { defineComponent, openBlock, createElementBlock, createElementVNode, createVNode, toDisplayString, unref, withCtx, createTextVNode, createCommentVNode } from "vue";
 import useRoomMoreHooks from "./useRoomMoreHooks.mjs";
 import SvgIcon from "../common/base/SvgIcon.vue.mjs";
-import CopyIcon from "../common/icons/CopyIcon.vue.mjs";
+import copyIcon from "../common/icons/CopyIcon.vue.mjs";
 import EmailIcon from "../common/icons/EmailIcon.vue.mjs";
 import TuiButton from "../common/base/Button.vue.mjs";
 const _hoisted_1 = { class: "more-container" };
@@ -46,7 +46,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           createElementVNode("div", _hoisted_8, toDisplayString(unref(email)), 1),
           createVNode(SvgIcon, {
             class: "copy-icon",
-            icon: CopyIcon,
+            icon: copyIcon,
             onClick: _cache[0] || (_cache[0] = ($event) => unref(onCopy)(unref(email)))
           })
         ])

package/es/components/RoomSidebar/useSideBarHooks.mjs

@@ -12,7 +12,7 @@ function useSideBar() {
   const { t } = useI18n();
   const chatStore = useChatStore();
   const basicStore = useBasicStore();
-  const { sdkAppId, isSidebarOpen, sidebarName } = storeToRefs(basicStore);
+  const { sdkAppId, isSidebarOpen, sidebarName, roomId } = storeToRefs(basicStore);
   const roomStore = useRoomStore();
   const { userNumber } = storeToRefs(roomStore);
   const showSideBar = computed(() => isSidebarOpen.value && sidebarName.value !== "transfer-leave");
@@ -46,8 +46,9 @@ function useSideBar() {
     if (!options || !options.data) {
       return;
     }
+    const currentConversationId = `GROUP${roomId.value}`;
     options.data.forEach((message) => {
-      if (message.type === TencentCloudChat.TYPES.MSG_TEXT) {
+      if (message.conversationID === currentConversationId && message.type === TencentCloudChat.TYPES.MSG_TEXT) {
         if (!basicStore.isSidebarOpen || basicStore.sidebarName !== "chat") {
           chatStore.updateUnReadCount(++chatStore.unReadCount);
         }

package/es/components/ScheduleConference/Contacts.vue.d.ts

@@ -0,0 +1,22 @@
+interface Props {
+    visible: boolean;
+    contacts: any[];
+    selectedList?: any[];
+}
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    input: (...args: any[]) => void;
+    confirm: (...args: any[]) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>> & {
+    onInput?: ((...args: any[]) => any) | undefined;
+    onConfirm?: ((...args: any[]) => any) | undefined;
+}, {}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/es/components/ScheduleConference/Contacts.vue.mjs

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

package/es/components/ScheduleConference/Contacts.vue2.mjs

@@ -0,0 +1,212 @@
+import { defineComponent, ref, computed, watch, openBlock, createBlock, unref, withCtx, createElementVNode, createVNode, withModifiers, createElementBlock, toDisplayString, Fragment, renderList, createTextVNode } from "vue";
+import Dialog from "../common/base/Dialog/index.vue.mjs";
+import TuiInput from "../common/base/Input/index.vue.mjs";
+import TuiCheckbox from "../common/base/Checkbox.vue.mjs";
+import TuiButton from "../common/base/Button.vue.mjs";
+import TuiAvatar from "../common/Avatar.vue.mjs";
+import SearchIcon from "../common/icons/SearchIcon.vue.mjs";
+import CloseIcon from "../common/icons/CloseIcon.vue.mjs";
+import { useI18n } from "../../locales/index.mjs";
+const _hoisted_1 = { class: "contacts-container" };
+const _hoisted_2 = { class: "contact" };
+const _hoisted_3 = { class: "contact-search" };
+const _hoisted_4 = { class: "contact-list" };
+const _hoisted_5 = {
+  key: 0,
+  class: "no-result"
+};
+const _hoisted_6 = { class: "contact-list-item-checkbox-container" };
+const _hoisted_7 = ["title"];
+const _hoisted_8 = { class: "chosen" };
+const _hoisted_9 = { class: "chosen-title" };
+const _hoisted_10 = { class: "chosen-list" };
+const _hoisted_11 = ["title"];
+const _hoisted_12 = { class: "chosen-footer" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "Contacts",
+  props: {
+    visible: { type: Boolean },
+    contacts: {},
+    selectedList: {}
+  },
+  emits: ["input", "confirm"],
+  setup(__props, { emit: __emit }) {
+    const { t } = useI18n();
+    const props = __props;
+    const emit = __emit;
+    const isDialogVisible = ref(false);
+    const searchValue = ref("");
+    const updateContacts = () => {
+      contacts.value = props.contacts.map((user) => {
+        var _a;
+        const index = (_a = props.selectedList) == null ? void 0 : _a.findIndex((selectedUser) => selectedUser.userId === user.userID);
+        return { selected: index !== void 0 && index !== -1, userInfo: user };
+      });
+    };
+    const updateVisible = (val) => {
+      updateContacts();
+      emit("input", val);
+    };
+    const contacts = ref(props.contacts.map((user) => {
+      var _a;
+      const index = (_a = props.selectedList) == null ? void 0 : _a.findIndex((selectedUser) => selectedUser.userId === user.userID);
+      return { selected: !!index && index !== -1, userInfo: user };
+    }));
+    const selectedContacts = computed(() => contacts.value.filter((user) => user.selected));
+    const searchResult = ref([]);
+    const showList = computed(() => searchValue.value ? searchResult.value : contacts.value);
+    const searchContact = (v) => {
+      if (!v)
+        return [];
+      searchResult.value = contacts.value.filter((item) => item.userInfo.profile.nick.includes(v) || item.userInfo.userID.includes(v));
+    };
+    const removeSelectUser = (user) => {
+      const index = contacts.value.findIndex((item) => user.userInfo.userID === item.userInfo.userID);
+      contacts.value[index].selected = false;
+    };
+    const confirm = () => {
+      emit("confirm", selectedContacts.value.map((item) => {
+        const { userID, profile } = item.userInfo;
+        return {
+          userId: userID,
+          userName: profile.nick,
+          avatarUrl: profile.avatar
+        };
+      }));
+      updateVisible(false);
+    };
+    const cancel = () => {
+      updateVisible(false);
+    };
+    watch(
+      () => props.visible,
+      (val) => {
+        isDialogVisible.value = val;
+      },
+      {
+        immediate: true
+      }
+    );
+    watch(isDialogVisible, (val) => {
+      searchValue.value = "";
+      updateVisible(val);
+    }, { immediate: true });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(Dialog, {
+        modelValue: isDialogVisible.value,
+        "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => isDialogVisible.value = $event),
+        title: unref(t)("Contacts"),
+        modal: true,
+        "append-to-body": true,
+        "close-on-click-modal": false
+      }, {
+        default: withCtx(() => [
+          createElementVNode("div", _hoisted_1, [
+            createElementVNode("div", _hoisted_2, [
+              createElementVNode("div", _hoisted_3, [
+                createVNode(TuiInput, {
+                  modelValue: searchValue.value,
+                  "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => searchValue.value = $event),
+                  class: "contact-search-input",
+                  search: searchContact,
+                  onFocus: _cache[2] || (_cache[2] = (element) => {
+                    element.classList.add("focus");
+                  }),
+                  onBlur: _cache[3] || (_cache[3] = (element) => {
+                    element.classList.remove("focus");
+                  })
+                }, {
+                  suffixIcon: withCtx(() => [
+                    createVNode(SearchIcon, {
+                      class: "search-icon",
+                      onMousedown: _cache[0] || (_cache[0] = withModifiers(() => {
+                      }, ["prevent"]))
+                    })
+                  ]),
+                  _: 1
+                }, 8, ["modelValue"])
+              ]),
+              createElementVNode("div", _hoisted_4, [
+                showList.value.length === 0 && searchValue.value ? (openBlock(), createElementBlock("div", _hoisted_5, toDisplayString(unref(t)("No relevant members found")), 1)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(showList.value, (item) => {
+                  return openBlock(), createElementBlock("div", {
+                    key: item.userInfo.userID,
+                    class: "contact-list-item"
+                  }, [
+                    createVNode(TuiCheckbox, {
+                      "model-value": item.selected,
+                      class: "contact-list-item-checkbox",
+                      onInput: ($event) => item.selected = $event
+                    }, {
+                      default: withCtx(() => [
+                        createElementVNode("span", _hoisted_6, [
+                          createVNode(TuiAvatar, {
+                            class: "contact-list-item-avatar",
+                            "img-src": item.userInfo.profile.avatar
+                          }, null, 8, ["img-src"]),
+                          createElementVNode("p", {
+                            class: "contact-list-item-name",
+                            title: item.userInfo.profile.nick
+                          }, toDisplayString(item.userInfo.profile.nick || item.userInfo.profile.userID), 9, _hoisted_7)
+                        ])
+                      ]),
+                      _: 2
+                    }, 1032, ["model-value", "onInput"])
+                  ]);
+                }), 128))
+              ])
+            ]),
+            createElementVNode("div", _hoisted_8, [
+              createElementVNode("div", _hoisted_9, toDisplayString(unref(t)(`Selected Contact`) + `(${selectedContacts.value.length})`), 1),
+              createElementVNode("div", _hoisted_10, [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(selectedContacts.value, (item) => {
+                  return openBlock(), createElementBlock("div", {
+                    key: item.userInfo.userID,
+                    class: "chosen-list-item"
+                  }, [
+                    createVNode(TuiAvatar, {
+                      class: "chosen-list-item-avatar",
+                      "img-src": item.userInfo.profile.avatar
+                    }, null, 8, ["img-src"]),
+                    createElementVNode("p", {
+                      class: "chosen-list-item-name",
+                      title: item.userInfo.profile.nick
+                    }, toDisplayString(item.userInfo.profile.nick || item.userInfo.profile.userID), 9, _hoisted_11),
+                    createVNode(CloseIcon, {
+                      class: "chosen-list-item-remove",
+                      onClick: ($event) => removeSelectUser(item)
+                    }, null, 8, ["onClick"])
+                  ]);
+                }), 128))
+              ]),
+              createElementVNode("div", _hoisted_12, [
+                createVNode(TuiButton, {
+                  class: "chosen-footer-button",
+                  type: "primary",
+                  onClick: cancel
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(unref(t)("Cancel")), 1)
+                  ]),
+                  _: 1
+                }),
+                createVNode(TuiButton, {
+                  class: "chosen-footer-button",
+                  onClick: confirm
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(unref(t)("Confirm")), 1)
+                  ]),
+                  _: 1
+                })
+              ])
+            ])
+          ])
+        ]),
+        _: 1
+      }, 8, ["modelValue", "title"]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};