tuikit-atomicx-vue3 4.5.0 → 4.5.1

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

@@ -1,32 +1,34 @@
-import { defineComponent as b, ref as B, computed as o, createElementBlock as h, openBlock as n, Fragment as D, createBlock as l, createCommentVNode as g, createVNode as u, unref as a, normalizeStyle as E, normalizeClass as i, withCtx as c, resolveDynamicComponent as G } from "vue";
-import { c as f } from "../../../../index-DPczIrgX.js";
-import { View as p } from "../../../../baseComp/View/index.js";
-import { MessageType as s, ConversationType as C } from "../../../../types/engine.js";
-import { isCallMessage as F } from "../../../../utils/call.js";
+import { defineComponent as B, ref as b, computed as n, createElementBlock as D, openBlock as o, Fragment as h, createBlock as l, createCommentVNode as r, createVNode as c, unref as s, normalizeStyle as E, normalizeClass as m, withCtx as g, createTextVNode as G, toDisplayString as x, resolveDynamicComponent as F } from "vue";
+import { c as d } from "../../../../index-DPczIrgX.js";
+import { View as f } from "../../../../baseComp/View/index.js";
+import { MessageType as a, ConversationType as C } from "../../../../types/engine.js";
+import { isCallMessage as N } from "../../../../utils/call.js";
 import P from "../../../Avatar/Avatar.js";
-import x from "../../ReadReceiptInfo/ReadReceiptInfo.js";
+import H from "../../ReadReceiptInfo/ReadReceiptInfo.js";
 import U from "../AudioMessage/AudioMessage.js";
 import V from "../CustomMessage/CustomMessage.js";
-import H from "../FaceMessage/FaceMessage.js";
-import N from "../FileMessage/FileMessage.js";
-import { GroupTipMessage as M } from "../GroupTipMessage/index.js";
-import S from "../ImageMessage/ImageMessage.js";
-import z from "../LocationMessage/LocationMessage.js";
-import $ from "../MergerMessage/MergerMessage.js";
-import X from "../RecalledMessage/RecalledMessage.js";
-import j from "../TextMessage/TextMessage.js";
-import q from "../VideoMessage/VideoMessage.js";
-import J from "./MessageBubble/MessageBubble.js";
-import K from "./MessageMeta/MessageMeta.js";
-import { useMessageLayoutClasses as Q } from "./useMessageLayoutClasses.js";
-import { _ as W } from "../../../../_plugin-vue_export-helper-CHgC5LLL.js";
-const Y = /* @__PURE__ */ b({
+import S from "../FaceMessage/FaceMessage.js";
+import z from "../FileMessage/FileMessage.js";
+import { GroupTipMessage as y } from "../GroupTipMessage/index.js";
+import $ from "../ImageMessage/ImageMessage.js";
+import X from "../LocationMessage/LocationMessage.js";
+import j from "../MergerMessage/MergerMessage.js";
+import q from "../RecalledMessage/RecalledMessage.js";
+import J from "../TextMessage/TextMessage.js";
+import K from "../VideoMessage/VideoMessage.js";
+import Q from "./MessageBubble/MessageBubble.js";
+import W from "./MessageMeta/MessageMeta.js";
+import { useMessageLayoutClasses as Y } from "./useMessageLayoutClasses.js";
+import { _ as Z } from "../../../../_plugin-vue_export-helper-CHgC5LLL.js";
+const _ = /* @__PURE__ */ B({
   __name: "MessageLayout",
   props: {
     message: { default: () => ({}) },
+    nick: { default: void 0 },
     isAggregated: { type: Boolean, default: !1 },
     isHiddenMessageAvatar: { type: Boolean, default: !1 },
     isHiddenMessageMeta: { type: Boolean, default: !1 },
+    isHiddenMessageNick: { type: Boolean, default: !1 },
     isFirstInChunk: { type: Boolean, default: void 0 },
     isLastInChunk: { type: Boolean, default: void 0 },
     alignment: { default: "two-sided" },
@@ -35,73 +37,82 @@ const Y = /* @__PURE__ */ b({
     style: { default: void 0 }
   },
   setup(e) {
-    const t = e, r = B(!1), v = o(() => !!(t.message.type === s.CUSTOM && t.message.getMessageContent().businessID === "group_create" || t.message.type === s.CUSTOM && F(t.message) && t.message.conversationType === C.GROUP)), y = {
-      [s.TEXT]: j,
-      [s.IMAGE]: S,
-      [s.AUDIO]: U,
-      [s.VIDEO]: q,
-      [s.FILE]: N,
-      [s.FACE]: H,
-      [s.LOCATION]: z,
-      [s.MERGER]: $,
-      [s.CUSTOM]: V,
-      [s.GRP_TIP]: M
-    }, d = o(() => y[t.message.type]), R = o(() => t.message.flow === "out"), m = o(() => Q({
+    const t = e, u = b(!1), v = n(() => !!(t.message.type === a.CUSTOM && t.message.getMessageContent().businessID === "group_create" || t.message.type === a.CUSTOM && N(t.message) && t.message.conversationType === C.GROUP)), p = {
+      [a.TEXT]: J,
+      [a.IMAGE]: $,
+      [a.AUDIO]: U,
+      [a.VIDEO]: K,
+      [a.FILE]: z,
+      [a.FACE]: S,
+      [a.LOCATION]: X,
+      [a.MERGER]: j,
+      [a.CUSTOM]: V,
+      [a.GRP_TIP]: y
+    }, M = n(() => p[t.message.type]), R = n(() => t.message.flow === "out"), i = n(() => Y({
       isMessageOwner: R.value,
       alignment: t.alignment,
       isAggregated: t.isAggregated
-    })), I = o(() => m.value.layoutClasses), A = o(() => m.value.wrapperClasses), T = o(() => m.value.avatarClasses), O = o(() => m.value.bubbleClasses), k = o(() => m.value.metaClasses);
+    })), I = n(() => i.value.layoutClasses), k = n(() => i.value.wrapperClasses), T = n(() => i.value.avatarClasses), A = n(() => i.value.bubbleClasses), O = n(() => i.value.metaClasses);
     function L() {
-      r.value = !0;
+      u.value = !0;
     }
     function w() {
-      r.value = !1;
+      u.value = !1;
     }
-    return (Z, _) => (n(), h(D, null, [
-      e.message.isRevoked ? (n(), l(a(X), {
+    return (ee, se) => (o(), D(h, null, [
+      e.message.isRevoked ? (o(), l(s(q), {
         key: 0,
         class: "message-recalled",
         message: e.message
-      }, null, 8, ["message"])) : e.message.type === a(s).GRP_TIP || v.value ? (n(), l(a(M), {
+      }, null, 8, ["message"])) : e.message.type === s(a).GRP_TIP || v.value ? (o(), l(s(y), {
         key: 1,
         message: e.message
-      }, null, 8, ["message"])) : d.value ? (n(), l(a(p), {
+      }, null, 8, ["message"])) : M.value ? (o(), l(s(f), {
         key: 2,
         "data-message-id": e.message.ID,
-        class: i(I.value),
+        class: m(I.value),
         style: E(e.style)
       }, {
-        default: c(() => [
-          e.isHiddenMessageAvatar ? g("", !0) : (n(), l(a(P), {
+        default: g(() => [
+          e.isHiddenMessageAvatar ? r("", !0) : (o(), l(s(P), {
             key: 0,
-            class: i(a(f)(T.value)),
+            class: m(s(d)(T.value)),
             src: e.message.avatar
           }, null, 8, ["class", "src"])),
-          u(a(p), {
-            class: i(a(f)(A.value))
+          c(s(f), {
+            class: m(s(d)(k.value))
           }, {
-            default: c(() => [
-              u(a(J), {
-                class: i(O.value),
+            default: g(() => [
+              e.isHiddenMessageNick ? r("", !0) : (o(), l(s(f), {
+                key: 0,
+                class: m(s(d)("message-layout__nick"))
+              }, {
+                default: g(() => [
+                  G(x(t.nick || e.message.nameCard || e.message.nick || e.message.from), 1)
+                ]),
+                _: 1
+              }, 8, ["class"])),
+              c(s(Q), {
+                class: m(A.value),
                 message: e.message,
                 alignment: e.alignment,
                 isLastInChunk: !1,
                 messageActionList: e.messageActionList
               }, {
-                default: c(() => [
-                  (n(), l(G(d.value), { message: e.message }, null, 8, ["message"]))
+                default: g(() => [
+                  (o(), l(F(M.value), { message: e.message }, null, 8, ["message"]))
                 ]),
                 _: 1
               }, 8, ["class", "message", "alignment", "messageActionList"]),
-              e.isHiddenMessageMeta ? g("", !0) : (n(), l(a(K), {
-                key: 0,
-                class: i(k.value),
+              e.isHiddenMessageMeta ? r("", !0) : (o(), l(s(W), {
+                key: 1,
+                class: m(O.value),
                 status: e.message.status,
                 flow: e.message.flow,
                 timestamp: e.message.time * 1e3,
                 "need-read-receipt": e.message.needReadReceipt,
                 "read-receipt-info": e.message.readReceiptInfo,
-                "is-group": e.message.conversationType === a(C).GROUP,
+                "is-group": e.message.conversationType === s(C).GROUP,
                 onOnReadReceiptTextClick: L
               }, null, 8, ["class", "status", "flow", "timestamp", "need-read-receipt", "read-receipt-info", "is-group"]))
             ]),
@@ -109,9 +120,9 @@ const Y = /* @__PURE__ */ b({
           }, 8, ["class"])
         ]),
         _: 1
-      }, 8, ["data-message-id", "class", "style"])) : g("", !0),
-      u(a(x), {
-        open: r.value,
+      }, 8, ["data-message-id", "class", "style"])) : r("", !0),
+      c(s(H), {
+        open: u.value,
         messageID: e.message.ID,
         "read-count": e.message.readReceiptInfo.readCount,
         "unread-count": e.message.readReceiptInfo.unreadCount,
@@ -120,7 +131,7 @@ const Y = /* @__PURE__ */ b({
       }, null, 8, ["open", "messageID", "read-count", "unread-count", "is-peer-read"])
     ], 64));
   }
-}), Ae = /* @__PURE__ */ W(Y, [["__scopeId", "data-v-e038fbd1"]]);
+}), Ae = /* @__PURE__ */ Z(_, [["__scopeId", "data-v-90177209"]]);
 export {
   Ae as default
 };

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

@@ -3,9 +3,11 @@ import { MessageModel } from '../../../../types/engine';
 
 interface MessageLayoutProps {
     message: MessageModel;
+    nick?: string;
     isAggregated?: boolean;
     isHiddenMessageAvatar?: boolean;
     isHiddenMessageMeta?: boolean;
+    isHiddenMessageNick?: boolean;
     isFirstInChunk?: boolean;
     isLastInChunk?: boolean;
     alignment?: 'left' | 'right' | 'two-sided';
@@ -16,9 +18,11 @@ interface MessageLayoutProps {
 declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<MessageLayoutProps>, {
     message: () => MessageModel;
     alignment: string;
+    nick: undefined;
     isAggregated: boolean;
     isHiddenMessageAvatar: boolean;
     isHiddenMessageMeta: boolean;
+    isHiddenMessageNick: boolean;
     isFirstInChunk: undefined;
     isLastInChunk: undefined;
     messageActionList: undefined;
@@ -27,9 +31,11 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
 }>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<MessageLayoutProps>, {
     message: () => MessageModel;
     alignment: string;
+    nick: undefined;
     isAggregated: boolean;
     isHiddenMessageAvatar: boolean;
     isHiddenMessageMeta: boolean;
+    isHiddenMessageNick: boolean;
     isFirstInChunk: undefined;
     isLastInChunk: undefined;
     messageActionList: undefined;
@@ -38,6 +44,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
 }>>> & Readonly<{}>, {
     style: Record<string, any>;
     message: MessageModel;
+    nick: string;
     className: string;
     isLastInChunk: boolean;
     messageActionList: MessageAction[];
@@ -45,6 +52,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     isAggregated: boolean;
     isHiddenMessageAvatar: boolean;
     isHiddenMessageMeta: boolean;
+    isHiddenMessageNick: boolean;
     isFirstInChunk: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 export default _default;

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

@@ -1,19 +1,22 @@
-import { defineComponent as s, createBlock as a, openBlock as i, unref as t } from "vue";
-import n from "./MessageLayout/MessageLayout.js";
+import { defineComponent as s, createBlock as a, openBlock as i, unref as n } from "vue";
+import t from "./MessageLayout/MessageLayout.js";
 const o = /* @__PURE__ */ s({
   __name: "Message",
   props: {
     message: {},
+    nick: { default: void 0 },
     alignment: { default: "two-sided" },
     messageActionList: { default: void 0 },
     isAggregated: { type: Boolean, default: !1 },
     isFirstInChunk: { type: Boolean, default: void 0 },
     isLastInChunk: { type: Boolean, default: void 0 },
     isHiddenMessageAvatar: { type: Boolean, default: !1 },
+    isHiddenMessageNick: { type: Boolean, default: !1 },
     isHiddenMessageMeta: { type: Boolean, default: !1 }
   },
   setup(e) {
-    return (g, d) => (i(), a(t(n), {
+    return (d, g) => (i(), a(n(t), {
+      nick: e.nick,
       message: e.message,
       messageActionList: e.messageActionList,
       alignment: e.alignment,
@@ -21,8 +24,9 @@ const o = /* @__PURE__ */ s({
       "is-first-in-chunk": e.isFirstInChunk,
       "is-last-in-chunk": e.isLastInChunk,
       "is-hidden-message-avatar": e.isHiddenMessageAvatar,
+      "is-hidden-message-nick": e.isHiddenMessageNick,
       "is-hidden-message-meta": e.isHiddenMessageMeta
-    }, null, 8, ["message", "messageActionList", "alignment", "is-aggregated", "is-first-in-chunk", "is-last-in-chunk", "is-hidden-message-avatar", "is-hidden-message-meta"]));
+    }, null, 8, ["nick", "message", "messageActionList", "alignment", "is-aggregated", "is-first-in-chunk", "is-last-in-chunk", "is-hidden-message-avatar", "is-hidden-message-nick", "is-hidden-message-meta"]));
   }
 });
 export {

package/dist/components/MessageList/MessageList.js

@@ -1,17 +1,21 @@
-import { defineComponent as j, useSlots as q, provide as J, ref as m, computed as R, watch as A, nextTick as w, onMounted as K, onUnmounted as Q, createElementBlock as C, openBlock as u, createElementVNode as S, createVNode as N, createBlock as k, createCommentVNode as Y, unref as i, withCtx as V, Fragment as F, renderList as $, normalizeClass as x, resolveDynamicComponent as O } from "vue";
-import { c as I } from "../../index-DPczIrgX.js";
-import Z from "../../baseComp/ObserverView/ObserverView.js";
-import { View as ee } from "../../baseComp/View/index.js";
-import { useScroll as te } from "../../hooks/useScroll.js";
-import { throttle as se } from "../../utils/lodash.js";
-import { Message as oe } from "./Message/index.js";
-import le from "./MessageForward/MessageForward.js";
-import { MessageListContextSymbol as ae } from "./MessageListContext.js";
-import ie from "./MessageTimeDivider/MessageTimeDivider.js";
-import re from "./ScrollToBottom/ScrollToBottom.js";
-import { useMessageListState as ne } from "../../states/MessageListState/MessageListState.js";
-import { _ as ue } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
-const ce = { class: "message-list" }, me = { class: "message-chunk" }, y = 150, ge = /* @__PURE__ */ j({
+import { defineComponent as Q, useSlots as Y, provide as Z, ref as v, computed as y, watch as A, nextTick as G, onMounted as ee, onUnmounted as te, createElementBlock as _, openBlock as c, createElementVNode as L, createVNode as N, createBlock as T, createCommentVNode as se, unref as n, withCtx as O, Fragment as V, renderList as F, normalizeClass as $, resolveDynamicComponent as U } from "vue";
+import { c as x } from "../../index-DPczIrgX.js";
+import oe from "../../baseComp/ObserverView/ObserverView.js";
+import { View as ie } from "../../baseComp/View/index.js";
+import { useScroll as ae } from "../../hooks/useScroll.js";
+import { ConversationType as le, MessageType as re } from "../../types/engine.js";
+import { isCallMessage as z } from "../../utils/call.js";
+import { throttle as ne } from "../../utils/lodash.js";
+import { Message as ue } from "./Message/index.js";
+import ce from "./MessageForward/MessageForward.js";
+import { MessageListContextSymbol as me } from "./MessageListContext.js";
+import ve from "./MessageTimeDivider/MessageTimeDivider.js";
+import ge from "./ScrollToBottom/ScrollToBottom.js";
+import { useGroupSettingState as fe } from "../../states/GroupSettingState/GroupSettingState.js";
+import { useConversationListState as de } from "../../states/ConversationListState/ConversationListState.js";
+import { useMessageListState as pe } from "../../states/MessageListState/MessageListState.js";
+import { _ as he } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+const Me = { class: "message-list" }, ke = { class: "message-chunk" }, b = 150, Te = /* @__PURE__ */ Q({
   __name: "MessageList",
   props: {
     alignment: { default: "two-sided" },
@@ -22,132 +26,136 @@ const ce = { class: "message-list" }, me = { class: "message-chunk" }, y = 150,
     Message: { default: void 0 },
     MessageTimeDivider: { default: void 0 }
   },
-  setup(B) {
-    const a = B, z = q();
-    J(ae, { slots: z });
-    const v = m(!1), f = m(0), d = m(!1), t = m(null), h = m(!1), D = m(0), {
+  setup(C) {
+    const a = C, I = Y();
+    Z(me, { slots: I });
+    const f = v(!1), d = v(0), p = v(!1), t = v(null), h = v(!1), B = v(0), {
       messageList: g,
-      loadMoreOlderMessage: G,
-      activeConversationID: U,
-      isDisableScroll: P,
-      setIsDisableScroll: p,
-      setEnableReadReceipt: W
-    } = ne(), { scrollToBottom: _ } = te(), M = R(() => a.messageAggregationTime && a.messageAggregationTime > 0), L = R(() => {
+      loadMoreOlderMessage: P,
+      activeConversationID: W,
+      isDisableScroll: X,
+      setIsDisableScroll: M,
+      setEnableReadReceipt: j
+    } = pe(), { getGroupMemberList: q } = fe(), { scrollToBottom: S } = ae(), { activeConversation: J } = de(), D = y(() => {
+      var s;
+      return ((s = J.value) == null ? void 0 : s.type) === le.GROUP;
+    }), m = y(() => a.messageAggregationTime && a.messageAggregationTime > 0), H = y(() => {
       if (!g.value)
         return [];
-      const l = a.filter ? g.value.filter(a.filter) : g.value.filter((e) => !e.isDeleted);
+      const s = a.filter ? g.value.filter(a.filter) : g.value.filter((e) => !e.isDeleted);
       if (!a.messageAggregationTime || a.messageAggregationTime <= 0)
-        return l.map((e) => ({
+        return s.map((e) => ({
           timestamp: e.time,
           messages: [e],
           key: `chunk-${e.ID}`
         }));
-      const s = [], o = a.messageAggregationTime;
-      return l.forEach((e, n, r) => {
-        const E = e.time, T = s.length > 0 ? s[s.length - 1] : void 0, c = n > 0 ? r[n - 1] : void 0;
-        !T || E - T.timestamp > o || T.messages[0].from !== e.from || e.isRevoked || c && c.isRevoked || e.status === "fail" || c && c.status === "fail" || e.hasRiskContent || c && c.hasRiskContent ? s.push({
+      const o = [], i = a.messageAggregationTime;
+      return s.forEach((e, u, r) => {
+        const E = e.time, k = o.length > 0 ? o[o.length - 1] : void 0, l = u > 0 ? r[u - 1] : void 0;
+        !k || E - k.timestamp > i || k.messages[0].from !== e.from || e.isRevoked || l && l.isRevoked || e.status === "fail" || l && l.status === "fail" || e.hasRiskContent || l && l.hasRiskContent || z(e) || l && z(l) || l && l.type === re.CUSTOM && l.getMessageContent().businessID === "group_create" ? o.push({
           timestamp: E,
           messages: [e],
           key: `chunk-${e.ID}`
-        }) : T.messages.push(e);
-      }), s;
-    }), H = se(() => {
-      t.value && (f.value = t.value.scrollHeight - t.value.scrollTop - t.value.clientHeight, f.value > y && (p(!0), h.value = !0), f.value < y && (p(!1), h.value = !1));
-    }, 100), b = async () => {
-      v.value = !1, p(!1), h.value = !1;
-    }, X = async () => {
-      var l;
-      if (!(!v.value || d.value || !((l = g.value) != null && l.length))) {
-        if (p(!0), d.value = !0, !t.value) {
-          d.value = !1;
+        }) : k.messages.push(e);
+      }), o;
+    }), R = ne(() => {
+      t.value && (d.value = t.value.scrollHeight - t.value.scrollTop - t.value.clientHeight, d.value > b && (M(!0), h.value = !0), d.value < b && (M(!1), h.value = !1));
+    }, 100), w = async () => {
+      f.value = !1, M(!1), h.value = !1;
+    }, K = async () => {
+      var s;
+      if (!(!f.value || p.value || !((s = g.value) != null && s.length))) {
+        if (M(!0), p.value = !0, !t.value) {
+          p.value = !1;
           return;
         }
-        if (D.value = t.value.scrollHeight - t.value.scrollTop - t.value.clientHeight, await G(), await w(), t.value) {
-          const s = t.value.scrollHeight - t.value.clientHeight - D.value;
+        if (B.value = t.value.scrollHeight - t.value.scrollTop - t.value.clientHeight, await P(), await G(), t.value) {
+          const o = t.value.scrollHeight - t.value.clientHeight - B.value;
           t.value.scrollTop = Math.max(0, Math.min(
             t.value.scrollHeight - t.value.clientHeight,
-            s
+            o
           ));
         }
-        d.value = !1;
+        p.value = !1;
       }
     };
-    return A(U, () => {
-      b();
-    }), A(g, (l, s) => {
-      if (s === void 0 && l && !v.value) {
-        w(() => {
-          _({ behavior: "instant" }), v.value = !0;
-        });
+    return A(W, () => {
+      w();
+    }), A(g, (s, o) => {
+      if (o === void 0 && s && !f.value) {
+        G(() => {
+          S({ behavior: "instant" }), f.value = !0;
+        }), D.value && q();
         return;
       }
-      if (!s || !l || !l.length)
+      if (!o || !s || !s.length)
         return;
-      const o = l[l.length - 1], e = s[s.length - 1];
-      (o == null ? void 0 : o.ID) !== (e == null ? void 0 : e.ID) && (o.flow === "out" || !P.value && f.value < y) && _({ behavior: "smooth" });
+      const i = s[s.length - 1], e = o[o.length - 1];
+      (i == null ? void 0 : i.ID) !== (e == null ? void 0 : e.ID) && (i.flow === "out" || !X.value && d.value < b) && S({ behavior: "smooth" });
     }, {
       immediate: !0
-    }), A(() => a.enableReadReceipt, (l) => {
-      W(l);
+    }), A(() => a.enableReadReceipt, (s) => {
+      j(s);
     }, {
       immediate: !0
-    }), K(() => {
-      t.value && t.value.addEventListener("scroll", H), b();
-    }), Q(() => {
-      t.value && t.value.removeEventListener("scroll", H);
-    }), (l, s) => (u(), C("div", ce, [
-      S("div", {
+    }), ee(() => {
+      t.value && t.value.addEventListener("scroll", R), w();
+    }), te(() => {
+      t.value && t.value.removeEventListener("scroll", R);
+    }), (s, o) => (c(), _("div", Me, [
+      L("div", {
         id: "messageScrollList",
         ref_key: "scrollContainer",
         ref: t,
         class: "message-list-container"
       }, [
-        N(i(Z), {
+        N(n(oe), {
           root: "#messageScrollList",
           rootMargin: "50px 0px 0px 0px",
           threshold: 0.1,
-          onOnShow: X
+          onOnShow: K
         }, {
-          default: V(() => [...s[1] || (s[1] = [
-            S("div", { id: "loadMore" }, null, -1)
+          default: O(() => [...o[1] || (o[1] = [
+            L("div", { id: "loadMore" }, null, -1)
           ])]),
           _: 1
         }),
-        (u(!0), C(F, null, $(L.value, (o, e) => (u(), k(i(ee), {
-          key: o.key,
-          class: x(i(I)("message-chunk--container"))
+        (c(!0), _(V, null, F(H.value, (i, e) => (c(), T(n(ie), {
+          key: i.key,
+          class: $(n(x)("message-chunk--container"))
         }, {
-          default: V(() => [
-            (u(), k(O(a.MessageTimeDivider || i(ie)), {
-              previousMessage: e > 0 ? L.value[e - 1].messages[0] : void 0,
-              currentMessage: o.messages[0]
+          default: O(() => [
+            (c(), T(U(a.MessageTimeDivider || n(ve)), {
+              previousMessage: e > 0 ? H.value[e - 1].messages[0] : void 0,
+              currentMessage: i.messages[0]
             }, null, 8, ["previousMessage", "currentMessage"])),
-            S("div", me, [
-              (u(!0), C(F, null, $(o.messages, (n, r) => (u(), k(O(a.Message || i(oe)), {
-                key: n.ID,
-                message: n,
+            L("div", ke, [
+              (c(!0), _(V, null, F(i.messages, (u, r) => (c(), T(U(a.Message || n(ue)), {
+                key: u.ID,
+                message: u,
                 alignment: a.alignment,
                 messageActionList: a.messageActionList,
-                isAggregated: !!(M.value && r !== o.messages.length - 1),
+                isAggregated: !!(m.value && r !== 0),
                 "is-first-in-chunk": r === 0,
-                "is-last-in-chunk": r === o.messages.length - 1,
-                isHiddenMessageAvatar: !!(B.alignment === "two-sided" ? M.value && r !== o.messages.length - 1 || n.flow === "out" : M.value && r !== o.messages.length - 1),
-                isHiddenMessageMeta: !!(M.value && r !== o.messages.length - 1)
-              }, null, 8, ["message", "alignment", "messageActionList", "isAggregated", "is-first-in-chunk", "is-last-in-chunk", "isHiddenMessageAvatar", "isHiddenMessageMeta"]))), 128))
+                "is-last-in-chunk": r === i.messages.length - 1,
+                isHiddenMessageAvatar: !!(C.alignment === "two-sided" ? m.value && r !== 0 || u.flow === "out" : m.value && r !== 0),
+                "is-hidden-message-nick": !!(!D.value || (C.alignment === "two-sided" ? m.value && r !== 0 || u.flow === "out" : m.value && r !== 0)),
+                isHiddenMessageMeta: !!(m.value && r !== i.messages.length - 1)
+              }, null, 8, ["message", "alignment", "messageActionList", "isAggregated", "is-first-in-chunk", "is-last-in-chunk", "isHiddenMessageAvatar", "is-hidden-message-nick", "isHiddenMessageMeta"]))), 128))
             ])
           ]),
           _: 2
         }, 1032, ["class"]))), 128))
       ], 512),
-      N(i(le)),
-      h.value ? (u(), k(i(re), {
+      N(n(ce)),
+      h.value ? (c(), T(n(ge), {
         key: 0,
-        class: x(i(I)("scroll-to-bottom")),
-        onClick: s[0] || (s[0] = (o) => i(_)({ behavior: "smooth" }))
-      }, null, 8, ["class"])) : Y("", !0)
+        class: $(n(x)("scroll-to-bottom")),
+        onClick: o[0] || (o[0] = (i) => n(S)({ behavior: "smooth" }))
+      }, null, 8, ["class"])) : se("", !0)
     ]));
   }
-}), De = /* @__PURE__ */ ue(ge, [["__scopeId", "data-v-ac83869e"]]);
+}), $e = /* @__PURE__ */ he(Te, [["__scopeId", "data-v-85ea222b"]]);
 export {
-  De as default
+  $e as default
 };

package/dist/components/MessageList/MessageList.vue.d.ts

@@ -1,6 +1,6 @@
 import { Component } from 'vue';
 import { MessageAction } from '../../hooks/useMessageActions';
-import { IMessageModel as MessageModel } from '@tencentcloud/chat-uikit-engine';
+import { MessageModel } from '../../types/engine';
 
 interface MessageListProps {
     alignment?: 'left' | 'right' | 'two-sided';

package/dist/components/MessageList/index.d.ts

@@ -3,6 +3,10 @@ declare const Message: import('vue').DefineComponent<import('vue').ExtractPropTy
         type: import('vue').PropType<import('../..').MessageModel>;
         required: true;
     };
+    nick: {
+        type: import('vue').PropType<string>;
+        default: undefined;
+    };
     isLastInChunk: {
         type: import('vue').PropType<boolean>;
         default: undefined;
@@ -27,6 +31,10 @@ declare const Message: import('vue').DefineComponent<import('vue').ExtractPropTy
         type: import('vue').PropType<boolean>;
         default: boolean;
     };
+    isHiddenMessageNick: {
+        type: import('vue').PropType<boolean>;
+        default: boolean;
+    };
     isFirstInChunk: {
         type: import('vue').PropType<boolean>;
         default: undefined;
@@ -36,6 +44,10 @@ declare const Message: import('vue').DefineComponent<import('vue').ExtractPropTy
         type: import('vue').PropType<import('../..').MessageModel>;
         required: true;
     };
+    nick: {
+        type: import('vue').PropType<string>;
+        default: undefined;
+    };
     isLastInChunk: {
         type: import('vue').PropType<boolean>;
         default: undefined;
@@ -60,22 +72,28 @@ declare const Message: import('vue').DefineComponent<import('vue').ExtractPropTy
         type: import('vue').PropType<boolean>;
         default: boolean;
     };
+    isHiddenMessageNick: {
+        type: import('vue').PropType<boolean>;
+        default: boolean;
+    };
     isFirstInChunk: {
         type: import('vue').PropType<boolean>;
         default: undefined;
     };
 }>> & Readonly<{}>, {
+    nick: string;
     isLastInChunk: boolean;
     messageActionList: import('../../hooks/useMessageActions').MessageAction[];
     alignment: "left" | "right" | "two-sided";
     isAggregated: boolean;
     isHiddenMessageAvatar: boolean;
     isHiddenMessageMeta: boolean;
+    isHiddenMessageNick: boolean;
     isFirstInChunk: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 declare const MessageList: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
     filter: {
-        type: import('vue').PropType<(message: import('@tencentcloud/chat-uikit-engine').IMessageModel) => boolean>;
+        type: import('vue').PropType<(message: import('../..').MessageModel) => boolean>;
         default: undefined;
     };
     enableReadReceipt: {
@@ -104,7 +122,7 @@ declare const MessageList: import('vue').DefineComponent<import('vue').ExtractPr
     };
 }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     filter: {
-        type: import('vue').PropType<(message: import('@tencentcloud/chat-uikit-engine').IMessageModel) => boolean>;
+        type: import('vue').PropType<(message: import('../..').MessageModel) => boolean>;
         default: undefined;
     };
     enableReadReceipt: {
@@ -132,7 +150,7 @@ declare const MessageList: import('vue').DefineComponent<import('vue').ExtractPr
         default: number;
     };
 }>> & Readonly<{}>, {
-    filter: (message: import('@tencentcloud/chat-uikit-engine').IMessageModel) => boolean;
+    filter: (message: import('../..').MessageModel) => boolean;
     enableReadReceipt: boolean;
     Message: import('vue').Component;
     MessageTimeDivider: import('vue').Component;