@sendbird/uikit-react 3.6.4-rc-0 → 3.6.4-rc-1

package/cjs/OpenChannel/components/OpenChannelHeader.js

@@ -0,0 +1,98 @@
+'use strict';
+
+var React = require('react');
+var ui_Avatar = require('../../ui/Avatar.js');
+var ui_Icon = require('../../ui/Icon.js');
+var ui_IconButton = require('../../ui/IconButton.js');
+var ui_Label = require('../../index-35633fb6.js');
+var LocalizationContext = require('../../LocalizationContext-8cc9717d.js');
+var OpenChannel_context = require('../../OpenChannelProvider-946e4425.js');
+var MediaQueryContext = require('../../MediaQueryContext-fad211ad.js');
+require('../../ui/ImageRenderer.js');
+require('../../uuid-1eceb0c8.js');
+require('prop-types');
+require('../../_rollupPluginBabelHelpers-acf412a3.js');
+require('../../stringSet-ce782136.js');
+require('../../index-d749c4c2.js');
+require('../../index-3fc4f7d7.js');
+require('../../UserProfileContext-d993c96b.js');
+require('../../compareIds-784d9a4e.js');
+require('../../topics-e24ef339.js');
+require('@sendbird/chat');
+require('@sendbird/chat/openChannel');
+require('../../useSendbirdStateContext.js');
+require('../../withSendbird.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+function OpenchannelConversationHeader() {
+  const {
+    stringSet
+  } = React.useContext(LocalizationContext.LocalizationContext);
+  const {
+    currentOpenChannel,
+    onChatHeaderActionClick,
+    amIOperator,
+    onBackClick
+  } = OpenChannel_context.useOpenChannelContext();
+  const title = currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.name;
+  const subTitle = `${OpenChannel_context.kFormatter(currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.participantCount)} ${stringSet.OPEN_CHANNEL_CONVERSATION__TITLE_PARTICIPANTS}`;
+  const coverImage = currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.coverUrl;
+  const {
+    isMobile
+  } = MediaQueryContext.useMediaQueryContext();
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-openchannel-conversation-header"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-openchannel-conversation-header__left"
+  }, isMobile && /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    className: "sendbird-oepnchannel-header__icon_back",
+    onClick: onBackClick,
+    fillColor: ui_Icon.IconColors.PRIMARY,
+    width: "24px",
+    height: "24px",
+    type: ui_Icon.IconTypes.ARROW_LEFT
+  }), coverImage ? /*#__PURE__*/React__default["default"].createElement(ui_Avatar["default"], {
+    className: "sendbird-openchannel-conversation-header__left__cover-image",
+    src: coverImage,
+    alt: "channel cover image",
+    width: "32px",
+    height: "32px"
+  }) : /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-openchannel-conversation-header__left__cover-image--icon",
+    style: {
+      width: 32,
+      height: 32
+    }
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    type: ui_Icon.IconTypes.CHANNELS,
+    fillColor: ui_Icon.IconColors.CONTENT,
+    width: "18px",
+    height: "18px"
+  })), /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
+    className: "sendbird-openchannel-conversation-header__left__title",
+    type: ui_Label.LabelTypography.H_2,
+    color: ui_Label.LabelColors.ONBACKGROUND_1
+  }, title || stringSet.NO_TITLE), /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
+    className: "sendbird-openchannel-conversation-header__left__sub-title",
+    type: ui_Label.LabelTypography.BODY_2,
+    color: ui_Label.LabelColors.ONBACKGROUND_2
+  }, subTitle || stringSet.NO_TITLE)), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-openchannel-conversation-header__right"
+  }, /*#__PURE__*/React__default["default"].createElement(ui_IconButton, {
+    className: "sendbird-openchannel-conversation-header__right__trigger",
+    width: "32px",
+    height: "32px",
+    onClick: onChatHeaderActionClick
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    type: amIOperator ? ui_Icon.IconTypes.INFO : ui_Icon.IconTypes.MEMBERS,
+    fillColor: ui_Icon.IconColors.PRIMARY,
+    width: "24px",
+    height: "24px"
+  }))));
+}
+
+module.exports = OpenchannelConversationHeader;
+//# sourceMappingURL=OpenChannelHeader.js.map

package/cjs/OpenChannel/components/OpenChannelInput.js

@@ -0,0 +1,82 @@
+'use strict';
+
+var React = require('react');
+var LocalizationContext = require('../../LocalizationContext-8cc9717d.js');
+var ui_MessageInput = require('../../ui/MessageInput.js');
+var OpenChannel_context = require('../../OpenChannelProvider-946e4425.js');
+require('../../stringSet-ce782136.js');
+require('../../index-d749c4c2.js');
+require('../../_rollupPluginBabelHelpers-acf412a3.js');
+require('prop-types');
+require('../../const-b19292fd.js');
+require('../../const-a3e169f4.js');
+require('../../ui/IconButton.js');
+require('../../ui/Button.js');
+require('../../index-35633fb6.js');
+require('dompurify');
+require('../../consts-d04401ad.js');
+require('../../ui/Icon.js');
+require('../../useSendbirdStateContext.js');
+require('../../withSendbird.js');
+require('../../index-a91b85d9.js');
+require('../../utils/message/getOutgoingMessageState.js');
+require('../../consts-016f07ac.js');
+require('../../consts-eb163887.js');
+require('../../tokenize-88b021e0.js');
+require('../../index.module-e3392caa.js');
+require('../../index-3fc4f7d7.js');
+require('../../UserProfileContext-d993c96b.js');
+require('../../compareIds-784d9a4e.js');
+require('../../topics-e24ef339.js');
+require('@sendbird/chat');
+require('@sendbird/chat/openChannel');
+require('../../uuid-1eceb0c8.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+const MessageInputWrapper = (props, ref) => {
+  const {
+    currentOpenChannel,
+    disabled,
+    handleSendMessage,
+    handleFileUpload,
+    amIMuted
+  } = OpenChannel_context.useOpenChannelContext();
+  const channel = currentOpenChannel;
+  const {
+    stringSet
+  } = React.useContext(LocalizationContext.LocalizationContext);
+  const {
+    value
+  } = props;
+  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 /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-openchannel-footer"
+  }, /*#__PURE__*/React__default["default"].createElement(ui_MessageInput, {
+    channel: currentOpenChannel,
+    ref: ref,
+    value: value,
+    disabled: disabled,
+    isVoiceMessageEnabled: false,
+    onSendMessage: handleSendMessage,
+    onFileUpload: handleFileUpload,
+    placeholder: getPlaceHolderString()
+  }));
+};
+var OpenChannelInput = /*#__PURE__*/React__default["default"].forwardRef(MessageInputWrapper);
+
+module.exports = OpenChannelInput;
+//# sourceMappingURL=OpenChannelInput.js.map

package/cjs/OpenChannel/components/OpenChannelMessage.js

@@ -0,0 +1,295 @@
+'use strict';
+
+var React = require('react');
+var index = require('../../index-3fc4f7d7.js');
+var ui_OpenchannelUserMessage = require('../../ui/OpenchannelUserMessage.js');
+var ui_OpenChannelAdminMessage = require('../../ui/OpenChannelAdminMessage.js');
+var ui_OpenchannelOGMessage = require('../../ui/OpenchannelOGMessage.js');
+var ui_OpenchannelThumbnailMessage = require('../../ui/OpenchannelThumbnailMessage.js');
+var ui_OpenchannelFileMessage = require('../../ui/OpenchannelFileMessage.js');
+var ui_DateSeparator = require('../../ui/DateSeparator.js');
+var ui_Label = require('../../index-35633fb6.js');
+var ui_MessageInput = require('../../ui/MessageInput.js');
+var ui_FileViewer = require('../../ui/FileViewer.js');
+var ui_Modal = require('../../ui/Modal.js');
+var LocalizationContext = require('../../LocalizationContext-8cc9717d.js');
+var _rollupPluginBabelHelpers = require('../../_rollupPluginBabelHelpers-acf412a3.js');
+var OpenChannel_context = require('../../OpenChannelProvider-946e4425.js');
+var useSendbirdStateContext = require('../../useSendbirdStateContext.js');
+require('../../index-d749c4c2.js');
+require('../../ui/Avatar.js');
+require('../../ui/ImageRenderer.js');
+require('../../ui/Icon.js');
+require('prop-types');
+require('../../uuid-1eceb0c8.js');
+require('../../ui/ContextMenu.js');
+require('react-dom');
+require('../../ui/SortByRow.js');
+require('../../index-a91b85d9.js');
+require('../../utils/message/getOutgoingMessageState.js');
+require('../../stringSet-ce782136.js');
+require('../../ui/IconButton.js');
+require('../../ui/Loader.js');
+require('../../ui/UserProfile.js');
+require('../../UserProfileContext-d993c96b.js');
+require('../../sendbirdSelectors.js');
+require('../../topics-e24ef339.js');
+require('../../utils-5aa0708e.js');
+require('../../ui/Button.js');
+require('../../utils-68387d1c.js');
+require('../../index-88a450f3.js');
+require('../../MediaQueryContext-fad211ad.js');
+require('../../useLongPress-cf56e64a.js');
+require('../../ui/LinkLabel.js');
+require('../../index-db8116c0.js');
+require('../../index.module-e3392caa.js');
+require('../../tokenize-88b021e0.js');
+require('../../Message/context.js');
+require('../../ui/MentionLabel.js');
+require('../../ui/TextButton.js');
+require('../../color-5cfb41c7.js');
+require('../../const-b19292fd.js');
+require('../../const-a3e169f4.js');
+require('dompurify');
+require('../../consts-d04401ad.js');
+require('../../consts-016f07ac.js');
+require('../../consts-eb163887.js');
+require('../../withSendbird.js');
+require('../../index-8029e07a.js');
+require('../../compareIds-784d9a4e.js');
+require('@sendbird/chat');
+require('@sendbird/chat/openChannel');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+function RemoveMessageModal(_ref) {
+  let {
+    onCloseModal,
+    onDeleteMessage
+  } = _ref;
+  const {
+    stringSet
+  } = React.useContext(LocalizationContext.LocalizationContext);
+  return /*#__PURE__*/React__default["default"].createElement(ui_Modal["default"], {
+    onCancel: onCloseModal,
+    onSubmit: onDeleteMessage,
+    submitText: stringSet.MESSAGE_MENU__DELETE,
+    titleText: stringSet.MODAL__DELETE_MESSAGE__TITLE
+  });
+}
+
+// https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Complete_list_of_MIME_types
+
+const SUPPORTED_MIMES = {
+  IMAGE: ['image/jpeg', 'image/jpg', 'image/png', 'image/gif', 'image/svg+xml', 'image/webp'],
+  VIDEO: ['video/mpeg', 'video/ogg', 'video/webm', 'video/mp4']
+};
+const isImage = type => SUPPORTED_MIMES.IMAGE.indexOf(type) >= 0;
+const isVideo = type => SUPPORTED_MIMES.VIDEO.indexOf(type) >= 0;
+_rollupPluginBabelHelpers._objectSpread2({}, SUPPORTED_MIMES);
+
+const MessageTypes = {
+  ADMIN: 'ADMIN',
+  USER: 'USER',
+  FILE: 'FILE',
+  THUMBNAIL: 'THUMBNAIL',
+  OG: 'OG',
+  UNKNOWN: 'UNKNOWN'
+};
+const SendingMessageStatus = {
+  NONE: 'none',
+  SUCCEEDED: 'succeeded',
+  FAILED: 'failed',
+  PENDING: 'pending'
+};
+const getMessageType = (message, options) => {
+  var _message$isUserMessag, _message$isAdminMessa;
+  const isOgMessageEnabledInOpenChannel = options === null || options === void 0 ? void 0 : options.isOgMessageEnabledInOpenChannel;
+  if (message !== null && message !== void 0 && (_message$isUserMessag = message.isUserMessage) !== null && _message$isUserMessag !== void 0 && _message$isUserMessag.call(message) || (message === null || message === void 0 ? void 0 : message.messageType) === 'user') {
+    return message !== null && message !== void 0 && message.ogMetaData && isOgMessageEnabledInOpenChannel ? MessageTypes.OG : MessageTypes.USER;
+  }
+  if (message !== null && message !== void 0 && (_message$isAdminMessa = message.isAdminMessage) !== null && _message$isAdminMessa !== void 0 && _message$isAdminMessa.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 _globalState$config;
+  const {
+    message,
+    chainTop,
+    chainBottom,
+    hasSeparator,
+    renderMessage
+  } = props;
+  const {
+    currentOpenChannel,
+    deleteMessage,
+    updateMessage,
+    resendMessage
+  } = OpenChannel_context.useOpenChannelContext();
+  const {
+    dateLocale
+  } = LocalizationContext.useLocalization();
+  const editDisabled = currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isFrozen;
+  const globalState = useSendbirdStateContext();
+  const userId = globalState === null || globalState === void 0 ? void 0 : (_globalState$config = globalState.config) === null || _globalState$config === void 0 ? void 0 : _globalState$config.userId;
+  const isOgMessageEnabledInOpenChannel = globalState.config.openChannel.enableOgtag;
+  let sender = null;
+  if ((message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
+    sender = message === null || message === void 0 ? void 0 : message.sender;
+  }
+  const RenderedMessage = React.useMemo(() => props => {
+    return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, renderMessage ? renderMessage(props) : null);
+  }, [message, renderMessage]);
+  const [showEdit, setShowEdit] = React.useState(false);
+  const [showRemove, setShowRemove] = React.useState(false);
+  const [showFileViewer, setShowFileViewer] = React.useState(false);
+  const editMessageInputRef = React.useRef(null);
+  let isByMe = false;
+  if (sender && (message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
+    // pending and failed messages are by me
+    isByMe = userId === 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 /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "sendbird-msg-hoc sendbird-msg--scroll-ref"
+    }, /*#__PURE__*/React__default["default"].createElement(RenderedMessage, {
+      message: message,
+      chainTop: chainTop,
+      chainBottom: chainBottom
+    }));
+  }
+  if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user' && showEdit) {
+    return /*#__PURE__*/React__default["default"].createElement(ui_MessageInput, {
+      isEdit: true,
+      channel: currentOpenChannel,
+      disabled: editDisabled,
+      ref: editMessageInputRef,
+      message: message,
+      name: message === null || message === void 0 ? void 0 : message.messageId,
+      onUpdateMessage: _ref => {
+        let {
+          messageId,
+          message
+        } = _ref;
+        updateMessage(messageId, message);
+        setShowEdit(false);
+      },
+      onCancelEdit: () => {
+        setShowEdit(false);
+      }
+    });
+  }
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-msg-hoc sendbird-msg--scroll-ref"
+  }, hasSeparator && (message === null || message === void 0 ? void 0 : message.createdAt) && /*#__PURE__*/React__default["default"].createElement(ui_DateSeparator, null, /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
+    type: ui_Label.LabelTypography.CAPTION_2,
+    color: ui_Label.LabelColors.ONBACKGROUND_2
+  }, index.format(message === null || message === void 0 ? void 0 : message.createdAt, 'MMMM dd, yyyy', {
+    locale: dateLocale
+  }))), {
+    [MessageTypes.ADMIN]: (() => {
+      if ((message === null || message === void 0 ? void 0 : message.messageType) === 'admin') {
+        return /*#__PURE__*/React__default["default"].createElement(ui_OpenChannelAdminMessage, {
+          message: message
+        });
+      }
+    })(),
+    [MessageTypes.FILE]: (() => {
+      if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
+        var _sender;
+        return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelFileMessage, {
+          message: message,
+          isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator(message === null || message === void 0 ? void 0 : (_sender = message.sender) === null || _sender === void 0 ? void 0 : _sender.userId),
+          isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
+          disabled: editDisabled,
+          userId: userId,
+          showRemove: setShowRemove,
+          resendMessage: resendMessage,
+          chainTop: chainTop,
+          chainBottom: chainBottom
+        });
+      }
+    })(),
+    [MessageTypes.OG]: (() => {
+      if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user' && isOgMessageEnabledInOpenChannel) {
+        var _sender2;
+        return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelOGMessage, {
+          message: message,
+          isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator(message === null || message === void 0 ? void 0 : (_sender2 = message.sender) === null || _sender2 === void 0 ? void 0 : _sender2.userId),
+          isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
+          userId: userId,
+          showEdit: setShowEdit,
+          disabled: editDisabled,
+          showRemove: setShowRemove,
+          resendMessage: resendMessage,
+          chainTop: chainTop,
+          chainBottom: chainBottom
+        });
+      }
+    })(),
+    [MessageTypes.THUMBNAIL]: (() => {
+      if ((message === null || message === void 0 ? void 0 : message.messageType) === 'file') {
+        var _sender3;
+        return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelThumbnailMessage, {
+          message: message,
+          isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator(message === null || message === void 0 ? void 0 : (_sender3 = message.sender) === null || _sender3 === void 0 ? void 0 : _sender3.userId),
+          isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
+          disabled: editDisabled,
+          userId: userId,
+          showRemove: setShowRemove,
+          resendMessage: resendMessage,
+          onClick: setShowFileViewer,
+          chainTop: chainTop,
+          chainBottom: chainBottom
+        });
+      }
+    })(),
+    [MessageTypes.USER]: (() => {
+      if ((message === null || message === void 0 ? void 0 : message.messageType) === 'user') {
+        var _sender4;
+        return /*#__PURE__*/React__default["default"].createElement(ui_OpenchannelUserMessage, {
+          message: message,
+          isOperator: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isOperator(message === null || message === void 0 ? void 0 : (_sender4 = message.sender) === null || _sender4 === void 0 ? void 0 : _sender4.userId),
+          isEphemeral: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.isEphemeral,
+          userId: userId,
+          disabled: editDisabled,
+          showEdit: setShowEdit,
+          showRemove: setShowRemove,
+          resendMessage: resendMessage,
+          chainTop: chainTop,
+          chainBottom: chainBottom
+        });
+      }
+    })(),
+    [MessageTypes.UNKNOWN]: (() => {
+      // return (
+      //   <OpenChannelUnknownMessage message={message} />
+      // );
+    })()
+  }[getMessageType(message, {
+    isOgMessageEnabledInOpenChannel
+  })], showRemove && /*#__PURE__*/React__default["default"].createElement(RemoveMessageModal, {
+    onCloseModal: () => setShowRemove(false),
+    onDeleteMessage: () => {
+      if ((message === null || message === void 0 ? void 0 : message.messageType) !== 'admin') {
+        deleteMessage(message);
+      }
+    }
+  }), showFileViewer && (message === null || message === void 0 ? void 0 : message.messageType) === 'file' && /*#__PURE__*/React__default["default"].createElement(ui_FileViewer["default"], {
+    onClose: () => setShowFileViewer(false),
+    message: message,
+    onDelete: () => deleteMessage(message),
+    isByMe: isByMe
+  }));
+}
+
+module.exports = MessagOpenChannelMessageeHoc;
+//# sourceMappingURL=OpenChannelMessage.js.map

package/cjs/OpenChannel/components/OpenChannelMessageList.js

@@ -0,0 +1,153 @@
+'use strict';
+
+var React = require('react');
+var index$1 = require('../../index-bf8f9551.js');
+var ui_Icon = require('../../ui/Icon.js');
+var ui_PlaceHolder = require('../../index-985a1afb.js');
+var OpenChannel_context = require('../../OpenChannelProvider-946e4425.js');
+var OpenChannel_components_OpenChannelMessage = require('./OpenChannelMessage.js');
+var Message_context = require('../../Message/context.js');
+var useSendbirdStateContext = require('../../useSendbirdStateContext.js');
+var index = require('../../index-f6c6728e.js');
+require('../../index-3fc4f7d7.js');
+require('../../index-d749c4c2.js');
+require('prop-types');
+require('../../LocalizationContext-8cc9717d.js');
+require('../../stringSet-ce782136.js');
+require('../../index-35633fb6.js');
+require('../../ui/Loader.js');
+require('../../UserProfileContext-d993c96b.js');
+require('../../_rollupPluginBabelHelpers-acf412a3.js');
+require('../../compareIds-784d9a4e.js');
+require('../../topics-e24ef339.js');
+require('@sendbird/chat');
+require('@sendbird/chat/openChannel');
+require('../../uuid-1eceb0c8.js');
+require('../../ui/OpenchannelUserMessage.js');
+require('../../ui/Avatar.js');
+require('../../ui/ImageRenderer.js');
+require('../../ui/ContextMenu.js');
+require('react-dom');
+require('../../ui/SortByRow.js');
+require('../../index-a91b85d9.js');
+require('../../utils/message/getOutgoingMessageState.js');
+require('../../ui/IconButton.js');
+require('../../ui/UserProfile.js');
+require('../../sendbirdSelectors.js');
+require('../../utils-5aa0708e.js');
+require('../../ui/Button.js');
+require('../../utils-68387d1c.js');
+require('../../index-88a450f3.js');
+require('../../MediaQueryContext-fad211ad.js');
+require('../../useLongPress-cf56e64a.js');
+require('../../ui/OpenChannelAdminMessage.js');
+require('../../ui/OpenchannelOGMessage.js');
+require('../../ui/LinkLabel.js');
+require('../../index-db8116c0.js');
+require('../../index.module-e3392caa.js');
+require('../../tokenize-88b021e0.js');
+require('../../ui/MentionLabel.js');
+require('../../ui/OpenchannelThumbnailMessage.js');
+require('../../ui/OpenchannelFileMessage.js');
+require('../../ui/TextButton.js');
+require('../../color-5cfb41c7.js');
+require('../../ui/DateSeparator.js');
+require('../../ui/MessageInput.js');
+require('../../const-b19292fd.js');
+require('../../const-a3e169f4.js');
+require('dompurify');
+require('../../consts-d04401ad.js');
+require('../../consts-016f07ac.js');
+require('../../consts-eb163887.js');
+require('../../ui/FileViewer.js');
+require('../../index-8029e07a.js');
+require('../../ui/Modal.js');
+require('../../withSendbird.js');
+require('../../consts-9641990e.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+function OpenchannelMessageList(props, ref) {
+  const {
+    isMessageGroupingEnabled = true,
+    allMessages,
+    hasMore,
+    onScroll
+  } = OpenChannel_context.useOpenChannelContext();
+  const store = useSendbirdStateContext();
+  const userId = store.config.userId;
+  const scrollRef = ref || React.useRef(null);
+  const [showScrollDownButton, setShowScrollDownButton] = React.useState(false);
+  const scrollToBottom = () => {
+    if (scrollRef && scrollRef.current) {
+      scrollRef.current.scrollTo(0, scrollRef.current.scrollHeight);
+      setShowScrollDownButton(false);
+    }
+  };
+  const handleOnScroll = index.useHandleOnScrollCallback({
+    setShowScrollDownButton,
+    hasMore,
+    onScroll,
+    scrollRef
+  });
+  const memoizedMessageList = React.useMemo(() => {
+    var _props$renderPlaceHol;
+    if (allMessages.length > 0) {
+      return allMessages.map((message, index) => {
+        var _sender;
+        const previousMessage = allMessages[index - 1];
+        const nextMessage = allMessages[index - 1];
+        const previousMessageCreatedAt = previousMessage && previousMessage.createdAt;
+        const currentCreatedAt = message === null || message === void 0 ? void 0 : message.createdAt;
+        // https://stackoverflow.com/a/41855608
+        const hasSeparator = !(previousMessageCreatedAt && index$1.isSameDay(currentCreatedAt, previousMessageCreatedAt));
+        const [chainTop, chainBottom] = isMessageGroupingEnabled ? OpenChannel_context.compareMessagesForGrouping(previousMessage, message, nextMessage) : [false, false];
+        const isByMe = (message === null || message === void 0 ? void 0 : (_sender = message.sender) === null || _sender === void 0 ? void 0 : _sender.userId) === userId;
+        const key = (message === null || message === void 0 ? void 0 : message.messageId) || (message === null || message === void 0 ? void 0 : message.reqId);
+        return /*#__PURE__*/React__default["default"].createElement(Message_context.MessageProvider, {
+          message: message,
+          isByMe: isByMe,
+          key: key
+        }, /*#__PURE__*/React__default["default"].createElement(OpenChannel_components_OpenChannelMessage, {
+          message: message,
+          chainTop: chainTop,
+          chainBottom: chainBottom,
+          hasSeparator: hasSeparator,
+          renderMessage: props === null || props === void 0 ? void 0 : props.renderMessage
+        }));
+      });
+    }
+    return (props === null || props === void 0 ? void 0 : (_props$renderPlaceHol = props.renderPlaceHolderEmptyList) === null || _props$renderPlaceHol === void 0 ? void 0 : _props$renderPlaceHol.call(props)) || /*#__PURE__*/React__default["default"].createElement(ui_PlaceHolder.PlaceHolder, {
+      className: "sendbird-openchannel-conversation-scroll__container__place-holder",
+      type: ui_PlaceHolder.PlaceHolderTypes.NO_MESSAGES
+    });
+  }, [allMessages]);
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-openchannel-conversation-scroll"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-openchannel-conversation-scroll__container"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-openchannel-conversation-scroll__container__padding"
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: ['sendbird-openchannel-conversation-scroll__container__item-container', allMessages.length > 0 ? '' : 'no-messages'].join(' '),
+    onScroll: handleOnScroll,
+    ref: scrollRef
+  }, memoizedMessageList)), showScrollDownButton && /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-openchannel-conversation-scroll__container__scroll-bottom-button",
+    onClick: scrollToBottom,
+    onKeyDown: scrollToBottom,
+    tabIndex: 0,
+    role: "button"
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    width: "24px",
+    height: "24px",
+    type: ui_Icon.IconTypes.CHEVRON_DOWN,
+    fillColor: ui_Icon.IconColors.CONTENT
+  })));
+}
+var OpenChannelMessageList = /*#__PURE__*/React__default["default"].forwardRef(OpenchannelMessageList);
+
+module.exports = OpenChannelMessageList;
+//# sourceMappingURL=OpenChannelMessageList.js.map