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

package/dist/components/MessageList/Message/GroupTipMessage/index.js

@@ -1,4 +1,31 @@
-import { _ } from "../../../../GroupTipMessage.vue_vue_type_style_index_0_lang-BqyPcZln.js";
+import { defineComponent, createElementBlock, openBlock, normalizeClass, unref, toDisplayString } from "vue";
+import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
+import { c as cs } from "../../../../index-BF6QB9jF.js";
+import { resolveGroupTipMessage } from "./resolveGroupTipMessage.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "GroupTipMessage",
+  props: {
+    message: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const { t } = useUIKit();
+    const messageContent = props.message.getMessageContent();
+    const renderText = () => {
+      switch (messageContent.businessID) {
+        case "group_create":
+          return `${messageContent.showName || ""} ${t("MessageList.create_group")}`;
+        default:
+          return resolveGroupTipMessage(props.message).text;
+      }
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(unref(cs)("group-tip-message"))
+      }, toDisplayString(renderText()), 3);
+    };
+  }
+});
 export {
-  _ as GroupTipMessage
+  _sfc_main as GroupTipMessage
 };

package/dist/components/MessageList/Message/GroupTipMessage/resolveGroupTipMessage.d.ts

@@ -0,0 +1,6 @@
+import { IMessageModel as MessageModel } from '@tencentcloud/chat-uikit-engine';
+
+declare function resolveGroupTipMessage(message: MessageModel): {
+    text: string;
+};
+export { resolveGroupTipMessage, };

package/dist/components/MessageList/Message/GroupTipMessage/resolveGroupTipMessage.js

@@ -0,0 +1,85 @@
+import { TUIChatEngine } from "@tencentcloud/chat-uikit-engine";
+import { i18next } from "@tencentcloud/uikit-base-component-vue3";
+function substringByLength(str, len = 12) {
+  return str.length > len ? `${str.slice(0, len)}...` : str;
+}
+function handleGroupProfileUpdated(message) {
+  const { t } = i18next;
+  const { nick, payload } = message;
+  const { newGroupProfile, memberList, operatorID } = payload;
+  let text = "";
+  const showName = nick || operatorID;
+  const key = Object.keys(newGroupProfile)[0];
+  switch (key) {
+    case "muteAllMembers":
+      if (newGroupProfile[key]) {
+        text = `${t("MessageList.administrator")} ${showName} ${t("MessageList.enabled_mute_all_members")}`;
+      } else {
+        text = `${t("MessageList.administrator")} ${showName} ${t("MessageList.disabled_mute_all_members")}`;
+      }
+      break;
+    case "ownerID":
+      text = `${memberList[0].nick || memberList[0].userID} ${t("MessageList.became_new_group_owner")}`;
+      break;
+    case "groupName":
+      text = `${showName} ${t("MessageList.changed_group_name_to")} ${newGroupProfile[key]}`;
+      break;
+    case "notification":
+      text = `${showName} ${t("MessageList.published_new_announcement")}`;
+      break;
+  }
+  return text;
+}
+function resolveGroupTipMessage(message) {
+  var _a, _b, _c, _d, _e, _f;
+  const ret = {
+    text: ""
+  };
+  const { t } = i18next;
+  let showName = (message == null ? void 0 : message.nick) || ((_b = (_a = message == null ? void 0 : message.payload) == null ? void 0 : _a.userIDList) == null ? void 0 : _b.join(","));
+  if (((_d = (_c = message == null ? void 0 : message.payload) == null ? void 0 : _c.memberList) == null ? void 0 : _d.length) > 0) {
+    showName = "";
+    (_f = (_e = message == null ? void 0 : message.payload) == null ? void 0 : _e.memberList) == null ? void 0 : _f.map((user) => {
+      const _showName = (user == null ? void 0 : user.nick) || (user == null ? void 0 : user.userID);
+      showName += `${substringByLength(_showName)},`;
+      return user;
+    });
+    showName = showName == null ? void 0 : showName.slice(0, -1);
+  }
+  switch (message.payload.operationType) {
+    case TUIChatEngine.TYPES.GRP_TIP_MBR_JOIN:
+      ret.text = `${showName} ${t("MessageList.joined_group")}`;
+      break;
+    case TUIChatEngine.TYPES.GRP_TIP_MBR_QUIT:
+      ret.text = `${t("MessageList.group_member")}: ${showName} ${t("MessageList.left_group")}`;
+      break;
+    case TUIChatEngine.TYPES.GRP_TIP_MBR_KICKED_OUT:
+      ret.text = `${t("MessageList.group_member")}: ${showName} ${t("MessageList.was")} ${t("MessageList.kicked_out_of_group")}`;
+      break;
+    case TUIChatEngine.TYPES.GRP_TIP_MBR_SET_ADMIN:
+      ret.text = `${t("MessageList.group_member")}: ${showName} ${t("MessageList.became_admin")}`;
+      break;
+    case TUIChatEngine.TYPES.GRP_TIP_MBR_CANCELED_ADMIN:
+      ret.text = `${t("MessageList.group_member")}: ${showName} ${t("MessageList.admin_privileges_revoked")}`;
+      break;
+    case TUIChatEngine.TYPES.GRP_TIP_GRP_PROFILE_UPDATED:
+      ret.text = handleGroupProfileUpdated(message);
+      break;
+    case TUIChatEngine.TYPES.GRP_TIP_MBR_PROFILE_UPDATED:
+      message.payload.memberList.forEach((member) => {
+        if (member.muteTime > 0) {
+          ret.text = `${t("MessageList.group_member")}: ${showName} ${t("MessageList.was_muted")}`;
+        } else {
+          ret.text = `${t("MessageList.group_member")}: ${showName} ${t("MessageList.was_unmuted")}`;
+        }
+      });
+      break;
+    default:
+      ret.text = `[${t("MessageList.group_tip_message")}]`;
+      break;
+  }
+  return ret;
+}
+export {
+  resolveGroupTipMessage
+};

package/dist/components/MessageList/Message/ImageMessage/ImageMessage.js

@@ -169,10 +169,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         })
       }, [
         loadingState.value === "loading" ? (openBlock(), createElementBlock("div", _hoisted_1)) : createCommentVNode("", true),
-        loadingState.value === "error" ? (openBlock(), createElementBlock("div", _hoisted_2, _cache[0] || (_cache[0] = [
+        loadingState.value === "error" ? (openBlock(), createElementBlock("div", _hoisted_2, [..._cache[0] || (_cache[0] = [
           createElementVNode("div", { class: "image-error__icon" }, null, -1),
           createElementVNode("span", { class: "image-error__text" }, "Load failed", -1)
-        ]))) : createCommentVNode("", true),
+        ])])) : createCommentVNode("", true),
         createElementVNode("img", {
           ref_key: "imageRef",
           ref: imageRef,

package/dist/components/MessageList/Message/Message.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../../../Message.vue_vue_type_script_setup_true_lang-BV0PxtjX.js";
+import { Message as _sfc_main } from "./index.js";
 export {
   _sfc_main as default
 };

package/dist/components/MessageList/Message/MessageLayout/MessageActionDropdown/MessageActionDropdown.js

@@ -1,9 +1,9 @@
 import { ref, computed, provide, inject, defineComponent, watch, h, watchEffect, markRaw, toRefs, createBlock, openBlock, unref, withCtx, createVNode, renderSlot, normalizeProps, guardReactiveProps, onMounted, mergeDefaults, onUnmounted, mergeProps, nextTick, withModifiers, createElementBlock, Fragment, normalizeClass, renderList, normalizeStyle, createCommentVNode, resolveDynamicComponent, createElementVNode, toDisplayString } from "vue";
 import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
 import { c as cs } from "../../../../../index-BF6QB9jF.js";
-import { i as injectConfigProviderContext, l as refAutoReset, g as getActiveElement, j as unrefElement, S as Slot, a as useVModel, c as createContext, P as Primitive, m as createSharedComposable, n as useEventListener, b as useBodyScrollLock, u as useForwardExpose, F as FocusScope_default, D as DismissableLayer_default, d as useHideOthers, e as Presence_default, T as Teleport_default, f as useEmitAsProps } from "../../../../../Teleport-BnT1MTUO.js";
-import { d as PopperAnchor_default, P as PopperRoot_default, a as useFocusGuards, b as PopperContent_default, e as PopperContentPropsDefaultValue, c as useForwardPropsEmits } from "../../../../../PopperContent-C59duB_H.js";
-import { g as getOpenState, i as isPointerInGraceArea, a as isMouseEvent, F as FIRST_LAST_KEYS, L as LAST_KEYS, f as focusFirst$1, S as SELECTION_KEYS, I as ITEM_SELECT } from "../../../../../utils-CnPWv_hZ.js";
+import { i as injectConfigProviderContext, l as refAutoReset, g as getActiveElement, j as unrefElement, S as Slot, u as useVModel, c as createContext, e as Primitive, m as createSharedComposable, n as useEventListener, b as useBodyScrollLock, a as useForwardExpose, F as FocusScope_default, D as DismissableLayer_default, d as useHideOthers, P as Presence_default, T as Teleport_default, f as useEmitAsProps } from "../../../../../Teleport-CMvGsENT.js";
+import { d as PopperAnchor_default, P as PopperRoot_default, a as useFocusGuards, b as PopperContent_default, e as PopperContentPropsDefaultValue, c as useForwardPropsEmits } from "../../../../../PopperContent-DtL7HVWz.js";
+import { g as getOpenState, i as isPointerInGraceArea, a as isMouseEvent, F as FIRST_LAST_KEYS, f as focusFirst$1, L as LAST_KEYS, S as SELECTION_KEYS, I as ITEM_SELECT } from "../../../../../utils-KP1QpeUS.js";
 import { useMessageActions } from "../../../../../hooks/useMessageActions.js";
 import { _ as _export_sfc } from "../../../../../_plugin-vue_export-helper-1tPrXgE0.js";
 const ignoredElement = ["INPUT", "TEXTAREA"];
@@ -1674,7 +1674,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                           key: 0,
                           message: _ctx.message
                         }, null, 8, ["message"])) : action.visible ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                          createElementVNode("span", null, toDisplayString(unref(t)(`TUIChat.${action.label}`, { defaultValue: action.label })), 1),
+                          createElementVNode("span", null, toDisplayString(unref(t)(`MessageList.${action.label}`, { defaultValue: action.label })), 1),
                           action.icon ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
                             typeof action.icon === "string" ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(action.icon), 1)) : (openBlock(), createBlock(resolveDynamicComponent(action.icon), {
                               key: 1,
@@ -1698,7 +1698,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const MessageActionDropdown = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-617704f8"]]);
+const MessageActionDropdown = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2fb5c178"]]);
 export {
   MessageActionDropdown as default
 };

package/dist/components/MessageList/Message/MessageLayout/MessageActionDropdown/MessageActionDropdown.vue.d.ts

@@ -1,8 +1,8 @@
 import { MessageAction } from '../../../../../hooks/useMessageActions';
-import { IMessageModel } from '@tencentcloud/chat-uikit-engine';
+import { IMessageModel as MessageModel } from '@tencentcloud/chat-uikit-engine';
 
 interface IMessageActionDropdownProps {
-    message: IMessageModel;
+    message: MessageModel;
     messageActionList?: MessageAction[] | undefined;
 }
 declare function __VLS_template(): {
@@ -10,12 +10,12 @@ declare function __VLS_template(): {
 };
 declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<IMessageActionDropdownProps>, {
     messageActionList: undefined;
-    message: () => IMessageModel;
+    message: () => MessageModel;
 }>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<IMessageActionDropdownProps>, {
     messageActionList: undefined;
-    message: () => IMessageModel;
+    message: () => MessageModel;
 }>>> & Readonly<{}>, {
-    message: IMessageModel;
+    message: MessageModel;
     messageActionList: MessageAction[];
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;

package/dist/components/MessageList/Message/MessageLayout/MessageBubble/MessageBubble.js

@@ -1,8 +1,8 @@
 import { defineComponent, computed, createElementBlock, openBlock, normalizeClass, unref, createBlock, withCtx, renderSlot } from "vue";
-import ChatEngine from "@tencentcloud/chat-uikit-engine";
+import TUIChatEngine from "@tencentcloud/chat-uikit-engine";
 import { c as cs } from "../../../../../index-BF6QB9jF.js";
-import { useMessageListState } from "../../../../../states/MessageListState/MessageListState.js";
 import MessageActionDropdown from "../MessageActionDropdown/MessageActionDropdown.js";
+import { useMessageListState } from "../../../../../states/MessageListState/MessageListState.js";
 import { _ as _export_sfc } from "../../../../../_plugin-vue_export-helper-1tPrXgE0.js";
 const _hoisted_1 = {
   key: 0,
@@ -18,8 +18,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const MEDIA_MESSAGE_TYPE = [
-      ChatEngine.TYPES.MSG_IMAGE,
-      ChatEngine.TYPES.MSG_VIDEO
+      TUIChatEngine.TYPES.MSG_IMAGE,
+      TUIChatEngine.TYPES.MSG_VIDEO
     ];
     const props = __props;
     const { highlightMessageIDSet } = useMessageListState();

package/dist/components/MessageList/Message/MessageLayout/MessageLayout.js

@@ -1,14 +1,14 @@
 import { defineComponent, ref, computed, createElementBlock, openBlock, Fragment, createBlock, createCommentVNode, createVNode, unref, normalizeStyle, normalizeClass, withCtx, resolveDynamicComponent } from "vue";
-import ChatEngine from "@tencentcloud/chat-uikit-engine";
+import TUIChatEngine from "@tencentcloud/chat-uikit-engine";
 import { c as cs } from "../../../../index-BF6QB9jF.js";
-import View from "../../../../baseComp/View/View.js";
+import { View as _sfc_main$3 } from "../../../../baseComp/View/index.js";
 import Avatar from "../../../Avatar/Avatar.js";
 import ReadReceiptInfo from "../../ReadReceiptInfo/ReadReceiptInfo.js";
 import AudioMessage from "../AudioMessage/AudioMessage.js";
-import { _ as _sfc_main$2 } from "../../../../CustomMessage.vue_vue_type_script_setup_true_lang-CoK94Qxs.js";
+import { CustomMessage as _sfc_main$2 } from "../CustomMessage/index.js";
 import FaceMessage from "../FaceMessage/FaceMessage.js";
 import FileMessage from "../FileMessage/FileMessage.js";
-import { _ as _sfc_main$1 } from "../../../../GroupTipMessage.vue_vue_type_style_index_0_lang-BqyPcZln.js";
+import { GroupTipMessage as _sfc_main$1 } from "../GroupTipMessage/index.js";
 import ImageMessage from "../ImageMessage/ImageMessage.js";
 import LocationMessage from "../LocationMessage/LocationMessage.js";
 import MergerMessage from "../MergerMessage/MergerMessage.js";
@@ -37,16 +37,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const props = __props;
     const isReadReceiptInfoOpen = ref(false);
     const MessageComponentsFactory = {
-      [ChatEngine.TYPES.MSG_TEXT]: TextMessage,
-      [ChatEngine.TYPES.MSG_IMAGE]: ImageMessage,
-      [ChatEngine.TYPES.MSG_AUDIO]: AudioMessage,
-      [ChatEngine.TYPES.MSG_VIDEO]: VideoMessage,
-      [ChatEngine.TYPES.MSG_FILE]: FileMessage,
-      [ChatEngine.TYPES.MSG_FACE]: FaceMessage,
-      [ChatEngine.TYPES.MSG_LOCATION]: LocationMessage,
-      [ChatEngine.TYPES.MSG_MERGER]: MergerMessage,
-      [ChatEngine.TYPES.MSG_CUSTOM]: _sfc_main$2,
-      [ChatEngine.TYPES.MSG_GRP_TIP]: _sfc_main$1
+      [TUIChatEngine.TYPES.MSG_TEXT]: TextMessage,
+      [TUIChatEngine.TYPES.MSG_IMAGE]: ImageMessage,
+      [TUIChatEngine.TYPES.MSG_AUDIO]: AudioMessage,
+      [TUIChatEngine.TYPES.MSG_VIDEO]: VideoMessage,
+      [TUIChatEngine.TYPES.MSG_FILE]: FileMessage,
+      [TUIChatEngine.TYPES.MSG_FACE]: FaceMessage,
+      [TUIChatEngine.TYPES.MSG_LOCATION]: LocationMessage,
+      [TUIChatEngine.TYPES.MSG_MERGER]: MergerMessage,
+      [TUIChatEngine.TYPES.MSG_CUSTOM]: _sfc_main$2,
+      [TUIChatEngine.TYPES.MSG_GRP_TIP]: _sfc_main$1
     };
     const MessageComponent = computed(() => MessageComponentsFactory[props.message.type]);
     const isMessageOwner = computed(() => props.message.flow === "out");
@@ -73,10 +73,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           key: 0,
           class: "message-recalled",
           message: _ctx.message
-        }, null, 8, ["message"])) : _ctx.message.type === unref(ChatEngine).TYPES.MSG_GRP_TIP || _ctx.message.type === unref(ChatEngine).TYPES.MSG_CUSTOM && _ctx.message.getMessageContent().businessID === "group_create" ? (openBlock(), createBlock(unref(_sfc_main$1), {
+        }, null, 8, ["message"])) : _ctx.message.type === unref(TUIChatEngine).TYPES.MSG_GRP_TIP || _ctx.message.type === unref(TUIChatEngine).TYPES.MSG_CUSTOM && _ctx.message.getMessageContent().businessID === "group_create" ? (openBlock(), createBlock(unref(_sfc_main$1), {
           key: 1,
           message: _ctx.message
-        }, null, 8, ["message"])) : MessageComponent.value ? (openBlock(), createBlock(unref(View), {
+        }, null, 8, ["message"])) : MessageComponent.value ? (openBlock(), createBlock(unref(_sfc_main$3), {
           key: 2,
           "data-message-id": _ctx.message.ID,
           class: normalizeClass(unref(layoutClasses)),
@@ -88,7 +88,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               class: normalizeClass(unref(cs)(unref(avatarClasses))),
               src: _ctx.message.avatar
             }, null, 8, ["class", "src"])) : createCommentVNode("", true),
-            createVNode(unref(View), {
+            createVNode(unref(_sfc_main$3), {
               class: normalizeClass(unref(cs)(unref(wrapperClasses)))
             }, {
               default: withCtx(() => [
@@ -108,12 +108,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   key: 0,
                   class: normalizeClass(unref(metaClasses)),
                   status: _ctx.message.status,
+                  flow: _ctx.message.flow,
                   timestamp: _ctx.message.time * 1e3,
                   "need-read-receipt": _ctx.message.needReadReceipt,
                   "read-receipt-info": _ctx.message.readReceiptInfo,
-                  "is-group": _ctx.message.conversationType === unref(ChatEngine).TYPES.CONV_GROUP,
+                  "is-group": _ctx.message.conversationType === unref(TUIChatEngine).TYPES.CONV_GROUP,
                   onOnReadReceiptTextClick: handleReadReceiptOpen
-                }, null, 8, ["class", "status", "timestamp", "need-read-receipt", "read-receipt-info", "is-group"])) : createCommentVNode("", true)
+                }, null, 8, ["class", "status", "flow", "timestamp", "need-read-receipt", "read-receipt-info", "is-group"])) : createCommentVNode("", true)
               ]),
               _: 1
             }, 8, ["class"])
@@ -132,7 +133,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const MessageLayout = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-33bc408a"]]);
+const MessageLayout = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9e509377"]]);
 export {
   MessageLayout as default
 };

package/dist/components/MessageList/Message/MessageLayout/MessageMeta/MessageMeta.js

@@ -1,64 +1,50 @@
-import { defineComponent, computed, createBlock, openBlock, unref, normalizeStyle, normalizeClass, withCtx, createElementBlock, createCommentVNode, Fragment, toDisplayString } from "vue";
+import { defineComponent, useCssModule, computed, createBlock, openBlock, unref, normalizeClass, withCtx, createElementBlock, createCommentVNode, Fragment, toDisplayString } from "vue";
 import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
-import { c as cs } from "../../../../../index-BF6QB9jF.js";
-import View from "../../../../../baseComp/View/View.js";
+import { View as _sfc_main$1 } from "../../../../../baseComp/View/index.js";
 import { getTimeStampAuto } from "../../../../../utils/time.js";
 import MessageStatusIcon from "./MessageStatusIcon.js";
 import { _ as _export_sfc } from "../../../../../_plugin-vue_export-helper-1tPrXgE0.js";
-const _hoisted_1 = {
-  key: 0,
-  class: "message-meta__read-status"
-};
-const _hoisted_2 = {
-  key: 2,
-  class: "message-meta__group-all-read"
-};
-const _hoisted_3 = {
-  key: 2,
-  class: "message-meta__time"
-};
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "MessageMeta",
   props: {
     isGroup: { type: Boolean },
     timestamp: { default: 0 },
+    flow: { default: "in" },
     needReadReceipt: { type: Boolean, default: false },
     readReceiptInfo: { default: void 0 },
-    status: { default: void 0 },
-    class: { default: void 0 },
-    style: { default: void 0 }
+    status: { default: void 0 }
   },
   emits: ["onReadReceiptTextClick"],
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
     const { t } = useUIKit();
+    const classes = useCssModule();
     const displayTime = computed(() => getTimeStampAuto(props.timestamp));
     const handleGroupUnreadClick = () => {
       emits("onReadReceiptTextClick");
     };
-    const shouldShowStatusIcon = computed(() => !props.needReadReceipt || props.status === "unSend" || props.status === "fail");
+    const shouldShowStatusIcon = computed(() => props.flow === "out" && (!props.needReadReceipt || props.status === "unSend" || props.status === "fail"));
     const readReceiptText = computed(() => {
-      if (!props.needReadReceipt || props.status !== "success" || !props.readReceiptInfo) {
+      if (!props.needReadReceipt || props.status !== "success" || !props.readReceiptInfo || props.flow === "in") {
         return "";
       }
       if (props.isGroup) {
         if (props.readReceiptInfo.unreadCount > 0) {
-          return `${props.readReceiptInfo.unreadCount} ${t("TUIChat.UNREAD")} ·`;
+          return `${props.readReceiptInfo.unreadCount} ${t("MessageList.unread")} ·`;
         }
-        return `${t("TUIChat.ALL_READ")} ·`;
+        return `${t("MessageList.all_read")} ·`;
       }
       if (props.readReceiptInfo.isPeerRead) {
-        return `${t("TUIChat.READ")} ·`;
+        return `${t("MessageList.read")} ·`;
       }
-      return `${t("TUIChat.UNREAD")} ·`;
+      return `${t("MessageList.unread")} ·`;
     });
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(View), {
-        class: normalizeClass(unref(cs)("message-meta", props.class)),
+      return openBlock(), createBlock(unref(_sfc_main$1), {
+        class: normalizeClass(unref(classes)["message-meta"]),
         dir: "row",
-        align: "center",
-        style: normalizeStyle(props.style)
+        align: "center"
       }, {
         default: withCtx(() => [
           shouldShowStatusIcon.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
@@ -66,21 +52,40 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               key: 0,
               status: props.status
             }, null, 8, ["status"])) : createCommentVNode("", true)
-          ], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-            readReceiptText.value && !props.isGroup ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(readReceiptText.value), 1)) : readReceiptText.value && props.isGroup && props.readReceiptInfo && props.readReceiptInfo.unreadCount > 0 ? (openBlock(), createElementBlock("span", {
+          ], 64)) : Boolean(readReceiptText.value) ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+            readReceiptText.value && !props.isGroup ? (openBlock(), createElementBlock("span", {
+              key: 0,
+              class: normalizeClass(unref(classes)["message-meta__read-status"])
+            }, toDisplayString(readReceiptText.value), 3)) : readReceiptText.value && props.isGroup && props.readReceiptInfo && props.readReceiptInfo.unreadCount > 0 ? (openBlock(), createElementBlock("span", {
               key: 1,
-              class: "message-meta__group-unread",
+              class: normalizeClass(unref(classes)["message-meta__group-unread"]),
               onClick: handleGroupUnreadClick
-            }, toDisplayString(readReceiptText.value), 1)) : readReceiptText.value && props.isGroup ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(readReceiptText.value), 1)) : createCommentVNode("", true)
-          ], 64)),
-          displayTime.value ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(displayTime.value), 1)) : createCommentVNode("", true)
+            }, toDisplayString(readReceiptText.value), 3)) : readReceiptText.value && props.isGroup ? (openBlock(), createElementBlock("span", {
+              key: 2,
+              class: normalizeClass(unref(classes)["message-meta__group-all-read"])
+            }, toDisplayString(readReceiptText.value), 3)) : createCommentVNode("", true)
+          ], 64)) : createCommentVNode("", true),
+          displayTime.value ? (openBlock(), createElementBlock("span", {
+            key: 2,
+            class: normalizeClass(unref(classes)["message-meta__time"])
+          }, toDisplayString(displayTime.value), 3)) : createCommentVNode("", true)
         ]),
         _: 1
-      }, 8, ["class", "style"]);
+      }, 8, ["class"]);
     };
   }
 });
-const MessageMeta = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-ba3e4d41"]]);
+const style0 = {
+  "message-meta": "_message-meta_rk5t7_1",
+  "message-meta__read-status": "_message-meta__read-status_rk5t7_6",
+  "message-meta__group-unread": "_message-meta__group-unread_rk5t7_9",
+  "message-meta__group-all-read": "_message-meta__group-all-read_rk5t7_18",
+  "message-meta__time": "_message-meta__time_rk5t7_21"
+};
+const cssModules = {
+  "$style": style0
+};
+const MessageMeta = /* @__PURE__ */ _export_sfc(_sfc_main, [["__cssModules", cssModules]]);
 export {
   MessageMeta as default
 };

package/dist/components/MessageList/Message/MessageLayout/MessageMeta/MessageMeta.vue.d.ts

@@ -1,8 +1,7 @@
-import { CSSProperties } from 'vue';
-
 interface MessageMetaProps {
     isGroup: boolean;
     timestamp: number;
+    flow: string;
     needReadReceipt?: boolean;
     readReceiptInfo?: {
         readCount: number;
@@ -10,30 +9,25 @@ interface MessageMetaProps {
         isPeerRead: boolean;
     };
     status?: 'unSend' | 'success' | 'fail' | string;
-    class?: string;
-    style?: CSSProperties;
 }
 declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<MessageMetaProps>, {
     timestamp: number;
+    flow: string;
     needReadReceipt: boolean;
     readReceiptInfo: undefined;
     status: undefined;
-    class: undefined;
-    style: undefined;
 }>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     onReadReceiptTextClick: (...args: any[]) => void;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<MessageMetaProps>, {
     timestamp: number;
+    flow: string;
     needReadReceipt: boolean;
     readReceiptInfo: undefined;
     status: undefined;
-    class: undefined;
-    style: undefined;
 }>>> & Readonly<{
     onOnReadReceiptTextClick?: ((...args: any[]) => any) | undefined;
 }>, {
-    style: CSSProperties;
-    class: string;
+    flow: string;
     status: "unSend" | "success" | "fail" | string;
     needReadReceipt: boolean;
     readReceiptInfo: {

package/dist/components/MessageList/Message/MessageLayout/MessageMeta/MessageStatusIcon.js

@@ -1,6 +1,6 @@
 import { defineComponent, createBlock, openBlock, unref, withCtx, createCommentVNode } from "vue";
 import { IconLoading, IconSuccess, IconErrorToast } from "@tencentcloud/uikit-base-component-vue3";
-import View from "../../../../../baseComp/View/View.js";
+import { View as _sfc_main$1 } from "../../../../../baseComp/View/index.js";
 import { _ as _export_sfc } from "../../../../../_plugin-vue_export-helper-1tPrXgE0.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "MessageStatusIcon",
@@ -9,7 +9,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(View), null, {
+      return openBlock(), createBlock(unref(_sfc_main$1), null, {
         default: withCtx(() => [
           _ctx.status === "unSend" ? (openBlock(), createBlock(unref(IconLoading), {
             key: 0,

package/dist/components/MessageList/Message/RecalledMessage/RecalledMessage.js

@@ -1,8 +1,8 @@
 import { defineComponent, computed, createBlock, openBlock, unref, normalizeStyle, normalizeClass, withCtx, createElementBlock, Fragment, createTextVNode, createCommentVNode, toDisplayString } from "vue";
-import ChatEngine from "@tencentcloud/chat-uikit-engine";
+import TUIChatEngine from "@tencentcloud/chat-uikit-engine";
 import { useUIKit } from "@tencentcloud/uikit-base-component-vue3";
 import { c as cs } from "../../../../index-BF6QB9jF.js";
-import View from "../../../../baseComp/View/View.js";
+import { View as _sfc_main$1 } from "../../../../baseComp/View/index.js";
 import { _ as _export_sfc } from "../../../../_plugin-vue_export-helper-1tPrXgE0.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "RecalledMessage",
@@ -17,7 +17,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const setInputValue = (text) => {
       console.log("Set input value:", text);
     };
-    const isTextMessage = computed(() => props.message.type === ChatEngine.TYPES.MSG_TEXT);
+    const isTextMessage = computed(() => props.message.type === TUIChatEngine.TYPES.MSG_TEXT);
     const isMessageOwner = computed(() => props.message.flow === "out");
     const otherDisplayName = computed(() => props.message.nick || props.message.from || "");
     function recallMessageToInput() {
@@ -25,26 +25,26 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       setInputValue(transformedText);
     }
     return (_ctx, _cache) => {
-      return openBlock(), createBlock(unref(View), {
+      return openBlock(), createBlock(unref(_sfc_main$1), {
         class: normalizeClass(unref(cs)("recalled-message", props.class)),
         style: normalizeStyle(props.style)
       }, {
         default: withCtx(() => [
           isMessageOwner.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-            createTextVNode(toDisplayString(unref(t)("TUIChat.You")) + toDisplayString(unref(t)("TUIChat.recalled a message")) + " ", 1),
-            isTextMessage.value ? (openBlock(), createBlock(unref(View), {
+            createTextVNode(toDisplayString(unref(t)("MessageList.you")) + toDisplayString(unref(t)("MessageList.recalled_a_message")) + " ", 1),
+            isTextMessage.value ? (openBlock(), createBlock(unref(_sfc_main$1), {
               key: 0,
               role: "button",
               class: "recalled-message__button",
               onClick: recallMessageToInput
             }, {
               default: withCtx(() => [
-                createTextVNode(toDisplayString(unref(t)("TUIChat.Re-edit")), 1)
+                createTextVNode(toDisplayString(unref(t)("MessageList.reedit")), 1)
               ]),
               _: 1
             })) : createCommentVNode("", true)
           ], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-            createTextVNode(toDisplayString(otherDisplayName.value) + " " + toDisplayString(unref(t)("TUIChat.recalled a message")), 1)
+            createTextVNode(toDisplayString(otherDisplayName.value) + " " + toDisplayString(unref(t)("MessageList.recalled_a_message")), 1)
           ], 64))
         ]),
         _: 1
@@ -52,7 +52,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const RecalledMessage = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-dbd9628c"]]);
+const RecalledMessage = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c0fdcab9"]]);
 export {
   RecalledMessage as default
 };