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

package/cjs/ui/UserListItem.js

@@ -1,104 +1,107 @@
 'use strict';
 
+var tslib_es6 = require('../tslib.es6-2f2b0bca.js');
 var React = require('react');
-var UserProfileContext = require('../UserProfileContext-fa8d0383.js');
-var LocalizationContext = require('../LocalizationContext-482c1343.js');
+var UserProfileContext = require('../UserProfileContext-922a43ec.js');
+var LocalizationContext = require('../LocalizationContext-5009012e.js');
 var ui_Avatar = require('./Avatar.js');
 var ui_MutedAvatarOverlay = require('./MutedAvatarOverlay.js');
 var ui_Checkbox = require('./Checkbox.js');
 var ui_UserProfile = require('./UserProfile.js');
 var ui_ContextMenu = require('./ContextMenu.js');
-var ui_Label = require('../index-18720f0d.js');
-require('prop-types');
-require('../stringSet-d00535a5.js');
-require('../index-d04f312e.js');
+var ui_Label = require('../index-35820a94.js');
+require('../stringSet-98b52c49.js');
+require('../index-fd8a0abb.js');
 require('./ImageRenderer.js');
 require('./Icon.js');
-require('../uuid-b2806cf5.js');
+require('prop-types');
+require('../uuid-c74bbbb6.js');
 require('../sendbirdSelectors.js');
-require('../_rollupPluginBabelHelpers-83d7e84b.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');
 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('../index-609b07a2.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function UserListItem(_ref) {
-  let {
-    user,
-    className,
-    checked,
-    checkBox,
-    isOperator,
-    disabled,
-    disableMessaging,
-    currentUser,
-    action,
-    onChange,
-    avatarSize = '40px'
-  } = _ref;
-  const uniqueKey = user.userId;
-  const actionRef = React__default["default"].useRef(null);
-  const parentRef = React__default["default"].useRef(null);
-  const avatarRef = React__default["default"].useRef(null);
-  const {
-    disableUserProfile,
-    renderUserProfile
-  } = React.useContext(UserProfileContext.UserProfileContext);
-  const {
-    stringSet
-  } = React.useContext(LocalizationContext.LocalizationContext);
+function UserListItem(_a) {
+  var user = _a.user,
+    className = _a.className,
+    checked = _a.checked,
+    checkBox = _a.checkBox,
+    isOperator = _a.isOperator,
+    disabled = _a.disabled,
+    disableMessaging = _a.disableMessaging,
+    currentUser = _a.currentUser,
+    action = _a.action,
+    onChange = _a.onChange,
+    _b = _a.avatarSize,
+    avatarSize = _b === void 0 ? '40px' : _b,
+    onClick = _a.onClick;
+  var uniqueKey = user.userId;
+  var actionRef = React__default["default"].useRef(null);
+  var parentRef = React__default["default"].useRef(null);
+  var avatarRef = React__default["default"].useRef(null);
+  var _c = React.useContext(UserProfileContext.UserProfileContext),
+    disableUserProfile = _c.disableUserProfile,
+    renderUserProfile = _c.renderUserProfile;
+  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: [...(Array.isArray(className) ? className : [className]), 'sendbird-user-list-item'].join(' '),
+    className: tslib_es6.__spreadArray(tslib_es6.__spreadArray([], Array.isArray(className) ? className : [className], true), ['sendbird-user-list-item'], false).join(' '),
     ref: parentRef
   }, (user === null || user === void 0 ? void 0 : user.isMuted) && /*#__PURE__*/React__default["default"].createElement(ui_MutedAvatarOverlay, {
     height: 40,
     width: 40
   }), /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu["default"], {
-    menuTrigger: toggleDropdown => /*#__PURE__*/React__default["default"].createElement(ui_Avatar["default"], {
-      className: "sendbird-user-list-item__avatar",
-      ref: avatarRef,
-      src: user.profileUrl,
-      width: avatarSize,
-      height: avatarSize,
-      onClick: () => {
-        if (!disableUserProfile) {
-          toggleDropdown();
+    menuTrigger: function (toggleDropdown) {
+      return /*#__PURE__*/React__default["default"].createElement(ui_Avatar["default"], {
+        className: "sendbird-user-list-item__avatar",
+        ref: avatarRef,
+        src: user.profileUrl,
+        width: avatarSize,
+        height: avatarSize,
+        onClick: function () {
+          if (!disableUserProfile) {
+            toggleDropdown();
+            onClick === null || onClick === void 0 ? void 0 : onClick();
+          }
+        }
+      });
+    },
+    menuItems: function (closeDropdown) {
+      return /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItems, {
+        openLeft: true,
+        parentRef: avatarRef
+        // for catching location(x, y) of MenuItems
+        ,
+        parentContainRef: avatarRef
+        // for toggling more options(menus & reactions)
+        ,
+        closeDropdown: closeDropdown,
+        style: {
+          paddingTop: '0px',
+          paddingBottom: '0px'
         }
-      }
-    }),
-    menuItems: closeDropdown => /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.MenuItems, {
-      openLeft: true,
-      parentRef: avatarRef
-      // for catching location(x, y) of MenuItems
-      ,
-      parentContainRef: avatarRef
-      // for toggling more options(menus & reactions)
-      ,
-      closeDropdown: closeDropdown,
-      style: {
-        paddingTop: '0px',
-        paddingBottom: '0px'
-      }
-    }, renderUserProfile ? renderUserProfile({
-      user,
-      currentUserId: currentUser,
-      close: closeDropdown
-    }) : /*#__PURE__*/React__default["default"].createElement(ui_UserProfile, {
-      disableMessaging: disableMessaging,
-      user: user,
-      currentUserId: currentUser,
-      onSuccess: closeDropdown
-    }))
+      }, renderUserProfile ? renderUserProfile({
+        user: user,
+        currentUserId: currentUser,
+        close: closeDropdown
+      }) : /*#__PURE__*/React__default["default"].createElement(ui_UserProfile, {
+        disableMessaging: disableMessaging,
+        user: user,
+        currentUserId: currentUser,
+        onSuccess: closeDropdown
+      }));
+    }
   }), /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
     className: "sendbird-user-list-item__title",
     type: ui_Label.LabelTypography.SUBTITLE_1,
@@ -116,7 +119,9 @@ function UserListItem(_ref) {
     id: uniqueKey,
     checked: checked,
     disabled: disabled,
-    onChange: event => onChange(event)
+    onChange: function (event) {
+      return onChange(event);
+    }
   })), isOperator && /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
     className: ['sendbird-user-list-item__operator', checkBox ? 'checkbox' : ''].join(' '),
     type: ui_Label.LabelTypography.SUBTITLE_2,
@@ -125,8 +130,8 @@ function UserListItem(_ref) {
     className: "sendbird-user-list-item__action",
     ref: actionRef
   }, action({
-    actionRef,
-    parentRef
+    actionRef: actionRef,
+    parentRef: parentRef
   })));
 }
 

package/cjs/ui/UserListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserListItem.js","sources":["../../../src/ui/UserListItem/index.tsx"],"sourcesContent":["import React, { ChangeEvent, MutableRefObject, ReactElement, useContext } from 'react';\nimport { User } from '@sendbird/chat';\nimport { Member } from '@sendbird/chat/groupChannel';\nimport './index.scss';\n\nimport { UserProfileContext } from '../../lib/UserProfileContext';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport Avatar from '../Avatar/index';\nimport MutedAvatarOverlay from '../Avatar/MutedAvatarOverlay';\nimport Checkbox from '../Checkbox';\nimport UserProfile from '../UserProfile';\nimport ContextMenu, { MenuItems } from '../ContextMenu';\nimport Label, { LabelTypography, LabelColors } from '../Label';\n\nexport interface UserListItemProps {\n  user: User;\n  className?: string;\n  checked?: boolean;\n  checkBox?: boolean;\n  isOperator?: boolean;\n  disabled?: boolean;\n  disableMessaging?: boolean;\n  currentUser?: string;\n  action?({ actionRef, parentRef }: {\n    actionRef: MutableRefObject<any>,\n    parentRef?: MutableRefObject<any>,\n  }): ReactElement;\n  onChange?(e: ChangeEvent<HTMLInputElement>): void;\n  avatarSize?: string;\n}\n\nexport default function UserListItem({\n  user,\n  className,\n  checked,\n  checkBox,\n  isOperator,\n  disabled,\n  disableMessaging,\n  currentUser,\n  action,\n  onChange,\n  avatarSize = '40px',\n}: UserListItemProps): ReactElement {\n  const uniqueKey = user.userId;\n  const actionRef = React.useRef(null);\n  const parentRef = React.useRef(null);\n  const avatarRef = React.useRef(null);\n  const {\n    disableUserProfile,\n    renderUserProfile,\n  } = useContext<UserProfileContext>(UserProfileContext);\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-user-list-item',\n      ].join(' ')}\n      ref={parentRef}\n    >\n      {\n        (user as Member)?.isMuted && (\n          <MutedAvatarOverlay height={40} width={40} />\n        )\n      }\n      <ContextMenu\n        menuTrigger={(toggleDropdown) => (\n          <Avatar\n            className=\"sendbird-user-list-item__avatar\"\n            ref={avatarRef}\n            src={user.profileUrl}\n            width={avatarSize}\n            height={avatarSize}\n            onClick={() => {\n              if (!disableUserProfile) {\n                toggleDropdown();\n              }\n            }}\n          />\n        )}\n        menuItems={(closeDropdown) => (\n          <MenuItems\n            openLeft\n            parentRef={avatarRef}\n            // for catching location(x, y) of MenuItems\n            parentContainRef={avatarRef}\n            // for toggling more options(menus & reactions)\n            closeDropdown={closeDropdown}\n            style={{ paddingTop: '0px', paddingBottom: '0px' }}\n          >\n            {\n              renderUserProfile\n                ? renderUserProfile({\n                  user,\n                  currentUserId: currentUser,\n                  close: closeDropdown,\n                })\n                : (\n                  <UserProfile\n                    disableMessaging={disableMessaging}\n                    user={user}\n                    currentUserId={currentUser}\n                    onSuccess={closeDropdown}\n                  />\n                )\n            }\n          </MenuItems>\n        )}\n      />\n      <Label\n        className=\"sendbird-user-list-item__title\"\n        type={LabelTypography.SUBTITLE_1}\n        color={LabelColors.ONBACKGROUND_1}\n      >\n        {user.nickname || stringSet.NO_NAME}\n        {\n          (currentUser === user.userId) && (\n            ' (You)'\n          )\n        }\n      </Label>\n      { // if there is now nickname, display userId\n        !user.nickname && (\n          <Label\n            className=\"sendbird-user-list-item__subtitle\"\n            type={LabelTypography.CAPTION_3}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            {user.userId}\n          </Label>\n        )\n      }\n      {\n        checkBox && (\n          <label\n            className=\"sendbird-user-list-item__checkbox\"\n            htmlFor={uniqueKey}\n          >\n            <Checkbox\n              id={uniqueKey}\n              checked={checked}\n              disabled={disabled}\n              onChange={(event) => onChange(event)}\n            />\n          </label>\n        )\n      }\n      {\n        isOperator && (\n          <Label\n            className={[\n              'sendbird-user-list-item__operator',\n              checkBox ? 'checkbox' : '',\n            ].join(' ')}\n            type={LabelTypography.SUBTITLE_2}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            Operator\n          </Label>\n        )\n      }\n      {\n        action && (\n          <div\n            className=\"sendbird-user-list-item__action\"\n            ref={actionRef}\n          >\n            {action({ actionRef, parentRef })}\n          </div>\n        )\n      }\n    </div>\n  );\n}\n"],"names":["UserListItem","_ref","user","className","checked","checkBox","isOperator","disabled","disableMessaging","currentUser","action","onChange","avatarSize","uniqueKey","userId","actionRef","React","useRef","parentRef","avatarRef","disableUserProfile","renderUserProfile","useContext","UserProfileContext","stringSet","LocalizationContext","createElement","Array","isArray","join","ref","isMuted","MutedAvatarOverlay","height","width","ContextMenu","menuTrigger","toggleDropdown","Avatar","src","profileUrl","onClick","menuItems","closeDropdown","MenuItems","openLeft","parentContainRef","style","paddingTop","paddingBottom","currentUserId","close","UserProfile","onSuccess","Label","type","LabelTypography","SUBTITLE_1","color","LabelColors","ONBACKGROUND_1","nickname","NO_NAME","CAPTION_3","ONBACKGROUND_2","htmlFor","Checkbox","id","event","SUBTITLE_2"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+Be,SAASA,YAAYA,CAAAC,IAAA,EAYA;EAAA,IAZC;IACnCC,IAAI;IACJC,SAAS;IACTC,OAAO;IACPC,QAAQ;IACRC,UAAU;IACVC,QAAQ;IACRC,gBAAgB;IAChBC,WAAW;IACXC,MAAM;IACNC,QAAQ;AACRC,IAAAA,UAAU,GAAG,MAAA;AACI,GAAC,GAAAX,IAAA,CAAA;AAClB,EAAA,MAAMY,SAAS,GAAGX,IAAI,CAACY,MAAM,CAAA;AAC7B,EAAA,MAAMC,SAAS,GAAGC,yBAAK,CAACC,MAAM,CAAC,IAAI,CAAC,CAAA;AACpC,EAAA,MAAMC,SAAS,GAAGF,yBAAK,CAACC,MAAM,CAAC,IAAI,CAAC,CAAA;AACpC,EAAA,MAAME,SAAS,GAAGH,yBAAK,CAACC,MAAM,CAAC,IAAI,CAAC,CAAA;EACpC,MAAM;IACJG,kBAAkB;AAClBC,IAAAA,iBAAAA;AACF,GAAC,GAAGC,gBAAU,CAAqBC,qCAAkB,CAAC,CAAA;EACtD,MAAM;AAAEC,IAAAA,SAAAA;AAAU,GAAC,GAAGF,gBAAU,CAACG,uCAAmB,CAAC,CAAA;EACrD,oBACET,yBAAA,CAAAU,aAAA,CAAA,KAAA,EAAA;IACEvB,SAAS,EAAE,CACT,IAAIwB,KAAK,CAACC,OAAO,CAACzB,SAAS,CAAC,GAAGA,SAAS,GAAG,CAACA,SAAS,CAAC,CAAC,EACvD,yBAAyB,CAC1B,CAAC0B,IAAI,CAAC,GAAG,CAAE;AACZC,IAAAA,GAAG,EAAEZ,SAAAA;AAAU,GAAA,EAGb,CAAChB,IAAI,KAAJA,IAAAA,IAAAA,IAAI,KAAJA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,IAAI,CAAa6B,OAAO,kBACvBf,yBAAA,CAAAU,aAAA,CAACM,qBAAkB,EAAA;AAACC,IAAAA,MAAM,EAAE,EAAG;AAACC,IAAAA,KAAK,EAAE,EAAA;AAAG,GAAA,CAC3C,eAEHlB,yBAAA,CAAAU,aAAA,CAACS,yBAAW,EAAA;AACVC,IAAAA,WAAW,EAAGC,cAAc,iBAC1BrB,yBAAA,CAAAU,aAAA,CAACY,oBAAM,EAAA;AACLnC,MAAAA,SAAS,EAAC,iCAAiC;AAC3C2B,MAAAA,GAAG,EAAEX,SAAU;MACfoB,GAAG,EAAErC,IAAI,CAACsC,UAAW;AACrBN,MAAAA,KAAK,EAAEtB,UAAW;AAClBqB,MAAAA,MAAM,EAAErB,UAAW;MACnB6B,OAAO,EAAEA,MAAM;QACb,IAAI,CAACrB,kBAAkB,EAAE;AACvBiB,UAAAA,cAAc,EAAE,CAAA;AAClB,SAAA;AACF,OAAA;KAEF,CAAA;AACFK,IAAAA,SAAS,EAAGC,aAAa,iBACvB3B,yBAAA,CAAAU,aAAA,CAACkB,wBAAS,EAAA;MACRC,QAAQ,EAAA,IAAA;AACR3B,MAAAA,SAAS,EAAEC,SAAAA;AACX;AAAA;AACA2B,MAAAA,gBAAgB,EAAE3B,SAAAA;AAClB;AAAA;AACAwB,MAAAA,aAAa,EAAEA,aAAc;AAC7BI,MAAAA,KAAK,EAAE;AAAEC,QAAAA,UAAU,EAAE,KAAK;AAAEC,QAAAA,aAAa,EAAE,KAAA;AAAM,OAAA;KAG/C5B,EAAAA,iBAAiB,GACbA,iBAAiB,CAAC;MAClBnB,IAAI;AACJgD,MAAAA,aAAa,EAAEzC,WAAW;AAC1B0C,MAAAA,KAAK,EAAER,aAAAA;AACT,KAAC,CAAC,gBAEA3B,yBAAA,CAAAU,aAAA,CAAC0B,cAAW,EAAA;AACV5C,MAAAA,gBAAgB,EAAEA,gBAAiB;AACnCN,MAAAA,IAAI,EAAEA,IAAK;AACXgD,MAAAA,aAAa,EAAEzC,WAAY;AAC3B4C,MAAAA,SAAS,EAAEV,aAAAA;KAEd,CAAA,CAAA;AAGP,GAAA,CACF,eACF3B,yBAAA,CAAAU,aAAA,CAAC4B,cAAK,EAAA;AACJnD,IAAAA,SAAS,EAAC,gCAAgC;IAC1CoD,IAAI,EAAEC,wBAAe,CAACC,UAAW;IACjCC,KAAK,EAAEC,oBAAW,CAACC,cAAAA;AAAe,GAAA,EAEjC1D,IAAI,CAAC2D,QAAQ,IAAIrC,SAAS,CAACsC,OAAO,EAEhCrD,WAAW,KAAKP,IAAI,CAACY,MAAM,IAC1B,QACD,CAEG;AACN;EACA,CAACZ,IAAI,CAAC2D,QAAQ,iBACZ7C,yBAAA,CAAAU,aAAA,CAAC4B,cAAK,EAAA;AACJnD,IAAAA,SAAS,EAAC,mCAAmC;IAC7CoD,IAAI,EAAEC,wBAAe,CAACO,SAAU;IAChCL,KAAK,EAAEC,oBAAW,CAACK,cAAAA;GAElB9D,EAAAA,IAAI,CAACY,MAAM,CAEf,EAGDT,QAAQ,iBACNW,yBAAA,CAAAU,aAAA,CAAA,OAAA,EAAA;AACEvB,IAAAA,SAAS,EAAC,mCAAmC;AAC7C8D,IAAAA,OAAO,EAAEpD,SAAAA;AAAU,GAAA,eAEnBG,yBAAA,CAAAU,aAAA,CAACwC,WAAQ,EAAA;AACPC,IAAAA,EAAE,EAAEtD,SAAU;AACdT,IAAAA,OAAO,EAAEA,OAAQ;AACjBG,IAAAA,QAAQ,EAAEA,QAAS;AACnBI,IAAAA,QAAQ,EAAGyD,KAAK,IAAKzD,QAAQ,CAACyD,KAAK,CAAA;GACnC,CAAA,CAEL,EAGD9D,UAAU,iBACRU,yBAAA,CAAAU,aAAA,CAAC4B,cAAK,EAAA;AACJnD,IAAAA,SAAS,EAAE,CACT,mCAAmC,EACnCE,QAAQ,GAAG,UAAU,GAAG,EAAE,CAC3B,CAACwB,IAAI,CAAC,GAAG,CAAE;IACZ0B,IAAI,EAAEC,wBAAe,CAACa,UAAW;IACjCX,KAAK,EAAEC,oBAAW,CAACK,cAAAA;AAAe,GAAA,EACnC,UAED,CACD,EAGDtD,MAAM,iBACJM,yBAAA,CAAAU,aAAA,CAAA,KAAA,EAAA;AACEvB,IAAAA,SAAS,EAAC,iCAAiC;AAC3C2B,IAAAA,GAAG,EAAEf,SAAAA;AAAU,GAAA,EAEdL,MAAM,CAAC;IAAEK,SAAS;AAAEG,IAAAA,SAAAA;GAAW,CAAC,CAEpC,CAEC,CAAA;AAEV;;;;"}
+{"version":3,"file":"UserListItem.js","sources":["../../../src/ui/UserListItem/index.tsx"],"sourcesContent":["import React, { ChangeEvent, MutableRefObject, ReactElement, useContext } from 'react';\nimport { User } from '@sendbird/chat';\nimport { Member } from '@sendbird/chat/groupChannel';\nimport './index.scss';\n\nimport { UserProfileContext } from '../../lib/UserProfileContext';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport Avatar from '../Avatar/index';\nimport MutedAvatarOverlay from '../Avatar/MutedAvatarOverlay';\nimport Checkbox from '../Checkbox';\nimport UserProfile from '../UserProfile';\nimport ContextMenu, { MenuItems } from '../ContextMenu';\nimport Label, { LabelTypography, LabelColors } from '../Label';\n\nexport interface UserListItemProps {\n  user: User;\n  className?: string;\n  checked?: boolean;\n  checkBox?: boolean;\n  isOperator?: boolean;\n  disabled?: boolean;\n  disableMessaging?: boolean;\n  currentUser?: string;\n  action?({ actionRef, parentRef }: {\n    actionRef: MutableRefObject<any>,\n    parentRef?: MutableRefObject<any>,\n  }): ReactElement;\n  onChange?(e: ChangeEvent<HTMLInputElement>): void;\n  avatarSize?: string;\n  onClick?(): 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  avatarSize = '40px',\n  onClick,\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 { disableUserProfile, renderUserProfile } = 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={avatarSize}\n            height={avatarSize}\n            onClick={() => {\n              if (!disableUserProfile) {\n                toggleDropdown();\n                onClick?.();\n              }\n            }}\n          />\n        )}\n        menuItems={(closeDropdown) => (\n          <MenuItems\n            openLeft\n            parentRef={avatarRef}\n            // for catching location(x, y) of MenuItems\n            parentContainRef={avatarRef}\n            // for toggling more options(menus & reactions)\n            closeDropdown={closeDropdown}\n            style={{ paddingTop: '0px', paddingBottom: '0px' }}\n          >\n            {\n              renderUserProfile\n                ? renderUserProfile({\n                  user,\n                  currentUserId: currentUser,\n                  close: closeDropdown,\n                })\n                : (\n                  <UserProfile\n                    disableMessaging={disableMessaging}\n                    user={user}\n                    currentUserId={currentUser}\n                    onSuccess={closeDropdown}\n                  />\n                )\n            }\n          </MenuItems>\n        )}\n      />\n      <Label\n        className=\"sendbird-user-list-item__title\"\n        type={LabelTypography.SUBTITLE_1}\n        color={LabelColors.ONBACKGROUND_1}\n      >\n        {user.nickname || stringSet.NO_NAME}\n        {\n          (currentUser === user.userId) && (\n            ' (You)'\n          )\n        }\n      </Label>\n      { // if there is now nickname, display userId\n        !user.nickname && (\n          <Label\n            className=\"sendbird-user-list-item__subtitle\"\n            type={LabelTypography.CAPTION_3}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            {user.userId}\n          </Label>\n        )\n      }\n      {\n        checkBox && (\n          <label\n            className=\"sendbird-user-list-item__checkbox\"\n            htmlFor={uniqueKey}\n          >\n            <Checkbox\n              id={uniqueKey}\n              checked={checked}\n              disabled={disabled}\n              onChange={(event) => onChange(event)}\n            />\n          </label>\n        )\n      }\n      {\n        isOperator && (\n          <Label\n            className={[\n              'sendbird-user-list-item__operator',\n              checkBox ? 'checkbox' : '',\n            ].join(' ')}\n            type={LabelTypography.SUBTITLE_2}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            Operator\n          </Label>\n        )\n      }\n      {\n        action && (\n          <div\n            className=\"sendbird-user-list-item__action\"\n            ref={actionRef}\n          >\n            {action({ actionRef, parentRef })}\n          </div>\n        )\n      }\n    </div>\n  );\n}\n"],"names":["UserListItem","_a","user","className","checked","checkBox","isOperator","disabled","disableMessaging","currentUser","action","onChange","_b","avatarSize","onClick","uniqueKey","userId","actionRef","React","useRef","parentRef","avatarRef","_c","useContext","UserProfileContext","disableUserProfile","renderUserProfile","stringSet","LocalizationContext","createElement","__spreadArray","Array","isArray","join","ref","isMuted","MutedAvatarOverlay","height","width","ContextMenu","menuTrigger","toggleDropdown","Avatar","src","profileUrl","menuItems","closeDropdown","MenuItems","openLeft","parentContainRef","style","paddingTop","paddingBottom","currentUserId","close","UserProfile","onSuccess","Label","type","LabelTypography","SUBTITLE_1","color","LabelColors","ONBACKGROUND_1","nickname","NO_NAME","CAPTION_3","ONBACKGROUND_2","htmlFor","Checkbox","id","event","SUBTITLE_2"],"mappings":"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"}

package/cjs/ui/UserProfile.js

@@ -1,47 +1,42 @@
 'use strict';
 
 var React = require('react');
-var LocalizationContext = require('../LocalizationContext-482c1343.js');
-var UserProfileContext = require('../UserProfileContext-fa8d0383.js');
+var LocalizationContext = require('../LocalizationContext-5009012e.js');
+var UserProfileContext = require('../UserProfileContext-922a43ec.js');
 var sendbirdSelectors = require('../sendbirdSelectors.js');
 var ui_Avatar = require('./Avatar.js');
-var ui_Label = require('../index-18720f0d.js');
+var ui_Label = require('../index-35820a94.js');
 var ui_Button = require('./Button.js');
 var useSendbirdStateContext = require('../useSendbirdStateContext.js');
-require('../stringSet-d00535a5.js');
-require('../index-d04f312e.js');
-require('prop-types');
-require('../_rollupPluginBabelHelpers-83d7e84b.js');
-require('../topics-adde627b.js');
-require('../utils-c47c68b1.js');
+var types = require('../types-66554668.js');
+require('../stringSet-98b52c49.js');
+require('../index-fd8a0abb.js');
+require('../pubSub/topics.js');
+require('../utils-180c6bc8.js');
+require('../tslib.es6-2f2b0bca.js');
 require('./ImageRenderer.js');
 require('./Icon.js');
-require('../uuid-b2806cf5.js');
+require('prop-types');
+require('../uuid-c74bbbb6.js');
 require('../withSendbird.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function UserProfile(_ref) {
-  var _store$config, _store$config2;
-  let {
-    user,
-    currentUserId,
-    disableMessaging = false,
-    onSuccess
-  } = _ref;
-  const store = useSendbirdStateContext();
-  const createChannel = sendbirdSelectors.getCreateGroupChannel(store);
-  const logger = store === null || store === void 0 ? void 0 : (_store$config = store.config) === null || _store$config === void 0 ? void 0 : _store$config.logger;
-  const {
-    stringSet
-  } = React.useContext(LocalizationContext.LocalizationContext);
-  const currentUserId_ = currentUserId || (store === null || store === void 0 ? void 0 : (_store$config2 = store.config) === null || _store$config2 === void 0 ? void 0 : _store$config2.userId);
-  // @ts-ignore
-  const {
-    onUserProfileMessage
-  } = React.useContext(UserProfileContext.UserProfileContext);
+function UserProfile(_a) {
+  var _b, _c;
+  var user = _a.user,
+    currentUserId = _a.currentUserId,
+    _d = _a.disableMessaging,
+    disableMessaging = _d === void 0 ? false : _d,
+    onSuccess = _a.onSuccess;
+  var store = useSendbirdStateContext.useSendbirdStateContext();
+  var createChannel = sendbirdSelectors.getCreateGroupChannel(store);
+  var logger = (_b = store === null || store === void 0 ? void 0 : store.config) === null || _b === void 0 ? void 0 : _b.logger;
+  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
+  var currentUserId_ = currentUserId || ((_c = store === null || store === void 0 ? void 0 : store.config) === null || _c === void 0 ? void 0 : _c.userId);
+  var onUserProfileMessage = React.useContext(UserProfileContext.UserProfileContext).onUserProfileMessage;
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird__user-profile"
   }, /*#__PURE__*/React__default["default"].createElement("section", {
@@ -58,16 +53,16 @@ function UserProfile(_ref) {
   }, (user === null || user === void 0 ? void 0 : user.nickname) || stringSet.NO_NAME)), (user === null || user === void 0 ? void 0 : user.userId) !== currentUserId_ && !disableMessaging && /*#__PURE__*/React__default["default"].createElement("section", {
     className: "sendbird__user-profile-message"
   }, /*#__PURE__*/React__default["default"].createElement(ui_Button["default"], {
-    type: ui_Button.ButtonTypes.SECONDARY,
-    onClick: () => {
+    type: types.ButtonTypes.SECONDARY,
+    onClick: function () {
       // Create 1:1 channel
-      const params = {
+      var params = {
         isDistinct: false,
         invitedUserIds: [user === null || user === void 0 ? void 0 : user.userId],
         operatorUserIds: [currentUserId_]
       };
       onSuccess();
-      createChannel(params).then(groupChannel => {
+      createChannel(params).then(function (groupChannel) {
         logger.info('UserProfile, channel create', groupChannel);
         if (typeof onUserProfileMessage === 'function') {
           onUserProfileMessage === null || onUserProfileMessage === void 0 ? void 0 : onUserProfileMessage(groupChannel);

package/cjs/ui/UserProfile.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserProfile.js","sources":["../../../src/ui/UserProfile/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement, useContext } from 'react';\nimport type { GroupChannel, GroupChannelCreateParams } from '@sendbird/chat/groupChannel';\nimport type { User } from '@sendbird/chat';\n\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport { UserProfileContext } from '../../lib/UserProfileContext';\nimport { getCreateGroupChannel } from '../../lib/selectors';\nimport Avatar from '../Avatar/index';\nimport Label, { LabelColors, LabelTypography } from '../Label';\nimport Button, { ButtonTypes } from '../Button';\nimport useSendbirdStateContext from '../../hooks/useSendbirdStateContext';\n\ninterface Logger {\n  info?(message: string, channel: GroupChannel): void;\n}\n\ninterface Props {\n  user: User;\n  currentUserId?: string;\n  logger?: Logger;\n  disableMessaging?: boolean;\n  createChannel?(params: GroupChannelCreateParams): Promise<GroupChannel>;\n  onSuccess?: () => void;\n}\n\nfunction UserProfile({\n  user,\n  currentUserId,\n  disableMessaging = false,\n  onSuccess,\n}: Props): ReactElement {\n  const store = useSendbirdStateContext();\n  const createChannel = getCreateGroupChannel(store);\n  const logger = store?.config?.logger;\n  const { stringSet } = useContext(LocalizationContext);\n  const currentUserId_ = currentUserId || store?.config?.userId;\n  // @ts-ignore\n  const { onUserProfileMessage } = useContext(UserProfileContext);\n  return (\n    <div className=\"sendbird__user-profile\">\n      <section className=\"sendbird__user-profile-avatar\">\n        <Avatar\n          height=\"80px\"\n          width=\"80px\"\n          src={user?.profileUrl}\n        />\n      </section>\n      <section className=\"sendbird__user-profile-name\">\n        <Label\n          type={LabelTypography.H_2}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {user?.nickname || stringSet.NO_NAME}\n        </Label>\n      </section>\n      {\n        (user?.userId !== currentUserId_) && !disableMessaging && (\n          <section className=\"sendbird__user-profile-message\">\n            <Button\n              type={ButtonTypes.SECONDARY}\n              onClick={() => {\n                // Create 1:1 channel\n                const params: GroupChannelCreateParams = {\n                  isDistinct: false,\n                  invitedUserIds: [user?.userId],\n                  operatorUserIds: [currentUserId_],\n                };\n                onSuccess();\n                createChannel(params)\n                  .then((groupChannel) => {\n                    logger.info('UserProfile, channel create', groupChannel);\n                    if (typeof onUserProfileMessage === 'function') {\n                      onUserProfileMessage?.(groupChannel);\n                    }\n                  });\n              }}\n            >\n              {stringSet.USER_PROFILE__MESSAGE}\n            </Button>\n          </section>\n        )\n      }\n      <div className=\"sendbird__user-profile-separator\" />\n      <section className=\"sendbird__user-profile-userId\">\n        <Label\n          className=\"sendbird__user-profile-userId--label\"\n          type={LabelTypography.CAPTION_2}\n          color={LabelColors.ONBACKGROUND_2}\n        >\n          {stringSet.USER_PROFILE__USER_ID}\n        </Label>\n        <Label\n          className=\"sendbird__user-profile-userId--value\"\n          type={LabelTypography.BODY_1}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {user?.userId}\n        </Label>\n      </section>\n    </div>\n  );\n}\n\nexport default UserProfile;\n"],"names":["UserProfile","_ref","_store$config","_store$config2","user","currentUserId","disableMessaging","onSuccess","store","useSendbirdStateContext","createChannel","getCreateGroupChannel","logger","config","stringSet","useContext","LocalizationContext","currentUserId_","userId","onUserProfileMessage","UserProfileContext","React","createElement","className","Avatar","height","width","src","profileUrl","Label","type","LabelTypography","H_2","color","LabelColors","ONBACKGROUND_1","nickname","NO_NAME","Button","ButtonTypes","SECONDARY","onClick","params","isDistinct","invitedUserIds","operatorUserIds","then","groupChannel","info","USER_PROFILE__MESSAGE","CAPTION_2","ONBACKGROUND_2","USER_PROFILE__USER_ID","BODY_1"],"mappings":"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"}
+{"version":3,"file":"UserProfile.js","sources":["../../../src/ui/UserProfile/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement, useContext } from 'react';\nimport type { GroupChannel, GroupChannelCreateParams } from '@sendbird/chat/groupChannel';\nimport type { User } from '@sendbird/chat';\n\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport { UserProfileContext } from '../../lib/UserProfileContext';\nimport { getCreateGroupChannel } from '../../lib/selectors';\nimport Avatar from '../Avatar/index';\nimport Label, { LabelColors, LabelTypography } from '../Label';\nimport Button, { ButtonTypes } from '../Button';\nimport useSendbirdStateContext from '../../hooks/useSendbirdStateContext';\n\ninterface Logger {\n  info?(message: string, channel: GroupChannel): void;\n}\n\ninterface Props {\n  user: User;\n  currentUserId?: string;\n  logger?: Logger;\n  disableMessaging?: boolean;\n  createChannel?(params: GroupChannelCreateParams): Promise<GroupChannel>;\n  onSuccess?: () => void;\n}\n\nfunction UserProfile({\n  user,\n  currentUserId,\n  disableMessaging = false,\n  onSuccess,\n}: Props): ReactElement {\n  const store = useSendbirdStateContext();\n  const createChannel = getCreateGroupChannel(store);\n  const logger = store?.config?.logger;\n  const { stringSet } = useContext(LocalizationContext);\n  const currentUserId_ = currentUserId || store?.config?.userId;\n  const { onUserProfileMessage } = useContext(UserProfileContext);\n  return (\n    <div className=\"sendbird__user-profile\">\n      <section className=\"sendbird__user-profile-avatar\">\n        <Avatar\n          height=\"80px\"\n          width=\"80px\"\n          src={user?.profileUrl}\n        />\n      </section>\n      <section className=\"sendbird__user-profile-name\">\n        <Label\n          type={LabelTypography.H_2}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {user?.nickname || stringSet.NO_NAME}\n        </Label>\n      </section>\n      {\n        (user?.userId !== currentUserId_) && !disableMessaging && (\n          <section className=\"sendbird__user-profile-message\">\n            <Button\n              type={ButtonTypes.SECONDARY}\n              onClick={() => {\n                // Create 1:1 channel\n                const params: GroupChannelCreateParams = {\n                  isDistinct: false,\n                  invitedUserIds: [user?.userId],\n                  operatorUserIds: [currentUserId_],\n                };\n                onSuccess();\n                createChannel(params)\n                  .then((groupChannel) => {\n                    logger.info('UserProfile, channel create', groupChannel);\n                    if (typeof onUserProfileMessage === 'function') {\n                      onUserProfileMessage?.(groupChannel);\n                    }\n                  });\n              }}\n            >\n              {stringSet.USER_PROFILE__MESSAGE}\n            </Button>\n          </section>\n        )\n      }\n      <div className=\"sendbird__user-profile-separator\" />\n      <section className=\"sendbird__user-profile-userId\">\n        <Label\n          className=\"sendbird__user-profile-userId--label\"\n          type={LabelTypography.CAPTION_2}\n          color={LabelColors.ONBACKGROUND_2}\n        >\n          {stringSet.USER_PROFILE__USER_ID}\n        </Label>\n        <Label\n          className=\"sendbird__user-profile-userId--value\"\n          type={LabelTypography.BODY_1}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {user?.userId}\n        </Label>\n      </section>\n    </div>\n  );\n}\n\nexport default UserProfile;\n"],"names":["UserProfile","_a","user","currentUserId","_d","disableMessaging","onSuccess","store","useSendbirdStateContext","createChannel","getCreateGroupChannel","logger","_b","config","stringSet","useContext","LocalizationContext","currentUserId_","_c","userId","onUserProfileMessage","UserProfileContext","React","createElement","className","Avatar","height","width","src","profileUrl","Label","type","LabelTypography","H_2","color","LabelColors","ONBACKGROUND_1","nickname","NO_NAME","Button","ButtonTypes","SECONDARY","onClick","params","isDistinct","invitedUserIds","operatorUserIds","then","groupChannel","info","USER_PROFILE__MESSAGE","CAPTION_2","ONBACKGROUND_2","USER_PROFILE__USER_ID","BODY_1"],"mappings":"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"}

package/cjs/ui/VoiceMessageItemBody.js

@@ -8,22 +8,23 @@ var VoicePlayer_useVoicePlayer = require('../VoicePlayer/useVoicePlayer.js');
 var ui_PlaybackTime = require('./PlaybackTime.js');
 var ui_Loader = require('./Loader.js');
 var ui_Icon = require('./Icon.js');
-var ui_Label = require('../index-18720f0d.js');
-var VoicePlayer_context = require('../index-1f6b30ea.js');
-require('../consts-fb07c671.js');
+var ui_Label = require('../index-35820a94.js');
+var VoicePlayer_context = require('../index-0ec5a831.js');
+require('../consts-95462b21.js');
 require('../VoiceRecorder/context.js');
-require('../LocalizationContext-482c1343.js');
-require('../stringSet-d00535a5.js');
-require('../index-d04f312e.js');
+require('../LocalizationContext-5009012e.js');
+require('../stringSet-98b52c49.js');
+require('../index-fd8a0abb.js');
 require('./Modal.js');
 require('react-dom');
-require('../utils-c47c68b1.js');
-require('../index.module-a24e9cd7.js');
-require('../index-cbcacbee.js');
-require('../MediaQueryContext-73aac8cf.js');
+require('../utils-180c6bc8.js');
+require('../tslib.es6-2f2b0bca.js');
+require('../index-609b07a2.js');
+require('../index-daf80c58.js');
+require('../MediaQueryContext-d6fdbe43.js');
 require('./IconButton.js');
-require('../_rollupPluginBabelHelpers-83d7e84b.js');
 require('./Button.js');
+require('../types-66554668.js');
 require('prop-types');
 require('../useSendbirdStateContext.js');
 require('../withSendbird.js');
@@ -32,48 +33,53 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const VoiceMessageItemBody = _ref => {
-  var _message$reactions2;
-  let {
-    className,
-    message,
-    channelUrl,
-    isByMe = false,
-    isReactionEnabled = false
-  } = _ref;
-  const [usingReaction, setUsingReaction] = React.useState(false);
-  const {
-    play,
+var VoiceMessageItemBody = function (_a) {
+  var _b;
+  var className = _a.className,
+    message = _a.message,
+    channelUrl = _a.channelUrl,
+    _c = _a.isByMe,
+    isByMe = _c === void 0 ? false : _c,
+    _d = _a.isReactionEnabled,
+    isReactionEnabled = _d === void 0 ? false : _d;
+  var _e = React.useState(false),
+    usingReaction = _e[0],
+    setUsingReaction = _e[1];
+  var _f = VoicePlayer_useVoicePlayer.useVoicePlayer({
+      channelUrl: channelUrl,
+      key: "".concat(message === null || message === void 0 ? void 0 : message.messageId),
+      audioFileUrl: message === null || message === void 0 ? void 0 : message.url
+    }),
+    play = _f.play,
     // do not pause on unmount, because on desktop layout
     // the component can be paused when it is played from
     // channel and same message is unmounted from the thread
-    pause,
-    playbackTime = 0,
-    duration,
-    playingStatus = VoicePlayer_context.VOICE_PLAYER_STATUS.IDLE
-  } = VoicePlayer_useVoicePlayer.useVoicePlayer({
-    channelUrl,
-    key: `${message === null || message === void 0 ? void 0 : message.messageId}`,
-    audioFileUrl: message === null || message === void 0 ? void 0 : message.url
-  });
-  React.useEffect(() => {
-    var _message$reactions;
-    if (isReactionEnabled && (message === null || message === void 0 ? void 0 : (_message$reactions = message.reactions) === null || _message$reactions === void 0 ? void 0 : _message$reactions.length) > 0) {
+    pause = _f.pause,
+    _g = _f.playbackTime,
+    playbackTime = _g === void 0 ? 0 : _g,
+    duration = _f.duration,
+    _h = _f.playingStatus,
+    playingStatus = _h === void 0 ? VoicePlayer_context.VOICE_PLAYER_STATUS.IDLE : _h;
+  React.useEffect(function () {
+    var _a;
+    if (isReactionEnabled && ((_a = message === null || message === void 0 ? void 0 : message.reactions) === null || _a === void 0 ? void 0 : _a.length) > 0) {
       setUsingReaction(true);
     } else {
       setUsingReaction(false);
     }
-  }, [isReactionEnabled, message === null || message === void 0 ? void 0 : (_message$reactions2 = message.reactions) === null || _message$reactions2 === void 0 ? void 0 : _message$reactions2.length]);
-  const progresBarMaxSize = React.useMemo(() => {
-    if (message !== null && message !== void 0 && message.metaArrays) {
-      var _message$metaArrays$f;
-      const duration = message === null || message === void 0 ? void 0 : (_message$metaArrays$f = message.metaArrays.find(metaArray => metaArray.key === 'KEY_VOICE_MESSAGE_DURATION')) === null || _message$metaArrays$f === void 0 ? void 0 : _message$metaArrays$f.value[0];
-      return duration && parseInt(duration);
+  }, [isReactionEnabled, (_b = message === null || message === void 0 ? void 0 : message.reactions) === null || _b === void 0 ? void 0 : _b.length]);
+  var progresBarMaxSize = React.useMemo(function () {
+    var _a;
+    if (message === null || message === void 0 ? void 0 : message.metaArrays) {
+      var duration_1 = (_a = message === null || message === void 0 ? void 0 : message.metaArrays.find(function (metaArray) {
+        return metaArray.key === 'KEY_VOICE_MESSAGE_DURATION';
+      })) === null || _a === void 0 ? void 0 : _a.value[0];
+      return duration_1 && parseInt(duration_1);
     }
     return 1;
   }, [message === null || message === void 0 ? void 0 : message.metaArrays]);
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: `sendbird-voice-message-item-body ${className} ${usingReaction ? 'is-reactions-contained' : ''}`
+    className: "sendbird-voice-message-item-body ".concat(className, " ").concat(usingReaction ? 'is-reactions-contained' : '')
   }, /*#__PURE__*/React__default["default"].createElement(ui_ProgressBar.ProgressBar, {
     className: "sendbird-voice-message-item-body__progress-bar",
     maxSize: duration || progresBarMaxSize,
@@ -99,7 +105,7 @@ const VoiceMessageItemBody = _ref => {
     fillColor: ui_Icon.IconColors.PRIMARY_2
   })), playingStatus === VoicePlayer_context.VOICE_PLAYER_STATUS.PLAYING && /*#__PURE__*/React__default["default"].createElement("div", {
     className: "sendbird-voice-message-item-body__status-button__button",
-    onClick: () => {
+    onClick: function () {
       pause();
     }
   }, /*#__PURE__*/React__default["default"].createElement("div", {

package/cjs/ui/VoiceMessageItemBody.js.map

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