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

package/dist/states/LoginState.js

@@ -1,54 +1,64 @@
-import { TUILogin } from "@tencentcloud/tui-core";
-import TUIRoomEngine from "@tencentcloud/tuiroom-engine-js";
 import { ref } from "vue";
+import { TUILogin } from "@tencentcloud/tui-core";
 const loginUserInfo = ref(null);
 async function login(options) {
   if (!options.userId || !options.userSig || !options.sdkAppId) {
-    throw new Error("login 参数错误");
+    throw new Error("[loginState login] params error");
   }
-  await TUILogin.login({
-    SDKAppID: options.sdkAppId,
-    userID: options.userId,
-    userSig: options.userSig,
-    // @ts-ignore
-    testEnv: options.testEnv
-  });
-  const { chat } = TUILogin.getContext();
-  await TUIRoomEngine.login({
-    userId: options.userId,
-    userSig: options.userSig,
-    sdkAppId: options.sdkAppId,
-    tim: chat
-  });
-  const result = await chat.getUserProfile({ userIDList: [options.userId] });
-  const localUserInfo = result.data[0];
-  loginUserInfo.value = {
-    userId: localUserInfo.userID,
-    userName: localUserInfo.nick,
-    avatarUrl: localUserInfo.avatar,
-    customInfo: localUserInfo.profileCustomField
+  const { userId, userSig, sdkAppId, ...restOptions } = options;
+  const loginParams = {
+    SDKAppID: sdkAppId,
+    userID: userId,
+    userSig,
+    ...restOptions
   };
+  try {
+    await TUILogin.login(loginParams);
+  } catch (error) {
+    console.error("[loginState login] error", error);
+    throw error;
+  }
 }
 async function setSelfInfo(options) {
-  const { avatarUrl, userName, customInfo } = await TUIRoomEngine.getSelfInfo();
-  const info = {
-    userName: options.userName || userName,
-    avatarUrl: options.avatarUrl || avatarUrl,
-    customInfo: options.customInfo || customInfo
-  };
-  await TUIRoomEngine.setSelfInfo(info);
-  const currentSelfInfo = await TUIRoomEngine.getSelfInfo();
-  if (loginUserInfo.value) {
-    loginUserInfo.value = Object.assign(loginUserInfo.value, {
-      userName: currentSelfInfo.userName,
-      avatarUrl: currentSelfInfo.avatarUrl,
-      customInfo: currentSelfInfo.customInfo
-    });
+  const currentLoginUserInfo = loginUserInfo.value || {};
+  const { chat } = TUILogin.getContext();
+  if (!chat) {
+    throw Error("[loginState setSelfInfo] not login");
+  } else {
+    const profileCustomField = [];
+    if (options.customInfo) {
+      Object.keys(options.customInfo).forEach((key) => {
+        var _a;
+        let customKey = key;
+        if (!key.includes("Tag_Profile_Custom")) {
+          customKey = `Tag_Profile_Custom_${key}`;
+        }
+        profileCustomField.push({
+          key: customKey,
+          value: (_a = options.customInfo) == null ? void 0 : _a[key]
+        });
+      });
+    }
+    try {
+      const res = await chat.updateMyProfile({
+        nick: options.userName,
+        avatar: options.avatarUrl,
+        profileCustomField
+      });
+      loginUserInfo.value = {
+        ...currentLoginUserInfo,
+        ...options
+      };
+      return res;
+    } catch (error) {
+      console.error("[loginState setSelfInfo] error", error);
+      throw error;
+    }
   }
 }
 async function logout() {
-  await TUIRoomEngine.logout();
   loginUserInfo.value = null;
+  TUILogin.logout();
 }
 function useLoginState() {
   return {

package/dist/states/MessageActionState/MessageActionState.js

@@ -1,8 +1,7 @@
 import { ref } from "vue";
 import { TUIStore, StoreName, TUIChatService } from "@tencentcloud/chat-uikit-engine";
-import "../../utils/env.js";
-import { copyTextToClipboard } from "../../utils/copyText.js";
 import { transformTextWithEmojiKeyToName } from "../../utils/emoji.js";
+import { copyTextToClipboard } from "../../utils/copyText.js";
 const forwardMessageIDListRef = ref([]);
 const isForwardMessageSelectionDoneRef = ref(false);
 const forwardConversationIDListRef = ref([]);

package/dist/states/MessageInputState/MessageInputState.d.ts

@@ -1,4 +1,5 @@
 import { Ref } from 'vue';
+import { MessageContentType, InputContent } from './type';
 import { Editor } from '@tiptap/vue-3';
 
 /**
@@ -10,37 +11,19 @@ import { Editor } from '@tiptap/vue-3';
  * - Content manipulation (insertion, updating, etc.)
  * - Message sending functionality
  */
-declare enum MessageContentType {
-    TEXT = "text",
-    IMAGE = "image",
-    VIDEO = "video",
-    FILE = "file",
-    MENTION = "mention",
-    EMOJI = "emoji"
+interface MessageInputState {
+    inputRawValue: Ref<string | InputContent[]>;
+    isPeerTyping: Ref<boolean>;
 }
-type ContentTypeMap = {
-    [key in MessageContentType]: key extends MessageContentType.TEXT ? string : key extends MessageContentType.IMAGE ? File : key extends MessageContentType.VIDEO ? File : key extends MessageContentType.FILE ? File : key extends MessageContentType.MENTION ? string[] : key extends MessageContentType.EMOJI ? {
-        url: string;
-        key: string;
-        text: string;
-    } : never;
-};
-interface IInputContent<T extends MessageContentType = MessageContentType> {
-    type: T;
-    content: ContentTypeMap[T];
-}
-interface IInputState {
-    inputRawValue: Ref<string | IInputContent[]>;
-}
-interface IInputAction {
-    updateRawValue: (value: string | IInputContent[]) => void;
+interface MessageInputAction {
+    updateRawValue: (value: string | InputContent[]) => void;
     setEditorInstance: (editor: Editor | null) => void;
-    setContent: (value: string | IInputContent[]) => void;
-    insertContent: (value: string | IInputContent[], focus?: boolean) => void;
+    setContent: (value: string | InputContent[]) => void;
+    insertContent: (value: string | InputContent[], focus?: boolean) => void;
     focusEditor: () => void;
     blurEditor: () => void;
-    sendMessage: (msg?: string | IInputContent[]) => void;
+    sendMessage: (msg?: string | InputContent[]) => void;
 }
-declare function useMessageInputState(): IInputState & IInputAction;
+declare function useMessageInputState(): MessageInputState & MessageInputAction;
 export { useMessageInputState, MessageContentType };
-export type { IInputContent };
+export type { InputContent };

package/dist/states/MessageInputState/MessageInputState.js

@@ -1,180 +1,122 @@
 import { ref } from "vue";
-import { TUIChatService } from "@tencentcloud/chat-uikit-engine";
-import "../../utils/env.js";
+import { TUIStore, StoreName, TUIChatService } from "@tencentcloud/chat-uikit-engine";
+import { MessageContentType } from "./type.js";
+import { convertInputContentToEditorNode } from "./utils.js";
 import { transformTextWithEmojiNameToKey } from "../../utils/emoji.js";
-var MessageContentType = /* @__PURE__ */ ((MessageContentType2) => {
-  MessageContentType2["TEXT"] = "text";
-  MessageContentType2["IMAGE"] = "image";
-  MessageContentType2["VIDEO"] = "video";
-  MessageContentType2["FILE"] = "file";
-  MessageContentType2["MENTION"] = "mention";
-  MessageContentType2["EMOJI"] = "emoji";
-  return MessageContentType2;
-})(MessageContentType || {});
-function convertInputContentToEditorNode(item) {
-  switch (item.type) {
-    case "text":
-      return {
-        type: "text",
-        text: item.content
-      };
-    case "image": {
-      const imageFile = item.content;
-      const imageUrl = URL.createObjectURL(imageFile);
-      return {
-        type: "image",
-        attrs: {
-          src: imageUrl,
-          alt: imageFile == null ? void 0 : imageFile.name,
-          fileData: imageFile,
-          title: imageFile == null ? void 0 : imageFile.name
-        }
-      };
-    }
-    case "emoji": {
-      const emoticonContent = item.content;
-      return {
-        type: "emoji",
-        attrs: {
-          src: emoticonContent.url,
-          alt: emoticonContent.key,
-          title: emoticonContent.text
-        }
-      };
-    }
-    default:
-      return {
-        type: "text",
-        text: String(item.content)
-      };
-  }
-}
 const editor = ref(null);
 const inputRawValue = ref("");
-function useMessageInputState() {
-  const updateRawValue = (value) => {
-    if (typeof value !== "string" && !Array.isArray(value)) {
-      console.warn("Invalid input type for updateRawValue");
-      return;
-    }
-    inputRawValue.value = typeof value === "string" ? value.trim() : (value == null ? void 0 : value.length) > 0 ? value : "";
-  };
-  const setEditorInstance = (instance) => {
-    if (editor.value) {
-      editor.value.destroy();
-    }
-    editor.value = instance;
-  };
-  const setContent = (content) => {
-    if (!editor.value) {
-      return;
-    }
-    if (typeof content === "string") {
-      editor.value.commands.setContent(content, true);
-    } else {
-      const editorContent = content.map(convertInputContentToEditorNode);
-      editor.value.commands.setContent(editorContent, true);
-    }
+const isPeerTyping = ref(false);
+const updateRawValue = (value) => {
+  if (typeof value !== "string" && !Array.isArray(value)) {
+    console.warn("Invalid input type for updateRawValue");
+    return;
+  }
+  if (typeof value === "string") {
+    inputRawValue.value = value.trim();
+  } else {
+    inputRawValue.value = (value == null ? void 0 : value.length) > 0 ? value : "";
+  }
+  TUIChatService.enterTypingState();
+  setTimeout(() => {
+    TUIChatService.leaveTypingState();
+  }, 3e3);
+};
+const setEditorInstance = (instance) => {
+  if (editor.value) {
+    editor.value.destroy();
+  }
+  editor.value = instance;
+};
+const setContent = (content) => {
+  if (!editor.value) {
+    return;
+  }
+  if (typeof content === "string") {
+    editor.value.commands.setContent(content, true);
+  } else {
+    const editorContent = content.map(convertInputContentToEditorNode);
+    editor.value.commands.setContent(editorContent, true);
+  }
+  editor.value.commands.focus();
+};
+const insertContent = (content, focus = true) => {
+  if (!editor.value) {
+    return;
+  }
+  if (typeof content === "string") {
+    editor.value.commands.insertContent(content);
+  } else {
+    const editorContent = content.map(convertInputContentToEditorNode);
+    editor.value.commands.insertContent(editorContent);
+  }
+  if (focus) {
     editor.value.commands.focus();
-  };
-  const insertContent = (content, focus = true) => {
-    if (!editor.value) {
-      return;
-    }
-    if (typeof content === "string") {
-      editor.value.commands.insertContent(content);
-    } else {
-      const editorContent = content.map(convertInputContentToEditorNode);
-      editor.value.commands.insertContent(editorContent);
-    }
-    if (focus) {
-      editor.value.commands.focus();
+  }
+};
+const focusEditor = () => {
+  var _a;
+  (_a = editor.value) == null ? void 0 : _a.commands.focus();
+};
+const blurEditor = () => {
+  var _a;
+  (_a = editor.value) == null ? void 0 : _a.commands.blur();
+};
+const sendMessage = async (msg) => {
+  const messageToSend = msg ?? inputRawValue.value;
+  if (!messageToSend) {
+    return;
+  }
+  if (typeof messageToSend === "string") {
+    TUIChatService.sendTextMessage({ payload: { text: transformTextWithEmojiNameToKey(messageToSend) } });
+    return;
+  }
+  let mergedText = "";
+  const sendAccumulatedText = async () => {
+    if (mergedText) {
+      await TUIChatService.sendTextMessage({ payload: { text: transformTextWithEmojiNameToKey(mergedText) } });
+      mergedText = "";
     }
   };
-  const focusEditor = () => {
-    var _a;
-    (_a = editor.value) == null ? void 0 : _a.commands.focus();
-  };
-  const blurEditor = () => {
-    var _a;
-    (_a = editor.value) == null ? void 0 : _a.commands.blur();
+  const messageProcessors = {
+    [MessageContentType.TEXT]: (content) => content,
+    [MessageContentType.IMAGE]: async (content) => {
+      await sendAccumulatedText();
+      await TUIChatService.sendImageMessage({ payload: { file: content } });
+      return "";
+    },
+    [MessageContentType.VIDEO]: async (content) => {
+      await sendAccumulatedText();
+      await TUIChatService.sendVideoMessage({ payload: { file: content } });
+      return "";
+    },
+    [MessageContentType.FILE]: async (content) => {
+      await sendAccumulatedText();
+      await TUIChatService.sendFileMessage({ payload: { file: content } });
+      return "";
+    },
+    [MessageContentType.MENTION]: async () => {
+      await sendAccumulatedText();
+      console.warn("Mention feature not implemented yet");
+      return "";
+    },
+    [MessageContentType.EMOJI]: (content) => content.key
   };
-  const sendMessage = (msg) => {
-    const messageToSend = msg ?? inputRawValue.value;
-    if (!messageToSend) {
-      return;
+  for (const item of messageToSend) {
+    if (!item.type || !messageProcessors[item.type]) {
+      throw new Error(`Invalid message type: ${item.type}`);
     }
-    if (typeof messageToSend === "string") {
-      TUIChatService.sendTextMessage({ payload: { text: transformTextWithEmojiNameToKey(messageToSend) } });
-      return;
+    const processor = messageProcessors[item.type];
+    const result = await processor(item.content);
+    if ([MessageContentType.TEXT, MessageContentType.EMOJI].includes(item.type)) {
+      mergedText += result;
     }
-    let mergedText = "";
-    const sendAccumulatedText = () => {
-      if (mergedText) {
-        TUIChatService.sendTextMessage({ payload: { text: transformTextWithEmojiNameToKey(mergedText) } });
-        mergedText = "";
-      }
-    };
-    const messageProcessors = {
-      [
-        "text"
-        /* TEXT */
-      ]: (content) => content,
-      [
-        "image"
-        /* IMAGE */
-      ]: (content) => {
-        sendAccumulatedText();
-        TUIChatService.sendImageMessage({ payload: { file: content } });
-        return "";
-      },
-      [
-        "video"
-        /* VIDEO */
-      ]: (content) => {
-        sendAccumulatedText();
-        TUIChatService.sendVideoMessage({ payload: { file: content } });
-        return "";
-      },
-      [
-        "file"
-        /* FILE */
-      ]: (content) => {
-        sendAccumulatedText();
-        TUIChatService.sendFileMessage({ payload: { file: content } });
-        return "";
-      },
-      [
-        "mention"
-        /* MENTION */
-      ]: () => {
-        sendAccumulatedText();
-        console.warn("Mention feature not implemented yet");
-        return "";
-      },
-      [
-        "emoji"
-        /* EMOJI */
-      ]: (content) => content.key
-    };
-    messageToSend.forEach((item) => {
-      if (!item.type || !messageProcessors[item.type]) {
-        throw new Error(`Invalid message type: ${item.type}`);
-      }
-      const processor = messageProcessors[item.type];
-      const result = processor(item.content);
-      if ([
-        "text",
-        "emoji"
-        /* EMOJI */
-      ].includes(item.type)) {
-        mergedText += result;
-      }
-    });
-    sendAccumulatedText();
-  };
+  }
+  await sendAccumulatedText();
+};
+function useMessageInputState() {
   return {
     inputRawValue,
+    isPeerTyping,
     updateRawValue,
     setEditorInstance,
     setContent,
@@ -184,6 +126,14 @@ function useMessageInputState() {
     sendMessage
   };
 }
+function initWatcher() {
+  TUIStore.watch(StoreName.CHAT, {
+    typingStatus: (typingStatus) => {
+      isPeerTyping.value = typingStatus;
+    }
+  });
+}
+initWatcher();
 export {
   MessageContentType,
   useMessageInputState

package/dist/states/MessageInputState/index.js

@@ -1,4 +1,5 @@
-import { MessageContentType, useMessageInputState } from "./MessageInputState.js";
+import { useMessageInputState } from "./MessageInputState.js";
+import { MessageContentType } from "./type.js";
 export {
   MessageContentType,
   useMessageInputState

package/dist/states/MessageInputState/type.d.ts

@@ -0,0 +1,21 @@
+declare enum MessageContentType {
+    TEXT = "text",
+    IMAGE = "image",
+    VIDEO = "video",
+    FILE = "file",
+    MENTION = "mention",
+    EMOJI = "emoji"
+}
+type ContentTypeMap = {
+    [key in MessageContentType]: key extends MessageContentType.TEXT ? string : key extends MessageContentType.IMAGE ? File : key extends MessageContentType.VIDEO ? File : key extends MessageContentType.FILE ? File : key extends MessageContentType.MENTION ? string[] : key extends MessageContentType.EMOJI ? {
+        url: string;
+        key: string;
+        text: string;
+    } : never;
+};
+interface InputContent<T extends MessageContentType = MessageContentType> {
+    type: T;
+    content: ContentTypeMap[T];
+}
+export { MessageContentType, };
+export type { ContentTypeMap, InputContent, };

package/dist/states/MessageInputState/type.js

@@ -0,0 +1,12 @@
+var MessageContentType = /* @__PURE__ */ ((MessageContentType2) => {
+  MessageContentType2["TEXT"] = "text";
+  MessageContentType2["IMAGE"] = "image";
+  MessageContentType2["VIDEO"] = "video";
+  MessageContentType2["FILE"] = "file";
+  MessageContentType2["MENTION"] = "mention";
+  MessageContentType2["EMOJI"] = "emoji";
+  return MessageContentType2;
+})(MessageContentType || {});
+export {
+  MessageContentType
+};

package/dist/states/MessageInputState/utils.d.ts

@@ -0,0 +1,30 @@
+import { MessageContentType, InputContent } from './type';
+
+declare function convertInputContentToEditorNode(item: InputContent): {
+    type: string;
+    text: string | string[] | File | {
+        url: string;
+        key: string;
+        text: string;
+    };
+    attrs?: undefined;
+} | {
+    type: MessageContentType;
+    attrs: {
+        src: string;
+        alt: string;
+        fileData: File;
+        title: string;
+    };
+    text?: undefined;
+} | {
+    type: MessageContentType;
+    attrs: {
+        src: string;
+        alt: string;
+        title: string;
+        fileData?: undefined;
+    };
+    text?: undefined;
+};
+export { convertInputContentToEditorNode, };

package/dist/states/MessageInputState/utils.js

@@ -0,0 +1,42 @@
+import { MessageContentType } from "./type.js";
+function convertInputContentToEditorNode(item) {
+  switch (item.type) {
+    case MessageContentType.TEXT:
+      return {
+        type: "text",
+        text: item.content
+      };
+    case MessageContentType.IMAGE: {
+      const imageFile = item.content;
+      const imageUrl = URL.createObjectURL(imageFile);
+      return {
+        type: MessageContentType.IMAGE,
+        attrs: {
+          src: imageUrl,
+          alt: imageFile == null ? void 0 : imageFile.name,
+          fileData: imageFile,
+          title: imageFile == null ? void 0 : imageFile.name
+        }
+      };
+    }
+    case MessageContentType.EMOJI: {
+      const emoticonContent = item.content;
+      return {
+        type: MessageContentType.EMOJI,
+        attrs: {
+          src: emoticonContent.url,
+          alt: emoticonContent.key,
+          title: emoticonContent.text
+        }
+      };
+    }
+    default:
+      return {
+        type: "text",
+        text: String(item.content)
+      };
+  }
+}
+export {
+  convertInputContentToEditorNode
+};

package/dist/states/RoomState.js

@@ -1,9 +1,11 @@
 import { ref } from "vue";
-import { TUISeatMode } from "../types/types.js";
-import { LocalRoomStatus } from "../types/room.js";
 import { useRoomEngine } from "../hooks/useRoomEngine.js";
 import TUIRoomEngine, { TUIRoomEvents, TUIConferenceListManagerEvents, TUIConferenceStatus, TUIRoomType } from "@tencentcloud/tuiroom-engine-js";
 import { useLoginState } from "./LoginState.js";
+import RTCLoginServer from "../rtc/server.js";
+import { LocalRoomStatus } from "../types/room.js";
+import { TUISeatMode } from "../types/types.js";
+const LoginServer = RTCLoginServer.getInstance();
 const roomEngine = useRoomEngine();
 const { loginUserInfo } = useLoginState();
 const findRoomIndex = (roomId) => {
@@ -76,7 +78,7 @@ const startRoom = async ({
   isMessageDisableForAllUser = false
 }) => {
   var _a;
-  if (!loginUserInfo.value) {
+  if (!LoginServer.isLogin.value) {
     console.error("未找到登录用户信息，无法创建房间");
     return false;
   }