@sendbird/uikit-react 3.8.1 → 3.9.0-rc.0

package/ui/ImageRenderer.js

@@ -1,4 +1,4 @@
-import { a as __spreadArray, _ as __assign } from '../chunks/bundle-AVOWwEQ4.js';
+import { a as __spreadArray, _ as __assign } from '../chunks/bundle-WOkl3_Qa.js';
 import React__default, { useMemo, useState } from 'react';
 
 var numberToPx = (function (value) {

package/ui/Input.js

@@ -1,7 +1,7 @@
 import React__default, { useState } from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-lDOyfwhb.js';
-import '../chunks/bundle-AVOWwEQ4.js';
-import '../chunks/bundle-4zdVdGkr.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-XASWNrfg.js';
+import '../chunks/bundle-WOkl3_Qa.js';
+import '../chunks/bundle-1Ni9PXLu.js';
 
 var InputLabel = function (_a) {
     var children = _a.children;

package/ui/Label.js

@@ -1,5 +1,5 @@
-import '../chunks/bundle-AVOWwEQ4.js';
+import '../chunks/bundle-WOkl3_Qa.js';
 import 'react';
-export { b as LabelColors, c as LabelStringSet, a as LabelTypography, L as default } from '../chunks/bundle-lDOyfwhb.js';
-import '../chunks/bundle-4zdVdGkr.js';
+export { b as LabelColors, c as LabelStringSet, a as LabelTypography, L as default } from '../chunks/bundle-XASWNrfg.js';
+import '../chunks/bundle-1Ni9PXLu.js';
 //# sourceMappingURL=Label.js.map

package/ui/LinkLabel.js

@@ -1,7 +1,7 @@
-import { a as __spreadArray } from '../chunks/bundle-AVOWwEQ4.js';
+import { a as __spreadArray } from '../chunks/bundle-WOkl3_Qa.js';
 import React__default from 'react';
-import { L as Label, d as changeColorToClassName, a as LabelTypography, b as LabelColors } from '../chunks/bundle-lDOyfwhb.js';
-import '../chunks/bundle-4zdVdGkr.js';
+import { L as Label, d as changeColorToClassName, a as LabelTypography, b as LabelColors } from '../chunks/bundle-XASWNrfg.js';
+import '../chunks/bundle-1Ni9PXLu.js';
 
 var http = /https?:\/\//;
 function LinkLabel(_a) {

package/ui/Loader.js

@@ -1,7 +1,7 @@
-import { a as __spreadArray } from '../chunks/bundle-AVOWwEQ4.js';
+import { a as __spreadArray } from '../chunks/bundle-WOkl3_Qa.js';
 import React__default from 'react';
 import Icon, { IconTypes } from './Icon.js';
-import '../chunks/bundle-FQAabli1.js';
+import '../chunks/bundle-CYvmOLIw.js';
 
 function Loader(_a) {
     var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.width, width = _c === void 0 ? '26px' : _c, _d = _a.height, height = _d === void 0 ? '26px' : _d, children = _a.children;

package/ui/MentionLabel.js

@@ -1,24 +1,25 @@
 import React__default, { useRef, useState, useCallback } from 'react';
 import ContextMenu, { MenuItems } from './ContextMenu.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-lDOyfwhb.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-XASWNrfg.js';
 import UserProfile from './UserProfile.js';
 import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
-import '../chunks/bundle-AVOWwEQ4.js';
+import '../chunks/bundle-WOkl3_Qa.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../chunks/bundle-iPDlyZXo.js';
-import '../chunks/bundle-OoXqnc0l.js';
+import '../chunks/bundle-P0Em254T.js';
+import '../chunks/bundle-MY-lEq_u.js';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-0BwB1B7t.js';
-import '../chunks/bundle-4zdVdGkr.js';
-import '../chunks/bundle-GqUhOzeC.js';
-import '../chunks/bundle-ltzZCtkR.js';
-import '../chunks/bundle-G3cS-S1W.js';
+import '../chunks/bundle-Y1x4CZpy.js';
+import '../chunks/bundle-1Ni9PXLu.js';
+import '../chunks/bundle-XQrrPHzm.js';
+import '../chunks/bundle-zYQpPgUz.js';
+import '../chunks/bundle-lQUkPvfG.js';
 import '../sendbirdSelectors.js';
-import '../chunks/bundle--Hrow3p-.js';
-import '../chunks/bundle-FQAabli1.js';
-import '../chunks/bundle-x3udz03j.js';
+import '../chunks/bundle-7qnTBkFI.js';
+import '../chunks/bundle-CYvmOLIw.js';
+import '../chunks/bundle--vRpTESf.js';
 import './ImageRenderer.js';
+import '../chunks/bundle-lWgUjnZ7.js';
 import './Icon.js';
 import './Button.js';
 import '../withSendbird.js';

package/ui/MentionLabel.js.map

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

package/ui/MentionUserLabel.js

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import { M as MENTION_USER_LABEL_CLASSNAME } from '../chunks/bundle-0plqkdfC.js';
+import { M as MENTION_USER_LABEL_CLASSNAME } from '../chunks/bundle-ohkKzbFZ.js';
 
 function MentionUserLabel(_a) {
     var _b = _a.className, className = _b === void 0 ? '' : _b, children = _a.children, _c = _a.isReverse, isReverse = _c === void 0 ? false : _c, color = _a.color, userId = _a.userId;

package/ui/MessageContent.js

@@ -1,126 +1,121 @@
-import { _ as __assign } from '../chunks/bundle-AVOWwEQ4.js';
+import { _ as __assign } from '../chunks/bundle-WOkl3_Qa.js';
 import React__default, { useRef, useContext, useState } from 'react';
-import { f as format } from '../chunks/bundle-LPkaaUo4.js';
-import { M as MessageStatus } from '../chunks/bundle-EZnDY3Tc.js';
-import MessageItemMenu from './MessageItemMenu.js';
-import MessageItemReactionMenu from './MessageItemReactionMenu.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-lDOyfwhb.js';
+import { f as format } from '../chunks/bundle-VELRmCgM.js';
+import { M as MessageStatus } from '../chunks/bundle-0wRb_ox9.js';
+import { MessageMenu } from './MessageItemMenu.js';
+import { MessageEmojiMenu } from './MessageItemReactionMenu.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-XASWNrfg.js';
 import EmojiReactions from './EmojiReactions.js';
 import AdminMessage from './AdminMessage.js';
 import QuoteMessage from './QuoteMessage.js';
-import { n as getClassName, N as isSendableMessage, w as getUIKitMessageTypes, I as isOGMessage, J as isTextMessage, t as getUIKitMessageType, b as isMultipleFilesMessage, i as isVoiceMessage, r as isThumbnailMessage, h as getSenderName } from '../chunks/bundle-OoXqnc0l.js';
-import { u as useLocalization } from '../chunks/bundle-GqUhOzeC.js';
+import { N as isSendableMessage, w as getUIKitMessageTypes, I as isOGMessage, J as isTextMessage, t as getUIKitMessageType, b as isMultipleFilesMessage, i as isVoiceMessage, r as isThumbnailMessage, h as getSenderName, n as getClassName } from '../chunks/bundle-MY-lEq_u.js';
+import { u as useLocalization } from '../chunks/bundle-XQrrPHzm.js';
 import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
-import { u as useLongPress } from '../chunks/bundle-9uR-6efo.js';
-import { M as MobileMenu } from '../chunks/bundle-7-9WA7QK.js';
-import { u as useMediaQueryContext } from '../chunks/bundle-QKq7b-WA.js';
+import { u as useLongPress } from '../chunks/bundle-5r5nUzch.js';
+import { M as MobileMenu } from '../chunks/bundle-tDRC-k6Z.js';
+import { u as useMediaQueryContext } from '../chunks/bundle-S6yFiUrY.js';
 import ThreadReplies from './ThreadReplies.js';
-import { T as ThreadReplySelectType } from '../chunks/bundle-JGFwpJZJ.js';
-import { n as noop } from '../chunks/bundle-FQAabli1.js';
+import { T as ThreadReplySelectType } from '../chunks/bundle-GIZVQ7W4.js';
+import { n as noop } from '../chunks/bundle-CYvmOLIw.js';
 import ContextMenu, { MenuItems } from './ContextMenu.js';
-import { A as Avatar } from '../chunks/bundle-x3udz03j.js';
+import { A as Avatar } from '../chunks/bundle--vRpTESf.js';
 import UserProfile from './UserProfile.js';
-import { a as UserProfileContext } from '../chunks/bundle-G3cS-S1W.js';
+import { a as UserProfileContext } from '../chunks/bundle-lQUkPvfG.js';
 import OGMessageItemBody from './OGMessageItemBody.js';
 import TextMessageItemBody from './TextMessageItemBody.js';
 import FileMessageItemBody from './FileMessageItemBody.js';
-import { u as useThreadMessageKindKeySelector, a as useStatefulFileInfoList, M as MultipleFilesMessageItemBody } from '../chunks/bundle-fbmUkwMs.js';
+import { u as useThreadMessageKindKeySelector, a as useStatefulFileInfoList, M as MultipleFilesMessageItemBody } from '../chunks/bundle-jg-ROmIh.js';
 import { VoiceMessageItemBody } from './VoiceMessageItemBody.js';
 import ThumbnailMessageItemBody from './ThumbnailMessageItemBody.js';
 import UnknownMessageItemBody from './UnknownMessageItemBody.js';
-import { K } from '../chunks/bundle-0BwB1B7t.js';
-import '../chunks/bundle-ltzZCtkR.js';
+import { K } from '../chunks/bundle-Y1x4CZpy.js';
+import '../chunks/bundle-zYQpPgUz.js';
 import './Icon.js';
 import './Loader.js';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-J7om32yx.js';
-import '../chunks/bundle-ZZuBYhV1.js';
+import '../chunks/bundle-IY-fHnHj.js';
+import '../chunks/bundle-WwAytaYU.js';
 import './IconButton.js';
-import '../chunks/bundle-1uIyPhfL.js';
-import '../chunks/bundle-YwxAxKwQ.js';
-import '../chunks/bundle-fQ2M7pMu.js';
+import '../chunks/bundle-svI6ejWT.js';
+import '../chunks/bundle-foFhJqNy.js';
+import '../chunks/bundle-gxrNtcmM.js';
 import '@sendbird/chat/message';
-import '../chunks/bundle-PK1dgVwp.js';
-import '../chunks/bundle-3oeQjqp5.js';
+import '../chunks/bundle-TIBUJEGt.js';
+import '../chunks/bundle-Ahnepylk.js';
 import '@sendbird/chat/groupChannel';
-import '../chunks/bundle-iPDlyZXo.js';
+import '../chunks/bundle-P0Em254T.js';
 import '../Channel/hooks/useInitialMessagesFetch.js';
-import '../chunks/bundle--Hrow3p-.js';
-import '../chunks/bundle-UjngV2Kp.js';
-import '../chunks/bundle-rX7vrYxX.js';
-import '../chunks/bundle-zch8NdOh.js';
+import '../chunks/bundle-7qnTBkFI.js';
+import '../chunks/bundle-pfoFNefK.js';
+import '../chunks/bundle-_oSqlLwH.js';
+import '../chunks/bundle-WrbACLdS.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../chunks/bundle-4zdVdGkr.js';
+import '../chunks/bundle-1Ni9PXLu.js';
 import '../withSendbird.js';
 import './ImageRenderer.js';
 import './ReactionButton.js';
 import './ReactionBadge.js';
 import './BottomSheet.js';
 import '../hooks/useModal.js';
-import '../chunks/bundle-gYyMZyCn.js';
+import '../chunks/bundle-m6y5OeVq.js';
 import './Button.js';
 import './UserListItem.js';
 import './MutedAvatarOverlay.js';
 import './Checkbox.js';
+import '../chunks/bundle-lWgUjnZ7.js';
 import '../sendbirdSelectors.js';
 import './Tooltip.js';
 import './TooltipWrapper.js';
 import '../Message/context.js';
-import '../chunks/bundle-zqQY3xFx.js';
-import '../chunks/bundle-jUubN32Z.js';
-import '../chunks/bundle-kPOY92Qs.js';
+import '../chunks/bundle-sieNQ6Gk.js';
+import '../chunks/bundle-Ly8vUhTn.js';
+import '../chunks/bundle-m5aRS8p_.js';
 import './MentionLabel.js';
 import './LinkLabel.js';
-import '../chunks/bundle-_nlJSeuz.js';
-import '../chunks/bundle-kaJaYGwQ.js';
+import '../chunks/bundle-bSloPXLn.js';
+import '../chunks/bundle-L5shvyy2.js';
 import './TextButton.js';
-import '../chunks/bundle-06CfHADE.js';
-import '../chunks/bundle-KaSW5xxP.js';
+import '../chunks/bundle-H2gT5GjQ.js';
+import '../chunks/bundle-wiEDSdp9.js';
 import './ProgressBar.js';
 import '../VoicePlayer/useVoicePlayer.js';
-import '../chunks/bundle-kBtT3HBi.js';
+import '../chunks/bundle-_X0TUlY4.js';
 import '../VoiceRecorder/context.js';
 import './PlaybackTime.js';
 
 function MessageProfile(props) {
+    var message = props.message, channel = props.channel, userId = props.userId, _a = props.chainBottom, chainBottom = _a === void 0 ? false : _a, isByMe = props.isByMe, displayThreadReplies = props.displayThreadReplies;
     var avatarRef = useRef(null);
-    var message = props.message, channel = props.channel, userId = props.userId, _a = props.disabled, disabled = _a === void 0 ? false : _a, _b = props.chainBottom, chainBottom = _b === void 0 ? false : _b, replyType = props.replyType, threadReplySelectType = props.threadReplySelectType, emojiContainer = props.emojiContainer, scrollToMessage = props.scrollToMessage, showEdit = props.showEdit, showRemove = props.showRemove, resendMessage = props.resendMessage, toggleReaction = props.toggleReaction, setQuoteMessage = props.setQuoteMessage, onReplyInThread = props.onReplyInThread, setSupposedHover = props.setSupposedHover, isMobile = props.isMobile, isReactionEnabledInChannel = props.isReactionEnabledInChannel, isReactionEnabledClassName = props.isReactionEnabledClassName, isByMe = props.isByMe, isByMeClassName = props.isByMeClassName, useReplyingClassName = props.useReplyingClassName, displayThreadReplies = props.displayThreadReplies, supposedHoverClassName = props.supposedHoverClassName;
-    var _c = useContext(UserProfileContext), disableUserProfile = _c.disableUserProfile, renderUserProfile = _c.renderUserProfile;
-    return (React__default.createElement("div", { className: getClassName(['sendbird-message-content__left', isReactionEnabledClassName, isByMeClassName, useReplyingClassName]) },
-        (!isByMe && !chainBottom && isSendableMessage(message)) && (
-        /** user profile */
-        React__default.createElement(ContextMenu, { menuTrigger: function (toggleDropdown) {
-                var _a, _b;
-                return (React__default.createElement(Avatar, { className: "sendbird-message-content__left__avatar ".concat(displayThreadReplies ? 'use-thread-replies' : ''), src: ((_b = (_a = channel === null || channel === void 0 ? void 0 : channel.members) === null || _a === void 0 ? void 0 : _a.find(function (member) { return (member === null || member === void 0 ? void 0 : member.userId) === message.sender.userId; })) === null || _b === void 0 ? void 0 : _b.profileUrl) || message.sender.profileUrl || '', 
-                    // TODO: Divide getting profileUrl logic to utils
-                    ref: avatarRef, width: "28px", height: "28px", onClick: function () { if (!disableUserProfile)
-                        toggleDropdown(); } }));
-            }, menuItems: function (closeDropdown) { return (React__default.createElement(MenuItems
+    var _b = useContext(UserProfileContext), disableUserProfile = _b.disableUserProfile, renderUserProfile = _b.renderUserProfile;
+    if (isByMe || chainBottom || !isSendableMessage(message)) {
+        return null;
+    }
+    return (React__default.createElement(ContextMenu, { menuTrigger: function (toggleDropdown) {
+            var _a, _b;
+            return (React__default.createElement(Avatar, { className: "sendbird-message-content__left__avatar ".concat(displayThreadReplies ? 'use-thread-replies' : ''), src: ((_b = (_a = channel === null || channel === void 0 ? void 0 : channel.members) === null || _a === void 0 ? void 0 : _a.find(function (member) { return (member === null || member === void 0 ? void 0 : member.userId) === message.sender.userId; })) === null || _b === void 0 ? void 0 : _b.profileUrl)
+                    || message.sender.profileUrl
+                    || '', 
+                // TODO: Divide getting profileUrl logic to utils
+                ref: avatarRef, width: "28px", height: "28px", onClick: function () {
+                    if (!disableUserProfile)
+                        toggleDropdown();
+                } }));
+        }, menuItems: function (closeDropdown) { return (React__default.createElement(MenuItems
+        /**
+         * parentRef: For catching location(x, y) of MenuItems
+         * parentContainRef: For toggling more options(menus & reactions)
+         */
+        , { 
             /**
-            * parentRef: For catching location(x, y) of MenuItems
-            * parentContainRef: For toggling more options(menus & reactions)
-            */
-            , { 
-                /**
-                * parentRef: For catching location(x, y) of MenuItems
-                * parentContainRef: For toggling more options(menus & reactions)
-                */
-                parentRef: avatarRef, parentContainRef: avatarRef, closeDropdown: closeDropdown, style: { paddingTop: '0px', paddingBottom: '0px' } }, renderUserProfile
-                ? renderUserProfile({ user: message.sender, close: closeDropdown, currentUserId: userId })
-                : (React__default.createElement(UserProfile, { user: message.sender, onSuccess: closeDropdown })))); } })),
-        isByMe && !isMobile && (React__default.createElement("div", { className: getClassName(['sendbird-message-content-menu', isReactionEnabledClassName, supposedHoverClassName, isByMeClassName]) },
-            React__default.createElement(MessageItemMenu, { channel: channel, message: message, isByMe: isByMe, replyType: replyType, disabled: disabled, showEdit: showEdit, showRemove: showRemove, resendMessage: resendMessage, setQuoteMessage: setQuoteMessage, setSupposedHover: setSupposedHover, onReplyInThread: function (_a) {
-                    var _b;
-                    var message = _a.message;
-                    if (threadReplySelectType === ThreadReplySelectType.THREAD) {
-                        onReplyInThread({ message: message });
-                    }
-                    else if (threadReplySelectType === ThreadReplySelectType.PARENT) {
-                        scrollToMessage((_b = message.parentMessage) === null || _b === void 0 ? void 0 : _b.createdAt, message.parentMessageId);
-                    }
-                } }),
-            isReactionEnabledInChannel && (React__default.createElement(MessageItemReactionMenu, { message: message, userId: userId, emojiContainer: emojiContainer, toggleReaction: toggleReaction, setSupposedHover: setSupposedHover }))))));
+             * parentRef: For catching location(x, y) of MenuItems
+             * parentContainRef: For toggling more options(menus & reactions)
+             */
+            parentRef: avatarRef, parentContainRef: avatarRef, closeDropdown: closeDropdown, style: { paddingTop: '0px', paddingBottom: '0px' } }, renderUserProfile ? (renderUserProfile({
+            user: message.sender,
+            close: closeDropdown,
+            currentUserId: userId,
+        })) : (React__default.createElement(UserProfile, { user: message.sender, onSuccess: closeDropdown })))); } }));
 }
 
 var MESSAGE_ITEM_BODY_CLASSNAME = 'sendbird-message-content__middle__message-item-body';
@@ -171,15 +166,15 @@ function MessageContent(props) {
     // Public props for customization
     _s = props.renderSenderProfile, 
     // Public props for customization
-    renderSenderProfile = _s === void 0 ? function (props) { return (React__default.createElement(MessageProfile, __assign({}, props))); } : _s, _t = props.renderMessageBody, renderMessageBody = _t === void 0 ? function (props) { return (React__default.createElement(MessageBody, __assign({}, props))); } : _t, _u = props.renderMessageHeader, renderMessageHeader = _u === void 0 ? function (props) { return (React__default.createElement(MessageHeader, __assign({}, props))); } : _u;
+    renderSenderProfile = _s === void 0 ? function (props) { return (React__default.createElement(MessageProfile, __assign({}, props))); } : _s, _t = props.renderMessageBody, renderMessageBody = _t === void 0 ? function (props) { return (React__default.createElement(MessageBody, __assign({}, props))); } : _t, _u = props.renderMessageHeader, renderMessageHeader = _u === void 0 ? function (props) { return (React__default.createElement(MessageHeader, __assign({}, props))); } : _u, _v = props.renderMessageMenu, renderMessageMenu = _v === void 0 ? function (props) { return (React__default.createElement(MessageMenu, __assign({}, props))); } : _v, _w = props.renderEmojiMenu, renderEmojiMenu = _w === void 0 ? function (props) { return (React__default.createElement(MessageEmojiMenu, __assign({}, props))); } : _w, _x = props.renderEmojiReactions, renderEmojiReactions = _x === void 0 ? function (props) { return (React__default.createElement(EmojiReactions, __assign({}, props))); } : _x;
     var dateLocale = useLocalization().dateLocale;
-    var _v = (useSendbirdStateContext === null || useSendbirdStateContext === void 0 ? void 0 : useSendbirdStateContext()) || {}, config = _v.config, eventHandlers = _v.eventHandlers;
+    var _y = (useSendbirdStateContext === null || useSendbirdStateContext === void 0 ? void 0 : useSendbirdStateContext()) || {}, config = _y.config, eventHandlers = _y.eventHandlers;
     var onPressUserProfileHandler = (_a = eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.reaction) === null || _a === void 0 ? void 0 : _a.onPressUserProfile;
     var contentRef = useRef(null);
     var isMobile = useMediaQueryContext().isMobile;
-    var _w = useState(false), showMenu = _w[0], setShowMenu = _w[1];
-    var _x = useState(false), mouseHover = _x[0], setMouseHover = _x[1];
-    var _y = useState(false), supposedHover = _y[0], setSupposedHover = _y[1];
+    var _z = useState(false), showMenu = _z[0], setShowMenu = _z[1];
+    var _0 = useState(false), mouseHover = _0[0], setMouseHover = _0[1];
+    var _1 = useState(false), supposedHover = _1[0], setSupposedHover = _1[1];
     var isByMe = (userId === ((_b = message === null || message === void 0 ? void 0 : message.sender) === null || _b === void 0 ? void 0 : _b.userId))
         || ((message === null || message === void 0 ? void 0 : message.sendingStatus) === 'pending')
         || ((message === null || message === void 0 ? void 0 : message.sendingStatus) === 'failed');
@@ -214,7 +209,38 @@ function MessageContent(props) {
         return (React__default.createElement(AdminMessage, { message: message }));
     }
     return (React__default.createElement("div", { className: getClassName([className, 'sendbird-message-content', isByMeClassName]), onMouseOver: function () { return setMouseHover(true); }, onMouseLeave: function () { return setMouseHover(false); } },
-        renderSenderProfile(__assign(__assign({}, props), { setSupposedHover: setSupposedHover, isMobile: isMobile, isReactionEnabledInChannel: isReactionEnabledInChannel, isReactionEnabledClassName: isReactionEnabledClassName, isByMe: isByMe, isByMeClassName: isByMeClassName, useReplyingClassName: useReplyingClassName, displayThreadReplies: displayThreadReplies, supposedHoverClassName: supposedHoverClassName })),
+        React__default.createElement("div", { className: getClassName(['sendbird-message-content__left', isReactionEnabledClassName, isByMeClassName, useReplyingClassName]) },
+            renderSenderProfile(__assign(__assign({}, props), { isByMe: isByMe, displayThreadReplies: displayThreadReplies })),
+            isByMe && !isMobile && (React__default.createElement("div", { className: getClassName(['sendbird-message-content-menu', isReactionEnabledClassName, supposedHoverClassName, isByMeClassName]) },
+                renderMessageMenu({
+                    channel: channel,
+                    message: message,
+                    isByMe: isByMe,
+                    replyType: replyType,
+                    disabled: disabled,
+                    showEdit: showEdit,
+                    showRemove: showRemove,
+                    resendMessage: resendMessage,
+                    setQuoteMessage: setQuoteMessage,
+                    setSupposedHover: setSupposedHover,
+                    onReplyInThread: function (_a) {
+                        var _b;
+                        var message = _a.message;
+                        if (threadReplySelectType === ThreadReplySelectType.THREAD) {
+                            onReplyInThread({ message: message });
+                        }
+                        else if (threadReplySelectType === ThreadReplySelectType.PARENT) {
+                            scrollToMessage((_b = message.parentMessage) === null || _b === void 0 ? void 0 : _b.createdAt, message.parentMessageId);
+                        }
+                    },
+                }),
+                isReactionEnabledInChannel && (renderEmojiMenu({
+                    message: message,
+                    userId: userId,
+                    emojiContainer: emojiContainer,
+                    toggleReaction: toggleReaction,
+                    setSupposedHover: setSupposedHover,
+                }))))),
         React__default.createElement("div", __assign({ className: 'sendbird-message-content__middle' }, (isMobile ? __assign({}, longPress) : {}), { ref: contentRef }),
             !isByMe && !chainTop && !useReplying && renderMessageHeader(props),
             (useReplying) ? (React__default.createElement("div", { className: getClassName(['sendbird-message-content__middle__quote-message', isByMe ? 'outgoing' : 'incoming', useReplyingClassName]) },
@@ -250,15 +276,41 @@ function MessageContent(props) {
                             : (!isByMe || isThumbnailMessage(message) || isOGMessage(message))
                                 ? '' : 'primary',
                         mouseHover ? 'mouse-hover' : '',
-                    ]) },
-                    React__default.createElement(EmojiReactions, { userId: userId, message: message, channel: channel, isByMe: isByMe, emojiContainer: emojiContainer, memberNicknamesMap: nicknamesMap, toggleReaction: toggleReaction, onPressUserProfile: onPressUserProfileHandler }))),
+                    ]) }, renderEmojiReactions({
+                    userId: userId,
+                    message: message,
+                    channel: channel,
+                    isByMe: isByMe,
+                    emojiContainer: emojiContainer,
+                    memberNicknamesMap: nicknamesMap,
+                    toggleReaction: toggleReaction,
+                    onPressUserProfile: onPressUserProfileHandler,
+                }))),
                 (!isByMe && !chainBottom) && (React__default.createElement(Label, { className: getClassName(['sendbird-message-content__middle__body-container__created-at', 'right', supposedHoverClassName]), type: LabelTypography.CAPTION_3, color: LabelColors.ONBACKGROUND_2 }, format((message === null || message === void 0 ? void 0 : message.createdAt) || 0, 'p', {
                     locale: dateLocale,
                 })))),
             displayThreadReplies && (React__default.createElement(ThreadReplies, { className: "sendbird-message-content__middle__thread-replies", threadInfo: message === null || message === void 0 ? void 0 : message.threadInfo, onClick: function () { return onReplyInThread === null || onReplyInThread === void 0 ? void 0 : onReplyInThread({ message: message }); } }))),
         React__default.createElement("div", { className: getClassName(['sendbird-message-content__right', chainTopClassName, isReactionEnabledClassName, useReplyingClassName]) }, !isByMe && !isMobile && (React__default.createElement("div", { className: getClassName(['sendbird-message-content-menu', chainTopClassName, supposedHoverClassName, isByMeClassName]) },
-            isReactionEnabledInChannel && (React__default.createElement(MessageItemReactionMenu, { className: "sendbird-message-content-menu__reaction-menu", message: message, userId: userId, emojiContainer: emojiContainer, toggleReaction: toggleReaction, setSupposedHover: setSupposedHover })),
-            React__default.createElement(MessageItemMenu, { className: "sendbird-message-content-menu__normal-menu", channel: channel, message: message, isByMe: isByMe, replyType: replyType, disabled: disabled, showRemove: showRemove, resendMessage: resendMessage, setQuoteMessage: setQuoteMessage, setSupposedHover: setSupposedHover, onReplyInThread: function (_a) {
+            isReactionEnabledInChannel && (renderEmojiMenu({
+                className: 'sendbird-message-content-menu__reaction-menu',
+                message: message,
+                userId: userId,
+                emojiContainer: emojiContainer,
+                toggleReaction: toggleReaction,
+                setSupposedHover: setSupposedHover,
+            })),
+            renderMessageMenu({
+                className: 'sendbird-message-content-menu__normal-menu',
+                channel: channel,
+                message: message,
+                isByMe: isByMe,
+                replyType: replyType,
+                disabled: disabled,
+                showRemove: showRemove,
+                resendMessage: resendMessage,
+                setQuoteMessage: setQuoteMessage,
+                setSupposedHover: setSupposedHover,
+                onReplyInThread: function (_a) {
                     var _b;
                     var message = _a.message;
                     if (threadReplySelectType === ThreadReplySelectType.THREAD) {
@@ -267,7 +319,8 @@ function MessageContent(props) {
                     else if (threadReplySelectType === ThreadReplySelectType.PARENT) {
                         scrollToMessage((_b = message.parentMessage) === null || _b === void 0 ? void 0 : _b.createdAt, message.parentMessageId);
                     }
-                } })))),
+                },
+            })))),
         showMenu && (((_j = message === null || message === void 0 ? void 0 : message.isUserMessage) === null || _j === void 0 ? void 0 : _j.call(message)) || ((_k = message === null || message === void 0 ? void 0 : message.isFileMessage) === null || _k === void 0 ? void 0 : _k.call(message)) || ((_l = message === null || message === void 0 ? void 0 : message.isMultipleFilesMessage) === null || _l === void 0 ? void 0 : _l.call(message))) && (React__default.createElement(MobileMenu, { parentRef: contentRef, channel: channel, hideMenu: function () { setShowMenu(false); }, message: message, isReactionEnabled: isReactionEnabledInChannel, isByMe: isByMe, userId: userId, replyType: replyType, disabled: disabled, showRemove: showRemove, emojiContainer: emojiContainer, resendMessage: resendMessage, deleteMessage: deleteMessage, setQuoteMessage: setQuoteMessage, toggleReaction: toggleReaction, showEdit: showEdit, onReplyInThread: function (_a) {
                 var _b;
                 var message = _a.message;

package/ui/MessageContent.js.map

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

package/ui/MessageInput/hooks/usePaste.js

@@ -1,8 +1,8 @@
 import 'react';
 import 'dompurify';
-export { u as default, u as usePaste } from '../../../chunks/bundle-62G-DTVs.js';
-import '../../../chunks/bundle-AVOWwEQ4.js';
-import '../../../chunks/bundle-0plqkdfC.js';
-import '../../../chunks/bundle-kaJaYGwQ.js';
-import '../../../chunks/bundle-_nlJSeuz.js';
+export { u as default, u as usePaste } from '../../../chunks/bundle-avof2r-9.js';
+import '../../../chunks/bundle-WOkl3_Qa.js';
+import '../../../chunks/bundle-ohkKzbFZ.js';
+import '../../../chunks/bundle-L5shvyy2.js';
+import '../../../chunks/bundle-bSloPXLn.js';
 //# sourceMappingURL=usePaste.js.map

package/ui/MessageInput.js

@@ -1,24 +1,24 @@
-import { _ as __assign, a as __spreadArray } from '../chunks/bundle-AVOWwEQ4.js';
+import { _ as __assign, a as __spreadArray } from '../chunks/bundle-WOkl3_Qa.js';
 import React__default, { useRef, useState, useMemo, useEffect, useCallback } from 'react';
-import { N as NodeTypes, M as MessageInputKeys, a as NodeNames } from '../chunks/bundle-tK1qgIcU.js';
-import { U as USER_MENTION_TEMP_CHAR } from '../chunks/bundle-JGFwpJZJ.js';
+import { N as NodeTypes, M as MessageInputKeys, a as NodeNames } from '../chunks/bundle-CLwn_FRg.js';
+import { U as USER_MENTION_TEMP_CHAR } from '../chunks/bundle-GIZVQ7W4.js';
 import IconButton from './IconButton.js';
 import Button, { ButtonTypes, ButtonSizes } from './Button.js';
-import { r as renderToString, s as sanitizeString, n as nodeListToArray, u as usePaste, i as isChannelTypeSupportsMultipleFilesMessage } from '../chunks/bundle-62G-DTVs.js';
+import { r as renderToString, s as sanitizeString, n as nodeListToArray, u as usePaste, i as isChannelTypeSupportsMultipleFilesMessage } from '../chunks/bundle-avof2r-9.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-lDOyfwhb.js';
-import { u as useLocalization } from '../chunks/bundle-GqUhOzeC.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-XASWNrfg.js';
+import { u as useLocalization } from '../chunks/bundle-XQrrPHzm.js';
 import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
-import { D as arrayEqual, n as getClassName, E as getMimeTypesUIKitAccepts } from '../chunks/bundle-OoXqnc0l.js';
-import { t as tokenizeMessage, T as TOKEN_TYPES, U as USER_MENTION_PREFIX } from '../chunks/bundle-kPOY92Qs.js';
-import { K } from '../chunks/bundle-0BwB1B7t.js';
+import { D as arrayEqual, n as getClassName, E as getMimeTypesUIKitAccepts } from '../chunks/bundle-MY-lEq_u.js';
+import { t as tokenizeMessage, T as TOKEN_TYPES, U as USER_MENTION_PREFIX } from '../chunks/bundle-m5aRS8p_.js';
+import { K } from '../chunks/bundle-Y1x4CZpy.js';
 import 'dompurify';
-import '../chunks/bundle-0plqkdfC.js';
-import '../chunks/bundle-kaJaYGwQ.js';
-import '../chunks/bundle-_nlJSeuz.js';
-import '../chunks/bundle-FQAabli1.js';
-import '../chunks/bundle-4zdVdGkr.js';
-import '../chunks/bundle-ltzZCtkR.js';
+import '../chunks/bundle-ohkKzbFZ.js';
+import '../chunks/bundle-L5shvyy2.js';
+import '../chunks/bundle-bSloPXLn.js';
+import '../chunks/bundle-CYvmOLIw.js';
+import '../chunks/bundle-1Ni9PXLu.js';
+import '../chunks/bundle-zYQpPgUz.js';
 import '../withSendbird.js';
 import '../utils/message/getOutgoingMessageState.js';
 

package/ui/MessageItemMenu.js

@@ -2,37 +2,37 @@ import React__default, { useContext, useRef } from 'react';
 import ContextMenu, { MenuItems, MenuItem } from './ContextMenu.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import IconButton from './IconButton.js';
-import { j as isUserMessage, k as isSentMessage, l as isFailedMessage, m as isPendingMessage, n as getClassName, o as copyToClipboard } from '../chunks/bundle-OoXqnc0l.js';
-import { L as LocalizationContext } from '../chunks/bundle-GqUhOzeC.js';
-import { R as Role } from '../chunks/bundle-1uIyPhfL.js';
-import { u as useChannelContext } from '../chunks/bundle-YwxAxKwQ.js';
-import '../chunks/bundle-AVOWwEQ4.js';
+import { j as isUserMessage, k as isSentMessage, l as isFailedMessage, m as isPendingMessage, n as getClassName, o as copyToClipboard } from '../chunks/bundle-MY-lEq_u.js';
+import { L as LocalizationContext } from '../chunks/bundle-XQrrPHzm.js';
+import { R as Role } from '../chunks/bundle-svI6ejWT.js';
+import { u as useChannelContext } from '../chunks/bundle-foFhJqNy.js';
+import '../chunks/bundle-WOkl3_Qa.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../chunks/bundle-iPDlyZXo.js';
-import '../chunks/bundle-lDOyfwhb.js';
-import '../chunks/bundle-4zdVdGkr.js';
-import '../chunks/bundle-FQAabli1.js';
+import '../chunks/bundle-P0Em254T.js';
+import '../chunks/bundle-XASWNrfg.js';
+import '../chunks/bundle-1Ni9PXLu.js';
+import '../chunks/bundle-CYvmOLIw.js';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-0BwB1B7t.js';
-import '../chunks/bundle-ltzZCtkR.js';
-import '../chunks/bundle-G3cS-S1W.js';
+import '../chunks/bundle-Y1x4CZpy.js';
+import '../chunks/bundle-zYQpPgUz.js';
+import '../chunks/bundle-lQUkPvfG.js';
 import '../useSendbirdStateContext.js';
 import '../withSendbird.js';
-import '../chunks/bundle-JGFwpJZJ.js';
-import '../chunks/bundle-fQ2M7pMu.js';
-import '../chunks/bundle-LPkaaUo4.js';
+import '../chunks/bundle-GIZVQ7W4.js';
+import '../chunks/bundle-gxrNtcmM.js';
+import '../chunks/bundle-VELRmCgM.js';
 import '@sendbird/chat/message';
-import '../chunks/bundle-PK1dgVwp.js';
-import '../chunks/bundle-3oeQjqp5.js';
+import '../chunks/bundle-TIBUJEGt.js';
+import '../chunks/bundle-Ahnepylk.js';
 import '@sendbird/chat/groupChannel';
 import '../Channel/hooks/useInitialMessagesFetch.js';
-import '../chunks/bundle--Hrow3p-.js';
-import '../chunks/bundle-UjngV2Kp.js';
-import '../chunks/bundle-rX7vrYxX.js';
-import '../chunks/bundle-zch8NdOh.js';
+import '../chunks/bundle-7qnTBkFI.js';
+import '../chunks/bundle-pfoFNefK.js';
+import '../chunks/bundle-_oSqlLwH.js';
+import '../chunks/bundle-WrbACLdS.js';
 
-function MessageItemMenu(_a) {
+function MessageMenu(_a) {
     var _b;
     var className = _a.className, message = _a.message, channel = _a.channel, _c = _a.isByMe, isByMe = _c === void 0 ? false : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, replyType = _a.replyType, _e = _a.disableDeleteMessage, disableDeleteMessage = _e === void 0 ? null : _e, showEdit = _a.showEdit, showRemove = _a.showRemove, resendMessage = _a.resendMessage, setQuoteMessage = _a.setQuoteMessage, setSupposedHover = _a.setSupposedHover, onReplyInThread = _a.onReplyInThread, _f = _a.onMoveToParentMessage, onMoveToParentMessage = _f === void 0 ? null : _f;
     var stringSet = useContext(LocalizationContext).stringSet;
@@ -122,5 +122,5 @@ function MessageItemMenu(_a) {
             } })));
 }
 
-export { MessageItemMenu as default };
+export { MessageMenu, MessageMenu as default };
 //# sourceMappingURL=MessageItemMenu.js.map

package/ui/MessageItemReactionMenu.js

@@ -4,20 +4,20 @@ import Icon, { IconTypes, IconColors } from './Icon.js';
 import IconButton from './IconButton.js';
 import ImageRenderer from './ImageRenderer.js';
 import ReactionButton from './ReactionButton.js';
-import { m as isPendingMessage, l as isFailedMessage, n as getClassName, p as getEmojiListAll } from '../chunks/bundle-OoXqnc0l.js';
-import '../chunks/bundle-AVOWwEQ4.js';
+import { m as isPendingMessage, l as isFailedMessage, n as getClassName, p as getEmojiListAll } from '../chunks/bundle-MY-lEq_u.js';
+import '../chunks/bundle-WOkl3_Qa.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../chunks/bundle-iPDlyZXo.js';
-import '../chunks/bundle-lDOyfwhb.js';
-import '../chunks/bundle-4zdVdGkr.js';
-import '../chunks/bundle-FQAabli1.js';
-import '../chunks/bundle-9uR-6efo.js';
-import '../chunks/bundle-QKq7b-WA.js';
+import '../chunks/bundle-P0Em254T.js';
+import '../chunks/bundle-XASWNrfg.js';
+import '../chunks/bundle-1Ni9PXLu.js';
+import '../chunks/bundle-CYvmOLIw.js';
+import '../chunks/bundle-5r5nUzch.js';
+import '../chunks/bundle-S6yFiUrY.js';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-0BwB1B7t.js';
+import '../chunks/bundle-Y1x4CZpy.js';
 
-function MessageItemReactionMenu(_a) {
+function MessageEmojiMenu(_a) {
     var className = _a.className, message = _a.message, userId = _a.userId, _b = _a.spaceFromTrigger, spaceFromTrigger = _b === void 0 ? { x: 0, y: 0 } : _b, emojiContainer = _a.emojiContainer, toggleReaction = _a.toggleReaction, setSupposedHover = _a.setSupposedHover;
     var triggerRef = useRef(null);
     var containerRef = useRef(null);
@@ -49,5 +49,5 @@ function MessageItemReactionMenu(_a) {
             } })));
 }
 
-export { MessageItemReactionMenu as default };
+export { MessageEmojiMenu, MessageEmojiMenu as default };
 //# sourceMappingURL=MessageItemReactionMenu.js.map