@tencentcloud/roomkit-electron-vue3 2.4.1 → 2.5.0

package/lib/components/RoomHome/RoomControl/index.vue2.js

@@ -5,55 +5,64 @@ const SvgIcon = require("../../common/base/SvgIcon.vue.js");
 const LoadingIcon = require("../../common/icons/LoadingIcon.vue.js");
 const NextIcon = require("../../common/icons/NextIcon.vue.js");
 const Button = require("../../common/base/Button.vue.js");
-const Logo = require("../../common/Logo.vue.js");
 const useRoomControlHooks = require("./useRoomControlHooks.js");
 const CreateRoomIcon = require("../../common/icons/CreateRoomIcon.vue.js");
 const EnterRoomIcon = require("../../common/icons/EnterRoomIcon.vue.js");
+const ScheduleRoomIcon = require("../../common/icons/ScheduleRoomIcon.vue.js");
 const useRoomEngine = require("../../../hooks/useRoomEngine.js");
 const basic = require("../../../stores/basic.js");
 const room = require("../../../stores/room.js");
 const AudioMediaControl = require("../../common/AudioMediaControl.vue.js");
 const VideoMediaControl = require("../../common/VideoMediaControl.vue.js");
+const ScheduleConferencePanel = require("../../ScheduleConference/ScheduleConferencePanel.vue.js");
 const TUIRoomEngine = require("@tencentcloud/tuiroom-engine-electron");
 const vClickOutside = require("../../../directives/vClickOutside.js");
 const mediaAbility = require("../../../utils/mediaAbility.js");
 const useDeviceManager = require("../../../hooks/useDeviceManager.js");
-const _withScopeId = (n) => (Vue.pushScopeId("data-v-08aec5e4"), n = n(), Vue.popScopeId(), n);
+const _withScopeId = (n) => (Vue.pushScopeId("data-v-d6c2f9cf"), n = n(), Vue.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__ */ Vue.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__ */ Vue.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__ */ Vue.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 }) {
@@ -75,6 +84,10 @@ const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
     const isCameraMuted = Vue.ref(false);
     const showCreateRoomItems = Vue.ref(false);
     const showEnterRoomAction = Vue.ref(Boolean(props.givenRoomId));
+    const scheduleConferenceDialogVisible = Vue.ref(false);
+    const scheduleConference = () => {
+      scheduleConferenceDialogVisible.value = true;
+    };
     const tuiRoomParam = {
       isOpenCamera: true,
       isOpenMicrophone: true,
@@ -121,6 +134,7 @@ const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
       tuiRoomParam.isOpenCamera = !isCameraMuted.value;
       if (isCameraMuted.value) {
         await closeCamera();
+        isCameraLoading.value = false;
       } else {
         isCameraLoading.value = true;
         await openCamera();
@@ -202,112 +216,131 @@ const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
     });
     return (_ctx, _cache) => {
       return Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
-        Vue.withDirectives(Vue.createVNode(Logo.default, { class: "logo" }, null, 512), [
-          [Vue.vShow, _ctx.showLogo]
-        ]),
         Vue.createElementVNode("div", _hoisted_2, [
           Vue.createElementVNode("div", _hoisted_3, [
-            _hoisted_4,
-            Vue.createElementVNode("div", _hoisted_5, [
-              isCameraMuted.value ? (Vue.openBlock(), Vue.createElementBlock("span", _hoisted_6, Vue.toDisplayString(Vue.unref(t)("Off Camera")), 1)) : Vue.createCommentVNode("", true),
-              isCameraLoading.value ? (Vue.openBlock(), Vue.createBlock(SvgIcon.default, {
-                key: 1,
-                icon: LoadingIcon.default,
-                class: "loading"
-              })) : Vue.createCommentVNode("", true)
-            ])
-          ]),
-          Vue.createElementVNode("div", _hoisted_7, [
-            Vue.createElementVNode("div", _hoisted_8, [
-              Vue.createVNode(AudioMediaControl.default, {
-                class: "media-control-item",
-                "has-more": true,
-                "is-muted": isMicMuted.value,
-                "audio-volume": audioVolume.value,
-                onClick: toggleMuteAudio
-              }, null, 8, ["is-muted", "audio-volume"]),
-              Vue.createVNode(VideoMediaControl.default, {
-                class: "media-control-item",
-                "has-more": true,
-                "is-muted": isCameraMuted.value,
-                onClick: toggleMuteVideo
-              }, null, 8, ["is-muted"])
+            Vue.createElementVNode("div", _hoisted_4, [
+              _hoisted_5,
+              Vue.createElementVNode("div", _hoisted_6, [
+                isCameraMuted.value ? (Vue.openBlock(), Vue.createElementBlock("span", _hoisted_7, Vue.toDisplayString(Vue.unref(t)("Off Camera")), 1)) : Vue.createCommentVNode("", true),
+                isCameraLoading.value ? (Vue.openBlock(), Vue.createBlock(SvgIcon.default, {
+                  key: 1,
+                  icon: LoadingIcon.default,
+                  class: "loading"
+                })) : Vue.createCommentVNode("", true)
+              ])
             ]),
-            Vue.createElementVNode("div", _hoisted_9, [
-              Vue.createElementVNode("div", _hoisted_10, [
-                Vue.createVNode(Button.default, {
-                  class: "button-item",
-                  onClick: Vue.withModifiers(handleCreateRoom, ["stop"])
-                }, {
-                  default: Vue.withCtx(() => [
-                    Vue.createVNode(SvgIcon.default, { icon: CreateRoomIcon.default }),
-                    Vue.createElementVNode("span", _hoisted_11, Vue.toDisplayString(Vue.unref(t)("New Room")), 1)
-                  ]),
-                  _: 1
-                }),
-                showCreateRoomItems.value ? Vue.withDirectives((Vue.openBlock(), Vue.createElementBlock("div", _hoisted_12, [
-                  Vue.createElementVNode("div", {
-                    class: "create-room-item",
-                    onClick: _cache[0] || (_cache[0] = ($event) => createRoom("SpeakAfterTakingSeat"))
-                  }, [
-                    Vue.createElementVNode("span", {
-                      title: Vue.unref(t)("On-stage Speaking Room"),
-                      class: "create-room-option"
-                    }, Vue.toDisplayString(Vue.unref(t)("On-stage Speaking Room")), 9, _hoisted_13),
-                    Vue.createVNode(SvgIcon.default, {
-                      class: "create-room-icon",
-                      icon: NextIcon.default
-                    })
-                  ]),
-                  Vue.createElementVNode("div", {
-                    class: "create-room-item",
-                    onClick: _cache[1] || (_cache[1] = ($event) => createRoom("FreeToSpeak"))
-                  }, [
-                    Vue.createElementVNode("span", {
-                      title: Vue.unref(t)("Free Speech Room"),
-                      class: "create-room-option"
-                    }, Vue.toDisplayString(Vue.unref(t)("Free Speech Room")), 9, _hoisted_14),
-                    Vue.createVNode(SvgIcon.default, {
-                      class: "create-room-icon",
-                      icon: NextIcon.default
-                    })
-                  ])
-                ])), [
-                  [Vue.unref(vClickOutside.default), handleClickOutsideCreateRoomItems]
-                ]) : Vue.createCommentVNode("", true)
+            Vue.createElementVNode("div", _hoisted_8, [
+              Vue.createElementVNode("div", _hoisted_9, [
+                Vue.createVNode(AudioMediaControl.default, {
+                  class: "media-control-item",
+                  "has-more": true,
+                  "is-muted": isMicMuted.value,
+                  "audio-volume": audioVolume.value,
+                  onClick: toggleMuteAudio
+                }, null, 8, ["is-muted", "audio-volume"]),
+                Vue.createVNode(VideoMediaControl.default, {
+                  class: "media-control-item",
+                  "has-more": true,
+                  "is-muted": isCameraMuted.value,
+                  onClick: toggleMuteVideo
+                }, null, 8, ["is-muted"])
               ]),
-              Vue.createElementVNode("div", _hoisted_15, [
-                !showEnterRoomAction.value ? (Vue.openBlock(), Vue.createBlock(Button.default, {
-                  key: 0,
-                  class: "button-item",
-                  onClick: handleEnterRoom
-                }, {
-                  default: Vue.withCtx(() => [
-                    Vue.createVNode(SvgIcon.default, { icon: EnterRoomIcon.default }),
-                    Vue.createElementVNode("span", _hoisted_16, Vue.toDisplayString(Vue.unref(t)("Join Room")), 1)
-                  ]),
-                  _: 1
-                })) : Vue.createCommentVNode("", true),
-                showEnterRoomAction.value ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_17, [
-                  Vue.withDirectives(Vue.createElementVNode("input", {
-                    "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => roomId.value = $event),
-                    class: "input",
-                    placeholder: Vue.unref(t)("Enter room ID"),
-                    onKeyup: Vue.withKeys(enterRoom, ["enter"])
-                  }, null, 40, _hoisted_18), [
-                    [Vue.vModelText, roomId.value]
-                  ]),
-                  Vue.createElementVNode("div", {
-                    class: Vue.normalizeClass(["enter-button", { "active": roomId.value.length > 0 }]),
-                    onClick: enterRoom
-                  }, [
-                    Vue.createVNode(SvgIcon.default, { icon: EnterRoomIcon.default })
-                  ], 2)
+              Vue.createElementVNode("div", _hoisted_10, [
+                Vue.createElementVNode("div", _hoisted_11, [
+                  Vue.createVNode(Button.default, {
+                    class: "button-item",
+                    style: { "width": "170px" },
+                    onClick: Vue.withModifiers(handleCreateRoom, ["stop"])
+                  }, {
+                    default: Vue.withCtx(() => [
+                      Vue.createVNode(SvgIcon.default, { icon: CreateRoomIcon.default }),
+                      Vue.createElementVNode("span", _hoisted_12, Vue.toDisplayString(Vue.unref(t)("New Room")), 1)
+                    ]),
+                    _: 1
+                  }),
+                  showCreateRoomItems.value ? Vue.withDirectives((Vue.openBlock(), Vue.createElementBlock("div", _hoisted_13, [
+                    Vue.createElementVNode("div", {
+                      class: "create-room-item",
+                      onClick: _cache[0] || (_cache[0] = ($event) => createRoom("SpeakAfterTakingSeat"))
+                    }, [
+                      Vue.createElementVNode("span", {
+                        title: Vue.unref(t)("On-stage Speaking Room"),
+                        class: "create-room-option"
+                      }, Vue.toDisplayString(Vue.unref(t)("On-stage Speaking Room")), 9, _hoisted_14),
+                      Vue.createVNode(SvgIcon.default, {
+                        class: "create-room-icon",
+                        icon: NextIcon.default
+                      })
+                    ]),
+                    Vue.createElementVNode("div", {
+                      class: "create-room-item",
+                      onClick: _cache[1] || (_cache[1] = ($event) => createRoom("FreeToSpeak"))
+                    }, [
+                      Vue.createElementVNode("span", {
+                        title: Vue.unref(t)("Free Speech Room"),
+                        class: "create-room-option"
+                      }, Vue.toDisplayString(Vue.unref(t)("Free Speech Room")), 9, _hoisted_15),
+                      Vue.createVNode(SvgIcon.default, {
+                        class: "create-room-icon",
+                        icon: NextIcon.default
+                      })
+                    ])
+                  ])), [
+                    [Vue.unref(vClickOutside.default), handleClickOutsideCreateRoomItems]
+                  ]) : Vue.createCommentVNode("", true)
+                ]),
+                Vue.createElementVNode("div", _hoisted_16, [
+                  !showEnterRoomAction.value ? (Vue.openBlock(), Vue.createBlock(Button.default, {
+                    key: 0,
+                    class: "button-item",
+                    style: { "width": "170px" },
+                    onClick: handleEnterRoom
+                  }, {
+                    default: Vue.withCtx(() => [
+                      Vue.createVNode(SvgIcon.default, { icon: EnterRoomIcon.default }),
+                      Vue.createElementVNode("span", _hoisted_17, Vue.toDisplayString(Vue.unref(t)("Join Room")), 1)
+                    ]),
+                    _: 1
+                  })) : Vue.createCommentVNode("", true),
+                  showEnterRoomAction.value ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_18, [
+                    Vue.withDirectives(Vue.createElementVNode("input", {
+                      "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => roomId.value = $event),
+                      class: "input",
+                      placeholder: Vue.unref(t)("Enter room ID"),
+                      onKeyup: Vue.withKeys(enterRoom, ["enter"])
+                    }, null, 40, _hoisted_19), [
+                      [Vue.vModelText, roomId.value]
+                    ]),
+                    Vue.createElementVNode("div", {
+                      class: Vue.normalizeClass(["enter-button", { "active": roomId.value.length > 0 }]),
+                      onClick: enterRoom
+                    }, [
+                      Vue.createVNode(SvgIcon.default, { icon: EnterRoomIcon.default })
+                    ], 2)
+                  ])) : Vue.createCommentVNode("", true)
+                ]),
+                props.enableScheduledConference ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_20, [
+                  Vue.createVNode(Button.default, {
+                    class: "button-item",
+                    style: { "width": "170px" },
+                    onClick: scheduleConference
+                  }, {
+                    default: Vue.withCtx(() => [
+                      Vue.createVNode(SvgIcon.default, { icon: ScheduleRoomIcon.default }),
+                      Vue.createElementVNode("span", _hoisted_21, Vue.toDisplayString(Vue.unref(t)("Schedule")), 1)
+                    ]),
+                    _: 1
+                  })
                 ])) : Vue.createCommentVNode("", true)
               ])
             ])
           ])
-        ])
+        ]),
+        Vue.createVNode(ScheduleConferencePanel.default, {
+          visible: scheduleConferenceDialogVisible.value,
+          "user-name": props.userName,
+          onInput: _cache[3] || (_cache[3] = ($event) => scheduleConferenceDialogVisible.value = $event)
+        }, null, 8, ["visible", "user-name"])
       ]);
     };
   }

package/lib/components/RoomSidebar/useSideBarHooks.js

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

package/lib/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/lib/components/ScheduleConference/Contacts.vue.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Contacts_vue_vue_type_script_setup_true_lang = require("./Contacts.vue2.js");
+require("./Contacts.vue3.js");
+const _pluginVue_exportHelper = require("../../_virtual/_plugin-vue_export-helper.js");
+const Contacts = /* @__PURE__ */ _pluginVue_exportHelper.default(Contacts_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-6ec64c29"]]);
+exports.default = Contacts;

package/lib/components/ScheduleConference/Contacts.vue2.js

@@ -0,0 +1,212 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Vue = require("vue");
+const index$1 = require("../common/base/Dialog/index.vue.js");
+const index$2 = require("../common/base/Input/index.vue.js");
+const Checkbox = require("../common/base/Checkbox.vue.js");
+const Button = require("../common/base/Button.vue.js");
+const Avatar = require("../common/Avatar.vue.js");
+const SearchIcon = require("../common/icons/SearchIcon.vue.js");
+const CloseIcon = require("../common/icons/CloseIcon.vue.js");
+const index = require("../../locales/index.js");
+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__ */ Vue.defineComponent({
+  __name: "Contacts",
+  props: {
+    visible: { type: Boolean },
+    contacts: {},
+    selectedList: {}
+  },
+  emits: ["input", "confirm"],
+  setup(__props, { emit: __emit }) {
+    const { t } = index.useI18n();
+    const props = __props;
+    const emit = __emit;
+    const isDialogVisible = Vue.ref(false);
+    const searchValue = Vue.ref("");
+    const updateContacts = () => {
+      contacts.value = props.contacts.map((user) => {
+        var _a;
+        const index2 = (_a = props.selectedList) == null ? void 0 : _a.findIndex((selectedUser) => selectedUser.userId === user.userID);
+        return { selected: index2 !== void 0 && index2 !== -1, userInfo: user };
+      });
+    };
+    const updateVisible = (val) => {
+      updateContacts();
+      emit("input", val);
+    };
+    const contacts = Vue.ref(props.contacts.map((user) => {
+      var _a;
+      const index2 = (_a = props.selectedList) == null ? void 0 : _a.findIndex((selectedUser) => selectedUser.userId === user.userID);
+      return { selected: !!index2 && index2 !== -1, userInfo: user };
+    }));
+    const selectedContacts = Vue.computed(() => contacts.value.filter((user) => user.selected));
+    const searchResult = Vue.ref([]);
+    const showList = Vue.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 index2 = contacts.value.findIndex((item) => user.userInfo.userID === item.userInfo.userID);
+      contacts.value[index2].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);
+    };
+    Vue.watch(
+      () => props.visible,
+      (val) => {
+        isDialogVisible.value = val;
+      },
+      {
+        immediate: true
+      }
+    );
+    Vue.watch(isDialogVisible, (val) => {
+      searchValue.value = "";
+      updateVisible(val);
+    }, { immediate: true });
+    return (_ctx, _cache) => {
+      return Vue.openBlock(), Vue.createBlock(index$1.default, {
+        modelValue: isDialogVisible.value,
+        "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => isDialogVisible.value = $event),
+        title: Vue.unref(t)("Contacts"),
+        modal: true,
+        "append-to-body": true,
+        "close-on-click-modal": false
+      }, {
+        default: Vue.withCtx(() => [
+          Vue.createElementVNode("div", _hoisted_1, [
+            Vue.createElementVNode("div", _hoisted_2, [
+              Vue.createElementVNode("div", _hoisted_3, [
+                Vue.createVNode(index$2.default, {
+                  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: Vue.withCtx(() => [
+                    Vue.createVNode(SearchIcon.default, {
+                      class: "search-icon",
+                      onMousedown: _cache[0] || (_cache[0] = Vue.withModifiers(() => {
+                      }, ["prevent"]))
+                    })
+                  ]),
+                  _: 1
+                }, 8, ["modelValue"])
+              ]),
+              Vue.createElementVNode("div", _hoisted_4, [
+                showList.value.length === 0 && searchValue.value ? (Vue.openBlock(), Vue.createElementBlock("div", _hoisted_5, Vue.toDisplayString(Vue.unref(t)("No relevant members found")), 1)) : (Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, { key: 1 }, Vue.renderList(showList.value, (item) => {
+                  return Vue.openBlock(), Vue.createElementBlock("div", {
+                    key: item.userInfo.userID,
+                    class: "contact-list-item"
+                  }, [
+                    Vue.createVNode(Checkbox.default, {
+                      "model-value": item.selected,
+                      class: "contact-list-item-checkbox",
+                      onInput: ($event) => item.selected = $event
+                    }, {
+                      default: Vue.withCtx(() => [
+                        Vue.createElementVNode("span", _hoisted_6, [
+                          Vue.createVNode(Avatar.default, {
+                            class: "contact-list-item-avatar",
+                            "img-src": item.userInfo.profile.avatar
+                          }, null, 8, ["img-src"]),
+                          Vue.createElementVNode("p", {
+                            class: "contact-list-item-name",
+                            title: item.userInfo.profile.nick
+                          }, Vue.toDisplayString(item.userInfo.profile.nick || item.userInfo.profile.userID), 9, _hoisted_7)
+                        ])
+                      ]),
+                      _: 2
+                    }, 1032, ["model-value", "onInput"])
+                  ]);
+                }), 128))
+              ])
+            ]),
+            Vue.createElementVNode("div", _hoisted_8, [
+              Vue.createElementVNode("div", _hoisted_9, Vue.toDisplayString(Vue.unref(t)(`Selected Contact`) + `(${selectedContacts.value.length})`), 1),
+              Vue.createElementVNode("div", _hoisted_10, [
+                (Vue.openBlock(true), Vue.createElementBlock(Vue.Fragment, null, Vue.renderList(selectedContacts.value, (item) => {
+                  return Vue.openBlock(), Vue.createElementBlock("div", {
+                    key: item.userInfo.userID,
+                    class: "chosen-list-item"
+                  }, [
+                    Vue.createVNode(Avatar.default, {
+                      class: "chosen-list-item-avatar",
+                      "img-src": item.userInfo.profile.avatar
+                    }, null, 8, ["img-src"]),
+                    Vue.createElementVNode("p", {
+                      class: "chosen-list-item-name",
+                      title: item.userInfo.profile.nick
+                    }, Vue.toDisplayString(item.userInfo.profile.nick || item.userInfo.profile.userID), 9, _hoisted_11),
+                    Vue.createVNode(CloseIcon.default, {
+                      class: "chosen-list-item-remove",
+                      onClick: ($event) => removeSelectUser(item)
+                    }, null, 8, ["onClick"])
+                  ]);
+                }), 128))
+              ]),
+              Vue.createElementVNode("div", _hoisted_12, [
+                Vue.createVNode(Button.default, {
+                  class: "chosen-footer-button",
+                  type: "primary",
+                  onClick: cancel
+                }, {
+                  default: Vue.withCtx(() => [
+                    Vue.createTextVNode(Vue.toDisplayString(Vue.unref(t)("Cancel")), 1)
+                  ]),
+                  _: 1
+                }),
+                Vue.createVNode(Button.default, {
+                  class: "chosen-footer-button",
+                  onClick: confirm
+                }, {
+                  default: Vue.withCtx(() => [
+                    Vue.createTextVNode(Vue.toDisplayString(Vue.unref(t)("Confirm")), 1)
+                  ]),
+                  _: 1
+                })
+              ])
+            ])
+          ])
+        ]),
+        _: 1
+      }, 8, ["modelValue", "title"]);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/ScheduleConference/DurationTimePicker.vue.d.ts

@@ -0,0 +1,18 @@
+interface Props {
+    modelValue: number;
+}
+declare const _default: import('vue').DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    input: (...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;
+}, {}, {}>;
+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;
+    };
+};