@sendbird/uikit-react 3.5.0-beta.0 → 3.5.0-mobile-web-0

package/cjs/ui/OGMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"OGMessageItemBody.js","sources":["../../../src/ui/OGMessageItemBody/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement, useContext, useMemo } from 'react';\nimport type { UserMessage } from '@sendbird/chat/message';\n\nimport Word from '../Word';\nimport ImageRenderer from '../ImageRenderer';\nimport Icon, { IconTypes } from '../Icon';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport uuidv4 from '../../utils/uuid';\nimport { getClassName, isEditedMessage } from '../../utils';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: UserMessage;\n  isByMe?: boolean;\n  mouseHover?: boolean;\n  isMentionEnabled?: boolean;\n  isReactionEnabled?: boolean;\n}\n\nexport default function OGMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isMentionEnabled = false,\n  isReactionEnabled = false,\n}: Props): ReactElement {\n  const { stringSet } = useContext(LocalizationContext);\n  const openOGUrl = (): void => {\n    if (message?.ogMetaData?.url) window.open(message?.ogMetaData?.url);\n  };\n  const isMessageMentioned = isMentionEnabled && message?.mentionedMessageTemplate?.length > 0 && message?.mentionedUsers?.length > 0;\n  const sentences: Array<Array<string>> = useMemo(() => {\n    if (isMessageMentioned) {\n      return message?.mentionedMessageTemplate?.split(/\\n/).map((sentence) => sentence.split(/\\s/));\n    }\n    return message?.message?.split(/\\n/).map((sentence) => sentence.split(/\\s/));\n  }, [message?.mentionedMessageTemplate]);\n  return (\n    <div className={getClassName([\n      className,\n      'sendbird-og-message-item-body',\n      isByMe ? 'outgoing' : 'incoming',\n      mouseHover ? 'mouse-hover' : '',\n      (isReactionEnabled && message?.reactions?.length > 0) ? 'reactions' : '',\n    ])}>\n      <Label\n        key={uuidv4()}\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n      >\n        <div className=\"sendbird-og-message-item-body__text-bubble\">\n          {\n            sentences?.map((sentence, index) => {\n              return [\n                sentence?.map((word) => {\n                  return (\n                    <Word\n                      key={uuidv4()}\n                      word={word}\n                      message={message}\n                      isByMe={isByMe}\n                    />\n                  );\n                }),\n                sentences?.[index + 1] ? <br /> : null,\n              ]\n            })\n          }\n          {\n            isEditedMessage(message) && (\n              <Label\n                className=\"sendbird-og-message-item-body__text-bubble__message\"\n                type={LabelTypography.BODY_1}\n                color={isByMe ? LabelColors.ONCONTENT_2 : LabelColors.ONBACKGROUND_2}\n              >\n                {` ${stringSet.MESSAGE_EDITED} `}\n              </Label>\n            )\n          }\n        </div>\n      </Label>\n      <div\n        className=\"sendbird-og-message-item-body__og-thumbnail\"\n        onClick={openOGUrl}\n      >\n        <ImageRenderer\n          className=\"sendbird-og-message-item-body__og-thumbnail__image\"\n          url={message?.ogMetaData?.defaultImage?.url || ''}\n          alt={message?.ogMetaData?.defaultImage?.alt}\n          // TODO: Change fixing width and height lengths\n          defaultComponent={(\n            <div className=\"sendbird-og-message-item-body__og-thumbnail__place-holder\">\n              <Icon\n                className=\"sendbird-og-message-item-body__og-thumbnail__place-holder__icon\"\n                type={IconTypes.THUMBNAIL_NONE}\n                width=\"56px\"\n                height=\"56px\"\n              />\n            </div>\n          )}\n        />\n      </div>\n      <div\n        className=\"sendbird-og-message-item-body__description\"\n        onClick={openOGUrl}\n      >\n        {message?.ogMetaData?.title && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__title\"\n            type={LabelTypography.SUBTITLE_2}\n            color={LabelColors.ONBACKGROUND_1}\n          >\n            {message.ogMetaData.title}\n          </Label>\n        )}\n        {message?.ogMetaData?.description && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__description\"\n            type={LabelTypography.BODY_2}\n            color={LabelColors.ONBACKGROUND_1}\n          >\n            {message.ogMetaData.description}\n          </Label>\n        )}\n        {message?.ogMetaData?.url && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__url\"\n            type={LabelTypography.CAPTION_3}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            {message.ogMetaData.url}\n          </Label>\n        )}\n      </div>\n      <div className=\"sendbird-og-message-item-body__cover\" />\n    </div>\n  );\n}\n"],"names":["OGMessageItemBody","_a","className","message","_m","isByMe","_o","mouseHover","_p","isMentionEnabled","_q","isReactionEnabled","stringSet","useContext","LocalizationContext","openOGUrl","ogMetaData","url","window","open","_b","isMessageMentioned","mentionedMessageTemplate","length","_c","mentionedUsers","sentences","useMemo","split","map","sentence","React","getClassName","_d","reactions","Label","uuidv4","LabelTypography","BODY_1","LabelColors","ONCONTENT_1","ONBACKGROUND_1","index","word","Word","isEditedMessage","ONCONTENT_2","ONBACKGROUND_2","concat","MESSAGE_EDITED","ImageRenderer","_f","_e","defaultImage","_g","_h","alt","Icon","IconTypes","THUMBNAIL_NONE","_j","title","SUBTITLE_2","_k","description","BODY_2","_l","CAPTION_3"],"mappings":"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"}
+{"version":3,"file":"OGMessageItemBody.js","sources":["../../../src/ui/OGMessageItemBody/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, {\n  ReactElement,\n  useContext,\n  useMemo,\n  useRef,\n} from 'react';\nimport type { UserMessage } from '@sendbird/chat/message';\n\nimport ImageRenderer from '../ImageRenderer';\nimport Icon, { IconTypes } from '../Icon';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { getClassName, isEditedMessage } from '../../utils';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport TextFragment from '../../modules/Message/components/TextFragment';\nimport { tokenizeMessage } from '../../modules/Message/utils/tokens/tokenize';\nimport { OG_MESSAGE_BODY_CLASSNAME } from './consts';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: UserMessage;\n  isByMe?: boolean;\n  mouseHover?: boolean;\n  isMentionEnabled?: boolean;\n  isReactionEnabled?: boolean;\n  onMessageHeightChange?: () => void;\n}\n\nexport default function OGMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isMentionEnabled = false,\n  isReactionEnabled = false,\n  onMessageHeightChange = () => { /* noop */ },\n}: Props): ReactElement {\n  const imageRef = useRef<HTMLDivElement>(null);\n  const { stringSet } = useContext(LocalizationContext);\n  const openOGUrl = (): void => {\n    if (message?.ogMetaData?.url) window.open(message?.ogMetaData?.url);\n  };\n  const isMessageMentioned = isMentionEnabled && message?.mentionedMessageTemplate?.length > 0 && message?.mentionedUsers?.length > 0;\n  const tokens = useMemo(() => {\n    if (isMessageMentioned) {\n      return tokenizeMessage({\n        mentionedUsers: message?.mentionedUsers,\n        messageText: message?.mentionedMessageTemplate,\n      });\n    }\n    return tokenizeMessage({\n      messageText: message?.message,\n    });\n  }, [message?.updatedAt]);\n  return (\n    <div className={getClassName([\n      className,\n      'sendbird-og-message-item-body',\n      isByMe ? 'outgoing' : 'incoming',\n      mouseHover ? 'mouse-hover' : '',\n      (isReactionEnabled && message?.reactions?.length > 0) ? 'reactions' : '',\n    ])}>\n      <Label\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n      >\n        <div className={OG_MESSAGE_BODY_CLASSNAME}>\n          <TextFragment tokens={tokens} />\n          {\n            isEditedMessage(message) && (\n              <Label\n                className=\"sendbird-og-message-item-body__text-bubble__message\"\n                type={LabelTypography.BODY_1}\n                color={isByMe ? LabelColors.ONCONTENT_2 : LabelColors.ONBACKGROUND_2}\n              >\n                {` ${stringSet.MESSAGE_EDITED} `}\n              </Label>\n            )\n          }\n        </div>\n      </Label>\n      <div\n        ref={imageRef}\n        className={`sendbird-og-message-item-body__og-thumbnail\n          ${message?.ogMetaData?.defaultImage?.url ? '' : 'sendbird-og-message-item-body__og-thumbnail__empty'}\n        `}\n        onClick={openOGUrl}\n      >\n        <ImageRenderer\n          onLoad={onMessageHeightChange}\n          onError={() => {\n            try {\n              imageRef?.current?.classList?.add('sendbird-og-message-item-body__og-thumbnail__empty');\n            } catch (error) {\n              // do nothing\n            }\n          }}\n          className=\"sendbird-og-message-item-body__og-thumbnail__image\"\n          url={message?.ogMetaData?.defaultImage?.url || ''}\n          alt={message?.ogMetaData?.defaultImage?.alt}\n          // TODO: Change fixing width and height lengths\n          defaultComponent={(\n            <div className=\"sendbird-og-message-item-body__og-thumbnail__place-holder\">\n              <Icon\n                className=\"sendbird-og-message-item-body__og-thumbnail__place-holder__icon\"\n                type={IconTypes.THUMBNAIL_NONE}\n                width=\"56px\"\n                height=\"56px\"\n              />\n            </div>\n          )}\n        />\n      </div>\n      <div\n        className=\"sendbird-og-message-item-body__description\"\n        onClick={openOGUrl}\n      >\n        {message?.ogMetaData?.title && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__title\"\n            type={LabelTypography.SUBTITLE_2}\n            color={LabelColors.ONBACKGROUND_1}\n          >\n            {message.ogMetaData.title}\n          </Label>\n        )}\n        {message?.ogMetaData?.description && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__description\"\n            type={LabelTypography.BODY_2}\n            color={LabelColors.ONBACKGROUND_1}\n          >\n            {message.ogMetaData.description}\n          </Label>\n        )}\n        {message?.ogMetaData?.url && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__url\"\n            type={LabelTypography.CAPTION_3}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            {message.ogMetaData.url}\n          </Label>\n        )}\n      </div>\n      <div className=\"sendbird-og-message-item-body__cover\" />\n    </div>\n  );\n}\n"],"names":["OGMessageItemBody","_ref","_message$mentionedMes","_message$mentionedUse","_message$reactions","_message$ogMetaData3","_message$ogMetaData3$","_message$ogMetaData4","_message$ogMetaData4$","_message$ogMetaData5","_message$ogMetaData5$","_message$ogMetaData6","_message$ogMetaData7","_message$ogMetaData8","className","message","isByMe","mouseHover","isMentionEnabled","isReactionEnabled","onMessageHeightChange","imageRef","useRef","stringSet","useContext","LocalizationContext","openOGUrl","_message$ogMetaData","_message$ogMetaData2","ogMetaData","url","window","open","isMessageMentioned","mentionedMessageTemplate","length","mentionedUsers","tokens","useMemo","tokenizeMessage","messageText","updatedAt","React","createElement","getClassName","reactions","Label","type","LabelTypography","BODY_1","color","LabelColors","ONCONTENT_1","ONBACKGROUND_1","OG_MESSAGE_BODY_CLASSNAME","TextFragment","isEditedMessage","ONCONTENT_2","ONBACKGROUND_2","MESSAGE_EDITED","ref","defaultImage","onClick","ImageRenderer","onLoad","onError","_imageRef$current","_imageRef$current$cla","current","classList","add","error","alt","defaultComponent","Icon","IconTypes","THUMBNAIL_NONE","width","height","title","SUBTITLE_2","description","BODY_2","CAPTION_3"],"mappings":"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"}

package/cjs/ui/OpenChannelAdminMessage.js

@@ -1,20 +1,21 @@
 'use strict';
 
-var tslib_es6 = require('../tslib.es6-43854eb1.js');
 var React = require('react');
-var ui_Label = require('../index-d6ef2a60.js');
+var ui_Label = require('../index-44186883.js');
 require('prop-types');
-require('../stringSet-91b919f6.js');
+require('../stringSet-d1cee26a.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function OpenChannelAdminMessage(_a) {
-  var className = _a.className,
-      message = _a.message;
+function OpenChannelAdminMessage(_ref) {
+  let {
+    className,
+    message
+  } = _ref;
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: tslib_es6.__spreadArray(tslib_es6.__spreadArray([], Array.isArray(className) ? className : [className], true), ['sendbird-openchannel-admin-message'], false).join(' ')
+    className: [...(Array.isArray(className) ? className : [className]), 'sendbird-openchannel-admin-message'].join(' ')
   }, /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
     className: "sendbird-openchannel-admin-message__text",
     type: ui_Label.LabelTypography.CAPTION_2,

package/cjs/ui/OpenChannelAdminMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"OpenChannelAdminMessage.js","sources":["../../../src/ui/OpenChannelAdminMessage/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { AdminMessage } from '@sendbird/chat/message';\nimport './index.scss';\n\nimport Label, { LabelColors, LabelTypography } from '../Label';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: AdminMessage;\n}\n\nexport default function OpenChannelAdminMessage({\n  className,\n  message,\n}: Props): ReactElement {\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-openchannel-admin-message',\n      ].join(' ')}\n    >\n      <Label\n        className=\"sendbird-openchannel-admin-message__text\"\n        type={LabelTypography.CAPTION_2}\n        color={LabelColors.ONBACKGROUND_2}\n      >\n        {message.message || ''}\n      </Label>\n    </div>\n  );\n}\n"],"names":["OpenChannelAdminMessage","_a","className","message","React","__spreadArray","Array","isArray","join","Label","LabelTypography","CAPTION_2","LabelColors","ONBACKGROUND_2"],"mappings":";;;;;;;;;;;;AAWwB,SAAAA,uBAAA,CAAwBC,EAAxB,EAGhB;MAFNC,SAAS,GAAAD,EAAA,CAAAC;MACTC,OAAO,GAAAF,EAAA,CAAAE;EAEP,oBACEC,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,SAAS,EAAEC,uBAAA,CAAAA,uBAAA,CAAA,EAAA,EACLC,KAAK,CAACC,OAAN,CAAcL,SAAd,IAA2BA,SAA3B,GAAuC,CAACA,SAAD,CADlC,EAC8C,IAD9C,CAAA,EAC8C,CACvD,oCADuD,CAD9C,EAGT,KAHS,CAAA,CAGTM,IAHS,CAGJ,GAHI,CAAA;AADb,GAAA,eAMEJ,wCAACK,cAAD,EAAA;AACE,IAAA,SAAS,EAAC,0CADZ;IAEE,IAAI,EAAEC,wBAAe,CAACC,SAFxB;IAGE,KAAK,EAAEC,oBAAW,CAACC,cAAAA;AAHrB,GAAA,EAKGV,OAAO,CAACA,OAAR,IAAmB,EALtB,CANF,CADF,CAAA;AAgBD;;;;"}
+{"version":3,"file":"OpenChannelAdminMessage.js","sources":["../../../src/ui/OpenChannelAdminMessage/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { AdminMessage } from '@sendbird/chat/message';\nimport './index.scss';\n\nimport Label, { LabelColors, LabelTypography } from '../Label';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: AdminMessage;\n}\n\nexport default function OpenChannelAdminMessage({\n  className,\n  message,\n}: Props): ReactElement {\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-openchannel-admin-message',\n      ].join(' ')}\n    >\n      <Label\n        className=\"sendbird-openchannel-admin-message__text\"\n        type={LabelTypography.CAPTION_2}\n        color={LabelColors.ONBACKGROUND_2}\n      >\n        {message.message || ''}\n      </Label>\n    </div>\n  );\n}\n"],"names":["OpenChannelAdminMessage","_ref","className","message","React","createElement","Array","isArray","join","Label","type","LabelTypography","CAPTION_2","color","LabelColors","ONBACKGROUND_2"],"mappings":";;;;;;;;;;;AAWe,SAASA,uBAAuBA,CAAAC,IAAA,EAGvB;EAAA,IAHwB;IAC9CC,SAAS;AACTC,IAAAA,OAAAA;AACK,GAAC,GAAAF,IAAA,CAAA;EACN,oBACEG,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACEH,SAAS,EAAE,CACT,IAAII,KAAK,CAACC,OAAO,CAACL,SAAS,CAAC,GAAGA,SAAS,GAAG,CAACA,SAAS,CAAC,CAAC,EACvD,oCAAoC,CACrC,CAACM,IAAI,CAAC,GAAG,CAAA;AAAE,GAAA,eAEZJ,yBAAA,CAAAC,aAAA,CAACI,cAAK,EAAA;AACJP,IAAAA,SAAS,EAAC,0CAA0C;IACpDQ,IAAI,EAAEC,wBAAe,CAACC,SAAU;IAChCC,KAAK,EAAEC,oBAAW,CAACC,cAAAA;AAAe,GAAA,EAEjCZ,OAAO,CAACA,OAAO,IAAI,EAAE,CAChB,CACJ,CAAA;AAEV;;;;"}

package/cjs/ui/OpenChannelAvatar.js

@@ -2,34 +2,35 @@
 
 var React = require('react');
 var ui_Avatar = require('./Avatar.js');
-var LocalizationContext = require('../LocalizationContext-2b3f310d.js');
-var utils = require('../utils-4b529d96.js');
-require('../tslib.es6-43854eb1.js');
+var LocalizationContext = require('../LocalizationContext-461a0816.js');
+var utils = require('../utils-c5d4c36e.js');
 require('./ImageRenderer.js');
 require('./Icon.js');
 require('prop-types');
-require('../uuid-11d4efe8.js');
-require('../stringSet-91b919f6.js');
-require('../index-de151767.js');
+require('../uuid-d86ea01f.js');
+require('../stringSet-d1cee26a.js');
+require('../index-5e6194f8.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function ChannelAvatar(_a) {
-  var channel = _a.channel,
-      theme = _a.theme,
-      _b = _a.height,
-      height = _b === void 0 ? 56 : _b,
-      _c = _a.width,
-      width = _c === void 0 ? 56 : _c;
-  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-  var memoizedAvatar = React.useMemo(function () {
+function ChannelAvatar(_ref) {
+  let {
+    channel,
+    theme,
+    height = 56,
+    width = 56
+  } = _ref;
+  const {
+    stringSet
+  } = React.useContext(LocalizationContext.LocalizationContext);
+  const memoizedAvatar = React.useMemo(() => {
     return /*#__PURE__*/React__default["default"].createElement(ui_Avatar["default"], {
       className: "sendbird-chat-header__avatar--open-channel",
       src: utils.getOpenChannelAvatar(channel),
-      width: "".concat(width, "px"),
-      height: "".concat(height, "px"),
+      width: `${width}px`,
+      height: `${height}px`,
       alt: (channel === null || channel === void 0 ? void 0 : channel.name) || stringSet.OPEN_CHANNEL_SETTINGS__NO_TITLE
     });
   }, [channel === null || channel === void 0 ? void 0 : channel.coverUrl, theme]);

package/cjs/ui/OpenChannelAvatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"OpenChannelAvatar.js","sources":["../../../src/ui/ChannelAvatar/OpenChannelAvatar.tsx"],"sourcesContent":["import React, { useMemo, useContext } from 'react';\nimport type { OpenChannel } from '@sendbird/chat/openChannel';\n\nimport Avatar from '../Avatar/index';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\nimport * as utils from './utils';\n\ninterface Props {\n  channel: OpenChannel;\n  theme: string;\n  height?: number;\n  width?: number;\n}\n\nfunction ChannelAvatar({\n  channel,\n  theme,\n  height = 56,\n  width = 56,\n}: Props): JSX.Element{\n  const { stringSet } = useContext(LocalizationContext);\n  const memoizedAvatar = useMemo(() => {\n    return (\n      <Avatar\n        className=\"sendbird-chat-header__avatar--open-channel\"\n        src={utils.getOpenChannelAvatar(channel)}\n        width={`${width}px`}\n        height={`${height}px`}\n        alt={channel?.name || stringSet.OPEN_CHANNEL_SETTINGS__NO_TITLE}\n      />\n    );\n  }, [channel?.coverUrl, theme]);\n  return (\n    <>{ memoizedAvatar }</>\n  );\n}\n\nexport default ChannelAvatar;\n"],"names":["ChannelAvatar","_a","channel","theme","_b","height","_c","width","stringSet","useContext","LocalizationContext","memoizedAvatar","useMemo","React","Avatar","utils","concat","name","OPEN_CHANNEL_SETTINGS__NO_TITLE","coverUrl"],"mappings":";;;;;;;;;;;;;;;;;;AAeA,SAASA,aAAT,CAAuBC,EAAvB,EAKQ;AAJN,EAAA,IAAAC,OAAO,aAAP;AAAA,MACAC,KAAK,GAAAF,EAAA,CAAAE,KADL;AAAA,MAEAC,cAFA;MAEAC,MAAM,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,KAFT;AAAA,MAGAE,EAAA,GAAAL,EAAA,CAAAM,KAHA;MAGAA,KAAK,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,EAAH,GAAKA,EAHV,CAAA;AAKQ,EAAA,IAAAE,SAAS,GAAKC,gBAAU,CAACC,uCAAD,CAAV,UAAd,CAAA;AACR,EAAA,IAAMC,cAAc,GAAGC,aAAO,CAAC,YAAA;AAC7B,IAAA,oBACEC,wCAACC,oBAAD,EAAA;AACE,MAAA,SAAS,EAAC,4CADZ;AAEE,MAAA,GAAG,EAAEC,0BAAA,CAA2Bb,OAA3B,CAFP;AAGE,MAAA,KAAK,EAAE,EAAGc,CAAAA,MAAH,CAAGT,KAAH,EAAY,IAAZ,CAHT;AAIE,MAAA,MAAM,EAAE,EAAAS,CAAAA,MAAA,CAAGX,MAAH,EAAS,IAAT,CAJV;AAKE,MAAA,GAAG,EAAE,CAAAH,OAAO,SAAP,IAAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAAA,OAAO,CAAEe,IAAT,KAAiBT,SAAS,CAACU,+BAAAA;KANpC,CAAA,CAAA;GAD4B,EAU3B,CAAChB,OAAO,KAAA,IAAP,IAAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAAA,OAAO,CAAEiB,QAAV,EAAoBhB,KAApB,CAV2B,CAA9B,CAAA;EAWA,oBACEU,yBAAA,CAAA,aAAA,CAAAA,yBAAA,CAAA,QAAA,EAAA,IAAA,EAAIF,cAAJ,CADF,CAAA;AAGD;;;;"}
+{"version":3,"file":"OpenChannelAvatar.js","sources":["../../../src/ui/ChannelAvatar/OpenChannelAvatar.tsx"],"sourcesContent":["import React, { useMemo, useContext } from 'react';\nimport type { OpenChannel } from '@sendbird/chat/openChannel';\n\nimport Avatar from '../Avatar/index';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\nimport * as utils from './utils';\n\ninterface Props {\n  channel: OpenChannel;\n  theme: string;\n  height?: number;\n  width?: number;\n}\n\nfunction ChannelAvatar({\n  channel,\n  theme,\n  height = 56,\n  width = 56,\n}: Props): JSX.Element {\n  const { stringSet } = useContext(LocalizationContext);\n  const memoizedAvatar = useMemo(() => {\n    return (\n      <Avatar\n        className=\"sendbird-chat-header__avatar--open-channel\"\n        src={utils.getOpenChannelAvatar(channel)}\n        width={`${width}px`}\n        height={`${height}px`}\n        alt={channel?.name || stringSet.OPEN_CHANNEL_SETTINGS__NO_TITLE}\n      />\n    );\n  }, [channel?.coverUrl, theme]);\n  return (\n    <>{ memoizedAvatar }</>\n  );\n}\n\nexport default ChannelAvatar;\n"],"names":["ChannelAvatar","_ref","channel","theme","height","width","stringSet","useContext","LocalizationContext","memoizedAvatar","useMemo","React","createElement","Avatar","className","src","utils","alt","name","OPEN_CHANNEL_SETTINGS__NO_TITLE","coverUrl","Fragment"],"mappings":";;;;;;;;;;;;;;;;;AAeA,SAASA,aAAaA,CAAAC,IAAA,EAKC;EAAA,IALA;IACrBC,OAAO;IACPC,KAAK;AACLC,IAAAA,MAAM,GAAG,EAAE;AACXC,IAAAA,KAAK,GAAG,EAAA;AACH,GAAC,GAAAJ,IAAA,CAAA;EACN,MAAM;AAAEK,IAAAA,SAAAA;AAAU,GAAC,GAAGC,gBAAU,CAACC,uCAAmB,CAAC,CAAA;AACrD,EAAA,MAAMC,cAAc,GAAGC,aAAO,CAAC,MAAM;AACnC,IAAA,oBACEC,yBAAA,CAAAC,aAAA,CAACC,oBAAM,EAAA;AACLC,MAAAA,SAAS,EAAC,4CAA4C;AACtDC,MAAAA,GAAG,EAAEC,0BAA0B,CAACd,OAAO,CAAE;MACzCG,KAAK,EAAG,CAAEA,EAAAA,KAAM,CAAI,EAAA,CAAA;MACpBD,MAAM,EAAG,CAAEA,EAAAA,MAAO,CAAI,EAAA,CAAA;MACtBa,GAAG,EAAE,CAAAf,OAAO,KAAPA,IAAAA,IAAAA,OAAO,KAAPA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,OAAO,CAAEgB,IAAI,KAAIZ,SAAS,CAACa,+BAAAA;KAChC,CAAA,CAAA;AAEN,GAAC,EAAE,CAACjB,OAAO,KAAA,IAAA,IAAPA,OAAO,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAPA,OAAO,CAAEkB,QAAQ,EAAEjB,KAAK,CAAC,CAAC,CAAA;EAC9B,oBACEQ,yBAAA,CAAAC,aAAA,CAAAD,yBAAA,CAAAU,QAAA,EAAIZ,IAAAA,EAAAA,cAAc,CAAK,CAAA;AAE3B;;;;"}

package/cjs/ui/OpenchannelConversationHeader.js

@@ -4,26 +4,30 @@ var React = require('react');
 var ui_Avatar = require('./Avatar.js');
 var ui_Icon = require('./Icon.js');
 var ui_IconButton = require('./IconButton.js');
-var ui_Label = require('../index-d6ef2a60.js');
-var LocalizationContext = require('../LocalizationContext-2b3f310d.js');
-require('../tslib.es6-43854eb1.js');
+var ui_Label = require('../index-44186883.js');
+var LocalizationContext = require('../LocalizationContext-461a0816.js');
 require('./ImageRenderer.js');
-require('../uuid-11d4efe8.js');
+require('../uuid-d86ea01f.js');
 require('prop-types');
-require('../stringSet-91b919f6.js');
-require('../index-de151767.js');
+require('../_rollupPluginBabelHelpers-919a4db3.js');
+require('../stringSet-d1cee26a.js');
+require('../index-5e6194f8.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function OpenchannelConversationHeader(_a) {
-  var coverImage = _a.coverImage,
-      title = _a.title,
-      subTitle = _a.subTitle,
-      amIOperator = _a.amIOperator,
-      onActionClick = _a.onActionClick;
-  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
+function OpenchannelConversationHeader(_ref) {
+  let {
+    coverImage,
+    title,
+    subTitle,
+    amIOperator,
+    onActionClick
+  } = _ref;
+  const {
+    stringSet
+  } = React.useContext(LocalizationContext.LocalizationContext);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-openchannel-conversation-header"
   }, /*#__PURE__*/React__default["default"].createElement("div", {

package/cjs/ui/OpenchannelConversationHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"OpenchannelConversationHeader.js","sources":["../../../src/ui/OpenchannelConversationHeader/index.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport './index.scss';\n\nimport Avatar from '../Avatar';\nimport Icon, { IconColors, IconTypes } from '../Icon';\nimport IconButton from '../IconButton';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\ninterface Props {\n  coverImage?: string;\n  title?: string;\n  subTitle?: string;\n  amIOperator?: boolean;\n  onActionClick?(): void;\n}\n\nexport default function OpenchannelConversationHeader({\n  coverImage,\n  title,\n  subTitle,\n  amIOperator,\n  onActionClick,\n}: Props): JSX.Element {\n  const { stringSet } = useContext(LocalizationContext);\n\n  return (\n    <div className=\"sendbird-openchannel-conversation-header\">\n      <div className=\"sendbird-openchannel-conversation-header__left\">\n        {\n          coverImage ? (\n            <Avatar\n              className=\"sendbird-openchannel-conversation-header__left__cover-image\"\n              src={coverImage}\n              alt=\"channel cover image\"\n              width=\"32px\"\n              height=\"32px\"\n            />\n          ) : (\n            <div\n              className=\"sendbird-openchannel-conversation-header__left__cover-image--icon\"\n              style={{ width: 32, height: 32 }}\n            >\n              <Icon\n                type={IconTypes.CHANNELS}\n                fillColor={IconColors.CONTENT}\n                width=\"18px\"\n                height=\"18px\"\n              />\n            </div>\n          )\n        }\n        <Label\n          className=\"sendbird-openchannel-conversation-header__left__title\"\n          type={LabelTypography.H_2}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {title || stringSet.NO_TITLE}\n        </Label>\n        <Label\n          className=\"sendbird-openchannel-conversation-header__left__sub-title\"\n          type={LabelTypography.BODY_2}\n          color={LabelColors.ONBACKGROUND_2}\n        >\n          {subTitle || stringSet.NO_TITLE}\n        </Label>\n      </div>\n      <div className=\"sendbird-openchannel-conversation-header__right\">\n        <IconButton\n          className=\"sendbird-openchannel-conversation-header__right__trigger\"\n          width=\"32px\"\n          height=\"32px\"\n          onClick={onActionClick}\n        >\n          <Icon\n            type={(\n              amIOperator\n              ? IconTypes.INFO\n              : IconTypes.MEMBERS\n            )}\n            fillColor={IconColors.PRIMARY}\n            width=\"24px\"\n            height=\"24px\"\n          />\n        </IconButton>\n      </div>\n    </div>\n  );\n}\n"],"names":["OpenchannelConversationHeader","_a","coverImage","title","subTitle","amIOperator","onActionClick","stringSet","useContext","LocalizationContext","React","Avatar","width","height","Icon","IconTypes","CHANNELS","IconColors","CONTENT","Label","LabelTypography","H_2","LabelColors","ONBACKGROUND_1","NO_TITLE","BODY_2","ONBACKGROUND_2","IconButton","INFO","MEMBERS","PRIMARY"],"mappings":";;;;;;;;;;;;;;;;;;;AAiBwB,SAAAA,6BAAA,CAA8BC,EAA9B,EAMhB;AALN,EAAA,IAAAC,UAAU,GAAAD,EAAA,CAAAC,UAAV;AAAA,MACAC,KAAK,GAAAF,EAAA,CAAAE,KADL;AAAA,MAEAC,QAAQ,GAAAH,EAAA,CAAAG,QAFR;AAAA,MAGAC,WAAW,GAAAJ,EAAA,CAAAI,WAHX;AAAA,MAIAC,aAAa,GAAAL,EAAA,CAAAK,aAJb,CAAA;AAMQ,EAAA,IAAAC,SAAS,GAAKC,gBAAU,CAACC,uCAAD,CAAV,UAAd,CAAA;EAER,oBACEC,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,0CAAA;GACb,eAAAA,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,gDAAA;GAEXR,EAAAA,UAAU,gBACRQ,yBAAA,CAAA,aAAA,CAACC,oBAAD,EAAA;AACE,IAAA,SAAS,EAAC,6DADZ;AAEE,IAAA,GAAG,EAAET,UAFP;AAGE,IAAA,GAAG,EAAC,qBAHN;AAIE,IAAA,KAAK,EAAC,MAJR;AAKE,IAAA,MAAM,EAAC,MAAA;AALT,GAAA,CADQ,gBASRQ,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,SAAS,EAAC,mEADZ;AAEE,IAAA,KAAK,EAAE;AAAEE,MAAAA,KAAK,EAAE,EAAT;AAAaC,MAAAA,MAAM,EAAE,EAAA;AAArB,KAAA;AAFT,GAAA,eAIEH,wCAACI,kBAAD,EAAA;IACE,IAAI,EAAEC,iBAAS,CAACC,QADlB;IAEE,SAAS,EAAEC,kBAAU,CAACC,OAFxB;AAGE,IAAA,KAAK,EAAC,MAHR;AAIE,IAAA,MAAM,EAAC,MAAA;GARX,CAAA,CAXN,eAwBER,yBAAA,CAAA,aAAA,CAACS,cAAD,EAAA;AACE,IAAA,SAAS,EAAC,uDADZ;IAEE,IAAI,EAAEC,wBAAe,CAACC,GAFxB;IAGE,KAAK,EAAEC,oBAAW,CAACC,cAAAA;GAElBpB,EAAAA,KAAK,IAAII,SAAS,CAACiB,QALtB,CAxBF,eA+BEd,wCAACS,cAAD,EAAA;AACE,IAAA,SAAS,EAAC,2DADZ;IAEE,IAAI,EAAEC,wBAAe,CAACK,MAFxB;IAGE,KAAK,EAAEH,oBAAW,CAACI,cAAAA;AAHrB,GAAA,EAKGtB,QAAQ,IAAIG,SAAS,CAACiB,QALzB,CA/BF,CADF,eAwCEd,yBAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,iDAAA;AAAf,GAAA,eACEA,wCAACiB,aAAD,EAAA;AACE,IAAA,SAAS,EAAC,0DADZ;AAEE,IAAA,KAAK,EAAC,MAFR;AAGE,IAAA,MAAM,EAAC,MAHT;AAIE,IAAA,OAAO,EAAErB,aAAAA;AAJX,GAAA,eAMEI,wCAACI,kBAAD,EAAA;IACE,IAAI,EACFT,WAAW,GACTU,iBAAS,CAACa,IADD,GAETb,iBAAS,CAACc,OAJhB;IAME,SAAS,EAAEZ,kBAAU,CAACa,OANxB;AAOE,IAAA,KAAK,EAAC,MAPR;AAQE,IAAA,MAAM,EAAC,MAAA;GAdX,CAAA,CADF,CAxCF,CADF,CAAA;AA8DD;;;;"}
+{"version":3,"file":"OpenchannelConversationHeader.js","sources":["../../../src/ui/OpenchannelConversationHeader/index.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport './index.scss';\n\nimport Avatar from '../Avatar';\nimport Icon, { IconColors, IconTypes } from '../Icon';\nimport IconButton from '../IconButton';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\ninterface Props {\n  coverImage?: string;\n  title?: string;\n  subTitle?: string;\n  amIOperator?: boolean;\n  onActionClick?(): void;\n}\n\nexport default function OpenchannelConversationHeader({\n  coverImage,\n  title,\n  subTitle,\n  amIOperator,\n  onActionClick,\n}: Props): JSX.Element {\n  const { stringSet } = useContext(LocalizationContext);\n\n  return (\n    <div className=\"sendbird-openchannel-conversation-header\">\n      <div className=\"sendbird-openchannel-conversation-header__left\">\n        {\n          coverImage ? (\n            <Avatar\n              className=\"sendbird-openchannel-conversation-header__left__cover-image\"\n              src={coverImage}\n              alt=\"channel cover image\"\n              width=\"32px\"\n              height=\"32px\"\n            />\n          ) : (\n            <div\n              className=\"sendbird-openchannel-conversation-header__left__cover-image--icon\"\n              style={{ width: 32, height: 32 }}\n            >\n              <Icon\n                type={IconTypes.CHANNELS}\n                fillColor={IconColors.CONTENT}\n                width=\"18px\"\n                height=\"18px\"\n              />\n            </div>\n          )\n        }\n        <Label\n          className=\"sendbird-openchannel-conversation-header__left__title\"\n          type={LabelTypography.H_2}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {title || stringSet.NO_TITLE}\n        </Label>\n        <Label\n          className=\"sendbird-openchannel-conversation-header__left__sub-title\"\n          type={LabelTypography.BODY_2}\n          color={LabelColors.ONBACKGROUND_2}\n        >\n          {subTitle || stringSet.NO_TITLE}\n        </Label>\n      </div>\n      <div className=\"sendbird-openchannel-conversation-header__right\">\n        <IconButton\n          className=\"sendbird-openchannel-conversation-header__right__trigger\"\n          width=\"32px\"\n          height=\"32px\"\n          onClick={onActionClick}\n        >\n          <Icon\n            type={(\n              amIOperator\n                ? IconTypes.INFO\n                : IconTypes.MEMBERS\n            )}\n            fillColor={IconColors.PRIMARY}\n            width=\"24px\"\n            height=\"24px\"\n          />\n        </IconButton>\n      </div>\n    </div>\n  );\n}\n"],"names":["OpenchannelConversationHeader","_ref","coverImage","title","subTitle","amIOperator","onActionClick","stringSet","useContext","LocalizationContext","React","createElement","className","Avatar","src","alt","width","height","style","Icon","type","IconTypes","CHANNELS","fillColor","IconColors","CONTENT","Label","LabelTypography","H_2","color","LabelColors","ONBACKGROUND_1","NO_TITLE","BODY_2","ONBACKGROUND_2","IconButton","onClick","INFO","MEMBERS","PRIMARY"],"mappings":";;;;;;;;;;;;;;;;;;;AAiBe,SAASA,6BAA6BA,CAAAC,IAAA,EAM9B;EAAA,IAN+B;IACpDC,UAAU;IACVC,KAAK;IACLC,QAAQ;IACRC,WAAW;AACXC,IAAAA,aAAAA;AACK,GAAC,GAAAL,IAAA,CAAA;EACN,MAAM;AAAEM,IAAAA,SAAAA;AAAU,GAAC,GAAGC,gBAAU,CAACC,uCAAmB,CAAC,CAAA;EAErD,oBACEC,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,0CAAA;GACbF,eAAAA,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,gDAAA;AAAgD,GAAA,EAE3DV,UAAU,gBACRQ,yBAAA,CAAAC,aAAA,CAACE,oBAAM,EAAA;AACLD,IAAAA,SAAS,EAAC,6DAA6D;AACvEE,IAAAA,GAAG,EAAEZ,UAAW;AAChBa,IAAAA,GAAG,EAAC,qBAAqB;AACzBC,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAA;GACP,CAAA,gBAEFP,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEC,IAAAA,SAAS,EAAC,mEAAmE;AAC7EM,IAAAA,KAAK,EAAE;AAAEF,MAAAA,KAAK,EAAE,EAAE;AAAEC,MAAAA,MAAM,EAAE,EAAA;AAAG,KAAA;AAAE,GAAA,eAEjCP,yBAAA,CAAAC,aAAA,CAACQ,kBAAI,EAAA;IACHC,IAAI,EAAEC,iBAAS,CAACC,QAAS;IACzBC,SAAS,EAAEC,kBAAU,CAACC,OAAQ;AAC9BT,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAA;AAAM,GAAA,CACb,CAEL,eAEHP,yBAAA,CAAAC,aAAA,CAACe,cAAK,EAAA;AACJd,IAAAA,SAAS,EAAC,uDAAuD;IACjEQ,IAAI,EAAEO,wBAAe,CAACC,GAAI;IAC1BC,KAAK,EAAEC,oBAAW,CAACC,cAAAA;GAElB5B,EAAAA,KAAK,IAAII,SAAS,CAACyB,QAAQ,CACtB,eACRtB,yBAAA,CAAAC,aAAA,CAACe,cAAK,EAAA;AACJd,IAAAA,SAAS,EAAC,2DAA2D;IACrEQ,IAAI,EAAEO,wBAAe,CAACM,MAAO;IAC7BJ,KAAK,EAAEC,oBAAW,CAACI,cAAAA;GAElB9B,EAAAA,QAAQ,IAAIG,SAAS,CAACyB,QAAQ,CACzB,CACJ,eACNtB,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,iDAAA;AAAiD,GAAA,eAC9DF,yBAAA,CAAAC,aAAA,CAACwB,aAAU,EAAA;AACTvB,IAAAA,SAAS,EAAC,0DAA0D;AACpEI,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAM;AACbmB,IAAAA,OAAO,EAAE9B,aAAAA;AAAc,GAAA,eAEvBI,yBAAA,CAAAC,aAAA,CAACQ,kBAAI,EAAA;IACHC,IAAI,EACFf,WAAW,GACPgB,iBAAS,CAACgB,IAAI,GACdhB,iBAAS,CAACiB,OACd;IACFf,SAAS,EAAEC,kBAAU,CAACe,OAAQ;AAC9BvB,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAA;GACP,CAAA,CACS,CACT,CACF,CAAA;AAEV;;;;"}

package/cjs/ui/OpenchannelFileMessage.js

@@ -1,35 +1,34 @@
 'use strict';
 
-var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-a7254c9d.js');
-var tslib_es6 = require('../tslib.es6-43854eb1.js');
+var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-919a4db3.js');
 var React = require('react');
-var index$1 = require('../index-73467e1d.js');
+var index$1 = require('../index-60bf4d5c.js');
 var ui_Avatar = require('./Avatar.js');
 var ui_ContextMenu = require('./ContextMenu.js');
-var ui_Label = require('../index-d6ef2a60.js');
+var ui_Label = require('../index-44186883.js');
 var ui_Loader = require('./Loader.js');
 var ui_Icon = require('./Icon.js');
 var ui_IconButton = require('./IconButton.js');
 var ui_TextButton = require('./TextButton.js');
 var ui_UserProfile = require('./UserProfile.js');
-var UserProfileContext = require('../UserProfileContext-9d60cdc4.js');
-var LocalizationContext = require('../LocalizationContext-2b3f310d.js');
-var index = require('../index-5c81f847.js');
-var MediaQueryContext = require('../MediaQueryContext-71862be1.js');
-var useLongPress = require('../useLongPress-c7bf12b1.js');
-require('../index-de151767.js');
+var UserProfileContext = require('../UserProfileContext-1bcc48a2.js');
+var LocalizationContext = require('../LocalizationContext-461a0816.js');
+var index = require('../index-81aad270.js');
+var MediaQueryContext = require('../MediaQueryContext-de7c63bc.js');
+var useLongPress = require('../useLongPress-4c2e9a3b.js');
+require('../index-5e6194f8.js');
 require('./ImageRenderer.js');
-require('../uuid-11d4efe8.js');
+require('../uuid-d86ea01f.js');
 require('prop-types');
 require('react-dom');
 require('./SortByRow.js');
-require('../index-21b2339d.js');
+require('../index-bca3d144.js');
 require('../utils/message/getOutgoingMessageState.js');
-require('../stringSet-91b919f6.js');
-require('../color-89f33656.js');
+require('../stringSet-d1cee26a.js');
+require('../color-48ff06b2.js');
 require('../sendbirdSelectors.js');
-require('../topics-ac9cf7ed.js');
-require('../utils-1f6c6626.js');
+require('../topics-00c67dd6.js');
+require('../utils-3dacb9bc.js');
 require('./Button.js');
 require('../useSendbirdStateContext.js');
 require('../withSendbird.js');
@@ -38,70 +37,64 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var checkFileType = function (fileUrl) {
-  var audioFile = /(\.mp3)$/i;
-  var gifFile = /(\.gif)$/i;
-
+const checkFileType = fileUrl => {
+  const audioFile = /(\.mp3)$/i;
+  const gifFile = /(\.gif)$/i;
   if (audioFile.test(fileUrl)) {
     return ui_Icon.IconTypes.FILE_AUDIO;
   }
-
   if (gifFile.test(fileUrl)) {
     return ui_Icon.IconTypes.GIF;
   }
-
   return ui_Icon.IconTypes.FILE_DOCUMENT;
 };
-var truncate = function (fullStr, strLen) {
+const truncate = (fullStr, strLen) => {
   if (fullStr === null || fullStr === undefined) return '';
   if (fullStr.length <= strLen) return fullStr;
-  var separator = '...';
-  var sepLen = separator.length;
-  var charsToShow = strLen - sepLen;
-  var frontChars = Math.ceil(charsToShow / 2);
-  var backChars = Math.floor(charsToShow / 2);
+  const separator = '...';
+  const sepLen = separator.length;
+  const charsToShow = strLen - sepLen;
+  const frontChars = Math.ceil(charsToShow / 2);
+  const backChars = Math.floor(charsToShow / 2);
   return fullStr.substr(0, frontChars) + separator + fullStr.substr(fullStr.length - backChars);
 };
 
-function OpenchannelFileMessage(_a) {
-  var className = _a.className,
-      message = _a.message,
-      isOperator = _a.isOperator,
-      userId = _a.userId,
-      disabled = _a.disabled,
-      chainTop = _a.chainTop,
-      showRemove = _a.showRemove,
-      resendMessage = _a.resendMessage;
-  var status = message === null || message === void 0 ? void 0 : message.sendingStatus;
-
-  var _b = LocalizationContext.useLocalization(),
-      dateLocale = _b.dateLocale,
-      stringSet = _b.stringSet;
-
-  var contextMenuRef = React.useRef(null);
-  var mobileMenuRef = React.useRef(null);
-  var avatarRef = React.useRef(null);
-
-  var _c = React.useContext(UserProfileContext.UserProfileContext),
-      disableUserProfile = _c.disableUserProfile,
-      renderUserProfile = _c.renderUserProfile;
-
-  var isMobile = MediaQueryContext.useMediaQueryContext().isMobile;
-
-  var openFileUrl = function () {
+function OpenchannelFileMessage(_ref) {
+  let {
+    className,
+    message,
+    isOperator,
+    isEphemeral = false,
+    userId,
+    disabled,
+    chainTop,
+    showRemove,
+    resendMessage
+  } = _ref;
+  const status = message === null || message === void 0 ? void 0 : message.sendingStatus;
+  const {
+    dateLocale,
+    stringSet
+  } = LocalizationContext.useLocalization();
+  const contextMenuRef = React.useRef(null);
+  const mobileMenuRef = React.useRef(null);
+  const avatarRef = React.useRef(null);
+  const {
+    disableUserProfile,
+    renderUserProfile
+  } = React.useContext(UserProfileContext.UserProfileContext);
+  const {
+    isMobile
+  } = MediaQueryContext.useMediaQueryContext();
+  const openFileUrl = () => {
     window.open(message.url);
   };
-
-  var isPending = index.checkIsPending(status);
-  var isFailed = index.checkIsFailed(status);
-  var sender = index.getSenderFromMessage(message);
-
-  var _d = React.useState(false),
-      contextMenu = _d[0],
-      setContextMenu = _d[1];
-
-  var longPress = useLongPress.useLongPress({
-    onLongPress: function () {
+  const isPending = index.checkIsPending(status);
+  const isFailed = index.checkIsFailed(status);
+  const sender = index.getSenderFromMessage(message);
+  const [contextMenu, setContextMenu] = React.useState(false);
+  const longPress = useLongPress.useLongPress({
+    onLongPress: () => {
       if (isMobile) {
         setContextMenu(true);
       }
@@ -111,43 +104,39 @@ function OpenchannelFileMessage(_a) {
     delay: 300
   });
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: tslib_es6.__spreadArray(tslib_es6.__spreadArray([], Array.isArray(className) ? className : [className], true), ['sendbird-openchannel-file-message'], false).join(' '),
+    className: [...(Array.isArray(className) ? className : [className]), 'sendbird-openchannel-file-message'].join(' '),
     ref: mobileMenuRef
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-openchannel-file-message__left"
   }, !chainTop && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu["default"], {
-    menuTrigger: function (toggleDropdown) {
-      return /*#__PURE__*/React__default["default"].createElement(ui_Avatar["default"], {
-        className: "sendbird-openchannel-file-message__left__avatar",
-        src: sender.profileUrl || '',
-        ref: avatarRef,
-        width: "28px",
-        height: "28px",
-        onClick: function () {
-          if (!disableUserProfile) {
-            toggleDropdown();
-          }
+    menuTrigger: toggleDropdown => /*#__PURE__*/React__default["default"].createElement(ui_Avatar["default"], {
+      className: "sendbird-openchannel-file-message__left__avatar",
+      src: sender.profileUrl || '',
+      ref: avatarRef,
+      width: "28px",
+      height: "28px",
+      onClick: () => {
+        if (!disableUserProfile) {
+          toggleDropdown();
         }
-      });
-    },
-    menuItems: function (closeDropdown) {
-      return /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItems, {
-        parentRef: avatarRef,
-        parentContainRef: avatarRef,
-        closeDropdown: closeDropdown,
-        style: {
-          paddingTop: '0px',
-          paddingBottom: '0px'
-        }
-      }, renderUserProfile ? renderUserProfile({
-        user: sender,
-        close: closeDropdown
-      }) : /*#__PURE__*/React__default["default"].createElement(ui_UserProfile, {
-        user: sender,
-        onSuccess: closeDropdown,
-        disableMessaging: true
-      }));
-    }
+      }
+    }),
+    menuItems: closeDropdown => /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItems, {
+      parentRef: avatarRef,
+      parentContainRef: avatarRef,
+      closeDropdown: closeDropdown,
+      style: {
+        paddingTop: '0px',
+        paddingBottom: '0px'
+      }
+    }, renderUserProfile ? renderUserProfile({
+      user: sender,
+      close: closeDropdown
+    }) : /*#__PURE__*/React__default["default"].createElement(ui_UserProfile, {
+      user: sender,
+      onSuccess: closeDropdown,
+      disableMessaging: true
+    }))
   })), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-openchannel-file-message__right"
   }, !chainTop && /*#__PURE__*/React__default["default"].createElement("div", {
@@ -164,7 +153,7 @@ function OpenchannelFileMessage(_a) {
     locale: dateLocale
   }))), /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers._extends({
     className: "sendbird-openchannel-file-message__right__body"
-  }, isMobile ? tslib_es6.__assign({}, longPress) : {}), checkFileType(message.url) && /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+  }, isMobile ? _rollupPluginBabelHelpers._objectSpread2({}, longPress) : {}), checkFileType(message.url) && /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
     className: "sendbird-openchannel-file-message__right__body__icon",
     type: checkFileType(message.url),
     fillColor: ui_Icon.IconColors.PRIMARY,
@@ -196,64 +185,62 @@ function OpenchannelFileMessage(_a) {
   }))), !isMobile && /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-openchannel-file-message__context-menu",
     ref: contextMenuRef
-  }, /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu["default"], {
-    menuTrigger: function (toggleDropdown) {
-      return index.showMenuTrigger({
-        message: message,
-        userId: userId,
-        status: status
-      }) && /*#__PURE__*/React__default["default"].createElement(ui_IconButton, {
-        className: "sendbird-openchannel-file-message__context-menu__icon",
-        width: "32px",
-        height: "32px",
-        onClick: toggleDropdown
-      }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
-        type: ui_Icon.IconTypes.MORE,
-        width: "24px",
-        height: "24px"
-      }));
-    },
-    menuItems: function (closeDropdown) {
-      return /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItems, {
-        parentRef: contextMenuRef,
-        parentContainRef: contextMenuRef,
-        closeDropdown: closeDropdown,
-        openLeft: true
-      }, index.isFineResend({
-        message: message,
-        userId: userId,
-        status: status
-      }) && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItem, {
-        onClick: function () {
-          if (disabled) {
-            return;
-          }
-
-          resendMessage(message);
-          closeDropdown();
+  }, (index.isFineResend({
+    message,
+    userId,
+    status
+  }) || !isEphemeral) && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu["default"], {
+    menuTrigger: toggleDropdown => index.showMenuTrigger({
+      message,
+      userId,
+      status
+    }) && /*#__PURE__*/React__default["default"].createElement(ui_IconButton, {
+      className: "sendbird-openchannel-file-message__context-menu__icon",
+      width: "32px",
+      height: "32px",
+      onClick: toggleDropdown
+    }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+      type: ui_Icon.IconTypes.MORE,
+      width: "24px",
+      height: "24px"
+    })),
+    menuItems: closeDropdown => /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItems, {
+      parentRef: contextMenuRef,
+      parentContainRef: contextMenuRef,
+      closeDropdown: closeDropdown,
+      openLeft: true
+    }, index.isFineResend({
+      message,
+      userId,
+      status
+    }) && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItem, {
+      onClick: () => {
+        if (disabled) {
+          return;
         }
-      }, stringSet.CONTEXT_MENU_DROPDOWN__RESEND), index.isFineDelete({
-        message: message,
-        userId: userId,
-        status: status
-      }) && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItem, {
-        onClick: function () {
-          if (disabled) {
-            return;
-          }
-
-          showRemove(true);
-          closeDropdown();
+        resendMessage(message);
+        closeDropdown();
+      }
+    }, stringSet.CONTEXT_MENU_DROPDOWN__RESEND), !isEphemeral && index.isFineDelete({
+      message,
+      userId,
+      status
+    }) && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItem, {
+      onClick: () => {
+        if (disabled) {
+          return;
         }
-      }, stringSet.CONTEXT_MENU_DROPDOWN__DELETE));
-    }
+        showRemove(true);
+        closeDropdown();
+      }
+    }, stringSet.CONTEXT_MENU_DROPDOWN__DELETE))
   })), contextMenu && /*#__PURE__*/React__default["default"].createElement(index.OpenChannelMobileMenu, {
     message: message,
-    hideMenu: function () {
+    hideMenu: () => {
       setContextMenu(false);
     },
     parentRef: mobileMenuRef,
-    showRemove: function () {
+    showRemove: () => {
       setContextMenu(false);
       showRemove(true);
     }