@sendbird/uikit-react 3.14.12 → 3.14.13

package/cjs/OpenChannelSettings/components/OperatorUI.js

@@ -3,49 +3,49 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var LocalizationContext = require('../../chunks/bundle-Bq4FcvTF.js');
-var ui_Label = require('../../chunks/bundle-BM95N32D.js');
+var LocalizationContext = require('../../chunks/bundle-BZCLEq3c.js');
+var ui_Label = require('../../chunks/bundle-CLsH2CaE.js');
 var ui_Icon = require('../../ui/Icon.js');
 var OpenChannelSettings_context = require('../context.js');
 var OpenChannelSettings_components_OpenChannelProfile = require('./OpenChannelProfile.js');
-var ui_Modal = require('../../chunks/bundle-1dGjBLMq.js');
+var ui_Modal = require('../../chunks/bundle-BCx4TP9R.js');
 var useSendbirdStateContext = require('../../useSendbirdStateContext.js');
-var OpenChannelSettings_components_ParticipantUI = require('../../chunks/bundle-Br8TcnkA.js');
+var OpenChannelSettings_components_ParticipantUI = require('../../chunks/bundle-C1mT4rip.js');
 var ui_Accordion = require('../../ui/Accordion.js');
 var ui_Button = require('../../ui/Button.js');
-var ui_ContextMenu = require('../../chunks/bundle-B_eF_lLw.js');
+var ui_ContextMenu = require('../../chunks/bundle-5SGoePaQ.js');
 var ui_IconButton = require('../../ui/IconButton.js');
-var _tslib = require('../../chunks/bundle-Cu2j1EmN.js');
+var _tslib = require('../../chunks/bundle-BSZgogl8.js');
 var ui_UserListItem = require('../../ui/UserListItem.js');
-var utils = require('../../chunks/bundle-CO52Wsr3.js');
-require('../../chunks/bundle-CrkUdg03.js');
-require('../../chunks/bundle-DQG6eG4l.js');
+var utils = require('../../chunks/bundle-BsUVmQmx.js');
+require('../../chunks/bundle-CqS517qU.js');
+require('../../chunks/bundle-B9Jxp8fA.js');
 require('@sendbird/chat/openChannel');
-require('../../chunks/bundle-_cqjcInH.js');
-require('../../chunks/bundle-BkKs2HEQ.js');
+require('../../chunks/bundle-C0HSA_B2.js');
+require('../../chunks/bundle-DAzWBBxC.js');
 require('../../withSendbird.js');
 require('../../ui/TextButton.js');
-require('../../chunks/bundle-8gOOVKMq.js');
+require('../../chunks/bundle-ikSCkayP.js');
 require('../../ui/OpenChannelAvatar.js');
-require('../../chunks/bundle-B56LqPOh.js');
+require('../../chunks/bundle-Cq7gxYWj.js');
 require('../../ui/ImageRenderer.js');
-require('../../chunks/bundle-CQbuVhqz.js');
-require('../../chunks/bundle-CI7ddAUC.js');
+require('../../chunks/bundle-CGBazQAC.js');
+require('../../chunks/bundle-CAofXETX.js');
 require('./EditDetailsModal.js');
-require('../../chunks/bundle-CI9mjpa7.js');
+require('../../chunks/bundle-B8eM_7mB.js');
 require('../../ui/Input.js');
-require('../../chunks/bundle-VyDwmxN4.js');
+require('../../chunks/bundle-E1Tkj9Pc.js');
 require('@sendbird/chat/groupChannel');
 require('../../utils/message/getOutgoingMessageState.js');
-require('../../chunks/bundle-CTW4jbtw.js');
-require('../../chunks/bundle-_xb0mhf9.js');
+require('../../chunks/bundle-BafSf9GJ.js');
+require('../../chunks/bundle-C6bh_Eny.js');
 require('react-dom');
-require('../../chunks/bundle-D0U-xAFE.js');
+require('../../chunks/bundle-DW5WyVEg.js');
 require('@sendbird/uikit-tools');
 require('css-vars-ponyfill');
 require('@sendbird/chat');
-require('../../chunks/bundle-D60dip73.js');
-require('../../chunks/bundle-DsscLs3k.js');
+require('../../chunks/bundle-BimZhXdJ.js');
+require('../../chunks/bundle-COzM5cWS.js');
 require('../../ui/SortByRow.js');
 require('../../ui/AccordionGroup.js');
 require('../../ui/MutedAvatarOverlay.js');
@@ -53,6 +53,10 @@ require('../../ui/UserProfile.js');
 require('../../sendbirdSelectors.js');
 require('../../ui/Checkbox.js');
 
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
 function DeleteChannel() {
     var _a, _b;
     var _c = React.useState(false), showDeleteChannelModal = _c[0], setShowDeleteChannelModal = _c[1];
@@ -71,8 +75,8 @@ function DeleteChannel() {
             logger.warning('OpenChannelSettings: Delete channel failed', error);
         });
     };
-    return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: "sendbird-openchannel-settings__panel-item\n          sendbird-openchannel-settings__delete-channel\n            ".concat(!isOnline ? 'sendbird-openchannel-settings__panel-item__disabled' : ''), role: "button", tabIndex: 0, onKeyDown: function () {
+    return (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement("div", { className: "sendbird-openchannel-settings__panel-item\n          sendbird-openchannel-settings__delete-channel\n            ".concat(!isOnline ? 'sendbird-openchannel-settings__panel-item__disabled' : ''), role: "button", tabIndex: 0, onKeyDown: function () {
                 if (!isOnline) {
                     return;
                 }
@@ -83,12 +87,12 @@ function DeleteChannel() {
                 }
                 setShowDeleteChannelModal(true);
             } },
-            React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.DELETE, fillColor: ui_Icon.IconColors.ERROR, className: [
+            React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.DELETE, fillColor: ui_Icon.IconColors.ERROR, className: [
                     'sendbird-openchannel-settings__panel-icon-left',
                     'sendbird-openchannel-settings__panel-icon__delete',
                 ].join(' '), height: "24px", width: "24px" }),
-            React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.OPEN_CHANNEL_SETTINGS__DELETE_CHANNEL_PANEL)),
-        showDeleteChannelModal && (React.createElement(ui_Modal.Modal, { isFullScreenOnMobile: true, onCancel: function () {
+            React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.OPEN_CHANNEL_SETTINGS__DELETE_CHANNEL_PANEL)),
+        showDeleteChannelModal && (React__default.default.createElement(ui_Modal.Modal, { isFullScreenOnMobile: true, onCancel: function () {
                 setShowDeleteChannelModal(false);
             }, onSubmit: function () {
                 deleteChannel();
@@ -115,9 +119,9 @@ function OperatorListModal(_a) {
             setOperatorQuery(operatorListQuery);
         }
     }, []);
-    return (React.createElement("div", null,
-        React.createElement(ui_Modal.Modal, { hideFooter: true, isFullScreenOnMobile: true, titleText: stringSet.OPEN_CHANNEL_SETTINGS__OPERATORS__TITLE_ALL, onCancel: onCancel },
-            React.createElement("div", { className: "sendbird-more-users__popup-scroll", onScroll: function (e) {
+    return (React__default.default.createElement("div", null,
+        React__default.default.createElement(ui_Modal.Modal, { hideFooter: true, isFullScreenOnMobile: true, titleText: stringSet.OPEN_CHANNEL_SETTINGS__OPERATORS__TITLE_ALL, onCancel: onCancel },
+            React__default.default.createElement("div", { className: "sendbird-more-users__popup-scroll", onScroll: function (e) {
                     var hasNext = operatorQuery === null || operatorQuery === void 0 ? void 0 : operatorQuery.hasNext;
                     var target = e.target;
                     var fetchMore = (target.clientHeight + target.scrollTop === target.scrollHeight);
@@ -126,12 +130,12 @@ function OperatorListModal(_a) {
                             setUsers(_tslib.__spreadArray(_tslib.__spreadArray([], users, true), o, true));
                         });
                     }
-                } }, users.map(function (operator) { return (React.createElement(ui_UserListItem.UserListItem, { currentUser: currentUserId, user: operator, key: operator.userId, action: function (_a) {
+                } }, users.map(function (operator) { return (React__default.default.createElement(ui_UserListItem.UserListItem, { currentUser: currentUserId, user: operator, key: operator.userId, action: function (_a) {
                     var parentRef = _a.parentRef, actionRef = _a.actionRef;
                     return (currentUserId !== (operator === null || operator === void 0 ? void 0 : operator.userId)
-                        ? (React.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React.createElement(ui_IconButton, { className: "sendbird-user-message__more__menu", width: "32px", height: "32px", onClick: toggleDropdown },
-                                React.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React.createElement(ui_ContextMenu.MenuItems, { parentContainRef: parentRef, parentRef: actionRef, closeDropdown: closeDropdown, openLeft: true },
-                                React.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
+                        ? (React__default.default.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React__default.default.createElement(ui_IconButton, { className: "sendbird-user-message__more__menu", width: "32px", height: "32px", onClick: toggleDropdown },
+                                React__default.default.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React__default.default.createElement(ui_ContextMenu.MenuItems, { parentContainRef: parentRef, parentRef: actionRef, closeDropdown: closeDropdown, openLeft: true },
+                                React__default.default.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
                                         channel === null || channel === void 0 ? void 0 : channel.removeOperators([operator.userId]).then(function () {
                                             setUsers(users.filter(function (_a) {
                                                 var userId = _a.userId;
@@ -139,7 +143,7 @@ function OperatorListModal(_a) {
                                             }));
                                         });
                                         closeDropdown();
-                                    }, testID: "open_channel_setting_operator_context_menu_unregister_operator" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNREGISTER_OPERATOR))); } })) : React.createElement(React.Fragment, null));
+                                    }, testID: "open_channel_setting_operator_context_menu_unregister_operator" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNREGISTER_OPERATOR))); } })) : React__default.default.createElement(React__default.default.Fragment, null));
                 } })); })))));
 }
 
@@ -162,15 +166,15 @@ function AddOperatorsModal(_a) {
         }
     }, []);
     var selectedCount = Object.keys(selectedUsers).filter(function (m) { return selectedUsers[m]; }).length;
-    return (React.createElement(React.Fragment, null,
-        React.createElement(ui_Modal.Modal, { isFullScreenOnMobile: true, type: ui_Button.ButtonTypes.PRIMARY, submitText: stringSet.CHANNEL_SETTING__OPERATORS__ADD_BUTTON, onCancel: onCancel, onSubmit: function () {
+    return (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement(ui_Modal.Modal, { isFullScreenOnMobile: true, type: ui_Button.ButtonTypes.PRIMARY, submitText: stringSet.CHANNEL_SETTING__OPERATORS__ADD_BUTTON, onCancel: onCancel, onSubmit: function () {
                 var users = Object.keys(selectedUsers).filter(function (m) { return selectedUsers[m]; });
                 channel === null || channel === void 0 ? void 0 : channel.addOperators(users).then(function () {
                     onSubmit(users);
                 });
             }, titleText: stringSet.OPEN_CHANNEL_CONVERSATION__SELECT_PARTICIPANTS },
-            React.createElement(ui_Label.Label, { color: (selectedCount > 0) ? ui_Label.LabelColors.PRIMARY : ui_Label.LabelColors.ONBACKGROUND_3, type: ui_Label.LabelTypography.CAPTION_1 }, "".concat(selectedCount, " ").concat(stringSet.MODAL__INVITE_MEMBER__SELECTED)),
-            React.createElement("div", { className: "sendbird-more-users__popup-scroll", onScroll: function (e) {
+            React__default.default.createElement(ui_Label.Label, { color: (selectedCount > 0) ? ui_Label.LabelColors.PRIMARY : ui_Label.LabelColors.ONBACKGROUND_3, type: ui_Label.LabelTypography.CAPTION_1 }, "".concat(selectedCount, " ").concat(stringSet.MODAL__INVITE_MEMBER__SELECTED)),
+            React__default.default.createElement("div", { className: "sendbird-more-users__popup-scroll", onScroll: function (e) {
                     var hasNext = participantQuery ? participantQuery.hasNext : false;
                     var target = e.target;
                     var fetchMore = (target.clientHeight + target.scrollTop === target.scrollHeight);
@@ -181,7 +185,7 @@ function AddOperatorsModal(_a) {
                     }
                 } }, participants.map(function (participant) {
                 var isOperator = (channel === null || channel === void 0 ? void 0 : channel.operators.find(function (operator) { return (operator === null || operator === void 0 ? void 0 : operator.userId) === (participant === null || participant === void 0 ? void 0 : participant.userId); })) ? true : false;
-                return (React.createElement(ui_UserListItem.UserListItem, { user: participant, key: participant.userId, checkBox: true, checked: selectedUsers[participant.userId] || isOperator, disabled: isOperator, isOperator: isOperator, onChange: function (event) {
+                return (React__default.default.createElement(ui_UserListItem.UserListItem, { user: participant, key: participant.userId, checkBox: true, checked: selectedUsers[participant.userId] || isOperator, disabled: isOperator, isOperator: isOperator, onChange: function (event) {
                         var _a;
                         var modifiedSelectedUsers = _tslib.__assign(_tslib.__assign({}, selectedUsers), (_a = {}, _a[event.target.id] = event.target.checked, _a));
                         if (!event.target.checked) {
@@ -200,42 +204,42 @@ var OperatorList = function () {
     var currentUserId = (_a = state === null || state === void 0 ? void 0 : state.config) === null || _a === void 0 ? void 0 : _a.userId;
     var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
     var channel = OpenChannelSettings_context.useOpenChannelSettingsContext().channel;
-    return (React.createElement("div", null, (_b = channel === null || channel === void 0 ? void 0 : channel.operators) === null || _b === void 0 ? void 0 :
-        _b.slice(0, 10).map(function (operator) { return (React.createElement(OpenChannelSettings_components_ParticipantUI.UserListItem, { key: operator.userId, user: operator, currentUser: currentUserId, action: function (_a) {
+    return (React__default.default.createElement("div", null, (_b = channel === null || channel === void 0 ? void 0 : channel.operators) === null || _b === void 0 ? void 0 :
+        _b.slice(0, 10).map(function (operator) { return (React__default.default.createElement(OpenChannelSettings_components_ParticipantUI.UserListItem, { key: operator.userId, user: operator, currentUser: currentUserId, action: function (_a) {
                 var actionRef = _a.actionRef;
                 return (currentUserId !== (operator === null || operator === void 0 ? void 0 : operator.userId)
-                    ? (React.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React.createElement(ui_IconButton, { className: "sendbird-openchannel-operator-list__menu", width: "32px", height: "32px", onClick: toggleDropdown },
-                            React.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React.createElement(ui_ContextMenu.MenuItems, { parentRef: actionRef, closeDropdown: closeDropdown, openLeft: true },
-                            React.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
+                    ? (React__default.default.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React__default.default.createElement(ui_IconButton, { className: "sendbird-openchannel-operator-list__menu", width: "32px", height: "32px", onClick: toggleDropdown },
+                            React__default.default.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React__default.default.createElement(ui_ContextMenu.MenuItems, { parentRef: actionRef, closeDropdown: closeDropdown, openLeft: true },
+                            React__default.default.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
                                     channel === null || channel === void 0 ? void 0 : channel.removeOperators([operator.userId]).then(function () {
                                         closeDropdown();
                                     });
                                 }, testID: "open_channel_setting_operator_context_menu_unregister_operator" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNREGISTER_OPERATOR),
-                            React.createElement(ui_ContextMenu.MuteMenuItem, { channel: channel, user: operator, onChange: function () { return closeDropdown(); }, onError: function () {
+                            React__default.default.createElement(ui_ContextMenu.MuteMenuItem, { channel: channel, user: operator, onChange: function () { return closeDropdown(); }, onError: function () {
                                     // FIXME: handle error later
                                     closeDropdown();
                                 }, testID: "open_channel_setting_operator_context_menu_".concat(operator.isMuted ? 'unmute' : 'mute') }, operator.isMuted
                                 ? stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNMUTE
                                 : stringSet.OPEN_CHANNEL_SETTING__MODERATION__MUTE),
-                            React.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
+                            React__default.default.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
                                     channel === null || channel === void 0 ? void 0 : channel.banUser(operator).then(function () {
                                         closeDropdown();
                                     });
-                                }, testID: "open_channel_setting_operator_context_menu_ban" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__BAN))); } })) : React.createElement(React.Fragment, null));
+                                }, testID: "open_channel_setting_operator_context_menu_ban" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__BAN))); } })) : React__default.default.createElement(React__default.default.Fragment, null));
             } })); }),
-        React.createElement("div", { className: "sendbird-openchannel-operator-list__footer" },
-            React.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
+        React__default.default.createElement("div", { className: "sendbird-openchannel-operator-list__footer" },
+            React__default.default.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
                     setShowAdd(true);
                 } }, stringSet.OPEN_CHANNEL_SETTINGS__OPERATORS__TITLE_ADD),
-            (channel === null || channel === void 0 ? void 0 : channel.operators) && channel.operators.length > 10 && (React.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
+            (channel === null || channel === void 0 ? void 0 : channel.operators) && channel.operators.length > 10 && (React__default.default.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
                     setShowMore(true);
                 } }, stringSet.OPEN_CHANNEL_SETTINGS__OPERATORS__TITLE_ALL))),
-        showMore && (React.createElement(React.Fragment, null,
-            React.createElement(OperatorListModal, { onCancel: function () {
+        showMore && (React__default.default.createElement(React__default.default.Fragment, null,
+            React__default.default.createElement(OperatorListModal, { onCancel: function () {
                     setShowMore(false);
                 } }))),
-        showAdd && (React.createElement(React.Fragment, null,
-            React.createElement(AddOperatorsModal, { onCancel: function () { return setShowAdd(false); }, onSubmit: function () {
+        showAdd && (React__default.default.createElement(React__default.default.Fragment, null,
+            React__default.default.createElement(AddOperatorsModal, { onCancel: function () { return setShowAdd(false); }, onSubmit: function () {
                     setShowAdd(false);
                 } })))));
 };
@@ -260,9 +264,9 @@ function MutedParticipantsModal(_a) {
             setUserListQuery(mutedUserListQuery);
         }
     }, []);
-    return (React.createElement("div", null,
-        React.createElement(ui_Modal.Modal, { isFullScreenOnMobile: true, hideFooter: true, onCancel: function () { return onCancel(); }, onSubmit: utils.noop, titleText: stringSet.OPEN_CHANNEL_SETTINGS__MUTED_MEMBERS__TITLE },
-            React.createElement("div", { className: "sendbird-more-members__popup-scroll", onScroll: function (e) {
+    return (React__default.default.createElement("div", null,
+        React__default.default.createElement(ui_Modal.Modal, { isFullScreenOnMobile: true, hideFooter: true, onCancel: function () { return onCancel(); }, onSubmit: utils.noop, titleText: stringSet.OPEN_CHANNEL_SETTINGS__MUTED_MEMBERS__TITLE },
+            React__default.default.createElement("div", { className: "sendbird-more-members__popup-scroll", onScroll: function (e) {
                     var hasNext = userListQuery === null || userListQuery === void 0 ? void 0 : userListQuery.hasNext;
                     var target = e.target;
                     var fetchMore = (target.clientHeight + target.scrollTop === target.scrollHeight);
@@ -271,19 +275,19 @@ function MutedParticipantsModal(_a) {
                             setMutedUsers(_tslib.__spreadArray(_tslib.__spreadArray([], mutedUsers, true), o, true));
                         });
                     }
-                } }, mutedUsers.map(function (mutedUser) { return (React.createElement(ui_UserListItem.UserListItem, { currentUser: currentUserId, user: mutedUser, key: mutedUser.userId, action: function (_a) {
+                } }, mutedUsers.map(function (mutedUser) { return (React__default.default.createElement(ui_UserListItem.UserListItem, { currentUser: currentUserId, user: mutedUser, key: mutedUser.userId, action: function (_a) {
                     var actionRef = _a.actionRef;
                     return ((mutedUser === null || mutedUser === void 0 ? void 0 : mutedUser.userId) !== currentUserId
-                        ? (React.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React.createElement(ui_IconButton, { className: "sendbird-user-message__more__menu", width: "32px", height: "32px", onClick: toggleDropdown },
-                                React.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React.createElement(ui_ContextMenu.MenuItems, { parentRef: actionRef, closeDropdown: closeDropdown, openLeft: true },
-                                React.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
+                        ? (React__default.default.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React__default.default.createElement(ui_IconButton, { className: "sendbird-user-message__more__menu", width: "32px", height: "32px", onClick: toggleDropdown },
+                                React__default.default.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React__default.default.createElement(ui_ContextMenu.MenuItems, { parentRef: actionRef, closeDropdown: closeDropdown, openLeft: true },
+                                React__default.default.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
                                         channel === null || channel === void 0 ? void 0 : channel.unmuteUser(mutedUser).then(function () {
                                             closeDropdown();
                                             setMutedUsers(mutedUsers.filter(function (u) {
                                                 return (u.userId !== mutedUser.userId);
                                             }));
                                         });
-                                    }, testID: "open_channel_setting_muted_member_context_menu_unmute" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNMUTE))); } })) : React.createElement(React.Fragment, null));
+                                    }, testID: "open_channel_setting_muted_member_context_menu_unmute" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNMUTE))); } })) : React__default.default.createElement(React__default.default.Fragment, null));
                 } })); })))));
 }
 
@@ -322,25 +326,25 @@ var MutedParticipantList = function () {
             setHasNext(mutedUserListQuery.hasNext);
         });
     }, [channel]);
-    return (React.createElement(React.Fragment, null,
-        mutedUsers.map(function (mutedUser) { return (React.createElement(OpenChannelSettings_components_ParticipantUI.UserListItem, { key: mutedUser.userId, user: mutedUser, currentUser: currentUserId, isOperator: channel === null || channel === void 0 ? void 0 : channel.isOperator(mutedUser.userId), action: function (_a) {
+    return (React__default.default.createElement(React__default.default.Fragment, null,
+        mutedUsers.map(function (mutedUser) { return (React__default.default.createElement(OpenChannelSettings_components_ParticipantUI.UserListItem, { key: mutedUser.userId, user: mutedUser, currentUser: currentUserId, isOperator: channel === null || channel === void 0 ? void 0 : channel.isOperator(mutedUser.userId), action: function (_a) {
                 var actionRef = _a.actionRef;
                 return ((mutedUser === null || mutedUser === void 0 ? void 0 : mutedUser.userId) !== currentUserId
-                    ? (React.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React.createElement(ui_IconButton, { className: "sendbird-user-message__more__menu", width: "32px", height: "32px", onClick: toggleDropdown },
-                            React.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React.createElement(ui_ContextMenu.MenuItems, { closeDropdown: closeDropdown, openLeft: true, parentRef: actionRef },
-                            React.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
+                    ? (React__default.default.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React__default.default.createElement(ui_IconButton, { className: "sendbird-user-message__more__menu", width: "32px", height: "32px", onClick: toggleDropdown },
+                            React__default.default.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React__default.default.createElement(ui_ContextMenu.MenuItems, { closeDropdown: closeDropdown, openLeft: true, parentRef: actionRef },
+                            React__default.default.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
                                     channel === null || channel === void 0 ? void 0 : channel.unmuteUser(mutedUser).then(function () {
                                         refreshList();
                                         closeDropdown();
                                     });
-                                }, testID: "open_channel_setting_muted_member_context_menu_unmute" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNMUTE))); } })) : React.createElement(React.Fragment, null));
+                                }, testID: "open_channel_setting_muted_member_context_menu_unmute" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNMUTE))); } })) : React__default.default.createElement(React__default.default.Fragment, null));
             } })); }),
-        mutedUsers && mutedUsers.length === 0 && (React.createElement(ui_Label.Label, { className: "sendbird-channel-settings__empty-list", type: ui_Label.LabelTypography.SUBTITLE_2, color: ui_Label.LabelColors.ONBACKGROUND_3 }, stringSet.OPEN_CHANNEL_SETTINGS__MUTED_MEMBERS__NO_ONE)),
-        hasNext && (React.createElement("div", { className: "sendbird-channel-settings-muted-participant-list__footer" },
-            React.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
+        mutedUsers && mutedUsers.length === 0 && (React__default.default.createElement(ui_Label.Label, { className: "sendbird-channel-settings__empty-list", type: ui_Label.LabelTypography.SUBTITLE_2, color: ui_Label.LabelColors.ONBACKGROUND_3 }, stringSet.OPEN_CHANNEL_SETTINGS__MUTED_MEMBERS__NO_ONE)),
+        hasNext && (React__default.default.createElement("div", { className: "sendbird-channel-settings-muted-participant-list__footer" },
+            React__default.default.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
                     setShowModal(true);
                 } }, stringSet.OPEN_CHANNEL_SETTINGS__MUTED_MEMBERS__TITLE_ALL))),
-        showModal && (React.createElement(MutedParticipantsModal, { onCancel: function () {
+        showModal && (React__default.default.createElement(MutedParticipantsModal, { onCancel: function () {
                 setShowModal(false);
                 refreshList();
             } }))));
@@ -362,9 +366,9 @@ function BannedUsersModal(_a) {
         });
         setUserListQuery(bannedUserListQuery !== null && bannedUserListQuery !== void 0 ? bannedUserListQuery : null);
     }, []);
-    return (React.createElement("div", null,
-        React.createElement(ui_Modal.Modal, { hideFooter: true, isFullScreenOnMobile: true, onCancel: function () { return onCancel(); }, onSubmit: utils.noop, titleText: stringSet.OPEN_CHANNEL_SETTINGS__MUTED_MEMBERS__TITLE },
-            React.createElement("div", { className: "sendbird-more-members__popup-scroll", onScroll: function (e) {
+    return (React__default.default.createElement("div", null,
+        React__default.default.createElement(ui_Modal.Modal, { hideFooter: true, isFullScreenOnMobile: true, onCancel: function () { return onCancel(); }, onSubmit: utils.noop, titleText: stringSet.OPEN_CHANNEL_SETTINGS__MUTED_MEMBERS__TITLE },
+            React__default.default.createElement("div", { className: "sendbird-more-members__popup-scroll", onScroll: function (e) {
                     var hasNext = userListQuery === null || userListQuery === void 0 ? void 0 : userListQuery.hasNext;
                     var target = e.target;
                     var fetchMore = (target.clientHeight + target.scrollTop === target.scrollHeight);
@@ -373,19 +377,19 @@ function BannedUsersModal(_a) {
                             setBannedUsers(_tslib.__spreadArray(_tslib.__spreadArray([], bannedUsers, true), o, true));
                         });
                     }
-                } }, bannedUsers.map(function (bannedUser) { return (React.createElement(ui_UserListItem.UserListItem, { user: bannedUser, key: bannedUser.userId, action: function (_a) {
+                } }, bannedUsers.map(function (bannedUser) { return (React__default.default.createElement(ui_UserListItem.UserListItem, { user: bannedUser, key: bannedUser.userId, action: function (_a) {
                     var actionRef = _a.actionRef;
                     return ((bannedUser === null || bannedUser === void 0 ? void 0 : bannedUser.userId) !== currentUserId
-                        ? (React.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React.createElement(ui_IconButton, { className: "sendbird-user-message__more__menu", width: "32px", height: "32px", onClick: toggleDropdown },
-                                React.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React.createElement(ui_ContextMenu.MenuItems, { parentRef: actionRef, closeDropdown: closeDropdown, openLeft: true },
-                                React.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
+                        ? (React__default.default.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React__default.default.createElement(ui_IconButton, { className: "sendbird-user-message__more__menu", width: "32px", height: "32px", onClick: toggleDropdown },
+                                React__default.default.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React__default.default.createElement(ui_ContextMenu.MenuItems, { parentRef: actionRef, closeDropdown: closeDropdown, openLeft: true },
+                                React__default.default.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
                                         channel === null || channel === void 0 ? void 0 : channel.unbanUser(bannedUser).then(function () {
                                             closeDropdown();
                                             setBannedUsers(bannedUsers.filter(function (u) {
                                                 return (u.userId !== bannedUser.userId);
                                             }));
                                         });
-                                    }, testID: "open_channel_setting_banned_user_context_menu_unban" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNBAN))); } })) : React.createElement(React.Fragment, null));
+                                    }, testID: "open_channel_setting_banned_user_context_menu_unban" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNBAN))); } })) : React__default.default.createElement(React__default.default.Fragment, null));
                 } })); })))));
 }
 
@@ -420,25 +424,25 @@ var BannedUserList = function () {
             setHasNext(bannedUserListQuery.hasNext);
         });
     }, [channel]);
-    return (React.createElement(React.Fragment, null,
-        bannedUsers.map(function (bannedUser) { return (React.createElement(OpenChannelSettings_components_ParticipantUI.UserListItem, { key: bannedUser.userId, user: bannedUser, isOperator: channel === null || channel === void 0 ? void 0 : channel.isOperator(bannedUser.userId), action: function (_a) {
+    return (React__default.default.createElement(React__default.default.Fragment, null,
+        bannedUsers.map(function (bannedUser) { return (React__default.default.createElement(OpenChannelSettings_components_ParticipantUI.UserListItem, { key: bannedUser.userId, user: bannedUser, isOperator: channel === null || channel === void 0 ? void 0 : channel.isOperator(bannedUser.userId), action: function (_a) {
                 var actionRef = _a.actionRef;
                 return ((bannedUser === null || bannedUser === void 0 ? void 0 : bannedUser.userId) !== currentUserId
-                    ? (React.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React.createElement(ui_IconButton, { className: "sendbird-user-message__more__menu", width: "32px", height: "32px", onClick: toggleDropdown },
-                            React.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React.createElement(ui_ContextMenu.MenuItems, { parentRef: actionRef, closeDropdown: closeDropdown, openLeft: true },
-                            React.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
+                    ? (React__default.default.createElement(ui_ContextMenu.ContextMenu, { menuTrigger: function (toggleDropdown) { return (React__default.default.createElement(ui_IconButton, { className: "sendbird-user-message__more__menu", width: "32px", height: "32px", onClick: toggleDropdown },
+                            React__default.default.createElement(ui_Icon.default, { width: "24px", height: "24px", type: ui_Icon.IconTypes.MORE, fillColor: ui_Icon.IconColors.CONTENT_INVERSE }))); }, menuItems: function (closeDropdown) { return (React__default.default.createElement(ui_ContextMenu.MenuItems, { parentRef: actionRef, closeDropdown: closeDropdown, openLeft: true },
+                            React__default.default.createElement(ui_ContextMenu.MenuItem$1, { onClick: function () {
                                     channel === null || channel === void 0 ? void 0 : channel.unbanUser(bannedUser).then(function () {
                                         closeDropdown();
                                         refreshList();
                                     });
-                                }, testID: "open_channel_setting_banned_user_context_menu_unban" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNBAN))); } })) : React.createElement(React.Fragment, null));
+                                }, testID: "open_channel_setting_banned_user_context_menu_unban" }, stringSet.OPEN_CHANNEL_SETTING__MODERATION__UNBAN))); } })) : React__default.default.createElement(React__default.default.Fragment, null));
             } })); }),
-        bannedUsers && bannedUsers.length === 0 && (React.createElement(ui_Label.Label, { className: "sendbird-channel-settings__empty-list", type: ui_Label.LabelTypography.SUBTITLE_2, color: ui_Label.LabelColors.ONBACKGROUND_3 }, stringSet.OPEN_CHANNEL_SETTINGS__BANNED_MEMBERS__NO_ONE)),
-        hasNext && (React.createElement("div", { className: "sendbird-channel-settings-banned-user-list__footer" },
-            React.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
+        bannedUsers && bannedUsers.length === 0 && (React__default.default.createElement(ui_Label.Label, { className: "sendbird-channel-settings__empty-list", type: ui_Label.LabelTypography.SUBTITLE_2, color: ui_Label.LabelColors.ONBACKGROUND_3 }, stringSet.OPEN_CHANNEL_SETTINGS__BANNED_MEMBERS__NO_ONE)),
+        hasNext && (React__default.default.createElement("div", { className: "sendbird-channel-settings-banned-user-list__footer" },
+            React__default.default.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
                     setShowModal(true);
                 } }, stringSet.OPEN_CHANNEL_SETTINGS__BANNED_MEMBERS__TITLE_ALL))),
-        showModal && (React.createElement(BannedUsersModal, { onCancel: function () {
+        showModal && (React__default.default.createElement(BannedUsersModal, { onCancel: function () {
                 setShowModal(false);
                 refreshList();
             } }))));
@@ -473,38 +477,38 @@ var OperatorUI = function (_a) {
     var renderChannelProfile = _a.renderChannelProfile;
     var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
     var _b = OpenChannelSettings_context.useOpenChannelSettingsContext(), onCloseClick = _b.onCloseClick, channel = _b.channel;
-    return (React.createElement(React.Fragment, null,
-        React.createElement("div", { className: "sendbird-openchannel-settings__header" },
-            React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.H_2, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.CHANNEL_SETTING__HEADER__TITLE),
-            React.createElement(ui_Icon.default, { className: "sendbird-openchannel-settings__close-icon", type: ui_Icon.IconTypes.CLOSE, height: "24px", width: "24px", onClick: function () {
+    return (React__default.default.createElement(React__default.default.Fragment, null,
+        React__default.default.createElement("div", { className: "sendbird-openchannel-settings__header" },
+            React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.H_2, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.CHANNEL_SETTING__HEADER__TITLE),
+            React__default.default.createElement(ui_Icon.default, { className: "sendbird-openchannel-settings__close-icon", type: ui_Icon.IconTypes.CLOSE, height: "24px", width: "24px", onClick: function () {
                     onCloseClick === null || onCloseClick === void 0 ? void 0 : onCloseClick();
                 } })),
-        React.createElement("div", { className: "sendbird-openchannel-settings__profile" }, (renderChannelProfile === null || renderChannelProfile === void 0 ? void 0 : renderChannelProfile()) || (React.createElement(OpenChannelSettings_components_OpenChannelProfile, null))),
-        React.createElement("div", { className: "sendbird-openchannel-settings__url" },
-            React.createElement(ui_Icon.default, { className: "sendbird-openchannel-settings__copy-icon", type: ui_Icon.IconTypes.COPY, height: "22px", width: "22px", onClick: function () {
+        React__default.default.createElement("div", { className: "sendbird-openchannel-settings__profile" }, (renderChannelProfile === null || renderChannelProfile === void 0 ? void 0 : renderChannelProfile()) || (React__default.default.createElement(OpenChannelSettings_components_OpenChannelProfile, null))),
+        React__default.default.createElement("div", { className: "sendbird-openchannel-settings__url" },
+            React__default.default.createElement(ui_Icon.default, { className: "sendbird-openchannel-settings__copy-icon", type: ui_Icon.IconTypes.COPY, height: "22px", width: "22px", onClick: function () {
                     var _a;
                     copyToClipboard((_a = channel === null || channel === void 0 ? void 0 : channel.url) !== null && _a !== void 0 ? _a : '');
                 } }),
-            React.createElement(ui_Label.Label, { className: "sendbird-openchannel-settings__url-label", type: ui_Label.LabelTypography.CAPTION_2, color: ui_Label.LabelColors.ONBACKGROUND_2 }, stringSet.OPEN_CHANNEL_SETTINGS__OPERATOR_URL),
-            React.createElement(ui_Label.Label, { className: "sendbird-openchannel-settings__url-value", type: ui_Label.LabelTypography.SUBTITLE_2 }, channel === null || channel === void 0 ? void 0 : channel.url)),
-        React.createElement(ui_Accordion.AccordionGroup, null,
-            React.createElement(ui_Accordion.default, { className: "sendbird-openchannel-settings__operators-list", id: "operators", renderTitle: function () { return (React.createElement(React.Fragment, null,
-                    React.createElement(ui_Icon.default, { className: "sendbird-openchannel-settings__operator-accordion-icon", type: ui_Icon.IconTypes.OPERATOR, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
-                    React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.OPEN_CHANNEL_SETTINGS__OPERATORS_TITLE))); }, renderContent: function () { return (React.createElement(React.Fragment, null,
-                    React.createElement(OperatorList, null))); } }),
-            React.createElement(ui_Accordion.default, { className: "sendbird-channel-settings__operators-list", id: "participants", renderTitle: function () { return (React.createElement(React.Fragment, null,
-                    React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.MEMBERS, fillColor: ui_Icon.IconColors.PRIMARY, width: 24, height: 24, className: "sendbird-openchannel-settings__operator-accordion-icon" }),
-                    React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.OPEN_CHANNEL_SETTINGS__PARTICIPANTS_ACCORDION_TITLE))); }, renderContent: function () { return (React.createElement(React.Fragment, null,
-                    React.createElement(OpenChannelSettings_components_ParticipantUI.ParticipantList, { isOperatorView: true }))); } }),
-            React.createElement(ui_Accordion.default, { className: "sendbird-channel-settings__operators-list", id: "mutedMembers", renderTitle: function () { return (React.createElement(React.Fragment, null,
-                    React.createElement(ui_Icon.default, { className: "sendbird-openchannel-settings__operator-accordion-icon", type: ui_Icon.IconTypes.MUTE, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
-                    React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.OPEN_CHANNEL_SETTINGS__MUTED_MEMBERS__TITLE))); }, renderContent: function () { return (React.createElement(React.Fragment, null,
-                    React.createElement(MutedParticipantList, null))); } }),
-            React.createElement(ui_Accordion.default, { className: "sendbird-channel-settings__operators-list", id: "bannedUsers", renderTitle: function () { return (React.createElement(React.Fragment, null,
-                    React.createElement(ui_Icon.default, { className: "sendbird-openchannel-settings__operator-accordion-icon", type: ui_Icon.IconTypes.BAN, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
-                    React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.OPEN_CHANNEL_SETTINGS__BANNED_MEMBERS__TITLE))); }, renderContent: function () { return (React.createElement(React.Fragment, null,
-                    React.createElement(BannedUserList, null))); } })),
-        React.createElement(DeleteChannel, null)));
+            React__default.default.createElement(ui_Label.Label, { className: "sendbird-openchannel-settings__url-label", type: ui_Label.LabelTypography.CAPTION_2, color: ui_Label.LabelColors.ONBACKGROUND_2 }, stringSet.OPEN_CHANNEL_SETTINGS__OPERATOR_URL),
+            React__default.default.createElement(ui_Label.Label, { className: "sendbird-openchannel-settings__url-value", type: ui_Label.LabelTypography.SUBTITLE_2 }, channel === null || channel === void 0 ? void 0 : channel.url)),
+        React__default.default.createElement(ui_Accordion.AccordionGroup, null,
+            React__default.default.createElement(ui_Accordion.default, { className: "sendbird-openchannel-settings__operators-list", id: "operators", renderTitle: function () { return (React__default.default.createElement(React__default.default.Fragment, null,
+                    React__default.default.createElement(ui_Icon.default, { className: "sendbird-openchannel-settings__operator-accordion-icon", type: ui_Icon.IconTypes.OPERATOR, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
+                    React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.OPEN_CHANNEL_SETTINGS__OPERATORS_TITLE))); }, renderContent: function () { return (React__default.default.createElement(React__default.default.Fragment, null,
+                    React__default.default.createElement(OperatorList, null))); } }),
+            React__default.default.createElement(ui_Accordion.default, { className: "sendbird-channel-settings__operators-list", id: "participants", renderTitle: function () { return (React__default.default.createElement(React__default.default.Fragment, null,
+                    React__default.default.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.MEMBERS, fillColor: ui_Icon.IconColors.PRIMARY, width: 24, height: 24, className: "sendbird-openchannel-settings__operator-accordion-icon" }),
+                    React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.OPEN_CHANNEL_SETTINGS__PARTICIPANTS_ACCORDION_TITLE))); }, renderContent: function () { return (React__default.default.createElement(React__default.default.Fragment, null,
+                    React__default.default.createElement(OpenChannelSettings_components_ParticipantUI.ParticipantList, { isOperatorView: true }))); } }),
+            React__default.default.createElement(ui_Accordion.default, { className: "sendbird-channel-settings__operators-list", id: "mutedMembers", renderTitle: function () { return (React__default.default.createElement(React__default.default.Fragment, null,
+                    React__default.default.createElement(ui_Icon.default, { className: "sendbird-openchannel-settings__operator-accordion-icon", type: ui_Icon.IconTypes.MUTE, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
+                    React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.OPEN_CHANNEL_SETTINGS__MUTED_MEMBERS__TITLE))); }, renderContent: function () { return (React__default.default.createElement(React__default.default.Fragment, null,
+                    React__default.default.createElement(MutedParticipantList, null))); } }),
+            React__default.default.createElement(ui_Accordion.default, { className: "sendbird-channel-settings__operators-list", id: "bannedUsers", renderTitle: function () { return (React__default.default.createElement(React__default.default.Fragment, null,
+                    React__default.default.createElement(ui_Icon.default, { className: "sendbird-openchannel-settings__operator-accordion-icon", type: ui_Icon.IconTypes.BAN, fillColor: ui_Icon.IconColors.PRIMARY, width: "24px", height: "24px" }),
+                    React__default.default.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.SUBTITLE_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.OPEN_CHANNEL_SETTINGS__BANNED_MEMBERS__TITLE))); }, renderContent: function () { return (React__default.default.createElement(React__default.default.Fragment, null,
+                    React__default.default.createElement(BannedUserList, null))); } })),
+        React__default.default.createElement(DeleteChannel, null)));
 };
 
 exports.OperatorUI = OperatorUI;

package/cjs/OpenChannelSettings/components/OperatorUI.js.map

@@ -1 +1 @@
-{"version":3,"file":"OperatorUI.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"OperatorUI.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/cjs/OpenChannelSettings/components/ParticipantUI.js

@@ -1,45 +1,45 @@
 'use strict';
 
-require('../../chunks/bundle-Cu2j1EmN.js');
+require('../../chunks/bundle-BSZgogl8.js');
 require('react');
 require('../../ui/Button.js');
-require('../../chunks/bundle-B_eF_lLw.js');
+require('../../chunks/bundle-5SGoePaQ.js');
 require('../../ui/Icon.js');
 require('../../ui/IconButton.js');
-require('../../chunks/bundle-BM95N32D.js');
-var OpenChannelSettings_components_ParticipantUI = require('../../chunks/bundle-Br8TcnkA.js');
-require('../../chunks/bundle-Bq4FcvTF.js');
+require('../../chunks/bundle-CLsH2CaE.js');
+var OpenChannelSettings_components_ParticipantUI = require('../../chunks/bundle-C1mT4rip.js');
+require('../../chunks/bundle-BZCLEq3c.js');
 require('../context.js');
 require('../../useSendbirdStateContext.js');
-require('../../chunks/bundle-CrkUdg03.js');
+require('../../chunks/bundle-CqS517qU.js');
 require('react-dom');
-require('../../chunks/bundle-CO52Wsr3.js');
+require('../../chunks/bundle-BsUVmQmx.js');
 require('@sendbird/chat');
 require('@sendbird/chat/openChannel');
 require('../../ui/SortByRow.js');
-require('../../chunks/bundle-BkKs2HEQ.js');
+require('../../chunks/bundle-DAzWBBxC.js');
 require('../../withSendbird.js');
-require('../../chunks/bundle-VyDwmxN4.js');
+require('../../chunks/bundle-E1Tkj9Pc.js');
 require('@sendbird/chat/groupChannel');
 require('../../utils/message/getOutgoingMessageState.js');
-require('../../chunks/bundle-CTW4jbtw.js');
-require('../../chunks/bundle-_xb0mhf9.js');
-require('../../chunks/bundle-_cqjcInH.js');
+require('../../chunks/bundle-BafSf9GJ.js');
+require('../../chunks/bundle-C6bh_Eny.js');
+require('../../chunks/bundle-C0HSA_B2.js');
 require('../../ui/AccordionGroup.js');
-require('../../chunks/bundle-B56LqPOh.js');
+require('../../chunks/bundle-Cq7gxYWj.js');
 require('../../ui/ImageRenderer.js');
-require('../../chunks/bundle-CQbuVhqz.js');
-require('../../chunks/bundle-D0U-xAFE.js');
+require('../../chunks/bundle-CGBazQAC.js');
+require('../../chunks/bundle-DW5WyVEg.js');
 require('@sendbird/uikit-tools');
-require('../../chunks/bundle-1dGjBLMq.js');
+require('../../chunks/bundle-BCx4TP9R.js');
 require('css-vars-ponyfill');
-require('../../chunks/bundle-D60dip73.js');
-require('../../chunks/bundle-DsscLs3k.js');
+require('../../chunks/bundle-BimZhXdJ.js');
+require('../../chunks/bundle-COzM5cWS.js');
 require('../../ui/MutedAvatarOverlay.js');
 require('../../ui/UserProfile.js');
 require('../../sendbirdSelectors.js');
-require('../../chunks/bundle-CI9mjpa7.js');
-require('../../chunks/bundle-DQG6eG4l.js');
+require('../../chunks/bundle-B8eM_7mB.js');
+require('../../chunks/bundle-B9Jxp8fA.js');
 require('../../ui/UserListItem.js');
 require('../../ui/Checkbox.js');