@sendbird/uikit-react 3.14.12 → 3.14.13-rc.0

package/cjs/chunks/bundle-kdFcOc9z.js

@@ -1,324 +0,0 @@
-'use strict';
-
-var _tslib = require('./bundle-Cu2j1EmN.js');
-var React = require('react');
-var LocalizationContext = require('./bundle-Bq4FcvTF.js');
-var ChannelSettings_context = require('../ChannelSettings/context.js');
-var ui_Button = require('../ui/Button.js');
-var UserListItemMenu = require('./bundle-BGntYUSD.js');
-var ui_UserListItem = require('../ui/UserListItem.js');
-var ui_Modal = require('./bundle-1dGjBLMq.js');
-var index = require('./bundle-3sKikwZF.js');
-var ui_Label = require('./bundle-BM95N32D.js');
-var groupChannel = require('@sendbird/chat/groupChannel');
-var utils = require('./bundle-CO52Wsr3.js');
-var MemberList = require('./bundle-Cg6OS8uW.js');
-
-function OperatorsModal(_a) {
-    var _this = this;
-    var onCancel = _a.onCancel, _b = _a.renderUserListItem, renderUserListItem = _b === void 0 ? function (props) { return React.createElement(ui_UserListItem.UserListItem, _tslib.__assign({}, props)); } : _b;
-    var _c = React.useState([]), operators = _c[0], setOperators = _c[1];
-    var _d = React.useState(null), operatorQuery = _d[0], setOperatorQuery = _d[1];
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
-    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-    React.useEffect(function () {
-        var operatorListQuery = channel === null || channel === void 0 ? void 0 : channel.createOperatorListQuery({
-            limit: 20,
-        });
-        operatorListQuery === null || operatorListQuery === void 0 ? void 0 : operatorListQuery.next().then(function (operators) {
-            setOperators(operators);
-        });
-        setOperatorQuery(operatorListQuery !== null && operatorListQuery !== void 0 ? operatorListQuery : null);
-    }, []);
-    return (React.createElement("div", null,
-        React.createElement(ui_Modal.Modal, { isFullScreenOnMobile: true, hideFooter: true, titleText: stringSet.CHANNEL_SETTING__OPERATORS__TITLE_ALL, onCancel: onCancel },
-            React.createElement("div", { className: "sendbird-more-members__popup-scroll", onScroll: index.useOnScrollPositionChangeDetector({
-                    onReachedBottom: function () { return _tslib.__awaiter(_this, void 0, void 0, function () {
-                        return _tslib.__generator(this, function (_a) {
-                            if (operatorQuery && operatorQuery.hasNext) {
-                                operatorQuery.next().then(function (o) {
-                                    setOperators(_tslib.__spreadArray(_tslib.__spreadArray([], operators, true), o, true));
-                                });
-                            }
-                            return [2 /*return*/];
-                        });
-                    }); },
-                }) }, operators.map(function (member) { return (React.createElement(React.Fragment, { key: member.userId }, renderUserListItem({
-                user: member,
-                channel: channel,
-                renderListItemMenu: function (props) { return (React.createElement(UserListItemMenu.UserListItemMenu, _tslib.__assign({}, props, { isOperator: true, onToggleOperatorState: function (_a) {
-                        var user = _a.user;
-                        setOperators(operators.filter(function (_a) {
-                            var userId = _a.userId;
-                            return userId !== user.userId;
-                        }));
-                    }, renderMenuItems: function (_a) {
-                        var items = _a.items;
-                        return (React.createElement(items.OperatorToggleMenuItem, null));
-                    } }))); },
-            }))); })))));
-}
-
-function AddOperatorsModal(_a) {
-    var _this = this;
-    var onCancel = _a.onCancel, onSubmit = _a.onSubmit, _b = _a.renderUserListItem, renderUserListItem = _b === void 0 ? function (props) { return React.createElement(ui_UserListItem.UserListItem, _tslib.__assign({}, props)); } : _b;
-    var _c = React.useState([]), members = _c[0], setMembers = _c[1];
-    var _d = React.useState({}), selectedMembers = _d[0], setSelectedMembers = _d[1];
-    var _e = React.useState(null), memberQuery = _e[0], setMemberQuery = _e[1];
-    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
-    React.useEffect(function () {
-        var memberListQuery = channel === null || channel === void 0 ? void 0 : channel.createMemberListQuery({
-            operatorFilter: groupChannel.OperatorFilter.NONOPERATOR,
-            limit: 20,
-        });
-        memberListQuery === null || memberListQuery === void 0 ? void 0 : memberListQuery.next().then(function (members) {
-            setMembers(members);
-        });
-        setMemberQuery(memberListQuery !== null && memberListQuery !== void 0 ? memberListQuery : null);
-    }, []);
-    var selectedCount = Object.keys(selectedMembers).filter(function (m) { return selectedMembers[m]; }).length;
-    return (React.createElement("div", null,
-        React.createElement(ui_Modal.Modal, { isFullScreenOnMobile: true, type: ui_Button.ButtonTypes.PRIMARY, submitText: stringSet.CHANNEL_SETTING__OPERATORS__ADD_BUTTON, onCancel: onCancel, onSubmit: function () {
-                var members = Object.keys(selectedMembers).filter(function (m) { return selectedMembers[m]; });
-                channel === null || channel === void 0 ? void 0 : channel.addOperators(members).then(function () {
-                    onSubmit(members);
-                });
-            }, titleText: stringSet.CHANNEL_SETTING__MEMBERS__SELECT_TITLE },
-            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-members__popup-scroll", onScroll: index.useOnScrollPositionChangeDetector({
-                    onReachedBottom: function () { return _tslib.__awaiter(_this, void 0, void 0, function () {
-                        var hasNext;
-                        return _tslib.__generator(this, function (_a) {
-                            hasNext = memberQuery.hasNext;
-                            if (hasNext) {
-                                memberQuery.next().then(function (o) {
-                                    setMembers(_tslib.__spreadArray(_tslib.__spreadArray([], members, true), o, true));
-                                });
-                            }
-                            return [2 /*return*/];
-                        });
-                    }); },
-                }) }, members.map(function (member) { return (React.createElement(React.Fragment, { key: member.userId }, renderUserListItem({
-                user: member,
-                checkBox: true,
-                checked: selectedMembers[member.userId],
-                disabled: (member === null || member === void 0 ? void 0 : member.role) === 'operator',
-                onChange: function (event) {
-                    var _a;
-                    var modifiedSelectedMembers = _tslib.__assign(_tslib.__assign({}, selectedMembers), (_a = {}, _a[event.target.id] = event.target.checked, _a));
-                    if (!event.target.checked) {
-                        delete modifiedSelectedMembers[event.target.id];
-                    }
-                    setSelectedMembers(modifiedSelectedMembers);
-                },
-            }))); })))));
-}
-
-var OperatorList = function (_a) {
-    var _b = _a.renderUserListItem, renderUserListItem = _b === void 0 ? function (props) { return React.createElement(ui_UserListItem.UserListItem, _tslib.__assign({}, props)); } : _b;
-    var _c = React.useState([]), operators = _c[0], setOperators = _c[1];
-    var _d = React.useState(false), showMore = _d[0], setShowMore = _d[1];
-    var _e = React.useState(false), showAdd = _e[0], setShowAdd = _e[1];
-    var _f = React.useState(false), hasNext = _f[0], setHasNext = _f[1];
-    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
-    var refreshList = React.useCallback(function () {
-        if (!channel) {
-            setOperators([]);
-            return;
-        }
-        var operatorListQuery = channel === null || channel === void 0 ? void 0 : channel.createOperatorListQuery({ limit: 10 });
-        operatorListQuery.next().then(function (operators) {
-            setOperators(operators);
-            setHasNext(operatorListQuery.hasNext);
-        });
-    }, [channel === null || channel === void 0 ? void 0 : channel.url, channel === null || channel === void 0 ? void 0 : channel.createOperatorListQuery]);
-    React.useEffect(refreshList, [channel === null || channel === void 0 ? void 0 : channel.url]);
-    return (React.createElement(React.Fragment, null,
-        operators.map(function (operator) { return (React.createElement(React.Fragment, { key: operator.userId }, renderUserListItem({
-            user: operator,
-            channel: channel,
-            size: 'small',
-            avatarSize: '24px',
-            renderListItemMenu: function (props) { return (React.createElement(UserListItemMenu.UserListItemMenu, _tslib.__assign({}, props, { 
-                /**
-                 * isOperator:
-                 * The ReturnType of createOperatorListQuery is User[].
-                 * We can't determine if this user is an operator, because User doesn't have a `role` property.
-                 * Therefore, we need to explicitly specify that this user is an operator.
-                */
-                isOperator: true, onToggleOperatorState: function () {
-                    // Limitation to server-side table update delay.
-                    setTimeout(function () {
-                        refreshList();
-                    }, 500);
-                }, renderMenuItems: function (_a) {
-                    var items = _a.items;
-                    return (React.createElement(items.OperatorToggleMenuItem, null));
-                } }))); },
-        }))); }),
-        React.createElement("div", { className: "sendbird-channel-settings-accordion__footer" },
-            React.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
-                    setShowAdd(true);
-                } }, stringSet.CHANNEL_SETTING__OPERATORS__TITLE_ADD),
-            hasNext && (React.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
-                    setShowMore(true);
-                } }, stringSet.CHANNEL_SETTING__OPERATORS__TITLE_ALL))),
-        showMore && (React.createElement(OperatorsModal, { onCancel: function () {
-                setShowMore(false);
-                refreshList();
-            }, renderUserListItem: renderUserListItem })),
-        showAdd && (React.createElement(AddOperatorsModal, { onCancel: function () { return setShowAdd(false); }, onSubmit: function () {
-                /**
-                 * Limitation to server-side table update delay.
-                 */
-                setTimeout(function () {
-                    refreshList();
-                }, 500);
-                setShowAdd(false);
-            }, renderUserListItem: renderUserListItem }))));
-};
-
-function BannedUsersModal(_a) {
-    var _this = this;
-    var onCancel = _a.onCancel, _b = _a.renderUserListItem, renderUserListItem = _b === void 0 ? function (props) { return React.createElement(ui_UserListItem.UserListItem, _tslib.__assign({}, props)); } : _b;
-    var _c = React.useState([]), members = _c[0], setMembers = _c[1];
-    var _d = React.useState(null), memberQuery = _d[0], setMemberQuery = _d[1];
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
-    var stringSet = LocalizationContext.useLocalization().stringSet;
-    React.useEffect(function () {
-        var bannedUserListQuery = channel === null || channel === void 0 ? void 0 : channel.createBannedUserListQuery();
-        if (bannedUserListQuery) {
-            bannedUserListQuery.next().then(function (users) {
-                setMembers(users);
-            });
-            setMemberQuery(bannedUserListQuery);
-        }
-    }, []);
-    return (React.createElement("div", null,
-        React.createElement(ui_Modal.Modal, { isFullScreenOnMobile: true, hideFooter: true, onCancel: function () { return onCancel(); }, onSubmit: utils.noop, titleText: stringSet.CHANNEL_SETTING__BANNED_MEMBERS__TITLE },
-            React.createElement("div", { className: "sendbird-more-members__popup-scroll", onScroll: index.useOnScrollPositionChangeDetector({
-                    onReachedBottom: function () { return _tslib.__awaiter(_this, void 0, void 0, function () {
-                        var hasNext;
-                        return _tslib.__generator(this, function (_a) {
-                            if (!memberQuery)
-                                return [2 /*return*/];
-                            hasNext = memberQuery.hasNext;
-                            if (hasNext) {
-                                memberQuery.next().then(function (o) {
-                                    setMembers(_tslib.__spreadArray(_tslib.__spreadArray([], members, true), o, true));
-                                });
-                            }
-                            return [2 /*return*/];
-                        });
-                    }); },
-                }) }, members.map(function (member) { return (renderUserListItem({
-                user: member,
-                channel: channel,
-                renderListItemMenu: function (props) { return (React.createElement(UserListItemMenu.UserListItemMenu, _tslib.__assign({}, props, { isBanned: true, onToggleBanState: function () {
-                        setMembers(members.filter(function (m) {
-                            return (m.userId !== member.userId);
-                        }));
-                    }, renderMenuItems: function (_a) {
-                        var items = _a.items;
-                        return React.createElement(items.BanToggleMenuItem, null);
-                    } }))); },
-            })); })))));
-}
-
-var BannedUserList = function (_a) {
-    var _b = _a.renderUserListItem, renderUserListItem = _b === void 0 ? function (props) { return React.createElement(ui_UserListItem.UserListItem, _tslib.__assign({}, props)); } : _b;
-    var _c = React.useState([]), members = _c[0], setMembers = _c[1];
-    var _d = React.useState(false), hasNext = _d[0], setHasNext = _d[1];
-    var _e = React.useState(false), showModal = _e[0], setShowModal = _e[1];
-    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
-    var refreshList = React.useCallback(function () {
-        if (!channel) {
-            setMembers([]);
-            return;
-        }
-        var bannedUserListQuery = channel === null || channel === void 0 ? void 0 : channel.createBannedUserListQuery({ limit: 10 });
-        bannedUserListQuery.next().then(function (users) {
-            setMembers(users);
-            setHasNext(bannedUserListQuery.hasNext);
-        });
-    }, [channel === null || channel === void 0 ? void 0 : channel.url, channel === null || channel === void 0 ? void 0 : channel.createBannedUserListQuery]);
-    React.useEffect(refreshList, [channel === null || channel === void 0 ? void 0 : channel.url]);
-    return (React.createElement(React.Fragment, null,
-        members.map(function (member) { return (React.createElement(React.Fragment, { key: member.userId }, renderUserListItem({
-            user: member,
-            channel: channel,
-            size: 'small',
-            avatarSize: '24px',
-            renderListItemMenu: function (props) { return (React.createElement(UserListItemMenu.UserListItemMenu, _tslib.__assign({}, props, { isBanned: true, onToggleBanState: function () { return refreshList(); }, renderMenuItems: function (_a) {
-                    var items = _a.items;
-                    return (React.createElement(items.BanToggleMenuItem, null));
-                } }))); },
-        }))); }),
-        members && members.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.CHANNEL_SETTING__MODERATION__EMPTY_BAN)),
-        hasNext && (React.createElement("div", { className: "sendbird-channel-settings-accordion__footer" },
-            React.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
-                    setShowModal(true);
-                } }, stringSet.CHANNEL_SETTING__MODERATION__ALL_BAN))),
-        showModal && (React.createElement(BannedUsersModal, { onCancel: function () {
-                setShowModal(false);
-                refreshList();
-            }, renderUserListItem: renderUserListItem }))));
-};
-
-var MutedMemberList = function (_a) {
-    var _b = _a.renderUserListItem, renderUserListItem = _b === void 0 ? function (props) { return React.createElement(ui_UserListItem.UserListItem, _tslib.__assign({}, props)); } : _b;
-    var _c = React.useState([]), members = _c[0], setMembers = _c[1];
-    var _d = React.useState(false), hasNext = _d[0], setHasNext = _d[1];
-    var _e = React.useState(false), showModal = _e[0], setShowModal = _e[1];
-    var stringSet = LocalizationContext.useLocalization().stringSet;
-    var channel = ChannelSettings_context.useChannelSettingsContext().channel;
-    var refreshList = React.useCallback(function () {
-        if (!channel) {
-            setMembers([]);
-            return;
-        }
-        var memberUserListQuery = channel === null || channel === void 0 ? void 0 : channel.createMemberListQuery({
-            limit: 10,
-            // @ts-ignore
-            mutedMemberFilter: 'muted',
-        });
-        memberUserListQuery.next().then(function (members) {
-            setMembers(members);
-            setHasNext(memberUserListQuery.hasNext);
-        });
-    }, [channel === null || channel === void 0 ? void 0 : channel.url, channel === null || channel === void 0 ? void 0 : channel.createMemberListQuery]);
-    React.useEffect(refreshList, [channel === null || channel === void 0 ? void 0 : channel.url]);
-    return (React.createElement(React.Fragment, null,
-        members.map(function (member) { return (React.createElement(React.Fragment, { key: member.userId }, renderUserListItem({
-            user: member,
-            channel: channel,
-            size: 'small',
-            avatarSize: '24px',
-            renderListItemMenu: function (props) { return (React.createElement(UserListItemMenu.UserListItemMenu, _tslib.__assign({}, props, { onToggleMuteState: function () {
-                    // Limitation to server-side table update delay.
-                    setTimeout(function () {
-                        refreshList();
-                    }, 500);
-                }, renderMenuItems: function (_a) {
-                    var items = _a.items;
-                    return (React.createElement(items.MuteToggleMenuItem, null));
-                } }))); },
-        }))); }),
-        members && members.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.CHANNEL_SETTING__NO_UNMUTED)),
-        hasNext && (React.createElement("div", { className: "sendbird-channel-settings-accordion__footer" },
-            React.createElement(ui_Button.default, { type: ui_Button.ButtonTypes.SECONDARY, size: ui_Button.ButtonSizes.SMALL, onClick: function () {
-                    setShowModal(true);
-                } }, stringSet.CHANNEL_SETTING__MUTED_MEMBERS__TITLE_ALL))),
-        showModal && (React.createElement(MemberList.MembersModal, { onCancel: function () {
-                setShowModal(false);
-                refreshList();
-            }, renderUserListItem: renderUserListItem }))));
-};
-
-exports.BannedUserList = BannedUserList;
-exports.MutedMemberList = MutedMemberList;
-exports.OperatorList = OperatorList;
-//# sourceMappingURL=bundle-kdFcOc9z.js.map

package/cjs/chunks/bundle-kdFcOc9z.js.map

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

package/cjs/chunks/bundle-rXt3MgU-.js.map

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

package/cjs/chunks/bundle-zDgTxAsN.js.map

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

package/types/modules/App/hooks/useApplyTextDirection.d.ts

@@ -1,13 +0,0 @@
-import { HTMLTextDirection } from '../../../types';
-/**
- * This hook sets the direction (dir) attribute for specified elements.
- *
- * @param {HTMLTextDirection} direction - The direction to set ('ltr' or 'rtl').
- *
- * Note:
- * This is necessary because elements such as modal, emoji reaction list, and dropdown
- * are at the same level as the Sendbird app root element. They need to have the 'dir'
- * attribute set explicitly to ensure proper directionality based on the app's language setting.
- */
-declare const useApplyTextDirection: (direction: HTMLTextDirection) => void;
-export default useApplyTextDirection;