@sendbird/uikit-react 3.16.12 → 3.17.0

package/ui/MessageSearchFileItem.js

@@ -1,25 +1,25 @@
-import { a as __spreadArray } from '../chunks/bundle-Cc3I5CYX.js';
+import { c as __spreadArray } from '../chunks/bundle-yl5d1NoZ.js';
 import React__default from 'react';
-import { A as Avatar } from '../chunks/bundle-BhVTrhDH.js';
+import { A as Avatar } from '../chunks/bundle-CAEBoiEz.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-C1GT9VW0.js';
-import { u as useLocalization } from '../chunks/bundle-DoS7oWHM.js';
-import { f as format } from '../chunks/bundle-d5LRZz0u.js';
-import { i as isToday, a as isYesterday, b as isThisYear } from '../chunks/bundle-BBIiHpWB.js';
-import { i as isVoiceMessage } from '../chunks/bundle-DPyYquOn.js';
-import { g as getMessageFirstFileUrl, b as getMessageFirstFileName } from '../chunks/bundle-BIwdGWMT.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-viBng0Kh.js';
+import { u as useLocalization } from '../chunks/bundle-Del33VzI.js';
+import { f as format } from '../chunks/bundle-mGsud0ec.js';
+import { i as isToday, a as isYesterday, b as isThisYear } from '../chunks/bundle-BhhLSKSz.js';
+import { i as isVoiceMessage } from '../chunks/bundle-vmZ9LoYK.js';
+import { g as getMessageFirstFileUrl, b as getMessageFirstFileName } from '../chunks/bundle-h6bAY7E9.js';
 import './ImageRenderer.js';
-import '../chunks/bundle-P5nwZD8V.js';
-import '../chunks/bundle-Bza4PDR2.js';
-import '../chunks/bundle-B9WM87iE.js';
-import '../chunks/bundle-QoZ0XMP0.js';
-import '../chunks/bundle-B4vASmiS.js';
-import '../chunks/bundle-DL6YPZS8.js';
+import '../chunks/bundle-MlG9piGf.js';
+import '../chunks/bundle-Dl_v8XoN.js';
+import '../chunks/bundle-C1dqPUnT.js';
+import '../chunks/bundle-BZGITC2g.js';
+import '../chunks/bundle-fdEQfX2s.js';
+import '../chunks/bundle-Cl9rtdlj.js';
 import '@sendbird/chat/groupChannel';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-BI4FzGRR.js';
-import '../chunks/bundle-RuHd2ZCg.js';
-import '../chunks/bundle-ClaUOmc5.js';
+import '../chunks/bundle-DgosLQK9.js';
+import '../chunks/bundle-DEuCwnTn.js';
+import '../chunks/bundle-CqLLOVG5.js';
 
 function getCreatedAt(_a) {
     var createdAt = _a.createdAt, locale = _a.locale, stringSet = _a.stringSet;

package/ui/MessageSearchItem.js

@@ -1,18 +1,18 @@
-import { a as __spreadArray } from '../chunks/bundle-Cc3I5CYX.js';
+import { c as __spreadArray } from '../chunks/bundle-yl5d1NoZ.js';
 import React__default from 'react';
-import { f as format } from '../chunks/bundle-d5LRZz0u.js';
-import { i as isToday, a as isYesterday, b as isThisYear } from '../chunks/bundle-BBIiHpWB.js';
-import { A as Avatar } from '../chunks/bundle-BhVTrhDH.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-C1GT9VW0.js';
-import { u as useLocalization } from '../chunks/bundle-DoS7oWHM.js';
-import '../chunks/bundle-B4vASmiS.js';
-import '../chunks/bundle-QoZ0XMP0.js';
-import '../chunks/bundle-DL6YPZS8.js';
+import { f as format } from '../chunks/bundle-mGsud0ec.js';
+import { i as isToday, a as isYesterday, b as isThisYear } from '../chunks/bundle-BhhLSKSz.js';
+import { A as Avatar } from '../chunks/bundle-CAEBoiEz.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-viBng0Kh.js';
+import { u as useLocalization } from '../chunks/bundle-Del33VzI.js';
+import '../chunks/bundle-fdEQfX2s.js';
+import '../chunks/bundle-BZGITC2g.js';
+import '../chunks/bundle-Cl9rtdlj.js';
 import './ImageRenderer.js';
-import '../chunks/bundle-P5nwZD8V.js';
-import '../chunks/bundle-Bza4PDR2.js';
+import '../chunks/bundle-MlG9piGf.js';
+import '../chunks/bundle-Dl_v8XoN.js';
 import './Icon.js';
-import '../chunks/bundle-B9WM87iE.js';
+import '../chunks/bundle-C1dqPUnT.js';
 
 // getCreatedAt
 function getCreatedAt (_a) {

package/ui/MessageStatus.js

@@ -1,21 +1,21 @@
-import '../chunks/bundle-Cc3I5CYX.js';
+import '../chunks/bundle-yl5d1NoZ.js';
 import 'react';
-import '../chunks/bundle-d5LRZz0u.js';
+import '../chunks/bundle-mGsud0ec.js';
 import './Icon.js';
-import '../chunks/bundle-C1GT9VW0.js';
+import '../chunks/bundle-viBng0Kh.js';
 import './Loader.js';
-import '../chunks/bundle-DPyYquOn.js';
+import '../chunks/bundle-vmZ9LoYK.js';
 import '../utils/message/getOutgoingMessageState.js';
-export { e as MessageStatusTypes, M as default } from '../chunks/bundle-BU0BvnMh.js';
-import '../chunks/bundle-DoS7oWHM.js';
-import '../chunks/bundle-P5nwZD8V.js';
-import '../chunks/bundle-B4vASmiS.js';
-import '../chunks/bundle-QoZ0XMP0.js';
-import '../chunks/bundle-B9WM87iE.js';
+export { e as MessageStatusTypes, M as default } from '../chunks/bundle-2U8QpYXo.js';
+import '../chunks/bundle-Del33VzI.js';
+import '../chunks/bundle-MlG9piGf.js';
+import '../chunks/bundle-fdEQfX2s.js';
+import '../chunks/bundle-BZGITC2g.js';
+import '../chunks/bundle-C1dqPUnT.js';
 import '@sendbird/chat/groupChannel';
-import '../chunks/bundle-BI4FzGRR.js';
-import '../chunks/bundle-RuHd2ZCg.js';
-import '../chunks/bundle-ClaUOmc5.js';
-import '../chunks/bundle-BBIiHpWB.js';
-import '../chunks/bundle-DL6YPZS8.js';
+import '../chunks/bundle-DgosLQK9.js';
+import '../chunks/bundle-DEuCwnTn.js';
+import '../chunks/bundle-CqLLOVG5.js';
+import '../chunks/bundle-BhhLSKSz.js';
+import '../chunks/bundle-Cl9rtdlj.js';
 //# sourceMappingURL=MessageStatus.js.map

package/ui/MessageTemplate.js

@@ -1,3 +1,3 @@
 import 'react';
-export { a as MessageTemplate, a as default } from '../chunks/bundle-CDrUVtmn.js';
+export { a as MessageTemplate, a as default } from '../chunks/bundle-BJYztm64.js';
 //# sourceMappingURL=MessageTemplate.js.map

package/ui/MobileFeedbackMenu.js

@@ -1,26 +1,26 @@
 import React__default from 'react';
 import BottomSheet from './BottomSheet.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-C1GT9VW0.js';
-import { u as useLocalization } from '../chunks/bundle-DoS7oWHM.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-viBng0Kh.js';
+import { u as useLocalization } from '../chunks/bundle-Del33VzI.js';
 import 'react-dom';
 import '../hooks/useModal.js';
-import '../chunks/bundle-Cc3I5CYX.js';
-import '../chunks/bundle-RuHd2ZCg.js';
-import '../chunks/bundle-P5nwZD8V.js';
-import '../chunks/bundle-CO-raWw1.js';
-import '../chunks/bundle-DPQUP26z.js';
+import '../chunks/bundle-yl5d1NoZ.js';
+import '../chunks/bundle-DEuCwnTn.js';
+import '../chunks/bundle-MlG9piGf.js';
+import '../chunks/bundle-CtQtfJlT.js';
+import '../chunks/bundle-DBhJIxHw.js';
 import './IconButton.js';
 import './Button.js';
 import './Icon.js';
-import '../chunks/bundle-FheET-Q4.js';
-import '../chunks/bundle-q9ddBKNI.js';
-import '../chunks/bundle-BHVmxzEQ.js';
-import '../chunks/bundle-ClaUOmc5.js';
+import '../chunks/bundle-DGh2T5IL.js';
+import '../chunks/bundle-i_3w58Zd.js';
+import '../chunks/bundle-BUYU9H94.js';
+import '../chunks/bundle-CqLLOVG5.js';
 import '@sendbird/chat';
 import '@sendbird/chat/groupChannel';
 import '@sendbird/chat/openChannel';
-import '../chunks/bundle-B9WM87iE.js';
-import '../chunks/bundle-QoZ0XMP0.js';
+import '../chunks/bundle-C1dqPUnT.js';
+import '../chunks/bundle-BZGITC2g.js';
 
 function MobileFeedbackMenu(props) {
     var hideMenu = props.hideMenu, onEditFeedback = props.onEditFeedback, onRemoveFeedback = props.onRemoveFeedback;

package/ui/MobileMenu.js

@@ -1,35 +1,35 @@
-import { _ as __assign } from '../chunks/bundle-Cc3I5CYX.js';
+import { _ as __assign } from '../chunks/bundle-yl5d1NoZ.js';
 import React__default, { useState } from 'react';
-import { m as isUserMessage, B as copyToClipboard, x as isFailedMessage, r as isSentMessage, w as isPendingMessage, c as isFileMessage, i as isVoiceMessage, T as isThreadMessage, V as getEmojiListAll } from '../chunks/bundle-DPyYquOn.js';
-import { n as noop, c as classnames } from '../chunks/bundle-P5nwZD8V.js';
-import { u as useMessageMenuContext, a as MenuItem, M as MessageMenuProvider, b as MenuItems, B as BottomSheetMenuItem } from '../chunks/bundle-DaQgvfV3.js';
+import { n as isUserMessage, C as copyToClipboard, y as isFailedMessage, s as isSentMessage, x as isPendingMessage, d as isFileMessage, i as isVoiceMessage, T as isThreadMessage, V as getEmojiListAll } from '../chunks/bundle-vmZ9LoYK.js';
+import { n as noop, c as classnames } from '../chunks/bundle-MlG9piGf.js';
+import { u as useMessageMenuContext, a as MenuItem, M as MessageMenuProvider, b as MenuItems, B as BottomSheetMenuItem } from '../chunks/bundle-Bch_Ry4S.js';
 import './IconButton.js';
-import { u as useLocalization } from '../chunks/bundle-DoS7oWHM.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-C1GT9VW0.js';
+import { u as useLocalization } from '../chunks/bundle-Del33VzI.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-viBng0Kh.js';
 import '@sendbird/chat';
-import { u as useSendbird } from '../chunks/bundle-q9ddBKNI.js';
+import { u as useSendbird } from '../chunks/bundle-i_3w58Zd.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import BottomSheet from './BottomSheet.js';
 import ImageRenderer from './ImageRenderer.js';
 import ReactionButton from './ReactionButton.js';
 import '@sendbird/chat/groupChannel';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-BI4FzGRR.js';
-import '../chunks/bundle-RuHd2ZCg.js';
-import '../chunks/bundle-B4vASmiS.js';
-import '../chunks/bundle-ClaUOmc5.js';
+import '../chunks/bundle-DgosLQK9.js';
+import '../chunks/bundle-DEuCwnTn.js';
+import '../chunks/bundle-fdEQfX2s.js';
+import '../chunks/bundle-CqLLOVG5.js';
 import 'react-dom';
 import '@sendbird/chat/openChannel';
 import './SortByRow.js';
-import '../chunks/bundle-FheET-Q4.js';
-import '../chunks/bundle-BHVmxzEQ.js';
-import '../chunks/bundle-B9WM87iE.js';
-import '../chunks/bundle-QoZ0XMP0.js';
+import '../chunks/bundle-DGh2T5IL.js';
+import '../chunks/bundle-BUYU9H94.js';
+import '../chunks/bundle-C1dqPUnT.js';
+import '../chunks/bundle-BZGITC2g.js';
 import '../hooks/useModal.js';
-import '../chunks/bundle-CO-raWw1.js';
-import '../chunks/bundle-DPQUP26z.js';
+import '../chunks/bundle-CtQtfJlT.js';
+import '../chunks/bundle-DBhJIxHw.js';
 import './Button.js';
-import '../chunks/bundle-B5NfIzw6.js';
+import '../chunks/bundle-Ba_cV-Zm.js';
 
 var CopyMenuItem$1 = function (props) {
     var _a;
@@ -132,12 +132,27 @@ var DownloadMenuItem$1 = function (props) {
         React__default.createElement(Label, { type: LabelTypography.SUBTITLE_1, color: LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__SAVE),
         React__default.createElement(Icon, { type: IconTypes.DOWNLOAD, fillColor: IconColors.PRIMARY, width: "24px", height: "24px" })))));
 };
+var MarkAsUnreadMenuItem$1 = function (props) {
+    var _a;
+    var stringSet = useLocalization().stringSet;
+    var _b = useMessageMenuContext(), message = _b.message, hideMenu = _b.hideMenu, markAsUnread = _b.markAsUnread;
+    return (React__default.createElement(MenuItem, __assign({}, props, { onClick: function (e) {
+            var _a;
+            if (markAsUnread) {
+                markAsUnread(message, 'manual');
+            }
+            hideMenu();
+            (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.createElement(React__default.Fragment, null,
+        React__default.createElement(Label, { type: LabelTypography.SUBTITLE_1, color: LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__MARK_AS_UNREAD),
+        React__default.createElement(Icon, { type: IconTypes.MARK_AS_UNREAD, fillColor: IconColors.PRIMARY, width: "24px", height: "24px" })))));
+};
 
 var MobileContextMenu = function (props) {
-    var _a, _b, _c, _d;
-    var channel = props.channel, message = props.message, replyType = props.replyType, userId = props.userId, resendMessage = props.resendMessage, showEdit = props.showEdit, showRemove = props.showRemove, deleteMenuState = props.deleteMenuState, deleteMessage = props.deleteMessage, setQuoteMessage = props.setQuoteMessage, parentRef = props.parentRef, onReplyInThread = props.onReplyInThread, _e = props.isOpenedFromThread, isOpenedFromThread = _e === void 0 ? false : _e, _f = props.onDownloadClick, onDownloadClick = _f === void 0 ? null : _f, renderMenuItems = props.renderMenuItems, hideMobileMenu = props.hideMenu;
+    var _a, _b, _c, _d, _e;
+    var channel = props.channel, message = props.message, replyType = props.replyType, userId = props.userId, resendMessage = props.resendMessage, showEdit = props.showEdit, showRemove = props.showRemove, deleteMenuState = props.deleteMenuState, deleteMessage = props.deleteMessage, setQuoteMessage = props.setQuoteMessage, parentRef = props.parentRef, onReplyInThread = props.onReplyInThread, _f = props.isOpenedFromThread, isOpenedFromThread = _f === void 0 ? false : _f, _g = props.onDownloadClick, onDownloadClick = _g === void 0 ? null : _g, renderMenuItems = props.renderMenuItems, hideMobileMenu = props.hideMenu;
     var isByMe = ((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId) === userId;
-    var isOnline = useSendbird().state.config.isOnline;
+    var _h = useSendbird().state.config, isOnline = _h.isOnline, enableMarkAsUnread = _h.groupChannel.enableMarkAsUnread;
     // Menu Items condition
     var showMenuItemCopy = isUserMessage(message);
     var showMenuItemEdit = isUserMessage(message) && isSentMessage(message) && isByMe;
@@ -148,7 +163,8 @@ var MobileContextMenu = function (props) {
     var showMenuItemDownload = !isPendingMessage(message) && isFileMessage(message) && !(isVoiceMessage(message) && (channel === null || channel === void 0 ? void 0 : channel.isSuper) || (channel === null || channel === void 0 ? void 0 : channel.isBroadcast));
     var showMenuItemReply = replyType === 'QUOTE_REPLY' && !isFailedMessage(message) && !isPendingMessage(message) && (channel === null || channel === void 0 ? void 0 : channel.isGroupChannel());
     var showMenuItemThread = replyType === 'THREAD' && !isOpenedFromThread && !isFailedMessage(message) && !isPendingMessage(message) && !isThreadMessage(message) && (channel === null || channel === void 0 ? void 0 : channel.isGroupChannel());
-    var disableDeleteMessage = (deleteMenuState !== undefined && deleteMenuState === 'DISABLE') || ((_c = (_b = message === null || message === void 0 ? void 0 : message.threadInfo) === null || _b === void 0 ? void 0 : _b.replyCount) !== null && _c !== void 0 ? _c : 0) > 0;
+    var showMenuItemMarkAsUnread = !isFailedMessage(message) && !isPendingMessage(message) && message.parentMessageId <= 0 && ((_b = channel === null || channel === void 0 ? void 0 : channel.isGroupChannel) === null || _b === void 0 ? void 0 : _b.call(channel));
+    var disableDeleteMessage = (deleteMenuState !== undefined && deleteMenuState === 'DISABLE') || ((_d = (_c = message === null || message === void 0 ? void 0 : message.threadInfo) === null || _c === void 0 ? void 0 : _c.replyCount) !== null && _d !== void 0 ? _d : 0) > 0;
     var contextValue = {
         message: message,
         hideMenu: hideMobileMenu,
@@ -159,6 +175,7 @@ var MobileContextMenu = function (props) {
         showRemove: showRemove,
         deleteMessage: deleteMessage,
         resendMessage: resendMessage,
+        markAsUnread: props.markAsUnread,
         isOnline: isOnline,
         disableDeleteMessage: disableDeleteMessage,
         triggerRef: parentRef,
@@ -166,20 +183,22 @@ var MobileContextMenu = function (props) {
         onDownloadClick: onDownloadClick,
     };
     return (React__default.createElement(MessageMenuProvider, { value: contextValue },
-        React__default.createElement(MenuItems, { className: "sendbird-message__mobile-context-menu", parentRef: parentRef, parentContainRef: parentRef, closeDropdown: hideMobileMenu }, (_d = renderMenuItems === null || renderMenuItems === void 0 ? void 0 : renderMenuItems({
+        React__default.createElement(MenuItems, { className: "sendbird-message__mobile-context-menu", parentRef: parentRef, parentContainRef: parentRef, closeDropdown: hideMobileMenu }, (_e = renderMenuItems === null || renderMenuItems === void 0 ? void 0 : renderMenuItems({
             items: {
                 CopyMenuItem: CopyMenuItem$1,
                 ReplyMenuItem: ReplyMenuItem$1,
                 ThreadMenuItem: ThreadMenuItem$1,
                 EditMenuItem: EditMenuItem$1,
+                MarkAsUnreadMenuItem: MarkAsUnreadMenuItem$1,
                 ResendMenuItem: ResendMenuItem$1,
                 DeleteMenuItem: DeleteMenuItem$1,
             },
-        })) !== null && _d !== void 0 ? _d : (React__default.createElement(React__default.Fragment, null,
+        })) !== null && _e !== void 0 ? _e : (React__default.createElement(React__default.Fragment, null,
             showMenuItemCopy && React__default.createElement(CopyMenuItem$1, null),
             showMenuItemReply && React__default.createElement(ReplyMenuItem$1, null),
             showMenuItemThread && React__default.createElement(ThreadMenuItem$1, null),
             showMenuItemEdit && React__default.createElement(EditMenuItem$1, null),
+            enableMarkAsUnread && showMenuItemMarkAsUnread && React__default.createElement(MarkAsUnreadMenuItem$1, null),
             showMenuItemResend && React__default.createElement(ResendMenuItem$1, null),
             showMenuItemDeleteFinal && React__default.createElement(DeleteMenuItem$1, null),
             showMenuItemDownload && React__default.createElement(DownloadMenuItem$1, null))))));
@@ -284,13 +303,28 @@ var DownloadMenuItem = function (props) {
         React__default.createElement(Icon, { type: IconTypes.DOWNLOAD, fillColor: IconColors.PRIMARY, width: "24px", height: "24px" }),
         React__default.createElement(Label, { type: LabelTypography.SUBTITLE_1, color: LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__SAVE)))));
 };
+var MarkAsUnreadMenuItem = function (props) {
+    var _a;
+    var stringSet = useLocalization().stringSet;
+    var _b = useMessageMenuContext(), message = _b.message, hideMenu = _b.hideMenu, markAsUnread = _b.markAsUnread;
+    return (React__default.createElement(BottomSheetMenuItem, __assign({}, props, { onClick: function (e) {
+            var _a;
+            if (markAsUnread) {
+                markAsUnread(message, 'manual');
+            }
+            hideMenu();
+            (_a = props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
+        } }), (_a = props.children) !== null && _a !== void 0 ? _a : (React__default.createElement(React__default.Fragment, null,
+        React__default.createElement(Icon, { type: IconTypes.MARK_AS_UNREAD, fillColor: IconColors.PRIMARY, width: "24px", height: "24px" }),
+        React__default.createElement(Label, { type: LabelTypography.SUBTITLE_1, color: LabelColors.ONBACKGROUND_1 }, stringSet.MESSAGE_MENU__MARK_AS_UNREAD)))));
+};
 
 var EMOJI_SIZE = 38;
 var MobileBottomSheet = function (props) {
-    var _a, _b, _c, _d;
-    var hideMenu = props.hideMenu, channel = props.channel, emojiContainer = props.emojiContainer, message = props.message, replyType = props.replyType, userId = props.userId, resendMessage = props.resendMessage, deleteMessage = props.deleteMessage, toggleReaction = props.toggleReaction, _e = props.isReactionEnabled, isReactionEnabled = _e === void 0 ? false : _e, showEdit = props.showEdit, showRemove = props.showRemove, deleteMenuState = props.deleteMenuState, setQuoteMessage = props.setQuoteMessage, onReplyInThread = props.onReplyInThread, _f = props.isOpenedFromThread, isOpenedFromThread = _f === void 0 ? false : _f, onDownloadClick = props.onDownloadClick, renderMenuItems = props.renderMenuItems;
+    var _a, _b, _c, _d, _e;
+    var hideMenu = props.hideMenu, channel = props.channel, emojiContainer = props.emojiContainer, message = props.message, replyType = props.replyType, userId = props.userId, resendMessage = props.resendMessage, deleteMessage = props.deleteMessage, toggleReaction = props.toggleReaction, _f = props.isReactionEnabled, isReactionEnabled = _f === void 0 ? false : _f, showEdit = props.showEdit, showRemove = props.showRemove, deleteMenuState = props.deleteMenuState, setQuoteMessage = props.setQuoteMessage, onReplyInThread = props.onReplyInThread, _g = props.isOpenedFromThread, isOpenedFromThread = _g === void 0 ? false : _g, onDownloadClick = props.onDownloadClick, renderMenuItems = props.renderMenuItems;
     var isByMe = ((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId) === userId;
-    var isOnline = useSendbird().state.config.isOnline;
+    var _h = useSendbird().state.config, isOnline = _h.isOnline, enableMarkAsUnread = _h.groupChannel.enableMarkAsUnread;
     var showMenuItemCopy = isUserMessage(message);
     var showMenuItemEdit = (isUserMessage(message) && isSentMessage(message) && isByMe);
     var showMenuItemResend = (isOnline && isFailedMessage(message) && (message === null || message === void 0 ? void 0 : message.isResendable) && isByMe);
@@ -310,8 +344,12 @@ var MobileBottomSheet = function (props) {
         && !isPendingMessage(message)
         && !isThreadMessage(message)
         && ((channel === null || channel === void 0 ? void 0 : channel.isGroupChannel()) && !(channel === null || channel === void 0 ? void 0 : channel.isBroadcast));
+    var showMenuItemMarkAsUnread = !isFailedMessage(message)
+        && !isPendingMessage(message)
+        && ((_d = channel === null || channel === void 0 ? void 0 : channel.isGroupChannel) === null || _d === void 0 ? void 0 : _d.call(channel))
+        && replyType !== 'THREAD';
     var maxEmojisPerRow = Math.floor(window.innerWidth / EMOJI_SIZE) - 1;
-    var _g = useState(false), showEmojisOnly = _g[0], setShowEmojisOnly = _g[1];
+    var _j = useState(false), showEmojisOnly = _j[0], setShowEmojisOnly = _j[1];
     var emojis = emojiContainer && getEmojiListAll(emojiContainer);
     var visibleEmojis = showEmojisOnly ? emojis : emojis === null || emojis === void 0 ? void 0 : emojis.slice(0, maxEmojisPerRow);
     var canShowMoreEmojis = emojis && emojis.length > maxEmojisPerRow;
@@ -325,6 +363,7 @@ var MobileBottomSheet = function (props) {
         showRemove: showRemove,
         deleteMessage: deleteMessage,
         resendMessage: resendMessage,
+        markAsUnread: props.markAsUnread,
         isOnline: isOnline,
         disableDeleteMessage: disableDelete,
         triggerRef: null,
@@ -356,7 +395,7 @@ var MobileBottomSheet = function (props) {
                                         return (React__default.createElement("div", { style: style },
                                             React__default.createElement(Icon, { type: IconTypes.EMOJI_MORE, fillColor: IconColors.ON_BACKGROUND_3, width: "28px", height: "28px" })));
                                     } }))))))),
-                !showEmojisOnly && (React__default.createElement("div", { className: "sendbird-message__bottomsheet--actions" }, (_d = renderMenuItems === null || renderMenuItems === void 0 ? void 0 : renderMenuItems({
+                !showEmojisOnly && (React__default.createElement("div", { className: "sendbird-message__bottomsheet--actions" }, (_e = renderMenuItems === null || renderMenuItems === void 0 ? void 0 : renderMenuItems({
                     items: {
                         CopyMenuItem: CopyMenuItem,
                         EditMenuItem: EditMenuItem,
@@ -364,15 +403,18 @@ var MobileBottomSheet = function (props) {
                         ReplyMenuItem: ReplyMenuItem,
                         ThreadMenuItem: ThreadMenuItem,
                         DeleteMenuItem: DeleteMenuItem,
+                        MarkAsUnreadMenuItem: MarkAsUnreadMenuItem,
                     },
-                })) !== null && _d !== void 0 ? _d : (React__default.createElement(React__default.Fragment, null,
+                })) !== null && _e !== void 0 ? _e : (React__default.createElement(React__default.Fragment, null,
                     showMenuItemCopy && React__default.createElement(CopyMenuItem, null),
                     showMenuItemEdit && React__default.createElement(EditMenuItem, null),
+                    enableMarkAsUnread && showMenuItemMarkAsUnread && React__default.createElement(MarkAsUnreadMenuItem, null),
                     showMenuItemResend && React__default.createElement(ResendMenuItem, null),
                     showMenuItemReply && React__default.createElement(ReplyMenuItem, null),
                     showMenuItemThread && React__default.createElement(ThreadMenuItem, null),
                     showMenuItemDeleteFinal && React__default.createElement(DeleteMenuItem, null),
-                    showMenuItemDownload && React__default.createElement(DownloadMenuItem, null)))))))));
+                    showMenuItemDownload && React__default.createElement(DownloadMenuItem, null))),
+                    "\u00DF"))))));
 };
 
 var MobileMenu = function (props) {

package/ui/MobileMenu.js.map

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

package/ui/Modal.js

@@ -1,20 +1,20 @@
-import '../chunks/bundle-Cc3I5CYX.js';
+import '../chunks/bundle-yl5d1NoZ.js';
 import 'react';
 import 'react-dom';
-import '../chunks/bundle-P5nwZD8V.js';
-export { M as Modal, e as ModalBody, c as ModalFooter, d as ModalHeader, M as default } from '../chunks/bundle-CO-raWw1.js';
-import '../chunks/bundle-DoS7oWHM.js';
-import '../chunks/bundle-DPQUP26z.js';
+import '../chunks/bundle-MlG9piGf.js';
+export { M as Modal, e as ModalBody, c as ModalFooter, d as ModalHeader, M as default } from '../chunks/bundle-CtQtfJlT.js';
+import '../chunks/bundle-Del33VzI.js';
+import '../chunks/bundle-DBhJIxHw.js';
 import './IconButton.js';
 import './Button.js';
 import './Icon.js';
-import '../chunks/bundle-C1GT9VW0.js';
-import '../chunks/bundle-FheET-Q4.js';
-import '../chunks/bundle-q9ddBKNI.js';
-import '../chunks/bundle-B9WM87iE.js';
-import '../chunks/bundle-QoZ0XMP0.js';
-import '../chunks/bundle-BHVmxzEQ.js';
-import '../chunks/bundle-ClaUOmc5.js';
+import '../chunks/bundle-viBng0Kh.js';
+import '../chunks/bundle-DGh2T5IL.js';
+import '../chunks/bundle-i_3w58Zd.js';
+import '../chunks/bundle-C1dqPUnT.js';
+import '../chunks/bundle-BZGITC2g.js';
+import '../chunks/bundle-BUYU9H94.js';
+import '../chunks/bundle-CqLLOVG5.js';
 import '@sendbird/chat';
 import '@sendbird/chat/groupChannel';
 import '@sendbird/chat/openChannel';

package/ui/MutedAvatarOverlay.js

@@ -1,7 +1,7 @@
 import React__default from 'react';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import '../chunks/bundle-Cc3I5CYX.js';
-import '../chunks/bundle-P5nwZD8V.js';
+import '../chunks/bundle-yl5d1NoZ.js';
+import '../chunks/bundle-MlG9piGf.js';
 
 function MutedAvatarOverlay(props) {
     var _a = props.height, height = _a === void 0 ? 24 : _a, _b = props.width, width = _b === void 0 ? 24 : _b;

package/ui/OGMessageItemBody.js

@@ -1,40 +1,40 @@
 import React__default, { useContext, useMemo, useRef, useEffect } from 'react';
 import ImageRenderer from './ImageRenderer.js';
 import Icon, { IconTypes } from './Icon.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-C1GT9VW0.js';
-import { y as getClassName, e as isEditedMessage } from '../chunks/bundle-DPyYquOn.js';
-import { L as LocalizationContext } from '../chunks/bundle-DoS7oWHM.js';
-import { T as TextFragment } from '../chunks/bundle-DRWMVBdn.js';
-import { t as tokenizeMessage } from '../chunks/bundle-BtNwQ8Bf.js';
-import { O as OG_MESSAGE_BODY_CLASSNAME } from '../chunks/bundle-BaDSfPc2.js';
-import { u as useMediaQueryContext } from '../chunks/bundle-DPQUP26z.js';
-import { o as openURL, c as classnames } from '../chunks/bundle-P5nwZD8V.js';
-import '../chunks/bundle-Cc3I5CYX.js';
-import '../chunks/bundle-B9WM87iE.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-viBng0Kh.js';
+import { z as getClassName, f as isEditedMessage } from '../chunks/bundle-vmZ9LoYK.js';
+import { L as LocalizationContext } from '../chunks/bundle-Del33VzI.js';
+import { T as TextFragment } from '../chunks/bundle-DcLgcUpC.js';
+import { t as tokenizeMessage } from '../chunks/bundle-BwvurfUT.js';
+import { O as OG_MESSAGE_BODY_CLASSNAME } from '../chunks/bundle-Cc1gzgza.js';
+import { u as useMediaQueryContext } from '../chunks/bundle-DBhJIxHw.js';
+import { o as openURL, c as classnames } from '../chunks/bundle-MlG9piGf.js';
+import '../chunks/bundle-yl5d1NoZ.js';
+import '../chunks/bundle-C1dqPUnT.js';
 import '@sendbird/chat/groupChannel';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-BI4FzGRR.js';
-import '../chunks/bundle-RuHd2ZCg.js';
-import '../chunks/bundle-B4vASmiS.js';
-import '../chunks/bundle-ClaUOmc5.js';
-import '../chunks/bundle-QoZ0XMP0.js';
+import '../chunks/bundle-DgosLQK9.js';
+import '../chunks/bundle-DEuCwnTn.js';
+import '../chunks/bundle-fdEQfX2s.js';
+import '../chunks/bundle-CqLLOVG5.js';
+import '../chunks/bundle-BZGITC2g.js';
 import '../Message/context.js';
 import './MentionLabel.js';
-import '../chunks/bundle-DaQgvfV3.js';
+import '../chunks/bundle-Bch_Ry4S.js';
 import 'react-dom';
 import '@sendbird/chat';
 import '@sendbird/chat/openChannel';
 import './SortByRow.js';
-import '../chunks/bundle-FheET-Q4.js';
+import '../chunks/bundle-DGh2T5IL.js';
 import './IconButton.js';
-import '../chunks/bundle-BHVmxzEQ.js';
+import '../chunks/bundle-BUYU9H94.js';
 import './UserProfile.js';
-import '../chunks/bundle-gsWT87_Q.js';
-import '../chunks/bundle-q9ddBKNI.js';
+import '../chunks/bundle-B0s_McF0.js';
+import '../chunks/bundle-i_3w58Zd.js';
 import '../sendbirdSelectors.js';
-import '../chunks/bundle-BEsTeVKi.js';
-import '../chunks/bundle-BhVTrhDH.js';
-import '../chunks/bundle-Bza4PDR2.js';
+import '../chunks/bundle-BOykFtQ3.js';
+import '../chunks/bundle-CAEBoiEz.js';
+import '../chunks/bundle-Dl_v8XoN.js';
 import './Button.js';
 import './LinkLabel.js';
 

package/ui/OpenChannelAdminMessage.js

@@ -1,7 +1,7 @@
-import { a as __spreadArray } from '../chunks/bundle-Cc3I5CYX.js';
+import { c as __spreadArray } from '../chunks/bundle-yl5d1NoZ.js';
 import React__default from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-C1GT9VW0.js';
-import '../chunks/bundle-B9WM87iE.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-viBng0Kh.js';
+import '../chunks/bundle-C1dqPUnT.js';
 
 function OpenChannelAdminMessage(_a) {
     var className = _a.className, message = _a.message;

package/ui/OpenChannelAvatar.js

@@ -1,14 +1,14 @@
 import React__default, { useContext, useMemo } from 'react';
-import { A as Avatar } from '../chunks/bundle-BhVTrhDH.js';
-import { L as LocalizationContext } from '../chunks/bundle-DoS7oWHM.js';
-import { b as getOpenChannelAvatar } from '../chunks/bundle-DTco3u4-.js';
-import '../chunks/bundle-Cc3I5CYX.js';
+import { A as Avatar } from '../chunks/bundle-CAEBoiEz.js';
+import { L as LocalizationContext } from '../chunks/bundle-Del33VzI.js';
+import { b as getOpenChannelAvatar } from '../chunks/bundle-B2BBbSEN.js';
+import '../chunks/bundle-yl5d1NoZ.js';
 import './ImageRenderer.js';
-import '../chunks/bundle-P5nwZD8V.js';
-import '../chunks/bundle-Bza4PDR2.js';
+import '../chunks/bundle-MlG9piGf.js';
+import '../chunks/bundle-Dl_v8XoN.js';
 import './Icon.js';
-import '../chunks/bundle-B9WM87iE.js';
-import '../chunks/bundle-QoZ0XMP0.js';
+import '../chunks/bundle-C1dqPUnT.js';
+import '../chunks/bundle-BZGITC2g.js';
 
 function ChannelAvatar(_a) {
     var channel = _a.channel, theme = _a.theme, _b = _a.height, height = _b === void 0 ? 56 : _b, _c = _a.width, width = _c === void 0 ? 56 : _c;

package/ui/OpenchannelConversationHeader.js

@@ -1,15 +1,15 @@
 import React__default, { useContext } from 'react';
-import { A as Avatar } from '../chunks/bundle-BhVTrhDH.js';
+import { A as Avatar } from '../chunks/bundle-CAEBoiEz.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import IconButton from './IconButton.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-C1GT9VW0.js';
-import { L as LocalizationContext } from '../chunks/bundle-DoS7oWHM.js';
-import '../chunks/bundle-Cc3I5CYX.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-viBng0Kh.js';
+import { L as LocalizationContext } from '../chunks/bundle-Del33VzI.js';
+import '../chunks/bundle-yl5d1NoZ.js';
 import './ImageRenderer.js';
-import '../chunks/bundle-P5nwZD8V.js';
-import '../chunks/bundle-Bza4PDR2.js';
-import '../chunks/bundle-B9WM87iE.js';
-import '../chunks/bundle-QoZ0XMP0.js';
+import '../chunks/bundle-MlG9piGf.js';
+import '../chunks/bundle-Dl_v8XoN.js';
+import '../chunks/bundle-C1dqPUnT.js';
+import '../chunks/bundle-BZGITC2g.js';
 
 function OpenchannelConversationHeader(_a) {
     var coverImage = _a.coverImage, title = _a.title, subTitle = _a.subTitle, amIOperator = _a.amIOperator, onActionClick = _a.onActionClick;