@sendbird/uikit-react 3.5.0-rc.0 → 3.5.0

package/cjs/Channel/components/ChannelUI.js

@@ -2,140 +2,141 @@
 
 var React = require('react');
 var useSendbirdStateContext = require('../../useSendbirdStateContext.js');
-var Channel_context = require('../../ChannelProvider-1e08a7a9.js');
-var ui_PlaceHolder = require('../../index-e8544e24.js');
+var Channel_context = require('../../ChannelProvider-0df75472.js');
+var ui_PlaceHolder = require('../../index-1613ae03.js');
 var ui_ConnectionStatus = require('../../ui/ConnectionStatus.js');
 var Channel_components_ChannelHeader = require('./ChannelHeader.js');
 var Channel_components_MessageList = require('./MessageList.js');
 var Channel_components_TypingIndicator = require('./TypingIndicator.js');
-var Channel_components_FrozenNotification = require('./FrozenNotification.js');
-var Channel_components_UnreadCount = require('./UnreadCount.js');
 var Channel_components_MessageInput = require('./MessageInput.js');
 require('../../withSendbird.js');
-require('../../_rollupPluginBabelHelpers-bd6baf0a.js');
-require('../../UserProfileContext-0808e413.js');
+require('../../_rollupPluginBabelHelpers-c89f311a.js');
+require('../../UserProfileContext-87580795.js');
 require('prop-types');
-require('../../index-5ea12b7a.js');
-require('../../index-48d85d8f.js');
-require('../../topics-f3f74edc.js');
-require('../../index-b3371ef2.js');
-require('../../tslib.es6-5a7eb30d.js');
+require('../../const-a85f3364.js');
+require('../../index-869e9a94.js');
+require('../../index-016f7106.js');
+require('../../topics-b384e6b3.js');
+require('../../index-5231fde8.js');
 require('../../utils/message/getOutgoingMessageState.js');
-require('../../compareIds-d0c02eca.js');
-require('../../const-beb25e10.js');
+require('../../compareIds-ccccfe86.js');
 require('@sendbird/chat/groupChannel');
-require('../../uuid-a9006ea2.js');
+require('../../uuid-12b01f73.js');
 require('@sendbird/chat/message');
-require('../../ui/ContextMenu.js');
-require('react-dom');
-require('../../ui/SortByRow.js');
-require('../../index-bdd889a2.js');
-require('../../stringSet-60660a99.js');
-require('../../ui/ReactionButton.js');
-require('../../ui/ImageRenderer.js');
+require('../../consts-5e0f96b3.js');
+require('../../resolvedReplyType-67e78c63.js');
+require('../../LocalizationContext-0e429c3d.js');
+require('../../stringSet-106da549.js');
 require('../../ui/Icon.js');
-require('../../LocalizationContext-8780a64e.js');
+require('../../index-6cb0d040.js');
 require('../../ui/Loader.js');
-require('../../utils-b6001dd4.js');
+require('../../utils-5ac3db44.js');
 require('../../ui/IconButton.js');
 require('../../ui/ChannelAvatar.js');
 require('../../ui/Avatar.js');
-require('../../utils-693dd952.js');
-require('../../MediaQueryContext-e455934a.js');
-require('../../utils-708aa730.js');
-require('../../index-abe135e6.js');
+require('../../ui/ImageRenderer.js');
+require('../../utils-2edcddc8.js');
+require('../../MediaQueryContext-33fc3b17.js');
+require('../../utils-ad7b5b82.js');
 require('./Message.js');
 require('./SuggestedMentionList.js');
-require('../../const-8785e4ad.js');
-require('../../ThreadProvider-51be09a5.js');
+require('../../const-d8cece19.js');
+require('../../ThreadProvider-8ee179c2.js');
 require('../../Thread/context/types.js');
 require('@sendbird/chat');
 require('../../ui/DateSeparator.js');
-require('../../color-fdbe394d.js');
+require('../../color-bada0fc7.js');
 require('../../ui/MessageInput.js');
-require('react-dom/server');
 require('../../ui/Button.js');
-require('../../ui/MentionUserLabel.js');
+require('dompurify');
+require('../../consts-1c3020ad.js');
+require('../../consts-1d94dc61.js');
+require('../../consts-740f60b8.js');
+require('../../tokenize-2aa0f876.js');
+require('../../index.module-0585715f.js');
 require('../../ui/MessageContent.js');
 require('../../ui/UserProfile.js');
 require('../../sendbirdSelectors.js');
-require('../../index-e191d245.js');
-require('../../index-c13771a7.js');
-require('../../index-8a4b2f10.js');
+require('../../index-7f6bbe0c.js');
+require('../../index-8affdde5.js');
+require('../../index-7d125728.js');
 require('../../ui/MessageItemMenu.js');
+require('../../ui/ContextMenu.js');
+require('react-dom');
+require('../../ui/SortByRow.js');
+require('../../types-e0b77c8c.js');
 require('../../ui/MessageItemReactionMenu.js');
+require('../../ui/ReactionButton.js');
+require('../../useLongPress-8037894e.js');
 require('../../ui/EmojiReactions.js');
+require('../../ui/ReactionBadge.js');
+require('../../ui/BottomSheet.js');
+require('../../index-f570d25c.js');
+require('../../ui/UserListItem.js');
+require('../../ui/MutedAvatarOverlay.js');
+require('../../ui/Checkbox.js');
 require('../../ui/Tooltip.js');
 require('../../ui/TooltipWrapper.js');
-require('../../ui/ReactionBadge.js');
+require('../../Message/context.js');
 require('../../ui/AdminMessage.js');
 require('../../ui/TextMessageItemBody.js');
-require('../../ui/Word.js');
-require('../../ui/LinkLabel.js');
+require('../../index-2be14d85.js');
 require('../../ui/MentionLabel.js');
+require('../../ui/LinkLabel.js');
 require('../../ui/FileMessageItemBody.js');
 require('../../ui/TextButton.js');
 require('../../ui/ThumbnailMessageItemBody.js');
 require('../../ui/OGMessageItemBody.js');
 require('../../ui/UnknownMessageItemBody.js');
 require('../../ui/QuoteMessage.js');
-require('../../useLongPress-e7140087.js');
-require('../../ui/BottomSheet.js');
-require('../../index-08d232f8.js');
+require('../../index-89d81dad.js');
 require('../../ui/ThreadReplies.js');
+require('../../ui/VoiceMessageItemBody.js');
+require('../../ui/ProgressBar.js');
+require('../../VoicePlayer/useVoicePlayer.js');
+require('../../index-648c06ed.js');
+require('../../VoiceRecorder/context.js');
+require('../../ui/Modal.js');
+require('../../ui/PlaybackTime.js');
 require('./FileViewer.js');
 require('./RemoveMessageModal.js');
-require('../../ui/Modal.js');
+require('../../index-3b30939e.js');
+require('../../useDirtyGetMentions-b8ca5675.js');
+require('./UnreadCount.js');
+require('./FrozenNotification.js');
 require('../../ui/QuoteMessageInput.js');
+require('../../VoiceMessageInputWrapper-4fdc8ef1.js');
+require('../../VoiceRecorder/useVoiceRecorder.js');
+require('../../index-e8c0080f.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var ChannelUI = function (_a) {
-  var _b, _c, _d, _e;
-
-  var isLoading = _a.isLoading,
-      renderPlaceholderLoader = _a.renderPlaceholderLoader,
-      renderPlaceholderInvalid = _a.renderPlaceholderInvalid,
-      renderPlaceholderEmpty = _a.renderPlaceholderEmpty,
-      renderChannelHeader = _a.renderChannelHeader,
-      renderMessage = _a.renderMessage,
-      renderMessageInput = _a.renderMessageInput,
-      renderTypingIndicator = _a.renderTypingIndicator,
-      renderCustomSeparator = _a.renderCustomSeparator;
-
-  var _f = Channel_context.useChannelContext(),
-      currentGroupChannel = _f.currentGroupChannel,
-      channelUrl = _f.channelUrl,
-      isInvalid = _f.isInvalid,
-      unreadSince = _f.unreadSince,
-      loading = _f.loading,
-      setInitialTimeStamp = _f.setInitialTimeStamp,
-      setAnimatedMessageId = _f.setAnimatedMessageId,
-      setHighLightedMessageId = _f.setHighLightedMessageId,
-      scrollRef = _f.scrollRef,
-      messagesDispatcher = _f.messagesDispatcher,
-      disableMarkAsRead = _f.disableMarkAsRead;
-
-  var _g = React.useState(0),
-      unreadCount = _g[0],
-      setUnreadCount = _g[1];
-
-  React.useEffect(function () {
-    // simple debounce to avoid flicker of UnreadCount badge
-    var handler = setTimeout(function () {
-      setUnreadCount(currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : currentGroupChannel.unreadMessageCount);
-    }, 1000);
-    return function () {
-      clearTimeout(handler);
-    };
-  }, [currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : currentGroupChannel.unreadMessageCount]);
-  var globalStore = useSendbirdStateContext();
-  var sdkError = (_c = (_b = globalStore === null || globalStore === void 0 ? void 0 : globalStore.stores) === null || _b === void 0 ? void 0 : _b.sdkStore) === null || _c === void 0 ? void 0 : _c.error;
-  var logger = (_d = globalStore === null || globalStore === void 0 ? void 0 : globalStore.config) === null || _d === void 0 ? void 0 : _d.logger;
-  var isOnline = (_e = globalStore === null || globalStore === void 0 ? void 0 : globalStore.config) === null || _e === void 0 ? void 0 : _e.isOnline;
-
+const ChannelUI = _ref => {
+  var _globalStore$stores, _globalStore$stores$s, _globalStore$config, _globalStore$config2, _globalStore$config3, _globalStore$config3$;
+  let {
+    isLoading,
+    renderPlaceholderLoader,
+    renderPlaceholderInvalid,
+    renderPlaceholderEmpty,
+    renderChannelHeader,
+    renderMessage,
+    renderMessageInput,
+    renderTypingIndicator,
+    renderCustomSeparator,
+    renderFileUploadIcon,
+    renderVoiceMessageIcon,
+    renderSendMessageIcon
+  } = _ref;
+  const {
+    channelUrl,
+    isInvalid
+  } = Channel_context.useChannelContext();
+  const globalStore = useSendbirdStateContext();
+  const sdkError = globalStore === null || globalStore === void 0 ? void 0 : (_globalStore$stores = globalStore.stores) === null || _globalStore$stores === void 0 ? void 0 : (_globalStore$stores$s = _globalStore$stores.sdkStore) === null || _globalStore$stores$s === void 0 ? void 0 : _globalStore$stores$s.error;
+  const logger = globalStore === null || globalStore === void 0 ? void 0 : (_globalStore$config = globalStore.config) === null || _globalStore$config === void 0 ? void 0 : _globalStore$config.logger;
+  const isOnline = globalStore === null || globalStore === void 0 ? void 0 : (_globalStore$config2 = globalStore.config) === null || _globalStore$config2 === void 0 ? void 0 : _globalStore$config2.isOnline;
   if (isLoading) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "sendbird-conversation"
@@ -143,7 +144,6 @@ var ChannelUI = function (_a) {
       type: ui_PlaceHolder.PlaceHolderTypes.LOADING
     }));
   }
-
   if (!channelUrl) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "sendbird-conversation"
@@ -151,7 +151,6 @@ var ChannelUI = function (_a) {
       type: ui_PlaceHolder.PlaceHolderTypes.NO_CHANNELS
     }));
   }
-
   if (isInvalid) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "sendbird-conversation"
@@ -159,63 +158,37 @@ var ChannelUI = function (_a) {
       type: ui_PlaceHolder.PlaceHolderTypes.WRONG
     }));
   }
-
   if (sdkError) {
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "sendbird-conversation"
     }, (renderPlaceholderInvalid === null || renderPlaceholderInvalid === void 0 ? void 0 : renderPlaceholderInvalid()) || /*#__PURE__*/React__default["default"].createElement(ui_PlaceHolder.PlaceHolder, {
       type: ui_PlaceHolder.PlaceHolderTypes.WRONG,
-      retryToConnect: function () {
-        logger.info('Channel: reconnecting'); // reconnect();
+      retryToConnect: () => {
+        logger.info('Channel: reconnecting');
+        // reconnect();
       }
     }));
   }
 
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-conversation"
-  }, (renderChannelHeader === null || renderChannelHeader === void 0 ? void 0 : renderChannelHeader()) || /*#__PURE__*/React__default["default"].createElement(Channel_components_ChannelHeader, null), (currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : currentGroupChannel.isFrozen) && /*#__PURE__*/React__default["default"].createElement(Channel_components_FrozenNotification, null), unreadCount > 0 && /*#__PURE__*/React__default["default"].createElement(Channel_components_UnreadCount, {
-    count: unreadCount,
-    time: unreadSince,
-    onClick: function () {
-      var _a, _b, _c;
-
-      setUnreadCount(0);
-
-      if ((_a = scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current) === null || _a === void 0 ? void 0 : _a.scrollTop) {
-        scrollRef.current.scrollTop = ((_b = scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current) === null || _b === void 0 ? void 0 : _b.scrollHeight) - ((_c = scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight);
-      }
-
-      if (!disableMarkAsRead) {
-        try {
-          currentGroupChannel === null || currentGroupChannel === void 0 ? void 0 : currentGroupChannel.markAsRead();
-        } catch (_d) {//
-        }
-
-        messagesDispatcher({
-          type: Channel_context.MARK_AS_READ,
-          payload: {
-            channel: currentGroupChannel
-          }
-        });
-      }
-
-      setInitialTimeStamp(null);
-      setAnimatedMessageId(null);
-      setHighLightedMessageId(null);
-    }
-  }), loading ? /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "sendbird-conversation"
-  }, (renderPlaceholderLoader === null || renderPlaceholderLoader === void 0 ? void 0 : renderPlaceholderLoader()) || /*#__PURE__*/React__default["default"].createElement(ui_PlaceHolder.PlaceHolder, {
-    type: ui_PlaceHolder.PlaceHolderTypes.LOADING
-  })) : /*#__PURE__*/React__default["default"].createElement(Channel_components_MessageList, {
+  }, (renderChannelHeader === null || renderChannelHeader === void 0 ? void 0 : renderChannelHeader()) || /*#__PURE__*/React__default["default"].createElement(Channel_components_ChannelHeader, {
+    className: "sendbird-conversation__channel-header"
+  }), /*#__PURE__*/React__default["default"].createElement(Channel_components_MessageList, {
+    className: "sendbird-conversation__message-list",
     renderMessage: renderMessage,
     renderPlaceholderEmpty: renderPlaceholderEmpty,
-    renderCustomSeparator: renderCustomSeparator
+    renderCustomSeparator: renderCustomSeparator,
+    renderPlaceholderLoader: renderPlaceholderLoader
   }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-conversation__footer"
-  }, (renderMessageInput === null || renderMessageInput === void 0 ? void 0 : renderMessageInput()) || /*#__PURE__*/React__default["default"].createElement(Channel_components_MessageInput, null), /*#__PURE__*/React__default["default"].createElement("div", {
+  }, (renderMessageInput === null || renderMessageInput === void 0 ? void 0 : renderMessageInput()) || /*#__PURE__*/React__default["default"].createElement(Channel_components_MessageInput, {
+    renderFileUploadIcon: renderFileUploadIcon,
+    renderVoiceMessageIcon: renderVoiceMessageIcon,
+    renderSendMessageIcon: renderSendMessageIcon
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-conversation__footer__typing-indicator"
-  }, (renderTypingIndicator === null || renderTypingIndicator === void 0 ? void 0 : renderTypingIndicator()) || /*#__PURE__*/React__default["default"].createElement(Channel_components_TypingIndicator["default"], null), !isOnline && /*#__PURE__*/React__default["default"].createElement(ui_ConnectionStatus, null))));
+  }, (renderTypingIndicator === null || renderTypingIndicator === void 0 ? void 0 : renderTypingIndicator()) || (globalStore === null || globalStore === void 0 ? void 0 : (_globalStore$config3 = globalStore.config) === null || _globalStore$config3 === void 0 ? void 0 : (_globalStore$config3$ = _globalStore$config3.groupChannel) === null || _globalStore$config3$ === void 0 ? void 0 : _globalStore$config3$.enableTypingIndicator) && /*#__PURE__*/React__default["default"].createElement(Channel_components_TypingIndicator["default"], null), !isOnline && /*#__PURE__*/React__default["default"].createElement(ui_ConnectionStatus, null))));
 };
 
 module.exports = ChannelUI;

package/cjs/Channel/components/ChannelUI.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChannelUI.js","sources":["../../../../src/smart-components/Channel/components/ChannelUI/index.tsx"],"sourcesContent":["import './channel-ui.scss';\n\nimport React, { useEffect, useState } from 'react';\nimport useSendbirdStateContext from '../../../../hooks/useSendbirdStateContext';\n\nimport { useChannelContext } from '../../context/ChannelProvider';\nimport PlaceHolder, { PlaceHolderTypes } from '../../../../ui/PlaceHolder';\nimport ConnectionStatus from '../../../../ui/ConnectionStatus';\nimport ChannelHeader from '../ChannelHeader';\nimport MessageList from '../MessageList';\nimport TypingIndicator from '../TypingIndicator';\nimport FrozenNotification from '../FrozenNotification';\nimport UnreadCount from '../UnreadCount';\nimport MessageInputWrapper from '../MessageInput';\nimport { RenderCustomSeparatorProps, RenderMessageProps } from '../../../../types';\nimport * as messageActionTypes from '../../context/dux/actionTypes';\n\nexport interface ChannelUIProps {\n  isLoading?: boolean;\n  renderPlaceholderLoader?: () => React.ReactElement;\n  renderPlaceholderInvalid?: () => React.ReactElement;\n  renderPlaceholderEmpty?: () => React.ReactElement;\n  renderChannelHeader?: () => React.ReactElement;\n  renderMessage?: (props: RenderMessageProps) => React.ReactElement;\n  renderMessageInput?: () => React.ReactElement;\n  renderTypingIndicator?: () => React.ReactElement;\n  renderCustomSeparator?: (props: RenderCustomSeparatorProps) => React.ReactElement;\n}\n\nconst ChannelUI: React.FC<ChannelUIProps> = ({\n  isLoading,\n  renderPlaceholderLoader,\n  renderPlaceholderInvalid,\n  renderPlaceholderEmpty,\n  renderChannelHeader,\n  renderMessage,\n  renderMessageInput,\n  renderTypingIndicator,\n  renderCustomSeparator,\n}: ChannelUIProps) => {\n  const {\n    currentGroupChannel,\n    channelUrl,\n    isInvalid,\n    unreadSince,\n    loading,\n    setInitialTimeStamp,\n    setAnimatedMessageId,\n    setHighLightedMessageId,\n    scrollRef,\n    messagesDispatcher,\n    disableMarkAsRead,\n  } = useChannelContext();\n  const [unreadCount, setUnreadCount] = useState(0);\n  useEffect(() => {\n    // simple debounce to avoid flicker of UnreadCount badge\n    const handler = setTimeout(() => {\n      setUnreadCount(currentGroupChannel?.unreadMessageCount);\n    }, 1000);\n    return () => {\n      clearTimeout(handler);\n    }\n  }, [currentGroupChannel?.unreadMessageCount]);\n  const globalStore = useSendbirdStateContext();\n  const sdkError = globalStore?.stores?.sdkStore?.error;\n  const logger = globalStore?.config?.logger;\n  const isOnline = globalStore?.config?.isOnline;\n\n  if (isLoading) {\n    return (<div className=\"sendbird-conversation\">\n      {\n        renderPlaceholderLoader?.() || (\n          <PlaceHolder type={PlaceHolderTypes.LOADING} />\n        )\n      }\n    </div>);\n  }\n\n  if (!channelUrl) {\n    return (<div className=\"sendbird-conversation\">\n      {\n        renderPlaceholderInvalid?.() || (\n          <PlaceHolder type={PlaceHolderTypes.NO_CHANNELS} />\n        )\n      }\n    </div>);\n  }\n  if (isInvalid) {\n    return (\n      <div className=\"sendbird-conversation\">\n        {\n          renderPlaceholderInvalid?.() || (\n            <PlaceHolder type={PlaceHolderTypes.WRONG} />\n          )\n        }\n      </div>\n    );\n  }\n  if (sdkError) {\n    return (\n      <div className=\"sendbird-conversation\">\n        {\n          renderPlaceholderInvalid?.() || (\n            <PlaceHolder\n              type={PlaceHolderTypes.WRONG}\n              retryToConnect={() => {\n                logger.info('Channel: reconnecting');\n                // reconnect();\n              }}\n            />\n          )\n        }\n      </div>\n    );\n  }\n  return (\n    <div className='sendbird-conversation'>\n      {\n        renderChannelHeader?.() || (\n          <ChannelHeader />\n        )\n      }\n      {\n        currentGroupChannel?.isFrozen && (\n          <FrozenNotification />\n        )\n      }\n      {\n        unreadCount > 0 && (\n          <UnreadCount\n            count={unreadCount}\n            time={unreadSince}\n            onClick={() => {\n              setUnreadCount(0);\n              if (scrollRef?.current?.scrollTop) {\n                scrollRef.current.scrollTop = scrollRef?.current?.scrollHeight - scrollRef?.current?.offsetHeight;\n              }\n              if (!disableMarkAsRead) {\n                try {\n                  currentGroupChannel?.markAsRead();\n                } catch {\n                  //\n                }\n                messagesDispatcher({\n                  type: messageActionTypes.MARK_AS_READ,\n                  payload: { channel: currentGroupChannel },\n                });\n              }\n              setInitialTimeStamp(null);\n              setAnimatedMessageId(null);\n              setHighLightedMessageId(null);\n            }}\n          />\n        )\n      }\n      {\n        loading\n          ? (\n            <div className=\"sendbird-conversation\">\n              {\n                renderPlaceholderLoader?.() || (\n                  <PlaceHolder type={PlaceHolderTypes.LOADING} />\n                )\n              }\n            </div>\n          ) : (\n            <MessageList\n              renderMessage={renderMessage}\n              renderPlaceholderEmpty={renderPlaceholderEmpty}\n              renderCustomSeparator={renderCustomSeparator}\n            />\n          )\n      }\n      <div className=\"sendbird-conversation__footer\">\n        {\n          renderMessageInput?.() || (\n            <MessageInputWrapper />\n          )\n        }\n        <div className=\"sendbird-conversation__footer__typing-indicator\">\n          {\n            renderTypingIndicator?.() || (\n              <TypingIndicator />\n            )\n          }\n          {\n            !isOnline && (\n              <ConnectionStatus />\n            )\n          }\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default ChannelUI;\n"],"names":["ChannelUI","_a","isLoading","renderPlaceholderLoader","renderPlaceholderInvalid","renderPlaceholderEmpty","renderChannelHeader","renderMessage","renderMessageInput","renderTypingIndicator","renderCustomSeparator","_f","useChannelContext","currentGroupChannel","channelUrl","isInvalid","unreadSince","loading","setInitialTimeStamp","setAnimatedMessageId","setHighLightedMessageId","scrollRef","messagesDispatcher","disableMarkAsRead","_g","useState","unreadCount","setUnreadCount","useEffect","handler","setTimeout","unreadMessageCount","clearTimeout","globalStore","useSendbirdStateContext","sdkError","_c","_b","stores","sdkStore","error","logger","_d","config","isOnline","_e","React","PlaceHolder","PlaceHolderTypes","LOADING","NO_CHANNELS","WRONG","info","ChannelHeader","isFrozen","FrozenNotification","UnreadCount","current","scrollTop","scrollHeight","offsetHeight","markAsRead","type","messageActionTypes","payload","channel","MessageList","MessageInputWrapper","TypingIndicator","ConnectionStatus"],"mappings":"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"}
+{"version":3,"file":"ChannelUI.js","sources":["../../../../src/modules/Channel/components/ChannelUI/index.tsx"],"sourcesContent":["import './channel-ui.scss';\n\nimport React from 'react';\nimport useSendbirdStateContext from '../../../../hooks/useSendbirdStateContext';\n\nimport { useChannelContext } from '../../context/ChannelProvider';\nimport PlaceHolder, { PlaceHolderTypes } from '../../../../ui/PlaceHolder';\nimport ConnectionStatus from '../../../../ui/ConnectionStatus';\nimport ChannelHeader from '../ChannelHeader';\nimport MessageList from '../MessageList';\nimport TypingIndicator from '../TypingIndicator';\nimport MessageInputWrapper from '../MessageInput';\nimport { RenderCustomSeparatorProps, RenderMessageProps } from '../../../../types';\n\nexport interface ChannelUIProps {\n  isLoading?: boolean;\n  renderPlaceholderLoader?: () => React.ReactElement;\n  renderPlaceholderInvalid?: () => React.ReactElement;\n  renderPlaceholderEmpty?: () => React.ReactElement;\n  renderChannelHeader?: () => React.ReactElement;\n  renderMessage?: (props: RenderMessageProps) => React.ReactElement;\n  renderMessageInput?: () => React.ReactElement;\n  renderFileUploadIcon?: () => React.ReactElement;\n  renderVoiceMessageIcon?: () => React.ReactElement;\n  renderSendMessageIcon?: () => React.ReactElement;\n  renderTypingIndicator?: () => React.ReactElement;\n  renderCustomSeparator?: (props: RenderCustomSeparatorProps) => React.ReactElement;\n}\n\nconst ChannelUI: React.FC<ChannelUIProps> = ({\n  isLoading,\n  renderPlaceholderLoader,\n  renderPlaceholderInvalid,\n  renderPlaceholderEmpty,\n  renderChannelHeader,\n  renderMessage,\n  renderMessageInput,\n  renderTypingIndicator,\n  renderCustomSeparator,\n  renderFileUploadIcon,\n  renderVoiceMessageIcon,\n  renderSendMessageIcon,\n}: ChannelUIProps) => {\n  const {\n    channelUrl,\n    isInvalid,\n  } = useChannelContext();\n\n  const globalStore = useSendbirdStateContext();\n  const sdkError = globalStore?.stores?.sdkStore?.error;\n  const logger = globalStore?.config?.logger;\n  const isOnline = globalStore?.config?.isOnline;\n\n  if (isLoading) {\n    return (<div className=\"sendbird-conversation\">\n      {\n        renderPlaceholderLoader?.() || (\n          <PlaceHolder type={PlaceHolderTypes.LOADING} />\n        )\n      }\n    </div>);\n  }\n\n  if (!channelUrl) {\n    return (<div className=\"sendbird-conversation\">\n      {\n        renderPlaceholderInvalid?.() || (\n          <PlaceHolder type={PlaceHolderTypes.NO_CHANNELS} />\n        )\n      }\n    </div>);\n  }\n  if (isInvalid) {\n    return (\n      <div className=\"sendbird-conversation\">\n        {\n          renderPlaceholderInvalid?.() || (\n            <PlaceHolder type={PlaceHolderTypes.WRONG} />\n          )\n        }\n      </div>\n    );\n  }\n  if (sdkError) {\n    return (\n      <div className=\"sendbird-conversation\">\n        {\n          renderPlaceholderInvalid?.() || (\n            <PlaceHolder\n              type={PlaceHolderTypes.WRONG}\n              retryToConnect={() => {\n                logger.info('Channel: reconnecting');\n                // reconnect();\n              }}\n            />\n          )\n        }\n      </div>\n    );\n  }\n  return (\n    <div className='sendbird-conversation'>\n      {renderChannelHeader?.() || (\n        <ChannelHeader className=\"sendbird-conversation__channel-header\" />\n      )}\n      <MessageList\n        className=\"sendbird-conversation__message-list\"\n        renderMessage={renderMessage}\n        renderPlaceholderEmpty={renderPlaceholderEmpty}\n        renderCustomSeparator={renderCustomSeparator}\n        renderPlaceholderLoader={renderPlaceholderLoader}\n      />\n      <div className=\"sendbird-conversation__footer\">\n        {\n          renderMessageInput?.() || (\n            <MessageInputWrapper\n              renderFileUploadIcon={renderFileUploadIcon}\n              renderVoiceMessageIcon={renderVoiceMessageIcon}\n              renderSendMessageIcon={renderSendMessageIcon}\n            />\n          )\n        }\n        <div className=\"sendbird-conversation__footer__typing-indicator\">\n          {\n            renderTypingIndicator?.()\n              || globalStore?.config?.groupChannel?.enableTypingIndicator && (\n                <TypingIndicator />\n              )\n          }\n          {\n            !isOnline && (\n              <ConnectionStatus />\n            )\n          }\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default ChannelUI;\n"],"names":["ChannelUI","_ref","_globalStore$stores","_globalStore$stores$s","_globalStore$config","_globalStore$config2","_globalStore$config3","_globalStore$config3$","isLoading","renderPlaceholderLoader","renderPlaceholderInvalid","renderPlaceholderEmpty","renderChannelHeader","renderMessage","renderMessageInput","renderTypingIndicator","renderCustomSeparator","renderFileUploadIcon","renderVoiceMessageIcon","renderSendMessageIcon","channelUrl","isInvalid","useChannelContext","globalStore","useSendbirdStateContext","sdkError","stores","sdkStore","error","logger","config","isOnline","React","createElement","className","PlaceHolder","type","PlaceHolderTypes","LOADING","NO_CHANNELS","WRONG","retryToConnect","info","ChannelHeader","MessageList","MessageInputWrapper","groupChannel","enableTypingIndicator","TypingIndicator","ConnectionStatus"],"mappings":"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"}

package/cjs/Channel/components/FileViewer.js

@@ -5,49 +5,49 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 var reactDom = require('react-dom');
 var ui_Avatar = require('../../ui/Avatar.js');
-var ui_Label = require('../../index-bdd889a2.js');
+var ui_Label = require('../../index-6cb0d040.js');
 var ui_Icon = require('../../ui/Icon.js');
-var index$1 = require('../../index-08d232f8.js');
-var index = require('../../index-b3371ef2.js');
+var index$1 = require('../../index-f570d25c.js');
+var index = require('../../index-5231fde8.js');
 var useSendbirdStateContext = require('../../useSendbirdStateContext.js');
-var Channel_context = require('../../ChannelProvider-1e08a7a9.js');
-require('../../tslib.es6-5a7eb30d.js');
+var Channel_context = require('../../ChannelProvider-0df75472.js');
 require('../../ui/ImageRenderer.js');
-require('../../uuid-a9006ea2.js');
+require('../../uuid-12b01f73.js');
 require('prop-types');
-require('../../stringSet-60660a99.js');
+require('../../stringSet-106da549.js');
+require('../../_rollupPluginBabelHelpers-c89f311a.js');
 require('../../utils/message/getOutgoingMessageState.js');
 require('../../withSendbird.js');
-require('../../_rollupPluginBabelHelpers-bd6baf0a.js');
-require('../../UserProfileContext-0808e413.js');
-require('../../index-5ea12b7a.js');
-require('../../index-48d85d8f.js');
-require('../../topics-f3f74edc.js');
-require('../../compareIds-d0c02eca.js');
-require('../../const-beb25e10.js');
+require('../../UserProfileContext-87580795.js');
+require('../../const-a85f3364.js');
+require('../../index-869e9a94.js');
+require('../../index-016f7106.js');
+require('../../topics-b384e6b3.js');
+require('../../compareIds-ccccfe86.js');
 require('@sendbird/chat/groupChannel');
 require('@sendbird/chat/message');
-require('../../ui/ContextMenu.js');
-require('../../ui/SortByRow.js');
-require('../../ui/ReactionButton.js');
+require('../../consts-5e0f96b3.js');
+require('../../resolvedReplyType-67e78c63.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var FileViewerComponent = function (_a) {
-  var // sender
-  profileUrl = _a.profileUrl,
-      nickname = _a.nickname,
-      // file
-  name = _a.name,
-      type = _a.type,
-      url = _a.url,
-      // others
-  isByMe = _a.isByMe,
-      onCancel = _a.onCancel,
-      onDelete = _a.onDelete,
-      disableDelete = _a.disableDelete;
+const FileViewerComponent = _ref => {
+  let {
+    // sender
+    profileUrl,
+    nickname,
+    // file
+    name,
+    type,
+    url,
+    // others
+    isByMe,
+    onCancel,
+    onDelete,
+    disableDelete
+  } = _ref;
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-fileviewer"
   }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -90,7 +90,7 @@ var FileViewerComponent = function (_a) {
     fillColor: disableDelete ? ui_Icon.IconColors.GRAY : ui_Icon.IconColors.ON_BACKGROUND_1,
     height: "24px",
     width: "24px",
-    onClick: function () {
+    onClick: () => {
       if (!disableDelete) {
         onDelete();
       }
@@ -122,25 +122,29 @@ var FileViewerComponent = function (_a) {
     color: ui_Label.LabelColors.ONBACKGROUND_1
   }, "Unsupoprted message"))));
 };
-
-var FileViewer = function (_a) {
-  var _b, _c, _d;
-
-  var onCancel = _a.onCancel,
-      message = _a.message;
-  var deleteMessage = Channel_context.useChannelContext().deleteMessage;
-  var sender = message.sender,
-      type = message.type,
-      url = message.url,
-      _e = message.name,
-      name = _e === void 0 ? '' : _e,
-      threadInfo = message.threadInfo;
-  var user = (_c = (_b = useSendbirdStateContext()) === null || _b === void 0 ? void 0 : _b.config) === null || _c === void 0 ? void 0 : _c.userId;
-  var isByMe = user === ((_d = message === null || message === void 0 ? void 0 : message.sender) === null || _d === void 0 ? void 0 : _d.userId);
-  var disableDelete = (threadInfo === null || threadInfo === void 0 ? void 0 : threadInfo.replyCount) > 0;
-  var profileUrl = sender.profileUrl,
-      _f = sender.nickname,
-      nickname = _f === void 0 ? '' : _f;
+const FileViewer = _ref2 => {
+  var _useSendbirdStateCont, _useSendbirdStateCont2, _message$sender;
+  let {
+    onCancel,
+    message
+  } = _ref2;
+  const {
+    deleteMessage
+  } = Channel_context.useChannelContext();
+  const {
+    sender,
+    type,
+    url,
+    name = '',
+    threadInfo
+  } = message;
+  const user = (_useSendbirdStateCont = useSendbirdStateContext()) === null || _useSendbirdStateCont === void 0 ? void 0 : (_useSendbirdStateCont2 = _useSendbirdStateCont.config) === null || _useSendbirdStateCont2 === void 0 ? void 0 : _useSendbirdStateCont2.userId;
+  const isByMe = user === (message === null || message === void 0 ? void 0 : (_message$sender = message.sender) === null || _message$sender === void 0 ? void 0 : _message$sender.userId);
+  const disableDelete = (threadInfo === null || threadInfo === void 0 ? void 0 : threadInfo.replyCount) > 0;
+  const {
+    profileUrl,
+    nickname = ''
+  } = sender;
   return /*#__PURE__*/reactDom.createPortal( /*#__PURE__*/React__default["default"].createElement(FileViewerComponent, {
     profileUrl: profileUrl,
     nickname: nickname,
@@ -148,8 +152,8 @@ var FileViewer = function (_a) {
     url: url,
     name: name,
     onCancel: onCancel,
-    onDelete: function () {
-      deleteMessage(message).then(function () {
+    onDelete: () => {
+      deleteMessage(message).then(() => {
         onCancel();
       });
     },

package/cjs/Channel/components/FileViewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"FileViewer.js","sources":["../../../../src/smart-components/Channel/components/FileViewer/index.tsx"],"sourcesContent":["import React from 'react';\nimport { createPortal } from 'react-dom';\nimport type { FileMessage } from '@sendbird/chat/message';\n\nimport './file-viewer.scss';\nimport Avatar from '../../../../ui/Avatar';\nimport Label, { LabelTypography, LabelColors } from '../../../../ui/Label';\nimport Icon, { IconColors, IconTypes } from '../../../../ui/Icon';\nimport { MODAL_ROOT } from '../../../../hooks/useModal/ModalRoot';\n\nimport { isImage, isVideo, isSupportedFileView } from '../../../../utils';\nimport useSendbirdStateContext from '../../../../hooks/useSendbirdStateContext';\nimport { useChannelContext } from '../../context/ChannelProvider';\nimport { EveryMessage } from '../../../../types';\n\ntype FileViewerUIProps = {\n  profileUrl: string;\n  nickname: string;\n  // file\n  name: string;\n  type: string;\n  url: string;\n  // others\n  isByMe: boolean;\n  onCancel: () => void;\n  onDelete: () => void;\n  disableDelete: boolean;\n};\n\nexport const FileViewerComponent: React.FC<FileViewerUIProps> = ({\n  // sender\n  profileUrl,\n  nickname,\n  // file\n  name,\n  type,\n  url,\n  // others\n  isByMe,\n  onCancel,\n  onDelete,\n  disableDelete,\n}: FileViewerUIProps) => (\n  <div className=\"sendbird-fileviewer\">\n    <div className=\"sendbird-fileviewer__header\">\n      <div className=\"sendbird-fileviewer__header__left\">\n        <div className=\"sendbird-fileviewer__header__left__avatar\">\n          <Avatar height=\"32px\" width=\"32px\" src={profileUrl} />\n        </div>\n        <Label\n          className=\"sendbird-fileviewer__header__left__filename\"\n          type={LabelTypography.H_2}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {name}\n        </Label>\n        <Label\n          className=\"sendbird-fileviewer__header__left__sender-name\"\n          type={LabelTypography.BODY_1}\n          color={LabelColors.ONBACKGROUND_2}\n        >\n          {nickname}\n        </Label>\n      </div>\n      <div className=\"sendbird-fileviewer__header__right\">\n        {\n          isSupportedFileView(type) && (\n            <div className=\"sendbird-fileviewer__header__right__actions\">\n              <a\n                className=\"sendbird-fileviewer__header__right__actions__download\"\n                rel=\"noopener noreferrer\"\n                href={url}\n                target=\"_blank\"\n              >\n                <Icon\n                  type={IconTypes.DOWNLOAD}\n                  fillColor={IconColors.ON_BACKGROUND_1}\n                  height=\"24px\"\n                  width=\"24px\"\n                />\n              </a>\n              {\n                onDelete && isByMe && (\n                  <div className=\"sendbird-fileviewer__header__right__actions__delete\">\n                    <Icon\n                      className={disableDelete ? 'disabled' : ''}\n                      type={IconTypes.DELETE}\n                      fillColor={disableDelete ? IconColors.GRAY : IconColors.ON_BACKGROUND_1}\n                      height=\"24px\"\n                      width=\"24px\"\n                      onClick={() => { if (!disableDelete) { onDelete(); } }}\n                    />\n                  </div>\n                )\n              }\n            </div>\n          )\n        }\n        <div className=\"sendbird-fileviewer__header__right__actions__close\">\n          <Icon\n            type={IconTypes.CLOSE}\n            fillColor={IconColors.ON_BACKGROUND_1}\n            height=\"24px\"\n            width=\"24px\"\n            onClick={onCancel}\n          />\n        </div>\n      </div>\n    </div>\n    <div className=\"sendbird-fileviewer__content\">\n      {isVideo(type) && (\n        <video controls className=\"sendbird-fileviewer__content__video\">\n          <source src={url} type={type} />\n        </video>\n      )}\n      {\n        isImage(type) && (\n          <img\n            src={url}\n            alt={name}\n            className=\"sendbird-fileviewer__content__img\"\n          />\n        )\n      }\n      {\n        !isSupportedFileView(type) && (\n          <div className=\"sendbird-fileviewer__content__unsupported\">\n            <Label type={LabelTypography.H_1} color={LabelColors.ONBACKGROUND_1}>\n              Unsupoprted message\n            </Label>\n          </div>\n        )\n      }\n    </div>\n  </div>\n);\n\ntype FileViewerProps = {\n  onCancel:() => void;\n  message: FileMessage;\n};\n\nconst FileViewer: React.FC<FileViewerProps> = ({ onCancel, message }: FileViewerProps) => {\n  const { deleteMessage } = useChannelContext();\n  const {\n    sender,\n    type,\n    url,\n    name = '',\n    threadInfo,\n  } = message;\n  const user = useSendbirdStateContext()?.config?.userId;\n  const isByMe = user === message?.sender?.userId;\n  const disableDelete = threadInfo?.replyCount > 0;\n  const { profileUrl, nickname = '' } = sender;\n  return createPortal(\n    (\n      <FileViewerComponent\n        profileUrl={profileUrl}\n        nickname={nickname}\n        type={type}\n        url={url}\n        name={name}\n        onCancel={onCancel}\n        onDelete={() => {\n          deleteMessage(message as EveryMessage).then(() => {\n            onCancel();\n          });\n        }}\n        isByMe={isByMe}\n        disableDelete={disableDelete}\n      />\n    ),\n    document.getElementById(MODAL_ROOT),\n  );\n}\n\nexport default FileViewer;\n"],"names":["FileViewerComponent","_a","profileUrl","nickname","name","type","url","isByMe","onCancel","onDelete","disableDelete","React","Avatar","Label","LabelTypography","H_2","LabelColors","ONBACKGROUND_1","BODY_1","ONBACKGROUND_2","isSupportedFileView","Icon","IconTypes","DOWNLOAD","IconColors","ON_BACKGROUND_1","DELETE","GRAY","CLOSE","isVideo","isImage","H_1","FileViewer","message","deleteMessage","useChannelContext","sender","_e","threadInfo","user","_c","_b","useSendbirdStateContext","config","userId","_d","replyCount","_f","createPortal","then","document","getElementById","MODAL_ROOT"],"mappings":"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"}
+{"version":3,"file":"FileViewer.js","sources":["../../../../src/modules/Channel/components/FileViewer/index.tsx"],"sourcesContent":["import React from 'react';\nimport { createPortal } from 'react-dom';\nimport type { FileMessage } from '@sendbird/chat/message';\n\nimport './file-viewer.scss';\nimport Avatar from '../../../../ui/Avatar';\nimport Label, { LabelTypography, LabelColors } from '../../../../ui/Label';\nimport Icon, { IconColors, IconTypes } from '../../../../ui/Icon';\nimport { MODAL_ROOT } from '../../../../hooks/useModal/ModalRoot';\n\nimport { isImage, isVideo, isSupportedFileView } from '../../../../utils';\nimport useSendbirdStateContext from '../../../../hooks/useSendbirdStateContext';\nimport { useChannelContext } from '../../context/ChannelProvider';\nimport { EveryMessage } from '../../../../types';\n\ntype FileViewerUIProps = {\n  profileUrl: string;\n  nickname: string;\n  // file\n  name: string;\n  type: string;\n  url: string;\n  // others\n  isByMe: boolean;\n  onCancel: () => void;\n  onDelete: () => void;\n  disableDelete: boolean;\n};\n\nexport const FileViewerComponent: React.FC<FileViewerUIProps> = ({\n  // sender\n  profileUrl,\n  nickname,\n  // file\n  name,\n  type,\n  url,\n  // others\n  isByMe,\n  onCancel,\n  onDelete,\n  disableDelete,\n}: FileViewerUIProps) => (\n  <div className=\"sendbird-fileviewer\">\n    <div className=\"sendbird-fileviewer__header\">\n      <div className=\"sendbird-fileviewer__header__left\">\n        <div className=\"sendbird-fileviewer__header__left__avatar\">\n          <Avatar height=\"32px\" width=\"32px\" src={profileUrl} />\n        </div>\n        <Label\n          className=\"sendbird-fileviewer__header__left__filename\"\n          type={LabelTypography.H_2}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {name}\n        </Label>\n        <Label\n          className=\"sendbird-fileviewer__header__left__sender-name\"\n          type={LabelTypography.BODY_1}\n          color={LabelColors.ONBACKGROUND_2}\n        >\n          {nickname}\n        </Label>\n      </div>\n      <div className=\"sendbird-fileviewer__header__right\">\n        {\n          isSupportedFileView(type) && (\n            <div className=\"sendbird-fileviewer__header__right__actions\">\n              <a\n                className=\"sendbird-fileviewer__header__right__actions__download\"\n                rel=\"noopener noreferrer\"\n                href={url}\n                target=\"_blank\"\n              >\n                <Icon\n                  type={IconTypes.DOWNLOAD}\n                  fillColor={IconColors.ON_BACKGROUND_1}\n                  height=\"24px\"\n                  width=\"24px\"\n                />\n              </a>\n              {\n                onDelete && isByMe && (\n                  <div className=\"sendbird-fileviewer__header__right__actions__delete\">\n                    <Icon\n                      className={disableDelete ? 'disabled' : ''}\n                      type={IconTypes.DELETE}\n                      fillColor={disableDelete ? IconColors.GRAY : IconColors.ON_BACKGROUND_1}\n                      height=\"24px\"\n                      width=\"24px\"\n                      onClick={() => { if (!disableDelete) { onDelete(); } }}\n                    />\n                  </div>\n                )\n              }\n            </div>\n          )\n        }\n        <div className=\"sendbird-fileviewer__header__right__actions__close\">\n          <Icon\n            type={IconTypes.CLOSE}\n            fillColor={IconColors.ON_BACKGROUND_1}\n            height=\"24px\"\n            width=\"24px\"\n            onClick={onCancel}\n          />\n        </div>\n      </div>\n    </div>\n    <div className=\"sendbird-fileviewer__content\">\n      {isVideo(type) && (\n        <video controls className=\"sendbird-fileviewer__content__video\">\n          <source src={url} type={type} />\n        </video>\n      )}\n      {\n        isImage(type) && (\n          <img\n            src={url}\n            alt={name}\n            className=\"sendbird-fileviewer__content__img\"\n          />\n        )\n      }\n      {\n        !isSupportedFileView(type) && (\n          <div className=\"sendbird-fileviewer__content__unsupported\">\n            <Label type={LabelTypography.H_1} color={LabelColors.ONBACKGROUND_1}>\n              Unsupoprted message\n            </Label>\n          </div>\n        )\n      }\n    </div>\n  </div>\n);\n\ntype FileViewerProps = {\n  onCancel:() => void;\n  message: FileMessage;\n};\n\nconst FileViewer: React.FC<FileViewerProps> = ({ onCancel, message }: FileViewerProps) => {\n  const { deleteMessage } = useChannelContext();\n  const {\n    sender,\n    type,\n    url,\n    name = '',\n    threadInfo,\n  } = message;\n  const user = useSendbirdStateContext()?.config?.userId;\n  const isByMe = user === message?.sender?.userId;\n  const disableDelete = threadInfo?.replyCount > 0;\n  const { profileUrl, nickname = '' } = sender;\n  return createPortal(\n    (\n      <FileViewerComponent\n        profileUrl={profileUrl}\n        nickname={nickname}\n        type={type}\n        url={url}\n        name={name}\n        onCancel={onCancel}\n        onDelete={() => {\n          deleteMessage(message as EveryMessage).then(() => {\n            onCancel();\n          });\n        }}\n        isByMe={isByMe}\n        disableDelete={disableDelete}\n      />\n    ),\n    document.getElementById(MODAL_ROOT),\n  );\n};\n\nexport default FileViewer;\n"],"names":["FileViewerComponent","_ref","profileUrl","nickname","name","type","url","isByMe","onCancel","onDelete","disableDelete","React","createElement","className","Avatar","height","width","src","Label","LabelTypography","H_2","color","LabelColors","ONBACKGROUND_1","BODY_1","ONBACKGROUND_2","isSupportedFileView","rel","href","target","Icon","IconTypes","DOWNLOAD","fillColor","IconColors","ON_BACKGROUND_1","DELETE","GRAY","onClick","CLOSE","isVideo","controls","isImage","alt","H_1","FileViewer","_ref2","_useSendbirdStateCont","_useSendbirdStateCont2","_message$sender","message","deleteMessage","useChannelContext","sender","threadInfo","user","useSendbirdStateContext","config","userId","replyCount","createPortal","then","document","getElementById","MODAL_ROOT"],"mappings":"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"}

package/cjs/Channel/components/FrozenNotification.js

@@ -1,20 +1,25 @@
 'use strict';
 
 var React = require('react');
-var LocalizationContext = require('../../LocalizationContext-8780a64e.js');
-var ui_Label = require('../../index-bdd889a2.js');
-require('../../stringSet-60660a99.js');
-require('../../index-48d85d8f.js');
+var LocalizationContext = require('../../LocalizationContext-0e429c3d.js');
+var ui_Label = require('../../index-6cb0d040.js');
+require('../../stringSet-106da549.js');
+require('../../index-016f7106.js');
 require('prop-types');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var FrozenNotification = function () {
-  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
+const FrozenNotification = _ref => {
+  let {
+    className = ''
+  } = _ref;
+  const {
+    stringSet
+  } = React.useContext(LocalizationContext.LocalizationContext);
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "sendbird-notification sendbird-notification--frozen"
+    className: `sendbird-notification sendbird-notification--frozen ${className}`
   }, /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
     className: "sendbird-notification__text",
     type: ui_Label.LabelTypography.CAPTION_2