@sendbird/uikit-react 3.3.7 → 3.4.0-rc.0

package/ChannelSettings/components/ChannelProfile.js

@@ -1,30 +1,30 @@
 import React__default, { useContext, useState } from 'react';
-import { a as LocalizationContext } from '../../LocalizationContext-4c2faa9a.js';
+import { a as LocalizationContext } from '../../LocalizationContext-539093a9.js';
 import useSendbirdStateContext from '../../useSendbirdStateContext.js';
 import { useChannelSettingsContext } from '../context.js';
 import ChannelAvatar from '../../ui/ChannelAvatar.js';
 import TextButton from '../../ui/TextButton.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-e2994193.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-4a977e7d.js';
 import EditDetails from './EditDetailsModal.js';
-import '../../stringSet-c2443946.js';
-import '../../index-a53d78b6.js';
+import '../../stringSet-f9763488.js';
+import '../../index-999fdb64.js';
 import '../../withSendbird.js';
-import '../../_rollupPluginBabelHelpers-b45d3824.js';
-import '../../UserProfileContext-e5d90f15.js';
+import '../../_rollupPluginBabelHelpers-09618dc3.js';
+import '../../UserProfileContext-bd8525b7.js';
 import 'prop-types';
-import '../../uuid-7a5e68ed.js';
+import '../../uuid-6ca64623.js';
 import '../../ui/Avatar.js';
-import '../../tslib.es6-13412863.js';
+import '../../tslib.es6-fc4a2658.js';
 import '../../ui/ImageRenderer.js';
 import '../../ui/Icon.js';
-import '../../utils-87d19647.js';
-import '../../color-1b42e49d.js';
+import '../../utils-2570c397.js';
+import '../../color-f2370c85.js';
 import '../../ui/Modal.js';
 import 'react-dom';
-import '../../index-fd5a03a3.js';
+import '../../index-b8e990b4.js';
 import '../../ui/Button.js';
 import '../../ui/IconButton.js';
-import '../../MediaQueryContext-97a21b7e.js';
+import '../../MediaQueryContext-79c8ad08.js';
 import '../../ui/Input.js';
 
 var ChannelProfile = function () {

package/ChannelSettings/components/ChannelSettingsUI.js

@@ -1,9 +1,9 @@
 import React__default, { useContext, useState } from 'react';
 import useSendbirdStateContext from '../../useSendbirdStateContext.js';
 import { useChannelSettingsContext } from '../context.js';
-import { P as PlaceHolder, a as PlaceHolderTypes } from '../../index-aecdd02c.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-e2994193.js';
-import { a as LocalizationContext } from '../../LocalizationContext-4c2faa9a.js';
+import { P as PlaceHolder, a as PlaceHolderTypes } from '../../index-eefaf935.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-4a977e7d.js';
+import { a as LocalizationContext } from '../../LocalizationContext-539093a9.js';
 import Icon, { IconTypes, IconColors } from '../../ui/Icon.js';
 import IconButton from '../../ui/IconButton.js';
 import ChannelProfile from './ChannelProfile.js';
@@ -11,45 +11,45 @@ import AdminPannel from './ModerationPanel.js';
 import LeaveChannel from './LeaveChannel.js';
 import UserPanel from './UserPanel.js';
 import '../../withSendbird.js';
-import '../../_rollupPluginBabelHelpers-b45d3824.js';
-import '../../UserProfileContext-e5d90f15.js';
+import '../../_rollupPluginBabelHelpers-09618dc3.js';
+import '../../UserProfileContext-bd8525b7.js';
 import 'prop-types';
-import '../../uuid-7a5e68ed.js';
-import '../../tslib.es6-13412863.js';
+import '../../uuid-6ca64623.js';
+import '../../tslib.es6-fc4a2658.js';
 import '../../ui/Loader.js';
-import '../../stringSet-c2443946.js';
-import '../../index-a53d78b6.js';
+import '../../stringSet-f9763488.js';
+import '../../index-999fdb64.js';
 import '../../ui/ChannelAvatar.js';
 import '../../ui/Avatar.js';
 import '../../ui/ImageRenderer.js';
-import '../../utils-87d19647.js';
+import '../../utils-2570c397.js';
 import '../../ui/TextButton.js';
-import '../../color-1b42e49d.js';
+import '../../color-f2370c85.js';
 import './EditDetailsModal.js';
 import '../../ui/Modal.js';
 import 'react-dom';
-import '../../index-fd5a03a3.js';
+import '../../index-b8e990b4.js';
 import '../../ui/Button.js';
-import '../../MediaQueryContext-97a21b7e.js';
+import '../../MediaQueryContext-79c8ad08.js';
 import '../../ui/Input.js';
 import '../../ui/Accordion.js';
 import '../../ui/AccordionGroup.js';
-import '../../context-2c35a852.js';
-import '../../utils-87dce5dd.js';
+import '../../context-95839b09.js';
+import '../../utils-c1d219fa.js';
 import '../../ui/Badge.js';
 import '../../ui/ContextMenu.js';
 import '../../ui/SortByRow.js';
-import '../../index-425e5f17.js';
+import '../../index-bbab31f0.js';
 import '../../utils/message/getOutgoingMessageState.js';
 import './UserListItem.js';
 import '../../ui/MutedAvatarOverlay.js';
 import '../../ui/UserProfile.js';
 import '../../sendbirdSelectors.js';
-import '../../topics-0ba43ee8.js';
+import '../../topics-1ec669f0.js';
 import '../../ui/UserListItem.js';
 import '../../ui/Checkbox.js';
 import '@sendbird/chat/groupChannel';
-import '../../MemberList-6483a7db.js';
+import '../../MemberList-1350e670.js';
 
 var ChannelSettingsUI = function (props) {
   var _a, _b;

package/ChannelSettings/components/EditDetailsModal.js

@@ -1,30 +1,30 @@
 import React__default, { useRef, useState, useContext } from 'react';
 import { useChannelSettingsContext } from '../context.js';
-import { a as LocalizationContext } from '../../LocalizationContext-4c2faa9a.js';
+import { a as LocalizationContext } from '../../LocalizationContext-539093a9.js';
 import useSendbirdStateContext from '../../useSendbirdStateContext.js';
 import Modal from '../../ui/Modal.js';
 import Input, { InputLabel } from '../../ui/Input.js';
 import Avatar from '../../ui/Avatar.js';
 import { ButtonTypes } from '../../ui/Button.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-e2994193.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-4a977e7d.js';
 import TextButton from '../../ui/TextButton.js';
 import ChannelAvatar from '../../ui/ChannelAvatar.js';
-import { u as uuidv4 } from '../../uuid-7a5e68ed.js';
-import '../../UserProfileContext-e5d90f15.js';
+import { u as uuidv4 } from '../../uuid-6ca64623.js';
+import '../../UserProfileContext-bd8525b7.js';
 import 'prop-types';
 import '../../withSendbird.js';
-import '../../_rollupPluginBabelHelpers-b45d3824.js';
-import '../../stringSet-c2443946.js';
-import '../../index-a53d78b6.js';
+import '../../_rollupPluginBabelHelpers-09618dc3.js';
+import '../../stringSet-f9763488.js';
+import '../../index-999fdb64.js';
 import 'react-dom';
-import '../../index-fd5a03a3.js';
+import '../../index-b8e990b4.js';
 import '../../ui/Icon.js';
 import '../../ui/IconButton.js';
-import '../../tslib.es6-13412863.js';
-import '../../MediaQueryContext-97a21b7e.js';
+import '../../tslib.es6-fc4a2658.js';
+import '../../MediaQueryContext-79c8ad08.js';
 import '../../ui/ImageRenderer.js';
-import '../../color-1b42e49d.js';
-import '../../utils-87d19647.js';
+import '../../color-f2370c85.js';
+import '../../utils-2570c397.js';
 
 var EditDetails = function (props) {
   var _a, _b, _c;

package/ChannelSettings/components/LeaveChannel.js

@@ -1,26 +1,26 @@
 import React__default from 'react';
 import useSendbirdStateContext from '../../useSendbirdStateContext.js';
 import { useChannelSettingsContext } from '../context.js';
-import { n as noop } from '../../utils-87dce5dd.js';
+import { n as noop } from '../../utils-c1d219fa.js';
 import Modal from '../../ui/Modal.js';
-import { u as useLocalization } from '../../LocalizationContext-4c2faa9a.js';
-import { u as useMediaQueryContext } from '../../MediaQueryContext-97a21b7e.js';
+import { u as useLocalization } from '../../LocalizationContext-539093a9.js';
+import { u as useMediaQueryContext } from '../../MediaQueryContext-79c8ad08.js';
 import TextButton from '../../ui/TextButton.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-e2994193.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-4a977e7d.js';
 import '../../withSendbird.js';
-import '../../_rollupPluginBabelHelpers-b45d3824.js';
-import '../../UserProfileContext-e5d90f15.js';
+import '../../_rollupPluginBabelHelpers-09618dc3.js';
+import '../../UserProfileContext-bd8525b7.js';
 import 'prop-types';
-import '../../uuid-7a5e68ed.js';
+import '../../uuid-6ca64623.js';
 import 'react-dom';
-import '../../index-fd5a03a3.js';
+import '../../index-b8e990b4.js';
 import '../../ui/Button.js';
-import '../../tslib.es6-13412863.js';
+import '../../tslib.es6-fc4a2658.js';
 import '../../ui/Icon.js';
 import '../../ui/IconButton.js';
-import '../../stringSet-c2443946.js';
-import '../../index-a53d78b6.js';
-import '../../color-1b42e49d.js';
+import '../../stringSet-f9763488.js';
+import '../../index-999fdb64.js';
+import '../../color-f2370c85.js';
 
 var LeaveChannel = function (props) {
   var _a, _b;

package/ChannelSettings/components/ModerationPanel.js

@@ -1,43 +1,43 @@
 import React__default, { useState, useContext, useEffect, useCallback } from 'react';
-import { a as LocalizationContext, u as useLocalization } from '../../LocalizationContext-4c2faa9a.js';
+import { a as LocalizationContext, u as useLocalization } from '../../LocalizationContext-539093a9.js';
 import Accordion, { AccordionGroup } from '../../ui/Accordion.js';
-import { L as Label, b as LabelColors, a as LabelTypography } from '../../index-e2994193.js';
+import { L as Label, b as LabelColors, a as LabelTypography } from '../../index-4a977e7d.js';
 import Icon, { IconTypes, IconColors } from '../../ui/Icon.js';
 import Badge from '../../ui/Badge.js';
 import Button, { ButtonTypes, ButtonSizes } from '../../ui/Button.js';
 import IconButton from '../../ui/IconButton.js';
 import ContextMenu, { MenuItems, MenuItem } from '../../ui/ContextMenu.js';
 import UserListItem$1 from './UserListItem.js';
-import { a as __spreadArray, _ as __assign } from '../../tslib.es6-13412863.js';
+import { a as __spreadArray, _ as __assign } from '../../tslib.es6-fc4a2658.js';
 import Modal from '../../ui/Modal.js';
 import UserListItem from '../../ui/UserListItem.js';
 import { useChannelSettingsContext } from '../context.js';
 import useSendbirdStateContext from '../../useSendbirdStateContext.js';
 import { OperatorFilter } from '@sendbird/chat/groupChannel';
-import { M as MemberList } from '../../MemberList-6483a7db.js';
-import { n as noop } from '../../utils-87dce5dd.js';
-import '../../stringSet-c2443946.js';
-import '../../index-a53d78b6.js';
+import { M as MemberList } from '../../MemberList-1350e670.js';
+import { n as noop } from '../../utils-c1d219fa.js';
+import '../../stringSet-f9763488.js';
+import '../../index-999fdb64.js';
 import '../../ui/AccordionGroup.js';
-import '../../context-2c35a852.js';
+import '../../context-95839b09.js';
 import 'prop-types';
 import 'react-dom';
 import '../../ui/SortByRow.js';
-import '../../uuid-7a5e68ed.js';
-import '../../index-425e5f17.js';
+import '../../uuid-6ca64623.js';
+import '../../index-bbab31f0.js';
 import '../../utils/message/getOutgoingMessageState.js';
-import '../../UserProfileContext-e5d90f15.js';
+import '../../UserProfileContext-bd8525b7.js';
 import '../../ui/Avatar.js';
 import '../../ui/ImageRenderer.js';
 import '../../ui/MutedAvatarOverlay.js';
 import '../../ui/UserProfile.js';
 import '../../sendbirdSelectors.js';
-import '../../topics-0ba43ee8.js';
-import '../../index-fd5a03a3.js';
-import '../../MediaQueryContext-97a21b7e.js';
+import '../../topics-1ec669f0.js';
+import '../../index-b8e990b4.js';
+import '../../MediaQueryContext-79c8ad08.js';
 import '../../ui/Checkbox.js';
 import '../../withSendbird.js';
-import '../../_rollupPluginBabelHelpers-b45d3824.js';
+import '../../_rollupPluginBabelHelpers-09618dc3.js';
 
 function OperatorsModal(_a) {
   var _b;

package/ChannelSettings/components/UserListItem.js

@@ -1,28 +1,28 @@
-import { a as __spreadArray } from '../../tslib.es6-13412863.js';
+import { a as __spreadArray } from '../../tslib.es6-fc4a2658.js';
 import React__default, { useRef, useContext } from 'react';
-import { a as LocalizationContext } from '../../LocalizationContext-4c2faa9a.js';
-import { a as UserProfileContext } from '../../UserProfileContext-e5d90f15.js';
+import { a as LocalizationContext } from '../../LocalizationContext-539093a9.js';
+import { a as UserProfileContext } from '../../UserProfileContext-bd8525b7.js';
 import Avatar from '../../ui/Avatar.js';
 import MutedAvatarOverlay from '../../ui/MutedAvatarOverlay.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-e2994193.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-4a977e7d.js';
 import UserProfile from '../../ui/UserProfile.js';
 import ContextMenu, { MenuItems } from '../../ui/ContextMenu.js';
-import '../../stringSet-c2443946.js';
-import '../../index-a53d78b6.js';
+import '../../stringSet-f9763488.js';
+import '../../index-999fdb64.js';
 import 'prop-types';
 import '../../ui/ImageRenderer.js';
 import '../../ui/Icon.js';
-import '../../uuid-7a5e68ed.js';
+import '../../uuid-6ca64623.js';
 import '../../sendbirdSelectors.js';
-import '../../topics-0ba43ee8.js';
-import '../../utils-87dce5dd.js';
+import '../../topics-1ec669f0.js';
+import '../../utils-c1d219fa.js';
 import '../../ui/Button.js';
 import '../../useSendbirdStateContext.js';
 import '../../withSendbird.js';
-import '../../_rollupPluginBabelHelpers-b45d3824.js';
+import '../../_rollupPluginBabelHelpers-09618dc3.js';
 import 'react-dom';
 import '../../ui/SortByRow.js';
-import '../../index-425e5f17.js';
+import '../../index-bbab31f0.js';
 import '../../utils/message/getOutgoingMessageState.js';
 
 var COMPONENT_NAME = 'sendbird-user-list-item--small';

package/ChannelSettings/components/UserPanel.js

@@ -1,37 +1,37 @@
 import React__default, { useContext, useState } from 'react';
-import { a as LocalizationContext } from '../../LocalizationContext-4c2faa9a.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-e2994193.js';
+import { a as LocalizationContext } from '../../LocalizationContext-539093a9.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../../index-4a977e7d.js';
 import Icon, { IconTypes, IconColors } from '../../ui/Icon.js';
 import Badge from '../../ui/Badge.js';
-import { M as MemberList } from '../../MemberList-6483a7db.js';
+import { M as MemberList } from '../../MemberList-1350e670.js';
 import { useChannelSettingsContext } from '../context.js';
-import '../../stringSet-c2443946.js';
-import '../../index-a53d78b6.js';
+import '../../stringSet-f9763488.js';
+import '../../index-999fdb64.js';
 import 'prop-types';
-import '../../tslib.es6-13412863.js';
+import '../../tslib.es6-fc4a2658.js';
 import '../../ui/Button.js';
 import '../../ui/IconButton.js';
 import '../../ui/ContextMenu.js';
 import 'react-dom';
 import '../../ui/SortByRow.js';
-import '../../uuid-7a5e68ed.js';
-import '../../index-425e5f17.js';
+import '../../uuid-6ca64623.js';
+import '../../index-bbab31f0.js';
 import '../../utils/message/getOutgoingMessageState.js';
 import './UserListItem.js';
-import '../../UserProfileContext-e5d90f15.js';
+import '../../UserProfileContext-bd8525b7.js';
 import '../../ui/Avatar.js';
 import '../../ui/ImageRenderer.js';
 import '../../ui/MutedAvatarOverlay.js';
 import '../../ui/UserProfile.js';
 import '../../sendbirdSelectors.js';
-import '../../topics-0ba43ee8.js';
-import '../../utils-87dce5dd.js';
+import '../../topics-1ec669f0.js';
+import '../../utils-c1d219fa.js';
 import '../../useSendbirdStateContext.js';
 import '../../withSendbird.js';
-import '../../_rollupPluginBabelHelpers-b45d3824.js';
+import '../../_rollupPluginBabelHelpers-09618dc3.js';
 import '../../ui/Modal.js';
-import '../../index-fd5a03a3.js';
-import '../../MediaQueryContext-97a21b7e.js';
+import '../../index-b8e990b4.js';
+import '../../MediaQueryContext-79c8ad08.js';
 import '../../ui/UserListItem.js';
 import '../../ui/Checkbox.js';
 
@@ -47,7 +47,9 @@ var UserPanel = function () {
       setShowAccordion = _a[1];
 
   var channel = useChannelSettingsContext().channel;
-  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "sendbird-channel-settings__user-panel"
+  }, /*#__PURE__*/React__default.createElement("div", {
     className: ['sendbird-channel-settings__panel-item', 'sendbird-channel-settings__members'].join(' '),
     role: "switch",
     "aria-checked": showAccordion,
@@ -68,6 +70,7 @@ var UserPanel = function () {
     type: LabelTypography.SUBTITLE_1,
     color: LabelColors.ONBACKGROUND_1
   }, stringSet.CHANNEL_SETTING__MEMBERS__TITLE, /*#__PURE__*/React__default.createElement(Badge, {
+    className: "sendbird-channel-settings__badge",
     count: kFormatter(channel === null || channel === void 0 ? void 0 : channel.memberCount)
   })), /*#__PURE__*/React__default.createElement(Icon, {
     className: ['sendbird-channel-settings__panel-icon-right', 'sendbird-channel-settings__panel-icon--chevron', showAccordion ? 'sendbird-channel-settings__panel-icon--open' : ''].join(' '),

package/ChannelSettings/components/UserPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserPanel.js","sources":["../../../src/smart-components/ChannelSettings/components/UserPanel/index.tsx"],"sourcesContent":["import React, { useContext, useState } from 'react';\n\nimport { LocalizationContext } from '../../../../lib/LocalizationContext';\nimport\n  Label, {\n  LabelTypography,\n  LabelColors,\n} from '../../../../ui/Label';\nimport Icon, { IconTypes, IconColors } from '../../../../ui/Icon';\nimport Badge from '../../../../ui/Badge';\n\nimport MemberList from '../ModerationPanel/MemberList';\nimport { useChannelSettingsContext } from '../../context/ChannelSettingsProvider';\n\nconst kFormatter = (num: number): string|number => {\n  return Math.abs(num) > 999\n    ? `${(Math.abs(num)/1000).toFixed(1)}K`\n    : num;\n}\n\nconst UserPanel: React.FC = () => {\n  const { stringSet } = useContext(LocalizationContext);\n  const [showAccordion, setShowAccordion] = useState(false);\n  const { channel } = useChannelSettingsContext();\n  return (\n    <>\n      <div\n        className={[\n          'sendbird-channel-settings__panel-item',\n          'sendbird-channel-settings__members',\n        ].join(' ')}\n        role=\"switch\"\n        aria-checked={showAccordion}\n        onKeyDown={() => setShowAccordion(!showAccordion)}\n        onClick={() => setShowAccordion(!showAccordion)}\n        tabIndex={0}\n      >\n        <Icon\n          className=\"sendbird-channel-settings__panel-icon-left\"\n          type={IconTypes.MEMBERS}\n          fillColor={IconColors.PRIMARY}\n          height=\"24px\"\n          width=\"24px\"\n        />\n        <Label\n          type={LabelTypography.SUBTITLE_1}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {stringSet.CHANNEL_SETTING__MEMBERS__TITLE}\n          <Badge count={kFormatter(channel?.memberCount)} />\n        </Label>\n        <Icon\n          className={[\n            'sendbird-channel-settings__panel-icon-right',\n            'sendbird-channel-settings__panel-icon--chevron',\n            (showAccordion ? 'sendbird-channel-settings__panel-icon--open' : ''),\n          ].join(' ')}\n          type={IconTypes.CHEVRON_RIGHT}\n          height=\"24px\"\n          width=\"24px\"\n        />\n      </div>\n      {\n        showAccordion && (\n          <MemberList />\n        )\n      }\n    </>\n  );\n}\n\nexport default UserPanel;\n"],"names":["kFormatter","num","Math","abs","concat","toFixed","UserPanel","stringSet","useContext","LocalizationContext","_a","useState","showAccordion","setShowAccordion","channel","useChannelSettingsContext","React","join","IconTypes","MEMBERS","IconColors","PRIMARY","LabelTypography","SUBTITLE_1","LabelColors","ONBACKGROUND_1","CHANNEL_SETTING__MEMBERS__TITLE","memberCount","CHEVRON_RIGHT"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA,IAAMA,UAAU,GAAG,UAACC,GAAD,EAAY;AAC7B,EAAA,OAAOC,IAAI,CAACC,GAAL,CAASF,GAAT,CAAA,GAAgB,GAAhB,GACH,EAAGG,CAAAA,MAAH,CAAG,CAACF,IAAI,CAACC,GAAL,CAASF,GAAT,CAAA,GAAc,IAAf,EAAqBI,OAArB,CAA6B,CAA7B,CAAH,EAAqC,GAArC,CADG,GAEHJ,GAFJ,CAAA;AAGD,CAJD,CAAA;;AAMMK,IAAAA,SAAS,GAAa,YAAA;AAClB,EAAA,IAAAC,SAAS,GAAKC,UAAU,CAACC,mBAAD,CAAV,UAAd,CAAA;;AACF,EAAA,IAAAC,EAAA,GAAoCC,QAAQ,CAAC,KAAD,CAA5C;AAAA,MAACC,aAAa,GAAAF,EAAA,CAAA,CAAA,CAAd;AAAA,MAAgBG,gBAAgB,GAAAH,EAAA,CAAA,CAAA,CAAhC,CAAA;;AACE,EAAA,IAAAI,OAAO,GAAKC,yBAAyB,EAAA,QAArC,CAAA;AACR,EAAA,oBACEC,cACE,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,eAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;IACE,SAAS,EAAE,CACT,uCADS,EAET,oCAFS,CAGTC,CAAAA,IAHS,CAGJ,GAHI,CADb;AAKE,IAAA,IAAI,EAAC,QALP;AAME,IAAA,cAAA,EAAcL,aANhB;AAOE,IAAA,SAAS,EAAE,YAAA;AAAM,MAAA,OAAAC,gBAAgB,CAAC,CAACD,aAAF,CAAhB,CAAA;KAPnB;AAQE,IAAA,OAAO,EAAE,YAAM;AAAA,MAAA,OAAAC,gBAAgB,CAAC,CAACD,aAAF,CAAhB,CAAA;KARjB;AASE,IAAA,QAAQ,EAAE,CAAA;AATZ,GAAA,eAWEI,6BAAC,IAAD,EAAA;AACE,IAAA,SAAS,EAAC,4CADZ;IAEE,IAAI,EAAEE,SAAS,CAACC,OAFlB;IAGE,SAAS,EAAEC,UAAU,CAACC,OAHxB;AAIE,IAAA,MAAM,EAAC,MAJT;AAKE,IAAA,KAAK,EAAC,MAAA;GAhBV,CAAA,eAkBEL,6BAAC,KAAD,EAAA;IACE,IAAI,EAAEM,eAAe,CAACC,UADxB;IAEE,KAAK,EAAEC,WAAW,CAACC,cAAAA;AAFrB,GAAA,EAIGlB,SAAS,CAACmB,+BAJb,eAKEV,6BAAC,KAAD,EAAA;AAAO,IAAA,KAAK,EAAEhB,UAAU,CAACc,OAAO,KAAP,IAAA,IAAAA,OAAO,WAAP,SAAA,GAAAA,OAAO,CAAEa,WAAV,CAAA;GAL1B,CAAA,CAlBF,eAyBEX,cAAA,CAAA,aAAA,CAAC,IAAD,EAAA;AACE,IAAA,SAAS,EAAE,CACT,6CADS,EAET,gDAFS,EAGRJ,aAAa,GAAG,6CAAH,GAAmD,EAHxD,CAAA,CAITK,IAJS,CAIJ,GAJI,CADb;IAME,IAAI,EAAEC,SAAS,CAACU,aANlB;AAOE,IAAA,MAAM,EAAC,MAPT;AAQE,IAAA,KAAK,EAAC,MAAA;AARR,GAAA,CAzBF,CADF,EAsCIhB,aAAa,iBACXI,cAAC,CAAA,aAAA,CAAA,UAAD,OAvCN,CADF,CAAA;AA6CD;;;;"}
+{"version":3,"file":"UserPanel.js","sources":["../../../src/smart-components/ChannelSettings/components/UserPanel/index.tsx"],"sourcesContent":["import './user-panel.scss';\n\nimport React, { useContext, useState } from 'react';\n\nimport { LocalizationContext } from '../../../../lib/LocalizationContext';\nimport\n  Label, {\n  LabelTypography,\n  LabelColors,\n} from '../../../../ui/Label';\nimport Icon, { IconTypes, IconColors } from '../../../../ui/Icon';\nimport Badge from '../../../../ui/Badge';\n\nimport MemberList from '../ModerationPanel/MemberList';\nimport { useChannelSettingsContext } from '../../context/ChannelSettingsProvider';\n\nconst kFormatter = (num: number): string|number => {\n  return Math.abs(num) > 999\n    ? `${(Math.abs(num)/1000).toFixed(1)}K`\n    : num;\n}\n\nconst UserPanel: React.FC = () => {\n  const { stringSet } = useContext(LocalizationContext);\n  const [showAccordion, setShowAccordion] = useState(false);\n  const { channel } = useChannelSettingsContext();\n  return (\n    <div className='sendbird-channel-settings__user-panel'>\n      <div\n        className={[\n          'sendbird-channel-settings__panel-item',\n          'sendbird-channel-settings__members',\n        ].join(' ')}\n        role=\"switch\"\n        aria-checked={showAccordion}\n        onKeyDown={() => setShowAccordion(!showAccordion)}\n        onClick={() => setShowAccordion(!showAccordion)}\n        tabIndex={0}\n      >\n        <Icon\n          className=\"sendbird-channel-settings__panel-icon-left\"\n          type={IconTypes.MEMBERS}\n          fillColor={IconColors.PRIMARY}\n          height=\"24px\"\n          width=\"24px\"\n        />\n        <Label\n          type={LabelTypography.SUBTITLE_1}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {stringSet.CHANNEL_SETTING__MEMBERS__TITLE}\n          <Badge\n            className={\"sendbird-channel-settings__badge\"}\n            count={kFormatter(channel?.memberCount)}\n          />\n        </Label>\n        <Icon\n          className={[\n            'sendbird-channel-settings__panel-icon-right',\n            'sendbird-channel-settings__panel-icon--chevron',\n            (showAccordion ? 'sendbird-channel-settings__panel-icon--open' : ''),\n          ].join(' ')}\n          type={IconTypes.CHEVRON_RIGHT}\n          height=\"24px\"\n          width=\"24px\"\n        />\n      </div>\n      {\n        showAccordion && (\n          <MemberList />\n        )\n      }\n    </div>\n  );\n}\n\nexport default UserPanel;\n"],"names":["kFormatter","num","Math","abs","concat","toFixed","UserPanel","stringSet","useContext","LocalizationContext","_a","useState","showAccordion","setShowAccordion","channel","useChannelSettingsContext","React","join","IconTypes","MEMBERS","IconColors","PRIMARY","LabelTypography","SUBTITLE_1","LabelColors","ONBACKGROUND_1","CHANNEL_SETTING__MEMBERS__TITLE","memberCount","CHEVRON_RIGHT"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBA,IAAMA,UAAU,GAAG,UAACC,GAAD,EAAY;AAC7B,EAAA,OAAOC,IAAI,CAACC,GAAL,CAASF,GAAT,CAAA,GAAgB,GAAhB,GACH,EAAGG,CAAAA,MAAH,CAAG,CAACF,IAAI,CAACC,GAAL,CAASF,GAAT,CAAA,GAAc,IAAf,EAAqBI,OAArB,CAA6B,CAA7B,CAAH,EAAqC,GAArC,CADG,GAEHJ,GAFJ,CAAA;AAGD,CAJD,CAAA;;AAMMK,IAAAA,SAAS,GAAa,YAAA;AAClB,EAAA,IAAAC,SAAS,GAAKC,UAAU,CAACC,mBAAD,CAAV,UAAd,CAAA;;AACF,EAAA,IAAAC,EAAA,GAAoCC,QAAQ,CAAC,KAAD,CAA5C;AAAA,MAACC,aAAa,GAAAF,EAAA,CAAA,CAAA,CAAd;AAAA,MAAgBG,gBAAgB,GAAAH,EAAA,CAAA,CAAA,CAAhC,CAAA;;AACE,EAAA,IAAAI,OAAO,GAAKC,yBAAyB,EAAA,QAArC,CAAA;EACR,oBACEC,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,uCAAA;GACb,eAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;IACE,SAAS,EAAE,CACT,uCADS,EAET,oCAFS,CAGTC,CAAAA,IAHS,CAGJ,GAHI,CADb;AAKE,IAAA,IAAI,EAAC,QALP;AAME,IAAA,cAAA,EAAcL,aANhB;AAOE,IAAA,SAAS,EAAE,YAAA;AAAM,MAAA,OAAAC,gBAAgB,CAAC,CAACD,aAAF,CAAhB,CAAA;KAPnB;AAQE,IAAA,OAAO,EAAE,YAAM;AAAA,MAAA,OAAAC,gBAAgB,CAAC,CAACD,aAAF,CAAhB,CAAA;KARjB;AASE,IAAA,QAAQ,EAAE,CAAA;AATZ,GAAA,eAWEI,6BAAC,IAAD,EAAA;AACE,IAAA,SAAS,EAAC,4CADZ;IAEE,IAAI,EAAEE,SAAS,CAACC,OAFlB;IAGE,SAAS,EAAEC,UAAU,CAACC,OAHxB;AAIE,IAAA,MAAM,EAAC,MAJT;AAKE,IAAA,KAAK,EAAC,MAAA;GAhBV,CAAA,eAkBEL,6BAAC,KAAD,EAAA;IACE,IAAI,EAAEM,eAAe,CAACC,UADxB;IAEE,KAAK,EAAEC,WAAW,CAACC,cAAAA;AAFrB,GAAA,EAIGlB,SAAS,CAACmB,+BAJb,eAKEV,6BAAC,KAAD,EAAA;AACE,IAAA,SAAS,EAAE,kCADb;AAEE,IAAA,KAAK,EAAEhB,UAAU,CAACc,OAAO,SAAP,IAAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAAA,OAAO,CAAEa,WAAV,CAAA;GAPrB,CAAA,CAlBF,eA4BEX,cAAA,CAAA,aAAA,CAAC,IAAD,EAAA;AACE,IAAA,SAAS,EAAE,CACT,6CADS,EAET,gDAFS,EAGRJ,aAAa,GAAG,6CAAH,GAAmD,EAHxD,CAAA,CAITK,IAJS,CAIJ,GAJI,CADb;IAME,IAAI,EAAEC,SAAS,CAACU,aANlB;AAOE,IAAA,MAAM,EAAC,MAPT;AAQE,IAAA,KAAK,EAAC,MAAA;AARR,GAAA,CA5BF,CADF,EAyCIhB,aAAa,iBACXI,cAAC,CAAA,aAAA,CAAA,UAAD,OA1CN,CADF,CAAA;AAgDD;;;;"}

package/ChannelSettings/context.js

@@ -1,9 +1,9 @@
 import React__default, { useState, useEffect } from 'react';
 import useSendbirdStateContext from '../useSendbirdStateContext.js';
-import { U as UserProfileProvider } from '../UserProfileContext-e5d90f15.js';
-import { u as uuidv4 } from '../uuid-7a5e68ed.js';
+import { U as UserProfileProvider } from '../UserProfileContext-bd8525b7.js';
+import { u as uuidv4 } from '../uuid-6ca64623.js';
 import '../withSendbird.js';
-import '../_rollupPluginBabelHelpers-b45d3824.js';
+import '../_rollupPluginBabelHelpers-09618dc3.js';
 import 'prop-types';
 
 var ChannelSettingsContext = /*#__PURE__*/React__default.createContext(undefined);

package/ChannelSettings.js

@@ -3,52 +3,52 @@ import ChannelSettingsUI from './ChannelSettings/components/ChannelSettingsUI.js
 import { ChannelSettingsProvider } from './ChannelSettings/context.js';
 import './useSendbirdStateContext.js';
 import './withSendbird.js';
-import './_rollupPluginBabelHelpers-b45d3824.js';
-import './index-aecdd02c.js';
-import './tslib.es6-13412863.js';
-import './LocalizationContext-4c2faa9a.js';
-import './stringSet-c2443946.js';
-import './index-a53d78b6.js';
+import './_rollupPluginBabelHelpers-09618dc3.js';
+import './index-eefaf935.js';
+import './tslib.es6-fc4a2658.js';
+import './LocalizationContext-539093a9.js';
+import './stringSet-f9763488.js';
+import './index-999fdb64.js';
 import './ui/Icon.js';
 import 'prop-types';
-import './index-e2994193.js';
+import './index-4a977e7d.js';
 import './ui/Loader.js';
 import './ui/IconButton.js';
 import './ChannelSettings/components/ChannelProfile.js';
 import './ui/ChannelAvatar.js';
 import './ui/Avatar.js';
 import './ui/ImageRenderer.js';
-import './uuid-7a5e68ed.js';
-import './utils-87d19647.js';
+import './uuid-6ca64623.js';
+import './utils-2570c397.js';
 import './ui/TextButton.js';
-import './color-1b42e49d.js';
+import './color-f2370c85.js';
 import './ChannelSettings/components/EditDetailsModal.js';
 import './ui/Modal.js';
 import 'react-dom';
-import './index-fd5a03a3.js';
+import './index-b8e990b4.js';
 import './ui/Button.js';
-import './MediaQueryContext-97a21b7e.js';
+import './MediaQueryContext-79c8ad08.js';
 import './ui/Input.js';
 import './ChannelSettings/components/ModerationPanel.js';
 import './ui/Accordion.js';
 import './ui/AccordionGroup.js';
-import './context-2c35a852.js';
-import './utils-87dce5dd.js';
+import './context-95839b09.js';
+import './utils-c1d219fa.js';
 import './ui/Badge.js';
 import './ui/ContextMenu.js';
 import './ui/SortByRow.js';
-import './index-425e5f17.js';
+import './index-bbab31f0.js';
 import './utils/message/getOutgoingMessageState.js';
 import './ChannelSettings/components/UserListItem.js';
-import './UserProfileContext-e5d90f15.js';
+import './UserProfileContext-bd8525b7.js';
 import './ui/MutedAvatarOverlay.js';
 import './ui/UserProfile.js';
 import './sendbirdSelectors.js';
-import './topics-0ba43ee8.js';
+import './topics-1ec669f0.js';
 import './ui/UserListItem.js';
 import './ui/Checkbox.js';
 import '@sendbird/chat/groupChannel';
-import './MemberList-6483a7db.js';
+import './MemberList-1350e670.js';
 import './ChannelSettings/components/LeaveChannel.js';
 import './ChannelSettings/components/UserPanel.js';
 

package/CreateChannel/components/CreateChannelUI.js

@@ -1,37 +1,37 @@
 import React__default from 'react';
-import { u as useCreateChannelContext } from '../../CreateChannelProvider-ed2e3cb4.js';
+import { u as useCreateChannelContext } from '../../CreateChannelProvider-946fb371.js';
 import InviteUsers from './InviteUsers.js';
 import SelectChannelType from './SelectChannelType.js';
 import '../../sendbirdSelectors.js';
-import '../../topics-0ba43ee8.js';
-import '../../utils-87dce5dd.js';
+import '../../topics-1ec669f0.js';
+import '../../utils-c1d219fa.js';
 import '../../useSendbirdStateContext.js';
 import '../../withSendbird.js';
-import '../../_rollupPluginBabelHelpers-b45d3824.js';
-import '../../tslib.es6-13412863.js';
-import '../../LocalizationContext-4c2faa9a.js';
-import '../../stringSet-c2443946.js';
-import '../../index-a53d78b6.js';
+import '../../_rollupPluginBabelHelpers-09618dc3.js';
+import '../../tslib.es6-fc4a2658.js';
+import '../../LocalizationContext-539093a9.js';
+import '../../stringSet-f9763488.js';
+import '../../index-999fdb64.js';
 import '../../ui/Modal.js';
 import 'react-dom';
-import '../../index-fd5a03a3.js';
+import '../../index-b8e990b4.js';
 import '../../ui/Button.js';
-import '../../index-e2994193.js';
+import '../../index-4a977e7d.js';
 import 'prop-types';
 import '../../ui/Icon.js';
 import '../../ui/IconButton.js';
-import '../../MediaQueryContext-97a21b7e.js';
+import '../../MediaQueryContext-79c8ad08.js';
 import '../../ui/UserListItem.js';
-import '../../UserProfileContext-e5d90f15.js';
+import '../../UserProfileContext-bd8525b7.js';
 import '../../ui/Avatar.js';
 import '../../ui/ImageRenderer.js';
-import '../../uuid-7a5e68ed.js';
+import '../../uuid-6ca64623.js';
 import '../../ui/MutedAvatarOverlay.js';
 import '../../ui/Checkbox.js';
 import '../../ui/UserProfile.js';
 import '../../ui/ContextMenu.js';
 import '../../ui/SortByRow.js';
-import '../../index-425e5f17.js';
+import '../../index-bbab31f0.js';
 import '../../utils/message/getOutgoingMessageState.js';
 
 var CreateChannel = function (props) {

package/CreateChannel/components/InviteUsers.js

@@ -1,35 +1,35 @@
-import { a as __spreadArray, _ as __assign } from '../../tslib.es6-13412863.js';
+import { a as __spreadArray, _ as __assign } from '../../tslib.es6-fc4a2658.js';
 import React__default, { useState, useContext, useEffect } from 'react';
-import { a as LocalizationContext } from '../../LocalizationContext-4c2faa9a.js';
-import { u as useCreateChannelContext } from '../../CreateChannelProvider-ed2e3cb4.js';
+import { a as LocalizationContext } from '../../LocalizationContext-539093a9.js';
+import { u as useCreateChannelContext } from '../../CreateChannelProvider-946fb371.js';
 import useSendbirdStateContext from '../../useSendbirdStateContext.js';
 import Modal from '../../ui/Modal.js';
-import { L as Label, b as LabelColors, a as LabelTypography } from '../../index-e2994193.js';
+import { L as Label, b as LabelColors, a as LabelTypography } from '../../index-4a977e7d.js';
 import { ButtonTypes } from '../../ui/Button.js';
 import UserListItem from '../../ui/UserListItem.js';
-import '../../stringSet-c2443946.js';
-import '../../index-a53d78b6.js';
+import '../../stringSet-f9763488.js';
+import '../../index-999fdb64.js';
 import '../../sendbirdSelectors.js';
-import '../../topics-0ba43ee8.js';
-import '../../utils-87dce5dd.js';
+import '../../topics-1ec669f0.js';
+import '../../utils-c1d219fa.js';
 import '../../withSendbird.js';
-import '../../_rollupPluginBabelHelpers-b45d3824.js';
+import '../../_rollupPluginBabelHelpers-09618dc3.js';
 import 'react-dom';
-import '../../index-fd5a03a3.js';
+import '../../index-b8e990b4.js';
 import '../../ui/Icon.js';
 import 'prop-types';
 import '../../ui/IconButton.js';
-import '../../MediaQueryContext-97a21b7e.js';
-import '../../UserProfileContext-e5d90f15.js';
+import '../../MediaQueryContext-79c8ad08.js';
+import '../../UserProfileContext-bd8525b7.js';
 import '../../ui/Avatar.js';
 import '../../ui/ImageRenderer.js';
-import '../../uuid-7a5e68ed.js';
+import '../../uuid-6ca64623.js';
 import '../../ui/MutedAvatarOverlay.js';
 import '../../ui/Checkbox.js';
 import '../../ui/UserProfile.js';
 import '../../ui/ContextMenu.js';
 import '../../ui/SortByRow.js';
-import '../../index-425e5f17.js';
+import '../../index-bbab31f0.js';
 import '../../utils/message/getOutgoingMessageState.js';
 
 var filterUser = function (idsToFilter) {