@sendbird/uikit-react 3.2.6 → 3.3.0-rc.0

package/ui/QuoteMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"QuoteMessage.js","sources":["../../src/ui/QuoteMessage/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement, useContext, useState } from 'react';\nimport type { FileMessage, UserMessage } from '@sendbird/chat/message';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport ImageRenderer from '../ImageRenderer';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport {\n  getClassName,\n  getUIKitFileType,\n  getUIKitFileTypes,\n  isFileMessage,\n  isGif,\n  isSupportedFileView,\n  isThumbnailMessage,\n  isUserMessage,\n  isVideo,\n  truncateString,\n} from '../../utils';\ninterface Props {\n  message?: UserMessage | FileMessage;\n  userId?: string;\n  isByMe?: boolean;\n  className?: string | Array<string>;\n  onClick?: () => void;\n}\n\nexport default function QuoteMessage({\n  message,\n  userId = '',\n  isByMe = false,\n  className,\n  onClick,\n}: Props): ReactElement {\n  const { stringSet } = useContext(LocalizationContext);\n\n  const { parentMessage } = message;\n  const parentMessageSender = (parentMessage as UserMessage | FileMessage)?.sender;\n  const parentMessageSenderNickname = (userId === parentMessageSender?.userId) ? stringSet.QUOTED_MESSAGE__CURRENT_USER : parentMessageSender?.nickname;\n  const parentMessageUrl = (parentMessage as FileMessage)?.url || '';\n  const parentMessageType = (parentMessage as FileMessage)?.type;\n  const currentMessageSenderNickname = (userId === message?.sender?.userId) ? stringSet.QUOTED_MESSAGE__CURRENT_USER : message?.sender?.nickname;\n\n  const [isThumbnailLoaded, setThumbnailLoaded] = useState(false);\n  const uikitFileTypes = getUIKitFileTypes();\n  const splitFileName = (parentMessage as FileMessage)?.name ? (parentMessage as FileMessage).name.split('/') : parentMessageUrl.split('/');\n\n  return (\n    <div\n      className={getClassName([className, 'sendbird-quote-message', isByMe ? 'outgoing' : 'incoming'])}\n      key={parentMessage?.messageId}\n      onClick={() => { if (onClick) onClick() }}\n      onTouchEnd={() => { if (onClick) onClick() }}\n    >\n      <div className=\"sendbird-quote-message__replied-to\">\n        <Icon\n          className=\"sendbird-quote-message__replied-to__icon\"\n          type={IconTypes.REPLY}\n          fillColor={IconColors.ON_BACKGROUND_3}\n          width=\"12px\"\n          height=\"12px\"\n        />\n        <Label\n          className=\"sendbird-quote-message__replied-to__text\"\n          type={LabelTypography.CAPTION_2}\n          color={LabelColors.ONBACKGROUND_3}\n        >\n          {`${currentMessageSenderNickname} ${stringSet.QUOTED_MESSAGE__REPLIED_TO} ${parentMessageSenderNickname}`}\n        </Label>\n      </div>\n      <div className=\"sendbird-quote-message__replied-message\">\n        {/* text message */}\n        {(isUserMessage(parentMessage as UserMessage) && (parentMessage as UserMessage)?.message?.length > 0) && (\n          <div className=\"sendbird-quote-message__replied-message__text-message\">\n            <Label\n              className=\"sendbird-quote-message__replied-message__text-message__word\"\n              type={LabelTypography.BODY_2}\n              color={LabelColors.ONBACKGROUND_1}\n            >\n              {(parentMessage as UserMessage)?.message}\n            </Label>\n          </div>\n        )}\n        {/* thumbnail message */}\n        {(isThumbnailMessage(parentMessage as FileMessage) && parentMessageUrl) && (\n          <div className=\"sendbird-quote-message__replied-message__thumbnail-message\">\n            <ImageRenderer\n              className=\"sendbird-quote-message__replied-message__thumbnail-message__image\"\n              url={parentMessageUrl}\n              alt={parentMessageType}\n              width=\"144px\"\n              height=\"108px\"\n              onLoad={() => setThumbnailLoaded(true)}\n              defaultComponent={(\n                <div className=\"sendbird-quote-message__replied-message__thumbnail-message__placeholder\">\n                  <div className=\"sendbird-quote-message__replied-message__thumbnail-message__placeholder__icon\">\n                    <Icon\n                      type={isVideo(parentMessageType) ? IconTypes.PLAY : IconTypes.PHOTO}\n                      fillColor={IconColors.ON_BACKGROUND_2}\n                      width=\"22px\"\n                      height=\"22px\"\n                    />\n                  </div>\n                </div>\n              )}\n            />\n            {(isVideo(parentMessageType) && !((parentMessage as FileMessage)?.thumbnails?.length > 0)) && (\n              <>\n                <video className=\"sendbird-quote-message__replied-message__thumbnail-message__video\">\n                  <source src={parentMessageUrl} type={parentMessageType} />\n                </video>\n                <div className=\"sendbird-quote-message__replied-message__thumbnail-message__cover\">\n                  <div className=\"sendbird-quote-message__replied-message__thumbnail-message__cover__icon\">\n                    <Icon\n                      type={IconTypes.PLAY}\n                      fillColor={IconColors.GRAY}\n                      width=\"14px\"\n                      height=\"14px\"\n                    />\n                  </div>\n                </div>\n              </>\n            )}\n            {(isThumbnailLoaded && isGif(parentMessageType)) && (\n              <div className=\"sendbird-quote-message__replied-message__thumbnail-message__cover\">\n                <div className=\"sendbird-quote-message__replied-message__thumbnail-message__cover__icon\">\n                  <Icon\n                    type={IconTypes.GIF}\n                    fillColor={IconColors.GRAY}\n                    width=\"14px\"\n                    height=\"14px\"\n                  />\n                </div>\n              </div>\n            )}\n          </div>\n        )}\n        {/* file message */}\n        {(isFileMessage(parentMessage as FileMessage) && !isSupportedFileView((parentMessage as FileMessage).type) && parentMessageUrl) && (\n          <div className=\"sendbird-quote-message__replied-message__file-message\">\n            <Icon\n              className=\"sendbird-quote-message__replied-message__file-message__type-icon\"\n              type={{\n                [uikitFileTypes.IMAGE]: IconTypes.PHOTO,\n                [uikitFileTypes.VIDEO]: IconTypes.PLAY,\n                [uikitFileTypes.AUDIO]: IconTypes.FILE_AUDIO,\n                [uikitFileTypes.GIF]: IconTypes.GIF,\n                [uikitFileTypes.OTHERS]: IconTypes.FILE_DOCUMENT,\n              }[getUIKitFileType(parentMessageType)]}\n              fillColor={IconColors.ON_BACKGROUND_3}\n              width=\"16px\"\n              height=\"16px\"\n            />\n            <Label\n              className=\"sendbird-quote-message__replied-message__file-message__file-name\"\n              type={LabelTypography.BODY_2}\n              color={LabelColors.ONBACKGROUND_3}\n            >\n              {truncateString(splitFileName[splitFileName.length - 1])}\n            </Label>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["QuoteMessage","_a","message","_g","userId","_h","isByMe","className","onClick","stringSet","useContext","LocalizationContext","parentMessage","parentMessageSender","sender","parentMessageSenderNickname","QUOTED_MESSAGE__CURRENT_USER","nickname","parentMessageUrl","url","parentMessageType","type","currentMessageSenderNickname","_c","_d","_j","useState","isThumbnailLoaded","setThumbnailLoaded","uikitFileTypes","getUIKitFileTypes","splitFileName","name","split","React","getClassName","messageId","IconTypes","REPLY","IconColors","ON_BACKGROUND_3","LabelTypography","CAPTION_2","LabelColors","ONBACKGROUND_3","concat","QUOTED_MESSAGE__REPLIED_TO","isUserMessage","_e","length","BODY_2","ONBACKGROUND_1","isThumbnailMessage","isVideo","PLAY","PHOTO","ON_BACKGROUND_2","_f","thumbnails","GRAY","isGif","GIF","isFileMessage","isSupportedFileView","_b","IMAGE","VIDEO","AUDIO","FILE_AUDIO","OTHERS","FILE_DOCUMENT","getUIKitFileType","truncateString"],"mappings":";;;;;;;;;;;;AA4BwB,SAAAA,YAAA,CAAaC,EAAb,EAMhB;;;;;MALNC,OAAO,GAAAD,EAAA,CAAAC;MACPC,EAAW,GAAAF,EAAA,CAAAG;MAAXA,MAAM,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA;MACTE,EAAA,GAAAJ,EAAA,CAAAK;MAAAA,MAAM,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,KAAH,GAAQA;MACdE,SAAS,GAAAN,EAAA,CAAAM;MACTC,OAAO,GAAAP,EAAA,CAAAO;AAEC,EAAA,IAAAC,SAAS,GAAKC,UAAU,CAACC,mBAAD,CAAV,UAAd,CAAA;AAEA,EAAA,IAAAC,aAAa,GAAKV,OAAO,CAAAU,aAAzB,CAAA;AACR,EAAA,IAAMC,mBAAmB,GAAID,aAA2C,KAAA,IAA3C,IAAAA,aAAa,KAAb,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,aAAa,CAAgCE,MAA1E,CAAA;AACA,EAAA,IAAMC,2BAA2B,GAAIX,MAAM,MAAKS,mBAAmB,KAAnB,IAAA,IAAAA,mBAAmB,KAAnB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,mBAAmB,CAAET,MAA1B,CAAP,GAA2CK,SAAS,CAACO,4BAArD,GAAoFH,mBAAmB,KAAA,IAAnB,IAAAA,mBAAmB,KAAA,KAAA,CAAnB,GAAmB,KAAA,CAAnB,GAAAA,mBAAmB,CAAEI,QAA7I,CAAA;AACA,EAAA,IAAMC,gBAAgB,GAAG,CAACN,aAA6B,KAA7B,IAAA,IAAAA,aAAa,KAAb,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,aAAa,CAAkBO,GAAhC,KAAuC,EAAhE,CAAA;AACA,EAAA,IAAMC,iBAAiB,GAAIR,aAA6B,KAAA,IAA7B,IAAAA,aAAa,KAAb,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,aAAa,CAAkBS,IAA1D,CAAA;AACA,EAAA,IAAMC,4BAA4B,GAAIlB,MAAM,MAAK,MAAAF,OAAO,KAAA,IAAP,IAAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAAA,OAAO,CAAEY,MAAT,MAAiB,IAAjB,IAAiBS,EAAA,KAAA,KAAA,CAAjB,GAAiB,KAAA,CAAjB,GAAiBA,EAAA,CAAAnB,MAAtB,CAAP,GAAuCK,SAAS,CAACO,4BAAjD,GAAgF,CAAAQ,EAAA,GAAAtB,OAAO,KAAP,IAAA,IAAAA,OAAO,WAAP,SAAA,GAAAA,OAAO,CAAEY,MAAT,MAAe,IAAf,IAAeU,EAAA,KAAA,KAAA,CAAf,GAAe,KAAA,CAAf,GAAeA,EAAA,CAAEP,QAAtI,CAAA;;AAEM,EAAA,IAAAQ,EAAA,GAA0CC,QAAQ,CAAC,KAAD,CAAlD;AAAA,MAACC,iBAAiB,GAAAF,EAAA,CAAA,CAAA,CAAlB;AAAA,MAAoBG,kBAAkB,GAAAH,EAAA,CAAA,CAAA,CAAtC,CAAA;;EACN,IAAMI,cAAc,GAAGC,iBAAiB,EAAxC,CAAA;AACA,EAAA,IAAMC,aAAa,GAAG,CAACnB,aAA6B,KAA7B,IAAA,IAAAA,aAAa,KAAb,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,aAAa,CAAkBoB,IAAhC,IAAwCpB,aAA6B,CAACoB,IAA9B,CAAmCC,KAAnC,CAAyC,GAAzC,CAAxC,GAAwFf,gBAAgB,CAACe,KAAjB,CAAuB,GAAvB,CAA9G,CAAA;EAEA,oBACEC,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,SAAS,EAAEC,YAAY,CAAC,CAAC5B,SAAD,EAAY,wBAAZ,EAAsCD,MAAM,GAAG,UAAH,GAAgB,UAA5D,CAAD,CADzB;AAEE,IAAA,GAAG,EAAEM,aAAa,SAAb,IAAAA,aAAa,KAAA,KAAA,CAAb,GAAa,KAAA,CAAb,GAAAA,aAAa,CAAEwB,SAFtB;AAGE,IAAA,OAAO,EAAE,YAAA;MAAQ,IAAI5B,OAAJ,EAAaA,OAAO,EAAA,CAAA;KAHvC;AAIE,IAAA,UAAU,EAAE,YAAQ;MAAA,IAAIA,OAAJ,EAAaA,OAAO,EAAA,CAAA;AAAI,KAAA;GAE5C,eAAA0B,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,oCAAA;AAAf,GAAA,eACEA,6BAAC,IAAD,EAAA;AACE,IAAA,SAAS,EAAC,0CADZ;IAEE,IAAI,EAAEG,SAAS,CAACC,KAFlB;IAGE,SAAS,EAAEC,UAAU,CAACC,eAHxB;AAIE,IAAA,KAAK,EAAC,MAJR;AAKE,IAAA,MAAM,EAAC,MAAA;GANX,CAAA,eAQEN,6BAAC,KAAD,EAAA;AACE,IAAA,SAAS,EAAC,0CADZ;IAEE,IAAI,EAAEO,eAAe,CAACC,SAFxB;IAGE,KAAK,EAAEC,WAAW,CAACC,cAAAA;GAElB,EAAA,EAAA,CAAAC,MAAA,CAAGvB,4BAAH,EAAmC,GAAnC,CAAA,CAAmCuB,MAAnC,CAAmCpC,SAAS,CAACqC,0BAA7C,EAAuE,GAAvE,CAAuED,CAAAA,MAAvE,CAA2E9B,2BAA3E,CALH,CARF,CANF,eAsBEmB,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,yCAAA;AAAf,GAAA,EAEIa,aAAa,CAACnC,aAAD,CAAb,IAA+C,CAAA,CAAAoC,EAAA,GAACpC,aAA6B,KAAA,IAA7B,IAAAA,aAAa,KAAA,KAAA,CAAb,GAAa,KAAA,CAAb,GAAAA,aAAa,CAAkBV,OAAhC,MAAuC,IAAvC,IAAuC8C,EAAA,KAAA,KAAA,CAAvC,GAAuC,KAAA,CAAvC,GAAuCA,EAAA,CAAEC,MAAzC,IAAkD,CAAlG,iBACCf,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,uDAAA;AAAf,GAAA,eACEA,6BAAC,KAAD,EAAA;AACE,IAAA,SAAS,EAAC,6DADZ;IAEE,IAAI,EAAEO,eAAe,CAACS,MAFxB;IAGE,KAAK,EAAEP,WAAW,CAACQ,cAAAA;GAEjBvC,EAAAA,aAA6B,KAA7B,IAAA,IAAAA,aAAa,WAAb,SAAA,GAAAA,aAAa,CAAkBV,OALnC,CADF,CAHJ,EAcIkD,kBAAkB,CAACxC,aAAD,CAAlB,IAAoDM,gBAArD,iBACCgB,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,4DAAA;AAAf,GAAA,eACEA,6BAAC,aAAD,EAAA;AACE,IAAA,SAAS,EAAC,mEADZ;AAEE,IAAA,GAAG,EAAEhB,gBAFP;AAGE,IAAA,GAAG,EAAEE,iBAHP;AAIE,IAAA,KAAK,EAAC,OAJR;AAKE,IAAA,MAAM,EAAC,OALT;AAME,IAAA,MAAM,EAAE,YAAA;MAAM,OAAAQ,kBAAkB,CAAC,IAAD,CAAlB,CAAA;KANhB;AAOE,IAAA,gBAAgB,eACdM,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,MAAA,SAAS,EAAC,yEAAA;KACb,eAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,MAAA,SAAS,EAAC,+EAAA;AAAf,KAAA,eACEA,6BAAC,IAAD,EAAA;AACE,MAAA,IAAI,EAAEmB,OAAO,CAACjC,iBAAD,CAAP,GAA6BiB,SAAS,CAACiB,IAAvC,GAA8CjB,SAAS,CAACkB,KADhE;MAEE,SAAS,EAAEhB,UAAU,CAACiB,eAFxB;AAGE,MAAA,KAAK,EAAC,MAHR;AAIE,MAAA,MAAM,EAAC,MAAA;AAJT,KAAA,CADF,CADF,CAAA;GATN,CAAA,EAqBIH,OAAO,CAACjC,iBAAD,CAAP,IAA8B,EAAE,CAAA,CAAAqC,EAAA,GAAC7C,aAA6B,KAAA,IAA7B,IAAAA,aAAa,KAAb,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,aAAa,CAAkB8C,UAAhC,MAA4C,IAA5C,IAA4CD,EAAA,KAAA,KAAA,CAA5C,GAA4C,KAAA,CAA5C,GAA4CA,EAAA,CAAAR,MAA5C,IAAqD,CAAvD,CAA/B,iBACCf,cACE,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,eAAAA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA;AAAO,IAAA,SAAS,EAAC,mEAAA;GACf,eAAAA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAQ,IAAA,GAAG,EAAEhB,gBAAb;AAA+B,IAAA,IAAI,EAAEE,iBAAAA;AAArC,GAAA,CADF,CADF,eAIEc,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,mEAAA;GACb,eAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,yEAAA;AAAf,GAAA,eACEA,6BAAC,IAAD,EAAA;IACE,IAAI,EAAEG,SAAS,CAACiB,IADlB;IAEE,SAAS,EAAEf,UAAU,CAACoB,IAFxB;AAGE,IAAA,KAAK,EAAC,MAHR;AAIE,IAAA,MAAM,EAAC,MAAA;GALX,CAAA,CADF,CAJF,CAtBJ,EAsCIhC,iBAAiB,IAAIiC,KAAK,CAACxC,iBAAD,CAA3B,iBACCc,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,mEAAA;GACb,eAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,yEAAA;AAAf,GAAA,eACEA,6BAAC,IAAD,EAAA;IACE,IAAI,EAAEG,SAAS,CAACwB,GADlB;IAEE,SAAS,EAAEtB,UAAU,CAACoB,IAFxB;AAGE,IAAA,KAAK,EAAC,MAHR;AAIE,IAAA,MAAM,EAAC,MAAA;AAJT,GAAA,CADF,CADF,CAvCJ,CAfJ,EAoEIG,aAAa,CAAClD,aAAD,CAAb,IAA+C,CAACmD,mBAAmB,CAAEnD,aAA6B,CAACS,IAAhC,CAAnE,IAA4GH,gBAA7G,iBACCgB,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,uDAAA;AAAf,GAAA,eACEA,6BAAC,IAAD,EAAA;AACE,IAAA,SAAS,EAAC,kEADZ;AAEE,IAAA,IAAI,EAAE,CAAA8B,EAAA,GAAA,EAAA,EACJA,EAAA,CAACnC,cAAc,CAACoC,KAAhB,CAAA,GAAwB5B,SAAS,CAACkB,KAD9B,EAEJS,EAAA,CAACnC,cAAc,CAACqC,KAAhB,CAAA,GAAwB7B,SAAS,CAACiB,IAF9B,EAGJU,EAAA,CAACnC,cAAc,CAACsC,KAAhB,CAAA,GAAwB9B,SAAS,CAAC+B,UAH9B,EAIJJ,EAAA,CAACnC,cAAc,CAACgC,GAAhB,CAAA,GAAsBxB,SAAS,CAACwB,GAJ5B,EAKJG,EAAA,CAACnC,cAAc,CAACwC,MAAhB,CAAA,GAAyBhC,SAAS,CAACiC,aAL/B,IAAA,EAMJC,gBAAgB,CAACnD,iBAAD,CANZ,CAFR;IASE,SAAS,EAAEmB,UAAU,CAACC,eATxB;AAUE,IAAA,KAAK,EAAC,MAVR;AAWE,IAAA,MAAM,EAAC,MAAA;GAZX,CAAA,eAcEN,6BAAC,KAAD,EAAA;AACE,IAAA,SAAS,EAAC,kEADZ;IAEE,IAAI,EAAEO,eAAe,CAACS,MAFxB;IAGE,KAAK,EAAEP,WAAW,CAACC,cAAAA;AAHrB,GAAA,EAKG4B,cAAc,CAACzC,aAAa,CAACA,aAAa,CAACkB,MAAd,GAAuB,CAAxB,CAAd,CALjB,CAdF,CArEJ,CAtBF,CADF,CAAA;AAsHD;;;;"}
+{"version":3,"file":"QuoteMessage.js","sources":["../../src/ui/QuoteMessage/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement, useContext, useState } from 'react';\nimport type { FileMessage, UserMessage } from '@sendbird/chat/message';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport ImageRenderer from '../ImageRenderer';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport {\n  getClassName,\n  getUIKitFileType,\n  getUIKitFileTypes,\n  isFileMessage,\n  isGif,\n  isSupportedFileView,\n  isThumbnailMessage,\n  isUserMessage,\n  isVideo,\n  truncateString,\n} from '../../utils';\ninterface Props {\n  className?: string | Array<string>;\n  message?: UserMessage | FileMessage;\n  userId?: string;\n  isByMe?: boolean;\n  isUnavailable?: boolean;\n  onClick?: () => void;\n}\n\nexport default function QuoteMessage({\n  message,\n  userId = '',\n  isByMe = false,\n  className,\n  isUnavailable = false,\n  onClick,\n}: Props): ReactElement {\n  const { stringSet } = useContext(LocalizationContext);\n\n  const { parentMessage } = message;\n  const parentMessageSender = (parentMessage as UserMessage | FileMessage)?.sender;\n  const parentMessageSenderNickname = (userId === parentMessageSender?.userId) ? stringSet.QUOTED_MESSAGE__CURRENT_USER : parentMessageSender?.nickname;\n  const parentMessageUrl = (parentMessage as FileMessage)?.url || '';\n  const parentMessageType = (parentMessage as FileMessage)?.type;\n  const currentMessageSenderNickname = (userId === message?.sender?.userId) ? stringSet.QUOTED_MESSAGE__CURRENT_USER : message?.sender?.nickname;\n\n  const [isThumbnailLoaded, setThumbnailLoaded] = useState(false);\n  const uikitFileTypes = getUIKitFileTypes();\n  const splitFileName = (parentMessage as FileMessage)?.name ? (parentMessage as FileMessage).name.split('/') : parentMessageUrl.split('/');\n\n  return (\n    <div\n      className={getClassName([className, 'sendbird-quote-message', isByMe ? 'outgoing' : 'incoming', isUnavailable ? 'unavailable' : ''])}\n      key={parentMessage?.messageId}\n      onClick={() => {\n        if (!isUnavailable && onClick) {\n          onClick();\n        }\n      }}\n      onTouchEnd={() => {\n        if (!isUnavailable && onClick) {\n          onClick();\n        }\n      }}\n    >\n      <div className=\"sendbird-quote-message__replied-to\">\n        <Icon\n          className=\"sendbird-quote-message__replied-to__icon\"\n          type={IconTypes.REPLY}\n          fillColor={IconColors.ON_BACKGROUND_3}\n          width=\"12px\"\n          height=\"12px\"\n        />\n        <Label\n          className=\"sendbird-quote-message__replied-to__text\"\n          type={LabelTypography.CAPTION_2}\n          color={LabelColors.ONBACKGROUND_3}\n        >\n          <span className=\"sendbird-quote-message__replied-to__text__nickname\">{currentMessageSenderNickname}</span>\n          <span className=\"sendbird-quote-message__replied-to__text__text\">{stringSet.QUOTED_MESSAGE__REPLIED_TO}</span>\n          <span className=\"sendbird-quote-message__replied-to__text__nickname\">{parentMessageSenderNickname}</span>\n        </Label>\n      </div>\n      <div className=\"sendbird-quote-message__replied-message\">\n        {isUnavailable && (\n          <div className=\"sendbird-quote-message__replied-message__text-message\">\n            <Label\n              className=\"sendbird-quote-message__replied-message__text-message__word\"\n              type={LabelTypography.BODY_2}\n              color={LabelColors.ONBACKGROUND_1}\n            >\n              {stringSet.QUOTED_MESSAGE__UNAVAILABLE}\n            </Label>\n          </div>\n        )}\n        {/* text message */}\n        {((isUserMessage(parentMessage as UserMessage) && (parentMessage as UserMessage)?.message?.length > 0) && !isUnavailable) && (\n          <div className=\"sendbird-quote-message__replied-message__text-message\">\n            <Label\n              className=\"sendbird-quote-message__replied-message__text-message__word\"\n              type={LabelTypography.BODY_2}\n              color={LabelColors.ONBACKGROUND_1}\n            >\n              {(parentMessage as UserMessage)?.message}\n            </Label>\n          </div>\n        )}\n        {/* thumbnail message */}\n        {(isThumbnailMessage(parentMessage as FileMessage) && parentMessageUrl && !isUnavailable) && (\n          <div className=\"sendbird-quote-message__replied-message__thumbnail-message\">\n            <ImageRenderer\n              className=\"sendbird-quote-message__replied-message__thumbnail-message__image\"\n              url={parentMessageUrl}\n              alt={parentMessageType}\n              width=\"144px\"\n              height=\"108px\"\n              onLoad={() => setThumbnailLoaded(true)}\n              defaultComponent={(\n                <div className=\"sendbird-quote-message__replied-message__thumbnail-message__placeholder\">\n                  <div className=\"sendbird-quote-message__replied-message__thumbnail-message__placeholder__icon\">\n                    <Icon\n                      type={isVideo(parentMessageType) ? IconTypes.PLAY : IconTypes.PHOTO}\n                      fillColor={IconColors.ON_BACKGROUND_2}\n                      width=\"22px\"\n                      height=\"22px\"\n                    />\n                  </div>\n                </div>\n              )}\n            />\n            {(isVideo(parentMessageType) && !((parentMessage as FileMessage)?.thumbnails?.length > 0)) && (\n              <>\n                <video className=\"sendbird-quote-message__replied-message__thumbnail-message__video\">\n                  <source src={parentMessageUrl} type={parentMessageType} />\n                </video>\n                <div className=\"sendbird-quote-message__replied-message__thumbnail-message__cover\">\n                  <div className=\"sendbird-quote-message__replied-message__thumbnail-message__cover__icon\">\n                    <Icon\n                      type={IconTypes.PLAY}\n                      fillColor={IconColors.GRAY}\n                      width=\"14px\"\n                      height=\"14px\"\n                    />\n                  </div>\n                </div>\n              </>\n            )}\n            {(isThumbnailLoaded && isGif(parentMessageType)) && (\n              <div className=\"sendbird-quote-message__replied-message__thumbnail-message__cover\">\n                <div className=\"sendbird-quote-message__replied-message__thumbnail-message__cover__icon\">\n                  <Icon\n                    type={IconTypes.GIF}\n                    fillColor={IconColors.GRAY}\n                    width=\"14px\"\n                    height=\"14px\"\n                  />\n                </div>\n              </div>\n            )}\n          </div>\n        )}\n        {/* file message */}\n        {(isFileMessage(parentMessage as FileMessage) && !isSupportedFileView((parentMessage as FileMessage).type) && parentMessageUrl && !isUnavailable) && (\n          <div className=\"sendbird-quote-message__replied-message__file-message\">\n            <Icon\n              className=\"sendbird-quote-message__replied-message__file-message__type-icon\"\n              type={{\n                [uikitFileTypes.IMAGE]: IconTypes.PHOTO,\n                [uikitFileTypes.VIDEO]: IconTypes.PLAY,\n                [uikitFileTypes.AUDIO]: IconTypes.FILE_AUDIO,\n                [uikitFileTypes.GIF]: IconTypes.GIF,\n                [uikitFileTypes.OTHERS]: IconTypes.FILE_DOCUMENT,\n              }[getUIKitFileType(parentMessageType)]}\n              fillColor={IconColors.ON_BACKGROUND_3}\n              width=\"16px\"\n              height=\"16px\"\n            />\n            <Label\n              className=\"sendbird-quote-message__replied-message__file-message__file-name\"\n              type={LabelTypography.BODY_2}\n              color={LabelColors.ONBACKGROUND_3}\n            >\n              {truncateString(splitFileName[splitFileName.length - 1])}\n            </Label>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["QuoteMessage","_a","message","_g","userId","_h","isByMe","className","_j","isUnavailable","onClick","stringSet","useContext","LocalizationContext","parentMessage","parentMessageSender","sender","parentMessageSenderNickname","QUOTED_MESSAGE__CURRENT_USER","nickname","parentMessageUrl","url","parentMessageType","type","currentMessageSenderNickname","_c","_d","_k","useState","isThumbnailLoaded","setThumbnailLoaded","uikitFileTypes","getUIKitFileTypes","splitFileName","name","split","React","getClassName","messageId","IconTypes","REPLY","IconColors","ON_BACKGROUND_3","LabelTypography","CAPTION_2","LabelColors","ONBACKGROUND_3","QUOTED_MESSAGE__REPLIED_TO","BODY_2","ONBACKGROUND_1","QUOTED_MESSAGE__UNAVAILABLE","isUserMessage","_e","length","isThumbnailMessage","isVideo","PLAY","PHOTO","ON_BACKGROUND_2","_f","thumbnails","GRAY","isGif","GIF","isFileMessage","isSupportedFileView","_b","IMAGE","VIDEO","AUDIO","FILE_AUDIO","OTHERS","FILE_DOCUMENT","getUIKitFileType","truncateString"],"mappings":";;;;;;;;;;;;AA6BwB,SAAAA,YAAA,CAAaC,EAAb,EAOhB;;;;;MANNC,OAAO,GAAAD,EAAA,CAAAC;MACPC,EAAA,GAAAF,EAAA,CAAAG;MAAAA,MAAM,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAEA;MACXE,EAAc,GAAAJ,EAAA,CAAAK;MAAdA,MAAM,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,KAAH,GAAQA;MACdE,SAAS,GAAAN,EAAA,CAAAM;MACTC,EAAqB,GAAAP,EAAA,CAAAQ;MAArBA,aAAa,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,KAAH,GAAQA;MACrBE,OAAO,GAAAT,EAAA,CAAAS;AAEC,EAAA,IAAAC,SAAS,GAAKC,UAAU,CAACC,mBAAD,CAAV,UAAd,CAAA;AAEA,EAAA,IAAAC,aAAa,GAAKZ,OAAO,CAAAY,aAAzB,CAAA;AACR,EAAA,IAAMC,mBAAmB,GAAID,aAA2C,KAAA,IAA3C,IAAAA,aAAa,KAAb,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,aAAa,CAAgCE,MAA1E,CAAA;AACA,EAAA,IAAMC,2BAA2B,GAAIb,MAAM,MAAKW,mBAAmB,KAAnB,IAAA,IAAAA,mBAAmB,KAAnB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,mBAAmB,CAAEX,MAA1B,CAAP,GAA2CO,SAAS,CAACO,4BAArD,GAAoFH,mBAAmB,KAAA,IAAnB,IAAAA,mBAAmB,KAAA,KAAA,CAAnB,GAAmB,KAAA,CAAnB,GAAAA,mBAAmB,CAAEI,QAA7I,CAAA;AACA,EAAA,IAAMC,gBAAgB,GAAG,CAACN,aAA6B,KAA7B,IAAA,IAAAA,aAAa,KAAb,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,aAAa,CAAkBO,GAAhC,KAAuC,EAAhE,CAAA;AACA,EAAA,IAAMC,iBAAiB,GAAIR,aAA6B,KAAA,IAA7B,IAAAA,aAAa,KAAb,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,aAAa,CAAkBS,IAA1D,CAAA;AACA,EAAA,IAAMC,4BAA4B,GAAIpB,MAAM,MAAK,MAAAF,OAAO,KAAA,IAAP,IAAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAAA,OAAO,CAAEc,MAAT,MAAiB,IAAjB,IAAiBS,EAAA,KAAA,KAAA,CAAjB,GAAiB,KAAA,CAAjB,GAAiBA,EAAA,CAAArB,MAAtB,CAAP,GAAuCO,SAAS,CAACO,4BAAjD,GAAgF,CAAAQ,EAAA,GAAAxB,OAAO,KAAP,IAAA,IAAAA,OAAO,WAAP,SAAA,GAAAA,OAAO,CAAEc,MAAT,MAAe,IAAf,IAAeU,EAAA,KAAA,KAAA,CAAf,GAAe,KAAA,CAAf,GAAeA,EAAA,CAAEP,QAAtI,CAAA;;AAEM,EAAA,IAAAQ,EAAA,GAA0CC,QAAQ,CAAC,KAAD,CAAlD;AAAA,MAACC,iBAAiB,GAAAF,EAAA,CAAA,CAAA,CAAlB;AAAA,MAAoBG,kBAAkB,GAAAH,EAAA,CAAA,CAAA,CAAtC,CAAA;;EACN,IAAMI,cAAc,GAAGC,iBAAiB,EAAxC,CAAA;AACA,EAAA,IAAMC,aAAa,GAAG,CAACnB,aAA6B,KAA7B,IAAA,IAAAA,aAAa,KAAb,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,aAAa,CAAkBoB,IAAhC,IAAwCpB,aAA6B,CAACoB,IAA9B,CAAmCC,KAAnC,CAAyC,GAAzC,CAAxC,GAAwFf,gBAAgB,CAACe,KAAjB,CAAuB,GAAvB,CAA9G,CAAA;EAEA,oBACEC,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;IACE,SAAS,EAAEC,YAAY,CAAC,CAAC9B,SAAD,EAAY,wBAAZ,EAAsCD,MAAM,GAAG,UAAH,GAAgB,UAA5D,EAAwEG,aAAa,GAAG,aAAH,GAAmB,EAAxG,CAAD,CADzB;AAEE,IAAA,GAAG,EAAEK,aAAa,KAAA,IAAb,IAAAA,aAAa,KAAA,KAAA,CAAb,GAAa,KAAA,CAAb,GAAAA,aAAa,CAAEwB,SAFtB;AAGE,IAAA,OAAO,EAAE,YAAA;AACP,MAAA,IAAI,CAAC7B,aAAD,IAAkBC,OAAtB,EAA+B;QAC7BA,OAAO,EAAA,CAAA;AACR,OAAA;KANL;AAQE,IAAA,UAAU,EAAE,YAAA;AACV,MAAA,IAAI,CAACD,aAAD,IAAkBC,OAAtB,EAA+B;QAC7BA,OAAO,EAAA,CAAA;AACR,OAAA;AACF,KAAA;GAED,eAAA0B,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,oCAAA;AAAf,GAAA,eACEA,6BAAC,IAAD,EAAA;AACE,IAAA,SAAS,EAAC,0CADZ;IAEE,IAAI,EAAEG,SAAS,CAACC,KAFlB;IAGE,SAAS,EAAEC,UAAU,CAACC,eAHxB;AAIE,IAAA,KAAK,EAAC,MAJR;AAKE,IAAA,MAAM,EAAC,MAAA;GANX,CAAA,eAQEN,6BAAC,KAAD,EAAA;AACE,IAAA,SAAS,EAAC,0CADZ;IAEE,IAAI,EAAEO,eAAe,CAACC,SAFxB;IAGE,KAAK,EAAEC,WAAW,CAACC,cAAAA;GAEnB,eAAAV,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAM,IAAA,SAAS,EAAC,oDAAA;GAAsDZ,EAAAA,4BAAtE,CALF,eAMEY,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAM,IAAA,SAAS,EAAC,gDAAA;AAAhB,GAAA,EAAkEzB,SAAS,CAACoC,0BAA5E,CANF,eAOEX,cAAA,CAAA,aAAA,CAAA,MAAA,EAAA;AAAM,IAAA,SAAS,EAAC,oDAAA;AAAhB,GAAA,EAAsEnB,2BAAtE,CAPF,CARF,CAdF,eAgCEmB,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,yCAAA;AAAf,GAAA,EACG3B,aAAa,iBACZ2B,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,uDAAA;AAAf,GAAA,eACEA,6BAAC,KAAD,EAAA;AACE,IAAA,SAAS,EAAC,6DADZ;IAEE,IAAI,EAAEO,eAAe,CAACK,MAFxB;IAGE,KAAK,EAAEH,WAAW,CAACI,cAAAA;GAElBtC,EAAAA,SAAS,CAACuC,2BALb,CADF,CAFJ,EAaKC,aAAa,CAACrC,aAAD,CAAb,IAA+C,CAAA,CAAAsC,EAAA,GAACtC,aAA6B,KAAA,IAA7B,IAAAA,aAAa,KAAA,KAAA,CAAb,GAAa,KAAA,CAAb,GAAAA,aAAa,CAAkBZ,OAAhC,MAAyC,IAAzC,IAAyCkD,EAAA,KAAA,KAAA,CAAzC,GAAyC,KAAA,CAAzC,GAAyCA,EAAA,CAAAC,MAAzC,IAAkD,CAAlG,IAAwG,CAAC5C,aAA1G,iBACC2B,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,uDAAA;AAAf,GAAA,eACEA,6BAAC,KAAD,EAAA;AACE,IAAA,SAAS,EAAC,6DADZ;IAEE,IAAI,EAAEO,eAAe,CAACK,MAFxB;IAGE,KAAK,EAAEH,WAAW,CAACI,cAAAA;GAEjBnC,EAAAA,aAA6B,KAA7B,IAAA,IAAAA,aAAa,WAAb,SAAA,GAAAA,aAAa,CAAkBZ,OALnC,CADF,CAdJ,EAyBIoD,kBAAkB,CAACxC,aAAD,CAAlB,IAAoDM,gBAApD,IAAwE,CAACX,aAA1E,iBACC2B,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,4DAAA;AAAf,GAAA,eACEA,6BAAC,aAAD,EAAA;AACE,IAAA,SAAS,EAAC,mEADZ;AAEE,IAAA,GAAG,EAAEhB,gBAFP;AAGE,IAAA,GAAG,EAAEE,iBAHP;AAIE,IAAA,KAAK,EAAC,OAJR;AAKE,IAAA,MAAM,EAAC,OALT;AAME,IAAA,MAAM,EAAE,YAAA;MAAM,OAAAQ,kBAAkB,CAAC,IAAD,CAAlB,CAAA;KANhB;AAOE,IAAA,gBAAgB,eACdM,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,MAAA,SAAS,EAAC,yEAAA;KACb,eAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,MAAA,SAAS,EAAC,+EAAA;AAAf,KAAA,eACEA,6BAAC,IAAD,EAAA;AACE,MAAA,IAAI,EAAEmB,OAAO,CAACjC,iBAAD,CAAP,GAA6BiB,SAAS,CAACiB,IAAvC,GAA8CjB,SAAS,CAACkB,KADhE;MAEE,SAAS,EAAEhB,UAAU,CAACiB,eAFxB;AAGE,MAAA,KAAK,EAAC,MAHR;AAIE,MAAA,MAAM,EAAC,MAAA;AAJT,KAAA,CADF,CADF,CAAA;GATN,CAAA,EAqBIH,OAAO,CAACjC,iBAAD,CAAP,IAA8B,EAAE,CAAA,CAAAqC,EAAA,GAAC7C,aAA6B,KAAA,IAA7B,IAAAA,aAAa,KAAb,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,aAAa,CAAkB8C,UAAhC,MAA4C,IAA5C,IAA4CD,EAAA,KAAA,KAAA,CAA5C,GAA4C,KAAA,CAA5C,GAA4CA,EAAA,CAAAN,MAA5C,IAAqD,CAAvD,CAA/B,iBACCjB,cACE,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,eAAAA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA;AAAO,IAAA,SAAS,EAAC,mEAAA;GACf,eAAAA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAQ,IAAA,GAAG,EAAEhB,gBAAb;AAA+B,IAAA,IAAI,EAAEE,iBAAAA;AAArC,GAAA,CADF,CADF,eAIEc,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,mEAAA;GACb,eAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,yEAAA;AAAf,GAAA,eACEA,6BAAC,IAAD,EAAA;IACE,IAAI,EAAEG,SAAS,CAACiB,IADlB;IAEE,SAAS,EAAEf,UAAU,CAACoB,IAFxB;AAGE,IAAA,KAAK,EAAC,MAHR;AAIE,IAAA,MAAM,EAAC,MAAA;GALX,CAAA,CADF,CAJF,CAtBJ,EAsCIhC,iBAAiB,IAAIiC,KAAK,CAACxC,iBAAD,CAA3B,iBACCc,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,mEAAA;GACb,eAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,yEAAA;AAAf,GAAA,eACEA,6BAAC,IAAD,EAAA;IACE,IAAI,EAAEG,SAAS,CAACwB,GADlB;IAEE,SAAS,EAAEtB,UAAU,CAACoB,IAFxB;AAGE,IAAA,KAAK,EAAC,MAHR;AAIE,IAAA,MAAM,EAAC,MAAA;GALX,CAAA,CADF,CAvCJ,CA1BJ,EA+EIG,aAAa,CAAClD,aAAD,CAAb,IAA+C,CAACmD,mBAAmB,CAAEnD,aAA6B,CAACS,IAAhC,CAAnE,IAA4GH,gBAA5G,IAAgI,CAACX,aAAlI,iBACC2B,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,uDAAA;AAAf,GAAA,eACEA,6BAAC,IAAD,EAAA;AACE,IAAA,SAAS,EAAC,kEADZ;AAEE,IAAA,IAAI,EAAE,CAAA8B,EAAA,GAAA,EAAA,EACJA,EAAA,CAACnC,cAAc,CAACoC,KAAhB,CAAA,GAAwB5B,SAAS,CAACkB,KAD9B,EAEJS,EAAA,CAACnC,cAAc,CAACqC,KAAhB,CAAA,GAAwB7B,SAAS,CAACiB,IAF9B,EAGJU,EAAA,CAACnC,cAAc,CAACsC,KAAhB,CAAA,GAAwB9B,SAAS,CAAC+B,UAH9B,EAIJJ,EAAA,CAACnC,cAAc,CAACgC,GAAhB,CAAA,GAAsBxB,SAAS,CAACwB,GAJ5B,EAKJG,EAAA,CAACnC,cAAc,CAACwC,MAAhB,CAAA,GAAyBhC,SAAS,CAACiC,aAL/B,IAAA,EAMJC,gBAAgB,CAACnD,iBAAD,CANZ,CAFR;IASE,SAAS,EAAEmB,UAAU,CAACC,eATxB;AAUE,IAAA,KAAK,EAAC,MAVR;AAWE,IAAA,MAAM,EAAC,MAAA;GAZX,CAAA,eAcEN,6BAAC,KAAD,EAAA;AACE,IAAA,SAAS,EAAC,kEADZ;IAEE,IAAI,EAAEO,eAAe,CAACK,MAFxB;IAGE,KAAK,EAAEH,WAAW,CAACC,cAAAA;AAHrB,GAAA,EAKG4B,cAAc,CAACzC,aAAa,CAACA,aAAa,CAACoB,MAAd,GAAuB,CAAxB,CAAd,CALjB,CAdF,CAhFJ,CAhCF,CADF,CAAA;AA2ID;;;;"}

package/ui/QuoteMessageInput.js

@@ -1,14 +1,14 @@
 import React__default, { useContext } from 'react';
-import { l as isFileMessage, m as isImageMessage, n as isThumbnailMessage, o as isAudioMessage, h as getClassName, p as isGifMessage, q as isVideoMessage, r as isUserMessage } from '../index-ca3ba8a0.js';
+import { l as isFileMessage, m as isImageMessage, n as isThumbnailMessage, o as isAudioMessage, h as getClassName, p as isGifMessage, q as isVideoMessage, r as isUserMessage } from '../index-1a59aaa9.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-64740116.js';
-import { a as LocalizationContext } from '../LocalizationContext-a90809c7.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-4a23e6ff.js';
+import { a as LocalizationContext } from '../LocalizationContext-5920dafc.js';
 import ImageRenderer from './ImageRenderer.js';
-import '../tslib.es6-e592f653.js';
+import '../tslib.es6-279bc71d.js';
 import '../utils/message/getOutgoingMessageState.js';
 import 'prop-types';
-import '../stringSet-e413411d.js';
-import '../index-8e0d1cc6.js';
+import '../stringSet-f0e25f08.js';
+import '../index-b5b56cb7.js';
 
 var componentClassname = 'sendbird-quote_message_input__avatar';
 function QuoteMessageThumbnail(_a) {

package/ui/ReactionBadge.js

@@ -1,8 +1,8 @@
-import { a as __spreadArray } from '../tslib.es6-e592f653.js';
+import { a as __spreadArray } from '../tslib.es6-279bc71d.js';
 import React__default from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-64740116.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-4a23e6ff.js';
 import 'prop-types';
-import '../stringSet-e413411d.js';
+import '../stringSet-f0e25f08.js';
 
 var ReactionBadge = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
   var _a = props.className,

package/ui/ReactionButton.js

@@ -1,4 +1,4 @@
-import { a as __spreadArray } from '../tslib.es6-e592f653.js';
+import { a as __spreadArray } from '../tslib.es6-279bc71d.js';
 import React__default from 'react';
 
 var ReactionButton = /*#__PURE__*/React__default.forwardRef(function (props, ref) {

package/ui/SortByRow.js

@@ -1,6 +1,6 @@
-import { a as __spreadArray } from '../tslib.es6-e592f653.js';
+import { a as __spreadArray } from '../tslib.es6-279bc71d.js';
 import React__default from 'react';
-import { u as uuidv4 } from '../uuid-c41826f3.js';
+import { u as uuidv4 } from '../uuid-636df95b.js';
 
 var componentClassName = 'sendbird-sort-by-row';
 function SortByRow(_a) {

package/ui/SortByRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"SortByRow.js","sources":["../../src/ui/SortByRow/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport uuidv4 from '../../utils/uuid';\n\nimport './index.scss';\n\nconst componentClassName = 'sendbird-sort-by-row';\n\nexport interface SortByRowProps {\n  className?: string | Array<string>;\n  maxItemCount: number;\n  itemWidth: number;\n  itemHeight: number;\n  children: ReactElement | Array<ReactElement>;\n}\nexport default function SortByRow({\n  className = '',\n  maxItemCount,\n  itemWidth,\n  itemHeight,\n  children,\n}: SortByRowProps): ReactElement {\n  if (Array.isArray(children) && children.length > maxItemCount) {\n    const result = [];\n\n    for (let i = 0; i < children.length; i += maxItemCount) {\n      result.push(\n        <div\n          className={[\n            ...(Array.isArray(className) ? className : [className]),\n            componentClassName,\n          ].join(' ')}\n          key={uuidv4()}\n          style={{\n            width: itemWidth * maxItemCount,\n            height: itemHeight,\n          }}\n        >\n          {\n            children.slice(i, i + maxItemCount)\n          }\n        </div>,\n      );\n    }\n    return <>{result}</>;\n  }\n\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        componentClassName,\n      ].join(' ')}\n      style={{\n        width: itemWidth * (Array.isArray(children) ? children.length : 1),\n        height: itemHeight,\n      }}\n    >\n      {children}\n    </div>\n  );\n}\n"],"names":["componentClassName","SortByRow","_a","_b","className","maxItemCount","itemWidth","itemHeight","children","Array","isArray","length","result","i","push","React","__spreadArray","join","uuidv4","width","height","slice"],"mappings":";;;;AAKA,IAAMA,kBAAkB,GAAG,sBAA3B,CAAA;AASwB,SAAAC,SAAA,CAAUC,EAAV,EAMP;AALf,EAAA,IAAAC,EAAA,GAAAD,EAAA,CAAAE,SAAA;MAAAA,SAAS,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,EAAH,GAAKA,EAAd;AAAA,MACAE,YAAY,GAAAH,EAAA,CAAAG,YADZ;AAAA,MAEAC,SAAS,eAFT;AAAA,MAGAC,UAAU,GAAAL,EAAA,CAAAK,UAHV;AAAA,MAIAC,QAAQ,GAAAN,EAAA,CAAAM,QAJR,CAAA;;EAMA,IAAIC,KAAK,CAACC,OAAN,CAAcF,QAAd,CAA2BA,IAAAA,QAAQ,CAACG,MAAT,GAAkBN,YAAjD,EAA+D;IAC7D,IAAMO,MAAM,GAAG,EAAf,CAAA;;AAEA,IAAA,KAAK,IAAIC,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGL,QAAQ,CAACG,MAA7B,EAAqCE,CAAC,IAAIR,YAA1C,EAAwD;MACtDO,MAAM,CAACE,IAAP,eACEC,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,QAAA,SAAS,EAAEC,aACN,CAAAA,aAAA,CAAA,EAAA,EAACP,KAAK,CAACC,OAAN,CAAcN,SAAd,CAAA,GAA2BA,SAA3B,GAAuC,CAACA,SAAD,CAAxC,EAAoD,IAApD,CAAA,EAAoD,CACvDJ,kBADuD,CAApD,EAEH,KAFG,CADM,CAGTiB,IAHS,CAGJ,GAHI,CADb;QAKE,GAAG,EAAEC,MAAM,EALb;AAME,QAAA,KAAK,EAAE;UACLC,KAAK,EAAEb,SAAS,GAAGD,YADd;AAELe,UAAAA,MAAM,EAAEb,UAAAA;AAFH,SAAA;OAMLC,EAAAA,QAAQ,CAACa,KAAT,CAAeR,CAAf,EAAkBA,CAAC,GAAGR,YAAtB,CAZJ,CADF,CAAA,CAAA;AAiBD,KAAA;;IACD,oBAAOU,cAAA,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,EAAGH,MAAH,CAAP,CAAA;AACD,GAAA;;EAED,oBACEG,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,SAAS,EAAEC,aAAA,CAAAA,aAAA,CAAA,EAAA,EACLP,KAAK,CAACC,OAAN,CAAcN,SAAd,CAAA,GAA2BA,SAA3B,GAAuC,CAACA,SAAD,CADlC,EAC8C,IAD9C,CAAA,EAC8C,CACvDJ,kBADuD,CAD9C,EAGT,KAHS,CAAA,CAGTiB,IAHS,CAGJ,GAHI,CADb;AAKE,IAAA,KAAK,EAAE;AACLE,MAAAA,KAAK,EAAEb,SAAS,IAAIG,KAAK,CAACC,OAAN,CAAcF,QAAd,CAAA,GAA0BA,QAAQ,CAACG,MAAnC,GAA4C,CAAhD,CADX;AAELS,MAAAA,MAAM,EAAEb,UAAAA;AAFH,KAAA;AALT,GAAA,EAUGC,QAVH,CADF,CAAA;AAcD;;;;"}
+{"version":3,"file":"SortByRow.js","sources":["../../src/ui/SortByRow/index.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode } from 'react';\nimport uuidv4 from '../../utils/uuid';\n\nimport './index.scss';\n\nconst componentClassName = 'sendbird-sort-by-row';\n\nexport interface SortByRowProps {\n  className?: string | Array<string>;\n  maxItemCount: number;\n  itemWidth: number;\n  itemHeight: number;\n  children: ReactNode;\n}\nexport default function SortByRow({\n  className = '',\n  maxItemCount,\n  itemWidth,\n  itemHeight,\n  children,\n}: SortByRowProps): ReactElement {\n  if (Array.isArray(children) && children.length > maxItemCount) {\n    const result = [];\n\n    for (let i = 0; i < children.length; i += maxItemCount) {\n      result.push(\n        <div\n          className={[\n            ...(Array.isArray(className) ? className : [className]),\n            componentClassName,\n          ].join(' ')}\n          key={uuidv4()}\n          style={{\n            width: itemWidth * maxItemCount,\n            height: itemHeight,\n          }}\n        >\n          {\n            children.slice(i, i + maxItemCount)\n          }\n        </div>,\n      );\n    }\n    return <>{result}</>;\n  }\n\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        componentClassName,\n      ].join(' ')}\n      style={{\n        width: itemWidth * (Array.isArray(children) ? children.length : 1),\n        height: itemHeight,\n      }}\n    >\n      {children as ReactElement}\n    </div>\n  );\n}\n"],"names":["componentClassName","SortByRow","_a","_b","className","maxItemCount","itemWidth","itemHeight","children","Array","isArray","length","result","i","push","React","__spreadArray","join","uuidv4","width","height","slice"],"mappings":";;;;AAKA,IAAMA,kBAAkB,GAAG,sBAA3B,CAAA;AASwB,SAAAC,SAAA,CAAUC,EAAV,EAMP;AALf,EAAA,IAAAC,EAAA,GAAAD,EAAA,CAAAE,SAAA;MAAAA,SAAS,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,EAAH,GAAKA,EAAd;AAAA,MACAE,YAAY,GAAAH,EAAA,CAAAG,YADZ;AAAA,MAEAC,SAAS,eAFT;AAAA,MAGAC,UAAU,GAAAL,EAAA,CAAAK,UAHV;AAAA,MAIAC,QAAQ,GAAAN,EAAA,CAAAM,QAJR,CAAA;;EAMA,IAAIC,KAAK,CAACC,OAAN,CAAcF,QAAd,CAA2BA,IAAAA,QAAQ,CAACG,MAAT,GAAkBN,YAAjD,EAA+D;IAC7D,IAAMO,MAAM,GAAG,EAAf,CAAA;;AAEA,IAAA,KAAK,IAAIC,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGL,QAAQ,CAACG,MAA7B,EAAqCE,CAAC,IAAIR,YAA1C,EAAwD;MACtDO,MAAM,CAACE,IAAP,eACEC,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,QAAA,SAAS,EAAEC,aACN,CAAAA,aAAA,CAAA,EAAA,EAACP,KAAK,CAACC,OAAN,CAAcN,SAAd,CAAA,GAA2BA,SAA3B,GAAuC,CAACA,SAAD,CAAxC,EAAoD,IAApD,CAAA,EAAoD,CACvDJ,kBADuD,CAApD,EAEH,KAFG,CADM,CAGTiB,IAHS,CAGJ,GAHI,CADb;QAKE,GAAG,EAAEC,MAAM,EALb;AAME,QAAA,KAAK,EAAE;UACLC,KAAK,EAAEb,SAAS,GAAGD,YADd;AAELe,UAAAA,MAAM,EAAEb,UAAAA;AAFH,SAAA;OAMLC,EAAAA,QAAQ,CAACa,KAAT,CAAeR,CAAf,EAAkBA,CAAC,GAAGR,YAAtB,CAZJ,CADF,CAAA,CAAA;AAiBD,KAAA;;IACD,oBAAOU,cAAA,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,EAAGH,MAAH,CAAP,CAAA;AACD,GAAA;;EAED,oBACEG,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,SAAS,EAAEC,aAAA,CAAAA,aAAA,CAAA,EAAA,EACLP,KAAK,CAACC,OAAN,CAAcN,SAAd,CAAA,GAA2BA,SAA3B,GAAuC,CAACA,SAAD,CADlC,EAC8C,IAD9C,CAAA,EAC8C,CACvDJ,kBADuD,CAD9C,EAGT,KAHS,CAAA,CAGTiB,IAHS,CAGJ,GAHI,CADb;AAKE,IAAA,KAAK,EAAE;AACLE,MAAAA,KAAK,EAAEb,SAAS,IAAIG,KAAK,CAACC,OAAN,CAAcF,QAAd,CAAA,GAA0BA,QAAQ,CAACG,MAAnC,GAA4C,CAAhD,CADX;AAELS,MAAAA,MAAM,EAAEb,UAAAA;AAFH,KAAA;AALT,GAAA,EAUGC,QAVH,CADF,CAAA;AAcD;;;;"}

package/ui/TextButton.js

@@ -1,6 +1,6 @@
-import { a as __spreadArray } from '../tslib.es6-e592f653.js';
+import { a as __spreadArray } from '../tslib.es6-279bc71d.js';
 import React__default from 'react';
-import { C as Colors, c as changeColorToClassName } from '../color-e740c17f.js';
+import { C as Colors, c as changeColorToClassName } from '../color-253fcdc4.js';
 
 var TextButton = function (_a) {
   var _b = _a.className,

package/ui/TextMessageItemBody.js

@@ -1,14 +1,14 @@
 import React__default, { useContext, useMemo } from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-64740116.js';
-import { h as getClassName, d as isEditedMessage } from '../index-ca3ba8a0.js';
-import { a as LocalizationContext } from '../LocalizationContext-a90809c7.js';
-import { u as uuidv4 } from '../uuid-c41826f3.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-4a23e6ff.js';
+import { h as getClassName, d as isEditedMessage } from '../index-1a59aaa9.js';
+import { a as LocalizationContext } from '../LocalizationContext-5920dafc.js';
+import { u as uuidv4 } from '../uuid-636df95b.js';
 import Word from './Word.js';
 import 'prop-types';
-import '../stringSet-e413411d.js';
-import '../tslib.es6-e592f653.js';
+import '../stringSet-f0e25f08.js';
+import '../tslib.es6-279bc71d.js';
 import '../utils/message/getOutgoingMessageState.js';
-import '../index-8e0d1cc6.js';
+import '../index-b5b56cb7.js';
 import './LinkLabel.js';
 import './MentionLabel.js';
 import './ContextMenu.js';
@@ -16,11 +16,11 @@ import 'react-dom';
 import './SortByRow.js';
 import './UserProfile.js';
 import '../withSendbird.js';
-import '../_rollupPluginBabelHelpers-51c9f5c3.js';
-import '../UserProfileContext-4e70ef73.js';
+import '../_rollupPluginBabelHelpers-636e674b.js';
+import '../UserProfileContext-749db4f6.js';
 import '../sendbirdSelectors.js';
-import '../topics-b81e5b9b.js';
-import '../utils-c2438081.js';
+import '../topics-d2e15fe6.js';
+import '../utils-5a4995e3.js';
 import './Avatar.js';
 import './ImageRenderer.js';
 import './Icon.js';

package/ui/ThreadReplies.js

@@ -0,0 +1,76 @@
+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-4a23e6ff.js';
+import { u as useLocalization } from '../LocalizationContext-5920dafc.js';
+import { u as uuidv4 } from '../uuid-636df95b.js';
+import '../tslib.es6-279bc71d.js';
+import './ImageRenderer.js';
+import 'prop-types';
+import '../stringSet-f0e25f08.js';
+import '../index-b5b56cb7.js';
+
+function ThreadReplies(_a) {
+  var _b;
+
+  var className = _a.className,
+      threadInfo = _a.threadInfo,
+      onClick = _a.onClick;
+  var _c = threadInfo.mostRepliedUsers,
+      mostRepliedUsers = _c === void 0 ? [] : _c,
+      replyCount = threadInfo.replyCount;
+  var stringSet = useLocalization().stringSet;
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-ui-thread-replies ".concat(className),
+    role: "button",
+    onClick: function (e) {
+      onClick(e);
+      e === null || e === void 0 ? void 0 : e.stopPropagation();
+    },
+    onKeyDown: function (e) {
+      onClick(e);
+      e === null || e === void 0 ? void 0 : e.stopPropagation();
+    }
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-ui-thread-replies__user-profiles"
+  }, mostRepliedUsers.slice(0, 4).map(function (user) {
+    return /*#__PURE__*/React__default.createElement(Avatar, {
+      key: uuidv4(),
+      className: "sendbird-ui-thread-replies__user-profiles__avatar",
+      src: user === null || user === void 0 ? void 0 : user.profileUrl,
+      alt: "user profile",
+      width: "20px",
+      height: "20px"
+    });
+  }), (mostRepliedUsers === null || mostRepliedUsers === void 0 ? void 0 : mostRepliedUsers.length) >= 5 && /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-ui-thread-replies__user-profiles__avatar"
+  }, /*#__PURE__*/React__default.createElement(Avatar, {
+    className: "sendbird-ui-thread-replies__user-profiles__avatar__image",
+    src: (_b = mostRepliedUsers === null || mostRepliedUsers === void 0 ? void 0 : mostRepliedUsers[4]) === null || _b === void 0 ? void 0 : _b.profileUrl,
+    alt: "user profile",
+    width: "20px",
+    height: "20px"
+  }), /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-ui-thread-replies__user-profiles__avatar__cover"
+  }), /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-ui-thread-replies__user-profiles__avatar__plus"
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    type: IconTypes.PLUS,
+    fillColor: IconColors.WHITE,
+    width: "16px",
+    height: "16px"
+  })))), /*#__PURE__*/React__default.createElement(Label, {
+    className: "sendbird-ui-thread-replies__reply-counts",
+    type: LabelTypography.CAPTION_2,
+    color: LabelColors.PRIMARY
+  }, replyCount === 1 ? "".concat(replyCount, " ").concat(stringSet.CHANNEL__THREAD_REPLY) : "".concat(replyCount > 99 ? stringSet.CHANNEL__THREAD_OVER_MAX : replyCount, " ").concat(stringSet.CHANNEL__THREAD_REPLIES)), /*#__PURE__*/React__default.createElement(Icon, {
+    className: "sendbird-ui-thread-replies__icon",
+    type: IconTypes.CHEVRON_RIGHT,
+    fillColor: IconColors.PRIMARY,
+    width: "16px",
+    height: "16px"
+  }));
+}
+
+export { ThreadReplies as default };
+//# sourceMappingURL=ThreadReplies.js.map

package/ui/ThreadReplies.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThreadReplies.js","sources":["../../src/ui/ThreadReplies/index.tsx"],"sourcesContent":["import React from 'react';\nimport { ThreadInfo } from '@sendbird/chat/message';\n\nimport './index.scss';\nimport Avatar from '../Avatar';\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport Label, { LabelTypography, LabelColors } from '../../ui/Label';\nimport { useLocalization } from '../../lib/LocalizationContext';\nimport uuidv4 from '../../utils/uuid';\n\nexport interface ThreadRepliesProps {\n  className?: string;\n  threadInfo: ThreadInfo;\n  onClick?: (e: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>) => void;\n}\n\nexport default function ThreadReplies({\n  className,\n  threadInfo,\n  onClick,\n}: ThreadRepliesProps): React.ReactElement {\n  const {\n    mostRepliedUsers = [],\n    replyCount,\n  } = threadInfo;\n  const { stringSet } = useLocalization();\n  return (\n    <div\n      className={`sendbird-ui-thread-replies ${className}`}\n      role=\"button\"\n      onClick={(e) => {\n        onClick(e);\n        e?.stopPropagation();\n      }}\n      onKeyDown={(e) => {\n        onClick(e);\n        e?.stopPropagation();\n      }}\n    >\n      <div className=\"sendbird-ui-thread-replies__user-profiles\">\n        {mostRepliedUsers.slice(0, 4).map((user) => {\n          return (\n            <Avatar\n              key={uuidv4()}\n              className=\"sendbird-ui-thread-replies__user-profiles__avatar\"\n              src={user?.profileUrl}\n              alt=\"user profile\"\n              width=\"20px\"\n              height=\"20px\"\n            />\n          );\n        })}\n        {mostRepliedUsers?.length >= 5 && (\n          <div className=\"sendbird-ui-thread-replies__user-profiles__avatar\">\n            <Avatar\n              className=\"sendbird-ui-thread-replies__user-profiles__avatar__image\"\n              src={mostRepliedUsers?.[4]?.profileUrl}\n              alt=\"user profile\"\n              width=\"20px\"\n              height=\"20px\"\n            />\n            <div className=\"sendbird-ui-thread-replies__user-profiles__avatar__cover\" />\n            <div className=\"sendbird-ui-thread-replies__user-profiles__avatar__plus\">\n              <Icon\n                type={IconTypes.PLUS}\n                fillColor={IconColors.WHITE}\n                width=\"16px\"\n                height=\"16px\"\n              />\n            </div>\n          </div>\n        )}\n      </div>\n      <Label\n        className=\"sendbird-ui-thread-replies__reply-counts\"\n        type={LabelTypography.CAPTION_2}\n        color={LabelColors.PRIMARY}\n      >\n        {\n          replyCount === 1\n            ? `${replyCount} ${stringSet.CHANNEL__THREAD_REPLY}`\n            : `${replyCount > 99 ? stringSet.CHANNEL__THREAD_OVER_MAX : replyCount} ${stringSet.CHANNEL__THREAD_REPLIES}`\n        }\n      </Label>\n      <Icon\n        className=\"sendbird-ui-thread-replies__icon\"\n        type={IconTypes.CHEVRON_RIGHT}\n        fillColor={IconColors.PRIMARY}\n        width=\"16px\"\n        height=\"16px\"\n      />\n    </div>\n  );\n}\n"],"names":["ThreadReplies","_a","className","threadInfo","onClick","_c","mostRepliedUsers","replyCount","stringSet","useLocalization","React","e","stopPropagation","slice","map","user","uuidv4","profileUrl","length","_b","IconTypes","PLUS","IconColors","WHITE","LabelTypography","CAPTION_2","LabelColors","PRIMARY","concat","CHANNEL__THREAD_REPLY","CHANNEL__THREAD_OVER_MAX","CHANNEL__THREAD_REPLIES","CHEVRON_RIGHT"],"mappings":"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"}

package/ui/ThumbnailMessageItemBody.js

@@ -1,9 +1,9 @@
 import React__default, { useState } from 'react';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import ImageRenderer from './ImageRenderer.js';
-import { h as getClassName, s as isSentMessage, q as isVideoMessage, p as isGifMessage } from '../index-ca3ba8a0.js';
+import { h as getClassName, s as isSentMessage, q as isVideoMessage, p as isGifMessage } from '../index-1a59aaa9.js';
 import 'prop-types';
-import '../tslib.es6-e592f653.js';
+import '../tslib.es6-279bc71d.js';
 import '../utils/message/getOutgoingMessageState.js';
 
 function ThumbnailMessageItemBody(_a) {
@@ -17,14 +17,16 @@ function ThumbnailMessageItemBody(_a) {
       mouseHover = _e === void 0 ? false : _e,
       _f = _a.isReactionEnabled,
       isReactionEnabled = _f === void 0 ? false : _f,
-      showFileViewer = _a.showFileViewer;
-  var _g = message.thumbnails,
-      thumbnails = _g === void 0 ? [] : _g;
+      showFileViewer = _a.showFileViewer,
+      _g = _a.style,
+      style = _g === void 0 ? {} : _g;
+  var _h = message.thumbnails,
+      thumbnails = _h === void 0 ? [] : _h;
   var thumbnailUrl = thumbnails.length > 0 ? (_b = thumbnails[0]) === null || _b === void 0 ? void 0 : _b.url : '';
 
-  var _h = useState(false),
-      imageRendered = _h[0],
-      setImageRendered = _h[1];
+  var _j = useState(false),
+      imageRendered = _j[0],
+      setImageRendered = _j[1];
 
   return /*#__PURE__*/React__default.createElement("div", {
     className: getClassName([className, 'sendbird-thumbnail-message-item-body', isByMe ? 'outgoing' : 'incoming', mouseHover ? 'mouse-hover' : '', isReactionEnabled && ((_c = message === null || message === void 0 ? void 0 : message.reactions) === null || _c === void 0 ? void 0 : _c.length) > 0 ? 'reactions' : '']),
@@ -37,15 +39,15 @@ function ThumbnailMessageItemBody(_a) {
     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,
-    width: "360px",
-    height: "270px",
+    width: (style === null || style === void 0 ? void 0 : style.width) || "360px",
+    height: (style === null || style === void 0 ? void 0 : style.height) || "270px",
     onLoad: function () {
       setImageRendered(true);
     },
-    placeHolder: function (style) {
+    placeHolder: function (style_) {
       return /*#__PURE__*/React__default.createElement("div", {
         className: "sendbird-thumbnail-message-item-body__placeholder",
-        style: style
+        style: style_
       }, /*#__PURE__*/React__default.createElement("div", {
         className: "sendbird-thumbnail-message-item-body__placeholder__icon"
       }, /*#__PURE__*/React__default.createElement(Icon, {

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}\n\nexport default function ThumbnailMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isReactionEnabled = false,\n  showFileViewer,\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=\"360px\"\n        height=\"270px\"\n        onLoad={() => { setImageRendered(true) }}\n        placeHolder={(style) => (\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","_a","className","message","_d","isByMe","_e","mouseHover","_f","isReactionEnabled","showFileViewer","_g","thumbnails","thumbnailUrl","length","_b","url","_h","useState","imageRendered","setImageRendered","React","getClassName","_c","reactions","isSentMessage","type","style","isVideoMessage","IconTypes","PLAY","PHOTO","IconColors","ON_BACKGROUND_2","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';\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","_a","className","message","_d","isByMe","_e","mouseHover","_f","isReactionEnabled","showFileViewer","_g","style","_h","thumbnails","thumbnailUrl","length","_b","url","_j","useState","imageRendered","setImageRendered","React","getClassName","_c","reactions","isSentMessage","type","width","height","style_","isVideoMessage","IconTypes","PLAY","PHOTO","IconColors","ON_BACKGROUND_2","isGifMessage","GIF","GRAY"],"mappings":"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"}

package/ui/Tooltip.js

@@ -1,8 +1,8 @@
-import { a as __spreadArray } from '../tslib.es6-e592f653.js';
+import { a as __spreadArray } from '../tslib.es6-279bc71d.js';
 import React__default from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-64740116.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-4a23e6ff.js';
 import 'prop-types';
-import '../stringSet-e413411d.js';
+import '../stringSet-f0e25f08.js';
 
 function Tooltip(_a) {
   var _b = _a.className,

package/ui/TooltipWrapper.js

@@ -1,4 +1,4 @@
-import { a as __spreadArray } from '../tslib.es6-e592f653.js';
+import { a as __spreadArray } from '../tslib.es6-279bc71d.js';
 import React__default, { useState, useRef } from 'react';
 
 var SPACE_FROM_TRIGGER = 8;

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-64740116.js';
-import { h as getClassName } from '../index-ca3ba8a0.js';
-import { a as LocalizationContext } from '../LocalizationContext-a90809c7.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-4a23e6ff.js';
+import { h as getClassName } from '../index-1a59aaa9.js';
+import { a as LocalizationContext } from '../LocalizationContext-5920dafc.js';
 import 'prop-types';
-import '../stringSet-e413411d.js';
-import '../tslib.es6-e592f653.js';
+import '../stringSet-f0e25f08.js';
+import '../tslib.es6-279bc71d.js';
 import '../utils/message/getOutgoingMessageState.js';
-import '../index-8e0d1cc6.js';
+import '../index-b5b56cb7.js';
 
 function UnknownMessageItemBody(_a) {
   var _b;

package/ui/UserListItem.js

@@ -1,28 +1,28 @@
-import { a as __spreadArray } from '../tslib.es6-e592f653.js';
+import { a as __spreadArray } from '../tslib.es6-279bc71d.js';
 import React__default, { useContext } from 'react';
-import { a as UserProfileContext } from '../UserProfileContext-4e70ef73.js';
-import { a as LocalizationContext } from '../LocalizationContext-a90809c7.js';
+import { a as UserProfileContext } from '../UserProfileContext-749db4f6.js';
+import { a as LocalizationContext } from '../LocalizationContext-5920dafc.js';
 import Avatar from './Avatar.js';
 import MutedAvatarOverlay from './MutedAvatarOverlay.js';
 import Checkbox from './Checkbox.js';
 import ConnectedUserProfile from './UserProfile.js';
 import ContextMenu, { MenuItems } from './ContextMenu.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-64740116.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-4a23e6ff.js';
 import 'prop-types';
-import '../stringSet-e413411d.js';
-import '../index-8e0d1cc6.js';
+import '../stringSet-f0e25f08.js';
+import '../index-b5b56cb7.js';
 import './ImageRenderer.js';
 import './Icon.js';
-import '../uuid-c41826f3.js';
+import '../uuid-636df95b.js';
 import '../withSendbird.js';
-import '../_rollupPluginBabelHelpers-51c9f5c3.js';
+import '../_rollupPluginBabelHelpers-636e674b.js';
 import '../sendbirdSelectors.js';
-import '../topics-b81e5b9b.js';
-import '../utils-c2438081.js';
+import '../topics-d2e15fe6.js';
+import '../utils-5a4995e3.js';
 import './Button.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../index-ca3ba8a0.js';
+import '../index-1a59aaa9.js';
 import '../utils/message/getOutgoingMessageState.js';
 
 function UserListItem(_a) {
@@ -33,7 +33,7 @@ function UserListItem(_a) {
       isOperator = _a.isOperator,
       disabled = _a.disabled,
       disableMessaging = _a.disableMessaging,
-      currentUser = _a.currentUser,
+      currentUserId = _a.currentUserId,
       action = _a.action,
       onChange = _a.onChange;
   var uniqueKey = user.userId;
@@ -76,17 +76,17 @@ function UserListItem(_a) {
         ,
         closeDropdown: closeDropdown,
         style: {
-          paddingTop: 0,
-          paddingBottom: 0
+          paddingTop: '0px',
+          paddingBottom: '0px'
         }
       }, renderUserProfile ? renderUserProfile({
         user: user,
-        currentUserId: currentUser,
+        currentUserId: currentUserId,
         close: closeDropdown
       }) : /*#__PURE__*/React__default.createElement(ConnectedUserProfile, {
         disableMessaging: disableMessaging,
         user: user,
-        currentUserId: currentUser,
+        currentUserId: currentUserId,
         onSuccess: closeDropdown
       }));
     }
@@ -94,7 +94,7 @@ function UserListItem(_a) {
     className: "sendbird-user-list-item__title",
     type: LabelTypography.SUBTITLE_1,
     color: LabelColors.ONBACKGROUND_1
-  }, user.nickname || stringSet.NO_NAME, currentUser === user.userId && ' (You)'), // if there is now nickname, display userId
+  }, user.nickname || stringSet.NO_NAME, currentUserId === user.userId && ' (You)'), // if there is now nickname, display userId
   !user.nickname && /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-user-list-item__subtitle",
     type: LabelTypography.CAPTION_3,

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);\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: 0, paddingBottom: 0 }}\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","_a","user","className","checked","checkBox","isOperator","disabled","disableMessaging","currentUser","action","onChange","uniqueKey","userId","actionRef","React","useRef","parentRef","avatarRef","_b","useContext","UserProfileContext","disableUserProfile","renderUserProfile","stringSet","LocalizationContext","__spreadArray","Array","isArray","join","isMuted","toggleDropdown","profileUrl","closeDropdown","paddingTop","paddingBottom","currentUserId","close","UserProfile","LabelTypography","SUBTITLE_1","LabelColors","ONBACKGROUND_1","nickname","NO_NAME","CAPTION_3","ONBACKGROUND_2","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  currentUserId?: 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  currentUserId,\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,\n                  close: closeDropdown,\n                })\n                : (\n                  <UserProfile\n                    disableMessaging={disableMessaging}\n                    user={user}\n                    currentUserId={currentUserId}\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          (currentUserId === 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","_a","user","className","checked","checkBox","isOperator","disabled","disableMessaging","currentUserId","action","onChange","uniqueKey","userId","actionRef","React","useRef","parentRef","avatarRef","_b","useContext","UserProfileContext","disableUserProfile","renderUserProfile","stringSet","LocalizationContext","__spreadArray","Array","isArray","join","isMuted","toggleDropdown","profileUrl","closeDropdown","paddingTop","paddingBottom","close","UserProfile","LabelTypography","SUBTITLE_1","LabelColors","ONBACKGROUND_1","nickname","NO_NAME","CAPTION_3","ONBACKGROUND_2","event","SUBTITLE_2"],"mappings":"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"}

package/ui/UserProfile.js

@@ -1,21 +1,21 @@
 import React__default, { useContext } from 'react';
-import { a as LocalizationContext } from '../LocalizationContext-a90809c7.js';
+import { a as LocalizationContext } from '../LocalizationContext-5920dafc.js';
 import withSendbirdContext from '../withSendbird.js';
-import { a as UserProfileContext } from '../UserProfileContext-4e70ef73.js';
+import { a as UserProfileContext } from '../UserProfileContext-749db4f6.js';
 import { getSdk, getCreateGroupChannel } from '../sendbirdSelectors.js';
 import Avatar from './Avatar.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-64740116.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-4a23e6ff.js';
 import Button, { ButtonTypes } from './Button.js';
-import '../stringSet-e413411d.js';
-import '../index-8e0d1cc6.js';
-import '../_rollupPluginBabelHelpers-51c9f5c3.js';
+import '../stringSet-f0e25f08.js';
+import '../index-b5b56cb7.js';
+import '../_rollupPluginBabelHelpers-636e674b.js';
 import 'prop-types';
-import '../topics-b81e5b9b.js';
-import '../utils-c2438081.js';
-import '../tslib.es6-e592f653.js';
+import '../topics-d2e15fe6.js';
+import '../utils-5a4995e3.js';
+import '../tslib.es6-279bc71d.js';
 import './ImageRenderer.js';
 import './Icon.js';
-import '../uuid-c41826f3.js';
+import '../uuid-636df95b.js';
 
 function UserProfile(_a) {
   var user = _a.user,
@@ -46,9 +46,11 @@ function UserProfile(_a) {
   }, /*#__PURE__*/React__default.createElement(Button, {
     type: ButtonTypes.SECONDARY,
     onClick: function () {
+      // Create 1:1 channel
       var params = {
-        isDistinct: true,
-        invitedUserIds: [user === null || user === void 0 ? void 0 : user.userId]
+        isDistinct: false,
+        invitedUserIds: [user === null || user === void 0 ? void 0 : user.userId],
+        operatorUserIds: [currentUserId]
       };
       onSuccess();
       createChannel(params).then(function (groupChannel) {