@sendbird/uikit-react 3.6.8 → 3.6.9

package/cjs/ui/QuoteMessageInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"QuoteMessageInput.js","sources":["../../../src/ui/QuoteMessageInput/QuoteMessageThumbnail.tsx","../../../src/ui/QuoteMessageInput/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport type { FileMessage } from '@sendbird/chat/message';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport ImageRenderer from '../ImageRenderer';\nimport { isAudioMessage, isFileMessage, isImageMessage, isThumbnailMessage, isVoiceMessage } from '../../utils';\n\ninterface Props {\n  message: FileMessage;\n}\n\nconst componentClassname = 'sendbird-quote_message_input__avatar';\n\nexport default function QuoteMessageThumbnail({ message }: Props): ReactElement {\n  if (!isFileMessage(message) || isVoiceMessage(message)) {\n    return null;\n  }\n\n  const thumbnailUrl: string = (message.thumbnails && message.thumbnails.length > 0 && message.thumbnails[0].url)\n    || (isImageMessage(message) && message.url);\n  if (isThumbnailMessage(message) && thumbnailUrl) {\n    return (\n      <ImageRenderer\n        className={componentClassname}\n        url={thumbnailUrl}\n        alt={message.type}\n        width=\"44px\"\n        height=\"44px\"\n        fixedSize\n      />\n    );\n  } else if (isAudioMessage(message)) {\n    return (\n      <div className={componentClassname}>\n        <Icon\n          type={IconTypes.FILE_AUDIO}\n          fillColor={IconColors.ON_BACKGROUND_2}\n          width=\"24px\"\n          height=\"24px\"\n        />\n      </div>\n    );\n  } else {\n    return (\n      <div className={componentClassname}>\n        <Icon\n          type={IconTypes.FILE_DOCUMENT}\n          fillColor={IconColors.ON_BACKGROUND_2}\n          width=\"24px\"\n          height=\"24px\"\n        />\n      </div>\n    );\n  }\n}\n","import './index.scss';\n\nimport React, { ReactElement, useContext } from 'react';\nimport type { FileMessage, UserMessage } from '@sendbird/chat/message';\nimport {\n  getClassName,\n  getUIKitMessageType,\n  isFileMessage,\n  isGifMessage,\n  isImageMessage,\n  isUserMessage,\n  isVideoMessage,\n  isVoiceMessage, SendableMessageType,\n  UIKitMessageTypes,\n} from '../../utils';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\nimport QuoteMessageThumbnail from './QuoteMessageThumbnail';\n\ninterface Props {\n  className?: string | Array<string>;\n  replyingMessage: SendableMessageType;\n  onClose?: (message: SendableMessageType) => void;\n}\n\nexport default function QuoteMessageInput({\n  className,\n  replyingMessage,\n  onClose,\n}: Props): ReactElement {\n  const { stringSet } = useContext(LocalizationContext);\n  const fileMessage = replyingMessage as FileMessage;\n  const sender = (replyingMessage as SendableMessageType)?.sender;\n  const displayFileIcon = isFileMessage(replyingMessage) && !isVoiceMessage(replyingMessage as FileMessage);\n\n  return (\n    <div className={getClassName(['sendbird-quote_message_input', className])}>\n      {\n        displayFileIcon && (\n          <QuoteMessageThumbnail message={fileMessage} />\n        )\n      }\n      <div\n        className=\"sendbird-quote_message_input__body\"\n        style={{\n          width: `calc(100% - ${displayFileIcon ? '164px' : '120px'})`,\n          left: displayFileIcon ? '92px' : '40px',\n        }}\n      >\n        <Label\n          className=\"sendbird-quote_message_input__body__sender-name\"\n          type={LabelTypography.CAPTION_1}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {`${stringSet.QUOTE_MESSAGE_INPUT__REPLY_TO} ${(sender && sender.nickname) ? sender.nickname : stringSet.NO_NAME}`}\n        </Label>\n        <Label\n          className=\"sendbird-quote_message_input__body__message-content\"\n          type={LabelTypography.BODY_2}\n          color={LabelColors.ONBACKGROUND_3}\n        >\n          {isImageMessage(fileMessage) && !isGifMessage(fileMessage) && stringSet.QUOTE_MESSAGE_INPUT__FILE_TYPE_IMAGE}\n          {isVideoMessage(fileMessage) && stringSet.QUOTE_MESSAGE_INPUT__FILE_TYPE__VIDEO}\n          {isGifMessage(fileMessage) && stringSet.QUOTE_MESSAGE_INPUT__FILE_TYPE_GIF}\n          {isUserMessage(replyingMessage as UserMessage) && (replyingMessage as UserMessage).message}\n          {getUIKitMessageType(replyingMessage) === UIKitMessageTypes.FILE && fileMessage.name}\n          {isVoiceMessage(replyingMessage as FileMessage) && stringSet.VOICE_MESSAGE}\n        </Label>\n      </div>\n      <Icon\n        className=\"sendbird-quote_message_input__close-button\"\n        type={IconTypes.CLOSE}\n        fillColor={IconColors.ON_BACKGROUND_2}\n        width=\"24px\"\n        height=\"24px\"\n        onClick={() => onClose(replyingMessage)}\n      />\n    </div>\n  );\n}\n"],"names":["componentClassname","QuoteMessageThumbnail","_ref","message","isFileMessage","isVoiceMessage","thumbnailUrl","thumbnails","length","url","isImageMessage","isThumbnailMessage","React","createElement","ImageRenderer","className","alt","type","width","height","fixedSize","isAudioMessage","Icon","IconTypes","FILE_AUDIO","fillColor","IconColors","ON_BACKGROUND_2","FILE_DOCUMENT","QuoteMessageInput","replyingMessage","onClose","stringSet","useContext","LocalizationContext","fileMessage","sender","displayFileIcon","getClassName","style","left","Label","LabelTypography","CAPTION_1","color","LabelColors","ONBACKGROUND_1","QUOTE_MESSAGE_INPUT__REPLY_TO","nickname","NO_NAME","BODY_2","ONBACKGROUND_3","isGifMessage","QUOTE_MESSAGE_INPUT__FILE_TYPE_IMAGE","isVideoMessage","QUOTE_MESSAGE_INPUT__FILE_TYPE__VIDEO","QUOTE_MESSAGE_INPUT__FILE_TYPE_GIF","isUserMessage","getUIKitMessageType","UIKitMessageTypes","FILE","name","VOICE_MESSAGE","CLOSE","onClick"],"mappings":"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"}
+{"version":3,"file":"QuoteMessageInput.js","sources":["../../../src/ui/QuoteMessageInput/QuoteMessageThumbnail.tsx","../../../src/ui/QuoteMessageInput/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport type { FileMessage } from '@sendbird/chat/message';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport ImageRenderer from '../ImageRenderer';\nimport {\n  isAudioMessage,\n  isFileMessage, isImageFileInfo,\n  isImageMessage,\n  isMultipleFilesMessage,\n  isThumbnailMessage,\n  isVoiceMessage,\n} from '../../utils';\nimport { MultipleFilesMessage } from '@sendbird/chat/message';\nimport { getMessageFirstFileType, getMessageFirstFileUrl, getMessageFirstFileThumbnailUrl } from '../QuoteMessage/utils';\n\ninterface Props {\n  message: FileMessage | MultipleFilesMessage;\n}\n\nconst componentClassname = 'sendbird-quote_message_input__avatar';\n\nexport default function QuoteMessageThumbnail({ message }: Props): ReactElement {\n  if (!isFileMessage(message) && !isMultipleFilesMessage(message) || isVoiceMessage(message as FileMessage)) {\n    return null;\n  }\n  const thumbnailUrl: string = isFileMessage(message)\n    ? (getMessageFirstFileThumbnailUrl(message) || (isImageMessage(message as FileMessage) && getMessageFirstFileUrl(message)))\n    : (getMessageFirstFileThumbnailUrl(message)\n      || isImageFileInfo((message as MultipleFilesMessage).fileInfoList[0])\n      && getMessageFirstFileUrl(message));\n  if ((isThumbnailMessage(message) || isMultipleFilesMessage(message)) && thumbnailUrl) {\n    return (\n      <ImageRenderer\n        className={componentClassname}\n        url={thumbnailUrl}\n        alt={getMessageFirstFileType(message)}\n        width=\"44px\"\n        height=\"44px\"\n        fixedSize\n      />\n    );\n  } else if (isAudioMessage(message as FileMessage)) {\n    return (\n      <div className={componentClassname}>\n        <Icon\n          type={IconTypes.FILE_AUDIO}\n          fillColor={IconColors.ON_BACKGROUND_2}\n          width=\"24px\"\n          height=\"24px\"\n        />\n      </div>\n    );\n  } else {\n    return (\n      <div className={componentClassname}>\n        <Icon\n          type={IconTypes.FILE_DOCUMENT}\n          fillColor={IconColors.ON_BACKGROUND_2}\n          width=\"24px\"\n          height=\"24px\"\n        />\n      </div>\n    );\n  }\n}\n","import './index.scss';\n\nimport React, { ReactElement, useContext } from 'react';\nimport type { FileMessage, UserMessage } from '@sendbird/chat/message';\nimport {\n  CoreMessageType,\n  getClassName,\n  getUIKitMessageType,\n  isFileMessage,\n  isGifMessage,\n  isImageMessage,\n  isMultipleFilesMessage,\n  isUserMessage,\n  isVideoMessage,\n  isVoiceMessage, SendableMessageType,\n  UIKitMessageTypes,\n} from '../../utils';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\nimport QuoteMessageThumbnail from './QuoteMessageThumbnail';\nimport { getMessageFirstFileName } from '../QuoteMessage/utils';\nimport { MultipleFilesMessage } from '@sendbird/chat/message';\n\ninterface Props {\n  className?: string | Array<string>;\n  replyingMessage: SendableMessageType;\n  onClose?: (message: SendableMessageType) => void;\n}\n\nexport default function QuoteMessageInput({\n  className,\n  replyingMessage,\n  onClose,\n}: Props): ReactElement {\n  const { stringSet } = useContext(LocalizationContext);\n  const fileMessage = replyingMessage as FileMessage | MultipleFilesMessage;\n  const sender = (replyingMessage as SendableMessageType)?.sender;\n  const displayFileIcon = (isFileMessage(replyingMessage) || isMultipleFilesMessage(replyingMessage))\n    && !isVoiceMessage(replyingMessage as FileMessage);\n\n  return (\n    <div className={getClassName(['sendbird-quote_message_input', className])}>\n      {\n        displayFileIcon && (\n          <QuoteMessageThumbnail message={fileMessage} />\n        )\n      }\n      <div\n        className=\"sendbird-quote_message_input__body\"\n        style={{\n          width: `calc(100% - ${displayFileIcon ? '164px' : '120px'})`,\n          left: displayFileIcon ? '92px' : '40px',\n        }}\n      >\n        <Label\n          className=\"sendbird-quote_message_input__body__sender-name\"\n          type={LabelTypography.CAPTION_1}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {`${stringSet.QUOTE_MESSAGE_INPUT__REPLY_TO} ${(sender && sender.nickname) ? sender.nickname : stringSet.NO_NAME}`}\n        </Label>\n        <Label\n          className=\"sendbird-quote_message_input__body__message-content\"\n          type={LabelTypography.BODY_2}\n          color={LabelColors.ONBACKGROUND_3}\n        >\n          {isImageMessage(fileMessage) && !isGifMessage(fileMessage) && stringSet.QUOTE_MESSAGE_INPUT__FILE_TYPE_IMAGE}\n          {isVideoMessage(fileMessage) && stringSet.QUOTE_MESSAGE_INPUT__FILE_TYPE__VIDEO}\n          {isGifMessage(fileMessage) && stringSet.QUOTE_MESSAGE_INPUT__FILE_TYPE_GIF}\n          {isUserMessage(replyingMessage as UserMessage) && (replyingMessage as UserMessage).message}\n          {getUIKitMessageType(replyingMessage) === UIKitMessageTypes.FILE && getMessageFirstFileName(fileMessage)}\n          {isMultipleFilesMessage(replyingMessage as CoreMessageType) && getMessageFirstFileName(fileMessage)}\n          {isVoiceMessage(replyingMessage as FileMessage) && stringSet.VOICE_MESSAGE}\n        </Label>\n      </div>\n      <Icon\n        className=\"sendbird-quote_message_input__close-button\"\n        type={IconTypes.CLOSE}\n        fillColor={IconColors.ON_BACKGROUND_2}\n        width=\"24px\"\n        height=\"24px\"\n        onClick={() => onClose(replyingMessage)}\n      />\n    </div>\n  );\n}\n"],"names":["componentClassname","QuoteMessageThumbnail","_ref","message","isFileMessage","isMultipleFilesMessage","isVoiceMessage","thumbnailUrl","getMessageFirstFileThumbnailUrl","isImageMessage","getMessageFirstFileUrl","isImageFileInfo","fileInfoList","isThumbnailMessage","React","createElement","ImageRenderer","className","url","alt","getMessageFirstFileType","width","height","fixedSize","isAudioMessage","Icon","type","IconTypes","FILE_AUDIO","fillColor","IconColors","ON_BACKGROUND_2","FILE_DOCUMENT","QuoteMessageInput","replyingMessage","onClose","stringSet","useContext","LocalizationContext","fileMessage","sender","displayFileIcon","getClassName","style","left","Label","LabelTypography","CAPTION_1","color","LabelColors","ONBACKGROUND_1","QUOTE_MESSAGE_INPUT__REPLY_TO","nickname","NO_NAME","BODY_2","ONBACKGROUND_3","isGifMessage","QUOTE_MESSAGE_INPUT__FILE_TYPE_IMAGE","isVideoMessage","QUOTE_MESSAGE_INPUT__FILE_TYPE__VIDEO","QUOTE_MESSAGE_INPUT__FILE_TYPE_GIF","isUserMessage","getUIKitMessageType","UIKitMessageTypes","FILE","getMessageFirstFileName","VOICE_MESSAGE","CLOSE","onClick"],"mappings":"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"}

package/cjs/ui/ReactionBadge.js

@@ -1,9 +1,9 @@
 'use strict';
 
 var React = require('react');
-var ui_Label = require('../index-4eb2a000.js');
+var ui_Label = require('../index-f40c4cf0.js');
 require('prop-types');
-require('../stringSet-dbdeec9c.js');
+require('../stringSet-b75b75ae.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/cjs/ui/ReactionButton.js

@@ -1,10 +1,10 @@
 'use strict';
 
-var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-117c3ffb.js');
+var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-a85bd364.js');
 var React = require('react');
-var useLongPress = require('../useLongPress-e7c92bb0.js');
-var utils = require('../utils-c2f38151.js');
-require('../MediaQueryContext-a5c77095.js');
+var useLongPress = require('../useLongPress-49aa9a49.js');
+var utils = require('../utils-8958cb75.js');
+require('../MediaQueryContext-ca045060.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/cjs/ui/SortByRow.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var uuid = require('../uuid-b2882230.js');
+var uuid = require('../uuid-34728ced.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/cjs/ui/TextButton.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var color = require('../color-a057a4c2.js');
+var color = require('../color-2f1198fc.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/cjs/ui/TextMessageItemBody.js

@@ -1,29 +1,29 @@
 'use strict';
 
 var React = require('react');
-var ui_Label = require('../index-4eb2a000.js');
-var index = require('../index-0599b6f2.js');
-var LocalizationContext = require('../LocalizationContext-9c99457f.js');
-var tokenize = require('../tokenize-7204c391.js');
-var index$1 = require('../index-dc15cf44.js');
-var consts = require('../consts-3afe4fa8.js');
+var ui_Label = require('../index-f40c4cf0.js');
+var index = require('../index-613acaa0.js');
+var LocalizationContext = require('../LocalizationContext-eb7a59da.js');
+var tokenize = require('../tokenize-42536b7a.js');
+var index$1 = require('../index-0f229ac7.js');
+var consts = require('../consts-c5d38c32.js');
 require('prop-types');
-require('../stringSet-dbdeec9c.js');
-require('../_rollupPluginBabelHelpers-117c3ffb.js');
+require('../stringSet-b75b75ae.js');
+require('../_rollupPluginBabelHelpers-a85bd364.js');
 require('../utils/message/getOutgoingMessageState.js');
-require('../index-ba4dea0c.js');
-require('../index.module-2c2cf337.js');
+require('../index.module-5c951066.js');
+require('../index-c9a4a555.js');
 require('../Message/context.js');
 require('./MentionLabel.js');
 require('./ContextMenu.js');
 require('react-dom');
 require('./SortByRow.js');
-require('../uuid-b2882230.js');
+require('../uuid-34728ced.js');
 require('./UserProfile.js');
-require('../UserProfileContext-1f226141.js');
+require('../UserProfileContext-abe57718.js');
 require('../sendbirdSelectors.js');
-require('../topics-c495cb3a.js');
-require('../utils-c2f38151.js');
+require('../topics-2c35cfd7.js');
+require('../utils-8958cb75.js');
 require('./Avatar.js');
 require('./ImageRenderer.js');
 require('./Icon.js');

package/cjs/ui/ThreadReplies.js

@@ -3,13 +3,13 @@
 var React = require('react');
 var ui_Avatar = require('./Avatar.js');
 var ui_Icon = require('./Icon.js');
-var ui_Label = require('../index-4eb2a000.js');
-var LocalizationContext = require('../LocalizationContext-9c99457f.js');
-var uuid = require('../uuid-b2882230.js');
+var ui_Label = require('../index-f40c4cf0.js');
+var LocalizationContext = require('../LocalizationContext-eb7a59da.js');
+var uuid = require('../uuid-34728ced.js');
 require('./ImageRenderer.js');
 require('prop-types');
-require('../stringSet-dbdeec9c.js');
-require('../index-ba4dea0c.js');
+require('../stringSet-b75b75ae.js');
+require('../index-c9a4a555.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/cjs/ui/ThumbnailMessageItemBody.js

@@ -1,38 +1,37 @@
 'use strict';
 
-var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-117c3ffb.js');
+var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-a85bd364.js');
 var React = require('react');
 var ui_Icon = require('./Icon.js');
 var ui_ImageRenderer = require('./ImageRenderer.js');
-var index = require('../index-0599b6f2.js');
-var utils = require('../utils-c2f38151.js');
-var useLongPress = require('../useLongPress-e7c92bb0.js');
+var index = require('../index-613acaa0.js');
+var utils$1 = require('../utils-8958cb75.js');
+var useLongPress = require('../useLongPress-49aa9a49.js');
+var utils = require('../utils-d6285655.js');
 require('prop-types');
 require('../utils/message/getOutgoingMessageState.js');
-require('../MediaQueryContext-a5c77095.js');
+require('../index.module-5c951066.js');
+require('../MediaQueryContext-ca045060.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 function ThumbnailMessageItemBody(_ref) {
-  var _thumbnails$, _message$reactions$le, _message$reactions;
+  var _message$reactions$le, _message$reactions;
   let {
     className = '',
     message,
     isByMe = false,
     mouseHover = false,
     isReactionEnabled = false,
-    showFileViewer = utils.noop,
+    showFileViewer = utils$1.noop,
     style = {}
   } = _ref;
-  const {
-    thumbnails = []
-  } = message;
-  const thumbnailUrl = thumbnails.length > 0 ? (_thumbnails$ = thumbnails[0]) === null || _thumbnails$ === void 0 ? void 0 : _thumbnails$.url : '';
+  const thumbnailUrl = utils.getMessageFirstFileThumbnailUrl(message);
   const [imageRendered, setImageRendered] = React.useState(false);
   const onClickHandler = useLongPress.useLongPress({
-    onLongPress: utils.noop,
+    onLongPress: utils$1.noop,
     onClick: () => {
       if (index.isSentMessage(message)) {
         showFileViewer === null || showFileViewer === void 0 ? void 0 : showFileViewer(true);
@@ -43,8 +42,8 @@ function ThumbnailMessageItemBody(_ref) {
     className: index.getClassName([className, 'sendbird-thumbnail-message-item-body', isByMe ? 'outgoing' : 'incoming', mouseHover ? 'mouse-hover' : '', isReactionEnabled && ((_message$reactions$le = (_message$reactions = message.reactions) === null || _message$reactions === void 0 ? void 0 : _message$reactions.length) !== null && _message$reactions$le !== void 0 ? _message$reactions$le : 0) > 0 ? 'reactions' : ''])
   }, onClickHandler), /*#__PURE__*/React__default["default"].createElement(ui_ImageRenderer["default"], {
     className: "sendbird-thumbnail-message-item-body__thumbnail",
-    url: thumbnailUrl || (message === null || message === void 0 ? void 0 : message.url),
-    alt: message === null || message === void 0 ? void 0 : message.type,
+    url: thumbnailUrl || utils.getMessageFirstFileUrl(message),
+    alt: utils.getMessageFirstFileType(message),
     width: (style === null || style === void 0 ? void 0 : style.width) || '360px',
     height: (style === null || style === void 0 ? void 0 : style.height) || '270px',
     onLoad: () => {
@@ -57,8 +56,8 @@ function ThumbnailMessageItemBody(_ref) {
   }), index.isVideoMessage(message) && !thumbnailUrl && !imageRendered && /*#__PURE__*/React__default["default"].createElement("video", {
     className: "sendbird-thumbnail-message-item-body__video"
   }, /*#__PURE__*/React__default["default"].createElement("source", {
-    src: message === null || message === void 0 ? void 0 : message.url,
-    type: message === null || message === void 0 ? void 0 : message.type
+    src: utils.getMessageFirstFileUrl(message),
+    type: utils.getMessageFirstFileType(message)
   })), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-thumbnail-message-item-body__image-cover"
   }), (index.isVideoMessage(message) || index.isGifMessage(message)) && /*#__PURE__*/React__default["default"].createElement("div", {
@@ -67,7 +66,7 @@ function ThumbnailMessageItemBody(_ref) {
     className: "sendbird-thumbnail-message-item-body__icon-wrapper__icon"
   }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
     type: index.isVideoMessage(message) ? ui_Icon.IconTypes.PLAY : ui_Icon.IconTypes.GIF,
-    fillColor: ui_Icon.IconColors.GRAY,
+    fillColor: ui_Icon.IconColors.THUMBNAIL_ICON,
     width: "34px",
     height: "34px"
   }))));

package/cjs/ui/ThumbnailMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThumbnailMessageItemBody.js","sources":["../../../src/ui/ThumbnailMessageItemBody/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement, useState } from 'react';\nimport type { FileMessage } from '@sendbird/chat/message';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport ImageRenderer from '../ImageRenderer';\nimport { getClassName, isGifMessage, isSentMessage, isVideoMessage } from '../../utils';\nimport { noop } from '../../utils/utils';\nimport useLongPress from '../../hooks/useLongPress';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: FileMessage;\n  isByMe?: boolean;\n  mouseHover?: boolean;\n  isReactionEnabled?: boolean;\n  showFileViewer?: (bool: boolean) => void;\n  style?: Record<string, any>;\n}\n\nexport default function ThumbnailMessageItemBody({\n  className = '',\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isReactionEnabled = false,\n  showFileViewer = noop,\n  style = {},\n}: Props): ReactElement {\n  const { thumbnails = [] } = message;\n  const thumbnailUrl: string = thumbnails.length > 0 ? thumbnails[0]?.url : '';\n  const [imageRendered, setImageRendered] = useState(false);\n\n  const onClickHandler = useLongPress({\n    onLongPress: noop,\n    onClick: () => {\n      if (isSentMessage(message)) {\n        showFileViewer?.(true);\n      }\n    },\n  });\n\n  return (\n    <div\n      className={getClassName([\n        className,\n        'sendbird-thumbnail-message-item-body',\n        isByMe ? 'outgoing' : 'incoming',\n        mouseHover ? 'mouse-hover' : '',\n        (isReactionEnabled && (message.reactions?.length ?? 0) > 0) ? 'reactions' : '',\n      ])}\n      {...onClickHandler}\n    >\n      <ImageRenderer\n        className=\"sendbird-thumbnail-message-item-body__thumbnail\"\n        url={thumbnailUrl || message?.url}\n        alt={message?.type}\n        width={style?.width || '360px'}\n        height={style?.height || '270px'}\n        onLoad={() => { setImageRendered(true); }}\n        placeHolder={(style_: Record<string, any>) => (\n          <div\n            className=\"sendbird-thumbnail-message-item-body__placeholder\"\n            style={style_}\n          />\n        )}\n      />\n      {\n        (isVideoMessage(message) && !thumbnailUrl) && !imageRendered && (\n          <video className=\"sendbird-thumbnail-message-item-body__video\">\n            <source src={message?.url} type={message?.type} />\n          </video>\n        )\n      }\n      <div className=\"sendbird-thumbnail-message-item-body__image-cover\" />\n      {\n        (isVideoMessage(message) || isGifMessage(message)) && (\n          <div className=\"sendbird-thumbnail-message-item-body__icon-wrapper\">\n            <div className=\"sendbird-thumbnail-message-item-body__icon-wrapper__icon\">\n              <Icon\n                type={isVideoMessage(message) ? IconTypes.PLAY : IconTypes.GIF}\n                fillColor={IconColors.GRAY}\n                width=\"34px\"\n                height=\"34px\"\n              />\n            </div>\n          </div>\n        )\n      }\n    </div>\n  );\n}\n"],"names":["ThumbnailMessageItemBody","_ref","_thumbnails$","_message$reactions$le","_message$reactions","className","message","isByMe","mouseHover","isReactionEnabled","showFileViewer","noop","style","thumbnails","thumbnailUrl","length","url","imageRendered","setImageRendered","useState","onClickHandler","useLongPress","onLongPress","onClick","isSentMessage","React","createElement","_extends","getClassName","reactions","ImageRenderer","alt","type","width","height","onLoad","placeHolder","style_","isVideoMessage","src","isGifMessage","Icon","IconTypes","PLAY","GIF","fillColor","IconColors","GRAY"],"mappings":"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"}
+{"version":3,"file":"ThumbnailMessageItemBody.js","sources":["../../../src/ui/ThumbnailMessageItemBody/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement, useState } from 'react';\nimport type { FileMessage } from '@sendbird/chat/message';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport ImageRenderer from '../ImageRenderer';\nimport { getClassName, isGifMessage, isSentMessage, isVideoMessage } from '../../utils';\nimport { noop } from '../../utils/utils';\nimport useLongPress from '../../hooks/useLongPress';\nimport { MultipleFilesMessage } from '@sendbird/chat/message';\nimport { getMessageFirstFileType, getMessageFirstFileUrl, getMessageFirstFileThumbnailUrl } from '../QuoteMessage/utils';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: FileMessage | MultipleFilesMessage;\n  isByMe?: boolean;\n  mouseHover?: boolean;\n  isReactionEnabled?: boolean;\n  showFileViewer?: (bool: boolean) => void;\n  style?: Record<string, any>;\n}\n\nexport default function ThumbnailMessageItemBody({\n  className = '',\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isReactionEnabled = false,\n  showFileViewer = noop,\n  style = {},\n}: Props): ReactElement {\n  const thumbnailUrl: string = getMessageFirstFileThumbnailUrl(message);\n  const [imageRendered, setImageRendered] = useState(false);\n\n  const onClickHandler = useLongPress({\n    onLongPress: noop,\n    onClick: () => {\n      if (isSentMessage(message)) {\n        showFileViewer?.(true);\n      }\n    },\n  });\n\n  return (\n    <div\n      className={getClassName([\n        className,\n        'sendbird-thumbnail-message-item-body',\n        isByMe ? 'outgoing' : 'incoming',\n        mouseHover ? 'mouse-hover' : '',\n        (isReactionEnabled && (message.reactions?.length ?? 0) > 0) ? 'reactions' : '',\n      ])}\n      {...onClickHandler}\n    >\n      <ImageRenderer\n        className=\"sendbird-thumbnail-message-item-body__thumbnail\"\n        url={thumbnailUrl || getMessageFirstFileUrl(message)}\n        alt={getMessageFirstFileType(message)}\n        width={style?.width || '360px'}\n        height={style?.height || '270px'}\n        onLoad={() => { setImageRendered(true); }}\n        placeHolder={(style_: Record<string, any>) => (\n          <div\n            className=\"sendbird-thumbnail-message-item-body__placeholder\"\n            style={style_}\n          />\n        )}\n      />\n      {\n        (isVideoMessage(message) && !thumbnailUrl) && !imageRendered && (\n          <video className=\"sendbird-thumbnail-message-item-body__video\">\n            <source src={getMessageFirstFileUrl(message)} type={getMessageFirstFileType(message)} />\n          </video>\n        )\n      }\n      <div className=\"sendbird-thumbnail-message-item-body__image-cover\" />\n      {\n        (isVideoMessage(message) || isGifMessage(message)) && (\n          <div className=\"sendbird-thumbnail-message-item-body__icon-wrapper\">\n            <div className=\"sendbird-thumbnail-message-item-body__icon-wrapper__icon\">\n              <Icon\n                type={isVideoMessage(message) ? IconTypes.PLAY : IconTypes.GIF}\n                fillColor={IconColors.THUMBNAIL_ICON}\n                width=\"34px\"\n                height=\"34px\"\n              />\n            </div>\n          </div>\n        )\n      }\n    </div>\n  );\n}\n"],"names":["ThumbnailMessageItemBody","_ref","_message$reactions$le","_message$reactions","className","message","isByMe","mouseHover","isReactionEnabled","showFileViewer","noop","style","thumbnailUrl","getMessageFirstFileThumbnailUrl","imageRendered","setImageRendered","useState","onClickHandler","useLongPress","onLongPress","onClick","isSentMessage","React","createElement","_extends","getClassName","reactions","length","ImageRenderer","url","getMessageFirstFileUrl","alt","getMessageFirstFileType","width","height","onLoad","placeHolder","style_","isVideoMessage","src","type","isGifMessage","Icon","IconTypes","PLAY","GIF","fillColor","IconColors","THUMBNAIL_ICON"],"mappings":"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"}

package/cjs/ui/Toggle.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-117c3ffb.js');
+var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-a85bd364.js');
 var useSendbirdStateContext = require('../useSendbirdStateContext.js');
 require('../withSendbird.js');
 

package/cjs/ui/Tooltip.js

@@ -1,9 +1,9 @@
 'use strict';
 
 var React = require('react');
-var ui_Label = require('../index-4eb2a000.js');
+var ui_Label = require('../index-f40c4cf0.js');
 require('prop-types');
-require('../stringSet-dbdeec9c.js');
+require('../stringSet-b75b75ae.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/cjs/ui/UnknownMessageItemBody.js

@@ -1,14 +1,15 @@
 'use strict';
 
 var React = require('react');
-var ui_Label = require('../index-4eb2a000.js');
-var index = require('../index-0599b6f2.js');
-var LocalizationContext = require('../LocalizationContext-9c99457f.js');
+var ui_Label = require('../index-f40c4cf0.js');
+var index = require('../index-613acaa0.js');
+var LocalizationContext = require('../LocalizationContext-eb7a59da.js');
 require('prop-types');
-require('../stringSet-dbdeec9c.js');
-require('../_rollupPluginBabelHelpers-117c3ffb.js');
+require('../stringSet-b75b75ae.js');
+require('../_rollupPluginBabelHelpers-a85bd364.js');
 require('../utils/message/getOutgoingMessageState.js');
-require('../index-ba4dea0c.js');
+require('../index.module-5c951066.js');
+require('../index-c9a4a555.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/cjs/ui/UnknownMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"UnknownMessageItemBody.js","sources":["../../../src/ui/UnknownMessageItemBody/index.tsx"],"sourcesContent":["import React, { ReactElement, useContext } from 'react';\nimport './index.scss';\n\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { getClassName } from '../../utils';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport { BaseMessage } from '@sendbird/chat/message';\n\ninterface Props {\n  className?: string | Array<string>;\n  isByMe?: boolean;\n  message: BaseMessage;\n  mouseHover?: boolean;\n  isReactionEnabled?: boolean;\n}\n\nexport default function UnknownMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isReactionEnabled = false,\n}: Props): ReactElement {\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div className={getClassName([\n      className,\n      'sendbird-unknown-message-item-body',\n      isByMe ? 'outgoing' : 'incoming',\n      mouseHover ? 'mouse-hover' : '',\n      (isReactionEnabled && message?.reactions?.length > 0) ? 'reactions' : '',\n    ])}>\n      <Label\n        className=\"sendbird-unknown-message-item-body__header\"\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n      >\n        {stringSet.UNKNOWN__UNKNOWN_MESSAGE_TYPE}\n      </Label>\n      <Label\n        className=\"sendbird-unknown-message-item-body__description\"\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_2 : LabelColors.ONBACKGROUND_2}\n      >\n        {stringSet.UNKNOWN__CANNOT_READ_MESSAGE}\n      </Label>\n    </div>\n  );\n}\n"],"names":["UnknownMessageItemBody","_ref","_message$reactions","className","message","isByMe","mouseHover","isReactionEnabled","stringSet","useContext","LocalizationContext","React","createElement","getClassName","reactions","length","Label","type","LabelTypography","BODY_1","color","LabelColors","ONCONTENT_1","ONBACKGROUND_1","UNKNOWN__UNKNOWN_MESSAGE_TYPE","ONCONTENT_2","ONBACKGROUND_2","UNKNOWN__CANNOT_READ_MESSAGE"],"mappings":";;;;;;;;;;;;;;;;AAgBe,SAASA,sBAAsBA,CAAAC,IAAA,EAMtB;AAAA,EAAA,IAAAC,kBAAA,CAAA;EAAA,IANuB;IAC7CC,SAAS;IACTC,OAAO;AACPC,IAAAA,MAAM,GAAG,KAAK;AACdC,IAAAA,UAAU,GAAG,KAAK;AAClBC,IAAAA,iBAAiB,GAAG,KAAA;AACf,GAAC,GAAAN,IAAA,CAAA;EACN,MAAM;AAAEO,IAAAA,SAAAA;AAAU,GAAC,GAAGC,gBAAU,CAACC,uCAAmB,CAAC,CAAA;EACrD,oBACEC,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAKT,SAAS,EAAEU,kBAAY,CAAC,CAC3BV,SAAS,EACT,oCAAoC,EACpCE,MAAM,GAAG,UAAU,GAAG,UAAU,EAChCC,UAAU,GAAG,aAAa,GAAG,EAAE,EAC9BC,iBAAiB,IAAI,CAAAH,OAAO,KAAA,IAAA,IAAPA,OAAO,KAAAF,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,CAAAA,kBAAA,GAAPE,OAAO,CAAEU,SAAS,MAAAZ,IAAAA,IAAAA,kBAAA,uBAAlBA,kBAAA,CAAoBa,MAAM,IAAG,CAAC,GAAI,WAAW,GAAG,EAAE,CACzE,CAAA;AAAE,GAAA,eACDJ,yBAAA,CAAAC,aAAA,CAACI,cAAK,EAAA;AACJb,IAAAA,SAAS,EAAC,4CAA4C;IACtDc,IAAI,EAAEC,wBAAe,CAACC,MAAO;IAC7BC,KAAK,EAAEf,MAAM,GAAGgB,oBAAW,CAACC,WAAW,GAAGD,oBAAW,CAACE,cAAAA;GAErDf,EAAAA,SAAS,CAACgB,6BAA6B,CAClC,eACRb,yBAAA,CAAAC,aAAA,CAACI,cAAK,EAAA;AACJb,IAAAA,SAAS,EAAC,iDAAiD;IAC3Dc,IAAI,EAAEC,wBAAe,CAACC,MAAO;IAC7BC,KAAK,EAAEf,MAAM,GAAGgB,oBAAW,CAACI,WAAW,GAAGJ,oBAAW,CAACK,cAAAA;AAAe,GAAA,EAEpElB,SAAS,CAACmB,4BAA4B,CACjC,CACJ,CAAA;AAEV;;;;"}
+{"version":3,"file":"UnknownMessageItemBody.js","sources":["../../../src/ui/UnknownMessageItemBody/index.tsx"],"sourcesContent":["import React, { ReactElement, useContext } from 'react';\nimport './index.scss';\n\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { getClassName } from '../../utils';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport { BaseMessage } from '@sendbird/chat/message';\n\ninterface Props {\n  className?: string | Array<string>;\n  isByMe?: boolean;\n  message: BaseMessage;\n  mouseHover?: boolean;\n  isReactionEnabled?: boolean;\n}\n\nexport default function UnknownMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isReactionEnabled = false,\n}: Props): ReactElement {\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div className={getClassName([\n      className,\n      'sendbird-unknown-message-item-body',\n      isByMe ? 'outgoing' : 'incoming',\n      mouseHover ? 'mouse-hover' : '',\n      (isReactionEnabled && message?.reactions?.length > 0) ? 'reactions' : '',\n    ])}>\n      <Label\n        className=\"sendbird-unknown-message-item-body__header\"\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n      >\n        {stringSet.UNKNOWN__UNKNOWN_MESSAGE_TYPE}\n      </Label>\n      <Label\n        className=\"sendbird-unknown-message-item-body__description\"\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_2 : LabelColors.ONBACKGROUND_2}\n      >\n        {stringSet.UNKNOWN__CANNOT_READ_MESSAGE}\n      </Label>\n    </div>\n  );\n}\n"],"names":["UnknownMessageItemBody","_ref","_message$reactions","className","message","isByMe","mouseHover","isReactionEnabled","stringSet","useContext","LocalizationContext","React","createElement","getClassName","reactions","length","Label","type","LabelTypography","BODY_1","color","LabelColors","ONCONTENT_1","ONBACKGROUND_1","UNKNOWN__UNKNOWN_MESSAGE_TYPE","ONCONTENT_2","ONBACKGROUND_2","UNKNOWN__CANNOT_READ_MESSAGE"],"mappings":";;;;;;;;;;;;;;;;;AAgBe,SAASA,sBAAsBA,CAAAC,IAAA,EAMtB;AAAA,EAAA,IAAAC,kBAAA,CAAA;EAAA,IANuB;IAC7CC,SAAS;IACTC,OAAO;AACPC,IAAAA,MAAM,GAAG,KAAK;AACdC,IAAAA,UAAU,GAAG,KAAK;AAClBC,IAAAA,iBAAiB,GAAG,KAAA;AACf,GAAC,GAAAN,IAAA,CAAA;EACN,MAAM;AAAEO,IAAAA,SAAAA;AAAU,GAAC,GAAGC,gBAAU,CAACC,uCAAmB,CAAC,CAAA;EACrD,oBACEC,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAKT,SAAS,EAAEU,kBAAY,CAAC,CAC3BV,SAAS,EACT,oCAAoC,EACpCE,MAAM,GAAG,UAAU,GAAG,UAAU,EAChCC,UAAU,GAAG,aAAa,GAAG,EAAE,EAC9BC,iBAAiB,IAAI,CAAAH,OAAO,KAAA,IAAA,IAAPA,OAAO,KAAAF,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,CAAAA,kBAAA,GAAPE,OAAO,CAAEU,SAAS,MAAAZ,IAAAA,IAAAA,kBAAA,uBAAlBA,kBAAA,CAAoBa,MAAM,IAAG,CAAC,GAAI,WAAW,GAAG,EAAE,CACzE,CAAA;AAAE,GAAA,eACDJ,yBAAA,CAAAC,aAAA,CAACI,cAAK,EAAA;AACJb,IAAAA,SAAS,EAAC,4CAA4C;IACtDc,IAAI,EAAEC,wBAAe,CAACC,MAAO;IAC7BC,KAAK,EAAEf,MAAM,GAAGgB,oBAAW,CAACC,WAAW,GAAGD,oBAAW,CAACE,cAAAA;GAErDf,EAAAA,SAAS,CAACgB,6BAA6B,CAClC,eACRb,yBAAA,CAAAC,aAAA,CAACI,cAAK,EAAA;AACJb,IAAAA,SAAS,EAAC,iDAAiD;IAC3Dc,IAAI,EAAEC,wBAAe,CAACC,MAAO;IAC7BC,KAAK,EAAEf,MAAM,GAAGgB,oBAAW,CAACI,WAAW,GAAGJ,oBAAW,CAACK,cAAAA;AAAe,GAAA,EAEpElB,SAAS,CAACmB,4BAA4B,CACjC,CACJ,CAAA;AAEV;;;;"}

package/cjs/ui/UserListItem.js

@@ -1,31 +1,32 @@
 'use strict';
 
 var React = require('react');
-var UserProfileContext = require('../UserProfileContext-1f226141.js');
-var LocalizationContext = require('../LocalizationContext-9c99457f.js');
+var UserProfileContext = require('../UserProfileContext-abe57718.js');
+var LocalizationContext = require('../LocalizationContext-eb7a59da.js');
 var ui_Avatar = require('./Avatar.js');
 var ui_MutedAvatarOverlay = require('./MutedAvatarOverlay.js');
 var ui_Checkbox = require('./Checkbox.js');
 var ui_UserProfile = require('./UserProfile.js');
 var ui_ContextMenu = require('./ContextMenu.js');
-var ui_Label = require('../index-4eb2a000.js');
+var ui_Label = require('../index-f40c4cf0.js');
 require('prop-types');
-require('../stringSet-dbdeec9c.js');
-require('../index-ba4dea0c.js');
+require('../stringSet-b75b75ae.js');
+require('../index-c9a4a555.js');
 require('./ImageRenderer.js');
 require('./Icon.js');
-require('../uuid-b2882230.js');
+require('../uuid-34728ced.js');
 require('../sendbirdSelectors.js');
-require('../_rollupPluginBabelHelpers-117c3ffb.js');
-require('../topics-c495cb3a.js');
-require('../utils-c2f38151.js');
+require('../_rollupPluginBabelHelpers-a85bd364.js');
+require('../topics-2c35cfd7.js');
+require('../utils-8958cb75.js');
 require('./Button.js');
 require('../useSendbirdStateContext.js');
 require('../withSendbird.js');
 require('react-dom');
 require('./SortByRow.js');
-require('../index-0599b6f2.js');
+require('../index-613acaa0.js');
 require('../utils/message/getOutgoingMessageState.js');
+require('../index.module-5c951066.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 

package/cjs/ui/UserListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserListItem.js","sources":["../../../src/ui/UserListItem/index.tsx"],"sourcesContent":["import React, { ChangeEvent, MutableRefObject, ReactElement, useContext } from 'react';\nimport { User } from '@sendbird/chat';\nimport { Member } from '@sendbird/chat/groupChannel';\nimport './index.scss';\n\nimport { UserProfileContext } from '../../lib/UserProfileContext';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport Avatar from '../Avatar/index';\nimport MutedAvatarOverlay from '../Avatar/MutedAvatarOverlay';\nimport Checkbox from '../Checkbox';\nimport UserProfile from '../UserProfile';\nimport ContextMenu, { MenuItems } from '../ContextMenu';\nimport Label, { LabelTypography, LabelColors } from '../Label';\n\nexport interface UserListItemProps {\n  user: User;\n  className?: string;\n  checked?: boolean;\n  checkBox?: boolean;\n  isOperator?: boolean;\n  disabled?: boolean;\n  disableMessaging?: boolean;\n  currentUser?: string;\n  action?({ actionRef, parentRef }: {\n    actionRef: MutableRefObject<any>,\n    parentRef?: MutableRefObject<any>,\n  }): ReactElement;\n  onChange?(e: ChangeEvent<HTMLInputElement>): void;\n  avatarSize?: string;\n}\n\nexport default function UserListItem({\n  user,\n  className,\n  checked,\n  checkBox,\n  isOperator,\n  disabled,\n  disableMessaging,\n  currentUser,\n  action,\n  onChange,\n  avatarSize = '40px',\n}: UserListItemProps): ReactElement {\n  const uniqueKey = user.userId;\n  const actionRef = React.useRef(null);\n  const parentRef = React.useRef(null);\n  const avatarRef = React.useRef(null);\n  const {\n    disableUserProfile,\n    renderUserProfile,\n  } = useContext<UserProfileContext>(UserProfileContext);\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-user-list-item',\n      ].join(' ')}\n      ref={parentRef}\n    >\n      {\n        (user as Member)?.isMuted && (\n          <MutedAvatarOverlay height={40} width={40} />\n        )\n      }\n      <ContextMenu\n        menuTrigger={(toggleDropdown) => (\n          <Avatar\n            className=\"sendbird-user-list-item__avatar\"\n            ref={avatarRef}\n            src={user.profileUrl}\n            width={avatarSize}\n            height={avatarSize}\n            onClick={() => {\n              if (!disableUserProfile) {\n                toggleDropdown();\n              }\n            }}\n          />\n        )}\n        menuItems={(closeDropdown) => (\n          <MenuItems\n            openLeft\n            parentRef={avatarRef}\n            // for catching location(x, y) of MenuItems\n            parentContainRef={avatarRef}\n            // for toggling more options(menus & reactions)\n            closeDropdown={closeDropdown}\n            style={{ paddingTop: '0px', paddingBottom: '0px' }}\n          >\n            {\n              renderUserProfile\n                ? renderUserProfile({\n                  user,\n                  currentUserId: currentUser,\n                  close: closeDropdown,\n                })\n                : (\n                  <UserProfile\n                    disableMessaging={disableMessaging}\n                    user={user}\n                    currentUserId={currentUser}\n                    onSuccess={closeDropdown}\n                  />\n                )\n            }\n          </MenuItems>\n        )}\n      />\n      <Label\n        className=\"sendbird-user-list-item__title\"\n        type={LabelTypography.SUBTITLE_1}\n        color={LabelColors.ONBACKGROUND_1}\n      >\n        {user.nickname || stringSet.NO_NAME}\n        {\n          (currentUser === user.userId) && (\n            ' (You)'\n          )\n        }\n      </Label>\n      { // if there is now nickname, display userId\n        !user.nickname && (\n          <Label\n            className=\"sendbird-user-list-item__subtitle\"\n            type={LabelTypography.CAPTION_3}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            {user.userId}\n          </Label>\n        )\n      }\n      {\n        checkBox && (\n          <label\n            className=\"sendbird-user-list-item__checkbox\"\n            htmlFor={uniqueKey}\n          >\n            <Checkbox\n              id={uniqueKey}\n              checked={checked}\n              disabled={disabled}\n              onChange={(event) => onChange(event)}\n            />\n          </label>\n        )\n      }\n      {\n        isOperator && (\n          <Label\n            className={[\n              'sendbird-user-list-item__operator',\n              checkBox ? 'checkbox' : '',\n            ].join(' ')}\n            type={LabelTypography.SUBTITLE_2}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            Operator\n          </Label>\n        )\n      }\n      {\n        action && (\n          <div\n            className=\"sendbird-user-list-item__action\"\n            ref={actionRef}\n          >\n            {action({ actionRef, parentRef })}\n          </div>\n        )\n      }\n    </div>\n  );\n}\n"],"names":["UserListItem","_ref","user","className","checked","checkBox","isOperator","disabled","disableMessaging","currentUser","action","onChange","avatarSize","uniqueKey","userId","actionRef","React","useRef","parentRef","avatarRef","disableUserProfile","renderUserProfile","useContext","UserProfileContext","stringSet","LocalizationContext","createElement","Array","isArray","join","ref","isMuted","MutedAvatarOverlay","height","width","ContextMenu","menuTrigger","toggleDropdown","Avatar","src","profileUrl","onClick","menuItems","closeDropdown","MenuItems","openLeft","parentContainRef","style","paddingTop","paddingBottom","currentUserId","close","UserProfile","onSuccess","Label","type","LabelTypography","SUBTITLE_1","color","LabelColors","ONBACKGROUND_1","nickname","NO_NAME","CAPTION_3","ONBACKGROUND_2","htmlFor","Checkbox","id","event","SUBTITLE_2"],"mappings":"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"}
+{"version":3,"file":"UserListItem.js","sources":["../../../src/ui/UserListItem/index.tsx"],"sourcesContent":["import React, { ChangeEvent, MutableRefObject, ReactElement, useContext } from 'react';\nimport { User } from '@sendbird/chat';\nimport { Member } from '@sendbird/chat/groupChannel';\nimport './index.scss';\n\nimport { UserProfileContext } from '../../lib/UserProfileContext';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport Avatar from '../Avatar/index';\nimport MutedAvatarOverlay from '../Avatar/MutedAvatarOverlay';\nimport Checkbox from '../Checkbox';\nimport UserProfile from '../UserProfile';\nimport ContextMenu, { MenuItems } from '../ContextMenu';\nimport Label, { LabelTypography, LabelColors } from '../Label';\n\nexport interface UserListItemProps {\n  user: User;\n  className?: string;\n  checked?: boolean;\n  checkBox?: boolean;\n  isOperator?: boolean;\n  disabled?: boolean;\n  disableMessaging?: boolean;\n  currentUser?: string;\n  action?({ actionRef, parentRef }: {\n    actionRef: MutableRefObject<any>,\n    parentRef?: MutableRefObject<any>,\n  }): ReactElement;\n  onChange?(e: ChangeEvent<HTMLInputElement>): void;\n  avatarSize?: string;\n}\n\nexport default function UserListItem({\n  user,\n  className,\n  checked,\n  checkBox,\n  isOperator,\n  disabled,\n  disableMessaging,\n  currentUser,\n  action,\n  onChange,\n  avatarSize = '40px',\n}: UserListItemProps): ReactElement {\n  const uniqueKey = user.userId;\n  const actionRef = React.useRef(null);\n  const parentRef = React.useRef(null);\n  const avatarRef = React.useRef(null);\n  const {\n    disableUserProfile,\n    renderUserProfile,\n  } = useContext<UserProfileContext>(UserProfileContext);\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-user-list-item',\n      ].join(' ')}\n      ref={parentRef}\n    >\n      {\n        (user as Member)?.isMuted && (\n          <MutedAvatarOverlay height={40} width={40} />\n        )\n      }\n      <ContextMenu\n        menuTrigger={(toggleDropdown) => (\n          <Avatar\n            className=\"sendbird-user-list-item__avatar\"\n            ref={avatarRef}\n            src={user.profileUrl}\n            width={avatarSize}\n            height={avatarSize}\n            onClick={() => {\n              if (!disableUserProfile) {\n                toggleDropdown();\n              }\n            }}\n          />\n        )}\n        menuItems={(closeDropdown) => (\n          <MenuItems\n            openLeft\n            parentRef={avatarRef}\n            // for catching location(x, y) of MenuItems\n            parentContainRef={avatarRef}\n            // for toggling more options(menus & reactions)\n            closeDropdown={closeDropdown}\n            style={{ paddingTop: '0px', paddingBottom: '0px' }}\n          >\n            {\n              renderUserProfile\n                ? renderUserProfile({\n                  user,\n                  currentUserId: currentUser,\n                  close: closeDropdown,\n                })\n                : (\n                  <UserProfile\n                    disableMessaging={disableMessaging}\n                    user={user}\n                    currentUserId={currentUser}\n                    onSuccess={closeDropdown}\n                  />\n                )\n            }\n          </MenuItems>\n        )}\n      />\n      <Label\n        className=\"sendbird-user-list-item__title\"\n        type={LabelTypography.SUBTITLE_1}\n        color={LabelColors.ONBACKGROUND_1}\n      >\n        {user.nickname || stringSet.NO_NAME}\n        {\n          (currentUser === user.userId) && (\n            ' (You)'\n          )\n        }\n      </Label>\n      { // if there is now nickname, display userId\n        !user.nickname && (\n          <Label\n            className=\"sendbird-user-list-item__subtitle\"\n            type={LabelTypography.CAPTION_3}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            {user.userId}\n          </Label>\n        )\n      }\n      {\n        checkBox && (\n          <label\n            className=\"sendbird-user-list-item__checkbox\"\n            htmlFor={uniqueKey}\n          >\n            <Checkbox\n              id={uniqueKey}\n              checked={checked}\n              disabled={disabled}\n              onChange={(event) => onChange(event)}\n            />\n          </label>\n        )\n      }\n      {\n        isOperator && (\n          <Label\n            className={[\n              'sendbird-user-list-item__operator',\n              checkBox ? 'checkbox' : '',\n            ].join(' ')}\n            type={LabelTypography.SUBTITLE_2}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            Operator\n          </Label>\n        )\n      }\n      {\n        action && (\n          <div\n            className=\"sendbird-user-list-item__action\"\n            ref={actionRef}\n          >\n            {action({ actionRef, parentRef })}\n          </div>\n        )\n      }\n    </div>\n  );\n}\n"],"names":["UserListItem","_ref","user","className","checked","checkBox","isOperator","disabled","disableMessaging","currentUser","action","onChange","avatarSize","uniqueKey","userId","actionRef","React","useRef","parentRef","avatarRef","disableUserProfile","renderUserProfile","useContext","UserProfileContext","stringSet","LocalizationContext","createElement","Array","isArray","join","ref","isMuted","MutedAvatarOverlay","height","width","ContextMenu","menuTrigger","toggleDropdown","Avatar","src","profileUrl","onClick","menuItems","closeDropdown","MenuItems","openLeft","parentContainRef","style","paddingTop","paddingBottom","currentUserId","close","UserProfile","onSuccess","Label","type","LabelTypography","SUBTITLE_1","color","LabelColors","ONBACKGROUND_1","nickname","NO_NAME","CAPTION_3","ONBACKGROUND_2","htmlFor","Checkbox","id","event","SUBTITLE_2"],"mappings":"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"}

package/cjs/ui/UserProfile.js

@@ -1,22 +1,22 @@
 'use strict';
 
 var React = require('react');
-var LocalizationContext = require('../LocalizationContext-9c99457f.js');
-var UserProfileContext = require('../UserProfileContext-1f226141.js');
+var LocalizationContext = require('../LocalizationContext-eb7a59da.js');
+var UserProfileContext = require('../UserProfileContext-abe57718.js');
 var sendbirdSelectors = require('../sendbirdSelectors.js');
 var ui_Avatar = require('./Avatar.js');
-var ui_Label = require('../index-4eb2a000.js');
+var ui_Label = require('../index-f40c4cf0.js');
 var ui_Button = require('./Button.js');
 var useSendbirdStateContext = require('../useSendbirdStateContext.js');
-require('../stringSet-dbdeec9c.js');
-require('../index-ba4dea0c.js');
+require('../stringSet-b75b75ae.js');
+require('../index-c9a4a555.js');
 require('prop-types');
-require('../_rollupPluginBabelHelpers-117c3ffb.js');
-require('../topics-c495cb3a.js');
-require('../utils-c2f38151.js');
+require('../_rollupPluginBabelHelpers-a85bd364.js');
+require('../topics-2c35cfd7.js');
+require('../utils-8958cb75.js');
 require('./ImageRenderer.js');
 require('./Icon.js');
-require('../uuid-b2882230.js');
+require('../uuid-34728ced.js');
 require('../withSendbird.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

package/cjs/ui/VoiceMessageItemBody.js

@@ -8,21 +8,23 @@ var VoicePlayer_useVoicePlayer = require('../VoicePlayer/useVoicePlayer.js');
 var ui_PlaybackTime = require('./PlaybackTime.js');
 var ui_Loader = require('./Loader.js');
 var ui_Icon = require('./Icon.js');
-var ui_Label = require('../index-4eb2a000.js');
-var VoicePlayer_context = require('../index-fe1b738f.js');
-require('../consts-fb9dd3a0.js');
+var ui_Label = require('../index-f40c4cf0.js');
+var VoicePlayer_context = require('../index-6e0a495a.js');
+require('../consts-7b830cc5.js');
 require('../VoiceRecorder/context.js');
-require('../LocalizationContext-9c99457f.js');
-require('../stringSet-dbdeec9c.js');
-require('../index-ba4dea0c.js');
+require('../LocalizationContext-eb7a59da.js');
+require('../stringSet-b75b75ae.js');
+require('../index-c9a4a555.js');
 require('./Modal.js');
 require('react-dom');
-require('../index-2413bae4.js');
+require('../utils-8958cb75.js');
+require('../index.module-5c951066.js');
+require('../index-5628e0c0.js');
+require('../MediaQueryContext-ca045060.js');
+require('./IconButton.js');
+require('../_rollupPluginBabelHelpers-a85bd364.js');
 require('./Button.js');
 require('prop-types');
-require('./IconButton.js');
-require('../_rollupPluginBabelHelpers-117c3ffb.js');
-require('../MediaQueryContext-a5c77095.js');
 require('../useSendbirdStateContext.js');
 require('../withSendbird.js');
 

package/cjs/ui/VoiceMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"VoiceMessageItemBody.js","sources":["../../../src/ui/VoiceMessageItemBody/index.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from 'react';\nimport { FileMessage } from '@sendbird/chat/message';\n\nimport './index.scss';\n\nimport ProgressBar, { ProgressBarColorTypes } from '../ProgressBar';\nimport { useVoicePlayer } from '../../hooks/VoicePlayer/useVoicePlayer';\nimport PlaybackTime from '../PlaybackTime';\nimport Loader from '../Loader';\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport { LabelTypography, LabelColors } from '../Label';\nimport { VOICE_PLAYER_STATUS } from '../../hooks/VoicePlayer/dux/initialState';\n\nexport interface VoiceMessageItemBodyProps {\n  className?: string;\n  message: FileMessage;\n  channelUrl: string;\n  isByMe?: boolean;\n  isReactionEnabled?: boolean;\n}\n\nexport const VoiceMessageItemBody = ({\n  className,\n  message,\n  channelUrl,\n  isByMe = false,\n  isReactionEnabled = false,\n}: VoiceMessageItemBodyProps): React.ReactElement => {\n  const [usingReaction, setUsingReaction] = useState(false);\n  const {\n    play,\n    // do not pause on unmount, because on desktop layout\n    // the component can be paused when it is played from\n    // channel and same message is unmounted from the thread\n    pause,\n    playbackTime = 0,\n    duration,\n    playingStatus = VOICE_PLAYER_STATUS.IDLE,\n  } = useVoicePlayer({\n    channelUrl,\n    key: `${message?.messageId}`,\n    audioFileUrl: message?.url,\n  });\n\n  useEffect(() => {\n    if (isReactionEnabled && message?.reactions?.length > 0) {\n      setUsingReaction(true);\n    } else {\n      setUsingReaction(false);\n    }\n  }, [isReactionEnabled, message?.reactions?.length]);\n  const progresBarMaxSize = useMemo(() => {\n    if (message?.metaArrays) {\n      const duration = message?.metaArrays.find((metaArray) => metaArray.key === 'KEY_VOICE_MESSAGE_DURATION')?.value[0];\n      return duration && parseInt(duration);\n    }\n    return 1;\n  }, [message?.metaArrays]);\n\n  return (\n    <div className={`sendbird-voice-message-item-body ${className} ${usingReaction ? 'is-reactions-contained' : ''}`}>\n      <ProgressBar\n        className=\"sendbird-voice-message-item-body__progress-bar\"\n        maxSize={duration || progresBarMaxSize}\n        currentSize={playbackTime}\n        colorType={isByMe ? ProgressBarColorTypes.PRIMARY : ProgressBarColorTypes.GRAY}\n      />\n      <div className=\"sendbird-voice-message-item-body__status-button\">\n        {(playingStatus === VOICE_PLAYER_STATUS.IDLE || playingStatus === VOICE_PLAYER_STATUS.PAUSED) && (\n          <div\n            className=\"sendbird-voice-message-item-body__status-button__button\"\n            onClick={play}\n          >\n            <Icon\n              width=\"18px\"\n              height=\"18px\"\n              type={IconTypes.PLAY}\n              fillColor={IconColors.PRIMARY}\n            />\n          </div>\n        )}\n        {playingStatus === VOICE_PLAYER_STATUS.PREPARING && (\n          <Loader width=\"22.2px\" height=\"22.2px\">\n            <Icon\n              width=\"22.2px\"\n              height=\"22.2px\"\n              type={IconTypes.SPINNER}\n              fillColor={IconColors.PRIMARY_2}\n            />\n          </Loader>\n        )}\n        {playingStatus === VOICE_PLAYER_STATUS.PLAYING && (\n          <div\n            className=\"sendbird-voice-message-item-body__status-button__button\"\n            onClick={() => { pause(); }}\n          >\n            <div className=\"sendbird-voice-message-item-body__status-button__button__pause\">\n              <div className=\"sendbird-voice-message-item-body__status-button__button__pause__inner\" />\n              <div className=\"sendbird-voice-message-item-body__status-button__button__pause__inner\" />\n            </div>\n          </div>\n        )}\n      </div>\n      <PlaybackTime\n        className=\"sendbird-voice-message-item-body__playback-time\"\n        time={progresBarMaxSize - playbackTime}\n        labelType={LabelTypography.BODY_1}\n        labelColor={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n      />\n    </div>\n  );\n};\n\nexport default VoiceMessageItemBody;\n"],"names":["VoiceMessageItemBody","_ref","_message$reactions2","className","message","channelUrl","isByMe","isReactionEnabled","usingReaction","setUsingReaction","useState","play","pause","playbackTime","duration","playingStatus","VOICE_PLAYER_STATUS","IDLE","useVoicePlayer","key","messageId","audioFileUrl","url","useEffect","_message$reactions","reactions","length","progresBarMaxSize","useMemo","metaArrays","_message$metaArrays$f","find","metaArray","value","parseInt","React","createElement","ProgressBar","maxSize","currentSize","colorType","ProgressBarColorTypes","PRIMARY","GRAY","PAUSED","onClick","Icon","width","height","type","IconTypes","PLAY","fillColor","IconColors","PREPARING","Loader","SPINNER","PRIMARY_2","PLAYING","PlaybackTime","time","labelType","LabelTypography","BODY_1","labelColor","LabelColors","ONCONTENT_1","ONBACKGROUND_1"],"mappings":"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"}
+{"version":3,"file":"VoiceMessageItemBody.js","sources":["../../../src/ui/VoiceMessageItemBody/index.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from 'react';\nimport { FileMessage } from '@sendbird/chat/message';\n\nimport './index.scss';\n\nimport ProgressBar, { ProgressBarColorTypes } from '../ProgressBar';\nimport { useVoicePlayer } from '../../hooks/VoicePlayer/useVoicePlayer';\nimport PlaybackTime from '../PlaybackTime';\nimport Loader from '../Loader';\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport { LabelTypography, LabelColors } from '../Label';\nimport { VOICE_PLAYER_STATUS } from '../../hooks/VoicePlayer/dux/initialState';\n\nexport interface VoiceMessageItemBodyProps {\n  className?: string;\n  message: FileMessage;\n  channelUrl: string;\n  isByMe?: boolean;\n  isReactionEnabled?: boolean;\n}\n\nexport const VoiceMessageItemBody = ({\n  className,\n  message,\n  channelUrl,\n  isByMe = false,\n  isReactionEnabled = false,\n}: VoiceMessageItemBodyProps): React.ReactElement => {\n  const [usingReaction, setUsingReaction] = useState(false);\n  const {\n    play,\n    // do not pause on unmount, because on desktop layout\n    // the component can be paused when it is played from\n    // channel and same message is unmounted from the thread\n    pause,\n    playbackTime = 0,\n    duration,\n    playingStatus = VOICE_PLAYER_STATUS.IDLE,\n  } = useVoicePlayer({\n    channelUrl,\n    key: `${message?.messageId}`,\n    audioFileUrl: message?.url,\n  });\n\n  useEffect(() => {\n    if (isReactionEnabled && message?.reactions?.length > 0) {\n      setUsingReaction(true);\n    } else {\n      setUsingReaction(false);\n    }\n  }, [isReactionEnabled, message?.reactions?.length]);\n  const progresBarMaxSize = useMemo(() => {\n    if (message?.metaArrays) {\n      const duration = message?.metaArrays.find((metaArray) => metaArray.key === 'KEY_VOICE_MESSAGE_DURATION')?.value[0];\n      return duration && parseInt(duration);\n    }\n    return 1;\n  }, [message?.metaArrays]);\n\n  return (\n    <div className={`sendbird-voice-message-item-body ${className} ${usingReaction ? 'is-reactions-contained' : ''}`}>\n      <ProgressBar\n        className=\"sendbird-voice-message-item-body__progress-bar\"\n        maxSize={duration || progresBarMaxSize}\n        currentSize={playbackTime}\n        colorType={isByMe ? ProgressBarColorTypes.PRIMARY : ProgressBarColorTypes.GRAY}\n      />\n      <div className=\"sendbird-voice-message-item-body__status-button\">\n        {(playingStatus === VOICE_PLAYER_STATUS.IDLE || playingStatus === VOICE_PLAYER_STATUS.PAUSED) && (\n          <div\n            className=\"sendbird-voice-message-item-body__status-button__button\"\n            onClick={play}\n          >\n            <Icon\n              width=\"18px\"\n              height=\"18px\"\n              type={IconTypes.PLAY}\n              fillColor={IconColors.PRIMARY}\n            />\n          </div>\n        )}\n        {playingStatus === VOICE_PLAYER_STATUS.PREPARING && (\n          <Loader width=\"22.2px\" height=\"22.2px\">\n            <Icon\n              width=\"22.2px\"\n              height=\"22.2px\"\n              type={IconTypes.SPINNER}\n              fillColor={IconColors.PRIMARY_2}\n            />\n          </Loader>\n        )}\n        {playingStatus === VOICE_PLAYER_STATUS.PLAYING && (\n          <div\n            className=\"sendbird-voice-message-item-body__status-button__button\"\n            onClick={() => { pause(); }}\n          >\n            <div className=\"sendbird-voice-message-item-body__status-button__button__pause\">\n              <div className=\"sendbird-voice-message-item-body__status-button__button__pause__inner\" />\n              <div className=\"sendbird-voice-message-item-body__status-button__button__pause__inner\" />\n            </div>\n          </div>\n        )}\n      </div>\n      <PlaybackTime\n        className=\"sendbird-voice-message-item-body__playback-time\"\n        time={progresBarMaxSize - playbackTime}\n        labelType={LabelTypography.BODY_1}\n        labelColor={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n      />\n    </div>\n  );\n};\n\nexport default VoiceMessageItemBody;\n"],"names":["VoiceMessageItemBody","_ref","_message$reactions2","className","message","channelUrl","isByMe","isReactionEnabled","usingReaction","setUsingReaction","useState","play","pause","playbackTime","duration","playingStatus","VOICE_PLAYER_STATUS","IDLE","useVoicePlayer","key","messageId","audioFileUrl","url","useEffect","_message$reactions","reactions","length","progresBarMaxSize","useMemo","metaArrays","_message$metaArrays$f","find","metaArray","value","parseInt","React","createElement","ProgressBar","maxSize","currentSize","colorType","ProgressBarColorTypes","PRIMARY","GRAY","PAUSED","onClick","Icon","width","height","type","IconTypes","PLAY","fillColor","IconColors","PREPARING","Loader","SPINNER","PRIMARY_2","PLAYING","PlaybackTime","time","labelType","LabelTypography","BODY_1","labelColor","LabelColors","ONCONTENT_1","ONBACKGROUND_1"],"mappings":"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"}

package/cjs/ui/VoiceMessgeInput.js

@@ -7,14 +7,14 @@ require('./PlaybackTime.js');
 require('./ProgressBar.js');
 require('./TextButton.js');
 require('./Icon.js');
-require('../index-4eb2a000.js');
-require('../LocalizationContext-9c99457f.js');
-var ui_VoiceMessgeInput = require('../index-15e4fb71.js');
-require('../consts-fb9dd3a0.js');
+require('../index-f40c4cf0.js');
+require('../LocalizationContext-eb7a59da.js');
+var ui_VoiceMessgeInput = require('../index-2fbc5922.js');
+require('../consts-7b830cc5.js');
 require('prop-types');
-require('../stringSet-dbdeec9c.js');
-require('../color-a057a4c2.js');
-require('../index-ba4dea0c.js');
+require('../stringSet-b75b75ae.js');
+require('../color-2f1198fc.js');
+require('../index-c9a4a555.js');