@sendbird/uikit-react 3.14.5 → 3.14.7-rc-1

package/chunks/{bundle-2jZ-0hKC.js → bundle-Dg7xW_TJ.js}

@@ -1,50 +1,47 @@
-import { a as __awaiter, b as __generator, c as __spreadArray } from './bundle-CDy_GVNR.js';
+import { a as __awaiter, b as __generator, c as __spreadArray } from './bundle-zAvvLMA9.js';
 import React__default, { useRef, useState, useEffect, useCallback } from 'react';
-import { i as isDisabledBecauseFrozen, a as isDisabledBecauseMuted } from './bundle-klvZ-YE5.js';
+import { i as isDisabledBecauseFrozen, a as isDisabledBecauseMuted } from './bundle-CKqOIeLq.js';
 import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
-import { u as useLocalization } from './bundle-CAdxJnio.js';
+import { u as useLocalization } from './bundle-4r7ZPzcx.js';
 import { SuggestedMentionList } from '../GroupChannel/components/SuggestedMentionList.js';
 import { useDirtyGetMentions } from '../Message/hooks/useDirtyGetMentions.js';
 import QuoteMessageInput from '../ui/QuoteMessageInput.js';
 import { useVoicePlayer } from '../VoicePlayer/useVoicePlayer.js';
 import { useVoiceRecorder, VoiceRecorderStatus } from '../VoiceRecorder/useVoiceRecorder.js';
-import { V as VoiceMessageInputStatus, a as VoiceMessageInput } from './bundle-C8hyJJ4a.js';
-import { M as Modal, b as useGlobalModalContext, c as ModalFooter } from './bundle-DiVyB2HD.js';
+import { V as VoiceMessageInputStatus, a as VoiceMessageInput } from './bundle-DM9civEM.js';
+import { M as Modal, b as useGlobalModalContext, c as ModalFooter } from './bundle-DEcnZTr9.js';
 import Button, { ButtonTypes, ButtonSizes } from '../ui/Button.js';
-import { d as VOICE_RECORDER_DEFAULT_MIN } from './bundle-thdxvFU8.js';
-import { V as VOICE_PLAYER_STATUS } from './bundle-D2MpL8t0.js';
-import { u as uuidv4 } from './bundle-8J9SSfIS.js';
+import { V as VOICE_PLAYER_STATUS } from './bundle-CflUdLjG.js';
+import { u as uuidv4 } from './bundle-sq0c8UmG.js';
 import MessageInput from '../ui/MessageInput.js';
-import { u as useMediaQueryContext } from './bundle-Cj-w5I5i.js';
-import { M as MessageInputKeys } from './bundle-C5i4dn9q.js';
-import { k as isImage } from './bundle-BH5EGLxi.js';
-import './bundle-q3jyuKU7.js';
-import { c as compressImages } from './bundle-DwvN2wPi.js';
+import { u as useMediaQueryContext } from './bundle-DS8lmYaF.js';
+import { M as MessageInputKeys } from './bundle-6v-jzonm.js';
+import { k as isImage } from './bundle-CMOqM33u.js';
+import './bundle-DyVURRtM.js';
+import { c as compressImages } from './bundle-D86Ophow.js';
 
 var VoiceMessageInputWrapper = function (_a) {
-    var _b;
     var channel = _a.channel, onCancelClick = _a.onCancelClick, onSubmitClick = _a.onSubmitClick;
     var uuid = useRef(uuidv4()).current;
-    var _c = useState(null), audioFile = _c[0], setAudioFile = _c[1];
-    var _d = useState(VoiceMessageInputStatus.READY_TO_RECORD), voiceInputState = _d[0], setVoiceInputState = _d[1];
-    var _e = useState(false), isSubmitted = _e[0], setSubmit = _e[1];
-    var _f = useState(false), isDisabled = _f[0], setDisabled = _f[1];
-    var _g = useState(false), showModal = _g[0], setShowModal = _g[1];
+    var _b = useState(null), audioFile = _b[0], setAudioFile = _b[1];
+    var _c = useState(VoiceMessageInputStatus.READY_TO_RECORD), voiceInputState = _c[0], setVoiceInputState = _c[1];
+    var _d = useState(false), isSubmitted = _d[0], setSubmit = _d[1];
+    var _e = useState(false), isDisabled = _e[0], setDisabled = _e[1];
+    var _f = useState(false), showModal = _f[0], setShowModal = _f[1];
     var stringSet = useLocalization().stringSet;
     var config = useSendbirdStateContext().config;
-    var minRecordingTime = ((_b = config === null || config === void 0 ? void 0 : config.voiceRecord) === null || _b === void 0 ? void 0 : _b.minRecordingTime) || VOICE_RECORDER_DEFAULT_MIN;
-    var _h = useVoiceRecorder({
+    var _g = useVoiceRecorder({
         onRecordingStarted: function () {
             setVoiceInputState(VoiceMessageInputStatus.RECORDING);
         },
         onRecordingEnded: function (audioFile) {
             setAudioFile(audioFile);
         },
-    }), start = _h.start, stop = _h.stop, cancel = _h.cancel, recordingTime = _h.recordingTime, recordingStatus = _h.recordingStatus, recordingLimit = _h.recordingLimit;
+    }), start = _g.start, stop = _g.stop, cancel = _g.cancel, recordingTime = _g.recordingTime, recordingStatus = _g.recordingStatus, recordingLimit = _g.recordingLimit;
     var voicePlayer = useVoicePlayer({
         channelUrl: channel === null || channel === void 0 ? void 0 : channel.url,
         key: uuid,
-        audioFile: audioFile,
+        audioFile: audioFile !== null && audioFile !== void 0 ? audioFile : undefined,
     });
     var play = voicePlayer.play, pause = voicePlayer.pause, playbackTime = voicePlayer.playbackTime, playingStatus = voicePlayer.playingStatus;
     var stopVoicePlayer = voicePlayer.stop;
@@ -60,7 +57,7 @@ var VoiceMessageInputWrapper = function (_a) {
     // call onSubmitClick when submit button is clicked and recorded audio file is created
     useEffect(function () {
         if (isSubmitted && audioFile) {
-            onSubmitClick(audioFile, recordingTime);
+            onSubmitClick === null || onSubmitClick === void 0 ? void 0 : onSubmitClick(audioFile, recordingTime);
             setSubmit(false);
             setAudioFile(null);
         }
@@ -68,7 +65,7 @@ var VoiceMessageInputWrapper = function (_a) {
     // operate which control button should be displayed
     useEffect(function () {
         if (audioFile) {
-            if (recordingTime < minRecordingTime) {
+            if (recordingTime < config.voiceRecord.minRecordingTime) {
                 setVoiceInputState(VoiceMessageInputStatus.READY_TO_RECORD);
                 setAudioFile(null);
             }
@@ -82,7 +79,7 @@ var VoiceMessageInputWrapper = function (_a) {
     }, [audioFile, recordingTime, playingStatus]);
     return (React__default.createElement("div", { className: "sendbird-voice-message-input-wrapper" },
         React__default.createElement(VoiceMessageInput, { currentValue: recordingStatus === VoiceRecorderStatus.COMPLETED ? playbackTime : recordingTime, maximumValue: recordingStatus === VoiceRecorderStatus.COMPLETED ? recordingTime : recordingLimit, currentType: voiceInputState, onCancelClick: function () {
-                onCancelClick();
+                onCancelClick === null || onCancelClick === void 0 ? void 0 : onCancelClick();
                 cancel();
                 stopVoicePlayer();
             }, onSubmitClick: function () {
@@ -103,7 +100,7 @@ var VoiceMessageInputWrapper = function (_a) {
                         break;
                     }
                     case VoiceMessageInputStatus.RECORDING: {
-                        if (recordingTime >= minRecordingTime && !isDisabled) {
+                        if (recordingTime >= config.voiceRecord.minRecordingTime && !isDisabled) {
                             stop();
                         }
                         else if (isDisabled) {
@@ -129,14 +126,14 @@ var VoiceMessageInputWrapper = function (_a) {
             } }),
         showModal && (React__default.createElement(Modal, { className: "sendbird-voice-message-input-wrapper-alert", titleText: isDisabledBecauseMuted(channel)
                 ? stringSet.MODAL__VOICE_MESSAGE_INPUT_DISABLED__TITLE_MUTED
-                : stringSet.MODAL__VOICE_MESSAGE_INPUT_DISABLED__TITLE_FROZEN, hideFooter: true, isCloseOnClickOutside: true, onCancel: function () {
+                : stringSet.MODAL__VOICE_MESSAGE_INPUT_DISABLED__TITLE_FROZEN, hideFooter: true, isCloseOnClickOutside: true, onClose: function () {
                 setShowModal(false);
-                onCancelClick();
+                onCancelClick === null || onCancelClick === void 0 ? void 0 : onCancelClick();
             } },
             React__default.createElement("div", { className: "sendbird-voice-message-input-wrapper-alert__body" },
                 React__default.createElement(Button, { className: "sendbird-voice-message-input-wrapper-alert__body__ok-button", type: ButtonTypes.PRIMARY, size: ButtonSizes.BIG, onClick: function () {
                         setShowModal(false);
-                        onCancelClick();
+                        onCancelClick === null || onCancelClick === void 0 ? void 0 : onCancelClick();
                     } }, stringSet.BUTTON__OK))))));
 };
 
@@ -281,7 +278,7 @@ var MessageInputWrapperView = React__default.forwardRef(function (props, ref) {
         && isMentionEnabled
         && mentionNickname.length > 0
         && !isBroadcast;
-    var mentionNodes = useDirtyGetMentions({ ref: ref || messageInputRef }, { logger: logger });
+    var mentionNodes = useDirtyGetMentions({ ref: (ref || messageInputRef) }, { logger: logger });
     var ableMention = (mentionNodes === null || mentionNodes === void 0 ? void 0 : mentionNodes.length) < maxMentionCount;
     // Operate states
     useEffect(function () {
@@ -310,15 +307,15 @@ var MessageInputWrapperView = React__default.forwardRef(function (props, ref) {
     var handleUploadFiles = useHandleUploadFiles({
         sendFileMessage: sendFileMessage,
         sendMultipleFilesMessage: sendMultipleFilesMessage,
-        quoteMessage: quoteMessage,
+        quoteMessage: quoteMessage !== null && quoteMessage !== void 0 ? quoteMessage : undefined,
     }, { logger: logger });
     if (isBroadcast && !isOperator) {
         /* Only `Operator` can send messages in the Broadcast channel */
         return null;
     }
     // other conditions
-    return (React__default.createElement("div", { className: "sendbird-message-input-wrapper".concat(showVoiceMessageInput ? '--voice-message' : '') },
-        showSuggestedMentionList && (React__default.createElement(SuggestedMentionList, { currentChannel: currentChannel, targetNickname: mentionNickname, inputEvent: messageInputEvent, renderUserMentionItem: renderUserMentionItem, onUserItemClick: function (user) {
+    return (React__default.createElement("div", { className: showVoiceMessageInput ? 'sendbird-message-input-wrapper--voice-message' : 'sendbird-message-input-wrapper' },
+        showSuggestedMentionList && (React__default.createElement(SuggestedMentionList, { currentChannel: currentChannel, targetNickname: mentionNickname, inputEvent: messageInputEvent !== null && messageInputEvent !== void 0 ? messageInputEvent : undefined, renderUserMentionItem: renderUserMentionItem, onUserItemClick: function (user) {
                 if (user) {
                     setMentionedUsers(__spreadArray(__spreadArray([], mentionedUsers, true), [user], false));
                 }
@@ -332,7 +329,7 @@ var MessageInputWrapperView = React__default.forwardRef(function (props, ref) {
             }, ableAddMention: ableMention, maxMentionCount: maxMentionCount, maxSuggestionCount: maxSuggestionCount })),
         quoteMessage && (React__default.createElement("div", { className: "sendbird-message-input-wrapper__quote-message-input" },
             React__default.createElement(QuoteMessageInput, { replyingMessage: quoteMessage, onClose: function () { return setQuoteMessage(null); } }))),
-        showVoiceMessageInput ? (React__default.createElement(VoiceMessageInputWrapper, { channel: currentChannel, onSubmitClick: function (recordedFile, duration) {
+        showVoiceMessageInput ? (React__default.createElement(VoiceMessageInputWrapper, { channel: currentChannel !== null && currentChannel !== void 0 ? currentChannel : undefined, onSubmitClick: function (recordedFile, duration) {
                 sendVoiceMessage({ file: recordedFile, parentMessageId: quoteMessage === null || quoteMessage === void 0 ? void 0 : quoteMessage.messageId }, duration);
                 setQuoteMessage(null);
                 setShowVoiceMessageInput(false);
@@ -341,9 +338,10 @@ var MessageInputWrapperView = React__default.forwardRef(function (props, ref) {
             } })) : (React__default.createElement(MessageInput, { className: "sendbird-message-input-wrapper__message-input", channel: currentChannel, channelUrl: currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.url, isMobile: isMobile, acceptableMimeTypes: acceptableMimeTypes, mentionSelectedUser: selectedUser, isMentionEnabled: isMentionEnabled, isVoiceMessageEnabled: isVoiceMessageEnabled, isSelectingMultipleFilesEnabled: isMultipleFilesMessageEnabled, onVoiceMessageIconClick: function () {
                 setShowVoiceMessageInput(true);
             }, setMentionedUsers: setMentionedUsers, placeholder: (quoteMessage && stringSet.MESSAGE_INPUT__QUOTE_REPLY__PLACE_HOLDER)
-                || ((disabled || isDisabledBecauseFrozen(currentChannel)) && stringSet.MESSAGE_INPUT__PLACE_HOLDER__DISABLED)
-                || (isDisabledBecauseMuted(currentChannel)
-                    && (isMobile ? stringSet.MESSAGE_INPUT__PLACE_HOLDER__MUTED_SHORT : stringSet.MESSAGE_INPUT__PLACE_HOLDER__MUTED)), ref: ref || messageInputRef, disabled: isMessageInputDisabled, renderFileUploadIcon: renderFileUploadIcon, renderSendMessageIcon: renderSendMessageIcon, renderVoiceMessageIcon: renderVoiceMessageIcon, onStartTyping: function () {
+                || (isDisabledBecauseFrozen(currentChannel) && stringSet.MESSAGE_INPUT__PLACE_HOLDER__FROZEN)
+                || (isDisabledBecauseMuted(currentChannel) && (isMobile ? stringSet.MESSAGE_INPUT__PLACE_HOLDER__MUTED_SHORT : stringSet.MESSAGE_INPUT__PLACE_HOLDER__MUTED))
+                || (disabled && stringSet.MESSAGE_INPUT__PLACE_HOLDER__DISABLED)
+                || undefined, ref: (ref || messageInputRef), disabled: isMessageInputDisabled, renderFileUploadIcon: renderFileUploadIcon, renderSendMessageIcon: renderSendMessageIcon, renderVoiceMessageIcon: renderVoiceMessageIcon, onStartTyping: function () {
                 currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.startTyping();
             }, onSendMessage: function (_a) {
                 var _b;
@@ -384,4 +382,4 @@ var MessageInputWrapperView = React__default.forwardRef(function (props, ref) {
 });
 
 export { MessageInputWrapperView as M, VoiceMessageInputWrapper as V };
-//# sourceMappingURL=bundle-2jZ-0hKC.js.map
+//# sourceMappingURL=bundle-Dg7xW_TJ.js.map

package/{cjs/chunks/bundle-BEtlTF8Q.js.map → chunks/bundle-Dg7xW_TJ.js.map}

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

package/chunks/{bundle-hF8Gurf8.js → bundle-Dj4qcISv.js}

@@ -6,4 +6,4 @@ var Role = {
 };
 
 export { Role as R };
-//# sourceMappingURL=bundle-hF8Gurf8.js.map
+//# sourceMappingURL=bundle-Dj4qcISv.js.map

package/chunks/bundle-Dj4qcISv.js.map

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

package/chunks/{bundle-DhJuLwLJ.js → bundle-Dl6p5CcR.js}

@@ -35,4 +35,4 @@ function classnames() {
 }
 
 export { classnames as c, deleteNullish as d, isMobileIOS as i, noop as n, openURL as o };
-//# sourceMappingURL=bundle-DhJuLwLJ.js.map
+//# sourceMappingURL=bundle-Dl6p5CcR.js.map

package/chunks/bundle-Dl6p5CcR.js.map

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

package/chunks/{bundle-DVc25Jb7.js → bundle-DoAELW25.js}

@@ -1,12 +1,13 @@
-import { _ as __assign } from './bundle-CDy_GVNR.js';
+import { _ as __assign } from './bundle-zAvvLMA9.js';
 import React__default from 'react';
 import { IconTypes, IconColors } from '../ui/Icon.js';
 import ChannelAvatar from '../ui/ChannelAvatar.js';
-import { g as getChannelTitle } from './bundle-uI-GOX6U.js';
-import { u as useMediaQueryContext } from './bundle-Cj-w5I5i.js';
+import { g as getChannelTitle } from './bundle-DZtW-uAN.js';
+import { u as useMediaQueryContext } from './bundle-DS8lmYaF.js';
 import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
-import { u as useLocalization } from './bundle-CAdxJnio.js';
+import { u as useLocalization } from './bundle-4r7ZPzcx.js';
 import Header from '../ui/Header.js';
+import { c as classnames } from './bundle-Dl6p5CcR.js';
 
 var GroupChannelHeaderView = function (_a) {
     var className = _a.className, currentChannel = _a.currentChannel, showSearchIcon = _a.showSearchIcon, onBackClick = _a.onBackClick, onSearchClick = _a.onSearchClick, onChatHeaderActionClick = _a.onChatHeaderActionClick, 
@@ -18,7 +19,7 @@ var GroupChannelHeaderView = function (_a) {
     var stringSet = useLocalization().stringSet;
     var isMuted = (currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.myMutedState) === 'muted';
     var channelTitle = getChannelTitle(currentChannel, userId, stringSet);
-    return (React__default.createElement(Header, { className: "sendbird-chat-header ".concat(className), renderLeft: renderLeft !== null && renderLeft !== void 0 ? renderLeft : (function () { return (React__default.createElement(React__default.Fragment, null,
+    return (React__default.createElement(Header, { className: classnames('sendbird-chat-header', className), renderLeft: renderLeft !== null && renderLeft !== void 0 ? renderLeft : (function () { return (React__default.createElement(React__default.Fragment, null,
             isMobile && (React__default.createElement(Header.Icon, { className: "sendbird-chat-header__icon_back", onClick: onBackClick, type: IconTypes.ARROW_LEFT, color: IconColors.PRIMARY, width: "24px", height: "24px" })),
             React__default.createElement(ChannelAvatar, { theme: theme, channel: currentChannel, userId: userId, height: 32, width: 32 }))); }), renderMiddle: renderMiddle !== null && renderMiddle !== void 0 ? renderMiddle : (function () { return (React__default.createElement(Header.Title, { title: channelTitle })); }), renderRight: renderRight !== null && renderRight !== void 0 ? renderRight : (function () { return (React__default.createElement(React__default.Fragment, null,
             isMuted && (React__default.createElement(Header.Icon, { className: "sendbird-chat-header__right__mute", type: IconTypes.NOTIFICATIONS_OFF_FILLED, color: IconColors.ON_BACKGROUND_2, width: "24px", height: "24px" })),
@@ -27,4 +28,4 @@ var GroupChannelHeaderView = function (_a) {
 };
 
 export { GroupChannelHeaderView as G };
-//# sourceMappingURL=bundle-DVc25Jb7.js.map
+//# sourceMappingURL=bundle-DoAELW25.js.map

package/chunks/bundle-DoAELW25.js.map

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

package/chunks/{bundle-CtgXJZJt.js → bundle-Dub0HHFi.js}

@@ -39,4 +39,4 @@ var PUBSUB_TOPICS;
 var pubSubTopics = PUBSUB_TOPICS;
 
 export { PublishingModuleType as P, shouldPubSubPublishToThread as a, PUBSUB_TOPICS as b, pubSubTopics as p, shouldPubSubPublishToChannel as s };
-//# sourceMappingURL=bundle-CtgXJZJt.js.map
+//# sourceMappingURL=bundle-Dub0HHFi.js.map

package/chunks/bundle-Dub0HHFi.js.map

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

package/chunks/{bundle-WdeDKCD0.js → bundle-DwvwhqRD.js}

@@ -1,19 +1,19 @@
-import { _ as __assign } from './bundle-CDy_GVNR.js';
+import { _ as __assign } from './bundle-zAvvLMA9.js';
 import React__default, { useState } from 'react';
 import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
-import { u as useLongPress } from './bundle-xHRJMo_A.js';
-import { u as useLocalization } from './bundle-CAdxJnio.js';
-import { u as useMediaQueryContext } from './bundle-Cj-w5I5i.js';
-import { n as noop } from './bundle-DhJuLwLJ.js';
-import { i as isVoiceMessage } from './bundle-BH5EGLxi.js';
-import { a as getTotalMembers, M as MessageStatus, b as getLastMessageCreatedAt, c as getLastMessage, d as getChannelUnreadMessageCount } from './bundle-B4q4jk6S.js';
+import { u as useLongPress } from './bundle-BNZI6WLw.js';
+import { u as useLocalization } from './bundle-4r7ZPzcx.js';
+import { u as useMediaQueryContext } from './bundle-DS8lmYaF.js';
+import { n as noop } from './bundle-Dl6p5CcR.js';
+import { i as isVoiceMessage } from './bundle-CMOqM33u.js';
+import { a as getTotalMembers, M as MessageStatus, b as getLastMessageCreatedAt, c as getLastMessage, d as getChannelUnreadMessageCount } from './bundle-Cv_JSmmp.js';
 import { TypingIndicatorText } from '../GroupChannel/components/TypingIndicator.js';
 import Badge from '../ui/Badge.js';
 import ChannelAvatar from '../ui/ChannelAvatar.js';
 import Icon, { IconTypes, IconColors } from '../ui/Icon.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from './bundle-q3jyuKU7.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from './bundle-DyVURRtM.js';
 import MentionUserLabel from '../ui/MentionUserLabel.js';
-import { M as Modal } from './bundle-DiVyB2HD.js';
+import { M as Modal } from './bundle-DEcnZTr9.js';
 import TextButton from '../ui/TextButton.js';
 
 var GroupChannelListItemView = function (_a) {
@@ -46,7 +46,7 @@ var GroupChannelListItemView = function (_a) {
                     React__default.createElement("div", { className: "sendbird-channel-preview__content__upper__header" },
                         (channel.isBroadcast || false) && (React__default.createElement("div", { className: "sendbird-channel-preview__content__upper__header__broadcast-icon" },
                             React__default.createElement(Icon, { type: IconTypes.BROADCAST, fillColor: IconColors.SECONDARY, height: "16px", width: "16px" }))),
-                        React__default.createElement(Label, { className: "sendbird-channel-preview__content__upper__header__channel-name", type: LabelTypography.SUBTITLE_2, color: LabelColors.ONBACKGROUND_1 }, channelName),
+                        React__default.createElement(Label, { className: "sendbird-channel-preview__content__upper__header__channel-name", testID: "sendbird-channel-preview__content__upper__header__channel-name", type: LabelTypography.SUBTITLE_2, color: LabelColors.ONBACKGROUND_1 }, channelName),
                         React__default.createElement(Label, { className: "sendbird-channel-preview__content__upper__header__total-members", type: LabelTypography.CAPTION_2, color: LabelColors.ONBACKGROUND_2 }, getTotalMembers(channel)),
                         (channel.isFrozen) && (React__default.createElement("div", { title: "Frozen", className: "sendbird-channel-preview__content__upper__header__frozen-icon" },
                             React__default.createElement(Icon, { type: IconTypes.FREEZE, fillColor: IconColors.PRIMARY, height: 12, width: 12 })))),
@@ -84,4 +84,4 @@ var GroupChannelListItemView = function (_a) {
 };
 
 export { GroupChannelListItemView as G };
-//# sourceMappingURL=bundle-WdeDKCD0.js.map
+//# sourceMappingURL=bundle-DwvwhqRD.js.map

package/chunks/bundle-DwvwhqRD.js.map

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

package/chunks/{bundle-q3jyuKU7.js → bundle-DyVURRtM.js}

@@ -1,6 +1,6 @@
-import { c as __spreadArray } from './bundle-CDy_GVNR.js';
+import { c as __spreadArray } from './bundle-zAvvLMA9.js';
 import React__default, { forwardRef } from 'react';
-import { g as getStringSet } from './bundle-B621kS6J.js';
+import { g as getStringSet } from './bundle-BvFSwy4a.js';
 
 var Typography = {
     H_1: 'H_1',
@@ -65,7 +65,7 @@ function changeColorToClassName(color) {
 }
 
 var Label = forwardRef(function (_a, ref) {
-    var _b = _a.className, className = _b === void 0 ? [] : _b, type = _a.type, color = _a.color, _c = _a.children, children = _c === void 0 ? null : _c;
+    var _b = _a.className, className = _b === void 0 ? [] : _b, type = _a.type, color = _a.color, _c = _a.children, children = _c === void 0 ? null : _c, testID = _a.testID;
     return (
     // Donot make this into div
     // Mention uses Label. If we use div, it would break the mention detection on Paste
@@ -74,11 +74,11 @@ var Label = forwardRef(function (_a, ref) {
             'sendbird-label',
             changeTypographyToClassName(type),
             changeColorToClassName(color),
-        ], false).join(' '), ref: ref }, children));
+        ], false).join(' '), ref: ref, "data-testid": testID }, children));
 });
 var LabelTypography = Typography;
 var LabelColors = Colors;
 var LabelStringSet = getStringSet('en');
 
 export { Label as L, LabelTypography as a, LabelColors as b, LabelStringSet as c, changeColorToClassName as d };
-//# sourceMappingURL=bundle-q3jyuKU7.js.map
+//# sourceMappingURL=bundle-DyVURRtM.js.map

package/chunks/bundle-DyVURRtM.js.map

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

package/chunks/{bundle-BUMKThPh.js → bundle-GH8narZ-.js}

@@ -1,13 +1,14 @@
 import React__default, { useRef, useContext, useEffect, useMemo, useState } from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from './bundle-q3jyuKU7.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from './bundle-DyVURRtM.js';
 import Icon, { IconTypes, IconColors } from '../ui/Icon.js';
-import { A as Avatar } from './bundle-C1XVT5qc.js';
-import { L as LocalizationContext, u as useLocalization } from './bundle-CAdxJnio.js';
-import { u as uuidv4 } from './bundle-8J9SSfIS.js';
+import { A as Avatar } from './bundle-lS9BV-1I.js';
+import { L as LocalizationContext, u as useLocalization } from './bundle-4r7ZPzcx.js';
+import { u as uuidv4 } from './bundle-sq0c8UmG.js';
+import { c as classnames } from './bundle-Dl6p5CcR.js';
 import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
-import { U as USER_MENTION_TEMP_CHAR, M as MAX_USER_MENTION_COUNT, a as MAX_USER_SUGGESTION_COUNT } from './bundle-DudTIr4X.js';
-import { M as MessageInputKeys } from './bundle-C5i4dn9q.js';
-import { a as __awaiter, b as __generator } from './bundle-CDy_GVNR.js';
+import { U as USER_MENTION_TEMP_CHAR, M as MAX_USER_MENTION_COUNT, a as MAX_USER_SUGGESTION_COUNT } from './bundle-DXjbblWF.js';
+import { M as MessageInputKeys } from './bundle-6v-jzonm.js';
+import { a as __awaiter, b as __generator } from './bundle-zAvvLMA9.js';
 
 function SuggestedUserMentionItem(props) {
     var member = props.member, _a = props.isFocused, isFocused = _a === void 0 ? false : _a, parentScrollRef = props.parentScrollRef, onClick = props.onClick, onMouseOver = props.onMouseOver, onMouseMove = props.onMouseMove, renderUserMentionItem = props.renderUserMentionItem;
@@ -28,10 +29,10 @@ function SuggestedUserMentionItem(props) {
     if (customMentionItem) {
         return customMentionItem;
     }
-    return (React__default.createElement("div", { className: "sendbird-mention-suggest-list__user-item ".concat(isFocused ? 'focused' : ''), onClick: function (event) { return onClick === null || onClick === void 0 ? void 0 : onClick({ event: event, member: member, itemRef: scrollRef }); }, onMouseOver: function (event) { return onMouseOver === null || onMouseOver === void 0 ? void 0 : onMouseOver({ event: event, member: member, itemRef: scrollRef }); }, onMouseMove: function (event) { return onMouseMove === null || onMouseMove === void 0 ? void 0 : onMouseMove({ event: event, member: member, itemRef: scrollRef }); }, key: (member === null || member === void 0 ? void 0 : member.userId) || uuidv4(), ref: scrollRef },
+    return (React__default.createElement("div", { className: classnames('sendbird-mention-suggest-list__user-item', isFocused && 'focused'), onClick: function (event) { return onClick === null || onClick === void 0 ? void 0 : onClick({ event: event, member: member, itemRef: scrollRef }); }, onMouseOver: function (event) { return onMouseOver === null || onMouseOver === void 0 ? void 0 : onMouseOver({ event: event, member: member, itemRef: scrollRef }); }, onMouseMove: function (event) { return onMouseMove === null || onMouseMove === void 0 ? void 0 : onMouseMove({ event: event, member: member, itemRef: scrollRef }); }, key: (member === null || member === void 0 ? void 0 : member.userId) || uuidv4(), ref: scrollRef },
         React__default.createElement(Avatar, { className: "sendbird-mention-suggest-list__user-item__avatar", src: member === null || member === void 0 ? void 0 : member.profileUrl, alt: "user-profile", width: "24px", height: "24px" }),
-        React__default.createElement(Label, { className: "sendbird-mention-suggest-list__user-item__nickname", type: LabelTypography.SUBTITLE_2, color: (member === null || member === void 0 ? void 0 : member.nickname) ? LabelColors.ONBACKGROUND_1 : LabelColors.ONBACKGROUND_3 }, (member === null || member === void 0 ? void 0 : member.nickname) || (stringSet === null || stringSet === void 0 ? void 0 : stringSet.MENTION_NAME__NO_NAME)),
-        React__default.createElement(Label, { className: "sendbird-mention-suggest-list__user-item__user-id", type: LabelTypography.SUBTITLE_2, color: LabelColors.ONBACKGROUND_2 }, member === null || member === void 0 ? void 0 : member.userId)));
+        React__default.createElement(Label, { className: "sendbird-mention-suggest-list__user-item__nickname", testID: "sendbird-mention-suggest-list__user-item__nickname", type: LabelTypography.SUBTITLE_2, color: (member === null || member === void 0 ? void 0 : member.nickname) ? LabelColors.ONBACKGROUND_1 : LabelColors.ONBACKGROUND_3 }, (member === null || member === void 0 ? void 0 : member.nickname) || (stringSet === null || stringSet === void 0 ? void 0 : stringSet.MENTION_NAME__NO_NAME)),
+        React__default.createElement(Label, { className: "sendbird-mention-suggest-list__user-item__user-id", testID: "sendbird-mention-suggest-list__user-item__user-id", type: LabelTypography.SUBTITLE_2, color: LabelColors.ONBACKGROUND_2 }, member === null || member === void 0 ? void 0 : member.userId)));
 }
 
 function fetchMembersFromChannel(currentUserId, channel, maxSuggestionCount, searchString) {
@@ -83,29 +84,29 @@ var SuggestedMentionListView = function (props) {
     var _m = useState(null), currentFocusedMember = _m[0], setCurrentFocusedMember = _m[1];
     var _o = useState([]), currentMemberList = _o[0], setCurrentMemberList = _o[1];
     useEffect(function () {
-        clearTimeout(timer);
+        clearTimeout(timer !== null && timer !== void 0 ? timer : undefined);
         setTimer(setTimeout(function () {
             setSearchString(targetNickname);
         }, DEBOUNCING_TIME));
     }, [targetNickname]);
     useEffect(function () {
         if ((inputEvent === null || inputEvent === void 0 ? void 0 : inputEvent.key) === MessageInputKeys.Enter) {
-            if (currentMemberList.length > 0) {
-                onUserItemClick(currentFocusedMember);
+            if (currentFocusedMember && currentMemberList.length > 0) {
+                onUserItemClick === null || onUserItemClick === void 0 ? void 0 : onUserItemClick(currentFocusedMember);
             }
         }
         if ((inputEvent === null || inputEvent === void 0 ? void 0 : inputEvent.key) === MessageInputKeys.ArrowUp) {
             var currentUserIndex = currentMemberList.findIndex(function (member) { return (member === null || member === void 0 ? void 0 : member.userId) === (currentFocusedMember === null || currentFocusedMember === void 0 ? void 0 : currentFocusedMember.userId); });
             if (0 < currentUserIndex) {
                 setCurrentFocusedMember(currentMemberList[currentUserIndex - 1]);
-                onFocusItemChange(currentMemberList[currentUserIndex - 1]);
+                onFocusItemChange === null || onFocusItemChange === void 0 ? void 0 : onFocusItemChange(currentMemberList[currentUserIndex - 1]);
             }
         }
         if ((inputEvent === null || inputEvent === void 0 ? void 0 : inputEvent.key) === MessageInputKeys.ArrowDown) {
             var currentUserIndex = currentMemberList.findIndex(function (member) { return (member === null || member === void 0 ? void 0 : member.userId) === (currentFocusedMember === null || currentFocusedMember === void 0 ? void 0 : currentFocusedMember.userId); });
             if (currentUserIndex < currentMemberList.length - 1) {
                 setCurrentFocusedMember(currentMemberList[currentUserIndex + 1]);
-                onFocusItemChange(currentMemberList[currentUserIndex + 1]);
+                onFocusItemChange === null || onFocusItemChange === void 0 ? void 0 : onFocusItemChange(currentMemberList[currentUserIndex + 1]);
             }
         }
     }, [inputEvent]);
@@ -131,7 +132,7 @@ var SuggestedMentionListView = function (props) {
                 setCurrentFocusedMember(suggestingMembers[0]);
             }
             setLastSearchString(searchString);
-            onFetchUsers(suggestingMembers);
+            onFetchUsers === null || onFetchUsers === void 0 ? void 0 : onFetchUsers(suggestingMembers);
             setCurrentMemberList(suggestingMembers);
         })
             .catch(function (error) {
@@ -153,11 +154,11 @@ var SuggestedMentionListView = function (props) {
     if (!ableAddMention && currentMemberList.length === 0) {
         return null;
     }
-    return (React__default.createElement("div", { className: "sendbird-mention-suggest-list ".concat(className), key: "sendbird-mention-suggest-list", ref: scrollRef },
+    return (React__default.createElement("div", { className: classnames('sendbird-mention-suggest-list', className), "data-testid": "sendbird-mention-suggest-list", key: "sendbird-mention-suggest-list", ref: scrollRef },
         ableAddMention
             && (currentMemberList === null || currentMemberList === void 0 ? void 0 : currentMemberList.map(function (member) { return (React__default.createElement(SuggestedUserMentionItem, { key: (member === null || member === void 0 ? void 0 : member.userId) || uuidv4(), member: member, isFocused: (member === null || member === void 0 ? void 0 : member.userId) === (currentFocusedMember === null || currentFocusedMember === void 0 ? void 0 : currentFocusedMember.userId), parentScrollRef: scrollRef, onClick: function (_a) {
                     var member = _a.member;
-                    onUserItemClick(member);
+                    onUserItemClick === null || onUserItemClick === void 0 ? void 0 : onUserItemClick(member);
                 }, onMouseOver: function (_a) {
                     var member = _a.member;
                     setCurrentFocusedMember(member);
@@ -168,4 +169,4 @@ var SuggestedMentionListView = function (props) {
 };
 
 export { SuggestedMentionListView as S };
-//# sourceMappingURL=bundle-BUMKThPh.js.map
+//# sourceMappingURL=bundle-GH8narZ-.js.map

package/chunks/{bundle-BEbribQZ.js.map → bundle-GH8narZ-.js.map}

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

package/chunks/{bundle-2vhBVWLQ.js → bundle-HbS5lB90.js}

@@ -1,4 +1,4 @@
-import { d as __extends, _ as __assign } from './bundle-CDy_GVNR.js';
+import { d as __extends, _ as __assign } from './bundle-zAvvLMA9.js';
 import React__default from 'react';
 import { createPortal } from 'react-dom';
 
@@ -66,7 +66,7 @@ var MenuItems = /** @class */ (function (_super) {
             return menuStyle;
         };
         _this.state = {
-            menuStyle: {},
+            menuStyle: { top: 0, left: 0 },
             handleClickOutside: function () { },
         };
         return _this;
@@ -79,15 +79,17 @@ var MenuItems = /** @class */ (function (_super) {
         this.cleanUpEvents();
     };
     MenuItems.prototype.render = function () {
-        var _a;
+        var portalElement = document.getElementById('sendbird-dropdown-portal');
+        if (!portalElement)
+            return React__default.createElement(React__default.Fragment, null);
         var menuStyle = this.state.menuStyle;
-        var _b = this.props, children = _b.children, style = _b.style, _c = _b.className, className = _c === void 0 ? '' : _c;
-        return (createPortal((React__default.createElement("div", { className: (_a = this.props) === null || _a === void 0 ? void 0 : _a.className },
+        var _a = this.props, children = _a.children, style = _a.style, _b = _a.className, className = _b === void 0 ? '' : _b, testID = _a.testID;
+        return (createPortal((React__default.createElement("div", { className: className, "data-testid": testID },
             React__default.createElement("div", { className: "sendbird-dropdown__menu-backdrop" }),
-            React__default.createElement("ul", { className: "".concat(className, " sendbird-dropdown__menu"), ref: this.menuRef, style: __assign({ display: 'inline-block', position: 'fixed', left: "".concat(Math.round(menuStyle.left), "px"), top: "".concat(Math.round(menuStyle.top), "px") }, style) }, children))), document.getElementById('sendbird-dropdown-portal')));
+            React__default.createElement("ul", { className: "".concat(className, " sendbird-dropdown__menu"), ref: this.menuRef, style: __assign({ display: 'inline-block', position: 'fixed', left: "".concat(Math.round(menuStyle.left), "px"), top: "".concat(Math.round(menuStyle.top), "px") }, style), "data-testid": "sendbird-dropdown-menu" }, children))), portalElement));
     };
     return MenuItems;
 }(React__default.Component));
 
 export { MenuItems as M };
-//# sourceMappingURL=bundle-2vhBVWLQ.js.map
+//# sourceMappingURL=bundle-HbS5lB90.js.map

package/{cjs/chunks/bundle-Bpy7IQta.js.map → chunks/bundle-HbS5lB90.js.map}

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

package/chunks/{bundle-Chn4Xw78.js → bundle-Kycskx-O.js}

@@ -1,4 +1,4 @@
-import { K, c as isMultipleFilesMessage } from './bundle-BH5EGLxi.js';
+import { K, c as isMultipleFilesMessage } from './bundle-CMOqM33u.js';
 
 function getModalDeleteMessageTitle(stringSet, message) {
     return K(message)
@@ -12,4 +12,4 @@ function getModalDeleteMessageTitle(stringSet, message) {
 }
 
 export { getModalDeleteMessageTitle as g };
-//# sourceMappingURL=bundle-Chn4Xw78.js.map
+//# sourceMappingURL=bundle-Kycskx-O.js.map

package/chunks/bundle-Kycskx-O.js.map

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