@ndscnj/roomkit-web-vue3 3.2.0

package/lib/components/Chat/ChatKit/components/TUIChat/index.vue2.js

@@ -0,0 +1,253 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Vue = require("vue");
+require("../../adapter-vue.js");
+const TUIChatEngine = require("@tencentcloud/chat-uikit-engine");
+const TUICore = require("@tencentcloud/tui-core");
+const index = require("./chat-header/index.vue.js");
+const index$1 = require("./message-list/index.vue.js");
+const index$4 = require("./message-input/index.vue.js");
+const index$2 = require("./mulitple-select-panel/index.vue.js");
+const index_vue_vue_type_script_setup_true_lang = require("./forward/index.vue.js");
+const index$3 = require("./message-input-toolbar/index.vue.js");
+const env = require("../../utils/env.js");
+const config = require("./config.js");
+const _hoisted_1 = { class: "chat" };
+const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
+  __name: "index",
+  emits: ["closeChat"],
+  setup(__props, { emit: __emit }) {
+    const emits = __emit;
+    const groupID = Vue.ref(void 0);
+    const isGroup = Vue.ref(false);
+    const isNotInGroup = Vue.ref(false);
+    const notInGroupReason = Vue.ref();
+    const currentConversationID = Vue.ref();
+    const isMultipleSelectMode = Vue.ref(false);
+    const inputToolbarDisplayType = Vue.ref("none");
+    const messageInputRef = Vue.ref();
+    const messageListRef = Vue.ref();
+    const headerExtensionList = Vue.ref([]);
+    const featureConfig = config.default.getFeatureConfig();
+    Vue.onMounted(() => {
+      TUIChatEngine.TUIStore.watch(TUIChatEngine.StoreName.CONV, {
+        currentConversation: onCurrentConversationUpdate
+      });
+    });
+    Vue.onUnmounted(() => {
+      TUIChatEngine.TUIStore.unwatch(TUIChatEngine.StoreName.CONV, {
+        currentConversation: onCurrentConversationUpdate
+      });
+      reset();
+    });
+    const isInputToolbarShow = Vue.computed(() => {
+      return env.isUniFrameWork ? inputToolbarDisplayType.value !== "none" : true;
+    });
+    const leaveGroupReasonText = Vue.computed(() => {
+      let text = "";
+      switch (notInGroupReason.value) {
+        case 4:
+          text = TUIChatEngine.TUITranslateService.t("TUIChat.您已被管理员移出群聊");
+          break;
+        case 5:
+          text = TUIChatEngine.TUITranslateService.t("TUIChat.该群聊已被解散");
+          break;
+        case 8:
+          text = TUIChatEngine.TUITranslateService.t("TUIChat.您已退出该群聊");
+          break;
+        default:
+          text = TUIChatEngine.TUITranslateService.t("TUIChat.您已退出该群聊");
+          break;
+      }
+      return text;
+    });
+    const reset = () => {
+      TUIChatEngine.TUIConversationService.switchConversation("");
+    };
+    const closeChat = (conversationID) => {
+      emits("closeChat", conversationID);
+      reset();
+    };
+    const insertEmoji = (emojiObj) => {
+      var _a;
+      (_a = messageInputRef.value) == null ? void 0 : _a.insertEmoji(emojiObj);
+    };
+    const handleEditor = (message, type) => {
+      var _a, _b, _c;
+      if (!message || !type) return;
+      switch (type) {
+        case "reference":
+          break;
+        case "reply":
+          break;
+        case "reedit":
+          if ((_a = message == null ? void 0 : message.payload) == null ? void 0 : _a.text) {
+            (_c = messageInputRef == null ? void 0 : messageInputRef.value) == null ? void 0 : _c.reEdit((_b = message == null ? void 0 : message.payload) == null ? void 0 : _b.text);
+          }
+          break;
+      }
+    };
+    const handleGroup = () => {
+      headerExtensionList.value[0].listener.onClicked({ groupID: groupID.value });
+    };
+    function changeToolbarDisplayType(type) {
+      inputToolbarDisplayType.value = inputToolbarDisplayType.value === type ? "none" : type;
+      if (inputToolbarDisplayType.value !== "none" && env.isUniFrameWork) {
+        uni.$emit("scroll-to-bottom");
+      }
+    }
+    function scrollToLatestMessage() {
+      var _a;
+      (_a = messageListRef.value) == null ? void 0 : _a.scrollToLatestMessage();
+    }
+    function toggleMultipleSelectMode(visible) {
+      isMultipleSelectMode.value = visible === void 0 ? !isMultipleSelectMode.value : visible;
+    }
+    function mergeForwardMessage() {
+      var _a;
+      (_a = messageListRef.value) == null ? void 0 : _a.mergeForwardMessage();
+    }
+    function oneByOneForwardMessage() {
+      var _a;
+      (_a = messageListRef.value) == null ? void 0 : _a.oneByOneForwardMessage();
+    }
+    function updateUIUserNotInGroup(conversation) {
+      if ((conversation == null ? void 0 : conversation.operationType) > 0) {
+        headerExtensionList.value = [];
+        isNotInGroup.value = true;
+        notInGroupReason.value = conversation == null ? void 0 : conversation.operationType;
+      } else {
+        isNotInGroup.value = false;
+        notInGroupReason.value = void 0;
+      }
+    }
+    function onCurrentConversationUpdate(conversation) {
+      updateUIUserNotInGroup(conversation);
+      if (!conversation) {
+        return;
+      }
+      if (currentConversationID.value === (conversation == null ? void 0 : conversation.conversationID)) {
+        return;
+      }
+      isGroup.value = false;
+      let conversationType = TUIChatEngine.TYPES.CONV_C2C;
+      const conversationID = conversation.conversationID;
+      if (conversationID.startsWith(TUIChatEngine.TYPES.CONV_GROUP)) {
+        conversationType = TUIChatEngine.TYPES.CONV_GROUP;
+        isGroup.value = true;
+        groupID.value = conversationID.replace(TUIChatEngine.TYPES.CONV_GROUP, "");
+      }
+      headerExtensionList.value = [];
+      isMultipleSelectMode.value = false;
+      config.default.setChatType(conversationType);
+      TUICore.notifyEvent(TUICore.TUIConstants.TUIChat.EVENT.CHAT_STATE_CHANGED, TUICore.TUIConstants.TUIChat.EVENT_SUB_KEY.CHAT_OPENED, { groupID: groupID.value });
+      TUICore.callService({
+        serviceName: TUICore.TUIConstants.TUICustomerServicePlugin.SERVICE.NAME,
+        method: TUICore.TUIConstants.TUICustomerServicePlugin.SERVICE.METHOD.ACTIVE_CONVERSATION,
+        params: { conversationID }
+      });
+      if (config.default.getChatType() === TUICore.TUIConstants.TUIChat.TYPE.ROOM) {
+        if (config.default.getFeatureConfig(TUICore.TUIConstants.TUIChat.FEATURE.InputVoice) === true) {
+          config.default.setTheme("light");
+          currentConversationID.value = "";
+          return;
+        }
+      }
+      if (config.default.getChatType() === TUICore.TUIConstants.TUIChat.TYPE.GROUP) {
+        headerExtensionList.value = TUICore.getExtensionList(TUICore.TUIConstants.TUIChat.EXTENSION.CHAT_HEADER.EXT_ID);
+      }
+      TUIChatEngine.TUIStore.update(TUIChatEngine.StoreName.CUSTOM, "activeConversation", conversationID);
+      currentConversationID.value = conversationID;
+    }
+    return (_ctx, _cache) => {
+      return Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
+        Vue.createElementVNode("div", {
+          class: Vue.normalizeClass(["tui-chat", !Vue.unref(env.isPC) && "tui-chat-h5"])
+        }, [
+          !Vue.unref(currentConversationID) ? (Vue.openBlock(), Vue.createElementBlock("div", {
+            key: 0,
+            class: Vue.normalizeClass(["tui-chat-default", !Vue.unref(env.isPC) && "tui-chat-h5-default"])
+          }, [
+            Vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+          ], 2)) : Vue.createCommentVNode("", true),
+          Vue.unref(currentConversationID) ? (Vue.openBlock(), Vue.createElementBlock("div", {
+            key: 1,
+            class: Vue.normalizeClass(["tui-chat", !Vue.unref(env.isPC) && "tui-chat-h5"])
+          }, [
+            Vue.createVNode(index.default, {
+              class: Vue.normalizeClass([
+                "tui-chat-header",
+                !Vue.unref(env.isPC) && "tui-chat-H5-header",
+                Vue.unref(env.isUniFrameWork) && "tui-chat-uniapp-header"
+              ]),
+              isGroup: Vue.unref(isGroup),
+              headerExtensionList: Vue.unref(headerExtensionList),
+              onCloseChat: closeChat,
+              onOpenGroupManagement: handleGroup
+            }, null, 8, ["class", "isGroup", "headerExtensionList"]),
+            Vue.createVNode(index_vue_vue_type_script_setup_true_lang.default, { onToggleMultipleSelectMode: toggleMultipleSelectMode }),
+            Vue.createVNode(index$1.default, {
+              ref_key: "messageListRef",
+              ref: messageListRef,
+              class: Vue.normalizeClass(["tui-chat-message-list", !Vue.unref(env.isPC) && "tui-chat-h5-message-list"]),
+              isGroup: Vue.unref(isGroup),
+              groupID: Vue.unref(groupID),
+              isNotInGroup: Vue.unref(isNotInGroup),
+              isMultipleSelectMode: Vue.unref(isMultipleSelectMode),
+              onHandleEditor: handleEditor,
+              onCloseInputToolBar: _cache[0] || (_cache[0] = () => changeToolbarDisplayType("none")),
+              onToggleMultipleSelectMode: toggleMultipleSelectMode
+            }, null, 8, ["class", "isGroup", "groupID", "isNotInGroup", "isMultipleSelectMode"]),
+            Vue.unref(isNotInGroup) ? (Vue.openBlock(), Vue.createElementBlock("div", {
+              key: 0,
+              class: Vue.normalizeClass({
+                "tui-chat-leave-group": true,
+                "tui-chat-leave-group-mobile": Vue.unref(env.isMobile)
+              })
+            }, Vue.toDisplayString(Vue.unref(leaveGroupReasonText)), 3)) : Vue.unref(isMultipleSelectMode) ? (Vue.openBlock(), Vue.createBlock(index$2.default, {
+              key: 1,
+              onOneByOneForwardMessage: oneByOneForwardMessage,
+              onMergeForwardMessage: mergeForwardMessage,
+              onToggleMultipleSelectMode: toggleMultipleSelectMode
+            })) : (Vue.openBlock(), Vue.createElementBlock(Vue.Fragment, { key: 2 }, [
+              Vue.unref(isInputToolbarShow) ? (Vue.openBlock(), Vue.createBlock(index$3.default, {
+                key: 0,
+                class: Vue.normalizeClass([
+                  "tui-chat-message-input-toolbar",
+                  !Vue.unref(env.isPC) && "tui-chat-h5-message-input-toolbar",
+                  Vue.unref(env.isUniFrameWork) && "tui-chat-uni-message-input-toolbar"
+                ]),
+                displayType: Vue.unref(inputToolbarDisplayType),
+                onInsertEmoji: insertEmoji,
+                onChangeToolbarDisplayType: changeToolbarDisplayType,
+                onScrollToLatestMessage: scrollToLatestMessage
+              }, null, 8, ["class", "displayType"])) : Vue.createCommentVNode("", true),
+              Vue.createVNode(index$4.default, {
+                ref_key: "messageInputRef",
+                ref: messageInputRef,
+                class: Vue.normalizeClass([
+                  "tui-chat-message-input",
+                  !Vue.unref(env.isPC) && "tui-chat-h5-message-input",
+                  Vue.unref(env.isUniFrameWork) && "tui-chat-uni-message-input",
+                  Vue.unref(env.isWeChat) && "tui-chat-wx-message-input"
+                ]),
+                enableAt: Vue.unref(featureConfig).InputMention,
+                isMuted: false,
+                muteText: Vue.unref(TUIChatEngine.TUITranslateService).t("TUIChat.您已被管理员禁言"),
+                placeholder: Vue.unref(TUIChatEngine.TUITranslateService).t("TUIChat.请输入消息"),
+                inputToolbarDisplayType: Vue.unref(inputToolbarDisplayType),
+                onChangeToolbarDisplayType: changeToolbarDisplayType
+              }, null, 8, ["class", "enableAt", "muteText", "placeholder", "inputToolbarDisplayType"])
+            ], 64))
+          ], 2)) : Vue.createCommentVNode("", true),
+          !Vue.unref(isNotInGroup) && !Vue.unref(env.isApp) && Vue.unref(env.isUniFrameWork) && Vue.unref(isGroup) && Vue.unref(headerExtensionList).length > 0 ? (Vue.openBlock(), Vue.createElementBlock("div", {
+            key: 2,
+            class: "group-profile",
+            onClick: handleGroup
+          }, Vue.toDisplayString(Vue.unref(headerExtensionList)[0].text), 1)) : Vue.createCommentVNode("", true)
+        ], 2)
+      ]);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/Chat/ChatKit/components/TUIChat/message-input/index.d.ts

@@ -0,0 +1,3 @@
+import { default as MessageInput } from './index.vue';
+
+export default MessageInput;

package/lib/components/Chat/ChatKit/components/TUIChat/message-input/index.vue.d.ts

@@ -0,0 +1,79 @@
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    isMuted: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    muteText: {
+        type: StringConstructor;
+        default: string;
+    };
+    enableInput: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enableAt: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enableDragUpload: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enableTyping: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {
+    insertEmoji: (emoji: any) => void;
+    reEdit: (content: any) => void;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    sendMessage: (...args: any[]) => void;
+    onTyping: (...args: any[]) => void;
+    resetReplyOrReference: (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    placeholder: {
+        type: StringConstructor;
+        default: string;
+    };
+    isMuted: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    muteText: {
+        type: StringConstructor;
+        default: string;
+    };
+    enableInput: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enableAt: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enableDragUpload: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    enableTyping: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{
+    onSendMessage?: ((...args: any[]) => any) | undefined;
+    onOnTyping?: ((...args: any[]) => any) | undefined;
+    onResetReplyOrReference?: ((...args: any[]) => any) | undefined;
+}>, {
+    placeholder: string;
+    isMuted: boolean;
+    muteText: string;
+    enableInput: boolean;
+    enableAt: boolean;
+    enableDragUpload: boolean;
+    enableTyping: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/lib/components/Chat/ChatKit/components/TUIChat/message-input/index.vue.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const index_vue_vue_type_script_setup_true_lang = ;/* empty css            */
+;/* empty css            */
+const _pluginVue_exportHelper = require("../../../../../../_virtual/_plugin-vue_export-helper.js");
+const MessageInput = /* @__PURE__ */ _pluginVue_exportHelper.default(index_vue_vue_type_script_setup_true_lang.default, [["__scopeId", "data-v-30b5e1e2"]]);
+exports.default = MessageInput;

package/lib/components/Chat/ChatKit/components/TUIChat/message-input/index.vue2.js

@@ -0,0 +1,141 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Vue = require("vue");
+const TUIChatEngine = require("@tencentcloud/chat-uikit-engine");
+require("../../../adapter-vue.js");
+const messageInputEditor = require("./message-input-editor.vue.js");
+const index = require("./message-input-at/index.vue.js");
+const messageInputButton = require("./message-input-button.vue.js");
+const index$1 = require("./message-input-quote/index.vue.js");
+const sendMessage = require("../utils/sendMessage.js");
+const index$2 = require("../emoji-config/index.js");
+const env = require("../../../utils/env.js");
+const _hoisted_1 = { class: "message-input-wrapper" };
+const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
+  __name: "index",
+  props: {
+    placeholder: {
+      type: String,
+      default: "this is placeholder"
+    },
+    isMuted: {
+      type: Boolean,
+      default: true
+    },
+    muteText: {
+      type: String,
+      default: ""
+    },
+    enableInput: {
+      type: Boolean,
+      default: true
+    },
+    enableAt: {
+      type: Boolean,
+      default: true
+    },
+    enableDragUpload: {
+      type: Boolean,
+      default: true
+    },
+    enableTyping: {
+      type: Boolean,
+      default: true
+    }
+  },
+  emits: ["sendMessage", "resetReplyOrReference", "onTyping"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const editor = Vue.ref();
+    const messageInputAtRef = Vue.ref();
+    const currentConversation = Vue.ref();
+    TUIChatEngine.TUIStore.watch(TUIChatEngine.StoreName.CONV, {
+      currentConversation: (conversation) => {
+        currentConversation.value = conversation;
+      }
+    });
+    const onTyping = (inputContentEmpty, inputBlur) => {
+      sendMessage.sendTyping(inputContentEmpty, inputBlur);
+    };
+    const onAt = (show) => {
+      var _a;
+      (_a = messageInputAtRef.value) == null ? void 0 : _a.toggleAtList(show);
+    };
+    const sendMessage$1 = async () => {
+      var _a, _b;
+      const _editorContentList = (_a = editor.value) == null ? void 0 : _a.getEditorContent();
+      if (!_editorContentList || !currentConversation.value) return;
+      const editorContentList = _editorContentList.map((editor2) => {
+        if (editor2.type === "text") {
+          editor2.payload.text = index$2.transformTextWithEmojiNamesToKeys(editor2.payload.text);
+        }
+        return editor2;
+      });
+      await sendMessage.sendMessages(
+        editorContentList,
+        currentConversation.value
+      );
+      emit("sendMessage");
+      (_b = editor.value) == null ? void 0 : _b.resetEditor();
+    };
+    const insertEmoji = (emoji) => {
+      var _a;
+      (_a = editor.value) == null ? void 0 : _a.addEmoji(emoji);
+    };
+    const onAtListOpen = () => {
+      var _a;
+      if (env.isH5) {
+        (_a = editor.value) == null ? void 0 : _a.blur();
+      }
+    };
+    const insertAt = (atInfo) => {
+      var _a, _b;
+      ((_a = editor == null ? void 0 : editor.value) == null ? void 0 : _a.insertAt) && ((_b = editor == null ? void 0 : editor.value) == null ? void 0 : _b.insertAt(atInfo));
+    };
+    const reEdit = (content) => {
+      var _a, _b;
+      (_a = editor.value) == null ? void 0 : _a.resetEditor();
+      (_b = editor.value) == null ? void 0 : _b.setEditorContent(content);
+    };
+    __expose({
+      insertEmoji,
+      reEdit
+    });
+    return (_ctx, _cache) => {
+      return Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
+        Vue.createElementVNode("div", {
+          class: Vue.normalizeClass(["message-input-container", !Vue.unref(env.isPC) && "message-input-container-h5"])
+        }, [
+          Vue.createVNode(messageInputEditor.default, {
+            ref_key: "editor",
+            ref: editor,
+            placeholder: props.placeholder,
+            isMuted: props.isMuted,
+            muteText: props.muteText,
+            enableInput: props.enableInput,
+            enableAt: props.enableAt,
+            enableTyping: props.enableTyping,
+            enableDragUpload: props.enableDragUpload,
+            onSendMessage: sendMessage$1,
+            onOnTyping: onTyping,
+            onOnAt: onAt
+          }, null, 8, ["placeholder", "isMuted", "muteText", "enableInput", "enableAt", "enableTyping", "enableDragUpload"]),
+          !props.isMuted ? (Vue.openBlock(), Vue.createBlock(messageInputButton.default, {
+            key: 0,
+            onSendMessage: sendMessage$1
+          })) : Vue.createCommentVNode("", true),
+          props.enableAt ? (Vue.openBlock(), Vue.createBlock(index.default, {
+            key: 1,
+            ref_key: "messageInputAtRef",
+            ref: messageInputAtRef,
+            onInsertAt: insertAt,
+            onOnAtListOpen: onAtListOpen
+          }, null, 512)) : Vue.createCommentVNode("", true)
+        ], 2),
+        Vue.createVNode(index$1.default)
+      ]);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/Chat/ChatKit/components/TUIChat/message-input/message-input-at/index.d.ts

@@ -0,0 +1,19 @@
+import { SuggestionProps, SuggestionKeyDownProps } from '@tiptap/suggestion';
+
+declare const MessageInputAtSuggestion: () => {
+    allowedPrefixes: null;
+    items: (props: {
+        query: string;
+    }) => any[] | undefined;
+    render: () => {
+        onStart: (props: SuggestionProps<{
+            id?: string;
+            userID?: string;
+            isAll?: boolean;
+        }>) => void;
+        onUpdate(props: SuggestionProps<any>): void;
+        onKeyDown(props: SuggestionKeyDownProps): boolean | undefined;
+        onExit(): void;
+    };
+};
+export default MessageInputAtSuggestion;

package/lib/components/Chat/ChatKit/components/TUIChat/message-input/message-input-at/index.js

@@ -0,0 +1,161 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const TUIChatEngine = require("@tencentcloud/chat-uikit-engine");
+const universalApi = require("@tencentcloud/universal-api");
+const env = require("../../../../utils/env.js");
+let currentConversationID = "";
+let memberList = [];
+let allMemberList = [];
+let showMemberList = [];
+let selectedIndex = 0;
+let isGroup = false;
+let command;
+const all = {
+  userID: TUIChatEngine.TYPES.MSG_AT_ALL,
+  nick: "所有人",
+  isAll: true,
+  avatar: "https://web.sdk.qcloud.com/im/assets/images/at.svg"
+};
+TUIChatEngine.TUIStore.watch(TUIChatEngine.StoreName.CONV, {
+  currentConversationID: (id) => {
+    if (id !== currentConversationID) {
+      currentConversationID = id;
+      if (currentConversationID == null ? void 0 : currentConversationID.startsWith("GROUP")) {
+        isGroup = true;
+      } else {
+        isGroup = false;
+        memberList = [];
+        allMemberList = [];
+        showMemberList = [];
+      }
+    }
+  }
+});
+TUIChatEngine.TUIStore.watch(TUIChatEngine.StoreName.CUSTOM, {
+  memberList: (list) => {
+    if (isGroup && Array.isArray(list)) {
+      memberList = list;
+      allMemberList = [all, ...memberList];
+      showMemberList = allMemberList;
+    }
+  }
+});
+const MessageInputAtSuggestion = () => {
+  return {
+    allowedPrefixes: null,
+    items: (props) => {
+      if (!isGroup) {
+        return;
+      }
+      const queryResult = allMemberList == null ? void 0 : allMemberList.filter(
+        (item) => {
+          var _a, _b, _c, _d, _e, _f;
+          return ((_c = (_a = item == null ? void 0 : item.nick) == null ? void 0 : _a.toLowerCase()) == null ? void 0 : _c.startsWith((_b = props == null ? void 0 : props.query) == null ? void 0 : _b.toLowerCase())) || ((_f = (_d = item == null ? void 0 : item.userID) == null ? void 0 : _d.toLowerCase()) == null ? void 0 : _f.startsWith((_e = props == null ? void 0 : props.query) == null ? void 0 : _e.toLowerCase()));
+        }
+      );
+      showMemberList = (queryResult == null ? void 0 : queryResult.length) ? queryResult : allMemberList;
+      universalApi.TUIGlobal.setShowMemberList(showMemberList);
+      return showMemberList;
+    },
+    render: () => {
+      return {
+        onStart: (props) => {
+          if (!isGroup) {
+            return;
+          }
+          universalApi.TUIGlobal.toggleAtList(true);
+          if (!(props == null ? void 0 : props.clientRect)) {
+            return;
+          }
+          const rect = props == null ? void 0 : props.clientRect();
+          if ((rect == null ? void 0 : rect.left) && (rect == null ? void 0 : rect.top) && !env.isH5) {
+            universalApi.TUIGlobal.handleAtListPosition({
+              left: rect == null ? void 0 : rect.left,
+              top: rect == null ? void 0 : rect.top
+            });
+          }
+          command = props.command;
+        },
+        onUpdate(props) {
+          if (!isGroup) {
+            return;
+          }
+          if (!(props == null ? void 0 : props.clientRect)) {
+            return;
+          }
+          const rect = props == null ? void 0 : props.clientRect();
+          if ((rect == null ? void 0 : rect.left) && (rect == null ? void 0 : rect.top) && !env.isH5) {
+            universalApi.TUIGlobal.handleAtListPosition({
+              left: rect == null ? void 0 : rect.left,
+              top: rect == null ? void 0 : rect.top
+            });
+          }
+        },
+        onKeyDown(props) {
+          var _a, _b;
+          if (!isGroup) {
+            return;
+          }
+          if (props.event.key === "Enter") {
+            (_a = props.event) == null ? void 0 : _a.stopPropagation();
+            (_b = props.event) == null ? void 0 : _b.preventDefault();
+          }
+          if (props.event.key === "Escape") {
+            universalApi.TUIGlobal.toggleAtList(false);
+            showMemberList = allMemberList;
+            return true;
+          }
+          if ((props == null ? void 0 : props.event.key) === "ArrowUp") {
+            upHandler();
+            return true;
+          }
+          if ((props == null ? void 0 : props.event.key) === "ArrowDown") {
+            downHandler();
+            return true;
+          }
+          if ((props == null ? void 0 : props.event.key) === "Enter") {
+            enterHandler();
+            return true;
+          }
+          return false;
+        },
+        onExit() {
+          if (!isGroup) {
+            return;
+          }
+          universalApi.TUIGlobal.toggleAtList(false);
+          showMemberList = allMemberList;
+          universalApi.TUIGlobal.handleAtListPosition({
+            left: 0,
+            top: 0
+          });
+        }
+      };
+    }
+  };
+};
+const upHandler = () => {
+  if (!(showMemberList == null ? void 0 : showMemberList.length)) return;
+  selectedIndex = (selectedIndex + (showMemberList == null ? void 0 : showMemberList.length) - 1) % (showMemberList == null ? void 0 : showMemberList.length);
+  universalApi.TUIGlobal.setCurrentSelectIndex(selectedIndex);
+};
+const downHandler = () => {
+  if (!(showMemberList == null ? void 0 : showMemberList.length)) return;
+  selectedIndex = (selectedIndex + 1) % (showMemberList == null ? void 0 : showMemberList.length);
+  universalApi.TUIGlobal.setCurrentSelectIndex(selectedIndex);
+};
+const enterHandler = () => {
+  selectItem(selectedIndex);
+};
+const selectItem = (index) => {
+  if (!(showMemberList == null ? void 0 : showMemberList.length)) return;
+  const item = showMemberList[index];
+  if (item) {
+    command && command({
+      id: item == null ? void 0 : item.userID,
+      label: (item == null ? void 0 : item.nick) || (item == null ? void 0 : item.userID)
+    });
+  }
+};
+universalApi.TUIGlobal.selectItem = selectItem;
+exports.default = MessageInputAtSuggestion;

package/lib/components/Chat/ChatKit/components/TUIChat/message-input/message-input-at/index.vue.d.ts

@@ -0,0 +1,10 @@
+declare const _default: import('vue').DefineComponent<{}, {
+    toggleAtList: (show: boolean) => void;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    insertAt: (...args: any[]) => void;
+    onAtListOpen: (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{
+    onInsertAt?: ((...args: any[]) => any) | undefined;
+    onOnAtListOpen?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;