@sendbird/uikit-react 3.0.0-beta → 3.0.0-beta.2

package/ui/MessageItemMenu.js

@@ -2,16 +2,16 @@ import React__default, { useContext, useRef } from 'react';
 import ContextMenu, { MenuItems, MenuItem } from './ContextMenu.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import IconButton from './IconButton.js';
-import { n as isUserMessage, z as isSentMessage, A as isFailedMessage, B as isPendingMessage, d as getClassName, C as copyToClipboard } from '../index-8c72a94a.js';
-import { a as LocalizationContext } from '../LocalizationContext-e4391013.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import { p as isUserMessage, B as isSentMessage, C as isFailedMessage, D as isPendingMessage, d as getClassName, E as copyToClipboard } from '../index-ad4c9e58.js';
+import { a as LocalizationContext } from '../LocalizationContext-b021af8f.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
-import '../index-7a51bd16.js';
-import '../stringSet-4f6eaa60.js';
+import '../index-a611bd38.js';
+import '../stringSet-91746bf1.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../tslib.es6-e3c44017.js';
-import '../index-6ebf7894.js';
+import '../tslib.es6-83aa13f5.js';
+import '../index-353f13f3.js';
 
 function MessageItemMenu(_a) {
   var _b, _c;

package/ui/MessageItemReactionMenu.js

@@ -4,14 +4,14 @@ import Icon, { IconTypes, IconColors } from './Icon.js';
 import IconButton from './IconButton.js';
 import ImageRenderer from './ImageRenderer.js';
 import ReactionButton from './ReactionButton.js';
-import { B as isPendingMessage, A as isFailedMessage, d as getClassName, D as getEmojiListAll } from '../index-8c72a94a.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import { D as isPendingMessage, C as isFailedMessage, d as getClassName, F as getEmojiListAll } from '../index-ad4c9e58.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
-import '../index-7a51bd16.js';
-import '../stringSet-4f6eaa60.js';
+import '../index-a611bd38.js';
+import '../stringSet-91746bf1.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../tslib.es6-e3c44017.js';
+import '../tslib.es6-83aa13f5.js';
 
 function MessageItemReactionMenu(_a) {
   var className = _a.className,

package/ui/MessageSearchFileItem.js

@@ -1,18 +1,18 @@
-import { a as __spreadArray } from '../tslib.es6-e3c44017.js';
+import { a as __spreadArray } from '../tslib.es6-83aa13f5.js';
 import React__default from 'react';
 import Avatar from './Avatar.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-7a51bd16.js';
-import { u as useLocalization } from '../LocalizationContext-e4391013.js';
-import { f as format } from '../index-770d7112.js';
-import { i as isToday, a as isYesterday, f as formatRelative } from '../index-1718324d.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a611bd38.js';
+import { u as useLocalization } from '../LocalizationContext-b021af8f.js';
+import { f as format } from '../index-4a59a866.js';
+import { i as isToday, a as isYesterday, f as formatRelative } from '../index-86b0a341.js';
 import './ImageRenderer.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
-import '../uuid-b0c93400.js';
-import '../stringSet-4f6eaa60.js';
-import '../index-6ebf7894.js';
-import '../index-cd21929d.js';
+import '../uuid-6d14d007.js';
+import '../stringSet-91746bf1.js';
+import '../index-353f13f3.js';
+import '../index-f119413c.js';
 
 function getCreatedAt(createdAt, locale) {
   var optionalParam = locale ? {

package/ui/MessageSearchItem.js

@@ -1,18 +1,18 @@
-import { a as __spreadArray } from '../tslib.es6-e3c44017.js';
+import { a as __spreadArray } from '../tslib.es6-83aa13f5.js';
 import React__default from 'react';
-import { f as format } from '../index-770d7112.js';
-import { i as isToday, a as isYesterday, f as formatRelative } from '../index-1718324d.js';
+import { f as format } from '../index-4a59a866.js';
+import { i as isToday, a as isYesterday, f as formatRelative } from '../index-86b0a341.js';
 import Avatar from './Avatar.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-7a51bd16.js';
-import { u as useLocalization } from '../LocalizationContext-e4391013.js';
-import '../index-6ebf7894.js';
-import '../index-cd21929d.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a611bd38.js';
+import { u as useLocalization } from '../LocalizationContext-b021af8f.js';
+import '../index-353f13f3.js';
+import '../index-f119413c.js';
 import './ImageRenderer.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
 import './Icon.js';
-import '../uuid-b0c93400.js';
-import '../stringSet-4f6eaa60.js';
+import '../uuid-6d14d007.js';
+import '../stringSet-91746bf1.js';
 
 function getCreatedAt (createdAt, locale) {
   var optionalParam = locale ? {

package/ui/MessageStatus.js

@@ -0,0 +1,57 @@
+import { a as __spreadArray } from '../tslib.es6-83aa13f5.js';
+import React__default, { useMemo } from 'react';
+import { f as format } from '../index-4a59a866.js';
+import Icon, { IconTypes, IconColors } from './Icon.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a611bd38.js';
+import Loader from './Loader.js';
+import { a as getOutgoingMessageStates, z as getOutgoingMessageState, A as isSentStatus } from '../index-ad4c9e58.js';
+import { u as useLocalization } from '../LocalizationContext-b021af8f.js';
+import '../index-353f13f3.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
+import 'prop-types';
+import '../stringSet-91746bf1.js';
+
+var MessageStatusTypes = getOutgoingMessageStates();
+function MessageStatus(_a) {
+  var _b, _c;
+
+  var _d, _e;
+
+  var className = _a.className,
+      message = _a.message,
+      channel = _a.channel;
+  var dateLocale = useLocalization().dateLocale;
+  var status = useMemo(function () {
+    return getOutgoingMessageState(channel, message);
+  }, [(_d = channel === null || channel === void 0 ? void 0 : channel.getUnreadMemberCount) === null || _d === void 0 ? void 0 : _d.call(channel, message), (_e = channel === null || channel === void 0 ? void 0 : channel.getUndeliveredMemberCount) === null || _e === void 0 ? void 0 : _e.call(channel, message)]);
+  var showMessageStatusIcon = (channel === null || channel === void 0 ? void 0 : channel.isGroupChannel()) && !(channel === null || channel === void 0 ? void 0 : channel.isSuper) && !(channel === null || channel === void 0 ? void 0 : channel.isPublic) && !(channel === null || channel === void 0 ? void 0 : channel.isBroadcast);
+  var iconType = (_b = {}, _b[MessageStatusTypes.SENT] = IconTypes.DONE, _b[MessageStatusTypes.DELIVERED] = IconTypes.DONE_ALL, _b[MessageStatusTypes.READ] = IconTypes.DONE_ALL, _b[MessageStatusTypes.FAILED] = IconTypes.ERROR, _b);
+  var iconColor = (_c = {}, _c[MessageStatusTypes.SENT] = IconColors.SENT, _c[MessageStatusTypes.DELIVERED] = IconColors.SENT, _c[MessageStatusTypes.READ] = IconColors.READ, _c[MessageStatusTypes.FAILED] = IconColors.ERROR, _c);
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: __spreadArray(__spreadArray([], Array.isArray(className) ? className : [className], true), ['sendbird-message-status'], false).join(' ')
+  }, status === MessageStatusTypes.PENDING ? /*#__PURE__*/React__default.createElement(Loader, {
+    className: "sendbird-message-status__icon " + (showMessageStatusIcon ? '' : 'hide-icon'),
+    width: "16px",
+    height: "16px"
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    type: IconTypes.SPINNER,
+    fillColor: IconColors.PRIMARY,
+    width: "16px",
+    height: "16px"
+  })) : /*#__PURE__*/React__default.createElement(Icon, {
+    className: "sendbird-message-status__icon " + (showMessageStatusIcon ? '' : 'hide-icon'),
+    type: iconType[status] || IconTypes.ERROR,
+    fillColor: iconColor[status],
+    width: "16px",
+    height: "16px"
+  }), isSentStatus(status) && /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-message-status__text",
+    type: LabelTypography.CAPTION_3,
+    color: LabelColors.ONBACKGROUND_2
+  }, format((message === null || message === void 0 ? void 0 : message.createdAt) || 0, 'p', {
+    locale: dateLocale
+  })));
+}
+
+export { MessageStatusTypes, MessageStatus as default };
+//# sourceMappingURL=MessageStatus.js.map

package/ui/MessageStatus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageStatus.js","sources":["../../src/ui/MessageStatus/index.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport format from 'date-fns/format';\nimport './index.scss';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport Label, { LabelColors, LabelTypography } from '../Label';\nimport Loader from '../Loader';\n\nimport {\n  getOutgoingMessageState,\n  getOutgoingMessageStates,\n  isSentStatus,\n} from '../../utils';\nimport { FileMessage, GroupChannel, UserMessage } from 'sendbird';\nimport { useLocalization } from '../../lib/LocalizationContext';\n\nexport const MessageStatusTypes = getOutgoingMessageStates();\n\ninterface MessageStatusProps {\n  className?: string;\n  message: UserMessage | FileMessage;\n  channel: GroupChannel;\n}\n\nexport default function MessageStatus({\n  className,\n  message,\n  channel,\n}: MessageStatusProps): React.ReactElement {\n  const { dateLocale } = useLocalization();\n  const status = useMemo(() => (\n    getOutgoingMessageState(channel, message)\n  ), [channel?.getUnreadMemberCount?.(message), channel?.getUndeliveredMemberCount?.(message)]);\n  const showMessageStatusIcon = channel?.isGroupChannel()\n    && !channel?.isSuper\n    && !channel?.isPublic\n    && !channel?.isBroadcast;\n  const iconType = {\n    [MessageStatusTypes.SENT]: IconTypes.DONE,\n    [MessageStatusTypes.DELIVERED]: IconTypes.DONE_ALL,\n    [MessageStatusTypes.READ]: IconTypes.DONE_ALL,\n    [MessageStatusTypes.FAILED]: IconTypes.ERROR,\n  };\n  const iconColor = {\n    [MessageStatusTypes.SENT]: IconColors.SENT,\n    [MessageStatusTypes.DELIVERED]: IconColors.SENT,\n    [MessageStatusTypes.READ]: IconColors.READ,\n    [MessageStatusTypes.FAILED]: IconColors.ERROR,\n  };\n\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-message-status',\n      ].join(' ')}\n    >\n      {(status === MessageStatusTypes.PENDING) ? (\n        <Loader\n          className={`sendbird-message-status__icon ${showMessageStatusIcon ? '' : 'hide-icon'}`}\n          width=\"16px\"\n          height=\"16px\"\n        >\n          <Icon\n            type={IconTypes.SPINNER}\n            fillColor={IconColors.PRIMARY}\n            width=\"16px\"\n            height=\"16px\"\n          />\n        </Loader>\n      ) : (\n        <Icon\n          className={`sendbird-message-status__icon ${showMessageStatusIcon ? '' : 'hide-icon'}`}\n          type={iconType[status] || IconTypes.ERROR}\n          fillColor={iconColor[status]}\n          width=\"16px\"\n          height=\"16px\"\n        />\n      )}\n      {isSentStatus(status) && (\n        <Label\n          className=\"sendbird-message-status__text\"\n          type={LabelTypography.CAPTION_3}\n          color={LabelColors.ONBACKGROUND_2}\n        >\n          {format(message?.createdAt || 0, 'p', {\n            locale: dateLocale,\n          })}\n        </Label>\n      )}\n    </div>\n  );\n}\n"],"names":["MessageStatusTypes","getOutgoingMessageStates","MessageStatus","_a","className","message","channel","dateLocale","useLocalization","status","useMemo","getOutgoingMessageState","getUnreadMemberCount","getUndeliveredMemberCount","showMessageStatusIcon","isGroupChannel","isSuper","isPublic","isBroadcast","iconType","_b","SENT","IconTypes","DONE","DELIVERED","DONE_ALL","READ","FAILED","ERROR","iconColor","_c","IconColors","React","__spreadArray","Array","isArray","join","PENDING","SPINNER","PRIMARY","isSentStatus","LabelTypography","CAPTION_3","LabelColors","ONBACKGROUND_2","format","createdAt","locale"],"mappings":"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"}

package/ui/Modal.js

@@ -1,16 +1,16 @@
 import React__default, { useContext } from 'react';
 import PropTypes from 'prop-types';
 import { createPortal } from 'react-dom';
-import { a as LocalizationContext } from '../LocalizationContext-e4391013.js';
-import { M as MODAL_ROOT } from '../index-942c85a6.js';
+import { a as LocalizationContext } from '../LocalizationContext-b021af8f.js';
+import { M as MODAL_ROOT } from '../index-1fd114b0.js';
 import IconButton from './IconButton.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import { a as ButtonTypes, B as Button } from '../index-acebc2ff.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-7a51bd16.js';
-import { n as noop } from '../utils-c393e880.js';
-import '../stringSet-4f6eaa60.js';
-import '../index-6ebf7894.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import { a as ButtonTypes, B as Button } from '../index-41a6f4f2.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a611bd38.js';
+import { n as noop } from '../utils-9ef11656.js';
+import '../stringSet-91746bf1.js';
+import '../index-353f13f3.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 
 var ModalHeader = function ModalHeader(_ref) {
   var titleText = _ref.titleText;

package/ui/MutedAvatarOverlay.js

@@ -1,6 +1,6 @@
 import React__default from 'react';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
 
 function MutedAvatarOverlay(props) {

package/ui/OGMessageItemBody.js

@@ -1,26 +1,29 @@
 import React__default, { useContext } from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-7a51bd16.js';
-import LinkLabel from './LinkLabel.js';
-import Icon, { IconTypes } from './Icon.js';
+import { W as Word } from '../index-4889e530.js';
 import ImageRenderer from './ImageRenderer.js';
-import { d as getClassName, J as isUrl, H as isEditedMessage } from '../index-8c72a94a.js';
-import { u as uuidv4 } from '../uuid-b0c93400.js';
-import { a as LocalizationContext } from '../LocalizationContext-e4391013.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import Icon, { IconTypes } from './Icon.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a611bd38.js';
+import { u as uuidv4 } from '../uuid-6d14d007.js';
+import { d as getClassName, J as isEditedMessage } from '../index-ad4c9e58.js';
+import { a as LocalizationContext } from '../LocalizationContext-b021af8f.js';
+import './LinkLabel.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
-import '../stringSet-4f6eaa60.js';
-import '../tslib.es6-e3c44017.js';
-import '../index-6ebf7894.js';
+import '../stringSet-91746bf1.js';
+import '../tslib.es6-83aa13f5.js';
+import '../index-353f13f3.js';
 
 function OGMessageItemBody(_a) {
-  var _b, _c, _d, _e, _f, _g, _h, _j;
+  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
 
   var className = _a.className,
       message = _a.message,
-      _k = _a.isByMe,
-      isByMe = _k === void 0 ? false : _k,
-      _l = _a.mouseHover,
-      mouseHover = _l === void 0 ? false : _l;
+      _m = _a.isByMe,
+      isByMe = _m === void 0 ? false : _m,
+      _o = _a.mouseHover,
+      mouseHover = _o === void 0 ? false : _o,
+      _p = _a.isMentionEnabled,
+      isMentionEnabled = _p === void 0 ? false : _p;
   var stringSet = useContext(LocalizationContext).stringSet;
 
   var openOGUrl = function openOGUrl() {
@@ -29,22 +32,29 @@ function OGMessageItemBody(_a) {
     if ((_a = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _a === void 0 ? void 0 : _a.url) window.open((_b = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _b === void 0 ? void 0 : _b.url);
   };
 
+  var isMessageMentioned = isMentionEnabled && ((_b = message === null || message === void 0 ? void 0 : message.mentionedMessageTemplate) === null || _b === void 0 ? void 0 : _b.length) > 0 && ((_c = message === null || message === void 0 ? void 0 : message.mentionedUsers) === null || _c === void 0 ? void 0 : _c.length) > 0;
   return /*#__PURE__*/React__default.createElement("div", {
-    className: getClassName([className, 'sendbird-og-message-item-body', isByMe ? 'outgoing' : 'incoming', mouseHover ? 'mouse-hover' : '', ((_b = message === null || message === void 0 ? void 0 : message.reactions) === null || _b === void 0 ? void 0 : _b.length) > 0 ? 'reactions' : ''])
+    className: getClassName([className, 'sendbird-og-message-item-body', isByMe ? 'outgoing' : 'incoming', mouseHover ? 'mouse-hover' : '', ((_d = message === null || message === void 0 ? void 0 : message.reactions) === null || _d === void 0 ? void 0 : _d.length) > 0 ? 'reactions' : ''])
   }, /*#__PURE__*/React__default.createElement(Label, {
     key: uuidv4(),
     type: LabelTypography.BODY_1,
     color: isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1
   }, /*#__PURE__*/React__default.createElement("p", {
     className: "sendbird-og-message-item-body__text-bubble"
-  }, message === null || message === void 0 ? void 0 : message.message.split(' ').map(function (word) {
-    return isUrl(word) ? /*#__PURE__*/React__default.createElement(LinkLabel, {
-      className: "sendbird-og-message-item-body__text-bubble__message",
+  }, isMessageMentioned ? message === null || message === void 0 ? void 0 : message.mentionedMessageTemplate.split(' ').map(function (word) {
+    return /*#__PURE__*/React__default.createElement(Word, {
+      key: uuidv4(),
+      word: word,
+      message: message,
+      isByMe: isByMe
+    });
+  }) : message === null || message === void 0 ? void 0 : message.message.split(' ').map(function (word) {
+    return /*#__PURE__*/React__default.createElement(Word, {
       key: uuidv4(),
-      src: word,
-      type: LabelTypography.BODY_1,
-      color: isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1
-    }, word) : word + " ";
+      word: word,
+      message: message,
+      isByMe: isByMe
+    });
   }), isEditedMessage(message) && /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-og-message-item-body__text-bubble__message",
     type: LabelTypography.BODY_1,
@@ -54,8 +64,8 @@ function OGMessageItemBody(_a) {
     onClick: openOGUrl
   }, /*#__PURE__*/React__default.createElement(ImageRenderer, {
     className: "sendbird-og-message-item-body__og-thumbnail__image",
-    url: ((_d = (_c = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _c === void 0 ? void 0 : _c.defaultImage) === null || _d === void 0 ? void 0 : _d.url) || '',
-    alt: (_f = (_e = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _e === void 0 ? void 0 : _e.defaultImage) === null || _f === void 0 ? void 0 : _f.alt // TODO: Change fixing width and height lengths
+    url: ((_f = (_e = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _e === void 0 ? void 0 : _e.defaultImage) === null || _f === void 0 ? void 0 : _f.url) || '',
+    alt: (_h = (_g = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _g === void 0 ? void 0 : _g.defaultImage) === null || _h === void 0 ? void 0 : _h.alt // TODO: Change fixing width and height lengths
     ,
     width: "320px",
     height: "180px",
@@ -70,15 +80,15 @@ function OGMessageItemBody(_a) {
   })), /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-og-message-item-body__description",
     onClick: openOGUrl
-  }, ((_g = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _g === void 0 ? void 0 : _g.title) && /*#__PURE__*/React__default.createElement(Label, {
+  }, ((_j = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _j === void 0 ? void 0 : _j.title) && /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-og-message-item-body__description__title",
     type: LabelTypography.SUBTITLE_2,
     color: LabelColors.ONBACKGROUND_1
-  }, message.ogMetaData.title), ((_h = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _h === void 0 ? void 0 : _h.description) && /*#__PURE__*/React__default.createElement(Label, {
+  }, message.ogMetaData.title), ((_k = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _k === void 0 ? void 0 : _k.description) && /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-og-message-item-body__description__description",
     type: LabelTypography.BODY_2,
     color: LabelColors.ONBACKGROUND_1
-  }, message.ogMetaData.description), ((_j = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _j === void 0 ? void 0 : _j.url) && /*#__PURE__*/React__default.createElement(Label, {
+  }, message.ogMetaData.description), ((_l = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _l === void 0 ? void 0 : _l.url) && /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-og-message-item-body__description__url",
     type: LabelTypography.CAPTION_3,
     color: LabelColors.ONBACKGROUND_2

package/ui/OGMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"OGMessageItemBody.js","sources":["../../src/ui/OGMessageItemBody/index.tsx"],"sourcesContent":["import React, { ReactElement, useContext } from 'react';\nimport { UserMessage } from 'sendbird';\nimport './index.scss';\n\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport LinkLabel from '../LinkLabel';\nimport Icon, { IconTypes } from '../Icon';\nimport ImageRenderer from '../ImageRenderer';\nimport {\n  getClassName,\n  isEditedMessage,\n  isUrl,\n} from '../../utils';\nimport uuidv4 from '../../utils/uuid';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: UserMessage;\n  isByMe?: boolean;\n  mouseHover?: boolean;\n}\n\nexport default function OGMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = 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\n  return (\n    <div className={getClassName([\n      className,\n      'sendbird-og-message-item-body',\n      isByMe ? 'outgoing' : 'incoming',\n      mouseHover ? 'mouse-hover' : '',\n      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        <p className=\"sendbird-og-message-item-body__text-bubble\">\n          {\n            message?.message.split(' ').map((word: string) => (\n              isUrl(word)\n                ? (\n                  <LinkLabel\n                    className=\"sendbird-og-message-item-body__text-bubble__message\"\n                    key={uuidv4()}\n                    src={word}\n                    type={LabelTypography.BODY_1}\n                    color={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n                  >\n                    {word}\n                  </LinkLabel>\n                )\n                : (`${word} `)\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        </p>\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          width=\"320px\"\n          height=\"180px\"\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","_k","isByMe","_l","mouseHover","stringSet","useContext","LocalizationContext","openOGUrl","ogMetaData","url","window","open","React","getClassName","reactions","length","uuidv4","LabelTypography","BODY_1","LabelColors","ONCONTENT_1","ONBACKGROUND_1","split","map","word","isUrl","isEditedMessage","ONCONTENT_2","ONBACKGROUND_2","MESSAGE_EDITED","defaultImage","alt","IconTypes","THUMBNAIL_NONE","title","SUBTITLE_2","description","BODY_2","CAPTION_3"],"mappings":"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"}
+{"version":3,"file":"OGMessageItemBody.js","sources":["../../src/ui/OGMessageItemBody/index.tsx"],"sourcesContent":["import React, { ReactElement, useContext } from 'react';\nimport { UserMessage } from 'sendbird';\nimport './index.scss';\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}\n\nexport default function OGMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isMentionEnabled = 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  return (\n    <div className={getClassName([\n      className,\n      'sendbird-og-message-item-body',\n      isByMe ? 'outgoing' : 'incoming',\n      mouseHover ? 'mouse-hover' : '',\n      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        <p className=\"sendbird-og-message-item-body__text-bubble\">\n          {\n            isMessageMentioned\n              ? (\n                message?.mentionedMessageTemplate.split(' ').map((word: string) => (\n                  <Word\n                    key={uuidv4()}\n                    word={word}\n                    message={message}\n                    isByMe={isByMe}\n                  />\n                ))\n              )\n              : (\n                message?.message.split(' ').map((word: string) => (\n                  <Word\n                    key={uuidv4()}\n                    word={word}\n                    message={message}\n                    isByMe={isByMe}\n                  />\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        </p>\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          width=\"320px\"\n          height=\"180px\"\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","stringSet","useContext","LocalizationContext","openOGUrl","ogMetaData","url","window","open","isMessageMentioned","mentionedMessageTemplate","length","mentionedUsers","React","getClassName","reactions","uuidv4","LabelTypography","BODY_1","LabelColors","ONCONTENT_1","ONBACKGROUND_1","split","map","word","isEditedMessage","ONCONTENT_2","ONBACKGROUND_2","MESSAGE_EDITED","defaultImage","alt","IconTypes","THUMBNAIL_NONE","title","SUBTITLE_2","description","BODY_2","CAPTION_3"],"mappings":"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"}

package/ui/OpenChannelAdminMessage.js

@@ -1,9 +1,9 @@
-import { a as __spreadArray } from '../tslib.es6-e3c44017.js';
+import { a as __spreadArray } from '../tslib.es6-83aa13f5.js';
 import React__default from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-7a51bd16.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a611bd38.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
-import '../stringSet-4f6eaa60.js';
+import '../stringSet-91746bf1.js';
 
 function OpenChannelAdminMessage(_a) {
   var className = _a.className,

package/ui/OpenChannelAvatar.js

@@ -1,15 +1,15 @@
 import React__default, { useContext, useMemo } from 'react';
 import Avatar from './Avatar.js';
-import { a as LocalizationContext } from '../LocalizationContext-e4391013.js';
-import { b as getOpenChannelAvatar } from '../utils-08c4dbdc.js';
-import '../tslib.es6-e3c44017.js';
+import { a as LocalizationContext } from '../LocalizationContext-b021af8f.js';
+import { b as getOpenChannelAvatar } from '../utils-7d39b941.js';
+import '../tslib.es6-83aa13f5.js';
 import './ImageRenderer.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
 import './Icon.js';
-import '../uuid-b0c93400.js';
-import '../stringSet-4f6eaa60.js';
-import '../index-6ebf7894.js';
+import '../uuid-6d14d007.js';
+import '../stringSet-91746bf1.js';
+import '../index-353f13f3.js';
 
 function ChannelAvatar(_a) {
   var channel = _a.channel,

package/ui/OpenchannelConversationHeader.js

@@ -2,15 +2,15 @@ import React__default, { useContext } from 'react';
 import Avatar from './Avatar.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import IconButton from './IconButton.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-7a51bd16.js';
-import { a as LocalizationContext } from '../LocalizationContext-e4391013.js';
-import '../tslib.es6-e3c44017.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a611bd38.js';
+import { a as LocalizationContext } from '../LocalizationContext-b021af8f.js';
+import '../tslib.es6-83aa13f5.js';
 import './ImageRenderer.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
-import '../uuid-b0c93400.js';
-import '../stringSet-4f6eaa60.js';
-import '../index-6ebf7894.js';
+import '../uuid-6d14d007.js';
+import '../stringSet-91746bf1.js';
+import '../index-353f13f3.js';
 
 function OpenchannelConversationHeader(_a) {
   var coverImage = _a.coverImage,

package/ui/OpenchannelFileMessage.js

@@ -1,31 +1,31 @@
-import { a as __spreadArray } from '../tslib.es6-e3c44017.js';
+import { a as __spreadArray } from '../tslib.es6-83aa13f5.js';
 import React__default, { useRef, useContext } from 'react';
-import { f as format } from '../index-770d7112.js';
+import { f as format } from '../index-4a59a866.js';
 import Avatar from './Avatar.js';
 import ContextMenu, { MenuItems, MenuItem } from './ContextMenu.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-7a51bd16.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a611bd38.js';
 import Loader from './Loader.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import IconButton from './IconButton.js';
 import TextButton from './TextButton.js';
 import ConnectedUserProfile from './UserProfile.js';
-import { a as UserProfileContext } from '../UserProfileContext-865db5e6.js';
-import { u as useLocalization } from '../LocalizationContext-e4391013.js';
-import { c as checkIsByMe, g as getSenderFromMessage, s as showMenuTrigger, b as isFineResend, d as isFineDelete, e as checkIsPending, f as checkIsFailed } from '../openChannelUtils-56a372e7.js';
-import '../index-6ebf7894.js';
+import { a as UserProfileContext } from '../UserProfileContext-daa99f9b.js';
+import { u as useLocalization } from '../LocalizationContext-b021af8f.js';
+import { c as checkIsByMe, g as getSenderFromMessage, s as showMenuTrigger, b as isFineResend, d as isFineDelete, e as checkIsPending, f as checkIsFailed } from '../openChannelUtils-024b797a.js';
+import '../index-353f13f3.js';
 import './ImageRenderer.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
-import '../uuid-b0c93400.js';
-import '../index-8c72a94a.js';
+import '../uuid-6d14d007.js';
+import '../index-ad4c9e58.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../stringSet-4f6eaa60.js';
-import '../color-ee3fc5ee.js';
+import '../stringSet-91746bf1.js';
+import '../color-2863fbbe.js';
 import '../withSendBird.js';
 import '../sendBirdSelectors.js';
-import '../topics-9442035c.js';
-import '../index-acebc2ff.js';
+import '../topics-17d99dd6.js';
+import '../index-41a6f4f2.js';
 
 var checkFileType = function checkFileType(fileUrl) {
   var audioFile = /(\.mp3)$/i;

package/ui/OpenchannelOGMessage.js

@@ -1,31 +1,31 @@
-import { a as __spreadArray } from '../tslib.es6-e3c44017.js';
+import { a as __spreadArray } from '../tslib.es6-83aa13f5.js';
 import React__default, { useContext, useState, useRef, useMemo, useEffect } from 'react';
-import { f as format } from '../index-770d7112.js';
+import { f as format } from '../index-4a59a866.js';
 import Avatar from './Avatar.js';
 import ContextMenu, { MenuItems, MenuItem } from './ContextMenu.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import IconButton from './IconButton.js';
 import ImageRenderer from './ImageRenderer.js';
 import LinkLabel from './LinkLabel.js';
-import { a as LabelTypography, b as LabelColors, L as Label } from '../index-7a51bd16.js';
+import { a as LabelTypography, b as LabelColors, L as Label } from '../index-a611bd38.js';
 import Loader from './Loader.js';
 import ConnectedUserProfile from './UserProfile.js';
-import { a as UserProfileContext } from '../UserProfileContext-865db5e6.js';
-import { u as uuidv4 } from '../uuid-b0c93400.js';
-import { c as copyToClipboard } from '../utils-af1b9829.js';
-import { u as useLocalization } from '../LocalizationContext-e4391013.js';
-import { c as checkIsByMe, g as getSenderFromMessage, s as showMenuTrigger, i as isFineCopy, a as isFineEdit, b as isFineResend, d as isFineDelete, e as checkIsPending, f as checkIsFailed } from '../openChannelUtils-56a372e7.js';
-import '../index-6ebf7894.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import { a as UserProfileContext } from '../UserProfileContext-daa99f9b.js';
+import { u as uuidv4 } from '../uuid-6d14d007.js';
+import { c as copyToClipboard } from '../utils-5395ff17.js';
+import { u as useLocalization } from '../LocalizationContext-b021af8f.js';
+import { c as checkIsByMe, g as getSenderFromMessage, s as showMenuTrigger, i as isFineCopy, a as isFineEdit, b as isFineResend, d as isFineDelete, e as checkIsPending, f as checkIsFailed } from '../openChannelUtils-024b797a.js';
+import '../index-353f13f3.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
-import '../index-8c72a94a.js';
+import '../index-ad4c9e58.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../stringSet-4f6eaa60.js';
+import '../stringSet-91746bf1.js';
 import '../withSendBird.js';
 import '../sendBirdSelectors.js';
-import '../topics-9442035c.js';
-import '../index-acebc2ff.js';
+import '../topics-17d99dd6.js';
+import '../index-41a6f4f2.js';
 
 var URL_REG = /[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
 var createUrlTester = function createUrlTester(regexp) {

package/ui/OpenchannelThumbnailMessage.js

@@ -1,29 +1,29 @@
-import { a as __spreadArray } from '../tslib.es6-e3c44017.js';
+import { a as __spreadArray } from '../tslib.es6-83aa13f5.js';
 import React__default, { useContext, useState, useRef, useMemo, useEffect } from 'react';
-import { f as format } from '../index-770d7112.js';
-import { u as useLocalization } from '../LocalizationContext-e4391013.js';
+import { f as format } from '../index-4a59a866.js';
+import { u as useLocalization } from '../LocalizationContext-b021af8f.js';
 import Avatar from './Avatar.js';
 import ContextMenu, { MenuItems, MenuItem } from './ContextMenu.js';
 import Icon, { IconColors, IconTypes } from './Icon.js';
 import IconButton from './IconButton.js';
 import ImageRenderer from './ImageRenderer.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-7a51bd16.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a611bd38.js';
 import Loader from './Loader.js';
 import ConnectedUserProfile from './UserProfile.js';
-import { a as UserProfileContext } from '../UserProfileContext-865db5e6.js';
-import { c as checkIsByMe, g as getSenderFromMessage, s as showMenuTrigger, b as isFineResend, d as isFineDelete, h as checkIsSent, e as checkIsPending, f as checkIsFailed } from '../openChannelUtils-56a372e7.js';
-import '../index-6ebf7894.js';
-import '../stringSet-4f6eaa60.js';
-import '../uuid-b0c93400.js';
-import '../_rollupPluginBabelHelpers-20904f21.js';
+import { a as UserProfileContext } from '../UserProfileContext-daa99f9b.js';
+import { c as checkIsByMe, g as getSenderFromMessage, s as showMenuTrigger, b as isFineResend, d as isFineDelete, h as checkIsSent, e as checkIsPending, f as checkIsFailed } from '../openChannelUtils-024b797a.js';
+import '../index-353f13f3.js';
+import '../stringSet-91746bf1.js';
+import '../uuid-6d14d007.js';
+import '../_rollupPluginBabelHelpers-8e4fae98.js';
 import 'prop-types';
-import '../index-8c72a94a.js';
+import '../index-ad4c9e58.js';
 import 'react-dom';
 import './SortByRow.js';
 import '../withSendBird.js';
 import '../sendBirdSelectors.js';
-import '../topics-9442035c.js';
-import '../index-acebc2ff.js';
+import '../topics-17d99dd6.js';
+import '../index-41a6f4f2.js';
 
 var SUPPORTING_TYPES = {
   IMAGE: 'IMAGE',