@sendbird/uikit-react 3.11.2-alpha.0 → 3.12.0-rc.1

package/App.js

@@ -1,121 +1,95 @@
-import React__default, { useEffect, useState, useRef, useContext } from 'react';
+import React__default, { useState, useEffect } from 'react';
 import { SendbirdProvider } from './SendbirdProvider.js';
-import { u as useMediaQueryContext } from './chunks/bundle-YRvxgYKR.js';
-import { _ as __assign, b as __awaiter, c as __generator } from './chunks/bundle-lecuE4TA.js';
-import { u as useGroupChannelContext, G as GroupChannelProvider } from './chunks/bundle-3voNlUUD.js';
-import { G as GroupChannelUIView } from './chunks/bundle-ykz8bgi9.js';
-import { G as GroupChannelHeaderView } from './chunks/bundle-O76AfJcB.js';
-import { useIIFE, useGroupChannelHandler } from '@sendbird/uikit-tools';
-import { T as TypingIndicatorType } from './chunks/bundle-Tga27YgW.js';
-import PlaceHolder, { PlaceHolderTypes } from './ui/PlaceHolder.js';
-import Icon, { IconTypes, IconColors } from './ui/Icon.js';
-import { useSendbirdStateContext } from './useSendbirdStateContext.js';
-import { g as getSuggestedReplies, Q as isSendableMessage } from './chunks/bundle-tuaNTnsI.js';
-import { i as isDisabledBecauseFrozen, a as isDisabledBecauseMuted, c as getComponentKeyFromMessage } from './chunks/bundle-V_OdjTo0.js';
-import { a as MessageView } from './chunks/bundle-8qqVdWGU.js';
-import { a as FileViewerView } from './chunks/bundle-1pmw9ZjP.js';
-import { a as RemoveMessageModalView } from './chunks/bundle-BdJkMGvq.js';
-import { getMessagePartsInfo } from './Channel/utils/getMessagePartsInfo.js';
-import { U as UnreadCount } from './chunks/bundle-6ruaH4rs.js';
-import { F as FrozenNotification } from './chunks/bundle-nHrkzCe9.js';
-import { S as SCROLL_BUFFER } from './chunks/bundle-AGBz-vkr.js';
-import { MessageProvider } from './Message/context.js';
-import TypingIndicatorBubble from './ui/TypingIndicatorBubble.js';
-import { M as MessageInputWrapperView } from './chunks/bundle-bMcW1GEP.js';
-import { L as LocalizationContext, u as useLocalization } from './chunks/bundle-x89ikMo3.js';
-import { u as useVoicePlayerContext, b as ALL } from './chunks/bundle-BGYKrNzm.js';
-import './VoiceRecorder/context.js';
-import './chunks/bundle-b3SHlOhn.js';
-import './chunks/bundle-AmJs7yMV.js';
-import 'react-dom';
-import IconButton from './ui/IconButton.js';
-import './ui/Button.js';
-import { u as useGroupChannelListContext, G as GroupChannelListItemView, a as GroupChannelListProvider } from './chunks/bundle-e4D37XFd.js';
-import { G as GroupChannelListUIView } from './chunks/bundle-saqL4CE1.js';
-import ContextMenu, { MenuItems, MenuItem } from './ui/ContextMenu.js';
-import { L as LeaveGroupChannel } from './chunks/bundle-yGKmazki.js';
-import { d as getChannelTitle } from './chunks/bundle-03KTtPvp.js';
-import { a as AddGroupChannelView } from './chunks/bundle-_umZmDrR.js';
+import { u as useMediaQueryContext } from './chunks/bundle-R_8mFuwU.js';
+import { _ as __assign } from './chunks/bundle-s7Jm-nQL.js';
+import { GroupChannel } from './GroupChannel.js';
+import { GroupChannelList } from './GroupChannelList.js';
 import Channel from './Channel.js';
 import ChannelList from './ChannelList.js';
 import ChannelSettings from './ChannelSettings.js';
 import MessageSearchPannel from './MessageSearch.js';
 import Thread from './Thread.js';
 import { GroupChannelHandler } from '@sendbird/chat/groupChannel';
-import { u as uuidv4 } from './chunks/bundle-SixFq6AN.js';
+import { useSendbirdStateContext } from './useSendbirdStateContext.js';
+import { u as uuidv4 } from './chunks/bundle-mXxUWu6C.js';
+import { u as useVoicePlayerContext, a as ALL } from './chunks/bundle-5waczf_5.js';
+import '@sendbird/uikit-tools';
 import './withSendbird.js';
 import 'css-vars-ponyfill';
-import './chunks/bundle-ufJxA-XY.js';
-import './chunks/bundle-2W5CyGcR.js';
-import './chunks/bundle-tq1N8mXT.js';
+import './chunks/bundle-jnJfrZ-B.js';
+import './chunks/bundle--bzcDcV7.js';
+import './chunks/bundle-y9OFIxWO.js';
 import '@sendbird/chat';
 import '@sendbird/chat/openChannel';
-import './chunks/bundle-9V468X-z.js';
-import './chunks/bundle-t6XeIQNm.js';
-import './chunks/bundle-vD0TG7zV.js';
-import './chunks/bundle-nbI9uEwl.js';
-import './hooks/useModal.js';
-import './chunks/bundle-mZbqaM1H.js';
-import './chunks/bundle-3D1PZ-ud.js';
+import './chunks/bundle-aAXpX7Sl.js';
 import './utils/message/getOutgoingMessageState.js';
-import './ui/MessageInput.js';
-import './chunks/bundle-gW6uMATy.js';
-import './chunks/bundle-vhdBaDF3.js';
-import './chunks/bundle-1MLJ8bKz.js';
-import 'dompurify';
-import './chunks/bundle-Oj2BtjtX.js';
-import './chunks/bundle-VYxAZvjJ.js';
-import './chunks/bundle-IxZaogwa.js';
-import './chunks/bundle-7kUZVeKf.js';
-import './chunks/bundle-vDQ-M9vf.js';
-import './chunks/bundle-ZvLiKWK6.js';
-import './chunks/bundle-4V0JvqcA.js';
-import './ui/ImageRenderer.js';
-import './chunks/bundle-UnPRF3Nm.js';
-import './Thread/context.js';
-import './chunks/bundle-jHcn1nNl.js';
-import './chunks/bundle-eAstRp6b.js';
-import './chunks/bundle-8y_Wbyn2.js';
+import './chunks/bundle-CBZRgcMe.js';
+import './chunks/bundle-OGLIDsv0.js';
+import './VoiceRecorder/context.js';
+import './chunks/bundle-QDjzCG-h.js';
+import './chunks/bundle-FS7VoABk.js';
+import './chunks/bundle-Cl9FF01U.js';
+import './chunks/bundle-hwjo__1w.js';
+import 'react-dom';
+import './ui/IconButton.js';
+import './ui/Button.js';
+import './chunks/bundle-YcH_HSha.js';
+import './ui/Icon.js';
+import './chunks/bundle-42MD-_6f.js';
+import './chunks/bundle-mah5uoR7.js';
+import './hooks/useModal.js';
+import './GroupChannel/context.js';
 import '@sendbird/chat/message';
-import './chunks/bundle-e2Vf46hw.js';
-import './Thread/context/types.js';
-import './chunks/bundle-DFJxeHcS.js';
-import './chunks/bundle-e06TkgoP.js';
-import './chunks/bundle-sYlsEiNr.js';
-import './chunks/bundle-S3d13RAB.js';
-import './chunks/bundle-jkXn2rcR.js';
-import './chunks/bundle-jprwmfK0.js';
-import './Message/hooks/useDirtyGetMentions.js';
-import './Channel/hooks/useHandleUploadFiles.js';
-import './chunks/bundle-va8TD_Fs.js';
-import './Channel/context.js';
-import './chunks/bundle-kRJ4EZ82.js';
-import './chunks/bundle-93t4h18D.js';
-import './Channel/hooks/useInitialMessagesFetch.js';
-import './chunks/bundle-nVxyz_Ps.js';
-import './chunks/bundle-iM79wLQe.js';
+import './chunks/bundle-7-k9ar1S.js';
+import './chunks/bundle-fIf1YwSi.js';
+import './chunks/bundle-5qVfPYXm.js';
+import './chunks/bundle-aU9DrOs1.js';
+import './chunks/bundle-W5PUqymk.js';
+import './chunks/bundle-hTd1NizA.js';
+import './chunks/bundle-29ZwEQCB.js';
+import './GroupChannel/components/GroupChannelUI.js';
+import './chunks/bundle-WkSXViPf.js';
+import './GroupChannel/components/TypingIndicator.js';
+import './chunks/bundle-VTgol5b8.js';
 import './ui/ConnectionStatus.js';
-import './Channel/components/MessageInput.js';
-import './ui/QuoteMessageInput.js';
-import './chunks/bundle-98tjOpH2.js';
-import './VoicePlayer/useVoicePlayer.js';
-import './VoiceRecorder/useVoiceRecorder.js';
-import './chunks/bundle-YWMb9Ley.js';
-import './ui/PlaybackTime.js';
-import './ui/ProgressBar.js';
-import './ui/TextButton.js';
-import './ui/ChannelAvatar.js';
-import './chunks/bundle-DGx57oZD.js';
-import './chunks/bundle-mFqS5lYt.js';
-import './chunks/bundle-ZG2fGdWl.js';
+import './ui/PlaceHolder.js';
 import './ui/Loader.js';
+import './GroupChannel/components/GroupChannelHeader.js';
+import './chunks/bundle-IGjDRlEq.js';
+import './ui/ChannelAvatar.js';
+import './chunks/bundle-JVFq7QiY.js';
+import './ui/ImageRenderer.js';
+import './chunks/bundle-S3i59_HU.js';
+import './chunks/bundle-dPtRdKjv.js';
+import './chunks/bundle-WJ0Rx9Vt.js';
+import './GroupChannel/components/MessageList.js';
+import './GroupChannel/components/Message.js';
+import './chunks/bundle-bXxgZ3h3.js';
+import './chunks/bundle-lS2bdzD_.js';
+import './chunks/bundle-ZOw_iEjI.js';
+import './chunks/bundle-iRd3nywJ.js';
+import './Message/hooks/useDirtyGetMentions.js';
 import './ui/DateSeparator.js';
+import './chunks/bundle-jIsbkecD.js';
+import './ui/MessageInput.js';
+import './chunks/bundle-1Wok5yjx.js';
+import './chunks/bundle-B2cNVPIG.js';
+import 'dompurify';
+import './chunks/bundle-YK6gNh-t.js';
+import './chunks/bundle-ThaFnyA3.js';
+import './chunks/bundle-mbVaGxy-.js';
+import './chunks/bundle-fdlrWGps.js';
 import './ui/MessageContent.js';
+import './chunks/bundle-InXDhFjw.js';
+import './chunks/bundle-RFQg3r1K.js';
+import './chunks/bundle-OdLkkyEZ.js';
 import './ui/MessageItemMenu.js';
+import './ui/ContextMenu.js';
 import './ui/SortByRow.js';
+import './chunks/bundle-NRvvlX8r.js';
 import './ui/MessageItemReactionMenu.js';
 import './ui/ReactionButton.js';
-import './chunks/bundle-RO3-Tf7C.js';
+import './chunks/bundle-zftI06HH.js';
 import './ui/EmojiReactions.js';
 import './ui/ReactionBadge.js';
 import './ui/BottomSheet.js';
@@ -126,42 +100,88 @@ import './ui/UserProfile.js';
 import './sendbirdSelectors.js';
 import './ui/Tooltip.js';
 import './ui/TooltipWrapper.js';
+import './Message/context.js';
 import './ui/AdminMessage.js';
 import './ui/QuoteMessage.js';
-import './chunks/bundle-NaRW0ez0.js';
+import './chunks/bundle-FMptIFTe.js';
+import './chunks/bundle-c-m52z_J.js';
 import './ui/ThreadReplies.js';
 import './ui/OGMessageItemBody.js';
-import './chunks/bundle-HjzQRddo.js';
+import './chunks/bundle-PXF29EwZ.js';
 import './ui/MentionLabel.js';
 import './ui/LinkLabel.js';
 import './ui/TextMessageItemBody.js';
 import './ui/FileMessageItemBody.js';
-import './chunks/bundle-gOoIGWGP.js';
-import './chunks/bundle-aJFlCJGp.js';
-import './chunks/bundle-5b9e9OHZ.js';
+import './ui/TextButton.js';
+import './chunks/bundle-2ZdAkcAR.js';
+import './chunks/bundle-8msIvFyl.js';
+import './chunks/bundle-5cA2H0cQ.js';
 import './ui/VoiceMessageItemBody.js';
+import './ui/ProgressBar.js';
+import './VoicePlayer/useVoicePlayer.js';
+import './ui/PlaybackTime.js';
 import './ui/ThumbnailMessageItemBody.js';
 import './ui/UnknownMessageItemBody.js';
 import './ui/FeedbackIconButton.js';
 import './ui/MobileFeedbackMenu.js';
 import './Channel/components/MessageFeedbackModal.js';
 import './ui/Input.js';
-import './chunks/bundle-IIsEENu-.js';
-import './chunks/bundle-V2BHS5YW.js';
-import './chunks/bundle-7pdr9tV3.js';
+import './GroupChannel/components/SuggestedReplies.js';
+import './GroupChannel/components/FileViewer.js';
+import './chunks/bundle-H1vLRvsQ.js';
+import './GroupChannel/components/RemoveMessageModal.js';
+import './chunks/bundle-TWhlUSzV.js';
+import './chunks/bundle-HIwSRGfa.js';
+import './Channel/utils/getMessagePartsInfo.js';
 import './Channel/utils/compareMessagesForGrouping.js';
-import './chunks/bundle-JDmJWzNI.js';
-import './ui/Badge.js';
-import './ui/MentionUserLabel.js';
-import './chunks/bundle-MQsPfC_7.js';
+import './GroupChannel/components/UnreadCount.js';
+import './GroupChannel/components/FrozenNotification.js';
+import './ui/TypingIndicatorBubble.js';
+import './GroupChannel/components/MessageInputWrapper.js';
+import './chunks/bundle-kPmyq9ap.js';
+import './GroupChannel/components/SuggestedMentionList.js';
+import './ui/QuoteMessageInput.js';
+import './VoiceRecorder/useVoiceRecorder.js';
+import './chunks/bundle-VeP4ZGTy.js';
+import './chunks/bundle-GMuoHJM5.js';
+import './GroupChannelList/context.js';
+import './GroupChannelList/components/GroupChannelListUI.js';
+import './chunks/bundle-7gmFtphc.js';
+import './GroupChannelList/components/GroupChannelListHeader.js';
 import './EditUserProfile.js';
 import './EditUserProfile/context.js';
 import './EditUserProfile/components/EditUserProfileUI.js';
+import './GroupChannelList/components/GroupChannelPreviewAction.js';
+import './GroupChannelList/components/GroupChannelListItem.js';
+import './chunks/bundle-MVZc-WX7.js';
+import './ui/Badge.js';
+import './ui/MentionUserLabel.js';
+import './GroupChannelList/components/AddGroupChannel.js';
+import './chunks/bundle-B3ETdLpu.js';
 import './CreateChannel.js';
 import './CreateChannel/components/CreateChannelUI.js';
-import './chunks/bundle-uaykoMl_.js';
+import './chunks/bundle-Yc91ktUe.js';
 import './CreateChannel/components/InviteUsers.js';
 import './CreateChannel/components/SelectChannelType.js';
+import './Channel/context.js';
+import './chunks/bundle-zr28rXX0.js';
+import './chunks/bundle-ammXYCNc.js';
+import './chunks/bundle-yMF6_bQS.js';
+import './Channel/hooks/useInitialMessagesFetch.js';
+import './chunks/bundle-sPCqUzdP.js';
+import './chunks/bundle-Mj9lwGep.js';
+import './Channel/components/ChannelUI.js';
+import './Channel/components/ChannelHeader.js';
+import './Channel/components/MessageList.js';
+import './Channel/components/Message.js';
+import './Channel/components/FileViewer.js';
+import './Channel/components/RemoveMessageModal.js';
+import './chunks/bundle-PrPMpr0d.js';
+import './Channel/components/MessageInput.js';
+import './chunks/bundle-nuPs9AqY.js';
+import './ChannelList/components/ChannelListUI.js';
+import './ChannelList/components/ChannelPreview.js';
+import './ChannelList/components/AddChannel.js';
 import './ChannelSettings/components/ChannelSettingsUI.js';
 import './ChannelSettings/context.js';
 import './ChannelSettings/components/ChannelProfile.js';
@@ -169,296 +189,29 @@ import './ChannelSettings/components/EditDetailsModal.js';
 import './ChannelSettings/components/ModerationPanel.js';
 import './ui/Accordion.js';
 import './ui/AccordionGroup.js';
-import './chunks/bundle-HactSQTv.js';
+import './chunks/bundle-laqNvtHc.js';
 import './ui/Toggle.js';
 import './ChannelSettings/components/UserListItem.js';
-import './chunks/bundle-ylVRefJG.js';
+import './chunks/bundle-Eiortw-P.js';
 import './ChannelSettings/components/LeaveChannel.js';
 import './ChannelSettings/components/UserPanel.js';
 import './MessageSearch/components/MessageSearchUI.js';
 import './MessageSearch/context.js';
 import './ui/MessageSearchItem.js';
 import './ui/MessageSearchFileItem.js';
+import './Thread/context.js';
+import './Thread/context/types.js';
 import './Thread/components/ThreadUI.js';
 import './Thread/components/ParentMessageInfo.js';
-import './chunks/bundle-gNV9jB2z.js';
+import './chunks/bundle-WJbfhl8B.js';
 import './Thread/components/ParentMessageInfoItem.js';
+import './chunks/bundle-e_hMfMVC.js';
 import './Thread/components/ThreadHeader.js';
 import './Thread/components/ThreadList.js';
 import './Thread/components/ThreadListItem.js';
 import 'date-fns';
-
-var GroupChannelHeader = function (_a) {
-    var className = _a.className;
-    var context = useGroupChannelContext();
-    return (React__default.createElement(GroupChannelHeaderView, __assign({}, context, { className: className, currentChannel: context.currentChannel })));
-};
-
-var FileViewer = function (props) {
-    var deleteMessage = useGroupChannelContext().deleteMessage;
-    return React__default.createElement(FileViewerView, __assign({}, props, { deleteMessage: deleteMessage }));
-};
-
-var RemoveMessageModal = function (props) {
-    var deleteMessage = useGroupChannelContext().deleteMessage;
-    return React__default.createElement(RemoveMessageModalView, __assign({}, props, { deleteMessage: deleteMessage }));
-};
-
-var Message = function (props) {
-    var _a = useSendbirdStateContext(), config = _a.config, emojiManager = _a.emojiManager;
-    var _b = useGroupChannelContext(), loading = _b.loading, currentChannel = _b.currentChannel, animatedMessageId = _b.animatedMessageId, setAnimatedMessageId = _b.setAnimatedMessageId, scrollToMessage = _b.scrollToMessage, replyType = _b.replyType, threadReplySelectType = _b.threadReplySelectType, isReactionEnabled = _b.isReactionEnabled, toggleReaction = _b.toggleReaction, nicknamesMap = _b.nicknamesMap, setQuoteMessage = _b.setQuoteMessage, renderUserMentionItem = _b.renderUserMentionItem, onQuoteMessageClick = _b.onQuoteMessageClick, onReplyInThreadClick = _b.onReplyInThreadClick, onMessageAnimated = _b.onMessageAnimated, messages = _b.messages, updateUserMessage = _b.updateUserMessage, sendUserMessage = _b.sendUserMessage, resendMessage = _b.resendMessage, deleteMessage = _b.deleteMessage;
-    var message = props.message;
-    var initialized = !loading && Boolean(currentChannel);
-    var shouldRenderSuggestedReplies = useIIFE(function () {
-        var _a, _b;
-        if (!((_a = config === null || config === void 0 ? void 0 : config.groupChannel) === null || _a === void 0 ? void 0 : _a.enableSuggestedReplies))
-            return false;
-        if (message.messageId !== ((_b = currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.lastMessage) === null || _b === void 0 ? void 0 : _b.messageId))
-            return false;
-        if (getSuggestedReplies(message).length === 0)
-            return false;
-        var lastMessage = messages[messages.length - 1];
-        if (lastMessage && isSendableMessage(lastMessage) && lastMessage.sendingStatus !== 'succeeded')
-            return false;
-        return true;
-    });
-    return (React__default.createElement(MessageView, __assign({}, props, { channel: currentChannel, emojiContainer: emojiManager.emojiContainer, editInputDisabled: !initialized || isDisabledBecauseFrozen(currentChannel) || isDisabledBecauseMuted(currentChannel) || !config.isOnline, shouldRenderSuggestedReplies: shouldRenderSuggestedReplies, isReactionEnabled: isReactionEnabled, replyType: replyType, threadReplySelectType: threadReplySelectType, nicknamesMap: nicknamesMap, renderUserMentionItem: renderUserMentionItem, scrollToMessage: scrollToMessage, toggleReaction: toggleReaction, setQuoteMessage: setQuoteMessage, onQuoteMessageClick: onQuoteMessageClick, onReplyInThreadClick: onReplyInThreadClick, sendUserMessage: sendUserMessage, updateUserMessage: updateUserMessage, resendMessage: resendMessage, deleteMessage: deleteMessage, animatedMessageId: animatedMessageId, setAnimatedMessageId: setAnimatedMessageId, onMessageAnimated: onMessageAnimated, renderFileViewer: function (props) { return React__default.createElement(FileViewer, __assign({}, props)); }, renderRemoveMessageModal: function (props) { return React__default.createElement(RemoveMessageModal, __assign({}, props)); } })));
-};
-
-function useScrollBehavior() {
-    var _a = useGroupChannelContext(), scrollRef = _a.scrollRef, _b = _a.scrollBehavior, scrollBehavior = _b === void 0 ? 'auto' : _b;
-    useEffect(function () {
-        if (scrollRef.current) {
-            scrollRef.current.style.scrollBehavior = scrollBehavior;
-        }
-    }, [scrollRef.current]);
-    return null;
-}
-
-var MessageList = function (_a) {
-    var _b, _c, _d, _e, _f;
-    var _g = _a.className, className = _g === void 0 ? '' : _g, renderMessage = _a.renderMessage, renderPlaceholderEmpty = _a.renderPlaceholderEmpty, renderCustomSeparator = _a.renderCustomSeparator, renderPlaceholderLoader = _a.renderPlaceholderLoader, renderFrozenNotification = _a.renderFrozenNotification;
-    var _h = useGroupChannelContext(), channelUrl = _h.channelUrl, hasNext = _h.hasNext, loading = _h.loading, messages = _h.messages, newMessages = _h.newMessages, scrollToBottom = _h.scrollToBottom, isScrollBottomReached = _h.isScrollBottomReached, isMessageGroupingEnabled = _h.isMessageGroupingEnabled, scrollRef = _h.scrollRef, scrollDistanceFromBottomRef = _h.scrollDistanceFromBottomRef, currentChannel = _h.currentChannel, replyType = _h.replyType, scrollPubSub = _h.scrollPubSub;
-    var store = useSendbirdStateContext();
-    var _j = useState(), unreadSinceDate = _j[0], setUnreadSinceDate = _j[1];
-    useScrollBehavior();
-    useEffect(function () {
-        if (isScrollBottomReached) {
-            setUnreadSinceDate(undefined);
-        }
-        else {
-            setUnreadSinceDate(new Date());
-        }
-    }, [isScrollBottomReached]);
-    /**
-     * 1. Move the message list scroll
-     *    when each message's height is changed by `reactions` OR `showEdit`
-     * 2. Keep the scrollBottom value after fetching new message list
-     */
-    var onMessageContentSizeChanged = function (isBottomMessageAffected) {
-        if (isBottomMessageAffected === void 0) { isBottomMessageAffected = false; }
-        var elem = scrollRef.current;
-        if (elem) {
-            var latestDistance = scrollDistanceFromBottomRef.current;
-            var currentDistance = elem.scrollHeight - elem.scrollTop - elem.offsetHeight;
-            if (latestDistance < currentDistance && (!isBottomMessageAffected || latestDistance < SCROLL_BUFFER)) {
-                var diff = currentDistance - latestDistance;
-                // Move the scroll as much as the height of the message has changed
-                scrollPubSub.publish('scroll', { top: elem.scrollTop + diff, lazy: false });
-            }
-        }
-    };
-    var renderer = {
-        frozenNotification: function () {
-            if (!currentChannel || !currentChannel.isFrozen)
-                return null;
-            if (renderFrozenNotification)
-                return renderFrozenNotification();
-            return React__default.createElement(FrozenNotification, { className: "sendbird-conversation__messages__notification" });
-        },
-        unreadMessagesNotification: function () {
-            if (isScrollBottomReached || !unreadSinceDate)
-                return null;
-            return (React__default.createElement(UnreadCount, { className: "sendbird-conversation__messages__notification", count: newMessages.length, lastReadAt: unreadSinceDate, onClick: scrollToBottom }));
-        },
-        scrollToBottomButton: function () {
-            if (!hasNext() && isScrollBottomReached)
-                return null;
-            return (React__default.createElement("div", { className: "sendbird-conversation__scroll-bottom-button", onClick: scrollToBottom, onKeyDown: scrollToBottom, tabIndex: 0, role: "button" },
-                React__default.createElement(Icon, { width: "24px", height: "24px", type: IconTypes.CHEVRON_DOWN, fillColor: IconColors.PRIMARY })));
-        },
-    };
-    if (loading) {
-        if (renderPlaceholderLoader)
-            return renderPlaceholderLoader();
-        return React__default.createElement(PlaceHolder, { type: PlaceHolderTypes.LOADING });
-    }
-    if (messages.length === 0) {
-        if (renderPlaceholderEmpty)
-            return renderPlaceholderEmpty();
-        return React__default.createElement(PlaceHolder, { className: "sendbird-conversation__no-messages", type: PlaceHolderTypes.NO_MESSAGES });
-    }
-    return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement("div", { className: "sendbird-conversation__messages ".concat(className) },
-            React__default.createElement("div", { className: "sendbird-conversation__scroll-container" },
-                React__default.createElement("div", { className: "sendbird-conversation__padding" }),
-                React__default.createElement("div", { className: "sendbird-conversation__messages-padding", ref: scrollRef },
-                    messages.map(function (message, idx) {
-                        var _a = getMessagePartsInfo({
-                            allMessages: messages,
-                            replyType: replyType,
-                            isMessageGroupingEnabled: isMessageGroupingEnabled,
-                            currentIndex: idx,
-                            currentMessage: message,
-                            currentChannel: currentChannel,
-                        }), chainTop = _a.chainTop, chainBottom = _a.chainBottom, hasSeparator = _a.hasSeparator;
-                        var isOutgoingMessage = message.isUserMessage() && message.sender.userId === store.config.userId;
-                        return (React__default.createElement(MessageProvider, { message: message, key: getComponentKeyFromMessage(message), isByMe: isOutgoingMessage },
-                            React__default.createElement(Message, { handleScroll: onMessageContentSizeChanged, renderMessage: renderMessage, message: message, hasSeparator: hasSeparator, chainTop: chainTop, chainBottom: chainBottom, renderCustomSeparator: renderCustomSeparator })));
-                    }),
-                    !hasNext()
-                        && ((_c = (_b = store === null || store === void 0 ? void 0 : store.config) === null || _b === void 0 ? void 0 : _b.groupChannel) === null || _c === void 0 ? void 0 : _c.enableTypingIndicator)
-                        && ((_f = (_e = (_d = store === null || store === void 0 ? void 0 : store.config) === null || _d === void 0 ? void 0 : _d.groupChannel) === null || _e === void 0 ? void 0 : _e.typingIndicatorTypes) === null || _f === void 0 ? void 0 : _f.has(TypingIndicatorType.Bubble)) && (React__default.createElement(TypingIndicatorBubbleWrapper, { channelUrl: channelUrl, handleScroll: onMessageContentSizeChanged })))),
-            React__default.createElement(React__default.Fragment, null, renderer.frozenNotification()),
-            React__default.createElement(React__default.Fragment, null, renderer.unreadMessagesNotification()),
-            React__default.createElement(React__default.Fragment, null, renderer.scrollToBottomButton()))));
-};
-var TypingIndicatorBubbleWrapper = function (props) {
-    var stores = useSendbirdStateContext().stores;
-    var _a = useState([]), typingMembers = _a[0], setTypingMembers = _a[1];
-    useGroupChannelHandler(stores.sdkStore.sdk, {
-        onTypingStatusUpdated: function (channel) {
-            if (channel.url === props.channelUrl) {
-                setTypingMembers(channel.getTypingUsers());
-            }
-        },
-    });
-    return React__default.createElement(TypingIndicatorBubble, { typingMembers: typingMembers, handleScroll: props.handleScroll });
-};
-
-var MessageInputWrapper = function (props) {
-    var _a;
-    var config = useSendbirdStateContext().config;
-    var context = useGroupChannelContext();
-    var messages = context.messages, currentChannel = context.currentChannel;
-    var lastMessage = currentChannel === null || currentChannel === void 0 ? void 0 : currentChannel.lastMessage;
-    var isLastMessageSuggestedRepliesEnabled = useIIFE(function () {
-        var _a;
-        if (!((_a = config === null || config === void 0 ? void 0 : config.groupChannel) === null || _a === void 0 ? void 0 : _a.enableSuggestedReplies))
-            return false;
-        if (getSuggestedReplies(lastMessage).length === 0)
-            return false;
-        var lastMessageInContext = messages[messages.length - 1];
-        if (isSendableMessage(lastMessageInContext) && lastMessageInContext.sendingStatus !== 'succeeded')
-            return false;
-        return true;
-    });
-    var disableMessageInput = props.disabled
-        || isLastMessageSuggestedRepliesEnabled && !!((_a = lastMessage.extendedMessagePayload) === null || _a === void 0 ? void 0 : _a['disable_chat_input']);
-    return (React__default.createElement(MessageInputWrapperView, __assign({}, props, { disabled: disableMessageInput }, context)));
-};
-
-var GroupChannelUI = function (props) {
-    var context = useGroupChannelContext();
-    var currentChannel = context.currentChannel, channelUrl = context.channelUrl, loading = context.loading;
-    // Inject components to presentation layer
-    var _a = props.renderChannelHeader, renderChannelHeader = _a === void 0 ? function (props) { return React__default.createElement(GroupChannelHeader, __assign({}, props)); } : _a, _b = props.renderMessageList, renderMessageList = _b === void 0 ? function (props) { return React__default.createElement(MessageList, __assign({}, props, { className: "sendbird-conversation__message-list" })); } : _b, _c = props.renderMessageInput, renderMessageInput = _c === void 0 ? function () { return React__default.createElement(MessageInputWrapper, __assign({}, props)); } : _c;
-    return (React__default.createElement(GroupChannelUIView, __assign({}, props, context, { loading: loading, isInvalid: channelUrl && !currentChannel, channelUrl: channelUrl, renderChannelHeader: renderChannelHeader, renderMessageList: renderMessageList, renderMessageInput: renderMessageInput })));
-};
-
-var GroupChannel = function (props) {
-    return (React__default.createElement(GroupChannelProvider, __assign({}, props),
-        React__default.createElement(GroupChannelUI, __assign({}, props))));
-};
-
-function GroupChannelPreviewAction(_a) {
-    var channel = _a.channel, _b = _a.disabled, disabled = _b === void 0 ? false : _b, onLeaveChannel = _a.onLeaveChannel;
-    var parentRef = useRef(null);
-    var parentContainerRef = useRef(null);
-    var _c = useState(false), showModal = _c[0], setShowModal = _c[1];
-    var stringSet = useContext(LocalizationContext).stringSet;
-    return (React__default.createElement("div", { ref: parentContainerRef, tabIndex: 0, role: "button", style: { display: 'inline-block' }, onKeyDown: function (e) { return e.stopPropagation(); }, onClick: function (e) { return e.stopPropagation(); } },
-        React__default.createElement(ContextMenu, { menuTrigger: function (toggleDropdown) { return (React__default.createElement(IconButton, { ref: parentRef, onClick: toggleDropdown, height: "32px", width: "32px" },
-                React__default.createElement(Icon, { type: IconTypes.MORE, fillColor: IconColors.PRIMARY, width: "24px", height: "24px" }))); }, menuItems: function (closeDropdown) { return (React__default.createElement(MenuItems, { parentRef: parentRef, parentContainRef: parentContainerRef, closeDropdown: closeDropdown },
-                React__default.createElement(MenuItem, { onClick: function () {
-                        if (disabled) {
-                            return;
-                        }
-                        setShowModal(true);
-                        closeDropdown();
-                    }, dataSbId: "channel_list_item_context_menu_leave_channel" }, stringSet.CHANNEL_SETTING__LEAVE_CHANNEL__TITLE))); } }),
-        showModal && (React__default.createElement(LeaveGroupChannel, { channel: channel, onSubmit: function () {
-                setShowModal(false);
-                onLeaveChannel();
-            }, onCancel: function () { return setShowModal(false); } }))));
-}
-
-var GroupChannelListItem = function (_a) {
-    var _b, _c, _d;
-    var channel = _a.channel, isSelected = _a.isSelected, isTyping = _a.isTyping, renderChannelAction = _a.renderChannelAction, onLeaveChannel = _a.onLeaveChannel, onClick = _a.onClick, tabIndex = _a.tabIndex;
-    var config = useSendbirdStateContext().config;
-    var userId = config.userId;
-    var stringSet = useLocalization().stringSet;
-    var _e = useGroupChannelListContext(), selectedChannelUrl = _e.selectedChannelUrl, typingChannelUrls = _e.typingChannelUrls, _f = _e.isTypingIndicatorEnabled, isTypingIndicatorEnabled = _f === void 0 ? false : _f, _g = _e.isMessageReceiptStatusEnabled, isMessageReceiptStatusEnabled = _g === void 0 ? false : _g;
-    var isSelectedChannel = isSelected || (channel.url === selectedChannelUrl);
-    var isTypingChannel = isTypingIndicatorEnabled && (isTyping || (typingChannelUrls.includes(channel.url)));
-    var isMessageStatusEnabled = isMessageReceiptStatusEnabled
-        && (!((_b = channel.lastMessage) === null || _b === void 0 ? void 0 : _b.isAdminMessage()))
-        && ((_d = (_c = channel.lastMessage) === null || _c === void 0 ? void 0 : _c.sender) === null || _d === void 0 ? void 0 : _d.userId) === userId;
-    var channelName = getChannelTitle(channel, userId, stringSet);
-    return (React__default.createElement(GroupChannelListItemView, { channel: channel, tabIndex: tabIndex, channelName: channelName, isTyping: isTypingChannel, isSelected: isSelectedChannel, isMessageStatusEnabled: isMessageStatusEnabled, onClick: onClick, onLeaveChannel: onLeaveChannel, renderChannelAction: renderChannelAction }));
-};
-
-var AddGroupChannel = function () {
-    var _a = useState(false), createChannelVisible = _a[0], setCreateChannelVisible = _a[1];
-    var _b = useGroupChannelListContext(), onChannelCreated = _b.onChannelCreated, onBeforeCreateChannel = _b.onBeforeCreateChannel, onCreateChannelClick = _b.onCreateChannelClick;
-    return (React__default.createElement(AddGroupChannelView, { createChannelVisible: createChannelVisible, onChangeCreateChannelVisible: setCreateChannelVisible, onCreateChannelClick: onCreateChannelClick, onBeforeCreateChannel: onBeforeCreateChannel, onChannelCreated: onChannelCreated }));
-};
-
-var GroupChannelListUI = function (props) {
-    var renderHeader = props.renderHeader, renderChannelPreview = props.renderChannelPreview, renderPlaceHolderError = props.renderPlaceHolderError, renderPlaceHolderLoading = props.renderPlaceHolderLoading, renderPlaceHolderEmptyList = props.renderPlaceHolderEmptyList;
-    var _a = useGroupChannelListContext(), onChannelSelect = _a.onChannelSelect, onThemeChange = _a.onThemeChange, allowProfileEdit = _a.allowProfileEdit, groupChannels = _a.groupChannels, initialized = _a.initialized, loadMore = _a.loadMore, onUserProfileUpdated = _a.onUserProfileUpdated;
-    var _b = useSendbirdStateContext(), stores = _b.stores, config = _b.config;
-    var logger = config.logger, isOnline = config.isOnline;
-    var sdk = stores.sdkStore.sdk;
-    var renderListItem = function (renderProps) {
-        var channel = renderProps.item, index = renderProps.index;
-        var onLeaveChannel = function (targetChannel, cb) { return __awaiter(void 0, void 0, void 0, function () {
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        logger.info('ChannelList: Leaving channel', targetChannel);
-                        return [4 /*yield*/, targetChannel.leave()];
-                    case 1:
-                        _a.sent();
-                        logger.info('ChannelList: Leaving channel success');
-                        if (cb && typeof cb === 'function')
-                            cb(targetChannel);
-                        return [2 /*return*/];
-                }
-            });
-        }); };
-        var onClick = function () {
-            if (isOnline || (sdk === null || sdk === void 0 ? void 0 : sdk.isCacheEnabled)) {
-                logger.info('ChannelList: Clicked on channel:', channel);
-                onChannelSelect(channel);
-            }
-            else {
-                logger.warning('ChannelList: Inactivated clicking channel item during offline.');
-            }
-        };
-        if (renderChannelPreview) {
-            return (React__default.createElement("div", { key: channel.url, onClick: onClick }, renderChannelPreview({ channel: channel, onLeaveChannel: onLeaveChannel })));
-        }
-        return (React__default.createElement(GroupChannelListItem, { key: channel.url, tabIndex: index, onClick: onClick, channel: channel, onLeaveChannel: function () { return onLeaveChannel(channel, null); }, renderChannelAction: function () { return (React__default.createElement(GroupChannelPreviewAction, { channel: channel, disabled: !isOnline, onLeaveChannel: function () { return onLeaveChannel(channel, null); } })); } }));
-    };
-    return (React__default.createElement(GroupChannelListUIView, { renderHeader: renderHeader, renderChannel: renderListItem, renderPlaceHolderError: renderPlaceHolderError, renderPlaceHolderLoading: renderPlaceHolderLoading, renderPlaceHolderEmptyList: renderPlaceHolderEmptyList, onChangeTheme: onThemeChange, allowProfileEdit: allowProfileEdit, onUserProfileUpdated: onUserProfileUpdated, channels: groupChannels, onLoadMore: loadMore, initialized: initialized, renderAddChannel: function () { return React__default.createElement(AddGroupChannel, null); } }));
-};
-
-var GroupChannelList = function (props) {
-    return (React__default.createElement(GroupChannelListProvider, __assign({}, props),
-        React__default.createElement(GroupChannelListUI, __assign({}, props))));
-};
+import './Thread/components/ThreadMessageInput.js';
+import './Channel/hooks/useHandleUploadFiles.js';
 
 var DesktopLayout = function (props) {
     var isReactionEnabled = props.isReactionEnabled, replyType = props.replyType, isMessageGroupingEnabled = props.isMessageGroupingEnabled, isMultipleFilesMessageEnabled = props.isMultipleFilesMessageEnabled, allowProfileEdit = props.allowProfileEdit, showSearchIcon = props.showSearchIcon, onProfileEditSuccess = props.onProfileEditSuccess, disableAutoSelect = props.disableAutoSelect, currentChannel = props.currentChannel, setCurrentChannel = props.setCurrentChannel, showSettings = props.showSettings, setShowSettings = props.setShowSettings, showSearch = props.showSearch, setShowSearch = props.setShowSearch, highlightedMessage = props.highlightedMessage, setHighlightedMessage = props.setHighlightedMessage, startingPoint = props.startingPoint, setStartingPoint = props.setStartingPoint, showThread = props.showThread, setShowThread = props.setShowThread, threadTargetMessage = props.threadTargetMessage, setThreadTargetMessage = props.setThreadTargetMessage, enableLegacyChannelModules = props.enableLegacyChannelModules;
@@ -760,11 +513,7 @@ function App(props) {
     // The below configs are duplicates of the Dashboard UIKit Configs.
     // Since their default values will be set in the Sendbird component,
     // we don't need to set them here.
-    showSearchIcon = props.showSearchIcon, isMentionEnabled = props.isMentionEnabled, isReactionEnabled = props.isReactionEnabled, replyType = props.replyType, disableUserProfile = props.disableUserProfile, isVoiceMessageEnabled = props.isVoiceMessageEnabled, isMultipleFilesMessageEnabled = props.isMultipleFilesMessageEnabled, isTypingIndicatorEnabledOnChannelList = props.isTypingIndicatorEnabledOnChannelList, isMessageReceiptStatusEnabledOnChannelList = props.isMessageReceiptStatusEnabledOnChannelList, _v = props.isUserIdUsedForNickname, isUserIdUsedForNickname = _v === void 0 ? true : _v, 
-    // FIXME: Flag change is required when deploying the collection module.
-    _w = props.enableLegacyChannelModules, 
-    // FIXME: Flag change is required when deploying the collection module.
-    enableLegacyChannelModules = _w === void 0 ? true : _w;
+    showSearchIcon = props.showSearchIcon, isMentionEnabled = props.isMentionEnabled, isReactionEnabled = props.isReactionEnabled, replyType = props.replyType, disableUserProfile = props.disableUserProfile, isVoiceMessageEnabled = props.isVoiceMessageEnabled, isMultipleFilesMessageEnabled = props.isMultipleFilesMessageEnabled, isTypingIndicatorEnabledOnChannelList = props.isTypingIndicatorEnabledOnChannelList, isMessageReceiptStatusEnabledOnChannelList = props.isMessageReceiptStatusEnabledOnChannelList, _v = props.isUserIdUsedForNickname, isUserIdUsedForNickname = _v === void 0 ? true : _v, _w = props.enableLegacyChannelModules, enableLegacyChannelModules = _w === void 0 ? false : _w;
     var _x = useState(null), currentChannel = _x[0], setCurrentChannel = _x[1];
     return (React__default.createElement(SendbirdProvider, { stringSet: stringSet, appId: appId, userId: userId, accessToken: accessToken, customApiHost: customApiHost, customWebSocketHost: customWebSocketHost, breakpoint: breakpoint, theme: theme, nickname: nickname, profileUrl: profileUrl, dateLocale: dateLocale, userListQuery: userListQuery, config: config, colorSet: colorSet, disableUserProfile: disableUserProfile, disableMarkAsDelivered: disableMarkAsDelivered, renderUserProfile: renderUserProfile, imageCompression: imageCompression, isReactionEnabled: isReactionEnabled, isMentionEnabled: isMentionEnabled, isVoiceMessageEnabled: isVoiceMessageEnabled, isMultipleFilesMessageEnabled: isMultipleFilesMessageEnabled, voiceRecord: voiceRecord, onUserProfileMessage: function (channel) {
             setCurrentChannel(channel);

package/App.js.map

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