@sendbird/uikit-react 3.6.11-beta.2 → 3.7.0-rc.0

package/cjs/ui/OpenChannelAdminMessage.js

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

package/cjs/ui/OpenChannelAdminMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"OpenChannelAdminMessage.js","sources":["../../../src/ui/OpenChannelAdminMessage/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { AdminMessage } from '@sendbird/chat/message';\nimport './index.scss';\n\nimport Label, { LabelColors, LabelTypography } from '../Label';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: AdminMessage;\n}\n\nexport default function OpenChannelAdminMessage({\n  className,\n  message,\n}: Props): ReactElement {\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-openchannel-admin-message',\n      ].join(' ')}\n    >\n      <Label\n        className=\"sendbird-openchannel-admin-message__text\"\n        type={LabelTypography.CAPTION_2}\n        color={LabelColors.ONBACKGROUND_2}\n      >\n        {message.message || ''}\n      </Label>\n    </div>\n  );\n}\n"],"names":["OpenChannelAdminMessage","_ref","className","message","React","createElement","Array","isArray","join","Label","type","LabelTypography","CAPTION_2","color","LabelColors","ONBACKGROUND_2"],"mappings":";;;;;;;;;;;AAWe,SAASA,uBAAuBA,CAAAC,IAAA,EAGvB;EAAA,IAHwB;IAC9CC,SAAS;AACTC,IAAAA,OAAAA;AACK,GAAC,GAAAF,IAAA,CAAA;EACN,oBACEG,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACEH,SAAS,EAAE,CACT,IAAII,KAAK,CAACC,OAAO,CAACL,SAAS,CAAC,GAAGA,SAAS,GAAG,CAACA,SAAS,CAAC,CAAC,EACvD,oCAAoC,CACrC,CAACM,IAAI,CAAC,GAAG,CAAA;AAAE,GAAA,eAEZJ,yBAAA,CAAAC,aAAA,CAACI,cAAK,EAAA;AACJP,IAAAA,SAAS,EAAC,0CAA0C;IACpDQ,IAAI,EAAEC,wBAAe,CAACC,SAAU;IAChCC,KAAK,EAAEC,oBAAW,CAACC,cAAAA;AAAe,GAAA,EAEjCZ,OAAO,CAACA,OAAO,IAAI,EAAE,CAChB,CACJ,CAAA;AAEV;;;;"}
+{"version":3,"file":"OpenChannelAdminMessage.js","sources":["../../../src/ui/OpenChannelAdminMessage/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { AdminMessage } from '@sendbird/chat/message';\nimport './index.scss';\n\nimport Label, { LabelColors, LabelTypography } from '../Label';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: AdminMessage;\n}\n\nexport default function OpenChannelAdminMessage({\n  className,\n  message,\n}: Props): ReactElement {\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-openchannel-admin-message',\n      ].join(' ')}\n    >\n      <Label\n        className=\"sendbird-openchannel-admin-message__text\"\n        type={LabelTypography.CAPTION_2}\n        color={LabelColors.ONBACKGROUND_2}\n      >\n        {message.message || ''}\n      </Label>\n    </div>\n  );\n}\n"],"names":["OpenChannelAdminMessage","_a","className","message","React","createElement","__spreadArray","Array","isArray","join","Label","type","LabelTypography","CAPTION_2","color","LabelColors","ONBACKGROUND_2"],"mappings":";;;;;;;;;;;;AAWwB,SAAAA,uBAAuBA,CAACC,EAGxC,EAAA;MAFNC,SAAS,GAAAD,EAAA,CAAAC,SAAA;IACTC,OAAO,GAAAF,EAAA,CAAAE,OAAA,CAAA;EAEP,oBACEC,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEH,IAAAA,SAAS,EAAEI,uBAAA,CAAAA,uBAAA,CAAA,EAAA,EACLC,KAAK,CAACC,OAAO,CAACN,SAAS,CAAC,GAAGA,SAAS,GAAG,CAACA,SAAS,CAAC,EAAC,IAAA,CAAA,EAAA,CACvD,oCAAoC,CACpC,EAAA,KAAA,CAAA,CAAAO,IAAI,CAAC,GAAG,CAAA;AAAE,GAAA,eAEZL,yBAAA,CAAAC,aAAA,CAACK,cAAK,EAAA;AACJR,IAAAA,SAAS,EAAC,0CAA0C;IACpDS,IAAI,EAAEC,wBAAe,CAACC,SAAU;IAChCC,KAAK,EAAEC,oBAAW,CAACC,cAAAA;AAAe,GAAA,EAEjCb,OAAO,CAACA,OAAO,IAAI,EACf,CACJ,CAAC,CAAA;AAEV;;;;"}

package/cjs/ui/OpenChannelAvatar.js

@@ -2,35 +2,34 @@
 
 var React = require('react');
 var ui_Avatar = require('./Avatar.js');
-var LocalizationContext = require('../LocalizationContext-482c1343.js');
-var utils = require('../utils-5bfb4516.js');
+var LocalizationContext = require('../LocalizationContext-5009012e.js');
+var utils = require('../utils-e313131f.js');
+require('../tslib.es6-2f2b0bca.js');
 require('./ImageRenderer.js');
 require('./Icon.js');
 require('prop-types');
-require('../uuid-b2806cf5.js');
-require('../stringSet-d00535a5.js');
-require('../index-d04f312e.js');
+require('../uuid-c74bbbb6.js');
+require('../stringSet-98b52c49.js');
+require('../index-fd8a0abb.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function ChannelAvatar(_ref) {
-  let {
-    channel,
-    theme,
-    height = 56,
-    width = 56
-  } = _ref;
-  const {
-    stringSet
-  } = React.useContext(LocalizationContext.LocalizationContext);
-  const memoizedAvatar = React.useMemo(() => {
+function ChannelAvatar(_a) {
+  var channel = _a.channel,
+    theme = _a.theme,
+    _b = _a.height,
+    height = _b === void 0 ? 56 : _b,
+    _c = _a.width,
+    width = _c === void 0 ? 56 : _c;
+  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
+  var memoizedAvatar = React.useMemo(function () {
     return /*#__PURE__*/React__default["default"].createElement(ui_Avatar["default"], {
       className: "sendbird-chat-header__avatar--open-channel",
       src: utils.getOpenChannelAvatar(channel),
-      width: `${width}px`,
-      height: `${height}px`,
+      width: "".concat(width, "px"),
+      height: "".concat(height, "px"),
       alt: (channel === null || channel === void 0 ? void 0 : channel.name) || stringSet.OPEN_CHANNEL_SETTINGS__NO_TITLE
     });
   }, [channel === null || channel === void 0 ? void 0 : channel.coverUrl, theme]);

package/cjs/ui/OpenChannelAvatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"OpenChannelAvatar.js","sources":["../../../src/ui/ChannelAvatar/OpenChannelAvatar.tsx"],"sourcesContent":["import React, { useMemo, useContext } from 'react';\nimport type { OpenChannel } from '@sendbird/chat/openChannel';\n\nimport Avatar from '../Avatar/index';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\nimport * as utils from './utils';\n\ninterface Props {\n  channel: OpenChannel;\n  theme: string;\n  height?: number;\n  width?: number;\n}\n\nfunction ChannelAvatar({\n  channel,\n  theme,\n  height = 56,\n  width = 56,\n}: Props): JSX.Element {\n  const { stringSet } = useContext(LocalizationContext);\n  const memoizedAvatar = useMemo(() => {\n    return (\n      <Avatar\n        className=\"sendbird-chat-header__avatar--open-channel\"\n        src={utils.getOpenChannelAvatar(channel)}\n        width={`${width}px`}\n        height={`${height}px`}\n        alt={channel?.name || stringSet.OPEN_CHANNEL_SETTINGS__NO_TITLE}\n      />\n    );\n  }, [channel?.coverUrl, theme]);\n  return (\n    <>{ memoizedAvatar }</>\n  );\n}\n\nexport default ChannelAvatar;\n"],"names":["ChannelAvatar","_ref","channel","theme","height","width","stringSet","useContext","LocalizationContext","memoizedAvatar","useMemo","React","createElement","Avatar","className","src","utils","alt","name","OPEN_CHANNEL_SETTINGS__NO_TITLE","coverUrl","Fragment"],"mappings":";;;;;;;;;;;;;;;;;AAeA,SAASA,aAAaA,CAAAC,IAAA,EAKC;EAAA,IALA;IACrBC,OAAO;IACPC,KAAK;AACLC,IAAAA,MAAM,GAAG,EAAE;AACXC,IAAAA,KAAK,GAAG,EAAA;AACH,GAAC,GAAAJ,IAAA,CAAA;EACN,MAAM;AAAEK,IAAAA,SAAAA;AAAU,GAAC,GAAGC,gBAAU,CAACC,uCAAmB,CAAC,CAAA;AACrD,EAAA,MAAMC,cAAc,GAAGC,aAAO,CAAC,MAAM;AACnC,IAAA,oBACEC,yBAAA,CAAAC,aAAA,CAACC,oBAAM,EAAA;AACLC,MAAAA,SAAS,EAAC,4CAA4C;AACtDC,MAAAA,GAAG,EAAEC,0BAA0B,CAACd,OAAO,CAAE;MACzCG,KAAK,EAAG,CAAEA,EAAAA,KAAM,CAAI,EAAA,CAAA;MACpBD,MAAM,EAAG,CAAEA,EAAAA,MAAO,CAAI,EAAA,CAAA;MACtBa,GAAG,EAAE,CAAAf,OAAO,KAAPA,IAAAA,IAAAA,OAAO,KAAPA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,OAAO,CAAEgB,IAAI,KAAIZ,SAAS,CAACa,+BAAAA;KAChC,CAAA,CAAA;AAEN,GAAC,EAAE,CAACjB,OAAO,KAAA,IAAA,IAAPA,OAAO,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAPA,OAAO,CAAEkB,QAAQ,EAAEjB,KAAK,CAAC,CAAC,CAAA;EAC9B,oBACEQ,yBAAA,CAAAC,aAAA,CAAAD,yBAAA,CAAAU,QAAA,EAAIZ,IAAAA,EAAAA,cAAc,CAAK,CAAA;AAE3B;;;;"}
+{"version":3,"file":"OpenChannelAvatar.js","sources":["../../../src/ui/ChannelAvatar/OpenChannelAvatar.tsx"],"sourcesContent":["import React, { useMemo, useContext } from 'react';\nimport type { OpenChannel } from '@sendbird/chat/openChannel';\n\nimport Avatar from '../Avatar/index';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\nimport * as utils from './utils';\n\ninterface Props {\n  channel: OpenChannel;\n  theme: string;\n  height?: number;\n  width?: number;\n}\n\nfunction ChannelAvatar({\n  channel,\n  theme,\n  height = 56,\n  width = 56,\n}: Props): JSX.Element {\n  const { stringSet } = useContext(LocalizationContext);\n  const memoizedAvatar = useMemo(() => {\n    return (\n      <Avatar\n        className=\"sendbird-chat-header__avatar--open-channel\"\n        src={utils.getOpenChannelAvatar(channel)}\n        width={`${width}px`}\n        height={`${height}px`}\n        alt={channel?.name || stringSet.OPEN_CHANNEL_SETTINGS__NO_TITLE}\n      />\n    );\n  }, [channel?.coverUrl, theme]);\n  return (\n    <>{ memoizedAvatar }</>\n  );\n}\n\nexport default ChannelAvatar;\n"],"names":["ChannelAvatar","_a","channel","theme","_b","height","_c","width","stringSet","useContext","LocalizationContext","memoizedAvatar","useMemo","React","createElement","Avatar","className","src","utils","concat","alt","name","OPEN_CHANNEL_SETTINGS__NO_TITLE","coverUrl","Fragment"],"mappings":";;;;;;;;;;;;;;;;;;AAeA,SAASA,aAAaA,CAACC,EAKf,EAAA;AAJN,EAAA,IAAAC,OAAO,aAAA;IACPC,KAAK,GAAAF,EAAA,CAAAE,KAAA;IACLC,cAAW;IAAXC,MAAM,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,EAAE,KAAA;IACXE,EAAA,GAAAL,EAAA,CAAAM,KAAU;IAAVA,KAAK,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,EAAE,GAAAA,EAAA,CAAA;AAEF,EAAA,IAAAE,SAAS,GAAKC,gBAAU,CAACC,uCAAmB,CAAC,UAApC,CAAA;AACjB,EAAA,IAAMC,cAAc,GAAGC,aAAO,CAAC,YAAA;AAC7B,IAAA,oBACEC,yBAAA,CAAAC,aAAA,CAACC,oBAAM,EAAA;AACLC,MAAAA,SAAS,EAAC,4CAA4C;AACtDC,MAAAA,GAAG,EAAEC,0BAA0B,CAAChB,OAAO,CAAE;MACzCK,KAAK,EAAE,EAAG,CAAAY,MAAA,CAAAZ,KAAK,EAAI,IAAA,CAAC;MACpBF,MAAM,EAAE,EAAA,CAAAc,MAAA,CAAGd,MAAM,EAAA,IAAA,CAAK;AACtBe,MAAAA,GAAG,EAAE,CAAAlB,OAAO,aAAPA,OAAO,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAPA,OAAO,CAAEmB,IAAI,KAAIb,SAAS,CAACc,+BAAAA;AAAgC,KAChE,CAAA,CAAA;GAEL,EAAE,CAACpB,OAAO,KAAA,IAAA,IAAPA,OAAO,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAPA,OAAO,CAAEqB,QAAQ,EAAEpB,KAAK,CAAC,CAAC,CAAA;EAC9B,oBACEU,yBAAA,CAAAC,aAAA,CAAAD,yBAAA,CAAAW,QAAA,EAAIb,IAAAA,EAAAA,cAAgB,CAAG,CAAA;AAE3B;;;;"}

package/cjs/ui/OpenchannelConversationHeader.js

@@ -4,30 +4,26 @@ var React = require('react');
 var ui_Avatar = require('./Avatar.js');
 var ui_Icon = require('./Icon.js');
 var ui_IconButton = require('./IconButton.js');
-var ui_Label = require('../index-18720f0d.js');
-var LocalizationContext = require('../LocalizationContext-482c1343.js');
+var ui_Label = require('../index-35820a94.js');
+var LocalizationContext = require('../LocalizationContext-5009012e.js');
+require('../tslib.es6-2f2b0bca.js');
 require('./ImageRenderer.js');
+require('../uuid-c74bbbb6.js');
 require('prop-types');
-require('../uuid-b2806cf5.js');
-require('../_rollupPluginBabelHelpers-83d7e84b.js');
-require('../stringSet-d00535a5.js');
-require('../index-d04f312e.js');
+require('../stringSet-98b52c49.js');
+require('../index-fd8a0abb.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function OpenchannelConversationHeader(_ref) {
-  let {
-    coverImage,
-    title,
-    subTitle,
-    amIOperator,
-    onActionClick
-  } = _ref;
-  const {
-    stringSet
-  } = React.useContext(LocalizationContext.LocalizationContext);
+function OpenchannelConversationHeader(_a) {
+  var coverImage = _a.coverImage,
+    title = _a.title,
+    subTitle = _a.subTitle,
+    amIOperator = _a.amIOperator,
+    onActionClick = _a.onActionClick;
+  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-openchannel-conversation-header"
   }, /*#__PURE__*/React__default["default"].createElement("div", {

package/cjs/ui/OpenchannelConversationHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"OpenchannelConversationHeader.js","sources":["../../../src/ui/OpenchannelConversationHeader/index.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport './index.scss';\n\nimport Avatar from '../Avatar';\nimport Icon, { IconColors, IconTypes } from '../Icon';\nimport IconButton from '../IconButton';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\ninterface Props {\n  coverImage?: string;\n  title?: string;\n  subTitle?: string;\n  amIOperator?: boolean;\n  onActionClick?(): void;\n}\n\nexport default function OpenchannelConversationHeader({\n  coverImage,\n  title,\n  subTitle,\n  amIOperator,\n  onActionClick,\n}: Props): JSX.Element {\n  const { stringSet } = useContext(LocalizationContext);\n\n  return (\n    <div className=\"sendbird-openchannel-conversation-header\">\n      <div className=\"sendbird-openchannel-conversation-header__left\">\n        {\n          coverImage ? (\n            <Avatar\n              className=\"sendbird-openchannel-conversation-header__left__cover-image\"\n              src={coverImage}\n              alt=\"channel cover image\"\n              width=\"32px\"\n              height=\"32px\"\n            />\n          ) : (\n            <div\n              className=\"sendbird-openchannel-conversation-header__left__cover-image--icon\"\n              style={{ width: 32, height: 32 }}\n            >\n              <Icon\n                type={IconTypes.CHANNELS}\n                fillColor={IconColors.CONTENT}\n                width=\"18px\"\n                height=\"18px\"\n              />\n            </div>\n          )\n        }\n        <Label\n          className=\"sendbird-openchannel-conversation-header__left__title\"\n          type={LabelTypography.H_2}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {title || stringSet.NO_TITLE}\n        </Label>\n        <Label\n          className=\"sendbird-openchannel-conversation-header__left__sub-title\"\n          type={LabelTypography.BODY_2}\n          color={LabelColors.ONBACKGROUND_2}\n        >\n          {subTitle || stringSet.NO_TITLE}\n        </Label>\n      </div>\n      <div className=\"sendbird-openchannel-conversation-header__right\">\n        <IconButton\n          className=\"sendbird-openchannel-conversation-header__right__trigger\"\n          width=\"32px\"\n          height=\"32px\"\n          onClick={onActionClick}\n        >\n          <Icon\n            type={(\n              amIOperator\n                ? IconTypes.INFO\n                : IconTypes.MEMBERS\n            )}\n            fillColor={IconColors.PRIMARY}\n            width=\"24px\"\n            height=\"24px\"\n          />\n        </IconButton>\n      </div>\n    </div>\n  );\n}\n"],"names":["OpenchannelConversationHeader","_ref","coverImage","title","subTitle","amIOperator","onActionClick","stringSet","useContext","LocalizationContext","React","createElement","className","Avatar","src","alt","width","height","style","Icon","type","IconTypes","CHANNELS","fillColor","IconColors","CONTENT","Label","LabelTypography","H_2","color","LabelColors","ONBACKGROUND_1","NO_TITLE","BODY_2","ONBACKGROUND_2","IconButton","onClick","INFO","MEMBERS","PRIMARY"],"mappings":";;;;;;;;;;;;;;;;;;;AAiBe,SAASA,6BAA6BA,CAAAC,IAAA,EAM9B;EAAA,IAN+B;IACpDC,UAAU;IACVC,KAAK;IACLC,QAAQ;IACRC,WAAW;AACXC,IAAAA,aAAAA;AACK,GAAC,GAAAL,IAAA,CAAA;EACN,MAAM;AAAEM,IAAAA,SAAAA;AAAU,GAAC,GAAGC,gBAAU,CAACC,uCAAmB,CAAC,CAAA;EAErD,oBACEC,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,0CAAA;GACbF,eAAAA,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,gDAAA;AAAgD,GAAA,EAE3DV,UAAU,gBACRQ,yBAAA,CAAAC,aAAA,CAACE,oBAAM,EAAA;AACLD,IAAAA,SAAS,EAAC,6DAA6D;AACvEE,IAAAA,GAAG,EAAEZ,UAAW;AAChBa,IAAAA,GAAG,EAAC,qBAAqB;AACzBC,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAA;GACP,CAAA,gBAEFP,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEC,IAAAA,SAAS,EAAC,mEAAmE;AAC7EM,IAAAA,KAAK,EAAE;AAAEF,MAAAA,KAAK,EAAE,EAAE;AAAEC,MAAAA,MAAM,EAAE,EAAA;AAAG,KAAA;AAAE,GAAA,eAEjCP,yBAAA,CAAAC,aAAA,CAACQ,kBAAI,EAAA;IACHC,IAAI,EAAEC,iBAAS,CAACC,QAAS;IACzBC,SAAS,EAAEC,kBAAU,CAACC,OAAQ;AAC9BT,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAA;AAAM,GAAA,CACb,CAEL,eAEHP,yBAAA,CAAAC,aAAA,CAACe,cAAK,EAAA;AACJd,IAAAA,SAAS,EAAC,uDAAuD;IACjEQ,IAAI,EAAEO,wBAAe,CAACC,GAAI;IAC1BC,KAAK,EAAEC,oBAAW,CAACC,cAAAA;GAElB5B,EAAAA,KAAK,IAAII,SAAS,CAACyB,QAAQ,CACtB,eACRtB,yBAAA,CAAAC,aAAA,CAACe,cAAK,EAAA;AACJd,IAAAA,SAAS,EAAC,2DAA2D;IACrEQ,IAAI,EAAEO,wBAAe,CAACM,MAAO;IAC7BJ,KAAK,EAAEC,oBAAW,CAACI,cAAAA;GAElB9B,EAAAA,QAAQ,IAAIG,SAAS,CAACyB,QAAQ,CACzB,CACJ,eACNtB,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,iDAAA;AAAiD,GAAA,eAC9DF,yBAAA,CAAAC,aAAA,CAACwB,aAAU,EAAA;AACTvB,IAAAA,SAAS,EAAC,0DAA0D;AACpEI,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAM;AACbmB,IAAAA,OAAO,EAAE9B,aAAAA;AAAc,GAAA,eAEvBI,yBAAA,CAAAC,aAAA,CAACQ,kBAAI,EAAA;IACHC,IAAI,EACFf,WAAW,GACPgB,iBAAS,CAACgB,IAAI,GACdhB,iBAAS,CAACiB,OACd;IACFf,SAAS,EAAEC,kBAAU,CAACe,OAAQ;AAC9BvB,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAA;GACP,CAAA,CACS,CACT,CACF,CAAA;AAEV;;;;"}
+{"version":3,"file":"OpenchannelConversationHeader.js","sources":["../../../src/ui/OpenchannelConversationHeader/index.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport './index.scss';\n\nimport Avatar from '../Avatar';\nimport Icon, { IconColors, IconTypes } from '../Icon';\nimport IconButton from '../IconButton';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\ninterface Props {\n  coverImage?: string;\n  title?: string;\n  subTitle?: string;\n  amIOperator?: boolean;\n  onActionClick?(): void;\n}\n\nexport default function OpenchannelConversationHeader({\n  coverImage,\n  title,\n  subTitle,\n  amIOperator,\n  onActionClick,\n}: Props): JSX.Element {\n  const { stringSet } = useContext(LocalizationContext);\n\n  return (\n    <div className=\"sendbird-openchannel-conversation-header\">\n      <div className=\"sendbird-openchannel-conversation-header__left\">\n        {\n          coverImage ? (\n            <Avatar\n              className=\"sendbird-openchannel-conversation-header__left__cover-image\"\n              src={coverImage}\n              alt=\"channel cover image\"\n              width=\"32px\"\n              height=\"32px\"\n            />\n          ) : (\n            <div\n              className=\"sendbird-openchannel-conversation-header__left__cover-image--icon\"\n              style={{ width: 32, height: 32 }}\n            >\n              <Icon\n                type={IconTypes.CHANNELS}\n                fillColor={IconColors.CONTENT}\n                width=\"18px\"\n                height=\"18px\"\n              />\n            </div>\n          )\n        }\n        <Label\n          className=\"sendbird-openchannel-conversation-header__left__title\"\n          type={LabelTypography.H_2}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {title || stringSet.NO_TITLE}\n        </Label>\n        <Label\n          className=\"sendbird-openchannel-conversation-header__left__sub-title\"\n          type={LabelTypography.BODY_2}\n          color={LabelColors.ONBACKGROUND_2}\n        >\n          {subTitle || stringSet.NO_TITLE}\n        </Label>\n      </div>\n      <div className=\"sendbird-openchannel-conversation-header__right\">\n        <IconButton\n          className=\"sendbird-openchannel-conversation-header__right__trigger\"\n          width=\"32px\"\n          height=\"32px\"\n          onClick={onActionClick}\n        >\n          <Icon\n            type={(\n              amIOperator\n                ? IconTypes.INFO\n                : IconTypes.MEMBERS\n            )}\n            fillColor={IconColors.PRIMARY}\n            width=\"24px\"\n            height=\"24px\"\n          />\n        </IconButton>\n      </div>\n    </div>\n  );\n}\n"],"names":["OpenchannelConversationHeader","_a","coverImage","title","subTitle","amIOperator","onActionClick","stringSet","useContext","LocalizationContext","React","createElement","className","Avatar","src","alt","width","height","style","Icon","type","IconTypes","CHANNELS","fillColor","IconColors","CONTENT","Label","LabelTypography","H_2","color","LabelColors","ONBACKGROUND_1","NO_TITLE","BODY_2","ONBACKGROUND_2","IconButton","onClick","INFO","MEMBERS","PRIMARY"],"mappings":";;;;;;;;;;;;;;;;;;;AAiBwB,SAAAA,6BAA6BA,CAACC,EAM9C,EAAA;AALN,EAAA,IAAAC,UAAU,GAAAD,EAAA,CAAAC,UAAA;IACVC,KAAK,GAAAF,EAAA,CAAAE,KAAA;IACLC,QAAQ,GAAAH,EAAA,CAAAG,QAAA;IACRC,WAAW,GAAAJ,EAAA,CAAAI,WAAA;IACXC,aAAa,GAAAL,EAAA,CAAAK,aAAA,CAAA;AAEL,EAAA,IAAAC,SAAS,GAAKC,gBAAU,CAACC,uCAAmB,CAAC,UAApC,CAAA;EAEjB,oBACEC,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,0CAAA;GACbF,eAAAA,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,gDAAA;AAAgD,GAAA,EAE3DV,UAAU,gBACRQ,yBAAA,CAAAC,aAAA,CAACE,oBAAM,EAAA;AACLD,IAAAA,SAAS,EAAC,6DAA6D;AACvEE,IAAAA,GAAG,EAAEZ,UAAW;AAChBa,IAAAA,GAAG,EAAC,qBAAqB;AACzBC,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAA;AAAM,GAAA,CACb,gBAEFP,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEC,IAAAA,SAAS,EAAC,mEAAmE;AAC7EM,IAAAA,KAAK,EAAE;AAAEF,MAAAA,KAAK,EAAE,EAAE;AAAEC,MAAAA,MAAM,EAAE,EAAA;AAAI,KAAA;AAAC,GAAA,eAEjCP,yBAAA,CAAAC,aAAA,CAACQ,kBAAI,EAAA;IACHC,IAAI,EAAEC,iBAAS,CAACC,QAAS;IACzBC,SAAS,EAAEC,kBAAU,CAACC,OAAQ;AAC9BT,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAA;AAAM,GAEjB,CAAK,CACN,eAEHP,yBAAA,CAAAC,aAAA,CAACe,cAAK,EAAA;AACJd,IAAAA,SAAS,EAAC,uDAAuD;IACjEQ,IAAI,EAAEO,wBAAe,CAACC,GAAI;IAC1BC,KAAK,EAAEC,oBAAW,CAACC,cAAAA;GAElB5B,EAAAA,KAAK,IAAII,SAAS,CAACyB,QACf,CACP,eAAAtB,yBAAA,CAAAC,aAAA,CAACe,cAAK,EAAA;AACJd,IAAAA,SAAS,EAAC,2DAA2D;IACrEQ,IAAI,EAAEO,wBAAe,CAACM,MAAO;IAC7BJ,KAAK,EAAEC,oBAAW,CAACI,cAAAA;GAElB9B,EAAAA,QAAQ,IAAIG,SAAS,CAACyB,QAClB,CACJ,CACL,eAAAtB,yBAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,iDAAA;AAAiD,GAAA,eAC9DF,yBAAA,CAAAC,aAAA,CAACwB,aAAU,EAAA;AACTvB,IAAAA,SAAS,EAAC,0DAA0D;AACpEI,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAM;AACbmB,IAAAA,OAAO,EAAE9B,aAAAA;AAAc,GAAA,eAEvBI,yBAAA,CAAAC,aAAA,CAACQ,kBAAI,EAAA;IACHC,IAAI,EACFf,WAAW,GACPgB,iBAAS,CAACgB,IAAI,GACdhB,iBAAS,CAACiB,OACd;IACFf,SAAS,EAAEC,kBAAU,CAACe,OAAQ;AAC9BvB,IAAAA,KAAK,EAAC,MAAM;AACZC,IAAAA,MAAM,EAAC,MAAA;GAEX,CAAY,CACT,CACF,CAAC,CAAA;AAEV;;;;"}

package/cjs/ui/OpenchannelFileMessage.js

@@ -1,36 +1,38 @@
 'use strict';
 
-var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-83d7e84b.js');
+var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-94c18dc1.js');
+var tslib_es6 = require('../tslib.es6-2f2b0bca.js');
 var React = require('react');
-var index$1 = require('../index-c9b003b3.js');
+var index$1 = require('../index-b6d51e74.js');
 var ui_Avatar = require('./Avatar.js');
 var ui_ContextMenu = require('./ContextMenu.js');
-var ui_Label = require('../index-18720f0d.js');
+var ui_Label = require('../index-35820a94.js');
 var ui_Loader = require('./Loader.js');
 var ui_Icon = require('./Icon.js');
 var ui_IconButton = require('./IconButton.js');
 var ui_TextButton = require('./TextButton.js');
 var ui_UserProfile = require('./UserProfile.js');
-var UserProfileContext = require('../UserProfileContext-fa8d0383.js');
-var LocalizationContext = require('../LocalizationContext-482c1343.js');
-var index = require('../index-6ab9a40d.js');
-var MediaQueryContext = require('../MediaQueryContext-73aac8cf.js');
-var useLongPress = require('../useLongPress-1c0f4696.js');
-require('../index-d04f312e.js');
+var UserProfileContext = require('../UserProfileContext-922a43ec.js');
+var LocalizationContext = require('../LocalizationContext-5009012e.js');
+var index = require('../index-80a11b6a.js');
+var MediaQueryContext = require('../MediaQueryContext-d6fdbe43.js');
+var useLongPress = require('../useLongPress-c1da8ba7.js');
+require('../index-fd8a0abb.js');
 require('./ImageRenderer.js');
+require('../uuid-c74bbbb6.js');
 require('prop-types');
-require('../uuid-b2806cf5.js');
 require('react-dom');
 require('./SortByRow.js');
-require('../index-fbe9cc73.js');
+require('../index-b995f638.js');
 require('../utils/message/getOutgoingMessageState.js');
-require('../index.module-a24e9cd7.js');
-require('../stringSet-d00535a5.js');
-require('../color-d83b77ac.js');
+require('../index-609b07a2.js');
+require('../stringSet-98b52c49.js');
+require('../color-477ddbd4.js');
 require('../sendbirdSelectors.js');
-require('../topics-adde627b.js');
-require('../utils-c47c68b1.js');
+require('../pubSub/topics.js');
+require('../utils-180c6bc8.js');
 require('./Button.js');
+require('../types-66554668.js');
 require('../useSendbirdStateContext.js');
 require('../withSendbird.js');
 
@@ -38,9 +40,9 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const checkFileType = fileUrl => {
-  const audioFile = /(\.mp3)$/i;
-  const gifFile = /(\.gif)$/i;
+var checkFileType = function (fileUrl) {
+  var audioFile = /(\.mp3)$/i;
+  var gifFile = /(\.gif)$/i;
   if (audioFile.test(fileUrl)) {
     return ui_Icon.IconTypes.FILE_AUDIO;
   }
@@ -49,53 +51,50 @@ const checkFileType = fileUrl => {
   }
   return ui_Icon.IconTypes.FILE_DOCUMENT;
 };
-const truncate = (fullStr, strLen) => {
+var truncate = function (fullStr, strLen) {
   if (fullStr === null || fullStr === undefined) return '';
   if (fullStr.length <= strLen) return fullStr;
-  const separator = '...';
-  const sepLen = separator.length;
-  const charsToShow = strLen - sepLen;
-  const frontChars = Math.ceil(charsToShow / 2);
-  const backChars = Math.floor(charsToShow / 2);
+  var separator = '...';
+  var sepLen = separator.length;
+  var charsToShow = strLen - sepLen;
+  var frontChars = Math.ceil(charsToShow / 2);
+  var backChars = Math.floor(charsToShow / 2);
   return fullStr.substr(0, frontChars) + separator + fullStr.substr(fullStr.length - backChars);
 };
 
-function OpenchannelFileMessage(_ref) {
-  let {
-    className,
-    message,
-    isOperator,
-    isEphemeral = false,
-    userId,
-    disabled,
-    chainTop,
-    showRemove,
-    resendMessage
-  } = _ref;
-  const status = message === null || message === void 0 ? void 0 : message.sendingStatus;
-  const {
-    dateLocale,
-    stringSet
-  } = LocalizationContext.useLocalization();
-  const contextMenuRef = React.useRef(null);
-  const mobileMenuRef = React.useRef(null);
-  const avatarRef = React.useRef(null);
-  const {
-    disableUserProfile,
-    renderUserProfile
-  } = React.useContext(UserProfileContext.UserProfileContext);
-  const {
-    isMobile
-  } = MediaQueryContext.useMediaQueryContext();
-  const openFileUrl = () => {
+function OpenchannelFileMessage(_a) {
+  var className = _a.className,
+    message = _a.message,
+    isOperator = _a.isOperator,
+    _b = _a.isEphemeral,
+    isEphemeral = _b === void 0 ? false : _b,
+    userId = _a.userId,
+    disabled = _a.disabled,
+    chainTop = _a.chainTop,
+    showRemove = _a.showRemove,
+    resendMessage = _a.resendMessage;
+  var status = message === null || message === void 0 ? void 0 : message.sendingStatus;
+  var _c = LocalizationContext.useLocalization(),
+    dateLocale = _c.dateLocale,
+    stringSet = _c.stringSet;
+  var contextMenuRef = React.useRef(null);
+  var mobileMenuRef = React.useRef(null);
+  var avatarRef = React.useRef(null);
+  var _d = React.useContext(UserProfileContext.UserProfileContext),
+    disableUserProfile = _d.disableUserProfile,
+    renderUserProfile = _d.renderUserProfile;
+  var isMobile = MediaQueryContext.useMediaQueryContext().isMobile;
+  var openFileUrl = function () {
     window.open(message.url);
   };
-  const isPending = index.checkIsPending(status);
-  const isFailed = index.checkIsFailed(status);
-  const sender = index.getSenderFromMessage(message);
-  const [contextMenu, setContextMenu] = React.useState(false);
-  const longPress = useLongPress.useLongPress({
-    onLongPress: () => {
+  var isPending = index.checkIsPending(status);
+  var isFailed = index.checkIsFailed(status);
+  var sender = index.getSenderFromMessage(message);
+  var _e = React.useState(false),
+    contextMenu = _e[0],
+    setContextMenu = _e[1];
+  var longPress = useLongPress.useLongPress({
+    onLongPress: function () {
       if (isMobile) {
         setContextMenu(true);
       }
@@ -105,39 +104,44 @@ function OpenchannelFileMessage(_ref) {
     delay: 300
   });
   return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: [...(Array.isArray(className) ? className : [className]), 'sendbird-openchannel-file-message'].join(' '),
+    className: tslib_es6.__spreadArray(tslib_es6.__spreadArray([], Array.isArray(className) ? className : [className], true), ['sendbird-openchannel-file-message'], false).join(' '),
     ref: mobileMenuRef
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-openchannel-file-message__left"
   }, !chainTop && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu["default"], {
-    menuTrigger: toggleDropdown => /*#__PURE__*/React__default["default"].createElement(ui_Avatar["default"], {
-      className: "sendbird-openchannel-file-message__left__avatar",
-      src: sender.profileUrl || '',
-      ref: avatarRef,
-      width: "28px",
-      height: "28px",
-      onClick: () => {
-        if (!disableUserProfile) {
-          toggleDropdown();
+    menuTrigger: function (toggleDropdown) {
+      return /*#__PURE__*/React__default["default"].createElement(ui_Avatar["default"], {
+        className: "sendbird-openchannel-file-message__left__avatar",
+        src: sender.profileUrl || '',
+        ref: avatarRef,
+        width: "28px",
+        height: "28px",
+        onClick: function () {
+          if (!disableUserProfile) {
+            toggleDropdown();
+          }
         }
-      }
-    }),
-    menuItems: closeDropdown => /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItems, {
-      parentRef: avatarRef,
-      parentContainRef: avatarRef,
-      closeDropdown: closeDropdown,
-      style: {
-        paddingTop: '0px',
-        paddingBottom: '0px'
-      }
-    }, renderUserProfile ? renderUserProfile({
-      user: sender,
-      close: closeDropdown
-    }) : /*#__PURE__*/React__default["default"].createElement(ui_UserProfile, {
-      user: sender,
-      onSuccess: closeDropdown,
-      disableMessaging: true
-    }))
+      });
+    },
+    menuItems: function (closeDropdown) {
+      return /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItems, {
+        parentRef: avatarRef,
+        parentContainRef: avatarRef,
+        closeDropdown: closeDropdown,
+        style: {
+          paddingTop: '0px',
+          paddingBottom: '0px'
+        }
+      }, renderUserProfile ? renderUserProfile({
+        user: sender,
+        close: closeDropdown,
+        currentUserId: userId
+      }) : /*#__PURE__*/React__default["default"].createElement(ui_UserProfile, {
+        user: sender,
+        onSuccess: closeDropdown,
+        disableMessaging: true
+      }));
+    }
   })), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-openchannel-file-message__right"
   }, !chainTop && /*#__PURE__*/React__default["default"].createElement("div", {
@@ -154,7 +158,7 @@ function OpenchannelFileMessage(_ref) {
     locale: dateLocale
   }))), /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers._extends({
     className: "sendbird-openchannel-file-message__right__body"
-  }, isMobile ? _rollupPluginBabelHelpers._objectSpread2({}, longPress) : {}), checkFileType(message.url) && /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+  }, isMobile ? tslib_es6.__assign({}, longPress) : {}), checkFileType(message.url) && /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
     className: "sendbird-openchannel-file-message__right__body__icon",
     type: checkFileType(message.url),
     fillColor: ui_Icon.IconColors.PRIMARY,
@@ -187,63 +191,67 @@ function OpenchannelFileMessage(_ref) {
     className: "sendbird-openchannel-file-message__context-menu",
     ref: contextMenuRef
   }, (index.isFineResend({
-    message,
-    userId,
-    status
+    message: message,
+    userId: userId,
+    status: status
   }) || !isEphemeral) && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu["default"], {
-    menuTrigger: toggleDropdown => index.showMenuTrigger({
-      message,
-      userId,
-      status
-    }) && /*#__PURE__*/React__default["default"].createElement(ui_IconButton, {
-      className: "sendbird-openchannel-file-message__context-menu__icon",
-      width: "32px",
-      height: "32px",
-      onClick: toggleDropdown
-    }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
-      type: ui_Icon.IconTypes.MORE,
-      width: "24px",
-      height: "24px"
-    })),
-    menuItems: closeDropdown => /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItems, {
-      parentRef: contextMenuRef,
-      parentContainRef: contextMenuRef,
-      closeDropdown: closeDropdown,
-      openLeft: true
-    }, index.isFineResend({
-      message,
-      userId,
-      status
-    }) && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItem, {
-      onClick: () => {
-        if (disabled) {
-          return;
-        }
-        resendMessage(message);
-        closeDropdown();
-      },
-      dataSbId: "open_channel_file_message_context_menu_resend"
-    }, stringSet.CONTEXT_MENU_DROPDOWN__RESEND), !isEphemeral && index.isFineDelete({
-      message,
-      userId,
-      status
-    }) && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItem, {
-      onClick: () => {
-        if (disabled) {
-          return;
-        }
-        showRemove(true);
-        closeDropdown();
-      },
-      dataSbId: "open_channel_file_message_context_menu_delete"
-    }, stringSet.CONTEXT_MENU_DROPDOWN__DELETE))
+    menuTrigger: function (toggleDropdown) {
+      return index.showMenuTrigger({
+        message: message,
+        userId: userId,
+        status: status
+      }) && /*#__PURE__*/React__default["default"].createElement(ui_IconButton, {
+        className: "sendbird-openchannel-file-message__context-menu__icon",
+        width: "32px",
+        height: "32px",
+        onClick: toggleDropdown
+      }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+        type: ui_Icon.IconTypes.MORE,
+        width: "24px",
+        height: "24px"
+      }));
+    },
+    menuItems: function (closeDropdown) {
+      return /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItems, {
+        parentRef: contextMenuRef,
+        parentContainRef: contextMenuRef,
+        closeDropdown: closeDropdown,
+        openLeft: true
+      }, index.isFineResend({
+        message: message,
+        userId: userId,
+        status: status
+      }) && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItem, {
+        onClick: function () {
+          if (disabled) {
+            return;
+          }
+          resendMessage(message);
+          closeDropdown();
+        },
+        dataSbId: "open_channel_file_message_context_menu_resend"
+      }, stringSet.CONTEXT_MENU_DROPDOWN__RESEND), !isEphemeral && index.isFineDelete({
+        message: message,
+        userId: userId,
+        status: status
+      }) && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItem, {
+        onClick: function () {
+          if (disabled) {
+            return;
+          }
+          showRemove(true);
+          closeDropdown();
+        },
+        dataSbId: "open_channel_file_message_context_menu_delete"
+      }, stringSet.CONTEXT_MENU_DROPDOWN__DELETE));
+    }
   }))), contextMenu && /*#__PURE__*/React__default["default"].createElement(index.OpenChannelMobileMenu, {
     message: message,
-    hideMenu: () => {
+    hideMenu: function () {
       setContextMenu(false);
     },
     parentRef: mobileMenuRef,
-    showRemove: () => {
+    showRemove: function () {
       setContextMenu(false);
       showRemove(true);
     }