@sendbird/uikit-react 3.9.1-rc-2 → 3.9.1

package/OpenChannel/components/OpenChannelHeader.js

@@ -0,0 +1,54 @@
+import React__default, { useContext } from 'react';
+import { A as Avatar } from '../../chunks/bundle-HbEA73mt.js';
+import Icon, { IconColors, IconTypes } from '../../ui/Icon.js';
+import IconButton from '../../ui/IconButton.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../chunks/bundle-u2CeAx57.js';
+import { L as LocalizationContext } from '../../chunks/bundle-ZSLOjQvb.js';
+import { u as useOpenChannelContext, k as kFormatter } from '../../chunks/bundle-lcfgNAH-.js';
+import { u as useMediaQueryContext } from '../../chunks/bundle-yCtFACB5.js';
+import '../../chunks/bundle-c5jegKUx.js';
+import '../../ui/ImageRenderer.js';
+import '../../chunks/bundle-dJsyeOhk.js';
+import '../../chunks/bundle-7JHtC_JJ.js';
+import '../../chunks/bundle-XtwZ5oLQ.js';
+import '../../chunks/bundle-LdRGfmOs.js';
+import '../../chunks/bundle-Izb-WW89.js';
+import '../../chunks/bundle-9hVs1LFe.js';
+import '../../chunks/bundle-J3Xwcu_c.js';
+import '../../chunks/bundle-tc0rEnB_.js';
+import '../../chunks/bundle-OwUIW9B_.js';
+import '@sendbird/chat';
+import '@sendbird/chat/openChannel';
+import '../../chunks/bundle-XyLdN-Hr.js';
+import '../../useSendbirdStateContext.js';
+import '../../withSendbird.js';
+import '../../hooks/useModal.js';
+import '../../chunks/bundle-KZXjN5v7.js';
+import '../../chunks/bundle-vUampZQQ.js';
+import 'react-dom';
+import '../../ui/Button.js';
+import '../../chunks/bundle-EQ2jMcm0.js';
+
+function OpenchannelConversationHeader() {
+    var stringSet = useContext(LocalizationContext).stringSet;
+    var _a = useOpenChannelContext(), currentOpenChannel = _a.currentOpenChannel, onChatHeaderActionClick = _a.onChatHeaderActionClick, amIOperator = _a.amIOperator, onBackClick = _a.onBackClick;
+    var title = currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.name;
+    var subTitle = "".concat(kFormatter(currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.participantCount), " ").concat(stringSet.OPEN_CHANNEL_CONVERSATION__TITLE_PARTICIPANTS);
+    var coverImage = currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.coverUrl;
+    var isMobile = useMediaQueryContext().isMobile;
+    return (React__default.createElement("div", { className: "sendbird-openchannel-conversation-header" },
+        React__default.createElement("div", { className: "sendbird-openchannel-conversation-header__left" },
+            isMobile && (React__default.createElement(Icon, { className: "sendbird-oepnchannel-header__icon_back", onClick: onBackClick, fillColor: IconColors.PRIMARY, width: "24px", height: "24px", type: IconTypes.ARROW_LEFT })),
+            coverImage ? (React__default.createElement(Avatar, { className: "sendbird-openchannel-conversation-header__left__cover-image", src: coverImage, alt: "channel cover image", width: "32px", height: "32px" })) : (React__default.createElement("div", { className: "sendbird-openchannel-conversation-header__left__cover-image--icon", style: { width: 32, height: 32 } },
+                React__default.createElement(Icon, { type: IconTypes.CHANNELS, fillColor: IconColors.CONTENT, width: "18px", height: "18px" }))),
+            React__default.createElement(Label, { className: "sendbird-openchannel-conversation-header__left__title", type: LabelTypography.H_2, color: LabelColors.ONBACKGROUND_1 }, title || stringSet.NO_TITLE),
+            React__default.createElement(Label, { className: "sendbird-openchannel-conversation-header__left__sub-title", type: LabelTypography.BODY_2, color: LabelColors.ONBACKGROUND_2 }, subTitle || stringSet.NO_TITLE)),
+        React__default.createElement("div", { className: "sendbird-openchannel-conversation-header__right" },
+            React__default.createElement(IconButton, { className: "sendbird-openchannel-conversation-header__right__trigger", width: "32px", height: "32px", onClick: onChatHeaderActionClick },
+                React__default.createElement(Icon, { type: (amIOperator
+                        ? IconTypes.INFO
+                        : IconTypes.MEMBERS), fillColor: IconColors.PRIMARY, width: "24px", height: "24px" })))));
+}
+
+export { OpenchannelConversationHeader as default };
+//# sourceMappingURL=OpenChannelHeader.js.map

package/OpenChannel/components/OpenChannelInput.js

@@ -0,0 +1,63 @@
+import React__default, { useContext } from 'react';
+import { L as LocalizationContext } from '../../chunks/bundle-ZSLOjQvb.js';
+import MessageInput from '../../ui/MessageInput.js';
+import { u as useOpenChannelContext } from '../../chunks/bundle-lcfgNAH-.js';
+import '../../chunks/bundle-LdRGfmOs.js';
+import '../../chunks/bundle-Izb-WW89.js';
+import '../../chunks/bundle-c5jegKUx.js';
+import '../../chunks/bundle-rgIbMndg.js';
+import '../../chunks/bundle-fwLsGp6N.js';
+import '../../ui/IconButton.js';
+import '../../ui/Button.js';
+import '../../chunks/bundle-u2CeAx57.js';
+import '../../chunks/bundle-ejXMvNVx.js';
+import 'dompurify';
+import '../../chunks/bundle-okmgQKUZ.js';
+import '../../chunks/bundle-Ha6WT0Hp.js';
+import '../../chunks/bundle-ZxBmutMJ.js';
+import '../../ui/Icon.js';
+import '../../chunks/bundle-XtwZ5oLQ.js';
+import '../../useSendbirdStateContext.js';
+import '../../withSendbird.js';
+import '../../chunks/bundle-CQMOLj5V.js';
+import '../../utils/message/getOutgoingMessageState.js';
+import '../../chunks/bundle-KZXjN5v7.js';
+import '../../chunks/bundle-dBXZk5Y3.js';
+import '../../chunks/bundle-9hVs1LFe.js';
+import '../../chunks/bundle-J3Xwcu_c.js';
+import '../../chunks/bundle-tc0rEnB_.js';
+import '../../chunks/bundle-OwUIW9B_.js';
+import '@sendbird/chat';
+import '@sendbird/chat/openChannel';
+import '../../chunks/bundle-dJsyeOhk.js';
+import '../../chunks/bundle-XyLdN-Hr.js';
+import '../../chunks/bundle-7JHtC_JJ.js';
+import '../../hooks/useModal.js';
+import '../../chunks/bundle-vUampZQQ.js';
+import 'react-dom';
+import '../../chunks/bundle-yCtFACB5.js';
+import '../../chunks/bundle-EQ2jMcm0.js';
+
+var OpenChannelInput = React__default.forwardRef(function (props, ref) {
+    var _a = useOpenChannelContext(), currentOpenChannel = _a.currentOpenChannel, disabled = _a.disabled, handleSendMessage = _a.handleSendMessage, handleFileUpload = _a.handleFileUpload, amIMuted = _a.amIMuted;
+    var channel = currentOpenChannel;
+    var stringSet = useContext(LocalizationContext).stringSet;
+    var value = props.value;
+    function getPlaceHolderString() {
+        if (amIMuted) {
+            return stringSet.MESSAGE_INPUT__PLACE_HOLDER__MUTED;
+        }
+        if (disabled) {
+            return stringSet.MESSAGE_INPUT__PLACE_HOLDER__DISABLED;
+        }
+        return '';
+    }
+    if (!channel) {
+        return null;
+    }
+    return (React__default.createElement("div", { className: "sendbird-openchannel-footer" },
+        React__default.createElement(MessageInput, { channel: currentOpenChannel, ref: ref, value: value, disabled: disabled, isVoiceMessageEnabled: false, onSendMessage: handleSendMessage, onFileUpload: handleFileUpload, placeholder: getPlaceHolderString() })));
+});
+
+export { OpenChannelInput as default };
+//# sourceMappingURL=OpenChannelInput.js.map

package/OpenChannel/components/OpenChannelMessage.js

@@ -0,0 +1,197 @@
+import React__default, { useContext, useMemo, useState, useRef } from 'react';
+import { f as format } from '../../chunks/bundle-9hVs1LFe.js';
+import OpenchannelUserMessage from '../../ui/OpenchannelUserMessage.js';
+import OpenChannelAdminMessage from '../../ui/OpenChannelAdminMessage.js';
+import OpenchannelOGMessage from '../../ui/OpenchannelOGMessage.js';
+import OpenchannelThumbnailMessage from '../../ui/OpenchannelThumbnailMessage.js';
+import OpenchannelFileMessage from '../../ui/OpenchannelFileMessage.js';
+import DateSeparator from '../../ui/DateSeparator.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../chunks/bundle-u2CeAx57.js';
+import MessageInput from '../../ui/MessageInput.js';
+import { i as isImage, a as isVideo, F as FileViewer } from '../../chunks/bundle-DB4PuqmB.js';
+import { M as Modal } from '../../chunks/bundle-vUampZQQ.js';
+import { L as LocalizationContext, u as useLocalization } from '../../chunks/bundle-ZSLOjQvb.js';
+import { g as getModalDeleteMessageTitle } from '../../chunks/bundle-f7C0xlTH.js';
+import { u as useOpenChannelContext } from '../../chunks/bundle-lcfgNAH-.js';
+import { useSendbirdStateContext } from '../../useSendbirdStateContext.js';
+import '../../chunks/bundle-Izb-WW89.js';
+import '../../chunks/bundle-c5jegKUx.js';
+import '../../chunks/bundle-HbEA73mt.js';
+import '../../ui/ImageRenderer.js';
+import '../../chunks/bundle-dJsyeOhk.js';
+import '../../chunks/bundle-7JHtC_JJ.js';
+import '../../ui/Icon.js';
+import '../../chunks/bundle-XtwZ5oLQ.js';
+import '../../ui/ContextMenu.js';
+import 'react-dom';
+import '../../ui/SortByRow.js';
+import '../../chunks/bundle-CQMOLj5V.js';
+import '../../utils/message/getOutgoingMessageState.js';
+import '../../chunks/bundle-KZXjN5v7.js';
+import '../../chunks/bundle-LdRGfmOs.js';
+import '../../ui/IconButton.js';
+import '../../ui/Loader.js';
+import '../../ui/UserProfile.js';
+import '../../chunks/bundle-J3Xwcu_c.js';
+import '../../sendbirdSelectors.js';
+import '../../chunks/bundle-OwUIW9B_.js';
+import '../../ui/Button.js';
+import '../../withSendbird.js';
+import '../../chunks/bundle-GYn98g4i.js';
+import '../../chunks/bundle-dwc9j36U.js';
+import '../../chunks/bundle-yCtFACB5.js';
+import '../../chunks/bundle-5HYqTaTr.js';
+import '../../ui/LinkLabel.js';
+import '../../chunks/bundle-J87QWRh3.js';
+import '../../chunks/bundle-dBXZk5Y3.js';
+import '../../Message/context.js';
+import '../../ui/MentionLabel.js';
+import '../../ui/TextButton.js';
+import '../../chunks/bundle-mAbwjJsi.js';
+import '../../chunks/bundle-rgIbMndg.js';
+import '../../chunks/bundle-fwLsGp6N.js';
+import '../../chunks/bundle-ejXMvNVx.js';
+import 'dompurify';
+import '../../chunks/bundle-okmgQKUZ.js';
+import '../../chunks/bundle-Ha6WT0Hp.js';
+import '../../chunks/bundle-ZxBmutMJ.js';
+import '../../hooks/useModal.js';
+import '../../chunks/bundle-EQ2jMcm0.js';
+import '../../chunks/bundle-tc0rEnB_.js';
+import '@sendbird/chat';
+import '@sendbird/chat/openChannel';
+import '../../chunks/bundle-XyLdN-Hr.js';
+
+function RemoveMessageModal(_a) {
+    var message = _a.message, onCloseModal = _a.onCloseModal, onDeleteMessage = _a.onDeleteMessage;
+    var stringSet = useContext(LocalizationContext).stringSet;
+    return (React__default.createElement(Modal, { onCancel: onCloseModal, onSubmit: onDeleteMessage, submitText: stringSet.MESSAGE_MENU__DELETE, titleText: getModalDeleteMessageTitle(stringSet, message) }));
+}
+
+var MessageTypes = {
+    ADMIN: 'ADMIN',
+    USER: 'USER',
+    FILE: 'FILE',
+    THUMBNAIL: 'THUMBNAIL',
+    OG: 'OG',
+    UNKNOWN: 'UNKNOWN',
+};
+var SendingMessageStatus = {
+    NONE: 'none',
+    SUCCEEDED: 'succeeded',
+    FAILED: 'failed',
+    PENDING: 'pending',
+};
+var getMessageType = function (message, options) {
+    var _a, _b;
+    var isOgMessageEnabledInOpenChannel = options === null || options === void 0 ? void 0 : options.isOgMessageEnabledInOpenChannel;
+    if (((_a = message === null || message === void 0 ? void 0 : message.isUserMessage) === null || _a === void 0 ? void 0 : _a.call(message)) || (message === null || message === void 0 ? void 0 : message.messageType) === 'user') {
+        return ((message === null || message === void 0 ? void 0 : message.ogMetaData) && isOgMessageEnabledInOpenChannel)
+            ? MessageTypes.OG
+            : MessageTypes.USER;
+    }
+    if ((_b = message === null || message === void 0 ? void 0 : message.isAdminMessage) === null || _b === void 0 ? void 0 : _b.call(message)) {
+        return MessageTypes.ADMIN;
+    }
+    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
+        return (isImage(message.type) || isVideo(message.type))
+            ? MessageTypes.THUMBNAIL
+            : MessageTypes.FILE;
+    }
+    return MessageTypes.UNKNOWN;
+};
+
+function MessagOpenChannelMessageeHoc(props) {
+    var _a;
+    var _b;
+    var message = props.message, chainTop = props.chainTop, chainBottom = props.chainBottom, hasSeparator = props.hasSeparator, renderMessage = props.renderMessage;
+    var _c = useOpenChannelContext(), currentOpenChannel = _c.currentOpenChannel, deleteMessage = _c.deleteMessage, updateMessage = _c.updateMessage, resendMessage = _c.resendMessage;
+    var _d = useLocalization(), dateLocale = _d.dateLocale, stringSet = _d.stringSet;
+    var editDisabled = currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isFrozen;
+    var globalState = useSendbirdStateContext();
+    var currentUserId = (_b = globalState === null || globalState === void 0 ? void 0 : globalState.config) === null || _b === void 0 ? void 0 : _b.userId;
+    var isOgMessageEnabledInOpenChannel = globalState.config.openChannel.enableOgtag;
+    var sender = null;
+    if ((message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
+        sender = message === null || message === void 0 ? void 0 : message.sender;
+    }
+    var RenderedMessage = useMemo(function () { return function (props) {
+        return React__default.createElement(React__default.Fragment, null, renderMessage ? renderMessage(props) : null);
+    }; }, [message, renderMessage]);
+    var _e = useState(false), showEdit = _e[0], setShowEdit = _e[1];
+    var _f = useState(false), showRemove = _f[0], setShowRemove = _f[1];
+    var _g = useState(false), showFileViewer = _g[0], setShowFileViewer = _g[1];
+    var editMessageInputRef = useRef(null);
+    var isByMe = false;
+    if (sender && (message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
+        // pending and failed messages are by me
+        isByMe = currentUserId === sender.userId
+            || (message === null || message === void 0 ? void 0 : message.sendingStatus)
+                === SendingMessageStatus.PENDING
+            || (message === null || message === void 0 ? void 0 : message.sendingStatus)
+                === SendingMessageStatus.FAILED;
+    }
+    if (renderMessage && RenderedMessage) {
+        return (React__default.createElement("div", { className: "sendbird-msg-hoc sendbird-msg--scroll-ref" },
+            React__default.createElement(RenderedMessage, { message: message, chainTop: chainTop, chainBottom: chainBottom })));
+    }
+    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user' && showEdit) {
+        return (React__default.createElement(MessageInput, { isEdit: true, channel: currentOpenChannel, disabled: editDisabled, ref: editMessageInputRef, message: message, onUpdateMessage: function (_a) {
+                var messageId = _a.messageId, message = _a.message;
+                updateMessage(messageId, message);
+                setShowEdit(false);
+            }, onCancelEdit: function () {
+                setShowEdit(false);
+            } }));
+    }
+    return (React__default.createElement("div", { className: "sendbird-msg-hoc sendbird-msg--scroll-ref" },
+        React__default.createElement(React__default.Fragment, null,
+            hasSeparator && (message === null || message === void 0 ? void 0 : message.createdAt) && (React__default.createElement(DateSeparator, null,
+                React__default.createElement(Label, { type: LabelTypography.CAPTION_2, color: LabelColors.ONBACKGROUND_2 }, format(message === null || message === void 0 ? void 0 : message.createdAt, stringSet.DATE_FORMAT__MESSAGE_LIST__DATE_SEPARATOR, { locale: dateLocale })))),
+            (_a = {},
+                _a[MessageTypes.ADMIN] = (function () {
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'admin') {
+                        return (React__default.createElement(OpenChannelAdminMessage, { message: message }));
+                    }
+                })(),
+                _a[MessageTypes.FILE] = (function () {
+                    var _a;
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
+                        return (React__default.createElement(OpenchannelFileMessage, { message: message, isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId), isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral, disabled: editDisabled, userId: currentUserId, showRemove: setShowRemove, resendMessage: resendMessage, chainTop: chainTop, chainBottom: chainBottom }));
+                    }
+                })(),
+                _a[MessageTypes.OG] = (function () {
+                    var _a;
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user'
+                        && isOgMessageEnabledInOpenChannel) {
+                        return (React__default.createElement(OpenchannelOGMessage, { message: message, isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId), isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral, userId: currentUserId, showEdit: setShowEdit, disabled: editDisabled, showRemove: setShowRemove, resendMessage: resendMessage, chainTop: chainTop, chainBottom: chainBottom }));
+                    }
+                })(),
+                _a[MessageTypes.THUMBNAIL] = (function () {
+                    var _a;
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
+                        return (React__default.createElement(OpenchannelThumbnailMessage, { message: message, isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId), isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral, disabled: editDisabled, userId: currentUserId, showRemove: setShowRemove, resendMessage: resendMessage, onClick: setShowFileViewer, chainTop: chainTop, chainBottom: chainBottom }));
+                    }
+                })(),
+                _a[MessageTypes.USER] = (function () {
+                    var _a;
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user') {
+                        return (React__default.createElement(OpenchannelUserMessage, { message: message, isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId), isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral, userId: currentUserId, disabled: editDisabled, showEdit: setShowEdit, showRemove: setShowRemove, resendMessage: resendMessage, chainTop: chainTop, chainBottom: chainBottom }));
+                    }
+                })(),
+                _a[MessageTypes.UNKNOWN] = (function () {
+                    // return (
+                    //   <OpenChannelUnknownMessage message={message} />
+                    // );
+                })(),
+                _a)[getMessageType(message, { isOgMessageEnabledInOpenChannel: isOgMessageEnabledInOpenChannel })],
+            showRemove && (React__default.createElement(RemoveMessageModal, { message: message, onCloseModal: function () { return setShowRemove(false); }, onDeleteMessage: function () {
+                    if ((message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
+                        deleteMessage(message);
+                    }
+                } })),
+            showFileViewer && (message === null || message === void 0 ? void 0 : message.messageType) === 'file' && (React__default.createElement(FileViewer, { onClose: function () { return setShowFileViewer(false); }, message: message, onDelete: function () { return deleteMessage(message); }, isByMe: isByMe })))));
+}
+
+export { MessagOpenChannelMessageeHoc as default };
+//# sourceMappingURL=OpenChannelMessage.js.map

package/OpenChannel/components/OpenChannelMessageList.js

@@ -0,0 +1,122 @@
+import React__default, { useRef, useState, useMemo } from 'react';
+import { i as isSameDay } from '../../chunks/bundle-jRxDZ3BJ.js';
+import Icon, { IconTypes, IconColors } from '../../ui/Icon.js';
+import PlaceHolder, { PlaceHolderTypes } from '../../ui/PlaceHolder.js';
+import { u as useOpenChannelContext, c as compareMessagesForGrouping } from '../../chunks/bundle-lcfgNAH-.js';
+import MessagOpenChannelMessageeHoc from './OpenChannelMessage.js';
+import { MessageProvider } from '../../Message/context.js';
+import { useSendbirdStateContext } from '../../useSendbirdStateContext.js';
+import { u as useHandleOnScrollCallback } from '../../chunks/bundle-bLXmqujU.js';
+import '../../chunks/bundle-9hVs1LFe.js';
+import '../../chunks/bundle-Izb-WW89.js';
+import '../../chunks/bundle-c5jegKUx.js';
+import '../../chunks/bundle-XtwZ5oLQ.js';
+import '../../chunks/bundle-ZSLOjQvb.js';
+import '../../chunks/bundle-LdRGfmOs.js';
+import '../../chunks/bundle-u2CeAx57.js';
+import '../../ui/Loader.js';
+import '../../chunks/bundle-J3Xwcu_c.js';
+import '../../chunks/bundle-tc0rEnB_.js';
+import '../../chunks/bundle-OwUIW9B_.js';
+import '@sendbird/chat';
+import '@sendbird/chat/openChannel';
+import '../../chunks/bundle-dJsyeOhk.js';
+import '../../chunks/bundle-XyLdN-Hr.js';
+import '../../chunks/bundle-7JHtC_JJ.js';
+import '../../hooks/useModal.js';
+import '../../chunks/bundle-KZXjN5v7.js';
+import '../../chunks/bundle-vUampZQQ.js';
+import 'react-dom';
+import '../../chunks/bundle-yCtFACB5.js';
+import '../../ui/IconButton.js';
+import '../../ui/Button.js';
+import '../../chunks/bundle-EQ2jMcm0.js';
+import '../../ui/OpenchannelUserMessage.js';
+import '../../chunks/bundle-HbEA73mt.js';
+import '../../ui/ImageRenderer.js';
+import '../../ui/ContextMenu.js';
+import '../../ui/SortByRow.js';
+import '../../chunks/bundle-CQMOLj5V.js';
+import '../../utils/message/getOutgoingMessageState.js';
+import '../../ui/UserProfile.js';
+import '../../sendbirdSelectors.js';
+import '../../chunks/bundle-GYn98g4i.js';
+import '../../chunks/bundle-dwc9j36U.js';
+import '../../chunks/bundle-5HYqTaTr.js';
+import '../../ui/OpenChannelAdminMessage.js';
+import '../../ui/OpenchannelOGMessage.js';
+import '../../ui/LinkLabel.js';
+import '../../chunks/bundle-J87QWRh3.js';
+import '../../chunks/bundle-dBXZk5Y3.js';
+import '../../ui/MentionLabel.js';
+import '../../ui/OpenchannelThumbnailMessage.js';
+import '../../ui/OpenchannelFileMessage.js';
+import '../../ui/TextButton.js';
+import '../../chunks/bundle-mAbwjJsi.js';
+import '../../ui/DateSeparator.js';
+import '../../ui/MessageInput.js';
+import '../../chunks/bundle-rgIbMndg.js';
+import '../../chunks/bundle-fwLsGp6N.js';
+import '../../chunks/bundle-ejXMvNVx.js';
+import 'dompurify';
+import '../../chunks/bundle-okmgQKUZ.js';
+import '../../chunks/bundle-Ha6WT0Hp.js';
+import '../../chunks/bundle-ZxBmutMJ.js';
+import '../../chunks/bundle-DB4PuqmB.js';
+import '../../chunks/bundle-f7C0xlTH.js';
+import '../../withSendbird.js';
+
+function OpenchannelMessageList(props, ref) {
+    var _a = useOpenChannelContext(), _b = _a.isMessageGroupingEnabled, isMessageGroupingEnabled = _b === void 0 ? true : _b, allMessages = _a.allMessages, hasMore = _a.hasMore, onScroll = _a.onScroll;
+    var store = useSendbirdStateContext();
+    var userId = store.config.userId;
+    var scrollRef = ref || useRef(null);
+    var _c = useState(false), showScrollDownButton = _c[0], setShowScrollDownButton = _c[1];
+    var scrollToBottom = function () {
+        if (scrollRef && scrollRef.current) {
+            scrollRef.current.scrollTo(0, scrollRef.current.scrollHeight);
+            setShowScrollDownButton(false);
+        }
+    };
+    var handleOnScroll = useHandleOnScrollCallback({
+        setShowScrollDownButton: setShowScrollDownButton,
+        hasMore: hasMore,
+        onScroll: onScroll,
+        scrollRef: scrollRef,
+    });
+    var memoizedMessageList = useMemo(function () {
+        var _a;
+        if (allMessages.length > 0) {
+            return (allMessages.map(function (message, index) {
+                var _a;
+                var previousMessage = allMessages[index - 1];
+                var nextMessage = allMessages[index - 1];
+                var previousMessageCreatedAt = previousMessage && previousMessage.createdAt;
+                var currentCreatedAt = message === null || message === void 0 ? void 0 : message.createdAt;
+                // https://stackoverflow.com/a/41855608
+                var hasSeparator = !(previousMessageCreatedAt && (isSameDay(currentCreatedAt, previousMessageCreatedAt)));
+                var _b = isMessageGroupingEnabled
+                    ? compareMessagesForGrouping(previousMessage, message, nextMessage)
+                    : [false, false], chainTop = _b[0], chainBottom = _b[1];
+                var isByMe = ((_a = message === null || message === void 0 ? void 0 : message.sender) === null || _a === void 0 ? void 0 : _a.userId) === userId;
+                var key = (message === null || message === void 0 ? void 0 : message.messageId) || (message === null || message === void 0 ? void 0 : message.reqId);
+                return (React__default.createElement(MessageProvider, { message: message, isByMe: isByMe, key: key },
+                    React__default.createElement(MessagOpenChannelMessageeHoc, { message: message, chainTop: chainTop, chainBottom: chainBottom, hasSeparator: hasSeparator, renderMessage: props === null || props === void 0 ? void 0 : props.renderMessage })));
+            }));
+        }
+        return (((_a = props === null || props === void 0 ? void 0 : props.renderPlaceHolderEmptyList) === null || _a === void 0 ? void 0 : _a.call(props)) || (React__default.createElement(PlaceHolder, { className: "sendbird-openchannel-conversation-scroll__container__place-holder", type: PlaceHolderTypes.NO_MESSAGES })));
+    }, [allMessages]);
+    return (React__default.createElement("div", { className: "sendbird-openchannel-conversation-scroll" },
+        React__default.createElement("div", { className: "sendbird-openchannel-conversation-scroll__container" },
+            React__default.createElement("div", { className: "sendbird-openchannel-conversation-scroll__container__padding" }),
+            React__default.createElement("div", { className: [
+                    'sendbird-openchannel-conversation-scroll__container__item-container',
+                    (allMessages.length > 0) ? '' : 'no-messages',
+                ].join(' '), onScroll: handleOnScroll, ref: scrollRef }, memoizedMessageList)),
+        showScrollDownButton && (React__default.createElement("div", { className: "sendbird-openchannel-conversation-scroll__container__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.CONTENT })))));
+}
+var OpenChannelMessageList = React__default.forwardRef(OpenchannelMessageList);
+
+export { OpenChannelMessageList as default };
+//# sourceMappingURL=OpenChannelMessageList.js.map

package/OpenChannel/components/OpenChannelUI.js

@@ -0,0 +1,102 @@
+import React__default from 'react';
+import { u as useOpenChannelContext } from '../../chunks/bundle-lcfgNAH-.js';
+import OpenChannelInput from './OpenChannelInput.js';
+import FrozenNotification from './FrozenChannelNotification.js';
+import OpenchannelConversationHeader from './OpenChannelHeader.js';
+import PlaceHolder, { PlaceHolderTypes } from '../../ui/PlaceHolder.js';
+import OpenChannelMessageList from './OpenChannelMessageList.js';
+import '../../chunks/bundle-9hVs1LFe.js';
+import '../../chunks/bundle-Izb-WW89.js';
+import '../../chunks/bundle-J3Xwcu_c.js';
+import '../../chunks/bundle-c5jegKUx.js';
+import '../../chunks/bundle-tc0rEnB_.js';
+import '../../chunks/bundle-OwUIW9B_.js';
+import '@sendbird/chat';
+import '@sendbird/chat/openChannel';
+import '../../chunks/bundle-dJsyeOhk.js';
+import '../../chunks/bundle-XyLdN-Hr.js';
+import '../../chunks/bundle-7JHtC_JJ.js';
+import '../../useSendbirdStateContext.js';
+import '../../withSendbird.js';
+import '../../hooks/useModal.js';
+import '../../chunks/bundle-KZXjN5v7.js';
+import '../../chunks/bundle-XtwZ5oLQ.js';
+import '../../chunks/bundle-vUampZQQ.js';
+import 'react-dom';
+import '../../chunks/bundle-ZSLOjQvb.js';
+import '../../chunks/bundle-LdRGfmOs.js';
+import '../../chunks/bundle-yCtFACB5.js';
+import '../../ui/IconButton.js';
+import '../../ui/Button.js';
+import '../../chunks/bundle-u2CeAx57.js';
+import '../../ui/Icon.js';
+import '../../chunks/bundle-EQ2jMcm0.js';
+import '../../ui/MessageInput.js';
+import '../../chunks/bundle-rgIbMndg.js';
+import '../../chunks/bundle-fwLsGp6N.js';
+import '../../chunks/bundle-ejXMvNVx.js';
+import 'dompurify';
+import '../../chunks/bundle-okmgQKUZ.js';
+import '../../chunks/bundle-Ha6WT0Hp.js';
+import '../../chunks/bundle-ZxBmutMJ.js';
+import '../../chunks/bundle-CQMOLj5V.js';
+import '../../utils/message/getOutgoingMessageState.js';
+import '../../chunks/bundle-dBXZk5Y3.js';
+import '../../chunks/bundle-HbEA73mt.js';
+import '../../ui/ImageRenderer.js';
+import '../../ui/Loader.js';
+import '../../chunks/bundle-jRxDZ3BJ.js';
+import './OpenChannelMessage.js';
+import '../../ui/OpenchannelUserMessage.js';
+import '../../ui/ContextMenu.js';
+import '../../ui/SortByRow.js';
+import '../../ui/UserProfile.js';
+import '../../sendbirdSelectors.js';
+import '../../chunks/bundle-GYn98g4i.js';
+import '../../chunks/bundle-dwc9j36U.js';
+import '../../chunks/bundle-5HYqTaTr.js';
+import '../../ui/OpenChannelAdminMessage.js';
+import '../../ui/OpenchannelOGMessage.js';
+import '../../ui/LinkLabel.js';
+import '../../chunks/bundle-J87QWRh3.js';
+import '../../Message/context.js';
+import '../../ui/MentionLabel.js';
+import '../../ui/OpenchannelThumbnailMessage.js';
+import '../../ui/OpenchannelFileMessage.js';
+import '../../ui/TextButton.js';
+import '../../chunks/bundle-mAbwjJsi.js';
+import '../../ui/DateSeparator.js';
+import '../../chunks/bundle-DB4PuqmB.js';
+import '../../chunks/bundle-f7C0xlTH.js';
+import '../../chunks/bundle-bLXmqujU.js';
+
+var COMPONENT_CLASS_NAME = 'sendbird-openchannel-conversation';
+var OpenChannelUI = function (_a) {
+    var renderMessage = _a.renderMessage, renderHeader = _a.renderHeader, renderInput = _a.renderInput, renderPlaceHolderEmptyList = _a.renderPlaceHolderEmptyList, renderPlaceHolderError = _a.renderPlaceHolderError, renderPlaceHolderLoading = _a.renderPlaceHolderLoading;
+    var _b = useOpenChannelContext(), currentOpenChannel = _b.currentOpenChannel, amIBanned = _b.amIBanned, loading = _b.loading, isInvalid = _b.isInvalid, messageInputRef = _b.messageInputRef, conversationScrollRef = _b.conversationScrollRef;
+    if (!currentOpenChannel
+        || !(currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.url)
+        || amIBanned) {
+        return ((renderPlaceHolderError === null || renderPlaceHolderError === void 0 ? void 0 : renderPlaceHolderError())
+            || React__default.createElement("div", { className: COMPONENT_CLASS_NAME },
+                React__default.createElement(PlaceHolder, { type: PlaceHolderTypes.NO_CHANNELS })));
+    }
+    if (loading) {
+        return ((renderPlaceHolderLoading === null || renderPlaceHolderLoading === void 0 ? void 0 : renderPlaceHolderLoading())
+            || React__default.createElement("div", { className: COMPONENT_CLASS_NAME },
+                React__default.createElement(PlaceHolder, { type: PlaceHolderTypes.LOADING })));
+    }
+    if (isInvalid) {
+        return ((renderPlaceHolderError === null || renderPlaceHolderError === void 0 ? void 0 : renderPlaceHolderError())
+            || React__default.createElement("div", { className: COMPONENT_CLASS_NAME },
+                React__default.createElement(PlaceHolder, { type: PlaceHolderTypes.WRONG })));
+    }
+    return (React__default.createElement("div", { className: COMPONENT_CLASS_NAME },
+        (renderHeader === null || renderHeader === void 0 ? void 0 : renderHeader()) || (React__default.createElement(OpenchannelConversationHeader, null)),
+        (currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isFrozen) && (React__default.createElement(FrozenNotification, null)),
+        React__default.createElement(OpenChannelMessageList, { ref: conversationScrollRef, renderMessage: renderMessage, renderPlaceHolderEmptyList: renderPlaceHolderEmptyList }),
+        (renderInput === null || renderInput === void 0 ? void 0 : renderInput()) || (React__default.createElement(OpenChannelInput, { ref: messageInputRef }))));
+};
+
+export { OpenChannelUI as default };
+//# sourceMappingURL=OpenChannelUI.js.map

package/OpenChannel/context.js

@@ -0,0 +1,29 @@
+import 'react';
+export { O as OpenChannelProvider, u as useOpenChannelContext } from '../chunks/bundle-lcfgNAH-.js';
+import '../chunks/bundle-J3Xwcu_c.js';
+import '../chunks/bundle-OwUIW9B_.js';
+import '../useSendbirdStateContext.js';
+import '../chunks/bundle-9hVs1LFe.js';
+import '../chunks/bundle-Izb-WW89.js';
+import '../chunks/bundle-c5jegKUx.js';
+import '../chunks/bundle-tc0rEnB_.js';
+import '@sendbird/chat';
+import '@sendbird/chat/openChannel';
+import '../chunks/bundle-dJsyeOhk.js';
+import '../chunks/bundle-XyLdN-Hr.js';
+import '../chunks/bundle-7JHtC_JJ.js';
+import '../hooks/useModal.js';
+import '../chunks/bundle-KZXjN5v7.js';
+import '../chunks/bundle-XtwZ5oLQ.js';
+import '../chunks/bundle-vUampZQQ.js';
+import 'react-dom';
+import '../chunks/bundle-ZSLOjQvb.js';
+import '../chunks/bundle-LdRGfmOs.js';
+import '../chunks/bundle-yCtFACB5.js';
+import '../ui/IconButton.js';
+import '../ui/Button.js';
+import '../chunks/bundle-u2CeAx57.js';
+import '../ui/Icon.js';
+import '../chunks/bundle-EQ2jMcm0.js';
+import '../withSendbird.js';
+//# sourceMappingURL=context.js.map