@sendbird/uikit-react 3.14.12 → 3.14.13

package/Thread/components/ThreadHeader.js

@@ -1,15 +1,15 @@
 import React__default, { useMemo } from 'react';
 import { IconTypes, IconColors } from '../../ui/Icon.js';
-import { u as useLocalization } from '../../chunks/bundle-BPLoGpIy.js';
+import { u as useLocalization } from '../../chunks/bundle-cQZ3UZoG.js';
 import Header from '../../ui/Header.js';
-import '../../chunks/bundle-B9I7KCZ2.js';
-import '../../chunks/bundle-B628FXKZ.js';
-import '../../chunks/bundle-BwafidOs.js';
-import '../../chunks/bundle-CMgJTzYH.js';
-import '../../chunks/bundle-B1gHpFXu.js';
-import '../../chunks/bundle-BydEbpDQ.js';
+import '../../chunks/bundle-BQi9-O76.js';
+import '../../chunks/bundle-BgwzpLeQ.js';
+import '../../chunks/bundle-Bwk5KPwK.js';
+import '../../chunks/bundle-bdDHjHH6.js';
+import '../../chunks/bundle-DhKQeIfP.js';
+import '../../chunks/bundle-f-SpnOx2.js';
 import '../../ui/TextButton.js';
-import '../../chunks/bundle-DDIIh2iG.js';
+import '../../chunks/bundle-rA4afvKU.js';
 import '../../ui/IconButton.js';
 
 function ThreadHeader(_a) {

package/Thread/components/ThreadList.js

@@ -1,29 +1,29 @@
-import React__default, { useMemo } from 'react';
+import { _ as __assign } from '../../chunks/bundle-BQi9-O76.js';
+import React__default from 'react';
 import ThreadListItem from './ThreadListItem.js';
 import { useThreadContext } from '../context.js';
 import { compareMessagesForGrouping } from '../../Channel/utils/compareMessagesForGrouping.js';
 import { useSendbirdStateContext } from '../../useSendbirdStateContext.js';
 import { isSameDay } from 'date-fns';
 import { MessageProvider } from '../../Message/context.js';
-import { g as getCaseResolvedReplyType } from '../../chunks/bundle-2aNchqYM.js';
-import '../../chunks/bundle-B9I7KCZ2.js';
-import '../../chunks/bundle-Cme8jJ5D.js';
-import '../../chunks/bundle-DnVyKahm.js';
-import '../../chunks/bundle-CMgJTzYH.js';
-import '../../chunks/bundle-BPLoGpIy.js';
-import '../../chunks/bundle-BwafidOs.js';
+import { g as getCaseResolvedReplyType } from '../../chunks/bundle-fHeMHhND.js';
+import '../../chunks/bundle-CAdqcqOm.js';
+import '../../chunks/bundle-CA85nVxp.js';
+import '../../chunks/bundle-bdDHjHH6.js';
+import '../../chunks/bundle-cQZ3UZoG.js';
+import '../../chunks/bundle-Bwk5KPwK.js';
 import '../../ui/DateSeparator.js';
-import '../../chunks/bundle-DDIIh2iG.js';
-import '../../chunks/bundle-B1gHpFXu.js';
-import '../../chunks/bundle-CqsQWc_t.js';
-import '../../chunks/bundle-DAF0GGlr.js';
-import '../../chunks/bundle-BGoByD2z.js';
+import '../../chunks/bundle-rA4afvKU.js';
+import '../../chunks/bundle-DhKQeIfP.js';
+import '../../chunks/bundle-D6ZpcPbH.js';
+import '../../chunks/bundle-CXdo2kR_.js';
+import '../../chunks/bundle-DxTN4_0p.js';
 import '@sendbird/chat/groupChannel';
 import '../../utils/message/getOutgoingMessageState.js';
-import '../../chunks/bundle-ByuZy4m8.js';
-import '../../chunks/bundle-B628FXKZ.js';
+import '../../chunks/bundle-CNWAfTVw.js';
+import '../../chunks/bundle-BgwzpLeQ.js';
 import 'react-dom';
-import '../../chunks/bundle-BydEbpDQ.js';
+import '../../chunks/bundle-f-SpnOx2.js';
 import '../../ui/IconButton.js';
 import '../../ui/Button.js';
 import '../../ui/Icon.js';
@@ -31,43 +31,41 @@ import '@sendbird/uikit-tools';
 import '../../withSendbird.js';
 import 'css-vars-ponyfill';
 import '@sendbird/chat';
-import '../../chunks/bundle-B97onQ-B.js';
+import '../../chunks/bundle-etuaqevl.js';
 import '@sendbird/chat/openChannel';
-import '../../chunks/bundle-jVDgtxRn.js';
-import '../../chunks/bundle-Mfnn12A9.js';
-import '../../chunks/bundle-BfonFE4n.js';
+import '../../chunks/bundle-DDeWOERD.js';
+import '../../chunks/bundle-DCMGp6rH.js';
+import '../../chunks/bundle-CwKZj-B6.js';
 import '../../ui/SortByRow.js';
-import '../../chunks/bundle-BiG6myo3.js';
+import '../../chunks/bundle-Zvm5CMGT.js';
 import '../../ui/FileViewer.js';
-import '../../chunks/bundle-D89r5O-w.js';
+import '../../chunks/bundle-CFosTNce.js';
 import '../../ui/ImageRenderer.js';
-import '../../chunks/bundle-DVCGbhaI.js';
-import '../../chunks/bundle-l8sVpQGm.js';
-import '../../chunks/bundle-CL8fYBvo.js';
-import '../../chunks/bundle-Dv9mmt4u.js';
-import '../../chunks/bundle-De1BnkR0.js';
-import '../../chunks/bundle-DqJ40nCa.js';
+import '../../chunks/bundle-DXRRGizV.js';
+import '../../chunks/bundle-Gdl-rzQC.js';
+import '../../chunks/bundle-BsAIw_77.js';
+import '../../chunks/bundle-Due9yzp6.js';
+import '../../chunks/bundle-CveCFQYP.js';
+import '../../chunks/bundle-0qSTzMXb.js';
 import '../../ui/MessageInput.js';
-import '../../chunks/bundle-D3w6q-9W.js';
+import '../../chunks/bundle-TZQ6dJCG.js';
 import 'dompurify';
-import '../../chunks/bundle-BT8XMu5e.js';
-import '../../chunks/bundle-CpcTBaG-.js';
-import '../../chunks/bundle-BQqQX3na.js';
-import '../../chunks/bundle-bbk4ulub.js';
+import '../../chunks/bundle-0nQK2G2O.js';
+import '../../chunks/bundle-B6edg1g0.js';
+import '../../chunks/bundle-DhGZA5UP.js';
+import '../../chunks/bundle-GUbI4JcD.js';
 import '../context/types.js';
-import '../../chunks/bundle-DUd6AS_D.js';
+import '../../chunks/bundle-BrTJ5Zbd.js';
 import '../../ui/UserProfile.js';
 import '../../sendbirdSelectors.js';
-import '../../chunks/bundle-D6I-uHp_.js';
-import '../../ui/MessageItemMenu.js';
-import '../../chunks/bundle-BS3xMvop.js';
+import '../../chunks/bundle-b6TpX_JP.js';
 import '../../ui/MessageItemReactionMenu.js';
 import '../../ui/ReactionButton.js';
-import '../../chunks/bundle-C6OwelAY.js';
-import '../../chunks/bundle-CQdKG76t.js';
+import '../../chunks/bundle-AfQS5DGf.js';
+import '../../chunks/bundle-vuBlPTsL.js';
 import '../../ui/Loader.js';
-import '../../chunks/bundle-K3w8yQDQ.js';
-import '../../chunks/bundle-B3xAJZu1.js';
+import '../../chunks/bundle-BHK1eF5R.js';
+import '../../chunks/bundle-F5koPk19.js';
 import '../../ui/EmojiReactions.js';
 import '../../ui/ReactionBadge.js';
 import '../../ui/BottomSheet.js';
@@ -76,47 +74,38 @@ import '../../ui/MutedAvatarOverlay.js';
 import '../../ui/Checkbox.js';
 import '../../ui/Tooltip.js';
 import '../../ui/TooltipWrapper.js';
-import '../../chunks/bundle-Cpt2mEbq.js';
+import '../../chunks/bundle-BNDaXsLn.js';
 import '../../ui/TextMessageItemBody.js';
-import '../../chunks/bundle-C8uZHDqp.js';
+import '../../chunks/bundle-DofK8ySe.js';
 import '../../ui/MentionLabel.js';
 import '../../ui/LinkLabel.js';
 import '../../ui/OGMessageItemBody.js';
 import '../../ui/FileMessageItemBody.js';
 import '../../ui/TextButton.js';
 import '../../ui/ThumbnailMessageItemBody.js';
-import '../../chunks/bundle-CO34LgiE.js';
+import '../../chunks/bundle-BqMHiKkl.js';
 import '../../ui/UnknownMessageItemBody.js';
 import '../../ui/VoiceMessageItemBody.js';
 import '../../ui/ProgressBar.js';
 import '../../VoicePlayer/useVoicePlayer.js';
 import '../../ui/PlaybackTime.js';
 import '../../ui/MobileMenu.js';
-import '../../chunks/bundle-DeqlERYT.js';
+import '../../chunks/bundle-ZVq6xGXk.js';
 import '@sendbird/chat/message';
+import '../../chunks/bundle-DkBecO3w.js';
+import '../../chunks/bundle-Cf0UgZwi.js';
+import '../../chunks/bundle-C3Ty1Yuy.js';
 import '../../Message/hooks/useDirtyGetMentions.js';
-import '../../chunks/bundle-CfHQbcbZ.js';
-import '../../chunks/bundle-CmAD8QUZ.js';
-import '../../chunks/bundle-B3PsG3mz.js';
-import '../../chunks/bundle-D-_vevD1.js';
+import '../../chunks/bundle-T6fVCCb7.js';
+import '../../chunks/bundle-CMLImr6T.js';
+import '../../chunks/bundle-CpjASiz4.js';
+import '../../chunks/bundle-CZUYMubi.js';
 
 function ThreadList(_a) {
-    var className = _a.className, renderMessage = _a.renderMessage, renderCustomSeparator = _a.renderCustomSeparator, scrollRef = _a.scrollRef, scrollBottom = _a.scrollBottom;
+    var className = _a.className, _b = _a.renderMessage, renderMessage = _b === void 0 ? function (props) { return React__default.createElement(ThreadListItem, __assign({}, props)); } : _b, renderCustomSeparator = _a.renderCustomSeparator, scrollRef = _a.scrollRef, scrollBottom = _a.scrollBottom;
     var config = useSendbirdStateContext().config;
     var userId = config.userId;
-    var _b = useThreadContext(), currentChannel = _b.currentChannel, allThreadMessages = _b.allThreadMessages, localThreadMessages = _b.localThreadMessages;
-    var MemorizedMessage = useMemo(function () { return function (_a) {
-        var message = _a.message, chainTop = _a.chainTop, chainBottom = _a.chainBottom, hasSeparator = _a.hasSeparator;
-        if (typeof renderMessage === 'function') {
-            return renderMessage({
-                message: message,
-                chainTop: chainTop,
-                chainBottom: chainBottom,
-                hasSeparator: hasSeparator,
-            });
-        }
-        return null;
-    }; }, [renderMessage]);
+    var _c = useThreadContext(), currentChannel = _c.currentChannel, allThreadMessages = _c.allThreadMessages, localThreadMessages = _c.localThreadMessages;
     return (React__default.createElement("div", { className: "sendbird-thread-list ".concat(className) },
         allThreadMessages.map(function (message, idx) {
             var _a;
@@ -136,22 +125,18 @@ function ThreadList(_a) {
                     }
                 }
             };
-            return (React__default.createElement(MessageProvider, { message: message, isByMe: isByMe, key: message === null || message === void 0 ? void 0 : message.messageId }, MemorizedMessage({
+            return (React__default.createElement(MessageProvider, { message: message, isByMe: isByMe, key: message === null || message === void 0 ? void 0 : message.messageId }, renderMessage({
                 message: message,
                 chainTop: chainTop,
                 chainBottom: chainBottom,
                 hasSeparator: hasSeparator,
-            }) || (React__default.createElement(ThreadListItem, { message: message, chainTop: chainTop, chainBottom: chainBottom, hasSeparator: hasSeparator, renderCustomSeparator: renderCustomSeparator, handleScroll: handleScroll }))));
+                renderCustomSeparator: renderCustomSeparator,
+                handleScroll: handleScroll,
+            })));
         }),
-        localThreadMessages.map(function (message, idx) {
+        localThreadMessages.map(function (message) {
             var _a;
             var isByMe = ((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId) === userId;
-            var prevMessage = localThreadMessages[idx - 1];
-            var nextMessage = localThreadMessages[idx + 1];
-            // eslint-disable-next-line no-constant-condition
-            var _b = compareMessagesForGrouping(prevMessage, message, nextMessage, currentChannel, getCaseResolvedReplyType(config.groupChannel.replyType).upperCase)
-                , chainTop = _b[0], chainBottom = _b[1];
-            var hasSeparator = !((prevMessage === null || prevMessage === void 0 ? void 0 : prevMessage.createdAt) > 0 && (isSameDay(message === null || message === void 0 ? void 0 : message.createdAt, prevMessage === null || prevMessage === void 0 ? void 0 : prevMessage.createdAt)));
             var handleScroll = function () {
                 var current = scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current;
                 if (current) {
@@ -161,12 +146,12 @@ function ThreadList(_a) {
                     }
                 }
             };
-            return (React__default.createElement(MessageProvider, { message: message, isByMe: isByMe, key: message === null || message === void 0 ? void 0 : message.messageId }, MemorizedMessage({
+            return (React__default.createElement(MessageProvider, { message: message, isByMe: isByMe, key: message === null || message === void 0 ? void 0 : message.messageId }, renderMessage({
                 message: message,
-                chainTop: chainTop,
-                chainBottom: chainBottom,
-                hasSeparator: hasSeparator,
-            }) || (React__default.createElement(ThreadListItem, { message: message, hasSeparator: false, renderCustomSeparator: renderCustomSeparator, handleScroll: handleScroll }))));
+                hasSeparator: false,
+                renderCustomSeparator: renderCustomSeparator,
+                handleScroll: handleScroll,
+            })));
         })));
 }
 

package/Thread/components/ThreadList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThreadList.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ThreadList.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/Thread/components/ThreadListItem.js

@@ -1,25 +1,24 @@
-import { _ as __assign, a as __awaiter, b as __generator, c as __spreadArray } from '../../chunks/bundle-B9I7KCZ2.js';
-import React__default, { useState, useContext, useRef, useLayoutEffect, useEffect, useMemo } from 'react';
-import { f as format } from '../../chunks/bundle-Cme8jJ5D.js';
-import { u as useLocalization } from '../../chunks/bundle-BPLoGpIy.js';
+import { _ as __assign, a as __awaiter, b as __generator, c as __spreadArray } from '../../chunks/bundle-BQi9-O76.js';
+import React__default, { useContext, useRef, useState, useLayoutEffect, useEffect, useMemo } from 'react';
+import { f as format } from '../../chunks/bundle-CAdqcqOm.js';
+import { u as useLocalization } from '../../chunks/bundle-cQZ3UZoG.js';
 import DateSeparator from '../../ui/DateSeparator.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../../chunks/bundle-B1gHpFXu.js';
-import { R as RemoveMessage } from '../../chunks/bundle-CqsQWc_t.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../chunks/bundle-DhKQeIfP.js';
+import { R as RemoveMessage } from '../../chunks/bundle-D6ZpcPbH.js';
 import FileViewer from '../../ui/FileViewer.js';
 import { useThreadContext } from '../context.js';
 import { useSendbirdStateContext } from '../../useSendbirdStateContext.js';
-import { S as SuggestedMentionList } from '../../chunks/bundle-CL8fYBvo.js';
+import { S as SuggestedMentionList } from '../../chunks/bundle-BsAIw_77.js';
 import MessageInput from '../../ui/MessageInput.js';
 import { ThreadListStateTypes } from '../context/types.js';
-import { M as MessageInputKeys } from '../../chunks/bundle-DqJ40nCa.js';
-import { C as ContextMenu, b as MenuItems } from '../../chunks/bundle-BfonFE4n.js';
-import { A as Avatar } from '../../chunks/bundle-D89r5O-w.js';
-import { a as UserProfileContext } from '../../chunks/bundle-DUd6AS_D.js';
+import { M as MessageInputKeys } from '../../chunks/bundle-0qSTzMXb.js';
+import { d as MENU_ROOT_ID, E as EMOJI_MENU_ROOT_ID, g as getObservingId, e as MENU_OBSERVING_CLASS_NAME, C as ContextMenu, b as MenuItems } from '../../chunks/bundle-CwKZj-B6.js';
+import { A as Avatar } from '../../chunks/bundle-CFosTNce.js';
+import { a as UserProfileContext } from '../../chunks/bundle-BrTJ5Zbd.js';
 import UserProfile from '../../ui/UserProfile.js';
-import { MessageMenu } from '../../ui/MessageItemMenu.js';
 import { MessageEmojiMenu } from '../../ui/MessageItemReactionMenu.js';
-import { n as getUIKitMessageTypes, e as getSenderName, w as getClassName, M as isOGMessage, N as isTextMessage, i as isVoiceMessage, m as getUIKitMessageType, c as isMultipleFilesMessage, p as isThumbnailMessage } from '../../chunks/bundle-BGoByD2z.js';
-import { M as MessageStatus } from '../../chunks/bundle-CQdKG76t.js';
+import { n as getUIKitMessageTypes, e as getSenderName, w as getClassName, M as isOGMessage, N as isTextMessage, i as isVoiceMessage, m as getUIKitMessageType, c as isMultipleFilesMessage, p as isThumbnailMessage } from '../../chunks/bundle-DxTN4_0p.js';
+import { M as MessageStatus } from '../../chunks/bundle-vuBlPTsL.js';
 import EmojiReactions from '../../ui/EmojiReactions.js';
 import TextMessageItemBody from '../../ui/TextMessageItemBody.js';
 import OGMessageItemBody from '../../ui/OGMessageItemBody.js';
@@ -27,20 +26,22 @@ import FileMessageItemBody from '../../ui/FileMessageItemBody.js';
 import ThumbnailMessageItemBody from '../../ui/ThumbnailMessageItemBody.js';
 import UnknownMessageItemBody from '../../ui/UnknownMessageItemBody.js';
 import { VoiceMessageItemBody } from '../../ui/VoiceMessageItemBody.js';
-import { u as useMediaQueryContext } from '../../chunks/bundle-BydEbpDQ.js';
-import { u as useLongPress } from '../../chunks/bundle-C6OwelAY.js';
+import { u as useMediaQueryContext } from '../../chunks/bundle-f-SpnOx2.js';
+import { u as useLongPress } from '../../chunks/bundle-AfQS5DGf.js';
 import { MobileMenu } from '../../ui/MobileMenu.js';
-import { u as useThreadMessageKindKeySelector, a as useFileInfoListWithUploaded, M as MultipleFilesMessageItemBody, T as ThreadMessageKind } from '../../chunks/bundle-DeqlERYT.js';
-import { c as classnames } from '../../chunks/bundle-B628FXKZ.js';
-import { R as Role } from '../../chunks/bundle-BS3xMvop.js';
+import { u as useThreadMessageKindKeySelector, a as useFileInfoListWithUploaded, M as MultipleFilesMessageItemBody, T as ThreadMessageKind } from '../../chunks/bundle-ZVq6xGXk.js';
+import { c as classnames } from '../../chunks/bundle-BgwzpLeQ.js';
+import { M as MessageMenu } from '../../chunks/bundle-DkBecO3w.js';
+import { u as useElementObserver } from '../../chunks/bundle-Cf0UgZwi.js';
+import { R as Role } from '../../chunks/bundle-C3Ty1Yuy.js';
 import { useDirtyGetMentions } from '../../Message/hooks/useDirtyGetMentions.js';
-import { g as getIsReactionEnabled } from '../../chunks/bundle-Cpt2mEbq.js';
-import { g as getCaseResolvedReplyType } from '../../chunks/bundle-2aNchqYM.js';
-import '../../chunks/bundle-DnVyKahm.js';
-import '../../chunks/bundle-CMgJTzYH.js';
-import '../../chunks/bundle-BwafidOs.js';
-import '../../chunks/bundle-DDIIh2iG.js';
-import '../../chunks/bundle-DAF0GGlr.js';
+import { g as getIsReactionEnabled } from '../../chunks/bundle-BNDaXsLn.js';
+import { g as getCaseResolvedReplyType } from '../../chunks/bundle-fHeMHhND.js';
+import '../../chunks/bundle-CA85nVxp.js';
+import '../../chunks/bundle-bdDHjHH6.js';
+import '../../chunks/bundle-Bwk5KPwK.js';
+import '../../chunks/bundle-rA4afvKU.js';
+import '../../chunks/bundle-CXdo2kR_.js';
 import 'react-dom';
 import '../../ui/IconButton.js';
 import '../../ui/Button.js';
@@ -49,37 +50,37 @@ import '@sendbird/uikit-tools';
 import '../../withSendbird.js';
 import 'css-vars-ponyfill';
 import '@sendbird/chat';
-import '../../chunks/bundle-B97onQ-B.js';
+import '../../chunks/bundle-etuaqevl.js';
 import '@sendbird/chat/openChannel';
 import '@sendbird/chat/groupChannel';
-import '../../chunks/bundle-jVDgtxRn.js';
-import '../../chunks/bundle-Mfnn12A9.js';
-import '../../chunks/bundle-ByuZy4m8.js';
-import '../../chunks/bundle-BiG6myo3.js';
-import '../../chunks/bundle-l8sVpQGm.js';
-import '../../chunks/bundle-CfHQbcbZ.js';
-import '../../chunks/bundle-D6I-uHp_.js';
-import '../../chunks/bundle-CmAD8QUZ.js';
+import '../../chunks/bundle-DDeWOERD.js';
+import '../../chunks/bundle-DCMGp6rH.js';
+import '../../chunks/bundle-CNWAfTVw.js';
+import '../../chunks/bundle-Zvm5CMGT.js';
+import '../../chunks/bundle-Gdl-rzQC.js';
+import '../../chunks/bundle-T6fVCCb7.js';
+import '../../chunks/bundle-b6TpX_JP.js';
+import '../../chunks/bundle-CMLImr6T.js';
 import '@sendbird/chat/message';
 import '../../utils/message/getOutgoingMessageState.js';
-import '../../chunks/bundle-B3PsG3mz.js';
-import '../../chunks/bundle-D-_vevD1.js';
-import '../../chunks/bundle-Dv9mmt4u.js';
-import '../../chunks/bundle-De1BnkR0.js';
-import '../../chunks/bundle-D3w6q-9W.js';
+import '../../chunks/bundle-CpjASiz4.js';
+import '../../chunks/bundle-CZUYMubi.js';
+import '../../chunks/bundle-Due9yzp6.js';
+import '../../chunks/bundle-CveCFQYP.js';
+import '../../chunks/bundle-TZQ6dJCG.js';
 import 'dompurify';
-import '../../chunks/bundle-BT8XMu5e.js';
-import '../../chunks/bundle-CpcTBaG-.js';
-import '../../chunks/bundle-BQqQX3na.js';
-import '../../chunks/bundle-bbk4ulub.js';
+import '../../chunks/bundle-0nQK2G2O.js';
+import '../../chunks/bundle-B6edg1g0.js';
+import '../../chunks/bundle-DhGZA5UP.js';
+import '../../chunks/bundle-GUbI4JcD.js';
 import '../../ui/SortByRow.js';
 import '../../ui/ImageRenderer.js';
-import '../../chunks/bundle-DVCGbhaI.js';
+import '../../chunks/bundle-DXRRGizV.js';
 import '../../sendbirdSelectors.js';
 import '../../ui/ReactionButton.js';
 import '../../ui/Loader.js';
-import '../../chunks/bundle-K3w8yQDQ.js';
-import '../../chunks/bundle-B3xAJZu1.js';
+import '../../chunks/bundle-BHK1eF5R.js';
+import '../../chunks/bundle-F5koPk19.js';
 import '../../ui/ReactionBadge.js';
 import '../../ui/BottomSheet.js';
 import '../../ui/UserListItem.js';
@@ -88,11 +89,11 @@ import '../../ui/Checkbox.js';
 import '../../ui/Tooltip.js';
 import '../../ui/TooltipWrapper.js';
 import '../../Message/context.js';
-import '../../chunks/bundle-C8uZHDqp.js';
+import '../../chunks/bundle-DofK8ySe.js';
 import '../../ui/MentionLabel.js';
 import '../../ui/LinkLabel.js';
 import '../../ui/TextButton.js';
-import '../../chunks/bundle-CO34LgiE.js';
+import '../../chunks/bundle-BqMHiKkl.js';
 import '../../ui/ProgressBar.js';
 import '../../VoicePlayer/useVoicePlayer.js';
 import '../../ui/PlaybackTime.js';
@@ -100,14 +101,17 @@ import '../../ui/PlaybackTime.js';
 function ThreadListItemContent(_a) {
     var _this = this;
     var _b, _c, _d, _e, _f;
-    var className = _a.className, userId = _a.userId, channel = _a.channel, message = _a.message, _g = _a.disabled, disabled = _g === void 0 ? false : _g, _h = _a.chainTop, chainTop = _h === void 0 ? false : _h, _j = _a.chainBottom, chainBottom = _j === void 0 ? false : _j, _k = _a.isMentionEnabled, isMentionEnabled = _k === void 0 ? false : _k, _l = _a.isReactionEnabled, isReactionEnabled = _l === void 0 ? false : _l, _m = _a.disableQuoteMessage, disableQuoteMessage = _m === void 0 ? false : _m, replyType = _a.replyType, nicknamesMap = _a.nicknamesMap, emojiContainer = _a.emojiContainer, showEdit = _a.showEdit, showRemove = _a.showRemove, showFileViewer = _a.showFileViewer, resendMessage = _a.resendMessage, toggleReaction = _a.toggleReaction, onReplyInThread = _a.onReplyInThread;
+    var className = _a.className, userId = _a.userId, channel = _a.channel, message = _a.message, _g = _a.chainTop, chainTop = _g === void 0 ? false : _g, _h = _a.chainBottom, chainBottom = _h === void 0 ? false : _h, _j = _a.isMentionEnabled, isMentionEnabled = _j === void 0 ? false : _j, _k = _a.isReactionEnabled, isReactionEnabled = _k === void 0 ? false : _k, _l = _a.disableQuoteMessage, disableQuoteMessage = _l === void 0 ? false : _l, replyType = _a.replyType, nicknamesMap = _a.nicknamesMap, emojiContainer = _a.emojiContainer, showEdit = _a.showEdit, showRemove = _a.showRemove, showFileViewer = _a.showFileViewer, resendMessage = _a.resendMessage, toggleReaction = _a.toggleReaction, onReplyInThread = _a.onReplyInThread, _m = _a.renderEmojiMenu, renderEmojiMenu = _m === void 0 ? function (props) { return React__default.createElement(MessageEmojiMenu, __assign({}, props)); } : _m, _o = _a.renderMessageMenu, renderMessageMenu = _o === void 0 ? function (props) { return React__default.createElement(MessageMenu, __assign({}, props)); } : _o;
     var messageTypes = getUIKitMessageTypes();
     var isMobile = useMediaQueryContext().isMobile;
     var dateLocale = useLocalization().dateLocale;
-    var _o = (useSendbirdStateContext === null || useSendbirdStateContext === void 0 ? void 0 : useSendbirdStateContext()) || {}, config = _o.config, eventHandlers = _o.eventHandlers;
+    var _p = (useSendbirdStateContext === null || useSendbirdStateContext === void 0 ? void 0 : useSendbirdStateContext()) || {}, config = _p.config, eventHandlers = _p.eventHandlers;
     var logger = config.logger;
     var onPressUserProfileHandler = (_b = eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.reaction) === null || _b === void 0 ? void 0 : _b.onPressUserProfile;
-    var _p = useState(false), supposedHover = _p[0], setSupposedHover = _p[1];
+    var isMenuMounted = useElementObserver("#".concat(getObservingId(message.messageId), ".").concat(MENU_OBSERVING_CLASS_NAME), [
+        document.getElementById(MENU_ROOT_ID),
+        document.getElementById(EMOJI_MENU_ROOT_ID),
+    ]);
     var _q = useContext(UserProfileContext), disableUserProfile = _q.disableUserProfile, renderUserProfile = _q.renderUserProfile;
     var _r = useThreadContext(), deleteMessage = _r.deleteMessage, onBeforeDownloadFileMessage = _r.onBeforeDownloadFileMessage;
     var avatarRef = useRef(null);
@@ -117,7 +121,7 @@ function ThreadListItemContent(_a) {
     var useReplying = !!((replyType === 'QUOTE_REPLY' || replyType === 'THREAD')
         && (message === null || message === void 0 ? void 0 : message.parentMessageId) && (message === null || message === void 0 ? void 0 : message.parentMessage)
         && !disableQuoteMessage);
-    var supposedHoverClassName = supposedHover ? 'sendbird-mouse-hover' : '';
+    var supposedHoverClassName = isMenuMounted ? 'sendbird-mouse-hover' : '';
     var isReactionEnabledInChannel = isReactionEnabled && !(channel === null || channel === void 0 ? void 0 : channel.isEphemeral);
     var isOgMessageEnabledInGroupChannel = channel.isGroupChannel() && config.groupChannel.enableOgtag;
     // Mobile
@@ -157,8 +161,25 @@ function ThreadListItemContent(_a) {
                     : (React__default.createElement(MenuItems, { parentRef: avatarRef, parentContainRef: avatarRef, closeDropdown: closeDropdown, style: { paddingTop: '0px', paddingBottom: '0px' } },
                         React__default.createElement(UserProfile, { user: message === null || message === void 0 ? void 0 : message.sender, onSuccess: closeDropdown })))); } })),
             (isByMe && !isMobile) && (React__default.createElement("div", { className: classnames('sendbird-thread-list-item-content-menu', isReactionEnabledInChannel && 'use-reaction', isByMe ? 'outgoing' : 'incoming', supposedHoverClassName) },
-                React__default.createElement(MessageMenu, { className: "sendbird-thread-list-item-content-menu__normal-menu", channel: channel, message: message, isByMe: isByMe, replyType: replyType, disabled: disabled, showEdit: showEdit, showRemove: showRemove, resendMessage: resendMessage, setSupposedHover: setSupposedHover, onReplyInThread: onReplyInThread, deleteMessage: deleteMessage }),
-                isReactionEnabledInChannel && (React__default.createElement(MessageEmojiMenu, { className: "sendbird-thread-list-item-content-menu__reaction-menu", message: message, userId: userId, emojiContainer: emojiContainer, toggleReaction: toggleReaction }))))),
+                renderMessageMenu({
+                    className: 'sendbird-thread-list-item-content-menu__normal-menu',
+                    channel: channel,
+                    message: message,
+                    isByMe: isByMe,
+                    replyType: replyType,
+                    showEdit: showEdit,
+                    showRemove: showRemove,
+                    resendMessage: resendMessage,
+                    onReplyInThread: onReplyInThread,
+                    deleteMessage: deleteMessage,
+                }),
+                isReactionEnabledInChannel && (React__default.createElement(React__default.Fragment, null, renderEmojiMenu({
+                    className: 'sendbird-thread-list-item-content-menu__reaction-menu',
+                    message: message,
+                    userId: userId,
+                    emojiContainer: emojiContainer,
+                    toggleReaction: toggleReaction,
+                })))))),
         React__default.createElement("div", __assign({ className: "sendbird-thread-list-item-content__middle" }, (isMobile) ? __assign({}, longPress) : {}),
             (!isByMe && !chainTop && !useReplying) && (React__default.createElement(Label, { className: "sendbird-thread-list-item-content__middle__sender-name", type: LabelTypography.CAPTION_2, color: LabelColors.ONBACKGROUND_2 }, ((_e = (_d = channel === null || channel === void 0 ? void 0 : channel.members) === null || _d === void 0 ? void 0 : _d.find(function (member) { var _a; return (member === null || member === void 0 ? void 0 : member.userId) === ((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId); })) === null || _e === void 0 ? void 0 : _e.nickname)
                 || getSenderName(message)
@@ -190,8 +211,24 @@ function ThreadListItemContent(_a) {
                     locale: dateLocale,
                 }))))),
         React__default.createElement("div", { className: classnames('sendbird-thread-list-item-content__right', chainTop && 'chain-top', isByMe ? 'outgoing' : 'incoming') }, (!isByMe && !isMobile) && (React__default.createElement("div", { className: "sendbird-thread-list-item-content-menu ".concat(supposedHoverClassName) },
-            isReactionEnabledInChannel && (React__default.createElement(MessageEmojiMenu, { className: "sendbird-thread-list-item-content-menu__reaction-menu", message: message, userId: userId, emojiContainer: emojiContainer, toggleReaction: toggleReaction })),
-            React__default.createElement(MessageMenu, { className: "sendbird-thread-list-item-content-menu__normal-menu", channel: channel, message: message, isByMe: isByMe, replyType: replyType, disabled: disabled, showRemove: showRemove, resendMessage: resendMessage, setSupposedHover: setSupposedHover, onReplyInThread: onReplyInThread, deleteMessage: deleteMessage })))),
+            isReactionEnabledInChannel && (renderEmojiMenu({
+                className: 'sendbird-thread-list-item-content-menu__reaction-menu',
+                message: message,
+                userId: userId,
+                emojiContainer: emojiContainer,
+                toggleReaction: toggleReaction,
+            })),
+            renderMessageMenu({
+                className: 'sendbird-thread-list-item-content-menu__normal-menu',
+                channel: channel,
+                message: message,
+                isByMe: isByMe,
+                replyType: replyType,
+                showRemove: showRemove,
+                resendMessage: resendMessage,
+                onReplyInThread: onReplyInThread,
+                deleteMessage: deleteMessage,
+            })))),
         showMobileMenu && (React__default.createElement(MobileMenu, { parentRef: mobileMenuRef, channel: channel, message: message, userId: userId, replyType: replyType, hideMenu: function () {
                 setShowMobileMenu(false);
             }, isReactionEnabled: isReactionEnabled, isByMe: isByMe, emojiContainer: emojiContainer, showEdit: showEdit, showRemove: showRemove, toggleReaction: toggleReaction, isOpenedFromThread: true, deleteMessage: deleteMessage, onDownloadClick: function (e) { return __awaiter(_this, void 0, void 0, function () {
@@ -226,7 +263,7 @@ function ThreadListItemContent(_a) {
 function ThreadListItem(_a) {
     var _this = this;
     var _b, _c, _d, _e;
-    var className = _a.className, message = _a.message, chainTop = _a.chainTop, chainBottom = _a.chainBottom, hasSeparator = _a.hasSeparator, renderCustomSeparator = _a.renderCustomSeparator, handleScroll = _a.handleScroll;
+    var className = _a.className, message = _a.message, chainTop = _a.chainTop, chainBottom = _a.chainBottom, hasSeparator = _a.hasSeparator, renderCustomSeparator = _a.renderCustomSeparator, handleScroll = _a.handleScroll, renderEmojiMenu = _a.renderEmojiMenu, renderMessageMenu = _a.renderMessageMenu;
     var _f = useSendbirdStateContext(), stores = _f.stores, config = _f.config;
     var isOnline = config.isOnline, userMention = config.userMention, logger = config.logger, groupChannel = config.groupChannel;
     var userId = (_c = (_b = stores === null || stores === void 0 ? void 0 : stores.userStore) === null || _b === void 0 ? void 0 : _b.user) === null || _c === void 0 ? void 0 : _c.userId;
@@ -354,7 +391,7 @@ function ThreadListItem(_a) {
     return (React__default.createElement("div", { ref: messageScrollRef, className: classnames('sendbird-thread-list-item', className), "data-testid": "sendbird-thread-list-item" },
         hasSeparator && (message === null || message === void 0 ? void 0 : message.createdAt) && (MemorizedSeparator || (React__default.createElement(DateSeparator, null,
             React__default.createElement(Label, { type: LabelTypography.CAPTION_2, color: LabelColors.ONBACKGROUND_2 }, format(message === null || message === void 0 ? void 0 : message.createdAt, stringSet.DATE_FORMAT__THREAD_LIST__DATE_SEPARATOR, { locale: dateLocale }))))),
-        React__default.createElement(ThreadListItemContent, { userId: userId, channel: currentChannel, message: message, chainTop: chainTop, chainBottom: chainBottom, isReactionEnabled: isReactionEnabled, isMentionEnabled: isMentionEnabled, disableQuoteMessage: true, replyType: replyType, nicknamesMap: nicknamesMap, emojiContainer: emojiContainer, resendMessage: resendMessage, showRemove: setShowRemove, showFileViewer: setShowFileViewer, toggleReaction: toggleReaction, showEdit: setShowEdit }),
+        React__default.createElement(ThreadListItemContent, { userId: userId, channel: currentChannel, message: message, chainTop: chainTop, chainBottom: chainBottom, isReactionEnabled: isReactionEnabled, isMentionEnabled: isMentionEnabled, disableQuoteMessage: true, replyType: replyType, nicknamesMap: nicknamesMap, emojiContainer: emojiContainer, resendMessage: resendMessage, showRemove: setShowRemove, showFileViewer: setShowFileViewer, toggleReaction: toggleReaction, showEdit: setShowEdit, renderEmojiMenu: renderEmojiMenu, renderMessageMenu: renderMessageMenu }),
         showRemove && (React__default.createElement(RemoveMessage, { message: message, onCancel: function () { return setShowRemove(false); } })),
         showFileViewer && (React__default.createElement(FileViewer, { message: message, isByMe: ((_e = message === null || message === void 0 ? void 0 : message.sender) === null || _e === void 0 ? void 0 : _e.userId) === userId, onClose: function () { return setShowFileViewer(false); }, onDelete: function () {
                 deleteMessage(message);

package/Thread/components/ThreadListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThreadListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ThreadListItem.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}