@sendbird/uikit-react 3.4.8 → 3.4.9

package/ui/QuoteMessage.js

@@ -1,13 +1,13 @@
 import React__default, { useContext, useState } from 'react';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a900bd78.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-63949de5.js';
 import ImageRenderer from './ImageRenderer.js';
-import { a as LocalizationContext } from '../LocalizationContext-ae38446a.js';
-import { L as getUIKitFileTypes, j as getClassName, r as isUserMessage, d as isVoiceMessage, n as isThumbnailMessage, E as isVideo, M as isGif, s as getUIKitMessageType, U as UIKitMessageTypes, K as getUIKitFileType, t as truncateString } from '../index-d8fdbe6f.js';
+import { a as LocalizationContext } from '../LocalizationContext-076d6d2e.js';
+import { M as getUIKitFileTypes, h as getClassName, q as isUserMessage, d as isVoiceMessage, m as isThumbnailMessage, y as isVideo, N as isGif, r as getUIKitMessageType, U as UIKitMessageTypes, L as getUIKitFileType, t as truncateString } from '../index-7eb65acf.js';
 import 'prop-types';
-import '../stringSet-6d89212b.js';
-import '../index-321e838f.js';
-import '../_rollupPluginBabelHelpers-eaf55eff.js';
+import '../stringSet-13bbd4a2.js';
+import '../index-99aabd9e.js';
+import '../_rollupPluginBabelHelpers-6bb0305c.js';
 import '../utils/message/getOutgoingMessageState.js';
 
 function QuoteMessage(_ref) {

package/ui/QuoteMessageInput.js

@@ -1,14 +1,14 @@
 import React__default, { useContext } from 'react';
-import { l as isFileMessage, d as isVoiceMessage, m as isImageMessage, n as isThumbnailMessage, o as isAudioMessage, j as getClassName, p as isGifMessage, q as isVideoMessage, r as isUserMessage, s as getUIKitMessageType, U as UIKitMessageTypes } from '../index-d8fdbe6f.js';
+import { k as isFileMessage, d as isVoiceMessage, l as isImageMessage, m as isThumbnailMessage, n as isAudioMessage, h as getClassName, o as isGifMessage, p as isVideoMessage, q as isUserMessage, r as getUIKitMessageType, U as UIKitMessageTypes } from '../index-7eb65acf.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a900bd78.js';
-import { a as LocalizationContext } from '../LocalizationContext-ae38446a.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-63949de5.js';
+import { a as LocalizationContext } from '../LocalizationContext-076d6d2e.js';
 import ImageRenderer from './ImageRenderer.js';
-import '../_rollupPluginBabelHelpers-eaf55eff.js';
+import '../_rollupPluginBabelHelpers-6bb0305c.js';
 import '../utils/message/getOutgoingMessageState.js';
 import 'prop-types';
-import '../stringSet-6d89212b.js';
-import '../index-321e838f.js';
+import '../stringSet-13bbd4a2.js';
+import '../index-99aabd9e.js';
 
 const componentClassname = 'sendbird-quote_message_input__avatar';
 function QuoteMessageThumbnail(_ref) {

package/ui/ReactionBadge.js

@@ -1,7 +1,7 @@
 import React__default from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a900bd78.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-63949de5.js';
 import 'prop-types';
-import '../stringSet-6d89212b.js';
+import '../stringSet-13bbd4a2.js';
 
 const ReactionBadge = /*#__PURE__*/React__default.forwardRef((props, ref) => {
   const {

package/ui/ReactionButton.js

@@ -1,4 +1,8 @@
+import { b as _extends } from '../_rollupPluginBabelHelpers-6bb0305c.js';
 import React__default from 'react';
+import { u as useLongPress } from '../useLongPress-1303953d.js';
+import { n as noop } from '../utils-4bbbca2c.js';
+import '../MediaQueryContext-11f0e43f.js';
 
 const ReactionButton = /*#__PURE__*/React__default.forwardRef((props, ref) => {
   const {
@@ -6,27 +10,29 @@ const ReactionButton = /*#__PURE__*/React__default.forwardRef((props, ref) => {
     width,
     height,
     selected,
+    dataSbId = '',
     onClick,
     children
   } = props;
-  return /*#__PURE__*/React__default.createElement("div", {
+  const onClickHandler = useLongPress({
+    onLongPress: noop,
+    onClick
+  }, {
+    shouldPreventDefault: true,
+    shouldStopPropagation: true
+  });
+  return /*#__PURE__*/React__default.createElement("div", _extends({
     className: [...(Array.isArray(className) ? className : [className]), `sendbird-reaction-button${selected ? '--selected' : ''}`].join(' '),
     ref: ref,
     role: "button",
     style: {
       width,
       height
-    },
-    onClick: e => onClick(e),
-    onKeyDown: e => onClick(e),
-    onTouchEnd: e => {
-      onClick(e);
-      // to stop longpress
-      e.stopPropagation();
-      e.nativeEvent.stopImmediatePropagation();
-    },
-    tabIndex: 0
-  }, /*#__PURE__*/React__default.createElement("div", {
+    }
+  }, onClickHandler, {
+    tabIndex: 0,
+    "data-sb-id": dataSbId
+  }), /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-reaction-button__inner"
   }, children));
 });

package/ui/ReactionButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReactionButton.js","sources":["../../src/ui/ReactionButton/index.tsx"],"sourcesContent":["import React, {\n  KeyboardEvent,\n  MouseEvent,\n  ReactElement,\n  RefObject,\n  TouchEvent,\n} from 'react';\n\nimport './index.scss';\n\nexport interface ReactionButtonProps {\n  children: ReactElement;\n  className?: string | Array<string>;\n  width?: string | number;\n  height?: string | number;\n  selected?: boolean;\n  onClick?: (\n    e: MouseEvent<HTMLDivElement> | KeyboardEvent<HTMLDivElement> | TouchEvent<HTMLDivElement>\n  ) => void;\n}\nconst ReactionButton = React.forwardRef((props: ReactionButtonProps, ref: RefObject<HTMLDivElement>): ReactElement => {\n  const {\n    className,\n    width,\n    height,\n    selected,\n    onClick,\n    children,\n  } = props;\n\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        `sendbird-reaction-button${selected ? '--selected' : ''}`,\n      ].join(' ')}\n      ref={ref}\n      role=\"button\"\n      style={{ width, height }}\n      onClick={(e) => onClick(e)}\n      onKeyDown={(e) => onClick(e)}\n      onTouchEnd={(e) => {\n        onClick(e);\n        // to stop longpress\n        e.stopPropagation();\n        e.nativeEvent.stopImmediatePropagation();\n      }}\n      tabIndex={0}\n    >\n      <div className=\"sendbird-reaction-button__inner\">\n        {children}\n      </div>\n    </div>\n  );\n});\n\nexport default ReactionButton;\n"],"names":["ReactionButton","React","forwardRef","props","ref","className","width","height","selected","onClick","children","createElement","Array","isArray","join","role","style","e","onKeyDown","onTouchEnd","stopPropagation","nativeEvent","stopImmediatePropagation","tabIndex"],"mappings":";;AAoBMA,MAAAA,cAAc,gBAAGC,cAAK,CAACC,UAAU,CAAC,CAACC,KAA0B,EAAEC,GAA8B,KAAmB;EACpH,MAAM;IACJC,SAAS;IACTC,KAAK;IACLC,MAAM;IACNC,QAAQ;IACRC,OAAO;AACPC,IAAAA,QAAAA;AACF,GAAC,GAAGP,KAAK,CAAA;EAET,oBACEF,cAAA,CAAAU,aAAA,CAAA,KAAA,EAAA;AACEN,IAAAA,SAAS,EAAE,CACT,IAAIO,KAAK,CAACC,OAAO,CAACR,SAAS,CAAC,GAAGA,SAAS,GAAG,CAACA,SAAS,CAAC,CAAC,EACtD,CAAA,wBAAA,EAA0BG,QAAQ,GAAG,YAAY,GAAG,EAAG,CAAA,CAAC,CAC1D,CAACM,IAAI,CAAC,GAAG,CAAE;AACZV,IAAAA,GAAG,EAAEA,GAAI;AACTW,IAAAA,IAAI,EAAC,QAAQ;AACbC,IAAAA,KAAK,EAAE;MAAEV,KAAK;AAAEC,MAAAA,MAAAA;KAAS;AACzBE,IAAAA,OAAO,EAAGQ,CAAC,IAAKR,OAAO,CAACQ,CAAC,CAAE;AAC3BC,IAAAA,SAAS,EAAGD,CAAC,IAAKR,OAAO,CAACQ,CAAC,CAAE;IAC7BE,UAAU,EAAGF,CAAC,IAAK;MACjBR,OAAO,CAACQ,CAAC,CAAC,CAAA;AACV;MACAA,CAAC,CAACG,eAAe,EAAE,CAAA;AACnBH,MAAAA,CAAC,CAACI,WAAW,CAACC,wBAAwB,EAAE,CAAA;KACxC;AACFC,IAAAA,QAAQ,EAAE,CAAA;GAEVtB,eAAAA,cAAA,CAAAU,aAAA,CAAA,KAAA,EAAA;AAAKN,IAAAA,SAAS,EAAC,iCAAA;GACZK,EAAAA,QAAQ,CACL,CACF,CAAA;AAEV,CAAC;;;;"}
+{"version":3,"file":"ReactionButton.js","sources":["../../src/ui/ReactionButton/index.tsx"],"sourcesContent":["import React, {\n  ForwardedRef,\n  KeyboardEvent,\n  MouseEvent,\n  ReactElement,\n  TouchEvent,\n} from 'react';\n\nimport './index.scss';\nimport useLongPress from '../../hooks/useLongPress';\nimport { noop } from '../../utils/utils';\n\nexport interface ReactionButtonProps {\n  children: ReactElement;\n  className?: string | Array<string>;\n  width?: string | number;\n  height?: string | number;\n  selected?: boolean;\n  dataSbId?: string;\n  onClick?: (\n    e: MouseEvent<HTMLDivElement> | KeyboardEvent<HTMLDivElement> | TouchEvent<HTMLDivElement>\n  ) => void;\n}\n\nconst ReactionButton = React.forwardRef((props: ReactionButtonProps, ref: ForwardedRef<HTMLDivElement>) => {\n  const {\n    className,\n    width,\n    height,\n    selected,\n    dataSbId = '',\n    onClick,\n    children,\n  } = props;\n\n  const onClickHandler = useLongPress({\n    onLongPress: noop,\n    onClick,\n  }, {\n    shouldPreventDefault: true,\n    shouldStopPropagation: true,\n  });\n\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        `sendbird-reaction-button${selected ? '--selected' : ''}`,\n      ].join(' ')}\n      ref={ref}\n      role=\"button\"\n      style={{ width, height }}\n      {...onClickHandler}\n      tabIndex={0}\n      data-sb-id={dataSbId}\n    >\n      <div className=\"sendbird-reaction-button__inner\">\n        {children}\n      </div>\n    </div>\n  );\n});\n\nexport default ReactionButton;\n"],"names":["ReactionButton","React","forwardRef","props","ref","className","width","height","selected","dataSbId","onClick","children","onClickHandler","useLongPress","onLongPress","noop","shouldPreventDefault","shouldStopPropagation","createElement","_extends","Array","isArray","join","role","style","tabIndex"],"mappings":";;;;;;AAwBMA,MAAAA,cAAc,gBAAGC,cAAK,CAACC,UAAU,CAAC,CAACC,KAA0B,EAAEC,GAAiC,KAAK;EACzG,MAAM;IACJC,SAAS;IACTC,KAAK;IACLC,MAAM;IACNC,QAAQ;AACRC,IAAAA,QAAQ,GAAG,EAAE;IACbC,OAAO;AACPC,IAAAA,QAAAA;AACF,GAAC,GAAGR,KAAK,CAAA;EAET,MAAMS,cAAc,GAAGC,YAAY,CAAC;AAClCC,IAAAA,WAAW,EAAEC,IAAI;AACjBL,IAAAA,OAAAA;AACF,GAAC,EAAE;AACDM,IAAAA,oBAAoB,EAAE,IAAI;AAC1BC,IAAAA,qBAAqB,EAAE,IAAA;AACzB,GAAC,CAAC,CAAA;AAEF,EAAA,oBACEhB,cAAA,CAAAiB,aAAA,CAAA,KAAA,EAAAC,QAAA,CAAA;AACEd,IAAAA,SAAS,EAAE,CACT,IAAIe,KAAK,CAACC,OAAO,CAAChB,SAAS,CAAC,GAAGA,SAAS,GAAG,CAACA,SAAS,CAAC,CAAC,EACtD,CAAA,wBAAA,EAA0BG,QAAQ,GAAG,YAAY,GAAG,EAAG,CAAA,CAAC,CAC1D,CAACc,IAAI,CAAC,GAAG,CAAE;AACZlB,IAAAA,GAAG,EAAEA,GAAI;AACTmB,IAAAA,IAAI,EAAC,QAAQ;AACbC,IAAAA,KAAK,EAAE;MAAElB,KAAK;AAAEC,MAAAA,MAAAA;AAAO,KAAA;AAAE,GAAA,EACrBK,cAAc,EAAA;AAClBa,IAAAA,QAAQ,EAAE,CAAE;IACZ,YAAYhB,EAAAA,QAAAA;GAEZR,CAAAA,eAAAA,cAAA,CAAAiB,aAAA,CAAA,KAAA,EAAA;AAAKb,IAAAA,SAAS,EAAC,iCAAA;GACZM,EAAAA,QAAQ,CACL,CACF,CAAA;AAEV,CAAC;;;;"}

package/ui/SortByRow.js

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import { u as uuidv4 } from '../uuid-c94bd88b.js';
+import { u as uuidv4 } from '../uuid-1adedf62.js';
 
 const componentClassName = 'sendbird-sort-by-row';
 function SortByRow(_ref) {

package/ui/TextButton.js

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import { C as Colors, c as changeColorToClassName } from '../color-c1b95a91.js';
+import { C as Colors, c as changeColorToClassName } from '../color-879cc347.js';
 
 const TextButton = _ref => {
   let {

package/ui/TextMessageItemBody.js

@@ -1,27 +1,27 @@
 import React__default, { useContext, useMemo } from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a900bd78.js';
-import { j as getClassName, e as isEditedMessage } from '../index-d8fdbe6f.js';
-import { a as LocalizationContext } from '../LocalizationContext-ae38446a.js';
-import { t as tokenizeMessage } from '../tokenize-2e969273.js';
-import { T as TextFragment } from '../index-4554e20e.js';
-import { T as TEXT_MESSAGE_BODY_CLASSNAME } from '../consts-bb6cbaee.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-63949de5.js';
+import { h as getClassName, B as isEditedMessage } from '../index-7eb65acf.js';
+import { a as LocalizationContext } from '../LocalizationContext-076d6d2e.js';
+import { t as tokenizeMessage } from '../tokenize-c40f2b57.js';
+import { T as TextFragment } from '../index-2c3e11ea.js';
+import { T as TEXT_MESSAGE_BODY_CLASSNAME } from '../consts-c41580ae.js';
 import 'prop-types';
-import '../stringSet-6d89212b.js';
-import '../_rollupPluginBabelHelpers-eaf55eff.js';
+import '../stringSet-13bbd4a2.js';
+import '../_rollupPluginBabelHelpers-6bb0305c.js';
 import '../utils/message/getOutgoingMessageState.js';
-import '../index-321e838f.js';
-import '../index.module-1c75b4f5.js';
+import '../index-99aabd9e.js';
+import '../index.module-54d57ec3.js';
 import '../Message/context.js';
 import './MentionLabel.js';
 import './ContextMenu.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../uuid-c94bd88b.js';
+import '../uuid-1adedf62.js';
 import './UserProfile.js';
-import '../UserProfileContext-91e3b3f2.js';
+import '../UserProfileContext-9cfbab4d.js';
 import '../sendbirdSelectors.js';
-import '../topics-8f4016e9.js';
-import '../utils-c8b489c4.js';
+import '../topics-b2b77fb9.js';
+import '../utils-4bbbca2c.js';
 import './Avatar.js';
 import './ImageRenderer.js';
 import './Icon.js';

package/ui/ThreadReplies.js

@@ -1,13 +1,13 @@
 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-a900bd78.js';
-import { u as useLocalization } from '../LocalizationContext-ae38446a.js';
-import { u as uuidv4 } from '../uuid-c94bd88b.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-63949de5.js';
+import { u as useLocalization } from '../LocalizationContext-076d6d2e.js';
+import { u as uuidv4 } from '../uuid-1adedf62.js';
 import './ImageRenderer.js';
 import 'prop-types';
-import '../stringSet-6d89212b.js';
-import '../index-321e838f.js';
+import '../stringSet-13bbd4a2.js';
+import '../index-99aabd9e.js';
 
 function ThreadReplies(_ref) {
   var _mostRepliedUsers$;

package/ui/ThumbnailMessageItemBody.js

@@ -1,20 +1,23 @@
+import { b as _extends } from '../_rollupPluginBabelHelpers-6bb0305c.js';
 import React__default, { useState } from 'react';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import ImageRenderer from './ImageRenderer.js';
-import { j as getClassName, u as isSentMessage, q as isVideoMessage, p as isGifMessage } from '../index-d8fdbe6f.js';
+import { h as getClassName, p as isVideoMessage, o as isGifMessage, C as isSentMessage } from '../index-7eb65acf.js';
+import { n as noop } from '../utils-4bbbca2c.js';
+import { u as useLongPress } from '../useLongPress-1303953d.js';
 import 'prop-types';
-import '../_rollupPluginBabelHelpers-eaf55eff.js';
 import '../utils/message/getOutgoingMessageState.js';
+import '../MediaQueryContext-11f0e43f.js';
 
 function ThumbnailMessageItemBody(_ref) {
-  var _thumbnails$, _message$reactions;
+  var _thumbnails$, _message$reactions$le, _message$reactions;
   let {
-    className,
+    className = '',
     message,
     isByMe = false,
     mouseHover = false,
     isReactionEnabled = false,
-    showFileViewer,
+    showFileViewer = noop,
     style = {}
   } = _ref;
   const {
@@ -22,14 +25,17 @@ function ThumbnailMessageItemBody(_ref) {
   } = message;
   const thumbnailUrl = thumbnails.length > 0 ? (_thumbnails$ = thumbnails[0]) === null || _thumbnails$ === void 0 ? void 0 : _thumbnails$.url : '';
   const [imageRendered, setImageRendered] = useState(false);
-  return /*#__PURE__*/React__default.createElement("div", {
-    className: getClassName([className, 'sendbird-thumbnail-message-item-body', isByMe ? 'outgoing' : 'incoming', mouseHover ? 'mouse-hover' : '', isReactionEnabled && (message === null || message === void 0 ? void 0 : (_message$reactions = message.reactions) === null || _message$reactions === void 0 ? void 0 : _message$reactions.length) > 0 ? 'reactions' : '']),
+  const onClickHandler = useLongPress({
+    onLongPress: noop,
     onClick: () => {
       if (isSentMessage(message)) {
-        showFileViewer(true);
+        showFileViewer === null || showFileViewer === void 0 ? void 0 : showFileViewer(true);
       }
     }
-  }, /*#__PURE__*/React__default.createElement(ImageRenderer, {
+  });
+  return /*#__PURE__*/React__default.createElement("div", _extends({
+    className: 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.createElement(ImageRenderer, {
     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,

package/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';\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,\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  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) ? 'reactions' : '',\n      ])}\n      onClick={() => {\n        if (isSentMessage(message)) {\n          showFileViewer(true);\n        }\n      }}\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            <div className=\"sendbird-thumbnail-message-item-body__placeholder__icon\">\n              <Icon\n                type={isVideoMessage(message) ? IconTypes.PLAY : IconTypes.PHOTO}\n                fillColor={IconColors.ON_BACKGROUND_2}\n                width=\"34px\"\n                height=\"34px\"\n              />\n            </div>\n          </div>\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","className","message","isByMe","mouseHover","isReactionEnabled","showFileViewer","style","thumbnails","thumbnailUrl","length","url","imageRendered","setImageRendered","useState","React","createElement","getClassName","reactions","onClick","isSentMessage","ImageRenderer","alt","type","width","height","onLoad","placeHolder","style_","Icon","isVideoMessage","IconTypes","PLAY","PHOTO","fillColor","IconColors","ON_BACKGROUND_2","src","isGifMessage","GIF","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';\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            <div className=\"sendbird-thumbnail-message-item-body__placeholder__icon\">\n              <Icon\n                type={isVideoMessage(message) ? IconTypes.PLAY : IconTypes.PHOTO}\n                fillColor={IconColors.ON_BACKGROUND_2}\n                width=\"34px\"\n                height=\"34px\"\n              />\n            </div>\n          </div>\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_","Icon","isVideoMessage","IconTypes","PLAY","PHOTO","fillColor","IconColors","ON_BACKGROUND_2","src","isGifMessage","GIF","GRAY"],"mappings":"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"}

package/ui/Toggle.js

@@ -1,5 +1,5 @@
 import React__default, { useState, useCallback } from 'react';
-import { _ as _objectSpread2 } from '../_rollupPluginBabelHelpers-eaf55eff.js';
+import { _ as _objectSpread2 } from '../_rollupPluginBabelHelpers-6bb0305c.js';
 import useSendbirdStateContext from '../useSendbirdStateContext.js';
 import '../withSendbird.js';
 

package/ui/Tooltip.js

@@ -1,7 +1,7 @@
 import React__default from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a900bd78.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-63949de5.js';
 import 'prop-types';
-import '../stringSet-6d89212b.js';
+import '../stringSet-13bbd4a2.js';
 
 function Tooltip(_ref) {
   let {

package/ui/UnknownMessageItemBody.js

@@ -1,12 +1,12 @@
 import React__default, { useContext } from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a900bd78.js';
-import { j as getClassName } from '../index-d8fdbe6f.js';
-import { a as LocalizationContext } from '../LocalizationContext-ae38446a.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-63949de5.js';
+import { h as getClassName } from '../index-7eb65acf.js';
+import { a as LocalizationContext } from '../LocalizationContext-076d6d2e.js';
 import 'prop-types';
-import '../stringSet-6d89212b.js';
-import '../_rollupPluginBabelHelpers-eaf55eff.js';
+import '../stringSet-13bbd4a2.js';
+import '../_rollupPluginBabelHelpers-6bb0305c.js';
 import '../utils/message/getOutgoingMessageState.js';
-import '../index-321e838f.js';
+import '../index-99aabd9e.js';
 
 function UnknownMessageItemBody(_ref) {
   var _message$reactions;

package/ui/UserListItem.js

@@ -1,28 +1,28 @@
 import React__default, { useContext } from 'react';
-import { a as UserProfileContext } from '../UserProfileContext-91e3b3f2.js';
-import { a as LocalizationContext } from '../LocalizationContext-ae38446a.js';
+import { a as UserProfileContext } from '../UserProfileContext-9cfbab4d.js';
+import { a as LocalizationContext } from '../LocalizationContext-076d6d2e.js';
 import Avatar from './Avatar.js';
 import MutedAvatarOverlay from './MutedAvatarOverlay.js';
 import Checkbox from './Checkbox.js';
 import UserProfile from './UserProfile.js';
 import ContextMenu, { MenuItems } from './ContextMenu.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a900bd78.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-63949de5.js';
 import 'prop-types';
-import '../stringSet-6d89212b.js';
-import '../index-321e838f.js';
+import '../stringSet-13bbd4a2.js';
+import '../index-99aabd9e.js';
 import './ImageRenderer.js';
 import './Icon.js';
-import '../uuid-c94bd88b.js';
+import '../uuid-1adedf62.js';
 import '../sendbirdSelectors.js';
-import '../_rollupPluginBabelHelpers-eaf55eff.js';
-import '../topics-8f4016e9.js';
-import '../utils-c8b489c4.js';
+import '../_rollupPluginBabelHelpers-6bb0305c.js';
+import '../topics-b2b77fb9.js';
+import '../utils-4bbbca2c.js';
 import './Button.js';
 import '../useSendbirdStateContext.js';
 import '../withSendbird.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../index-d8fdbe6f.js';
+import '../index-7eb65acf.js';
 import '../utils/message/getOutgoingMessageState.js';
 
 function UserListItem(_ref) {
@@ -36,7 +36,8 @@ function UserListItem(_ref) {
     disableMessaging,
     currentUser,
     action,
-    onChange
+    onChange,
+    avatarSize = '40px'
   } = _ref;
   const uniqueKey = user.userId;
   const actionRef = React__default.useRef(null);
@@ -60,8 +61,8 @@ function UserListItem(_ref) {
       className: "sendbird-user-list-item__avatar",
       ref: avatarRef,
       src: user.profileUrl,
-      width: "40px",
-      height: "40px",
+      width: avatarSize,
+      height: avatarSize,
       onClick: () => {
         if (!disableUserProfile) {
           toggleDropdown();

package/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}\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}: 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=\"40px\"\n            height=\"40px\"\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","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/ui/UserProfile.js

@@ -1,20 +1,20 @@
 import React__default, { useContext } from 'react';
-import { a as LocalizationContext } from '../LocalizationContext-ae38446a.js';
-import { a as UserProfileContext } from '../UserProfileContext-91e3b3f2.js';
+import { a as LocalizationContext } from '../LocalizationContext-076d6d2e.js';
+import { a as UserProfileContext } from '../UserProfileContext-9cfbab4d.js';
 import { getCreateGroupChannel } from '../sendbirdSelectors.js';
 import Avatar from './Avatar.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-a900bd78.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-63949de5.js';
 import Button, { ButtonTypes } from './Button.js';
 import useSendbirdStateContext from '../useSendbirdStateContext.js';
-import '../stringSet-6d89212b.js';
-import '../index-321e838f.js';
+import '../stringSet-13bbd4a2.js';
+import '../index-99aabd9e.js';
 import 'prop-types';
-import '../_rollupPluginBabelHelpers-eaf55eff.js';
-import '../topics-8f4016e9.js';
-import '../utils-c8b489c4.js';
+import '../_rollupPluginBabelHelpers-6bb0305c.js';
+import '../topics-b2b77fb9.js';
+import '../utils-4bbbca2c.js';
 import './ImageRenderer.js';
 import './Icon.js';
-import '../uuid-c94bd88b.js';
+import '../uuid-1adedf62.js';
 import '../withSendbird.js';
 
 function UserProfile(_ref) {

package/ui/VoiceMessageItemBody.js

@@ -4,15 +4,15 @@ import { useVoicePlayer } from '../VoicePlayer/useVoicePlayer.js';
 import { PlaybackTime } from './PlaybackTime.js';
 import Loader from './Loader.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import { a as LabelTypography, b as LabelColors } from '../index-a900bd78.js';
-import { a as VOICE_PLAYER_STATUS } from '../index-ae8e6fc3.js';
-import '../consts-9ece4263.js';
+import { a as LabelTypography, b as LabelColors } from '../index-63949de5.js';
+import { a as VOICE_PLAYER_STATUS } from '../index-5c985608.js';
+import '../consts-95d8566e.js';
 import '../VoiceRecorder/context.js';
 import '../useSendbirdStateContext.js';
 import '../withSendbird.js';
-import '../_rollupPluginBabelHelpers-eaf55eff.js';
+import '../_rollupPluginBabelHelpers-6bb0305c.js';
 import 'prop-types';
-import '../stringSet-6d89212b.js';
+import '../stringSet-13bbd4a2.js';
 
 const VoiceMessageItemBody = _ref => {
   var _message$reactions2;

package/ui/VoiceMessgeInput.js

@@ -3,12 +3,12 @@ import './PlaybackTime.js';
 import './ProgressBar.js';
 import './TextButton.js';
 import './Icon.js';
-import '../index-a900bd78.js';
-import '../LocalizationContext-ae38446a.js';
-export { a as VoiceMessageInput } from '../index-88ab67cc.js';
-import '../consts-9ece4263.js';
+import '../index-63949de5.js';
+import '../LocalizationContext-076d6d2e.js';
+export { a as VoiceMessageInput } from '../index-e6e562c5.js';
+import '../consts-95d8566e.js';
 import 'prop-types';
-import '../stringSet-6d89212b.js';
-import '../color-c1b95a91.js';
-import '../index-321e838f.js';
+import '../stringSet-13bbd4a2.js';
+import '../color-879cc347.js';
+import '../index-99aabd9e.js';
 //# sourceMappingURL=VoiceMessgeInput.js.map

package/ui/Word.js

@@ -1,23 +1,23 @@
 import React__default from 'react';
-import { a as LabelTypography } from '../index-a900bd78.js';
+import { a as LabelTypography } from '../index-63949de5.js';
 import LinkLabel from './LinkLabel.js';
-import { u as uuidv4 } from '../uuid-c94bd88b.js';
-import { N as convertWordToStringObj, S as StringObjType } from '../index-d8fdbe6f.js';
+import { u as uuidv4 } from '../uuid-1adedf62.js';
+import { Q as convertWordToStringObj, S as StringObjType } from '../index-7eb65acf.js';
 import MentionLabel from './MentionLabel.js';
 import 'prop-types';
-import '../stringSet-6d89212b.js';
-import '../_rollupPluginBabelHelpers-eaf55eff.js';
+import '../stringSet-13bbd4a2.js';
+import '../_rollupPluginBabelHelpers-6bb0305c.js';
 import '../utils/message/getOutgoingMessageState.js';
 import './ContextMenu.js';
 import 'react-dom';
 import './SortByRow.js';
 import './UserProfile.js';
-import '../LocalizationContext-ae38446a.js';
-import '../index-321e838f.js';
-import '../UserProfileContext-91e3b3f2.js';
+import '../LocalizationContext-076d6d2e.js';
+import '../index-99aabd9e.js';
+import '../UserProfileContext-9cfbab4d.js';
 import '../sendbirdSelectors.js';
-import '../topics-8f4016e9.js';
-import '../utils-c8b489c4.js';
+import '../topics-b2b77fb9.js';
+import '../utils-4bbbca2c.js';
 import './Avatar.js';
 import './ImageRenderer.js';
 import './Icon.js';